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
Maria S MorascaJapanAmy Elsner QUALIFIED
Stacey F GillianUnited KingdomBernardo Dominic UNQUALIFIED
Smith T VocelkaItalyIoni Bowcher UNQUALIFIED
Leja T GarufiRussiaStephen Shaw QUALIFIED
Julie U ChuiItalyElwin Sharvill NEGOTIATION
Julie X ChuiItalyAsiya Javayant PROPOSAL
Wickens R StensethCanadaIvan Magalhaes QUALIFIED
Maria J IturbideFranceAsiya Javayant QUALIFIED
Smith U BriddickSpainIvan Magalhaes PROPOSAL
James Z PerinAustraliaElwin Sharvill RENEWAL
Antonio U GarufiCanadaOnyama Limba RENEWAL
Jennifer K AlbaresCanadaBernardo Dominic NEGOTIATION
Francesco A AmigonFranceIvan Magalhaes RENEWAL
Aditya O FollerCanadaAsiya Javayant NEW
Leon S TollnerBrazilOnyama Limba RENEWAL
Nicolas B BowleyJapanIoni Bowcher NEGOTIATION
Aruna X AlbaresIndiaOnyama Limba QUALIFIED
Morrow C MaletJapanIoni Bowcher QUALIFIED
Darci C SlusarskiJapanXuxue Feng RENEWAL
Salvatore R ButtJapanAnna Fali PROPOSAL
Arvin R CampainSpainXuxue Feng UNQUALIFIED
Claire P FollerJapanBernardo Dominic UNQUALIFIED
Julie G AlbaresCanadaStephen Shaw UNQUALIFIED
Antonio M PaprockiArgentinaAmy Elsner PROPOSAL
Jones J DilliardBrazilBernardo Dominic RENEWAL
Morrow G BowleyCanadaAmy Elsner NEGOTIATION
Costa H ChuiItalyIvan Magalhaes UNQUALIFIED
Smith C ShinkoSpainAnna Fali NEW
Rodrigues B FlosiIndiaBernardo Dominic QUALIFIED
Aruna Z VenereIndiaAsiya Javayant UNQUALIFIED
James Q AmigonJapanStephen Shaw NEGOTIATION
Sinclair Z KuskoFranceAmy Elsner UNQUALIFIED
Jones T GlickJapanXuxue Feng PROPOSAL
Antonio G RimFranceOnyama Limba PROPOSAL
Jefferson W SlusarskiAustraliaAmy Elsner PROPOSAL
Smith J NickaFranceAsiya Javayant RENEWAL
Cody J OstroskyUnited KingdomAsiya Javayant QUALIFIED
Stacey K InouyeBrazilBernardo Dominic UNQUALIFIED
Julie A CampainJapanIvan Magalhaes PROPOSAL
Juan Q SchemmerIndiaIvan Magalhaes PROPOSAL
Tony T DarakjyArgentinaXuxue Feng NEW
Jennifer F NickaSpainOnyama Limba UNQUALIFIED
Jefferson E FerenczJapanAnna Fali UNQUALIFIED
Salvatore Q CampainRussiaStephen Shaw NEW
Wickens R WieserCanadaOnyama Limba QUALIFIED
Mayumi Y NestleRussiaIoni Bowcher NEGOTIATION
Arvin X MaletGermanyAmy Elsner NEGOTIATION
Jennifer E GarufiJapanIoni Bowcher RENEWAL
Jones E OstroskyItalyAmy Elsner RENEWAL
Aruna S OstroskySpainBernardo Dominic UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Mujtaba N ButtRussiaAsiya Javayant UNQUALIFIED
Sinclair J CaudyIndiaAsiya Javayant PROPOSAL
Misaki B PerinRussiaOnyama Limba PROPOSAL
Misaki Y ShinkoAustraliaAsiya Javayant NEW
Ivar O FollerJapanOnyama Limba NEW
Jefferson N CaldareraAustraliaElwin Sharvill NEGOTIATION
Francesco M ButtFranceStephen Shaw RENEWAL
Jeanfrancois Z CaldareraGermanyBernardo Dominic PROPOSAL
Emily R StensethItalyIvan Magalhaes UNQUALIFIED
Octavia R FollerUnited KingdomXuxue Feng NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Ivar S CampainCanada2025-05-05Feiner Bros NEW49Ivan Magalhaes
1001David C IturbideBrazil2025-04-17Morlong Associates UNQUALIFIED14Xuxue Feng
1002Ricardo C VocelkaGermany2025-05-08Commercial Press RENEWAL59Anna Fali
1003Julie I IturbideIndia2025-04-23Rangoni Of Florence PROPOSAL12Ivan Magalhaes
1004Leja K DoeBrazil2025-04-13Chapman, Ross E Esq RENEWAL37Xuxue Feng
1005Isabel E ButtBrazil2025-04-28Feiner Bros NEGOTIATION69Xuxue Feng
1006Kadeem K RutaJapan2025-04-12Rangoni Of Florence RENEWAL82Ioni Bowcher
1007Arvin S OstroskyUnited Kingdom2025-04-26Chanay, Jeffrey A Esq UNQUALIFIED66Amy Elsner
1008Sinclair O WaycottItaly2025-05-08Commercial Press PROPOSAL14Elwin Sharvill
1009Morrow L ChuiCanada2025-04-22Feltz Printing Service NEGOTIATION3Elwin Sharvill
1010Ricardo R MacleadIndia2025-04-13Dorl, James J Esq QUALIFIED89Onyama Limba
1011Rodrigues X MaletCanada2025-04-24Benton, John B Jr PROPOSAL29Onyama Limba
1012Leja P DoeBrazil2025-04-30Feiner Bros RENEWAL8Ivan Magalhaes
1013Octavia Z BriddickUnited Kingdom2025-05-06Chanay, Jeffrey A Esq PROPOSAL87Asiya Javayant
1014Stacey J KuskoSpain2025-05-07Commercial Press NEW97Elwin Sharvill
1015Darci Z BowleyFrance2025-04-10Benton, John B Jr NEGOTIATION95Xuxue Feng
1016Mayumi W TollnerJapan2025-04-26Chapman, Ross E Esq QUALIFIED74Stephen Shaw
1017Maisha B NestleArgentina2025-04-09Dorl, James J Esq QUALIFIED47Anna Fali
1018Mujtaba L GlickRussia2025-05-05Feiner Bros RENEWAL19Elwin Sharvill
1019Silvio V InouyeItaly2025-04-29Rangoni Of Florence NEGOTIATION42Anna Fali
1020Izzy D FollerFrance2025-05-07Rousseaux, Michael Esq QUALIFIED97Ivan Magalhaes
1021Greenwood C StockhamSpain2025-04-18Chemel, James L Cpa RENEWAL58Asiya Javayant
1022Cody B DilliardSpain2025-05-07Chemel, James L Cpa NEGOTIATION52Asiya Javayant
1023Alejandro D SergiItaly2025-04-19Chemel, James L Cpa UNQUALIFIED73Stephen Shaw
1024Nicolas S SergiUnited Kingdom2025-04-27Chanay, Jeffrey A Esq NEGOTIATION76Xuxue Feng
1025Arvin E OldroydSpain2025-04-29Dorl, James J Esq NEGOTIATION52Elwin Sharvill
1026Sinclair D OldroydSpain2025-04-26Morlong Associates UNQUALIFIED97Ivan Magalhaes
1027Maisha X FlosiFrance2025-04-23Feltz Printing Service NEGOTIATION46Ivan Magalhaes
1028Wickens D WieserArgentina2025-05-06Commercial Press QUALIFIED76Asiya Javayant
1029Clifford L OstroskyBrazil2025-04-16Rangoni Of Florence RENEWAL19Stephen Shaw
1030Smith Y GauchoCanada2025-05-02Benton, John B Jr QUALIFIED87Elwin Sharvill
1031Murillo D DilliardAustralia2025-04-14Feltz Printing Service QUALIFIED27Ioni Bowcher
1032Maria B MorascaRussia2025-04-17Chapman, Ross E Esq RENEWAL98Amy Elsner
1033Murillo E MaletIndia2025-04-28Commercial Press UNQUALIFIED64Amy Elsner
1034Julie W DilliardCanada2025-05-07Chanay, Jeffrey A Esq NEW83Onyama Limba
1035Arvin U ChuiFrance2025-05-01Rangoni Of Florence NEGOTIATION81Ivan Magalhaes
1036Mayumi I MacleadAustralia2025-04-15Chanay, Jeffrey A Esq UNQUALIFIED60Onyama Limba
1037Stacey S GlickIndia2025-04-30Dorl, James J Esq PROPOSAL86Stephen Shaw
1038Deepesh C AmigonFrance2025-04-29Chemel, James L Cpa QUALIFIED70Amy Elsner
1039Francesco E KolmetzSpain2025-04-14Dorl, James J Esq PROPOSAL94Ioni Bowcher
1040Tony L ShinkoBrazil2025-04-14Benton, John B Jr NEW11Ioni Bowcher
1041Costa Q SaylorsBrazil2025-04-27Morlong Associates NEGOTIATION14Amy Elsner
1042Octavia P PerinCanada2025-04-20Rousseaux, Michael Esq RENEWAL61Elwin Sharvill
1043Costa X ShinkoRussia2025-04-10Chanay, Jeffrey A Esq NEGOTIATION64Ivan Magalhaes
1044Murillo J MorascaCanada2025-04-14Feiner Bros RENEWAL67Ivan Magalhaes
1045James M FlosiGermany2025-04-17Buckley Miller Wright RENEWAL26Xuxue Feng
1046Clifford Z NickaArgentina2025-04-29Dorl, James J Esq NEGOTIATION95Anna Fali
1047Aika L RoysterSpain2025-04-20Printing Dimensions RENEWAL5Elwin Sharvill
1048Kadeem W CaldareraFrance2025-04-16Printing Dimensions RENEWAL83Stephen Shaw
1049Jennifer L FlosiAustralia2025-04-30Morlong Associates UNQUALIFIED8Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Chavez Q DoeRussiaStephen Shaw RENEWAL
Jefferson K FlosiIndiaBernardo Dominic RENEWAL
Murillo H RoysterJapanXuxue Feng NEW
Cody G CampainJapanAsiya Javayant UNQUALIFIED
Smith O RoysterBrazilStephen Shaw NEGOTIATION
Maria Y NickaFranceAmy Elsner PROPOSAL
Rodrigues T DarakjyItalyAsiya Javayant PROPOSAL
Johnson H AmigonItalyIvan Magalhaes UNQUALIFIED
David Y MorascaGermanyIvan Magalhaes UNQUALIFIED
Alejandro P WieserGermanyAnna Fali QUALIFIED
Jones U StensethJapanXuxue Feng PROPOSAL
Jennifer T DarakjySpainStephen Shaw QUALIFIED
Jennifer N MacleadBrazilElwin Sharvill NEW
Izzy U FerenczItalyAmy Elsner PROPOSAL
Antonio H FlosiRussiaStephen Shaw QUALIFIED
Aika T ShinkoItalyStephen Shaw QUALIFIED
Johnson P MarrierJapanIvan Magalhaes UNQUALIFIED
Munro K CampainIndiaElwin Sharvill UNQUALIFIED
Cody D AmigonCanadaStephen Shaw NEGOTIATION
Salvatore I CaldareraBrazilAmy Elsner NEGOTIATION
Rodrigues K ShinkoRussiaStephen Shaw UNQUALIFIED
David G GauchoJapanElwin Sharvill QUALIFIED
Misaki J OldroydBrazilAmy Elsner UNQUALIFIED
Francesco L SlusarskiFranceXuxue Feng QUALIFIED
Johnson J NickaItalyBernardo Dominic RENEWAL
Kadeem E DoeIndiaBernardo Dominic PROPOSAL
Kaitlin E MarrierJapanAmy Elsner PROPOSAL
Emily U OstroskyBrazilAnna Fali UNQUALIFIED
Antonio L GauchoFranceStephen Shaw RENEWAL
Sinclair P BowleyRussiaAmy Elsner RENEWAL
Claire J NestleIndiaOnyama Limba NEGOTIATION
Stacey R OldroydJapanAsiya Javayant QUALIFIED
Maisha S MarrierBrazilAmy Elsner PROPOSAL
Jones R StockhamJapanIvan Magalhaes NEW
Mujtaba C SergiGermanyAsiya Javayant UNQUALIFIED
Faith N KolmetzCanadaXuxue Feng NEW
Izzy M StockhamFranceStephen Shaw RENEWAL
Cody G OstroskyIndiaAnna Fali RENEWAL
Morrow K RutaJapanAmy Elsner RENEWAL
Ashley V StockhamAustraliaElwin Sharvill RENEWAL
Antonio C RutaCanadaAsiya Javayant RENEWAL
Tony V RulapaughAustraliaAnna Fali RENEWAL
Rodrigues G WieserArgentinaIoni Bowcher UNQUALIFIED
Greenwood N DilliardArgentinaAnna Fali UNQUALIFIED
Wickens L BologniaBrazilOnyama Limba RENEWAL
Jefferson J VocelkaAustraliaBernardo Dominic QUALIFIED
Francesco J AmigonBrazilOnyama Limba QUALIFIED
Jennifer A FerenczUnited KingdomAsiya Javayant UNQUALIFIED
Jefferson T MaletAustraliaAmy Elsner UNQUALIFIED
Jennifer U SlusarskiSpainStephen Shaw RENEWAL
Frozen Columns
Name
Costa I Whobrey
Jefferson L Ruta
Ivar U Darakjy
Sinclair R Oldroyd
Darci N Oldroyd
Arvin Y Flosi
Maisha O Ruta
Costa Z Gillian
Aika E Doe
Wickens A Gillian
Chavez P Shinko
Ivar C Campain
Maisha O Slusarski
Jeanfrancois Q Perin
Deepesh X Marrier
Arvin C Wieser
Munro K Albares
Cody K Nicka
Leon U Morasca
Alejandro X Rim
Ricardo F Maclead
Nicolas Q Venere
Greenwood S Ferencz
Jones F Rim
Ivar G Darakjy
Francesco N Morasca
Julie U Waycott
Cody G Figeroa
Juan M Malet
Jones Z Bowley
Leon R Albares
Mujtaba C Doe
Adams B Venere
Cody C Figeroa
Izzy X Ostrosky
Leon V Rim
Wickens O Gaucho
Silvio M Poquette
Ivar X Stenseth
Leja S Nestle
Ricardo N Maclead
Isabel H Sergi
Ivar H Chui
Emily H Ruta
Sinclair H Glick
Kadeem D Paprocki
Ivar Y Stockham
Nicolas U Darakjy
Rodrigues T Amigon
Munro A Dilliard
IdCountryDate
1000Australia2025-04-30
1001Spain2025-04-16
1002India2025-05-07
1003Spain2025-05-04
1004Canada2025-04-21
1005Italy2025-04-20
1006Germany2025-04-27
1007India2025-04-13
1008Italy2025-04-28
1009Canada2025-05-03
1010Italy2025-05-03
1011Spain2025-04-21
1012Argentina2025-04-19
1013Argentina2025-04-23
1014Russia2025-04-16
1015Russia2025-04-24
1016Brazil2025-04-27
1017Spain2025-04-16
1018Australia2025-04-13
1019Russia2025-04-30
1020Russia2025-04-26
1021Argentina2025-04-20
1022France2025-05-01
1023Brazil2025-04-25
1024Australia2025-05-02
1025Germany2025-04-18
1026Spain2025-04-25
1027Italy2025-05-06
1028Spain2025-05-04
1029India2025-04-26
1030Canada2025-05-01
1031Argentina2025-04-18
1032Japan2025-04-26
1033Canada2025-04-22
1034Germany2025-05-08
1035Argentina2025-05-03
1036India2025-04-12
1037Italy2025-04-29
1038Germany2025-04-28
1039France2025-04-12
1040Spain2025-04-14
1041India2025-04-27
1042Italy2025-05-07
1043United Kingdom2025-04-15
1044Italy2025-05-05
1045Spain2025-04-20
1046Spain2025-04-30
1047Japan2025-05-05
1048Brazil2025-04-12
1049Russia2025-04-11

On-Demand Data

NameIdCountryDate
Aika F Oldroyd1000France2025-04-27
Darci Y Gaucho1001Australia2025-05-08
Jefferson H Paprocki1002Canada2025-05-04
Deepesh A Briddick1003United Kingdom2025-04-21
Morrow R Morasca1004Italy2025-04-24
Arvin Z Bowley1005Argentina2025-04-24
Faith U Foller1006Italy2025-04-12
Emily X Chui1007United Kingdom2025-04-20
Sinclair O Dilliard1008Brazil2025-04-26
Cody E Briddick1009Russia2025-04-20
Deepesh O Saylors1010Japan2025-04-09
Rodrigues W Stenseth1011Brazil2025-04-29
Kadeem A Shinko1012Spain2025-04-16
Salvatore L Glick1013Russia2025-05-07
Julie D Vocelka1014Canada2025-05-06
Izzy I Marrier1015France2025-04-22
Francesco B Saylors1016United Kingdom2025-04-14
Francesco B Campain1017Germany2025-05-01
Mayumi Y Darakjy1018Australia2025-04-25
Greenwood Y Doe1019Australia2025-04-28
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aruna L OldroydCanadaAnna Fali NEW
Nicolas W WieserAustraliaIoni Bowcher UNQUALIFIED
Munro Z BowleyIndiaAsiya Javayant NEW
Jones C GauchoUnited KingdomAsiya Javayant NEW
Ricardo D NestleIndiaIoni Bowcher NEGOTIATION
Mujtaba I DilliardFranceXuxue Feng RENEWAL
Tony H FollerCanadaBernardo Dominic PROPOSAL
Adams I OldroydFranceBernardo Dominic UNQUALIFIED
Faith D OstroskyJapanAmy Elsner RENEWAL
Aditya N GauchoSpainAmy Elsner PROPOSAL
Izzy G BowleyGermanyBernardo Dominic NEW
Francesco C OldroydGermanyBernardo Dominic NEGOTIATION
Emily P WhobreyItalyBernardo Dominic QUALIFIED
Alejandro B StensethIndiaIoni Bowcher PROPOSAL
Jefferson G GarufiIndiaStephen Shaw NEGOTIATION
Aruna H GauchoJapanXuxue Feng NEGOTIATION
Izzy X PerinItalyOnyama Limba PROPOSAL
Maria D RutaRussiaIvan Magalhaes PROPOSAL
Leon M SchemmerRussiaAnna Fali UNQUALIFIED
Jones R FlosiRussiaBernardo Dominic QUALIFIED
Aditya G RimIndiaIvan Magalhaes NEW
Misaki A RulapaughBrazilAmy Elsner NEGOTIATION
Octavia I PoquetteArgentinaIvan Magalhaes QUALIFIED
Morrow N NickaIndiaAmy Elsner UNQUALIFIED
Aika D OldroydIndiaAsiya Javayant UNQUALIFIED
Izzy P NestleFranceAnna Fali NEGOTIATION
Mujtaba M StensethIndiaXuxue Feng NEW
Clifford M AlbaresUnited KingdomIoni Bowcher RENEWAL
Maisha O OldroydItalyOnyama Limba UNQUALIFIED
Misaki U FlosiItalyAmy Elsner NEGOTIATION
Stacey F BologniaFranceXuxue Feng NEGOTIATION
Costa T KuskoArgentinaOnyama Limba NEW
Jones U StensethUnited KingdomIvan Magalhaes QUALIFIED
Alejandro K NestleBrazilAsiya Javayant RENEWAL
Murillo H KuskoFranceIoni Bowcher UNQUALIFIED
Rodrigues S SchemmerArgentinaXuxue Feng RENEWAL
Jennifer K KuskoItalyElwin Sharvill RENEWAL
Kaitlin P CampainItalyAmy Elsner UNQUALIFIED
Arvin Z ChuiGermanyAnna Fali RENEWAL
Aditya O MacleadBrazilStephen Shaw 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>