Primefaces dialogue + bouton de commande

Je suis en train d'utiliser primefaces <p:dialog> combiné avec <p:commandButton>. Dans mon .page xhtml, j'ai une liste déroulante et un bouton de commande qui est utilisée pour afficher une boîte de dialogue. Affiche une boîte de dialogue datatable avec les valeurs cibles à partir de la liste de choix. Boîte de dialogue a deux boutons: l'annuler et de le soumettre. Mon problème est que le bouton soumettre n'est pas déclenché. Ce qui est étrange, bouton de commande de boîte de dialogue.

Voici mon .xhtml:

<body>
<ui:composition template="./../resources/mainTemplate.xhtml">
<ui:define name="content">
<h:form>
<p:dialog id="dlg" header="#{messages.chooseSkillLevel}" widgetVar="dlg" modal="true" dynamic="true">
<h:dataTable value="#{editSkills.skillsAndLevels}" var="skillslevel">
<h:column>
#{skillslevel.skill.umiejetnosc}
</h:column>
<h:column>
<p:selectOneMenu value="#{skillslevel.level}" >
<f:selectItems value="#{editSkills.levels}" var="level" itemLabel="#{level.stopien}" itemValue="#{level.id}" />
</p:selectOneMenu>
</h:column>
</h:dataTable>
<p:commandButton value="#{messages.confirm}" action="#{editSkills.showSkillsAndLevels}" oncomplete="dlg.hide();" />   THIS BUTTON IS NOT FIRED
<p:commandButton value="#{messages.cancel}" onclick="dlg.hide()"/>
</p:dialog>
<p:pickList value="#{editSkills.skills}" var="skill" effect="none"  
itemValue="#{skill.id}" itemLabel="#{skill.umiejetnosc}"  
showSourceFilter="true" showTargetFilter="true" filterMatchMode="contains" 
addLabel="#{messages.add}" removeLabel="#{messages.remove}" removeAllLabel="#{messages.removeAll}" >  
<f:facet name="sourceCaption">#{messages.skillsList}</f:facet>  
<f:facet name="targetCaption">#{messages.yourSkills}</f:facet>
<p:ajax event="transfer" listener="#{editSkills.onTransfer}" /> 
<p:column style="width:100%;">  
#{skill.umiejetnosc}  
</p:column> 
</p:pickList>
<p:commandButton value="#{messages.confirm}" action="#{editSkills.afterSubmit}" update="dlg" oncomplete="dlg.show()" />   THIS BUTTON WORKS FINE
<p:commandButton value="#{messages.cancel}" action="profile" immediate="true"/>
</h:form>
</ui:define>
</ui:composition>
</body>

J'ai marqué de travail bouton et pas de travail.
Que dois-je faire pour le faire fonctionner?

  • Avez-vous regardé la console, ce n'est pas de faire un appel ajax? ou est-il tout simplement pas de travail? Essayez de regarder dans firebug si sa l'envoi de données au serveur, ou est l'AJAX de tir et la méthode #{editSkills.showSkillsAndLevels} n'est pas appelée à tous? Vérifiez également si firebug ne montre pas de JS erreurs.
  • il semble qu'il n'est pas d'être appelé à à tous. Ne pouvez pas voir toute JS trop d'erreurs.
InformationsquelleAutor AjMeen | 2013-01-17
  1. 20

    Vous pouvez essayer l'une des opérations suivantes , je vote le numéro un, c'est une conception plus claire de l'OMI

    1. Apporter la <p:dialog/> à l'extérieur du général <h:form/> et mettre un <h:form/> à l'intérieur de au lieu 

        <p:dialog id="dlg" header="#{messages.chooseSkillLevel}" widgetVar="dlg" modal="true" dynamic="true">
<h:form>
<h:dataTable value="#{editSkills.skillsAndLevels}" var="skillslevel">
<h:column>
#{skillslevel.skill.umiejetnosc}
</h:column>
<h:column>
<p:selectOneMenu value="#{skillslevel.level}" >
<f:selectItems value="#{editSkills.levels}" var="level" itemLabel="#{level.stopien}" itemValue="#{level.id}" />
</p:selectOneMenu>
</h:column>
</h:dataTable>
<p:commandButton value="#{messages.confirm}" action="#{editSkills.showSkillsAndLevels}" oncomplete="dlg.hide();" />   THIS BUTTON IS NOT FIRED
<p:commandButton value="#{messages.cancel}" onclick="dlg.hide()"/>
</h:form>
</p:dialog>

    2. Ajouter appendToBody="false" à la <p:dialog/> pour assurer le dialogue est rendu dans le formulaire html dans les DOM au lieu d'être auto-déménagé à la fin de l'HTML du corps. Mais cela peut entraîner incompatible rendu dans les différents navigateurs.

    • Merci pour votre réponse! J'ai fait ce que vous m'avez dit de le faire, mais maintenant j'ai cette erreur: /user/editSkills.xhtml @39,121 itemValue="#{skill.id}": The class 'java.lang.String' does not have the property 'id'. Ce qui est étrange, je pense que c'est lié à la liste de choix et c'est bizarre, la cause de la liste de choix fonctionne très bien. Que dois-je faire?
    • c'est une autre question tout à fait,probablement causé par le fait que #{skill.id} et #{skillslevel.level} ne sont pas le même type de données(l'un d'eux est une chaîne, l'autre c'est autre chose). Mais maintenant, votre bouton de commande est certainement le tir.
    • #{skillslevel.level} n'a rien à voir avec cette erreur, la cause, même si je supprimer skilsslevel partie l'erreur est toujours présente. Je viens probablement besoin d'un convertisseur. En tout cas merci pour l'aide!
    • Vous êtes les bienvenus. Vous ne devriez avoir besoin d'un convertisseur si itemValue est un POJO/type complexe. Regardez cette réponse. La question est directement corrélée à la vôtre
    • je vais avoir le même problème, essayé cela, mais ne fonctionne pas: stackoverflow.com/questions/31350850/...
    InformationsquelleAutor kolossus
  2. 4
    <p:commandButton  value="Cancel" oncomplete="PF('yourDialogWidgedVarName').hide();" process="@this"  />

    Assurez-vous d'utiliser ' quand u appellent le widgetVar nom. Vous pouvez également utiliser immediate="true" ou processus="@ce".

    • vous ne devriez pas avoir besoin immediate="true" ou processus="@ce". Cependant, votre réponse était rapide peu de renseignements dont j'avais besoin. Merci!
    InformationsquelleAutor Juan Castillo