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
Silvio O PerinIndiaBernardo Dominic NEW
Mujtaba D ShinkoIndiaXuxue Feng UNQUALIFIED
Arvin H FollerFranceAmy Elsner NEW
Deepesh J CaudySpainStephen Shaw QUALIFIED
James F MaletUnited KingdomBernardo Dominic UNQUALIFIED
Costa M RimSpainElwin Sharvill RENEWAL
Ricardo L DarakjyUnited KingdomAsiya Javayant QUALIFIED
Juan X GarufiItalyStephen Shaw PROPOSAL
Munro V RoysterJapanIoni Bowcher NEGOTIATION
Julie R AmigonCanadaStephen Shaw NEGOTIATION
Tony J FigeroaGermanyIvan Magalhaes QUALIFIED
Munro V KuskoCanadaElwin Sharvill NEGOTIATION
Johnson D GlickRussiaIoni Bowcher RENEWAL
Mujtaba A CaudyItalyOnyama Limba UNQUALIFIED
Ricardo N BriddickIndiaAnna Fali RENEWAL
Murillo Y VenereBrazilXuxue Feng UNQUALIFIED
Deepesh Q SlusarskiIndiaElwin Sharvill PROPOSAL
Sinclair Q SaylorsIndiaIvan Magalhaes UNQUALIFIED
Alejandro F TollnerFranceAsiya Javayant PROPOSAL
Morrow W RoysterAustraliaAnna Fali NEGOTIATION
Stacey B MacleadItalyOnyama Limba PROPOSAL
Aruna Q PoquetteArgentinaBernardo Dominic UNQUALIFIED
Jefferson V VenereArgentinaIvan Magalhaes PROPOSAL
Claire K StockhamArgentinaElwin Sharvill UNQUALIFIED
Izzy G CaudyRussiaAnna Fali NEW
Munro N TollnerBrazilBernardo Dominic PROPOSAL
Morrow P MaletIndiaAsiya Javayant NEGOTIATION
Rodrigues Y WhobreySpainAsiya Javayant PROPOSAL
Izzy K VocelkaAustraliaIoni Bowcher RENEWAL
Morrow H FerenczAustraliaBernardo Dominic RENEWAL
Salvatore F SchemmerItalyAsiya Javayant NEGOTIATION
Antonio V OldroydArgentinaElwin Sharvill RENEWAL
Adams J FollerGermanyBernardo Dominic QUALIFIED
Juan V BologniaUnited KingdomOnyama Limba UNQUALIFIED
Emily T NickaArgentinaIvan Magalhaes NEW
Salvatore Q NickaArgentinaIvan Magalhaes UNQUALIFIED
Aditya F SchemmerBrazilAnna Fali PROPOSAL
Francesco D RimUnited KingdomOnyama Limba QUALIFIED
Juan L GarufiBrazilIoni Bowcher UNQUALIFIED
Julie X FigeroaBrazilAsiya Javayant RENEWAL
Mujtaba E FollerBrazilIoni Bowcher NEGOTIATION
Smith B ButtSpainOnyama Limba UNQUALIFIED
Darci W IturbideGermanyIoni Bowcher PROPOSAL
Kadeem N ShinkoAustraliaOnyama Limba NEGOTIATION
Adams Z CaldareraGermanyAmy Elsner NEGOTIATION
Mujtaba B MaletGermanyIvan Magalhaes NEGOTIATION
Alejandro X RulapaughArgentinaAnna Fali NEGOTIATION
Julie C WhobreyBrazilBernardo Dominic NEW
Leon F SaylorsItalyBernardo Dominic NEGOTIATION
Francesco K MaletSpainAsiya Javayant RENEWAL
Horizontal
NameCountryRepresentativeStatus
Leon O MarrierBrazilAsiya Javayant RENEWAL
Nicolas S MarrierAustraliaIoni Bowcher QUALIFIED
Emily W FerenczGermanyOnyama Limba NEGOTIATION
Salvatore N AmigonArgentinaStephen Shaw PROPOSAL
Stacey V OldroydCanadaOnyama Limba NEW
Johnson X TollnerUnited KingdomElwin Sharvill PROPOSAL
Antonio Q NickaAustraliaIoni Bowcher NEW
Tony B RutaJapanStephen Shaw NEW
Ivar C NickaSpainAmy Elsner NEW
Sinclair O KolmetzSpainStephen Shaw UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Julie F AlbaresRussia2025-04-09Chanay, Jeffrey A Esq QUALIFIED95Onyama Limba
1001Rodrigues S RoysterGermany2025-04-27Chapman, Ross E Esq NEGOTIATION53Anna Fali
1002Jones J GlickFrance2025-04-09Feiner Bros RENEWAL6Onyama Limba
1003Izzy U RutaAustralia2025-04-02King, Christopher A Esq RENEWAL37Stephen Shaw
1004Faith Z BriddickRussia2025-04-20Buckley Miller Wright NEGOTIATION66Ivan Magalhaes
1005Deepesh W SergiItaly2025-04-04Rousseaux, Michael Esq UNQUALIFIED72Ivan Magalhaes
1006Jeanfrancois J BriddickRussia2025-04-27Rousseaux, Michael Esq PROPOSAL69Xuxue Feng
1007Izzy D ButtGermany2025-04-15King, Christopher A Esq RENEWAL46Ivan Magalhaes
1008Jeanfrancois Q MorascaRussia2025-04-15Chanay, Jeffrey A Esq NEW5Ioni Bowcher
1009Jeanfrancois K StockhamArgentina2025-04-05Feltz Printing Service QUALIFIED16Xuxue Feng
1010Alejandro B PaprockiItaly2025-04-26Printing Dimensions QUALIFIED90Anna Fali
1011Cody W CampainBrazil2025-04-12Commercial Press NEW55Anna Fali
1012Juan J VenereIndia2025-04-28Commercial Press NEGOTIATION95Anna Fali
1013Maisha A CampainCanada2025-04-24Morlong Associates RENEWAL70Bernardo Dominic
1014Jefferson J OstroskyGermany2025-04-14Chemel, James L Cpa QUALIFIED95Elwin Sharvill
1015Darci B StensethRussia2025-04-15Chemel, James L Cpa PROPOSAL45Ioni Bowcher
1016Jefferson F NestleArgentina2025-04-16Printing Dimensions NEW62Elwin Sharvill
1017James O IturbideGermany2025-04-15Buckley Miller Wright UNQUALIFIED51Amy Elsner
1018Arvin L MacleadSpain2025-04-21Buckley Miller Wright UNQUALIFIED70Amy Elsner
1019Misaki V GlickSpain2025-04-24Commercial Press UNQUALIFIED56Asiya Javayant
1020Cody W InouyeSpain2025-04-08Chanay, Jeffrey A Esq QUALIFIED52Amy Elsner
1021Kadeem B PerinGermany2025-04-14Feltz Printing Service NEGOTIATION73Ioni Bowcher
1022Aditya I GarufiJapan2025-04-13Truhlar And Truhlar Attys NEGOTIATION88Bernardo Dominic
1023Deepesh G NestleUnited Kingdom2025-04-18Buckley Miller Wright QUALIFIED28Ioni Bowcher
1024Alejandro W AlbaresRussia2025-04-07Feiner Bros QUALIFIED5Ioni Bowcher
1025Maria I BologniaGermany2025-04-22Rangoni Of Florence QUALIFIED99Ivan Magalhaes
1026James C InouyeRussia2025-04-02Commercial Press PROPOSAL13Asiya Javayant
1027Isabel H MarrierJapan2025-04-23Chapman, Ross E Esq RENEWAL45Bernardo Dominic
1028Leja O GauchoRussia2025-04-14Chemel, James L Cpa PROPOSAL21Onyama Limba
1029Julie I BologniaIndia2025-04-12Feltz Printing Service QUALIFIED95Elwin Sharvill
1030Mujtaba W PoquetteFrance2025-04-28Commercial Press RENEWAL62Amy Elsner
1031Darci B GauchoJapan2025-04-09Printing Dimensions NEW5Stephen Shaw
1032Salvatore X DoeArgentina2025-04-29Rousseaux, Michael Esq QUALIFIED55Bernardo Dominic
1033Antonio B WieserUnited Kingdom2025-04-07Chapman, Ross E Esq NEW21Xuxue Feng
1034Chavez Y PaprockiGermany2025-04-15Truhlar And Truhlar Attys UNQUALIFIED50Anna Fali
1035Mayumi M VocelkaBrazil2025-04-09Morlong Associates RENEWAL11Stephen Shaw
1036Silvio M MaletFrance2025-04-09Chemel, James L Cpa QUALIFIED5Elwin Sharvill
1037Jones A FlosiBrazil2025-03-31Chemel, James L Cpa PROPOSAL28Ioni Bowcher
1038Misaki Z RulapaughAustralia2025-04-28Rousseaux, Michael Esq RENEWAL26Elwin Sharvill
1039Alejandro I OstroskyRussia2025-03-31Rangoni Of Florence QUALIFIED65Elwin Sharvill
1040Wickens B SaylorsRussia2025-04-28King, Christopher A Esq PROPOSAL58Ivan Magalhaes
1041Leja C CaudyJapan2025-04-23Printing Dimensions NEW49Elwin Sharvill
1042Aika A AmigonBrazil2025-04-25Truhlar And Truhlar Attys QUALIFIED34Xuxue Feng
1043Nicolas D DilliardGermany2025-04-17Truhlar And Truhlar Attys RENEWAL11Onyama Limba
1044Claire D CaudyCanada2025-04-14Buckley Miller Wright UNQUALIFIED36Anna Fali
1045Smith C KuskoCanada2025-04-02Printing Dimensions QUALIFIED32Ivan Magalhaes
1046Cody U RutaRussia2025-04-17Printing Dimensions NEGOTIATION47Elwin Sharvill
1047Mujtaba N FlosiRussia2025-04-25Commercial Press PROPOSAL65Asiya Javayant
1048Stacey Z AlbaresUnited Kingdom2025-04-21Rangoni Of Florence NEGOTIATION31Onyama Limba
1049Mujtaba H WieserFrance2025-04-09Feltz Printing Service PROPOSAL64Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Chavez H DilliardUnited KingdomIvan Magalhaes NEGOTIATION
Munro G WieserAustraliaAsiya Javayant UNQUALIFIED
Johnson G StockhamUnited KingdomStephen Shaw NEW
Darci M BriddickBrazilAmy Elsner RENEWAL
Faith E BriddickItalyBernardo Dominic QUALIFIED
Maisha R SlusarskiCanadaElwin Sharvill RENEWAL
Rodrigues S RoysterFranceElwin Sharvill UNQUALIFIED
Nicolas A SaylorsArgentinaElwin Sharvill NEGOTIATION
Maria Z ChuiFranceStephen Shaw NEGOTIATION
Antonio V WieserAustraliaAnna Fali PROPOSAL
Faith G StensethIndiaAsiya Javayant PROPOSAL
Jeanfrancois S TollnerGermanyAsiya Javayant NEGOTIATION
Jones R BologniaAustraliaIvan Magalhaes NEW
Julie O KolmetzGermanyAsiya Javayant NEW
Antonio A RoysterGermanyStephen Shaw PROPOSAL
Misaki E GarufiIndiaIoni Bowcher PROPOSAL
Leon X PerinItalyAnna Fali NEGOTIATION
Mayumi D IturbideJapanAnna Fali NEW
Kaitlin U BologniaIndiaElwin Sharvill NEGOTIATION
Munro F FerenczSpainIvan Magalhaes QUALIFIED
Maisha X CaudyItalyAsiya Javayant UNQUALIFIED
Ivar Z FigeroaIndiaIoni Bowcher RENEWAL
Salvatore F PaprockiRussiaStephen Shaw NEGOTIATION
Jeanfrancois R GauchoGermanyStephen Shaw NEW
Johnson K DoeUnited KingdomElwin Sharvill RENEWAL
Morrow X KolmetzArgentinaIvan Magalhaes NEW
Stacey X DoeFranceOnyama Limba PROPOSAL
Mayumi R RimItalyElwin Sharvill NEGOTIATION
Greenwood V NickaCanadaElwin Sharvill QUALIFIED
Costa U SchemmerArgentinaAnna Fali NEW
David G ChuiItalyXuxue Feng UNQUALIFIED
Sinclair T StockhamArgentinaOnyama Limba RENEWAL
Francesco Y CaldareraAustraliaXuxue Feng NEGOTIATION
David Q VenereIndiaIvan Magalhaes PROPOSAL
Salvatore B ButtRussiaElwin Sharvill UNQUALIFIED
Greenwood N NestleSpainAnna Fali QUALIFIED
Maria Z FigeroaIndiaIvan Magalhaes NEGOTIATION
Ivar I RimBrazilElwin Sharvill UNQUALIFIED
Jefferson C BowleySpainOnyama Limba NEGOTIATION
Alejandro H RoysterItalyIvan Magalhaes RENEWAL
Aditya S KuskoGermanyAsiya Javayant PROPOSAL
Clifford J StockhamGermanyAnna Fali NEW
Mayumi W SaylorsSpainAnna Fali QUALIFIED
Aruna Y GarufiGermanyStephen Shaw UNQUALIFIED
Chavez J FigeroaItalyStephen Shaw NEW
Aruna S FollerCanadaAmy Elsner UNQUALIFIED
Emily R BologniaRussiaAmy Elsner RENEWAL
Isabel Z InouyeBrazilBernardo Dominic NEW
Greenwood N PoquetteCanadaIvan Magalhaes QUALIFIED
Costa K PerinSpainAsiya Javayant NEW
Frozen Columns
Name
Claire T Slusarski
Francesco F Bowley
Leja P Dilliard
Juan U Maclead
Mujtaba I Glick
Alejandro A Morasca
Deepesh I Sergi
David M Amigon
Costa X Malet
Tony B Briddick
Juan G Vocelka
Izzy S Gillian
Juan L Gaucho
Faith O Darakjy
Isabel K Paprocki
Morrow W Marrier
Aruna L Albares
Kaitlin Q Waycott
Emily N Dilliard
Greenwood S Flosi
Misaki A Amigon
Nicolas X Stenseth
Morrow S Gaucho
Sinclair C Gaucho
Nicolas C Campain
Jefferson U Vocelka
Chavez M Figeroa
Ivar Q Dilliard
Morrow S Rulapaugh
Maria O Figeroa
Sinclair C Albares
Jennifer A Butt
Nicolas T Foller
Faith D Butt
Greenwood B Venere
Deepesh K Stenseth
Mayumi G Ferencz
Clifford Q Malet
Clifford V Caldarera
Nicolas W Wieser
Ivar P Flosi
Arvin K Rulapaugh
Greenwood C Albares
Emily O Malet
James D Rulapaugh
Kadeem Z Oldroyd
Clifford P Gillian
Alejandro W Campain
Faith T Caudy
Clifford Q Ruta
IdCountryDate
1000Spain2025-04-09
1001Canada2025-04-03
1002Russia2025-04-10
1003Germany2025-04-01
1004Spain2025-04-14
1005Italy2025-04-16
1006Brazil2025-04-21
1007India2025-04-20
1008Russia2025-04-05
1009Italy2025-04-11
1010Italy2025-04-29
1011Brazil2025-04-18
1012Japan2025-04-23
1013United Kingdom2025-04-24
1014United Kingdom2025-04-05
1015Japan2025-04-14
1016Japan2025-04-08
1017Argentina2025-04-18
1018United Kingdom2025-04-26
1019United Kingdom2025-04-08
1020Italy2025-04-07
1021Brazil2025-04-25
1022Italy2025-04-04
1023France2025-04-09
1024Argentina2025-04-01
1025Argentina2025-04-25
1026Spain2025-04-01
1027Australia2025-04-25
1028Italy2025-04-01
1029Brazil2025-04-05
1030Canada2025-04-25
1031France2025-03-31
1032Argentina2025-04-16
1033Argentina2025-04-02
1034Spain2025-04-21
1035Canada2025-04-13
1036Argentina2025-04-11
1037Japan2025-04-04
1038Russia2025-04-29
1039Italy2025-04-13
1040Australia2025-04-01
1041India2025-04-29
1042Spain2025-04-29
1043Spain2025-04-08
1044France2025-04-09
1045Brazil2025-04-10
1046Australia2025-04-13
1047Argentina2025-04-29
1048Australia2025-04-14
1049Germany2025-04-16

On-Demand Data

NameIdCountryDate
David M Caudy1000Japan2025-04-08
Maisha B Kusko1001Spain2025-04-07
Julie X Garufi1002Australia2025-04-03
Ivar Q Butt1003Russia2025-04-24
Leja M Bowley1004Canada2025-04-19
James F Tollner1005Spain2025-04-08
Maria H Sergi1006Australia2025-04-25
Tony T Ostrosky1007Germany2025-04-19
Claire P Chui1008Germany2025-04-27
Greenwood O Iturbide1009France2025-04-24
Costa T Foller1010Japan2025-04-06
Morrow V Schemmer1011Argentina2025-04-24
Jefferson P Doe1012Japan2025-04-22
Arvin U Amigon1013France2025-04-02
Octavia H Malet1014United Kingdom2025-04-03
Izzy Y Darakjy1015India2025-04-11
Ashley M Paprocki1016France2025-04-06
Izzy I Morasca1017Spain2025-04-04
Juan V Kusko1018Canada2025-04-28
Jefferson W Slusarski1019Argentina2025-04-27
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Johnson A IturbideFranceBernardo Dominic NEW
Aruna Y StockhamCanadaAnna Fali UNQUALIFIED
Juan T RulapaughGermanyAsiya Javayant PROPOSAL
Smith E StockhamUnited KingdomXuxue Feng PROPOSAL
Chavez U ShinkoItalyBernardo Dominic NEGOTIATION
Adams L CaldareraItalyAmy Elsner UNQUALIFIED
Munro E SaylorsSpainAmy Elsner RENEWAL
Kadeem F ButtIndiaAmy Elsner UNQUALIFIED
Arvin S VenereSpainXuxue Feng QUALIFIED
Alejandro W BowleyUnited KingdomXuxue Feng UNQUALIFIED
Jeanfrancois N BowleyIndiaXuxue Feng NEGOTIATION
Kaitlin M StensethUnited KingdomAsiya Javayant QUALIFIED
Costa J GarufiFranceElwin Sharvill QUALIFIED
Antonio H PoquetteUnited KingdomXuxue Feng PROPOSAL
Ashley J AlbaresItalyIvan Magalhaes NEGOTIATION
Stacey F GillianJapanXuxue Feng NEGOTIATION
Leon F PoquetteAustraliaAnna Fali UNQUALIFIED
Jefferson G SlusarskiArgentinaOnyama Limba QUALIFIED
Isabel O ShinkoIndiaStephen Shaw NEW
Izzy E IturbideAustraliaAnna Fali NEW
Octavia E RulapaughArgentinaXuxue Feng UNQUALIFIED
Kaitlin Z RimRussiaElwin Sharvill RENEWAL
David U OldroydFranceOnyama Limba UNQUALIFIED
Julie H WieserJapanAsiya Javayant PROPOSAL
Maria T GillianRussiaXuxue Feng NEGOTIATION
Juan C MarrierArgentinaAmy Elsner NEW
Nicolas O CampainRussiaAmy Elsner UNQUALIFIED
Aika P AmigonRussiaAmy Elsner NEGOTIATION
Leja P FlosiCanadaIvan Magalhaes QUALIFIED
Rodrigues B ShinkoIndiaIoni Bowcher NEW
Misaki T IturbideCanadaAmy Elsner NEGOTIATION
Ashley E VocelkaRussiaStephen Shaw UNQUALIFIED
Faith I OstroskyIndiaXuxue Feng RENEWAL
Rodrigues F FerenczGermanyOnyama Limba NEW
Cody C RoysterIndiaXuxue Feng QUALIFIED
James U MarrierJapanBernardo Dominic NEW
Aditya U RulapaughUnited KingdomOnyama Limba NEW
Clifford H StockhamJapanAmy Elsner QUALIFIED
Clifford N KolmetzAustraliaElwin Sharvill NEW
Kaitlin W RutaFranceIvan Magalhaes PROPOSAL

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