I have a Java Struts2 web application which uses jQuery and ajax.
Source code for the JSPs is given below.
In welcome.jsp, there are three text-fields, one select and one field which is loaded using ajax($.load()).
Clicking on submit button after entering data in welcome.jsp fetches success.jsp. If we click on back button(mapped to history.back()) from success.jsp, we are back to welcome.jsp but data in fields are not loaded properly. All fields before the field which is loaded using ajax retain data in them, but fields after the field which is loaded using ajax do not retain the data.
The above problem occurs in the Firefox browser, but not in Internet Explorer.
Will the jquery address plugin resolve this issue? if so, how do i go about it? The documentation at their site didnot help me much as i am new to jQuery.
I reffered below urls.
https://stackoverflow.com/questions/116446/what-is-the-best-back-button-jquery-plugin
http://www.jquery4u.com/plugins/history-back-button-plugins/
http://www.asual.com/jquery/address/
welcome.jsp
.......................................
<%@taglib uri="/struts-tags" prefix="s"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<!DOCTYPE html>
<html>
<head>
.................................................
<title>Welcome</title>
<sj:head jqueryui="true" debug="true"/>
</head>
<body>
<s:form id="suburbform" name="suburbform" action="sub">
<s:label value="Test Field1"></s:label>
<s:textfield name="field1"></s:textfield>
<br/>
<table>
<tr>
<td><s:label value="Category"></</s:label></td>
<td><s:select name="category" id="categorySelect" list="{'Fruits','Vegetables'}"></s:select>
</td>
</tr>
</table>
<div id="subcategorydiv">
</div>
<script type="text/javascript">
$(document).ready(function(){
$('#categorySelect').change(function(){
var catValue = $(this).val();
$('#subcategorydiv').load("suburb.action#resultdiv",{category:catValue});
});
$('#subcategorydiv').load(
"suburb.action#resultdiv",
{category:"Fruits"});
});
</script>
<s:label value="Test Field2"></s:label>
<s:textfield name="field2"></s:textfield>
<br/>
<s:label value="Test Field3"></s:label>
<s:textfield name="field3"></s:textfield>
<br/>
<s:submit id="sub1"></s:submit>
</s:form>
</body>
</html>
suburbauto.jsp(loaded into subcategorydiv by suburb action)
....................................................
<%@taglib uri="/struts-tags" prefix="s"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<!DOCTYPE html>
<html>
<head>
......................
<title>Welcome</title>
</head>
<body>
<div id="resultdiv">
<s:url id="fruitsurlid" var="fruitsurl" namespace="/autocompleter" action="getfruits">
<s:param name="category" value="%{category}"></s:param>
</s:url>
<s:label value="SubCategory"></s:label>
<sj:autocompleter id="autocompleterId" name="autocompleter1" href="%{fruitsurl}"></sj:autocompleter>
</div>
</body>
</html>
success.jsp
.......................
<%@taglib uri="/struts-tags" prefix="s"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Success</title>
</head>
<body>
Subcategory: <s:property value="autocompleter1"/>
</body>
</html>