Question

I have two grid views containing 12 and 24 rows resp. Each row contains radiobutton list(Yes/No). Below both the grids, there is one more radio button list. In first grid, all radio buttons are by default “Yes”. If any one selects know, the radio button below the grids should become disabled with selection =”No”. In second grid the radio buttons are by default “No”. If any one selects Yes, the radio button below the grid should become disabled with selected value=”No”. All these work should be done through javascript…

How can I do so…???

Answer 1

First user clicked a button at first grid. Then you capture it and changed the second grid to false. Use EventListener. I used checkbox for this job. Because you cant set more than 1 radio button checked at same time in same form.

<h3>First Grid</h3>
<input id="radio1_1" type="checkbox" name="correctAnswer" value="1">Yes
<input id="radio1_2" type="checkbox" name="correctAnswer" value="2">No
<br>
<h3>Second Grid</h3>    
<input id="radio2_1" type="checkbox" name="correctAnswer" value="1">Yes
<input id="radio2_2" type="checkbox" name="correctAnswer" value="2">No
<br>
<h3 id="h3">Third Grid</h3>
<input id="radio3_1" type="checkbox" name="correctAnswer" value="1">Yes
<input id="radio3_2" type="checkbox" name="correctAnswer" value="2">No

And a jQuery function

$(document).ready(function(){
$('#radio1_2').prop('checked', true);
$('#radio2_2').prop('checked', true);
$('#radio3_2').prop('checked', true);
    $('#radio1_1').click(function(){
        $('#radio2_2').prop('checked', false);
        $('#radio2_2').prop('disabled', true);
    })
    $('#radio2_1').click(function(){
        $('#radio3_2').prop('checked', false);
        $('#radio3_2').prop('disabled', true);
    })    
});

You can find this example at this link