Arhn - архитектура программирования

Условно обновлять 2-й компонент только тогда, когда первый компонент проходит проверку

У меня есть два компонента PrimeFaces selectOneMenu. Когда для первого компонента установлено определенное значение, мне нужно, чтобы второй компонент стал обязательным. Я использую Ajax и привязку для обновления второго компонента при отправке первого, чтобы пользователь видел требуемый «*» рядом с меткой второго компонента. Эта часть проста.

Вот (несколько упрощенный) код:

<p:outputLabel id="foolbl" for="foo"
    value="Foo" />
<p:selectOneMenu id="foo" required="true"
    value="#{bean.foo}" binding="#{foobnd}">
<f:selectItem itemLabel="Select One" itemValue="" />
<f:selectItems
    value="#{bean.foovalues}" />
<p:ajax
    update="@this foolbl bar barlbl"
    process="@this"/> 
</p:selectOneMenu>

<p:outputLabel id="barlbl" for="bar"
    value="Bar" />
<p:selectOneMenu id="bar"
    required="#{foobnd.valid and foobnd.value eq 'value1'}"
    value="#{bean.bar}">
<f:selectItem itemLabel="Select One" itemValue="" />
<f:selectItems
    value="#{bean.barValues}" />
<p:ajax update="@this barlbl" process="@this" />
</p:selectOneMenu>

Он работает нормально, за следующим исключением:

  1. Пользователь выбирает «значение 1» из foo. Результат: Bean обновляется с помощью foo & bar и становится обязательным;
  2. Пользователь выбирает некоторое значение из бара. Результат: бин обновляется баром;
  3. Пользователь отменяет выбор значения в строке (выбирает «Выбрать одно»). Результат: проверка не пройдена, так как требуется полоса. Бин не обновляется;
  4. Пользователь отменяет выбор значения в foo (выбирает «Выбрать одно»). Результат: Bean обновляется с помощью foo. Bar обновляется ранее отправленным значением bean.bar ("значение 1").

Очевидно, это работает так, как должно для JSF. Однако я обеспокоен тем, что это приведет к тому, что пользователь не заметит проблемы и случайно отправит значение для bean.bar, хотя он этого не собирался делать. Это своего рода крайний случай, но пользователь может выбрать «Выбрать один» в foo, а затем выбрать какое-либо значение, отличное от «значения 1», что приведет к проблеме.

Чтобы избежать этого, я мог добавить bar к атрибуту процесса ajax-вызова foo следующим образом:

<p:selectOneMenu id="foo" required="true"
    value="#{bean.foo}" binding="#{foobnd}">
<f:selectItem itemLabel="Select One" itemValue="" />
<f:selectItems
    value="#{bean.foovalues}" />
<p:ajax
    update="@this foolbl bar barlbl"
    process="@this bar"/> 
</p:selectOneMenu>

Это предотвращает ранее описанную проблему, но также имеет непреднамеренное последствие отправки значения для bar при начальном выборе foo и, следовательно, выделение bar красным цветом для неудачной проверки. Я не хочу, чтобы это произошло. Когда foo отправляется, я хочу, чтобы рядом с баром отображалась только «*». Я не хочу, чтобы это было выделено, так как проверка не удалась.

Я экспериментировал со слушателями и валидаторами клиентов, чтобы решить эту проблему, но пока ничего не получается. resetValues ​​также не совсем делает то, что я хочу, так как мне не нравится просто повторно выбирать значение, которое пользователь только что не выбрал.

Я использую ПраймФейс 6.

Каков наилучший способ добиться этого?

04.04.2018

Ответы:


1

Разве ваше требование не бессмысленно? Если требуется selectOneMenu foo, то selectOneMenu bar также требуется в любом случае. Так почему бы просто не сделать так, чтобы bar также требовался, вместо того, чтобы обновлять его, если выбран foo? Его в любом случае нужно выбрать. Если вы состоите в своем требовании, как насчет того, чтобы не отображать опцию «Выбрать один» после выбора элемента, потому что пользователь все равно должен выбрать один вариант. Если вы все еще придерживаетесь своей точки зрения, вы можете попытаться установить значение модели bar равным null, если проверка бара не удалась с помощью PostValidateEventListener, например:

метод в бине:

public void resetModelValue(ComponentSystemEvent event) throws AbortProcessingException {
    UIInput input = (UIInput) event.getSource();
    if (input.isValid()) {
        return;
    }
    input.getValueExpression("value").setValue(FacesContext.getCurrentInstance().getELContext(), null);
}

зарегистрировать PostValidateEventListener для бара:

<p:selectOneMenu id="bar" ...>
    ...
    <f:event type="postValidate" listener="#{bean.resetModelValue}" />
</p:selectOneMenu>

Однако я думаю, что это решение не решает всех ваших проблем.

20.04.2018
Новые материалы

Коллекции публикаций по глубокому обучению
Последние пару месяцев я создавал коллекции последних академических публикаций по различным подполям глубокого обучения в моем блоге https://amundtveit.com - эта публикация дает обзор 25..

Представляем: Pepita
Фреймворк JavaScript с открытым исходным кодом Я знаю, что недостатка в фреймворках JavaScript нет. Но я просто не мог остановиться. Я хотел написать что-то сам, со своими собственными..

Советы по коду Laravel #2
1-) Найти // You can specify the columns you need // in when you use the find method on a model User::find(‘id’, [‘email’,’name’]); // You can increment or decrement // a field in..

Работа с временными рядами спутниковых изображений, часть 3 (аналитика данных)
Анализ временных рядов спутниковых изображений для данных наблюдений за большой Землей (arXiv) Автор: Рольф Симоэс , Жильберто Камара , Жильберто Кейрос , Фелипе Соуза , Педро Р. Андраде ,..

3 способа решить квадратное уравнение (3-й мой любимый) -
1. Методом факторизации — 2. Используя квадратичную формулу — 3. Заполнив квадрат — Давайте поймем это, решив это простое уравнение: Мы пытаемся сделать LHS,..

Создание VR-миров с A-Frame
Виртуальная реальность (и дополненная реальность) стали главными модными терминами в образовательных технологиях. С недорогими VR-гарнитурами, такими как Google Cardboard , и использованием..

Демистификация рекурсии
КОДЕКС Демистификация рекурсии Упрощенная концепция ошеломляющей О чем весь этот шум? Рекурсия, кажется, единственная тема, от которой у каждого начинающего студента-информатика..