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
Chavez L PaprockiJapanStephen Shaw NEGOTIATION
Deepesh C CaudyArgentinaIoni Bowcher NEGOTIATION
Tony M ButtJapanAnna Fali PROPOSAL
James W GlickSpainAsiya Javayant NEW
Aditya S PaprockiBrazilAnna Fali NEW
Aruna E RulapaughGermanyAnna Fali NEGOTIATION
Aika X MorascaRussiaIoni Bowcher RENEWAL
Johnson U BowleyIndiaIvan Magalhaes QUALIFIED
Mujtaba F GlickRussiaAsiya Javayant NEW
Antonio P PerinFranceOnyama Limba PROPOSAL
Jeanfrancois L KolmetzFranceIoni Bowcher PROPOSAL
Adams X SaylorsArgentinaAsiya Javayant UNQUALIFIED
David C NickaArgentinaXuxue Feng PROPOSAL
Jefferson E AlbaresJapanAsiya Javayant NEW
Deepesh R VenereFranceXuxue Feng QUALIFIED
James I CaudyGermanyBernardo Dominic NEGOTIATION
Sinclair D NestleItalyStephen Shaw NEW
Kaitlin M SchemmerCanadaStephen Shaw RENEWAL
Silvio A MaletJapanBernardo Dominic UNQUALIFIED
Murillo Z BriddickJapanIvan Magalhaes PROPOSAL
Julie H CampainArgentinaElwin Sharvill RENEWAL
Tony U ButtUnited KingdomXuxue Feng NEGOTIATION
Julie J CaldareraBrazilXuxue Feng UNQUALIFIED
Mayumi J RutaUnited KingdomBernardo Dominic UNQUALIFIED
Salvatore H ButtBrazilAsiya Javayant RENEWAL
Costa Y PoquetteJapanBernardo Dominic RENEWAL
Jennifer C NickaUnited KingdomElwin Sharvill RENEWAL
Francesco U AlbaresBrazilAmy Elsner UNQUALIFIED
Sinclair K PoquetteBrazilStephen Shaw UNQUALIFIED
Claire O MarrierGermanyIvan Magalhaes UNQUALIFIED
Maria H GauchoSpainAsiya Javayant UNQUALIFIED
Deepesh W WhobreyIndiaAsiya Javayant NEW
Morrow F WaycottBrazilElwin Sharvill NEW
Claire D NestleIndiaIoni Bowcher NEW
Antonio V ShinkoArgentinaElwin Sharvill PROPOSAL
Johnson A RoysterAustraliaAmy Elsner UNQUALIFIED
Isabel L ChuiBrazilIvan Magalhaes PROPOSAL
Tony Y AlbaresJapanAsiya Javayant RENEWAL
Stacey X PaprockiUnited KingdomOnyama Limba NEGOTIATION
Izzy S MarrierFranceAsiya Javayant NEW
David N WieserIndiaIvan Magalhaes NEW
Misaki T ButtJapanXuxue Feng UNQUALIFIED
Antonio S PerinRussiaAsiya Javayant NEGOTIATION
Morrow D NickaRussiaStephen Shaw UNQUALIFIED
Wickens B CampainCanadaAmy Elsner RENEWAL
Deepesh X RoysterCanadaElwin Sharvill QUALIFIED
Jeanfrancois L GauchoArgentinaStephen Shaw UNQUALIFIED
Smith J IturbideIndiaIvan Magalhaes NEGOTIATION
Mujtaba I FerenczUnited KingdomOnyama Limba PROPOSAL
Claire B WieserGermanyIoni Bowcher UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Silvio A CaldareraUnited KingdomStephen Shaw QUALIFIED
Salvatore Z GauchoIndiaIoni Bowcher NEW
Costa X ButtSpainElwin Sharvill PROPOSAL
Izzy J StockhamBrazilXuxue Feng PROPOSAL
Izzy W PerinUnited KingdomAmy Elsner RENEWAL
Chavez H ButtBrazilAmy Elsner RENEWAL
Darci Z MorascaBrazilXuxue Feng NEW
Aika C DarakjyUnited KingdomAsiya Javayant UNQUALIFIED
Rodrigues P VenereUnited KingdomAsiya Javayant QUALIFIED
Rodrigues U IturbideAustraliaOnyama Limba RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Leja U NestleIndia2025-05-20Commercial Press NEGOTIATION26Onyama Limba
1001Deepesh S BowleyArgentina2025-05-21Chapman, Ross E Esq NEGOTIATION23Amy Elsner
1002Claire E BologniaArgentina2025-05-20King, Christopher A Esq QUALIFIED47Asiya Javayant
1003Mayumi M AmigonRussia2025-05-23Truhlar And Truhlar Attys NEGOTIATION58Ivan Magalhaes
1004Isabel A MarrierIndia2025-06-13Feltz Printing Service NEGOTIATION22Xuxue Feng
1005Emily O MaletIndia2025-05-29Feltz Printing Service NEW73Amy Elsner
1006David X ButtAustralia2025-06-14Rousseaux, Michael Esq NEW94Amy Elsner
1007David X RulapaughRussia2025-05-29Chapman, Ross E Esq UNQUALIFIED74Amy Elsner
1008Rodrigues H SchemmerBrazil2025-06-07Chemel, James L Cpa QUALIFIED76Onyama Limba
1009Kaitlin W CaudyFrance2025-05-30King, Christopher A Esq NEW61Bernardo Dominic
1010Clifford Q FlosiAustralia2025-05-30King, Christopher A Esq NEW38Onyama Limba
1011Antonio I IturbideGermany2025-06-04Morlong Associates PROPOSAL30Amy Elsner
1012Claire K OstroskyRussia2025-05-19Printing Dimensions QUALIFIED70Onyama Limba
1013Ricardo A KolmetzArgentina2025-05-28Morlong Associates QUALIFIED63Ioni Bowcher
1014Jennifer P IturbideSpain2025-05-18Chemel, James L Cpa PROPOSAL33Asiya Javayant
1015Jones Y MorascaJapan2025-06-12Morlong Associates NEW34Bernardo Dominic
1016Greenwood C VenereIndia2025-06-14Chapman, Ross E Esq UNQUALIFIED62Stephen Shaw
1017Costa M CaudyGermany2025-06-16Dorl, James J Esq UNQUALIFIED68Onyama Limba
1018Salvatore P IturbideFrance2025-06-15Dorl, James J Esq NEW7Elwin Sharvill
1019David I InouyeGermany2025-05-18Feiner Bros PROPOSAL85Asiya Javayant
1020Aditya U AlbaresRussia2025-06-10Chemel, James L Cpa NEW74Stephen Shaw
1021Chavez Q MacleadJapan2025-05-19Dorl, James J Esq RENEWAL52Asiya Javayant
1022Antonio H WhobreyJapan2025-06-12Chemel, James L Cpa NEW41Anna Fali
1023Alejandro B ChuiUnited Kingdom2025-05-26Chemel, James L Cpa NEW25Bernardo Dominic
1024Juan Y TollnerGermany2025-06-06Rousseaux, Michael Esq QUALIFIED78Stephen Shaw
1025Alejandro N SaylorsJapan2025-06-13Commercial Press QUALIFIED10Ivan Magalhaes
1026Julie Y GauchoItaly2025-05-21Printing Dimensions NEGOTIATION91Bernardo Dominic
1027Jones D BowleySpain2025-06-08Rousseaux, Michael Esq UNQUALIFIED28Anna Fali
1028Ivar F IturbideUnited Kingdom2025-05-21Dorl, James J Esq NEW23Ivan Magalhaes
1029Adams W BriddickSpain2025-05-23Truhlar And Truhlar Attys NEW19Stephen Shaw
1030Darci R VocelkaUnited Kingdom2025-06-16Chemel, James L Cpa PROPOSAL12Ivan Magalhaes
1031Munro L InouyeUnited Kingdom2025-06-12Chemel, James L Cpa PROPOSAL6Asiya Javayant
1032Tony F DilliardRussia2025-05-27Feiner Bros UNQUALIFIED6Bernardo Dominic
1033Johnson W MaletIndia2025-06-10Buckley Miller Wright NEGOTIATION78Onyama Limba
1034Ashley T SchemmerArgentina2025-06-14King, Christopher A Esq PROPOSAL77Asiya Javayant
1035David H StockhamArgentina2025-05-31Printing Dimensions NEGOTIATION79Ivan Magalhaes
1036Jennifer J StockhamIndia2025-06-16Printing Dimensions PROPOSAL91Anna Fali
1037Johnson H VenereUnited Kingdom2025-06-01Printing Dimensions QUALIFIED39Stephen Shaw
1038Salvatore X PaprockiUnited Kingdom2025-06-13Feltz Printing Service QUALIFIED95Anna Fali
1039Morrow K WhobreyCanada2025-05-20Benton, John B Jr NEGOTIATION75Ivan Magalhaes
1040Misaki D SlusarskiSpain2025-05-18Feltz Printing Service RENEWAL12Xuxue Feng
1041Maria X KuskoFrance2025-05-18Dorl, James J Esq NEGOTIATION44Anna Fali
1042Ashley T WieserJapan2025-06-07Printing Dimensions RENEWAL41Onyama Limba
1043Sinclair B ChuiSpain2025-05-28King, Christopher A Esq QUALIFIED80Anna Fali
1044Johnson T PaprockiFrance2025-05-28Benton, John B Jr QUALIFIED90Amy Elsner
1045Leja O PoquetteBrazil2025-05-25Feiner Bros UNQUALIFIED51Xuxue Feng
1046Tony L CampainItaly2025-06-05Truhlar And Truhlar Attys RENEWAL67Amy Elsner
1047Mayumi U CaudyJapan2025-06-16Feiner Bros PROPOSAL61Ivan Magalhaes
1048Ashley Q RulapaughSpain2025-06-11Printing Dimensions PROPOSAL97Asiya Javayant
1049Kadeem C KuskoGermany2025-06-12Rousseaux, Michael Esq NEGOTIATION95Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Stacey V CaldareraCanadaIvan Magalhaes NEW
Claire Z MarrierCanadaOnyama Limba NEW
Aditya P StensethUnited KingdomIoni Bowcher NEW
Aditya X StensethAustraliaAnna Fali UNQUALIFIED
Wickens P AmigonUnited KingdomAsiya Javayant PROPOSAL
Misaki T SaylorsArgentinaIoni Bowcher QUALIFIED
Kaitlin P PaprockiFranceOnyama Limba PROPOSAL
Maria S NestleFranceAmy Elsner NEW
Octavia R WhobreyCanadaAmy Elsner UNQUALIFIED
Costa V TollnerRussiaXuxue Feng RENEWAL
Francesco R SergiSpainIoni Bowcher PROPOSAL
Stacey N FollerIndiaAnna Fali RENEWAL
Francesco E ShinkoItalyAnna Fali RENEWAL
Emily D PerinBrazilElwin Sharvill NEW
Jennifer T MacleadJapanAnna Fali UNQUALIFIED
Maria F BriddickUnited KingdomAnna Fali RENEWAL
Leon T CaudyBrazilAsiya Javayant RENEWAL
Rodrigues E RimBrazilStephen Shaw UNQUALIFIED
Salvatore O ButtGermanyAnna Fali QUALIFIED
Jennifer N BologniaCanadaElwin Sharvill QUALIFIED
Kaitlin R DilliardItalyAmy Elsner NEGOTIATION
Greenwood Y MaletAustraliaElwin Sharvill UNQUALIFIED
Greenwood Z FollerAustraliaIvan Magalhaes QUALIFIED
Aruna K SlusarskiUnited KingdomAsiya Javayant PROPOSAL
Aditya G GauchoArgentinaOnyama Limba PROPOSAL
Jennifer Z MacleadBrazilElwin Sharvill RENEWAL
Nicolas D MaletSpainStephen Shaw RENEWAL
Faith J FigeroaGermanyOnyama Limba NEW
Julie K StensethRussiaAnna Fali PROPOSAL
Leon H VocelkaRussiaAmy Elsner QUALIFIED
Ricardo M MorascaFranceIvan Magalhaes NEW
David Z RulapaughUnited KingdomXuxue Feng NEGOTIATION
Francesco R VocelkaItalyBernardo Dominic PROPOSAL
Nicolas T GauchoBrazilOnyama Limba PROPOSAL
Stacey I MorascaBrazilIvan Magalhaes PROPOSAL
Chavez Y CampainAustraliaElwin Sharvill PROPOSAL
Maisha P WaycottSpainStephen Shaw RENEWAL
Leon I FerenczFranceElwin Sharvill NEGOTIATION
Kadeem W NestleSpainIvan Magalhaes NEGOTIATION
Emily L FlosiRussiaAnna Fali NEGOTIATION
Ivar X PaprockiAustraliaBernardo Dominic RENEWAL
Juan Y PerinUnited KingdomBernardo Dominic QUALIFIED
Kaitlin K FerenczItalyBernardo Dominic UNQUALIFIED
Silvio I NestleUnited KingdomXuxue Feng UNQUALIFIED
Aditya D VenereIndiaIvan Magalhaes PROPOSAL
Johnson H PerinRussiaIoni Bowcher NEGOTIATION
Rodrigues G RimUnited KingdomOnyama Limba QUALIFIED
Clifford G SlusarskiFranceIoni Bowcher RENEWAL
Julie E InouyeUnited KingdomAsiya Javayant PROPOSAL
Octavia R RulapaughCanadaIvan Magalhaes NEW
Frozen Columns
Name
Stacey Y Oldroyd
Murillo S Amigon
Maisha E Rulapaugh
Aditya R Morasca
Antonio H Kolmetz
Jones H Briddick
Ricardo J Schemmer
Leja Z Waycott
Darci X Gillian
Johnson K Ostrosky
Misaki H Shinko
Octavia O Kolmetz
Jefferson G Iturbide
Chavez N Schemmer
Nicolas Z Glick
Chavez L Kusko
Nicolas S Darakjy
Aditya D Sergi
Silvio N Whobrey
Alejandro T Stenseth
Antonio J Caudy
Darci T Vocelka
Darci Y Royster
Mayumi P Gillian
Smith E Shinko
Morrow B Ostrosky
James F Marrier
Johnson T Garufi
Johnson J Malet
Nicolas F Bolognia
Aruna S Royster
Cody S Amigon
Izzy S Figeroa
Faith I Chui
Misaki J Glick
Nicolas Z Maclead
Chavez N Wieser
Morrow L Garufi
Smith D Morasca
Octavia M Flosi
Adams A Morasca
Aika J Marrier
Kadeem A Malet
Smith I Schemmer
Jeanfrancois X Tollner
Arvin B Slusarski
Ricardo Y Tollner
Ricardo C Bowley
Alejandro U Paprocki
James S Ostrosky
IdCountryDate
1000Germany2025-05-27
1001United Kingdom2025-05-20
1002Spain2025-05-29
1003Argentina2025-05-30
1004Argentina2025-06-13
1005Australia2025-06-08
1006Brazil2025-05-31
1007Italy2025-05-21
1008Japan2025-05-21
1009United Kingdom2025-05-22
1010Japan2025-06-10
1011Brazil2025-06-09
1012Argentina2025-06-04
1013United Kingdom2025-06-10
1014Germany2025-06-11
1015Japan2025-05-20
1016France2025-05-22
1017Canada2025-06-09
1018Argentina2025-05-18
1019Canada2025-06-01
1020Spain2025-06-08
1021Germany2025-05-19
1022Brazil2025-06-14
1023Australia2025-05-25
1024Japan2025-05-22
1025India2025-06-01
1026Japan2025-06-12
1027Brazil2025-05-31
1028Australia2025-05-22
1029France2025-05-28
1030Italy2025-06-12
1031Italy2025-06-10
1032Russia2025-05-23
1033Russia2025-06-07
1034Spain2025-05-19
1035India2025-05-19
1036Canada2025-05-26
1037United Kingdom2025-06-03
1038Italy2025-06-08
1039Italy2025-06-02
1040Japan2025-06-03
1041Russia2025-05-31
1042Brazil2025-06-02
1043United Kingdom2025-05-31
1044Italy2025-05-27
1045France2025-05-27
1046Russia2025-06-09
1047Russia2025-06-04
1048France2025-06-12
1049Argentina2025-06-16

On-Demand Data

NameIdCountryDate
Aika W Garufi1000Germany2025-05-31
Francesco W Paprocki1001Japan2025-05-21
Mujtaba X Royster1002United Kingdom2025-06-16
Leon Y Nicka1003Canada2025-06-01
Smith T Nestle1004Russia2025-05-19
Isabel M Stenseth1005Australia2025-06-03
Aditya O Marrier1006Russia2025-06-01
Isabel C Caldarera1007Germany2025-06-15
Isabel D Iturbide1008Spain2025-05-23
Octavia T Tollner1009Spain2025-06-07
Stacey Y Doe1010Italy2025-05-30
James Z Foller1011Italy2025-05-29
Deepesh H Perin1012France2025-06-03
Morrow B Kusko1013Italy2025-06-10
Greenwood T Royster1014Russia2025-05-19
Francesco M Kolmetz1015Italy2025-05-30
Ricardo C Foller1016Germany2025-06-03
David V Rim1017Germany2025-05-25
Silvio F Malet1018Spain2025-06-08
Leja Z Amigon1019Spain2025-05-19
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Murillo N MorascaIndiaIvan Magalhaes QUALIFIED
Smith N VocelkaAustraliaOnyama Limba NEW
Julie Z SergiItalyElwin Sharvill UNQUALIFIED
James W KolmetzItalyAnna Fali RENEWAL
Aika W NestleItalyIvan Magalhaes NEGOTIATION
Mayumi P FigeroaIndiaAmy Elsner PROPOSAL
Claire M ChuiBrazilBernardo Dominic RENEWAL
Antonio I MarrierIndiaElwin Sharvill NEGOTIATION
Smith A VenereCanadaElwin Sharvill NEW
Juan B CaudyRussiaIoni Bowcher UNQUALIFIED
Izzy B SchemmerFranceAsiya Javayant RENEWAL
Aruna G RutaRussiaIoni Bowcher RENEWAL
Isabel M StensethArgentinaAmy Elsner PROPOSAL
Julie S RutaItalyIvan Magalhaes UNQUALIFIED
Emily R BowleyRussiaIvan Magalhaes QUALIFIED
Maria F ChuiUnited KingdomXuxue Feng PROPOSAL
Cody H GlickJapanElwin Sharvill QUALIFIED
David K OldroydIndiaAsiya Javayant UNQUALIFIED
Smith J GlickArgentinaBernardo Dominic NEW
Clifford O MorascaIndiaElwin Sharvill RENEWAL
Ashley O InouyeGermanyXuxue Feng UNQUALIFIED
Misaki J IturbideRussiaAmy Elsner PROPOSAL
Maisha O IturbideAustraliaAsiya Javayant RENEWAL
Leja Y StockhamUnited KingdomAmy Elsner NEW
Leja V GarufiIndiaAnna Fali RENEWAL
Darci Q RutaIndiaIvan Magalhaes QUALIFIED
Costa M CaldareraAustraliaAnna Fali NEGOTIATION
Jennifer M NickaUnited KingdomElwin Sharvill QUALIFIED
Nicolas F AlbaresAustraliaAsiya Javayant QUALIFIED
David L ShinkoIndiaXuxue Feng QUALIFIED
Arvin P ChuiUnited KingdomAnna Fali RENEWAL
Chavez X AmigonUnited KingdomAsiya Javayant UNQUALIFIED
Julie C ShinkoUnited KingdomAnna Fali QUALIFIED
Maria B MarrierItalyXuxue Feng UNQUALIFIED
Cody X OstroskyBrazilElwin Sharvill PROPOSAL
Nicolas B PoquetteGermanyOnyama Limba UNQUALIFIED
Mujtaba X PaprockiGermanyIoni Bowcher RENEWAL
Costa Z NestleRussiaXuxue Feng UNQUALIFIED
Tony T CampainRussiaAmy Elsner NEGOTIATION
Salvatore Q RimItalyAmy Elsner NEGOTIATION

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