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
Jefferson K WhobreyItalyAnna Fali QUALIFIED
Morrow L CaldareraUnited KingdomBernardo Dominic QUALIFIED
Aika A VocelkaCanadaElwin Sharvill NEW
Jones B WaycottFranceAnna Fali RENEWAL
Leja X ButtBrazilXuxue Feng NEW
Smith T PoquetteBrazilIoni Bowcher QUALIFIED
Maria U DilliardUnited KingdomIvan Magalhaes PROPOSAL
Jones C MaletSpainBernardo Dominic NEW
Aruna U RimGermanyIvan Magalhaes UNQUALIFIED
Rodrigues A PoquetteRussiaBernardo Dominic RENEWAL
Kadeem N SaylorsSpainAmy Elsner NEW
Francesco R KolmetzRussiaAsiya Javayant NEGOTIATION
Julie Y FigeroaGermanyAnna Fali RENEWAL
Ivar Y IturbideCanadaIoni Bowcher QUALIFIED
Adams N VocelkaArgentinaBernardo Dominic RENEWAL
Jennifer E MaletRussiaIvan Magalhaes PROPOSAL
Cody P StensethJapanXuxue Feng NEW
Wickens S GauchoJapanStephen Shaw RENEWAL
Arvin S CaldareraJapanIvan Magalhaes PROPOSAL
Clifford T ButtUnited KingdomAnna Fali UNQUALIFIED
Adams T WieserArgentinaAsiya Javayant RENEWAL
Greenwood Q MorascaBrazilBernardo Dominic QUALIFIED
Clifford L GauchoIndiaIoni Bowcher NEW
Smith W VocelkaSpainStephen Shaw RENEWAL
Aika T PoquetteSpainElwin Sharvill QUALIFIED
Jones K BriddickJapanBernardo Dominic NEGOTIATION
Morrow B SlusarskiUnited KingdomElwin Sharvill RENEWAL
Arvin U GauchoRussiaAnna Fali NEGOTIATION
Mayumi T SaylorsBrazilXuxue Feng QUALIFIED
Julie X DilliardArgentinaOnyama Limba UNQUALIFIED
Rodrigues A NestleSpainBernardo Dominic UNQUALIFIED
Clifford F ButtUnited KingdomStephen Shaw NEGOTIATION
Leon Q RutaArgentinaAnna Fali QUALIFIED
Morrow O FollerArgentinaStephen Shaw RENEWAL
Salvatore U BowleyGermanyOnyama Limba NEGOTIATION
Wickens H MacleadGermanyStephen Shaw QUALIFIED
Maria V OldroydArgentinaIoni Bowcher QUALIFIED
Juan Y StensethCanadaAsiya Javayant UNQUALIFIED
Murillo I NickaAustraliaAsiya Javayant NEGOTIATION
Kadeem Y KolmetzUnited KingdomBernardo Dominic UNQUALIFIED
Munro P SlusarskiFranceOnyama Limba RENEWAL
Mujtaba Y NickaCanadaXuxue Feng UNQUALIFIED
Stacey C InouyeBrazilAsiya Javayant RENEWAL
David V CaudyBrazilAsiya Javayant UNQUALIFIED
Greenwood F AmigonSpainIoni Bowcher UNQUALIFIED
Chavez W KolmetzAustraliaStephen Shaw RENEWAL
Aruna B CampainJapanOnyama Limba RENEWAL
Claire L SlusarskiAustraliaBernardo Dominic NEW
Claire N InouyeIndiaAmy Elsner RENEWAL
Izzy Z PerinGermanyElwin Sharvill RENEWAL
Horizontal
NameCountryRepresentativeStatus
Salvatore F PerinUnited KingdomElwin Sharvill PROPOSAL
Kaitlin P ChuiBrazilAmy Elsner NEGOTIATION
Rodrigues C WhobreyBrazilElwin Sharvill PROPOSAL
Octavia R IturbideGermanyIvan Magalhaes PROPOSAL
Leja N DilliardUnited KingdomOnyama Limba PROPOSAL
Claire S StockhamItalyOnyama Limba UNQUALIFIED
Chavez Y GillianCanadaAnna Fali UNQUALIFIED
Izzy X GarufiSpainIvan Magalhaes NEGOTIATION
Claire Z SchemmerGermanyIoni Bowcher PROPOSAL
Ivar S SchemmerRussiaAnna Fali QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Morrow M BriddickItaly2025-04-18King, Christopher A Esq NEGOTIATION70Ivan Magalhaes
1001Jennifer P RimCanada2025-04-19Truhlar And Truhlar Attys UNQUALIFIED15Stephen Shaw
1002Chavez J StockhamCanada2025-04-19Buckley Miller Wright QUALIFIED76Ioni Bowcher
1003Jeanfrancois H SchemmerIndia2025-04-16Buckley Miller Wright QUALIFIED19Ivan Magalhaes
1004Stacey B StensethGermany2025-04-19Buckley Miller Wright UNQUALIFIED70Ivan Magalhaes
1005Aika X WaycottArgentina2025-04-19Feiner Bros QUALIFIED63Anna Fali
1006Misaki K KuskoBrazil2025-04-05Chanay, Jeffrey A Esq QUALIFIED93Stephen Shaw
1007Francesco R FigeroaAustralia2025-04-06Buckley Miller Wright NEW89Amy Elsner
1008Jones B GauchoAustralia2025-04-13Dorl, James J Esq UNQUALIFIED89Asiya Javayant
1009Morrow Z BriddickItaly2025-04-06Commercial Press NEGOTIATION87Bernardo Dominic
1010Adams X PaprockiArgentina2025-04-18Benton, John B Jr UNQUALIFIED22Ivan Magalhaes
1011Johnson M RutaIndia2025-04-11Commercial Press RENEWAL98Anna Fali
1012Emily S CaldareraJapan2025-04-01Chemel, James L Cpa UNQUALIFIED35Onyama Limba
1013Jones D GillianArgentina2025-04-07Buckley Miller Wright UNQUALIFIED71Asiya Javayant
1014Ricardo X GlickCanada2025-04-21Feltz Printing Service RENEWAL25Anna Fali
1015Smith P MaletAustralia2025-04-15Truhlar And Truhlar Attys NEGOTIATION53Anna Fali
1016Maisha F KolmetzGermany2025-04-28Feltz Printing Service NEW72Anna Fali
1017Juan I GlickBrazil2025-04-26Benton, John B Jr NEW42Onyama Limba
1018Izzy Z MorascaGermany2025-04-28Benton, John B Jr NEGOTIATION20Anna Fali
1019Cody W FollerAustralia2025-04-05Feiner Bros UNQUALIFIED4Xuxue Feng
1020Kadeem A CaldareraUnited Kingdom2025-04-19Printing Dimensions QUALIFIED44Xuxue Feng
1021Munro C WieserRussia2025-04-20Chanay, Jeffrey A Esq UNQUALIFIED54Bernardo Dominic
1022Emily Z BriddickUnited Kingdom2025-04-27Morlong Associates UNQUALIFIED27Asiya Javayant
1023Tony X DilliardJapan2025-04-04Benton, John B Jr NEW67Asiya Javayant
1024Jeanfrancois M SergiCanada2025-04-25Commercial Press UNQUALIFIED64Xuxue Feng
1025Mujtaba F FerenczCanada2025-04-02Commercial Press QUALIFIED32Xuxue Feng
1026Octavia M CaldareraCanada2025-04-23Rousseaux, Michael Esq NEW54Anna Fali
1027Wickens G RulapaughBrazil2025-04-06Benton, John B Jr NEGOTIATION45Onyama Limba
1028Izzy P CaudyItaly2025-04-09Rousseaux, Michael Esq PROPOSAL45Amy Elsner
1029Morrow C RoysterArgentina2025-04-01Dorl, James J Esq NEGOTIATION42Asiya Javayant
1030Jeanfrancois Q GillianGermany2025-04-08Chemel, James L Cpa UNQUALIFIED90Amy Elsner
1031Sinclair B ButtBrazil2025-04-11Truhlar And Truhlar Attys PROPOSAL21Anna Fali
1032Sinclair F ButtJapan2025-04-03Chemel, James L Cpa RENEWAL6Ioni Bowcher
1033Arvin L VocelkaUnited Kingdom2025-04-07Truhlar And Truhlar Attys RENEWAL82Amy Elsner
1034Adams M MarrierArgentina2025-04-21Chapman, Ross E Esq NEGOTIATION37Asiya Javayant
1035Izzy Z TollnerRussia2025-04-14Feiner Bros PROPOSAL43Bernardo Dominic
1036Faith K InouyeUnited Kingdom2025-04-20Commercial Press PROPOSAL73Asiya Javayant
1037Adams I DoeFrance2025-04-16Buckley Miller Wright UNQUALIFIED86Onyama Limba
1038Rodrigues K CampainAustralia2025-04-01Benton, John B Jr UNQUALIFIED73Xuxue Feng
1039Aruna K DarakjyFrance2025-04-11Chanay, Jeffrey A Esq UNQUALIFIED12Ivan Magalhaes
1040Faith P BologniaSpain2025-04-19Commercial Press UNQUALIFIED78Anna Fali
1041Cody G WaycottRussia2025-04-24Rousseaux, Michael Esq NEGOTIATION59Asiya Javayant
1042Ashley O PoquetteRussia2025-04-11Chanay, Jeffrey A Esq NEW19Ivan Magalhaes
1043David T CampainJapan2025-04-06King, Christopher A Esq PROPOSAL91Elwin Sharvill
1044Emily H RoysterFrance2025-04-09Rousseaux, Michael Esq NEW67Stephen Shaw
1045Cody C CaldareraBrazil2025-04-03Morlong Associates PROPOSAL20Ioni Bowcher
1046Greenwood L FerenczItaly2025-04-13Commercial Press NEGOTIATION91Anna Fali
1047Maisha G PoquetteJapan2025-04-15Rousseaux, Michael Esq QUALIFIED67Anna Fali
1048Ricardo R ButtItaly2025-04-01Chanay, Jeffrey A Esq PROPOSAL42Ivan Magalhaes
1049Juan G PoquetteFrance2025-04-03Truhlar And Truhlar Attys QUALIFIED50Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Morrow I DoeSpainOnyama Limba NEGOTIATION
Rodrigues L MorascaUnited KingdomElwin Sharvill QUALIFIED
Aruna D GillianBrazilAnna Fali RENEWAL
David N WieserArgentinaStephen Shaw QUALIFIED
Salvatore X VenereSpainStephen Shaw UNQUALIFIED
David C VocelkaIndiaBernardo Dominic PROPOSAL
Francesco Y StockhamJapanAmy Elsner PROPOSAL
Chavez W RimUnited KingdomOnyama Limba UNQUALIFIED
Kadeem U DilliardArgentinaAmy Elsner NEW
Alejandro R FerenczSpainIvan Magalhaes RENEWAL
Rodrigues J OldroydRussiaIoni Bowcher QUALIFIED
Mayumi A BriddickFranceElwin Sharvill RENEWAL
Ashley I CampainUnited KingdomElwin Sharvill QUALIFIED
Sinclair O SaylorsSpainIvan Magalhaes UNQUALIFIED
Claire I DilliardIndiaAmy Elsner PROPOSAL
Aditya I WaycottAustraliaAsiya Javayant RENEWAL
Aika S MorascaRussiaOnyama Limba PROPOSAL
Murillo R DilliardSpainIoni Bowcher RENEWAL
Kaitlin X FlosiUnited KingdomAsiya Javayant UNQUALIFIED
Kaitlin V InouyeRussiaBernardo Dominic RENEWAL
Julie F SergiArgentinaBernardo Dominic RENEWAL
Izzy M PoquetteSpainAnna Fali QUALIFIED
Leon Q MaletJapanAmy Elsner UNQUALIFIED
Izzy K MaletFranceXuxue Feng QUALIFIED
Aruna F FerenczUnited KingdomIoni Bowcher NEGOTIATION
Smith Q AmigonCanadaOnyama Limba RENEWAL
Aika M WieserAustraliaOnyama Limba QUALIFIED
Kaitlin E WhobreyUnited KingdomAnna Fali RENEWAL
Smith K WhobreyUnited KingdomIoni Bowcher NEGOTIATION
Salvatore O CampainCanadaStephen Shaw UNQUALIFIED
Ivar L KolmetzIndiaStephen Shaw RENEWAL
Aika E MarrierUnited KingdomOnyama Limba QUALIFIED
Alejandro X MaletRussiaXuxue Feng UNQUALIFIED
Claire C DilliardFranceIvan Magalhaes UNQUALIFIED
Adams I PerinCanadaBernardo Dominic RENEWAL
Chavez W DarakjyItalyStephen Shaw RENEWAL
Juan T KolmetzGermanyStephen Shaw NEGOTIATION
Jones F SaylorsSpainIvan Magalhaes NEGOTIATION
Octavia D WieserUnited KingdomStephen Shaw QUALIFIED
Stacey C MaletBrazilAsiya Javayant NEGOTIATION
Maria S ButtCanadaIvan Magalhaes UNQUALIFIED
Jennifer Y ButtIndiaBernardo Dominic UNQUALIFIED
Claire B RutaIndiaElwin Sharvill NEW
Kadeem S MaletIndiaIoni Bowcher NEGOTIATION
Mayumi T RimBrazilIvan Magalhaes PROPOSAL
Adams V StensethRussiaOnyama Limba NEGOTIATION
Ivar A BologniaJapanXuxue Feng PROPOSAL
Maria O BowleyCanadaAsiya Javayant QUALIFIED
Octavia E VocelkaGermanyBernardo Dominic RENEWAL
Nicolas X OstroskyGermanyAmy Elsner PROPOSAL
Frozen Columns
Name
James F Kolmetz
Aruna Q Glick
Aruna V Briddick
David J Slusarski
Wickens O Saylors
Maisha H Maclead
Deepesh M Vocelka
Aditya M Royster
Adams U Rulapaugh
Cody A Whobrey
Munro P Rulapaugh
Costa E Rim
Stacey C Tollner
Jennifer F Malet
Nicolas E Malet
Kaitlin L Tollner
Mujtaba H Perin
James Z Whobrey
Ashley S Garufi
Izzy L Bolognia
Jefferson K Kolmetz
Kaitlin J Marrier
Emily Y Gillian
Ricardo U Dilliard
Juan Y Rulapaugh
Sinclair Q Perin
Salvatore A Figeroa
Maisha O Paprocki
Wickens G Glick
Deepesh V Vocelka
Alejandro J Amigon
Kaitlin K Ostrosky
Aditya L Bolognia
Julie E Gaucho
Alejandro N Maclead
Tony O Ruta
Isabel O Iturbide
Julie L Marrier
Juan M Rulapaugh
Kaitlin E Stenseth
Kadeem K Morasca
Darci J Marrier
Greenwood J Maclead
Murillo M Caudy
Leja D Campain
Ashley S Stenseth
Alejandro Q Bowley
Smith P Campain
Leon N Butt
Munro N Iturbide
IdCountryDate
1000United Kingdom2025-04-22
1001Brazil2025-04-29
1002Australia2025-04-10
1003Russia2025-04-09
1004Australia2025-04-30
1005India2025-04-17
1006Russia2025-04-30
1007United Kingdom2025-04-27
1008India2025-04-10
1009Germany2025-04-14
1010Canada2025-04-02
1011Italy2025-04-20
1012Canada2025-04-26
1013Germany2025-04-18
1014Spain2025-04-25
1015Brazil2025-04-17
1016Germany2025-04-17
1017Argentina2025-04-23
1018United Kingdom2025-04-10
1019Australia2025-04-29
1020Italy2025-04-14
1021Brazil2025-04-21
1022Russia2025-04-18
1023Australia2025-04-04
1024Australia2025-04-22
1025Canada2025-04-22
1026Canada2025-04-15
1027Japan2025-04-01
1028France2025-04-17
1029Germany2025-04-26
1030Canada2025-04-10
1031United Kingdom2025-04-27
1032France2025-04-30
1033Argentina2025-04-27
1034Argentina2025-04-17
1035United Kingdom2025-04-20
1036Spain2025-04-15
1037Canada2025-04-13
1038Russia2025-04-11
1039Canada2025-04-03
1040Brazil2025-04-06
1041Japan2025-04-21
1042India2025-04-26
1043Argentina2025-04-26
1044Brazil2025-04-30
1045Germany2025-04-22
1046Italy2025-04-01
1047Russia2025-04-15
1048Germany2025-04-27
1049Argentina2025-04-30

On-Demand Data

NameIdCountryDate
Kaitlin V Marrier1000India2025-04-18
Darci I Glick1001Brazil2025-04-20
Adams B Paprocki1002Argentina2025-04-14
Alejandro E Paprocki1003Canada2025-04-20
Izzy K Garufi1004India2025-04-22
Mayumi F Gaucho1005Germany2025-04-06
Octavia T Albares1006India2025-04-24
Murillo V Amigon1007France2025-04-24
Jefferson I Ferencz1008Brazil2025-04-06
Morrow R Bolognia1009Brazil2025-04-22
Antonio W Briddick1010India2025-04-01
Sinclair L Malet1011Brazil2025-04-01
Johnson Y Foller1012India2025-04-21
Salvatore S Vocelka1013Brazil2025-04-26
Cody G Waycott1014United Kingdom2025-04-27
Claire X Amigon1015India2025-04-25
Tony Q Figeroa1016Australia2025-04-08
Aika H Oldroyd1017Germany2025-04-12
Tony A Oldroyd1018France2025-04-19
Darci W Tollner1019Italy2025-04-13
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Adams G WieserGermanyIoni Bowcher PROPOSAL
Faith Z SaylorsArgentinaIoni Bowcher NEGOTIATION
Ivar N SchemmerUnited KingdomAnna Fali UNQUALIFIED
Faith B StensethJapanXuxue Feng QUALIFIED
Mayumi A RoysterRussiaAmy Elsner NEGOTIATION
Juan X IturbideUnited KingdomAnna Fali UNQUALIFIED
Rodrigues L GillianCanadaOnyama Limba QUALIFIED
Jeanfrancois V TollnerFranceAnna Fali NEW
Clifford O MaletAustraliaBernardo Dominic RENEWAL
Greenwood R RoysterAustraliaIvan Magalhaes NEGOTIATION
Smith L PoquetteBrazilIoni Bowcher UNQUALIFIED
Smith T SergiCanadaIvan Magalhaes PROPOSAL
Cody V ChuiGermanyElwin Sharvill UNQUALIFIED
Cody J IturbideBrazilBernardo Dominic NEW
Kaitlin O MacleadGermanyAnna Fali PROPOSAL
Darci P OstroskyRussiaStephen Shaw UNQUALIFIED
Mayumi P WhobreySpainAsiya Javayant PROPOSAL
Mayumi Z FigeroaUnited KingdomXuxue Feng NEW
Ricardo R RulapaughFranceAsiya Javayant NEGOTIATION
Mujtaba O FigeroaJapanOnyama Limba NEGOTIATION
Greenwood Q WhobreyFranceAsiya Javayant QUALIFIED
Murillo U KuskoGermanyBernardo Dominic QUALIFIED
Adams B GlickIndiaAsiya Javayant NEW
Tony Q ShinkoBrazilBernardo Dominic UNQUALIFIED
Arvin J MorascaBrazilElwin Sharvill PROPOSAL
Salvatore K BowleyRussiaAsiya Javayant NEGOTIATION
Tony A FlosiBrazilAnna Fali QUALIFIED
Julie N CampainIndiaXuxue Feng NEW
Jeanfrancois F OldroydGermanyAmy Elsner NEW
Chavez I KuskoIndiaIoni Bowcher PROPOSAL
Costa G NickaFranceAmy Elsner NEGOTIATION
Wickens A StensethBrazilStephen Shaw UNQUALIFIED
Leon L MorascaJapanElwin Sharvill RENEWAL
Maisha S TollnerSpainIvan Magalhaes PROPOSAL
Jefferson S MorascaUnited KingdomOnyama Limba UNQUALIFIED
Chavez Y AmigonFranceStephen Shaw PROPOSAL
Clifford T MorascaFranceAnna Fali PROPOSAL
Rodrigues O MacleadItalyBernardo Dominic PROPOSAL
Emily E OldroydItalyElwin Sharvill NEGOTIATION
Aika K RoysterSpainAnna Fali PROPOSAL

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