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
Cody W MorascaSpainAsiya Javayant RENEWAL
Aditya V FlosiBrazilStephen Shaw QUALIFIED
Juan M SaylorsFranceAsiya Javayant NEW
Deepesh B WhobreyItalyAnna Fali PROPOSAL
Julie T RutaSpainIoni Bowcher NEW
Jones D RulapaughJapanElwin Sharvill PROPOSAL
Alejandro W PerinJapanBernardo Dominic PROPOSAL
Ivar I VenereGermanyAsiya Javayant UNQUALIFIED
Emily D GarufiFranceElwin Sharvill QUALIFIED
Murillo H MarrierUnited KingdomAmy Elsner RENEWAL
Arvin D CaldareraRussiaElwin Sharvill NEGOTIATION
Clifford N BologniaArgentinaOnyama Limba RENEWAL
Munro L WieserIndiaAmy Elsner NEW
Darci P PaprockiArgentinaOnyama Limba NEGOTIATION
Ricardo E MarrierItalyXuxue Feng NEW
Morrow M KolmetzGermanyAsiya Javayant PROPOSAL
Maria I RutaGermanyOnyama Limba QUALIFIED
Mujtaba S GarufiArgentinaIoni Bowcher NEW
Leon R PoquetteArgentinaBernardo Dominic RENEWAL
Jefferson B WaycottFranceAnna Fali RENEWAL
Ricardo H StockhamUnited KingdomAnna Fali NEGOTIATION
Misaki A WieserUnited KingdomAnna Fali QUALIFIED
Arvin L ButtUnited KingdomElwin Sharvill QUALIFIED
Juan V RutaAustraliaOnyama Limba PROPOSAL
Arvin Y ShinkoBrazilOnyama Limba UNQUALIFIED
Jennifer F ChuiItalyOnyama Limba UNQUALIFIED
Mayumi U StensethRussiaIvan Magalhaes RENEWAL
Maisha Z InouyeUnited KingdomBernardo Dominic RENEWAL
Chavez V WaycottUnited KingdomAmy Elsner PROPOSAL
Alejandro E BowleyUnited KingdomElwin Sharvill NEW
Sinclair F MacleadGermanyBernardo Dominic UNQUALIFIED
Johnson E IturbideArgentinaIvan Magalhaes NEW
Adams R ChuiArgentinaStephen Shaw PROPOSAL
Julie L AmigonUnited KingdomAmy Elsner PROPOSAL
Ashley O ButtAustraliaIvan Magalhaes PROPOSAL
Ashley N SchemmerArgentinaXuxue Feng RENEWAL
Izzy S StensethJapanAmy Elsner QUALIFIED
Salvatore H AmigonCanadaOnyama Limba NEW
Johnson U VocelkaRussiaOnyama Limba QUALIFIED
Aika U CaldareraBrazilXuxue Feng UNQUALIFIED
Morrow I GauchoSpainElwin Sharvill UNQUALIFIED
Kadeem H DarakjySpainOnyama Limba QUALIFIED
Mayumi X SlusarskiItalyIoni Bowcher QUALIFIED
Ivar S SergiAustraliaAsiya Javayant NEGOTIATION
Mujtaba M InouyeSpainElwin Sharvill RENEWAL
Octavia G BriddickIndiaAmy Elsner QUALIFIED
Ivar L CaldareraCanadaAsiya Javayant UNQUALIFIED
Mujtaba V MorascaAustraliaAmy Elsner UNQUALIFIED
Isabel Y FollerIndiaAmy Elsner UNQUALIFIED
Jefferson L FerenczArgentinaAsiya Javayant PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Jones F RutaUnited KingdomAnna Fali PROPOSAL
Maria R WaycottBrazilAsiya Javayant NEGOTIATION
Morrow M NestleJapanIoni Bowcher NEW
Munro O VenereSpainAmy Elsner RENEWAL
Silvio R KolmetzUnited KingdomIvan Magalhaes NEW
Kaitlin F NestleItalyAsiya Javayant RENEWAL
Leja M FerenczSpainBernardo Dominic NEGOTIATION
Munro P IturbideSpainIvan Magalhaes QUALIFIED
Cody A RoysterBrazilXuxue Feng RENEWAL
Leja B RimBrazilStephen Shaw NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Kadeem I ChuiGermany2025-05-30Chapman, Ross E Esq RENEWAL62Asiya Javayant
1001Cody D IturbideFrance2025-06-14Buckley Miller Wright PROPOSAL72Elwin Sharvill
1002Emily H AlbaresRussia2025-05-24King, Christopher A Esq PROPOSAL30Stephen Shaw
1003Claire B PoquetteCanada2025-06-13Chapman, Ross E Esq NEGOTIATION77Onyama Limba
1004Alejandro B NestleSpain2025-05-18Chanay, Jeffrey A Esq PROPOSAL37Stephen Shaw
1005Kaitlin N StensethJapan2025-06-15Chanay, Jeffrey A Esq UNQUALIFIED53Xuxue Feng
1006Leja F IturbideUnited Kingdom2025-05-28Feiner Bros PROPOSAL23Ivan Magalhaes
1007Ivar M RimCanada2025-06-14Chemel, James L Cpa NEW38Asiya Javayant
1008Kaitlin N SergiCanada2025-06-10Rangoni Of Florence UNQUALIFIED32Ivan Magalhaes
1009Emily V WhobreyFrance2025-06-05Benton, John B Jr QUALIFIED16Anna Fali
1010Ashley K BriddickGermany2025-05-24Buckley Miller Wright PROPOSAL40Anna Fali
1011Ashley P SlusarskiFrance2025-06-07Rousseaux, Michael Esq UNQUALIFIED49Ivan Magalhaes
1012Misaki K BowleyBrazil2025-05-30Feiner Bros RENEWAL39Amy Elsner
1013Costa S RoysterAustralia2025-06-08Chapman, Ross E Esq RENEWAL86Ivan Magalhaes
1014Leja N PerinArgentina2025-05-29Dorl, James J Esq RENEWAL5Amy Elsner
1015Munro H RulapaughCanada2025-06-01Benton, John B Jr QUALIFIED50Elwin Sharvill
1016Emily U StockhamSpain2025-06-02Printing Dimensions NEGOTIATION70Ivan Magalhaes
1017Emily R TollnerGermany2025-06-08Printing Dimensions NEGOTIATION48Anna Fali
1018Sinclair S CaldareraBrazil2025-05-26Buckley Miller Wright UNQUALIFIED75Bernardo Dominic
1019Tony E SlusarskiRussia2025-05-19Morlong Associates QUALIFIED1Ivan Magalhaes
1020Isabel A OstroskyCanada2025-06-09Benton, John B Jr QUALIFIED1Amy Elsner
1021Emily U GlickItaly2025-06-06Rangoni Of Florence PROPOSAL7Anna Fali
1022Claire G StensethCanada2025-06-08Benton, John B Jr UNQUALIFIED36Onyama Limba
1023Murillo R RimFrance2025-06-15King, Christopher A Esq NEW97Anna Fali
1024Rodrigues W KuskoAustralia2025-06-01Commercial Press QUALIFIED2Bernardo Dominic
1025Julie L TollnerIndia2025-05-28Chanay, Jeffrey A Esq QUALIFIED9Ioni Bowcher
1026Leon U RulapaughRussia2025-05-19Dorl, James J Esq RENEWAL87Amy Elsner
1027Julie Y BriddickBrazil2025-06-10Rangoni Of Florence NEGOTIATION1Amy Elsner
1028Morrow F InouyeAustralia2025-05-25Chemel, James L Cpa UNQUALIFIED78Onyama Limba
1029Stacey A NestleRussia2025-06-05Chanay, Jeffrey A Esq QUALIFIED7Asiya Javayant
1030Murillo F SergiRussia2025-06-04King, Christopher A Esq NEW55Elwin Sharvill
1031Greenwood T NickaAustralia2025-06-08Rousseaux, Michael Esq UNQUALIFIED9Amy Elsner
1032Cody S SchemmerCanada2025-05-28Printing Dimensions UNQUALIFIED21Ioni Bowcher
1033Aruna F BriddickAustralia2025-05-18Printing Dimensions PROPOSAL19Bernardo Dominic
1034Jefferson V SchemmerFrance2025-05-30Rangoni Of Florence PROPOSAL82Bernardo Dominic
1035Maria I DoeFrance2025-06-08Chemel, James L Cpa PROPOSAL68Asiya Javayant
1036James O MaletFrance2025-05-30Benton, John B Jr UNQUALIFIED29Anna Fali
1037Arvin D TollnerRussia2025-06-10Buckley Miller Wright QUALIFIED28Bernardo Dominic
1038Jones X MarrierIndia2025-06-12Benton, John B Jr PROPOSAL42Anna Fali
1039Leja X PerinItaly2025-06-04Chapman, Ross E Esq NEGOTIATION11Bernardo Dominic
1040Leon J CaudyRussia2025-05-30Chemel, James L Cpa NEW62Stephen Shaw
1041Aruna H WieserFrance2025-06-06Feltz Printing Service RENEWAL27Elwin Sharvill
1042Ivar X DilliardJapan2025-06-01Buckley Miller Wright PROPOSAL58Stephen Shaw
1043Jeanfrancois P PoquetteArgentina2025-05-27Printing Dimensions RENEWAL28Stephen Shaw
1044Isabel Y OstroskyCanada2025-05-29Printing Dimensions UNQUALIFIED43Asiya Javayant
1045Maria I RoysterAustralia2025-05-20Benton, John B Jr NEW93Ioni Bowcher
1046James A CaudyFrance2025-06-12Commercial Press NEGOTIATION24Amy Elsner
1047Ashley D SchemmerJapan2025-05-29Benton, John B Jr NEGOTIATION21Onyama Limba
1048Johnson B OldroydFrance2025-05-20Printing Dimensions QUALIFIED92Xuxue Feng
1049Misaki C MorascaIndia2025-05-21Morlong Associates UNQUALIFIED34Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Jennifer K NestleSpainIvan Magalhaes RENEWAL
Ricardo B InouyeFranceIoni Bowcher RENEWAL
Jeanfrancois B RoysterJapanStephen Shaw QUALIFIED
Kadeem Z CaldareraCanadaAsiya Javayant NEW
Aika R FigeroaCanadaIvan Magalhaes QUALIFIED
Stacey M MarrierIndiaIvan Magalhaes UNQUALIFIED
Mujtaba M InouyeFranceAsiya Javayant NEGOTIATION
Izzy L SergiGermanyBernardo Dominic QUALIFIED
Stacey X WaycottFranceElwin Sharvill NEW
Johnson R FigeroaGermanyIoni Bowcher PROPOSAL
Munro Z StockhamGermanyOnyama Limba QUALIFIED
Ashley Z MorascaBrazilAmy Elsner QUALIFIED
Octavia J PoquetteItalyOnyama Limba RENEWAL
Alejandro R CampainGermanyBernardo Dominic QUALIFIED
Antonio X FlosiJapanAnna Fali NEW
Murillo M SaylorsRussiaBernardo Dominic UNQUALIFIED
Ivar C ShinkoCanadaStephen Shaw NEGOTIATION
Mujtaba F GillianGermanyIoni Bowcher PROPOSAL
Misaki M KuskoJapanIvan Magalhaes PROPOSAL
Kadeem J WhobreyItalyElwin Sharvill QUALIFIED
Antonio M KolmetzGermanyStephen Shaw NEW
Smith G BologniaJapanAsiya Javayant UNQUALIFIED
Johnson A FigeroaIndiaStephen Shaw NEGOTIATION
Darci O RulapaughCanadaElwin Sharvill UNQUALIFIED
Leon T AmigonFranceOnyama Limba NEW
Nicolas A RulapaughFranceStephen Shaw NEW
Ivar Z StensethItalyStephen Shaw RENEWAL
Morrow H CaudySpainAnna Fali QUALIFIED
Salvatore Y MaletRussiaBernardo Dominic PROPOSAL
Jeanfrancois Q CaldareraBrazilAnna Fali NEGOTIATION
Murillo A MaletItalyBernardo Dominic QUALIFIED
Leja K KuskoBrazilXuxue Feng UNQUALIFIED
Isabel A OstroskySpainAnna Fali QUALIFIED
Jones J RutaRussiaAnna Fali NEGOTIATION
Rodrigues K RutaIndiaAmy Elsner NEW
Jones B CampainBrazilXuxue Feng QUALIFIED
Octavia Q StensethGermanyIoni Bowcher NEW
Ivar B MarrierArgentinaAnna Fali NEGOTIATION
Rodrigues T VenereJapanAnna Fali PROPOSAL
Cody J WieserUnited KingdomIvan Magalhaes PROPOSAL
Juan H MorascaFranceBernardo Dominic PROPOSAL
Murillo O SchemmerIndiaAsiya Javayant NEW
Maisha F RutaArgentinaAnna Fali RENEWAL
Julie E PoquetteArgentinaAsiya Javayant NEW
Costa Q VocelkaRussiaBernardo Dominic QUALIFIED
David J DilliardFranceXuxue Feng RENEWAL
Mujtaba O PerinUnited KingdomAsiya Javayant QUALIFIED
Ivar K KuskoSpainAmy Elsner NEGOTIATION
Greenwood X VocelkaJapanAsiya Javayant PROPOSAL
Emily N GillianSpainStephen Shaw RENEWAL
Frozen Columns
Name
Kaitlin P Amigon
Morrow F Tollner
Morrow P Poquette
Kadeem I Malet
Maisha I Gaucho
Alejandro T Royster
Stacey P Perin
Chavez C Flosi
Tony B Shinko
Misaki X Venere
Octavia V Flosi
Deepesh V Ruta
Clifford Q Darakjy
Jefferson O Malet
Rodrigues W Glick
Darci J Ostrosky
Tony T Campain
Julie J Caudy
Jefferson J Perin
Stacey T Rulapaugh
Johnson S Wieser
Kaitlin G Oldroyd
Clifford Z Foller
Adams S Briddick
Jones L Stenseth
Clifford U Morasca
Claire U Ruta
Isabel B Nestle
Claire E Garufi
Munro V Rim
Stacey U Morasca
Francesco A Caldarera
Izzy J Marrier
Ricardo I Stockham
James R Schemmer
Ashley A Perin
Salvatore A Figeroa
Rodrigues U Tollner
Morrow S Butt
Juan O Whobrey
Leja M Briddick
Faith B Glick
Chavez S Wieser
Mujtaba G Bolognia
Jefferson K Chui
Aruna X Royster
Smith K Nicka
Arvin T Rim
Wickens O Butt
Deepesh W Iturbide
IdCountryDate
1000Spain2025-06-09
1001France2025-06-04
1002Russia2025-06-06
1003Spain2025-05-29
1004France2025-06-09
1005Brazil2025-06-04
1006United Kingdom2025-05-31
1007Japan2025-05-27
1008Russia2025-06-05
1009Germany2025-06-15
1010Russia2025-06-02
1011Argentina2025-06-11
1012Brazil2025-06-03
1013Italy2025-06-15
1014Brazil2025-05-29
1015Japan2025-05-19
1016Spain2025-05-30
1017Spain2025-06-05
1018Argentina2025-05-24
1019Russia2025-06-01
1020Australia2025-05-18
1021Spain2025-06-11
1022Brazil2025-05-22
1023India2025-06-03
1024Brazil2025-06-10
1025Canada2025-05-30
1026Italy2025-06-15
1027United Kingdom2025-06-02
1028India2025-06-15
1029France2025-05-26
1030Japan2025-05-27
1031Russia2025-05-29
1032Germany2025-05-20
1033France2025-06-01
1034France2025-05-18
1035Russia2025-05-31
1036Argentina2025-06-06
1037Spain2025-05-25
1038Brazil2025-05-21
1039Italy2025-05-23
1040Germany2025-05-27
1041United Kingdom2025-06-05
1042India2025-05-22
1043Australia2025-06-07
1044Australia2025-05-22
1045Australia2025-05-23
1046Germany2025-05-21
1047Russia2025-05-19
1048Argentina2025-06-02
1049Australia2025-05-26

On-Demand Data

NameIdCountryDate
Izzy V Nicka1000Argentina2025-06-04
Cody D Sergi1001India2025-05-30
Darci K Campain1002Italy2025-06-10
Darci X Doe1003Italy2025-05-25
Ivar R Tollner1004France2025-05-29
Jennifer P Dilliard1005Canada2025-05-22
Misaki W Bowley1006Germany2025-05-24
Kaitlin H Gaucho1007Argentina2025-06-01
Morrow M Rulapaugh1008Canada2025-06-03
Mujtaba U Flosi1009Australia2025-06-14
Jeanfrancois D Poquette1010United Kingdom2025-06-01
Arvin G Rim1011Germany2025-05-20
Rodrigues Z Rulapaugh1012Australia2025-06-09
Emily E Foller1013United Kingdom2025-06-07
Jones B Perin1014Italy2025-05-18
Francesco B Caudy1015Australia2025-05-30
Chavez Y Caldarera1016Canada2025-05-25
Leja W Venere1017Argentina2025-06-01
Faith B Albares1018Canada2025-05-27
Sinclair W Glick1019Spain2025-06-04
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Isabel L DoeGermanyXuxue Feng RENEWAL
Leja E ButtRussiaXuxue Feng UNQUALIFIED
Mujtaba J RimIndiaAmy Elsner PROPOSAL
Misaki A BriddickItalyAsiya Javayant NEGOTIATION
Murillo V MacleadSpainIvan Magalhaes UNQUALIFIED
Silvio U DilliardCanadaElwin Sharvill PROPOSAL
Emily Q PaprockiSpainAsiya Javayant PROPOSAL
Misaki I GauchoGermanyBernardo Dominic RENEWAL
Mayumi O OldroydRussiaIvan Magalhaes QUALIFIED
Jefferson S GillianSpainIvan Magalhaes PROPOSAL
Ashley Y MaletIndiaIoni Bowcher UNQUALIFIED
Emily V KuskoUnited KingdomIoni Bowcher PROPOSAL
Morrow C VocelkaSpainElwin Sharvill QUALIFIED
Maria G StockhamGermanyElwin Sharvill RENEWAL
Costa P MaletJapanAnna Fali QUALIFIED
Nicolas K RimArgentinaAmy Elsner NEGOTIATION
Ashley Q ButtGermanyBernardo Dominic NEW
Jones G CaudyItalyAmy Elsner NEW
Emily S StockhamRussiaAnna Fali RENEWAL
Clifford J StockhamBrazilAsiya Javayant RENEWAL
Leon W BowleyBrazilIoni Bowcher NEGOTIATION
Ashley G PerinFranceAsiya Javayant NEGOTIATION
Misaki Z OldroydIndiaIoni Bowcher NEW
Ivar C CampainArgentinaXuxue Feng NEW
Claire A VenereFranceStephen Shaw PROPOSAL
Nicolas Y FollerRussiaStephen Shaw QUALIFIED
Costa V CaudyCanadaElwin Sharvill PROPOSAL
Julie S AlbaresJapanStephen Shaw NEGOTIATION
Leon W OstroskyArgentinaIoni Bowcher PROPOSAL
Murillo J VenereRussiaIoni Bowcher PROPOSAL
Silvio B MarrierIndiaStephen Shaw QUALIFIED
Kaitlin E FigeroaArgentinaElwin Sharvill PROPOSAL
Izzy Z GarufiAustraliaIoni Bowcher UNQUALIFIED
Aditya N ButtBrazilBernardo Dominic QUALIFIED
Tony E GarufiBrazilStephen Shaw RENEWAL
Smith A ChuiRussiaOnyama Limba NEW
Aditya O AlbaresFranceXuxue Feng QUALIFIED
Johnson B MaletItalyOnyama Limba NEGOTIATION
Jennifer M MarrierAustraliaElwin Sharvill UNQUALIFIED
Smith B FigeroaItalyAnna 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>