Databases
StackOverflow2013
Postsdbo
POinput:radio click function isn't triggering in IE / Firefox
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POinput:radio click function isn't triggering in IE / Firefox
    primarykey
    data
    text
    <p>I have a form with multiple inputs / radio buttons. </p> <p>I also have a series of Yes &amp; No radio buttons. When the "Yes" radio button is checked, I have some data slide down beneath. </p> <p><strong>HTML:</strong></p> <pre><code> &lt;div class="item seperator first clearfix"&gt; &lt;label&gt;test&lt;/label&gt; &lt;div class="radioWrap"&gt; &lt;label class="yes"&gt; &lt;input class="homepageContent" name="homepageContent" type="radio" value="yes" /&gt; &lt;/label&gt; &lt;label class="no"&gt; &lt;input class="homepageContent" name="homepageContent" type="radio" value="no" checked /&gt; &lt;/label&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="extrasInner"&gt; &lt;div class="item clearfix"&gt; &lt;label for="theContent"&gt;Your Content:&lt;/label&gt; &lt;textarea id="theContent" name="theContent"&gt;&lt;/textarea&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="extrasOuter hide clearfix"&gt; &lt;a href="#" class="makeChanges"&gt;Make Changes&lt;/a&gt; &lt;span&gt;Click "Make Changes" to update.&lt;/span&gt; &lt;/div&gt; </code></pre> <p><strong>The jQuery:</strong></p> <pre><code>$("input:radio[name=homepageContent], input:radio[name=addSocialIcons], input:radio[name=addTracking]").click(function() { var value = $(this).val(); if (value == 'yes') { $(this).parent().parent().parent().next().slideDown(); $(this).parent().parent().parent().next().next().slideDown(); } else { $(this).parent().parent().parent().next().slideUp(); $(this).parent().parent().parent().next().next().slideUp(); } }); </code></pre> <p><strong>Question 1)</strong> This works absolutely fine in Google Chrome, but not in Firefox and IE. It doesn't seem to recognise the click function?</p> <p><strong>Solved:</strong> I had a function within one of my files that removes the value from input fields on focus and this was stripping the value of the radio buttons as well in IE / Firefox (but not chrome!). </p> <p><strong>Question 2)</strong> Is my DOM traversing for the slideUp / slideDown an acceptable way of achieving what I'm trying to do? Are there any disadvantages to how I'm doing it and can it be improved?</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. UStctc91
    1. UStctc91
    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.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    3. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POinput:radio click function isn't triggering in IE / Firefox
      1. This table or related slice is empty.
      1. VTUpMod
    1. COThe major disadvantage to your current DOM traversal is that you'll need to change it if you change the structure of your HTML. If, for whatever reason, you add another element between the outer `<div>` and the `<input>` then you'll need to remember to add another call to `.parent()`. Using `.closest()` with an appropriate selector would be better, since it will traverse up the DOM tree until it finds the first element that matches.
      singulars
      1. POinput:radio click function isn't triggering in IE / Firefox
      1. USAnthony Grist
    2. COI've just tried it, and it works (seemingly) from the second click and on :) (IE9/FF 10)
      singulars
      1. POinput:radio click function isn't triggering in IE / Firefox
      1. USdezso
    3. COWorks for me - [jsFiddle](http://jsfiddle.net/anthonygrist/CdpFM/). First click on 'yes' doesn't work because the element is already visible.
      singulars
      1. POinput:radio click function isn't triggering in IE / Firefox
      1. USAnthony Grist
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

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