if i have 3 html pages as follows:
home.html:
<form method="get">
<input class="someForm" type="radio" value="1" name="someForm" /> Name
<input class="someForm" type="radio" value="2" name="someForm" /> Email
<div id="container"></div>
<input type="submit" />
</form>
<script type="text/javascript" src="jquery.js"></script>
<script>
var ajaxResponse = new Object();
$(document).ready(function () {
$('.someForm').click(function () {
var rbVal = $(this).val();
var myContent;
if (ajaxResponse[rbVal]) { //in cache
myContent = ajaxResponse[rbVal];
$("#container").html(myContent);
}
else { // not in cache
var urlForAjaxCall = "file" + rbVal + ".html";
$.get(urlForAjaxCall, function (myContent) {
ajaxResponse[rbVal] = myContent;
$("#container").html(myContent);
});
}
});
});
</script>
file1.html:
Name: <input type="text" name="1" value="myName" />
file2.html:
Email: <input type="text" name="2" value="
[email protected]" />
what i want to do is that when i write something in one of the textboxes and then click whichever radio button in home.html, the value attribute should be changed to the new value, any idea on how to do that?
tia
