Note that there are some explanatory texts on larger screens.

plurals
  1. POUsing jquery selecting radio button when the div container is click
    primarykey
    data
    text
    <p>I wanted to select the radio button rad1, when I click on the flip div and same way rad2 button when I click on flip2 div. Here is the jquery code I used. problem is this code works for the first click event but If keep continuing then radio button will not be selected. What is the wrong with code?</p> <p>HTML :- </p> <pre><code>&lt;div id="flip" style="width:600px;"&gt; &lt;input type="radio" name="rad1" value="stat" id="exprad"&gt; &lt;label for="exprad" &gt;Experience&lt;/label&gt;&lt;br&gt; &lt;/div&gt; &lt;div id="flip2" style="width:600px;&gt; &lt;input type="radio" name="rad2" value="fin-maths" id="perrad"&gt; &lt;label for="perrad"&gt;Personal&lt;/label&gt;&lt;br&gt; &lt;/div&gt; </code></pre> <p>Jquery :- </p> <pre><code>&lt;script &gt; $(document).ready(function(){ $("#flip").click(function(){//when click on flip radio button $('input:radio[name=rad1]:nth(0)').attr('checked',true); $('input:radio[name=rad2]').attr('checked',false); }); }); }); $(document).ready(function(){ $("#flip2").click(function(){ $('input:radio[name=rad2]:nth(1)').attr('checked',true);//select radio button second $('input:radio[name=rad1]').attr('checked',false);//deselect radioi button first }); }); }); &lt;/script&gt; </code></pre> <p>Edited code</p> <pre><code> &lt;script &gt; $(document).ready(function(){ $("#flip").click(function(){//when click on flip radio button $('input:radio[name=rad1]:nth(0)').attr('checked',true); $('input:radio[name=rad2]').attr('checked',false); }); }); $(document).ready(function(){ $("#flip2").click(function(){ $('input:radio[name=rad2]:nth(1)').attr('checked',true);//select radio button second $('input:radio[name=rad1]').attr('checked',false);//deselect radioi button first }); }); &lt;/script&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload