jQuery:Looping all radio buttons inside an HTML table

Question

I have an HTML table having n rows and each rows contain one radiobutton in the Row.Using jQuery , How can i look thru these radio buttons to check which one is checked ?

Adios

Answer 1

$('#table tbody tr input[type=radio]').each(function(){
 alert($(this).attr('checked'));
});

HTH.

Phocine

#table > tr will choke on certain browsers (chrome/firefox) that like to add their own tbody elements, whereas #table tr won't. – Fucoid

Answer 2

There are many ways to do that, e.g., using .each and the .is traversal method:

$("table tbody tr td input[name=something]:radio").each(function() {
    if($(this).is(":checked")) {
        $(this).closest("tr").css("border", "1px solid red");
    } else {
        // do something else
    }
});

Fucoid

I'll give +1 if you can tell me if it is pretty well guaranteed that all (jQuery supported) browsers will reliably insert a missing <tbody>. – Streptococcus

@patrick - No, that's not the case. Which means that my selector is broken some of the time. Which means I'll edit this answer now. Damn it, but thanks, I should pay more attention to my own answers in the future :) – Fucoid

Answer 3

To loop through all the radio checked radio buttons, you can also do this:

$('input:radio:checked').each(function() {
    //this loops through all checked radio buttons
    //you can use the radio button using $(this)
});

Probation

Answer 4

$('.my-radio-class:checked')

http://api.jquery.com/checked-selector/

Allowable

Answer 5

Do you want to process every radio button or do you only need the checked ones? If the latter, it is quite easy:

$('table input:radio:checked')

Reference: :radio, :checked

Hygro

+1. Afaik jQuery's look-up goes from right to left, so the whole thead tr td is unnecessary if the only condition is that they need to be in a table. And :radio and :checked are the most ‘elegant’ selectors in this case. – Loewe

Answer 6

var checked = $('#table :radio:checked');

Jewett

Answer 7

$("table tr input[type=radio]:checked");

Kilah

Answer 8

//get the checked radio input, put more specificity in the selector if needed
var $checkedRadio = $("input[type=radio]:checked");

//if you want the value of the checked radio...
var checkedRadioVal = $checkedRadio.val();

Mark