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
Juan B GauchoItalyAmy Elsner UNQUALIFIED
Antonio V VenereIndiaAnna Fali QUALIFIED
Emily S BologniaBrazilStephen Shaw NEGOTIATION
Munro X GauchoItalyElwin Sharvill NEGOTIATION
Smith K ButtBrazilElwin Sharvill UNQUALIFIED
Clifford L NickaAustraliaXuxue Feng RENEWAL
Greenwood K DilliardFranceBernardo Dominic RENEWAL
Ivar O StockhamRussiaIvan Magalhaes NEW
Smith L AlbaresCanadaAsiya Javayant RENEWAL
Sinclair R PerinArgentinaAmy Elsner RENEWAL
Leon U NickaIndiaXuxue Feng PROPOSAL
Maria V NickaRussiaIvan Magalhaes RENEWAL
Aditya L BriddickGermanyBernardo Dominic NEW
Tony Y RimGermanyAmy Elsner RENEWAL
Clifford V GarufiRussiaAsiya Javayant NEW
Emily R SergiFranceXuxue Feng PROPOSAL
Clifford O VocelkaSpainAmy Elsner UNQUALIFIED
Clifford V BologniaItalyElwin Sharvill NEGOTIATION
Smith T BowleyItalyOnyama Limba NEGOTIATION
Misaki N StensethFranceIvan Magalhaes NEGOTIATION
Jefferson U WhobreyCanadaIvan Magalhaes PROPOSAL
Faith S BowleyBrazilAsiya Javayant QUALIFIED
James G SaylorsCanadaAmy Elsner PROPOSAL
Smith X NestleArgentinaIoni Bowcher NEW
Arvin F WhobreyCanadaAmy Elsner UNQUALIFIED
Silvio Y DoeGermanyBernardo Dominic PROPOSAL
Aika P ChuiGermanyStephen Shaw QUALIFIED
Chavez O OldroydSpainOnyama Limba QUALIFIED
Jeanfrancois P OstroskyUnited KingdomBernardo Dominic NEW
Mayumi V MarrierItalyXuxue Feng QUALIFIED
Salvatore C WhobreyRussiaStephen Shaw NEW
Faith N RoysterIndiaBernardo Dominic NEW
Faith C KuskoIndiaIvan Magalhaes PROPOSAL
Jefferson L KolmetzGermanyElwin Sharvill PROPOSAL
Julie T FigeroaSpainAnna Fali RENEWAL
Mayumi R DilliardArgentinaAmy Elsner NEW
Jeanfrancois Y IturbideCanadaXuxue Feng PROPOSAL
Salvatore F MaletBrazilBernardo Dominic UNQUALIFIED
Smith W MorascaRussiaIoni Bowcher RENEWAL
Misaki M VenereCanadaAsiya Javayant QUALIFIED
Arvin X GillianJapanIvan Magalhaes RENEWAL
Munro P MaletRussiaAmy Elsner NEW
Mujtaba M KolmetzUnited KingdomIvan Magalhaes PROPOSAL
Smith Y PaprockiAustraliaAmy Elsner PROPOSAL
Aditya K TollnerGermanyStephen Shaw PROPOSAL
Mujtaba U BriddickCanadaXuxue Feng PROPOSAL
Francesco E NestleItalyBernardo Dominic NEGOTIATION
Juan V GauchoItalyIvan Magalhaes QUALIFIED
Jeanfrancois D FollerBrazilBernardo Dominic UNQUALIFIED
Stacey R MacleadAustraliaIoni Bowcher UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Chavez V BologniaCanadaIoni Bowcher QUALIFIED
Leon Q DarakjyJapanStephen Shaw UNQUALIFIED
Maisha I VocelkaArgentinaStephen Shaw QUALIFIED
Faith D KolmetzItalyIoni Bowcher UNQUALIFIED
Greenwood B StockhamArgentinaAsiya Javayant PROPOSAL
Clifford K RutaSpainStephen Shaw QUALIFIED
Arvin H GillianJapanIoni Bowcher NEW
Wickens Y IturbideItalyStephen Shaw UNQUALIFIED
Morrow A AlbaresAustraliaOnyama Limba NEW
Aruna N DilliardSpainStephen Shaw QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Misaki A FollerAustralia2025-04-25Truhlar And Truhlar Attys NEW11Asiya Javayant
1001James V GarufiUnited Kingdom2025-04-18Feltz Printing Service UNQUALIFIED4Bernardo Dominic
1002Aika G NickaItaly2025-04-08Commercial Press RENEWAL52Anna Fali
1003Wickens J FlosiCanada2025-04-24Feltz Printing Service RENEWAL58Onyama Limba
1004Kaitlin K SergiUnited Kingdom2025-04-23Morlong Associates PROPOSAL48Ivan Magalhaes
1005Antonio Q AlbaresCanada2025-04-07King, Christopher A Esq NEGOTIATION13Bernardo Dominic
1006Aditya J StensethArgentina2025-04-01Rangoni Of Florence PROPOSAL25Bernardo Dominic
1007Clifford Q PerinJapan2025-04-10Feltz Printing Service NEGOTIATION24Onyama Limba
1008Greenwood V FlosiIndia2025-04-06Rangoni Of Florence NEGOTIATION7Stephen Shaw
1009Leon U VenereCanada2025-04-06Commercial Press NEGOTIATION47Ioni Bowcher
1010Aditya S InouyeGermany2025-04-17Chanay, Jeffrey A Esq NEGOTIATION53Xuxue Feng
1011Maisha Q WhobreyUnited Kingdom2025-04-09Feltz Printing Service NEGOTIATION66Xuxue Feng
1012Nicolas X CaldareraArgentina2025-04-27Benton, John B Jr NEW98Anna Fali
1013Mayumi Q AmigonBrazil2025-04-11Morlong Associates NEGOTIATION86Ivan Magalhaes
1014Salvatore L AmigonSpain2025-04-06Dorl, James J Esq QUALIFIED43Onyama Limba
1015Octavia V NickaCanada2025-04-17Buckley Miller Wright RENEWAL69Ivan Magalhaes
1016Chavez O SchemmerFrance2025-04-08Printing Dimensions NEW4Stephen Shaw
1017Kaitlin I AmigonCanada2025-04-12Chemel, James L Cpa NEGOTIATION20Ivan Magalhaes
1018Leja M PoquetteJapan2025-04-17Rousseaux, Michael Esq RENEWAL47Amy Elsner
1019Morrow M SergiUnited Kingdom2025-04-28Buckley Miller Wright NEGOTIATION8Onyama Limba
1020Mujtaba H VenereJapan2025-04-19Rousseaux, Michael Esq QUALIFIED71Elwin Sharvill
1021Wickens A StockhamArgentina2025-04-15Feltz Printing Service NEGOTIATION29Stephen Shaw
1022Juan O RoysterJapan2025-04-23Truhlar And Truhlar Attys PROPOSAL12Elwin Sharvill
1023Faith Q BologniaSpain2025-04-06Rangoni Of Florence PROPOSAL22Ioni Bowcher
1024Alejandro F NestleJapan2025-04-23Chemel, James L Cpa UNQUALIFIED36Ivan Magalhaes
1025Wickens K SaylorsIndia2025-04-02Printing Dimensions PROPOSAL27Amy Elsner
1026Jennifer T RimItaly2025-04-21Printing Dimensions NEGOTIATION86Stephen Shaw
1027Mujtaba B WieserAustralia2025-04-13Chapman, Ross E Esq NEW47Xuxue Feng
1028Morrow R RutaCanada2025-04-09Rousseaux, Michael Esq NEGOTIATION73Elwin Sharvill
1029Alejandro A GillianIndia2025-04-16Rangoni Of Florence QUALIFIED51Xuxue Feng
1030Julie D RimSpain2025-04-15Rangoni Of Florence PROPOSAL76Asiya Javayant
1031Jones E BriddickAustralia2025-04-13Rousseaux, Michael Esq QUALIFIED57Onyama Limba
1032Jennifer O PerinSpain2025-04-28Truhlar And Truhlar Attys RENEWAL45Elwin Sharvill
1033Jennifer T DarakjyIndia2025-04-15Rousseaux, Michael Esq QUALIFIED53Anna Fali
1034Clifford U FlosiArgentina2025-04-22Morlong Associates RENEWAL18Onyama Limba
1035Greenwood P GillianCanada2025-04-02Feltz Printing Service QUALIFIED16Stephen Shaw
1036Juan L GarufiArgentina2025-04-11Commercial Press QUALIFIED24Asiya Javayant
1037James T OldroydGermany2025-04-29Rousseaux, Michael Esq RENEWAL8Onyama Limba
1038Darci K AlbaresSpain2025-04-14Feltz Printing Service UNQUALIFIED62Ioni Bowcher
1039Nicolas J StensethIndia2025-04-02Commercial Press QUALIFIED55Elwin Sharvill
1040Adams Z MaletAustralia2025-04-14Truhlar And Truhlar Attys PROPOSAL38Elwin Sharvill
1041Mujtaba W ShinkoFrance2025-04-29Buckley Miller Wright QUALIFIED53Ivan Magalhaes
1042Maria N FollerArgentina2025-04-03Chapman, Ross E Esq RENEWAL68Stephen Shaw
1043Isabel J NickaBrazil2025-04-02Rangoni Of Florence NEW88Stephen Shaw
1044Mayumi T OldroydBrazil2025-04-02Chapman, Ross E Esq UNQUALIFIED43Anna Fali
1045Claire M MacleadGermany2025-04-23Rousseaux, Michael Esq RENEWAL42Ioni Bowcher
1046Tony T SergiSpain2025-04-16Rangoni Of Florence UNQUALIFIED34Amy Elsner
1047Tony Q BowleyIndia2025-04-25Chanay, Jeffrey A Esq RENEWAL1Ivan Magalhaes
1048Octavia L OstroskyCanada2025-04-12Dorl, James J Esq QUALIFIED71Xuxue Feng
1049Jeanfrancois V StockhamAustralia2025-04-22Chapman, Ross E Esq UNQUALIFIED30Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Aditya L TollnerSpainIoni Bowcher QUALIFIED
Antonio V BowleyItalyBernardo Dominic PROPOSAL
Ricardo F AmigonGermanyIvan Magalhaes NEGOTIATION
Ivar D ChuiUnited KingdomAsiya Javayant PROPOSAL
Maria Y MorascaFranceElwin Sharvill UNQUALIFIED
Costa E RulapaughUnited KingdomOnyama Limba UNQUALIFIED
Arvin X MarrierGermanyIvan Magalhaes RENEWAL
Deepesh Y StensethAustraliaXuxue Feng NEW
Darci L CaldareraIndiaStephen Shaw RENEWAL
Aika P CaudyAustraliaIvan Magalhaes QUALIFIED
Rodrigues A DarakjyJapanStephen Shaw QUALIFIED
Misaki I WieserCanadaAmy Elsner NEW
Cody Y PerinGermanyAnna Fali PROPOSAL
Murillo G IturbideArgentinaStephen Shaw NEW
Silvio I ButtBrazilAmy Elsner RENEWAL
Adams F VenereItalyIoni Bowcher QUALIFIED
Aruna Z DarakjyItalyBernardo Dominic UNQUALIFIED
Francesco R WhobreyFranceOnyama Limba PROPOSAL
Maisha R TollnerAustraliaAsiya Javayant NEGOTIATION
Murillo V CampainFranceIoni Bowcher UNQUALIFIED
Leja T IturbideIndiaOnyama Limba UNQUALIFIED
Juan N WieserBrazilStephen Shaw NEW
Adams S BowleyRussiaAmy Elsner NEW
Emily A MarrierRussiaBernardo Dominic QUALIFIED
Leon G GillianJapanAmy Elsner UNQUALIFIED
Murillo O IturbideJapanOnyama Limba RENEWAL
Greenwood U RimSpainStephen Shaw PROPOSAL
Alejandro R GarufiAustraliaAsiya Javayant NEW
Adams P SlusarskiAustraliaIvan Magalhaes QUALIFIED
Aruna I GlickBrazilBernardo Dominic QUALIFIED
Deepesh U MorascaItalyElwin Sharvill PROPOSAL
Adams X GauchoItalyXuxue Feng PROPOSAL
Mayumi B FollerJapanAsiya Javayant PROPOSAL
Chavez Y MacleadSpainAnna Fali QUALIFIED
Leon M MorascaJapanXuxue Feng QUALIFIED
Leon S PerinUnited KingdomAmy Elsner NEW
Juan P VocelkaItalyElwin Sharvill QUALIFIED
Sinclair V MaletAustraliaAmy Elsner RENEWAL
Ricardo W DarakjyRussiaAsiya Javayant UNQUALIFIED
Juan U RulapaughGermanyAsiya Javayant NEW
Alejandro J StensethArgentinaStephen Shaw UNQUALIFIED
Deepesh T GillianAustraliaBernardo Dominic NEW
Faith T KuskoIndiaStephen Shaw NEGOTIATION
Munro V SaylorsItalyOnyama Limba RENEWAL
Jefferson D RutaRussiaElwin Sharvill UNQUALIFIED
Kadeem U SlusarskiFranceIoni Bowcher QUALIFIED
Jones Z RutaUnited KingdomIoni Bowcher NEGOTIATION
Deepesh W AlbaresItalyIvan Magalhaes NEW
Cody T WaycottItalyOnyama Limba QUALIFIED
Tony G IturbideRussiaXuxue Feng UNQUALIFIED
Frozen Columns
Name
Smith C Tollner
James I Amigon
Wickens Y Butt
Claire F Amigon
Nicolas Q Slusarski
Salvatore Z Nestle
Munro F Rulapaugh
Nicolas I Iturbide
Jefferson J Ostrosky
Maria S Schemmer
Smith C Oldroyd
Clifford G Sergi
Aika C Poquette
Ricardo O Albares
Rodrigues D Venere
Johnson W Slusarski
Faith V Venere
Deepesh J Sergi
Maria E Dilliard
Aditya A Iturbide
Jefferson P Chui
Francesco M Ferencz
Alejandro U Waycott
David Q Briddick
Ashley N Poquette
Jones Z Caudy
Jennifer Y Marrier
Maisha Q Venere
Maria M Inouye
Izzy N Glick
Salvatore E Nicka
Maria B Bolognia
Morrow T Poquette
Juan Z Amigon
Chavez T Waycott
Antonio A Oldroyd
James Y Vocelka
Ashley Z Shinko
Aruna J Doe
Isabel N Foller
Ricardo A Bowley
Claire J Ruta
Deepesh B Campain
Aika P Figeroa
Greenwood E Slusarski
Juan D Venere
Kadeem V Dilliard
Cody V Kusko
Claire I Ferencz
Faith Y Shinko
IdCountryDate
1000Italy2025-04-17
1001Canada2025-04-28
1002Argentina2025-04-26
1003Italy2025-04-17
1004Germany2025-04-17
1005Brazil2025-04-05
1006Canada2025-04-01
1007Argentina2025-04-13
1008Brazil2025-04-09
1009Brazil2025-04-03
1010France2025-04-23
1011Italy2025-04-01
1012Germany2025-04-24
1013Canada2025-04-01
1014Japan2025-04-18
1015France2025-04-28
1016France2025-04-07
1017United Kingdom2025-04-17
1018Japan2025-04-08
1019Brazil2025-04-29
1020Italy2025-04-25
1021Argentina2025-04-05
1022Australia2025-04-14
1023Russia2025-04-19
1024India2025-04-23
1025Italy2025-04-21
1026Russia2025-04-24
1027France2025-04-23
1028Canada2025-04-09
1029Italy2025-04-26
1030Italy2025-04-29
1031Japan2025-04-04
1032Brazil2025-04-22
1033Canada2025-04-28
1034France2025-04-07
1035Australia2025-04-13
1036Canada2025-04-25
1037Japan2025-03-31
1038United Kingdom2025-04-15
1039Spain2025-04-15
1040Germany2025-04-15
1041Russia2025-04-03
1042Germany2025-04-12
1043Russia2025-04-20
1044India2025-04-24
1045Canada2025-04-27
1046Spain2025-04-24
1047Japan2025-04-08
1048Australia2025-04-14
1049Italy2025-04-20

On-Demand Data

NameIdCountryDate
Emily V Whobrey1000Russia2025-04-13
Mujtaba O Doe1001India2025-04-23
Aditya O Garufi1002Australia2025-04-22
Aditya W Inouye1003Japan2025-04-07
Johnson M Malet1004Spain2025-04-13
Leja M Foller1005Spain2025-04-26
Antonio F Bowley1006Australia2025-04-13
Ivar F Albares1007Germany2025-04-11
Jeanfrancois M Wieser1008Russia2025-04-08
Aditya C Nicka1009Canada2025-04-02
Salvatore N Foller1010Canada2025-04-26
Tony J Butt1011France2025-04-09
Aruna W Darakjy1012Japan2025-04-01
Stacey V Chui1013United Kingdom2025-04-11
Aditya X Shinko1014Brazil2025-04-24
Greenwood S Waycott1015Australia2025-04-14
Sinclair E Stockham1016Argentina2025-04-20
Nicolas K Garufi1017Argentina2025-04-16
James T Ruta1018India2025-04-12
Julie R Morasca1019Japan2025-04-09
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jones G CampainAustraliaOnyama Limba NEGOTIATION
Maria N FlosiBrazilIvan Magalhaes UNQUALIFIED
Misaki S IturbideAustraliaStephen Shaw QUALIFIED
Leja T BriddickFranceXuxue Feng NEGOTIATION
Misaki V PoquetteAustraliaStephen Shaw RENEWAL
Isabel I StensethCanadaAmy Elsner UNQUALIFIED
Silvio D IturbideUnited KingdomIoni Bowcher PROPOSAL
Ivar B PoquetteSpainAmy Elsner UNQUALIFIED
Ricardo H WaycottRussiaAsiya Javayant NEGOTIATION
Ricardo V DarakjyAustraliaElwin Sharvill NEW
Deepesh L DilliardCanadaAsiya Javayant NEW
David S GauchoJapanOnyama Limba NEW
Wickens L TollnerCanadaXuxue Feng NEGOTIATION
Johnson R RimJapanAnna Fali UNQUALIFIED
Leon D InouyeCanadaBernardo Dominic QUALIFIED
Munro Q FlosiIndiaOnyama Limba NEW
Emily A StensethUnited KingdomStephen Shaw NEW
Smith R IturbideJapanXuxue Feng RENEWAL
David D StockhamAustraliaStephen Shaw UNQUALIFIED
David V FigeroaArgentinaAnna Fali UNQUALIFIED
Munro T WieserGermanyXuxue Feng QUALIFIED
David M VocelkaUnited KingdomOnyama Limba PROPOSAL
Kadeem U SaylorsRussiaXuxue Feng RENEWAL
Julie G FollerIndiaElwin Sharvill UNQUALIFIED
Aditya J GillianCanadaAmy Elsner UNQUALIFIED
Salvatore T GlickAustraliaXuxue Feng NEW
Smith H RutaJapanAmy Elsner PROPOSAL
Jones V WieserFranceAnna Fali RENEWAL
Leon B MaletBrazilAnna Fali QUALIFIED
Stacey V WaycottIndiaBernardo Dominic PROPOSAL
Aika T TollnerAustraliaAsiya Javayant NEGOTIATION
Clifford N AlbaresArgentinaElwin Sharvill UNQUALIFIED
Sinclair T CampainIndiaIvan Magalhaes UNQUALIFIED
Jones Z BowleyUnited KingdomAmy Elsner UNQUALIFIED
Kadeem W MaletJapanOnyama Limba UNQUALIFIED
Silvio A MarrierJapanBernardo Dominic QUALIFIED
Greenwood Y MaletCanadaIvan Magalhaes PROPOSAL
Izzy C SaylorsRussiaElwin Sharvill UNQUALIFIED
Isabel F ShinkoGermanyAsiya Javayant UNQUALIFIED
Chavez Z CaldareraUnited KingdomOnyama Limba 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>