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 ElsnerKaitlin Ostrosky IndiaChemel, James L Cpa RENEWAL02/15/2021
Amy ElsnerAika Inouye FranceBuckley Miller Wright NEW02/10/2021
Amy ElsnerDavid Darakjy SpainRousseaux, Michael Esq QUALIFIED02/22/2021
Amy ElsnerClaire Tollner AustraliaBuckley Miller Wright UNQUALIFIED02/22/2021
Amy ElsnerJohnson Sergi IndiaFeltz Printing Service NEGOTIATION02/20/2021
Total Customers:5
Anna Fali
Anna FaliFaith Gillian RussiaTruhlar And Truhlar Attys NEW01/27/2021
Anna FaliJennifer Amigon ArgentinaDorl, James J Esq UNQUALIFIED02/22/2021
Anna FaliMurillo Malet BrazilKing, Christopher A Esq QUALIFIED02/17/2021
Anna FaliTony Foller United KingdomBenton, John B Jr NEGOTIATION02/10/2021
Anna FaliJennifer Amigon AustraliaChapman, Ross E Esq NEW02/12/2021
Anna FaliMisaki Royster ArgentinaChanay, Jeffrey A Esq NEW01/31/2021
Anna FaliArvin Albares BrazilPrinting Dimensions QUALIFIED02/14/2021
Anna FaliJohnson Sergi ItalyKing, Christopher A Esq PROPOSAL02/18/2021
Total Customers:8
Asiya Javayant
Asiya JavayantClifford Rim BrazilMorlong Associates NEW02/11/2021
Asiya JavayantMujtaba Nicka ItalyBuckley Miller Wright UNQUALIFIED02/19/2021
Total Customers:2
Bernardo Dominic
Bernardo DominicAntonio Caudy United KingdomChanay, Jeffrey A Esq QUALIFIED02/02/2021
Bernardo DominicKadeem Flosi ItalyMorlong Associates UNQUALIFIED02/11/2021
Total Customers:2
Elwin Sharvill
Elwin SharvillIsabel Bowley ItalyFeiner Bros RENEWAL02/08/2021
Elwin SharvillMujtaba Nicka GermanyTruhlar And Truhlar Attys NEGOTIATION02/09/2021
Elwin SharvillIzzy Garufi AustraliaRangoni Of Florence RENEWAL01/27/2021
Elwin SharvillGreenwood Bolognia RussiaFeltz Printing Service NEW02/22/2021
Elwin SharvillJefferson Schemmer RussiaChemel, James L Cpa UNQUALIFIED02/07/2021
Elwin SharvillLeja Caldarera RussiaMorlong Associates UNQUALIFIED01/27/2021
Elwin SharvillDavid Darakjy AustraliaCommercial Press NEW02/14/2021
Total Customers:7
Ioni Bowcher
Ioni BowcherAditya Kusko United KingdomBenton, John B Jr NEGOTIATION01/28/2021
Ioni BowcherRodrigues Campain ItalyFeiner Bros NEW02/06/2021
Total Customers:2
Ivan Magalhaes
Ivan MagalhaesClaire Tollner IndiaBenton, John B Jr RENEWAL01/29/2021
Ivan MagalhaesRicardo Gaucho FranceFeltz Printing Service NEGOTIATION02/08/2021
Ivan MagalhaesChavez Briddick AustraliaMorlong Associates QUALIFIED02/13/2021
Ivan MagalhaesSilvio Slusarski JapanKing, Christopher A Esq NEW02/07/2021
Ivan MagalhaesJennifer Amigon ItalyMorlong Associates NEGOTIATION02/21/2021
Ivan MagalhaesMaria Marrier RussiaFeiner Bros UNQUALIFIED01/31/2021
Ivan MagalhaesFaith Gillian RussiaFeiner Bros NEGOTIATION02/16/2021
Ivan MagalhaesMaria Marrier AustraliaTruhlar And Truhlar Attys PROPOSAL02/10/2021
Total Customers:8
Onyama Limba
Onyama LimbaJames Butt SpainRousseaux, Michael Esq PROPOSAL02/25/2021
Onyama LimbaDeepesh Chui ArgentinaFeiner Bros UNQUALIFIED02/10/2021
Onyama LimbaKadeem Flosi ItalyTruhlar And Truhlar Attys RENEWAL02/04/2021
Onyama LimbaKaitlin Ostrosky ItalyCommercial Press RENEWAL01/30/2021
Onyama LimbaMisaki Royster ItalyFeiner Bros PROPOSAL01/30/2021
Onyama LimbaRicardo Gaucho RussiaTruhlar And Truhlar Attys QUALIFIED02/15/2021
Total Customers:6
Stephen Shaw
Xuxue Feng
Xuxue FengIvar Paprocki ItalyChemel, James L Cpa PROPOSAL02/05/2021
Xuxue FengRicardo Gaucho BrazilRangoni Of Florence RENEWAL01/30/2021
Xuxue FengOctavia Malet BrazilDorl, James J Esq UNQUALIFIED02/12/2021
Xuxue FengMujtaba Nicka United KingdomMorlong Associates NEW02/16/2021
Xuxue FengClifford Rim AustraliaTruhlar And Truhlar Attys NEGOTIATION02/07/2021
Total Customers:5
Rowspan
RepresentativeNameCountryCompanyStatusDate
Amy ElsnerKaitlin Ostrosky IndiaChemel, James L Cpa RENEWAL02/15/2021
Amy ElsnerAika Inouye FranceBuckley Miller Wright NEW02/10/2021
Amy ElsnerDavid Darakjy SpainRousseaux, Michael Esq QUALIFIED02/22/2021
Amy ElsnerClaire Tollner AustraliaBuckley Miller Wright UNQUALIFIED02/22/2021
Amy ElsnerJohnson Sergi IndiaFeltz Printing Service NEGOTIATION02/20/2021
Anna FaliFaith Gillian RussiaTruhlar And Truhlar Attys NEW01/27/2021
Anna FaliJennifer Amigon ArgentinaDorl, James J Esq UNQUALIFIED02/22/2021
Anna FaliMurillo Malet BrazilKing, Christopher A Esq QUALIFIED02/17/2021
Anna FaliTony Foller United KingdomBenton, John B Jr NEGOTIATION02/10/2021
Anna FaliJennifer Amigon AustraliaChapman, Ross E Esq NEW02/12/2021
Anna FaliMisaki Royster ArgentinaChanay, Jeffrey A Esq NEW01/31/2021
Anna FaliArvin Albares BrazilPrinting Dimensions QUALIFIED02/14/2021
Anna FaliJohnson Sergi ItalyKing, Christopher A Esq PROPOSAL02/18/2021
Asiya JavayantClifford Rim BrazilMorlong Associates NEW02/11/2021
Asiya JavayantMujtaba Nicka ItalyBuckley Miller Wright UNQUALIFIED02/19/2021
Bernardo DominicAntonio Caudy United KingdomChanay, Jeffrey A Esq QUALIFIED02/02/2021
Bernardo DominicKadeem Flosi ItalyMorlong Associates UNQUALIFIED02/11/2021
Elwin SharvillIsabel Bowley ItalyFeiner Bros RENEWAL02/08/2021
Elwin SharvillMujtaba Nicka GermanyTruhlar And Truhlar Attys NEGOTIATION02/09/2021
Elwin SharvillIzzy Garufi AustraliaRangoni Of Florence RENEWAL01/27/2021
Elwin SharvillGreenwood Bolognia RussiaFeltz Printing Service NEW02/22/2021
Elwin SharvillJefferson Schemmer RussiaChemel, James L Cpa UNQUALIFIED02/07/2021
Elwin SharvillLeja Caldarera RussiaMorlong Associates UNQUALIFIED01/27/2021
Elwin SharvillDavid Darakjy AustraliaCommercial Press NEW02/14/2021
Ioni BowcherAditya Kusko United KingdomBenton, John B Jr NEGOTIATION01/28/2021
Ioni BowcherRodrigues Campain ItalyFeiner Bros NEW02/06/2021
Ivan MagalhaesClaire Tollner IndiaBenton, John B Jr RENEWAL01/29/2021
Ivan MagalhaesRicardo Gaucho FranceFeltz Printing Service NEGOTIATION02/08/2021
Ivan MagalhaesChavez Briddick AustraliaMorlong Associates QUALIFIED02/13/2021
Ivan MagalhaesSilvio Slusarski JapanKing, Christopher A Esq NEW02/07/2021
Ivan MagalhaesJennifer Amigon ItalyMorlong Associates NEGOTIATION02/21/2021
Ivan MagalhaesMaria Marrier RussiaFeiner Bros UNQUALIFIED01/31/2021
Ivan MagalhaesFaith Gillian RussiaFeiner Bros NEGOTIATION02/16/2021
Ivan MagalhaesMaria Marrier AustraliaTruhlar And Truhlar Attys PROPOSAL02/10/2021
Onyama LimbaJames Butt SpainRousseaux, Michael Esq PROPOSAL02/25/2021
Onyama LimbaDeepesh Chui ArgentinaFeiner Bros UNQUALIFIED02/10/2021
Onyama LimbaKadeem Flosi ItalyTruhlar And Truhlar Attys RENEWAL02/04/2021
Onyama LimbaKaitlin Ostrosky ItalyCommercial Press RENEWAL01/30/2021
Onyama LimbaMisaki Royster ItalyFeiner Bros PROPOSAL01/30/2021
Onyama LimbaRicardo Gaucho RussiaTruhlar And Truhlar Attys QUALIFIED02/15/2021
Stephen ShawAntonio Caudy RussiaCommercial Press NEGOTIATION02/16/2021
Stephen ShawArvin Albares JapanCommercial Press NEGOTIATION02/25/2021
Stephen ShawSilvio Slusarski RussiaBenton, John B Jr RENEWAL02/21/2021
Stephen ShawArvin Albares BrazilPrinting Dimensions PROPOSAL02/24/2021
Stephen ShawMurillo Malet RussiaChanay, Jeffrey A Esq NEW01/27/2021
Xuxue FengIvar Paprocki ItalyChemel, James L Cpa PROPOSAL02/05/2021
Xuxue FengRicardo Gaucho BrazilRangoni Of Florence RENEWAL01/30/2021
Xuxue FengOctavia Malet BrazilDorl, James J Esq UNQUALIFIED02/12/2021
Xuxue FengMujtaba Nicka United KingdomMorlong Associates NEW02/16/2021
Xuxue FengClifford Rim AustraliaTruhlar And Truhlar Attys NEGOTIATION02/07/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>