Проверьте h: selectOneMenu и t: inputFileUpload с помощью f: ajax blur

Question

Я хочу проверить, перед отправкой формы, если h: selectOneMenu и t: inputFileUpload имеют допустимое значение.У меня есть этот код, но он не показывает h: сообщение , когда я покидаю selectOneMenu, то же самое происходит с t: fileInputUpload.

            <h:form id="uploadForm" enctype="multipart/form-data">
                <h:panelGrid columns="3">
                    <h:outputLabel for="option" value="Operación:" />
                    <h:selectOneMenu id="option" value="#{menu.infoMenuItem}"
                                     required="true"
                                     converterMessage="Opción no valida !" >
                        <f:selectItem itemLabel="Seleccione una opcion..." itemValue="null"/>
                        <f:selectItems value="#{menu.infoMenuItems}" />
                        <f:ajax event="blur" render="optionMessage" />
                    </h:selectOneMenu>
                    <h:message id="optionMessage" for="option" style="color: #FF0000;" />

                    <h:outputLabel for="upfile" value="Archivo: " />
                    <t:inputFileUpload id="upfile" value="#{uploadFile.upFile}"
                                       required="true">
                        <f:ajax event="blur" render="uploadMessage" />
                    </t:inputFileUpload>
                    <h:message id="uploadMessage" for="upfile" style="color: #FF0000" />

                    <h:panelGroup />
                    <h:commandButton value="Continuar"
                                     action="#{uploadFile.upload}">
                    </h:commandButton>
                </h:panelGrid>
            </h:form>

, а также, есть ли способзапретить отправку формы, если предыдущие компоненты не имеют допустимых значений?

Cheers!

Я использую Mojarra 2.1.4 и Tomahawk 1.1.11 (для загрузки)

Answer 1

это не показывает сообщение h: когда я покидаю selectOneMenu

Код, который размещен до сих пор, выглядит хорошо.Проблема вызвана в другом месте.Возможно, вы вкладываете HTML <form> s, что недопустимо.Убедитесь, что вы не вкладываете компоненты JSF <h:form>.По другим причинам см. Также commandButton / commandLink / ajax метод действия / слушателя не вызван или входное значение не обновлено .

---

то же самое происходит с t:fileInputUpload.

К сожалению, элемент HTML4 <input type="file"> и ajax XHR1 не очень хорошо сочетаются друг с другом.Чтобы определить, выбран ли файл, требуется запрос multipart/form-data ajax, который поддерживается только в HTML5 / XHR2 (на данный момент PrimeFaces 3.0 является единственной библиотекой компонентов JSF, которая поддерживает эту теорию! Я не проверял ее).Таким образом, запрос проверки ajax полностью игнорируется <t:inputFileUpload>.Поскольку JSF / Tomahawk - это всего лишь генератор HTML-кода, он не может ничего сделать для вас здесь.Лучшее, что вы можете сделать, это проверить его простым ванильным JS / HTML.

<t:inputFileUpload id="upfile" value="#{bean.file}" required="true" 
    onblur="document.getElementById('uploadMessage').style.display = (!value) ? 'block' : 'none'"
/>
<h:panelGroup>
    <h:message for="uploadMessage" style="color: #FF0000" />
    <span id="uploadMessage" style="display: none; color: #FF0000">Seleccione una archivo...</span>
</h:panelGroup>

(<h:message> сохраняется, так что сообщение проверки на стороне сервера будет отображаться в любом случае, когда вынажмите командную кнопку, которая запускает синхронный (не AJAX) запрос)

---

Не связанный с конкретной проблемой, вы должны предпочесть поместить код JS и CSS в егособственные .js и .css файлы, которые вы включаете в <script> и <link> в <h:head>.