2
I’m beginner with JSF, web development, and I’m having a problem using the component Dialog, of PrimeFaces, within a DataTable.
The idea was as follows: We have a list of gifts for a tea pot, the party guest chooses the gift he wants to give, and click on the button Escolher, dai opens a Dialog Containing a OuputLabel and a InputText containing the name of the guest, and a button to confirm that it will save the chosen gift, the name and telephone number of the person.
I made a test code without database, only a prototype of what will be, however is presenting inconsistency, according to image, and the commandButton, is not calling the method teste of ManagedBean:
--- Managed Bean ---
import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
@ManagedBean
@ViewScoped
public class ConfirmarPresenteBean implements Serializable {
private static final long serialVersionUID = 1L;
private String nome;
private String telefone;
public void teste() {
System.out.println("Nome: " + this.nome);
}
public String getNome() {
return nome;
}
public void setNome(String nome) {
this.nome = nome;
}
public String getTelefone() {
return telefone;
}
public void setTelefone(String telefone) {
this.telefone = telefone;
}
}
--- XHTML ---
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title><ui:insert name="titulo">Chacolate de Panela</ui:insert></title>
<h:outputStylesheet library="css" name="sistema.css" />
</h:head>
<h:body>
<script>
function tratarConfirmacaoPresente(args) {
if (!args.validationFailed) {
confirmarPresenteDialog.hide();
}
}
</script>
<div id="container">
<h:form id="dataTable">
<p:dataTable value="#{listaPresentesBean.presentes}" var="presente"
sortBy="#{presente.nomePresente}" rows="10" paginator="true"
paginatorPosition="bottom" rowsPerPageTemplate="10, 15, 20">
<p:column headerText="Lista de Presentes">
<h:outputText value="#{presente.nomePresente}" />
</p:column>
<p:column headerText="" width="20">
<p:commandButton value="Escolher" id="botaoEscollher"
onclick="confirmarPresenteDialog.show(); return false;" />
<!-- Dialog -->
<p:dialog header="Confirmar Presente"
widgetVar="confirmarPresenteDialog" modal="true"
resizable="false">
<h:panelGroup id="confirmacaoPanel">
<p:messages />
<h:panelGrid columns="2">
<p:outputLabel value="Nome" for="nome" />
<p:inputText id="nome" required="true"
value="#{confirmarPresenteBean.nome}" />
</h:panelGrid>
<p:commandButton value="Confirmar"
update="confirmacaoPanel"
action="#{confirmarPresenteBean.teste}" />
</h:panelGroup>
</p:dialog>
</p:column>
</p:dataTable>
</h:form>
</div>
</h:body>
</html>
Welcome to Stack Overflow, Tom! Here are some tips on how to format your posts here and here and if you have a minute, do the tour!
– Daniel
Try to isolate your dialog component in another form.
– Weslley Tavares
I did not implement your code to test, but I believe that the method (.test) should be implemented in the button that will call the action of composing the Modal. By chance your need eh not when you click the Choose button it open the Modal and popular with the answer of "System.out.println("Name: " + this.name);"?
– Anselmo Pfeifer
Take the dialog from inside the table
– DiegoAugusto
@Anselmopfeifer I actually created the method (.test) just to test if the button was working. The problem was with (h:form) itself. I removed from Datatable and left (h:form) only inside the Dialog and solved.
– Tom