web-dev-qa-db-fra.com

Comment utiliser <h: form> dans la page JSF? Formulaire unique? Plusieurs formulaires? Formes imbriquées?

J'utilise la technologie de création de modèles Facelet pour mettre en page ma page dans une application JSF 2 sur laquelle je travaille.

Dans mon header.xhtml, primefaces nécessite que la barre de menu soit placée dans h: form.

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

Donc, dans mes pages de contenu, j'aurai un autre h: formulaire ou plus.

Cela fonctionnera-t-il si je place simplement le formulaire h: dans mon 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>

Je pense en fait à un cas d'utilisation où j'ai besoin de plusieurs h: formulaire dans une page.

Merci

formsjsfjsf-2nested
42
Mark Estrada

Vous pouvez utiliser en toute sécurité plusieurs formulaires dans une page JSF. Ce n'est pas différent de l'utilisation de HTML simple.

L'imbrication des éléments <form> Est invalide dans HTML . Étant donné que JSF génère simplement un tas de code HTML, ce n'est pas différent dans JSF. L'imbrication <h:form> Est donc également invalide dans JSF.

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

Le comportement du navigateur quant à l'envoi d'un formulaire imbriqué n'est pas spécifié. Cela peut ou non fonctionner comme vous vous y attendez. Il peut par exemple simplement actualiser la page sans invoquer la méthode d'action du bean. Même si vous déplacez la forme imbriquée (ou un composant qui la contient) en dehors de la forme parent avec une manipulation dom (ou en utilisant par exemple la PrimeFaces appendTo="@(body)"), cela ne fonctionnera toujours pas et il devrait y avoir non formulaires imbriqués au moment du chargement de la page.

Quant aux formulaires que vous devez conserver, avoir un seul "dieu" <h:form> Est en fait une mauvaise pratique. Donc, vous feriez mieux de supprimer le <h:form> Extérieur du modèle principal et de laisser les sections header, sidebar, content etc définir chacune sa propre <h:form>. Plusieurs formulaires parallèles sont valides.

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

Chaque formulaire doit avoir une responsabilité claire. Par exemple. un formulaire de connexion, un formulaire de recherche, le formulaire principal, le formulaire de dialogue, etc. Vous ne voulez pas traiter inutilement tous les autres formulaires/entrées, lorsque vous soumettez un certain formulaire.

Notez donc que lorsque vous soumettez un certain formulaire, les autres formulaires ne sont PAS traités. Donc, si vous avez l'intention de traiter une entrée d'un autre formulaire, vous avez un problème de conception. Soit le mettre dans le même formulaire ou jeter quelques vilains hacks JavaScript pour copier les informations nécessaires dans un champ caché du formulaire contenant le bouton d'envoi.

Dans une certaine forme, vous pouvez cependant utiliser ajax pour limiter le traitement des entrées à un sous-ensemble plus petit. Par exemple. <f:ajax execute="@this"> Ne traitera (soumettre/convertir/valider/invoquer) que le composant actuel et pas les autres dans le même formulaire. Cela doit généralement être utilisé dans les cas d'utilisation où d'autres entrées dans le même formulaire doivent être remplies/rendues/basculées dynamiquement, par ex. menus déroulants dépendants, listes de saisie semi-automatique, tableaux de sélection, etc.

Voir également:

85
BalusC