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
Emily D VenereAustraliaElwin Sharvill UNQUALIFIED
Jennifer H InouyeIndiaOnyama Limba NEW
Deepesh W WaycottArgentinaAsiya Javayant UNQUALIFIED
Morrow L KuskoJapanAsiya Javayant QUALIFIED
Munro F VenereItalyBernardo Dominic RENEWAL
Maisha E IturbideRussiaStephen Shaw PROPOSAL
Smith I ChuiJapanAsiya Javayant RENEWAL
Chavez W SergiFranceOnyama Limba NEGOTIATION
Nicolas V MarrierBrazilAmy Elsner PROPOSAL
Johnson B BowleyCanadaBernardo Dominic NEW
Munro C MarrierJapanAmy Elsner QUALIFIED
Aika W CaudyRussiaStephen Shaw QUALIFIED
Deepesh W DilliardUnited KingdomStephen Shaw RENEWAL
Greenwood K OldroydFranceBernardo Dominic PROPOSAL
David D GillianJapanOnyama Limba NEGOTIATION
Julie V CaldareraItalyIvan Magalhaes NEW
Claire E SergiGermanyOnyama Limba PROPOSAL
Jefferson W NickaRussiaStephen Shaw NEW
Octavia H VenereItalyXuxue Feng PROPOSAL
Morrow L BologniaCanadaAnna Fali QUALIFIED
Octavia K ButtArgentinaOnyama Limba NEGOTIATION
Clifford M IturbideUnited KingdomIvan Magalhaes QUALIFIED
Izzy S PaprockiRussiaElwin Sharvill NEGOTIATION
Jennifer U GauchoCanadaAsiya Javayant RENEWAL
Antonio W BriddickJapanElwin Sharvill PROPOSAL
Nicolas N RoysterUnited KingdomAmy Elsner PROPOSAL
Costa W KuskoAustraliaElwin Sharvill NEGOTIATION
James F ButtUnited KingdomAsiya Javayant QUALIFIED
Izzy V FlosiFranceAnna Fali QUALIFIED
Aruna I StensethFranceIvan Magalhaes RENEWAL
Salvatore P DoeRussiaAmy Elsner NEGOTIATION
Smith D NestleGermanyAnna Fali RENEWAL
Mayumi U StensethItalyOnyama Limba NEW
Alejandro E RoysterArgentinaAmy Elsner PROPOSAL
Ricardo D ShinkoAustraliaAsiya Javayant RENEWAL
Costa N PaprockiGermanyStephen Shaw PROPOSAL
Francesco R DoeJapanBernardo Dominic RENEWAL
Alejandro E StensethArgentinaAsiya Javayant RENEWAL
Emily T FigeroaAustraliaElwin Sharvill RENEWAL
Antonio Z GillianArgentinaOnyama Limba UNQUALIFIED
Mayumi J MarrierItalyBernardo Dominic NEGOTIATION
Aruna N MaletArgentinaXuxue Feng QUALIFIED
Octavia N NickaBrazilIvan Magalhaes NEW
Octavia H BriddickGermanyAmy Elsner NEW
Johnson W OldroydJapanStephen Shaw UNQUALIFIED
Jeanfrancois D BriddickUnited KingdomXuxue Feng PROPOSAL
Sinclair H InouyeItalyAsiya Javayant PROPOSAL
Mujtaba E StockhamIndiaIoni Bowcher PROPOSAL
Wickens Q BriddickAustraliaAmy Elsner QUALIFIED
Kaitlin J StensethSpainOnyama Limba NEW
Horizontal
NameCountryRepresentativeStatus
Jones K CaldareraGermanyXuxue Feng RENEWAL
Ivar R DarakjyUnited KingdomAnna Fali QUALIFIED
Jennifer E OldroydFranceXuxue Feng PROPOSAL
Kaitlin R GarufiFranceAmy Elsner RENEWAL
Leon C VenereUnited KingdomElwin Sharvill UNQUALIFIED
Darci W IturbideJapanIvan Magalhaes NEGOTIATION
Clifford Z ButtBrazilAsiya Javayant NEGOTIATION
Munro X IturbideIndiaBernardo Dominic NEGOTIATION
Jeanfrancois F GillianAustraliaStephen Shaw QUALIFIED
Clifford P PerinJapanXuxue Feng RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Darci O FlosiArgentina2024-08-29Chapman, Ross E Esq NEGOTIATION6Ivan Magalhaes
1001Aditya M BowleyCanada2024-09-09Rangoni Of Florence QUALIFIED5Onyama Limba
1002Deepesh V ButtRussia2024-08-31Morlong Associates QUALIFIED45Amy Elsner
1003Cody N MaletSpain2024-09-10Dorl, James J Esq NEW18Ioni Bowcher
1004Jefferson E CaldareraCanada2024-09-11Commercial Press NEGOTIATION5Bernardo Dominic
1005James C NickaBrazil2024-09-12Chemel, James L Cpa QUALIFIED69Xuxue Feng
1006Jeanfrancois B DarakjyJapan2024-09-04King, Christopher A Esq RENEWAL14Elwin Sharvill
1007Faith H GlickCanada2024-08-25Rousseaux, Michael Esq PROPOSAL34Asiya Javayant
1008Ashley U OldroydRussia2024-09-07Feltz Printing Service PROPOSAL70Xuxue Feng
1009Faith D BriddickArgentina2024-08-30Benton, John B Jr QUALIFIED65Elwin Sharvill
1010Ashley V GarufiRussia2024-08-22Morlong Associates NEW9Elwin Sharvill
1011Arvin H RulapaughIndia2024-09-17Feiner Bros PROPOSAL27Anna Fali
1012Isabel G PaprockiFrance2024-09-18Chapman, Ross E Esq NEW71Onyama Limba
1013Adams K GarufiAustralia2024-09-19Morlong Associates NEW12Xuxue Feng
1014Aditya Z MarrierAustralia2024-08-24Printing Dimensions PROPOSAL67Onyama Limba
1015Sinclair L KuskoIndia2024-09-11Benton, John B Jr QUALIFIED33Ioni Bowcher
1016Faith H GillianGermany2024-09-17Truhlar And Truhlar Attys QUALIFIED41Stephen Shaw
1017Ricardo Y CaudyItaly2024-08-23Feiner Bros QUALIFIED81Stephen Shaw
1018Claire J RutaCanada2024-09-19Truhlar And Truhlar Attys PROPOSAL60Ioni Bowcher
1019Costa H GillianFrance2024-09-11Rousseaux, Michael Esq RENEWAL24Bernardo Dominic
1020Isabel B WieserSpain2024-09-16Benton, John B Jr QUALIFIED51Bernardo Dominic
1021Maisha U MorascaBrazil2024-09-03Truhlar And Truhlar Attys NEGOTIATION34Xuxue Feng
1022Isabel C MaletGermany2024-08-25Rousseaux, Michael Esq RENEWAL67Bernardo Dominic
1023Jeanfrancois P DoeAustralia2024-08-29Feiner Bros UNQUALIFIED62Bernardo Dominic
1024Arvin E PaprockiIndia2024-09-16Printing Dimensions UNQUALIFIED99Elwin Sharvill
1025Murillo L StockhamAustralia2024-09-20Morlong Associates QUALIFIED57Ioni Bowcher
1026Jefferson V StockhamUnited Kingdom2024-09-20Truhlar And Truhlar Attys PROPOSAL51Asiya Javayant
1027Faith F RutaUnited Kingdom2024-08-23Chemel, James L Cpa PROPOSAL29Asiya Javayant
1028Antonio Y DoeJapan2024-08-29Feiner Bros NEGOTIATION48Asiya Javayant
1029Nicolas Q RutaArgentina2024-08-27Commercial Press NEW57Anna Fali
1030Misaki L WhobreyRussia2024-09-02Truhlar And Truhlar Attys NEGOTIATION26Ioni Bowcher
1031Julie L SaylorsBrazil2024-09-13Buckley Miller Wright QUALIFIED26Xuxue Feng
1032Maisha L FigeroaFrance2024-09-12Buckley Miller Wright RENEWAL61Onyama Limba
1033Sinclair M ButtGermany2024-09-13King, Christopher A Esq NEGOTIATION75Asiya Javayant
1034Wickens M ButtSpain2024-09-14Chapman, Ross E Esq NEGOTIATION39Xuxue Feng
1035Leja O DarakjyCanada2024-09-10Rousseaux, Michael Esq RENEWAL17Anna Fali
1036Julie H CaldareraAustralia2024-09-02Morlong Associates QUALIFIED89Ivan Magalhaes
1037Julie Y BologniaSpain2024-08-31Commercial Press RENEWAL74Ivan Magalhaes
1038Maria U IturbideIndia2024-09-12Feiner Bros NEW42Xuxue Feng
1039Murillo L KolmetzJapan2024-08-25Printing Dimensions UNQUALIFIED80Ioni Bowcher
1040Sinclair Z PerinItaly2024-09-11Truhlar And Truhlar Attys NEGOTIATION19Ivan Magalhaes
1041Ivar G RulapaughUnited Kingdom2024-09-11Chemel, James L Cpa NEW15Elwin Sharvill
1042Jeanfrancois E KuskoUnited Kingdom2024-08-23Buckley Miller Wright QUALIFIED80Ivan Magalhaes
1043Faith C RulapaughGermany2024-09-20Rangoni Of Florence UNQUALIFIED76Stephen Shaw
1044Emily U VenereFrance2024-09-05Chapman, Ross E Esq RENEWAL67Ioni Bowcher
1045Smith R ShinkoFrance2024-08-26Rousseaux, Michael Esq PROPOSAL71Elwin Sharvill
1046Smith R DoeArgentina2024-09-15King, Christopher A Esq RENEWAL44Elwin Sharvill
1047Johnson U SaylorsCanada2024-09-05Dorl, James J Esq NEGOTIATION46Elwin Sharvill
1048Julie X RutaAustralia2024-08-27Morlong Associates QUALIFIED8Elwin Sharvill
1049Aika T MaletGermany2024-09-13Truhlar And Truhlar Attys PROPOSAL76Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Adams G ButtRussiaBernardo Dominic RENEWAL
David T FigeroaJapanIoni Bowcher NEW
Octavia R WieserJapanAmy Elsner NEGOTIATION
Clifford R MacleadUnited KingdomAnna Fali NEGOTIATION
David O MarrierIndiaIoni Bowcher NEGOTIATION
Darci Z TollnerAustraliaOnyama Limba NEW
Jeanfrancois B FerenczSpainAmy Elsner QUALIFIED
Maisha P OldroydUnited KingdomXuxue Feng NEW
Emily C SchemmerArgentinaStephen Shaw RENEWAL
Mujtaba L BologniaArgentinaElwin Sharvill RENEWAL
Jeanfrancois L MarrierGermanyBernardo Dominic UNQUALIFIED
Antonio S ButtGermanyAsiya Javayant QUALIFIED
Adams H DilliardSpainOnyama Limba QUALIFIED
Sinclair A BologniaJapanIoni Bowcher PROPOSAL
Deepesh Y MarrierSpainBernardo Dominic NEW
Alejandro T StockhamBrazilIoni Bowcher NEW
Deepesh V BologniaIndiaAnna Fali QUALIFIED
Cody M BologniaArgentinaOnyama Limba NEGOTIATION
Morrow N GauchoJapanIvan Magalhaes RENEWAL
Nicolas P CaudyCanadaXuxue Feng QUALIFIED
Maisha P CaldareraJapanStephen Shaw NEW
Misaki L FollerArgentinaAmy Elsner PROPOSAL
Stacey I FollerUnited KingdomOnyama Limba NEW
Rodrigues S GillianGermanyStephen Shaw QUALIFIED
Alejandro U BologniaJapanOnyama Limba NEW
Aruna N CampainGermanyAmy Elsner NEW
Maria X MarrierArgentinaAnna Fali QUALIFIED
Julie K IturbideItalyAnna Fali NEGOTIATION
Murillo V TollnerRussiaXuxue Feng PROPOSAL
Maria M CaudySpainOnyama Limba NEW
Aruna A MaletJapanStephen Shaw NEW
Stacey D FlosiSpainOnyama Limba RENEWAL
Kaitlin N GillianSpainXuxue Feng UNQUALIFIED
Ricardo W FigeroaBrazilOnyama Limba RENEWAL
Jefferson P InouyeIndiaStephen Shaw NEGOTIATION
Claire O SchemmerBrazilBernardo Dominic UNQUALIFIED
Murillo J KolmetzRussiaIoni Bowcher NEW
Maisha F StockhamArgentinaOnyama Limba NEGOTIATION
Ivar R InouyeRussiaOnyama Limba PROPOSAL
Francesco K AlbaresCanadaIvan Magalhaes UNQUALIFIED
Ricardo O RutaItalyOnyama Limba PROPOSAL
Juan N SchemmerAustraliaIoni Bowcher NEGOTIATION
Smith I MorascaRussiaOnyama Limba NEW
Aditya F GillianUnited KingdomOnyama Limba QUALIFIED
Julie E BriddickArgentinaXuxue Feng PROPOSAL
Smith C TollnerGermanyAmy Elsner QUALIFIED
Tony L WhobreyGermanyIoni Bowcher NEW
Izzy Y CaudyCanadaBernardo Dominic RENEWAL
Rodrigues C WhobreyRussiaElwin Sharvill UNQUALIFIED
Ashley I PoquetteFranceAmy Elsner UNQUALIFIED
Frozen Columns
Name
Mayumi F Caudy
Clifford L Ferencz
Alejandro D Morasca
Tony N Slusarski
Mujtaba X Doe
Sinclair T Rulapaugh
Cody L Maclead
Antonio D Iturbide
Emily W Nestle
Johnson I Schemmer
Misaki T Poquette
Aika Y Gaucho
Sinclair E Caldarera
Mujtaba H Whobrey
Cody D Ruta
Cody I Wieser
Alejandro H Doe
Adams T Whobrey
David E Marrier
Isabel E Campain
Smith U Chui
Munro Q Vocelka
Jeanfrancois Y Doe
Leja H Ruta
Adams T Foller
Claire G Rulapaugh
Octavia J Schemmer
Murillo U Saylors
Adams F Bolognia
Nicolas A Saylors
Ricardo V Doe
Kadeem Y Kolmetz
Leon V Flosi
Costa F Malet
Leja I Ferencz
Johnson Z Doe
Kadeem J Albares
David K Waycott
Chavez J Darakjy
Jones F Bolognia
Octavia Z Whobrey
Clifford H Stockham
Johnson K Poquette
Misaki N Kusko
James O Paprocki
Ashley H Doe
Jefferson E Malet
Maisha G Shinko
Izzy F Perin
Jeanfrancois Y Nicka
IdCountryDate
1000Italy2024-09-10
1001Australia2024-08-25
1002Australia2024-08-24
1003Brazil2024-09-18
1004Australia2024-09-07
1005Germany2024-09-02
1006Argentina2024-09-09
1007France2024-08-31
1008Canada2024-09-14
1009Japan2024-09-07
1010United Kingdom2024-09-09
1011Canada2024-09-14
1012India2024-08-27
1013Brazil2024-09-01
1014France2024-09-20
1015United Kingdom2024-08-28
1016Russia2024-09-07
1017Brazil2024-09-18
1018Japan2024-09-04
1019Japan2024-08-29
1020Argentina2024-09-03
1021Canada2024-09-05
1022India2024-09-01
1023Germany2024-08-26
1024United Kingdom2024-08-30
1025Italy2024-08-29
1026Spain2024-09-20
1027Brazil2024-08-24
1028India2024-09-11
1029Germany2024-09-16
1030Canada2024-09-13
1031Spain2024-09-10
1032Brazil2024-09-14
1033Germany2024-09-05
1034Germany2024-08-24
1035United Kingdom2024-09-18
1036Germany2024-08-28
1037Russia2024-09-17
1038Canada2024-09-02
1039Russia2024-08-25
1040India2024-09-09
1041India2024-09-20
1042Germany2024-09-01
1043Russia2024-08-23
1044Argentina2024-09-06
1045Australia2024-09-20
1046India2024-08-23
1047Japan2024-09-20
1048Australia2024-09-20
1049Japan2024-09-20

On-Demand Data

NameIdCountryDate
Silvio Z Sergi1000France2024-09-07
Claire G Wieser1001Argentina2024-09-16
Francesco N Figeroa1002United Kingdom2024-09-12
Alejandro T Chui1003United Kingdom2024-09-19
Morrow L Rulapaugh1004Spain2024-08-31
Salvatore J Malet1005Japan2024-09-04
Chavez N Poquette1006United Kingdom2024-09-02
Mujtaba M Malet1007Italy2024-09-08
Ashley O Amigon1008Russia2024-09-03
Stacey G Iturbide1009Australia2024-09-13
Costa G Shinko1010India2024-09-01
Aruna R Gaucho1011Germany2024-08-25
Wickens X Poquette1012Japan2024-08-29
Deepesh H Figeroa1013Japan2024-09-11
Chavez U Wieser1014Brazil2024-09-01
Johnson D Perin1015Japan2024-08-23
Kadeem Y Rim1016France2024-09-12
Morrow J Marrier1017Spain2024-09-18
Smith B Caudy1018Australia2024-08-25
Izzy U Stenseth1019Argentina2024-09-10
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Ivar M OstroskyIndiaAmy Elsner PROPOSAL
Isabel S OldroydAustraliaAsiya Javayant QUALIFIED
Tony O DarakjyGermanyBernardo Dominic QUALIFIED
Jeanfrancois E TollnerItalyIoni Bowcher NEGOTIATION
Mujtaba S FigeroaCanadaBernardo Dominic UNQUALIFIED
Ivar S BologniaIndiaXuxue Feng QUALIFIED
Leja B RutaAustraliaAsiya Javayant RENEWAL
Arvin R MaletItalyStephen Shaw QUALIFIED
Mayumi H VenereAustraliaIvan Magalhaes NEW
Aruna G KolmetzItalyElwin Sharvill RENEWAL
Francesco O MarrierGermanyStephen Shaw QUALIFIED
Greenwood E AmigonSpainIvan Magalhaes NEW
Greenwood J CaudyBrazilElwin Sharvill PROPOSAL
Mayumi K BriddickArgentinaBernardo Dominic NEGOTIATION
Murillo Q MaletCanadaXuxue Feng QUALIFIED
Smith T AlbaresAustraliaIoni Bowcher NEGOTIATION
Francesco I ShinkoJapanIvan Magalhaes QUALIFIED
Murillo U PoquetteBrazilStephen Shaw QUALIFIED
Smith F SchemmerItalyElwin Sharvill RENEWAL
Costa Y FlosiGermanyIvan Magalhaes NEW
Izzy X BriddickUnited KingdomAsiya Javayant PROPOSAL
James A ButtSpainOnyama Limba PROPOSAL
Jones V MorascaIndiaXuxue Feng PROPOSAL
Silvio I OldroydBrazilBernardo Dominic QUALIFIED
James V WieserSpainAmy Elsner PROPOSAL
Jones J WaycottUnited KingdomXuxue Feng RENEWAL
Deepesh N PaprockiArgentinaIvan Magalhaes RENEWAL
Jefferson N VocelkaRussiaAmy Elsner NEW
Tony H IturbideIndiaIoni Bowcher NEGOTIATION
Jefferson M CaldareraCanadaXuxue Feng QUALIFIED
Jones Z NickaArgentinaIoni Bowcher QUALIFIED
Arvin N FollerArgentinaOnyama Limba NEW
Arvin G WieserArgentinaAmy Elsner NEGOTIATION
Emily J PerinBrazilIvan Magalhaes PROPOSAL
Cody R RoysterArgentinaAnna Fali PROPOSAL
Aruna A SergiGermanyXuxue Feng PROPOSAL
Ricardo W VocelkaJapanOnyama Limba QUALIFIED
Emily H NickaGermanyAsiya Javayant PROPOSAL
Munro F MarrierIndiaAmy Elsner NEW
Jones N BologniaCanadaOnyama Limba 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>