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
Jefferson P DarakjyAustraliaIvan Magalhaes NEW
Cody Y WieserItalyElwin Sharvill PROPOSAL
Emily J CaudyRussiaBernardo Dominic QUALIFIED
Cody P GauchoJapanOnyama Limba NEGOTIATION
Aditya H CampainJapanAsiya Javayant PROPOSAL
James I KolmetzArgentinaAnna Fali UNQUALIFIED
Arvin D MaletFranceIvan Magalhaes NEGOTIATION
Mujtaba S PoquetteIndiaXuxue Feng RENEWAL
Juan L CaldareraJapanAsiya Javayant UNQUALIFIED
Emily H MaletArgentinaIoni Bowcher RENEWAL
Maisha D VenereRussiaBernardo Dominic QUALIFIED
Salvatore K PaprockiAustraliaAsiya Javayant UNQUALIFIED
Isabel E MacleadItalyOnyama Limba PROPOSAL
David W VocelkaFranceElwin Sharvill PROPOSAL
Darci O GillianRussiaIoni Bowcher NEGOTIATION
David E CaldareraSpainIoni Bowcher QUALIFIED
Cody N ChuiRussiaAnna Fali NEW
Clifford G AmigonGermanyXuxue Feng RENEWAL
Kadeem E VenereJapanAmy Elsner RENEWAL
Kaitlin H StockhamUnited KingdomAmy Elsner RENEWAL
Johnson H MorascaCanadaIoni Bowcher QUALIFIED
Jennifer F OldroydJapanStephen Shaw QUALIFIED
Juan D DoeIndiaStephen Shaw PROPOSAL
Misaki N DarakjyAustraliaAnna Fali QUALIFIED
Ashley Y BowleyAustraliaXuxue Feng NEGOTIATION
Leon N VenereGermanyBernardo Dominic UNQUALIFIED
Rodrigues J ShinkoArgentinaElwin Sharvill NEW
Cody J RimCanadaIvan Magalhaes QUALIFIED
Chavez O GillianAustraliaAnna Fali RENEWAL
Silvio S FlosiArgentinaIoni Bowcher NEGOTIATION
Octavia U VenereArgentinaAsiya Javayant RENEWAL
David N KolmetzGermanyIoni Bowcher RENEWAL
Smith V BologniaFranceStephen Shaw RENEWAL
Stacey D CaldareraAustraliaStephen Shaw NEGOTIATION
Faith V ShinkoJapanElwin Sharvill QUALIFIED
Darci L DarakjyItalyBernardo Dominic NEGOTIATION
Leon I FerenczIndiaXuxue Feng PROPOSAL
Aditya Q DoeIndiaBernardo Dominic RENEWAL
Mujtaba F SaylorsIndiaElwin Sharvill UNQUALIFIED
Wickens A WieserBrazilAsiya Javayant PROPOSAL
Jennifer B FerenczBrazilAmy Elsner PROPOSAL
Kadeem X GlickArgentinaXuxue Feng RENEWAL
Isabel C GarufiJapanIvan Magalhaes NEW
Munro Z SaylorsArgentinaAmy Elsner RENEWAL
Johnson X RimBrazilOnyama Limba UNQUALIFIED
Alejandro L GlickCanadaOnyama Limba UNQUALIFIED
Darci G WieserGermanyIoni Bowcher NEW
Antonio X FerenczSpainAnna Fali NEGOTIATION
Deepesh I BowleySpainAmy Elsner QUALIFIED
Leon C CampainRussiaAnna Fali PROPOSAL
Horizontal
NameCountryRepresentativeStatus
James L SergiAustraliaBernardo Dominic NEGOTIATION
Sinclair D AmigonSpainXuxue Feng QUALIFIED
Francesco E StensethIndiaAnna Fali NEGOTIATION
Maria T CampainIndiaStephen Shaw NEGOTIATION
Cody K MaletBrazilAnna Fali NEGOTIATION
Juan Z InouyeBrazilStephen Shaw PROPOSAL
Nicolas L PoquetteJapanIoni Bowcher NEGOTIATION
Jones F SlusarskiIndiaIvan Magalhaes NEW
Faith W SergiBrazilXuxue Feng UNQUALIFIED
Rodrigues M MarrierArgentinaAsiya Javayant RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Cody V MorascaRussia2024-05-21King, Christopher A Esq NEGOTIATION48Amy Elsner
1001Faith S PoquetteUnited Kingdom2024-05-16Printing Dimensions NEGOTIATION15Anna Fali
1002Juan A CampainBrazil2024-05-23Chanay, Jeffrey A Esq QUALIFIED16Amy Elsner
1003Rodrigues K MacleadJapan2024-05-21Rangoni Of Florence QUALIFIED12Ioni Bowcher
1004Jeanfrancois U PaprockiAustralia2024-06-13Chanay, Jeffrey A Esq NEW46Bernardo Dominic
1005Silvio N OstroskyAustralia2024-05-29Chanay, Jeffrey A Esq NEW79Xuxue Feng
1006Jefferson M AlbaresBrazil2024-06-09Morlong Associates UNQUALIFIED14Xuxue Feng
1007Chavez V CaudyArgentina2024-05-16Buckley Miller Wright UNQUALIFIED93Asiya Javayant
1008James C WhobreyJapan2024-05-18Printing Dimensions RENEWAL80Ivan Magalhaes
1009Wickens U WieserFrance2024-05-26Printing Dimensions RENEWAL16Stephen Shaw
1010Darci H SchemmerCanada2024-05-28Chanay, Jeffrey A Esq NEW1Stephen Shaw
1011Aruna E DilliardGermany2024-06-04Chemel, James L Cpa PROPOSAL46Onyama Limba
1012Octavia Z InouyeUnited Kingdom2024-05-24Printing Dimensions QUALIFIED42Amy Elsner
1013Juan X RulapaughJapan2024-05-22Benton, John B Jr NEW57Elwin Sharvill
1014Maria K VocelkaIndia2024-06-14Buckley Miller Wright QUALIFIED25Ivan Magalhaes
1015Jennifer W FigeroaFrance2024-06-11Feiner Bros PROPOSAL33Anna Fali
1016Julie I PaprockiCanada2024-06-13Chanay, Jeffrey A Esq RENEWAL42Onyama Limba
1017Alejandro I RulapaughIndia2024-05-30Chapman, Ross E Esq RENEWAL50Amy Elsner
1018Emily A KolmetzAustralia2024-06-09Commercial Press RENEWAL4Ivan Magalhaes
1019Antonio J StensethUnited Kingdom2024-06-13Benton, John B Jr NEW26Amy Elsner
1020Deepesh S FigeroaIndia2024-05-20Chemel, James L Cpa PROPOSAL1Anna Fali
1021Maria D InouyeGermany2024-06-11Buckley Miller Wright NEW5Stephen Shaw
1022Rodrigues E RutaRussia2024-06-14Chemel, James L Cpa UNQUALIFIED56Amy Elsner
1023Clifford Y WhobreyGermany2024-05-18Chemel, James L Cpa PROPOSAL24Asiya Javayant
1024Kaitlin R WaycottUnited Kingdom2024-05-22Feiner Bros RENEWAL50Xuxue Feng
1025James J KuskoArgentina2024-05-21Chanay, Jeffrey A Esq QUALIFIED62Asiya Javayant
1026Cody Q IturbideArgentina2024-05-29Morlong Associates NEW40Ivan Magalhaes
1027Izzy V CaudyGermany2024-06-02Chemel, James L Cpa QUALIFIED54Stephen Shaw
1028Leja Z RulapaughCanada2024-05-23Buckley Miller Wright UNQUALIFIED51Amy Elsner
1029Jefferson A MacleadJapan2024-06-13Feltz Printing Service QUALIFIED21Ivan Magalhaes
1030Antonio A MacleadGermany2024-06-14Truhlar And Truhlar Attys UNQUALIFIED44Ioni Bowcher
1031Morrow Z GillianAustralia2024-06-01Rangoni Of Florence PROPOSAL23Ioni Bowcher
1032Ricardo F RulapaughGermany2024-05-28Feltz Printing Service QUALIFIED74Anna Fali
1033Faith U SchemmerItaly2024-06-14Rousseaux, Michael Esq UNQUALIFIED9Amy Elsner
1034Ricardo F CaldareraSpain2024-06-01Rangoni Of Florence PROPOSAL37Onyama Limba
1035Aditya R OstroskyUnited Kingdom2024-05-20Rangoni Of Florence QUALIFIED62Ivan Magalhaes
1036Francesco V DarakjyJapan2024-06-01Truhlar And Truhlar Attys NEW26Ivan Magalhaes
1037Emily H FerenczFrance2024-05-18Morlong Associates NEGOTIATION38Asiya Javayant
1038Faith O VocelkaRussia2024-06-10Chanay, Jeffrey A Esq PROPOSAL52Stephen Shaw
1039Faith W CaldareraRussia2024-05-28Truhlar And Truhlar Attys RENEWAL32Ioni Bowcher
1040Ashley R MaletUnited Kingdom2024-05-30Morlong Associates NEGOTIATION29Bernardo Dominic
1041Mujtaba Z SaylorsIndia2024-05-30Chemel, James L Cpa NEW93Xuxue Feng
1042Rodrigues O BriddickIndia2024-05-16Rangoni Of Florence QUALIFIED41Asiya Javayant
1043Mayumi J RutaAustralia2024-06-04King, Christopher A Esq RENEWAL10Amy Elsner
1044Morrow X PerinRussia2024-05-18Feltz Printing Service NEGOTIATION47Bernardo Dominic
1045Kadeem H FlosiUnited Kingdom2024-06-08Chemel, James L Cpa RENEWAL93Ioni Bowcher
1046Ivar P OstroskyCanada2024-05-25Commercial Press UNQUALIFIED48Elwin Sharvill
1047Cody N ShinkoFrance2024-05-18Commercial Press QUALIFIED8Amy Elsner
1048Aditya H PerinGermany2024-05-26Chanay, Jeffrey A Esq NEW76Asiya Javayant
1049Salvatore E SlusarskiGermany2024-06-04Benton, John B Jr UNQUALIFIED21Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Jefferson A ButtUnited KingdomAsiya Javayant NEGOTIATION
Leon A FigeroaFranceBernardo Dominic PROPOSAL
Jeanfrancois O RutaJapanAsiya Javayant UNQUALIFIED
Salvatore L BowleyIndiaIoni Bowcher NEW
Adams X MarrierGermanyAnna Fali QUALIFIED
Smith T WhobreyArgentinaAnna Fali NEW
Antonio R RoysterAustraliaOnyama Limba NEW
Deepesh U DoeFranceXuxue Feng UNQUALIFIED
Rodrigues B GauchoRussiaXuxue Feng QUALIFIED
Smith S IturbideGermanyAnna Fali PROPOSAL
Jennifer Y MorascaFranceAnna Fali QUALIFIED
Murillo A RimItalyStephen Shaw PROPOSAL
Maisha D MarrierItalyXuxue Feng RENEWAL
Misaki S CaldareraFranceStephen Shaw NEW
Ricardo I RutaUnited KingdomStephen Shaw QUALIFIED
Darci N KuskoGermanyStephen Shaw RENEWAL
Ashley Y FerenczUnited KingdomIoni Bowcher QUALIFIED
Alejandro I DilliardCanadaAsiya Javayant RENEWAL
Nicolas X MaletIndiaAmy Elsner NEW
Aika L GillianIndiaStephen Shaw NEGOTIATION
Rodrigues S TollnerArgentinaAnna Fali PROPOSAL
Claire T StockhamGermanyAnna Fali UNQUALIFIED
Jones W PaprockiSpainElwin Sharvill NEW
Mayumi R BologniaFranceAmy Elsner PROPOSAL
Ashley D IturbideCanadaAsiya Javayant NEGOTIATION
Jefferson F ButtFranceAnna Fali NEW
Rodrigues T VocelkaAustraliaAmy Elsner NEGOTIATION
Ashley O MarrierFranceElwin Sharvill QUALIFIED
Murillo H MorascaCanadaElwin Sharvill NEW
Rodrigues L SaylorsItalyElwin Sharvill NEGOTIATION
Ricardo Z FigeroaJapanAmy Elsner UNQUALIFIED
Juan Y RoysterGermanyElwin Sharvill NEGOTIATION
Nicolas V RimArgentinaIvan Magalhaes NEGOTIATION
Greenwood P FerenczIndiaStephen Shaw NEGOTIATION
Aika X CaudyRussiaAmy Elsner PROPOSAL
Jennifer O AmigonItalyIvan Magalhaes NEW
Ricardo N TollnerItalyAsiya Javayant QUALIFIED
Maisha Y RulapaughBrazilIoni Bowcher RENEWAL
Nicolas R CaudyBrazilXuxue Feng PROPOSAL
Rodrigues A BriddickAustraliaOnyama Limba NEW
Ashley A GarufiRussiaIvan Magalhaes UNQUALIFIED
Nicolas W OldroydUnited KingdomIoni Bowcher NEW
Smith S AlbaresItalyIoni Bowcher PROPOSAL
Izzy Z RulapaughAustraliaXuxue Feng NEW
Darci A FollerRussiaIoni Bowcher QUALIFIED
Claire G WieserArgentinaStephen Shaw PROPOSAL
Kaitlin R AmigonUnited KingdomOnyama Limba NEGOTIATION
Salvatore M MorascaRussiaAnna Fali PROPOSAL
Emily O MaletGermanyAnna Fali UNQUALIFIED
Adams R WieserCanadaAmy Elsner UNQUALIFIED
Frozen Columns
Name
Leja X Doe
Octavia H Sergi
Isabel E Doe
Ivar M Caldarera
Tony W Rulapaugh
Emily C Maclead
Silvio Q Nestle
Julie A Maclead
Clifford W Amigon
Misaki X Figeroa
Jefferson A Flosi
Maisha Z Maclead
Faith Q Schemmer
Stacey N Rulapaugh
Juan Q Glick
Murillo Z Albares
Leon F Paprocki
Greenwood W Shinko
Juan I Butt
Jones E Malet
Kaitlin C Caudy
Francesco I Vocelka
David W Nestle
Kaitlin P Iturbide
Stacey B Ferencz
Clifford K Whobrey
Aika Z Amigon
Misaki W Bowley
Wickens U Paprocki
Aditya R Gaucho
Maria T Oldroyd
Maisha L Schemmer
Darci J Bowley
Emily S Rim
Adams Q Venere
Kadeem G Nicka
Jeanfrancois R Maclead
Salvatore N Venere
Claire K Vocelka
Mayumi A Foller
Deepesh Y Kusko
Arvin D Saylors
Chavez S Slusarski
Maria N Ruta
Mayumi B Iturbide
Maisha V Rulapaugh
Adams I Gaucho
Johnson F Sergi
Kaitlin K Bolognia
Faith F Albares
IdCountryDate
1000France2024-06-07
1001Australia2024-06-07
1002Brazil2024-05-28
1003Canada2024-05-20
1004Germany2024-06-06
1005Spain2024-05-21
1006Germany2024-05-29
1007Brazil2024-06-02
1008France2024-05-30
1009United Kingdom2024-05-16
1010France2024-06-08
1011France2024-06-05
1012France2024-05-31
1013Brazil2024-05-30
1014India2024-05-25
1015United Kingdom2024-06-06
1016India2024-06-03
1017Argentina2024-05-31
1018Australia2024-06-04
1019Germany2024-05-16
1020France2024-05-17
1021Spain2024-06-08
1022Spain2024-06-05
1023Russia2024-06-03
1024Russia2024-06-06
1025Italy2024-05-17
1026India2024-05-18
1027Italy2024-05-29
1028Spain2024-05-24
1029Brazil2024-06-06
1030Germany2024-06-12
1031United Kingdom2024-06-05
1032United Kingdom2024-06-11
1033Japan2024-05-26
1034Italy2024-06-02
1035Russia2024-05-18
1036Brazil2024-05-20
1037United Kingdom2024-05-27
1038United Kingdom2024-05-26
1039Germany2024-06-08
1040Spain2024-06-06
1041Japan2024-05-27
1042France2024-05-23
1043Russia2024-05-16
1044Brazil2024-05-23
1045Australia2024-06-10
1046Argentina2024-05-21
1047Brazil2024-05-16
1048Canada2024-05-22
1049Brazil2024-05-16

On-Demand Data

NameIdCountryDate
Jefferson T Poquette1000United Kingdom2024-06-11
Tony L Butt1001France2024-06-07
Claire U Butt1002Brazil2024-06-10
Johnson E Wieser1003Japan2024-05-23
Isabel N Venere1004France2024-05-20
Chavez B Whobrey1005Australia2024-06-01
Aditya L Nicka1006Italy2024-05-27
Juan L Bolognia1007Argentina2024-06-02
Costa V Dilliard1008United Kingdom2024-06-12
Stacey M Glick1009Spain2024-06-04
Deepesh Q Maclead1010Italy2024-05-27
Murillo Z Paprocki1011Spain2024-06-12
Leon C Sergi1012Russia2024-06-07
Murillo A Campain1013Australia2024-06-03
Leon V Slusarski1014India2024-05-21
Kaitlin Y Iturbide1015Canada2024-05-31
Greenwood H Garufi1016Japan2024-05-24
Francesco A Bolognia1017Australia2024-05-16
Ivar C Kusko1018United Kingdom2024-05-30
Darci X Amigon1019United Kingdom2024-05-20
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Emily R DarakjyUnited KingdomXuxue Feng QUALIFIED
David M StockhamFranceOnyama Limba NEW
Morrow Q WhobreyCanadaStephen Shaw UNQUALIFIED
Aditya X NestleArgentinaIoni Bowcher UNQUALIFIED
Greenwood O BologniaUnited KingdomIoni Bowcher QUALIFIED
Arvin C SchemmerBrazilAsiya Javayant UNQUALIFIED
Kadeem E ButtIndiaElwin Sharvill NEGOTIATION
Ricardo O NickaIndiaIoni Bowcher UNQUALIFIED
Izzy H PerinGermanyXuxue Feng PROPOSAL
Maisha W StockhamCanadaStephen Shaw PROPOSAL
Ashley U BriddickJapanElwin Sharvill NEW
Octavia M MaletArgentinaOnyama Limba RENEWAL
Clifford T CaudyFranceAmy Elsner QUALIFIED
Adams V SergiRussiaStephen Shaw RENEWAL
Ashley G NickaJapanStephen Shaw RENEWAL
Nicolas I GarufiItalyXuxue Feng NEW
Aditya T ButtGermanyOnyama Limba NEGOTIATION
Ivar D RutaFranceStephen Shaw NEGOTIATION
Adams J FerenczCanadaAnna Fali RENEWAL
Clifford K GarufiArgentinaOnyama Limba UNQUALIFIED
Cody Z WaycottAustraliaStephen Shaw NEGOTIATION
Morrow T PoquetteGermanyXuxue Feng PROPOSAL
Sinclair X TollnerUnited KingdomAsiya Javayant PROPOSAL
Jones Y BowleyRussiaStephen Shaw RENEWAL
Ricardo D PerinUnited KingdomAsiya Javayant NEGOTIATION
Sinclair Y DarakjyCanadaIoni Bowcher QUALIFIED
Aruna D DarakjyItalyElwin Sharvill PROPOSAL
Misaki H IturbideRussiaIvan Magalhaes UNQUALIFIED
Mujtaba P ShinkoCanadaXuxue Feng NEGOTIATION
David R TollnerCanadaElwin Sharvill PROPOSAL
Rodrigues C OldroydSpainAsiya Javayant NEGOTIATION
Kaitlin N RulapaughArgentinaAmy Elsner RENEWAL
Aditya Q RoysterItalyAnna Fali NEW
Mayumi R KolmetzArgentinaAsiya Javayant UNQUALIFIED
Sinclair T RutaIndiaAsiya Javayant NEGOTIATION
Greenwood A MorascaCanadaXuxue Feng RENEWAL
Antonio N PerinIndiaIoni Bowcher RENEWAL
Morrow Y RoysterRussiaIvan Magalhaes RENEWAL
Greenwood T GillianBrazilXuxue Feng RENEWAL
Ricardo M MaletBrazilAsiya Javayant PROPOSAL

<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>