Here is my
JSF code.
<t
anelGrid columns="1" border="1" bgcolor="pink" width="100%">
<h
utputText value="Search Results" styleClass="standard" />
<x
ataTable id="datas"
styleClass="standard"
border="1"
var="country"
value="#{searchResultModel.data}"
sortColumn="#{searchResultModel.sort}"
sortAscending="#{searchResultModel.ascending}"
preserveDataModel="true"
preserveSort="true"
rows="20"
rowIndexVar="rowindex"
rowCountVar="rowcount"
binding="#{dataSelector.dataTable}">
<x:columns value="#{searchResultModel.columnHeaders}" var="column">
<f:facet name="header">
<h
anelGroup>
<x:commandSortHeader columnName="#{column}" arrow="true">
<h
utputText value="#{column} " />
</x:commandSortHeader>
</h
anelGroup>
</f:facet>
<h
utputText value="#{searchResultModel.columnValue}" />
</x:columns>
</x
ataTable>
</t
anelGrid>
<h
anelGrid columns="1" styleClass="scrollerTable2" columnClasses="standardTable_ColumnCentered" >
<x
ataScroller id="scroll_1"
for="datas"
fastStep="5"
pageCountVar="pageCount"
pageIndexVar="pageIndex"
styleClass="scroller"
paginator="true"
paginatorMaxPages="9"
paginatorTableClass="paginator"
paginatorActiveColumnStyle="font-weight:bold;">
<f:facet name="first" >
<h:graphicImage url="/images/arrow-first.gif" border="1" />
</f:facet>
<f:facet name="last">
<h:graphicImage url="/images/arrow-last.gif" border="1" />
</f:facet>
<f:facet name="previous">
<h:graphicImage url="/images/arrow-previous.gif" border="1" />
</f:facet>
<f:facet name="next">
<h:graphicImage url="/images/arrow-next.gif" border="1" />
</f:facet>
<f:facet name="fastforward">
<h:graphicImage url="/images/arrow-ff.gif" border="1" />
</f:facet>
<f:facet name="fastrewind">
<h:graphicImage url="/images/arrow-fr.gif" border="1" />
</f:facet>
</x
ataScroller>
</h
anelGrid>