every time if an error occurs, I get the following error message in the error page.
This is my page.xhtml :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.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:p="http://primefaces.org/ui">
<f:view contentType="text/html">
<h:head>
<f:facet name="first">
<meta http-equiv="X-UA-Compatible" content="EmulateIE8" />
<meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
<title>Esprit4Olap</title>
</f:facet>
<link type="text/css" rel="stylesheet" href="#{request.contextPath}/css/default.css" />
<link type="text/css" rel="stylesheet" href="#{request.contextPath}/css/syntaxhighlighter/syntaxhighlighter.css" />
<style type="text/css">
.nestedUnit {
border:0px none !important;
}
.ui-layout-center .ui-layout-resizer {
border:1px solid #A8A8A8 !important;
}
.ui-tree-item span {
float:left !important;
}
.ui-tree {
border:0px none !important;
}
.ui-tabs {
border:0px none !important;
}
</style>
</h:head>
<h:body>
<p:layoutUnit position="west" size="200" resizable="true" collapsible="true" header="TreeNode">
<h:form>
<p:tree value="#{SchemaMan.shemaBoxses}" var="SchemaMan" selectionMode="Singel" selection="#{SchemaMan.shemaBoxse}" style="width:170px">
<p:treeNode icon="ui-icon-mail-closed">
<h:outputText value="SchemaMan"/>
</p:treeNode>
<p:treeNode type="i" icon="ui-icon-mail-closed">
<h:outputText value="SchemaMan"/>
</p:treeNode>
<p:treeNode type="s" icon="ui-icon-transfer-e-w">
<h:outputText value="SchemaMan"/>
</p:treeNode>
<p:treeNode type="t" icon="ui-icon-trash">
<h:outputText value="SchemaMan"/>
</p:treeNode>
<p:treeNode type="j" icon="ui-icon-alert">
<h:outputText value="SchemaMan"/>
</p:treeNode>
</p:tree>
</h:form>
</p:layoutUnit>
<p:layoutUnit position="center">
<p:layout>
<p:layoutUnit position="north" size="50%" resizable="true" styleClass="nestedUnit">
<p:tabView>
<p:tab title="Schema">
<h:form>
<p:panelGrid columns="2">
<p:inputText id="Schemaname" required="true" label="SchemaName" size="40" value="#{SchemaMan.nameSchema}" />
<p:inputText id="DescSchema" required="true" label="DescSchema" size="40" value="#{SchemaMan.descSchema}" />
<p:inputText id="RoleSchema" required="true" label="RoleSchema" size="40" value="#{SchemaMan.roleSchema}" />
<p:inputText id="CaptionSchema" required="true" label="CaptionSchema" size="40" value="#{SchemaMan.captionSchema}" />
</p:panelGrid>
<p:commandButton value="Add" type="button" ></p:commandButton>
</h:form>
</p:tab>
</p:tabView>
</p:layoutUnit>
</p:layout>
</p:layoutUnit>
</h:body>
</f:view>
</html>
The error itself, however, is not related to javax.faces.component.UIOutput. It can be just any error in one of the managed beans.
and i got this erros exception:
javax.servlet.ServletException: javax.faces.component.UIOutput cannot be cast to org.primefaces.component.layout.Layout
javax.faces.webapp.FacesServlet.service(FacesServlet.java:606)
Any help is appreciated.
Thanks,
i make it like you told me :
<h:body>
<p:layout>
<p:layoutUnit position="west" size="200" resizable="true" collapsible="true" header="TreeNode">
<h:form>
<p:tree value="#{SchemaMan.shemaBoxses}" var="SchemaMan" selectionMode="Singel" selection="#{SchemaMan.shemaBoxse}" style="width:170px">
<p:treeNode icon="ui-icon-mail-closed">
<h:outputText value="SchemaMan"/>
</p:treeNode>
<p:treeNode type="i" icon="ui-icon-mail-closed">
<h:outputText value="SchemaMan"/>
</p:treeNode>
<p:treeNode type="s" icon="ui-icon-transfer-e-w">
<h:outputText value="SchemaMan"/>
</p:treeNode>
<p:treeNode type="t" icon="ui-icon-trash">
<h:outputText value="SchemaMan"/>
</p:treeNode>
<p:treeNode type="j" icon="ui-icon-alert">
<h:outputText value="SchemaMan"/>
</p:treeNode>
</p:tree>
</h:form>
</p:layoutUnit>
</p:layout>
<p:layout>
<p:layoutUnit position="center">
<p:layoutUnit position="north" size="50%" resizable="true" styleClass="nestedUnit">
<p:tabView>
<p:tab title="Schema">
<h:form>
<p:panelGrid columns="2">
<p:inputText id="Schemaname" required="true" label="SchemaName" size="40" value="#{SchemaMan.nameSchema}" />
<p:inputText id="DescSchema" required="true" label="DescSchema" size="40" value="#{SchemaMan.descSchema}" />
<p:inputText id="RoleSchema" required="true" label="RoleSchema" size="40" value="#{SchemaMan.roleSchema}" />
<p:inputText id="CaptionSchema" required="true" label="CaptionSchema" size="40" value="#{SchemaMan.captionSchema}" />
</p:panelGrid>
<p:commandButton value="Add" type="button" ></p:commandButton>
</h:form>
</p:tab>
</p:tabView>
</p:layoutUnit>
</p:layoutUnit>
</p:layout>
</h:body>
but i get this exception now :
exception
javax.servlet.ServletException: JBAS011048: Failed to construct component instance
javax.faces.webapp.FacesServlet.service(FacesServlet.java:606) !!
You have two p:layout ? Every p:layoutUnit should be inside a whole p:layout. Take into account that you can nest a p:layout inside a p:layoutUnit to make more complex layouts (and of course, every p:layout HAS to have a p:layoutUnit position="center":
<p:layout>
<p:layoutUnit position="west" size="200">
...
</p:layoutUnit>
<p:layoutUnit position="center">
<p:layout>
<p:layoutUnit position="north" size="100">
...
</p:layoutUnit>
<p:layoutUnit position="center">
...
</p:layoutUnit>
</p:layout>
</p:layoutUnit>
...
</p:layout>
Remember that if you use a p:layout for your whole page, you might be better off with p:layout fullPage="true". Cheers!
Related
hello I have this page which work correctly and where I change pages dynamically
from bean with include tag:
<!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:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">
<h:head></h:head>
<h:body>
<p:layout fullPage="true">
<p:layoutUnit position="north" size="50" id="top">
<ui:include src="/WEB-INF/template/header.xhtml" />
</p:layoutUnit>
<p:layoutUnit position="south" size="20">
<ui:include src="/WEB-INF/template/footer.xhtml" />
</p:layoutUnit>
<p:layoutUnit position="west" size="400">
<h:form>
<f:ajax render=":centerContentPanel" execute="#this">
<h:commandLink value="page1" action="#{navigationBean.doNav}" update=":centerContentPanel">
<f:param name="test" value="/WEB-INF/pages/profil" />
</h:commandLink>
<h:commandLink value="page2" action="#{navigationBean.doNav}" process="#this">
<f:param name="test" value="/WEB-INF/pages/users" />
</h:commandLink>
</f:ajax>
</h:form>
</p:layoutUnit>
<p:layoutUnit position="center" size="400">
<h:panelGroup id="centerContentPanel">
<ui:include src="#{navigationBean.pageName}.xhtml" />
</h:panelGroup>
</p:layoutUnit>
</p:layout>
</h:body>
</html>
In the included pages I have a dialog which contain and included page also.
When I open the dialog the screen stuck and I can't change anything or press anything it become like a disabled page.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition 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://xmlns.jcp.org/jsf/facelets">
<h:form id="form">
<p:growl id="message" showDetail="true" globalOnly="true" />
<p:dataTable var="user" value="#{usersBean.users}" paginator="true"
reflow="true" widgetVar="multipleDT" resizableColumns="true"
id="multipleDT"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
rowsPerPageTemplate="5,10,15" selectionMode="single"
selection="#{usersBean.selectedUser}" rowKey="#{user.util}">
<p:ajax event="rowSelect" listener="#{usersBean.onRowSelect}"
update="b4 b3 :form:pickList :form:Submit" />
<p:ajax event="rowUnselect" listener="#{usersBean.onRowUnselect}"
update="b4 b3 :form:pickList :form:Submit" />
<p:column headerText="util" filterMatchMode="contains"
filterBy="#{user.util}" sortBy="#{user.util}" reflow="true">
<h:outputText value="#{user.util}" />
</p:column>
<p:column headerText="nom" filterMatchMode="contains"
filterBy="#{user.nom}" sortBy="#{user.nom}" reflow="true">
<h:outputText value="#{user.nom}" />
</p:column>
<p:column headerText="prenom" filterMatchMode="contains"
filterBy="#{user.prenom}" sortBy="#{user.prenom}" reflow="true">
<h:outputText value="#{user.prenom}" />
</p:column>
<p:column headerText="mail" filterMatchMode="contains"
filterBy="#{user.mail}" sortBy="#{user.mail}" reflow="true">
<h:outputText value="#{user.mail}" />
</p:column>
<f:facet name="footer">
<p:commandButton id="b3" value="ajouter"
oncomplete="PF('dlg3').show();" process="#this" ajax="true"
update="#widgetVar(dlg3) multipleDT">
</p:commandButton>
<p:commandButton id="b4" value="modifier"
disabled="#{usersBean.dis}" oncomplete="PF('dlg2').show();"
ajax="true" process="#this" update="#widgetVar(dlg2) multipleDT">
</p:commandButton>
</f:facet>
</p:dataTable>
<p:pickList id="pickList" value="#{usersBean.profilNonAffecte}"
var="Profil" itemLabel="#{Profil.libProfil}" itemValue="#{Profil}"
effect="bounce" responsive="true" showSourceFilter="true"
showTargetFilter="true" filterMatchMode="contains"
disabled="#{usersBean.dis}" style="width:50%;margin-top:20px;"
converter="primeFacesPickListConverter">
<f:facet name="sourceCaption">Available</f:facet>
<f:facet name="targetCaption">Starting</f:facet>
</p:pickList>
<p:commandButton id="Submit" value="Submit" style="margin-top:5px"
action="#{usersBean.commit}" update="pickList form:message"
disabled="#{usersBean.dis}" />
</h:form>
<h:form>
<p:dialog style="font-size:12px;" widgetVar="dlg3" resizable="false"
width="800" showEffect="explode" hideEffect="explode" modal="true"
id="dlg3" dynamic="true">
<ui:include src="/WEB-INF/pages/ajoutUser.xhtml" />
</p:dialog>
</h:form>
<h:form>
<p:dialog style="font-size:12px;" widgetVar="dlg2" resizable="false"
width="800" showEffect="explode" hideEffect="explode" modal="true"
id="dlg2" dynamic="true">
<ui:include src="/WEB-INF/pages/modifUser.xhtml" />
</p:dialog>
</h:form>
</ui:composition>
dialog code
<ui:composition 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://xmlns.jcp.org/jsf/facelets">
<h:panelGrid columns="2" id="grid">
<p:outputLabel for="ta4" value="date début :" />
<p:calendar id="ta4" value="#{usersBean.selectedUser.dateDeb}"
showOn="button" label="date début" required="true"
binding="#{startDateComponent}" pattern="dd/MM/yyyy" navigator="true">
<p:message for="ta4" />
<p:ajax event="dateSelect" listener="#{usersBean.onDateSelect}"
update="ta4" />
</p:calendar>
<p:outputLabel for="ta5" value="date fin :" />
<p:calendar id="ta5" value="#{usersBean.selectedUser.dateFin}"
showOn="button" label="date fin" required="true" pattern="dd/MM/yyyy"
mode="popup">
<f:validator validatorId="dateRangeValidator" />
<f:attribute name="startDateComponent" value="#{startDateComponent}" />
<p:message for="ta5" />
</p:calendar>
<p:outputLabel for="ta6" value="nom :" label="nom" />
<p:inputText rows="6" cols="33" id="ta6"
value="#{usersBean.selectedUser.nom}" required="true">
<p:message for="ta6" />
</p:inputText>
<p:outputLabel for="ta7" value="prénom :" />
<p:inputText rows="6" cols="33" id="ta7"
value="#{usersBean.selectedUser.prenom}" required="true"
label="prenom">
<p:message for="ta7" />
</p:inputText>
<p:outputLabel for="ta8" value="mail :" />
<p:inputText rows="6" cols="33" id="ta8"
value="#{usersBean.selectedUser.mail}" required="true" label="mail"
validatorMessage="email format error ">
<f:validateRegex
pattern="^[_A-Za-z0-9-\+]+(\.[_A-Za-z0-9-]+)*#[A-Za-z0-9-]+(\.[A-Za-z0-9]+)*(\.[A-Za-z]{2,})$" />
<p:message for="ta8" />
</p:inputText>
<p:outputLabel for="chk" value="Valid :" />
<p:selectBooleanCheckbox value="#{usersBean.selectedUser.valid}"
id="chk" />
<p:commandButton value="confirmer" id="ajax"
actionListener="#{usersBean.modifier}"
styleClass="ui-priority-primary" update="grid form:message form:multipleDT" >
</p:commandButton>
</h:panelGrid>
</ui:composition>
i find it the problem was modal="true" in the dialog
Is there anyway to resize the <p:ring>? I tried with "width" and "height" but it didn't work. The windows are always small and I want them bigger.
This is the XHTML code:
<ui:composition 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"
template="/template/templatePCD1.xhtml"
xmlns:p="http://primefaces.org/ui"
xmlns:fn="http://java.sun.com/jsp/jstl/functions">
<ui:define name="pageTitle">Groupe details</ui:define>
<ui:define name="pageContent" >
<h:form id="form" >
<h3 style="margin-top: 0">Groupe details</h3>
<p:ring id="custom" value="#{allGroupeBean.groupes}" var="car" >
<p:panel >
<p:column >
<p:panelGrid columns="1" >
<h:outputText value="#{car.nom}" />
<p:commandButton update=":form:carDetail" icon="ui-icon-search" title="View" oncomplete="PF('carDialog').show();" >
<f:setPropertyActionListener value="#{car}" target=" #{allGroupeBean.selectedGroupe}" />
</p:commandButton>
</p:panelGrid>
</p:column>
<br/>
</p:panel>
</p:ring>
<p:dialog header="Groupe Info" widgetVar="carDialog" modal="true" showEffect="fade" hideEffect="fade" resizable="false" width="470">
<p:outputPanel id="carDetail" style="text-align:center;" layout="block">
<p:dataTable id="selectedCarsTable" var="car" value="# {allGroupeBean.selectedGroupe.teams}">
<p:column headerText="Teams">
<h:outputText value="#{car.nom}" />
</p:column>
<p:column headerText="Points">
<h:outputText value="#{car.point}" />
</p:column>
</p:dataTable>
</p:outputPanel>
</p:dialog>
</h:form>
</ui:define>
</ui:composition>
It shows small windows and I need bigger ones.
I am aware that nesting is a problem with form tags. However, my page does not have nested forms. I have one form (id="menuForm") to enclose the p:menu. Next, I have a form (id="locationForm") lower in the page. I have checked the html source that is output, and there is no nesting happening.
I have one p:commandButton that I want to use to submit the form. It works occasionally, but not all of the time. Sometimes, the method fires and other times it doesn't. Can anyone poing out what I'm doing wrong?
Also--If I comment out the menu form completely it works as intended.
Thanks.
Action Method:
public String insertLocationAction(){
System.out.println("******* Method Fired.");
DatabaseManager.insertLocation(newLocation);
return "locations";
}
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:h="http://xmlns.jcp.org/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
<f:view>
<ui:debug rendered="#{facesContext.application.projectStage eq 'Development'}"/>
<h:head />
<p:messages />
<p:layout fullPage="true">
<p:layoutUnit position="west" size="260" header="Menu" resizable="false" closable="false">
<h:form id="menuForm">
<p:menu style="width: 240px;" >
<p:submenu label="Locations" style="width: 240px;">
<p:menuitem value="All Locations" outcome="/pages/locations.xhtml" style="width: 240px;" />
<p:menuitem value="Create New" action="#{locationBackingBean.addLocationAction}" style="width: 240px;" />
</p:submenu>
<p:submenu label="Queries" style="width: 240px;">
<p:menuitem value="Product Group Sales" outcome="/pages/productGroupSales.xhtml" style="width: 240px;" />
<p:menuitem value="Product Line Sales" outcome="/pages/productLineSales.xhtml" style="width: 240px;" />
</p:submenu>
</p:menu>
</h:form>
</p:layoutUnit>
<p:layoutUnit position="center">
<h:form id="locationform" enctype="multipart/form-data">
<p:growl id="growl" showDetail="true" />
<p:panelGrid columns="2">
<f:facet name="header">Enter New Location Details</f:facet>
<h:outputLabel for="locationName" value="Location Name:" /> <p:inputText id="locationName" value="#{locationBackingBean.newLocation.locationName}" size="100" />
<h:outputLabel for="street1" value="Street Address1:" /> <p:inputText id="street1" value="#{locationBackingBean.newLocation.street1}" size="100"/>
<h:outputLabel for="street2" value="Street Address2:" /><p:inputText id="street2" value="#{locationBackingBean.newLocation.street2}" size="100"/>
<h:outputLabel for="city" value="City:" /><p:inputText id="city" value="#{locationBackingBean.newLocation.city}" size="40" />
<h:outputLabel for="state" value="State:" /><p:inputText id="state" value="#{locationBackingBean.newLocation.state}" size="2" />
<h:outputLabel for="country" value="Country:" /><p:inputText id="country" value="#{locationBackingBean.newLocation.country}" size="20" />
<h:outputLabel for="phone" value="Phone:" /><p:inputText id="phone" value="#{locationBackingBean.newLocation.phone}" size="15" />
<h:outputLabel for="locationType" value="Type:" /><p:inputText id="locationType" value="#{locationBackingBean.newLocation.locationType}" />
</p:panelGrid>
<p:commandButton action="#{locationBackingBean.insertLocationAction}" ajax="false" value="Save" />
</h:form>
</p:layoutUnit>
</p:layout>
</f:view>
</html>
Refer to: http://www.primefaces.org/docs/vdl/4.0/primefaces-p/commandButton.html
By default the p:commandButton processes the whole 'view'.
Add process=":locationform" to the commandButton might just need "locationform" (depends on your selector working and nested jsf components etc..
I have primeface p:panel on jsf file. I apply background color with the following style on the template page (anasayfa.xhtml).
<h:head>
<style type="text/css">
.bos{background-color:red;}
</style>
</h:head>
My Jsf Page with viewscoped backing bean:
<ui:composition template="/anasayfa.xhtml">
<ui:define name="ortaAlan">
...
<p:panel styleClass="bos">
...
</p:panel>
</ui:define>
</ui:composition>
When I load page background color is seen for very shortly, then becomes transparent. CTRL+F5 has the same effect.
What is wrong here?
Thanks for helps in advance
jsf page:
<!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:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets">
<ui:composition template="/anasayfa.xhtml">
<ui:define name="ortaAlan">
<p:panel id="rezerveleriniz">
<h:outputText value="#{rezervasyonBean.bugun.time}">
<f:convertDateTime pattern="dd/MM/yyyy" />
</h:outputText> : Rezervasyon Saatleri <br/>
<ui:repeat var="r" value="#{rezervasyonBean.kullaniciRezervasyonSaatleri}">
#{r.saatAraligi}<br/>
</ui:repeat>
</p:panel>
<h:form id="aaa">
<p:panel>
<p:panel style="float:left;">
<h:panelGrid columns="1">
<ui:repeat var="rs" value="#{rezervasyonBean.rezervasyonSaatleriListesi}">
**// !!!!!!!!!!!! Problem is here !!!!!!!!**
<p:panel styleClass="#{rezervasyonBean.isRezervasyonOnThisDay(rs) ? 'dolu' : 'bos' }">
#{rs.saatAraligi}
<h:commandButton action="#{rezervasyonBean.sec(rs,'1')}" value="+" update=":rezerveleriniz" disabled="#{rezervasyonBean.isRezervasyonOnThisDay(rs)}" />
</p:panel>
</ui:repeat>
</h:panelGrid>
<h:commandButton action="#{rezervasyonBean.kaydet()}" value="Kaydet" />
</p:panel>
<div style="clear:both;"></div>
</p:panel>
</h:form>
</ui:define>
</ui:composition>
</html>
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:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
<title>Görev Takip Sistemi</title>
<style type="text/css">
.ui-widget,.ui-widget .ui-widget {
font-size: 12px !important;
font-family:Arial;
}
.bos{
background-color:red;
}
.dolu{
background-color:yellow;
}
#topPanel {z-index:2 !important; }
#topPanel div{overflow:visible;}
.colStyle_panelGridForGorev{
width:225px;
}
.colStyle_panelGridForProfil{
width:100px;
}
</style>
</h:head>
<body>
<p:growl for="growlForAnasayfa" showDetail="true" life="3000" autoUpdate="true"/>
<h:form>
<p:idleMonitor timeout="900000">
<p:ajax event="idle" listener="#{anasayfaBean.indirectLogout}"/>
</p:idleMonitor>
</h:form>
<p:ajaxStatus onstart="statusDialog.show();" onsuccess="statusDialog.hide();" />
<p:dialog modal="true" widgetVar="statusDialog" header="Status"
draggable="false" closable="false">
<p:graphicImage value="/images/statusBar.gif" />
</p:dialog>
<p:layout fullPage="true">
<p:layoutUnit position="north" size="50" id="topPanel" style="border:0px">
<h:form id="formAnaSayfaToolbar">
<p:toolbar>
<p:toolbarGroup align="left">
<p:commandButton type="submit" value="#{anasayfaBean.kullanici.kullaniciAdi} #{anasayfaBean.kullanici.kullaniciSoyadi}"
style="margin-left:200px;" action="/profil.xhtml?faces-redirect=true" ajax="false"/>
<p:commandButton type="submit" value="Gruplarım"
action="/kullanici/gruplarim.xhtml?faces-redirect=true" ajax="false" rendered="#{!anasayfaBean.daireBaskani}"/>
<p:commandButton type="submit" value="Görevlerim"
action="/gorevListele.xhtml?faces-redirect=true" ajax="false" rendered="#{!anasayfaBean.daireBaskani}"/>
<p:commandButton type="submit" value="Kullanıcı İşlemleri"
action="/daireBaskani/kullanici.xhtml?faces-redirect=true" ajax="false" rendered="#{anasayfaBean.daireBaskani}"/>
<p:commandButton type="submit" value="Grup İşlemleri"
action="/daireBaskani/grup.xhtml?faces-redirect=true" ajax="false" rendered="#{anasayfaBean.daireBaskani}"/>
<p:menuButton value="Görev İşlemleri" rendered="#{anasayfaBean.daireBaskani}">
<p:menuitem value="Yeni Görev Ekle" url="/daireBaskani/gorevEkle.btk" />
<p:menuitem value="Gorevleri Listele" url="/gorevListele.btk" />
</p:menuButton>
<p:menuButton value="Admin Paneli" rendered="#{anasayfaBean.admin}">
<p:menuitem value="Birim İşlemleri" url="/admin/birim.btk" />
<p:menuitem value="Ünvan İşlemleri" url="/admin/unvan.btk" />
</p:menuButton>
</p:toolbarGroup>
<p:toolbarGroup align="right">
<p:commandButton type="submit" value="Çıkış" icon="ui-icon-close"
action="#{anasayfaBean.logout}" ajax="false" style="margin-right:200px;"/>
</p:toolbarGroup>
</p:toolbar>
</h:form>
</p:layoutUnit>
<p:layoutUnit position="center">
<ui:insert name="ortaAlan">
<h:outputText value="Yukarıdaki menüden yapmak istediğiniz işlemi seçiniz." />
</ui:insert>
</p:layoutUnit>
<p:layoutUnit position="south" size="30" resizable="true" style="border-width:0px;">
<h:form style="text-align:center; font-size:13px;">
<h:outputText value="Bilişim Sistemleri Dairesi © 2012" />
</h:form>
</p:layoutUnit>
<p:layoutUnit position="east" size="200" id="eastPanel" style="border:0px">
</p:layoutUnit>
<p:layoutUnit position="west" size="200" id="westPanel" style="border:0px">
</p:layoutUnit>
</p:layout>
</body>
</html>
I am using JSF 2.1 and PrimeFaces 3.0.M4. I want to change center layout dynamically without reloading the main page on click of tree nodes.
The code of the main page MainExplorer.xhtml is:
<?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: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>
<title>XX</title>
</h:head>
<h:body>
<p:layout fullPage="true">
<p:layoutUnit position="north" size="100" header="Top" resizable="true" closable="false" collapsible="true">
<h:outputText value="Top unit content." />
</p:layoutUnit>
<p:layoutUnit position="south" size="100" header="Bottom" resizable="true" closable="false" collapsible="true">
<h:outputText value="South unit content." />
</p:layoutUnit>
<p:layoutUnit position="west" size="150" header="Left" resizable="true" closable="false" collapsible="true">
<h:form id="form" style="width: 150;" >
<p:growl id="messages" showDetail="true" />
<p:tree value="#{treeBean.root}" var="node" dynamic="true" cache="false" selectionMode="single" selection="#{treeBean.selectedNode}">
<p:ajax event="expand" update=":form:messages" listener="#{treeBean.onNodeExpand}" />
<p:ajax event="collapse" update=":form:messages" listener="#{treeBean.onNodeCollapse}" />
<p:ajax event="select" update=":form:messages" listener="#{treeBean.onNodeSelect}" />
<p:ajax event="unselect" update=":form:messages" listener="#{treeBean.onNodeUnselect}" />
<p:treeNode><h:outputText value="#{node}" /></p:treeNode>
</p:tree>
</h:form>
</p:layoutUnit>
<p:layoutUnit position="center" header="Welcome : user name" resizable="true" closable="true" collapsible="true">
</p:layoutUnit>
</p:layout>
</h:body>
</html>
I want to open a new page or (of?) diff-diff data tables on click of tree event.
E.g. CallListPage.xhtml. I want to open this page in center layout. There may be a number of pages open in center layout.
<?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:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core">
<h:head>
<title>XX</title>
</h:head>
<h:body>
<h:form id="usr1" title="Call List">
<p:growl id="growl" showDetail="true"/>
<p:dataTable var="callRow"
value="#{callList.callDataModel}"
rowKey="#{callRow.contspecs}"
selection="#{callList.advCallMstrSelected}" selectionMode="single"
paginator="true" rows="5"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
>
<p:ajax event="rowSelect" listener="#{callList.onRowSelect}" update=":usr1:display :usr1:growl" oncomplete="callDialog.show()" />
<p:ajax event="rowUnselect" listener="#{callList.onRowUnselect}" update=":usr1:growl"/>
<p:column><f:facet name="header">Specification</f:facet><h:outputText value="#{callRow.contspecs}"/></p:column>
<p:column><f:facet name="header">Exchange</f:facet><h:outputText value="#{callRow.exchange}"/></p:column>
<p:column><f:facet name="header">Symbol</f:facet><h:outputText value="#{callRow.symbol}"/></p:column>
<p:column><f:facet name="header">Call</f:facet><h:outputText value="#{callRow.call_type}"/></p:column>
<p:column><f:facet name="header">Trigger</f:facet><h:outputText value="#{callRow.trigger_price}"/></p:column>
<p:column><f:facet name="header">CMP</f:facet><h:outputText value="#{callRow.ltp}"/></p:column>
<p:column><f:facet name="header">SL</f:facet><h:outputText value="#{callRow.sl_price}"/></p:column>
<p:column><f:facet name="header">1st Tgt.</f:facet><h:outputText value="#{callRow.tg_1}"/></p:column>
<p:column><f:facet name="header">2nd Tgt.</f:facet><h:outputText value="#{callRow.tg_2}"/></p:column>
<p:column><f:facet name="header">3rd Tgt.</f:facet><h:outputText value="#{callRow.tg_3}"/></p:column>
<p:column><f:facet name="header">4th Tgt.</f:facet><h:outputText value="#{callRow.tg_4}"/></p:column>
<p:column><f:facet name="header">Status</f:facet><h:outputText value="#{callRow.call_status}"/></p:column>
<p:column><f:facet name="header">Call By</f:facet><h:outputText value="#{callRow.makerid}"/></p:column>
<f:facet name="footer">
<p:commandButton value="View" update="usr1:display" oncomplete="carDialog.show()"/>
</f:facet>
</p:dataTable>
<p:dialog header="Call Detail" widgetVar="callDialog" resizable="false" modal="true"
showEffect="explode" hideEffect="explode">
<h:panelGrid id="display" columns="2" cellpadding="4">
<h:outputText value="exchange" />
<h:outputText value="#{callList.advCallMstrSelected.exchange}" />
<h:outputText value="Valid Upto:" />
<h:outputText value="#{callList.advCallMstrSelected.valid_upto}" />
<h:outputText value="Offer at:" />
<h:outputText value="#{callList.advCallMstrSelected.call_price1}" />
<h:outputText value="Call Entry Time:" />
<h:outputText value="#{callList.advCallMstrSelected.call_entrytime}" />
<h:outputText value="Message Time:" />
<h:outputText value="#{callList.advCallMstrSelected.msg_genration_time}" />
<h:outputText value="1st Target Hit Time :" />
<h:outputText value="#{callList.advCallMstrSelected.tg_1_hit_time}" />
<h:outputText value="2nd Target Hit Time :" />
<h:outputText value="#{callList.advCallMstrSelected.tg_2_hit_time}" />
<h:outputText value="3rd Target Hit Time :" />
<h:outputText value="#{callList.advCallMstrSelected.tg_3_hit_time}" />
<h:outputText value="4th Target Hit Time :" />
<h:outputText value="#{callList.advCallMstrSelected.tg_4_hit_time}" />
<h:outputText value="Stop Loss Hit Time :" />
<h:outputText value="#{callList.advCallMstrSelected.sl_hit_time}" />
<h:outputText value="Call finish Time:" />
<h:outputText value="#{callList.advCallMstrSelected.call_close_time}" />
<h:outputText value="SMS to:" />
<h:outputText value="#{callList.advCallMstrSelected.sms_to_group}" />
<h:outputText value="Message Group:" />
<h:outputText value="#{callList.advCallMstrSelected.messagegroup}" />
<h:outputText value="SubScriber's Group:" />
<h:outputText value="#{callList.advCallMstrSelected.subscribersgroup}" />
<h:outputText value="Message Remarks:" />
<h:outputText value="#{callList.advCallMstrSelected.msg_remarks}" />
</h:panelGrid>
</p:dialog>
</h:form>
</h:body>
</html>
How can I open this?
Done by changing the line!!
old code
<p:ajax event="select" update=":form:messages" listener="#{treeBean.onNodeSelect}" />
<p:ajax event="unselect" update=":form:messages" listener="#{treeBean.onNodeUnselect}" />
new code
<p:ajax event="select" update=":formCenter:panelGroupCenter" listener="#{treeBean.onNodeSelect}" />
<p:ajax event="unselect" update=":formCenter:panelGroupCenter" listener="#{treeBean.onNodeUnselect}" />
for center layout use this :
<p:layoutUnit id="cent" position="center" header="Welcome : user name"
resizable="true" closable="true" collapsible="true">
<h:form id="formCenter" style="text-align: center" >
<h:panelGroup id="panelGroupCenter">
<ui:include src="#{treeBean.openPage}.xhtml" />
</h:panelGroup>
</h:form>
</p:layoutUnit>