I can not figure out why my rich:dataTable is not rendering. I am using JSF 2 and Richfaces 4. URL is http://localhost:8080/contacts-as7/me2.jsf?sitecode=0Z56, but it behaves the same without the sitecode parameter.
Here is the view
<!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="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:rich="http://richfaces.org/rich"
xmlns:a4j="http://richfaces.org/a4j">
<h:head>
<title>contacts</title>
</h:head>
<f:metadata>
<f:viewParam name="sitecode" value="#{contactView.siteCode}" />
<f:event listener="#{contactView.retrieve056}" type="preRenderView"></f:event>
</f:metadata>
<h:form>
<h:messages />
<rich:panel rendered="#{not empty contactView.doors}">
<f:facet name="header">
<h:outputText value="Site Code #{contactView.doors.siteCode}" />
</f:facet>
<h:panelGrid columns="1">
<h:outputText
value="Report corrections to your DOORS administrator" />
<h:outputText id="nm1" value="#{contactView.doors.name}" />
<h:outputText id="pgr1" value="#{contactView.doors.pager}" />
<h:outputText id="adr1" value="#{contactView.doors.addr1}" />
<h:outputText id="adr2" value="#{contactView.doors.addr2}"
rendered="#{not empty contactView.doors.addr2}" />
<h:outputText id="csz"
value="#{contactView.doors.city}, #{contactView.doors.state} #{contactView.doors.zip}" />
</h:panelGrid>
</rich:panel>
<rich:dataTable value="#{contactView.doors.alternateList}" var="_xyz">
<h:panelGrid columns="1">
<h:outputText id="nm11" value="#{_xyz.name}" />
<h:outputText id="pgr11" value="#{_xyz.phone}" />
<h:outputText id="adr11" value="#{_xyz.pager}" />
<h:outputText id="adr21" value="#{_xyz.comment}" />
</h:panelGrid>
</rich:dataTable>
</h:form>
</html>
Here is my view bean
#Named
#ViewScoped
public class ContactView implements Serializable {
public ContactView() {
}
#EJB
ContactService contactService;
private String siteCode;
private Doors doors;
private AlternateContact alternateContact;
public String retrieve056() {
System.out.println("RETRIEVE");
this.doors = this.contactService.findDoors("0Z56");
System.out.println("doors_id is "+ doors.getDoorsId());
for ( AlternateContact alt : doors.getAlternateList() ){
System.out.println("alt name "+ alt.getName());
}
return "me2.jsf?sitecode=0Z56&faces-redirect=true";
}
}
And here is the output on the console -- the doors.getAlternateList() is definitely populated.
15:30:58,382 INFO [stdout] (http-localhost-127.0.0.1-8080-3) alt name Thomas Cahill
15:30:58,392 INFO [stdout] (http-localhost-127.0.0.1-8080-3) alt name Micahel Henry
And yet it doesn't show up on my view! I have been looking at this all day and am desparate. Any ideas? It was working at some point in the last few days, but I have no idea how I broke it as I was working on other things.
TDR
When using dataTable you should use rich:column or rich:columnGroup
Try using <rich:dataGrid> instead of <rich:dataTable>
Just look at rich:dataGrid...
Regards
Did you include the all the commons*.jar that goes with richfaces? Without that it won't render.
Related
I have a Primefaces dialog, and inside it there is a tabView. In this tabView I have 3 tabs, each one called towards ui:include. In the first tab I have a selectOneMenu which defines a property called tipoProprietario from class ProprietarioORM. The navigation between tab is done not by tabs themselves (in this stage they're disabled) but towards commandButtons at bottom of dialog. When I click in a commandButton to pass from the first to second tab tipoProprietario is filled correctly. However, when I click to pass from second do third tab (or even to the first one), I found that the selectItem value is changed to null. Consequently, the tipoProprietario property is also changed to null. Debugging, I saw that first it is called the Select Item listener method and after the tipoProprietario setter.
Can someone explain why this it is happening? How to correct it?
dialog.xhtml
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">
<p:dialog id="dlgEdicao" widgetVar="dlgEdicao" resizable="false"
closable="true" modal="true" closeOnEscape="true"
header="#{(proprietarioMB.edicao)? msg['proprietario.titulo.editar']: msg['proprietario.titulo.incluir']}">
<p:tabView id="tabEdicao" widgetVar="tabEdicao" dynamic="true"
styleClass="tabEdicaoProprietario" cache="false"
binding="#{proprietarioMB.tabEdicao}">
<p:tab id="tabProprietario" title="#{msg['proprietario.titulo']}"
disabled="#{not proprietarioMB.edicao}" titleStyleClass="">
<ui:include src="./aba_proprietario.xhtml" />
</p:tab>
<p:tab id="tabEnderecoContato"
title="#{msg['proprietario.titulo.aba.endereco']}"
disabled="#{not proprietarioMB.edicao}">
<ui:include src="./aba_endereco_contato.xhtml" />
</p:tab>
<p:tab id="tabVeiculo"
title="#{msg['proprietario.titulo.aba.veiculo']}"
disabled="#{not proprietarioMB.edicao}">
<ui:include src="./aba_veiculo.xhtml" />
</p:tab>
</p:tabView>
<f:facet name="footer">
<p:commandButton id="btnDialogoAnterior"
value="#{msg['titulo.anterior']}"
rendered="#{not proprietarioMB.edicao}" immediate="true"
disabled="#{not proprietarioMB.btnAnteriorHabilitado}"
actionListener="#{proprietarioMB.doEventClickBtnAnterior}"
update="#this tabEdicao btnDialogoSeguinte btnDialogoConcluir"
style="margin-right: 20px;" />
<p:commandButton id="btnDialogoSeguinte"
value="#{msg['titulo.proximo']} #{(not proprietarioMB.btnConcluirVisivel)? '': 'display: none;'}"
rendered="#{not proprietarioMB.edicao}"
actionListener="#{proprietarioMB.doEventClickBtnSeguinte}"
update="#this tabEdicao btnDialogoAnterior btnDialogoConcluir"
style="margin-right: 20px; #{(not proprietarioMB.btnConcluirVisivel)? '': 'display: none;'}" />
</f:facet>
</p:dialog>
</ui:composition>
aba_proprietario.xhtml (the first tab)
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">
<p:panel id="pnlDadosProprietario">
<p:focus for="selTipoEdicao" />
<p:fieldset id="fieldDadosProprietario"
legend="#{msg['proprietario.titulo']}"
rendered="#{not empty proprietarioMB.proprietario}">
<p:panelGrid id="pnlDadosProprietarioEdicao">
<p:row>
<p:column>
<p:outputLabel id="lblTipoEdicao"
value="#{msg['proprietario.titulo.tipo']}" for="selTipoEdicao" />
</p:column>
<p:column>
<p:selectOneMenu id="selTipoEdicao"
value="#{proprietarioMB.proprietario.tipoProprietario}"
valueChangeListener="#{proprietarioMB.doEventTipoDocumentoPesquisaChanged}"
immediate="true">
<f:selectItems value="#{proprietarioMB.tiposProprietarios}" />
<p:ajax event="change" update="txtDocumentoEdicao" />
</p:selectOneMenu>
</p:column>
<p:column>
<p:outputLabel id="lblDocumentoEdicao"
value="#{msg['proprietario.titulo.documento']}"
for="txtDocumentoEdicao" />
</p:column>
<p:column>
<p:inputMask id="txtDocumentoEdicao"
value="#{proprietarioMB.proprietario.documento}"
mask="#{proprietarioMB.mascaraDocumento}" />
</p:column>
</p:row>
</p:panelGrid>
</p:fieldset>
</p:panel>
</ui:composition>
The Managed Bean
#ManagedBean
#ViewScoped
public class ProprietarioMB {
private static final String MASCARA_CPF = "999.999.999-99";
private static final String MASCARA_CNPJ = "99.999.999/9999-99";
private static final SelectItem[] tiposProprietarios = new SelectItem[] {
new SelectItem(JURIDICA, JURIDICA.getDescricao()),
new SelectItem(FISICA, FISICA.getDescricao()), };
private ProprietarioORM proprietario;
private String mascaraDocumento;
private TabView tabEdicao;
/**
* Select Item listener method: Changes inputMask mask
*/
public void doEventTipoDocumentoPesquisaChanged(ValueChangeEvent event) {
this.mascaraDocumento = (event.getNewValue() == FISICA) ? MASCARA_CPF
: MASCARA_CNPJ;
}
public void doEventClickBtnAnterior() {
System.out.println("ProprietarioMB.doEventClickBtnAnterior(): "
+ this.tabEdicao.getActiveIndex());
this.tabEdicao.setActiveIndex(this.tabEdicao.getActiveIndex() - 1);
}
public void doEventClickBtnSeguinte() {
System.out.println("ProprietarioMB.doEventClickBtnSeguinte(): "
+ this.tabEdicao.getActiveIndex());
System.out.println("ProprietarioMB.doEventClickBtnSeguinte(): "
+ this.proprietario);
if (this.tabEdicao.getActiveIndex() == 0) {
if (this.validarProprietario()) { // Validation method
this.tabEdicao.setActiveIndex(1);
}
} else if (this.tabEdicao.getActiveIndex() == 1) {
this.tabEdicao.setActiveIndex(2);
}
}
// Other methods + getters & setters
}
ProprietarioORM
public class ProprietarioORM {
private String nome;
private TipoProprietarioEnum tipoProprietario;
// getters & setters
}
It's most likely because of the binding="#{proprietarioMB.tabEdicao}"
For one thing, you don't appear to need the binding at all. Even if you did, you failed to initialize the component in your backing bean, a bug that'll result in the <p:tabView/> attempting to bind to a null variable tabEdicao.
As you don't appear to be using the tabview variable in the backing bean, my recommendation would be to get rid of it. If you really need it, just initialize it:
private TabView tabEdicao = new TabView();
Kolossus:
This issue was resolved when I added the attibute dynamic="true" to dialog. Actually, the real value was dynamic=#{empty proprietarioMB.proprietario}, because I was geting NullPointerException when loading the page. proprietario property is loaded towards #PostConstruct method.
i want to add exporting for dynamic columns.
I think that should go. Dynamic Columns Export Data
I used the samplecode from Primefaces and edit it: Primefaces Example
The Code works, but the data isn't correct.
The File include the dynamic Data like data[i], data[i], .... and not the attributes in data[i].
Any idea?
<!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:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:my="http://java.dynamic.list.de"
xmlns:p="http://primefaces.org/ui">
<ui:composition template="META-INF/templates/Template.xhtml">
<ui:define name="content">
<h:form id="form" enctype="multipart/form-data">
<h:panelGrid columns="3">
<h:selectOneMenu id="showColl" value= "#{searchBean.collList.currentColl}" rendered = "#{searchBean.search.visible}">
<f:selectItems value="#{searchBean.collList.collList}" />
</h:selectOneMenu>
<h:outputText value="#{msgs.collection}" rendered = "#{searchBean.search.hide}"></h:outputText>
<h:outputText value="#{searchBean.collList.currentColl}" rendered = "#{searchBean.search.hide}"></h:outputText>
<h:commandButton id="show" action="#{searchBean.showFieldList}" value="#{msgs.plus}" rendered="#{searchBean.search.visible}" style=""/>
<h:commandButton id="hide" action="#{searchBean.hideFieldList}" value="#{msgs.minus}" rendered="#{searchBean.search.hide}" immediate="true" onchange="this.form.submit()" style=""/>
</h:panelGrid>
<h:panelGrid columns="1" rendered="#{searchBean.search.hide}">
<h:panelGrid columns="2">
<h:outputLabel value="#{msgs.Attr}"></h:outputLabel>
<h:selectOneMenu id="Field"
value="#{searchBean.collList.currentField}"
rendered="#{searchBean.search.readWrite}">
<f:selectItems
value="#{searchBean.collList.fieldList}" />
</h:selectOneMenu>
<h:outputText value="#{searchBean.collList.currentField}" rendered="#{searchBean.search.readOnly}"></h:outputText>
</h:panelGrid>
<h:panelGrid columns="2">
<h:outputLabel value="#{msgs.value}"></h:outputLabel>
<h:inputText value="#{searchBean.search.value}" rendered = "#{searchBean.search.readWrite}"></h:inputText>
<h:outputText value="#{searchBean.search.value}" rendered = "#{searchBean.search.readOnly}"></h:outputText>
</h:panelGrid>
<h:panelGrid columns="3">
<h:outputText value="#{msgs.sort_Order}"/>
<h:selectOneRadio id="sortOrder"
value="#{searchBean.search.ascendingData}"
immediate="true" onchange="this.form.submit()">
<f:selectItem itemLabel="#{msgs.ascending}" itemValue="a" itemDisabled="#{searchBean.search.readOnly}"/>
<f:selectItem itemLabel="#{msgs.descending}" itemValue="d" itemDisabled="#{searchBean.search.readOnly}"/>
</h:selectOneRadio>
</h:panelGrid>
</h:panelGrid>
<h:commandButton id="search" action="#{searchBean.searchButton}" value="#{msgs.search}" style=""/>
<p:dataTable id="datas" var="data" value="#{searchBean.readListMap.items}" style="width:150px"
scrollable="true" scrollWidth="800" scrollHeight="400" emptyMessage="Keine Daten vorhanden">
<p:columns value="#{searchBean.collList.fieldListColumns}" var="columnName" columnIndexVar="i" style="width:150px" headerText="#{columnName}">
#{data[i]}
</p:columns>
</p:dataTable>
<h:commandLink>
<p:graphicImage library="images" name="csv.png" />
<p:dataExporter type="csv" target="datas" fileName="assetDB" />
</h:commandLink>
<h:commandLink>
<p:graphicImage library="images" name="xml.png" />
<p:dataExporter type="xml" target="datas" fileName="assetDB" />
</h:commandLink>
</h:form>
</ui:define>
</ui:composition>
</html>
I used this code toe create the file.
result i a StringBuilder to create your costum string. i created a specific cvs file.
String tempString = result.toString();
InputStream stream = new ByteArrayInputStream(tempString.getBytes("UTF-8"));
Timestamp tstamp = new Timestamp(System.currentTimeMillis());
file = new DefaultStreamedContent(stream, "application/cvs", "test-"+tstamp+".cvs");
I write in the xhtml file the example from primefaces Primefaces example. Hope this helps other people to have problems with dynamic columns and primefaces to export the data.
When I click on log out button, primefaces' components are strewed before the login.xhtml page appears !
the action property calls the logout() function.
the source code of the logout() function is :
public String logout() throws IOException
{
HttpServletRequest request = ((HttpServletRequest) FacesContext.getCurrentInstance().getExternalContext().getRequest());
request.getSession().removeAttribute("userManager");
request.getSession().invalidate();
return "../login.xhtml";
}
I used <p:dock> with items component in the page which calls the logout function, and images (items) are layed vertically when I click logout button.
here is my Login.xhtml page :
<!DOCTYPE html>
<h:head>
<title>Login Page</title>
</h:head>
<h:body>
<h:form>
Votre code alliance : #{loginBean.codeAliance} <br/>
<h:panelGrid columns="2" cellpadding="5" >
<h:outputLabel for="codeAliance" value="Code Aliance:" />
<p:inputText value="#{userManager.codeAliance}" id="codeAliance" required="true" label="codeAliance" />
<h:outputLabel for="password" value="Password:" />
<p:password value="#{userManager.password}" id="password" required="true" label="password" />
<f:facet name="footer">
<p:commandButton id="loginButton" value="Login" action="#{userManager.connexion}" ajax="false"/>
</f:facet>
</h:panelGrid>
</h:form>
</h:body>
And here is bienvenue.xhtml page which contains <p:dock> :
<!DOCTYPE html>
<h:head>
<title>Premier exemple JSF 2.0</title>
</h:head>
<h:body>
<h:form>
<p:dock position="top">
<p:menuitem value="Users" icon="/Images/Users.png" url="#"/>
<p:menuitem value="Quitter" icon="/Images/Logout.png" url="#"/>
<p:menuitem value="Users" icon="/Images/Users.png" url="#"/>
<p:menuitem value="Users" icon="/Images/Users.png" url="#"/>
</p:dock>
</h:form>
<p:commandButton value="lyes" icon="/Images/Logout.png" action="#{userManager.logout}"/>
</h:body>
Can someone help me !?
I have this problem, in one page when I click commandButton "editer" it works : it runs the method in managedBean and it returns me to the target page but in this target page I must double click the link button to send me to the other target page, but if I click only the "annuler" button (it only redirect me to the target page without any changes in the database) I don't have this problem
Here is the page that contains "editer" and "annuler" button :
<?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="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core">
<body>
<ui:composition template="./template_admin.xhtml">
<ui:define name="content">
<p:panel header="Edition d'un utilisateur" id="panel" >
<h:panelGrid columns="2" columnClasses="column" cellpadding="5">
<h:outputText value="Nom : " />
<p:inplace id="basic" emptyLabel="Veuillez saisir un Nom" editor="true" >
<p:inputText value="#{editUserController.u1.nom}" />
</p:inplace>
<h:outputText value="Prénom : " />
<p:inplace id="basic1">
<p:inputText value="#{editUserController.u1.prenom}" />
</p:inplace>
<h:outputText value="Type (Dlbclick): "/>
<p:inplace id="selectableInplace" label="#{editUserController.u1.type}" effectSpeed="fast" event="dblclick">
<p:selectOneMenu label="Type d'impression" id="rfhfbs" value="#{editUserController.u1.type}" required="true" requiredMessage="veuillez choisir un type d'impression" >
<f:selectItems value="#{editUserController.types}" />
</p:selectOneMenu>
</p:inplace>
<h:outputText value="Division : " />
<p:inplace id="basic2">
<p:inputText value="#{editUserController.u1.division}" />
</p:inplace>
<h:outputText value="Grade : " />
<p:inplace id="basic3">
<p:inputText value="#{editUserController.u1.grade}" />
</p:inplace>
<h:outputText value="Téléphone du poste : " />
<p:inplace id="basic4">
<p:inputText value="#{editUserController.u1.telPoste}" />
</p:inplace>
<h:outputText value="Email : " />
<p:inplace id="basic5">
<p:inputText value="#{editUserController.u1.email}" />
</p:inplace>
<h:outputText value="Autres : " />
<p:inplace id="basic6">
<p:inputText value="#{editUserController.u1.autres}" />
</p:inplace>
<h:outputText value="Identifiant : " />
<p:inplace id="basic7">
<p:inputText value="#{editUserController.u1.identifiant}" />
</p:inplace>
<h:outputText value="Mot de passe : " />
<p:inplace id="basic8">
<p:inputText value="#{editUserController.u1.motdepasse}" />
</p:inplace>
<h:outputText value="Retapez le Mot de passe : " />
<p:inplace id="basic9">
<p:inputText value="#{editUserController.u1.motdepasse}" />
</p:inplace>
</h:panelGrid>
<p:commandButton value="Editer" action="#{editUserController.updateUser()}" update="panel" ></p:commandButton>
<p:commandButton value="Annuler" action="utilisateurs" ajax="false" ></p:commandButton>
</p:panel>
</ui:define>
</ui:composition>
</body>
</html>
This above works well
Here is the target page in both cases:
<?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="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html">
<body>
<ui:composition template="./template_admin.xhtml">
<ui:define name="content">
<p:commandButton value="ajouter" style="margin-bottom: 20px;" />
<p:dataTable id="carsTable" var="car" value="#{utilisateursController.lu}">
<f:facet name="header">
Expand rows to see detailed information
</f:facet>
<p:column style="width:4%">
<p:rowToggler />
</p:column>
<p:column style="width:48%">
<f:facet name="header">
Id
</f:facet>
<h:outputText value="#{car.id}" />
</p:column>
<p:column style="width:48%">
<f:facet name="header">
Nom et prénom
</f:facet>
<h:outputText value="#{car.nom} #{car.prenom}" />
</p:column>
<p:column>
<p:commandLink ajax="false" value="Editer" action="updateUser_v1" >
<f:setPropertyActionListener value="#{car}" target="#{editUserController.u1}" />
</p:commandLink>
</p:column>
<p:column>
<p:commandLink value="supprimer" />
</p:column>
<p:rowExpansion>
<h:panelGrid id="display" columns="2" cellpadding="4" style="width:300px;"
styleClass=" ui-widget-content grid">
<h:outputText value="Division : " />
<h:outputText id="model" value="#{car.division}" />
<h:outputText value="Grade : " />
<h:outputText id="year" value="#{car.grade}" />
<h:outputText value="Type : " />
<h:outputText value="#{car.type}"/>
<h:outputText value="Télephone du poste : " />
<h:outputText value="#{car.telPoste}"/>
<h:outputText value="Email : " />
<h:outputText value="#{car.email}"/>
<h:outputText value="Autres : " />
<h:outputText value="#{car.autres}"/>
<h:outputText value="Identifiant : " />
<h:outputText value="#{car.identifiant}"/>
<h:outputText value="Mot de passe : " />
<h:outputText value="#{car.motdepasse}"/>
</h:panelGrid>
<h:commandLink value="liste des commandes" ></h:commandLink><br></br>
<h:commandLink value="liste des messages" ></h:commandLink>
</p:rowExpansion>
</p:dataTable>
</ui:define>
</ui:composition>
</body>
</html>
In this page just above I have the problem
And here is all managedBean :
#ManagedBean
#ViewScoped
public class utilisateursController implements Serializable{
utilisateursHelper uh;
List<Utilisateur> lu;
public List<Utilisateur> getLu() {
return lu;
}
/**
* Creates a new instance of utilisateurs
*/
public utilisateursController() {
uh = new utilisateursHelper();
lu = uh.getUtilisateurs();
}
}
And here is the other managedBean :
#ManagedBean
#SessionScoped
public class editUserController implements Serializable{
utilisateursHelper uh;
Utilisateur u1;
String[] Types = {"utilisateur", "operateur", "admin"};
public String[] getTypes() {
return Types;
}
public Utilisateur getU1() {
return u1;
}
public void setU1(Utilisateur u1) {
this.u1 = u1;
}
/**
* Creates a new instance of editUserController
*/
public editUserController() {
u1 = new Utilisateur();
uh = new utilisateursHelper();
}
public String updateUser() {
uh.updateUtilisateur(u1);
return "utilisateurs";
}
}
And here is the facelet template :
<!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:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<h:outputStylesheet name="style.css" library="css" />
<h:outputStylesheet name="styleTableExpansion.css" library="css" />
</h:head>
<h:body>
<div id="page">
<div id="bloc-principal">
<h:form prependId="false">
<div id="templatemo_header_wrapper">
<div id="templatemo_header">
<div id="site_title">
<h1>
<span>vous etes connect en tant qu' #{userController.u1.nom} mais le newNum #{commmandeController.nouvelId}</span>
</h1>
</div>
<ul class="social_network">
<li><a id="ident">1dd</a></li>
<li>on voie celle ci</li>
<li><a class="identifiant">#{userController.identifiant}2ddd</a></li>
<li><h:commandLink action="#{userController.deconnecter}"><h:graphicImage library="images" name="facebook.png" /></h:commandLink></li>
</ul>
</div> <!-- end of templatemo_header -->
</div> <!-- end of templatemo_header_wrapper -->
<div id="templatemo_banner_wrapper">
<div id="templatemo_banner">
</div> <!-- end of templatemo_banner -->
</div> <!-- end of templatemo_banner_wrapper -->
<div id="templatemo_content_wrapper">
<div id="templatemo_content">
<ui:insert name="content">content</ui:insert>
</div> <!-- end of templatemo_content -->
</div> <!-- end of templatemo_content_wrapper -->
</h:form>
</div>
<div id="templatemo_footer_wrapper">
<div id="templatemo_footer">
<center>
</center>
</div> <!-- end of footer -->
</div>
</div>
</h:body>
</html>
I hope I have explained well my problem.
Thank you in advance.
try setting ajax="false" in case of <p:commandButton/>
This is the first time I am using prime 3.3.1 with JSF 2.1. I have all the necessary jars for prime faces and I am using the Wizard from their website https://www.primefaces.org/showcase/ui/panel/wizard.xhtml.
Here is my code:
wizard.xthml:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<div xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:p="http://primefaces.org/ui"
lang="en" xml:lang="en" style="padding-bottom: 8px;">
<h:form>
<p:growl id="growl" sticky="true" showDetail="true" />
<p:wizard widgetVar="wiz" flowListener="#{userWizard.onFlowProcess}">
<p:tab id="personal" title="Personal">
<p:panel header="Personal Details">
<h:messages errorClass="error" />
<h:panelGrid columns="2" columnClasses="label, value" styleClass="grid">
<h:outputText value="Firstname: *" />
<p:inputText required="true" label="Firstname" value="#{userWizard.user.firstname}" />
<h:outputText value="Lastname: *" />
<p:inputText required="true" label="Lastname" value="#{userWizard.user.lastname}" />
<h:outputText value="Age: " />
<p:inputText value="#{userWizard.user.age}" />
<h:outputText value="Skip to last: " />
<h:selectBooleanCheckbox value="#{userWizard.skip}" />
</h:panelGrid>
</p:panel>
</p:tab>
<p:tab id="address" title="Address">
<p:panel header="Adress Details">
<h:messages errorClass="error" />
<h:panelGrid columns="2" columnClasses="label, value">
<h:outputText value="Street: " />
<p:inputText value="#{userWizard.user.street}" />
<h:outputText value="Postal Code: " />
<p:inputText value="#{userWizard.user.postalCode}" />
<h:outputText value="City: " />
<p:inputText value="#{userWizard.user.city}" />
<h:outputText value="Skip to last: " />
<h:selectBooleanCheckbox value="#{userWizard.skip}" />
</h:panelGrid>
</p:panel>
</p:tab>
<p:tab id="contact" title="Contact">
<p:panel header="Contact Information">
<h:messages errorClass="error" />
<h:panelGrid columns="2" columnClasses="label, value">
<h:outputText value="Email: *" />
<p:inputText required="true" label="Email" value="#{userWizard.user.email}" />
<h:outputText value="Phone: " />
<p:inputText value="#{userWizard.user.phone}" />
<h:outputText value="Additional Info: " />
<p:inputText value="#{userWizard.user.info}" />
</h:panelGrid>
</p:panel>
</p:tab>
<p:tab id="confirm" title="Confirmation">
<p:panel header="Confirmation">
<h:panelGrid id="confirmation" columns="6">
<h:outputText value="Firstname: " />
<h:outputText styleClass="outputLabel" value="#{userWizard.user.firstname}" />
<h:outputText value="Lastname: " />
<h:outputText styleClass="outputLabel" value="#{userWizard.user.lastname}" />
<h:outputText value="Age: " />
<h:outputText styleClass="outputLabel" value="#{userWizard.user.age}" />>
<h:outputText value="Street: " />
<h:outputText styleClass="outputLabel" value="#{userWizard.user.street}" />
<h:outputText value="Postal Code: " />
<h:outputText styleClass="outputLabel" value="#{userWizard.user.postalCode}" />
<h:outputText value="City: " />
<h:outputText styleClass="outputLabel" value="#{userWizard.user.city}" />
<h:outputText value="Email: " />
<h:outputText styleClass="outputLabel" value="#{userWizard.user.email}" />
<h:outputText value="Phone " />
<h:outputText styleClass="outputLabel" value="#{userWizard.user.phone}" />
<h:outputText value="Info: " />
<h:outputText styleClass="outputLabel" value="#{userWizard.user.info}" />
<h:outputText />
<h:outputText />
</h:panelGrid>
<p:commandButton value="Submit" update="growl" actionListener="#{userWizard.save}" />
</p:panel>
</p:tab>
</p:wizard>
</h:form>
</div>
UserWizard.java:
package com.verisign.vcc.program.marketing.mbean;
import javax.faces.event.ActionEvent;
import org.primefaces.event.FlowEvent;
public class UserWizard
{
private boolean skip;
public void save(ActionEvent actionEvent)
{
// Persist user
}
public boolean isSkip()
{
return skip;
}
public void setSkip(boolean skip)
{
this.skip = skip;
}
public String onFlowProcess(FlowEvent event)
{
if (skip)
{
skip = false; // reset in case user goes back
return "confirm";
}
else
{
return event.getNewStep();
}
}
}
When I access the wizard.xhtml I am getting the wizard with no styles.
But here is how it is in the prime faces website:
Could you please tell me what am I missing?
The problem is that you're using invalid Facelets markup. You shouldn't use a normal html div tag and stick namespace declarations in it.
For this purpose you should either use a page starting with html having h:head and h:body tags in it or use ui:composition for templating.
In the example below, JSF resources and PrimeFaces themes will be added properly.
XHTML page
<?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:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
</h:head>
<h:body>
<!-- your code here -->
</h:body>
</html>
I hope it helps.