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

Question

Прежде всего позвольте мне поблагодарить всех вас за ваши удивительные усилия и помощь до сих пор. Теперь на вопрос.

У меня есть пять флажков, и по крайней мере один из пяти должен быть проверен для проверки по мере необходимости.

Я видел несколько способов, как это сделать, но я не могу заставить их работать.

Solve One Solve Two

Теперь я использую как плагин проверки и плагин метаданных. Как я могу легко сказать, проверяется ли один флажок с классом required_group? Остальное больше не требуется? Я также дал все флажки class="required"

Как всегда Спасибо в Advance!

Редактировать: Приносим извинения за неправильное формулирование вопроса. Я бы использовал переключатели или кнопки выбора, поскольку это довольно просто, но мне предлагается использовать флажки. Еще раз спасибо за ваше время и извините за путаницу.

ОКОНЧАТЕЛЬНЫЙ ИЗОБРАЖЕНИЕ Так вот как я сделал это на случай, если кому-либо еще понадобится.

jQuery.validator.addMethod('ClassAppliedToCheckBoxes', function(value, element, checked) { 
      var $module = $(element).parents('.YourContainerClass'); 
      return $module.find('input:checked').length; 
      }); 

      jQuery.validator.addClassRules("ClassAppliedToCheckBoxes", { 
        'ClassAppliedToCheckBoxes' : true 
      }); 

      jQuery.validator.messages.required_group = 'Please check at least one of these fields.'; 

Answer 1

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

Пример:

I am a:<br/> 
<input type="radio" id="age_old" name="age" value="old"> 
    <label for="age_old">Oldtimer</label><br/> 
<input type="radio" id="age_mid" name="age" value="mid" checked> 
    <label for="age_mid">Middle-aged</label><br/> 
<input type="radio" id="age_young" name="age" value="young"> 
    <label for="age_young">Youth</label><br/> 

Bonus: нет JavaScript не требуется - все простой HTML. Если вам нужна возможность ничего не выбрать, просто добавьте еще один ящик радио с пустым значением:

<input type="radio" id="age_no" name="age" value=""> 
    <label for="age_no">...not telling!</label><br/> 

UPDATE: Было отмечено, что это не то, что речь идет о. Если это так, и другое чтение (необходимо хотя бы один флажок установить), игнорируйте это.

Answer 2

попробовать что-то вроде этого:

var $invalid = $(":checkbox.required").filter(function() { 
    var n = this.name; 
    return $(":checkbox[name='" + n "']:checked").length == 0; 
}); 

Оттуда, вы могли бы сделать несколько вещей. Чтобы прекратить отправку формы, проверьте, больше ли она длины (если это так, некоторые недопустимые). Для того, чтобы выделить недопустимых:

$invalid.parent().css({ color: '#f00' }); 

Обратите внимание, что это не очень эффективный алгоритм: он выполняет проверку на одной и той же группе, столько раз, сколько есть флажков. Если это узкое место, то есть место, которое вы можете улучшить, но в любом случае это будет хорошей отправной точкой.

Answer 3

Я согласен с Amadan в том, что флажки не подходят. Флажки для множественного выбора.Если вы хотите, чтобы сделать форму доступной, а затем сделать его SELECT:

<label for="myselect">Choose type of house</label> 

<select name="myselect" id="myselect" class="required"> 
    <option value="1">Option 1 Text</option> 
    <option value="2">Option 2 Text</option> 
    <option value="3">Option 3 Text</option> 
    <option value="4">Option 4 Text</option> 
    <option value="5">Option 5 Text</option> 
</select> 

Это сделает вашу форму добрее к людям, которые переходит его чтения с экрана. Radio buttons causes some issues для людей, которые просматривают формы.