Блог

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

Чтобы проиллюстрировать это:

У меня есть город, штат и почтовый индекс (в таком порядке). Если кто-то вводит значение для zip, он должен получить положительное подтверждение (у меня эта часть работает с зеленой галочкой у ввода), однако, пока либо состояние, либо zip пусты, сообщение о проверке группы все равно должно отображаться.

При различных попытках я столкнулся со следующими проблемами: — Пользователь пропускает «город», и отображается проверка сообщения, но затем, когда вводится «zip», сообщение о проверке исчезает. (это странно … может быть, ошибка? ) — Пользователь вводит «город», и они получают сообщение об ошибке группы, прежде чем они даже смогут ввести «состояние» — Пользователь вводит «город», но не получит галочку, потому что другие входные данные в группе пусты

Я склоняюсь к решению этой проблемы, перезаписывая событие «onfocusout» (проверяя все входные данные в группе при focusout), но не уверен, есть ли лучший способ с помощью некоторых встроенных методов validate

Спасибо!

* ОБНОВЛЕНИЕ

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

Может быть, проверка группы зависит от результата проверки последнего теста в группе?

В любом случае … вот беспорядок, с которым я столкнулся до сих пор:

Установите группу:

 groups : { location : 'city state zip' }
  

Создайте правило для группы (обратите внимание, что это должен быть массив для сохранения порядка):

 rules : { location : ['city, 'state', 'zip']}
  

Теперь переопределите onfocusout:

     onfocusout : function(el) {
        var groups = this.groups
            , elName = el.name
            , elGroup = groups[elName]
            , $el = $(el)

        if (!this.checkable(el) ){
            this.element(el));
        }

        // If the element belongs to a group, validate all elements in the group 
        // that come before the current element
        if (elGroup) {
            var groupMembers = this.settings.rules[elGroup];

            for (var i=0; i<groupMembers.length; i  ) {
                if ( groupMembers[i] === elName ) {
                    break;
                }
                this.element( $('[name="'   groupMembers[i]   '"]') );
            }
        }
    }
  

Похоже, что функция «группы» этого плагина имеет несколько нерешенных проблем, некоторые из которых, похоже, связаны с вашей проблемой.

https://github.com/jzaefferer/jquery-validation/issues/search ?q = группы

для этого вы можете использовать группы, возьмите этот пример:

 $("form").validate({
    rules: {
        City: { required: true },
        Zip: { required: true },
        State: { required: true }
    },
    groups: {
        Location: "City Zip State"
    },
   errorPlacement: function(error, element) {
       if (element.attr("name") == "City" || element.attr("name") == "Zip" || element.attr("name") == "State") 
        error.insertAfter("#State");
       else 
        error.insertAfter(element);
   }
});
  

• правила устанавливают для 3 полей значение true
• группы определяют их для проверки как группу
• и функция errorPlacement определяет, куда поместить сообщение об ошибке