DataTable - Paginator

DataTable provides a highly customizable ajax paginator.

Documentation
IdYearBrandColor
b123c3141965RenaultBlue
4e24f5eb1980FiatRed
f6e4631c1966BMWBlack
43c052fd1983RenaultBlack
87ac3bc61993VolkswagenBrown
2cc967661986FiatBlue
57d25ab11982VolkswagenBlue
a56ad4271966AudiGreen
3d44e1131975JaguarSilver
eaf4fae51974AudiBlack
<h:form>
    <p:dataTable var="car" value="#{dtPaginatorView.cars}" rows="10" 
                 paginator="true"
                 paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
                 rowsPerPageTemplate="5,10,15">
        <p:column headerText="Id">
            <h:outputText value="#{car.id}" />
        </p:column>

        <p:column headerText="Year">
            <h:outputText value="#{car.year}" />
        </p:column>

        <p:column headerText="Brand">
            <h:outputText value="#{car.brand}" />
        </p:column>

        <p:column headerText="Color">
            <h:outputText value="#{car.color}" />
        </p:column>

        <f:facet name="paginatorTopLeft">
            <p:commandButton type="button" icon="pi pi-refresh" />
        </f:facet>

        <f:facet name="paginatorBottomRight">
            <p:commandButton type="button" icon="pi pi-cloud-upload" />
        </f:facet>

    </p:dataTable>
</h:form>

FREE THEMES

Built-in component themes created by the PrimeFaces Theme Designer.

nova-light Nova-Light
nova-dark Nova-Dark
nova-colored Nova-Colored
luna-blue Luna-Blue
luna-amber Luna-Amber
luna-green Luna-Green
luna-pink Luna-Pink
omega Omega

PREMIUM TEMPLATES

Create awesome applications in no time using the premium templates and impress your users.