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
Stacey F MacleadCanadaBernardo Dominic RENEWAL
Arvin X RimJapanStephen Shaw NEGOTIATION
Kaitlin N BologniaSpainAmy Elsner NEW
Francesco I ShinkoItalyAnna Fali NEGOTIATION
Greenwood A BologniaCanadaAmy Elsner PROPOSAL
James U NickaBrazilIoni Bowcher RENEWAL
Salvatore A FlosiFranceXuxue Feng NEGOTIATION
Kaitlin P SchemmerUnited KingdomBernardo Dominic PROPOSAL
Antonio R DarakjyArgentinaXuxue Feng UNQUALIFIED
Nicolas E VocelkaRussiaAnna Fali NEW
Darci Q VocelkaCanadaIvan Magalhaes PROPOSAL
Francesco Z CaldareraSpainStephen Shaw RENEWAL
Deepesh K SergiGermanyElwin Sharvill UNQUALIFIED
Silvio U WhobreyBrazilIoni Bowcher RENEWAL
Isabel M ShinkoAustraliaIoni Bowcher NEGOTIATION
James Q GlickAustraliaXuxue Feng UNQUALIFIED
Claire V CaudyGermanyAsiya Javayant NEW
Jennifer D PaprockiItalyXuxue Feng RENEWAL
Francesco Y FigeroaSpainIoni Bowcher PROPOSAL
Rodrigues R KuskoSpainAsiya Javayant PROPOSAL
Julie P ShinkoCanadaElwin Sharvill PROPOSAL
Emily Y MaletUnited KingdomIvan Magalhaes NEGOTIATION
Izzy O VenereSpainElwin Sharvill NEW
Salvatore N FollerIndiaAsiya Javayant UNQUALIFIED
Mujtaba S PerinItalyAmy Elsner NEGOTIATION
Smith A StensethJapanXuxue Feng NEGOTIATION
Aditya W BriddickSpainStephen Shaw UNQUALIFIED
Munro B SaylorsAustraliaAmy Elsner NEGOTIATION
Johnson I FerenczFranceIvan Magalhaes UNQUALIFIED
Julie U RimSpainStephen Shaw RENEWAL
Jennifer V ButtAustraliaIoni Bowcher RENEWAL
Emily R ShinkoIndiaAsiya Javayant NEW
Nicolas S CaldareraJapanAnna Fali PROPOSAL
Jennifer D VenereItalyOnyama Limba PROPOSAL
Rodrigues O OstroskyItalyIoni Bowcher QUALIFIED
Clifford F DoeUnited KingdomAmy Elsner NEGOTIATION
Aruna T GarufiItalyIoni Bowcher PROPOSAL
Kadeem B DarakjyArgentinaBernardo Dominic PROPOSAL
Nicolas A RutaAustraliaIoni Bowcher PROPOSAL
Aditya R DilliardBrazilOnyama Limba NEGOTIATION
Maria E SlusarskiJapanStephen Shaw NEGOTIATION
Smith B CaudyAustraliaIvan Magalhaes PROPOSAL
Leon Z AmigonAustraliaIvan Magalhaes NEW
Smith Y StockhamArgentinaOnyama Limba UNQUALIFIED
Aruna B KuskoArgentinaElwin Sharvill NEW
Kaitlin B MarrierBrazilIoni Bowcher RENEWAL
Isabel M AmigonCanadaIoni Bowcher NEW
Ashley X GlickItalyBernardo Dominic RENEWAL
Arvin O RimSpainIoni Bowcher NEGOTIATION
James L TollnerSpainIoni Bowcher NEW
Horizontal
NameCountryRepresentativeStatus
Ivar Z RimFranceIoni Bowcher RENEWAL
Claire X StensethUnited KingdomXuxue Feng NEW
Ivar H BriddickBrazilStephen Shaw NEW
Morrow J SchemmerFranceElwin Sharvill NEW
Misaki K KolmetzCanadaXuxue Feng QUALIFIED
Alejandro C GillianJapanAmy Elsner UNQUALIFIED
Jennifer C FollerCanadaBernardo Dominic QUALIFIED
Jefferson T GarufiAustraliaXuxue Feng QUALIFIED
James R CampainItalyIvan Magalhaes RENEWAL
Munro D MorascaJapanOnyama Limba NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Kadeem Q KuskoSpain2025-06-10Truhlar And Truhlar Attys NEGOTIATION92Stephen Shaw
1001Leon N AmigonUnited Kingdom2025-05-28Chanay, Jeffrey A Esq UNQUALIFIED21Asiya Javayant
1002Chavez S OstroskyAustralia2025-05-28Rangoni Of Florence PROPOSAL33Bernardo Dominic
1003Antonio J ButtBrazil2025-05-31Benton, John B Jr PROPOSAL51Onyama Limba
1004Francesco C MacleadGermany2025-06-02Feltz Printing Service UNQUALIFIED96Amy Elsner
1005Julie M KuskoRussia2025-05-31Truhlar And Truhlar Attys NEGOTIATION29Anna Fali
1006Morrow L PerinFrance2025-06-18Printing Dimensions NEGOTIATION57Stephen Shaw
1007Silvio V MarrierFrance2025-06-15Dorl, James J Esq NEW81Xuxue Feng
1008Adams C PerinJapan2025-05-30Rangoni Of Florence NEGOTIATION32Elwin Sharvill
1009Ivar D ChuiBrazil2025-06-15Buckley Miller Wright UNQUALIFIED38Stephen Shaw
1010David B CaudyUnited Kingdom2025-05-27Buckley Miller Wright UNQUALIFIED58Asiya Javayant
1011Julie S InouyeRussia2025-06-07Truhlar And Truhlar Attys NEW18Ivan Magalhaes
1012Chavez X MorascaAustralia2025-06-10Truhlar And Truhlar Attys NEW73Stephen Shaw
1013Ashley B RimIndia2025-05-25Truhlar And Truhlar Attys PROPOSAL22Elwin Sharvill
1014Nicolas V GillianFrance2025-06-08Rousseaux, Michael Esq PROPOSAL93Anna Fali
1015Claire H GauchoGermany2025-06-02Commercial Press QUALIFIED69Ivan Magalhaes
1016Jefferson I SaylorsItaly2025-05-29Commercial Press QUALIFIED31Bernardo Dominic
1017Costa Z RutaCanada2025-06-02Morlong Associates NEW3Xuxue Feng
1018James H SaylorsFrance2025-06-06Buckley Miller Wright RENEWAL79Ioni Bowcher
1019Murillo I TollnerJapan2025-06-01Benton, John B Jr UNQUALIFIED2Anna Fali
1020Salvatore M PaprockiCanada2025-05-30Buckley Miller Wright QUALIFIED55Bernardo Dominic
1021Adams Q SergiSpain2025-05-25King, Christopher A Esq UNQUALIFIED13Onyama Limba
1022Kadeem F NickaIndia2025-06-03Benton, John B Jr UNQUALIFIED23Xuxue Feng
1023Ricardo Q DarakjyCanada2025-06-01Chapman, Ross E Esq RENEWAL56Stephen Shaw
1024Julie U GarufiCanada2025-05-31Buckley Miller Wright UNQUALIFIED84Amy Elsner
1025Alejandro B StensethRussia2025-05-25Chanay, Jeffrey A Esq UNQUALIFIED19Ivan Magalhaes
1026Cody P RimUnited Kingdom2025-06-02Commercial Press RENEWAL93Stephen Shaw
1027Cody E WhobreyGermany2025-06-06Truhlar And Truhlar Attys QUALIFIED45Anna Fali
1028Kadeem B BologniaItaly2025-06-17Chemel, James L Cpa QUALIFIED69Ioni Bowcher
1029Tony I GillianJapan2025-06-11Buckley Miller Wright UNQUALIFIED16Bernardo Dominic
1030Jefferson K RoysterGermany2025-06-13Buckley Miller Wright QUALIFIED2Onyama Limba
1031Deepesh B FollerFrance2025-05-22Buckley Miller Wright PROPOSAL38Stephen Shaw
1032Misaki J AmigonAustralia2025-06-14Commercial Press QUALIFIED30Onyama Limba
1033Cody I FigeroaUnited Kingdom2025-06-15Benton, John B Jr UNQUALIFIED73Asiya Javayant
1034Maisha C RoysterSpain2025-06-11Chemel, James L Cpa QUALIFIED87Asiya Javayant
1035Greenwood N PaprockiRussia2025-06-06Feiner Bros PROPOSAL5Anna Fali
1036Isabel U VocelkaAustralia2025-06-14Dorl, James J Esq RENEWAL47Ivan Magalhaes
1037Aditya S ChuiBrazil2025-06-13Chemel, James L Cpa NEGOTIATION16Xuxue Feng
1038Sinclair I NestleArgentina2025-05-31Morlong Associates PROPOSAL6Ioni Bowcher
1039Maisha P FerenczGermany2025-05-24Morlong Associates PROPOSAL58Amy Elsner
1040Rodrigues Y FlosiGermany2025-05-30Dorl, James J Esq RENEWAL33Asiya Javayant
1041Jones N MaletArgentina2025-05-21Printing Dimensions QUALIFIED99Asiya Javayant
1042Alejandro V ButtIndia2025-06-02Rangoni Of Florence UNQUALIFIED68Amy Elsner
1043Misaki W WaycottItaly2025-06-02Commercial Press NEW92Ioni Bowcher
1044David M OstroskyItaly2025-06-01Truhlar And Truhlar Attys UNQUALIFIED49Anna Fali
1045James O MaletArgentina2025-06-09Morlong Associates RENEWAL32Asiya Javayant
1046Cody Z SergiSpain2025-06-07Feiner Bros RENEWAL27Ivan Magalhaes
1047Sinclair S BriddickSpain2025-05-20Chapman, Ross E Esq RENEWAL68Ivan Magalhaes
1048Leon F RutaUnited Kingdom2025-06-17Truhlar And Truhlar Attys NEW74Asiya Javayant
1049Jones U MorascaAustralia2025-05-20Chemel, James L Cpa NEGOTIATION14Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Antonio A BriddickAustraliaElwin Sharvill NEW
Octavia Z MaletGermanyAsiya Javayant UNQUALIFIED
Mujtaba X BologniaItalyBernardo Dominic UNQUALIFIED
Juan I BriddickFranceAnna Fali RENEWAL
Greenwood V PaprockiAustraliaIoni Bowcher UNQUALIFIED
Darci I NestleCanadaBernardo Dominic PROPOSAL
Deepesh L KolmetzItalyAmy Elsner QUALIFIED
Maisha W RoysterUnited KingdomStephen Shaw QUALIFIED
Munro Y OldroydFranceOnyama Limba QUALIFIED
Kadeem L ChuiCanadaIvan Magalhaes NEGOTIATION
Juan A KolmetzUnited KingdomStephen Shaw QUALIFIED
Jones Q ShinkoArgentinaAnna Fali NEGOTIATION
Costa L BowleyItalyAmy Elsner NEW
Ivar Q MaletFranceElwin Sharvill RENEWAL
Julie V DoeGermanyAnna Fali RENEWAL
Juan O StensethIndiaAnna Fali NEGOTIATION
Sinclair F InouyeIndiaOnyama Limba RENEWAL
Isabel I VenereCanadaStephen Shaw PROPOSAL
Jeanfrancois I DoeFranceAnna Fali RENEWAL
Silvio W PerinSpainIoni Bowcher NEGOTIATION
Aika B PerinUnited KingdomIvan Magalhaes RENEWAL
Chavez U InouyeRussiaAsiya Javayant NEGOTIATION
Mayumi V BologniaIndiaIoni Bowcher RENEWAL
Morrow M DoeItalyOnyama Limba NEGOTIATION
Izzy V SchemmerItalyIoni Bowcher QUALIFIED
Wickens J BriddickAustraliaIoni Bowcher NEGOTIATION
Deepesh C PoquetteSpainAnna Fali PROPOSAL
Smith N BowleyJapanBernardo Dominic RENEWAL
Izzy H WhobreyUnited KingdomOnyama Limba QUALIFIED
Leon E ButtAustraliaIvan Magalhaes NEW
Smith F KolmetzCanadaIvan Magalhaes NEW
Deepesh O StockhamItalyOnyama Limba NEGOTIATION
Smith S OldroydJapanOnyama Limba NEW
Sinclair F KolmetzRussiaBernardo Dominic NEGOTIATION
Mayumi U PerinGermanyAsiya Javayant UNQUALIFIED
Maria B WaycottRussiaStephen Shaw PROPOSAL
Leja C WaycottSpainOnyama Limba RENEWAL
Nicolas K FerenczUnited KingdomStephen Shaw QUALIFIED
James D MorascaJapanAnna Fali QUALIFIED
Jefferson L AmigonJapanAsiya Javayant RENEWAL
Cody I WaycottSpainIvan Magalhaes NEGOTIATION
Octavia F SlusarskiArgentinaAsiya Javayant PROPOSAL
Adams C MorascaUnited KingdomAsiya Javayant QUALIFIED
Leon D OldroydIndiaAmy Elsner NEGOTIATION
Ivar F GlickCanadaXuxue Feng QUALIFIED
Cody L MarrierCanadaBernardo Dominic RENEWAL
Ashley G FigeroaItalyAnna Fali QUALIFIED
Faith C CaldareraAustraliaAsiya Javayant RENEWAL
Jefferson M RulapaughCanadaAsiya Javayant NEGOTIATION
Jennifer I MaletIndiaOnyama Limba PROPOSAL
Frozen Columns
Name
Juan Z Briddick
Murillo V Sergi
Cody K Poquette
Kadeem O Vocelka
Alejandro N Waycott
Mayumi M Glick
Chavez U Figeroa
Chavez P Slusarski
Emily O Nestle
Nicolas O Caudy
Julie L Rulapaugh
Arvin Z Gaucho
Juan M Amigon
Munro U Foller
Aruna A Gaucho
Tony K Iturbide
Julie X Nestle
Alejandro P Ostrosky
Claire D Slusarski
Aruna A Tollner
Aruna B Morasca
Jeanfrancois G Saylors
Leon S Dilliard
Juan T Sergi
Ashley E Sergi
James M Venere
Claire H Venere
Darci O Bowley
Octavia C Amigon
Clifford S Bolognia
Ivar E Albares
Arvin R Rim
Clifford L Stockham
Tony Y Tollner
Adams Z Albares
Leja R Chui
Darci H Caldarera
Tony D Doe
Salvatore W Perin
Jones U Malet
Nicolas D Ostrosky
Morrow S Nestle
Kadeem D Doe
Kaitlin V Rim
Munro B Rim
Emily T Waycott
Ivar H Bowley
Costa D Ferencz
Ivar V Bowley
Jones E Malet
IdCountryDate
1000Argentina2025-06-03
1001Brazil2025-05-27
1002Japan2025-05-25
1003Spain2025-06-04
1004Spain2025-06-06
1005India2025-06-13
1006United Kingdom2025-06-13
1007Canada2025-06-04
1008India2025-06-13
1009Japan2025-06-07
1010Australia2025-06-14
1011Argentina2025-05-28
1012Japan2025-05-27
1013Brazil2025-05-31
1014Australia2025-06-03
1015Argentina2025-06-07
1016France2025-05-21
1017Spain2025-06-09
1018Russia2025-06-16
1019France2025-06-03
1020India2025-05-24
1021Brazil2025-05-31
1022Argentina2025-06-08
1023United Kingdom2025-05-25
1024France2025-05-26
1025Spain2025-06-17
1026Canada2025-06-07
1027Spain2025-06-04
1028Russia2025-06-09
1029Spain2025-06-03
1030Canada2025-05-22
1031Spain2025-06-17
1032Australia2025-06-01
1033Australia2025-06-17
1034United Kingdom2025-06-15
1035Australia2025-06-09
1036Australia2025-06-02
1037Canada2025-06-01
1038Russia2025-06-18
1039Germany2025-05-23
1040Canada2025-05-24
1041Italy2025-06-15
1042India2025-05-27
1043France2025-05-22
1044Germany2025-05-25
1045Germany2025-06-10
1046Japan2025-05-29
1047India2025-05-27
1048Russia2025-06-13
1049United Kingdom2025-05-25

On-Demand Data

NameIdCountryDate
Francesco R Waycott1000Brazil2025-06-14
Misaki D Figeroa1001United Kingdom2025-06-06
Murillo R Nicka1002Spain2025-05-28
David R Bolognia1003India2025-05-30
Chavez L Glick1004Spain2025-06-11
Johnson A Stenseth1005Russia2025-05-31
Jefferson U Venere1006India2025-05-28
Mayumi J Schemmer1007Spain2025-06-15
Isabel V Vocelka1008France2025-05-23
Silvio T Gaucho1009Canada2025-05-27
Jones I Morasca1010Italy2025-06-07
Stacey J Garufi1011Spain2025-06-12
Greenwood Q Stenseth1012Italy2025-05-28
Jefferson A Foller1013Russia2025-06-09
Greenwood R Albares1014United Kingdom2025-05-21
Misaki T Briddick1015Argentina2025-06-03
Jones A Gaucho1016United Kingdom2025-06-13
Aditya K Royster1017Australia2025-06-03
Aditya R Oldroyd1018United Kingdom2025-05-21
Jeanfrancois N Saylors1019Russia2025-06-08
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Leon J MaletAustraliaOnyama Limba RENEWAL
Greenwood U ShinkoIndiaStephen Shaw NEGOTIATION
Stacey N BriddickArgentinaBernardo Dominic PROPOSAL
Faith P CampainCanadaXuxue Feng NEGOTIATION
Aika L MorascaArgentinaXuxue Feng UNQUALIFIED
Maisha R WhobreyJapanOnyama Limba UNQUALIFIED
Morrow T GarufiAustraliaAsiya Javayant PROPOSAL
Adams D PaprockiItalyAsiya Javayant RENEWAL
Isabel P PaprockiFranceOnyama Limba NEW
Claire O StensethBrazilAnna Fali NEGOTIATION
Mujtaba N GauchoSpainIvan Magalhaes QUALIFIED
Mujtaba P KolmetzIndiaAnna Fali PROPOSAL
Costa G FollerIndiaAnna Fali QUALIFIED
David D VocelkaRussiaOnyama Limba NEW
Antonio C RoysterGermanyAsiya Javayant QUALIFIED
Juan K FollerRussiaAsiya Javayant QUALIFIED
Mayumi D CaldareraItalyElwin Sharvill NEW
Aruna X InouyeSpainStephen Shaw NEW
David T FerenczUnited KingdomBernardo Dominic UNQUALIFIED
Darci F FigeroaArgentinaXuxue Feng PROPOSAL
Mujtaba P FerenczIndiaElwin Sharvill PROPOSAL
Jones O OstroskyGermanyXuxue Feng QUALIFIED
Aruna F FollerAustraliaOnyama Limba QUALIFIED
Mayumi C WhobreyFranceStephen Shaw RENEWAL
Juan X ButtCanadaAmy Elsner UNQUALIFIED
Adams W CaudyArgentinaXuxue Feng PROPOSAL
Deepesh C GauchoGermanyAmy Elsner RENEWAL
Stacey F SergiJapanElwin Sharvill UNQUALIFIED
Julie E RimAustraliaElwin Sharvill RENEWAL
Stacey Q DoeItalyAnna Fali UNQUALIFIED
Greenwood O FollerFranceXuxue Feng RENEWAL
Ivar Z DarakjyItalyElwin Sharvill PROPOSAL
Claire S ShinkoGermanyBernardo Dominic QUALIFIED
Murillo U PerinBrazilAmy Elsner PROPOSAL
Johnson I StensethArgentinaBernardo Dominic PROPOSAL
Deepesh A CaldareraArgentinaOnyama Limba PROPOSAL
Salvatore A PoquetteItalyElwin Sharvill UNQUALIFIED
Mayumi R TollnerItalyIvan Magalhaes NEW
Cody Y VenereIndiaBernardo Dominic NEW
Morrow Y SlusarskiGermanyStephen Shaw 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>