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
Stacey O InouyeJapanIoni Bowcher RENEWAL
Rodrigues P WhobreyUnited KingdomAsiya Javayant QUALIFIED
Faith M StensethFranceAnna Fali QUALIFIED
Ricardo X SergiIndiaXuxue Feng UNQUALIFIED
Aruna K VenereArgentinaIoni Bowcher UNQUALIFIED
Johnson B GauchoUnited KingdomAnna Fali NEW
Claire S MaletFranceElwin Sharvill PROPOSAL
Sinclair U KuskoAustraliaBernardo Dominic RENEWAL
Francesco D DarakjyRussiaElwin Sharvill NEW
Silvio G GarufiUnited KingdomXuxue Feng RENEWAL
Juan Q FigeroaUnited KingdomAmy Elsner PROPOSAL
Izzy A MorascaAustraliaOnyama Limba RENEWAL
Deepesh J IturbideIndiaStephen Shaw PROPOSAL
Clifford V OstroskyBrazilOnyama Limba NEW
Izzy W MorascaJapanIoni Bowcher RENEWAL
Octavia W AlbaresRussiaAnna Fali PROPOSAL
Jefferson X SchemmerRussiaStephen Shaw QUALIFIED
Jones R InouyeIndiaBernardo Dominic NEGOTIATION
Adams H ShinkoArgentinaBernardo Dominic QUALIFIED
Jones V IturbideJapanStephen Shaw QUALIFIED
Adams N NickaArgentinaIvan Magalhaes QUALIFIED
Johnson Y GillianGermanyAmy Elsner NEGOTIATION
Octavia V OstroskyRussiaStephen Shaw RENEWAL
Faith F SlusarskiItalyIvan Magalhaes NEGOTIATION
Ivar S ChuiItalyXuxue Feng PROPOSAL
Alejandro L MacleadArgentinaAmy Elsner RENEWAL
Ricardo I OstroskyRussiaOnyama Limba RENEWAL
Aditya A OstroskyArgentinaAmy Elsner UNQUALIFIED
Kaitlin K AlbaresAustraliaBernardo Dominic UNQUALIFIED
Maisha B SchemmerSpainAsiya Javayant UNQUALIFIED
Murillo H IturbideRussiaIoni Bowcher RENEWAL
Alejandro R WieserIndiaAmy Elsner PROPOSAL
Maria N DilliardRussiaIoni Bowcher UNQUALIFIED
Jennifer Z GarufiAustraliaAsiya Javayant RENEWAL
Antonio X DoeArgentinaIvan Magalhaes QUALIFIED
Salvatore S DoeSpainIvan Magalhaes RENEWAL
Leon Q CampainBrazilStephen Shaw QUALIFIED
Sinclair V MarrierBrazilStephen Shaw QUALIFIED
Sinclair H WhobreyBrazilAmy Elsner RENEWAL
Antonio H CaldareraAustraliaIoni Bowcher NEGOTIATION
Johnson P BowleyCanadaElwin Sharvill UNQUALIFIED
Rodrigues T RimJapanStephen Shaw UNQUALIFIED
Claire M MaletArgentinaAnna Fali RENEWAL
Faith F ButtArgentinaStephen Shaw QUALIFIED
Jefferson G MarrierItalyBernardo Dominic QUALIFIED
Sinclair U VenereRussiaAsiya Javayant PROPOSAL
David J BowleyIndiaOnyama Limba NEW
Maisha P MaletSpainAnna Fali PROPOSAL
Deepesh V AmigonAustraliaIvan Magalhaes PROPOSAL
Rodrigues T GauchoAustraliaElwin Sharvill NEW
Horizontal
NameCountryRepresentativeStatus
Ivar R RimAustraliaAmy Elsner NEW
Nicolas S RutaJapanIoni Bowcher PROPOSAL
Morrow M DarakjyItalyElwin Sharvill PROPOSAL
Smith K DoeArgentinaAmy Elsner RENEWAL
Sinclair U NickaSpainAsiya Javayant PROPOSAL
Claire S DoeUnited KingdomStephen Shaw NEW
Silvio A GillianUnited KingdomIoni Bowcher PROPOSAL
Julie O AmigonCanadaAsiya Javayant UNQUALIFIED
Julie Y NestleItalyOnyama Limba NEGOTIATION
Nicolas W MacleadGermanyBernardo Dominic PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Mujtaba M WhobreyArgentina2025-06-01Commercial Press NEGOTIATION98Anna Fali
1001Cody I RulapaughGermany2025-06-12Chanay, Jeffrey A Esq QUALIFIED34Asiya Javayant
1002Jeanfrancois T FerenczGermany2025-06-12Chanay, Jeffrey A Esq NEW49Elwin Sharvill
1003Maisha H MaletItaly2025-05-24Truhlar And Truhlar Attys NEGOTIATION65Amy Elsner
1004Jones P WaycottIndia2025-05-30Commercial Press NEGOTIATION15Stephen Shaw
1005Clifford K WaycottUnited Kingdom2025-06-12Feiner Bros NEGOTIATION76Elwin Sharvill
1006Francesco S WhobreyBrazil2025-05-24Printing Dimensions NEW70Elwin Sharvill
1007Maisha A PerinJapan2025-05-31Dorl, James J Esq PROPOSAL90Anna Fali
1008Smith G DoeUnited Kingdom2025-06-16Chapman, Ross E Esq PROPOSAL47Xuxue Feng
1009Adams S IturbideAustralia2025-06-04Feiner Bros PROPOSAL28Stephen Shaw
1010Costa X KolmetzCanada2025-06-11Feiner Bros PROPOSAL13Ivan Magalhaes
1011Leja N CaudyBrazil2025-05-19Rousseaux, Michael Esq QUALIFIED70Ivan Magalhaes
1012Misaki J AlbaresIndia2025-06-12Commercial Press PROPOSAL31Bernardo Dominic
1013Emily F DilliardItaly2025-06-10Buckley Miller Wright NEGOTIATION74Onyama Limba
1014Aika X AlbaresBrazil2025-06-11Dorl, James J Esq NEGOTIATION35Anna Fali
1015Ivar F OldroydIndia2025-05-31Feltz Printing Service UNQUALIFIED40Elwin Sharvill
1016Misaki Q BowleySpain2025-05-31Rousseaux, Michael Esq NEGOTIATION11Amy Elsner
1017Costa B SergiAustralia2025-05-30Truhlar And Truhlar Attys RENEWAL15Onyama Limba
1018Smith I PerinArgentina2025-05-25Chemel, James L Cpa NEGOTIATION99Elwin Sharvill
1019Morrow E AlbaresUnited Kingdom2025-05-31Benton, John B Jr RENEWAL24Xuxue Feng
1020Johnson P MaletSpain2025-06-06Buckley Miller Wright QUALIFIED48Stephen Shaw
1021Adams X BowleyAustralia2025-06-01Buckley Miller Wright PROPOSAL9Anna Fali
1022Costa V IturbideIndia2025-05-31Chemel, James L Cpa NEW24Onyama Limba
1023Greenwood G FollerCanada2025-06-15Printing Dimensions QUALIFIED84Stephen Shaw
1024Morrow U AmigonIndia2025-06-15Rangoni Of Florence NEW11Amy Elsner
1025Isabel B ButtCanada2025-05-30Truhlar And Truhlar Attys RENEWAL65Anna Fali
1026Silvio X RimGermany2025-05-26King, Christopher A Esq UNQUALIFIED11Ivan Magalhaes
1027Misaki E MacleadFrance2025-05-26Chanay, Jeffrey A Esq RENEWAL22Stephen Shaw
1028Mujtaba I VenereRussia2025-05-24Feiner Bros QUALIFIED43Amy Elsner
1029Faith F FlosiCanada2025-06-02Feltz Printing Service NEW54Elwin Sharvill
1030Chavez U DarakjyUnited Kingdom2025-06-03Rangoni Of Florence QUALIFIED90Anna Fali
1031Jennifer R InouyeAustralia2025-06-11King, Christopher A Esq RENEWAL50Stephen Shaw
1032Munro S PaprockiGermany2025-05-25Printing Dimensions NEW56Elwin Sharvill
1033Sinclair M WieserFrance2025-06-08Truhlar And Truhlar Attys RENEWAL50Amy Elsner
1034Darci D NickaFrance2025-05-21Rousseaux, Michael Esq RENEWAL11Onyama Limba
1035Silvio S FlosiItaly2025-06-14Commercial Press UNQUALIFIED30Onyama Limba
1036Sinclair R VocelkaArgentina2025-05-25Chanay, Jeffrey A Esq QUALIFIED96Ivan Magalhaes
1037Aruna U DoeIndia2025-06-05Morlong Associates UNQUALIFIED73Ioni Bowcher
1038Deepesh K SaylorsRussia2025-05-26Chemel, James L Cpa PROPOSAL71Anna Fali
1039Kaitlin S DilliardGermany2025-06-11Rangoni Of Florence NEGOTIATION34Ivan Magalhaes
1040Claire G FollerIndia2025-06-01Feltz Printing Service QUALIFIED44Xuxue Feng
1041Salvatore C MaletAustralia2025-06-11Truhlar And Truhlar Attys PROPOSAL83Ioni Bowcher
1042Francesco G RulapaughGermany2025-05-28Feiner Bros NEW86Amy Elsner
1043Emily R RutaBrazil2025-06-12Rangoni Of Florence RENEWAL86Elwin Sharvill
1044Silvio U GillianGermany2025-05-28Rousseaux, Michael Esq QUALIFIED36Stephen Shaw
1045Sinclair I FollerSpain2025-06-12Buckley Miller Wright UNQUALIFIED90Xuxue Feng
1046Costa V SergiSpain2025-05-24King, Christopher A Esq PROPOSAL39Bernardo Dominic
1047David H WhobreyBrazil2025-06-07King, Christopher A Esq UNQUALIFIED65Elwin Sharvill
1048Munro E RimBrazil2025-05-20Chanay, Jeffrey A Esq NEGOTIATION24Bernardo Dominic
1049Leja A CaldareraCanada2025-05-27Dorl, James J Esq NEW50Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Kaitlin A DarakjyCanadaElwin Sharvill RENEWAL
Morrow B AlbaresSpainOnyama Limba PROPOSAL
Alejandro R BologniaRussiaAmy Elsner NEGOTIATION
Deepesh C NickaBrazilAnna Fali QUALIFIED
Smith L RimRussiaElwin Sharvill PROPOSAL
Julie D MorascaBrazilStephen Shaw NEGOTIATION
Isabel A DarakjyUnited KingdomXuxue Feng NEW
James M StockhamIndiaAnna Fali QUALIFIED
Nicolas U FollerArgentinaAnna Fali RENEWAL
Clifford X MaletJapanXuxue Feng RENEWAL
Maria X FollerAustraliaAsiya Javayant NEW
Jennifer H ShinkoAustraliaOnyama Limba RENEWAL
Munro E FigeroaItalyOnyama Limba RENEWAL
Smith R DoeAustraliaElwin Sharvill NEW
Chavez B BowleyJapanXuxue Feng RENEWAL
Greenwood V MarrierCanadaIoni Bowcher RENEWAL
Aika E GarufiItalyAmy Elsner RENEWAL
Aditya S PoquetteBrazilAnna Fali PROPOSAL
Julie N PoquetteFranceAnna Fali QUALIFIED
Octavia B RoysterGermanyStephen Shaw NEW
Aika V IturbideJapanStephen Shaw NEGOTIATION
Darci E IturbideGermanyAnna Fali PROPOSAL
Kaitlin F GlickItalyStephen Shaw RENEWAL
Octavia Y AlbaresRussiaStephen Shaw UNQUALIFIED
Munro J OldroydUnited KingdomIvan Magalhaes NEGOTIATION
Silvio E MaletJapanOnyama Limba NEW
Chavez C CaudyJapanAsiya Javayant PROPOSAL
Isabel U PerinUnited KingdomElwin Sharvill RENEWAL
Maisha J InouyeJapanBernardo Dominic QUALIFIED
Misaki F FollerUnited KingdomAsiya Javayant QUALIFIED
Jones A PerinGermanyAsiya Javayant UNQUALIFIED
Mujtaba G KuskoFranceAsiya Javayant NEGOTIATION
Octavia L AlbaresCanadaAnna Fali NEGOTIATION
Stacey J FerenczAustraliaStephen Shaw NEW
Antonio V WaycottArgentinaIvan Magalhaes RENEWAL
Chavez H VenereRussiaIvan Magalhaes NEW
Cody U FollerIndiaAsiya Javayant NEGOTIATION
Clifford N BologniaGermanyIvan Magalhaes UNQUALIFIED
Francesco R KolmetzAustraliaXuxue Feng NEW
Octavia N DilliardRussiaAmy Elsner UNQUALIFIED
Ivar P NestleGermanyAsiya Javayant PROPOSAL
James S BriddickBrazilOnyama Limba NEGOTIATION
Kadeem Z StockhamArgentinaAsiya Javayant NEGOTIATION
Aika X PoquetteAustraliaXuxue Feng NEW
Aditya A VocelkaRussiaBernardo Dominic UNQUALIFIED
Ashley Q BriddickCanadaAsiya Javayant NEW
Greenwood P FigeroaCanadaOnyama Limba UNQUALIFIED
Smith R AmigonGermanyAnna Fali RENEWAL
Salvatore Q MorascaItalyOnyama Limba PROPOSAL
Smith R WieserAustraliaAsiya Javayant RENEWAL
Frozen Columns
Name
Maisha Y Shinko
Octavia Q Wieser
Jones P Doe
Greenwood W Kolmetz
Greenwood Z Nicka
Juan W Oldroyd
Mujtaba Z Perin
Adams O Amigon
Arvin Y Iturbide
Sinclair C Doe
Morrow A Figeroa
Jennifer D Morasca
Leon H Malet
Smith R Malet
James D Oldroyd
Misaki P Poquette
Aika F Ostrosky
Julie F Whobrey
Morrow G Malet
Wickens H Chui
Deepesh I Flosi
Jeanfrancois K Flosi
James E Vocelka
Octavia I Doe
Ashley V Waycott
Smith N Morasca
Silvio S Whobrey
Jefferson A Tollner
Aditya R Briddick
Aruna O Malet
Alejandro F Garufi
Nicolas U Malet
Clifford Q Marrier
Maria X Venere
Mayumi T Flosi
Faith K Whobrey
Clifford K Ostrosky
Jefferson I Poquette
Tony U Iturbide
Sinclair Y Tollner
Leja M Paprocki
Ashley O Sergi
Mayumi I Garufi
Murillo B Saylors
Mujtaba I Doe
Emily J Whobrey
Kaitlin A Chui
Francesco A Venere
Smith E Sergi
Alejandro E Figeroa
IdCountryDate
1000Italy2025-05-18
1001Japan2025-05-25
1002India2025-06-08
1003Italy2025-06-01
1004Australia2025-06-10
1005Germany2025-05-26
1006Argentina2025-05-30
1007Italy2025-06-01
1008Canada2025-05-24
1009Germany2025-05-26
1010Spain2025-05-31
1011Spain2025-06-12
1012Argentina2025-05-23
1013Italy2025-05-25
1014Argentina2025-06-08
1015Brazil2025-06-08
1016Germany2025-06-11
1017India2025-06-10
1018Argentina2025-06-06
1019Spain2025-06-14
1020Italy2025-05-29
1021Russia2025-06-15
1022France2025-06-12
1023Brazil2025-05-28
1024Russia2025-06-05
1025Canada2025-06-02
1026Canada2025-05-31
1027Germany2025-05-28
1028Italy2025-06-05
1029Italy2025-05-24
1030India2025-06-09
1031Italy2025-05-22
1032Brazil2025-05-18
1033Brazil2025-06-01
1034Germany2025-06-02
1035Australia2025-05-22
1036India2025-05-28
1037Canada2025-05-18
1038United Kingdom2025-05-20
1039Brazil2025-06-01
1040Argentina2025-06-02
1041Italy2025-05-25
1042United Kingdom2025-06-03
1043Italy2025-06-10
1044Italy2025-06-06
1045Australia2025-05-22
1046Germany2025-05-25
1047Italy2025-05-29
1048Australia2025-06-05
1049Argentina2025-06-15

On-Demand Data

NameIdCountryDate
Aruna K Bowley1000France2025-06-12
Jones C Nestle1001Argentina2025-06-13
Stacey V Oldroyd1002Brazil2025-05-18
Munro F Gillian1003Japan2025-06-14
Claire M Dilliard1004Spain2025-05-29
Johnson N Albares1005Germany2025-05-21
Ricardo E Shinko1006Brazil2025-05-20
Jefferson U Wieser1007France2025-06-12
Arvin U Rim1008Japan2025-06-02
Leon S Slusarski1009Canada2025-06-04
Emily U Ostrosky1010United Kingdom2025-06-16
Octavia Q Albares1011Australia2025-05-29
Mayumi E Shinko1012Russia2025-05-23
Emily G Perin1013Italy2025-06-15
Wickens Y Rim1014Japan2025-06-11
Deepesh O Oldroyd1015Australia2025-05-19
Morrow N Marrier1016Brazil2025-06-15
Antonio W Iturbide1017Italy2025-05-26
Alejandro T Ruta1018Germany2025-05-31
James M Ostrosky1019Spain2025-06-12
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Alejandro A PoquetteGermanyAmy Elsner RENEWAL
Mayumi J GillianBrazilBernardo Dominic PROPOSAL
Murillo G FollerCanadaAmy Elsner QUALIFIED
Aditya P WhobreyRussiaIvan Magalhaes NEW
Cody N WaycottFranceAnna Fali PROPOSAL
Ashley Z DarakjySpainXuxue Feng PROPOSAL
Kadeem W AlbaresIndiaOnyama Limba PROPOSAL
Silvio Q FollerSpainIvan Magalhaes UNQUALIFIED
Mayumi E SchemmerSpainIoni Bowcher QUALIFIED
Deepesh B ChuiSpainElwin Sharvill PROPOSAL
Julie A NickaJapanBernardo Dominic QUALIFIED
Tony J BriddickIndiaOnyama Limba UNQUALIFIED
David A OldroydArgentinaBernardo Dominic QUALIFIED
Jones Y WhobreyGermanyElwin Sharvill QUALIFIED
Julie D WhobreyRussiaStephen Shaw QUALIFIED
Wickens M VocelkaRussiaElwin Sharvill RENEWAL
Wickens L MaletBrazilOnyama Limba QUALIFIED
Aditya X CaudySpainAmy Elsner UNQUALIFIED
Costa F BriddickSpainOnyama Limba PROPOSAL
Morrow A MarrierRussiaIvan Magalhaes UNQUALIFIED
Tony D GlickAustraliaBernardo Dominic PROPOSAL
Claire L VocelkaAustraliaElwin Sharvill PROPOSAL
Silvio D MaletItalyIvan Magalhaes PROPOSAL
Johnson I VocelkaUnited KingdomXuxue Feng RENEWAL
Jeanfrancois R SlusarskiFranceXuxue Feng PROPOSAL
Leon Q StensethItalyStephen Shaw RENEWAL
Jefferson T InouyeSpainElwin Sharvill PROPOSAL
Kaitlin B BriddickCanadaAmy Elsner NEW
Antonio A SlusarskiFranceIoni Bowcher PROPOSAL
Wickens E IturbideSpainAsiya Javayant UNQUALIFIED
Munro A FlosiIndiaElwin Sharvill NEGOTIATION
Rodrigues V NickaArgentinaIvan Magalhaes PROPOSAL
Leon F FlosiSpainBernardo Dominic PROPOSAL
Mayumi J GauchoSpainAmy Elsner RENEWAL
Aruna S PoquetteCanadaAsiya Javayant RENEWAL
Aditya F MorascaAustraliaBernardo Dominic PROPOSAL
Isabel M StockhamSpainAmy Elsner RENEWAL
Faith E StockhamJapanAnna Fali PROPOSAL
Cody U OldroydItalyXuxue Feng NEGOTIATION
Chavez W PaprockiItalyElwin Sharvill QUALIFIED

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