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
Emily Q FollerUnited KingdomBernardo Dominic RENEWAL
Murillo F FlosiFranceAnna Fali NEGOTIATION
Misaki H FollerBrazilStephen Shaw NEW
Maria O InouyeItalyBernardo Dominic QUALIFIED
Octavia P RulapaughSpainAsiya Javayant PROPOSAL
Misaki W SergiCanadaIvan Magalhaes NEW
Morrow U MarrierCanadaAmy Elsner RENEWAL
Nicolas R ChuiJapanOnyama Limba PROPOSAL
Kadeem F TollnerItalyXuxue Feng NEGOTIATION
Leon Z DilliardIndiaIvan Magalhaes RENEWAL
James F NickaSpainBernardo Dominic NEW
Darci R RulapaughJapanIoni Bowcher QUALIFIED
Francesco A DoeGermanyAmy Elsner NEW
Chavez A WieserAustraliaAmy Elsner PROPOSAL
Claire P PaprockiAustraliaXuxue Feng UNQUALIFIED
Mayumi D InouyeBrazilXuxue Feng NEGOTIATION
Juan P NickaFranceXuxue Feng NEW
Deepesh V TollnerIndiaElwin Sharvill RENEWAL
Jefferson Z NestleBrazilIvan Magalhaes NEGOTIATION
Emily H BowleyCanadaBernardo Dominic NEW
Mujtaba Y GauchoSpainIoni Bowcher PROPOSAL
Silvio R BologniaFranceIvan Magalhaes QUALIFIED
Leon H OldroydFranceIoni Bowcher NEW
Jennifer R VenereIndiaAmy Elsner QUALIFIED
Kaitlin X DilliardSpainIoni Bowcher PROPOSAL
Leon N WaycottFranceElwin Sharvill PROPOSAL
Ashley N DarakjyFranceStephen Shaw RENEWAL
Mujtaba E SlusarskiRussiaAnna Fali PROPOSAL
Antonio G ShinkoFranceBernardo Dominic RENEWAL
Deepesh W BologniaGermanyXuxue Feng PROPOSAL
Salvatore O NestleSpainAmy Elsner NEGOTIATION
Kadeem L NickaArgentinaBernardo Dominic PROPOSAL
Chavez N GarufiGermanyOnyama Limba RENEWAL
Arvin G MorascaUnited KingdomAsiya Javayant RENEWAL
Leja R GlickArgentinaOnyama Limba NEW
Jennifer M OldroydIndiaStephen Shaw UNQUALIFIED
Rodrigues C WhobreyBrazilAsiya Javayant PROPOSAL
Kaitlin G GauchoArgentinaAsiya Javayant NEW
Kadeem Z RoysterArgentinaOnyama Limba RENEWAL
Misaki V MarrierCanadaElwin Sharvill RENEWAL
Salvatore L PaprockiIndiaStephen Shaw UNQUALIFIED
Stacey O FollerIndiaAsiya Javayant PROPOSAL
Munro H GarufiCanadaStephen Shaw NEGOTIATION
Stacey D RimUnited KingdomAnna Fali UNQUALIFIED
Silvio I AmigonSpainAsiya Javayant RENEWAL
Kadeem P RoysterAustraliaAmy Elsner QUALIFIED
Cody F ShinkoIndiaAsiya Javayant RENEWAL
Sinclair V SaylorsAustraliaIoni Bowcher NEGOTIATION
Claire A MaletUnited KingdomBernardo Dominic NEW
Cody N RimJapanXuxue Feng UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Maria F GlickSpainBernardo Dominic PROPOSAL
Adams T ShinkoIndiaBernardo Dominic QUALIFIED
Aruna K MarrierAustraliaAsiya Javayant NEGOTIATION
Stacey S IturbideRussiaIvan Magalhaes NEGOTIATION
Claire G RimGermanyStephen Shaw RENEWAL
Clifford K MacleadAustraliaXuxue Feng NEGOTIATION
Chavez M WieserBrazilAmy Elsner NEGOTIATION
Izzy N RutaRussiaStephen Shaw NEW
Nicolas W RulapaughAustraliaStephen Shaw QUALIFIED
Jones K CaudyBrazilIvan Magalhaes RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Nicolas C FerenczItaly2025-04-16Morlong Associates PROPOSAL10Ivan Magalhaes
1001Mayumi B MaletJapan2025-04-16Buckley Miller Wright UNQUALIFIED69Stephen Shaw
1002Antonio E NickaUnited Kingdom2025-04-01Feiner Bros UNQUALIFIED87Elwin Sharvill
1003Stacey U CaldareraJapan2025-04-25Buckley Miller Wright UNQUALIFIED4Ivan Magalhaes
1004Silvio Z AlbaresSpain2025-04-10Printing Dimensions NEW21Onyama Limba
1005Stacey D OldroydGermany2025-04-14Dorl, James J Esq QUALIFIED55Anna Fali
1006Deepesh X DilliardAustralia2025-04-27Benton, John B Jr UNQUALIFIED8Ivan Magalhaes
1007Munro V CampainCanada2025-04-02Truhlar And Truhlar Attys RENEWAL28Bernardo Dominic
1008Aruna D FerenczJapan2025-04-13Morlong Associates QUALIFIED10Bernardo Dominic
1009Juan D OldroydBrazil2025-04-13Feltz Printing Service PROPOSAL3Anna Fali
1010Adams D PoquetteArgentina2025-04-09Morlong Associates RENEWAL27Anna Fali
1011Antonio G WhobreyFrance2025-04-15Truhlar And Truhlar Attys NEW20Anna Fali
1012Aditya L DilliardArgentina2025-04-25Truhlar And Truhlar Attys NEGOTIATION60Asiya Javayant
1013Francesco V GauchoJapan2025-04-22King, Christopher A Esq RENEWAL52Bernardo Dominic
1014Antonio C PaprockiRussia2025-04-25Feltz Printing Service PROPOSAL92Xuxue Feng
1015Silvio D PerinSpain2025-04-14Benton, John B Jr RENEWAL9Ivan Magalhaes
1016Sinclair L MaletAustralia2025-04-26Benton, John B Jr RENEWAL69Xuxue Feng
1017Chavez I DarakjyRussia2025-04-22Chemel, James L Cpa RENEWAL25Xuxue Feng
1018Jennifer G DilliardGermany2025-04-04Buckley Miller Wright PROPOSAL44Xuxue Feng
1019Jefferson R DarakjyItaly2025-04-07Truhlar And Truhlar Attys RENEWAL27Amy Elsner
1020James V CaldareraJapan2025-04-05Chemel, James L Cpa UNQUALIFIED55Stephen Shaw
1021Munro A MorascaItaly2025-04-03Morlong Associates UNQUALIFIED15Ivan Magalhaes
1022Jones W KolmetzAustralia2025-04-23Chapman, Ross E Esq RENEWAL33Asiya Javayant
1023Arvin C SaylorsBrazil2025-04-01Chapman, Ross E Esq PROPOSAL11Anna Fali
1024Smith W TollnerGermany2025-04-06Chapman, Ross E Esq NEW20Xuxue Feng
1025Izzy J FollerUnited Kingdom2025-04-05Printing Dimensions UNQUALIFIED44Bernardo Dominic
1026Morrow C FigeroaItaly2025-04-30Rousseaux, Michael Esq QUALIFIED67Ivan Magalhaes
1027Cody E WhobreySpain2025-04-30Feltz Printing Service UNQUALIFIED29Ivan Magalhaes
1028Antonio L RoysterItaly2025-04-13King, Christopher A Esq NEGOTIATION60Amy Elsner
1029Claire B DarakjyFrance2025-04-21Commercial Press RENEWAL70Onyama Limba
1030Deepesh D PoquetteSpain2025-04-14Feltz Printing Service PROPOSAL29Ioni Bowcher
1031Salvatore T StockhamAustralia2025-04-12Commercial Press NEGOTIATION87Elwin Sharvill
1032Johnson U StensethUnited Kingdom2025-04-23Buckley Miller Wright NEW83Ivan Magalhaes
1033Silvio S BowleyRussia2025-04-28Benton, John B Jr NEGOTIATION44Ivan Magalhaes
1034Salvatore O TollnerAustralia2025-04-03Chemel, James L Cpa PROPOSAL96Xuxue Feng
1035Antonio A CampainSpain2025-04-29Buckley Miller Wright NEGOTIATION45Elwin Sharvill
1036Isabel C OstroskyBrazil2025-04-27Chapman, Ross E Esq RENEWAL25Ioni Bowcher
1037Wickens J BriddickItaly2025-04-15Morlong Associates QUALIFIED45Onyama Limba
1038Darci K DilliardUnited Kingdom2025-04-02Buckley Miller Wright RENEWAL67Bernardo Dominic
1039Ashley I SlusarskiRussia2025-04-03Chapman, Ross E Esq QUALIFIED41Elwin Sharvill
1040Kadeem B WieserCanada2025-04-03Rousseaux, Michael Esq NEW92Stephen Shaw
1041Salvatore C AlbaresArgentina2025-04-08Dorl, James J Esq RENEWAL75Asiya Javayant
1042Cody E ButtGermany2025-04-22Chanay, Jeffrey A Esq PROPOSAL8Amy Elsner
1043James K FigeroaArgentina2025-04-23Commercial Press QUALIFIED99Ivan Magalhaes
1044Arvin K SlusarskiIndia2025-04-02Chanay, Jeffrey A Esq UNQUALIFIED80Asiya Javayant
1045Jones G SaylorsJapan2025-04-07Chapman, Ross E Esq UNQUALIFIED50Onyama Limba
1046Francesco Z PoquetteIndia2025-04-19King, Christopher A Esq QUALIFIED60Anna Fali
1047Jefferson A FlosiArgentina2025-04-20Truhlar And Truhlar Attys NEGOTIATION78Xuxue Feng
1048Maria P VocelkaGermany2025-04-07Feltz Printing Service NEW44Bernardo Dominic
1049Silvio F ChuiJapan2025-04-02Truhlar And Truhlar Attys QUALIFIED27Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Ivar C BowleyJapanIvan Magalhaes PROPOSAL
Stacey F NickaIndiaXuxue Feng UNQUALIFIED
Jefferson H MarrierCanadaStephen Shaw NEW
Aruna D OldroydCanadaXuxue Feng NEGOTIATION
Stacey N FigeroaItalyAsiya Javayant NEGOTIATION
Leja K VenereIndiaAsiya Javayant NEGOTIATION
Salvatore P GillianSpainAnna Fali PROPOSAL
Rodrigues N CaldareraBrazilElwin Sharvill NEW
Alejandro V FollerCanadaAnna Fali NEGOTIATION
Jennifer U MorascaRussiaAnna Fali PROPOSAL
David W MaletIndiaIoni Bowcher RENEWAL
Ivar O KuskoRussiaXuxue Feng PROPOSAL
Sinclair S StockhamSpainOnyama Limba RENEWAL
Julie W DoeItalyStephen Shaw UNQUALIFIED
Tony M MacleadJapanIoni Bowcher UNQUALIFIED
Antonio E ShinkoCanadaStephen Shaw UNQUALIFIED
Tony D ChuiCanadaIvan Magalhaes QUALIFIED
Darci U AmigonFranceElwin Sharvill QUALIFIED
Mayumi G MaletRussiaStephen Shaw QUALIFIED
Aruna A RutaBrazilIvan Magalhaes PROPOSAL
Jefferson K WieserAustraliaAmy Elsner NEGOTIATION
Deepesh B PoquetteJapanOnyama Limba RENEWAL
Arvin C AmigonJapanBernardo Dominic NEW
Mayumi P VenereArgentinaElwin Sharvill NEGOTIATION
Deepesh C MaletAustraliaBernardo Dominic PROPOSAL
Emily I CampainArgentinaAnna Fali UNQUALIFIED
Alejandro F GarufiArgentinaIvan Magalhaes NEGOTIATION
Salvatore D GlickItalyXuxue Feng QUALIFIED
Jeanfrancois X PoquetteUnited KingdomXuxue Feng QUALIFIED
Sinclair V GillianIndiaBernardo Dominic NEGOTIATION
Adams R MacleadSpainAmy Elsner RENEWAL
Tony H FigeroaGermanyXuxue Feng NEW
Cody L KolmetzIndiaBernardo Dominic PROPOSAL
Faith N OldroydAustraliaBernardo Dominic PROPOSAL
Francesco V IturbideCanadaAnna Fali RENEWAL
Kaitlin M VenereIndiaAmy Elsner RENEWAL
Chavez N MacleadArgentinaAmy Elsner NEGOTIATION
Emily G GauchoItalyOnyama Limba RENEWAL
Ivar W BowleyUnited KingdomXuxue Feng PROPOSAL
Ivar D DoeBrazilAmy Elsner UNQUALIFIED
Adams G KolmetzSpainBernardo Dominic NEGOTIATION
Juan W GarufiJapanStephen Shaw NEW
Tony N PerinSpainStephen Shaw QUALIFIED
Smith L CampainRussiaXuxue Feng RENEWAL
Maria C SaylorsIndiaElwin Sharvill UNQUALIFIED
Juan S GarufiBrazilAmy Elsner RENEWAL
Leon B WieserCanadaElwin Sharvill UNQUALIFIED
Ashley U GillianRussiaElwin Sharvill NEW
Misaki E OldroydAustraliaIoni Bowcher NEW
Kaitlin C StensethRussiaElwin Sharvill QUALIFIED
Frozen Columns
Name
Cody P Doe
Claire N Gillian
Jefferson K Shinko
Antonio P Ruta
Aditya U Kusko
Aditya U Perin
Emily X Wieser
Stacey I Tollner
Aruna S Perin
Octavia L Albares
Leon J Gillian
Ricardo Q Tollner
Jeanfrancois K Dilliard
Alejandro E Iturbide
Deepesh B Kolmetz
Aika Q Iturbide
Mujtaba I Malet
Julie O Campain
Maria F Inouye
Tony S Campain
Nicolas T Dilliard
Aditya X Stockham
Jeanfrancois Q Morasca
Munro V Maclead
Jefferson N Ferencz
Wickens N Briddick
Leon X Poquette
Sinclair W Schemmer
Jefferson E Gaucho
Octavia R Briddick
James R Doe
Morrow O Poquette
Antonio N Rulapaugh
Kaitlin G Slusarski
Kadeem E Wieser
Faith L Malet
Jeanfrancois I Morasca
Ricardo Q Nicka
Juan Y Sergi
Jennifer K Malet
James G Morasca
Salvatore R Rim
Rodrigues P Glick
Johnson I Butt
Silvio J Doe
Greenwood J Paprocki
Maisha V Vocelka
Leja B Garufi
Stacey K Bowley
Jones Q Kusko
IdCountryDate
1000Brazil2025-04-27
1001India2025-04-10
1002Canada2025-04-03
1003Canada2025-04-17
1004India2025-04-06
1005India2025-04-13
1006Spain2025-04-26
1007Australia2025-04-01
1008Argentina2025-04-15
1009United Kingdom2025-04-09
1010Italy2025-04-02
1011France2025-04-13
1012France2025-04-24
1013Brazil2025-04-28
1014France2025-04-30
1015Argentina2025-04-23
1016Australia2025-04-23
1017United Kingdom2025-04-13
1018Germany2025-04-10
1019Spain2025-04-06
1020Italy2025-04-03
1021United Kingdom2025-04-25
1022India2025-04-03
1023Japan2025-04-23
1024Japan2025-04-20
1025Germany2025-04-25
1026Italy2025-04-12
1027United Kingdom2025-04-01
1028Spain2025-04-23
1029Japan2025-04-26
1030Canada2025-04-20
1031Canada2025-04-03
1032Russia2025-04-13
1033Brazil2025-04-04
1034Spain2025-04-15
1035Russia2025-04-28
1036Brazil2025-04-06
1037India2025-04-12
1038Argentina2025-04-03
1039India2025-04-27
1040Canada2025-04-24
1041United Kingdom2025-04-02
1042Russia2025-04-26
1043Argentina2025-04-28
1044Italy2025-04-30
1045Brazil2025-04-09
1046France2025-04-11
1047India2025-04-18
1048Australia2025-04-21
1049Japan2025-04-04

On-Demand Data

NameIdCountryDate
Emily G Oldroyd1000Argentina2025-04-25
Antonio S Amigon1001Canada2025-04-05
Nicolas G Oldroyd1002United Kingdom2025-04-06
Misaki Z Marrier1003India2025-04-16
Aruna B Royster1004Canada2025-04-23
Emily K Campain1005France2025-04-03
Ivar W Sergi1006Japan2025-04-12
Aika S Rim1007Australia2025-04-03
Darci Q Glick1008Spain2025-04-25
Greenwood G Morasca1009India2025-04-10
Mujtaba S Rulapaugh1010Japan2025-04-06
Alejandro S Butt1011Spain2025-04-25
Rodrigues Y Darakjy1012Spain2025-04-22
Isabel B Gillian1013Argentina2025-04-09
Ricardo U Inouye1014France2025-04-20
Sinclair X Vocelka1015India2025-04-25
Aruna R Marrier1016Argentina2025-04-27
Ashley J Albares1017Spain2025-04-15
Salvatore L Foller1018Brazil2025-04-12
Stacey B Chui1019Italy2025-04-29
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Arvin O MaletSpainOnyama Limba NEW
Octavia C BologniaSpainIoni Bowcher RENEWAL
Chavez Y MaletRussiaAmy Elsner UNQUALIFIED
Claire S IturbideBrazilOnyama Limba NEW
Jeanfrancois E SlusarskiBrazilAsiya Javayant RENEWAL
Isabel Q MorascaGermanyIoni Bowcher UNQUALIFIED
Jones N SaylorsSpainBernardo Dominic UNQUALIFIED
Stacey W OstroskyJapanIvan Magalhaes UNQUALIFIED
David A VocelkaCanadaAmy Elsner QUALIFIED
Ivar D CaldareraGermanyBernardo Dominic RENEWAL
Emily C KuskoItalyAnna Fali QUALIFIED
Maisha R RoysterFranceAmy Elsner QUALIFIED
Murillo U StensethUnited KingdomOnyama Limba NEGOTIATION
Rodrigues F CaudySpainAnna Fali NEW
Antonio F WieserJapanAsiya Javayant RENEWAL
Izzy S OstroskyRussiaAsiya Javayant NEW
Morrow D VenereIndiaIvan Magalhaes NEGOTIATION
Octavia H MorascaAustraliaAmy Elsner UNQUALIFIED
Mujtaba Q BologniaBrazilIvan Magalhaes NEGOTIATION
Leon P WieserGermanyOnyama Limba UNQUALIFIED
Chavez X ButtCanadaXuxue Feng PROPOSAL
Isabel R WhobreyRussiaXuxue Feng NEGOTIATION
Jefferson P BowleyCanadaElwin Sharvill UNQUALIFIED
Aruna I RimItalyAnna Fali NEW
Rodrigues J KolmetzBrazilElwin Sharvill UNQUALIFIED
Jones N GarufiIndiaStephen Shaw RENEWAL
Salvatore K WieserIndiaBernardo Dominic NEW
Aditya F MacleadGermanyStephen Shaw UNQUALIFIED
Chavez Z FollerAustraliaAnna Fali QUALIFIED
Jennifer D SchemmerGermanyAsiya Javayant RENEWAL
James B FollerUnited KingdomAmy Elsner QUALIFIED
James F NestleAustraliaXuxue Feng NEW
Adams K MaletFranceAnna Fali QUALIFIED
Octavia K IturbideItalyBernardo Dominic NEW
Silvio M WaycottSpainElwin Sharvill RENEWAL
Silvio K DilliardFranceAnna Fali NEW
Kadeem P BriddickArgentinaIoni Bowcher NEW
Misaki C TollnerUnited KingdomElwin Sharvill NEGOTIATION
Francesco T AmigonAustraliaOnyama Limba UNQUALIFIED
Aika R MaletRussiaXuxue Feng 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>