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
Arvin B FollerAustraliaBernardo Dominic QUALIFIED
Leja K SergiBrazilXuxue Feng NEGOTIATION
Adams P ButtItalyIvan Magalhaes PROPOSAL
Silvio R IturbideAustraliaIoni Bowcher QUALIFIED
Arvin M GlickSpainOnyama Limba UNQUALIFIED
Nicolas V RoysterAustraliaBernardo Dominic QUALIFIED
Ivar D KuskoAustraliaStephen Shaw PROPOSAL
Leon G AlbaresRussiaAnna Fali QUALIFIED
Maisha L KuskoGermanyStephen Shaw UNQUALIFIED
Rodrigues A GauchoUnited KingdomOnyama Limba NEW
Leja G PerinSpainStephen Shaw UNQUALIFIED
Aika M FigeroaGermanyAnna Fali UNQUALIFIED
Greenwood Q SlusarskiRussiaOnyama Limba PROPOSAL
Isabel C NestleItalyBernardo Dominic PROPOSAL
David T KolmetzRussiaStephen Shaw NEGOTIATION
Jones Y SlusarskiCanadaAmy Elsner NEGOTIATION
Claire I BowleyIndiaStephen Shaw PROPOSAL
Emily B InouyeAustraliaElwin Sharvill RENEWAL
Mujtaba N GauchoIndiaIvan Magalhaes NEW
Salvatore S RimIndiaOnyama Limba NEW
Sinclair Q AmigonItalyXuxue Feng RENEWAL
Jefferson Y InouyeUnited KingdomXuxue Feng PROPOSAL
Jones H WaycottCanadaXuxue Feng UNQUALIFIED
Smith C RulapaughArgentinaOnyama Limba UNQUALIFIED
Darci K NestleFranceIoni Bowcher PROPOSAL
Aruna C BowleyIndiaXuxue Feng NEGOTIATION
Julie L PaprockiBrazilOnyama Limba PROPOSAL
Arvin M SlusarskiRussiaStephen Shaw RENEWAL
Greenwood W VocelkaJapanAmy Elsner RENEWAL
Aruna Y GauchoArgentinaXuxue Feng NEW
Greenwood J PaprockiJapanOnyama Limba PROPOSAL
Darci C VenereIndiaAsiya Javayant NEW
Darci J BologniaArgentinaAnna Fali RENEWAL
Isabel U OldroydUnited KingdomAnna Fali UNQUALIFIED
Mayumi K StensethSpainXuxue Feng RENEWAL
Murillo P IturbideCanadaAsiya Javayant PROPOSAL
Octavia D StockhamRussiaAnna Fali UNQUALIFIED
Salvatore B FerenczFranceIoni Bowcher NEW
Nicolas X RutaJapanAsiya Javayant RENEWAL
Rodrigues X PoquetteArgentinaAmy Elsner NEGOTIATION
Kaitlin G OstroskyCanadaStephen Shaw UNQUALIFIED
Nicolas H MaletJapanIoni Bowcher UNQUALIFIED
Claire L DoeJapanXuxue Feng NEGOTIATION
Munro S BowleyFranceIoni Bowcher UNQUALIFIED
Deepesh G MaletIndiaXuxue Feng QUALIFIED
Alejandro R KolmetzIndiaElwin Sharvill RENEWAL
Cody X RoysterItalyIvan Magalhaes NEGOTIATION
Emily F FollerIndiaAsiya Javayant NEW
Aika D GarufiUnited KingdomIoni Bowcher PROPOSAL
Misaki Q SchemmerGermanyIvan Magalhaes PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Silvio L AlbaresJapanIvan Magalhaes NEW
Nicolas F VenereGermanyStephen Shaw UNQUALIFIED
Greenwood Z ShinkoJapanStephen Shaw UNQUALIFIED
Aditya S DarakjyCanadaAmy Elsner NEW
David N SlusarskiGermanyAsiya Javayant NEW
Nicolas E ShinkoGermanyElwin Sharvill NEW
Maria R BologniaAustraliaElwin Sharvill NEGOTIATION
Maisha J CaldareraAustraliaAnna Fali PROPOSAL
Stacey F OstroskyUnited KingdomAnna Fali RENEWAL
Aruna Q MaletGermanyStephen Shaw NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Johnson L ShinkoFrance2025-04-09Feiner Bros NEW81Stephen Shaw
1001Tony U WaycottAustralia2025-04-20Chapman, Ross E Esq NEW31Onyama Limba
1002Jones A ChuiBrazil2025-04-23Commercial Press NEGOTIATION6Ioni Bowcher
1003Deepesh R NestleBrazil2025-04-22Rousseaux, Michael Esq RENEWAL24Bernardo Dominic
1004Morrow N MarrierSpain2025-04-08Chapman, Ross E Esq UNQUALIFIED52Bernardo Dominic
1005Munro Q KolmetzIndia2025-03-31Dorl, James J Esq QUALIFIED79Elwin Sharvill
1006Tony P WaycottRussia2025-04-20Printing Dimensions UNQUALIFIED8Bernardo Dominic
1007James K KolmetzItaly2025-03-31Morlong Associates UNQUALIFIED32Xuxue Feng
1008Clifford B CaldareraGermany2025-04-21Rousseaux, Michael Esq PROPOSAL32Amy Elsner
1009Mayumi G DoeBrazil2025-04-22Truhlar And Truhlar Attys RENEWAL36Elwin Sharvill
1010Ivar P VenereSpain2025-04-05Chemel, James L Cpa UNQUALIFIED5Xuxue Feng
1011Kadeem U FigeroaItaly2025-04-23Feiner Bros NEGOTIATION9Amy Elsner
1012Mujtaba R ButtIndia2025-04-14King, Christopher A Esq PROPOSAL84Bernardo Dominic
1013Mayumi Q TollnerBrazil2025-04-08Commercial Press RENEWAL32Xuxue Feng
1014Deepesh G PerinJapan2025-04-05Commercial Press QUALIFIED16Xuxue Feng
1015Chavez E AlbaresSpain2025-04-11Chemel, James L Cpa RENEWAL97Asiya Javayant
1016Faith Y MacleadIndia2025-04-26Truhlar And Truhlar Attys PROPOSAL65Stephen Shaw
1017Morrow M RutaSpain2025-04-03Truhlar And Truhlar Attys QUALIFIED90Xuxue Feng
1018Leja D VocelkaArgentina2025-04-28Rousseaux, Michael Esq QUALIFIED90Ivan Magalhaes
1019Clifford M SergiArgentina2025-04-13Feiner Bros QUALIFIED52Ivan Magalhaes
1020Faith M VocelkaAustralia2025-03-31Chemel, James L Cpa RENEWAL20Amy Elsner
1021Leon U OldroydAustralia2025-03-31Rangoni Of Florence UNQUALIFIED16Anna Fali
1022Aditya Y MorascaIndia2025-04-09Dorl, James J Esq RENEWAL19Elwin Sharvill
1023Jennifer H BowleyIndia2025-04-09Commercial Press PROPOSAL73Amy Elsner
1024Sinclair T RimBrazil2025-04-07Morlong Associates QUALIFIED62Stephen Shaw
1025Costa I GillianFrance2025-04-11Chemel, James L Cpa NEW6Asiya Javayant
1026Misaki B StockhamBrazil2025-04-10Rangoni Of Florence QUALIFIED93Anna Fali
1027Francesco H FlosiBrazil2025-04-10Chanay, Jeffrey A Esq UNQUALIFIED79Bernardo Dominic
1028Mayumi M StensethFrance2025-03-31Chapman, Ross E Esq PROPOSAL98Asiya Javayant
1029Faith X VocelkaFrance2025-04-05Rousseaux, Michael Esq QUALIFIED11Anna Fali
1030Stacey Z TollnerGermany2025-04-25Chemel, James L Cpa QUALIFIED51Elwin Sharvill
1031Kaitlin D RimJapan2025-04-11Benton, John B Jr QUALIFIED33Bernardo Dominic
1032Ivar S IturbideUnited Kingdom2025-04-02Feltz Printing Service UNQUALIFIED83Onyama Limba
1033Jefferson R FlosiArgentina2025-04-08Morlong Associates NEGOTIATION21Stephen Shaw
1034Wickens G FigeroaBrazil2025-04-16Rangoni Of Florence QUALIFIED28Bernardo Dominic
1035Cody F GlickSpain2025-04-07Feiner Bros NEW71Xuxue Feng
1036Tony D GlickArgentina2025-04-09King, Christopher A Esq QUALIFIED82Ivan Magalhaes
1037Morrow H ButtJapan2025-04-24Buckley Miller Wright QUALIFIED48Amy Elsner
1038Isabel V WieserArgentina2025-04-02Rangoni Of Florence NEGOTIATION1Ivan Magalhaes
1039Sinclair B SchemmerFrance2025-04-16Chemel, James L Cpa PROPOSAL28Bernardo Dominic
1040Deepesh C MorascaIndia2025-04-10Buckley Miller Wright NEW38Amy Elsner
1041James B TollnerUnited Kingdom2025-04-10Rangoni Of Florence PROPOSAL10Xuxue Feng
1042Alejandro B OstroskyJapan2025-04-07Chapman, Ross E Esq QUALIFIED13Bernardo Dominic
1043Jeanfrancois T KolmetzUnited Kingdom2025-04-23Commercial Press RENEWAL21Elwin Sharvill
1044Claire B MaletGermany2025-04-14Rangoni Of Florence QUALIFIED67Ivan Magalhaes
1045Faith F PerinFrance2025-04-26King, Christopher A Esq NEGOTIATION73Elwin Sharvill
1046James A MaletGermany2025-04-12Chanay, Jeffrey A Esq NEW50Anna Fali
1047Aditya O CampainAustralia2025-04-02Chanay, Jeffrey A Esq RENEWAL31Onyama Limba
1048Costa H GauchoUnited Kingdom2025-04-19Chemel, James L Cpa QUALIFIED63Ivan Magalhaes
1049Francesco G AlbaresRussia2025-04-09Dorl, James J Esq QUALIFIED89Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Leja B WieserBrazilAmy Elsner NEGOTIATION
Mayumi S MaletIndiaBernardo Dominic QUALIFIED
Silvio O WaycottCanadaAmy Elsner NEW
Morrow R WaycottCanadaXuxue Feng NEGOTIATION
Johnson U MarrierSpainAmy Elsner UNQUALIFIED
Stacey G PaprockiAustraliaAnna Fali QUALIFIED
Kaitlin P BowleyJapanXuxue Feng QUALIFIED
Francesco J WaycottJapanElwin Sharvill NEW
Octavia B ShinkoJapanStephen Shaw QUALIFIED
Antonio E MorascaGermanyIoni Bowcher PROPOSAL
Ivar X AmigonItalyAnna Fali NEGOTIATION
Deepesh V VocelkaUnited KingdomOnyama Limba QUALIFIED
Murillo Q PaprockiIndiaIvan Magalhaes PROPOSAL
Aruna J KolmetzRussiaElwin Sharvill NEGOTIATION
Salvatore Q MaletSpainBernardo Dominic NEGOTIATION
Silvio A FlosiCanadaIvan Magalhaes NEW
James L AlbaresRussiaAnna Fali NEW
Maria H TollnerBrazilOnyama Limba QUALIFIED
Alejandro N MaletSpainElwin Sharvill NEW
Munro B StockhamRussiaIoni Bowcher RENEWAL
Morrow H SergiSpainElwin Sharvill QUALIFIED
Arvin S CaldareraItalyBernardo Dominic NEW
Jennifer I SchemmerItalyOnyama Limba UNQUALIFIED
Ricardo B VocelkaIndiaElwin Sharvill RENEWAL
Chavez N FigeroaRussiaIvan Magalhaes NEGOTIATION
Salvatore W CampainSpainOnyama Limba QUALIFIED
Misaki A DoeArgentinaIoni Bowcher RENEWAL
Silvio G PoquetteBrazilAnna Fali RENEWAL
Mayumi W FerenczIndiaAsiya Javayant NEW
Morrow Q StensethSpainIoni Bowcher UNQUALIFIED
Julie K StockhamJapanAsiya Javayant NEGOTIATION
Smith G FollerJapanElwin Sharvill NEW
Wickens C OldroydJapanAmy Elsner NEGOTIATION
Cody B InouyeArgentinaAsiya Javayant PROPOSAL
Maria N FollerSpainBernardo Dominic NEW
Murillo G OldroydIndiaAnna Fali QUALIFIED
David Q MorascaRussiaXuxue Feng PROPOSAL
Maisha H DarakjyItalyElwin Sharvill NEGOTIATION
Misaki O NestleIndiaElwin Sharvill NEW
Darci N PerinIndiaOnyama Limba NEGOTIATION
Ivar T IturbideGermanyAmy Elsner NEW
Jefferson T StensethGermanyIvan Magalhaes UNQUALIFIED
Rodrigues Y FerenczGermanyStephen Shaw PROPOSAL
Maisha M DoeArgentinaAsiya Javayant QUALIFIED
Mujtaba O GlickItalyOnyama Limba RENEWAL
Julie Z OldroydBrazilAsiya Javayant QUALIFIED
Darci E StockhamRussiaXuxue Feng UNQUALIFIED
Maisha N AlbaresArgentinaStephen Shaw RENEWAL
Sinclair Z DilliardSpainAsiya Javayant NEW
Mayumi K PoquetteBrazilOnyama Limba RENEWAL
Frozen Columns
Name
Murillo O Schemmer
Alejandro T Foller
Adams R Rim
David G Rulapaugh
Ashley O Perin
Juan Q Rim
Ricardo P Wieser
Mayumi V Briddick
Isabel E Glick
Emily M Whobrey
Aruna Y Rim
Leon K Wieser
Claire R Garufi
Misaki X Tollner
Aika S Flosi
Izzy S Malet
Jennifer Y Caudy
Murillo N Maclead
Salvatore I Rulapaugh
Kadeem B Doe
Mujtaba C Kusko
James N Oldroyd
David O Malet
Sinclair O Gaucho
Rodrigues H Ferencz
Mujtaba L Inouye
Aditya L Gaucho
Izzy B Paprocki
Darci S Albares
Clifford A Nestle
Jones D Bolognia
Jeanfrancois M Morasca
Isabel Y Chui
Costa J Paprocki
Salvatore U Darakjy
Ricardo R Figeroa
Isabel E Glick
James G Briddick
James U Schemmer
Arvin Q Bowley
Greenwood T Amigon
Ivar Q Venere
Ashley X Bowley
Murillo E Rim
Darci U Flosi
Kadeem H Nicka
Silvio A Malet
Aditya M Chui
Leon Q Glick
Julie L Kusko
IdCountryDate
1000Argentina2025-04-10
1001Brazil2025-04-16
1002India2025-04-16
1003France2025-04-28
1004Spain2025-04-16
1005Russia2025-04-09
1006Russia2025-04-25
1007Spain2025-04-22
1008United Kingdom2025-04-06
1009Spain2025-04-27
1010United Kingdom2025-03-31
1011Japan2025-04-22
1012Russia2025-04-14
1013Spain2025-04-08
1014United Kingdom2025-04-18
1015France2025-04-04
1016India2025-04-04
1017France2025-04-27
1018Australia2025-04-27
1019Australia2025-04-01
1020Argentina2025-04-08
1021Brazil2025-04-29
1022France2025-04-07
1023Argentina2025-04-18
1024Russia2025-04-13
1025Australia2025-04-25
1026Italy2025-04-06
1027France2025-04-06
1028Spain2025-04-22
1029Spain2025-04-07
1030United Kingdom2025-04-11
1031Spain2025-04-10
1032France2025-04-08
1033Germany2025-04-08
1034Italy2025-04-20
1035Argentina2025-04-29
1036Brazil2025-04-12
1037Australia2025-04-26
1038Canada2025-04-13
1039France2025-04-11
1040Canada2025-04-05
1041Brazil2025-04-12
1042Australia2025-04-03
1043Australia2025-04-03
1044Japan2025-03-31
1045France2025-04-15
1046Italy2025-04-26
1047Australia2025-04-14
1048Japan2025-04-09
1049France2025-04-27

On-Demand Data

NameIdCountryDate
Izzy Q Dilliard1000Canada2025-04-08
Jones C Briddick1001Canada2025-04-13
Ricardo R Ruta1002United Kingdom2025-04-08
Jefferson F Iturbide1003United Kingdom2025-04-04
Aditya B Ferencz1004Japan2025-04-04
Emily T Glick1005Brazil2025-04-11
Ashley D Gillian1006Italy2025-04-28
Aditya O Ferencz1007France2025-04-25
Stacey A Dilliard1008Canada2025-04-15
Izzy A Schemmer1009Russia2025-04-23
Maria V Poquette1010Brazil2025-04-10
Rodrigues M Inouye1011Germany2025-04-01
Mujtaba G Morasca1012India2025-04-29
Deepesh J Paprocki1013United Kingdom2025-04-19
Adams F Tollner1014India2025-04-01
Maria R Maclead1015Canada2025-04-21
Isabel T Sergi1016India2025-04-21
Tony Y Paprocki1017Brazil2025-04-10
Greenwood A Darakjy1018Italy2025-04-17
Costa B Slusarski1019Spain2025-04-27
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
James A StensethSpainIoni Bowcher NEGOTIATION
Sinclair C GarufiArgentinaBernardo Dominic PROPOSAL
Antonio T SaylorsJapanOnyama Limba NEW
Octavia T WhobreyRussiaStephen Shaw NEGOTIATION
Smith N VocelkaIndiaBernardo Dominic UNQUALIFIED
Clifford X GillianItalyAnna Fali RENEWAL
Tony P StensethUnited KingdomElwin Sharvill QUALIFIED
Mayumi U NickaSpainElwin Sharvill UNQUALIFIED
Deepesh Q RulapaughAustraliaStephen Shaw RENEWAL
Costa T KolmetzArgentinaIvan Magalhaes NEGOTIATION
Octavia D OldroydJapanIvan Magalhaes RENEWAL
Jones U DilliardJapanIoni Bowcher RENEWAL
Leja N DoeIndiaAmy Elsner QUALIFIED
Morrow O GarufiArgentinaStephen Shaw NEGOTIATION
Mayumi O CampainCanadaIvan Magalhaes NEGOTIATION
Aruna O FigeroaBrazilAmy Elsner NEW
Ashley U NestleIndiaAsiya Javayant RENEWAL
Isabel S FerenczAustraliaStephen Shaw RENEWAL
Ashley Y CaldareraJapanOnyama Limba QUALIFIED
Izzy Y ShinkoIndiaStephen Shaw QUALIFIED
Rodrigues D KuskoArgentinaAsiya Javayant NEW
Octavia H GillianUnited KingdomAnna Fali RENEWAL
Munro X ShinkoRussiaElwin Sharvill NEW
Ashley V ChuiFranceXuxue Feng NEW
Octavia O ShinkoIndiaBernardo Dominic PROPOSAL
Adams Y WaycottBrazilIoni Bowcher NEW
Adams H ButtGermanyXuxue Feng QUALIFIED
Salvatore Y RutaUnited KingdomElwin Sharvill NEGOTIATION
Misaki Y GillianSpainStephen Shaw PROPOSAL
Deepesh S CaudyItalyIvan Magalhaes QUALIFIED
Stacey G MacleadGermanyAmy Elsner NEGOTIATION
Sinclair V NickaItalyIvan Magalhaes UNQUALIFIED
Costa O NickaSpainAmy Elsner NEGOTIATION
Leon Q AmigonAustraliaIvan Magalhaes QUALIFIED
Munro F DoeJapanOnyama Limba PROPOSAL
Kadeem Q TollnerUnited KingdomStephen Shaw UNQUALIFIED
Greenwood P OldroydSpainStephen Shaw QUALIFIED
Alejandro B RimJapanBernardo Dominic NEW
David M KuskoIndiaIvan Magalhaes NEGOTIATION
Leja P NickaIndiaStephen Shaw UNQUALIFIED

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