Блог

Я пытаюсь использовать errorPlacement с плагином Validator для jquery, но у меня возникли проблемы со смещением. Если элемент скрыт во время проверки (на другой вкладке), смещение возвращает значение 0,0 (верхний левый угол экрана).

 $(document).ready(function() {

var tabs = $("#tabs").tabs();

var validator = $("#myForm").validate({

        errorElement: "div",
        wrapper: "div",  // a wrapper around the error message
        errorPlacement: function(error, element) {

            if (element.parent().hasClass('group')){
                element = element.parent();
            }


            offset = element.position();
            error.insertBefore(element)
            error.addClass('message');  // add a class to the wrapper
            error.css('position', 'absolute');
            error.css('left', offset.left   element.outerWidth());
            error.css('top', offset.top);


        }
    });
}
  

Есть предложения о том, как это исправить? Я бы пересчитал смещения при изменении вкладки или что-то в этом роде, но это делается в validate, который, как я понял, вызывается только один раз.

Спасибо за помощь!

Редактировать:

Кажется, я все еще застрял на этом. Проблема, которую я нахожу, заключается в том, что (по крайней мере, из того, что я прочитал) я не могу вызвать validate более одного раза. Как вы думаете, каким-то образом добавление каждого сообщения об ошибке и пары ключей элемента в список сработает, или это грязный взлом? Я все равно не совсем уверен, как добавить их в список. Любые предложения были бы высоко оценены. Спасибо!!

Это: «Проблема, которую я нахожу, заключается в том, что (по крайней мере, из того, что я прочитал) я не могу вызвать validate более одного раза». на самом деле это неправда. Вы можете вручную запустить проверку формы в любое время из своего кода javascript, и с помощью небольшой хитрости вы даже можете указать, какая часть вашей формы должна быть проверена.

Предполагая, что:

• у вас есть форма с вкладками,
• вкладки обернуты в divs
• скрытые вкладки имеют класс css «неактивный», видимая вкладка имеет класс css «активный»
• в вашей форме есть кнопки «Вперед» и «Назад» для навигации по вкладкам

Я бы сделал что-то вроде этого:

 $(document).ready(function() {

    var validator = $("#myForm").validate({
            ... // your settings
            ignore : ['#tabs .inactive input'] // tells the validator to only validate elements on your current tab
        });
    }


    $(".forward").click(function() {
        if (validator.form()) {  // triggers validation of the currently visible form inputs
                // step forward to the next tab
        }
    });
});
  

Кроме того, если вы ищете решение для вырезания из бумаги, взгляните на этот пример многоступенчатой проверки формы:http://jquery.bassistance.de/validate/demo/multipart /