плагин Проверки jQuery: группы флажков и проблемы сообщения об ошибке

Я соединил форму с помощью плагина Проверки jQuery, и все исходные данные соглашаются с рабочей проверкой и сообщениями об ошибках – за исключением флажков. У меня есть две проблемы флажка.

Прежде всего, плагин Проверки, API, кажется, не обрабатывает флажки в сгруппированных контекстах (я использую fieldsets для группировки). Найденный несколькими подходами к проблеме здесь, включая ссылку на сообщение Rebecca Murphey для более общего случая с помощью пользовательского метода и класса. Адаптация этого к этой ситуации:

jQuery.validator.addMethod('required_group', function(val, el) {
        var fieldParent = $(el).closest('fieldset');
        return fieldParent.find('.required_group:checked').length;
});

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

jQuery.validator.messages.required_group = 'Please check at least one box.';

Этот вид работ, но производит сообщения об ошибках на каждом флажке и только удаляет их, поскольку каждое поле нажато. Это не приемлемая ситуация для пользователя, который может только избавиться от них путем нажатия на ложные положительные стороны. Идеально, я предполагаю то, что необходимо, что-то, чтобы предотвратить или устранить дополнительные сообщения, прежде чем они будут отображены и будут использовать errorPlacement для отображения единственного сообщения об ошибке в родителе fieldset, который был бы затем удален с щелчком по любому флажку. Менее идеально возможно, они все отобразились бы, но обработчик событий мог выключить полный набор избыточных сообщений щелчком, который является тем, что этот подход, предлагаемый tvanfosson, кажется, делает. (Другой специализированный подход здесь, но я не мог заставить это работать.) Я предполагаю, что должен также отметить, что эта форма требует, чтобы флажки имели различные имена.

Моя вторая проблема состоит в том, что один из fieldsets с флажками в форме также содержит вложенный fieldset флажков под одним из внешних флажков. Таким образом в дополнение к one-box-checked требованию первого уровня, если конкретный флажок, содержащий флажки второго уровня, проверяется, то по крайней мере один из флажков второго уровня должен быть установлен. Не уверенный в правильном подходе; я предполагаю, какие потребности произойти (в соответствии с вышеупомянутой схемой) то, что триггерный флажок использовал бы toggleClass для добавления/удаления 'required_group' класса ко всем флажкам в подполе, которое будет затем (надо надеяться), вести себя то же как родительское поле:

$("#triggerCheckbox").click(function () {
  $(this).find(":checkbox").toggleClass("required_group");
});

Любые предложения или приветствующиеся идеи. Я далеко за пределами своих ограниченных навыков jQuery на этом и был бы рад услышать, что я пропустил простые, изящные и/или очевидные способы сделать это!

7
задан Community 23 May 2017 в 10:32
поделиться

1 ответ

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

Вот общая идея, которая может решить вашу проблему "одна ошибка на флажок":

//for each fieldset, attach a new rule to the first checkbox
$('fieldset input[type="checkbox"]:first').each(function(i,v){
    $(v).rules('add', {
         required: "fieldset input[type="checkbox"]:unchecked"
    });
});

Чтобы сделать что-то вменяемое с ошибками валидации, реализуйте свою собственную функцию showErrors. Здесь простота моего случая, вероятно, не сильно вам поможет - мне не нужно было беспокоиться о том, были ли ошибки в группе чекбоксов или нет, в моей форме, если бы были любые ошибки, была бы та же проблема - по крайней мере, один чекбокс не был проверен на поле. Для вас, я думаю, нужно покопаться в функции Validate плагина defaultShowErrors (в источнике), чтобы понять, что делать с errorMap и errorList.

$('#myForm').validate({
   ...
   showErrors: function(map,list){
       if (this.numberofInvalids()){
           $('#form_errors').html('You much choose at least one Checkbox per group');
       } else {
           this.defaultShowErrors();
       }
   }
 });

Что касается второй части вашего вопроса, я полагаю, что правило 'depends' - это то, что вы ищете. Поэтому нет необходимости добавлять классы, просто правило для подгруппы должно зависеть от того, установлен ли родительский флажок (см. почти идеальный пример в документации по методу rules).

2
ответ дан 7 December 2019 в 18:42
поделиться
Другие вопросы по тегам:

Похожие вопросы: