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
Murillo Y VocelkaUnited KingdomStephen Shaw UNQUALIFIED
Maria B StensethBrazilAmy Elsner NEW
Ivar Z GauchoIndiaBernardo Dominic RENEWAL
Morrow A AmigonFranceOnyama Limba UNQUALIFIED
David H PerinGermanyElwin Sharvill UNQUALIFIED
Jennifer U MacleadGermanyAmy Elsner QUALIFIED
Jeanfrancois K OldroydFranceAmy Elsner UNQUALIFIED
James T CaudyItalyOnyama Limba NEW
Cody I FollerAustraliaBernardo Dominic NEGOTIATION
Costa G BologniaRussiaAsiya Javayant PROPOSAL
Julie E GarufiUnited KingdomIoni Bowcher NEGOTIATION
Deepesh M BologniaUnited KingdomIvan Magalhaes NEGOTIATION
Stacey M BologniaRussiaIvan Magalhaes NEGOTIATION
Murillo S WieserCanadaAsiya Javayant RENEWAL
Sinclair W NestleIndiaStephen Shaw RENEWAL
Ricardo O AmigonIndiaBernardo Dominic PROPOSAL
Jefferson Y DilliardGermanyXuxue Feng RENEWAL
Johnson V VocelkaUnited KingdomXuxue Feng NEGOTIATION
Stacey K VenereRussiaAnna Fali NEW
Juan T KolmetzSpainXuxue Feng NEW
James N BriddickAustraliaAnna Fali NEGOTIATION
Morrow J PaprockiJapanAmy Elsner RENEWAL
Chavez K StockhamGermanyAsiya Javayant RENEWAL
Maria T FigeroaItalyBernardo Dominic NEW
Julie P RimFranceAnna Fali RENEWAL
Chavez Z SchemmerIndiaAnna Fali NEW
Jeanfrancois S BologniaGermanyXuxue Feng RENEWAL
Cody X CaldareraAustraliaIvan Magalhaes NEW
Wickens Z RoysterRussiaOnyama Limba NEGOTIATION
Silvio R DarakjyUnited KingdomAmy Elsner UNQUALIFIED
Arvin S PerinUnited KingdomStephen Shaw QUALIFIED
Cody S GillianAustraliaElwin Sharvill UNQUALIFIED
Jennifer K KuskoJapanBernardo Dominic UNQUALIFIED
Kaitlin F StensethGermanyAsiya Javayant NEW
Juan P SlusarskiUnited KingdomAsiya Javayant RENEWAL
Izzy A BriddickJapanAmy Elsner UNQUALIFIED
Rodrigues W NestleUnited KingdomStephen Shaw QUALIFIED
Maisha A GarufiArgentinaBernardo Dominic NEGOTIATION
James F RutaFranceAsiya Javayant PROPOSAL
Jeanfrancois O MaletItalyAsiya Javayant UNQUALIFIED
Aika L CaldareraJapanAnna Fali QUALIFIED
Izzy L PaprockiCanadaAsiya Javayant NEGOTIATION
Jones I FigeroaArgentinaAnna Fali NEW
Arvin E GillianBrazilXuxue Feng RENEWAL
James K AlbaresGermanyAmy Elsner PROPOSAL
Aruna K DarakjyAustraliaAsiya Javayant RENEWAL
Costa D TollnerArgentinaElwin Sharvill NEGOTIATION
Leon I GillianFranceStephen Shaw RENEWAL
Jeanfrancois E ShinkoArgentinaAnna Fali PROPOSAL
Misaki E FerenczSpainIvan Magalhaes RENEWAL
Horizontal
NameCountryRepresentativeStatus
Aditya M MaletSpainIoni Bowcher PROPOSAL
James J MaletSpainBernardo Dominic QUALIFIED
Ivar J MaletAustraliaIvan Magalhaes RENEWAL
Emily D SaylorsRussiaAsiya Javayant NEW
Antonio E TollnerItalyIvan Magalhaes QUALIFIED
Julie R VocelkaUnited KingdomIvan Magalhaes NEW
Emily Z NestleGermanyAmy Elsner RENEWAL
Johnson Z MaletItalyIoni Bowcher PROPOSAL
James B OldroydSpainXuxue Feng NEW
Jefferson A SaylorsRussiaOnyama Limba RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Deepesh L OldroydSpain2025-05-22Chapman, Ross E Esq QUALIFIED3Anna Fali
1001Jeanfrancois V PoquetteCanada2025-05-25Benton, John B Jr NEW94Asiya Javayant
1002Mayumi M MorascaUnited Kingdom2025-05-17Feiner Bros UNQUALIFIED36Ioni Bowcher
1003Leon T ChuiUnited Kingdom2025-05-20Printing Dimensions PROPOSAL94Bernardo Dominic
1004Aditya K MacleadGermany2025-06-07Chanay, Jeffrey A Esq RENEWAL5Anna Fali
1005Morrow A MarrierUnited Kingdom2025-05-27Benton, John B Jr UNQUALIFIED79Amy Elsner
1006Clifford Q GarufiAustralia2025-06-12Feltz Printing Service PROPOSAL33Anna Fali
1007Jennifer E GarufiAustralia2025-06-13Chapman, Ross E Esq PROPOSAL40Anna Fali
1008Aruna S KolmetzBrazil2025-05-16Feltz Printing Service UNQUALIFIED54Stephen Shaw
1009Leja G KuskoJapan2025-05-23Benton, John B Jr PROPOSAL98Ivan Magalhaes
1010Izzy L VocelkaFrance2025-05-30Printing Dimensions QUALIFIED88Asiya Javayant
1011Nicolas R DilliardSpain2025-05-27Rangoni Of Florence PROPOSAL33Ivan Magalhaes
1012Mujtaba W VenereRussia2025-05-30Feiner Bros NEW25Amy Elsner
1013Sinclair E GarufiAustralia2025-05-20Commercial Press NEW76Onyama Limba
1014Aika A ChuiItaly2025-06-10Chapman, Ross E Esq RENEWAL6Anna Fali
1015Chavez Y PerinGermany2025-05-19King, Christopher A Esq NEGOTIATION83Elwin Sharvill
1016Wickens L BowleyJapan2025-06-12Buckley Miller Wright NEGOTIATION40Ivan Magalhaes
1017Aditya X CampainJapan2025-05-18Benton, John B Jr NEW21Stephen Shaw
1018Francesco A DilliardBrazil2025-05-24Dorl, James J Esq UNQUALIFIED47Xuxue Feng
1019Salvatore R OldroydArgentina2025-05-22Chemel, James L Cpa NEW63Asiya Javayant
1020Francesco D SaylorsSpain2025-06-10Commercial Press RENEWAL88Ioni Bowcher
1021Tony H CaldareraArgentina2025-05-18Buckley Miller Wright QUALIFIED12Anna Fali
1022Cody Y TollnerArgentina2025-05-16Rangoni Of Florence NEGOTIATION6Elwin Sharvill
1023James Z GauchoJapan2025-06-09King, Christopher A Esq NEW32Ioni Bowcher
1024Kadeem W SergiItaly2025-05-21Commercial Press NEGOTIATION9Ivan Magalhaes
1025Mayumi L KuskoBrazil2025-06-05Feltz Printing Service QUALIFIED26Anna Fali
1026Morrow W PaprockiArgentina2025-05-30Rangoni Of Florence UNQUALIFIED77Amy Elsner
1027Johnson V BologniaBrazil2025-05-28Morlong Associates RENEWAL54Xuxue Feng
1028Jeanfrancois B KuskoArgentina2025-05-29Chanay, Jeffrey A Esq QUALIFIED7Bernardo Dominic
1029Leja T GillianArgentina2025-05-16Chapman, Ross E Esq NEGOTIATION41Elwin Sharvill
1030Emily C StockhamGermany2025-06-04Benton, John B Jr RENEWAL61Ioni Bowcher
1031Smith U WieserIndia2025-05-20Printing Dimensions NEGOTIATION26Ivan Magalhaes
1032Claire Q WieserCanada2025-05-28Benton, John B Jr NEGOTIATION2Amy Elsner
1033Chavez M GillianItaly2025-06-02Printing Dimensions NEGOTIATION43Bernardo Dominic
1034Greenwood T RoysterRussia2025-05-25Morlong Associates PROPOSAL86Amy Elsner
1035Kadeem I AmigonGermany2025-06-04Feiner Bros QUALIFIED56Anna Fali
1036James P KolmetzFrance2025-06-03Chemel, James L Cpa QUALIFIED70Xuxue Feng
1037Jeanfrancois Y SaylorsUnited Kingdom2025-05-18King, Christopher A Esq UNQUALIFIED46Anna Fali
1038Misaki I SchemmerRussia2025-05-25Dorl, James J Esq NEW96Asiya Javayant
1039Kadeem D PerinBrazil2025-06-11Chapman, Ross E Esq RENEWAL83Bernardo Dominic
1040Juan N IturbideItaly2025-05-26Feiner Bros RENEWAL38Amy Elsner
1041Nicolas B RimGermany2025-05-26Morlong Associates UNQUALIFIED85Ivan Magalhaes
1042Nicolas E SergiGermany2025-05-18Chapman, Ross E Esq UNQUALIFIED7Elwin Sharvill
1043Wickens K GarufiUnited Kingdom2025-06-13Dorl, James J Esq NEGOTIATION57Asiya Javayant
1044Aruna D RulapaughItaly2025-05-22Truhlar And Truhlar Attys UNQUALIFIED64Ivan Magalhaes
1045Wickens U CaldareraRussia2025-06-09Morlong Associates RENEWAL67Anna Fali
1046Aika D DilliardGermany2025-06-11Printing Dimensions NEW51Amy Elsner
1047Faith C DoeJapan2025-05-17Benton, John B Jr NEW14Asiya Javayant
1048Francesco A MaletUnited Kingdom2025-06-07Buckley Miller Wright NEW11Xuxue Feng
1049Ricardo H StensethUnited Kingdom2025-06-05Chapman, Ross E Esq NEGOTIATION89Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Isabel U DilliardGermanyBernardo Dominic UNQUALIFIED
Izzy S PaprockiUnited KingdomAmy Elsner NEW
Antonio G FerenczBrazilBernardo Dominic PROPOSAL
Stacey Q FigeroaArgentinaOnyama Limba QUALIFIED
Silvio N FollerBrazilAnna Fali UNQUALIFIED
Deepesh Y DoeSpainAsiya Javayant PROPOSAL
Darci W StockhamRussiaIoni Bowcher UNQUALIFIED
Greenwood U FigeroaUnited KingdomOnyama Limba QUALIFIED
Silvio G WaycottJapanElwin Sharvill PROPOSAL
Deepesh J DoeFranceStephen Shaw UNQUALIFIED
Leja G RutaJapanAnna Fali PROPOSAL
Clifford Q SlusarskiItalyBernardo Dominic NEW
Darci V MaletIndiaIvan Magalhaes PROPOSAL
Mayumi X AmigonCanadaIvan Magalhaes RENEWAL
Aditya S KolmetzSpainAsiya Javayant NEW
Juan D FerenczJapanIvan Magalhaes UNQUALIFIED
Alejandro B RulapaughGermanyAnna Fali RENEWAL
Kadeem H RutaCanadaIvan Magalhaes RENEWAL
Aditya Z FollerItalyAnna Fali PROPOSAL
Greenwood V WhobreyJapanStephen Shaw RENEWAL
Misaki T SaylorsItalyStephen Shaw PROPOSAL
Jeanfrancois A WieserFranceElwin Sharvill PROPOSAL
Salvatore R CaldareraCanadaElwin Sharvill QUALIFIED
Antonio V SlusarskiUnited KingdomBernardo Dominic PROPOSAL
Salvatore R CaudyRussiaAmy Elsner QUALIFIED
Izzy C KuskoArgentinaAnna Fali RENEWAL
Tony M WieserUnited KingdomOnyama Limba QUALIFIED
Jennifer V GillianFranceAnna Fali NEW
Stacey D InouyeJapanAnna Fali NEW
James Q BologniaArgentinaBernardo Dominic NEW
Jeanfrancois E SlusarskiAustraliaBernardo Dominic UNQUALIFIED
Kaitlin T MaletJapanIoni Bowcher QUALIFIED
Francesco E SaylorsSpainOnyama Limba NEW
Stacey G GarufiAustraliaAnna Fali NEW
Arvin Y IturbideSpainAsiya Javayant RENEWAL
Isabel Z ShinkoBrazilIoni Bowcher NEGOTIATION
Ricardo U SchemmerAustraliaOnyama Limba RENEWAL
Silvio M PaprockiCanadaAmy Elsner UNQUALIFIED
Octavia E TollnerAustraliaXuxue Feng PROPOSAL
Greenwood A CampainSpainIvan Magalhaes NEW
Clifford W GlickSpainAnna Fali PROPOSAL
Greenwood I CampainIndiaBernardo Dominic QUALIFIED
Ashley Y OldroydGermanyXuxue Feng NEW
Stacey H MaletUnited KingdomBernardo Dominic RENEWAL
Ricardo S CaldareraArgentinaAnna Fali RENEWAL
Stacey W MorascaSpainStephen Shaw UNQUALIFIED
Ivar N ShinkoUnited KingdomIvan Magalhaes PROPOSAL
Greenwood D GauchoUnited KingdomAnna Fali NEW
Jones B StensethIndiaElwin Sharvill RENEWAL
Leon O VocelkaSpainXuxue Feng RENEWAL
Frozen Columns
Name
Mayumi M Slusarski
Mayumi G Nicka
Mayumi A Royster
Kaitlin T Whobrey
David G Figeroa
Juan M Schemmer
David Q Bowley
Smith U Marrier
Claire F Kolmetz
Adams L Schemmer
Claire T Maclead
Smith L Wieser
David B Gaucho
Stacey W Paprocki
Johnson D Saylors
Jeanfrancois R Rulapaugh
Octavia V Poquette
Salvatore F Slusarski
Wickens T Albares
Wickens I Nestle
Misaki X Kolmetz
Maria T Vocelka
Misaki Y Wieser
Jeanfrancois P Ruta
Ivar P Poquette
Francesco T Stockham
Kaitlin U Slusarski
Sinclair S Ostrosky
Aruna K Butt
Munro U Rulapaugh
Stacey B Bowley
Darci W Flosi
Ivar J Campain
Julie R Flosi
Claire L Figeroa
Mujtaba Z Butt
Faith P Caudy
David P Poquette
Greenwood R Garufi
Ivar D Malet
Leja X Poquette
Leon P Stenseth
Mayumi Z Albares
Murillo P Briddick
Chavez O Figeroa
James H Gillian
Adams N Wieser
Aditya J Caldarera
Juan R Saylors
Mayumi A Vocelka
IdCountryDate
1000Canada2025-05-18
1001Italy2025-06-06
1002Canada2025-06-07
1003France2025-05-29
1004United Kingdom2025-05-16
1005United Kingdom2025-05-30
1006United Kingdom2025-05-18
1007Argentina2025-06-09
1008Brazil2025-06-08
1009Italy2025-05-19
1010United Kingdom2025-06-05
1011Brazil2025-06-12
1012Spain2025-05-26
1013Argentina2025-05-26
1014Japan2025-05-23
1015Australia2025-06-12
1016Germany2025-06-06
1017France2025-05-20
1018Canada2025-06-13
1019Spain2025-06-04
1020Russia2025-05-26
1021Japan2025-05-20
1022Germany2025-05-23
1023France2025-05-27
1024France2025-06-06
1025Japan2025-05-30
1026Russia2025-06-03
1027France2025-05-29
1028Japan2025-05-27
1029United Kingdom2025-06-08
1030Spain2025-06-08
1031Spain2025-05-16
1032Brazil2025-06-09
1033Germany2025-05-29
1034India2025-06-03
1035Canada2025-06-12
1036Australia2025-06-04
1037Australia2025-06-01
1038France2025-05-17
1039Brazil2025-06-10
1040Italy2025-05-29
1041Argentina2025-05-25
1042Spain2025-05-30
1043Argentina2025-06-08
1044Spain2025-06-04
1045Canada2025-05-25
1046Spain2025-06-13
1047Spain2025-06-11
1048Japan2025-06-01
1049France2025-06-07

On-Demand Data

NameIdCountryDate
Mujtaba V Bowley1000Argentina2025-05-18
Stacey N Foller1001United Kingdom2025-06-14
Darci P Malet1002Argentina2025-05-29
Francesco Y Royster1003France2025-05-20
David A Rulapaugh1004Brazil2025-05-16
Jones J Oldroyd1005United Kingdom2025-05-27
Jones W Gaucho1006Russia2025-06-11
Johnson S Wieser1007France2025-05-29
Maisha D Bowley1008France2025-06-12
Kadeem L Chui1009Brazil2025-05-24
Antonio X Malet1010India2025-05-23
Chavez Q Slusarski1011India2025-06-12
Nicolas U Amigon1012Brazil2025-06-04
Mujtaba J Iturbide1013Japan2025-06-04
Arvin X Poquette1014Italy2025-05-20
Morrow W Chui1015Germany2025-06-11
Nicolas O Caldarera1016India2025-05-16
Munro A Schemmer1017United Kingdom2025-06-02
Izzy L Stockham1018Italy2025-06-09
Arvin K Maclead1019Canada2025-06-05
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aika U WaycottJapanXuxue Feng UNQUALIFIED
Munro T BowleyArgentinaAsiya Javayant UNQUALIFIED
Sinclair Q WaycottBrazilStephen Shaw UNQUALIFIED
Jones Q WaycottCanadaAsiya Javayant UNQUALIFIED
Chavez G ShinkoItalyOnyama Limba PROPOSAL
James C KolmetzGermanyStephen Shaw NEW
Stacey L RulapaughUnited KingdomBernardo Dominic NEW
Deepesh N DilliardItalyBernardo Dominic PROPOSAL
Chavez N CaldareraRussiaAmy Elsner UNQUALIFIED
Maisha M VocelkaBrazilIvan Magalhaes NEGOTIATION
Morrow J RimUnited KingdomOnyama Limba NEW
Aika F IturbideArgentinaAsiya Javayant QUALIFIED
Costa T RimIndiaStephen Shaw NEW
Jennifer N BologniaAustraliaIoni Bowcher PROPOSAL
Stacey Y KuskoUnited KingdomIoni Bowcher PROPOSAL
Mayumi T CaudyJapanOnyama Limba NEW
Ricardo Q SchemmerJapanStephen Shaw UNQUALIFIED
Jones V RoysterJapanAmy Elsner NEGOTIATION
Mayumi H GillianItalyOnyama Limba NEGOTIATION
Silvio J GlickGermanyIvan Magalhaes QUALIFIED
Costa C AmigonJapanElwin Sharvill NEW
Maisha N MarrierGermanyIvan Magalhaes RENEWAL
Leja L GlickItalyOnyama Limba NEW
Deepesh H SlusarskiGermanyBernardo Dominic NEGOTIATION
Alejandro R PaprockiArgentinaAsiya Javayant QUALIFIED
Julie D MacleadArgentinaOnyama Limba NEGOTIATION
Kadeem H FigeroaCanadaElwin Sharvill PROPOSAL
Mujtaba F NickaRussiaBernardo Dominic UNQUALIFIED
Maisha W SchemmerArgentinaIoni Bowcher PROPOSAL
Clifford H DarakjyUnited KingdomAsiya Javayant NEW
Chavez U MorascaItalyElwin Sharvill PROPOSAL
Chavez V AlbaresBrazilStephen Shaw NEW
Cody B FigeroaIndiaAnna Fali RENEWAL
James Q SaylorsGermanyIvan Magalhaes PROPOSAL
Nicolas X StockhamJapanXuxue Feng NEGOTIATION
Ivar K KolmetzIndiaStephen Shaw NEW
Munro G WieserFranceAmy Elsner UNQUALIFIED
Isabel K VocelkaGermanyAsiya Javayant NEGOTIATION
Faith X DoeIndiaOnyama Limba QUALIFIED
Misaki M PaprockiRussiaBernardo Dominic 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>