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
Jones Z WaycottFranceAsiya Javayant RENEWAL
Costa N OstroskySpainBernardo Dominic UNQUALIFIED
Munro Q BologniaRussiaOnyama Limba QUALIFIED
Smith T PaprockiRussiaElwin Sharvill UNQUALIFIED
Arvin Q SchemmerGermanyAnna Fali NEW
Aika R StensethArgentinaAmy Elsner NEGOTIATION
Cody E AlbaresAustraliaAnna Fali NEW
Jeanfrancois A GlickJapanAnna Fali NEW
Chavez E ButtJapanXuxue Feng UNQUALIFIED
Aditya O FollerUnited KingdomElwin Sharvill PROPOSAL
Misaki X AlbaresIndiaStephen Shaw RENEWAL
Leja L MaletSpainOnyama Limba NEW
Octavia U RulapaughItalyBernardo Dominic QUALIFIED
Munro Q KolmetzFranceElwin Sharvill UNQUALIFIED
Ricardo Z IturbideGermanyStephen Shaw QUALIFIED
Claire W GauchoIndiaIvan Magalhaes QUALIFIED
Leon S SlusarskiFranceXuxue Feng UNQUALIFIED
Antonio O BowleyGermanyIvan Magalhaes NEW
Emily K StockhamItalyIvan Magalhaes RENEWAL
Morrow U CaldareraGermanyAmy Elsner RENEWAL
Faith S NestleCanadaIoni Bowcher RENEWAL
Isabel A FigeroaArgentinaOnyama Limba RENEWAL
Sinclair K ShinkoGermanyElwin Sharvill NEW
Costa H AlbaresItalyXuxue Feng UNQUALIFIED
Ashley S PoquetteJapanAnna Fali UNQUALIFIED
Arvin T KuskoArgentinaBernardo Dominic QUALIFIED
Kaitlin B DoeSpainAnna Fali RENEWAL
Tony D KolmetzBrazilOnyama Limba NEGOTIATION
Nicolas B DoeUnited KingdomStephen Shaw QUALIFIED
Stacey B AmigonIndiaElwin Sharvill RENEWAL
Rodrigues X CampainSpainElwin Sharvill RENEWAL
Smith L BowleyBrazilAnna Fali NEW
Rodrigues J MorascaBrazilBernardo Dominic NEGOTIATION
James B RoysterGermanyBernardo Dominic NEW
Nicolas K GlickItalyAsiya Javayant PROPOSAL
Jefferson S KolmetzRussiaAsiya Javayant QUALIFIED
Izzy S CaudyCanadaAnna Fali QUALIFIED
Jeanfrancois C FigeroaCanadaXuxue Feng RENEWAL
Sinclair S TollnerGermanyElwin Sharvill NEW
Misaki X CaldareraRussiaElwin Sharvill QUALIFIED
Murillo U SchemmerAustraliaStephen Shaw PROPOSAL
Jones B DarakjyGermanyOnyama Limba QUALIFIED
Wickens G FerenczFranceIvan Magalhaes RENEWAL
Murillo A WaycottItalyAnna Fali PROPOSAL
Misaki W WieserFranceAnna Fali RENEWAL
Francesco S RoysterCanadaIoni Bowcher QUALIFIED
Emily E AmigonAustraliaElwin Sharvill QUALIFIED
Clifford C VocelkaFranceIvan Magalhaes QUALIFIED
Sinclair L RutaFranceAnna Fali QUALIFIED
Jeanfrancois N NestleJapanAnna Fali NEW
Horizontal
NameCountryRepresentativeStatus
Antonio K ShinkoCanadaElwin Sharvill QUALIFIED
Rodrigues X KolmetzRussiaAmy Elsner NEW
Isabel M AlbaresIndiaIvan Magalhaes UNQUALIFIED
Ivar J KolmetzCanadaAnna Fali NEW
Silvio M GarufiJapanIvan Magalhaes UNQUALIFIED
Cody R KolmetzFranceStephen Shaw PROPOSAL
Costa H BowleyBrazilOnyama Limba QUALIFIED
Leon R SchemmerBrazilAsiya Javayant PROPOSAL
Octavia Q PaprockiSpainOnyama Limba NEW
Chavez N GauchoAustraliaAnna Fali NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Faith Q GillianRussia2024-09-03Printing Dimensions QUALIFIED86Ioni Bowcher
1001Maria A GillianAustralia2024-09-01Chapman, Ross E Esq PROPOSAL11Onyama Limba
1002Arvin P MacleadBrazil2024-09-09Morlong Associates RENEWAL45Xuxue Feng
1003Johnson G DoeGermany2024-09-22Chapman, Ross E Esq QUALIFIED10Stephen Shaw
1004Jefferson R KolmetzCanada2024-09-14Benton, John B Jr PROPOSAL17Ioni Bowcher
1005Alejandro H MacleadIndia2024-09-16Rangoni Of Florence NEW33Stephen Shaw
1006Izzy C NestleJapan2024-09-10Morlong Associates UNQUALIFIED81Ivan Magalhaes
1007Ricardo Q RutaUnited Kingdom2024-09-11Truhlar And Truhlar Attys UNQUALIFIED35Anna Fali
1008Ricardo C ButtGermany2024-09-08Truhlar And Truhlar Attys NEGOTIATION31Onyama Limba
1009Isabel Z StensethUnited Kingdom2024-09-08Morlong Associates NEGOTIATION6Stephen Shaw
1010Morrow T FlosiItaly2024-09-18Feiner Bros UNQUALIFIED11Bernardo Dominic
1011Rodrigues S KuskoSpain2024-09-09Dorl, James J Esq UNQUALIFIED39Asiya Javayant
1012Leon P ShinkoAustralia2024-09-12Truhlar And Truhlar Attys RENEWAL48Ivan Magalhaes
1013Ashley P MarrierJapan2024-09-23Truhlar And Truhlar Attys PROPOSAL63Elwin Sharvill
1014Ivar Q RutaSpain2024-08-27Morlong Associates RENEWAL80Bernardo Dominic
1015Nicolas R VocelkaGermany2024-09-05Chemel, James L Cpa NEGOTIATION41Ioni Bowcher
1016Ricardo X RoysterRussia2024-09-05Dorl, James J Esq NEW95Xuxue Feng
1017Misaki X OstroskyArgentina2024-09-12Chapman, Ross E Esq PROPOSAL28Xuxue Feng
1018Mujtaba M OldroydSpain2024-09-18Morlong Associates NEW84Onyama Limba
1019Leon J WhobreyGermany2024-09-08Truhlar And Truhlar Attys PROPOSAL55Ioni Bowcher
1020Kadeem I RimRussia2024-09-12Chanay, Jeffrey A Esq NEGOTIATION80Onyama Limba
1021Jones N WhobreyUnited Kingdom2024-09-12Feltz Printing Service RENEWAL10Asiya Javayant
1022Mujtaba O OldroydGermany2024-08-31Chanay, Jeffrey A Esq UNQUALIFIED54Onyama Limba
1023Jeanfrancois R GauchoBrazil2024-09-21Chemel, James L Cpa QUALIFIED38Elwin Sharvill
1024Francesco M MaletBrazil2024-09-07Chemel, James L Cpa PROPOSAL59Ioni Bowcher
1025Aditya Z FigeroaIndia2024-08-29Chemel, James L Cpa RENEWAL64Onyama Limba
1026Jefferson M MacleadBrazil2024-08-25Rangoni Of Florence NEGOTIATION56Xuxue Feng
1027Maisha W KuskoFrance2024-09-09Rousseaux, Michael Esq NEW32Elwin Sharvill
1028Maria R FollerArgentina2024-08-31King, Christopher A Esq RENEWAL19Asiya Javayant
1029Munro C ButtAustralia2024-08-26Rangoni Of Florence NEW58Xuxue Feng
1030Costa M SaylorsAustralia2024-09-01King, Christopher A Esq NEW73Amy Elsner
1031Kadeem C DoeIndia2024-08-25Chanay, Jeffrey A Esq NEW2Anna Fali
1032Francesco C SchemmerItaly2024-09-02Feltz Printing Service NEGOTIATION22Onyama Limba
1033Mujtaba T PerinIndia2024-09-12Rousseaux, Michael Esq NEGOTIATION94Amy Elsner
1034Murillo H GlickArgentina2024-08-28Rangoni Of Florence RENEWAL23Elwin Sharvill
1035Tony V DoeCanada2024-09-11Feltz Printing Service UNQUALIFIED12Xuxue Feng
1036Emily R SlusarskiUnited Kingdom2024-09-14King, Christopher A Esq PROPOSAL77Ivan Magalhaes
1037Chavez V MorascaIndia2024-09-07Benton, John B Jr PROPOSAL75Bernardo Dominic
1038Mujtaba X TollnerUnited Kingdom2024-08-31Truhlar And Truhlar Attys NEW23Elwin Sharvill
1039Maisha X AmigonItaly2024-09-21King, Christopher A Esq NEW6Anna Fali
1040Ashley V CampainAustralia2024-08-29Rousseaux, Michael Esq NEW76Stephen Shaw
1041Deepesh S TollnerUnited Kingdom2024-08-30Feiner Bros NEW2Asiya Javayant
1042Sinclair V WieserAustralia2024-09-11Benton, John B Jr QUALIFIED31Stephen Shaw
1043Silvio D NickaArgentina2024-09-19Feltz Printing Service QUALIFIED0Bernardo Dominic
1044Nicolas L GlickFrance2024-09-02Feiner Bros NEW1Amy Elsner
1045Darci K WieserJapan2024-09-17Rousseaux, Michael Esq QUALIFIED46Anna Fali
1046Octavia M CaudyGermany2024-09-04Printing Dimensions QUALIFIED16Onyama Limba
1047Jones I PoquetteJapan2024-08-29Morlong Associates NEW18Asiya Javayant
1048Adams C SergiIndia2024-09-09King, Christopher A Esq NEGOTIATION43Anna Fali
1049Julie Z WieserUnited Kingdom2024-08-28Feiner Bros PROPOSAL0Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Munro S OldroydJapanXuxue Feng NEW
Stacey G SlusarskiGermanyAnna Fali PROPOSAL
Morrow I MarrierJapanXuxue Feng QUALIFIED
Silvio H DilliardJapanAsiya Javayant RENEWAL
Mujtaba D CampainArgentinaBernardo Dominic RENEWAL
Stacey N ButtItalyIoni Bowcher QUALIFIED
Leja T CaudyCanadaAnna Fali NEGOTIATION
Aika P WaycottIndiaAmy Elsner QUALIFIED
Jones J SlusarskiRussiaOnyama Limba PROPOSAL
Ricardo X MaletBrazilIoni Bowcher RENEWAL
Leon H PoquetteGermanyIoni Bowcher PROPOSAL
Jeanfrancois F FerenczIndiaBernardo Dominic QUALIFIED
Silvio Y SergiRussiaAsiya Javayant NEGOTIATION
Deepesh U BowleySpainAnna Fali NEW
Jefferson L MaletGermanyAmy Elsner PROPOSAL
Leon S FollerSpainAsiya Javayant PROPOSAL
Maria U NestleSpainAnna Fali PROPOSAL
Tony Y SlusarskiFranceOnyama Limba QUALIFIED
Octavia S ShinkoSpainAnna Fali RENEWAL
Jones M InouyeRussiaOnyama Limba NEW
Juan X VocelkaAustraliaAsiya Javayant RENEWAL
David V BowleyBrazilAnna Fali NEW
Jones U SaylorsFranceIvan Magalhaes QUALIFIED
Jones D PerinItalyIvan Magalhaes PROPOSAL
Emily X SergiItalyIvan Magalhaes QUALIFIED
Alejandro U AmigonArgentinaStephen Shaw PROPOSAL
Smith Q ChuiGermanyOnyama Limba QUALIFIED
Kaitlin J MaletSpainElwin Sharvill RENEWAL
Deepesh N ShinkoRussiaIvan Magalhaes NEW
Juan R GauchoArgentinaXuxue Feng UNQUALIFIED
Cody Z NickaRussiaXuxue Feng UNQUALIFIED
Greenwood L NestleBrazilAmy Elsner UNQUALIFIED
Leon I ChuiArgentinaElwin Sharvill NEW
Leja R IturbideJapanElwin Sharvill PROPOSAL
Alejandro W VenereRussiaAnna Fali UNQUALIFIED
Deepesh G SchemmerAustraliaAsiya Javayant NEW
Tony W StensethItalyBernardo Dominic UNQUALIFIED
Izzy R MarrierJapanElwin Sharvill PROPOSAL
Juan J MorascaUnited KingdomOnyama Limba PROPOSAL
Mayumi A MacleadJapanElwin Sharvill QUALIFIED
Aditya D RulapaughFranceOnyama Limba UNQUALIFIED
Deepesh G MacleadGermanyAmy Elsner QUALIFIED
Stacey D SlusarskiIndiaXuxue Feng UNQUALIFIED
Aika N FollerArgentinaAsiya Javayant PROPOSAL
Munro R AlbaresGermanyAmy Elsner QUALIFIED
Isabel O AlbaresFranceOnyama Limba NEW
Maisha Q NickaSpainXuxue Feng NEW
Antonio U FerenczBrazilIvan Magalhaes NEW
Smith U WhobreyRussiaBernardo Dominic PROPOSAL
Arvin L RutaArgentinaElwin Sharvill NEGOTIATION
Frozen Columns
Name
Costa X Malet
Clifford H Figeroa
Francesco G Wieser
Alejandro S Flosi
Jennifer P Oldroyd
Mayumi A Dilliard
Wickens E Oldroyd
Claire C Malet
Antonio R Morasca
Mujtaba A Kusko
Salvatore Y Oldroyd
Isabel Q Marrier
Ashley Q Iturbide
Aruna T Sergi
Murillo Z Poquette
Deepesh W Bolognia
Johnson V Stockham
Leja E Sergi
Faith C Foller
Johnson L Figeroa
Chavez B Tollner
Maria S Garufi
Tony N Tollner
Arvin N Ostrosky
Alejandro P Darakjy
Alejandro J Gaucho
Adams G Glick
Emily Y Glick
Silvio L Nestle
Morrow B Ruta
Julie J Schemmer
Arvin V Garufi
Adams P Stockham
Salvatore P Stenseth
Cody Y Chui
Munro N Rim
Julie Z Albares
James E Wieser
Salvatore T Ruta
Kadeem A Marrier
Salvatore K Morasca
Greenwood L Malet
Silvio B Sergi
Octavia K Schemmer
Aika Q Stenseth
Deepesh P Stenseth
Nicolas T Saylors
Alejandro L Caldarera
Aika H Glick
Maisha B Doe
IdCountryDate
1000France2024-08-28
1001Brazil2024-08-30
1002Italy2024-09-23
1003France2024-08-27
1004Russia2024-08-25
1005Argentina2024-09-17
1006Australia2024-08-27
1007India2024-09-02
1008Argentina2024-09-04
1009India2024-09-18
1010India2024-09-15
1011France2024-09-06
1012Australia2024-09-19
1013Russia2024-09-13
1014India2024-08-25
1015Japan2024-09-11
1016Australia2024-09-09
1017India2024-09-18
1018Argentina2024-09-11
1019France2024-09-22
1020India2024-09-05
1021Australia2024-09-20
1022United Kingdom2024-09-01
1023Argentina2024-09-07
1024Italy2024-09-02
1025Brazil2024-09-18
1026India2024-09-02
1027Spain2024-09-21
1028Canada2024-08-29
1029Australia2024-09-03
1030Argentina2024-09-09
1031Italy2024-08-31
1032India2024-09-13
1033Japan2024-09-20
1034Spain2024-09-10
1035India2024-09-12
1036Germany2024-08-30
1037Germany2024-09-07
1038Brazil2024-09-17
1039Canada2024-09-23
1040Canada2024-09-19
1041Russia2024-09-01
1042Germany2024-09-09
1043Germany2024-09-17
1044Spain2024-09-21
1045Germany2024-08-26
1046Australia2024-09-09
1047Australia2024-09-18
1048Japan2024-09-20
1049Brazil2024-09-12

On-Demand Data

NameIdCountryDate
Mayumi V Amigon1000Spain2024-09-04
Wickens B Oldroyd1001Australia2024-08-26
Izzy R Glick1002Germany2024-09-19
Nicolas R Malet1003France2024-08-29
Antonio C Paprocki1004India2024-09-10
Greenwood Q Sergi1005Canada2024-09-18
Jones W Nicka1006India2024-09-10
Smith P Gaucho1007United Kingdom2024-09-23
Maria V Gaucho1008Japan2024-09-07
Kaitlin D Waycott1009Brazil2024-08-28
Tony V Campain1010Japan2024-09-11
Ricardo J Sergi1011Germany2024-09-07
Murillo Y Butt1012Russia2024-09-20
Julie T Royster1013Argentina2024-09-04
Jeanfrancois J Slusarski1014Brazil2024-09-04
Stacey M Kusko1015India2024-09-14
Julie X Ostrosky1016France2024-09-08
Tony J Kolmetz1017Spain2024-08-27
Isabel E Gillian1018India2024-08-29
Emily X Nestle1019Russia2024-09-17
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Stacey X FlosiSpainAsiya Javayant PROPOSAL
Ivar S ButtAustraliaStephen Shaw PROPOSAL
Morrow M SaylorsAustraliaElwin Sharvill RENEWAL
Izzy P KolmetzRussiaAnna Fali PROPOSAL
Aika C AlbaresBrazilIoni Bowcher PROPOSAL
Juan H CaldareraAustraliaIvan Magalhaes NEGOTIATION
Silvio V VenereUnited KingdomStephen Shaw PROPOSAL
Aruna F SlusarskiCanadaBernardo Dominic NEGOTIATION
Aruna B DoeSpainBernardo Dominic NEW
Aruna I WieserFranceIoni Bowcher RENEWAL
Ashley C FigeroaGermanyAnna Fali PROPOSAL
Munro M RimFranceIoni Bowcher UNQUALIFIED
Costa W SergiSpainIoni Bowcher NEGOTIATION
Jones M PoquetteGermanyElwin Sharvill QUALIFIED
Jeanfrancois K BologniaRussiaBernardo Dominic UNQUALIFIED
Smith X WhobreyItalyAsiya Javayant NEGOTIATION
Kadeem O RoysterCanadaIoni Bowcher NEW
Costa L CaudyBrazilIoni Bowcher QUALIFIED
Jefferson G AlbaresIndiaAnna Fali UNQUALIFIED
Jeanfrancois E PerinSpainAsiya Javayant NEW
Cody I BologniaRussiaIvan Magalhaes NEW
Isabel H GillianCanadaIoni Bowcher NEGOTIATION
Juan E FigeroaFranceStephen Shaw RENEWAL
Misaki E GauchoSpainIvan Magalhaes NEW
Leja O GarufiSpainElwin Sharvill PROPOSAL
Aruna P InouyeAustraliaAsiya Javayant PROPOSAL
Sinclair M VocelkaCanadaIvan Magalhaes PROPOSAL
Francesco S InouyeJapanElwin Sharvill PROPOSAL
Johnson L SlusarskiCanadaIoni Bowcher RENEWAL
Costa U ShinkoJapanOnyama Limba RENEWAL
Morrow W MacleadBrazilIvan Magalhaes PROPOSAL
Cody Y SergiCanadaStephen Shaw NEW
Antonio P RutaIndiaIoni Bowcher NEGOTIATION
Kadeem M KuskoRussiaElwin Sharvill QUALIFIED
Leja H StockhamAustraliaXuxue Feng NEW
Jefferson X GauchoAustraliaAmy Elsner QUALIFIED
Isabel B WieserGermanyStephen Shaw UNQUALIFIED
Stacey L RimCanadaIvan Magalhaes UNQUALIFIED
Morrow G CaudyIndiaElwin Sharvill NEGOTIATION
Emily D MarrierIndiaAmy Elsner 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>