1
我有一個包含2個選項卡的primeface頁面。這兩個選項卡都有自己的數據表。當完成查詢數據,在dataTable的第一選項卡顯示查詢的數據不錯,但第二個選項卡不(請參考圖片。)
這裏是我的XHTML文件的代碼Primefaces DataTable在第二個選項卡中不顯示數據
<code>
<h:body>`enter code here`
<h:form id="myForm">
<p:menubar>
<p:menuitem value="Logout" icon="ui-icon-close" ajax="false" immediate="true" action="#{logoutManagedBean.logout}" />
</p:menubar>
<p:growl id="growlExtractTimesheet" sticky="false" showDetail="true" life="3000" />
<h:panelGrid style="margin-top:20px; border:none; border-style: none; border-width: 0px;" columns="7" >
<p:outputLabel for="fromDateCalendar" value=' From ' />
<p:calendar id='fromDateCalendar'
value="#{dataProcessingManagedBean.fromDate}"
binding="#{dataProcessingManagedBean.fromDateCalendar}"
pattern="dd-MMM-yyyy"
required="true"
requiredMessage="From Date Required"
valueChangeListener="#{dataProcessingManagedBean.determineExtractButtonDisability}" >
<p:ajax event="dateSelect" partialSubmit="fromDateCalendar" update="extractTimesheetButton" />
</p:calendar>
<p:outputLabel for="toDateCalendar" value='To ' />
<p:calendar id='toDateCalendar'
value="#{dataProcessingManagedBean.toDate}"
binding="#{dataProcessingManagedBean.toDateCalendar}"
pattern="dd-MMM-yyyy"
required="true"
requiredMessage="To Date Required"
valueChangeListener="#{dataProcessingManagedBean.determineExtractButtonDisability}" >
<p:ajax event="dateSelect" partialSubmit="toDateCalendar" update="extractTimesheetButton" />
</p:calendar>
<p:commandButton id='extractTimesheetButton'
actionListener ="#{dataProcessingManagedBean.extractTimesheetData}"
binding ="#{dataProcessingManagedBean.extractTimesheetCommandButton}"
update='myForm:tabview:detailDataTable myForm:tabview:summaryDataTable myForm:downloadExcelsButton'
ajax="true" icon="ui-icon-calculator" >
</p:commandButton>
<p:commandButton id="downloadExcelsButton" ajax="false" actionListener="#{dataProcessingManagedBean.downloadExcelFile}"
binding="#{dataProcessingManagedBean.downloadExcelsCommandButton}" icon="ui-icon-arrowthick-1-s" disabled="true"/>
</h:panelGrid>
<p:tabView id='tabview' cache="false">
<p:tab title="Detail Data" id='detailTab'>
<p:dataTable id='detailDataTable' var="detailData" paginatorPosition="top"
value="#{dataProcessingManagedBean.detailDatas}" paginator="true"
rows="100" rowsPerPageTemplate="100,200,500,1000, 2000, 5000, 10000, 20000, 50000" lazy='true'
currentPageReportTemplate="Showing {startRecord}-{endRecord} out of {totalRecords}"
paginatorTemplate="{CurrentPageReport} {RowsPerPageDropdown} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} "
scrollable="true" scrollHeight="350"
liveResize="true" draggableColumns="true" resizableColumns="true"
selectionMode="multiple" selection="#{dataProcessingManagedBean.selectedDetailDatas}" rowKey="#{detailData.id}" >
<p:column headerText="Employee ID" width="80">
<h:outputText value="#{detailData.employeeId}" />
</p:column>
<p:column headerText="Employee Name Lastname" width="200">
<h:outputText value="#{detailData.employeeName}" />
</p:column>
<p:column headerText="Cost Center" width="100">
<h:outputText value="#{detailData.costCenter}" />
</p:column>
<p:column headerText="WBS Code" width="100">
<h:outputText value="#{detailData.wbsCode}" />
</p:column>
<p:column headerText="WBS Name" width="300">
<h:outputText value="#{detailData.wbsName}" />
</p:column>
<p:column headerText="Project Code" width="100">
<h:outputText value="#{detailData.projectCode}" />
</p:column>
<p:column headerText="Project Name" width="300">
<h:outputText value="#{detailData.projectName}" />
</p:column>
<p:column headerText="Activity" width="300">
<h:outputText value="#{detailData.activity}" />
</p:column>
<p:column headerText="Task" width="300">
<h:outputText value="#{detailData.task}" />
</p:column>
<p:column headerText="Role" width="150">
<h:outputText value="#{detailData.role}" />
</p:column>
<p:column headerText="Timesheet Date" width="100">
<h:outputText value="#{detailData.timesheetDate}" />
</p:column>
<p:column headerText="Total Working Hours" width="150">
<h:outputText value="#{detailData.totalWorkingHours}" />
</p:column>
<p:column headerText="Utilized" width="50">
<h:outputText value="#{detailData.utilized}" />
</p:column>
<p:column headerText="Billable" width="50">
<h:outputText value="#{detailData.billable}" />
</p:column>
<p:column headerText="OT" width="50">
<h:outputText value="#{detailData.ot}" />
</p:column>
<p:column headerText="On Time" width="80">
<h:outputText value="#{detailData.onTime}" />
</p:column>
<p:column headerText="Status" width="80">
<h:outputText value="#{detailData.status}" />
</p:column>
<p:column headerText="Remark" width="500">
<h:outputText value="#{detailData.remark}" />
</p:column>
</p:dataTable>
</p:tab>
<p:tab title="Summary Data" id='summaryTab'>
<p:dataTable id='summaryDataTable' var="summaryData" paginatorPosition="top"
value="#{dataProcessingManagedBean.summaryDatas}" paginator="true"
rows="50" rowsPerPageTemplate="50, 100, 200" lazy='true'
currentPageReportTemplate="Showing {startRecord}-{endRecord} out of {totalRecords}"
paginatorTemplate="{CurrentPageReport} {RowsPerPageDropdown} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} "
scrollable="true" scrollHeight="350"
liveResize="true" draggableColumns="true" resizableColumns="true"
selectionMode="multiple" selection="#{dataProcessingManagedBean.selectedSummaryDatas}" rowKey="#{summaryData.id}" >
<p:column headerText="Employee ID" width="80">
<h:outputText value="#{summaryData.employeeId}" />
</p:column>
<p:column headerText="Employee Name Lastname" width="200">
<h:outputText value="#{summaryData.employeeName}" />
</p:column>
<p:column headerText="Normal Billable hour(s)" width="100">
<h:outputText value="#{summaryData.normalBillableHours}" />
</p:column>
<p:column headerText="Normal Non-Billable hour(s)" width="100">
<h:outputText value="#{summaryData.normalNonBillableHours}" />
</p:column>
<p:column headerText="Total Normal hours(s)" width="100">
<h:outputText value="#{summaryData.totalNormalHours}" />
</p:column>
<p:column headerText="OT Billable hour(s)" width="100">
<h:outputText value="#{summaryData.otBillableHours}" />
</p:column>
<p:column headerText="OT Non-Billable hour(s)" width="100">
<h:outputText value="#{summaryData.otNonBillableHours}" />
</p:column>
<p:column headerText="Total OT hour(s)" width="100">
<h:outputText value="#{summaryData.totalOTHours}" />
</p:column>
<p:column headerText="Total hour(s)" width="100">
<h:outputText value="#{summaryData.totalHours}" />
</p:column>
</p:dataTable>
</p:tab>
</p:tabView>
<p:ajaxStatus onstart="PF('statusDialog').show()" onsuccess="PF('statusDialog').hide()" onerror="PF('statusDialog').hide()"/>
<p:dialog id="waitDialog" widgetVar="statusDialog" modal="true" draggable="false" closable="false" resizable="false" showHeader="false">
<p:graphicImage value="/images/ajax_wait.gif" />
</p:dialog>
</h:form>
</h:body>
</html>
,如果有人碰到過這個問題,並解決它。請幫忙謝謝。
首先我會對所有屬性使用雙引號。不知道爲什麼第二個dataTable沒有顯示,但我也有一些奇怪的行爲與'p:tabView'(也許這取決於你把它放在裏面)。因此,大多數情況下我只使用'p:TabView'作爲觸發器。在你的情況下,'p:tabs'將是空的,一個ajax監聽器'tabChange'將被添加到'p:tabView.'數據表是有條件渲染的,然後取決於你選擇的選項卡。 – opfau