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
Ricardo D ButtIndiaElwin Sharvill NEW
Tony R ChuiSpainIvan Magalhaes UNQUALIFIED
Emily W RulapaughUnited KingdomIoni Bowcher PROPOSAL
Silvio E DilliardCanadaAmy Elsner PROPOSAL
Francesco J KolmetzArgentinaIvan Magalhaes UNQUALIFIED
David X DilliardGermanyIoni Bowcher NEW
Emily H StockhamJapanElwin Sharvill PROPOSAL
Julie J FerenczItalyStephen Shaw UNQUALIFIED
Adams N GlickGermanyBernardo Dominic UNQUALIFIED
Aditya V WhobreySpainAnna Fali NEGOTIATION
Maisha S ButtSpainXuxue Feng PROPOSAL
Leon D SlusarskiGermanyBernardo Dominic NEGOTIATION
James X DilliardAustraliaAsiya Javayant UNQUALIFIED
Ivar G MarrierGermanyIoni Bowcher QUALIFIED
Cody M StensethAustraliaAnna Fali NEGOTIATION
Mayumi A SaylorsRussiaOnyama Limba QUALIFIED
Deepesh Y OstroskyIndiaAmy Elsner NEGOTIATION
Mujtaba G WaycottAustraliaAmy Elsner UNQUALIFIED
Jones I NestleFranceBernardo Dominic RENEWAL
Mayumi G OstroskyJapanBernardo Dominic RENEWAL
Misaki A NestleBrazilBernardo Dominic QUALIFIED
Kadeem C RulapaughJapanIvan Magalhaes RENEWAL
Tony V NickaGermanyElwin Sharvill QUALIFIED
Clifford B SlusarskiUnited KingdomStephen Shaw RENEWAL
Leon H SergiUnited KingdomOnyama Limba NEW
Arvin P BriddickItalyAsiya Javayant UNQUALIFIED
Adams D SergiAustraliaAsiya Javayant RENEWAL
Clifford M CaldareraBrazilAmy Elsner NEW
Aika K IturbideJapanXuxue Feng UNQUALIFIED
Murillo X TollnerCanadaIoni Bowcher NEW
Silvio X InouyeBrazilIoni Bowcher RENEWAL
Mujtaba U WhobreyRussiaAmy Elsner RENEWAL
Sinclair V VocelkaIndiaBernardo Dominic NEGOTIATION
Claire F OldroydArgentinaXuxue Feng QUALIFIED
Kadeem S PaprockiIndiaIvan Magalhaes PROPOSAL
Mayumi Q PoquetteBrazilElwin Sharvill QUALIFIED
Octavia Z RoysterItalyIoni Bowcher NEW
Aruna B DilliardCanadaIvan Magalhaes NEGOTIATION
Sinclair K MarrierItalyIoni Bowcher QUALIFIED
Nicolas R ButtArgentinaIoni Bowcher RENEWAL
Costa H OldroydBrazilIoni Bowcher NEW
Emily Y TollnerUnited KingdomBernardo Dominic NEW
Rodrigues U FerenczItalyAmy Elsner UNQUALIFIED
Francesco G FerenczBrazilIvan Magalhaes NEW
Antonio K ShinkoAustraliaXuxue Feng RENEWAL
Aruna K CampainSpainAsiya Javayant NEW
Misaki Z RoysterCanadaAmy Elsner NEW
Misaki Z FollerItalyBernardo Dominic QUALIFIED
Maisha H AlbaresUnited KingdomIoni Bowcher RENEWAL
Emily Z StensethUnited KingdomAsiya Javayant QUALIFIED
Horizontal
NameCountryRepresentativeStatus
David Q BowleyRussiaIoni Bowcher QUALIFIED
Jennifer N GillianGermanyAmy Elsner NEW
Murillo R OstroskyItalyIvan Magalhaes UNQUALIFIED
Deepesh E FigeroaJapanXuxue Feng UNQUALIFIED
Juan R OldroydUnited KingdomElwin Sharvill UNQUALIFIED
Silvio G GlickFranceIoni Bowcher UNQUALIFIED
Faith L PaprockiGermanyIvan Magalhaes RENEWAL
Nicolas S MarrierItalyAnna Fali NEGOTIATION
Kadeem Y MaletBrazilElwin Sharvill RENEWAL
Clifford I OldroydAustraliaAnna Fali UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Jones I DarakjyItaly2025-04-01Feltz Printing Service NEW71Stephen Shaw
1001Maisha I NestleUnited Kingdom2025-04-15Buckley Miller Wright PROPOSAL70Onyama Limba
1002Morrow Q FigeroaItaly2025-04-11Dorl, James J Esq UNQUALIFIED82Xuxue Feng
1003Greenwood G GillianArgentina2025-04-07Printing Dimensions PROPOSAL34Ioni Bowcher
1004Arvin E KuskoSpain2025-04-29King, Christopher A Esq UNQUALIFIED62Elwin Sharvill
1005Leja F PerinIndia2025-04-09King, Christopher A Esq NEW10Xuxue Feng
1006Salvatore R DilliardBrazil2025-04-06Rangoni Of Florence NEGOTIATION57Anna Fali
1007Misaki S CampainBrazil2025-04-23Rousseaux, Michael Esq RENEWAL94Elwin Sharvill
1008Silvio C SlusarskiArgentina2025-04-09King, Christopher A Esq UNQUALIFIED54Asiya Javayant
1009Sinclair X MorascaBrazil2025-04-22Commercial Press UNQUALIFIED26Ioni Bowcher
1010Nicolas N NickaIndia2025-04-24Chapman, Ross E Esq UNQUALIFIED56Ioni Bowcher
1011Maisha K RimCanada2025-04-20Feltz Printing Service NEW97Ioni Bowcher
1012Johnson K GauchoAustralia2025-04-22Feiner Bros QUALIFIED16Onyama Limba
1013Arvin Q MaletSpain2025-04-20Commercial Press QUALIFIED47Xuxue Feng
1014Salvatore F BologniaUnited Kingdom2025-04-08Dorl, James J Esq UNQUALIFIED9Onyama Limba
1015Chavez L WaycottAustralia2025-04-18Truhlar And Truhlar Attys PROPOSAL6Ivan Magalhaes
1016Ashley T PerinCanada2025-04-02Rangoni Of Florence RENEWAL71Anna Fali
1017Julie W FigeroaArgentina2025-04-26Printing Dimensions PROPOSAL23Bernardo Dominic
1018Ricardo Y ShinkoGermany2025-04-28Dorl, James J Esq NEW37Anna Fali
1019Murillo U SergiRussia2025-04-04Rangoni Of Florence QUALIFIED80Ioni Bowcher
1020Nicolas Q TollnerRussia2025-04-09Dorl, James J Esq UNQUALIFIED66Amy Elsner
1021Maria N AlbaresArgentina2025-04-25Commercial Press NEW86Amy Elsner
1022Antonio X InouyeUnited Kingdom2025-04-24Chanay, Jeffrey A Esq NEW10Asiya Javayant
1023Octavia G GlickRussia2025-04-18Feiner Bros RENEWAL24Amy Elsner
1024Greenwood S SlusarskiCanada2025-03-31Truhlar And Truhlar Attys NEGOTIATION64Anna Fali
1025Mayumi D MacleadIndia2025-04-28Chanay, Jeffrey A Esq UNQUALIFIED92Elwin Sharvill
1026Salvatore A NestleRussia2025-04-29King, Christopher A Esq PROPOSAL58Onyama Limba
1027Costa I RutaArgentina2025-04-13King, Christopher A Esq PROPOSAL79Ioni Bowcher
1028Francesco C ShinkoItaly2025-04-05King, Christopher A Esq NEW30Anna Fali
1029Costa A FerenczJapan2025-04-22Printing Dimensions RENEWAL30Ivan Magalhaes
1030Cody D VocelkaArgentina2025-04-11Chemel, James L Cpa RENEWAL88Ioni Bowcher
1031Deepesh C TollnerJapan2025-04-11Rangoni Of Florence QUALIFIED15Bernardo Dominic
1032Munro Y BowleyIndia2025-04-27Benton, John B Jr NEW20Ivan Magalhaes
1033Costa K TollnerArgentina2025-04-23Dorl, James J Esq NEGOTIATION43Amy Elsner
1034Jeanfrancois D VenereFrance2025-04-03Printing Dimensions UNQUALIFIED12Amy Elsner
1035Octavia S ChuiArgentina2025-04-22Commercial Press PROPOSAL64Ivan Magalhaes
1036Jefferson S OstroskyUnited Kingdom2025-04-09Morlong Associates PROPOSAL94Bernardo Dominic
1037David W PaprockiGermany2025-04-19Chemel, James L Cpa PROPOSAL98Stephen Shaw
1038Aruna T VocelkaJapan2025-04-27Chanay, Jeffrey A Esq RENEWAL97Elwin Sharvill
1039Nicolas G VocelkaFrance2025-04-29Rousseaux, Michael Esq QUALIFIED15Asiya Javayant
1040Salvatore Q SlusarskiArgentina2025-04-14Truhlar And Truhlar Attys QUALIFIED19Anna Fali
1041Salvatore B DilliardBrazil2025-04-27Benton, John B Jr QUALIFIED0Ivan Magalhaes
1042Jefferson E RulapaughJapan2025-04-27King, Christopher A Esq QUALIFIED77Anna Fali
1043Isabel O RutaItaly2025-04-06Chemel, James L Cpa NEW83Elwin Sharvill
1044Stacey H FerenczArgentina2025-03-31Chapman, Ross E Esq NEGOTIATION36Ioni Bowcher
1045Octavia R AlbaresBrazil2025-04-26Rangoni Of Florence NEGOTIATION48Stephen Shaw
1046Jefferson M MaletFrance2025-04-01Feltz Printing Service NEGOTIATION70Onyama Limba
1047Jennifer W DarakjyAustralia2025-04-28Rangoni Of Florence NEGOTIATION3Asiya Javayant
1048Costa D BologniaSpain2025-04-02Morlong Associates RENEWAL94Stephen Shaw
1049Munro P KuskoJapan2025-04-29Chapman, Ross E Esq PROPOSAL45Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Jennifer C MaletAustraliaIvan Magalhaes NEGOTIATION
Ashley Z FigeroaJapanIvan Magalhaes RENEWAL
Tony Z ButtRussiaAsiya Javayant NEW
Mujtaba P GillianSpainBernardo Dominic QUALIFIED
Murillo Q StensethItalyOnyama Limba RENEWAL
Aika X DilliardAustraliaAsiya Javayant NEGOTIATION
Wickens I WhobreyIndiaOnyama Limba UNQUALIFIED
Morrow B CampainIndiaAsiya Javayant PROPOSAL
Chavez L NickaBrazilAmy Elsner NEW
Ricardo H StensethGermanyAnna Fali NEGOTIATION
Maria Z FollerSpainBernardo Dominic NEW
Clifford D CaudySpainAmy Elsner UNQUALIFIED
Darci I FerenczCanadaAnna Fali NEW
Greenwood V SaylorsIndiaXuxue Feng QUALIFIED
Mujtaba B FollerItalyAnna Fali UNQUALIFIED
Tony P MarrierIndiaIvan Magalhaes NEW
Ivar N GarufiSpainIvan Magalhaes PROPOSAL
Leon U CaldareraItalyElwin Sharvill NEGOTIATION
Mujtaba G KuskoFranceIoni Bowcher UNQUALIFIED
Jefferson R InouyeUnited KingdomBernardo Dominic QUALIFIED
Deepesh F MaletUnited KingdomStephen Shaw PROPOSAL
Tony F MaletFranceBernardo Dominic RENEWAL
Smith O IturbideFranceAnna Fali PROPOSAL
Wickens Z OldroydUnited KingdomAsiya Javayant NEW
Deepesh E DoeBrazilStephen Shaw NEGOTIATION
Stacey Q OstroskyBrazilIoni Bowcher NEW
Morrow C PerinBrazilXuxue Feng NEGOTIATION
Jones T TollnerRussiaStephen Shaw NEGOTIATION
Costa F MaletIndiaIvan Magalhaes UNQUALIFIED
Mujtaba O StensethAustraliaIoni Bowcher UNQUALIFIED
Aika O GillianIndiaOnyama Limba RENEWAL
Antonio J CampainCanadaStephen Shaw UNQUALIFIED
Cody X InouyeFranceBernardo Dominic PROPOSAL
Emily B ShinkoIndiaStephen Shaw RENEWAL
Chavez X SergiAustraliaIoni Bowcher RENEWAL
Francesco L BowleyJapanAnna Fali UNQUALIFIED
Greenwood R IturbideRussiaIvan Magalhaes UNQUALIFIED
David R SchemmerUnited KingdomAnna Fali UNQUALIFIED
Claire O KuskoUnited KingdomIvan Magalhaes UNQUALIFIED
Mayumi L BriddickCanadaXuxue Feng RENEWAL
Jefferson P StockhamCanadaBernardo Dominic RENEWAL
Munro H WhobreySpainAnna Fali UNQUALIFIED
Aditya K FigeroaRussiaXuxue Feng UNQUALIFIED
Juan O AmigonArgentinaIvan Magalhaes NEGOTIATION
Leja W CaldareraJapanAsiya Javayant QUALIFIED
Jefferson A MarrierRussiaIoni Bowcher QUALIFIED
Kaitlin S CaudySpainStephen Shaw RENEWAL
Munro O DarakjyRussiaXuxue Feng QUALIFIED
Francesco J VenereItalyBernardo Dominic NEGOTIATION
Clifford Y OldroydJapanElwin Sharvill RENEWAL
Frozen Columns
Name
Stacey A Marrier
Claire O Gillian
Leja H Poquette
Mayumi K Ferencz
Isabel N Glick
Kaitlin R Kolmetz
Isabel M Wieser
Ivar X Flosi
Octavia J Glick
Izzy V Butt
Greenwood Y Gaucho
Wickens K Slusarski
Maisha N Foller
Silvio J Garufi
Greenwood B Gaucho
Mujtaba L Butt
Francesco F Saylors
Maisha B Oldroyd
Juan Y Maclead
Greenwood E Gaucho
Antonio I Whobrey
Antonio G Sergi
Ricardo C Flosi
Costa C Ostrosky
Murillo W Caldarera
Emily P Venere
Wickens R Maclead
Izzy D Iturbide
Morrow Q Maclead
Aika N Ferencz
Faith M Perin
Emily X Stenseth
Maisha N Ostrosky
Mujtaba N Stenseth
Greenwood P Malet
Aika J Ferencz
Salvatore Y Whobrey
Mayumi B Malet
Greenwood E Kolmetz
Ricardo P Dilliard
Chavez X Ostrosky
Cody B Kolmetz
Greenwood B Shinko
Salvatore D Rulapaugh
Julie X Garufi
Izzy C Campain
Claire H Royster
Chavez L Tollner
Leon M Butt
Aruna O Morasca
IdCountryDate
1000Brazil2025-04-12
1001Russia2025-04-28
1002Italy2025-04-08
1003Germany2025-04-14
1004Russia2025-04-17
1005Spain2025-04-18
1006France2025-04-24
1007India2025-04-01
1008Canada2025-04-11
1009Russia2025-04-04
1010Australia2025-04-14
1011Australia2025-04-18
1012Germany2025-04-12
1013Canada2025-04-24
1014Japan2025-04-29
1015Argentina2025-04-21
1016Argentina2025-04-28
1017Russia2025-04-29
1018Germany2025-04-21
1019India2025-04-16
1020France2025-04-11
1021Brazil2025-04-11
1022Italy2025-04-17
1023Italy2025-04-28
1024France2025-04-25
1025India2025-04-11
1026Argentina2025-04-06
1027Canada2025-04-05
1028Argentina2025-04-25
1029France2025-04-22
1030Russia2025-04-05
1031Canada2025-04-25
1032Brazil2025-04-25
1033Australia2025-04-14
1034Argentina2025-04-11
1035Spain2025-04-02
1036Russia2025-04-23
1037France2025-04-11
1038India2025-04-20
1039India2025-04-23
1040Canada2025-04-07
1041Spain2025-04-01
1042Spain2025-04-17
1043Japan2025-04-06
1044Russia2025-04-02
1045United Kingdom2025-04-10
1046Brazil2025-04-07
1047France2025-04-16
1048Germany2025-04-16
1049Italy2025-04-28

On-Demand Data

NameIdCountryDate
Mujtaba L Marrier1000Canada2025-04-23
Kadeem W Doe1001Italy2025-04-24
Rodrigues J Rim1002Japan2025-04-23
Johnson T Waycott1003Germany2025-04-29
Chavez A Malet1004Italy2025-04-22
Mayumi G Briddick1005United Kingdom2025-04-15
David C Poquette1006Canada2025-04-15
Leon M Rim1007France2025-04-29
Morrow P Oldroyd1008India2025-04-16
Clifford P Foller1009Italy2025-04-17
Jennifer V Gillian1010Australia2025-04-07
Darci G Foller1011Spain2025-03-31
Mayumi G Amigon1012India2025-04-26
Mujtaba U Caudy1013Germany2025-04-05
Antonio S Chui1014Australia2025-04-07
Izzy Z Rim1015Russia2025-04-22
Nicolas K Flosi1016Argentina2025-04-17
Claire J Caudy1017France2025-04-07
Ricardo V Slusarski1018Australia2025-03-31
Izzy T Amigon1019United Kingdom2025-04-19
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Nicolas I MaletBrazilOnyama Limba RENEWAL
Mayumi J StockhamJapanOnyama Limba UNQUALIFIED
Julie L InouyeFranceOnyama Limba PROPOSAL
Cody V BologniaCanadaStephen Shaw UNQUALIFIED
Costa A FigeroaCanadaAmy Elsner QUALIFIED
Izzy G TollnerArgentinaIoni Bowcher UNQUALIFIED
Aruna I GillianRussiaBernardo Dominic QUALIFIED
Maria F MarrierIndiaAnna Fali QUALIFIED
Leon A GlickCanadaXuxue Feng PROPOSAL
Isabel B BriddickFranceXuxue Feng NEGOTIATION
Octavia D MaletBrazilAmy Elsner NEGOTIATION
Jones T GillianSpainStephen Shaw QUALIFIED
Isabel F FlosiAustraliaXuxue Feng NEW
Jennifer B RoysterJapanAmy Elsner QUALIFIED
Octavia J SaylorsCanadaOnyama Limba NEW
Clifford B VocelkaGermanyAmy Elsner UNQUALIFIED
Ivar D OstroskyJapanIoni Bowcher QUALIFIED
Antonio V MaletJapanOnyama Limba QUALIFIED
Costa I ShinkoJapanAsiya Javayant UNQUALIFIED
Aruna A IturbideBrazilIvan Magalhaes RENEWAL
David E BriddickItalyIoni Bowcher PROPOSAL
Octavia N ChuiUnited KingdomElwin Sharvill PROPOSAL
Costa K RoysterGermanyAmy Elsner NEGOTIATION
Izzy T VenereGermanyAnna Fali NEGOTIATION
Adams M SergiJapanIoni Bowcher RENEWAL
Leja B RimJapanIoni Bowcher NEW
Jefferson C DoeSpainElwin Sharvill UNQUALIFIED
Tony Z PaprockiSpainAnna Fali NEW
Murillo M MarrierItalyXuxue Feng QUALIFIED
Faith P WaycottAustraliaStephen Shaw QUALIFIED
Salvatore D KolmetzFranceElwin Sharvill QUALIFIED
Jeanfrancois B CaudyItalyBernardo Dominic UNQUALIFIED
Francesco T WieserAustraliaBernardo Dominic QUALIFIED
Murillo N GauchoAustraliaIoni Bowcher NEW
Kadeem S BriddickIndiaStephen Shaw UNQUALIFIED
Greenwood U CaldareraFranceXuxue Feng UNQUALIFIED
Faith G CaudyAustraliaElwin Sharvill RENEWAL
Ricardo Z ButtSpainElwin Sharvill NEGOTIATION
Kaitlin Q DarakjyJapanAnna Fali RENEWAL
Antonio K StockhamFranceStephen Shaw UNQUALIFIED

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