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
Claire V SaylorsFranceIoni Bowcher QUALIFIED
Cody V OldroydJapanIoni Bowcher UNQUALIFIED
Sinclair S AlbaresBrazilElwin Sharvill QUALIFIED
Antonio M AlbaresUnited KingdomAsiya Javayant UNQUALIFIED
Rodrigues T SergiFranceBernardo Dominic UNQUALIFIED
Nicolas C BologniaCanadaElwin Sharvill RENEWAL
Salvatore K RimFranceOnyama Limba PROPOSAL
Silvio X PerinJapanIvan Magalhaes QUALIFIED
Isabel L GillianArgentinaStephen Shaw NEGOTIATION
James J MorascaSpainIvan Magalhaes PROPOSAL
Alejandro R FerenczFranceXuxue Feng UNQUALIFIED
Morrow R BologniaJapanIoni Bowcher QUALIFIED
Leon O InouyeFranceStephen Shaw PROPOSAL
James H FlosiFranceStephen Shaw PROPOSAL
Munro E VenereItalyOnyama Limba RENEWAL
Rodrigues V GarufiUnited KingdomIoni Bowcher PROPOSAL
Nicolas N RutaCanadaBernardo Dominic PROPOSAL
Jeanfrancois L DilliardUnited KingdomOnyama Limba NEW
Jennifer T DarakjySpainIvan Magalhaes NEGOTIATION
Maria W ChuiBrazilAmy Elsner UNQUALIFIED
David T StockhamAustraliaAmy Elsner QUALIFIED
Cody R StensethAustraliaOnyama Limba QUALIFIED
Juan M RutaJapanBernardo Dominic UNQUALIFIED
Leja D DarakjyCanadaElwin Sharvill UNQUALIFIED
Ashley B ShinkoUnited KingdomOnyama Limba RENEWAL
David I IturbideGermanyElwin Sharvill RENEWAL
David M SchemmerJapanIvan Magalhaes PROPOSAL
Ivar I NickaCanadaBernardo Dominic NEGOTIATION
Sinclair Q RoysterCanadaXuxue Feng RENEWAL
Johnson F MarrierAustraliaOnyama Limba QUALIFIED
James N InouyeFranceOnyama Limba NEGOTIATION
Aruna S PerinIndiaBernardo Dominic PROPOSAL
Emily J AlbaresJapanAnna Fali PROPOSAL
Alejandro V GlickGermanyBernardo Dominic UNQUALIFIED
Costa O MaletRussiaIvan Magalhaes NEGOTIATION
Morrow J SaylorsSpainBernardo Dominic NEGOTIATION
Darci O VenereJapanIoni Bowcher RENEWAL
Mayumi U RutaArgentinaIvan Magalhaes UNQUALIFIED
Antonio P AmigonAustraliaBernardo Dominic RENEWAL
Kaitlin M StockhamUnited KingdomIoni Bowcher NEW
Aika X KuskoArgentinaAnna Fali NEGOTIATION
Murillo J DoeSpainBernardo Dominic RENEWAL
Silvio U BologniaArgentinaAsiya Javayant PROPOSAL
Juan D AmigonGermanyOnyama Limba RENEWAL
Aika Y TollnerArgentinaStephen Shaw UNQUALIFIED
Faith X PerinBrazilAmy Elsner RENEWAL
Julie D TollnerUnited KingdomAmy Elsner NEGOTIATION
Darci O NestleArgentinaStephen Shaw NEW
Clifford W FlosiAustraliaAmy Elsner UNQUALIFIED
Murillo B TollnerRussiaXuxue Feng RENEWAL
Horizontal
NameCountryRepresentativeStatus
Smith A BologniaAustraliaXuxue Feng RENEWAL
Mujtaba A ShinkoRussiaIoni Bowcher UNQUALIFIED
Darci E KolmetzSpainAsiya Javayant UNQUALIFIED
Leon W KolmetzCanadaAnna Fali NEW
Sinclair N PaprockiFranceElwin Sharvill RENEWAL
Emily L MarrierAustraliaIoni Bowcher UNQUALIFIED
Ricardo B FigeroaRussiaIvan Magalhaes PROPOSAL
Tony B RutaIndiaXuxue Feng PROPOSAL
Aruna H NickaJapanAsiya Javayant RENEWAL
Nicolas B BowleyIndiaXuxue Feng NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Misaki J SaylorsCanada2025-05-29King, Christopher A Esq RENEWAL50Stephen Shaw
1001Aika H TollnerFrance2025-06-04Rangoni Of Florence RENEWAL83Asiya Javayant
1002Mayumi D GauchoItaly2025-06-13Feltz Printing Service QUALIFIED1Amy Elsner
1003Mujtaba M AmigonIndia2025-05-28King, Christopher A Esq UNQUALIFIED26Bernardo Dominic
1004Aruna Y RoysterArgentina2025-05-27Chanay, Jeffrey A Esq UNQUALIFIED60Amy Elsner
1005Maria M FerenczIndia2025-06-05King, Christopher A Esq PROPOSAL74Bernardo Dominic
1006Julie A GauchoIndia2025-05-21Commercial Press PROPOSAL87Bernardo Dominic
1007Darci J DarakjyGermany2025-05-23Morlong Associates UNQUALIFIED16Amy Elsner
1008Ashley Y BologniaArgentina2025-05-31Buckley Miller Wright UNQUALIFIED49Anna Fali
1009Morrow U FerenczAustralia2025-06-06Buckley Miller Wright NEW37Elwin Sharvill
1010Adams H MorascaRussia2025-05-28Rousseaux, Michael Esq NEW1Anna Fali
1011Arvin Y BriddickUnited Kingdom2025-06-02Chemel, James L Cpa PROPOSAL76Ivan Magalhaes
1012Darci E WieserFrance2025-06-02Chanay, Jeffrey A Esq QUALIFIED0Ioni Bowcher
1013Cody V GillianGermany2025-06-03Morlong Associates NEGOTIATION26Ioni Bowcher
1014Aika D PaprockiSpain2025-06-12Benton, John B Jr QUALIFIED95Amy Elsner
1015Murillo P WhobreyArgentina2025-05-19Rangoni Of Florence QUALIFIED43Amy Elsner
1016Morrow U VocelkaIndia2025-06-16Chanay, Jeffrey A Esq UNQUALIFIED82Bernardo Dominic
1017Leon R CampainAustralia2025-06-08Rangoni Of Florence NEGOTIATION21Elwin Sharvill
1018Cody H InouyeJapan2025-05-30Buckley Miller Wright NEW47Amy Elsner
1019Munro A CampainGermany2025-06-06Rangoni Of Florence UNQUALIFIED28Asiya Javayant
1020Murillo Y GlickUnited Kingdom2025-06-08Feiner Bros NEGOTIATION10Amy Elsner
1021Stacey Q PoquetteJapan2025-06-04Morlong Associates NEGOTIATION50Anna Fali
1022Mayumi E VenereSpain2025-06-04King, Christopher A Esq NEGOTIATION71Amy Elsner
1023Deepesh E NickaGermany2025-06-02Truhlar And Truhlar Attys PROPOSAL78Amy Elsner
1024Kadeem X GlickGermany2025-06-12Feltz Printing Service NEGOTIATION82Xuxue Feng
1025Tony F SergiSpain2025-06-04Rangoni Of Florence QUALIFIED25Anna Fali
1026Faith O DoeSpain2025-05-25Dorl, James J Esq PROPOSAL84Onyama Limba
1027Maria W CampainArgentina2025-06-14Benton, John B Jr QUALIFIED24Xuxue Feng
1028Smith Q GillianArgentina2025-05-23Buckley Miller Wright UNQUALIFIED77Ivan Magalhaes
1029Greenwood S PaprockiUnited Kingdom2025-05-29King, Christopher A Esq QUALIFIED41Stephen Shaw
1030James I GillianSpain2025-05-25Rangoni Of Florence QUALIFIED61Stephen Shaw
1031Arvin W DilliardSpain2025-06-02King, Christopher A Esq PROPOSAL75Bernardo Dominic
1032Isabel K IturbideRussia2025-05-25Chemel, James L Cpa NEGOTIATION37Elwin Sharvill
1033Silvio M SchemmerItaly2025-06-07Feiner Bros NEGOTIATION6Ivan Magalhaes
1034Munro X ShinkoRussia2025-06-12Buckley Miller Wright RENEWAL89Bernardo Dominic
1035Maria Z GarufiBrazil2025-05-26Chapman, Ross E Esq NEGOTIATION16Bernardo Dominic
1036Arvin S GlickBrazil2025-06-07Buckley Miller Wright RENEWAL10Asiya Javayant
1037Morrow F OldroydArgentina2025-06-03Truhlar And Truhlar Attys PROPOSAL75Anna Fali
1038Emily Y PerinRussia2025-06-05Dorl, James J Esq QUALIFIED99Xuxue Feng
1039Salvatore D DilliardAustralia2025-06-15Commercial Press UNQUALIFIED1Anna Fali
1040Mujtaba S PoquetteArgentina2025-06-15Chemel, James L Cpa RENEWAL44Stephen Shaw
1041Jennifer D OldroydRussia2025-05-23Dorl, James J Esq UNQUALIFIED2Anna Fali
1042Clifford L FerenczIndia2025-05-28Chemel, James L Cpa RENEWAL5Onyama Limba
1043Mayumi C NickaRussia2025-06-14Feiner Bros UNQUALIFIED19Asiya Javayant
1044Mayumi R ShinkoGermany2025-05-24Morlong Associates UNQUALIFIED31Ivan Magalhaes
1045Darci S AlbaresIndia2025-05-23Feiner Bros NEGOTIATION80Onyama Limba
1046Octavia C MaletItaly2025-05-27Morlong Associates UNQUALIFIED51Onyama Limba
1047Deepesh O FlosiGermany2025-06-12Printing Dimensions NEGOTIATION46Elwin Sharvill
1048Octavia E MacleadBrazil2025-06-11Morlong Associates UNQUALIFIED97Onyama Limba
1049Izzy U OldroydSpain2025-05-25Rangoni Of Florence NEGOTIATION31Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
James V OstroskyAustraliaIoni Bowcher UNQUALIFIED
Jeanfrancois J PerinJapanBernardo Dominic PROPOSAL
Wickens P GauchoFranceAnna Fali NEGOTIATION
Alejandro D ShinkoCanadaIoni Bowcher QUALIFIED
Morrow P IturbideItalyOnyama Limba NEW
Ricardo O NickaAustraliaBernardo Dominic RENEWAL
Kaitlin F PaprockiGermanyAmy Elsner UNQUALIFIED
Darci V WieserArgentinaAnna Fali PROPOSAL
Nicolas N SaylorsBrazilOnyama Limba NEW
Ashley K BowleyGermanyIvan Magalhaes QUALIFIED
Tony B DilliardRussiaIvan Magalhaes NEW
Aditya A KuskoAustraliaAmy Elsner PROPOSAL
Octavia L KuskoIndiaIoni Bowcher UNQUALIFIED
Kadeem J KolmetzArgentinaStephen Shaw NEGOTIATION
Murillo H PoquetteArgentinaIoni Bowcher PROPOSAL
Faith Y OstroskyBrazilElwin Sharvill RENEWAL
Jeanfrancois G DilliardItalyOnyama Limba QUALIFIED
Deepesh C RulapaughFranceOnyama Limba NEW
Misaki P SaylorsIndiaXuxue Feng RENEWAL
Jefferson N SlusarskiGermanyStephen Shaw NEGOTIATION
Maisha L GillianItalyIvan Magalhaes QUALIFIED
Salvatore C CaldareraGermanyStephen Shaw UNQUALIFIED
Faith L BowleyUnited KingdomBernardo Dominic PROPOSAL
James C OldroydBrazilAnna Fali PROPOSAL
Emily A DarakjyGermanyBernardo Dominic PROPOSAL
Antonio A InouyeIndiaElwin Sharvill PROPOSAL
Munro Z OldroydUnited KingdomAsiya Javayant NEGOTIATION
Maria P ButtRussiaAsiya Javayant UNQUALIFIED
Arvin V CampainBrazilIoni Bowcher NEW
David X GarufiItalyAnna Fali RENEWAL
Francesco P MorascaUnited KingdomOnyama Limba NEW
Jones D DilliardArgentinaAmy Elsner NEGOTIATION
Adams I OstroskyRussiaBernardo Dominic NEW
Emily T NestleBrazilIvan Magalhaes UNQUALIFIED
Antonio L ChuiSpainAnna Fali NEGOTIATION
Sinclair D VocelkaGermanyStephen Shaw UNQUALIFIED
Jones L KuskoBrazilIvan Magalhaes UNQUALIFIED
Smith A RimRussiaXuxue Feng NEGOTIATION
Izzy Y AmigonAustraliaIoni Bowcher PROPOSAL
Isabel H SaylorsGermanyXuxue Feng RENEWAL
Ashley C TollnerJapanBernardo Dominic UNQUALIFIED
Aruna D IturbideArgentinaIvan Magalhaes RENEWAL
Francesco D CaudyCanadaStephen Shaw RENEWAL
Cody W MacleadJapanIvan Magalhaes RENEWAL
James Z GauchoJapanAnna Fali NEGOTIATION
Jeanfrancois P BowleyGermanyStephen Shaw RENEWAL
David D PoquetteBrazilBernardo Dominic UNQUALIFIED
Isabel P WhobreyGermanyBernardo Dominic NEW
Mayumi K NestleJapanElwin Sharvill PROPOSAL
Wickens Y MorascaCanadaIvan Magalhaes NEGOTIATION
Frozen Columns
Name
Clifford B Caldarera
Faith X Oldroyd
Rodrigues T Venere
Tony H Glick
Maria I Maclead
Tony T Saylors
Murillo X Caudy
Munro U Waycott
Arvin Z Rulapaugh
Claire E Dilliard
Isabel N Doe
Johnson O Shinko
Smith P Chui
Aika Z Iturbide
Kadeem E Perin
Ricardo A Iturbide
Stacey V Dilliard
Arvin S Royster
Chavez E Iturbide
Mayumi Z Waycott
Aika A Glick
Nicolas U Darakjy
Johnson Q Darakjy
Aruna Y Stockham
Aruna A Nicka
Stacey C Royster
Sinclair X Albares
Smith S Albares
Ricardo N Malet
Mayumi F Tollner
Emily U Amigon
Claire I Albares
Silvio N Bowley
Chavez K Rim
Jones M Briddick
Leja U Ruta
Cody E Malet
Munro M Schemmer
Wickens M Figeroa
Costa A Tollner
Aditya P Gillian
James M Bolognia
Emily D Wieser
Claire L Kusko
Antonio H Flosi
Emily W Butt
Maisha Y Paprocki
Costa G Poquette
Stacey J Malet
Wickens L Dilliard
IdCountryDate
1000Japan2025-06-13
1001France2025-05-24
1002United Kingdom2025-06-09
1003India2025-05-25
1004India2025-05-20
1005United Kingdom2025-06-02
1006Australia2025-06-12
1007Brazil2025-06-01
1008Canada2025-06-11
1009France2025-05-19
1010India2025-05-27
1011United Kingdom2025-06-14
1012Japan2025-05-29
1013Argentina2025-06-12
1014Russia2025-06-07
1015Brazil2025-06-02
1016Italy2025-05-23
1017Italy2025-06-16
1018Argentina2025-06-07
1019India2025-06-15
1020Spain2025-06-04
1021India2025-06-13
1022Japan2025-06-12
1023Australia2025-05-23
1024Italy2025-06-09
1025Canada2025-06-13
1026France2025-05-20
1027Brazil2025-06-08
1028Russia2025-05-25
1029France2025-06-02
1030Germany2025-05-23
1031France2025-06-06
1032Brazil2025-06-14
1033Argentina2025-05-21
1034Argentina2025-05-26
1035Brazil2025-06-03
1036Brazil2025-06-10
1037Italy2025-06-13
1038Argentina2025-06-16
1039Brazil2025-05-26
1040Italy2025-06-10
1041Brazil2025-05-24
1042Spain2025-06-05
1043Germany2025-06-04
1044Russia2025-06-13
1045Italy2025-06-06
1046India2025-06-02
1047Germany2025-06-02
1048Germany2025-05-22
1049France2025-05-31

On-Demand Data

NameIdCountryDate
Wickens S Nicka1000France2025-06-04
Sinclair C Doe1001Argentina2025-06-14
Jones J Gillian1002Italy2025-06-16
Clifford I Nestle1003Italy2025-06-13
Ashley J Flosi1004India2025-06-14
Maisha T Stenseth1005Japan2025-05-18
Rodrigues N Kusko1006United Kingdom2025-05-19
Aditya D Kusko1007France2025-06-09
Antonio F Garufi1008Russia2025-06-16
Emily Q Maclead1009Canada2025-06-07
Salvatore O Saylors1010Brazil2025-05-21
Ivar R Morasca1011Germany2025-05-23
Jeanfrancois P Tollner1012France2025-05-24
Mayumi M Figeroa1013Japan2025-06-10
Mujtaba S Doe1014Russia2025-06-05
Silvio N Doe1015Canada2025-05-22
Clifford L Royster1016Brazil2025-06-13
Jones S Tollner1017Brazil2025-06-11
Faith T Doe1018Brazil2025-06-13
Munro L Ruta1019Argentina2025-06-07
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Munro P MaletFranceElwin Sharvill NEGOTIATION
Ivar R MacleadBrazilAmy Elsner NEGOTIATION
Faith M RulapaughSpainAmy Elsner UNQUALIFIED
Chavez T SlusarskiGermanyAnna Fali NEW
Smith Q MaletSpainAnna Fali QUALIFIED
Maria P DilliardGermanyIoni Bowcher QUALIFIED
Octavia Q RutaGermanyAsiya Javayant NEW
Jennifer I SlusarskiArgentinaIoni Bowcher NEW
Chavez N NickaFranceAnna Fali QUALIFIED
Rodrigues D OstroskyArgentinaIoni Bowcher RENEWAL
Maria K RimAustraliaAmy Elsner UNQUALIFIED
Kaitlin M RulapaughFranceAmy Elsner PROPOSAL
Deepesh D WhobreyCanadaStephen Shaw UNQUALIFIED
Maria B MaletIndiaIvan Magalhaes RENEWAL
Tony H TollnerItalyElwin Sharvill NEW
Ashley P SlusarskiBrazilAnna Fali QUALIFIED
Octavia Q BriddickSpainAsiya Javayant QUALIFIED
Darci Q KuskoRussiaAsiya Javayant PROPOSAL
Leja X PoquetteBrazilXuxue Feng UNQUALIFIED
Maria D VocelkaCanadaIoni Bowcher NEW
Emily M MaletAustraliaAsiya Javayant NEGOTIATION
Adams N DarakjyFranceStephen Shaw PROPOSAL
Darci D SaylorsJapanAnna Fali RENEWAL
Deepesh G BowleyRussiaAnna Fali NEW
Aruna W MarrierIndiaAsiya Javayant NEW
Rodrigues T DarakjyGermanyIoni Bowcher PROPOSAL
Murillo M RimSpainStephen Shaw PROPOSAL
Aruna V DarakjyFranceElwin Sharvill RENEWAL
Aditya G MacleadGermanyXuxue Feng QUALIFIED
Juan Y AlbaresRussiaStephen Shaw QUALIFIED
Ashley S StensethCanadaAsiya Javayant QUALIFIED
Octavia U GarufiFranceIvan Magalhaes PROPOSAL
Kadeem I RimItalyAsiya Javayant PROPOSAL
Silvio X GauchoFranceBernardo Dominic NEW
Maisha C BologniaRussiaStephen Shaw QUALIFIED
Jennifer E KolmetzArgentinaAmy Elsner UNQUALIFIED
Francesco W CaudySpainIvan Magalhaes NEW
Leja S VocelkaCanadaXuxue Feng QUALIFIED
Mayumi W SlusarskiUnited KingdomOnyama Limba PROPOSAL
Wickens F FlosiFranceIoni Bowcher 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>