сосредоточиться на первом поле, используя валидатор jquery

Question

Я использую валидатор jquery для проверки полей формы. Для поля ниже:

1. Фокус на третье поле электронной почты 2 т.е., но я хочу сосредоточиться на первом поле т.е. факс.

2. Сообщение об ошибке отображается между текстом и другим статическим текстом, из-за которого сдвиги выравнивания здесь и там. Лучший способ отображения сообщений.

3. В нескольких сценариях отображается только сообщение об ошибке, но не фокус, из-за которого пользователь не знает об ошибке.

Код:

var validator = $("#enrollmentForm").validate({ 
    errorElement: 'label', 
    errorPlacement: function(error, element) { 
     error.insertAfter(element); 
     element.focus(); 
    }, 
}); 

Может кто-то обеспечить решение?

Answer 1

Ваш собственный код вызывает проблемы, которую вы описываете.

errorPlacement: function (error, element) { 
    error.insertAfter(element); 
    element.focus(); // <- this line is causing your whole problem 
}, 

Используя element.focus внутри errorPlacement, вы говорите это, чтобы сосредоточиться на элемент оценивается правильно, когда она была оценена. Если mutiple-элементы недействительны сразу, фокус, естественно, остается на самом последнем, который был оценен, так как форма оценивается сверху вниз.

Демонстрация проблемы, вызванной ваш собственный код: http://jsfiddle.net/6y3k6jtc/

---

element.focus() Удаление строки полностью фиксирует свой код, потому что вы позволяете по умолчанию фокуса плагина для работы по назначению. (По умолчанию, плагин автоматически знает поместить фокус на самом первом недопустимого элемента ввода.)

errorPlacement: function (error, element) { 
    error.insertAfter(element); 
}, 

DEMO рабочего кода: http://jsfiddle.net/6y3k6jtc/1/

Answer 2

Использование

invalidHandler: function(form, validator) { 
    var errors = validator.numberOfInvalids(); 
    if (errors) {      
     validator.errorList[0].element.focus(); 
    } 
}