Control radio button group using checkbox?
I have one checkbox and four radio buttons.Initially if user select checkbox dynamically first radio button get checked and also display value.After that all radio buttons switch with each other and display value.Whatever radio buttons checked get uncheck ,If user unselect the checkbox.
This work like parent and child relation,checkbox as parent and radio buttons as child.
My code is working but the problem is that,if dynamically particulate radio button is selected then it will not unselect and switch between with others.
HTML Code:
<ul id="builtup" class="list-unstyled">
<li><input type="checkbox" id="ck" name="layer1" value="chk">Built-up Area</li>
<li><input type="radio" id="bb1" name="layer1" value="1975" checked="" disabled="">1975</li> <li><input type="radio" id="bb2" name="layer1" value="1990">1990</li>
<li><input type="radio" id="bb3" name="layer1" value="2000">2000</li>
<li><input type="radio" id="bb4" name="layer1" value="2014">2014</li></ul>
JQuery:
$('#builtup input').change(function(){
var layer=$(this).val();
var cRad=$("#ck");
builtup.forEach(function(e){
var n=e.get('name');
if(cRad.is(':checked'))
{
if(n==1975)
{
$('input[type="radio"]').attr('checked',true);
e.setVisible(n==1975);
}
else
{
e.setVisible(n==layer);
$('input[type="radio"]').attr('checked',true);
}
}
else
{
e.setVisible(false);
$('input[type="radio"]').attr('checked',false);
}
});
});
Thanks.