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
James X BowleySpainBernardo Dominic NEW
Nicolas L OldroydBrazilStephen Shaw PROPOSAL
Emily G FollerGermanyAmy Elsner NEW
Arvin H MaletUnited KingdomOnyama Limba QUALIFIED
Murillo I StensethGermanyStephen Shaw NEGOTIATION
Aruna A MaletRussiaXuxue Feng NEW
Silvio G PaprockiBrazilStephen Shaw UNQUALIFIED
Mayumi Y CaudyBrazilOnyama Limba PROPOSAL
Morrow Y AmigonFranceStephen Shaw UNQUALIFIED
James I DilliardBrazilElwin Sharvill PROPOSAL
David V NickaItalyIvan Magalhaes NEW
Cody D RutaUnited KingdomBernardo Dominic NEGOTIATION
Aruna J BologniaAustraliaAmy Elsner UNQUALIFIED
Costa E GillianFranceAnna Fali NEW
Jeanfrancois W FerenczRussiaBernardo Dominic NEW
Mujtaba Z OldroydBrazilOnyama Limba NEGOTIATION
Darci M KolmetzFranceStephen Shaw PROPOSAL
Isabel J DoeCanadaAnna Fali NEW
Jones O IturbideBrazilXuxue Feng NEGOTIATION
Mayumi Z AlbaresJapanIvan Magalhaes RENEWAL
Aika W PerinFranceStephen Shaw RENEWAL
Silvio T ChuiAustraliaStephen Shaw NEW
Aditya S MaletAustraliaAsiya Javayant PROPOSAL
Julie V ButtItalyIoni Bowcher RENEWAL
Claire A FigeroaBrazilAnna Fali NEW
Johnson C AmigonUnited KingdomIvan Magalhaes QUALIFIED
Kaitlin X DarakjyFranceElwin Sharvill QUALIFIED
Chavez O DoeUnited KingdomIoni Bowcher NEGOTIATION
Aika L DilliardCanadaXuxue Feng RENEWAL
Emily M MorascaCanadaAnna Fali NEW
Mujtaba Z NickaUnited KingdomElwin Sharvill UNQUALIFIED
Izzy O TollnerAustraliaElwin Sharvill UNQUALIFIED
Deepesh T GillianUnited KingdomAsiya Javayant NEW
Antonio S SergiSpainOnyama Limba NEGOTIATION
Ashley G MaletBrazilElwin Sharvill UNQUALIFIED
Munro M CaldareraRussiaAnna Fali RENEWAL
Juan H NickaGermanyElwin Sharvill NEGOTIATION
Jefferson Z RimJapanAsiya Javayant UNQUALIFIED
Clifford N RutaUnited KingdomElwin Sharvill NEGOTIATION
Costa A MaletIndiaAsiya Javayant NEW
Leon F DarakjyCanadaBernardo Dominic QUALIFIED
Maisha T FollerBrazilXuxue Feng NEGOTIATION
Silvio Z SlusarskiArgentinaElwin Sharvill NEW
Octavia U SchemmerAustraliaAmy Elsner NEW
Arvin O PerinCanadaIvan Magalhaes NEGOTIATION
Mayumi P SchemmerUnited KingdomElwin Sharvill QUALIFIED
Maisha E StockhamAustraliaAsiya Javayant QUALIFIED
Silvio S ButtUnited KingdomAmy Elsner QUALIFIED
Jones B StensethSpainStephen Shaw QUALIFIED
Darci A VocelkaArgentinaOnyama Limba NEW
Horizontal
NameCountryRepresentativeStatus
David U VenereAustraliaAsiya Javayant NEGOTIATION
Claire D ChuiItalyStephen Shaw NEW
Chavez C AmigonArgentinaIvan Magalhaes PROPOSAL
Tony X BologniaAustraliaAmy Elsner NEGOTIATION
Izzy Z InouyeIndiaXuxue Feng NEGOTIATION
Nicolas M BologniaItalyIvan Magalhaes QUALIFIED
Kaitlin E AlbaresCanadaIoni Bowcher PROPOSAL
Smith S ShinkoBrazilIvan Magalhaes QUALIFIED
Deepesh K FerenczBrazilXuxue Feng PROPOSAL
Isabel Q DilliardCanadaOnyama Limba PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Octavia V GarufiBrazil2025-04-15Feiner Bros QUALIFIED42Xuxue Feng
1001Aditya X FollerJapan2025-04-29Truhlar And Truhlar Attys PROPOSAL57Onyama Limba
1002Jones C FollerIndia2025-04-03Morlong Associates NEW98Anna Fali
1003Morrow O FigeroaJapan2025-04-14Chapman, Ross E Esq RENEWAL25Amy Elsner
1004David L WhobreyGermany2025-04-14Buckley Miller Wright QUALIFIED3Onyama Limba
1005Francesco Q GlickJapan2025-04-10Chemel, James L Cpa UNQUALIFIED58Anna Fali
1006Tony H PaprockiCanada2025-04-11Commercial Press PROPOSAL28Ioni Bowcher
1007Mayumi I GillianGermany2025-04-17Rousseaux, Michael Esq QUALIFIED38Xuxue Feng
1008Jones C NestleGermany2025-04-24Truhlar And Truhlar Attys PROPOSAL56Amy Elsner
1009Arvin T KuskoGermany2025-04-08Chemel, James L Cpa PROPOSAL34Onyama Limba
1010Jones E FlosiUnited Kingdom2025-04-22Buckley Miller Wright NEGOTIATION29Ioni Bowcher
1011Johnson M KuskoGermany2025-04-07Dorl, James J Esq UNQUALIFIED50Ioni Bowcher
1012Jeanfrancois T MaletFrance2025-04-05Commercial Press PROPOSAL9Onyama Limba
1013Aditya W DoeArgentina2025-04-24Truhlar And Truhlar Attys NEW5Anna Fali
1014Tony N SchemmerJapan2025-04-28Rousseaux, Michael Esq QUALIFIED45Ivan Magalhaes
1015Mujtaba K KuskoBrazil2025-04-28Printing Dimensions NEW18Amy Elsner
1016Ivar T SlusarskiFrance2025-04-07Commercial Press UNQUALIFIED34Stephen Shaw
1017Izzy Z TollnerBrazil2025-04-20Benton, John B Jr NEGOTIATION75Elwin Sharvill
1018Mayumi C FerenczRussia2025-04-20Benton, John B Jr NEGOTIATION63Bernardo Dominic
1019Rodrigues N BriddickFrance2025-04-28Feltz Printing Service NEW96Xuxue Feng
1020Stacey A GauchoUnited Kingdom2025-04-19Buckley Miller Wright QUALIFIED2Onyama Limba
1021Emily O KuskoFrance2025-04-14Buckley Miller Wright QUALIFIED8Anna Fali
1022Stacey I MaletFrance2025-04-28Chapman, Ross E Esq QUALIFIED66Elwin Sharvill
1023Murillo S OstroskyFrance2025-04-24Printing Dimensions RENEWAL22Stephen Shaw
1024Arvin E CaldareraGermany2025-04-29Rangoni Of Florence UNQUALIFIED51Asiya Javayant
1025Jeanfrancois J DoeGermany2025-04-25Chemel, James L Cpa UNQUALIFIED61Ioni Bowcher
1026James W RutaBrazil2025-04-14King, Christopher A Esq NEGOTIATION35Bernardo Dominic
1027Costa Z NickaFrance2025-04-11Rousseaux, Michael Esq NEGOTIATION93Bernardo Dominic
1028Juan Y MaletAustralia2025-04-04Chapman, Ross E Esq NEGOTIATION71Xuxue Feng
1029Silvio Q WaycottArgentina2025-04-28Morlong Associates QUALIFIED87Bernardo Dominic
1030Sinclair N FlosiJapan2025-04-30Chemel, James L Cpa NEW85Bernardo Dominic
1031Adams Q StensethIndia2025-04-15Feltz Printing Service RENEWAL97Bernardo Dominic
1032Kaitlin I KolmetzJapan2025-04-26Chemel, James L Cpa RENEWAL12Ioni Bowcher
1033Stacey S WieserCanada2025-04-10Commercial Press RENEWAL49Amy Elsner
1034Kaitlin O IturbideArgentina2025-04-25Buckley Miller Wright NEGOTIATION81Bernardo Dominic
1035Aruna K VocelkaIndia2025-04-30Feiner Bros PROPOSAL87Bernardo Dominic
1036Rodrigues I WieserIndia2025-04-21Printing Dimensions NEGOTIATION68Bernardo Dominic
1037Misaki Z GauchoArgentina2025-04-17Commercial Press PROPOSAL22Onyama Limba
1038Jefferson F DilliardArgentina2025-04-04Buckley Miller Wright RENEWAL4Asiya Javayant
1039Nicolas J GlickItaly2025-04-23King, Christopher A Esq UNQUALIFIED80Amy Elsner
1040Claire W NickaSpain2025-04-22Commercial Press RENEWAL2Anna Fali
1041Silvio N AlbaresJapan2025-04-28King, Christopher A Esq PROPOSAL45Elwin Sharvill
1042Darci Z RimBrazil2025-04-02Benton, John B Jr QUALIFIED13Onyama Limba
1043Jefferson G MaletAustralia2025-04-08Rangoni Of Florence UNQUALIFIED29Amy Elsner
1044Ivar X SlusarskiSpain2025-04-15Chapman, Ross E Esq UNQUALIFIED25Anna Fali
1045David O MarrierFrance2025-04-12Feltz Printing Service NEGOTIATION85Bernardo Dominic
1046Misaki C DilliardItaly2025-04-24Chanay, Jeffrey A Esq NEW1Onyama Limba
1047Kadeem P PaprockiItaly2025-04-26Chemel, James L Cpa UNQUALIFIED75Asiya Javayant
1048Aditya G RutaSpain2025-04-10Benton, John B Jr RENEWAL62Anna Fali
1049Munro L GillianArgentina2025-04-20Chemel, James L Cpa UNQUALIFIED7Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Maria N GlickFranceAsiya Javayant PROPOSAL
Smith I FlosiBrazilElwin Sharvill RENEWAL
Kadeem C VenereBrazilStephen Shaw QUALIFIED
Morrow Q ButtRussiaOnyama Limba UNQUALIFIED
Alejandro Q WaycottIndiaAnna Fali QUALIFIED
Cody H FollerRussiaStephen Shaw PROPOSAL
Kadeem I AlbaresIndiaIoni Bowcher NEW
Ivar M MorascaItalyOnyama Limba RENEWAL
Maisha J BologniaAustraliaStephen Shaw QUALIFIED
Octavia V MaletUnited KingdomOnyama Limba NEW
Juan G ChuiRussiaAnna Fali QUALIFIED
Julie M PoquetteAustraliaXuxue Feng NEW
Maria S OldroydItalyAmy Elsner NEGOTIATION
Jeanfrancois V BowleyFranceAmy Elsner UNQUALIFIED
David C BowleyUnited KingdomAnna Fali NEGOTIATION
Rodrigues X SlusarskiJapanXuxue Feng PROPOSAL
Juan Y AmigonSpainAnna Fali NEW
Munro C KuskoItalyXuxue Feng NEW
Ashley O PerinArgentinaIvan Magalhaes QUALIFIED
Stacey C StockhamCanadaAnna Fali NEW
Murillo Q ButtBrazilIvan Magalhaes RENEWAL
Leon S DilliardFranceElwin Sharvill RENEWAL
Emily W GillianCanadaIvan Magalhaes NEGOTIATION
Jeanfrancois J PoquetteUnited KingdomXuxue Feng RENEWAL
Munro E BriddickUnited KingdomXuxue Feng RENEWAL
Octavia H WaycottGermanyAsiya Javayant NEGOTIATION
Aika R WieserRussiaOnyama Limba PROPOSAL
Aruna P InouyeCanadaElwin Sharvill NEW
Jeanfrancois R KuskoGermanyAmy Elsner NEGOTIATION
Morrow B FigeroaGermanyIoni Bowcher RENEWAL
Morrow V MaletCanadaAnna Fali NEGOTIATION
David S MorascaUnited KingdomBernardo Dominic QUALIFIED
Misaki C DarakjyAustraliaOnyama Limba UNQUALIFIED
Sinclair B SchemmerItalyBernardo Dominic NEGOTIATION
Adams I FollerSpainXuxue Feng NEGOTIATION
Tony Q NestleSpainOnyama Limba NEW
Sinclair A PaprockiIndiaElwin Sharvill PROPOSAL
Ashley G PoquetteSpainAnna Fali PROPOSAL
Nicolas K DarakjyJapanAsiya Javayant RENEWAL
Kaitlin C NestleCanadaAsiya Javayant PROPOSAL
Arvin T PaprockiBrazilAsiya Javayant NEGOTIATION
Maisha W KolmetzArgentinaAmy Elsner QUALIFIED
Jefferson G PoquetteUnited KingdomBernardo Dominic RENEWAL
Johnson A InouyeJapanIvan Magalhaes NEW
Octavia L SergiBrazilIvan Magalhaes QUALIFIED
Cody N AmigonItalyAmy Elsner QUALIFIED
Jeanfrancois Y TollnerJapanBernardo Dominic NEGOTIATION
Silvio U PerinItalyAsiya Javayant QUALIFIED
Greenwood X CaudyGermanyElwin Sharvill QUALIFIED
Aditya U GlickSpainAsiya Javayant NEW
Frozen Columns
Name
Claire G Garufi
Leja W Stenseth
Antonio U Slusarski
Ashley G Darakjy
Aruna L Royster
Deepesh E Waycott
Izzy X Bolognia
Adams R Malet
Aika X Doe
Morrow M Doe
Wickens A Saylors
Silvio D Flosi
Kaitlin X Saylors
Greenwood Y Inouye
Ashley J Perin
Julie Z Malet
Tony D Amigon
Arvin K Whobrey
Jennifer H Iturbide
Octavia G Venere
Jeanfrancois M Caudy
Kaitlin C Bowley
Rodrigues G Kusko
Emily W Dilliard
Wickens F Saylors
Ivar F Dilliard
Leon E Figeroa
Chavez D Whobrey
Claire M Shinko
Antonio Y Ruta
Misaki E Royster
Rodrigues R Chui
Adams M Butt
Faith Z Amigon
Darci E Tollner
Clifford O Figeroa
Clifford Q Bolognia
Ashley L Stenseth
Faith Z Vocelka
Costa N Inouye
Clifford B Caudy
Smith K Gaucho
Aika V Chui
Darci G Saylors
Leon U Gaucho
Jennifer S Maclead
Nicolas T Caudy
Isabel W Poquette
Salvatore V Briddick
Julie I Waycott
IdCountryDate
1000Germany2025-04-12
1001Brazil2025-04-09
1002United Kingdom2025-04-05
1003Russia2025-04-30
1004Argentina2025-04-23
1005Brazil2025-04-27
1006France2025-04-07
1007Italy2025-04-02
1008Japan2025-04-08
1009Argentina2025-04-27
1010India2025-04-04
1011Italy2025-04-14
1012India2025-04-28
1013Australia2025-04-28
1014Russia2025-04-27
1015India2025-04-14
1016India2025-04-17
1017Spain2025-04-01
1018Germany2025-04-18
1019Canada2025-04-01
1020Italy2025-04-21
1021France2025-04-18
1022Argentina2025-04-09
1023Australia2025-04-09
1024Russia2025-04-01
1025Argentina2025-04-08
1026India2025-04-06
1027United Kingdom2025-04-18
1028Germany2025-04-30
1029Argentina2025-04-20
1030Australia2025-04-07
1031Spain2025-04-21
1032United Kingdom2025-04-15
1033Argentina2025-04-07
1034Germany2025-04-29
1035United Kingdom2025-04-16
1036Russia2025-04-09
1037France2025-04-24
1038Canada2025-04-30
1039Spain2025-04-16
1040Australia2025-04-02
1041Argentina2025-04-23
1042India2025-04-01
1043Spain2025-04-29
1044Australia2025-04-21
1045Australia2025-04-02
1046Canada2025-04-04
1047Spain2025-04-27
1048Canada2025-04-03
1049Germany2025-04-27

On-Demand Data

NameIdCountryDate
Claire T Caldarera1000Canada2025-04-16
Arvin G Vocelka1001Italy2025-04-30
Aika T Briddick1002Australia2025-04-13
Antonio P Stockham1003Australia2025-04-23
Leja P Amigon1004India2025-04-10
Claire D Kolmetz1005Argentina2025-04-15
James U Flosi1006Italy2025-04-25
Wickens U Gillian1007India2025-04-26
Nicolas E Inouye1008Russia2025-04-20
Octavia A Nestle1009Germany2025-04-08
David A Waycott1010United Kingdom2025-04-10
Silvio E Campain1011Italy2025-04-27
Darci Q Campain1012United Kingdom2025-04-07
Izzy V Royster1013Argentina2025-04-17
Misaki H Caudy1014Argentina2025-04-27
Rodrigues W Gillian1015United Kingdom2025-04-13
Mayumi R Bolognia1016Spain2025-04-19
Aika Q Sergi1017Japan2025-04-05
Francesco B Malet1018France2025-04-10
Emily D Campain1019Italy2025-04-09
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aditya I FlosiJapanStephen Shaw PROPOSAL
Antonio G RulapaughFranceOnyama Limba NEW
Ivar M RulapaughFranceOnyama Limba UNQUALIFIED
Munro O MaletJapanAmy Elsner RENEWAL
Faith D SergiGermanyStephen Shaw NEW
Jefferson K WaycottAustraliaIoni Bowcher NEW
Ivar C VenereBrazilOnyama Limba QUALIFIED
Izzy I CaudyFranceStephen Shaw NEGOTIATION
Jeanfrancois S FlosiItalyAmy Elsner UNQUALIFIED
Salvatore C ChuiSpainIoni Bowcher NEW
Aika B WieserGermanyAmy Elsner PROPOSAL
Mujtaba X ButtCanadaAmy Elsner UNQUALIFIED
Antonio Y MarrierItalyStephen Shaw QUALIFIED
Maisha L NestleIndiaXuxue Feng PROPOSAL
Francesco Z DoeIndiaAsiya Javayant NEGOTIATION
Juan W MaletItalyIoni Bowcher NEW
Cody Y DilliardArgentinaElwin Sharvill PROPOSAL
Cody Q WaycottFranceIoni Bowcher QUALIFIED
Cody D WhobreyGermanyAnna Fali QUALIFIED
Mayumi P RimGermanyIvan Magalhaes PROPOSAL
James R RutaGermanyStephen Shaw UNQUALIFIED
Aika U InouyeAustraliaIvan Magalhaes RENEWAL
Julie M MorascaRussiaIoni Bowcher QUALIFIED
Ashley Q BologniaRussiaAsiya Javayant QUALIFIED
Juan T PerinJapanAnna Fali NEW
Tony T DilliardBrazilStephen Shaw NEGOTIATION
Octavia M PerinRussiaOnyama Limba NEGOTIATION
Emily Q AmigonSpainAmy Elsner UNQUALIFIED
Silvio J DilliardRussiaAsiya Javayant NEW
Aika M SaylorsItalyXuxue Feng PROPOSAL
Faith C RimCanadaOnyama Limba NEGOTIATION
Wickens L NickaRussiaStephen Shaw QUALIFIED
Arvin S FollerBrazilBernardo Dominic PROPOSAL
Chavez P IturbideFranceAnna Fali NEGOTIATION
Rodrigues R CaldareraIndiaIoni Bowcher NEW
Salvatore G ShinkoItalyAmy Elsner RENEWAL
Costa R SchemmerSpainBernardo Dominic QUALIFIED
Salvatore N WieserBrazilElwin Sharvill PROPOSAL
Aika F RimGermanyOnyama Limba UNQUALIFIED
Murillo A RimItalyAnna Fali 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>