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
Jefferson W MaletJapanXuxue Feng NEGOTIATION
James X PerinJapanAsiya Javayant QUALIFIED
Johnson N MaletRussiaBernardo Dominic PROPOSAL
Leja H MacleadRussiaIoni Bowcher QUALIFIED
Salvatore Y NestleAustraliaAmy Elsner QUALIFIED
Aditya T StensethBrazilAsiya Javayant NEGOTIATION
Adams F MacleadJapanStephen Shaw UNQUALIFIED
Arvin W BriddickUnited KingdomAsiya Javayant PROPOSAL
Juan M RoysterGermanyOnyama Limba QUALIFIED
Rodrigues A MacleadAustraliaStephen Shaw UNQUALIFIED
Jefferson W ButtJapanStephen Shaw QUALIFIED
Leja Z BowleyUnited KingdomStephen Shaw PROPOSAL
Antonio Q ChuiGermanyBernardo Dominic PROPOSAL
Costa A ChuiCanadaStephen Shaw NEW
Emily S NickaSpainIoni Bowcher UNQUALIFIED
Emily K KuskoGermanyAmy Elsner NEGOTIATION
Aditya H TollnerAustraliaOnyama Limba UNQUALIFIED
Ashley A BologniaJapanAmy Elsner PROPOSAL
Kaitlin D BriddickUnited KingdomIvan Magalhaes PROPOSAL
Greenwood N OstroskyCanadaAmy Elsner QUALIFIED
Jefferson N IturbideSpainOnyama Limba NEW
Leon O InouyeSpainOnyama Limba NEW
Jones T NickaJapanElwin Sharvill UNQUALIFIED
Claire M FlosiItalyIvan Magalhaes QUALIFIED
Cody I RutaArgentinaOnyama Limba NEGOTIATION
David C SchemmerFranceAmy Elsner PROPOSAL
Ashley N MarrierCanadaAsiya Javayant UNQUALIFIED
Claire Z GillianRussiaAnna Fali UNQUALIFIED
Rodrigues V PoquetteFranceAsiya Javayant NEGOTIATION
Misaki Z GlickIndiaAsiya Javayant PROPOSAL
Chavez I StockhamSpainElwin Sharvill UNQUALIFIED
Aika G RimUnited KingdomStephen Shaw NEGOTIATION
Mayumi S PoquetteBrazilXuxue Feng RENEWAL
Octavia T InouyeGermanyStephen Shaw QUALIFIED
Kadeem Q FlosiBrazilAmy Elsner NEW
Mayumi Y FigeroaCanadaElwin Sharvill NEGOTIATION
Jones P BologniaCanadaElwin Sharvill RENEWAL
Leon J GillianBrazilAsiya Javayant PROPOSAL
Juan E FigeroaItalyAnna Fali NEGOTIATION
Adams N GarufiBrazilIvan Magalhaes NEGOTIATION
Smith F SlusarskiUnited KingdomStephen Shaw UNQUALIFIED
Arvin B CampainItalyAmy Elsner RENEWAL
Maria Z RutaAustraliaStephen Shaw UNQUALIFIED
Claire P GauchoAustraliaAmy Elsner UNQUALIFIED
Maisha R MaletIndiaStephen Shaw PROPOSAL
Munro Y MaletGermanyIoni Bowcher NEW
Alejandro T PerinRussiaBernardo Dominic UNQUALIFIED
Jeanfrancois I WieserItalyAnna Fali NEW
Claire J FollerSpainStephen Shaw PROPOSAL
Jones A RimJapanOnyama Limba PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Antonio G PoquetteRussiaAmy Elsner NEGOTIATION
Kadeem X BowleyUnited KingdomXuxue Feng NEW
Greenwood J FerenczFranceStephen Shaw NEW
Adams T InouyeJapanOnyama Limba NEW
Morrow Z RoysterBrazilElwin Sharvill NEW
Deepesh E NickaArgentinaXuxue Feng RENEWAL
Kadeem B WaycottItalyOnyama Limba NEW
Rodrigues A BriddickRussiaOnyama Limba NEW
Maria U BowleyCanadaIoni Bowcher PROPOSAL
Aditya D BowleyIndiaBernardo Dominic QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Izzy S ChuiAustralia2024-09-10Rousseaux, Michael Esq RENEWAL23Elwin Sharvill
1001Leja W MacleadCanada2024-09-22Chapman, Ross E Esq NEW31Xuxue Feng
1002Kaitlin I OstroskyIndia2024-09-07King, Christopher A Esq NEW49Onyama Limba
1003Morrow P StensethAustralia2024-09-16Printing Dimensions PROPOSAL30Stephen Shaw
1004Aruna E StensethUnited Kingdom2024-09-19Morlong Associates PROPOSAL76Xuxue Feng
1005Jefferson X KuskoItaly2024-09-12Commercial Press UNQUALIFIED63Onyama Limba
1006Maisha L CaudyGermany2024-09-14Chemel, James L Cpa NEW41Xuxue Feng
1007Mujtaba J MorascaGermany2024-09-22Feiner Bros NEW2Elwin Sharvill
1008Francesco L KuskoSpain2024-09-09Chanay, Jeffrey A Esq PROPOSAL95Onyama Limba
1009Rodrigues V BriddickUnited Kingdom2024-09-14Printing Dimensions NEW38Ivan Magalhaes
1010Julie R RutaItaly2024-08-31Feiner Bros RENEWAL92Xuxue Feng
1011Octavia H PaprockiArgentina2024-08-26King, Christopher A Esq PROPOSAL20Bernardo Dominic
1012Aika T FerenczItaly2024-09-04Feiner Bros NEGOTIATION31Asiya Javayant
1013Maisha Y ChuiUnited Kingdom2024-09-03King, Christopher A Esq UNQUALIFIED27Xuxue Feng
1014Aruna S FollerArgentina2024-09-18Dorl, James J Esq PROPOSAL98Xuxue Feng
1015Maria G FigeroaJapan2024-09-14Rangoni Of Florence UNQUALIFIED1Ivan Magalhaes
1016Clifford Y MacleadArgentina2024-09-17Chapman, Ross E Esq NEW77Amy Elsner
1017Tony F DoeIndia2024-08-29Chapman, Ross E Esq NEGOTIATION10Anna Fali
1018Smith N SchemmerUnited Kingdom2024-09-11Feltz Printing Service PROPOSAL28Stephen Shaw
1019James W MarrierUnited Kingdom2024-09-09Dorl, James J Esq RENEWAL29Bernardo Dominic
1020Chavez I FigeroaFrance2024-09-01Commercial Press NEGOTIATION62Ioni Bowcher
1021Ivar G RulapaughBrazil2024-09-21Chanay, Jeffrey A Esq NEGOTIATION96Bernardo Dominic
1022Darci R FerenczArgentina2024-09-21Dorl, James J Esq NEW57Ioni Bowcher
1023Aika A MaletArgentina2024-09-02Chemel, James L Cpa NEGOTIATION34Bernardo Dominic
1024Ivar J PoquetteItaly2024-09-03Chapman, Ross E Esq NEW56Ioni Bowcher
1025Nicolas J InouyeIndia2024-08-26Dorl, James J Esq NEW59Onyama Limba
1026Smith R SergiRussia2024-08-27King, Christopher A Esq NEW30Stephen Shaw
1027Leon T AmigonIndia2024-09-19Feiner Bros PROPOSAL72Stephen Shaw
1028Faith D KolmetzBrazil2024-09-17Chapman, Ross E Esq UNQUALIFIED1Xuxue Feng
1029Deepesh C GlickJapan2024-09-17Rangoni Of Florence RENEWAL26Ivan Magalhaes
1030Jefferson N BologniaGermany2024-09-19Printing Dimensions PROPOSAL75Stephen Shaw
1031Maria Q InouyeRussia2024-09-16Benton, John B Jr UNQUALIFIED97Ivan Magalhaes
1032Jones Z WaycottFrance2024-09-21Feltz Printing Service UNQUALIFIED1Asiya Javayant
1033James W PaprockiArgentina2024-09-07Chanay, Jeffrey A Esq QUALIFIED25Ioni Bowcher
1034Leon A DarakjySpain2024-09-14Benton, John B Jr NEGOTIATION30Asiya Javayant
1035Ivar M DilliardUnited Kingdom2024-09-14Benton, John B Jr NEGOTIATION47Bernardo Dominic
1036Kadeem Y SergiSpain2024-09-22Feltz Printing Service RENEWAL23Xuxue Feng
1037Chavez Y StensethCanada2024-08-26King, Christopher A Esq UNQUALIFIED57Ioni Bowcher
1038Darci M PaprockiRussia2024-09-01Printing Dimensions PROPOSAL32Ivan Magalhaes
1039Mujtaba L CampainSpain2024-09-07Morlong Associates UNQUALIFIED79Onyama Limba
1040Jeanfrancois Y NickaRussia2024-09-23Feiner Bros UNQUALIFIED60Bernardo Dominic
1041Claire F SaylorsUnited Kingdom2024-09-16Printing Dimensions UNQUALIFIED60Xuxue Feng
1042Chavez I PaprockiArgentina2024-09-01King, Christopher A Esq NEW12Amy Elsner
1043Tony Z WieserUnited Kingdom2024-09-15Printing Dimensions UNQUALIFIED9Stephen Shaw
1044Wickens V SergiJapan2024-09-07Morlong Associates NEGOTIATION11Ivan Magalhaes
1045Murillo D NestleBrazil2024-08-31Rousseaux, Michael Esq QUALIFIED47Elwin Sharvill
1046Smith V StensethBrazil2024-09-21Buckley Miller Wright UNQUALIFIED83Asiya Javayant
1047Chavez J PerinRussia2024-08-27Rousseaux, Michael Esq RENEWAL16Asiya Javayant
1048Stacey K WieserUnited Kingdom2024-09-21Dorl, James J Esq NEGOTIATION76Stephen Shaw
1049Rodrigues N BriddickAustralia2024-09-16Feltz Printing Service PROPOSAL1Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Rodrigues X KolmetzRussiaBernardo Dominic QUALIFIED
Jones P OstroskyArgentinaBernardo Dominic PROPOSAL
Sinclair R GarufiFranceAnna Fali RENEWAL
Kaitlin Z FigeroaJapanStephen Shaw NEW
Antonio W InouyeCanadaAnna Fali QUALIFIED
Emily W GlickFranceStephen Shaw NEW
Ivar D TollnerAustraliaAmy Elsner NEW
Jones Z GauchoFranceAnna Fali NEGOTIATION
Ashley J BriddickArgentinaIoni Bowcher UNQUALIFIED
David X SchemmerSpainXuxue Feng UNQUALIFIED
Izzy S SchemmerGermanyBernardo Dominic RENEWAL
Smith B BowleyJapanIoni Bowcher UNQUALIFIED
Mujtaba D AlbaresUnited KingdomIvan Magalhaes NEGOTIATION
Wickens P MaletAustraliaAmy Elsner UNQUALIFIED
Leja J PoquetteIndiaIvan Magalhaes QUALIFIED
Smith Q BriddickUnited KingdomXuxue Feng UNQUALIFIED
Juan Z GarufiRussiaBernardo Dominic PROPOSAL
Jennifer H FollerFranceIoni Bowcher RENEWAL
Maisha Q OldroydCanadaAsiya Javayant PROPOSAL
Munro Q MacleadSpainAmy Elsner UNQUALIFIED
Octavia Y BologniaGermanyBernardo Dominic NEW
Cody X BriddickGermanyXuxue Feng UNQUALIFIED
Misaki C RimGermanyIvan Magalhaes UNQUALIFIED
Mayumi A MaletUnited KingdomAnna Fali NEW
Arvin A MaletCanadaOnyama Limba NEGOTIATION
Jones D RutaBrazilAmy Elsner UNQUALIFIED
Ivar L ButtFranceOnyama Limba RENEWAL
Kaitlin T CaudySpainXuxue Feng RENEWAL
Izzy J TollnerArgentinaElwin Sharvill QUALIFIED
Jefferson V FigeroaFranceIvan Magalhaes UNQUALIFIED
Emily B CaldareraIndiaElwin Sharvill UNQUALIFIED
Leon Q NestleGermanyIvan Magalhaes QUALIFIED
Maisha C SchemmerIndiaElwin Sharvill QUALIFIED
Deepesh O FerenczArgentinaBernardo Dominic PROPOSAL
Aditya H SlusarskiGermanyIoni Bowcher UNQUALIFIED
Ivar J RulapaughRussiaIoni Bowcher UNQUALIFIED
Rodrigues B MaletBrazilXuxue Feng NEW
Jeanfrancois I NickaBrazilBernardo Dominic NEW
Juan U OldroydArgentinaAmy Elsner NEGOTIATION
Maisha H BriddickItalyXuxue Feng PROPOSAL
Maisha Y RulapaughFranceAmy Elsner UNQUALIFIED
Juan M MaletArgentinaAnna Fali QUALIFIED
Kaitlin Q GauchoIndiaOnyama Limba QUALIFIED
Isabel F VenereUnited KingdomIvan Magalhaes RENEWAL
Murillo Y SaylorsFranceAsiya Javayant NEW
Johnson M FollerIndiaAnna Fali PROPOSAL
Salvatore Y SlusarskiAustraliaStephen Shaw UNQUALIFIED
Cody Q BriddickFranceIoni Bowcher QUALIFIED
Leja L PerinBrazilElwin Sharvill RENEWAL
Ashley I FlosiSpainXuxue Feng NEW
Frozen Columns
Name
Nicolas O Glick
Alejandro F Flosi
Rodrigues D Stenseth
Smith M Ostrosky
Jeanfrancois T Nicka
Jones Q Stenseth
Aruna P Stockham
Arvin D Saylors
Leja N Nestle
Rodrigues Y Nicka
Costa E Inouye
Silvio I Chui
Morrow N Figeroa
Aruna W Slusarski
Munro M Tollner
Chavez O Vocelka
Claire H Venere
Deepesh Q Schemmer
Maria R Darakjy
Mujtaba P Poquette
Deepesh L Glick
Stacey L Stockham
Kaitlin G Bowley
Arvin C Ostrosky
Deepesh Q Campain
Octavia H Flosi
Isabel O Butt
Adams M Oldroyd
Kadeem R Ostrosky
Faith C Malet
Murillo K Stockham
Maisha F Rulapaugh
Maria Z Ostrosky
Mujtaba U Stenseth
Deepesh Y Figeroa
Claire Q Malet
Stacey C Poquette
Faith K Shinko
Cody Z Vocelka
James W Malet
Ivar B Chui
Aditya O Tollner
Smith Y Wieser
Juan F Foller
Alejandro F Nestle
David G Venere
Costa J Inouye
Nicolas H Rim
Ashley V Whobrey
Stacey X Rim
IdCountryDate
1000India2024-09-02
1001India2024-09-21
1002France2024-08-25
1003France2024-08-28
1004Brazil2024-09-19
1005Japan2024-09-09
1006Argentina2024-09-14
1007Argentina2024-09-08
1008Brazil2024-09-02
1009France2024-08-27
1010Russia2024-09-08
1011France2024-08-28
1012Germany2024-09-09
1013Canada2024-09-08
1014United Kingdom2024-09-02
1015Italy2024-08-31
1016Russia2024-09-08
1017Spain2024-09-18
1018Japan2024-09-10
1019United Kingdom2024-09-01
1020Germany2024-08-28
1021Canada2024-09-12
1022Japan2024-08-28
1023Germany2024-08-29
1024United Kingdom2024-09-21
1025Australia2024-08-25
1026Australia2024-09-16
1027Argentina2024-08-26
1028Australia2024-09-06
1029Australia2024-08-25
1030Argentina2024-09-13
1031Japan2024-09-06
1032Canada2024-08-25
1033Brazil2024-09-01
1034Russia2024-09-04
1035Italy2024-08-31
1036Argentina2024-08-26
1037Canada2024-09-13
1038United Kingdom2024-09-15
1039India2024-09-07
1040France2024-09-03
1041Brazil2024-09-01
1042Japan2024-09-10
1043Canada2024-08-29
1044Japan2024-09-09
1045India2024-09-06
1046Japan2024-09-18
1047Italy2024-08-26
1048Japan2024-09-07
1049Russia2024-09-17

On-Demand Data

NameIdCountryDate
David Y Bowley1000Germany2024-09-11
Julie X Shinko1001Japan2024-08-29
Costa D Morasca1002Brazil2024-08-27
Arvin Q Bolognia1003Italy2024-09-16
Adams P Kusko1004Australia2024-09-02
Arvin I Vocelka1005Australia2024-09-10
Jennifer R Wieser1006Spain2024-09-14
Deepesh S Butt1007United Kingdom2024-09-02
Maria A Tollner1008United Kingdom2024-09-21
Sinclair I Wieser1009Japan2024-09-17
Darci R Shinko1010Canada2024-09-04
Mujtaba K Garufi1011Spain2024-09-14
Clifford T Oldroyd1012Spain2024-09-19
Mujtaba S Glick1013Russia2024-09-06
Tony P Maclead1014Russia2024-08-31
Jones Q Malet1015Argentina2024-09-07
Leja N Foller1016Argentina2024-08-29
Tony I Butt1017Spain2024-08-27
Ivar P Doe1018Canada2024-09-04
Murillo N Malet1019Japan2024-09-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Costa W FerenczFranceAsiya Javayant QUALIFIED
Antonio S FigeroaAustraliaOnyama Limba NEW
Antonio E PoquetteArgentinaIvan Magalhaes RENEWAL
Misaki L AlbaresJapanAnna Fali RENEWAL
Salvatore A NestleGermanyAsiya Javayant RENEWAL
Ivar W AmigonJapanIoni Bowcher PROPOSAL
James M AmigonAustraliaStephen Shaw QUALIFIED
Sinclair R FollerSpainAmy Elsner PROPOSAL
Jennifer Q RoysterCanadaXuxue Feng PROPOSAL
Darci M GauchoBrazilBernardo Dominic UNQUALIFIED
Leja U SaylorsGermanyAsiya Javayant NEGOTIATION
Johnson Q BriddickCanadaElwin Sharvill NEW
Misaki I DilliardAustraliaIoni Bowcher QUALIFIED
Ricardo U SergiSpainXuxue Feng QUALIFIED
Smith S GillianUnited KingdomAnna Fali UNQUALIFIED
Isabel Z KuskoGermanyElwin Sharvill RENEWAL
Julie F IturbideArgentinaStephen Shaw NEGOTIATION
Costa C OstroskyRussiaOnyama Limba PROPOSAL
David O SchemmerRussiaAmy Elsner QUALIFIED
Costa B OldroydFranceElwin Sharvill UNQUALIFIED
Nicolas C FlosiCanadaIoni Bowcher NEGOTIATION
Stacey B InouyeBrazilAmy Elsner NEGOTIATION
Antonio D PaprockiBrazilBernardo Dominic RENEWAL
James B MorascaBrazilAmy Elsner QUALIFIED
Ivar Y ChuiRussiaAmy Elsner QUALIFIED
Costa U TollnerUnited KingdomIvan Magalhaes RENEWAL
Kaitlin R GlickGermanyStephen Shaw UNQUALIFIED
Isabel A OstroskyAustraliaAsiya Javayant UNQUALIFIED
Cody F VenereAustraliaAmy Elsner NEGOTIATION
Alejandro T StensethBrazilOnyama Limba PROPOSAL
Clifford B NestleIndiaAsiya Javayant RENEWAL
Kadeem D BologniaIndiaAmy Elsner QUALIFIED
Leon X SaylorsItalyAmy Elsner RENEWAL
Rodrigues D OstroskyIndiaStephen Shaw NEW
Jeanfrancois W WaycottArgentinaBernardo Dominic PROPOSAL
Johnson O BowleySpainIoni Bowcher RENEWAL
Aditya N KuskoJapanIoni Bowcher QUALIFIED
Juan H CaudyRussiaIvan Magalhaes PROPOSAL
James D CampainBrazilIoni Bowcher NEW
Aruna T GillianIndiaStephen Shaw 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>