2013-12-16 2 views
0

Как проверить несколько переключателей. Все эти переключатели генерировались динамически.Как проверить несколько переключателей

<input type="radio" name="answer_option1" value="1" id="ans_options1" /> 
<input type="radio" name="answer_option1" value="2" id="ans_options2" /> 
<input type="radio" name="answer_option1" value="3" id="ans_options3" /> 
<input type="radio" name="answer_option1" value="4" id="ans_options4" /> 

<input type="radio" name="answer_option2" value="5" id="ans_options5" /> 
<input type="radio" name="answer_option2" value="6" id="ans_options6" /> 
<input type="radio" name="answer_option2" value="7" id="ans_options7" /> 
<input type="radio" name="answer_option2" value="8" id="ans_options8" /> 

<input type="radio" name="answer_option3" value="9" id="ans_options9" /> 
<input type="radio" name="answer_option3" value="10" id="ans_options10" /> 
<input type="radio" name="answer_option3" value="11" id="ans_options11" /> 
<input type="radio" name="answer_option3" value="12" id="ans_options12" /> 

<input type="radio" name="answer_option4" value="13" id="ans_options13" /> 
<input type="radio" name="answer_option4" value="14" id="ans_options14" /> 
<input type="radio" name="answer_option4" value="15" id="ans_options15" /> 
<input type="radio" name="answer_option4" value="16" id="ans_options16" /> 
+0

означает, что вы хотите проверить, если выбрана кнопка радио? – Kiyarash

+0

да @Kiyarash .. – Nitin

ответ

9

Попробуйте http://jsfiddle.net/aamir/r9qR2/

Поскольку каждая группа имеет различное имя атрибут, так что вы должны сделать проверку для каждого набора переключателей.

if($('input[name="answer_option1"]:checked').length === 0) { 
    alert('Please select one option'); 
} 

Если у вас есть неограниченное количество групп. Попробуйте http://jsfiddle.net/aamir/r9qR2/2/

//Make groups 
    var names = [] 
    $('input:radio').each(function() { 
     var rname = $(this).attr('name'); 
     if ($.inArray(rname, names) == -1) names.push(rname); 
    }); 

    //do validation for each group 
    $.each(names, function (i, name) { 
     if ($('input[name="' + name + '"]:checked').length == 0) { 
      console.log('Please check ' + name); 
     } 
    }); 

Если вы хотите, чтобы показать только 1 ошибку для всех групп. Попробуйте http://jsfiddle.net/aamir/r9qR2/4/

+0

более 50 групп. – Nitin

+0

hummm Позвольте мне попробовать что-то еще: P –

+0

Теперь он будет проверять все группы без матер сколько –

0

попробовать эту новую скрипку http://jsfiddle.net/Hgpa9/3/

$(document).on("click","#validate", function() { 
var names = []; 

    $('input[type="radio"]').each(function() { 
     // Creates an array with the names of all the different checkbox group. 
     names[$(this).attr('name')] = true; 
    }); 

    // Goes through all the names and make sure there's at least one checked. 
    for (name in names) { 
     var radio_buttons = $("input[name='" + name + "']"); 
     if (radio_buttons.filter(':checked').length == 0) { 
      alert('none checked in ' + name); 
     } 
     else { 
      // If you need to use the result you can do so without 
      // another (costly) jQuery selector call: 
      var val = radio_buttons.val(); 
     } 
    } 
}); 
+0

Вы выбираете 1 радиокнопку из первой группы. Вы не выбираете ничего из других групп, и этот код недействителен. –

+0

попробуйте эту новую скрипку. http://jsfiddle.net/Hgpa9/3/ Я обновил код для нескольких групп. –

+0

Спасибо @Milanb. Его рабочий :) – Nitin

0
var names = [] 
$('input[name^="answer_option"]').each(function() { 
    var rname = $(this).attr('name'); 
    if ($.inArray(rname, names) == -1) names.push(rname); 
}); 

$.each(names, function (i, name) { 
    if ($('input[name="' + name + '"]:checked').length == 0) { 
     console.log('Please check ' + name); 
    } 
}); 
+0

CSS3 не поддерживает IE8 – Balachandran

Смежные вопросы