2 façons de demander une confirmation :

• la demande de confirmation vient du serveur qui retourne une page pour demander confirmation.
• la demande de confirmation vient d'un code JavaScript sur le client Web, sans passage par le serveur.

Il est certain que la 2ème façon sera plus ergonomique.

Les solutions pour cette 2ème façon :

Un moyen simple est d'utiliser un attribut onclick sur l'élément <h:commandLink>. Cet attribut désigne une fonction JavaScript qui est exécutée sur le client Web si l'utilisateur clique sur l'élément HTML qui sera généré à partir du <h:commandLink>. Si cette fonction retourne false, l'événement déclencheur (lié au clic souris) n'a pas lieu. Il suffit alors d'utiliser la fonction confirm de JavaScript. Le problème est qu'on ne peut changer ce qui est affiché à la suite de la question, par exemple remplacer par des boutons "Oui" et "Non" au lieu de OK et Annuler (en français).

Si on veut pouvoir configurer la boîte de dialogue il faut écrire son propre composant JavaScript ou JSF. La solution la plus simple est d'utiliser un composant qui existe déjà dans une librairie de composants JSF plutôt que d'écrire son propre composant (pas étudié dans ce cours et pas très simple). PrimeFaces, par exemple a les composants <p:confirm> et <p:confirmDialog>. <p:confirm> demande la confirmation. Le dialogue affiché pour cette confirmation est défini par <p:confirmDialog>. <p:confirm> doit être mis à l'intérieur d'un <p:commandLink> ; ça ne marche pas dans un <h:commandLink>. Mettez <p:confirmDialog> dans le formulaire mais pas dans <p:dataBase>.

Voici un exemple (les classes CSS dans le dialogue sont nécessaires) :

<p:commandLink action="#{listeComptes.supprimerCompte(item)}" 
               title="Supprimer ce compte">
    <h:graphicImage name="images/del.png" />
    <p:confirm header="Confirmation de suppression"
               message="Voulez-vous vraiment supprimer ?" />
</p:commandLink>
...
<p:confirmDialog global="true">
    <p:commandButton value="Oui" type="button" 
                     styleClass="ui-confirmdialog-yes"/>
    <p:commandButton value="Non" type="button" 
                     styleClass="ui-confirmdialog-no"/>
</p:confirmDialog>