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 X BowleyBrazilElwin Sharvill QUALIFIED
Rodrigues R BriddickBrazilStephen Shaw RENEWAL
Ashley L FollerRussiaOnyama Limba UNQUALIFIED
James R NestleGermanyAsiya Javayant UNQUALIFIED
Leon M NickaSpainAsiya Javayant NEGOTIATION
Leja A PerinRussiaIoni Bowcher PROPOSAL
Darci Y MacleadSpainStephen Shaw RENEWAL
Cody P FlosiIndiaAsiya Javayant RENEWAL
Johnson U SaylorsAustraliaIvan Magalhaes NEW
Sinclair B FigeroaItalyBernardo Dominic NEW
Wickens Z AlbaresRussiaAsiya Javayant NEGOTIATION
Wickens X SlusarskiRussiaAsiya Javayant RENEWAL
Arvin C ChuiBrazilAmy Elsner PROPOSAL
Claire Q SaylorsUnited KingdomXuxue Feng PROPOSAL
Cody Y GarufiFranceElwin Sharvill PROPOSAL
Murillo R RoysterUnited KingdomElwin Sharvill RENEWAL
Alejandro C BowleyGermanyIoni Bowcher QUALIFIED
Morrow N WhobreyItalyBernardo Dominic QUALIFIED
Faith G ShinkoItalyAmy Elsner PROPOSAL
Stacey U OldroydGermanyStephen Shaw RENEWAL
Isabel U NestleFranceAmy Elsner UNQUALIFIED
Costa L AmigonIndiaElwin Sharvill RENEWAL
Chavez J ShinkoCanadaXuxue Feng UNQUALIFIED
Murillo C GillianUnited KingdomXuxue Feng UNQUALIFIED
Darci U WaycottUnited KingdomElwin Sharvill NEGOTIATION
David L KolmetzAustraliaStephen Shaw UNQUALIFIED
Cody Q BologniaAustraliaElwin Sharvill RENEWAL
Aruna U ChuiCanadaAsiya Javayant UNQUALIFIED
Mujtaba L VenereItalyXuxue Feng QUALIFIED
Costa F DarakjyItalyAsiya Javayant UNQUALIFIED
Aditya G RoysterArgentinaElwin Sharvill QUALIFIED
Leja V OldroydBrazilXuxue Feng PROPOSAL
Chavez H KolmetzAustraliaOnyama Limba NEW
Clifford N MarrierArgentinaOnyama Limba QUALIFIED
Wickens G CaudyAustraliaStephen Shaw UNQUALIFIED
Jones C OldroydUnited KingdomAmy Elsner NEW
Deepesh D SergiJapanAsiya Javayant RENEWAL
Jennifer G ChuiUnited KingdomBernardo Dominic RENEWAL
Isabel I GarufiBrazilStephen Shaw QUALIFIED
Munro Z RutaAustraliaAmy Elsner UNQUALIFIED
Maria M PoquetteItalyIvan Magalhaes NEW
Johnson J PaprockiAustraliaAnna Fali UNQUALIFIED
Faith I WhobreyAustraliaAmy Elsner NEGOTIATION
Darci B BologniaItalyAmy Elsner RENEWAL
Mujtaba T NickaItalyBernardo Dominic NEW
Cody I VocelkaItalyStephen Shaw RENEWAL
Clifford N WaycottFranceIvan Magalhaes NEW
Maisha G DarakjyCanadaAnna Fali PROPOSAL
Nicolas L BowleyUnited KingdomStephen Shaw NEGOTIATION
Arvin U GauchoItalyElwin Sharvill NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Ashley O DilliardRussiaAmy Elsner QUALIFIED
Morrow T SaylorsSpainIoni Bowcher RENEWAL
Jones W PerinRussiaBernardo Dominic NEGOTIATION
Clifford R StockhamItalyAsiya Javayant NEGOTIATION
Stacey Y DilliardGermanyIoni Bowcher QUALIFIED
Nicolas X RoysterFranceBernardo Dominic PROPOSAL
Jennifer P StensethBrazilIoni Bowcher UNQUALIFIED
Claire J TollnerBrazilElwin Sharvill UNQUALIFIED
Chavez W BowleyRussiaElwin Sharvill NEW
Leja O CaudyBrazilIvan Magalhaes UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Francesco Z PoquetteBrazil2025-05-23Morlong Associates UNQUALIFIED88Onyama Limba
1001Smith U ButtArgentina2025-05-29Feiner Bros UNQUALIFIED19Elwin Sharvill
1002Kadeem J DilliardJapan2025-06-02Chapman, Ross E Esq UNQUALIFIED93Elwin Sharvill
1003Jefferson J FerenczGermany2025-05-19Chapman, Ross E Esq NEW92Ioni Bowcher
1004Francesco C RulapaughAustralia2025-05-18Feiner Bros NEGOTIATION82Onyama Limba
1005Munro F CaldareraGermany2025-05-23Printing Dimensions UNQUALIFIED59Onyama Limba
1006Jefferson W InouyeCanada2025-06-13Truhlar And Truhlar Attys PROPOSAL21Anna Fali
1007Clifford C MacleadBrazil2025-06-02King, Christopher A Esq PROPOSAL24Ioni Bowcher
1008Ivar H FerenczRussia2025-05-18Feiner Bros UNQUALIFIED99Ivan Magalhaes
1009Jones M AlbaresBrazil2025-06-01Buckley Miller Wright QUALIFIED19Xuxue Feng
1010Jennifer I MaletItaly2025-06-11Chemel, James L Cpa QUALIFIED99Amy Elsner
1011Octavia Y SlusarskiAustralia2025-06-16King, Christopher A Esq NEW79Elwin Sharvill
1012Mujtaba A GlickFrance2025-06-05Dorl, James J Esq PROPOSAL53Bernardo Dominic
1013Izzy T ChuiIndia2025-06-12Feiner Bros PROPOSAL62Ivan Magalhaes
1014Silvio L BologniaItaly2025-05-27Rangoni Of Florence QUALIFIED67Onyama Limba
1015Isabel W GauchoItaly2025-05-29Dorl, James J Esq PROPOSAL72Elwin Sharvill
1016Nicolas H KolmetzItaly2025-06-09Buckley Miller Wright UNQUALIFIED42Stephen Shaw
1017Leon N PoquetteSpain2025-05-22Chanay, Jeffrey A Esq RENEWAL16Bernardo Dominic
1018Munro I FlosiAustralia2025-05-24Truhlar And Truhlar Attys QUALIFIED76Asiya Javayant
1019Aika U RoysterArgentina2025-05-29Feiner Bros PROPOSAL30Anna Fali
1020Adams O GlickIndia2025-06-09Morlong Associates QUALIFIED73Onyama Limba
1021Munro B ButtJapan2025-06-12King, Christopher A Esq PROPOSAL8Bernardo Dominic
1022Claire L InouyeSpain2025-05-22Truhlar And Truhlar Attys PROPOSAL89Elwin Sharvill
1023Kaitlin K ChuiIndia2025-06-12Commercial Press NEW68Xuxue Feng
1024Greenwood D OldroydFrance2025-05-29Buckley Miller Wright RENEWAL83Ioni Bowcher
1025Johnson S DoeCanada2025-05-23Truhlar And Truhlar Attys NEGOTIATION21Xuxue Feng
1026Rodrigues T DarakjyFrance2025-05-30Rousseaux, Michael Esq QUALIFIED55Bernardo Dominic
1027Maria W WhobreyBrazil2025-05-28Buckley Miller Wright RENEWAL24Xuxue Feng
1028Munro S CaudyItaly2025-06-12Chapman, Ross E Esq NEW47Elwin Sharvill
1029Jeanfrancois U ShinkoIndia2025-05-20Morlong Associates QUALIFIED13Asiya Javayant
1030James M MaletArgentina2025-05-27Truhlar And Truhlar Attys UNQUALIFIED5Ioni Bowcher
1031Alejandro F FerenczBrazil2025-05-21King, Christopher A Esq QUALIFIED76Anna Fali
1032Octavia J PaprockiFrance2025-06-09Chapman, Ross E Esq QUALIFIED9Ivan Magalhaes
1033Morrow Y CampainSpain2025-06-11Benton, John B Jr NEW72Amy Elsner
1034Mayumi N DarakjyFrance2025-06-13Rangoni Of Florence NEW6Asiya Javayant
1035Darci H BowleyItaly2025-06-09King, Christopher A Esq UNQUALIFIED41Bernardo Dominic
1036Julie P SergiRussia2025-06-01King, Christopher A Esq QUALIFIED45Anna Fali
1037Faith K GlickRussia2025-06-16Dorl, James J Esq NEW28Onyama Limba
1038Stacey A MaletItaly2025-05-27Feltz Printing Service NEGOTIATION93Anna Fali
1039Misaki X GlickIndia2025-05-20Feltz Printing Service QUALIFIED57Ioni Bowcher
1040Costa M RoysterRussia2025-06-10Printing Dimensions PROPOSAL76Elwin Sharvill
1041Adams W GauchoBrazil2025-06-01King, Christopher A Esq NEW48Amy Elsner
1042Clifford G MarrierBrazil2025-05-19King, Christopher A Esq RENEWAL31Xuxue Feng
1043Claire J MaletAustralia2025-06-03Rangoni Of Florence QUALIFIED87Amy Elsner
1044Greenwood J GlickFrance2025-06-07Morlong Associates PROPOSAL84Onyama Limba
1045Johnson G BowleySpain2025-06-09Benton, John B Jr NEGOTIATION42Ioni Bowcher
1046Salvatore Y SlusarskiAustralia2025-05-23Rousseaux, Michael Esq NEGOTIATION11Ivan Magalhaes
1047Emily Z GlickItaly2025-06-02Truhlar And Truhlar Attys RENEWAL15Xuxue Feng
1048Morrow I TollnerIndia2025-06-13Morlong Associates QUALIFIED85Amy Elsner
1049Kadeem G ButtItaly2025-05-20Feiner Bros UNQUALIFIED31Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Stacey I PerinJapanElwin Sharvill PROPOSAL
Antonio J MarrierArgentinaElwin Sharvill UNQUALIFIED
Deepesh I CaldareraUnited KingdomAnna Fali NEW
Silvio M CaldareraCanadaBernardo Dominic NEW
Claire L AlbaresCanadaAmy Elsner RENEWAL
Cody V MaletCanadaIoni Bowcher PROPOSAL
Aditya W KuskoArgentinaIoni Bowcher PROPOSAL
Salvatore Z WaycottGermanyAsiya Javayant NEW
Clifford J MarrierRussiaIvan Magalhaes QUALIFIED
Emily M SchemmerJapanElwin Sharvill NEGOTIATION
Cody X WaycottJapanAsiya Javayant QUALIFIED
Antonio W CaldareraJapanXuxue Feng PROPOSAL
Clifford W AmigonAustraliaElwin Sharvill RENEWAL
James Z BologniaRussiaElwin Sharvill QUALIFIED
Murillo A ChuiArgentinaOnyama Limba QUALIFIED
Claire D PaprockiSpainIvan Magalhaes NEGOTIATION
Isabel V NickaArgentinaIvan Magalhaes NEW
Ricardo T NickaRussiaIoni Bowcher PROPOSAL
Claire E ButtGermanyAnna Fali NEW
Alejandro R OstroskyJapanXuxue Feng UNQUALIFIED
Maisha Z GarufiRussiaElwin Sharvill PROPOSAL
Costa Q SaylorsGermanyOnyama Limba PROPOSAL
Claire B MacleadItalyAmy Elsner RENEWAL
Jeanfrancois Q MacleadSpainStephen Shaw UNQUALIFIED
Leon Q PerinUnited KingdomIoni Bowcher PROPOSAL
Faith E WaycottFranceIvan Magalhaes PROPOSAL
Leon Z PoquetteBrazilIvan Magalhaes PROPOSAL
Claire C TollnerCanadaAnna Fali QUALIFIED
Clifford K ShinkoAustraliaIvan Magalhaes QUALIFIED
Costa I SchemmerFranceBernardo Dominic NEGOTIATION
Ricardo R FigeroaGermanyXuxue Feng PROPOSAL
Julie V MaletItalyBernardo Dominic UNQUALIFIED
Leon M DoeAustraliaIoni Bowcher QUALIFIED
Clifford R AlbaresFranceAsiya Javayant RENEWAL
Ivar B FerenczItalyIoni Bowcher QUALIFIED
Smith J WaycottBrazilOnyama Limba RENEWAL
Clifford Z PoquetteArgentinaIoni Bowcher PROPOSAL
Nicolas P RutaSpainOnyama Limba RENEWAL
Juan P SaylorsUnited KingdomElwin Sharvill RENEWAL
Leja Q BologniaAustraliaIvan Magalhaes NEGOTIATION
Aika H VocelkaGermanyIvan Magalhaes PROPOSAL
Stacey U BowleyCanadaIvan Magalhaes PROPOSAL
Octavia A RimGermanyAnna Fali PROPOSAL
Claire W TollnerFranceElwin Sharvill PROPOSAL
Ricardo I PerinBrazilBernardo Dominic NEW
Murillo B WieserUnited KingdomIvan Magalhaes QUALIFIED
Claire C BowleySpainBernardo Dominic UNQUALIFIED
Salvatore Z GillianItalyAmy Elsner UNQUALIFIED
Wickens E DilliardJapanStephen Shaw RENEWAL
Aruna G PerinBrazilXuxue Feng PROPOSAL
Frozen Columns
Name
Murillo Z Perin
Juan P Wieser
Leon X Iturbide
Emily W Poquette
Darci D Kusko
Arvin Q Ruta
Adams B Figeroa
Juan O Ostrosky
Leon N Malet
Stacey F Albares
David A Nestle
Maria M Maclead
Misaki V Tollner
Octavia X Schemmer
Adams M Vocelka
Munro Q Inouye
Mayumi K Rulapaugh
Sinclair H Caudy
Costa R Garufi
Jefferson M Malet
Kaitlin S Nicka
Silvio F Vocelka
Morrow U Albares
Morrow Z Figeroa
Ashley V Kusko
Munro U Garufi
Chavez Y Flosi
Wickens X Amigon
Deepesh A Sergi
Salvatore F Royster
Cody C Butt
Isabel Y Ostrosky
Ricardo X Venere
James M Saylors
Maria M Campain
Kaitlin V Kolmetz
Juan W Darakjy
Aditya C Albares
Mujtaba R Rulapaugh
Claire M Figeroa
David S Rulapaugh
Kadeem G Ostrosky
Smith N Stockham
Isabel G Figeroa
Sinclair Q Slusarski
Smith Q Foller
Rodrigues I Dilliard
Octavia P Briddick
Murillo B Rim
Misaki M Ferencz
IdCountryDate
1000Russia2025-06-07
1001Canada2025-05-26
1002India2025-05-26
1003Italy2025-05-24
1004Japan2025-06-13
1005Argentina2025-06-04
1006United Kingdom2025-06-12
1007France2025-06-02
1008Brazil2025-06-11
1009Australia2025-05-23
1010Japan2025-06-04
1011Japan2025-05-21
1012India2025-06-04
1013Canada2025-06-16
1014Italy2025-06-09
1015Spain2025-06-15
1016Australia2025-06-10
1017Spain2025-05-18
1018Russia2025-06-02
1019Spain2025-06-08
1020France2025-05-27
1021United Kingdom2025-05-22
1022Canada2025-05-25
1023Italy2025-06-15
1024Russia2025-05-23
1025Canada2025-06-14
1026Canada2025-06-11
1027Argentina2025-05-19
1028Australia2025-06-15
1029Australia2025-05-29
1030Russia2025-06-03
1031India2025-05-22
1032Australia2025-06-08
1033United Kingdom2025-05-22
1034Russia2025-05-22
1035Germany2025-06-05
1036Germany2025-05-28
1037Argentina2025-05-21
1038Italy2025-06-06
1039Argentina2025-06-15
1040Germany2025-05-26
1041India2025-06-11
1042Brazil2025-05-31
1043Australia2025-06-16
1044Canada2025-05-20
1045Germany2025-05-21
1046Canada2025-05-31
1047Spain2025-06-09
1048Italy2025-05-18
1049Italy2025-05-23

On-Demand Data

NameIdCountryDate
Costa J Gillian1000Brazil2025-06-07
Stacey R Tollner1001Germany2025-06-13
Jennifer V Ostrosky1002Germany2025-06-13
Maisha I Nestle1003Canada2025-06-16
Maria A Nestle1004Canada2025-06-16
Smith B Garufi1005United Kingdom2025-06-15
James K Doe1006Germany2025-05-22
Maria H Iturbide1007France2025-05-26
Juan Z Darakjy1008United Kingdom2025-05-21
Smith L Wieser1009Japan2025-05-28
Aditya G Marrier1010Russia2025-06-02
Salvatore R Malet1011Russia2025-05-28
Alejandro Z Stockham1012Australia2025-06-06
Aditya X Albares1013Brazil2025-06-13
Isabel L Caudy1014Brazil2025-06-10
Kadeem Z Oldroyd1015Italy2025-06-10
Wickens L Iturbide1016France2025-05-19
Costa A Gillian1017Russia2025-06-05
Leja O Rulapaugh1018Japan2025-05-25
Clifford M Sergi1019Brazil2025-05-18
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Stacey D RutaUnited KingdomBernardo Dominic QUALIFIED
Jennifer M NickaGermanyIvan Magalhaes NEW
Aditya F DoeGermanyIvan Magalhaes NEGOTIATION
Ashley U CaudyRussiaAnna Fali PROPOSAL
Jefferson R MacleadArgentinaBernardo Dominic QUALIFIED
Aditya H DilliardIndiaIvan Magalhaes UNQUALIFIED
Jones L ChuiFranceBernardo Dominic PROPOSAL
Munro L FigeroaJapanBernardo Dominic RENEWAL
David P NickaCanadaBernardo Dominic PROPOSAL
Maria C KolmetzUnited KingdomOnyama Limba QUALIFIED
Rodrigues J InouyeJapanAnna Fali NEGOTIATION
Costa N RimAustraliaBernardo Dominic QUALIFIED
Murillo E IturbideGermanyXuxue Feng PROPOSAL
Johnson Q CaldareraItalyXuxue Feng UNQUALIFIED
Chavez V WaycottBrazilOnyama Limba NEGOTIATION
Claire L CampainAustraliaAnna Fali RENEWAL
Silvio H FigeroaBrazilOnyama Limba PROPOSAL
Stacey S GlickCanadaAnna Fali QUALIFIED
Greenwood L OldroydSpainAnna Fali NEW
David R PaprockiCanadaIvan Magalhaes UNQUALIFIED
Munro E GauchoAustraliaXuxue Feng QUALIFIED
Ricardo O FerenczRussiaBernardo Dominic QUALIFIED
Aika H WaycottItalyIvan Magalhaes NEW
Leja Q VenereIndiaBernardo Dominic PROPOSAL
Tony H StensethIndiaStephen Shaw NEW
Isabel N MaletIndiaXuxue Feng RENEWAL
Maria Q WieserSpainStephen Shaw NEW
Darci P SlusarskiSpainIoni Bowcher QUALIFIED
Deepesh A SergiGermanyStephen Shaw NEW
Antonio X VocelkaUnited KingdomOnyama Limba NEW
Misaki R WieserBrazilAmy Elsner NEW
Rodrigues E FlosiUnited KingdomBernardo Dominic NEGOTIATION
Faith J RutaJapanIvan Magalhaes NEGOTIATION
Aruna W VenereGermanyIoni Bowcher QUALIFIED
Wickens U FigeroaRussiaOnyama Limba QUALIFIED
Cody N FerenczBrazilIoni Bowcher NEW
Maria F FigeroaIndiaOnyama Limba QUALIFIED
Costa X VocelkaJapanIoni Bowcher QUALIFIED
Kaitlin V BologniaAustraliaXuxue Feng RENEWAL
Stacey I OstroskyFranceAsiya Javayant NEGOTIATION

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