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
Kaitlin V PerinArgentinaIoni Bowcher QUALIFIED
Jones X BriddickBrazilAsiya Javayant NEW
Octavia R SergiCanadaIoni Bowcher NEW
Aruna M DilliardAustraliaOnyama Limba RENEWAL
Julie L RulapaughRussiaAnna Fali QUALIFIED
James P SchemmerFranceXuxue Feng RENEWAL
Deepesh P MarrierCanadaIoni Bowcher QUALIFIED
Kaitlin L SergiCanadaAsiya Javayant UNQUALIFIED
Emily Y BowleyAustraliaXuxue Feng NEW
Juan F PerinItalyOnyama Limba RENEWAL
Nicolas Z AlbaresFranceOnyama Limba NEW
Izzy Y StockhamItalyXuxue Feng RENEWAL
Antonio T InouyeGermanyAnna Fali NEGOTIATION
Ricardo F PaprockiUnited KingdomBernardo Dominic NEW
Aditya R StensethFranceAsiya Javayant NEW
Misaki Q GauchoGermanyAsiya Javayant NEGOTIATION
Ricardo P FerenczSpainElwin Sharvill NEGOTIATION
Octavia G PoquetteBrazilAnna Fali QUALIFIED
Jeanfrancois D BriddickAustraliaOnyama Limba RENEWAL
Jennifer E MaletUnited KingdomIoni Bowcher QUALIFIED
Stacey D StockhamRussiaIvan Magalhaes NEGOTIATION
Greenwood B NickaRussiaIvan Magalhaes UNQUALIFIED
Tony M RutaItalyAnna Fali NEGOTIATION
Izzy F ChuiUnited KingdomElwin Sharvill NEW
Greenwood N SchemmerIndiaStephen Shaw UNQUALIFIED
Silvio X DilliardRussiaStephen Shaw NEGOTIATION
Clifford Y FerenczItalyXuxue Feng RENEWAL
Sinclair U RoysterItalyIvan Magalhaes QUALIFIED
Stacey V SlusarskiCanadaIvan Magalhaes NEGOTIATION
Jeanfrancois F AlbaresIndiaElwin Sharvill RENEWAL
Smith J FollerIndiaStephen Shaw QUALIFIED
Leon G DilliardIndiaElwin Sharvill RENEWAL
Adams T GarufiSpainIoni Bowcher PROPOSAL
Antonio P KolmetzBrazilAmy Elsner RENEWAL
David E SlusarskiIndiaStephen Shaw PROPOSAL
David V RimBrazilIoni Bowcher RENEWAL
Morrow Q FerenczIndiaIoni Bowcher RENEWAL
Adams H PoquetteJapanElwin Sharvill UNQUALIFIED
Darci N MarrierFranceElwin Sharvill UNQUALIFIED
Aditya I FollerJapanXuxue Feng RENEWAL
Leon S CaldareraRussiaAmy Elsner UNQUALIFIED
Adams S SaylorsArgentinaAsiya Javayant NEGOTIATION
Francesco O SergiIndiaOnyama Limba QUALIFIED
Johnson M BowleyUnited KingdomStephen Shaw PROPOSAL
Kaitlin B BriddickSpainAsiya Javayant PROPOSAL
David B GlickItalyAmy Elsner QUALIFIED
Antonio V GarufiSpainAsiya Javayant NEGOTIATION
Francesco B TollnerItalyIvan Magalhaes UNQUALIFIED
Kaitlin M SchemmerGermanyElwin Sharvill PROPOSAL
Chavez W GauchoItalyAnna Fali PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Mayumi B RulapaughAustraliaIvan Magalhaes NEW
Greenwood R MaletJapanIvan Magalhaes NEGOTIATION
Smith T SaylorsJapanAsiya Javayant RENEWAL
Aika M SaylorsCanadaBernardo Dominic PROPOSAL
Costa Z RutaArgentinaAmy Elsner UNQUALIFIED
Antonio B RutaItalyBernardo Dominic NEGOTIATION
Julie Z RimGermanyIoni Bowcher PROPOSAL
Aruna M FigeroaGermanyIvan Magalhaes UNQUALIFIED
Rodrigues C BriddickRussiaXuxue Feng RENEWAL
Aika C SchemmerItalyAmy Elsner QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Chavez U BologniaUnited Kingdom2025-05-04Feiner Bros QUALIFIED59Ioni Bowcher
1001Munro X KolmetzGermany2025-04-24Benton, John B Jr UNQUALIFIED44Elwin Sharvill
1002Aruna G RoysterAustralia2025-04-19Chanay, Jeffrey A Esq UNQUALIFIED72Elwin Sharvill
1003Sinclair T PerinAustralia2025-05-10Benton, John B Jr QUALIFIED78Amy Elsner
1004Kadeem K MorascaBrazil2025-05-03Commercial Press QUALIFIED97Stephen Shaw
1005Jones P BowleyFrance2025-05-08Rousseaux, Michael Esq PROPOSAL75Bernardo Dominic
1006Chavez W GillianItaly2025-04-20Printing Dimensions NEGOTIATION83Elwin Sharvill
1007Alejandro E SergiUnited Kingdom2025-04-27Chapman, Ross E Esq PROPOSAL50Stephen Shaw
1008Tony J AmigonUnited Kingdom2025-05-01Chanay, Jeffrey A Esq QUALIFIED83Bernardo Dominic
1009Nicolas D BowleyArgentina2025-04-16Rangoni Of Florence NEW8Onyama Limba
1010Silvio D ButtArgentina2025-05-02Rousseaux, Michael Esq NEGOTIATION97Asiya Javayant
1011Rodrigues R WhobreyBrazil2025-04-19Dorl, James J Esq PROPOSAL80Ivan Magalhaes
1012Rodrigues E OstroskyGermany2025-04-28Chemel, James L Cpa RENEWAL64Bernardo Dominic
1013Clifford O AmigonRussia2025-04-21Chapman, Ross E Esq QUALIFIED12Ivan Magalhaes
1014Ivar R IturbideGermany2025-04-16Chapman, Ross E Esq NEGOTIATION23Ivan Magalhaes
1015Maria H BriddickCanada2025-04-24Dorl, James J Esq QUALIFIED78Asiya Javayant
1016Emily I DoeBrazil2025-04-14Morlong Associates NEGOTIATION89Stephen Shaw
1017Jennifer E StockhamAustralia2025-05-07Buckley Miller Wright RENEWAL64Amy Elsner
1018Ashley E IturbideIndia2025-05-09King, Christopher A Esq RENEWAL86Amy Elsner
1019Aditya T SergiCanada2025-04-21Feiner Bros RENEWAL31Ivan Magalhaes
1020Greenwood T FollerGermany2025-05-04Printing Dimensions NEW1Xuxue Feng
1021Aditya X VenereFrance2025-04-29Rangoni Of Florence RENEWAL61Elwin Sharvill
1022Faith K MorascaCanada2025-04-26Commercial Press RENEWAL57Elwin Sharvill
1023Johnson Y CampainFrance2025-04-19Buckley Miller Wright QUALIFIED61Stephen Shaw
1024Silvio X CaudyAustralia2025-04-20Rangoni Of Florence QUALIFIED32Stephen Shaw
1025Johnson T MaletSpain2025-04-17Chapman, Ross E Esq RENEWAL72Asiya Javayant
1026Aditya I WaycottJapan2025-05-01Feiner Bros PROPOSAL94Xuxue Feng
1027Costa C CaldareraIndia2025-05-01Benton, John B Jr NEW29Asiya Javayant
1028Johnson M FlosiGermany2025-04-16Rangoni Of Florence NEGOTIATION45Bernardo Dominic
1029Juan Z GlickJapan2025-05-04Morlong Associates NEW17Xuxue Feng
1030Johnson O StensethFrance2025-05-02King, Christopher A Esq NEGOTIATION96Bernardo Dominic
1031James B FollerCanada2025-04-13Chemel, James L Cpa NEW77Anna Fali
1032Adams N MarrierFrance2025-05-03Dorl, James J Esq NEGOTIATION2Anna Fali
1033Ashley N VenereUnited Kingdom2025-05-07Feiner Bros QUALIFIED99Anna Fali
1034Nicolas I AmigonAustralia2025-04-25Buckley Miller Wright NEW65Bernardo Dominic
1035Ricardo T OstroskyGermany2025-04-15Rangoni Of Florence NEGOTIATION89Anna Fali
1036Isabel N RutaAustralia2025-04-21King, Christopher A Esq QUALIFIED94Anna Fali
1037Murillo X CaldareraIndia2025-04-17Truhlar And Truhlar Attys NEW48Xuxue Feng
1038Jennifer U NickaIndia2025-04-26Dorl, James J Esq PROPOSAL71Elwin Sharvill
1039Munro J InouyeUnited Kingdom2025-04-21Rousseaux, Michael Esq PROPOSAL9Stephen Shaw
1040Jefferson T CampainFrance2025-04-21Rousseaux, Michael Esq NEW40Xuxue Feng
1041Clifford P RulapaughItaly2025-05-10Morlong Associates QUALIFIED75Ivan Magalhaes
1042Maria J PaprockiAustralia2025-04-22Buckley Miller Wright UNQUALIFIED63Amy Elsner
1043Mayumi G GillianBrazil2025-05-05King, Christopher A Esq NEW41Xuxue Feng
1044Maisha R PaprockiAustralia2025-04-24Chemel, James L Cpa QUALIFIED48Ivan Magalhaes
1045Ivar L PerinCanada2025-04-12Morlong Associates PROPOSAL38Onyama Limba
1046Alejandro I MorascaAustralia2025-05-02Chapman, Ross E Esq NEW85Stephen Shaw
1047Kadeem F TollnerUnited Kingdom2025-05-04Dorl, James J Esq RENEWAL19Ioni Bowcher
1048Octavia G SlusarskiAustralia2025-04-30Morlong Associates NEW97Bernardo Dominic
1049Isabel X AmigonRussia2025-04-26Morlong Associates UNQUALIFIED68Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Ricardo E OstroskyBrazilAmy Elsner NEGOTIATION
Antonio U BologniaSpainXuxue Feng UNQUALIFIED
Jeanfrancois G AmigonIndiaOnyama Limba RENEWAL
Aika F KuskoSpainAnna Fali NEGOTIATION
Greenwood B DarakjyCanadaStephen Shaw PROPOSAL
Costa L BowleyGermanyXuxue Feng NEW
Deepesh J RutaFranceOnyama Limba NEW
Jeanfrancois R WhobreyArgentinaIoni Bowcher NEW
Alejandro A PoquetteJapanXuxue Feng RENEWAL
Rodrigues K ButtRussiaAsiya Javayant PROPOSAL
Isabel B KuskoFranceAnna Fali QUALIFIED
Jeanfrancois R MarrierItalyIvan Magalhaes NEGOTIATION
Maria W DilliardJapanXuxue Feng UNQUALIFIED
Silvio Z CaudyIndiaAsiya Javayant QUALIFIED
Kadeem B MacleadArgentinaAmy Elsner PROPOSAL
Izzy T AlbaresIndiaAsiya Javayant PROPOSAL
Darci G FerenczAustraliaElwin Sharvill UNQUALIFIED
Ivar Z BologniaArgentinaAmy Elsner QUALIFIED
Francesco L VocelkaAustraliaOnyama Limba NEGOTIATION
Isabel J KuskoJapanXuxue Feng PROPOSAL
Maisha X PerinArgentinaAsiya Javayant UNQUALIFIED
Darci Q VocelkaIndiaXuxue Feng PROPOSAL
David C SchemmerUnited KingdomIoni Bowcher NEGOTIATION
Emily I MacleadSpainOnyama Limba QUALIFIED
Arvin B OldroydSpainAmy Elsner UNQUALIFIED
Emily R RoysterFranceElwin Sharvill NEGOTIATION
Aditya P RulapaughItalyBernardo Dominic RENEWAL
Faith B OldroydArgentinaIvan Magalhaes UNQUALIFIED
Jennifer D MaletRussiaIvan Magalhaes RENEWAL
Izzy W OstroskyGermanyStephen Shaw NEGOTIATION
Kadeem I InouyeIndiaIoni Bowcher RENEWAL
Maria D FlosiCanadaAsiya Javayant RENEWAL
Smith E CaudyRussiaIvan Magalhaes PROPOSAL
Faith D FlosiCanadaStephen Shaw QUALIFIED
Julie P MorascaIndiaAmy Elsner QUALIFIED
Aruna K WhobreyRussiaXuxue Feng NEW
Smith R DoeGermanyBernardo Dominic RENEWAL
Jones D MaletCanadaStephen Shaw PROPOSAL
Izzy M OstroskyCanadaOnyama Limba QUALIFIED
Clifford N NickaAustraliaAmy Elsner NEGOTIATION
Rodrigues B SchemmerItalyIvan Magalhaes NEW
Murillo V VenereBrazilElwin Sharvill QUALIFIED
Maria U AmigonBrazilAmy Elsner RENEWAL
Kaitlin M StensethCanadaIoni Bowcher QUALIFIED
Nicolas Q AmigonAustraliaAsiya Javayant QUALIFIED
Ashley P RutaFranceXuxue Feng UNQUALIFIED
Cody G RulapaughSpainXuxue Feng NEGOTIATION
Munro U MacleadItalyOnyama Limba QUALIFIED
Sinclair D AmigonItalyOnyama Limba NEGOTIATION
Stacey H GarufiUnited KingdomIoni Bowcher QUALIFIED
Frozen Columns
Name
Nicolas W Stockham
Maisha I Campain
Cody G Iturbide
Jeanfrancois T Venere
Kadeem F Albares
Maria E Marrier
Ricardo M Saylors
Darci A Caudy
James C Saylors
Aruna P Malet
Isabel N Poquette
Francesco G Vocelka
Juan M Ostrosky
Johnson G Wieser
Mujtaba S Foller
Adams G Slusarski
Johnson D Perin
Kadeem P Gaucho
Arvin A Ruta
Alejandro W Schemmer
Greenwood G Butt
Adams X Venere
Francesco O Oldroyd
Ivar X Figeroa
Isabel A Ruta
James Z Garufi
Leja D Foller
Maria B Gaucho
Mayumi I Garufi
Kadeem T Paprocki
Maria Z Wieser
Stacey X Dilliard
Darci D Malet
Johnson J Vocelka
Clifford B Campain
Smith Z Nestle
Izzy B Wieser
Salvatore S Paprocki
Leon P Waycott
Faith A Stenseth
Jones S Bolognia
Ivar G Figeroa
Claire R Marrier
Ricardo I Bolognia
Faith W Waycott
Darci C Saylors
Faith T Foller
Sinclair E Venere
Arvin S Campain
Jeanfrancois D Kusko
IdCountryDate
1000France2025-05-02
1001France2025-04-20
1002Japan2025-04-29
1003Russia2025-04-12
1004Germany2025-04-20
1005France2025-04-14
1006Spain2025-04-20
1007Australia2025-04-13
1008Brazil2025-05-01
1009Germany2025-04-18
1010United Kingdom2025-05-01
1011Argentina2025-04-13
1012Australia2025-04-29
1013United Kingdom2025-04-17
1014Canada2025-04-17
1015Canada2025-05-01
1016Australia2025-04-22
1017France2025-04-27
1018Australia2025-04-14
1019Spain2025-05-06
1020Russia2025-04-14
1021Italy2025-05-04
1022Italy2025-05-08
1023Brazil2025-05-02
1024Brazil2025-04-23
1025Argentina2025-05-05
1026Argentina2025-04-26
1027Russia2025-04-25
1028Argentina2025-04-14
1029Spain2025-04-23
1030Italy2025-04-15
1031United Kingdom2025-04-18
1032Germany2025-05-11
1033Argentina2025-04-22
1034Brazil2025-04-24
1035Australia2025-05-06
1036Spain2025-04-16
1037Italy2025-05-10
1038Spain2025-05-03
1039France2025-04-28
1040Italy2025-04-26
1041Argentina2025-04-21
1042Argentina2025-05-03
1043Spain2025-04-21
1044Argentina2025-05-08
1045India2025-05-04
1046Germany2025-04-19
1047Spain2025-04-20
1048Brazil2025-04-21
1049Australia2025-04-26

On-Demand Data

NameIdCountryDate
Morrow N Rulapaugh1000Russia2025-04-17
Jones L Whobrey1001Argentina2025-05-01
Leja F Maclead1002Italy2025-05-06
Jefferson Y Iturbide1003Brazil2025-05-11
Rodrigues H Nestle1004Spain2025-04-29
Izzy O Sergi1005Japan2025-04-26
Mayumi V Shinko1006Brazil2025-04-22
Jones G Nestle1007India2025-04-17
Wickens B Venere1008Germany2025-04-19
Nicolas J Paprocki1009Argentina2025-04-18
Isabel M Venere1010Argentina2025-04-26
Sinclair L Wieser1011Canada2025-04-21
Jeanfrancois O Marrier1012Spain2025-05-07
Clifford Z Dilliard1013Argentina2025-04-16
Rodrigues M Saylors1014Australia2025-04-30
Faith L Ostrosky1015Argentina2025-04-20
Aditya X Albares1016Spain2025-04-17
Mayumi V Tollner1017Argentina2025-04-18
Tony X Poquette1018Canada2025-04-25
Jennifer N Stenseth1019India2025-04-27
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Francesco M PoquetteJapanElwin Sharvill UNQUALIFIED
Mayumi T ButtBrazilIvan Magalhaes PROPOSAL
Jones X FerenczAustraliaOnyama Limba PROPOSAL
Tony P PoquetteJapanIvan Magalhaes PROPOSAL
Misaki Y SaylorsUnited KingdomBernardo Dominic UNQUALIFIED
Aruna F FerenczSpainAnna Fali RENEWAL
Sinclair N BriddickBrazilStephen Shaw NEW
Mujtaba K CaldareraSpainIoni Bowcher NEGOTIATION
Aika I AlbaresUnited KingdomElwin Sharvill UNQUALIFIED
Rodrigues V OldroydArgentinaStephen Shaw NEW
Johnson W ShinkoIndiaBernardo Dominic UNQUALIFIED
James F DilliardJapanElwin Sharvill PROPOSAL
Emily R SaylorsCanadaAsiya Javayant NEW
Claire H MaletItalyElwin Sharvill UNQUALIFIED
Deepesh Y CaudyFranceStephen Shaw QUALIFIED
Greenwood C KolmetzFranceIoni Bowcher NEW
Aruna Q PoquetteItalyXuxue Feng PROPOSAL
Maria J NickaUnited KingdomStephen Shaw QUALIFIED
Tony R MorascaCanadaAnna Fali PROPOSAL
Jones L SlusarskiItalyXuxue Feng NEGOTIATION
Maria Z SergiSpainBernardo Dominic UNQUALIFIED
Costa N BowleyAustraliaElwin Sharvill UNQUALIFIED
Aruna D OldroydBrazilStephen Shaw QUALIFIED
Faith K OstroskyBrazilIoni Bowcher PROPOSAL
David X WieserArgentinaBernardo Dominic QUALIFIED
Munro T RutaSpainAsiya Javayant UNQUALIFIED
Adams B MorascaIndiaAnna Fali RENEWAL
Ashley H MarrierIndiaElwin Sharvill NEGOTIATION
Isabel D SaylorsArgentinaAsiya Javayant UNQUALIFIED
Morrow C RulapaughRussiaIvan Magalhaes RENEWAL
Mayumi F NestleAustraliaXuxue Feng QUALIFIED
James A GlickRussiaIvan Magalhaes RENEWAL
Smith M AmigonGermanyXuxue Feng PROPOSAL
Smith Q MaletSpainStephen Shaw RENEWAL
Munro J DarakjyRussiaOnyama Limba PROPOSAL
Juan P FollerJapanStephen Shaw RENEWAL
Sinclair J NestleFranceXuxue Feng PROPOSAL
Ivar Y RulapaughGermanyOnyama Limba NEGOTIATION
Juan L AmigonItalyBernardo Dominic QUALIFIED
David I MorascaJapanIoni Bowcher RENEWAL

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