Disable other options (jQuery)

Question

<p><label><input type="radio" name="group1" /> one</label></p>
<p><label><input type="radio" name="group1" /> two</label></p>
<p><label><input type="radio" name="group1" /> three</label></p>

When one of the radio input is selected, I'd like to completely disable others. I tried with the jquery siblings selector but it works only if all selects are in the same parent element.

Thanks for your help

Answer 1

This should work:

$(':radio[name=group1]').change(function() {
    $(':radio[name=group1]:not(:checked)').attr('disabled','disabled');
});​

Example

Or a more dynamic approach:

$(':radio').change(function() {
    var name = $(this).attr('name');
    $(':radio[name='+name+']:not(:checked)').attr('disabled','disabled');
});​

Example