April 20, 2012
Radio button checked value on revisiting the page
Question by Lvcky Mercado
<div class="formfield ship">
<input type="radio" class="ship1" name="1" >1</input>
<input type="radio" class="ship2" name="1" >2</input>
<input type="radio" class="ship3" name="1" >3</input>
<div class="clear"><!-- FLOAT CLEAR --></div>
</div>
I have radio buttons one must have the default value.. when I pick one and submit and then I go back to the page the value must retain..
any idea how can I do it?
Answer by Mikey
this does what you want – although you need to modify your html slightly (I don’t think <input></input>
is valid)
http://jsfiddle.net/malet/dvCpj/6/
$("input[type=radio]").each(function(){
$(this).click(function(){
createCookie($(this).attr("name"), $($(this).siblings()[0]).html(),1);
});
});
$(document).ready(function(){
$("input[type=radio]").each(function(){
var selected = readCookie($(this).attr("name"));
if(selected != null){
if($($(this).siblings()[0]).html() == selected){
$(this).attr("checked","checked");
}
}
});
});
function createCookie(name,value,days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else var expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}
function readCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}
function eraseCookie(name) {
createCookie(name,"",-1);
}
Answer by Starx
Basically there is two way you can do this.
- Cookies
- Server Side Languages like php, asp
But either way, the main point is that, the default values of the radio elements have to be changed. You can use, serverside script to give the new default or use cookies to fetch the new defaults.