Locale

Change the locale of the datepicker, schedule and client side validation messages.

Language
English
English
English
French
German
German
German
Italian
Korean
Spanish
Catalan
Dutch
Portuguese
Portuguese
Arabic
Arabic
Bulgarian
Czech
Greek
Persian
Finnish
Danish
Hindi
Indonesian
Croatian
Japanese
Hungarian
Hebrew
Georgian
Central Kurdish
Khmer
Kyrgyz
Kazakh
Lithuanian
Latvian
Malay
Norwegian
Polish
Romanian
Russian
Slovak
Slovenian
Serbian
Serbian
Swedish
Thai
Turkish
Ukrainian
Vietnamese
Chinese
Chinese

Input Style

Themes

PrimeOne
Saga Saga
Vela Vela
Arya Arya
Bootstrap
bootstrap4-blue-light Bootstrap Blue
bootstrap4-purple-light Bootstrap Purple
bootstrap4-blue-dark Bootstrap Blue
bootstrap4-purple-dark Bootstrap Purple
Material Design
material-indigo-light Indigo
material-deeppurple-light' Deep Purple
material-indigo-dark Indigo
material-deeppurple-dark' Deep Purple
Material Design Compact
material-indigo-light Indigo
material-deeppurple-light' Deep Purple
material-indigo-dark Indigo
material-deeppurple-dark' Deep Purple

DataTable Row Group

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

Header Row
RepresentativeNameCountryCompanyStatusDate
Amy Elsner
Amy ElsnerDeepesh S Kusko ArgentinaKing, Christopher A Esq NEW06/11/2024
Amy ElsnerCody G Figeroa CanadaChemel, James L Cpa RENEWAL05/24/2024
Amy ElsnerRodrigues R Wieser United KingdomPrinting Dimensions UNQUALIFIED06/13/2024
Amy ElsnerTony M Whobrey CanadaChemel, James L Cpa RENEWAL05/29/2024
Total Customers:4
Anna Fali
Anna FaliMayumi T Albares AustraliaChanay, Jeffrey A Esq UNQUALIFIED06/04/2024
Anna FaliMunro B Kusko BrazilCommercial Press PROPOSAL05/27/2024
Anna FaliMaisha F Tollner IndiaTruhlar And Truhlar Attys RENEWAL06/02/2024
Anna FaliAdams V Perin JapanRousseaux, Michael Esq QUALIFIED05/29/2024
Total Customers:4
Asiya Javayant
Asiya JavayantLeon T Darakjy FranceTruhlar And Truhlar Attys PROPOSAL06/18/2024
Asiya JavayantNicolas J Wieser GermanyRousseaux, Michael Esq PROPOSAL06/14/2024
Total Customers:2
Bernardo Dominic
Bernardo DominicMaria L Vocelka BrazilKing, Christopher A Esq RENEWAL05/31/2024
Bernardo DominicMayumi O Doe FranceRangoni Of Florence PROPOSAL06/14/2024
Bernardo DominicGreenwood O Caudy ArgentinaRousseaux, Michael Esq QUALIFIED06/06/2024
Bernardo DominicKaitlin Q Venere CanadaFeltz Printing Service NEW06/01/2024
Bernardo DominicJennifer X Schemmer JapanTruhlar And Truhlar Attys RENEWAL06/17/2024
Total Customers:5
Elwin Sharvill
Elwin SharvillMisaki I Venere BrazilMorlong Associates PROPOSAL05/29/2024
Elwin SharvillIsabel Z Malet ArgentinaChemel, James L Cpa PROPOSAL05/27/2024
Elwin SharvillAshley G Campain United KingdomFeiner Bros UNQUALIFIED06/18/2024
Elwin SharvillIsabel L Bowley ArgentinaKing, Christopher A Esq UNQUALIFIED05/25/2024
Elwin SharvillMorrow F Venere United KingdomFeiner Bros UNQUALIFIED06/12/2024
Total Customers:5
Ioni Bowcher
Ioni BowcherOctavia O Gaucho AustraliaKing, Christopher A Esq UNQUALIFIED05/28/2024
Ioni BowcherAshley F Ruta United KingdomPrinting Dimensions RENEWAL06/13/2024
Ioni BowcherAlejandro J Gaucho RussiaCommercial Press PROPOSAL06/20/2024
Ioni BowcherIzzy V Glick AustraliaPrinting Dimensions PROPOSAL06/09/2024
Ioni BowcherMisaki R Stenseth FranceRangoni Of Florence QUALIFIED05/24/2024
Total Customers:5
Ivan Magalhaes
Ivan MagalhaesChavez W Amigon IndiaChapman, Ross E Esq PROPOSAL06/11/2024
Ivan MagalhaesMaisha P Malet ArgentinaChanay, Jeffrey A Esq NEGOTIATION06/07/2024
Ivan MagalhaesKaitlin J Oldroyd ItalyDorl, James J Esq QUALIFIED05/25/2024
Ivan MagalhaesAlejandro D Royster SpainDorl, James J Esq QUALIFIED06/04/2024
Total Customers:4
Onyama Limba
Onyama LimbaStacey P Whobrey RussiaRangoni Of Florence QUALIFIED06/16/2024
Onyama LimbaMaria T Sergi GermanyChanay, Jeffrey A Esq UNQUALIFIED06/18/2024
Onyama LimbaJefferson R Glick United KingdomBuckley Miller Wright QUALIFIED06/15/2024
Total Customers:3
Stephen Shaw
Xuxue Feng
Xuxue FengLeon G Paprocki BrazilBenton, John B Jr UNQUALIFIED06/18/2024
Xuxue FengTony Q Maclead FranceCommercial Press PROPOSAL06/04/2024
Xuxue FengAdams N Ostrosky IndiaBuckley Miller Wright UNQUALIFIED05/28/2024
Xuxue FengJennifer L Inouye AustraliaChemel, James L Cpa RENEWAL06/11/2024
Xuxue FengJennifer L Glick IndiaBenton, John B Jr NEW06/01/2024
Xuxue FengIvar E Marrier IndiaChemel, James L Cpa RENEWAL06/12/2024
Xuxue FengJames X Flosi FranceCommercial Press NEGOTIATION05/23/2024
Xuxue FengKadeem M Ostrosky CanadaRangoni Of Florence RENEWAL06/06/2024
Xuxue FengNicolas L Malet SpainFeltz Printing Service QUALIFIED06/08/2024
Xuxue FengDarci I Figeroa FranceBenton, John B Jr PROPOSAL06/08/2024
Xuxue FengAika W Whobrey ItalyBenton, John B Jr NEGOTIATION06/20/2024
Xuxue FengDarci B Schemmer IndiaFeltz Printing Service NEW05/25/2024
Total Customers:12
Rowspan
RepresentativeNameCountryCompanyStatusDate
Amy ElsnerDeepesh S Kusko ArgentinaKing, Christopher A Esq NEW06/11/2024
Amy ElsnerCody G Figeroa CanadaChemel, James L Cpa RENEWAL05/24/2024
Amy ElsnerRodrigues R Wieser United KingdomPrinting Dimensions UNQUALIFIED06/13/2024
Amy ElsnerTony M Whobrey CanadaChemel, James L Cpa RENEWAL05/29/2024
Anna FaliMayumi T Albares AustraliaChanay, Jeffrey A Esq UNQUALIFIED06/04/2024
Anna FaliMunro B Kusko BrazilCommercial Press PROPOSAL05/27/2024
Anna FaliMaisha F Tollner IndiaTruhlar And Truhlar Attys RENEWAL06/02/2024
Anna FaliAdams V Perin JapanRousseaux, Michael Esq QUALIFIED05/29/2024
Asiya JavayantLeon T Darakjy FranceTruhlar And Truhlar Attys PROPOSAL06/18/2024
Asiya JavayantNicolas J Wieser GermanyRousseaux, Michael Esq PROPOSAL06/14/2024
Bernardo DominicMaria L Vocelka BrazilKing, Christopher A Esq RENEWAL05/31/2024
Bernardo DominicMayumi O Doe FranceRangoni Of Florence PROPOSAL06/14/2024
Bernardo DominicGreenwood O Caudy ArgentinaRousseaux, Michael Esq QUALIFIED06/06/2024
Bernardo DominicKaitlin Q Venere CanadaFeltz Printing Service NEW06/01/2024
Bernardo DominicJennifer X Schemmer JapanTruhlar And Truhlar Attys RENEWAL06/17/2024
Elwin SharvillMisaki I Venere BrazilMorlong Associates PROPOSAL05/29/2024
Elwin SharvillIsabel Z Malet ArgentinaChemel, James L Cpa PROPOSAL05/27/2024
Elwin SharvillAshley G Campain United KingdomFeiner Bros UNQUALIFIED06/18/2024
Elwin SharvillIsabel L Bowley ArgentinaKing, Christopher A Esq UNQUALIFIED05/25/2024
Elwin SharvillMorrow F Venere United KingdomFeiner Bros UNQUALIFIED06/12/2024
Ioni BowcherOctavia O Gaucho AustraliaKing, Christopher A Esq UNQUALIFIED05/28/2024
Ioni BowcherAshley F Ruta United KingdomPrinting Dimensions RENEWAL06/13/2024
Ioni BowcherAlejandro J Gaucho RussiaCommercial Press PROPOSAL06/20/2024
Ioni BowcherIzzy V Glick AustraliaPrinting Dimensions PROPOSAL06/09/2024
Ioni BowcherMisaki R Stenseth FranceRangoni Of Florence QUALIFIED05/24/2024
Ivan MagalhaesChavez W Amigon IndiaChapman, Ross E Esq PROPOSAL06/11/2024
Ivan MagalhaesMaisha P Malet ArgentinaChanay, Jeffrey A Esq NEGOTIATION06/07/2024
Ivan MagalhaesKaitlin J Oldroyd ItalyDorl, James J Esq QUALIFIED05/25/2024
Ivan MagalhaesAlejandro D Royster SpainDorl, James J Esq QUALIFIED06/04/2024
Onyama LimbaStacey P Whobrey RussiaRangoni Of Florence QUALIFIED06/16/2024
Onyama LimbaMaria T Sergi GermanyChanay, Jeffrey A Esq UNQUALIFIED06/18/2024
Onyama LimbaJefferson R Glick United KingdomBuckley Miller Wright QUALIFIED06/15/2024
Stephen ShawEmily Y Rim RussiaBuckley Miller Wright PROPOSAL06/21/2024
Stephen ShawMorrow R Gaucho ItalyTruhlar And Truhlar Attys NEGOTIATION06/18/2024
Stephen ShawRicardo Q Dilliard IndiaKing, Christopher A Esq UNQUALIFIED06/09/2024
Stephen ShawWickens B Oldroyd BrazilChapman, Ross E Esq QUALIFIED06/09/2024
Stephen ShawAditya X Caldarera SpainKing, Christopher A Esq UNQUALIFIED05/26/2024
Stephen ShawRodrigues F Maclead JapanFeiner Bros UNQUALIFIED05/28/2024
Xuxue FengLeon G Paprocki BrazilBenton, John B Jr UNQUALIFIED06/18/2024
Xuxue FengTony Q Maclead FranceCommercial Press PROPOSAL06/04/2024
Xuxue FengAdams N Ostrosky IndiaBuckley Miller Wright UNQUALIFIED05/28/2024
Xuxue FengJennifer L Inouye AustraliaChemel, James L Cpa RENEWAL06/11/2024
Xuxue FengJennifer L Glick IndiaBenton, John B Jr NEW06/01/2024
Xuxue FengIvar E Marrier IndiaChemel, James L Cpa RENEWAL06/12/2024
Xuxue FengJames X Flosi FranceCommercial Press NEGOTIATION05/23/2024
Xuxue FengKadeem M Ostrosky CanadaRangoni Of Florence RENEWAL06/06/2024
Xuxue FengNicolas L Malet SpainFeltz Printing Service QUALIFIED06/08/2024
Xuxue FengDarci I Figeroa FranceBenton, John B Jr PROPOSAL06/08/2024
Xuxue FengAika W Whobrey ItalyBenton, John B Jr NEGOTIATION06/20/2024
Xuxue FengDarci B Schemmer IndiaFeltz Printing Service NEW05/25/2024

<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="inline-flex align-items-center" style="vertical-align: middle">
                        <p:graphicImage name="images/avatar/#{customer.representative.image}" library="demo" width="32" style="vertical-align: middle"/>
                        <h:outputText styleClass="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>