I have a problem which I cannot solve. When I open JSF tab and I try to click on the buttons the page is not working.
Main page:
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"
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"
xmlns:c="http://java.sun.com/jsp/jstl/core">
<h:head>
<ui:insert name="header">
<ui:include src="header.xhtml"/>
</ui:insert>
<style type="text/css">
.settingsHashMap { font: 80% "Trebuchet MS", sans-serif;}
</style>
</h:head>
<h:body>
<h1><img src="resources/css/images/icon.png" alt="DX-57" /> Rack Management Center</h1>
<!-- layer for black background of the buttons -->
<div id="toolbar" style="margin: 0 auto; width:100%; height:30px; position:relative; background-color:black">
<!-- Include page Navigation -->
<ui:insert name="Navigation">
<ui:include src="Navigation.xhtml"/>
</ui:insert>
</div>
<div id="logodiv" style="position:relative; top:35px; left:0px;">
<h:graphicImage alt="Datacenter Profile" style="position:relative" value="resources/images/logo_datacenter_profile.png" />
</div>
<div id="main" style="margin: 0 auto; width:1190px; height:700px; position:absolute; background-color:transparent; top:105px">
<div id="mainpage" style="margin: 0 auto; width:1190px; height:500px; position:absolute; background-color:transparent; top:80px">
<div id="settingsHashMapz" class="settingsHashMap" style="width:1150px; height:400px; position:absolute; top:20px; left:1px">
<h:form prependId="false">
<h:panelGroup id="tabs" layout="block">
<ul>
<c:forEach items="#{DatacenterProfileController.tabs}" var="tab">
<li>#{tab.tabid}</li>
<h:commandButton id="button_#{tab.tabid}" value="TabClick" action="#{DatacenterProfileController.switchPages(tab.tabid)}" style="display:none">
<f:ajax render="tabs"></f:ajax>
</h:commandButton>
</c:forEach>
</ul>
<c:forEach items="#{DatacenterProfileController.tabs}" var="tab">
<h:panelGroup id="#{tab.tabid}" layout="block" rendered="#{tab.tabid eq DatacenterProfileController.selectedTab}">
<ui:include src="#{tab.tabfilename}"></ui:include>
</h:panelGroup>
</c:forEach>
</h:panelGroup>
</h:form>
</div>
</div>
</div>
</h:body>
</html>
Tab page:
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"
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"
xmlns:c="http://java.sun.com/jsp/jstl/core">
<h:head>
</h:head>
<h:body>
<ui:composition>
<h:panelGroup>
<h:form id="zones" >
<p:growl id="growl" showDetail="true" sticky="true" />
<!-- The sortable data table -->
<h:dataTable onmouseover="addOnclickToTabsDatatableRows();" id="dataTable" headerClass="columnHeader" value="#{DCProfileTabZonesController.dataList}" binding="#{zones}" var="item">
<!-- Check box -->
<h:column>
<f:facet name="header">
<h:selectBooleanCheckbox style="margin-left: 0px;" value="#{DCProfileTabZonesController.mainSelectAll}" class="checkall" >
<f:ajax listener="#{DCProfileTabZonesController.selectAll}" render="#form" />
</h:selectBooleanCheckbox>
</f:facet>
<h:selectBooleanCheckbox onclick="highlight(this)" value="#{DCProfileTabZonesController.selectedIds[item.datacenterid]}" >
<!-- if the user deselects one row deselect the main checkbox -->
<f:ajax listener="#{DCProfileTabZonesController.deselectMain}" render="#form" />
</h:selectBooleanCheckbox>
<!-- Click on table code -->
<h:outputLink id="lnkHidden" value="ZoneProfile.jsf" style="text-decoration:none; color:white; background-color:black">
<f:param name="id" value="#{item.datacenterid}" />
</h:outputLink>
</h:column>
............
</h:dataTable>
<!-- The paging buttons -->
<h:commandButton styleClass="bimage" value="first" action="#{DCProfileTabZonesController.pageFirst}"
disabled="#{DCProfileTabZonesController.firstRow == 0}" >
<f:ajax render="#form" execute="#form"></f:ajax>
</h:commandButton>
<h:commandButton styleClass="bimage" value="prev" action="#{DCProfileTabZonesController.pagePrevious}"
disabled="#{DCProfileTabZonesController.firstRow == 0}" >
<f:ajax render="#form" execute="#form"></f:ajax>
</h:commandButton>
<h:commandButton styleClass="bimage" value="next" action="#{DCProfileTabZonesController.pageNext}"
disabled="#{DCProfileTabZonesController.firstRow + DCProfileTabZonesController.rowsPerPage >= DCProfileTabZonesController.totalRows}" >
<f:ajax render="#form" execute="#form"></f:ajax>
</h:commandButton>
<h:commandButton styleClass="bimage" value="last" action="#{DCProfileTabZonesController.pageLast}"
disabled="#{DCProfileTabZonesController.firstRow + DCProfileTabZonesController.rowsPerPage >= DCProfileTabZonesController.totalRows}" >
<f:ajax render="#form" execute="#form"></f:ajax>
</h:commandButton>
<h:outputText value="Page #{DCProfileTabZonesController.currentPage} / #{DCProfileTabZonesController.totalPages}" />
<br />
<!-- The paging links -->
<ui:repeat value="#{DCProfileTabZonesController.pages}" var="page">
<h:commandLink value="#{page}" actionListener="#{DCProfileTabZonesController.page}"
rendered="#{page != DCProfileTabZonesController.currentPage}" style="text-decoration:none;color:white;">
<f:ajax render="#form" execute="#form"></f:ajax>
</h:commandLink>
<h:outputText value="#{page}" escape="false"
rendered="#{page == DCProfileTabZonesController.currentPage}" style="text-decoration:none;color:gray;"/>
</ui:repeat>
<br />
<!-- Set rows per page -->
<h:outputLabel for="rowsPerPage" value="Rows per page" />
<h:inputText id="rowsPerPage" value="#{DCProfileTabZonesController.rowsPerPage}" size="3" maxlength="3" />
<h:commandButton styleClass="bimage" value="Set" action="#{DCProfileTabZonesController.pageFirst}" >
<f:ajax render="#form" execute="#form"></f:ajax>
</h:commandButton>
<h:message for="rowsPerPage" errorStyle="color: red;" />
<!-- hidden button -->
<h:commandButton id="deleterow" value="HiddenDelete" action="#{DCProfileTabZonesController.deleteSelectedIDs}" style="display:none">
<f:ajax render="#form"></f:ajax>
</h:commandButton>
<!-- the delete button -->
<h:button styleClass="bimage" value="Delete" onclick="deletedialog(this, 'Do you want to delete the selected rows?'); return false;" />
<!-- New Zone -->
<h:button id="newzone" styleClass="lbimage" value="New Zone" outcome="/NewZone.xhtml"/>
<script type="text/javascript" src="resources/js/tabs.js"></script>
</h:form>
</h:panelGroup>
</ui:composition>
</h:body>
</html>
When I remove the ui:composition tag and I insert all the code into one page the buttons are working.
As you pointed out in one of your comments, you cannot use nested forms. You need to restructure your layout. Place your outer form around your <ul>:
<h:panelGroup id="tabs" layout="block">
<h:form prependId="false">
<ul>
...
</ul>
</h:form>
<c:forEach items="#{DatacenterProfileController.tabs}" var="tab">
...
</c:forEach>
</h:panelGroup>
The rest of you code should be OK. By this way you avoid nested forms.
Related
after updating from pf 7 to pf 11 I have undesirable behavior when navigating in a composite xhtml.
I have a p:tree element on the west, and an ui:insert in the center which includes the composite content which is
updated when clicking on tree nodes). After I have migrated to pf 11 when I click on a node in the tree, not only
the content gets updated, but the tree as well. The problem is when the tree gets expanded to the point where
it cannot be whole visible and the scroll bar is rendered and I scroll to the lower part and click on a node, the
tree gets updated and it scrolls all the way up.
The template page looks like this
<!DOCTYPE html>
<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>
<f:facet name="first">
<meta content='text/html; charset=UTF-8' http-equiv="Content-Type" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta http-equiv="refresh" content="#{facesContext.externalContext.sessionMaxInactiveInterval};url=#{request.contextPath}/errorpages/session_expired.xhtml"/>
<link rel="shortcut icon" type="image/x-icon" href="#{request.contextPath}/resources/images/favicon.ico" />
<title><ui:insert name="title">#{sessionController.appName}</ui:insert></title>
</f:facet>
</h:head>
<h:body onload="scrollTreeMenu();" >
<p:growl id="growlMessages" for="globalMsg" />
<p:growl id="permanetnMessage" for="permMsg" sticky="true" />
<p:blockUI block="centerPanel" widgetVar="blockCenterWidget">
<p:graphicImage library="images" name="ajax-loader.gif" />
</p:blockUI>
<p:blockUI block="headerForm" widgetVar="blockNorthWidget" />
<p:blockUI block="treeNodes" widgetVar="blockWestWidget" />
...
<div class="p-grid">
<div id="west" class="p-col" style="flex: inherit;">
<p:panel toggleable="true" toggleOrientation="horizontal" header="Menu" style="width: fit-content; width: -moz-fit-content;">
<h:form id="treeNodes">
<p:outputPanel style="width: 100%; height: 700px; overflow: auto; display: block;">
<p:tree id="menuTree" value="#{sessionController.treeRootNode}" var="treeNode" dynamic="true" cache="false"
selectionMode="single" selection="#{sessionController.selectedNode}" widgetVar="mainTreeMenuWidget" style="line-height: 1;">
<p:ajax event="select" listener="#{sessionController.onNodeSelect}" />
<p:ajax event="expand" listener="#{sessionController.onNodeExpand}" />
<p:ajax event="collapse" />
<p:treeNode collapsedIcon="pi pi-folder" expandedIcon="pi pi-folder-open">
<h:outputText id="adminFolder" value="#{treeNode.rowKey}" title="#{treeNode.rowKey}" />
<p:tooltip for="adminFolder" position="top" showDelay="500" />
</p:treeNode>
<p:treeNode type="Folder" collapsedIcon="pi pi-folder" expandedIcon="pi pi-folder-open">
<h:outputText id="folder" value="#{treeNode.rowKey}" title="#{treeNode.rowKey}" />
<p:tooltip for="folder" position="top" showDelay="500" />
</p:treeNode>
<p:treeNode type="ItemTable" icon="pi pi-table">
<h:outputText id="itemTableNode" value="#{treeNode.rowKey}" title="#{treeNode.rowKey}" />
<p:tooltip for="itemTableNode" position="top" showDelay="500" />
</p:treeNode>
...
</p:tree>
...
</p:outputPanel>
</h:form>
</p:panel>
</div>
<div id="center" class="p-col" style="overflow: auto;">
<p:outputPanel id="centerPanel">
<ui:insert name="content">Content commes here...</ui:insert>
</p:outputPanel>
</div>
</div>
...
</h:body>
</html>
and the page that shows the content looks like this
<ui:composition template="/WEB-INF/jsf-templates/layout_template.xhtml"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core">
<ui:define name="content">
<h:form id="analysisForm" rendered="#{not analysisController.analysisInfo.disabled}">
<p:remoteCommand name="loadData" actionListener="#{analysisController.loadData}"
onstart="PF('blockCenterWidget').show(); PF('blockNorthWidget').show(); PF('blockWestWidget').show();"
oncomplete="PF('blockCenterWidget').hide(); PF('blockNorthWidget').hide(); PF('blockWestWidget').hide();"
process="#this" update=":analysisForm" />
...
</h:form>
...
</ui:define>
</ui:composition>
best regards
Andrija
I am not able to get the value from the text box in the overlay panel to the text box in the main form on clicking the submit button on the overlay panel.
<?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:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">
<h:head>
<style>
.link{
color:blue;
font-size: 15px;
}
.form{ width: 300px;
margin: 0 auto;
}
.button{
}
</style>
<title>Calendar</title>
<script>
function checkPasswords() {
alert("hii");
alert(document.getElementById("form:pass").value);
alert("test");
window.opener.document.getElementById("form:pass").value = document.getElementById("overPanel1:newpass").value;
// document.getElementById("overPanel1").hide();
return false;
}
</script>
</h:head>
<h:body>
<h:form styleClass="form" id="form">
Username : <p:inputText id="username"
value="#{userBean.username}">
<f:validateLength minimum="5" maximum="7" />
</p:inputText>
<h:message for="username" style="color:red" />
<br />
<br />
Password : <p:password id="pass"
value="#{userBean.password}" />
<br />
<p:commandLink styleClass="link"
value="change Password" id="commandlink"
style="height:20px" />
<p:overlayPanel id="overPanel1"
for="commandlink"
dynamic="true"
widgetVar="overpanel"
hideEffect="fade">
<h:form id="innerform">
<h:panelGrid columns="1" cellpadding="1">
New Password : <p:password id="newpass"
value="#{userBean.password}" />
<br />
<p:commandButton styleClass="button"
id="change" value="Change"
onclick=" return checkPasswords();
overpanel.hide()">
<!-- <p:ajax event="change" update="pass" partialSubmit="true" /> -->
</p:commandButton>
</h:panelGrid>
</h:form>
</p:overlayPanel>
<br />
<br />
Date Of Birth : <p:calendar value="#{dateBean.date}"
mode="popup" showOn="button" />
<br />
<br />
<p:commandButton value="Submit" action="user" />
</h:form>
</h:body>
</html>
First of all you should not use nested forms.
As for your question you need to update the second form after you submit the first for example:
<p:commandButton value="Submit" action="user" update="form" />
We are migrating our App from glassfish to wildfly. However, the primefaces theme no longer loads. I am attaching the pages which are loaded .
Firebug console shows an error - ReferenceError: $ is not defined
Index.xhtml
`
<?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:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
>
<h:head>
<link rel="shortcut icon"
href="http://www.hs-furtwangen.de/fileadmin/templates/favicon.ico"
type="image/x-ico; charset=binary" />
<f:facet name="first">
<meta content='text/html; charset=UTF-8' http-equiv="Content-Type" />
<title>#{messages.finquasCompleteName}</title>
</f:facet>
</h:head>
<h:body>
<ui:composition template="./mainTemplate.xhtml">
<ui:define name="NonServiceView">
<h:form>
<p:growl autoUpdate="true" />
<div class="activitySream">
<div class="activityStreamHeader">
#{messages.activityStream}
</div>
<p:outputPanel deferred="true">
<p:dataList id="id_list_activity_stream"
value="#{activityStreamController.logEntries}" var="logEntry"
type="none" emptyMessage="#{messages.noActivitiesFound}">
<div class="activityDescriptionArea">
<div class="activityIconArea">
<h:outputText value="#{activityStreamController.getActionSpecificIconCode(logEntry.changeType)}"
escape="false" />
</div>
<div class="activityDescription">
<h:outputText value="#{logEntry.creator.name}" styleClass="boldLabel" />
<h:outputText value="#{activityStreamController.getActivityTextFirstPartForLogEntry(logEntry)}" />
<h:commandLink styleClass="boldLabel"
action="#{activityStreamController.navigateToEntity(logEntry.abstractEntity)}">
#{activityStreamController.getEnitityText(logEntry.abstractEntity)}
</h:commandLink>
<h:outputText value="#{activityStreamController.getChangeLogLabelOfLogEntry(logEntry)}." />
<div class="activityDate">
<h:outputText value="#{logEntry.changeDate}">
<f:convertDateTime pattern="dd.MM.yyyy HH:mm:ss" timeZone="Europe/Berlin" />
</h:outputText>
</div>
</div>
</div>
</p:dataList>
<p:commandButton value="#{messages.showMore}" action="#{activityStreamController.showMore()}"
update="id_list_activity_stream"
rendered="#{not empty activityStreamController.logEntries}"
styleClass="plainText greenButton showMoreActivitiesButton"/>
</p:outputPanel>
</div>
</h:form>
</ui:define>
</ui:composition>
</h:body>
</html>`
mainTemplate.xhtml
`
<?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:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
>
<h:body>
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<ui:composition template="./headerFooterLoggedInPagesTemplate.xhtml">
<ui:define name="leftHeaderUnit">
<p:commandButton
id="id_btn_home"
action="#{navigationController.navigateHome()}"
value="#{iconSetController.home}"
escape="false" title="#{messages.home}"
update=":structureTreeForm" ajax="false" />
</ui:define>
<ui:define name="rightHeaderUnit">
<p:commandButton id="id_btn_main_user_profile"
action="userProfile"
title="#{messages.myProfile}"
value="#{iconSetController.user}"
ajax="false"
escape="false" />
<p:commandButton id="id_btn_main_help"
action="help"
title="#{messages.help}"
value="#{iconSetController.help}"
escape="false" />
<p:commandButton id="id_btn_main_logout"
title="#{messages.logout}"
value="#{iconSetController.logout}"
escape="false"
action="#{navigationController.logout()}" />
</ui:define>
<!--The empty header field is a necessary in order to display the collapsible button-->
<ui:define name="navigationArea">
<p:layoutUnit position="west"
collapsible="true"
header=""
effect="none"
resizable="true" id="id_lu_navigationBarLeft" size="320" minSize="300">
<p:tabView id="id_tabView_navigationBar"
dynamic="true"
activeIndex="#{navigationController.activeNavigationBarTabIndex}"
styleClass="finquasTabs">
<p:ajax event="tabChange" listener="#{navigationController.onNavigationBarTabChange}" />
<p:tab title="#{messages.myServicesTab}">
<p:panel rendered="#{not empty navigationController.administrationServicesOfCurrentUser}" header="#{messages.myAdministrationServices}">
<h:form id="myAdministrationServicesForm">
<p:dataList id="id_list_my_administration_services"
value="#{navigationController.administrationServicesOfCurrentUser}"
var="service"
rendered="#{not empty navigationController.administrationServicesOfCurrentUser}">
<p:column>
<h:commandLink
action="#{navigationController.viewServiceViaObject(service)}">
#{service.name}
</h:commandLink>
</p:column>
</p:dataList>
</h:form>
</p:panel>
<p:panel rendered="#{not empty navigationController.educationalServicesOfCurrentUser}" header="#{messages.myEducationalServices}">
<h:form id="myEducationalServicesForm">
<p:dataList id="id_list_my_product_services"
value="#{navigationController.educationalServicesOfCurrentUser}"
var="service"
rendered="#{not empty navigationController.educationalServicesOfCurrentUser}">
<p:column>
<h:commandLink
action="#{navigationController.viewServiceViaObject(service)}">
<h:outputText value="#{service.name}" />
<h:outputText value=" #{messages[service.getDegree().getAbbreviation()]}#{messages[service.getDegreeType().getAbbreviation()]}" rendered="#{navigationController.isDegreeProgram(service)}"/>
<h:outputText value=" #{navigationController.getStateOfService(service)}" rendered="#{navigationController.isServiceDegreeProgramOrStudyModule(service)}"/>
</h:commandLink>
</p:column>
</p:dataList>
</h:form>
</p:panel>
<p:panel rendered="#{not empty navigationController.peerReviewsOfCurrentUser}" header="#{messages.myPeerReviews}">
<h:form id="myPeerReviewsForm">
<p:dataList id="id_list_my_review_services"
value="#{navigationController.peerReviewsOfCurrentUser}"
var="service"
rendered="#{not empty navigationController.peerReviewsOfCurrentUser}">
<p:column>
<h:commandLink
action="#{navigationController.viewServiceViaObject(service)}">
#{service.name} (#{messages[service.state.class.name]})
</h:commandLink>
</p:column>
</p:dataList>
</h:form>
</p:panel>
<p:panel rendered="#{not empty navigationController.qualityReportServicesOfCurrentUser}" header="#{messages.myQualityReportServices}">
<h:form id="myQualityReportServicesForm">
<p:tree id="id_list_my_quality_report_services"
value="#{navigationController.qualityReportServiceRoot}"
var="serviceNode"
dynamic="true"
rendered="#{not empty navigationController.qualityReportServicesOfCurrentUser}">
<p:ajax event="expand" listener="#{navigationController.onNodeExpandQualityReportGraph}" />
<p:ajax event="collapse" listener="#{navigationController.onNodeCollapse}" />
<p:treeNode>
<h:commandLink
action="#{navigationController.viewServiceViaObject(serviceNode)}">
<span title="#{messages.qualityReportFinished}"><h:panelGroup layout="block" class="greenCircle" rendered="#{serviceNode.state.position == 3}"/> </span>
<span title="#{messages.qualityReportWaitingForStatement}"><h:panelGroup layout="block" class="yellowCircle" rendered="#{serviceNode.state.position == 2}"/></span>
<span title="#{messages.qualityReportWaitingForStatementStudyDean}"><h:panelGroup layout="block" class="redCircle" rendered="#{serviceNode.state.position == 1}"/></span>
#{serviceNode.simpleName}
</h:commandLink>
</p:treeNode>
</p:tree>
</h:form>
</p:panel>
</p:tab>
<p:tab title="#{messages.serviceStructureTab}">
<p:panel header="#{messages.search}" styleClass="finquasinput">
<h:form id="id_form_main_search">
<p:autoComplete id="id_input_main_search"
forceSelection="true"
placeholder="#{messages.autoCompleteHint}"
value="#{navigationController.serviceName}"
effect="fade"
required="true"
requiredMessage="#{messages.noServiceFound}"
styleClass="autocompleteService"
completeMethod="#{navigationController.completeService}" />
<p:commandButton id="id_btn_main_search"
value="#{iconSetController.search}" escape="false"
action="#{navigationController.viewServiceViaAutoComplete}"
ajax="false" />
</h:form>
</p:panel>
<p:panel header="#{messages.structure}">
<h:form id="structureTreeForm">
<p:tree value="#{navigationController.serviceRoot}"
dynamic="true"
var="serviceNode"
styleClass="finquastree"
animate="true">
<p:ajax event="expand" listener="#{navigationController.onNodeExpandEducationalServiceGraph}" />
<p:ajax event="collapse" listener="#{navigationController.onNodeCollapse}" />
<p:treeNode>
<h:commandLink
action="#{navigationController.viewServiceViaObject(serviceNode)}">
<h:outputText value="#{serviceNode.name} #{messages[serviceNode.getDegree().getAbbreviation()]}#{messages[serviceNode.getDegreeType().getAbbreviation()]}" rendered="#{serviceNode['class'].simpleName == 'DegreeProgram'}"/>
<h:outputText value="#{serviceNode.name}" rendered="#{serviceNode['class'].simpleName != 'DegreeProgram'}"/>
</h:commandLink>
</p:treeNode>
</p:tree>
</h:form>
</p:panel>
</p:tab>
</p:tabView>
</p:layoutUnit>
</ui:define>
</ui:composition>
</ui:composition>
</h:body>
</html>`
headerFooterTemplate.xhtml
`
<?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:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
>
<h:body>
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:p="http://primefaces.org/ui">
<f:view contentType="text/html">
<ui:insert name="loggedInCheck" />
<f:facet name="last">
<h:outputStylesheet library="css" name="default.css" />
<h:outputScript library="scripts" name="primefacesLocalization.js"
target="head" />
</f:facet>
<p:layout fullPage="true">
<p:layoutUnit id="id_lu_headerUnit" position="north">
<h:form id="id_form_headerForm">
<p:toolbar styleClass="finquasheader">
<p:toolbarGroup styleClass="headerBar">
<ui:insert name="leftHeaderUnit" />
</p:toolbarGroup>
<p:toolbarGroup align="right" styleClass="headerBar">
<ui:insert name="rightHeaderUnit" />
</p:toolbarGroup>
</p:toolbar>
</h:form>
</p:layoutUnit>
<ui:insert name="navigationArea" />
<p:layoutUnit id="id_lu_centerUnit" position="center">
<div id="contentArea">
<div class="nonServiceView">
<ui:insert name="NonServiceView" />
</div>
<ui:insert name="ServiceView" />
</div>
</p:layoutUnit>
<p:layoutUnit position="south" id="footerUnit">
<h:form>
<p:toolbar styleClass="finquasfooter">
<p:toolbarGroup>
<ui:insert name="leftFooterContent" />
</p:toolbarGroup>
<p:toolbarGroup align="right" styleClass="footerToolbar">
#{messages.finquasCompleteName}
</p:toolbarGroup>
</p:toolbar>
</h:form>
</p:layoutUnit>
</p:layout>
</f:view>
</ui:composition>
</h:body>
</html>`
headerFooterLoggedInPagesTemplate.xhtml
` <?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:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
>
<h:body>
<ui:composition template="./headerFooterTemplate.xhtml"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:c="http://xmlns.jcp.org/jsp/jstl/core">
<ui:param name="currentUser" value="#{sessionController.currentUser}" />
<ui:define name="loggedInCheck">
<c:if test="#{!sessionController.loggedIn}">
<meta HTTP-EQUIV="REFRESH"
content="0;URL='#{navigationController.serverUrl}'" />
</c:if>
</ui:define>
<ui:define name="leftFooterContent">
#{currentUser.firstName} #{currentUser.lastName}
<script>
(function(i, s, o, g, r, a, m) {
i['GoogleAnalyticsObject'] = r;
i[r] = i[r] || function() {
(i[r].q = i[r].q || []).push(arguments)
}, i[r].l = 1 * new Date();
a = s.createElement(o),
m = s.getElementsByTagName(o)[0];
a.async = 1;
a.src = g;
m.parentNode.insertBefore(a, m)
})(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
ga('create', 'UA-49887094-1', 'hs-furtwangen.de');
ga('send', 'pageview');
</script>
</ui:define>
</ui:composition>
</h:body>
</html>`
I got the error. All my template pages were using composition and each had its own head tag. While this worked with glassfish, wildfly did not allow it.
Removing head from all but the base template and making the base template not a composition solved this
Earlier my p:dialog was getting invoked properly when i was doing a .show() on the widgetVar defined on it. but recently after taking an update it stopped working and i am getting this error in browser :
Webpage error details:
User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 2.0.50727; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; MS-RTC LM 8)
Timestamp: Fri, 28 Mar 2014 04:04:49 UTC
Message: Object doesn't support this property or method
Line: 12
Char: 4302
Code: 0
URI: http://localhost:8282/OMNIVue/javax.faces.resource/primefaces.js.jsf?ln=primefaces
Message: Object doesn't support this property or method
Line: 16
Char: 1
Code: 0
URI: http://localhost:8282/OMNIVue/orders/orderSearch.jsf
Message: Could not complete the operation due to error 80020101.
Line: 81
Char: 17
Code: 0
URI: http://localhost:8282/OMNIVue/javax.faces.resource/jsf.js.jsf?ln=javax.faces&stage=Development
Message: 'confirmation' is undefined
Line: 83
Char: 1
Code: 0
URI: http://localhost:8282/OMNIVue/orders/orderSearch.jsf
Message: 'confirmation' is undefined
Line: 83
Char: 1
Code: 0
URI: http://localhost:8282/OMNIVue/orders/orderSearch.jsf
I have a main page like this where i have defined my dialog box.
<!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:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
xmlns:t="http://myfaces.apache.org/tomahawk"
xmlns:mdw="http://www.qwest.com/mdw/jsf"
xmlns:mwt="http://www.centurylink.com/mwt/jsf"
xmlns:q="http://www.qwest.com/mdw/jsf"
xmlns:p="http://primefaces.org/ui"
xmlns:fn="http://java.sun.com/jsp/jstl/functions">
<ui:composition>
<script language="javascript" type="text/javascript">
function solutionButtonClickHandler(){
#{rich:component('addSolutionDlg')}.show();
document.getElementById('addSolutionId').setAttribute('disabled', 'disabled');
}
function removeSearchParam(checkbox){
var parentDiv = checkbox.parentNode;
parentDiv.style.display = "none";
}
function displayErrorDialog(status){
if(status == 'taskSelectedError'){
#{rich:component('addSolutionTaskErrorDlg')}.show();
}
}
function disableButtons(){
if(document.getElementById('addSolution') != null)
document.getElementById('addSolution').setAttribute('disabled', 'disabled');
if(document.getElementById('escalateWorkItemTask') != null)
document.getElementById('escalateWorkItemTask').setAttribute('disabled', 'disabled');
}
function removeEscalation(escalationId, taskInstanceId, taskId){
if(document.getElementById('escalationid') != null)
document.getElementById('escalationid').value = escalationId;
if(document.getElementById('taskinstanceid') != null)
document.getElementById('taskinstanceid').value = taskInstanceId;
if(document.getElementById('taskid') != null)
document.getElementById('taskid').value = taskId;
}
function redirectToActivityCenter(taskId){
if(document.getElementById('taskid') != null)
document.getElementById('taskid').value = taskId;
}
</script>
<rich:panel id="detailPanel" styleClass="floatL iconbdrNone bgcTransparent w790P "
rendered="#{filterManager.orderFilter.showSearchPanel}">
<!-- <br style="background-color:white;" /> -->
<h:form id="selectedParamForm" prependId="false">
<h:inputHidden id="orderRefreshSubmit" forceId="true" value="false" />
<rich:collapsiblePanel styleClass="marLmin1 iconbdrNone W788P" id="selectedSearchParams"
header="Selected Search Parameters"
switchType="client"
expanded="#{orderSearchMenuBean.expandSearchParameters}"
rendered="#{filterManager.orderFilter.showSearchPanel}">
<!-- <table style="margin-left: 10px; padding-top: 10px; padding-bottom: 25px;"> -->
<table class="wrapperW100P" >
<ui:repeat var="searchParams"
value="#{filterManager.orderFilter.selectedSearchParameters}"
varStatus="serachParamsStatus">
<tr>
<ui:repeat var="searchParam"
value="#{searchParams}"
varStatus="status">
<td>
<div style="margin-right:39px;">
<h:selectBooleanCheckbox styleClass="floatL"
value="#{filterManager.orderFilter.searchParamCheckbox}"
label="#{searchParam.label}"
valueChangeListener="#{ordersListActionController.refreshOrders}"
onclick=" removeSearchParam(this); document.getElementById('orderRefreshSubmit').value='true'; ">
<a4j:ajax event="change" execute="#this"
render="orderFilterPanel orderDetailPanel orderMessage " />
<h:inputHidden value="#{searchParam.label}" />
</h:selectBooleanCheckbox>
<h:outputLabel value="#{searchParam.label}" styleClass="font floatL marT2"/>
<!-- <br style="background-color:white;" /> -->
<h:outputLabel value="#{searchParam.value}" styleClass="font floatL clearL marL20"/>
</div>
</td>
</ui:repeat>
</tr>
<tr>
<td colspan="4">
<h:graphicImage value="../images/param_line.png" styleClass="wrapperW100P height1P"/>
</td>
</tr>
</ui:repeat>
</table>
</rich:collapsiblePanel>
<a4j:outputPanel ajaxRendered="true">
<a4j:status onstart="#{rich:component('refreshOrders')}.show()"
onstop="#{rich:component('refreshOrders')}.hide()">
</a4j:status>
</a4j:outputPanel>
<rich:popupPanel id="refreshOrders" autosized="true" domElementAttachment="parent">
<h:panelGrid style="text-align:center !important;">
<h:graphicImage styleClass="floatL marL81" value="../images/loading.gif"/>
<h:outputText value="Please wait while the search refreshes" styleClass="font floatL clearL"></h:outputText>
<h:commandLink value="Cancel" onclick="#{rich:component('refreshOrders')}.hide()"
styleClass="green_addMoreLink floatL clearL marL81"/>
</h:panelGrid>
</rich:popupPanel>
</h:form>
<br style="background-color:white;" />
<h:form id="ordSearchList" prependId="false">
<mwt:expandableRowList id="ordersLst" listId="#{filterManager.orderFilter.dynamicListId}"
listEntity="#{listManager.getMyOrders(filterManager.orderFilter.dynamicListId)}"
label="Records"/>
<p:dialog modal="true" widgetVar="confirmation" style="background:white !important;" closable="true"
header="Cancel Device Build Order" styleClass="stylePDialogHeader" width="500" id="confGirish" appendToBody="true">
<h:panelGroup styleClass="wrapperW100P">
<h:outputText
value="Canceling device build order will cancel all new devices and Ethernet bearers associated to this request, and release all reserved ports. Do you wish to continue ? "
styleClass="font floatL" />
<h:panelGroup styleClass="floatR">
<a4j:commandButton value="Yes"
styleClass="cmdButton marL5 marR5 clearL"
action="#{orderListScopeActionCtrl.cancelDeviceBuildOrder}"
oncomplete="if(#{orderListScopeActionCtrl.displayPortAssignmentErrorDialog}){confirmation.hide();portassignment.show(); return false;}else if(#{orderListScopeActionCtrl.displayCancelSuccessDialog}){confirmation.hide();successDialog.show();return false;}else {confirmation.hide();errorCancelDialog.show();return false;}">
</a4j:commandButton>
<!-- Yes button onclick="if(#{orderListScopeActionCtrl.orderToCancelHasNIDDeviceStatus}){portassignment.show(); return false;}" -->
<h:commandButton value="No"
onclick="confirmation.hide();return false;"
styleClass="cmdButton marL5 clearL">
</h:commandButton>
</h:panelGroup>
</h:panelGroup>
</p:dialog>
<p:dialog header="Cancel Device Build Order" modal="true" widgetVar="successDialog" closable="true"
style="background:white !important;" styleClass="stylePDialogHeader1" width="500">
<h:panelGroup>
<h:outputText
value="Cancellation Process is initiated in DSP successfully."
styleClass="font floatL" />
<!-- <h:commandButton value="OK"
onclick="successDialog.hide();return false;"
styleClass="cmdButton floatR marL5 clearL">
</h:commandButton> -->
<!-- action="#{orderListScopeActionCtrl.refreshPageAfterUpdate}" -->
<a4j:commandButton value="OK"
styleClass="cmdButton floatR marL5 clearL"
action="#{orderListScopeActionCtrl.updateOrderStatusAndRefresh}"
oncomplete="successDialog.hide();return false;">
</a4j:commandButton>
</h:panelGroup>
</p:dialog>
<p:dialog header="Confirm Cancel Device Build Order" modal="true" widgetVar="portassignment" closable="true"
style="background:white !important;" styleClass="stylePDialogHeader1" width="500">
<h:panelGroup>
<h:outputText
value="There are UNI/ENNIs assigned to ports on NID device. Please remove UNI/ENNIs and try again."
styleClass="font floatL" />
<h:commandButton value="OK"
onclick="portassignment.hide();return false;"
styleClass="cmdButton floatR marL5 clearL">
</h:commandButton>
</h:panelGroup>
</p:dialog>
<p:dialog header="Cancel Device Build Order" modal="true" widgetVar="errorCancelDialog" closable="true"
style="background:white !important;" styleClass="stylePDialogHeader1" width="500">
<h:panelGroup>
<h:outputText
value="Some error occured during Cancellation Process in DSP. Please try later."
styleClass="font floatL" />
<h:commandButton value="OK"
onclick="errorCancelDialog.hide();return false;"
styleClass="cmdButton floatR marL5 clearL">
</h:commandButton>
</h:panelGroup>
</p:dialog>
<ui:include src="escalationDlg.xhtml" />
<ui:include src="addSolutionDlg.xhtml" />
<h:inputHidden id="escalationid" value="#{ordersListActionController.escalationId}"></h:inputHidden>
<h:inputHidden id="taskid" value="#{ordersListActionController.taskId}"></h:inputHidden>
<h:inputHidden id="taskinstanceid" value="#{ordersListActionController.taskInstanceId}"></h:inputHidden>
</h:form>
</rich:panel>
</ui:composition>
</html>
i am calling these dialogs from a composite component xmthml which is like this through p:commandLink :
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!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:t="http://myfaces.apache.org/tomahawk"
xmlns:p="http://primefaces.org/ui"
xmlns:rich="http://richfaces.org/rich"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:mdw="http://www.qwest.com/mdw/jsf"
xmlns:mwt="http://www.centurylink.com/mwt/jsf"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head></h:head>
<ui:composition>
<script type="text/javascript" src="#{request.contextPath}/script/listSupport.js"/>
<rich:panel styleClass="ordsearchDetail iconbdrNone floatL " headerClass="headerBGWhite" >
<f:facet name="header">
<h:outputText value="Search Results" ></h:outputText>
</f:facet>
<div class="clearB"></div>
<h:panelGroup styleClass="marT5">
<h:graphicImage value="../images/divider_line.png"></h:graphicImage></h:panelGroup>
<h:panelGroup id="#{listId}_dataTablePanelGrid"
rendered="#{rendered == null ? true : rendered}" columns="1"
width="100%" cellpadding="0" cellspacing="0">
<p:dataTable value="#{listEntity.items}"
id="#{listId}"
var="listItem"
rowIndexVar="rowIdxVar"
style="#{webUtil.ie ? 'border-collapse:collapse;' : ''};"
styleClass="mdw_ORD_upperLine bdrC3C3C3"
rows="#{listEntity.displayRows}"
cellspacing="0"
width="750px"
emptyMessage="Item(s) requested cannot be found"
lazy="true"
first="#{listEntity.firstRow}"
paginator="true"
paginatorPosition="top"
currentPageReportTemplate="#{label == null ? listEntity.name : label} ({startRecord} - {endRecord} of {totalRecords})"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {NextPageLink} {LastPageLink}">
<p:columns value="#{listEntity.headerList}" var="colHeader"
columnIndexVar="colIdx" sortBy="#{listItem[colHeader.attribute]}" headerText="#{colHeader.label}" rendered="#{not empty listEntity.headerList}">
<f:facet name="header">
<h:selectBooleanCheckbox
rendered="#{listEntity.hasItems && colHeader.checkbox && colHeader.linkAction != 'removeWorkItemEscalation'}"
onclick="#{userRole == null?'':'selectAllOrders(this.form, this.checked);enableDisableAddWorkItem(this.form, this.checked);enableDisableAddSolution(this.form, this.checked);enableDisableEscalate(this.form, this.checked);'}"/>
<h:outputText id="#{listId}_header"
rendered="#{!colHeader.checkbox}" value="#{colHeader.label}"
immediate="true">
</h:outputText>
</f:facet>
<p:commandLink actionListener="#{listEntity.performLinkAction(colHeader)}"
rendered="#{colHeader.commandLink && colHeader.linkAction != 'removeWorkItemEscalation' && colHeader.linkAction == 'orderCancellation' && listItem.cancelOrder}"
disabled="#{listItem.disabledOrder}" update="#form" process="#form" oncomplete="confirmation.show();"
title="Cancel Device Build Order" styleClass="#{listEntity.getStyleClass(colHeader)} mdw_listLinks">
<h:graphicImage value="#{colHeader.valueImage}" styleClass="marLR10 iconbdrNone"></h:graphicImage>
<f:setPropertyActionListener
target="#{orderListScopeActionCtrl.orderToCancelHasNIDDeviceStatus}" value="#{listItem.cancelOrderNICDeviceStatus}"/>
<f:setPropertyActionListener
target="#{orderListScopeActionCtrl.orderDeviceClli}" value="#{listItem.clliCode}"/>
<f:setPropertyActionListener
target="#{orderListScopeActionCtrl.orderDeviceName}" value="#{listItem.deviceName}"/>
</p:commandLink>
</rich:panel>
</ui:composition>
</html>
try with
oncomplete="PF('confirmation').show()"
I solved the issue using:
Converted my p:dialog to rich:popupPanel and used this for showing and hiding popup:
{rich:component('addSolutionTaskErrorDlg')}.show() / .hide().
Using this error disappeared from browser when invoking commandLink.
I tried using p:widgetVar('id').show() / .hide() but that did not work.
I've message in an xhtml page of course bound with a bean.
Now the messages are in a list, and i'm using ui:repeat to display the message and all that.
Now when i open a message, there's a reply button in the dialogGrid which opens another dialog on the same page,
I just need to pass data to that reply dialog.
In the first place, it's working fine, i mean if you click on the reply button directly it works fine, but when you open the message and then click on reply it doesn't update the dialog.
I've seen this
Pass parameter to dialog in the same page
But MY BEAN IS REQUEST SCOPED
Here's my xhtml code
<?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:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:c="http://java.sun.com/jsp/jstl/core">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="../Styles/homepage-style.css" />
<link rel="stylesheet" type="text/css" href="../Styles/profile.css" />
<title>Shadi Bandhan | We find the best match for you</title>
</h:head>
<h:body>
<div id="header">
<ui:insert name="header" >
<ui:include src="header.xhtml" />
</ui:insert>
</div>
<div id="main-content">
<p:growl autoUpdate="true" />
<div id="left-pane">
<div id="profile-info-area">
<ui:insert name="profile_info_area" >
<ui:include src="profileInfoArea.xhtml" />
</ui:insert>
</div>
<div id="home-main-area">
<div id="messages-wrapper">
<div id="messages-header">
<div id="m-heading">
Messages - Inbox
</div>
<div id="m-search">
<div id="searchbox">
Search Messages <input type="text" value="Search" />
</div>
<div id="newmessage">
+ New Message
</div>
</div>
</div>
<h:form id="messagesForm">
<div id="messages">
<p:dialog id="messagesDialog" modal="true" widgetVar="messageDialog" resizable="false" width="750" height="300" header="New Message" >
<h:panelGrid columns="2" id="dialogGrid">
<p:column>
<h:outputLabel for="msgRecepient" value="To"/>
</p:column>
<p:column>
<h:outputLabel id="msgRecepient" value="#{userMsg.userFullname}" >
</h:outputLabel>
</p:column>
<p:column>
<h:outputLabel for="msgContents" value="Message"/>
</p:column>
<p:column>
<p:inputTextarea maxlength="300" id="msgContents" value="#{messagesManagedBean.msg.message}" cols="65" rows="3" >
<p:watermark for="msgContents" value="#{userMsg.userId}" />
</p:inputTextarea>
</p:column>
<p:column>
<p:commandButton id="msgSend" value="Send" action="#{messagesManagedBean.sendMessage('reply')}" oncomplete="messageDialog.hide()" >
<f:param value="#{userMsg.userId}" name="messageSenderId" />
</p:commandButton>
</p:column>
</h:panelGrid>
</p:dialog>
<p:dialog id="messagesDialog2" modal="true" widgetVar="messageDialog2" resizable="false" width="750" height="300" header="New Message" >
<h:panelGrid columns="2" id="dialogGrid2">
<p:column>
<h:outputLabel for="msgRecepient2" value="From"/>
</p:column>
<p:column>
<h:outputLabel id="msgRecepient2" value="#{userMsg.userFullname}" >
</h:outputLabel>
</p:column>
<p:column>
<h:outputLabel for="msgContents2" value="Message"/>
</p:column>
<p:column>
<p:inputTextarea readonly="true" id="msgContents2" value="#{userMsg.message}" cols="65" rows="3" >
</p:inputTextarea>
</p:column>
<p:column>
<p:commandButton styleClass="reply-btn" value="Reply" update=":messagesForm:dialogGrid"
oncomplete="messageDialog.show(), messageDialog2.hide()">
<f:param name="userMsg" value="#{userMsg}" />
</p:commandButton>
</p:column>
</h:panelGrid>
</p:dialog>
<ui:repeat var="userMsg" value="#{messagesManagedBean.paginator1.model}">
<center><img class="h-diff" src="../images/differentiator-profile.jpg" width="437" height="1" /></center>
<div id="message">
<div id="senderImg">
<img class="senderImg" src="../images/profile-pic.jpg" width="50" height="50" />
</div>
<div id="message-txt-area">
<div id="senderName">
<p:commandLink styleClass="senderName" value="#{userMsg.userFullname}" action="#{myProfileManagedBean.loadProfileFrontInformation(userMsg.userId)}"></p:commandLink>
</div>
<ui:fragment rendered="#{userMsg.isRead}">
<div id="message-txt">
#{userMsg.message}
</div>
</ui:fragment>
<ui:fragment rendered="#{not userMsg.isRead}">
<div id="message-txt" class="msgNotRead">
#{userMsg.message}
</div>
</ui:fragment>
<div id="msgAction">
<p:commandLink styleClass="reply-btn"
value="Reply" oncomplete="messageDialog.show()" update=":messagesForm:dialogGrid">
<f:param name="userMsg" value="#{userMsg}" />
</p:commandLink>
<ui:fragment rendered="#{userMsg.isRead}">
<p:commandLink styleClass="open-btn" value="Open"
oncomplete="messageDialog2.show()" update=":messagesForm:dialogGrid2">
<f:param name="userMsg" value="#{userMsg}" />
</p:commandLink>
</ui:fragment>
<ui:fragment rendered="#{not userMsg.isRead}">
<p:commandLink styleClass="open-btn" value="Open"
action="#{messagesManagedBean.messageOpenedListener(userMsg.messageId)}"
oncomplete="messageDialog2.show()" update=":messagesForm:dialogGrid2">
<f:param name="userMsg" value="#{userMsg}" />
</p:commandLink>
</ui:fragment>
</div>
</div>
</div>
</ui:repeat>
<h:commandButton value="< prev" action="#{messagesManagedBean.paginator1.prev}"/>
<h:outputText value="#{messagesManagedBean.paginator1.pageIndex} / #{messagesManagedBean.paginator1.pages}"/>
<h:commandButton value="next >" action="#{messagesManagedBean.paginator1.next}"/>
<h:inputHidden value="#{messagesManagedBean.paginator1.pageIndex}"/>
</div>
</h:form>
</div>
</div>
</div>
<div id="right-pane">
<ui:insert name="right-pane" >
<ui:include src="right-pane.xhtml" />
</ui:insert>
</div>
</div>
<div id="footer">
<ui:insert name="footer" >
<ui:include src="footer.xhtml" />
</ui:insert>
</div>
</h:body>
</html>