Radio Buttons "Checked" Attribute Not Working
Solution 1:
If you have multiple of the same name with the checked attribute it will take the last checked radio on the page.
<form>
<label>Do you want to accept American Express?</label>
Yes<input id="amex" style="width: 20px;" type="radio" name="Contact0_AmericanExpress" />
maybe<input id="amex" style="width: 20px;" type="radio" name="Contact0_AmericanExpress" checked="checked" />
No<input style="width: 20px;" type="radio" name="Contact0_AmericanExpress" class="check" checked="checked" />
</form>
Solution 2:
Radio inputs must be inside of a form for 'checked' to work.
Solution 3:
This might be it:
Is there a bug with radio buttons in jQuery 1.9.1?
In short: Don't use attr() but prop() for checking radio buttons. God I hate JS...
Solution 4:
The ultimate JavaScript workaround to this annoying issue -
Simply wrap the jQuery command in a setTimeout
. The interval can be extremely small, I use 10
milliseconds and it seems to be working great. The delay is so small that it is virtually undetectable to the end users.
setTimeout(function(){
$("#radio-element").attr('checked','checked');
},10);
This will also work with
$("#radio-element").trigger('click');
$("#radio-element").attr('checked',true);
$("#radio-element").attr('checked',ANYTHING_THAT_IS_NOT_FALSE);
Hacky...hacky...hacky...hacky... Yes I know... hence this is a workaround....
Solution 5:
Hey I was also facing similar problem, in an ajax generated page.. I took generated source using Webdeveloper pluggin in FF, and checked all the inputs in the form and found out that there was another checkbox inside a hidden div(display:none) with same ID, Once I changed the id of second checkbox, it started working.. You can also try that.. and let me know the result.. cheers