CODEWITHSUNDEEP
jquery
Matthew Colley
Matthew Colley

Reputation: 11466

jQuery creating radio buttons dynamically and attributes

I am using smarty and creating a dynamic html table that has radio buttons for each selection. When I select a radio button, I would like a hidden row (with a comments text area) to show beneath the what I had just selected as that radio button. When I run the following code, it will show a rows beneath every radio button, instead of the one i just selected:

Smarty radio buttons:

<tr>
  <td>
    <input 
       type="radio" 
       name="refund_selected" 
       id="refund_selected" 
       value="{smartydynamictag}" />
  </td>
</tr>

Hidden row of comments:

<tr id="refund_comments" style="display: none;">
  <th colspan="6">Test Here</th>
</tr>

My jQuery:

$("input[name=refund_selected]").click(function() { 
    if ($("input[name=refund_selected]").attr('checked')) {
        $("tr#refund_comments").show(); 
    }
});

Upvotes: 0

Views: 430

Answers (2)

Pavel Staselun
Pavel Staselun

Reputation: 2010

Try refering THIS as you want to check only the radio you just checked

$("input[name=refund_selected]").click(function() { 
  if ($(this).is(':checked')) {
    $("tr#refund_comments").show(); 
  }});
});

Upvotes: 0

wanovak
wanovak

Reputation: 6127

I'm making an educated guess here as to how your markup is organized, but this may work:

$("input[name=refund_selected]").click(function() { 
        if ($("input[name=refund_selected]").attr('checked')) {
            $(this).parent().parent().next('#refund_comments').show(); 
        }
});

Also, do you have multiple of the same ID? Because the above code modification shouldn't even be necessary; you're not allowed to duplicate IDs.

Upvotes: 1

Related Questions