Как использовать <h: form> на странице JSF? Одиночная форма? Несколько форм? Вложенные формы?

Я использую технологию шаблонов Facelet для размещения моей страницы в приложении JSF 2, над которым я работаю.

В моем header.xhtml Primefaces требует, чтобы menubar был заключен в h:form.

<h:form>
    <p:menubar autoSubmenuDisplay="true">
        Menu Items here!
    </p:menubar>
</h:form>

Итак, на моих страницах содержания у меня будет другая форма h: или больше.

Будет ли это работать, если я просто разместлю форму h: в моем template.xhtml?

<h:body>
    <h:form>
        <div id="top">
            <ui:insert name="header"><ui:include src="sections/header.xhtml"/></ui:insert>
        </div>
        <div>
            <div id="left">
                <ui:insert name="sidebar"><ui:include src="sections/sidebar.xhtml"/></ui:insert>
            </div>
            <div id="content" class="left_content">
                <ui:insert name="content">Content</ui:insert>
            </div>
        </div>
        <div id="bottom">
            <ui:insert name="footer"><ui:include src="sections/footer.xhtml"/></ui:insert>
        </div>
    <h:form>
</h:body>

Я на самом деле думаю о случае использования, когда мне нужно несколько h:form на странице.

Спасибо

Источник

2 ответа

Решение

Вы можете безопасно использовать несколько форм на странице JSF. Это не отличается от использования простого HTML.

гнездование <form> элементы недопустимы в HTML. Поскольку JSF просто генерирует кучу HTML, в JSF он не отличается. гнездование <h:form> поэтому также недействителен в JSF.

<h:form>
    ...
    <h:form> <!-- This is INVALID! -->
        ...
    </h:form>
    ...
</h:form>

Поведение браузера при отправке вложенной формы не определено. Это может или не может работать так, как вы ожидаете. Например, он может просто обновить страницу, не вызывая метод действия компонента. Даже если вы перемещаете вложенную форму (или компонент, который ее содержит) за пределы родительской формы с помощью dom-манипуляций (или, например, с помощью PrimeFaces) appendTo="@(body)"), он все равно не будет работать, и не должно быть вложенных форм во время загрузки страницы.

Относительно того, какие формы вам нужно сохранить, имея одного "бога"<h:form>на самом деле плохая практика. Итак, лучше удалить внешнюю<h:form>из мастер-шаблона и пусть header, sidebar, contentи т. д. каждый раздел определяет свой <h:form>, Несколько параллельных форм действительны.

<h:form>
    ...
</h:form>
<h:form> <!-- This is valid. -->
    ...
</h:form>

Каждая форма должна иметь одну четкую ответственность. Например, форма входа в систему, форма поиска, основная форма, диалоговая форма и т. Д. Вы не хотите без необходимости обрабатывать все другие формы / входные данные при отправке определенной формы.

Обратите внимание, что при отправке определенной формы другие формы НЕ обрабатываются. Итак, если вы все равно собираетесь обрабатывать ввод другой формы, значит, у вас проблема с дизайном. Либо поместите его в ту же форму, либо добавьте несколько уродливых хаков JavaScript, чтобы скопировать необходимую информацию в скрытое поле формы, содержащее кнопку отправки.

Однако в определенной форме вы можете использовать ajax, чтобы ограничить обработку входов меньшим подмножеством. Например<f:ajax execute="@this">будет обрабатывать (отправлять / преобразовывать / проверять / вызывать) только текущий компонент, а не другие в той же форме. Обычно это используется в случаях использования, когда другие входы в той же форме должны быть динамически заполнены / обработаны / переключены, например, зависимые выпадающие меню, списки автозаполнения, таблицы выбора и т. Д.

Смотрите также:

Источник

Я был смущен этой проблемой некоторое время. Вместо ряда независимых форм я преобразовал в шаблон, то есть вместо вызова xhtml с перечисленными формами, обычно с помощью ui:include, я выполняю вызов тех ранее созданных ui: включенных xhtml страниц, которые ui: содержимое записано в родительском шаблоне.

Источник
Другие вопросы по тегам