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
Arvin M OstroskyCanadaStephen Shaw QUALIFIED
Julie F CaldareraCanadaElwin Sharvill NEW
Johnson B GlickJapanAnna Fali NEGOTIATION
James F BologniaRussiaAnna Fali QUALIFIED
Jeanfrancois J TollnerArgentinaXuxue Feng NEW
Johnson Z KolmetzSpainAnna Fali NEGOTIATION
David R VenereSpainOnyama Limba NEW
Leon K GauchoArgentinaAmy Elsner UNQUALIFIED
Francesco X BologniaRussiaIoni Bowcher RENEWAL
Clifford B FerenczRussiaBernardo Dominic QUALIFIED
Salvatore M VocelkaCanadaIoni Bowcher QUALIFIED
Ashley J PaprockiIndiaIoni Bowcher UNQUALIFIED
Sinclair E MorascaJapanBernardo Dominic UNQUALIFIED
Leon X IturbideGermanyElwin Sharvill NEW
Munro J PoquetteItalyAnna Fali QUALIFIED
Morrow N RoysterIndiaIoni Bowcher RENEWAL
Jefferson Q GarufiGermanyAsiya Javayant UNQUALIFIED
Munro Q ButtCanadaIvan Magalhaes QUALIFIED
David L SergiGermanyIvan Magalhaes RENEWAL
Ivar S FollerCanadaIoni Bowcher RENEWAL
Aditya L GarufiUnited KingdomIvan Magalhaes NEW
Maisha Z CaudyJapanStephen Shaw QUALIFIED
Jefferson A FollerJapanXuxue Feng NEW
Darci Y KuskoArgentinaAnna Fali UNQUALIFIED
Leon Z TollnerUnited KingdomOnyama Limba PROPOSAL
Alejandro Z GauchoAustraliaIvan Magalhaes NEW
Silvio C ButtFranceAmy Elsner RENEWAL
James X BowleyJapanOnyama Limba NEW
Antonio N BriddickFranceOnyama Limba NEGOTIATION
Emily L MaletFranceIoni Bowcher RENEWAL
Arvin B BowleyAustraliaStephen Shaw NEW
Izzy U ShinkoFranceXuxue Feng UNQUALIFIED
Leja S MaletJapanElwin Sharvill RENEWAL
Kadeem T PaprockiGermanyOnyama Limba QUALIFIED
Aditya J MarrierRussiaXuxue Feng UNQUALIFIED
Misaki N OstroskyCanadaAsiya Javayant RENEWAL
Izzy H CaudyIndiaXuxue Feng NEGOTIATION
Kadeem L RulapaughRussiaElwin Sharvill NEW
Silvio C AlbaresAustraliaElwin Sharvill RENEWAL
Aika S PerinUnited KingdomIoni Bowcher QUALIFIED
Costa B ChuiAustraliaStephen Shaw PROPOSAL
Costa N CampainRussiaElwin Sharvill RENEWAL
Mayumi S CaudyUnited KingdomIoni Bowcher NEGOTIATION
Clifford K DoeRussiaElwin Sharvill RENEWAL
Sinclair Q CampainArgentinaAsiya Javayant NEW
Leon D BologniaRussiaBernardo Dominic UNQUALIFIED
Julie K FigeroaAustraliaElwin Sharvill RENEWAL
Morrow E VocelkaArgentinaBernardo Dominic PROPOSAL
Jennifer I CampainGermanyIvan Magalhaes PROPOSAL
Jeanfrancois O MaletFranceAsiya Javayant NEW
Horizontal
NameCountryRepresentativeStatus
Jones Y AmigonArgentinaAnna Fali UNQUALIFIED
Jeanfrancois R RulapaughIndiaAmy Elsner UNQUALIFIED
Jefferson Y FlosiIndiaStephen Shaw PROPOSAL
Salvatore R FollerBrazilAnna Fali RENEWAL
Jeanfrancois U RutaJapanAsiya Javayant NEGOTIATION
Leja Z NickaCanadaXuxue Feng NEW
Isabel N PoquetteSpainIvan Magalhaes RENEWAL
Ivar X RulapaughSpainIoni Bowcher UNQUALIFIED
David M WieserItalyAnna Fali NEGOTIATION
Juan D ChuiItalyStephen Shaw NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aditya Y CaudyBrazil2025-04-07Dorl, James J Esq PROPOSAL91Anna Fali
1001Nicolas V MacleadIndia2025-04-16Benton, John B Jr NEW16Bernardo Dominic
1002Kadeem L VenereBrazil2025-04-13Chanay, Jeffrey A Esq PROPOSAL3Xuxue Feng
1003Faith H DarakjyFrance2025-04-10Rangoni Of Florence UNQUALIFIED65Bernardo Dominic
1004David B RutaSpain2025-05-04Rangoni Of Florence NEGOTIATION10Stephen Shaw
1005Faith K GlickIndia2025-05-04King, Christopher A Esq PROPOSAL49Anna Fali
1006James E FerenczRussia2025-05-03Benton, John B Jr PROPOSAL29Elwin Sharvill
1007Tony G GlickArgentina2025-04-20Morlong Associates NEGOTIATION2Ivan Magalhaes
1008Greenwood L GauchoArgentina2025-04-10Truhlar And Truhlar Attys NEGOTIATION56Xuxue Feng
1009Francesco K PaprockiGermany2025-04-11Feiner Bros NEGOTIATION25Amy Elsner
1010David H InouyeArgentina2025-05-03Rousseaux, Michael Esq PROPOSAL91Amy Elsner
1011Smith H GillianItaly2025-04-05Printing Dimensions NEW49Elwin Sharvill
1012Antonio N WhobreyCanada2025-04-20Rangoni Of Florence NEGOTIATION25Asiya Javayant
1013Murillo L SaylorsGermany2025-04-22Commercial Press QUALIFIED65Ioni Bowcher
1014Jennifer T RoysterItaly2025-04-25Rousseaux, Michael Esq RENEWAL31Xuxue Feng
1015Kadeem A MaletSpain2025-04-07Feltz Printing Service NEW94Asiya Javayant
1016Deepesh X DarakjyIndia2025-04-30Printing Dimensions RENEWAL98Elwin Sharvill
1017Munro R GarufiCanada2025-04-29Feltz Printing Service RENEWAL51Bernardo Dominic
1018Munro F DarakjyBrazil2025-04-15King, Christopher A Esq PROPOSAL49Ioni Bowcher
1019Misaki D FlosiGermany2025-04-27Chemel, James L Cpa QUALIFIED80Bernardo Dominic
1020Mayumi L ButtArgentina2025-04-27Rangoni Of Florence NEW55Elwin Sharvill
1021Claire M RulapaughIndia2025-04-08King, Christopher A Esq NEW76Asiya Javayant
1022Mayumi E RoysterItaly2025-04-12King, Christopher A Esq QUALIFIED61Ivan Magalhaes
1023Jones W RimSpain2025-04-26Printing Dimensions NEW62Onyama Limba
1024Johnson G WhobreyAustralia2025-05-01Rousseaux, Michael Esq UNQUALIFIED51Xuxue Feng
1025Jones W InouyeSpain2025-04-21King, Christopher A Esq NEW86Elwin Sharvill
1026Ashley Q PerinSpain2025-05-01Rangoni Of Florence NEGOTIATION31Stephen Shaw
1027Rodrigues T GauchoJapan2025-04-29Buckley Miller Wright RENEWAL21Asiya Javayant
1028Maisha Y RutaBrazil2025-04-09Chemel, James L Cpa PROPOSAL55Bernardo Dominic
1029Aruna Q PoquetteJapan2025-04-13Chanay, Jeffrey A Esq NEGOTIATION69Anna Fali
1030Jeanfrancois J StensethRussia2025-04-22King, Christopher A Esq RENEWAL83Amy Elsner
1031Leja X BowleyAustralia2025-04-16Truhlar And Truhlar Attys PROPOSAL35Amy Elsner
1032Rodrigues W CaldareraArgentina2025-04-11Rangoni Of Florence RENEWAL98Anna Fali
1033Tony Q SlusarskiItaly2025-04-18Commercial Press QUALIFIED66Elwin Sharvill
1034Costa Z FlosiSpain2025-04-08Rousseaux, Michael Esq NEGOTIATION21Ioni Bowcher
1035Izzy G RutaRussia2025-04-11Printing Dimensions RENEWAL10Anna Fali
1036Ivar Y GlickBrazil2025-04-26Chemel, James L Cpa RENEWAL55Elwin Sharvill
1037Misaki V PaprockiAustralia2025-04-16Buckley Miller Wright PROPOSAL10Ivan Magalhaes
1038Clifford F ChuiIndia2025-04-14Chapman, Ross E Esq PROPOSAL71Elwin Sharvill
1039Silvio V FigeroaItaly2025-04-13Dorl, James J Esq RENEWAL97Ioni Bowcher
1040Chavez D MarrierIndia2025-04-28Feltz Printing Service UNQUALIFIED50Ivan Magalhaes
1041Leja N RimArgentina2025-04-28Chapman, Ross E Esq QUALIFIED38Ivan Magalhaes
1042Cody L StensethAustralia2025-05-03King, Christopher A Esq PROPOSAL95Ioni Bowcher
1043Sinclair U SaylorsAustralia2025-04-29Truhlar And Truhlar Attys NEGOTIATION33Bernardo Dominic
1044Nicolas E CaldareraArgentina2025-04-28Printing Dimensions PROPOSAL85Amy Elsner
1045Smith C WieserIndia2025-04-22Chemel, James L Cpa RENEWAL41Elwin Sharvill
1046Misaki T KolmetzRussia2025-04-11Chemel, James L Cpa PROPOSAL23Amy Elsner
1047Maria L MaletArgentina2025-04-22Benton, John B Jr NEW66Elwin Sharvill
1048Johnson P CaudyIndia2025-04-20Benton, John B Jr NEW10Amy Elsner
1049Adams B GarufiCanada2025-04-06Dorl, James J Esq RENEWAL29Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Leja T GarufiItalyAsiya Javayant QUALIFIED
Ashley I VenereJapanIoni Bowcher QUALIFIED
Leon B DarakjySpainIoni Bowcher QUALIFIED
Maria Y PoquetteAustraliaAsiya Javayant RENEWAL
Faith G CaudySpainAnna Fali RENEWAL
Darci I SaylorsFranceAnna Fali QUALIFIED
Mayumi N SaylorsAustraliaIoni Bowcher RENEWAL
Johnson E DoeJapanIoni Bowcher UNQUALIFIED
Mayumi E OldroydItalyBernardo Dominic PROPOSAL
Jones N ShinkoItalyAsiya Javayant PROPOSAL
Jeanfrancois B VenereCanadaAnna Fali NEW
David F BowleyAustraliaAnna Fali PROPOSAL
Darci R NickaItalyAsiya Javayant NEGOTIATION
Mayumi U SaylorsRussiaAsiya Javayant NEGOTIATION
Misaki A BologniaCanadaXuxue Feng QUALIFIED
Faith M MarrierCanadaIoni Bowcher NEW
Faith M DarakjyItalyAsiya Javayant PROPOSAL
Murillo J MaletRussiaStephen Shaw QUALIFIED
Adams H CaldareraJapanXuxue Feng NEW
Emily L FollerArgentinaIoni Bowcher RENEWAL
Claire U GillianArgentinaAmy Elsner RENEWAL
Morrow B GillianBrazilIoni Bowcher RENEWAL
Morrow U AmigonBrazilAmy Elsner NEW
James B KuskoUnited KingdomAsiya Javayant NEGOTIATION
Alejandro H VocelkaGermanyAmy Elsner NEW
Alejandro Z WaycottGermanyAnna Fali PROPOSAL
Octavia G RoysterFranceXuxue Feng NEGOTIATION
Jefferson F WaycottBrazilElwin Sharvill QUALIFIED
James L KuskoCanadaElwin Sharvill PROPOSAL
Maria Q WaycottBrazilAsiya Javayant QUALIFIED
Morrow P SchemmerArgentinaOnyama Limba QUALIFIED
Munro H DarakjyFranceAmy Elsner QUALIFIED
Francesco D OldroydJapanAsiya Javayant QUALIFIED
Aika J AlbaresFranceIoni Bowcher QUALIFIED
James D BowleyGermanyElwin Sharvill UNQUALIFIED
Kaitlin X CaldareraBrazilBernardo Dominic NEW
Sinclair U OstroskyArgentinaAnna Fali PROPOSAL
Aruna K FerenczCanadaXuxue Feng PROPOSAL
Jefferson A MorascaFranceOnyama Limba PROPOSAL
Octavia Y ChuiItalyStephen Shaw NEW
Aika W BowleyIndiaElwin Sharvill QUALIFIED
Arvin I BriddickAustraliaElwin Sharvill NEW
Tony L TollnerIndiaElwin Sharvill PROPOSAL
Antonio D GlickCanadaIvan Magalhaes NEW
Chavez H FigeroaCanadaAsiya Javayant NEGOTIATION
Tony V VenereArgentinaAmy Elsner PROPOSAL
Adams N RutaCanadaIoni Bowcher PROPOSAL
Ivar A ButtAustraliaIvan Magalhaes RENEWAL
Morrow P RutaUnited KingdomStephen Shaw NEW
Deepesh B SaylorsBrazilXuxue Feng QUALIFIED
Frozen Columns
Name
Deepesh I Slusarski
Maisha O Amigon
Mayumi T Kusko
Izzy V Darakjy
Ricardo N Briddick
Emily H Campain
Maisha Q Maclead
Jones S Caudy
Aditya K Stenseth
Jones T Garufi
Johnson H Slusarski
Francesco E Stockham
Leja K Maclead
Costa U Slusarski
Cody A Vocelka
Cody Z Doe
Aika U Paprocki
Cody P Rulapaugh
Smith S Venere
Misaki W Rulapaugh
Ashley H Flosi
Alejandro L Bowley
Cody A Oldroyd
Ricardo Q Maclead
Jones N Tollner
Misaki P Poquette
Johnson Z Amigon
Munro F Sergi
Deepesh T Stockham
Nicolas S Oldroyd
Mayumi B Figeroa
Johnson E Bowley
Cody W Ostrosky
Stacey S Wieser
Francesco M Iturbide
Misaki N Rim
Jennifer U Malet
Murillo H Bolognia
Kaitlin H Bolognia
Chavez Q Garufi
Aditya G Rulapaugh
Stacey I Dilliard
Smith I Malet
Clifford E Nestle
Stacey H Vocelka
Francesco A Rim
Ricardo G Stenseth
Maria E Briddick
Mayumi M Ostrosky
Darci S Campain
IdCountryDate
1000Spain2025-04-29
1001Canada2025-04-09
1002Italy2025-04-25
1003Australia2025-04-11
1004France2025-04-16
1005Italy2025-04-15
1006India2025-04-13
1007India2025-04-17
1008Germany2025-04-27
1009Brazil2025-04-24
1010Brazil2025-04-25
1011United Kingdom2025-04-09
1012Germany2025-04-26
1013India2025-05-02
1014Germany2025-04-17
1015Japan2025-04-17
1016Australia2025-04-08
1017France2025-04-18
1018Italy2025-04-28
1019United Kingdom2025-04-20
1020Germany2025-04-30
1021France2025-04-23
1022India2025-05-03
1023Spain2025-05-01
1024Australia2025-04-16
1025United Kingdom2025-04-25
1026France2025-05-01
1027Brazil2025-05-04
1028Japan2025-04-17
1029Germany2025-04-30
1030France2025-04-11
1031India2025-04-27
1032Canada2025-04-23
1033Germany2025-05-04
1034Australia2025-04-07
1035Russia2025-04-24
1036France2025-04-08
1037Brazil2025-04-12
1038Italy2025-05-03
1039Japan2025-04-20
1040France2025-04-14
1041Brazil2025-04-16
1042Japan2025-04-16
1043India2025-04-14
1044Canada2025-04-07
1045Spain2025-04-09
1046Australia2025-04-21
1047Italy2025-04-28
1048Germany2025-04-28
1049United Kingdom2025-05-01

On-Demand Data

NameIdCountryDate
Jones A Briddick1000Germany2025-04-16
Kadeem I Gaucho1001Canada2025-04-09
David Y Darakjy1002Japan2025-04-21
Morrow O Slusarski1003India2025-05-04
Cody D Inouye1004Russia2025-04-26
Emily Z Paprocki1005Australia2025-04-16
Aditya Y Dilliard1006Canada2025-04-23
Misaki U Nicka1007India2025-05-03
Jeanfrancois I Oldroyd1008Italy2025-04-18
Emily P Bolognia1009Spain2025-04-26
Faith B Glick1010Italy2025-04-24
Nicolas C Nestle1011Germany2025-04-12
Julie N Figeroa1012Canada2025-04-06
Jeanfrancois R Nicka1013Germany2025-04-12
Ivar M Malet1014Germany2025-04-06
Mujtaba C Ferencz1015France2025-04-28
Misaki Q Perin1016United Kingdom2025-05-04
Munro D Iturbide1017Italy2025-04-12
Leon L Caldarera1018Germany2025-04-15
Julie X Stockham1019India2025-04-12
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Wickens W BologniaArgentinaAsiya Javayant UNQUALIFIED
Darci J NickaItalyAsiya Javayant UNQUALIFIED
David Q ChuiFranceIvan Magalhaes QUALIFIED
Costa M BowleySpainOnyama Limba QUALIFIED
Leon Q VenereRussiaAsiya Javayant RENEWAL
Juan X OstroskyArgentinaBernardo Dominic NEGOTIATION
Aika A VenereFranceAsiya Javayant PROPOSAL
Kaitlin U VocelkaGermanyAmy Elsner NEGOTIATION
Kadeem F GillianArgentinaStephen Shaw QUALIFIED
Greenwood H FlosiBrazilXuxue Feng NEGOTIATION
Leon R VenereIndiaAsiya Javayant NEW
Smith N FlosiGermanyIoni Bowcher NEW
Aruna L WieserJapanXuxue Feng NEW
Aditya Z BologniaBrazilIoni Bowcher PROPOSAL
Sinclair L OldroydAustraliaXuxue Feng RENEWAL
Tony A BowleyBrazilStephen Shaw QUALIFIED
Wickens B DoeSpainElwin Sharvill NEW
Ashley Z ButtUnited KingdomAsiya Javayant RENEWAL
Ashley F MaletFranceAmy Elsner UNQUALIFIED
Silvio L RoysterRussiaBernardo Dominic PROPOSAL
Ricardo W PaprockiSpainXuxue Feng QUALIFIED
Emily V SaylorsArgentinaIvan Magalhaes RENEWAL
Antonio N OldroydSpainBernardo Dominic RENEWAL
Cody Z WaycottJapanXuxue Feng NEW
David Y DilliardIndiaIoni Bowcher RENEWAL
Ashley E DoeBrazilXuxue Feng NEGOTIATION
Chavez Y KolmetzRussiaXuxue Feng PROPOSAL
Jones V DarakjyAustraliaIvan Magalhaes NEW
Salvatore Q DarakjyArgentinaAmy Elsner RENEWAL
Jefferson W OstroskyAustraliaAnna Fali PROPOSAL
Arvin T SaylorsIndiaStephen Shaw UNQUALIFIED
Juan Q GauchoJapanIoni Bowcher QUALIFIED
Aruna U OldroydUnited KingdomElwin Sharvill RENEWAL
Aika G RoysterBrazilIoni Bowcher QUALIFIED
Wickens D BowleyItalyElwin Sharvill UNQUALIFIED
Rodrigues J IturbideFranceIvan Magalhaes QUALIFIED
Aruna A DoeUnited KingdomOnyama Limba PROPOSAL
Deepesh P CaudyAustraliaIvan Magalhaes PROPOSAL
Maria K ButtSpainOnyama Limba NEGOTIATION
Rodrigues F SergiSpainAsiya Javayant 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>