Databases
StackOverflow2013
Postsdbo
POjQuery and If statement to de-select radio buttons
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery and If statement to de-select radio buttons
    text
    copied!<p>Well, I'm stuck and have been banging my head for a little while now to try to figure what I'm doing wrong.</p> <p>Scenario:</p> <p>I have a question with a Yes/No answer (ie 2 radio buttons). When a user selects the either Yes or No, I call a function to .toggle() a hidden div to show a link. That works great. And if they go back and check that Yes/No again it disappears again due to the .toggle()</p> <p>My issue is that if a user clicks the No (and the link is shown) but then clicks the Yes I want the link that is showing due to the No result to disappear and vice-versa.</p> <p>So basically only show 1 link at a time.</p> <p>I figured that maybe an If statement would work but I can't seem to get it right.</p> <p>My code:</p> <pre><code>&lt;div id="Question1"&gt; &lt;div&gt;Do you kazoo?&lt;/div&gt; &lt;input type="radio" ID="Q1RB1" runat="server" value="Yes" text="Yes" name="RadioGroup1"/&gt;Yes&lt;br /&gt; &lt;input type="radio" ID="Q1RB2" runat="server" value="No" text="No" name="RadioGroup1"/&gt; No &lt;span id="Q1RB1Results" style="display:none"&gt;&amp;nbsp; &amp;nbsp; &lt;a href=#&gt;Click here&lt;/a&gt;&lt;/span&gt; &lt;span id="Q1RB2Results" style="display:none"&gt;&amp;nbsp; &amp;nbsp; &lt;a href=#&gt;Click here&lt;/a&gt;&lt;/span&gt; &lt;/div&gt; </code></pre> <p>My jQuery code that works for each individual radio button:</p> <pre><code> $("input[id$=Q1RB1]:radio").change(function () { $("[id$=Q1RB1Results]").toggle(); }); $("input[id$=Q1RB2]:radio").change(function () { $("[id$=Q1RB2Results]").toggle(); }); </code></pre> <p>This is the If statement I'm trying to get to work. Amy I going about this the wrong way?</p> <pre><code> if ($("input[id$=Q1RB2]").is(":checked")) { $("input[id$=Q1RB2]:radio").change(function () { $("[id$=Q1RB2Results]").toggle(); }); }); </code></pre> <p>Thanks for any thoughts/advice. I've tried a multitude of answers here in Stackoverflow and the 'net but can't seem to figure out what I'm doing wrong. :(<br> ~V</p> <p><strong>Update: I put a sample form and the dialogue up on JSFiddle. <a href="http://jsfiddle.net/Valien/7uN6z/4/" rel="nofollow">http://jsfiddle.net/Valien/7uN6z/4/</a></strong> I tried some of the solutions mentioned here and couldn't get them working so not sure what I'm doing wrong.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

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