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
Aditya P FerenczArgentinaXuxue Feng PROPOSAL
Jefferson E ChuiAustraliaIvan Magalhaes RENEWAL
Tony N ButtJapanBernardo Dominic QUALIFIED
Aruna R FigeroaGermanyAmy Elsner NEGOTIATION
Munro G AlbaresCanadaAsiya Javayant NEW
Alejandro B KuskoJapanIvan Magalhaes RENEWAL
Ashley Y GauchoFranceIoni Bowcher PROPOSAL
Wickens P MarrierItalyIoni Bowcher RENEWAL
Darci F OstroskyGermanyStephen Shaw UNQUALIFIED
Rodrigues R InouyeFranceXuxue Feng RENEWAL
Darci T GlickUnited KingdomXuxue Feng NEW
Ashley N AmigonBrazilStephen Shaw QUALIFIED
Julie P PerinArgentinaIoni Bowcher RENEWAL
Octavia M VocelkaIndiaOnyama Limba RENEWAL
Leja H GillianBrazilIvan Magalhaes QUALIFIED
Salvatore A RoysterItalyIvan Magalhaes QUALIFIED
Jeanfrancois G DilliardArgentinaAnna Fali NEGOTIATION
Jones V RulapaughBrazilBernardo Dominic PROPOSAL
Wickens L NickaCanadaAsiya Javayant NEGOTIATION
Ricardo N RimItalyIoni Bowcher RENEWAL
Darci L PerinArgentinaBernardo Dominic QUALIFIED
Munro S TollnerBrazilAsiya Javayant PROPOSAL
Ivar X InouyeItalyIvan Magalhaes RENEWAL
Stacey E PerinCanadaStephen Shaw RENEWAL
Faith H OldroydIndiaAnna Fali NEW
Chavez A MaletGermanyBernardo Dominic QUALIFIED
Wickens O MaletFranceIoni Bowcher NEW
Julie K OldroydGermanyAsiya Javayant RENEWAL
Smith Y AmigonRussiaElwin Sharvill NEGOTIATION
Munro I RutaJapanIoni Bowcher RENEWAL
Munro C DarakjyFranceElwin Sharvill NEGOTIATION
Arvin K WhobreyUnited KingdomIoni Bowcher NEW
Darci C RimGermanyElwin Sharvill UNQUALIFIED
Darci C ShinkoAustraliaStephen Shaw UNQUALIFIED
Izzy T PaprockiJapanStephen Shaw PROPOSAL
Ricardo I VocelkaFranceIoni Bowcher PROPOSAL
Emily Z WhobreyAustraliaOnyama Limba NEGOTIATION
Mayumi N RoysterUnited KingdomIoni Bowcher PROPOSAL
Chavez A SchemmerRussiaXuxue Feng UNQUALIFIED
Tony T RulapaughUnited KingdomStephen Shaw QUALIFIED
David D AlbaresUnited KingdomAsiya Javayant RENEWAL
Salvatore S RoysterAustraliaAmy Elsner UNQUALIFIED
Antonio R RoysterGermanyAsiya Javayant NEGOTIATION
Smith Y DarakjyGermanyOnyama Limba NEW
Johnson Z StockhamJapanStephen Shaw UNQUALIFIED
Ricardo J MacleadFranceXuxue Feng RENEWAL
Aditya N VocelkaBrazilAnna Fali RENEWAL
Jennifer Y DoeUnited KingdomElwin Sharvill NEW
Alejandro V GauchoCanadaAnna Fali NEGOTIATION
Johnson K FollerIndiaXuxue Feng NEW
Horizontal
NameCountryRepresentativeStatus
Cody P MarrierCanadaXuxue Feng QUALIFIED
Leon Z DarakjySpainBernardo Dominic UNQUALIFIED
Mujtaba Q DilliardRussiaElwin Sharvill QUALIFIED
Mayumi X AlbaresBrazilXuxue Feng PROPOSAL
Rodrigues R ButtFranceStephen Shaw RENEWAL
Kadeem B WhobreyFranceOnyama Limba UNQUALIFIED
Greenwood V FerenczItalyAnna Fali UNQUALIFIED
Izzy Y TollnerIndiaAmy Elsner UNQUALIFIED
Octavia D VenereSpainOnyama Limba UNQUALIFIED
Silvio F CaldareraSpainStephen Shaw PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Murillo I SergiSpain2025-04-12Buckley Miller Wright UNQUALIFIED75Xuxue Feng
1001Claire H VocelkaItaly2025-04-23Feltz Printing Service RENEWAL80Xuxue Feng
1002Maria S InouyeGermany2025-04-28Feiner Bros NEW32Xuxue Feng
1003Misaki D OldroydFrance2025-04-20Commercial Press NEW37Elwin Sharvill
1004Mujtaba U TollnerCanada2025-05-01Chemel, James L Cpa NEGOTIATION0Ivan Magalhaes
1005Alejandro G WieserFrance2025-05-07King, Christopher A Esq QUALIFIED96Bernardo Dominic
1006Darci F CampainArgentina2025-04-24Benton, John B Jr RENEWAL82Amy Elsner
1007Aditya T RimIndia2025-04-30Rousseaux, Michael Esq QUALIFIED53Stephen Shaw
1008Aditya I FollerGermany2025-04-17Rangoni Of Florence NEGOTIATION27Onyama Limba
1009Stacey M FigeroaCanada2025-04-17Dorl, James J Esq PROPOSAL23Elwin Sharvill
1010Faith B AmigonFrance2025-05-06Chemel, James L Cpa PROPOSAL17Xuxue Feng
1011Kaitlin P GauchoGermany2025-05-10Chanay, Jeffrey A Esq QUALIFIED40Xuxue Feng
1012Deepesh M IturbideUnited Kingdom2025-04-30Chemel, James L Cpa RENEWAL37Bernardo Dominic
1013Nicolas A DilliardUnited Kingdom2025-04-19Buckley Miller Wright PROPOSAL27Asiya Javayant
1014Antonio X NestleJapan2025-05-08Dorl, James J Esq PROPOSAL10Elwin Sharvill
1015Isabel B BowleyRussia2025-04-26Truhlar And Truhlar Attys PROPOSAL16Ivan Magalhaes
1016Aika V GauchoUnited Kingdom2025-04-14King, Christopher A Esq UNQUALIFIED80Onyama Limba
1017Jefferson X CaldareraRussia2025-04-21Truhlar And Truhlar Attys QUALIFIED85Xuxue Feng
1018Ashley W SergiJapan2025-04-12Benton, John B Jr QUALIFIED58Xuxue Feng
1019Wickens T PaprockiUnited Kingdom2025-05-01Feiner Bros QUALIFIED49Ioni Bowcher
1020Alejandro R MaletIndia2025-04-29Truhlar And Truhlar Attys QUALIFIED56Ivan Magalhaes
1021Sinclair J BowleyJapan2025-04-17Dorl, James J Esq PROPOSAL88Stephen Shaw
1022Silvio G NestleItaly2025-04-22Feiner Bros NEW92Xuxue Feng
1023Mujtaba F SchemmerCanada2025-04-24Rangoni Of Florence PROPOSAL12Asiya Javayant
1024Chavez I GarufiItaly2025-04-18Feiner Bros UNQUALIFIED44Ioni Bowcher
1025Chavez L RimItaly2025-04-19Truhlar And Truhlar Attys RENEWAL14Elwin Sharvill
1026Julie N AmigonArgentina2025-05-06Dorl, James J Esq NEGOTIATION30Anna Fali
1027Kaitlin T BowleySpain2025-05-04Buckley Miller Wright NEW91Ivan Magalhaes
1028Octavia H SaylorsUnited Kingdom2025-05-05Chemel, James L Cpa PROPOSAL31Xuxue Feng
1029Mayumi K InouyeBrazil2025-04-14Dorl, James J Esq RENEWAL58Ivan Magalhaes
1030Jefferson O WieserCanada2025-05-07Chemel, James L Cpa NEGOTIATION57Anna Fali
1031Juan Q AlbaresBrazil2025-04-25Truhlar And Truhlar Attys PROPOSAL5Anna Fali
1032David W PaprockiFrance2025-04-22Printing Dimensions QUALIFIED82Anna Fali
1033Mujtaba B MacleadAustralia2025-05-10Benton, John B Jr UNQUALIFIED95Ioni Bowcher
1034Claire C SlusarskiRussia2025-04-27Rangoni Of Florence PROPOSAL43Onyama Limba
1035Murillo L KuskoFrance2025-05-09Feltz Printing Service NEGOTIATION2Stephen Shaw
1036James J RutaUnited Kingdom2025-04-30Chapman, Ross E Esq UNQUALIFIED74Onyama Limba
1037Izzy J SaylorsIndia2025-05-02Printing Dimensions QUALIFIED18Amy Elsner
1038Silvio H NickaSpain2025-05-10Dorl, James J Esq NEW42Amy Elsner
1039Ivar V SergiAustralia2025-04-24King, Christopher A Esq RENEWAL6Anna Fali
1040Isabel C PoquetteGermany2025-05-08Feltz Printing Service NEGOTIATION98Elwin Sharvill
1041Octavia S MaletBrazil2025-04-21Dorl, James J Esq QUALIFIED87Amy Elsner
1042Ricardo B RulapaughAustralia2025-04-11Chanay, Jeffrey A Esq PROPOSAL74Xuxue Feng
1043Kadeem Y ChuiGermany2025-04-14Feiner Bros NEW73Stephen Shaw
1044Mayumi R MarrierRussia2025-04-16Commercial Press NEW18Ioni Bowcher
1045Greenwood F WieserItaly2025-05-10Rangoni Of Florence UNQUALIFIED91Amy Elsner
1046Munro B BologniaFrance2025-04-24Benton, John B Jr RENEWAL65Amy Elsner
1047Salvatore E FerenczUnited Kingdom2025-05-08Chanay, Jeffrey A Esq NEW45Onyama Limba
1048Greenwood U ChuiArgentina2025-04-13Chapman, Ross E Esq PROPOSAL66Bernardo Dominic
1049Antonio G KuskoUnited Kingdom2025-04-28Buckley Miller Wright PROPOSAL46Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Cody V ShinkoRussiaAsiya Javayant NEW
Ashley C RimRussiaIvan Magalhaes UNQUALIFIED
Maisha V BriddickAustraliaBernardo Dominic PROPOSAL
Leon Q BologniaIndiaBernardo Dominic NEW
James E GlickCanadaIvan Magalhaes NEGOTIATION
Deepesh M OldroydItalyXuxue Feng NEGOTIATION
Kaitlin Z GauchoBrazilAnna Fali RENEWAL
Maisha Y DarakjyBrazilAmy Elsner NEW
Julie B VocelkaFranceXuxue Feng PROPOSAL
Mayumi X KuskoArgentinaAnna Fali NEGOTIATION
Ricardo V StockhamFranceAnna Fali UNQUALIFIED
Antonio I FerenczIndiaIoni Bowcher QUALIFIED
Maisha C StockhamSpainAnna Fali NEGOTIATION
Clifford J NickaIndiaIoni Bowcher UNQUALIFIED
Morrow U SchemmerJapanAsiya Javayant NEW
Maria R MacleadJapanIoni Bowcher NEGOTIATION
Antonio S RulapaughRussiaOnyama Limba NEW
Greenwood V VenereCanadaIvan Magalhaes RENEWAL
Jennifer O GillianCanadaXuxue Feng NEW
Salvatore B RimIndiaAnna Fali NEW
Adams C InouyeJapanAmy Elsner RENEWAL
Misaki Q PerinAustraliaIoni Bowcher RENEWAL
Kaitlin Y CaudyGermanyElwin Sharvill NEW
Ricardo X StensethArgentinaBernardo Dominic QUALIFIED
Mujtaba X GauchoAustraliaElwin Sharvill NEGOTIATION
Rodrigues T SchemmerBrazilOnyama Limba UNQUALIFIED
Ashley V StockhamGermanyAsiya Javayant UNQUALIFIED
Smith A OstroskySpainAmy Elsner NEW
Mayumi G NickaArgentinaAnna Fali PROPOSAL
Darci E StensethArgentinaXuxue Feng UNQUALIFIED
Julie G AlbaresArgentinaAsiya Javayant RENEWAL
Izzy Z FerenczFranceElwin Sharvill RENEWAL
Izzy G WieserSpainStephen Shaw QUALIFIED
Johnson V GillianIndiaIvan Magalhaes NEGOTIATION
Smith L FlosiUnited KingdomAsiya Javayant QUALIFIED
Salvatore F MaletFranceBernardo Dominic NEGOTIATION
Wickens V FigeroaRussiaAsiya Javayant QUALIFIED
James C StockhamBrazilIvan Magalhaes QUALIFIED
Faith C FigeroaJapanBernardo Dominic PROPOSAL
Leon G StensethRussiaAmy Elsner NEW
Silvio P CaldareraJapanOnyama Limba QUALIFIED
Alejandro Y IturbideGermanyBernardo Dominic PROPOSAL
Sinclair E BologniaUnited KingdomXuxue Feng PROPOSAL
Maisha A GarufiArgentinaBernardo Dominic QUALIFIED
Rodrigues H RulapaughBrazilIvan Magalhaes RENEWAL
Costa J PaprockiAustraliaOnyama Limba RENEWAL
Jennifer C KuskoIndiaAmy Elsner PROPOSAL
Ivar Y SergiIndiaIoni Bowcher RENEWAL
Maisha I InouyeGermanyIvan Magalhaes NEGOTIATION
Morrow Y AmigonCanadaIoni Bowcher QUALIFIED
Frozen Columns
Name
Leja Y Poquette
Mujtaba A Kusko
Mujtaba C Dilliard
Leon E Figeroa
Kaitlin S Stenseth
Maisha X Foller
Faith M Rulapaugh
Jennifer P Malet
Julie W Stockham
Octavia G Perin
Silvio U Glick
Jefferson L Saylors
Aruna U Wieser
Maisha O Rulapaugh
Ashley C Oldroyd
Mujtaba D Malet
Emily H Sergi
Izzy A Figeroa
Ricardo N Bolognia
Juan R Chui
Kaitlin I Figeroa
Cody V Malet
Wickens U Ruta
Rodrigues Z Malet
Cody R Flosi
Adams X Butt
Murillo H Saylors
Tony O Campain
Salvatore U Butt
Ivar L Ruta
Maisha S Oldroyd
Kaitlin X Waycott
Faith V Rim
Ashley F Slusarski
Munro J Perin
Clifford H Whobrey
Morrow C Stockham
Maisha Z Doe
Misaki R Garufi
Faith Y Perin
Mujtaba L Tollner
Nicolas L Sergi
Jefferson H Bowley
James P Doe
Wickens R Malet
James T Campain
Octavia U Oldroyd
Jeanfrancois I Caudy
Costa L Flosi
Jeanfrancois J Venere
IdCountryDate
1000Japan2025-05-01
1001Australia2025-04-12
1002Italy2025-04-25
1003Canada2025-04-20
1004Australia2025-04-20
1005Argentina2025-05-04
1006Brazil2025-05-04
1007Russia2025-04-17
1008Japan2025-04-18
1009Russia2025-04-21
1010United Kingdom2025-05-05
1011Spain2025-05-02
1012Argentina2025-05-06
1013India2025-04-29
1014Australia2025-04-13
1015Russia2025-05-07
1016Argentina2025-04-23
1017France2025-04-15
1018Italy2025-04-25
1019Italy2025-04-23
1020Japan2025-04-27
1021France2025-04-13
1022Japan2025-04-22
1023Germany2025-04-13
1024Japan2025-05-06
1025Canada2025-04-27
1026Russia2025-04-20
1027Japan2025-04-17
1028Australia2025-05-02
1029India2025-05-06
1030France2025-04-25
1031Germany2025-04-21
1032Italy2025-04-24
1033Australia2025-05-06
1034Australia2025-04-26
1035Italy2025-04-26
1036Brazil2025-04-16
1037France2025-04-23
1038Canada2025-04-28
1039Italy2025-04-11
1040Russia2025-04-27
1041Argentina2025-04-12
1042Brazil2025-04-29
1043Argentina2025-05-03
1044Germany2025-04-23
1045Japan2025-04-19
1046Russia2025-04-11
1047Canada2025-04-30
1048India2025-04-17
1049Spain2025-04-28

On-Demand Data

NameIdCountryDate
Ashley K Poquette1000Canada2025-04-29
Kaitlin E Slusarski1001Russia2025-04-15
Tony T Butt1002Japan2025-04-25
Aika M Amigon1003Spain2025-04-20
Kaitlin O Rulapaugh1004Japan2025-04-26
Deepesh I Inouye1005Italy2025-05-08
Sinclair Y Morasca1006Japan2025-04-15
Stacey A Marrier1007Russia2025-04-19
Leja F Waycott1008Japan2025-04-21
Ricardo G Caldarera1009Germany2025-04-25
Deepesh Z Bolognia1010France2025-04-19
Deepesh J Gillian1011Italy2025-05-04
Emily Y Foller1012France2025-05-07
Jefferson T Maclead1013Italy2025-05-08
Jennifer L Flosi1014Spain2025-04-26
Octavia J Kusko1015India2025-04-22
Darci Z Venere1016Italy2025-04-26
Chavez Y Campain1017France2025-04-14
Kaitlin R Morasca1018Russia2025-04-16
Maria Q Chui1019Canada2025-04-14
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aruna N PerinBrazilXuxue Feng NEW
Antonio J MarrierUnited KingdomAnna Fali QUALIFIED
Morrow T ButtIndiaIvan Magalhaes NEW
Adams D VenereFranceXuxue Feng QUALIFIED
Stacey B WieserBrazilXuxue Feng NEGOTIATION
Jeanfrancois F PaprockiUnited KingdomAnna Fali RENEWAL
Johnson Z WhobreyRussiaIoni Bowcher QUALIFIED
Deepesh E GlickIndiaIoni Bowcher NEGOTIATION
Murillo B SaylorsItalyIvan Magalhaes RENEWAL
Nicolas J RimIndiaAnna Fali NEGOTIATION
Chavez S StensethGermanyXuxue Feng NEGOTIATION
Johnson E DilliardAustraliaElwin Sharvill UNQUALIFIED
Jones H GlickJapanIvan Magalhaes RENEWAL
Francesco E WhobreyAustraliaStephen Shaw PROPOSAL
Stacey K GarufiArgentinaIoni Bowcher UNQUALIFIED
Kadeem Y StensethArgentinaXuxue Feng UNQUALIFIED
Aika F NestleJapanAnna Fali RENEWAL
Darci G SaylorsBrazilBernardo Dominic QUALIFIED
Maisha B VocelkaArgentinaIoni Bowcher QUALIFIED
Nicolas U IturbideCanadaBernardo Dominic UNQUALIFIED
Jeanfrancois Q GillianUnited KingdomAmy Elsner UNQUALIFIED
Cody G NestleCanadaIoni Bowcher RENEWAL
Aditya J WieserArgentinaBernardo Dominic NEGOTIATION
Aruna Q ShinkoGermanyIoni Bowcher NEW
Stacey O SergiItalyIoni Bowcher RENEWAL
Claire Z StensethRussiaStephen Shaw NEGOTIATION
Maisha U RutaCanadaElwin Sharvill UNQUALIFIED
Salvatore U RimFranceAmy Elsner UNQUALIFIED
Alejandro T WhobreyJapanIvan Magalhaes NEW
Faith E VenereUnited KingdomIvan Magalhaes RENEWAL
Rodrigues X MaletArgentinaOnyama Limba NEW
Clifford N FlosiFranceElwin Sharvill RENEWAL
Julie A WaycottBrazilIvan Magalhaes NEW
Salvatore R MaletFranceBernardo Dominic PROPOSAL
Maisha W PerinBrazilOnyama Limba QUALIFIED
Stacey T FigeroaAustraliaAnna Fali QUALIFIED
Jones N StensethFranceIvan Magalhaes UNQUALIFIED
Nicolas K DilliardRussiaAnna Fali RENEWAL
David N FigeroaJapanAmy Elsner NEW
Chavez Z OldroydAustraliaAmy Elsner NEW

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