Проверка JSF onblur вызывает фокусировку следующего поля и делает его недействительным?

Question

В JSF 2.0 есть следующее: Использование этого в качестве базы

<h:inputText id="email" size="60" label="Email"
            styleClass=" #{component.valid ? '' : 'input-error'}"
            value="#{familyBacking.family.email}" requiredMessage="Required">
            <f:validateRequired />
            <f:attribute name="family" value="#{familyBacking.family}" />
            <f:validator validatorId="EmailValidator" />
            <f:validator validatorId="ExistingEmailAddressValidator" />
            <f:ajax event="blur" onevent="updateFocus"
                render="email emailMessage" />
</h:inputText>

С функцией JavaScript

function updateFocus(obj) {
    jQuery(":input.input-error:first").focus();
}

Это дает эффект фокусировки ивыделите недопустимое поле.Тем не менее, он также позволяет человеку перейти к следующему полю ввода.Итак, последовательность такова:

1. Пользователь вводит нет данных или недействительные данные в поле, щелкает по другому полю или вкладке.
2. Браузер фокусируется на другом поле
3. Включение размытия на исходных полевых пожарах, вызывающих Ajax.
4. Недействительность происходит, и класс добавляется к входу.Функция JS выполняется, возвращая фокус обратно в неверное поле.Все хорошо до этого момента.
5. НО, теперь onBlur на 2-м поле срабатывает и снова вызывает все это.

Потенциальное решение:

Я вижу, что функция onevent дляназывается 3 раза.Начнем с начала, один раз за успех и один раз за завершение.То, что я думаю, я могу сделать, так или иначе отключить события размытия для всех других полей ввода, пока я не включу их снова при последнем выполнении моего события javascript.

Предложения о том, как мне этого добиться?

Answer 1

Я понимаю, что это беспокоит вас, очевидно, вы хотели бы показать только одно сообщение одновременно. Но это также беспокоит конечного пользователя, курсор больше не залипает в следующем поле, конечный пользователь вынужден исправить ошибку проверки предыдущего поля прямо сейчас и без оправданий! Возможно, конечному пользователю нужно было еще время подумать о данных, прежде чем их заполнять? Как бы вы себя чувствовали, когда столкнулись с такой формой? Возможно, вам просто не следует менять фокус? Возможно, вам следует изменять фокус на 1-е недействительное поле всякий раз, когда нажата кнопка реального отправки?

Тем не менее, это интересная проблема. Вы действительно можете подключить атрибут onevent <f:ajax> для перехвата состояния запроса ajax. Вы действительно можете использовать магию jQuery, чтобы отключить (на самом деле, удалить) обработчик onblur, а затем добавить его снова, когда JSF выполнит свою работу с ajax (и вы выполнили свою работу с фокусом). Вы можете использовать jQuery.data() для хранения и извлечения произвольной информации HTML-элемента, такой как оригинальный обработчик onblur (что-то вроде того, что вы сделали бы с <f:attribute> в мире JSF):

function process(data) {
    switch (data.status) {
        case "begin":
            jQuery(":input", data.source.form).not(data.source).each(function() {
                var $this = $(this);
                $this.data("onblur", $this.attr("onblur"));
                $this.removeAttr("onblur");
            });
            break;

        case "success":
            jQuery(":input.input-error:first").focus();
            jQuery(":input", data.source.form).not(data.source).each(function() {
                var $this = $(this);
                $this.attr('onblur', $this.data("onblur"));
                $this.removeData("onblur");
            });
            break;
    }
}