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
Aruna X SaylorsGermanyAmy Elsner RENEWAL
Rodrigues D VocelkaSpainIvan Magalhaes NEW
Mayumi E NickaFranceElwin Sharvill UNQUALIFIED
Jefferson Q MarrierBrazilIvan Magalhaes RENEWAL
Chavez P CaldareraBrazilAmy Elsner QUALIFIED
David O SaylorsUnited KingdomAnna Fali NEGOTIATION
Costa W WieserJapanIvan Magalhaes NEW
Sinclair K IturbideFranceAnna Fali QUALIFIED
Alejandro J FollerSpainOnyama Limba PROPOSAL
Munro C PerinFranceIoni Bowcher RENEWAL
Antonio P KuskoItalyIoni Bowcher QUALIFIED
David X StockhamGermanyIvan Magalhaes NEW
Maisha Z GlickRussiaBernardo Dominic PROPOSAL
Greenwood C DoeJapanStephen Shaw NEGOTIATION
Ivar T PaprockiUnited KingdomBernardo Dominic QUALIFIED
Adams R RoysterUnited KingdomAmy Elsner NEW
Kaitlin Z BriddickGermanyStephen Shaw PROPOSAL
Jones N PoquetteRussiaAnna Fali PROPOSAL
Kadeem F ChuiBrazilXuxue Feng RENEWAL
Aruna F PerinRussiaElwin Sharvill NEW
Aruna W SergiJapanOnyama Limba NEGOTIATION
Deepesh R FerenczFranceStephen Shaw NEW
Ricardo K VenereAustraliaElwin Sharvill QUALIFIED
Aruna O RulapaughBrazilXuxue Feng RENEWAL
Salvatore W BriddickFranceBernardo Dominic PROPOSAL
Salvatore J PaprockiCanadaElwin Sharvill RENEWAL
Jennifer C FollerGermanyAsiya Javayant UNQUALIFIED
Munro N MacleadCanadaStephen Shaw NEGOTIATION
Leja T ShinkoArgentinaIoni Bowcher NEGOTIATION
James H MaletAustraliaAmy Elsner RENEWAL
Tony B RoysterBrazilIvan Magalhaes QUALIFIED
Cody X SlusarskiRussiaIvan Magalhaes PROPOSAL
Aditya K RimArgentinaStephen Shaw PROPOSAL
Claire T BowleySpainAnna Fali NEW
Ricardo K InouyeIndiaAmy Elsner UNQUALIFIED
Murillo R WieserItalyIoni Bowcher NEGOTIATION
Ashley M PerinArgentinaXuxue Feng NEGOTIATION
Leja L MacleadSpainOnyama Limba UNQUALIFIED
Leja T PerinSpainElwin Sharvill NEGOTIATION
Costa M ChuiRussiaXuxue Feng RENEWAL
Izzy Z VenereAustraliaElwin Sharvill UNQUALIFIED
Mayumi R ChuiGermanyElwin Sharvill NEGOTIATION
Aika Z GarufiUnited KingdomElwin Sharvill UNQUALIFIED
Juan M ChuiItalyXuxue Feng UNQUALIFIED
Costa X NestleAustraliaAmy Elsner PROPOSAL
Faith T GarufiUnited KingdomXuxue Feng RENEWAL
Leon H SchemmerBrazilXuxue Feng NEGOTIATION
Jefferson H SlusarskiUnited KingdomElwin Sharvill PROPOSAL
Darci Z PaprockiAustraliaAsiya Javayant PROPOSAL
Aika C OstroskyAustraliaElwin Sharvill NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Kaitlin O SchemmerRussiaElwin Sharvill NEGOTIATION
Jeanfrancois R ShinkoAustraliaElwin Sharvill UNQUALIFIED
Jones P KuskoFranceIvan Magalhaes PROPOSAL
Francesco L WieserIndiaXuxue Feng PROPOSAL
Antonio T AmigonGermanyStephen Shaw PROPOSAL
David V FollerIndiaIvan Magalhaes NEW
Aditya S OstroskyBrazilIvan Magalhaes NEW
Leon R GlickBrazilIvan Magalhaes RENEWAL
Salvatore H ButtUnited KingdomAsiya Javayant RENEWAL
Juan X AlbaresBrazilAmy Elsner NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000David H KolmetzCanada2025-06-02Rousseaux, Michael Esq NEGOTIATION94Ivan Magalhaes
1001Jeanfrancois L ShinkoCanada2025-05-20King, Christopher A Esq NEW51Amy Elsner
1002Isabel L TollnerBrazil2025-06-01Chemel, James L Cpa QUALIFIED75Bernardo Dominic
1003Mayumi X WhobreyBrazil2025-06-16Benton, John B Jr QUALIFIED37Asiya Javayant
1004David T AmigonAustralia2025-05-21Feltz Printing Service RENEWAL14Ioni Bowcher
1005Faith E WhobreySpain2025-06-11Feiner Bros NEW97Anna Fali
1006Alejandro F PerinFrance2025-06-01Chapman, Ross E Esq PROPOSAL42Asiya Javayant
1007David E GarufiGermany2025-05-19Morlong Associates QUALIFIED23Elwin Sharvill
1008Aditya P WhobreyRussia2025-05-30Truhlar And Truhlar Attys RENEWAL62Bernardo Dominic
1009Jefferson Q ButtBrazil2025-06-05Rousseaux, Michael Esq QUALIFIED7Stephen Shaw
1010Misaki P OstroskyUnited Kingdom2025-05-22Buckley Miller Wright QUALIFIED7Ivan Magalhaes
1011Jennifer B ChuiCanada2025-06-05Buckley Miller Wright PROPOSAL24Anna Fali
1012Wickens K ButtArgentina2025-05-27Benton, John B Jr NEGOTIATION10Stephen Shaw
1013Stacey T GarufiSpain2025-05-30Commercial Press UNQUALIFIED87Stephen Shaw
1014Salvatore Y AlbaresAustralia2025-05-26Truhlar And Truhlar Attys PROPOSAL42Elwin Sharvill
1015Julie C MacleadRussia2025-05-19Chemel, James L Cpa RENEWAL73Anna Fali
1016Wickens F NestleItaly2025-06-15Buckley Miller Wright QUALIFIED98Elwin Sharvill
1017James H CaudyGermany2025-06-03Commercial Press NEW76Bernardo Dominic
1018Julie P VocelkaBrazil2025-05-21Chapman, Ross E Esq QUALIFIED1Ivan Magalhaes
1019Silvio P IturbideUnited Kingdom2025-05-28Dorl, James J Esq UNQUALIFIED90Amy Elsner
1020Ivar R PerinJapan2025-05-18Commercial Press QUALIFIED99Ivan Magalhaes
1021Aditya L GauchoCanada2025-06-11Dorl, James J Esq NEGOTIATION42Onyama Limba
1022Kaitlin F CampainIndia2025-06-04Chanay, Jeffrey A Esq PROPOSAL77Amy Elsner
1023Darci V TollnerSpain2025-05-30Printing Dimensions NEGOTIATION99Bernardo Dominic
1024Tony S RoysterBrazil2025-05-18King, Christopher A Esq NEW35Xuxue Feng
1025Isabel J OldroydAustralia2025-06-08Benton, John B Jr PROPOSAL3Xuxue Feng
1026Ricardo P CampainJapan2025-05-20Benton, John B Jr UNQUALIFIED13Amy Elsner
1027Emily L FerenczSpain2025-05-25Rousseaux, Michael Esq NEW62Bernardo Dominic
1028Aruna Y DoeUnited Kingdom2025-06-05Benton, John B Jr NEGOTIATION73Amy Elsner
1029Costa O WhobreyUnited Kingdom2025-05-20Chanay, Jeffrey A Esq RENEWAL41Bernardo Dominic
1030Ivar L IturbideArgentina2025-06-12Dorl, James J Esq RENEWAL83Ivan Magalhaes
1031Leja F BriddickGermany2025-06-01Benton, John B Jr RENEWAL74Asiya Javayant
1032Adams Z AmigonUnited Kingdom2025-05-23Chanay, Jeffrey A Esq NEW10Ioni Bowcher
1033Alejandro O IturbideRussia2025-06-14Chapman, Ross E Esq NEGOTIATION72Bernardo Dominic
1034Aruna X RulapaughCanada2025-06-09King, Christopher A Esq NEW33Ivan Magalhaes
1035David T DarakjyFrance2025-06-02Morlong Associates NEW59Amy Elsner
1036Leja Y WaycottUnited Kingdom2025-06-11Chapman, Ross E Esq UNQUALIFIED65Stephen Shaw
1037Greenwood K MorascaJapan2025-05-26Benton, John B Jr PROPOSAL30Onyama Limba
1038Alejandro Z MorascaBrazil2025-06-11Chanay, Jeffrey A Esq QUALIFIED33Asiya Javayant
1039Salvatore A IturbideUnited Kingdom2025-06-09Commercial Press PROPOSAL63Ioni Bowcher
1040Stacey S WieserUnited Kingdom2025-06-02Chanay, Jeffrey A Esq RENEWAL68Stephen Shaw
1041Aruna O DoeJapan2025-06-15Commercial Press UNQUALIFIED62Ioni Bowcher
1042Izzy P SergiBrazil2025-06-16Buckley Miller Wright NEW87Ioni Bowcher
1043Sinclair U WaycottBrazil2025-06-12Rangoni Of Florence QUALIFIED35Bernardo Dominic
1044Smith F FerenczFrance2025-05-23Rousseaux, Michael Esq UNQUALIFIED19Stephen Shaw
1045David A SchemmerBrazil2025-05-20Commercial Press PROPOSAL79Onyama Limba
1046Sinclair D VenereItaly2025-06-15Printing Dimensions RENEWAL79Onyama Limba
1047Jeanfrancois R SlusarskiCanada2025-06-12Buckley Miller Wright RENEWAL50Asiya Javayant
1048Greenwood W RulapaughUnited Kingdom2025-06-08Commercial Press RENEWAL21Anna Fali
1049Smith T PaprockiSpain2025-05-22Rangoni Of Florence NEW2Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Isabel L SergiItalyOnyama Limba NEW
Silvio P GlickCanadaAnna Fali RENEWAL
Chavez L RoysterAustraliaBernardo Dominic NEW
Misaki Z MarrierUnited KingdomOnyama Limba QUALIFIED
Kadeem P ButtSpainAsiya Javayant UNQUALIFIED
Octavia F InouyeSpainOnyama Limba NEGOTIATION
Leon C MaletItalyBernardo Dominic QUALIFIED
Emily T MaletItalyBernardo Dominic NEGOTIATION
Tony G WaycottGermanyOnyama Limba RENEWAL
Jefferson L PaprockiAustraliaIvan Magalhaes QUALIFIED
Murillo R VocelkaJapanAmy Elsner RENEWAL
Darci T KuskoBrazilAsiya Javayant NEW
Leja Q GlickBrazilBernardo Dominic QUALIFIED
Sinclair X NickaIndiaBernardo Dominic NEW
Jones I TollnerJapanIoni Bowcher UNQUALIFIED
Maria D KuskoUnited KingdomAnna Fali NEGOTIATION
Faith O PerinUnited KingdomIoni Bowcher RENEWAL
Ivar D ButtAustraliaIoni Bowcher RENEWAL
Juan E NestleCanadaAsiya Javayant NEW
Arvin H ShinkoCanadaAnna Fali NEW
Jefferson O FollerJapanBernardo Dominic QUALIFIED
Costa B CaldareraArgentinaIoni Bowcher QUALIFIED
Stacey C FollerRussiaElwin Sharvill NEGOTIATION
Morrow T FigeroaUnited KingdomIvan Magalhaes QUALIFIED
Greenwood G DilliardBrazilXuxue Feng NEGOTIATION
Leon K SchemmerItalyAmy Elsner QUALIFIED
Silvio T VocelkaFranceIoni Bowcher NEW
Clifford O RoysterIndiaElwin Sharvill NEW
Jennifer S FlosiUnited KingdomAmy Elsner RENEWAL
Misaki X PoquetteBrazilAnna Fali QUALIFIED
Kadeem H MarrierAustraliaOnyama Limba NEGOTIATION
Leon T MarrierCanadaIoni Bowcher NEW
Jones E SchemmerIndiaBernardo Dominic UNQUALIFIED
Juan I AmigonRussiaIvan Magalhaes NEW
Deepesh G CampainFranceIoni Bowcher RENEWAL
Antonio F AmigonRussiaAmy Elsner QUALIFIED
Octavia Y ButtAustraliaAnna Fali PROPOSAL
Julie W CaudyFranceAsiya Javayant NEGOTIATION
Faith C ChuiFranceAmy Elsner QUALIFIED
Octavia T GarufiIndiaStephen Shaw PROPOSAL
Morrow P SlusarskiFranceXuxue Feng NEGOTIATION
Jeanfrancois G WaycottArgentinaIvan Magalhaes NEW
Nicolas B PerinSpainAnna Fali UNQUALIFIED
Claire R CaldareraUnited KingdomXuxue Feng PROPOSAL
Octavia I KuskoGermanyIvan Magalhaes RENEWAL
Isabel B VocelkaItalyBernardo Dominic QUALIFIED
Jones T KuskoJapanElwin Sharvill QUALIFIED
Cody Y MorascaSpainOnyama Limba NEW
Darci K MorascaBrazilAsiya Javayant RENEWAL
Arvin H AmigonGermanyBernardo Dominic NEGOTIATION
Frozen Columns
Name
Misaki L Shinko
Rodrigues I Inouye
Nicolas I Campain
Johnson D Morasca
Tony M Bowley
Francesco N Glick
Ivar V Inouye
Francesco S Venere
Chavez G Gillian
Juan N Vocelka
Cody W Tollner
Tony L Butt
Aika U Figeroa
Antonio J Stenseth
Johnson O Wieser
Cody L Foller
Ivar A Stockham
Clifford Z Bolognia
Aika U Albares
Izzy H Ostrosky
Nicolas O Rim
Maria T Malet
Johnson Y Nestle
Claire I Oldroyd
Julie C Oldroyd
Rodrigues Z Doe
Mayumi N Gaucho
Johnson H Inouye
Murillo D Sergi
Mayumi M Ruta
Maria Y Shinko
Jeanfrancois I Gaucho
Darci Y Tollner
Jeanfrancois V Campain
Cody R Darakjy
Juan V Ostrosky
Kadeem F Dilliard
Arvin P Venere
Adams Z Chui
Chavez Q Bowley
Alejandro X Kolmetz
David Z Stockham
Julie Y Gillian
Octavia M Rim
Adams H Kolmetz
Kadeem L Stenseth
Juan X Ostrosky
Izzy P Royster
David Z Stockham
Morrow O Waycott
IdCountryDate
1000Japan2025-05-24
1001Spain2025-05-22
1002Russia2025-05-20
1003Italy2025-06-07
1004Brazil2025-06-02
1005France2025-05-24
1006Spain2025-06-10
1007Australia2025-06-10
1008Russia2025-06-02
1009United Kingdom2025-06-13
1010Russia2025-06-12
1011Russia2025-05-28
1012Brazil2025-05-28
1013Argentina2025-06-07
1014United Kingdom2025-05-30
1015Germany2025-06-06
1016Russia2025-06-13
1017Argentina2025-05-21
1018India2025-06-16
1019Italy2025-06-03
1020Argentina2025-05-21
1021Australia2025-05-24
1022Japan2025-06-01
1023Germany2025-06-10
1024Canada2025-06-14
1025Japan2025-06-15
1026India2025-05-31
1027Germany2025-05-19
1028Australia2025-06-11
1029Canada2025-05-20
1030Germany2025-06-03
1031France2025-06-09
1032Spain2025-06-05
1033France2025-06-13
1034Spain2025-06-09
1035Canada2025-06-11
1036Argentina2025-06-12
1037India2025-05-27
1038Japan2025-06-13
1039Russia2025-06-10
1040Japan2025-05-26
1041Russia2025-06-10
1042Argentina2025-06-04
1043Germany2025-05-29
1044Germany2025-06-16
1045Canada2025-06-02
1046India2025-05-21
1047Italy2025-06-02
1048Canada2025-06-07
1049Argentina2025-05-24

On-Demand Data

NameIdCountryDate
Octavia Q Nicka1000Japan2025-05-27
Juan Z Perin1001India2025-05-29
Misaki O Chui1002Russia2025-06-06
Julie I Saylors1003Argentina2025-06-02
Murillo F Waycott1004Brazil2025-05-25
Kadeem E Kolmetz1005Argentina2025-05-29
Alejandro W Stenseth1006Canada2025-05-27
Maria C Inouye1007Japan2025-06-02
Ashley W Inouye1008India2025-05-24
Morrow P Whobrey1009Argentina2025-05-29
Misaki I Vocelka1010Australia2025-05-26
Aika Q Kolmetz1011Japan2025-05-31
Greenwood D Marrier1012Australia2025-05-26
Isabel W Ferencz1013Italy2025-06-06
Leon K Malet1014Russia2025-05-30
Mujtaba B Doe1015Italy2025-05-21
Aruna A Sergi1016India2025-06-16
Faith J Saylors1017France2025-06-11
Tony G Doe1018Germany2025-05-30
Jefferson D Royster1019United Kingdom2025-05-20
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Stacey J StockhamUnited KingdomIoni Bowcher NEGOTIATION
Adams A SlusarskiUnited KingdomIvan Magalhaes RENEWAL
Francesco V DoeBrazilElwin Sharvill QUALIFIED
Salvatore S MaletUnited KingdomOnyama Limba NEGOTIATION
Izzy K VenereUnited KingdomOnyama Limba PROPOSAL
Ricardo D ShinkoAustraliaOnyama Limba UNQUALIFIED
Jennifer O RulapaughUnited KingdomElwin Sharvill UNQUALIFIED
Claire K BriddickUnited KingdomIvan Magalhaes NEGOTIATION
Mujtaba R VenereRussiaIoni Bowcher RENEWAL
Salvatore D MaletBrazilIoni Bowcher PROPOSAL
Kadeem M NickaFranceXuxue Feng NEW
Kaitlin H RulapaughSpainIoni Bowcher QUALIFIED
Isabel B RulapaughJapanAnna Fali RENEWAL
Morrow T WaycottAustraliaElwin Sharvill QUALIFIED
Darci K CampainCanadaXuxue Feng NEGOTIATION
Misaki Z GillianAustraliaStephen Shaw NEW
Nicolas X ChuiItalyIvan Magalhaes NEW
Mujtaba M MorascaUnited KingdomElwin Sharvill NEGOTIATION
Wickens Y FerenczItalyAmy Elsner NEGOTIATION
Leon Q RulapaughFranceXuxue Feng PROPOSAL
Smith Y PerinBrazilAsiya Javayant NEW
Juan I VenereArgentinaIoni Bowcher QUALIFIED
Rodrigues S RulapaughUnited KingdomIvan Magalhaes NEGOTIATION
Izzy M OldroydJapanOnyama Limba RENEWAL
Costa S InouyeItalyAnna Fali NEW
Cody V NickaItalyAsiya Javayant RENEWAL
Misaki B AmigonBrazilIoni Bowcher NEGOTIATION
Nicolas B IturbideGermanyIvan Magalhaes PROPOSAL
Francesco B StockhamIndiaStephen Shaw NEW
Aika S PaprockiCanadaBernardo Dominic UNQUALIFIED
Julie O NestleFranceAsiya Javayant RENEWAL
Munro F RimUnited KingdomIvan Magalhaes PROPOSAL
Faith E PaprockiFranceAnna Fali PROPOSAL
Leon N MarrierItalyAmy Elsner PROPOSAL
Costa Y CampainArgentinaBernardo Dominic NEW
Mujtaba N WhobreyBrazilAmy Elsner PROPOSAL
Octavia N CaudyIndiaIvan Magalhaes UNQUALIFIED
Jones P ChuiItalyIoni Bowcher UNQUALIFIED
Silvio F CaudyBrazilIoni Bowcher NEW
Jeanfrancois N VocelkaFranceIvan Magalhaes 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>