Input Style

Free Themes

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

Saga Saga
Vela Vela
Arya Arya

Legacy Free Themes

Luna Amber Luna Amber
Luna Blue Luna Blue
Luna Green Luna Green
Luna Pink Luna Pink
Nova Nova
Nova Nova Alt
Nova Nova Accent

PREMIUM TEMPLATES

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

DataTable Row Grouping

Rows can be grouped in two ways, using rowGroup component or with groupRow attribute on a column.

Header Row
RepresentativeNameCountryCompanyStatusDate
Amy Elsner
Amy ElsnerJeanfrancois Venere JapanBenton, John B Jr NEGOTIATION02/04/2021
Amy ElsnerJefferson Schemmer United KingdomTruhlar And Truhlar Attys NEGOTIATION01/30/2021
Amy ElsnerWickens Nestle GermanyChanay, Jeffrey A Esq PROPOSAL02/10/2021
Amy ElsnerMisaki Royster CanadaKing, Christopher A Esq NEW02/16/2021
Amy ElsnerIvar Paprocki JapanChemel, James L Cpa QUALIFIED02/08/2021
Amy ElsnerChavez Briddick GermanyDorl, James J Esq RENEWAL02/20/2021
Total Customers:6
Anna Fali
Anna FaliClaire Tollner FranceRousseaux, Michael Esq PROPOSAL02/13/2021
Anna FaliMurillo Malet JapanMorlong Associates QUALIFIED02/17/2021
Anna FaliMaisha Rulapaugh ItalyMorlong Associates RENEWAL02/25/2021
Anna FaliJuan Wieser JapanKing, Christopher A Esq RENEWAL02/06/2021
Anna FaliWickens Nestle GermanyRangoni Of Florence PROPOSAL02/04/2021
Total Customers:5
Asiya Javayant
Asiya JavayantClifford Rim FranceMorlong Associates PROPOSAL02/01/2021
Total Customers:1
Bernardo Dominic
Bernardo DominicRicardo Gaucho BrazilRangoni Of Florence QUALIFIED02/12/2021
Bernardo DominicCody Saylors FranceKing, Christopher A Esq UNQUALIFIED02/11/2021
Bernardo DominicKaitlin Ostrosky United KingdomChapman, Ross E Esq PROPOSAL02/18/2021
Total Customers:3
Elwin Sharvill
Elwin SharvillJuan Wieser CanadaCommercial Press NEW02/20/2021
Elwin SharvillDeepesh Chui BrazilRangoni Of Florence NEGOTIATION02/07/2021
Elwin SharvillMisaki Royster RussiaTruhlar And Truhlar Attys RENEWAL01/29/2021
Elwin SharvillTony Foller United KingdomPrinting Dimensions RENEWAL02/22/2021
Elwin SharvillIsabel Bowley RussiaFeltz Printing Service NEGOTIATION01/29/2021
Total Customers:5
Ioni Bowcher
Ioni BowcherFaith Gillian JapanChanay, Jeffrey A Esq PROPOSAL02/15/2021
Ioni BowcherDavid Darakjy FranceChemel, James L Cpa NEGOTIATION02/03/2021
Ioni BowcherRicardo Gaucho IndiaPrinting Dimensions RENEWAL02/04/2021
Ioni BowcherJones Vocelka AustraliaCommercial Press QUALIFIED02/14/2021
Ioni BowcherLeon Oldroyd IndiaCommercial Press PROPOSAL02/20/2021
Ioni BowcherIsabel Bowley IndiaBuckley Miller Wright PROPOSAL02/19/2021
Total Customers:6
Ivan Magalhaes
Ivan MagalhaesMaisha Rulapaugh JapanCommercial Press PROPOSAL01/29/2021
Ivan MagalhaesClifford Rim CanadaBuckley Miller Wright NEW02/09/2021
Ivan MagalhaesClaire Tollner AustraliaChemel, James L Cpa PROPOSAL02/11/2021
Ivan MagalhaesMorrow Ruta JapanMorlong Associates NEGOTIATION02/23/2021
Ivan MagalhaesRicardo Gaucho IndiaRangoni Of Florence QUALIFIED02/11/2021
Ivan MagalhaesJeanfrancois Venere AustraliaMorlong Associates QUALIFIED02/23/2021
Ivan MagalhaesOctavia Malet AustraliaTruhlar And Truhlar Attys NEW02/06/2021
Ivan MagalhaesAruna Figeroa AustraliaChemel, James L Cpa NEW02/18/2021
Ivan MagalhaesMaria Marrier RussiaTruhlar And Truhlar Attys NEGOTIATION02/10/2021
Ivan MagalhaesNicolas Iturbide SpainChemel, James L Cpa NEGOTIATION02/19/2021
Ivan MagalhaesDarci Poquette IndiaChemel, James L Cpa PROPOSAL02/20/2021
Total Customers:11
Onyama Limba
Onyama LimbaTony Foller CanadaFeltz Printing Service PROPOSAL02/17/2021
Onyama LimbaCody Saylors FranceBuckley Miller Wright UNQUALIFIED02/13/2021
Onyama LimbaRodrigues Campain SpainChemel, James L Cpa RENEWAL02/01/2021
Total Customers:3
Stephen Shaw
Xuxue Feng
Xuxue FengRicardo Gaucho IndiaChapman, Ross E Esq RENEWAL02/24/2021
Xuxue FengClaire Tollner SpainCommercial Press RENEWAL02/21/2021
Xuxue FengNicolas Iturbide AustraliaBuckley Miller Wright PROPOSAL02/20/2021
Xuxue FengJuan Wieser ItalyCommercial Press RENEWAL02/01/2021
Xuxue FengMisaki Royster GermanyBenton, John B Jr RENEWAL02/20/2021
Xuxue FengJames Butt BrazilDorl, James J Esq NEGOTIATION02/15/2021
Xuxue FengMaisha Rulapaugh IndiaChanay, Jeffrey A Esq NEW02/02/2021
Xuxue FengSinclair Waycott IndiaTruhlar And Truhlar Attys NEGOTIATION02/20/2021
Total Customers:8
Rowspan
RepresentativeNameCountryCompanyStatusDate
Amy ElsnerJeanfrancois Venere JapanBenton, John B Jr NEGOTIATION02/04/2021
Amy ElsnerJefferson Schemmer United KingdomTruhlar And Truhlar Attys NEGOTIATION01/30/2021
Amy ElsnerWickens Nestle GermanyChanay, Jeffrey A Esq PROPOSAL02/10/2021
Amy ElsnerMisaki Royster CanadaKing, Christopher A Esq NEW02/16/2021
Amy ElsnerIvar Paprocki JapanChemel, James L Cpa QUALIFIED02/08/2021
Amy ElsnerChavez Briddick GermanyDorl, James J Esq RENEWAL02/20/2021
Anna FaliClaire Tollner FranceRousseaux, Michael Esq PROPOSAL02/13/2021
Anna FaliMurillo Malet JapanMorlong Associates QUALIFIED02/17/2021
Anna FaliMaisha Rulapaugh ItalyMorlong Associates RENEWAL02/25/2021
Anna FaliJuan Wieser JapanKing, Christopher A Esq RENEWAL02/06/2021
Anna FaliWickens Nestle GermanyRangoni Of Florence PROPOSAL02/04/2021
Asiya JavayantClifford Rim FranceMorlong Associates PROPOSAL02/01/2021
Bernardo DominicRicardo Gaucho BrazilRangoni Of Florence QUALIFIED02/12/2021
Bernardo DominicCody Saylors FranceKing, Christopher A Esq UNQUALIFIED02/11/2021
Bernardo DominicKaitlin Ostrosky United KingdomChapman, Ross E Esq PROPOSAL02/18/2021
Elwin SharvillJuan Wieser CanadaCommercial Press NEW02/20/2021
Elwin SharvillDeepesh Chui BrazilRangoni Of Florence NEGOTIATION02/07/2021
Elwin SharvillMisaki Royster RussiaTruhlar And Truhlar Attys RENEWAL01/29/2021
Elwin SharvillTony Foller United KingdomPrinting Dimensions RENEWAL02/22/2021
Elwin SharvillIsabel Bowley RussiaFeltz Printing Service NEGOTIATION01/29/2021
Ioni BowcherFaith Gillian JapanChanay, Jeffrey A Esq PROPOSAL02/15/2021
Ioni BowcherDavid Darakjy FranceChemel, James L Cpa NEGOTIATION02/03/2021
Ioni BowcherRicardo Gaucho IndiaPrinting Dimensions RENEWAL02/04/2021
Ioni BowcherJones Vocelka AustraliaCommercial Press QUALIFIED02/14/2021
Ioni BowcherLeon Oldroyd IndiaCommercial Press PROPOSAL02/20/2021
Ioni BowcherIsabel Bowley IndiaBuckley Miller Wright PROPOSAL02/19/2021
Ivan MagalhaesMaisha Rulapaugh JapanCommercial Press PROPOSAL01/29/2021
Ivan MagalhaesClifford Rim CanadaBuckley Miller Wright NEW02/09/2021
Ivan MagalhaesClaire Tollner AustraliaChemel, James L Cpa PROPOSAL02/11/2021
Ivan MagalhaesMorrow Ruta JapanMorlong Associates NEGOTIATION02/23/2021
Ivan MagalhaesRicardo Gaucho IndiaRangoni Of Florence QUALIFIED02/11/2021
Ivan MagalhaesJeanfrancois Venere AustraliaMorlong Associates QUALIFIED02/23/2021
Ivan MagalhaesOctavia Malet AustraliaTruhlar And Truhlar Attys NEW02/06/2021
Ivan MagalhaesAruna Figeroa AustraliaChemel, James L Cpa NEW02/18/2021
Ivan MagalhaesMaria Marrier RussiaTruhlar And Truhlar Attys NEGOTIATION02/10/2021
Ivan MagalhaesNicolas Iturbide SpainChemel, James L Cpa NEGOTIATION02/19/2021
Ivan MagalhaesDarci Poquette IndiaChemel, James L Cpa PROPOSAL02/20/2021
Onyama LimbaTony Foller CanadaFeltz Printing Service PROPOSAL02/17/2021
Onyama LimbaCody Saylors FranceBuckley Miller Wright UNQUALIFIED02/13/2021
Onyama LimbaRodrigues Campain SpainChemel, James L Cpa RENEWAL02/01/2021
Stephen ShawJennifer Amigon ArgentinaCommercial Press RENEWAL02/15/2021
Stephen ShawLeon Oldroyd IndiaBenton, John B Jr NEW01/29/2021
Xuxue FengRicardo Gaucho IndiaChapman, Ross E Esq RENEWAL02/24/2021
Xuxue FengClaire Tollner SpainCommercial Press RENEWAL02/21/2021
Xuxue FengNicolas Iturbide AustraliaBuckley Miller Wright PROPOSAL02/20/2021
Xuxue FengJuan Wieser ItalyCommercial Press RENEWAL02/01/2021
Xuxue FengMisaki Royster GermanyBenton, John B Jr RENEWAL02/20/2021
Xuxue FengJames Butt BrazilDorl, James J Esq NEGOTIATION02/15/2021
Xuxue FengMaisha Rulapaugh IndiaChanay, Jeffrey A Esq NEW02/02/2021
Xuxue FengSinclair Waycott IndiaTruhlar And Truhlar Attys NEGOTIATION02/20/2021

<div class="card">
    <h5 class="first">Header Row</h5>
    <h:form>
        <p:dataTable var="customer" value="#{dtRowGroupView.customers}" sortBy="#{customer.representative.name}">
            <p:headerRow field="representative.name"
                         expandable="true" 
                         expanded="#{customer.representative.name != 'Stephen Shaw'}">
                
                <p:column colspan="6">
                    <div class="p-d-inline-flex p-ai-center" style="vertical-align: middle">
                        <p:graphicImage name="images/avatar/#{customer.representative.image}" library="demo" width="32" style="vertical-align: middle"/>
                        <h:outputText styleClass="p-ml-2" value="#{customer.representative.name}"/>
                    </div>
                </p:column>
            </p:headerRow>

            <p:column headerText="Representative">
                <h:outputText value="#{customer.representative.name}" />
            </p:column>

            <p:column headerText="Name">
                <h:outputText value="#{customer.name}" />
            </p:column>

            <p:column headerText="Country">
                <span class="flag flag-#{customer.country.code}" style="width: 30px; height: 20px"/>
                <h:outputText style="vertical-align: middle; margin-left: .5rem" value="#{customer.country}"/>
            </p:column>

            <p:column headerText="Company">
                <h:outputText value="#{customer.company}" />
            </p:column>

            <p:column headerText="Status">
                <span class="customer-badge status-#{customer.status.name().toLowerCase()}">#{customer.status}</span>
            </p:column>

            <p:column headerText="Date">
                <h:outputText value="#{customer.date}">
                    <f:convertDateTime pattern="MM/dd/yyyy" type="localDate"/>
                </h:outputText>
            </p:column>

            <p:summaryRow>
                <p:column colspan="5" style="text-align:right">
                    <h:outputText value="Total Customers:"/>
                </p:column>
                <p:column>
                    <h:outputText value="#{dtRowGroupView.getTotalCount(customer.representative.name)}"/>
                </p:column>
            </p:summaryRow>
        </p:dataTable>
    </h:form>
</div>

<div class="card">
    <h5>Rowspan</h5>
    <h:form>
        <p:dataTable var="customer" value="#{dtRowGroupView.customers}">
            <p:column  headerText="Representative" groupRow="true">
                <p:graphicImage name="images/avatar/#{customer.representative.image}" library="demo"
                                width="32" style="vertical-align: middle"/>
                <h:outputText style="vertical-align: middle; margin-left: .5rem"
                              value="#{customer.representative.name}"/>
            </p:column>

            <p:column headerText="Name">
                <h:outputText value="#{customer.name}" />
            </p:column>

            <p:column headerText="Country">
                <span class="flag flag-#{customer.country.code}" style="width: 30px; height: 20px"/>
                <h:outputText style="vertical-align: middle; margin-left: .5rem" value="#{customer.country}"/>
            </p:column>

            <p:column headerText="Company">
                <h:outputText value="#{customer.company}" />
            </p:column>

            <p:column headerText="Status">
                <span class="customer-badge status-#{customer.status.name().toLowerCase()}">#{customer.status}</span>
            </p:column>

            <p:column headerText="Date">
                <h:outputText value="#{customer.date}">
                    <f:convertDateTime pattern="MM/dd/yyyy" type="localDate"/>
                </h:outputText>
            </p:column>
        </p:dataTable>
    </h:form>
</div>