2009-08-26 5 views
2

Я работаю над длинной формой, содержащей несколько групп переключателей.jQuery Выбрать все Группа радиокнопки

Внизу есть радиокнопка «No All». Когда он выбран, я хотел бы сделать так, чтобы все переключатели «N» были выбраны, но я не могу заставить его работать. Вот упрощенная версия кода:

JQuery:

$(document).ready(function(){ 
//initially hide the Remove All Questions 
$("div.#removeAllquest").hide(); 

//////////// Show Remove All Questions if radio button selected 
$("input.#RemoveAll").click(function() { 
    if ($(this).is(':checked')) 
    $("input:radio [class*='radioR']").attr("checked",true); 
    else 
$("input:radio [class*='radioR']").attr("checked",false); 
}); 

});

Форма:

<table> 
    <tr> 
    <td>Y<input type="radio" name="row1" value="row1col1" class="q123col1"></td> 
    <td>N<input type="radio" name="row1" class="radioR" value="row1col2"></td> 
    <td>M<input type="radio" name="row1" value="row1col3" class="q123col3"></td> 
    </tr> 
    <tr> 
    <td>Y<input type="radio" name="row2" value="row2col1" class="q123col1"></td> 
    <td>N<input type="radio" name="row2" class="radioR" value="row2col2"></td> 
    <td>M<input type="radio" name="row2" value="row2col3" class="q123col3"></td> 
    </tr> 
    <tr> 
    <td>Y<input type="radio" name="row3" value="row3col1" class="q123col1"></td> 
    <td>N<input type="radio" name="row3" class="radioR" value="row3col2"></td> 
    <td>M<input type="radio" name="row3" value="row3col3" class="q123col3"></td> 
    </tr> 
    <tr> 
    <td colspan="2">No All </td> 
    <td> 
     <input name="RemoveAll" id="RemoveAll" type="radio" value="Y"> 
    </td> 
    </tr> 
</table> 

Что я делаю неправильно?

ответ

11

Оба они должны работать - с первым я попытался сохранить ваш стиль. Со вторым я немного изменил стиль. С вашим образцом на самом деле нет способа снять отметку с них, как только они будут проверены.

$("input.#RemoveAll").click(function() { 
    if ($(this).is(':checked')) 
     $("input:radio.radioR").attr("checked", "checked"); 
    else 
     $("input:radio.radioR").removeAttr("checked"); 
}); 

$("#RemoveAll").click(function() { 
    if ($(this).is(':checked')) 
     $(".radioR").attr("checked", "checked"); 
    else 
     $(".radioR").removeAttr("checked"); 
}); 
+0

Спасибо Энди !!! Я использовал ваш первый вариант, и он работал как чемпион. Я хотел бы снять галочку с переключателя ... но мне потребовалось столько времени, чтобы зайти так далеко, я подумал, что сейчас немного над моей головой :) – Chnikki

+0

Я не думаю, что вам действительно нужно удалить атрибут «checked» так как вы можете выбрать только один выбор переключателя в любой момент, но остальная часть вашего кода выглядит хорошо. –

1

Во-первых, насколько я знаю, проверено, только принимает значение checked в качестве допустимого значения в XHTML. Так что-то вроде следующей должно сделать трюк

$("#RemoveAll").change(function() { 
    if ($(this).is(':checked')) 
      $("input:radio.radioR").attr("checked","checked"); 

    else 
      $("input:radio.radioR").removeAttr("checked"); 
    }); 
}); 

Примечания изменения селектора для Удалите всю радиокнопку как добавление элемента ввода фильтра не действительно необходимы, так как $ («# ID») называют document.getElementById ,

1

Это должно делать то, что вам нужно ...

$("input.#RemoveAll").click(function() { 

    if ($(this).attr('checked') === "checked"){ 

    $("input:radio[class*='radioR']").attr("checked","checked"); 

    }else{ 

    $("input:radio[class*='radioR']").removeAttr("checked"); 

    } 
}); 

надеюсь, что это помогает, Синана.