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
Deepesh B AmigonArgentinaStephen Shaw NEW
Darci W FerenczIndiaXuxue Feng NEGOTIATION
Arvin R GauchoUnited KingdomOnyama Limba QUALIFIED
Wickens G MaletAustraliaAmy Elsner QUALIFIED
Wickens L CaudyItalyBernardo Dominic QUALIFIED
Wickens Y OldroydIndiaXuxue Feng PROPOSAL
Ashley Y FollerJapanIvan Magalhaes QUALIFIED
Emily O PerinArgentinaIvan Magalhaes NEW
Leon U WhobreyGermanyXuxue Feng QUALIFIED
Kaitlin O WaycottSpainStephen Shaw RENEWAL
Izzy G MorascaRussiaOnyama Limba NEW
Misaki Z FollerBrazilIvan Magalhaes NEW
Aika K AmigonFranceAnna Fali PROPOSAL
Kadeem N WaycottGermanyAsiya Javayant QUALIFIED
Antonio I PerinAustraliaStephen Shaw NEW
Octavia J NickaUnited KingdomAmy Elsner UNQUALIFIED
Alejandro F DoeBrazilAnna Fali PROPOSAL
Julie Y SaylorsItalyOnyama Limba PROPOSAL
David T FlosiIndiaOnyama Limba RENEWAL
Leja I FigeroaArgentinaBernardo Dominic QUALIFIED
Ivar R InouyeFranceStephen Shaw QUALIFIED
Deepesh J SlusarskiBrazilIvan Magalhaes NEW
Rodrigues Y FollerAustraliaIoni Bowcher PROPOSAL
Maisha J CaudyArgentinaBernardo Dominic PROPOSAL
Arvin I TollnerItalyAsiya Javayant NEGOTIATION
Faith P SlusarskiRussiaAsiya Javayant UNQUALIFIED
Jeanfrancois I WhobreyItalyIvan Magalhaes UNQUALIFIED
Isabel I FlosiGermanyBernardo Dominic RENEWAL
Chavez I VocelkaRussiaAnna Fali UNQUALIFIED
Salvatore B SchemmerUnited KingdomBernardo Dominic NEW
Silvio Y MaletIndiaXuxue Feng NEW
Maria O BriddickItalyBernardo Dominic NEGOTIATION
Jennifer W SlusarskiFranceXuxue Feng NEW
Costa O GlickAustraliaOnyama Limba RENEWAL
Leon D MacleadArgentinaIoni Bowcher NEW
Leon E OstroskyBrazilBernardo Dominic NEGOTIATION
Francesco R VenereBrazilBernardo Dominic QUALIFIED
Darci R GillianItalyAsiya Javayant UNQUALIFIED
Nicolas Z GillianAustraliaStephen Shaw NEW
Ashley I GillianItalyIvan Magalhaes UNQUALIFIED
Murillo R KuskoGermanyBernardo Dominic PROPOSAL
Julie X CampainArgentinaAmy Elsner RENEWAL
Salvatore J OldroydSpainBernardo Dominic QUALIFIED
Munro T RutaIndiaElwin Sharvill RENEWAL
David A GlickCanadaAnna Fali NEGOTIATION
Darci S NestleJapanXuxue Feng NEGOTIATION
Salvatore I SlusarskiBrazilElwin Sharvill PROPOSAL
Jennifer C GarufiJapanIoni Bowcher PROPOSAL
Mayumi N WaycottUnited KingdomXuxue Feng PROPOSAL
Darci I VenereFranceOnyama Limba RENEWAL
Horizontal
NameCountryRepresentativeStatus
Jefferson V FlosiRussiaAsiya Javayant QUALIFIED
Maisha K OldroydSpainIoni Bowcher NEW
Antonio Y ButtJapanIvan Magalhaes UNQUALIFIED
Sinclair J TollnerCanadaBernardo Dominic NEW
Ricardo L DoeUnited KingdomIvan Magalhaes PROPOSAL
Adams J MaletUnited KingdomAmy Elsner UNQUALIFIED
Leja T FerenczGermanyAnna Fali QUALIFIED
Kadeem V OstroskyJapanXuxue Feng RENEWAL
Silvio I PerinCanadaStephen Shaw NEW
Munro U SlusarskiCanadaAsiya Javayant RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Isabel F FigeroaBrazil2025-04-09Printing Dimensions RENEWAL46Ioni Bowcher
1001Claire Z MarrierItaly2025-04-07King, Christopher A Esq UNQUALIFIED87Onyama Limba
1002Antonio E PerinArgentina2025-04-01Commercial Press PROPOSAL30Stephen Shaw
1003Kaitlin W MorascaRussia2025-04-10King, Christopher A Esq PROPOSAL17Bernardo Dominic
1004Kadeem G FerenczGermany2025-04-23Dorl, James J Esq QUALIFIED87Stephen Shaw
1005Sinclair Q GillianJapan2025-04-23Commercial Press RENEWAL92Stephen Shaw
1006Claire W MorascaFrance2025-04-30Buckley Miller Wright PROPOSAL39Anna Fali
1007Sinclair X AlbaresSpain2025-04-17Commercial Press NEW9Xuxue Feng
1008Smith Y BriddickFrance2025-04-23Chemel, James L Cpa RENEWAL62Elwin Sharvill
1009Nicolas S SergiBrazil2025-04-29King, Christopher A Esq PROPOSAL16Xuxue Feng
1010Aditya R OldroydAustralia2025-04-27Chapman, Ross E Esq PROPOSAL76Ivan Magalhaes
1011Wickens P RutaCanada2025-04-23Rangoni Of Florence UNQUALIFIED29Elwin Sharvill
1012Misaki X AlbaresGermany2025-04-01Dorl, James J Esq NEW19Anna Fali
1013Maisha B ChuiFrance2025-04-23Feltz Printing Service RENEWAL64Anna Fali
1014Costa L AlbaresRussia2025-04-17Chemel, James L Cpa NEW23Ivan Magalhaes
1015Smith F DarakjyFrance2025-04-08Benton, John B Jr NEGOTIATION89Asiya Javayant
1016Sinclair T GillianBrazil2025-04-17King, Christopher A Esq NEGOTIATION3Ivan Magalhaes
1017Aditya N GillianGermany2025-04-19Chapman, Ross E Esq QUALIFIED88Stephen Shaw
1018Emily G ChuiIndia2025-04-11Printing Dimensions NEW51Stephen Shaw
1019Adams P DilliardUnited Kingdom2025-04-08Benton, John B Jr NEW10Ioni Bowcher
1020Leon Q InouyeJapan2025-04-14Buckley Miller Wright NEGOTIATION34Anna Fali
1021Maria S OstroskySpain2025-04-05Chapman, Ross E Esq NEW2Elwin Sharvill
1022Sinclair T ButtSpain2025-04-19Feiner Bros NEW67Asiya Javayant
1023Aditya D SaylorsArgentina2025-04-27Morlong Associates PROPOSAL63Ioni Bowcher
1024Morrow L AlbaresSpain2025-04-16Rousseaux, Michael Esq RENEWAL56Anna Fali
1025Adams J SergiUnited Kingdom2025-04-21King, Christopher A Esq PROPOSAL23Asiya Javayant
1026Cody X DilliardJapan2025-04-19Buckley Miller Wright PROPOSAL98Stephen Shaw
1027Ricardo T DilliardAustralia2025-04-04Rangoni Of Florence UNQUALIFIED72Stephen Shaw
1028Kaitlin O PerinSpain2025-04-28Chanay, Jeffrey A Esq QUALIFIED97Onyama Limba
1029Rodrigues X RimAustralia2025-04-13Chanay, Jeffrey A Esq NEGOTIATION24Asiya Javayant
1030Mayumi M DarakjyItaly2025-04-25Feltz Printing Service QUALIFIED58Ioni Bowcher
1031Aika F ButtGermany2025-04-28Feltz Printing Service QUALIFIED86Asiya Javayant
1032Kadeem O GlickIndia2025-04-04Dorl, James J Esq NEGOTIATION2Elwin Sharvill
1033Rodrigues F KuskoFrance2025-04-02Rangoni Of Florence NEGOTIATION0Anna Fali
1034Darci N VenereCanada2025-04-23Rousseaux, Michael Esq NEGOTIATION58Xuxue Feng
1035Greenwood R DarakjyGermany2025-04-17Feltz Printing Service QUALIFIED39Ivan Magalhaes
1036Izzy Y ChuiJapan2025-04-24Rousseaux, Michael Esq NEGOTIATION58Amy Elsner
1037Chavez X InouyeRussia2025-04-25Rousseaux, Michael Esq PROPOSAL99Bernardo Dominic
1038Costa E AlbaresItaly2025-04-03King, Christopher A Esq NEGOTIATION74Ivan Magalhaes
1039Juan W PerinArgentina2025-04-24Dorl, James J Esq QUALIFIED50Bernardo Dominic
1040Leja X VenereCanada2025-04-05Buckley Miller Wright NEW33Xuxue Feng
1041Jennifer Y SaylorsRussia2025-04-05Commercial Press RENEWAL51Elwin Sharvill
1042Leon C BriddickRussia2025-04-10Buckley Miller Wright NEGOTIATION31Bernardo Dominic
1043Leon P VocelkaFrance2025-04-11Buckley Miller Wright QUALIFIED44Onyama Limba
1044Alejandro P ButtCanada2025-04-27Morlong Associates NEGOTIATION43Ioni Bowcher
1045Smith P BriddickUnited Kingdom2025-04-27Rangoni Of Florence QUALIFIED97Ioni Bowcher
1046Faith N OstroskyItaly2025-04-03Morlong Associates PROPOSAL28Onyama Limba
1047Chavez V SaylorsCanada2025-04-16Morlong Associates NEGOTIATION76Onyama Limba
1048Kadeem L PerinGermany2025-04-15Feltz Printing Service UNQUALIFIED81Elwin Sharvill
1049Costa N AlbaresBrazil2025-04-17Printing Dimensions UNQUALIFIED9Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
David V GauchoItalyAsiya Javayant UNQUALIFIED
Ivar S TollnerJapanIoni Bowcher PROPOSAL
Leja X NickaArgentinaBernardo Dominic NEW
Aruna X OldroydAustraliaAsiya Javayant QUALIFIED
Morrow I ShinkoIndiaStephen Shaw QUALIFIED
Octavia P NestleArgentinaIvan Magalhaes PROPOSAL
Faith O BologniaSpainIvan Magalhaes UNQUALIFIED
Morrow Y GauchoUnited KingdomIvan Magalhaes NEGOTIATION
Aika J VocelkaIndiaAmy Elsner PROPOSAL
Ashley U MaletArgentinaStephen Shaw QUALIFIED
Nicolas S PerinUnited KingdomAnna Fali NEGOTIATION
Johnson X MarrierFranceStephen Shaw RENEWAL
Alejandro T FollerFranceIvan Magalhaes UNQUALIFIED
Isabel S CampainUnited KingdomOnyama Limba NEGOTIATION
Ashley A KuskoFranceElwin Sharvill PROPOSAL
Smith P MorascaFranceOnyama Limba RENEWAL
Murillo G VocelkaBrazilXuxue Feng QUALIFIED
Arvin E FerenczBrazilElwin Sharvill UNQUALIFIED
Tony Z GlickUnited KingdomAmy Elsner NEGOTIATION
Morrow P NestleJapanAsiya Javayant PROPOSAL
Cody K CaudyItalyBernardo Dominic QUALIFIED
Smith J MaletItalyIoni Bowcher NEW
Faith Y KolmetzItalyIoni Bowcher PROPOSAL
Morrow C MorascaCanadaAnna Fali UNQUALIFIED
Maria A VenereJapanAnna Fali PROPOSAL
Salvatore W GillianJapanOnyama Limba NEW
Aika V BowleyArgentinaElwin Sharvill QUALIFIED
Leon U BowleyArgentinaStephen Shaw NEW
Aika E NickaBrazilElwin Sharvill RENEWAL
Julie G CaldareraGermanyAsiya Javayant RENEWAL
Tony X WaycottArgentinaIoni Bowcher NEW
Darci N MacleadItalyXuxue Feng RENEWAL
Johnson H BologniaJapanStephen Shaw NEGOTIATION
Munro Q VocelkaSpainAnna Fali RENEWAL
Adams O SlusarskiItalyAnna Fali NEGOTIATION
Darci O RutaArgentinaElwin Sharvill QUALIFIED
Nicolas N OstroskyFranceBernardo Dominic QUALIFIED
Isabel Q RoysterArgentinaIoni Bowcher NEGOTIATION
Leon X TollnerSpainStephen Shaw RENEWAL
Clifford S FigeroaBrazilStephen Shaw RENEWAL
Kadeem Y RoysterGermanyIoni Bowcher NEW
Johnson J MacleadFranceXuxue Feng QUALIFIED
Adams B ShinkoUnited KingdomAnna Fali RENEWAL
Munro D SergiRussiaStephen Shaw UNQUALIFIED
Ashley J PerinJapanAmy Elsner PROPOSAL
Clifford K InouyeSpainOnyama Limba NEW
Maria C OldroydSpainAnna Fali NEGOTIATION
Francesco M SaylorsCanadaOnyama Limba UNQUALIFIED
Kadeem M RoysterGermanyXuxue Feng NEW
Leon A WhobreyAustraliaBernardo Dominic PROPOSAL
Frozen Columns
Name
Leja W Figeroa
Greenwood B Foller
Stacey F Foller
Johnson P Dilliard
Izzy E Nicka
David G Shinko
Arvin N Ostrosky
Arvin I Bolognia
Smith N Poquette
Mujtaba K Figeroa
Maisha E Garufi
Munro C Sergi
Francesco H Malet
Izzy R Dilliard
Izzy E Briddick
Mujtaba V Tollner
Octavia O Foller
Darci D Figeroa
Chavez L Bowley
Leon U Saylors
Julie C Tollner
Ashley D Flosi
Julie U Butt
Juan W Paprocki
Cody X Albares
Misaki W Chui
Octavia Y Foller
Alejandro A Inouye
Arvin Y Doe
Kaitlin G Waycott
Maria P Nicka
Octavia D Perin
Isabel S Briddick
Jones Q Waycott
Faith A Stenseth
Jennifer G Kolmetz
Leja I Darakjy
Mujtaba J Butt
Kaitlin X Gaucho
Izzy V Rulapaugh
Mujtaba G Bowley
Jennifer M Malet
Cody X Schemmer
Leja L Stenseth
Jennifer G Morasca
Salvatore Y Caudy
Munro X Nestle
Maisha Y Rim
Nicolas J Morasca
Chavez T Saylors
IdCountryDate
1000Italy2025-04-29
1001Argentina2025-04-23
1002Germany2025-04-19
1003Germany2025-04-29
1004Brazil2025-04-26
1005Australia2025-04-20
1006Italy2025-04-20
1007Australia2025-04-02
1008Canada2025-04-02
1009Germany2025-04-16
1010France2025-04-18
1011Italy2025-04-03
1012United Kingdom2025-04-01
1013Spain2025-04-20
1014Germany2025-04-19
1015Italy2025-04-27
1016Russia2025-04-19
1017Australia2025-04-30
1018United Kingdom2025-04-20
1019Brazil2025-04-08
1020Russia2025-04-01
1021Brazil2025-04-08
1022Spain2025-04-16
1023Italy2025-04-09
1024Argentina2025-04-14
1025France2025-04-18
1026Russia2025-04-03
1027Canada2025-04-28
1028Russia2025-04-23
1029United Kingdom2025-04-19
1030Russia2025-04-21
1031Germany2025-04-23
1032Brazil2025-04-26
1033Japan2025-04-04
1034Germany2025-04-29
1035India2025-04-16
1036United Kingdom2025-04-20
1037Italy2025-04-27
1038France2025-04-27
1039Japan2025-04-11
1040Australia2025-04-28
1041Japan2025-04-09
1042Australia2025-04-06
1043Russia2025-04-17
1044Canada2025-04-25
1045Argentina2025-04-08
1046United Kingdom2025-04-03
1047India2025-04-28
1048Japan2025-04-26
1049Spain2025-04-12

On-Demand Data

NameIdCountryDate
Smith R Poquette1000Spain2025-04-26
James A Chui1001United Kingdom2025-04-15
Arvin V Nicka1002Spain2025-04-28
Maria J Maclead1003Australia2025-04-20
Morrow X Campain1004Germany2025-04-25
Ricardo M Chui1005Spain2025-04-06
Arvin Z Nestle1006Argentina2025-04-11
Darci A Slusarski1007Argentina2025-04-16
Ashley K Oldroyd1008France2025-04-24
Jones F Figeroa1009France2025-04-16
Jones E Tollner1010Canada2025-04-01
Chavez K Briddick1011Argentina2025-04-23
Octavia L Morasca1012Argentina2025-04-25
David J Doe1013Germany2025-04-26
Aruna V Perin1014United Kingdom2025-04-01
Francesco U Caldarera1015Italy2025-04-18
Sinclair Z Rulapaugh1016Spain2025-04-09
Leon O Vocelka1017Russia2025-04-23
Cody C Whobrey1018Russia2025-04-10
Costa A Briddick1019India2025-04-09
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Ivar C NestleJapanBernardo Dominic NEGOTIATION
Salvatore E NickaUnited KingdomAsiya Javayant RENEWAL
Mujtaba K PoquetteCanadaAnna Fali NEW
Jennifer R ShinkoCanadaAmy Elsner RENEWAL
Deepesh O AlbaresArgentinaAnna Fali RENEWAL
Jennifer O FigeroaSpainAnna Fali RENEWAL
Sinclair V FollerJapanAmy Elsner RENEWAL
Aditya O BowleyAustraliaXuxue Feng NEGOTIATION
Faith D BologniaSpainBernardo Dominic NEW
Aika P DoeUnited KingdomBernardo Dominic QUALIFIED
Johnson Y ShinkoArgentinaBernardo Dominic NEW
Morrow J AlbaresIndiaIoni Bowcher NEGOTIATION
Francesco Z FigeroaArgentinaBernardo Dominic NEGOTIATION
Leja P FerenczUnited KingdomIoni Bowcher NEW
Sinclair P NestleRussiaOnyama Limba NEGOTIATION
Kadeem Y InouyeIndiaOnyama Limba RENEWAL
Adams P PoquetteAustraliaIoni Bowcher NEW
Salvatore K DoeGermanyBernardo Dominic QUALIFIED
Johnson I KolmetzGermanyIoni Bowcher RENEWAL
Jefferson X ChuiJapanStephen Shaw NEGOTIATION
Leon A KuskoSpainAmy Elsner PROPOSAL
Costa D ShinkoRussiaIvan Magalhaes UNQUALIFIED
Munro E BowleyJapanStephen Shaw QUALIFIED
Chavez I KolmetzJapanElwin Sharvill PROPOSAL
Julie L IturbideItalyStephen Shaw UNQUALIFIED
Wickens V DoeAustraliaBernardo Dominic PROPOSAL
Kadeem U StensethAustraliaOnyama Limba NEGOTIATION
Mujtaba Q StockhamItalyBernardo Dominic RENEWAL
Aditya A RoysterArgentinaElwin Sharvill QUALIFIED
Kaitlin X GlickCanadaAnna Fali QUALIFIED
Tony G ButtAustraliaAmy Elsner PROPOSAL
Clifford X CaldareraJapanOnyama Limba PROPOSAL
Cody K CaudyBrazilIvan Magalhaes NEW
Rodrigues W ChuiUnited KingdomBernardo Dominic QUALIFIED
Octavia J SergiCanadaXuxue Feng QUALIFIED
Wickens A MacleadArgentinaStephen Shaw UNQUALIFIED
Emily H ChuiFranceOnyama Limba NEW
Rodrigues T CaudySpainOnyama Limba NEW
Rodrigues L GlickRussiaXuxue Feng NEW
Jones T ChuiBrazilBernardo Dominic RENEWAL

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