Проверка формы b: не работает - PullRequest
Новая
       26

Проверка формы b: не работает

0 голосов
/ 15 ноября 2018

Я пытаюсь проверить модальную форму (JSF / Bootsfaces) и не дать сохранить ее, если введенный текст неверен. По некоторым причинам я игнорирую, это не работает, вот код JSF: 

    <b:modal id="creation"
             title="#{msgs['page.manageFlights.addingNew']}"
             styleClass="formValidationModalClass"
             closeOnEscape="false"
             backdrop="false"
             closable="false">

        <b:form id="createModal">
            <b:selectOneMenu
                    value="#{flightBean.currentFlight.journey}"
                    label="#{msgs['page.manageFlights.findAllJourneys']}"
                    required="true"
                    requiredMessage="Please select a journey"
                    large-screen="full-width">
                <f:selectItems value="#{journeyBean.findAllJourneys()}" var="journey" itemValue="#{journey}" itemLabel="#{journey.departureLocation} -> #{journey.arrivalLocation}" />

            </b:selectOneMenu>
            <b:dateTimePicker
                    value="#{flightBean.currentFlight.departureDate}"
                    label="#{msgs['page.manageFlights.departureDate']}"
                    required="true"
                    requiredMessage="Please enter a date and time"
                    large-screen="full-width">
            </b:dateTimePicker>

            <b:dateTimePicker
                    value="#{flightBean.currentFlight.arrivalDate}"
                    label="#{msgs['page.manageFlights.arrivalDate']}"
                    required="true"
                    requiredMessage="Please enter a date and time"
                    large-screen="full-width">
            </b:dateTimePicker>

            <b:inputText     value="#{flightBean.currentFlight.numberOfBusinessClassSeats}"
                             label="#{msgs['page.manageFlights.numberOfBusinessClassSeats']}"
                             required="true"
                             requiredMessage="The number of seats must be positive"
                             large-screen="full-width">
                <f:validateLongRange minimum = "1" maximum = "2000" />
            </b:inputText>
            <b:inputText
                    value="#{flightBean.currentFlight.numberOfEconomyClassSeats}"
                    label="#{msgs['page.manageFlights.numberOfEconomyClassSeats']}"
                    required="true"
                    requiredMessage="Please enter a number"
                    validatorMessage="The number of seats must be positive"
                    large-screen="full-width">
            </b:inputText>
            <br/>
            <b:row>
                <b:column>
                    <b:commandButton
                            largeScreen="half"
                            value="#{msgs['cancel.button']}"
                            dismiss="modal"
                            action="#{flightBean.resetCurrentFlight()}"
                            oncomplete="$('#creation').modal('hide')"
                    />
                    <b:commandButton
                            largeScreen="half"
                            dismiss="modal"
                            update="@(#dataTable)"
                            value="#{msgs['save.button']}" look="success"
                            action="#{flightBean.addFlight(flightBean.currentFlight)}"
                            oncomplete="if(!validationFailed) { $('#creation').modal('hide')};">
                    </b:commandButton>
                </b:column>
            </b:row>
            <b:fetchBeanInfos/>
            <b:messages/>
        </b:form>
    </b:modal>

Я пытаюсь проверить, является ли количество мест бизнес-класса положительным. Как видите, я добавил fetchbeaninfos, validateLongRange и oncomplete.

1 Ответ

0 голосов
/ 08 декабря 2018

<b:fetchBeanInfos> и validationFailed работают только после запроса AJAX. Вам необходимо отправить входные данные на сервер, проверить их там, и только когда ответ будет отправлен обратно клиенту, validationFailed обновится.

Я предлагаю использовать простой JavaScript, чтобы показать сообщение об ошибке и отключить кнопку.

Однако, если вы предпочитаете использовать проверку на стороне сервера, вот что нужно сделать:

  • Добавьте пустой метод validateInput() к вашему бобу. Это не нуждается в какой-либо реализации; он просто должен быть там, чтобы его можно было вызвать с помощью вызова JSF AJAX.
  • Добавить id к <b:fetchBeanInfos>.

  • Добавить прослушиватель изменений AJAX для каждого поля ввода. В зависимости от типа поля ввода вам может потребоваться другой слушатель (onblur, onchange и т. Д.), Но общая идея такова: 

    <b:inputText
            onblur="ajax:flightBean.validateInput()"
            update="**:fetchBeansId"
            value="..."
            label="..."
            required="true"
            requiredMessage="..."
            validatorMessage="...">
</b:inputText>
<b:fetchBeanInfos id="fetchBeansId"/>

Бит **:id поможет вам, если ваша страница JSF имеет несколько «пространств имен», таких как формы, модалы, таблицы данных и вкладки. Эти пространства имен добавляют префикс к идентификатору, а **:id позволяет вам найти id независимо от того, какой это префикс.

...