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
Antonio X DoeAustraliaElwin Sharvill NEGOTIATION
Octavia U PaprockiCanadaStephen Shaw RENEWAL
Faith I FerenczUnited KingdomAsiya Javayant UNQUALIFIED
Faith R SergiSpainAmy Elsner RENEWAL
Ashley Q SergiCanadaIoni Bowcher NEGOTIATION
Rodrigues J GillianJapanBernardo Dominic RENEWAL
Mayumi F MaletUnited KingdomAnna Fali RENEWAL
Kaitlin H DoeSpainElwin Sharvill RENEWAL
Costa S OstroskySpainAmy Elsner UNQUALIFIED
Ivar C RutaArgentinaBernardo Dominic NEGOTIATION
Murillo Z ChuiIndiaStephen Shaw RENEWAL
Sinclair I CampainUnited KingdomAnna Fali PROPOSAL
Nicolas H MaletRussiaAnna Fali NEGOTIATION
Mayumi Z RutaSpainBernardo Dominic PROPOSAL
Cody R SaylorsArgentinaAnna Fali RENEWAL
Cody V MorascaIndiaElwin Sharvill PROPOSAL
Claire R OldroydAustraliaAnna Fali NEW
Kaitlin C ShinkoItalyOnyama Limba PROPOSAL
Sinclair R MarrierFranceIoni Bowcher RENEWAL
Ashley Y RimUnited KingdomBernardo Dominic RENEWAL
Costa L OstroskyIndiaAsiya Javayant NEW
Kadeem N DilliardRussiaAnna Fali NEW
Misaki A BologniaBrazilIvan Magalhaes NEGOTIATION
Rodrigues P ShinkoCanadaAnna Fali RENEWAL
Morrow E SergiGermanyXuxue Feng NEGOTIATION
Kadeem B InouyeRussiaAsiya Javayant RENEWAL
Alejandro Q ButtRussiaOnyama Limba NEGOTIATION
Arvin G NestleFranceIoni Bowcher PROPOSAL
Silvio Z PerinSpainElwin Sharvill UNQUALIFIED
Chavez P WhobreyCanadaIvan Magalhaes UNQUALIFIED
Jeanfrancois L NestleCanadaOnyama Limba NEW
Silvio Q CampainCanadaOnyama Limba RENEWAL
Jefferson Q SchemmerArgentinaAmy Elsner NEGOTIATION
Antonio F FerenczRussiaAnna Fali QUALIFIED
Adams Q FlosiArgentinaStephen Shaw PROPOSAL
Smith L GillianSpainAsiya Javayant NEGOTIATION
David P PoquetteUnited KingdomAsiya Javayant QUALIFIED
Adams Q FollerArgentinaIvan Magalhaes RENEWAL
Tony B DarakjyUnited KingdomIvan Magalhaes NEW
Alejandro D GillianFranceBernardo Dominic PROPOSAL
Chavez B BriddickArgentinaStephen Shaw NEGOTIATION
Isabel E OldroydSpainStephen Shaw NEGOTIATION
Ivar C DoeCanadaXuxue Feng PROPOSAL
Tony M BologniaFranceAmy Elsner QUALIFIED
Emily H VocelkaFranceAmy Elsner PROPOSAL
Emily H OldroydGermanyXuxue Feng UNQUALIFIED
Antonio W NestleBrazilIvan Magalhaes RENEWAL
Ivar Z KolmetzFranceOnyama Limba NEW
Chavez U CampainBrazilIoni Bowcher UNQUALIFIED
Leja O WhobreyItalyIvan Magalhaes UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Kadeem A WhobreyRussiaElwin Sharvill RENEWAL
Greenwood O RulapaughCanadaIoni Bowcher NEGOTIATION
Maria L AlbaresSpainAmy Elsner RENEWAL
Silvio I CaldareraBrazilIoni Bowcher PROPOSAL
Juan N VenereSpainXuxue Feng NEGOTIATION
Isabel O AlbaresArgentinaAmy Elsner NEW
Sinclair D AlbaresIndiaIoni Bowcher NEGOTIATION
Salvatore Q GlickUnited KingdomOnyama Limba PROPOSAL
Jennifer R ButtUnited KingdomElwin Sharvill NEGOTIATION
Leon O SlusarskiIndiaOnyama Limba NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Misaki N SergiAustralia2025-06-09Feltz Printing Service NEW94Elwin Sharvill
1001Murillo B PoquetteCanada2025-06-11Truhlar And Truhlar Attys NEGOTIATION83Xuxue Feng
1002Mujtaba Q NickaIndia2025-06-09Morlong Associates QUALIFIED87Ivan Magalhaes
1003Darci M RimJapan2025-06-04Dorl, James J Esq RENEWAL70Bernardo Dominic
1004Cody I PerinItaly2025-06-03Chapman, Ross E Esq NEW42Ivan Magalhaes
1005Munro Z FlosiItaly2025-06-08Chapman, Ross E Esq RENEWAL43Stephen Shaw
1006Stacey W AmigonRussia2025-06-05King, Christopher A Esq UNQUALIFIED67Asiya Javayant
1007Jones U AlbaresFrance2025-05-19Rangoni Of Florence UNQUALIFIED0Xuxue Feng
1008Ricardo O PaprockiUnited Kingdom2025-05-30Rousseaux, Michael Esq PROPOSAL56Amy Elsner
1009Silvio I FigeroaAustralia2025-05-23Morlong Associates PROPOSAL50Elwin Sharvill
1010Nicolas Y NestleArgentina2025-05-29Truhlar And Truhlar Attys NEGOTIATION17Elwin Sharvill
1011Julie N BriddickRussia2025-06-04Feiner Bros RENEWAL76Ivan Magalhaes
1012Cody R BologniaArgentina2025-05-19Printing Dimensions UNQUALIFIED39Amy Elsner
1013Leon Z VenereRussia2025-06-10King, Christopher A Esq QUALIFIED29Anna Fali
1014Salvatore Z PaprockiSpain2025-05-28Truhlar And Truhlar Attys PROPOSAL92Anna Fali
1015Jones Y SergiFrance2025-05-21Buckley Miller Wright NEGOTIATION7Bernardo Dominic
1016Octavia W ButtBrazil2025-06-05Rangoni Of Florence PROPOSAL50Anna Fali
1017Francesco H SchemmerUnited Kingdom2025-05-18Printing Dimensions NEW51Ivan Magalhaes
1018Deepesh T DarakjyArgentina2025-05-31King, Christopher A Esq NEW42Stephen Shaw
1019Misaki X FerenczSpain2025-05-28Printing Dimensions UNQUALIFIED76Amy Elsner
1020Emily X DilliardCanada2025-05-29Morlong Associates PROPOSAL24Ioni Bowcher
1021Ivar D ChuiBrazil2025-05-25Morlong Associates RENEWAL79Anna Fali
1022Juan V RulapaughUnited Kingdom2025-05-23Feiner Bros UNQUALIFIED89Ioni Bowcher
1023Silvio V ButtUnited Kingdom2025-05-18Truhlar And Truhlar Attys NEW79Xuxue Feng
1024Mayumi S NestleSpain2025-05-23Benton, John B Jr PROPOSAL10Stephen Shaw
1025Maisha L ShinkoJapan2025-06-04Chemel, James L Cpa NEGOTIATION5Ioni Bowcher
1026Maria N NickaUnited Kingdom2025-05-20Rangoni Of Florence UNQUALIFIED23Stephen Shaw
1027Misaki Q FerenczAustralia2025-05-30Buckley Miller Wright NEW59Amy Elsner
1028Maisha F WaycottBrazil2025-06-02Feiner Bros NEW75Anna Fali
1029Rodrigues V DoeCanada2025-05-19Chapman, Ross E Esq UNQUALIFIED29Xuxue Feng
1030Mayumi W MaletIndia2025-06-10Feltz Printing Service QUALIFIED59Bernardo Dominic
1031Jennifer Z RulapaughJapan2025-06-06Chanay, Jeffrey A Esq QUALIFIED54Onyama Limba
1032Antonio R NestleFrance2025-05-23Rangoni Of Florence NEGOTIATION10Ivan Magalhaes
1033Ashley D StensethIndia2025-06-05Chanay, Jeffrey A Esq NEGOTIATION88Amy Elsner
1034Aruna S GauchoSpain2025-05-22Rousseaux, Michael Esq NEGOTIATION80Bernardo Dominic
1035Octavia N FigeroaUnited Kingdom2025-06-11Chemel, James L Cpa QUALIFIED48Stephen Shaw
1036Morrow T KolmetzFrance2025-06-04Chanay, Jeffrey A Esq QUALIFIED24Stephen Shaw
1037Smith D MaletRussia2025-06-12Dorl, James J Esq NEW37Amy Elsner
1038Munro Z GlickUnited Kingdom2025-05-23Morlong Associates NEW17Bernardo Dominic
1039Francesco M MorascaSpain2025-06-15King, Christopher A Esq RENEWAL29Bernardo Dominic
1040Maisha Y ShinkoCanada2025-05-30Rousseaux, Michael Esq UNQUALIFIED41Ioni Bowcher
1041David B OldroydArgentina2025-05-27Chanay, Jeffrey A Esq QUALIFIED52Stephen Shaw
1042Morrow Y WaycottFrance2025-05-26Morlong Associates UNQUALIFIED48Amy Elsner
1043Deepesh C KolmetzJapan2025-05-27Rousseaux, Michael Esq RENEWAL91Anna Fali
1044Arvin Q PerinFrance2025-05-26Rousseaux, Michael Esq NEW35Elwin Sharvill
1045Salvatore F StockhamBrazil2025-06-11Chapman, Ross E Esq NEW21Amy Elsner
1046Ashley M CaldareraIndia2025-05-27Chapman, Ross E Esq QUALIFIED91Amy Elsner
1047Maisha B VocelkaFrance2025-05-25Benton, John B Jr RENEWAL10Onyama Limba
1048Wickens W DilliardUnited Kingdom2025-06-14Truhlar And Truhlar Attys UNQUALIFIED41Amy Elsner
1049Juan K VenereAustralia2025-05-29Printing Dimensions NEW15Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Mujtaba V SergiGermanyElwin Sharvill UNQUALIFIED
Mujtaba R PoquetteJapanAmy Elsner UNQUALIFIED
Chavez N MacleadItalyElwin Sharvill NEGOTIATION
Silvio D RutaSpainIoni Bowcher RENEWAL
Izzy N DarakjySpainElwin Sharvill NEGOTIATION
James E RutaRussiaXuxue Feng NEGOTIATION
Sinclair R VocelkaSpainAnna Fali PROPOSAL
Ivar U GillianBrazilXuxue Feng QUALIFIED
Rodrigues S GlickJapanStephen Shaw NEW
Munro J IturbideJapanElwin Sharvill UNQUALIFIED
Ashley G GarufiIndiaOnyama Limba NEGOTIATION
Aruna D GlickFranceOnyama Limba NEW
Costa M ShinkoCanadaElwin Sharvill QUALIFIED
Mayumi U FigeroaAustraliaElwin Sharvill NEGOTIATION
Ricardo Z NickaUnited KingdomOnyama Limba NEW
Isabel G ChuiRussiaAnna Fali UNQUALIFIED
Mayumi Y CaudyCanadaElwin Sharvill UNQUALIFIED
Julie Q NickaItalyAsiya Javayant NEW
Juan Q FigeroaGermanyElwin Sharvill PROPOSAL
Octavia V ButtAustraliaIvan Magalhaes QUALIFIED
Juan H TollnerBrazilOnyama Limba RENEWAL
Stacey U SergiCanadaXuxue Feng NEW
Juan C RoysterFranceElwin Sharvill RENEWAL
Leon H RutaCanadaOnyama Limba PROPOSAL
Juan L CaldareraSpainXuxue Feng NEGOTIATION
Deepesh I MacleadSpainXuxue Feng PROPOSAL
Jennifer C SaylorsItalyAnna Fali QUALIFIED
Aditya D FerenczUnited KingdomXuxue Feng NEW
Arvin R AmigonRussiaBernardo Dominic NEW
Silvio Q DarakjyRussiaElwin Sharvill QUALIFIED
Mujtaba C GillianFranceBernardo Dominic NEGOTIATION
Murillo I RoysterCanadaOnyama Limba QUALIFIED
Darci E InouyeRussiaStephen Shaw NEGOTIATION
Nicolas N DoeIndiaAsiya Javayant NEW
Tony B OldroydArgentinaOnyama Limba NEW
Costa E MarrierRussiaStephen Shaw NEGOTIATION
Francesco N MaletUnited KingdomBernardo Dominic RENEWAL
Sinclair T NestleArgentinaIvan Magalhaes NEGOTIATION
Tony C MarrierJapanBernardo Dominic NEGOTIATION
Aditya J NestleJapanStephen Shaw UNQUALIFIED
Greenwood X ChuiFranceOnyama Limba UNQUALIFIED
Octavia L DarakjySpainIoni Bowcher NEGOTIATION
Chavez E DoeJapanXuxue Feng QUALIFIED
Octavia T ChuiIndiaAmy Elsner RENEWAL
Octavia D MaletJapanIvan Magalhaes RENEWAL
Morrow P PoquetteJapanAmy Elsner PROPOSAL
Tony F RutaIndiaAnna Fali UNQUALIFIED
Julie Z ButtAustraliaXuxue Feng PROPOSAL
Sinclair V AmigonSpainIvan Magalhaes RENEWAL
Tony F BowleyAustraliaIoni Bowcher RENEWAL
Frozen Columns
Name
Claire D Bowley
Stacey S Kusko
Aditya O Venere
James L Waycott
Tony N Saylors
Mayumi E Rim
Munro G Figeroa
Chavez R Ruta
Kaitlin N Ferencz
Kaitlin G Slusarski
Salvatore B Perin
Darci N Bolognia
Nicolas C Flosi
Emily O Nicka
Kadeem Y Amigon
Tony C Tollner
Morrow X Tollner
Emily N Royster
Emily C Nicka
Deepesh I Caldarera
David I Gillian
Jeanfrancois R Whobrey
Alejandro D Gillian
Arvin B Oldroyd
Alejandro G Venere
Leon C Slusarski
Sinclair V Poquette
Jennifer W Sergi
Deepesh L Royster
Mayumi N Darakjy
Jefferson E Bolognia
Deepesh L Vocelka
Izzy B Sergi
Aruna R Kolmetz
Ivar M Tollner
David W Kusko
Johnson M Waycott
Octavia A Rim
Aika Y Garufi
Mayumi X Figeroa
Antonio P Bolognia
Claire K Royster
James Y Bolognia
Clifford M Rim
Jones Z Slusarski
Jones F Butt
Kaitlin M Nestle
Jefferson R Bowley
Clifford L Rulapaugh
Leja B Kolmetz
IdCountryDate
1000Germany2025-05-23
1001Russia2025-05-20
1002Japan2025-06-12
1003Italy2025-05-27
1004France2025-06-01
1005Italy2025-05-27
1006Russia2025-05-22
1007United Kingdom2025-06-16
1008Japan2025-05-18
1009Argentina2025-06-10
1010Italy2025-05-18
1011United Kingdom2025-06-14
1012Japan2025-05-20
1013Spain2025-05-25
1014Argentina2025-06-07
1015Brazil2025-05-20
1016Italy2025-05-29
1017France2025-06-07
1018Spain2025-06-11
1019United Kingdom2025-06-04
1020France2025-05-29
1021Argentina2025-05-21
1022Argentina2025-05-28
1023Japan2025-05-26
1024Japan2025-06-06
1025Argentina2025-06-04
1026Japan2025-06-10
1027Spain2025-05-27
1028France2025-06-02
1029Germany2025-06-04
1030Australia2025-05-19
1031Germany2025-06-13
1032Japan2025-05-28
1033Russia2025-05-23
1034Spain2025-06-08
1035Australia2025-05-21
1036Brazil2025-05-20
1037Germany2025-05-21
1038Spain2025-06-11
1039Germany2025-06-01
1040Canada2025-06-04
1041Brazil2025-06-11
1042India2025-05-19
1043Germany2025-06-14
1044India2025-05-24
1045Russia2025-05-31
1046Russia2025-05-26
1047United Kingdom2025-06-09
1048Italy2025-05-22
1049Russia2025-06-09

On-Demand Data

NameIdCountryDate
Kadeem R Sergi1000Russia2025-05-22
Costa T Saylors1001France2025-05-30
Silvio W Chui1002India2025-06-15
Faith P Foller1003India2025-05-31
Adams W Rulapaugh1004Japan2025-06-01
Wickens P Doe1005United Kingdom2025-06-09
Cody J Saylors1006Canada2025-06-16
Faith X Iturbide1007Russia2025-06-10
Darci O Garufi1008Argentina2025-06-05
Murillo O Vocelka1009Japan2025-05-18
Mujtaba Q Flosi1010Brazil2025-06-05
Nicolas G Bolognia1011Canada2025-06-02
Ricardo O Slusarski1012Germany2025-05-29
Adams J Maclead1013Argentina2025-06-13
Johnson R Caldarera1014Canada2025-06-09
Smith R Vocelka1015Argentina2025-05-24
James J Caldarera1016Argentina2025-06-15
Faith Y Slusarski1017Russia2025-06-10
Cody A Malet1018France2025-05-25
Julie I Ruta1019Spain2025-05-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Antonio R DarakjyBrazilAsiya Javayant PROPOSAL
Faith M VocelkaRussiaOnyama Limba QUALIFIED
Kadeem Q MacleadJapanBernardo Dominic NEW
Tony W ShinkoBrazilIoni Bowcher NEW
Clifford V GarufiBrazilIvan Magalhaes NEGOTIATION
Alejandro H FlosiItalyOnyama Limba RENEWAL
Julie P BowleyItalyStephen Shaw RENEWAL
Silvio X DoeIndiaStephen Shaw PROPOSAL
Maisha R VocelkaSpainElwin Sharvill PROPOSAL
Leon P BologniaGermanyIoni Bowcher QUALIFIED
Jeanfrancois N PoquetteAustraliaStephen Shaw UNQUALIFIED
Alejandro L ButtJapanXuxue Feng NEW
Jefferson K CaldareraRussiaStephen Shaw NEGOTIATION
Cody M MorascaItalyStephen Shaw QUALIFIED
Chavez B FerenczJapanAmy Elsner RENEWAL
Stacey S RutaRussiaBernardo Dominic RENEWAL
Deepesh A VocelkaAustraliaStephen Shaw NEGOTIATION
Aruna K MarrierFranceElwin Sharvill RENEWAL
Stacey P BowleyIndiaAmy Elsner RENEWAL
Maria G VocelkaIndiaBernardo Dominic NEW
Arvin R SaylorsSpainStephen Shaw PROPOSAL
Wickens M PaprockiIndiaBernardo Dominic PROPOSAL
Kaitlin I SlusarskiRussiaOnyama Limba NEGOTIATION
Morrow V WhobreyArgentinaIvan Magalhaes NEGOTIATION
Kaitlin P TollnerJapanElwin Sharvill RENEWAL
Jones E FlosiBrazilStephen Shaw NEW
Maisha K CaudySpainIvan Magalhaes QUALIFIED
Ricardo N NestleFranceIvan Magalhaes UNQUALIFIED
Misaki M OldroydAustraliaOnyama Limba QUALIFIED
Clifford N BologniaAustraliaAmy Elsner NEGOTIATION
Mujtaba G MarrierUnited KingdomBernardo Dominic NEW
Izzy I GarufiBrazilIvan Magalhaes NEW
Leja I PoquetteGermanyAsiya Javayant NEW
Greenwood C ButtCanadaIoni Bowcher NEW
Kadeem R AlbaresAustraliaIvan Magalhaes RENEWAL
Nicolas I StockhamGermanyOnyama Limba PROPOSAL
Sinclair R ButtJapanIvan Magalhaes PROPOSAL
Munro Z KolmetzCanadaIoni Bowcher NEGOTIATION
Juan O GauchoSpainAsiya Javayant UNQUALIFIED
Leja U DarakjyGermanyAsiya Javayant QUALIFIED

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