StackOverflow_17207601: issues-in-reset-radio-button-and-checking
Illustration of answer to http://stackoverflow.com/questions/17207601/issues-in-reset-radio-button-and-checking.
by ExpertSystem
HTML
<table cellpadding="0" cellspacing="0" border="1">
<tr>
<td>
1)
</td>
<td>
<input type="radio" name="rdoSample" value="a" checked="checked" />
a
<input type="radio" name="rdoSample" value="b" />
b
<input type="radio" name="rdoSample" value="c" />
c
</td>
<td>
<input type="button" value="Check Option 1" id="btnCheck1" />
<input type="button" value="Check Option 2" id="btnCheck2" />
<input type="button" value="Check Option 3" id="btnCheck3" />
</td>
</tr>
<tr>
<td>
2)
</td>
<td>
<input type="radio" name="rdoSample1" value="11" checked="checked" />
11
<input type="radio" name="rdoSample1" value="22" />
22
<input type="radio" name="rdoSample1" value="33" />
33
</td>
</tr>
<tr>
<td colspan="3" align="center">
<input type="button" value="Reset" id="btnReset" />
</td>
</tr>
</table>
JavaScript
function checkRadio(name, value) {
$("input[name=" + name + "]"
+ "[value=" + value + "]").prop(
"checked", true);
}
$(document).ready(function() {
$("#btnReset").click(function() {
$("input[type=radio]").prop(
"checked", function() {
return this.getAttribute("checked")
== "checked";
});
});
$("#btnCheck1").click(function() {
checkRadio("rdoSample", "a");
});
$('#btnCheck2').click(function() {
checkRadio("rdoSample", "b");
});
$('#btnCheck3').click(function() {
checkRadio("rdoSample", "c");
});
});