Problem with Paging and Sorting using a TabPanel
I have an problem that I cannot figure out, or find any information about on the web. I am hoping someone can help me out. On the Status Page, there is a tabbed Panel with several pages on them. The pages contain extendedDataTables with sorting and a dataScroller.
On the First Page, Status, the paging and sorting only works (some of the time), on the first tab, never on the subsequent tabs. The second page, Summary, all works as expected. (It pages and the sorting works) Actually, there is a third page that also doesn't work. The only working page is the Summary page, which is the second in my menu list.
To me, the pages look identical, so I can't figure out why it isn't workingin the Status page. I am also new to JSF so I am not sure where to look next. Any quidance will be greatly appreciated!!!
I have even taken a "working .xhtml" page and copy pasted it into a nonworking page and it stops working.
I have a menu that contains a Status and a Summary link
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:s="http://jboss.org/schema/seam/taglib"
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:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
template="layout/template.xhtml">
<ui:define name="body">
<rich:messages id="messages" ajaxRendered="true" globalOnly="true" />
<div id="statusdiv">
<ui:insert name="statusBody"/>
</div>
</ui:define>
</ui:composition>
The summary page looks like:
<ui:define name="statusBody">
<h:form>
<h2>Summary</h2>
<rich:tabPanel id="summaryTabs" switchType="ajax">
<rich:tab id="sparesSummaryTab" name="Aircraft Spares" render="SparesTable">
<ui:include src="SparesTable.xhtml" />
</rich:tab>
<rich:tab id="partsSummaryTab" name="Aircraft Parts" render="PartsTable">
<ui:include src="PartsTable.xhtml" />
</rich:tab>
.......
</rich:tabPanel>
</h:form>
</ui:define>
the status page looks like:
<ui:define name="statusBody">
<h:form>
<h2>Status</h2>
<rich:tabPanel id="statusTabs" switchType="ajax">
<rich:tab id="aircraftTab" name="Aircraft" render="aircraft">
<ui:include src="aircraft.xhtml" />
</rich:tab>
<rich:tab id="baseTab" name="Base" render="base">
<ui:include src="base.xhtml" />
</rich:tab>
</h:form>
</ui:define>
aircraft.xhtml:
<!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:s="http://jboss.org/schema/seam/taglib"
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:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
xmlns:fn="http://java.sun.com/jsp/jstl/functions">
<a4j:region id="aircraftRegion">
<h:form id="aircraftTableForm" class="results" status="aircraftWaitStatus">
<h:outputText value="No aircraft exists" rendered="#{empty aircraftList.resultList}"/>
<a4j:region id="aircraftScrollerTopRegion" status="aircraftWaitStatus">
<rich:dataScroller id="aircraftTopScroller" align="left" for="aircraftTable" maxPages="10"
render="aircraftBottomScroller" />
</a4j:region>
<rich:extendedDataTable id="aircraftTable" var="aircraft" value="#{aircraftList.resultList}" rowKeyVar="rowix"
rendered="#{not empty aircraftList.resultList}" render="aircraftTopScroller, aircraftBottomScroller"
frozenColumns="2" first="0" rows="25" border="1" width="100%" height="300px" styleClass="scrolls"
sortMode="single" selectionMode="single"
onrowmouseover="this.style.backgroundColor='#E6E8FA'" onrowmouseout="this.style.backgroundColor='#FFFFFF'" >
<f:facet id="aircraftTableHeader" name="header">
<h:panelGrid id="summaryHeader" columns="6" columnClasses="gridContent">
<h:outputText value="Summary"></h:outputText>
<h:outputText value="Total: #{aircraftList.resultCount}"></h:outputText>
</h:panelGrid>
</f:facet>
<rich:column id="aircraftTailNumCol" label="Tail #"
sortBy="#{aircraft.tailNumber}" sortable="true" sortType="String">
<f:facet name="header">
<h:panelGroup>
<h:outputText id="aircraftTailNumHdr" value="Tail #"/>
</h:panelGroup>
</f:facet>
<h:outputText id="aircraftTailNum" value="#{aircraft.tailNumber}"/>
</rich:column>
<rich:column id="aircraftIDCol" label="Aircraft ID"
sortable="true" sortBy="#{aircraft.aircraftID}">
<f:facet name="header"><h:outputText id="aircraftIDHdr" value="Aircraft ID"/></f:facet>
<h:outputText id="aircraftID" value="#{aircraft.aircraftID}"/>
</rich:column>
<rich:column id="AircraftTypeCol" label="Type"
sortable="true" sortBy="#{aircraft.aircraftType}">
<f:facet name="header">
<h:panelGroup>
<h:outputText id="AircraftTypeColHdr" value="Type"/>
</h:panelGroup>
</f:facet>
<h:outputText id="aircraftType" value="#{aircraft.aircraftType}"/>
</rich:column>
...
<f:facet id="aircraftTableFooter" name="footer"></f:facet>
</rich:extendedDataTable>
</ui:composition>
Spares.xhtml page (this page works)
<!DOCTYPE composition 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:s="http://jboss.org/schema/seam/taglib"
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:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
xmlns:fn="http://java.sun.com/jsp/jstl/functions">
<a4j:region id="equipmentSparesRegion">
<h:form id="equipmentSparesByBaseForm" class="results">
<h:outputText value="No equipment spares exist" rendered="#{empty equipmentSparesByBaseList.resultList}"/>
<div>
<a4j:region id="equipmentSparesBaseSelectorRegion" status="equipmentSparesBaseStatus">
<h:outputText id="baseIDComboLabel" value="Base ID:"/>
<h:selectOneMenu id="equipmentSparesByBaseBaseIDCombo"
required="true"
value="#{equipmentSparesByBaseList.baseID}">
<f:selectItems value="#{equipmentSparesByBaseList.baseIDs}" />
<a4j:ajax event="select" render="equipmentSparesByBaseTable"/>
</h:selectOneMenu>
</a4j:region>
</div>
<a4j:region id="equipmentSparesScrollerTopRegion" status="equipmentSparesBaseStatus">
<rich:dataScroller id="equipmentSparesByBaseTopScroller" align="left" for="equipmentSparesByBaseTable" maxPages="10" render="equipmentSparesByBaseBottomScroller"/>
</a4j:region>
<rich:extendedDataTable id="equipmentSparesByBaseTable" var="equipmentSpares" value="#{equipmentSparesByBaseList.resultList}" rowKeyVar="rowix"
rendered="#{not empty equipmentSparesByBaseList.resultList}" render="equipmentSparesByBaseTopScroller, equipmentSparesByBaseBottomScroller"
frozenColumns="1" first="0" rows="25" border="1" width="100%" height="300px" styleClass="scrolls"
sortMode="single" selectionMode="single"
onrowmouseover="this.style.backgroundColor='#E6E8FA'" onrowmouseout="this.style.backgroundColor='#FFFFFF'">
<rich:column id="partNumberSummaryCol" label="Part #"
sortBy="#{equipmentSpares.partNumber}">
<f:facet name="header">
<h:outputText id="partNumberSummaryHdr" value="Part #"/>
</f:facet>
<h:outputText id="partNumberSummary" value="#{equipmentSpares.partNumber}"/>
</rich:column>
<rich:column id="partNameCol" label="Nomenclature"
sortBy="#{equipmentSpares.partName}">
<f:facet name="header">
<h:outputText id="partNameSummaryHdr" value="Nomenclature"/>
</f:facet>
<h:outputText id="partNameSummary" value="#{equipmentSpares.partName}"/>
</rich:column>
<rich:column id="supplyQtySummaryCol" label="Quantity"
sortBy="#{equipmentSpares.supplyQty}">
<f:facet name="header"><h:outputText id="supplyQtySummaryHdr" value="On Hand"/></f:facet>
<h:outputText id="supplyQtySummary" value="#{equipmentSpares.supplyQty}"/>
</rich:column>
<f:facet id="equipmentSparesByBaseTableFooter" name="footer"></f:facet>
</rich:extendedDataTable>
<a4j:region id="equipmentSparesScrollerBottomRegion" status="equipmentSparesBaseStatus">
<rich:dataScroller id="equipmentSparesByBaseBottomScroller" align="left" for="equipmentSparesByBaseTable" maxPages="10" render="equipmentSparesByBaseTopScroller"/>
</a4j:region>
</h:form>
</a4j:region>
</ui:composition>