Code pages

Page qui liste tous les comptes

<h:form>
   <h1><h:outputText value="List"/></h1>
   <p:dataTable value="#{listeComptesBean.listeComptes}" var="item"
                tableStyle="width:auto">
   <p:column style="text-align:right;" width="30">
      <f:facet name="header">
          <h:outputText value="Id"/>
      </f:facet>
      <h:link outcome="mouvement?id=#{item.id}" 
              value="#{item.id}"/>
   </p:column>
   ...

Page pour la saisie du mouvement.

Remarquez la validation du solde par une méthode du backing bean (on aurait aussi pu utiliser une classe "validatrice").

Comme avec les corrections précédentes on aurait aussi pu valider dans la méthode action du formulaire mais j'ai voulu vous montrer comment écrire une méthode validatrice (voir code du backing bean).

Si vous voulez en savoir plus sur les validations (optionnel).

Comme dans le TP1, une section metadata permet de récupérer l'id du compte dans l'URL. Attention à ne pas oublier <f:metadata> autour <f:viewParam> et <f:viewAction>.

Cette page utilise un bouton radio pour distinguer un retrait d'un ajout. Tout le reste a déjà été vu.

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="jakarta.faces.facelets"
      xmlns:f="jakarta.faces.core"
      xmlns:h="jakarta.faces.html">

  <body>

    <ui:composition template="./WEB-INF/templates/template.xhtml">

      <ui:define name="metadata">
        <f:metadata>  
          <f:viewParam name="id" value="#{mouvement.id}"  
                       required="true"/>  
          <f:viewAction action="#{mouvement.loadCompte}"/>  
        </f:metadata>
      </ui:define>

      <ui:define name="top">
        Mouvement sur un compte
      </ui:define>

      <ui:define name="content">
        <h1>Mouvement sur le compte numéro #{mouvement.id}
          de #{mouvement.compte.nom}</h1>

        <h:form>
          <h:panelGrid columns="3">
            Nom du titulaire :
            <h:outputText value="#{mouvement.compte.nom}"/>
            <h:panelGroup/>
            Type du mouvement :
            <h:selectOneRadio id="typeMouvement"
                              value="#{mouvement.typeMouvement}"
                              required="true"
                              layout="pageDirection">
              <f:selectItem itemValue="ajout" itemLabel="Ajout"/>
              <f:selectItem itemValue="retrait" itemLabel="Retrait"/>
            </h:selectOneRadio>
            <h:message for="typeMouvement"/>

            Montant du mouvement :
            <h:inputText id="montant" value="#{mouvement.montant}"
                required="true"
                validator="#{mouvement.validateSolde}"/>
            <h:message for="montant"/>
          </h:panelGrid>
          <h:commandButton action="#{mouvement.enregistrerMouvement()}"
                           value="Enregistrer le mouvement"/>
        </h:form>
      </ui:define>

    </ui:composition>

  </body>
</html>