I've created a composite that contains the PrimeFaces selectManyMenu. I'm attempting to pass the bound selection value into the composite, but it fails.
Composite code:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:composite="http://java.sun.com/jsf/composite"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:kf="http://java.sun.com/jsf/composite/kf"
xmlns:c="http://java.sun.com/jsp/jstl/core">
<composite:interface>
<composite:attribute name="selectedUsers" required="true"/>
<composite:attribute name="users" required="true" type="java.util.List"/>
<composite:attribute name="recommendActionHandler" required="true" method-signature="void listener()"/>
<composite:attribute name="recommendButtonStyle"/>
<composite:clientBehavior name="click" event="change" targets="recommendUsers" default="true"/>
</composite:interface>
<composite:implementation>
<div id="#{cc.clientId}">
<h:form id="recommendForm" prependId="false">
<p:growl id="recommendGrowl" showDetail="true"/>
<p:commandButton id="recommendBtn" value="Recommend" type="button" update=":recommendForm,recommendUsers" style="#{cc.attrs.recommendButtonStyle}"/>
<p:overlayPanel id="recommendPanel" for="recommendBtn" widgetVar="recommendPanel"
dynamic="true"
hideEffect="fade"
showCloseIcon="true">
<p:selectManyMenu id="recommendUsers" value="#{cc.attrs.selectedUsers}" showCheckbox="true"
style="width:150px;height:200px">
<f:selectItems value="#{cc.attrs.users}" var="user" itemLabel="#{user.login}" itemValue="#{user.login}"/>
</p:selectManyMenu>
<p:commandButton id="submitRecommendations"
value="Send"
update="recommendUsers recommendGrowl"
actionListener="#{cc.attrs.recommendActionHandler}"
process="recommendUsers #this"
/>
</p:overlayPanel>
</h:form>
</div>
</composite:implementation>
</html>
View code:
<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:kf="http://java.sun.com/jsf/composite/kf"
>
<ui:composition template="/WEB-INF/facelet_templates/default.xhtml">
<ui:define name="content">
<kf:recommend id="recommendIt"
selectedUsers="#{recommendViewBean.selectedUsers}"
users="#{recommendViewBean.users}"
recommendActionHandler="#{recommendController.saveRecommendations()}"
/>
</ui:define>
</ui:composition>
</html>
View bean code:
public class RecommendViewBean {
private List<UserType> users = new ArrayList<UserType>();
private List<String> selectedUsers = new ArrayList<String>();
//setters and getters...
}
In the code above, the value selectedUsers is the value in question. I pass the view/backing bean's List value that holds the selections for the selectManyMenu's value attribute. This works great when outside of a composite or if I pass the view bean like this...
<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:kf="http://java.sun.com/jsf/composite/kf"
>
<ui:composition template="/WEB-INF/facelet_templates/default.xhtml">
<ui:define name="content">
<kf:recommend id="recommendIt"
selectedUsers="#{recommendViewBean}"
users="#{recommendViewBean.users}"
recommendActionHandler="#{recommendController.saveRecommendations()}"
/>
</ui:define>
</ui:composition>
</html>
...
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:composite="http://java.sun.com/jsf/composite"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:kf="http://java.sun.com/jsf/composite/kf"
xmlns:c="http://java.sun.com/jsp/jstl/core">
<composite:interface>
<composite:attribute name="selectedUsers" required="true"/>
<composite:attribute name="users" required="true" type="java.util.List"/>
<composite:attribute name="recommendActionHandler" required="true" method-signature="void listener()"/>
<composite:attribute name="recommendButtonStyle"/>
<composite:clientBehavior name="click" event="change" targets="recommendUsers" default="true"/>
</composite:interface>
<composite:implementation>
<div id="#{cc.clientId}">
<h:form id="recommendForm" prependId="false">
<p:growl id="recommendGrowl" showDetail="true"/>
<p:commandButton id="recommendBtn" value="Recommend" type="button" update=":recommendForm,recommendUsers" style="#{cc.attrs.recommendButtonStyle}"/>
<p:overlayPanel id="recommendPanel" for="recommendBtn" widgetVar="recommendPanel"
dynamic="true"
hideEffect="fade"
showCloseIcon="true">
<p:selectManyMenu id="recommendUsers" value="#{cc.attrs.selectedUsers.selectedUsers}" showCheckbox="true"
style="width:150px;height:200px">
<f:selectItems value="#{cc.attrs.users}" var="user" itemLabel="#{user.login}" itemValue="#{user.login}"/>
</p:selectManyMenu>
<p:commandButton id="submitRecommendations"
value="Send"
update="recommendUsers recommendGrowl"
actionListener="#{cc.attrs.recommendActionHandler}"
process="recommendUsers #this"
/>
</p:overlayPanel>
</h:form>
</div>
</composite:implementation>
</html>
So, my question is, how would I pass the appropriate bound value for selectManyMenu's value attribute into the composite?
Thanks so much. Let me know if I need to explain more.
Related
I have the following situation: I want to update the content inside the "tpNavigationDetail" when clicking the commandbutton in the template_detail.xhtml.
query_overview.xhtml and query_detail.xhtml have the same QueryController.
How can I manage it with JSF?
query_detail.xhtml is inside the template_detail.xhtml
query_overview.xhtml is inside the template_navigation.xhtml
I appreciate any Help
query_detail.xhtml
<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:tp="http://www.tp.de/facelets" xmlns:p="http://primefaces.org/ui"
xmlns:pe="http://primefaces.org/ui/extensions">
<h:body>
<ui:composition template="/prime/template/template_detail.xhtml">
<ui:define name="detailLeft">
...
</ui:define>
<ui:define name="detailRight">
......
</ui:define>
</ui:composition>
</h:body>
</html>
template_detail.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:fn="http://java.sun.com/jsp/jstl/functions"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:tp="http://www.tp.de/facelets"
xmlns:pe="http://primefaces.org/ui/extensions">
<h:body>
<ui:composition template="/prime/template/template.xhtml">
<ui:param name="renderHeader" value="true"/>
<ui:define name="frame">
<h:form id="form" enctype="multipart/form-data">
<p:panel rendered="#{p:ifAnyGranted(renderOnRole) or fn:contains(pageStyle, 'useNoRole')}" style="min-height:150px">
<p:commandButton update="#(*[id*=tpNavigationDetailContent])"
action="#{controller.update}"
value="#{desk_messages.map['button.save']}"
rendered="#{controller.updateMode}"
disabled="#{!controller.isEntityEditable}"
icon="ui-icon-check" />
</p:panel>
</h:form>
</ui:define>
</ui:composition>
</h:body>
</html>
query_overview.xhtml
<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:tp="http://www.tp.de/facelets" xmlns:p="http://primefaces.org/ui"
xmlns:pe="http://primefaces.org/ui/extensions" xmlns:tpd="http://www.tp-dialog.de/facelets"
xmlns:c="http://java.sun.com/jsp/jstl/core">
<h:body>
<ui:composition template="/prime/template/template_navigation.xhtml">
<ui:param name="controller" value="#{queryController}"/>
<ui:define name="customDetail">
<f:facet name="header">
<p:spacer width="32" height="32" styleClass="tpTitleIcon tpTitleIconExports" style="margin-right: 10px;" />
<h:outputText value="#{desk_messages.map['title.query']}"/>: <tp:outputText object="#{queryController.entity}"/>
<h:outputText value=" (#{myWithFailedStatusI18nCategoryModel.i18nCodeMap[queryController.entity.status]})"
rendered="#{queryController.entity.status != 'A'}"/>
</f:facet>
<ui:include src="/prime/query/query_result.xhtml"/>
</ui:define>
</ui:composition>
</h:body>
</html>
template_navigation.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:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html"
xmlns:tp="http://www.tp.de/facelets" xmlns:p="http://primefaces.org/ui"
xmlns:fn="http://java.sun.com/jsp/jstl/functions" xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:pe="http://primefaces.org/ui/extensions">
<h:body>
<ui:composition template="/prime/template/template.xhtml">
<ui:param name="renderHeader" value="true"/>
<ui:param name="autosize" value="true"/>
<ui:define name="frame">
<pe:layoutPane id="tpNavigationDetail" position="center" render="false">
<ui:insert name="customScript"/>
<h:form id="form" enctype="multipart/form-data">
<c:if test="${fn:contains(pageStyle, 'customDetail')}">
<p:panel id="tpNavigationDetailContent" style="min-height:150px">
<ui:insert name="customDetail"/>
</p:panel>
</c:if>
</h:form>
</pe:layoutPane>
<!-- tp navigation -->
<pe:layoutPane id="tpNavigationOverview" position="east" size="#{navigationSize}" minSize="#{navigationMinSize}" maxSize="#{navigationMaxSize}">
<f:facet name="header">
<ui:insert name="tpNavigationOverviewHeader"/>
</f:facet>
<ui:insert name="navigationOverview"/>
</pe:layoutPane>
</ui:define>
</ui:composition>
</h:body>
</html>
you wan to update "tpNavigationDetail" but you write this :-
update="#(*[id*=tpNavigationDetailContent])" ,
change update attribute like this
update="#(*[id*=tpNavigationDetail])"
I'm developing composite component in JSF. In that I can pass method names as arguments in following way.
<?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:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:fn="http://java.sun.com/jsp/jstl/functions"
xmlns:p="http://primefaces.org/ui"
xmlns:composite="http://java.sun.com/jsf/composite">
<!-- INTERFACE -->
<composite:interface>
<composite:attribute name="noOfButtons" type="java.lang.Integer" required="true"/>
<composite:attribute name="actionOnly" type="java.lang.Boolean" required="true"/>
<composite:attribute name="myBean" required="true" type="com.jsf.CRUDBean"/>
<composite:attribute name="myIcons" type="java.lang.String" required="true"/>
<composite:attribute name="myAction" type="java.lang.String" required="true"/>
<composite:attribute name="myDesc" type="java.lang.String" required="true"/>
</composite:interface>
<!-- IMPLEMENTATION -->
<composite:implementation>
<c:forEach begin="0" end="#{cc.attrs.noOfmys - 1}" var="counter"
varStatus="status">
<h:commandButton id="myButton_${counter}"
action="#{cc.attrs.myBean[fn:split(cc.attrs.myAction, ',')[status.index]]}"
image="#{request.contextPath}/resources/images/#{fn:split(cc.attrs.myIcons, ',')[status.index]}"
title="#{fn:split(cc.attrs.myDesc, ',')[status.index]}"
style="padding:2px">
<p:spacer width="5px;" />
</c:forEach>
</composite:implementation>
</html>
This is working perfect.But in my case, I need to pass action in following way.
<c:forEach begin="0" end="#{cc.attrs.noOfmys - 1}" var="counter"
varStatus="status">
<h:commandButton id="myButton_${counter}"
image="#{request.contextPath}/resources/images/#{fn:split(cc.attrs.myIcons, ',')[status.index]}"
title="#{fn:split(cc.attrs.myDesc, ',')[status.index]}"
style="padding:2px">
<f:attribute name="action" value="#{cc.attrs.myBean[fn:split(cc.attrs.myAction, ',')[status.index]]}" />
</h:commandButton>
<p:spacer width="5px;" />
</c:forEach>
But this is not working in my application. Whenever I click commandButton from the page nothing happening at user level. Any help would be thankful.
I'm using PF 4.0 and I'm trying to use templating and dialog. This is my template:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<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">
<h:head></h:head>
<h:body>
<p:growl for="message" id="msg" showDetail="true" />
<p:layout id="page" fullPage="true">
<!-- North -->
<p:layoutUnit position="north" size="150px" style="border: none !important">
<h:form id="menutoolbar">
<p:toolbar>
[...]
</p:toolbar>
</h:form>
</p:layoutUnit>
<!-- Center -->
<p:layoutUnit position="center" style="border: none !important">
<ui:insert name="content">Center of page</ui:insert>
</p:layoutUnit>
<!-- South -->
<p:layoutUnit position="south" collapsible="false" gutter="0">
<ui:insert name="status"></ui:insert>
</p:layoutUnit>
</p:layout>
</h:body>
</html>
I'm using the template to render another page:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<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">
<h:head></h:head>
<h:body>
<f:metadata>
<f:viewParam name="id_file" value="#{csvDetalleBean.idFile}" />
</f:metadata>
<ui:composition template="./baseTemplate.xhtml">
<ui:define name="content">
<h:form id="tableform" prependId="false">
<p:dataTable id="detalle" value="#{csvDetalleBean.tableModel}" var="row" selection="#{csvDetalleBean.selectedRows}">
[...columns definition...]
</p:dataTable>
</h:form>
</ui:define>
<ui:define name="status">
<h:form id="statusform">
<p:panel id="panel" header="Status" style="margin-bottom:10px;">
[...controls definitions...]
</p:panel>
<p:poll interval="20" async="true" update="panel" />
</h:form>
</ui:define>
<p:dialog header="Dialog" widgetVar="respuestasDialog" resizable="false" appendToBody="true">
<p:dataTable id="respuestas" value="#{transactions.rows}" var="trRow">
<p:column headerText="Confirmation number">
<h:outputText value="#{trRow.get('confirmation_nm')}" /> hola
</p:column>
</p:dataTable>
</p:dialog>
</ui:composition>
</h:body>
</html>
The point is that I cannot show the dialog because it is not rendered at all. I think the point is the composition tag, I've already tried to put the dialog outside the composition, with same results.
What's the correct way to put components outside the layout? Of course don't want to put the dialog inside the template.
Thank you very much!
(in this example we use primefaces components, but question is not related with Primefaces)
Introduction:
In order to have ajax support for composite component elements we just use element:
composite:clientBehavior
Let's look at this situation:
<composite:interface>
<composite:clientBehavior name="dateSelect" event="dateSelect" targets="id111 id222" />
</composite:interface>
<composite:implementation>
<p:calendar id="id111" value="#{csController.selectedDate}" mode="inline"
mindate="#{csController.minDate(2013,9)}"
maxdate="#{csController.maxDate(2013,9)}"/>
<p:calendar id="id222" value="#{csController.selectedDate}" mode="inline"
mindate="#{csController.minDate(2013,10)}"
maxdate="#{csController.maxDate(2013,10)}"/>
</composite:implementation>
We we have two elements and ajax support for these two elements. This works as expected.
We could even change to this interface:
<composite:interface>
<composite:clientBehavior name="dateSelect" event="dateSelect" targets="id111" />
<composite:clientBehavior name="dateSelect" event="dateSelect" targets="id222" />
</composite:interface>
and this still works fine.
Problem:
I would like to change implementation to show custom number of calendars, not exaclty two like shown above. So I tried this:
<composite:interface>
<composite:attribute name="firstMonth" default="1"/>
<composite:attribute name="lastMonth" default="12"/>
<c:forEach var="i" begin="#{cc.attrs.firstMonth}" end="#{cc.attrs.lastMonth}">
<composite:clientBehavior name="dateSelect" event="dateSelect" targets="#{cc.clientId}#{i}"/>
</c:forEach>
</composite:interface>
<composite:implementation>
<c:forEach var="i" begin="#{cc.attrs.firstMonth}" end="#{cc.attrs.lastMonth}">
<p:calendar id="#{cc.clientId}#{i}" value="#{csController.selectedDate}" mode="inline"
mindate="#{csController.minDate(2013,i)}"
maxdate="#{csController.maxDate(2013,i)}"/>
</c:forEach>
</composite:implementation>
This of course doesn't work.
Question:
How to get ajax support for all elements generated by c:forEach loop?
Actually you don't need to follow that procedure to add ajax functionality for your components. Just use f:ajax into your calendars. As c:forEach works before it, that's not a problem:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:cc="http://java.sun.com/jsf/composite"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:c="http://java.sun.com/jsp/jstl/core">
<cc:interface>
<cc:attribute name="val" />
</cc:interface>
<cc:implementation>
<c:forEach var="date" items="#{cc.attrs.val}">
<p:calendar value="#{date}" mode="inline">
<f:ajax event="dateSelect" listener="#{bean.printCurrentValues}" />
</p:calendar>
</c:forEach>
</cc:implementation>
</html>
Being this the main page:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:composite="http://java.sun.com/jsf/composite/composites">
<h:head />
<h:body>
<h:form>
<composite:comp val="#{bean.calendars}" />
</h:form>
</h:body>
</html>
I added this listener method to the bean to check current dates are really changing:
#ManagedBean
#ViewScoped
public class Bean {
public List<Date> calendars = Arrays.asList(new Date(), new Date());
public List<Date> getCalendars() {
return calendars;
}
/**
* Just prints the updated values ;-)
*/
public void printCurrentValues() {
System.out.println("Current selected dates: " + calendars);
}
}
For your specific case you only would need to add a list of minDates and other one of maxDates in order to bind them to your calendar properties. Alternatively, you could also create your own class which wraps them to have everything packed. That's your own choice.
Solution above will work for dateSelect event and a provided listener. What if we want to have different events with different listeners?
Just define them on the interface and allow-deny them with JSTL's c:if. Here you have the composite implementation for a single input that can launch a listener method, also a dynamic number of p:calendar components, which will notify a user-defined method. By default none of them is launched.
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:cc="http://java.sun.com/jsf/composite"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:c="http://java.sun.com/jsp/jstl/core">
<cc:interface>
<cc:attribute name="dateSelect" default="false" />
<cc:attribute name="click" default="false" />
<cc:attribute name="dateSelectListener" method-signature="void f()" />
<cc:attribute name="inputClickedListener" method-signature="void f()" />
<cc:attribute name="val" />
</cc:interface>
<cc:implementation>
<h:inputText>
<c:if test="#{cc.attrs.click}">
<f:ajax event="click" listener="#{cc.attrs.inputClickedListener}" />
</c:if>
</h:inputText>
<c:forEach var="date" items="#{cc.attrs.val}">
<p:calendar value="#{date}" mode="inline">
<c:if test="#{cc.attrs.dateSelect}">
<f:ajax event="dateSelect" listener="#{cc.attrs.dateSelectListener}" />
</c:if>
</p:calendar>
</c:forEach>
</cc:implementation>
</html>
And here the main page:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:composite="http://java.sun.com/jsf/composite/composites">
<h:head />
<h:body>
<h:form>
<composite:comp val="#{bean.calendars}" dateSelect="true"
dateSelectListener="#{bean.printCurrentValues}" click="true"
inputClickedListener="#{bean.inputClicked}" />
</h:form>
</h:body>
</html>
Tested with Mojarra JSF 2.1.25 & Tomcat 7.
I am facing problems while trying to use primefaces datatable as composite component.
Below are my code snippet:
commonDataTable.xhtml:
<ui:composition 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:composite="http://java.sun.com/jsf/composite"
xmlns:p="http://primefaces.org/ui">
<composite:interface>
<composite:attribute name="rows" />
<composite:attribute name="value" type="org.primefaces.model.LazyDataModel"/>
<composite:attribute name="var" />
<composite:attribute name="id" />
<composite:attribute name="rowStyle" />
</composite:interface>
<composite:implementation>
<p:dataTable value="#{composite.attrs.value}"
rendered="#{not empty composite.attrs.value}"
id="composite.attrs.id" var="composite.attrs.var" paginator="true" rows="25"
currentPageReportTemplate="Showing {startRecord}-{endRecord} of {totalRecords}"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
rowsPerPageTemplate="25,50,100" paginatorPosition="bottom"
lazy="true" rowStyleClass="#{composite.attrs.rowStyle}">
<composite:set target="#{component}" property="var" value="#{composite.attrs.var}"/>
<composite:insertChildren />
</p:dataTable>
</composite:implementation>
</ui:composition>
index.xhtml:
<ui:composition template="/WEB-INF/template/layout.xhtml"
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"
xmlns:t="http://java.sun.com/jsf/composite/components">
<ui:param name="pageTitle" value="My Page" />
<f:metadata>
<f:viewParam id="employeeId" name="employeeId" value="#{mySummaryBean.employeeId}" required="false" />
<f:viewParam id="employee" name="employee" value="#{mySummaryBean.employee}" required="false" />
<f:event type="preRenderView" listener="#{mySummaryBean.preRender}" />
</f:metadata>
<ui:define name="content">
<p:fieldset>
<h2>employee Overview</h2>
<h:form>
<p:messages id="messages" showDetail="true" autoUpdate="true"
closable="true" />
<p:panel rendered="#{not empty mySummaryBean.employeeRunModel}">
<t:commonDataTable var="run" value="#{mySummaryBean.employeeRunModel}" rows="10"
id="carTable"
rowStyle="#{run.runErrorStatus}">
.........
</t:commonDataTable>
</p:panel>
</h:form>
</p:fieldset>
</ui:define>
</ui:composition>
Does anyone got datatable working inside a composite component with LazyDataModel?
After playing with Primeface, I am now able to resolve the issue. Sharing the solution so that it can help others if required.
commonDataTable.xhtml:
<ui:component xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:cc="http://java.sun.com/jsf/composite"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:p="http://primefaces.org/ui">
<cc:interface>
<cc:attribute name="rows" />
<cc:attribute name="value"
type="org.primefaces.model.LazyDataModel" />
<cc:attribute name="var" />
<cc:attribute name="id" />
<cc:attribute name="rowStyle" />
</cc:interface>
<cc:implementation>
<p:dataTable value="#{cc.attrs.value}"
rendered="#{not empty cc.attrs.value}" id="#{cc.attrs.id}"
paginator="true" rows="25"
currentPageReportTemplate="Showing {startRecord}-{endRecord} of {totalRecords}"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
rowsPerPageTemplate="25,50,100" paginatorPosition="bottom"
lazy="true" rowStyleClass="#{cc.attrs.rowStyle}">
<c:set target="#{component}" property="var" value="#{cc.attrs.var}"/>
<cc:insertChildren />
</p:dataTable>
</cc:implementation>
</ui:component>
index.xhtml:
<ui:composition template="/WEB-INF/template/layout.xhtml"
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"
xmlns:t="http://java.sun.com/jsf/composite/components">
<ui:param name="pageTitle" value="My Page" />
<ui:define name="content">
<p:fieldset>
<h2>employee Overview</h2>
<h:form>
<p:messages id="messages" showDetail="true" autoUpdate="true"
closable="true" />
<p:panel rendered="#{not empty mySummaryBean.employeeRunModel}">
<t:commonDataTable var="employee" value="#{mySummaryBean.employeeRunModel}" rows="10"
id="employeeTable"
rowStyle="#{employee.employeeErrorStatus}">
.........
</t:commonDataTable>
</p:panel>
</h:form>
</p:fieldset>
</ui:define>
</ui:composition>