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 W SaylorsCanadaAsiya Javayant UNQUALIFIED
Claire T NestleRussiaOnyama Limba NEGOTIATION
Stacey V VenereCanadaAmy Elsner QUALIFIED
Maisha K AlbaresIndiaAnna Fali PROPOSAL
Octavia A WaycottArgentinaAmy Elsner UNQUALIFIED
Izzy X DilliardArgentinaXuxue Feng PROPOSAL
Ivar J FollerGermanyOnyama Limba RENEWAL
Jeanfrancois G MacleadIndiaOnyama Limba PROPOSAL
Jefferson X DoeCanadaIvan Magalhaes QUALIFIED
Francesco B CaudyCanadaElwin Sharvill NEW
Jennifer A FigeroaJapanStephen Shaw QUALIFIED
Stacey R DoeCanadaAnna Fali NEW
Morrow R CaldareraJapanIoni Bowcher PROPOSAL
Tony E PaprockiItalyIoni Bowcher NEGOTIATION
Silvio C GlickIndiaAsiya Javayant NEGOTIATION
Tony K GauchoSpainStephen Shaw PROPOSAL
Adams T MacleadItalyXuxue Feng NEW
Jennifer D ShinkoGermanyOnyama Limba NEW
Aruna T WaycottGermanyAmy Elsner NEW
Faith D MaletArgentinaOnyama Limba QUALIFIED
Sinclair B RimUnited KingdomXuxue Feng NEGOTIATION
Chavez Y BologniaCanadaIvan Magalhaes NEW
Aditya K OldroydJapanIoni Bowcher RENEWAL
Misaki Y DoeAustraliaIvan Magalhaes RENEWAL
Ashley R NestleAustraliaStephen Shaw NEW
Juan D BologniaGermanyXuxue Feng QUALIFIED
Misaki F NestleArgentinaIoni Bowcher UNQUALIFIED
Kadeem U PaprockiBrazilElwin Sharvill RENEWAL
Izzy S GlickRussiaXuxue Feng NEGOTIATION
Nicolas C CaudyRussiaAmy Elsner NEGOTIATION
Ashley X OldroydBrazilXuxue Feng NEW
Stacey Z PoquetteItalyBernardo Dominic RENEWAL
Julie U GlickBrazilAmy Elsner PROPOSAL
Salvatore U MaletFranceElwin Sharvill UNQUALIFIED
Jeanfrancois Q DoeGermanyIvan Magalhaes NEW
Claire I StensethIndiaXuxue Feng NEGOTIATION
Jefferson Q RimItalyAmy Elsner PROPOSAL
Ivar W BriddickIndiaElwin Sharvill NEGOTIATION
Mujtaba V FlosiRussiaIvan Magalhaes NEW
Izzy O AmigonRussiaIoni Bowcher NEGOTIATION
Chavez A MarrierUnited KingdomAmy Elsner NEGOTIATION
Maisha K ButtJapanStephen Shaw PROPOSAL
Arvin K FerenczGermanyIoni Bowcher RENEWAL
Francesco F WaycottBrazilXuxue Feng QUALIFIED
Jefferson P MaletCanadaBernardo Dominic QUALIFIED
Misaki E MarrierSpainBernardo Dominic NEGOTIATION
Clifford L PoquetteArgentinaOnyama Limba PROPOSAL
Adams K FigeroaGermanyStephen Shaw RENEWAL
Sinclair S RutaItalyAmy Elsner NEW
Julie T KolmetzCanadaXuxue Feng PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Alejandro X TollnerIndiaIoni Bowcher QUALIFIED
Jeanfrancois O NickaItalyElwin Sharvill NEW
James F FigeroaItalyIoni Bowcher RENEWAL
Wickens A BologniaBrazilAsiya Javayant NEW
Aditya B BowleySpainElwin Sharvill UNQUALIFIED
Arvin Y BowleyRussiaStephen Shaw QUALIFIED
Chavez T FerenczItalyXuxue Feng RENEWAL
Izzy P GillianIndiaXuxue Feng RENEWAL
Alejandro W CaldareraItalyIvan Magalhaes PROPOSAL
Leon D FerenczAustraliaBernardo Dominic NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Jeanfrancois O SchemmerItaly2026-06-22Buckley Miller Wright QUALIFIED43Asiya Javayant
1001Jefferson S GauchoAustralia2026-06-20Dorl, James J Esq QUALIFIED48Xuxue Feng
1002Ashley E DoeBrazil2026-06-05Printing Dimensions NEW64Ioni Bowcher
1003Maisha J MaletGermany2026-07-03Feltz Printing Service PROPOSAL82Xuxue Feng
1004Jeanfrancois M DoeGermany2026-06-29Commercial Press QUALIFIED68Asiya Javayant
1005Emily P DoeArgentina2026-06-09King, Christopher A Esq NEGOTIATION68Xuxue Feng
1006Mujtaba C VocelkaRussia2026-06-09Truhlar And Truhlar Attys RENEWAL40Anna Fali
1007Johnson N RutaSpain2026-06-12Chemel, James L Cpa NEGOTIATION2Stephen Shaw
1008Leon F GauchoArgentina2026-06-18Printing Dimensions RENEWAL26Asiya Javayant
1009Jennifer W RoysterRussia2026-06-15Rangoni Of Florence QUALIFIED81Amy Elsner
1010Stacey C SchemmerRussia2026-06-09Rousseaux, Michael Esq PROPOSAL88Xuxue Feng
1011Francesco J BriddickUnited Kingdom2026-06-26Rangoni Of Florence NEGOTIATION87Ioni Bowcher
1012Chavez I KolmetzUnited Kingdom2026-06-17Feltz Printing Service NEGOTIATION76Xuxue Feng
1013Julie M RulapaughRussia2026-07-02Feiner Bros RENEWAL54Elwin Sharvill
1014Munro O CampainGermany2026-06-06Rangoni Of Florence UNQUALIFIED15Ioni Bowcher
1015Mujtaba C FollerGermany2026-07-02Rousseaux, Michael Esq UNQUALIFIED53Elwin Sharvill
1016Faith G VocelkaBrazil2026-06-23Printing Dimensions RENEWAL14Amy Elsner
1017Faith Y TollnerAustralia2026-06-29Truhlar And Truhlar Attys NEGOTIATION50Ioni Bowcher
1018Mujtaba I CaudyFrance2026-06-26Commercial Press QUALIFIED39Bernardo Dominic
1019Leon U WieserSpain2026-07-02Commercial Press NEW77Stephen Shaw
1020Murillo Y GillianGermany2026-06-27Truhlar And Truhlar Attys PROPOSAL41Ioni Bowcher
1021Mujtaba Q WaycottBrazil2026-07-03Commercial Press NEGOTIATION91Elwin Sharvill
1022Julie O CaudyAustralia2026-06-13Morlong Associates QUALIFIED97Ivan Magalhaes
1023Octavia Z NestleFrance2026-06-25King, Christopher A Esq QUALIFIED66Bernardo Dominic
1024Wickens N FollerAustralia2026-06-23Feltz Printing Service NEGOTIATION38Anna Fali
1025Adams P PaprockiBrazil2026-06-21Truhlar And Truhlar Attys PROPOSAL49Xuxue Feng
1026Aditya M StensethGermany2026-06-26Chemel, James L Cpa RENEWAL35Anna Fali
1027Maria D CaldareraCanada2026-06-25Chemel, James L Cpa PROPOSAL83Amy Elsner
1028Ricardo O SaylorsJapan2026-06-16Chemel, James L Cpa UNQUALIFIED19Stephen Shaw
1029Wickens F DoeUnited Kingdom2026-06-11Buckley Miller Wright NEW11Asiya Javayant
1030Jones W DilliardRussia2026-07-01Buckley Miller Wright QUALIFIED26Bernardo Dominic
1031Kaitlin Y NickaSpain2026-06-10Buckley Miller Wright UNQUALIFIED24Ioni Bowcher
1032Tony V MaletRussia2026-06-25Rangoni Of Florence NEW12Amy Elsner
1033Isabel K BologniaCanada2026-06-12Truhlar And Truhlar Attys QUALIFIED87Elwin Sharvill
1034Costa Q BologniaSpain2026-06-16Chanay, Jeffrey A Esq NEGOTIATION40Elwin Sharvill
1035Tony T OstroskyArgentina2026-06-11Printing Dimensions RENEWAL21Bernardo Dominic
1036Faith J MarrierArgentina2026-06-16Buckley Miller Wright NEW59Elwin Sharvill
1037Nicolas Q MaletItaly2026-06-09Morlong Associates PROPOSAL10Onyama Limba
1038Smith R StockhamUnited Kingdom2026-06-13Chemel, James L Cpa UNQUALIFIED58Bernardo Dominic
1039Rodrigues X ButtArgentina2026-06-19Feltz Printing Service PROPOSAL97Bernardo Dominic
1040Leja J SchemmerBrazil2026-06-17Morlong Associates PROPOSAL53Ioni Bowcher
1041Ivar I DarakjyBrazil2026-06-11Printing Dimensions RENEWAL18Elwin Sharvill
1042Octavia T DarakjyFrance2026-06-14Morlong Associates RENEWAL87Anna Fali
1043James F RulapaughBrazil2026-06-18Rangoni Of Florence NEW85Elwin Sharvill
1044Johnson U BowleyAustralia2026-06-08Dorl, James J Esq UNQUALIFIED1Elwin Sharvill
1045Murillo K VocelkaCanada2026-06-05Chemel, James L Cpa PROPOSAL28Ivan Magalhaes
1046Ivar Z InouyeItaly2026-06-08Chemel, James L Cpa QUALIFIED47Ioni Bowcher
1047Wickens S TollnerBrazil2026-06-25Rousseaux, Michael Esq PROPOSAL96Bernardo Dominic
1048Octavia K StensethCanada2026-06-20Chapman, Ross E Esq UNQUALIFIED57Bernardo Dominic
1049Morrow G PerinUnited Kingdom2026-06-22Feiner Bros QUALIFIED95Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Julie B DarakjyCanadaAsiya Javayant NEGOTIATION
Clifford N GillianSpainAmy Elsner PROPOSAL
Rodrigues M SergiFranceBernardo Dominic UNQUALIFIED
Leja Y MacleadFranceAmy Elsner NEW
David D DoeItalyStephen Shaw NEW
Munro I VocelkaUnited KingdomBernardo Dominic RENEWAL
Leon B DoeBrazilAmy Elsner RENEWAL
Claire H MacleadAustraliaIvan Magalhaes NEGOTIATION
Jones P IturbideGermanyOnyama Limba NEGOTIATION
Arvin I ShinkoCanadaAmy Elsner PROPOSAL
Jefferson L BologniaGermanyAsiya Javayant NEW
Mayumi R KuskoUnited KingdomIoni Bowcher NEW
James O GlickBrazilIvan Magalhaes NEGOTIATION
Octavia X FigeroaBrazilAnna Fali PROPOSAL
Ivar D CampainItalyXuxue Feng RENEWAL
Johnson F OstroskySpainIoni Bowcher NEW
Isabel H CaldareraAustraliaAsiya Javayant PROPOSAL
David Y MaletItalyAnna Fali NEGOTIATION
Aditya A AmigonFranceIvan Magalhaes NEGOTIATION
Costa H KuskoGermanyAsiya Javayant QUALIFIED
Mayumi T MacleadCanadaXuxue Feng RENEWAL
Maisha T SchemmerRussiaXuxue Feng RENEWAL
Aruna V WaycottBrazilStephen Shaw UNQUALIFIED
Francesco Z FlosiJapanAnna Fali PROPOSAL
Aika X AlbaresIndiaAsiya Javayant NEW
Ivar H NestleBrazilElwin Sharvill UNQUALIFIED
Ricardo I PerinRussiaXuxue Feng QUALIFIED
Emily O BowleySpainOnyama Limba NEGOTIATION
Misaki H CaudyRussiaAnna Fali UNQUALIFIED
Antonio K VocelkaGermanyAnna Fali RENEWAL
Maisha P PoquetteJapanXuxue Feng NEGOTIATION
Munro G RulapaughArgentinaXuxue Feng PROPOSAL
Salvatore L GlickArgentinaAsiya Javayant NEW
Kadeem D SergiItalyAnna Fali PROPOSAL
Maisha Q ShinkoRussiaStephen Shaw PROPOSAL
Johnson A ChuiJapanXuxue Feng NEW
Deepesh R PaprockiFranceElwin Sharvill NEGOTIATION
Aika Z PerinSpainAnna Fali QUALIFIED
Antonio N ButtFranceOnyama Limba NEW
Aika K WieserGermanyElwin Sharvill NEW
Darci H ButtJapanAnna Fali NEW
Silvio Z MacleadGermanyStephen Shaw PROPOSAL
Kadeem B DoeRussiaOnyama Limba NEW
Faith I StockhamCanadaIoni Bowcher UNQUALIFIED
Antonio T GauchoUnited KingdomAnna Fali RENEWAL
Adams P ChuiItalyOnyama Limba PROPOSAL
Ricardo A GillianAustraliaIvan Magalhaes QUALIFIED
James S NestleRussiaAmy Elsner NEW
Deepesh Q RulapaughRussiaAmy Elsner PROPOSAL
Aika H FlosiFranceElwin Sharvill NEGOTIATION
Frozen Columns
Name
Ashley R Stenseth
Jeanfrancois S Paprocki
Johnson I Shinko
Misaki P Doe
Deepesh V Oldroyd
Sinclair R Shinko
Alejandro F Marrier
Greenwood R Campain
Juan K Rulapaugh
Mujtaba B Kolmetz
Kaitlin P Marrier
Johnson L Waycott
Sinclair B Maclead
Stacey Y Waycott
Darci O Chui
Claire N Iturbide
Adams X Foller
Juan D Slusarski
Maria K Perin
Stacey W Garufi
Arvin W Campain
Alejandro D Malet
Leja X Amigon
Emily W Iturbide
Nicolas D Nestle
Emily T Doe
Johnson W Royster
Ricardo C Ruta
Wickens P Shinko
Ivar M Stockham
Maria I Rim
Smith Q Campain
Ivar T Tollner
Wickens H Oldroyd
Chavez O Nestle
Isabel W Maclead
Jennifer M Rim
Julie Z Stenseth
Costa L Gaucho
Aditya F Inouye
Johnson F Stockham
Stacey W Campain
Julie R Garufi
Francesco N Figeroa
Ivar E Vocelka
Salvatore E Tollner
Jennifer G Stockham
Rodrigues O Foller
Ivar F Ruta
Rodrigues Y Chui
IdCountryDate
1000India2026-06-24
1001Japan2026-06-18
1002Japan2026-06-12
1003United Kingdom2026-07-01
1004India2026-06-30
1005France2026-06-08
1006India2026-06-27
1007France2026-06-09
1008United Kingdom2026-06-26
1009Japan2026-06-18
1010Brazil2026-06-21
1011Spain2026-06-26
1012Italy2026-06-14
1013France2026-06-24
1014Germany2026-06-11
1015Italy2026-07-02
1016Australia2026-06-08
1017Australia2026-06-06
1018Argentina2026-06-29
1019Brazil2026-06-14
1020Germany2026-06-19
1021Germany2026-06-13
1022United Kingdom2026-06-17
1023India2026-06-25
1024India2026-06-23
1025United Kingdom2026-06-20
1026Brazil2026-06-11
1027Canada2026-06-29
1028Brazil2026-06-06
1029Argentina2026-06-14
1030Italy2026-06-06
1031Spain2026-06-26
1032Italy2026-06-09
1033Canada2026-06-14
1034India2026-06-15
1035Spain2026-06-05
1036Italy2026-06-28
1037Japan2026-06-27
1038Canada2026-06-20
1039Australia2026-06-17
1040Russia2026-06-13
1041Russia2026-06-16
1042Russia2026-06-10
1043Italy2026-07-01
1044Canada2026-06-20
1045India2026-06-05
1046Spain2026-06-05
1047Italy2026-06-11
1048Australia2026-06-17
1049France2026-06-05

On-Demand Data

NameIdCountryDate
Nicolas O Schemmer1000Japan2026-06-30
Smith L Perin1001Japan2026-06-28
Jefferson W Briddick1002India2026-07-01
Jefferson A Figeroa1003Canada2026-06-15
Ricardo D Poquette1004Australia2026-06-27
David W Bowley1005Spain2026-06-24
James V Gillian1006Japan2026-06-06
Silvio Z Rulapaugh1007Canada2026-06-23
David K Malet1008Argentina2026-06-06
Silvio Q Nestle1009France2026-06-05
Maria X Vocelka1010Australia2026-06-09
Faith J Gaucho1011Italy2026-07-03
Alejandro E Ostrosky1012India2026-06-20
Antonio T Saylors1013Germany2026-06-04
Maria K Wieser1014India2026-06-04
Darci G Paprocki1015Canada2026-06-21
Francesco X Perin1016Canada2026-06-17
Alejandro G Perin1017Germany2026-06-08
Adams W Flosi1018Italy2026-06-27
Darci S Oldroyd1019Germany2026-06-10
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Cody D BologniaSpainAmy Elsner NEW
Leon B FigeroaJapanBernardo Dominic RENEWAL
Cody F FlosiFranceAsiya Javayant NEGOTIATION
Alejandro H FerenczGermanyElwin Sharvill RENEWAL
Munro A RutaRussiaAmy Elsner NEW
Smith A WieserIndiaAmy Elsner PROPOSAL
Claire M WhobreyBrazilElwin Sharvill PROPOSAL
Emily B MaletRussiaAmy Elsner RENEWAL
Ashley X FerenczGermanyOnyama Limba NEW
Darci O SaylorsIndiaXuxue Feng PROPOSAL
Stacey Q WaycottJapanIvan Magalhaes NEGOTIATION
Morrow Y BriddickRussiaIoni Bowcher PROPOSAL
Morrow V ShinkoBrazilAnna Fali PROPOSAL
Aika O SergiIndiaAmy Elsner RENEWAL
Deepesh U KuskoRussiaXuxue Feng PROPOSAL
Munro Q RutaCanadaBernardo Dominic QUALIFIED
Kadeem D NickaJapanBernardo Dominic QUALIFIED
Faith E IturbideFranceOnyama Limba NEW
Octavia L GlickCanadaIoni Bowcher RENEWAL
Mujtaba M StensethIndiaIoni Bowcher UNQUALIFIED
James C AmigonSpainAmy Elsner QUALIFIED
Mayumi M FollerAustraliaStephen Shaw NEGOTIATION
Kaitlin R NickaJapanStephen Shaw NEW
Juan V VenereItalyStephen Shaw NEW
Arvin A BologniaGermanyBernardo Dominic QUALIFIED
Deepesh X RimItalyStephen Shaw NEW
Juan S DarakjyJapanAnna Fali NEW
Clifford U MaletRussiaIvan Magalhaes NEGOTIATION
Murillo C GarufiUnited KingdomOnyama Limba UNQUALIFIED
Cody V SergiUnited KingdomAnna Fali QUALIFIED
Aruna I NickaCanadaAmy Elsner QUALIFIED
Deepesh C FigeroaIndiaAsiya Javayant QUALIFIED
Costa I StockhamJapanOnyama Limba NEW
Deepesh V InouyeItalyIvan Magalhaes NEGOTIATION
Aika X VenereFranceXuxue Feng RENEWAL
Jefferson N SergiGermanyElwin Sharvill UNQUALIFIED
Arvin P CampainBrazilAsiya Javayant NEGOTIATION
Faith P PerinJapanElwin Sharvill UNQUALIFIED
Munro L InouyeCanadaElwin Sharvill PROPOSAL
Mujtaba C CaudyAustraliaOnyama Limba 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>