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 Scroll

Both vertical and horizontal scrolling of the data is supported with optional frozen rows-columns and on-demand loading features.

Vertical
NameCountryRepresentativeStatus
Smith K RoysterItalyStephen Shaw NEGOTIATION
Darci J MarrierGermanyStephen Shaw NEGOTIATION
Ashley G AmigonAustraliaElwin Sharvill PROPOSAL
Octavia Q FerenczArgentinaIvan Magalhaes NEGOTIATION
Leja T DilliardAustraliaIoni Bowcher QUALIFIED
Antonio J MacleadCanadaStephen Shaw PROPOSAL
Misaki W GauchoFranceAnna Fali RENEWAL
Juan Y MarrierSpainOnyama Limba QUALIFIED
Mayumi S BowleyAustraliaOnyama Limba QUALIFIED
Smith R GillianIndiaAmy Elsner PROPOSAL
Arvin S DilliardGermanyIvan Magalhaes NEGOTIATION
Ricardo F MaletGermanyElwin Sharvill PROPOSAL
Francesco S GauchoJapanAnna Fali NEW
Aditya G CaldareraFranceBernardo Dominic UNQUALIFIED
Emily Y ChuiIndiaIvan Magalhaes UNQUALIFIED
Juan N FlosiUnited KingdomIvan Magalhaes RENEWAL
Kaitlin E CampainRussiaStephen Shaw QUALIFIED
Rodrigues Q FerenczSpainIoni Bowcher PROPOSAL
Aditya V GlickBrazilAmy Elsner PROPOSAL
Aruna P GauchoCanadaAsiya Javayant UNQUALIFIED
Munro F NestleSpainIoni Bowcher PROPOSAL
Francesco P PerinItalyOnyama Limba RENEWAL
Emily A PoquetteBrazilAsiya Javayant UNQUALIFIED
Wickens Q AmigonRussiaIoni Bowcher UNQUALIFIED
Silvio W BowleyGermanyIvan Magalhaes UNQUALIFIED
Isabel I StockhamFranceAmy Elsner PROPOSAL
Kaitlin D MaletArgentinaXuxue Feng NEGOTIATION
Johnson D WieserUnited KingdomElwin Sharvill NEW
Jennifer B SlusarskiIndiaStephen Shaw NEW
Cody E PoquetteBrazilAmy Elsner UNQUALIFIED
Misaki C RutaArgentinaBernardo Dominic PROPOSAL
Jennifer Y StensethArgentinaBernardo Dominic RENEWAL
Johnson L PerinAustraliaAmy Elsner UNQUALIFIED
Antonio V GauchoArgentinaXuxue Feng UNQUALIFIED
Aruna S MorascaAustraliaIoni Bowcher UNQUALIFIED
Adams D MacleadAustraliaElwin Sharvill RENEWAL
Arvin P AmigonItalyXuxue Feng QUALIFIED
Johnson C RimItalyAsiya Javayant NEW
Juan O MaletBrazilAsiya Javayant NEGOTIATION
Salvatore Z CaldareraJapanIvan Magalhaes PROPOSAL
Aruna T PaprockiBrazilAmy Elsner UNQUALIFIED
Sinclair C DarakjyBrazilOnyama Limba NEGOTIATION
Murillo Y NestleAustraliaOnyama Limba NEW
Clifford G ShinkoSpainAnna Fali UNQUALIFIED
Kaitlin O SchemmerJapanElwin Sharvill NEW
Juan R TollnerFranceAnna Fali NEW
Salvatore A GlickSpainElwin Sharvill RENEWAL
Mayumi G OldroydAustraliaBernardo Dominic UNQUALIFIED
Claire U GillianGermanyXuxue Feng QUALIFIED
Alejandro C IturbideUnited KingdomBernardo Dominic UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Aditya O CaudyRussiaAnna Fali NEGOTIATION
Sinclair D BriddickItalyIvan Magalhaes QUALIFIED
Jeanfrancois J SaylorsBrazilIoni Bowcher QUALIFIED
Chavez B RoysterRussiaAnna Fali UNQUALIFIED
Arvin V ButtArgentinaIvan Magalhaes NEW
Maria D PoquetteSpainElwin Sharvill NEW
Mayumi D BologniaJapanIoni Bowcher NEGOTIATION
Francesco P PerinFranceXuxue Feng NEGOTIATION
Octavia K AmigonFranceAsiya Javayant PROPOSAL
Ricardo I BologniaUnited KingdomBernardo Dominic RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Wickens T SergiFrance2025-06-07Truhlar And Truhlar Attys PROPOSAL40Ioni Bowcher
1001Mujtaba R MorascaRussia2025-06-08Dorl, James J Esq NEGOTIATION35Amy Elsner
1002Maisha J NestleIndia2025-06-15Chanay, Jeffrey A Esq PROPOSAL87Ivan Magalhaes
1003David R AmigonArgentina2025-06-09Commercial Press NEGOTIATION18Ioni Bowcher
1004Maria O CampainCanada2025-06-09Printing Dimensions NEGOTIATION44Xuxue Feng
1005Jeanfrancois X GillianCanada2025-06-13Commercial Press PROPOSAL98Asiya Javayant
1006Wickens T BologniaIndia2025-06-13Printing Dimensions PROPOSAL61Asiya Javayant
1007Stacey P WieserUnited Kingdom2025-05-26Chemel, James L Cpa RENEWAL4Anna Fali
1008Antonio W OldroydSpain2025-06-03Rousseaux, Michael Esq NEGOTIATION26Ivan Magalhaes
1009Salvatore H NickaBrazil2025-06-14Printing Dimensions NEGOTIATION12Asiya Javayant
1010Greenwood D AlbaresItaly2025-06-15Buckley Miller Wright NEW84Amy Elsner
1011Claire X BologniaJapan2025-06-05Rangoni Of Florence UNQUALIFIED8Amy Elsner
1012Deepesh H BriddickAustralia2025-06-09Commercial Press NEGOTIATION16Xuxue Feng
1013Jefferson C PerinCanada2025-06-08Commercial Press RENEWAL22Asiya Javayant
1014Faith C TollnerRussia2025-05-24Truhlar And Truhlar Attys NEW75Elwin Sharvill
1015Maisha G DoeRussia2025-06-05Feltz Printing Service NEGOTIATION57Onyama Limba
1016Darci N RoysterGermany2025-06-10Feiner Bros NEW22Ivan Magalhaes
1017Kaitlin N DarakjyFrance2025-05-20Dorl, James J Esq NEGOTIATION91Xuxue Feng
1018Arvin L WhobreyCanada2025-05-23Commercial Press NEW57Ioni Bowcher
1019Maisha T MaletBrazil2025-05-26Rangoni Of Florence PROPOSAL30Xuxue Feng
1020Juan O GarufiIndia2025-05-21Rousseaux, Michael Esq PROPOSAL92Ivan Magalhaes
1021Nicolas G StockhamItaly2025-05-17Truhlar And Truhlar Attys NEGOTIATION43Ivan Magalhaes
1022Smith G PerinGermany2025-05-20Commercial Press QUALIFIED87Ioni Bowcher
1023Ivar B VocelkaSpain2025-05-20King, Christopher A Esq NEW90Onyama Limba
1024Maisha N CaudyRussia2025-06-09Truhlar And Truhlar Attys UNQUALIFIED61Elwin Sharvill
1025Sinclair O MarrierRussia2025-05-25Rousseaux, Michael Esq NEW44Onyama Limba
1026Chavez N MaletItaly2025-06-13Benton, John B Jr NEW17Ivan Magalhaes
1027Jefferson X FigeroaGermany2025-06-10Feltz Printing Service PROPOSAL80Asiya Javayant
1028Smith M RutaAustralia2025-06-15Commercial Press RENEWAL76Anna Fali
1029Izzy V MacleadArgentina2025-05-26Truhlar And Truhlar Attys QUALIFIED34Asiya Javayant
1030Kadeem L AmigonRussia2025-05-30Feltz Printing Service PROPOSAL67Ioni Bowcher
1031James U FigeroaFrance2025-05-28King, Christopher A Esq QUALIFIED89Asiya Javayant
1032Aika J MarrierRussia2025-05-30King, Christopher A Esq NEW7Anna Fali
1033Johnson D BriddickGermany2025-06-03Dorl, James J Esq PROPOSAL15Anna Fali
1034Munro M SlusarskiSpain2025-06-03King, Christopher A Esq PROPOSAL38Amy Elsner
1035Arvin H RimGermany2025-06-09Rangoni Of Florence PROPOSAL62Asiya Javayant
1036Jones O SergiGermany2025-05-28Truhlar And Truhlar Attys QUALIFIED47Amy Elsner
1037Faith G WaycottCanada2025-06-09Morlong Associates QUALIFIED74Ioni Bowcher
1038Isabel K FerenczAustralia2025-05-28Truhlar And Truhlar Attys QUALIFIED33Onyama Limba
1039Sinclair A AmigonIndia2025-06-09Truhlar And Truhlar Attys QUALIFIED78Asiya Javayant
1040Aika H VocelkaFrance2025-05-27Rousseaux, Michael Esq RENEWAL64Asiya Javayant
1041Mujtaba H FerenczSpain2025-05-25Chapman, Ross E Esq NEW15Anna Fali
1042Murillo M VenereAustralia2025-06-12Chemel, James L Cpa QUALIFIED59Stephen Shaw
1043Kadeem I NickaAustralia2025-06-06Chapman, Ross E Esq UNQUALIFIED80Anna Fali
1044Octavia Q CaldareraJapan2025-06-09Morlong Associates QUALIFIED65Amy Elsner
1045Maisha H FerenczJapan2025-05-26King, Christopher A Esq PROPOSAL73Xuxue Feng
1046Cody Q StensethBrazil2025-05-22Morlong Associates QUALIFIED36Ioni Bowcher
1047Stacey E GillianJapan2025-06-14Truhlar And Truhlar Attys NEGOTIATION57Elwin Sharvill
1048Alejandro I AlbaresAustralia2025-06-01King, Christopher A Esq QUALIFIED9Ivan Magalhaes
1049Kaitlin F GauchoJapan2025-05-28Feiner Bros RENEWAL13Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Stacey Q NickaIndiaStephen Shaw PROPOSAL
Claire X MaletCanadaStephen Shaw UNQUALIFIED
Murillo Z RimJapanStephen Shaw NEW
Clifford L CampainBrazilAsiya Javayant NEW
Adams E TollnerGermanyAmy Elsner NEGOTIATION
Adams O MacleadSpainElwin Sharvill QUALIFIED
Arvin X PerinIndiaXuxue Feng NEW
Adams B RutaCanadaAmy Elsner NEGOTIATION
Rodrigues D PoquetteFranceElwin Sharvill PROPOSAL
Darci V GauchoGermanyElwin Sharvill UNQUALIFIED
Aika K PoquetteFranceXuxue Feng RENEWAL
Tony C BowleyGermanyStephen Shaw NEGOTIATION
Octavia H VenereBrazilAmy Elsner UNQUALIFIED
Octavia L NestleArgentinaAsiya Javayant RENEWAL
Johnson W KolmetzFranceOnyama Limba NEGOTIATION
Sinclair Y DilliardAustraliaAsiya Javayant QUALIFIED
Jefferson B SchemmerRussiaStephen Shaw QUALIFIED
Munro S VocelkaJapanXuxue Feng RENEWAL
Maria F VocelkaJapanIvan Magalhaes QUALIFIED
Rodrigues W KuskoArgentinaIvan Magalhaes RENEWAL
Aika P WaycottFranceOnyama Limba UNQUALIFIED
Wickens D PaprockiSpainAsiya Javayant NEGOTIATION
Salvatore M PerinIndiaBernardo Dominic UNQUALIFIED
Claire F RutaCanadaElwin Sharvill RENEWAL
Darci O VocelkaIndiaBernardo Dominic PROPOSAL
David I FerenczBrazilOnyama Limba RENEWAL
Smith U BriddickGermanyIvan Magalhaes NEW
Maisha K RulapaughArgentinaAmy Elsner NEW
Octavia W StockhamJapanStephen Shaw QUALIFIED
Isabel A GarufiUnited KingdomAsiya Javayant RENEWAL
Sinclair I SergiUnited KingdomAsiya Javayant UNQUALIFIED
Tony A DarakjyAustraliaAmy Elsner NEW
Clifford B CampainUnited KingdomXuxue Feng QUALIFIED
Stacey V WaycottIndiaOnyama Limba UNQUALIFIED
Greenwood D CampainItalyOnyama Limba NEW
Darci K MaletCanadaAmy Elsner NEW
David U FollerBrazilAmy Elsner NEGOTIATION
Silvio Y RutaArgentinaElwin Sharvill NEW
Maria I KolmetzGermanyOnyama Limba RENEWAL
Jeanfrancois Y SergiGermanyOnyama Limba NEGOTIATION
Aika J SlusarskiAustraliaStephen Shaw NEGOTIATION
Tony Z RulapaughUnited KingdomXuxue Feng RENEWAL
Adams J DilliardBrazilBernardo Dominic UNQUALIFIED
Morrow T VocelkaFranceAsiya Javayant RENEWAL
Izzy V ChuiAustraliaAnna Fali RENEWAL
Claire J GillianArgentinaAmy Elsner NEW
Cody D AlbaresBrazilXuxue Feng NEGOTIATION
Aika L BologniaRussiaBernardo Dominic PROPOSAL
Aruna Z AmigonArgentinaElwin Sharvill QUALIFIED
Mujtaba L CaldareraUnited KingdomIvan Magalhaes QUALIFIED
Frozen Columns
Name
Faith S Briddick
David Z Doe
Jeanfrancois K Darakjy
Claire W Slusarski
James T Oldroyd
Jefferson I Malet
Deepesh O Sergi
David Y Nestle
Mayumi G Malet
Leon Y Kusko
Misaki W Tollner
Clifford V Poquette
Johnson I Schemmer
Francesco G Malet
Antonio S Gaucho
Sinclair X Albares
Ricardo D Vocelka
Cody Y Saylors
Clifford J Bolognia
Cody B Gaucho
Costa R Stenseth
Isabel U Stockham
David H Garufi
Cody G Nestle
Juan U Amigon
Maisha X Butt
Kaitlin O Royster
Tony F Nicka
Jones Y Doe
Aruna F Ostrosky
Faith P Shinko
Jeanfrancois J Schemmer
Aditya Q Oldroyd
Greenwood L Wieser
Wickens O Chui
Darci Z Perin
Smith T Campain
Antonio T Ferencz
Claire P Chui
Morrow P Shinko
David S Rulapaugh
David O Ferencz
Izzy M Doe
Jones B Garufi
Murillo A Bowley
Jeanfrancois O Ostrosky
Cody S Briddick
Mujtaba Q Nicka
Silvio J Stockham
Murillo T Sergi
IdCountryDate
1000Germany2025-06-10
1001Japan2025-05-23
1002Australia2025-06-14
1003Russia2025-06-15
1004Argentina2025-05-30
1005Germany2025-05-23
1006Australia2025-06-03
1007Germany2025-06-09
1008France2025-06-06
1009Japan2025-05-24
1010Russia2025-05-22
1011India2025-05-21
1012Germany2025-05-30
1013Brazil2025-05-31
1014Spain2025-06-06
1015Brazil2025-06-13
1016Japan2025-06-07
1017Italy2025-05-31
1018France2025-06-08
1019Japan2025-06-05
1020Spain2025-05-22
1021United Kingdom2025-06-09
1022France2025-06-06
1023Italy2025-06-14
1024Italy2025-05-25
1025Germany2025-05-19
1026France2025-05-23
1027Australia2025-06-14
1028Germany2025-06-11
1029Canada2025-06-03
1030Japan2025-06-02
1031Russia2025-06-15
1032Argentina2025-05-22
1033Germany2025-05-31
1034Argentina2025-05-29
1035India2025-06-11
1036India2025-05-24
1037Italy2025-06-03
1038Spain2025-05-27
1039Brazil2025-06-04
1040Japan2025-05-27
1041France2025-05-30
1042Australia2025-06-06
1043United Kingdom2025-06-10
1044Argentina2025-05-26
1045India2025-06-05
1046Australia2025-06-03
1047Canada2025-06-05
1048Argentina2025-06-03
1049Spain2025-06-13

On-Demand Data

NameIdCountryDate
Aruna I Malet1000Canada2025-06-09
Costa R Rim1001Canada2025-06-06
Clifford P Chui1002India2025-05-17
Leon H Venere1003Spain2025-05-27
Silvio D Garufi1004Russia2025-06-03
Ricardo Z Kolmetz1005India2025-06-05
Izzy D Rulapaugh1006Germany2025-06-08
Jones Q Foller1007Brazil2025-06-12
Murillo Y Caldarera1008France2025-06-15
Aditya J Bowley1009Japan2025-06-04
Salvatore N Kolmetz1010Argentina2025-06-14
Greenwood A Darakjy1011Argentina2025-05-28
Mayumi G Caldarera1012France2025-06-12
Chavez Y Figeroa1013Brazil2025-05-27
Maria E Campain1014Germany2025-06-10
Mayumi B Stockham1015Germany2025-06-07
Leon S Figeroa1016Japan2025-06-02
Mujtaba V Nestle1017Germany2025-05-19
Mujtaba C Marrier1018Spain2025-06-09
Greenwood V Briddick1019Canada2025-05-18
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jefferson A GlickGermanyAmy Elsner RENEWAL
Morrow J StensethJapanStephen Shaw QUALIFIED
Jefferson A DoeAustraliaIoni Bowcher QUALIFIED
Claire Z SaylorsGermanyBernardo Dominic UNQUALIFIED
Maria U PoquetteGermanyStephen Shaw PROPOSAL
Cody L FigeroaUnited KingdomIvan Magalhaes PROPOSAL
Aruna A CaudyFranceOnyama Limba NEW
Leja L FlosiJapanAmy Elsner QUALIFIED
Mayumi H SlusarskiArgentinaOnyama Limba NEGOTIATION
Clifford T DarakjyUnited KingdomXuxue Feng NEW
Chavez N PoquetteGermanyIoni Bowcher UNQUALIFIED
Darci A PoquetteFranceAnna Fali QUALIFIED
Emily H GarufiFranceElwin Sharvill NEW
Wickens D VocelkaArgentinaIoni Bowcher QUALIFIED
Maria A BowleySpainElwin Sharvill UNQUALIFIED
Maria H SaylorsCanadaAnna Fali RENEWAL
Johnson Y DilliardBrazilIoni Bowcher RENEWAL
Mayumi A MacleadArgentinaElwin Sharvill NEGOTIATION
Jefferson A WieserItalyAmy Elsner PROPOSAL
Aruna A RulapaughGermanyStephen Shaw PROPOSAL
Deepesh O RutaBrazilIoni Bowcher NEGOTIATION
Tony H StensethArgentinaStephen Shaw RENEWAL
Deepesh O AmigonJapanXuxue Feng PROPOSAL
Leja L MacleadIndiaIoni Bowcher QUALIFIED
Tony W IturbideRussiaOnyama Limba UNQUALIFIED
Julie Q RutaFranceAsiya Javayant UNQUALIFIED
Emily U BowleyFranceStephen Shaw QUALIFIED
Claire G BriddickJapanElwin Sharvill RENEWAL
Arvin L GillianFranceAsiya Javayant NEGOTIATION
Aruna T MacleadItalyXuxue Feng RENEWAL
Deepesh V IturbideFranceIvan Magalhaes PROPOSAL
Sinclair H ChuiGermanyBernardo Dominic PROPOSAL
Costa R PoquetteJapanIvan Magalhaes NEW
Emily A WieserJapanAnna Fali QUALIFIED
Stacey P MorascaCanadaOnyama Limba NEW
Aditya D AmigonSpainAmy Elsner PROPOSAL
Stacey B DoeBrazilAnna Fali PROPOSAL
Deepesh P DarakjySpainOnyama Limba NEGOTIATION
Jefferson I RutaBrazilBernardo Dominic PROPOSAL
Salvatore P ChuiSpainElwin Sharvill UNQUALIFIED

<style>
    .ui-datatable-frozenlayout-left {
        width: 20%;
    }

    .ui-datatable-frozenlayout-right {
        width: 80%;
    }
</style>


<h:form>
    <div class="card">
        <h5 style="margin-top:0">Vertical</h5>
        <p:dataTable var="customer" value="#{dtScrollView.customers1}" scrollable="true" scrollHeight="250">
            <p:column headerText="Name" footerText="Name">
                <h:outputText value="#{customer.name}"/>
            </p:column>
            <p:column headerText="Country" footerText="Country">
                <h:outputText value="#{customer.country}"/>
            </p:column>
            <p:column headerText="Representative" footerText="Representative">
                <h:outputText value="#{customer.representative.name}"/>
            </p:column>
            <p:column headerText="Status" footerText="Status">
                <span class="customer-badge status-#{customer.status.name().toLowerCase()}">#{customer.status}</span>
            </p:column>
        </p:dataTable>
    </div>

    <div class="card">
        <h5>Horizontal</h5>
        <p:dataTable var="customer" value="#{dtScrollView.customers2}" scrollable="true" scrollWidth="600">
            <p:column headerText="Name" footerText="Name">
                <h:outputText value="#{customer.name}"/>
            </p:column>
            <p:column headerText="Country" footerText="Country">
                <h:outputText value="#{customer.country}"/>
            </p:column>
            <p:column headerText="Representative" footerText="Representative">
                <h:outputText value="#{customer.representative.name}"/>
            </p:column>
            <p:column headerText="Status" footerText="Status">
                <span class="customer-badge status-#{customer.status.name().toLowerCase()}">#{customer.status}</span>
            </p:column>
        </p:dataTable>
    </div>

    <div class="card">
        <h5>Horizontal and Vertical</h5>
        <p:dataTable var="customer" value="#{dtScrollView.customers3}" scrollable="true" scrollWidth="50%" scrollHeight="250">
            <p:column headerText="Id" footerText="Id">
                <h:outputText value="#{customer.id}"/>
            </p:column>
            <p:column headerText="Name" footerText="Name">
                <h:outputText value="#{customer.name}"/>
            </p:column>
            <p:column headerText="Country" footerText="Country">
                <h:outputText value="#{customer.country}"/>
            </p:column>
            <p:column headerText="Date" footerText="Date">
                <h:outputText value="#{customer.date}"/>
            </p:column>
            <p:column headerText="Company" footerText="Company">
                <h:outputText value="#{customer.company}"/>
            </p:column>
            <p:column headerText="Status" footerText="Status">
                <span class="customer-badge status-#{customer.status.name().toLowerCase()}">#{customer.status}</span>
            </p:column>
            <p:column headerText="Activity" footerText="Activity">
                <h:outputText value="#{customer.activity}"/>
            </p:column>
            <p:column headerText="Representative" footerText="Representative">
                <h:outputText value="#{customer.representative.name}"/>
            </p:column>
        </p:dataTable>
    </div>

    <div class="card">
        <h5>Frozen Rows</h5>
        <p:dataTable var="customer" value="#{dtScrollView.customers4}" scrollable="true" scrollHeight="250"
                     frozenRows="2">
            <p:column headerText="Name" footerText="Name">
                <h:outputText value="#{customer.name}"/>
            </p:column>
            <p:column headerText="Country" footerText="Country">
                <h:outputText value="#{customer.country}"/>
            </p:column>
            <p:column headerText="Representative" footerText="Representative">
                <h:outputText value="#{customer.representative.name}"/>
            </p:column>
            <p:column headerText="Status" footerText="Status">
                <span class="customer-badge status-#{customer.status.name().toLowerCase()}">#{customer.status}</span>
            </p:column>
        </p:dataTable>
    </div>

    <div class="card">
        <h5>Frozen Columns</h5>
        <p:dataTable var="customer" value="#{dtScrollView.customers5}" scrollable="true" scrollHeight="250"
                     scrollWidth="300" frozenColumns="1">
            <p:column headerText="Name" footerText="Name">
                <h:outputText value="#{customer.name}"/>
            </p:column>
            <p:column headerText="Id" footerText="Id">
                <h:outputText value="#{customer.id}"/>
            </p:column>
            <p:column headerText="Country" footerText="Country">
                <h:outputText value="#{customer.country}"/>
            </p:column>
            <p:column headerText="Date" footerText="Date">
                <h:outputText value="#{customer.date}"/>
            </p:column>
        </p:dataTable>
    </div>

    <div class="card">
        <h3>On-Demand Data</h3>
        <p:dataTable var="customer" value="#{dtScrollView.customers6}" scrollRows="20" scrollable="true" liveScroll="true" scrollHeight="150">
            <p:column headerText="Name" footerText="Name">
                <h:outputText value="#{customer.name}"/>
            </p:column>
            <p:column headerText="Id" footerText="Id">
                <h:outputText value="#{customer.id}"/>
            </p:column>
            <p:column headerText="Country" footerText="Country">
                <h:outputText value="#{customer.country}"/>
            </p:column>
            <p:column headerText="Date" footerText="Date">
                <h:outputText value="#{customer.date}"/>
            </p:column>
        </p:dataTable>
    </div>

    <div class="card">
        <h5>Virtual Scrolling - 20000 Rows</h5>
        <p:dataTable var="customer" value="#{dtScrollView.lazyModel}" scrollRows="20" scrollable="true"
                     virtualScroll="true" scrollHeight="200" rows="40" style="margin-bottom:0">
            <p:column headerText="Name" footerText="Name">
                <h:outputText value="#{customer.name}"/>
            </p:column>
            <p:column headerText="Country" footerText="Country">
                <h:outputText value="#{customer.country}"/>
            </p:column>
            <p:column headerText="Representative" footerText="Representative">
                <h:outputText value="#{customer.representative.name}"/>
            </p:column>
            <p:column headerText="Status" footerText="Status">
                <span class="customer-badge status-#{customer.status.name().toLowerCase()}">#{customer.status}</span>
            </p:column>
        </p:dataTable>
    </div>

</h:form>