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
Izzy T WhobreySpainIvan Magalhaes QUALIFIED
Costa M StensethArgentinaElwin Sharvill RENEWAL
Cody D WieserArgentinaIoni Bowcher NEW
Kadeem S WaycottSpainXuxue Feng RENEWAL
Ricardo K RimRussiaAmy Elsner PROPOSAL
Tony P DoeRussiaIvan Magalhaes RENEWAL
Leon F KolmetzCanadaIoni Bowcher PROPOSAL
Maria G FigeroaJapanAsiya Javayant QUALIFIED
Juan A MarrierArgentinaOnyama Limba PROPOSAL
Costa O RutaRussiaIoni Bowcher UNQUALIFIED
Kaitlin J VenereSpainStephen Shaw UNQUALIFIED
Rodrigues O BowleyJapanAnna Fali PROPOSAL
Kaitlin Z CampainCanadaAnna Fali RENEWAL
Munro D DoeBrazilBernardo Dominic NEGOTIATION
Adams E ButtSpainOnyama Limba RENEWAL
Leon C InouyeArgentinaIoni Bowcher RENEWAL
Aruna I RimIndiaStephen Shaw NEGOTIATION
Nicolas R WieserItalyElwin Sharvill QUALIFIED
Faith Z StensethFranceStephen Shaw UNQUALIFIED
David O CaudyCanadaIoni Bowcher PROPOSAL
Johnson J RulapaughBrazilAnna Fali UNQUALIFIED
Jefferson E AlbaresCanadaBernardo Dominic RENEWAL
Silvio H MacleadArgentinaAnna Fali NEGOTIATION
Rodrigues P WhobreyUnited KingdomIvan Magalhaes UNQUALIFIED
Sinclair Y BowleyItalyIvan Magalhaes QUALIFIED
Costa Y BowleyIndiaStephen Shaw NEGOTIATION
Salvatore T ChuiIndiaBernardo Dominic UNQUALIFIED
Tony E MaletArgentinaOnyama Limba NEGOTIATION
David F InouyeAustraliaIvan Magalhaes RENEWAL
Juan U OstroskyBrazilIvan Magalhaes QUALIFIED
Stacey L IturbideRussiaXuxue Feng NEW
Izzy M CaudyFranceAnna Fali NEGOTIATION
Sinclair P BologniaBrazilElwin Sharvill RENEWAL
Octavia X MorascaCanadaAmy Elsner QUALIFIED
Kadeem V ChuiFranceOnyama Limba UNQUALIFIED
Kadeem G ShinkoJapanIoni Bowcher QUALIFIED
Leja P FollerFranceBernardo Dominic UNQUALIFIED
Ivar V RulapaughItalyIoni Bowcher RENEWAL
Adams Y MacleadCanadaIvan Magalhaes RENEWAL
Murillo E FerenczCanadaXuxue Feng NEW
Nicolas O TollnerIndiaElwin Sharvill UNQUALIFIED
David J ChuiFranceAmy Elsner RENEWAL
Deepesh Z KolmetzItalyAsiya Javayant QUALIFIED
Francesco Z NickaGermanyOnyama Limba QUALIFIED
Darci M FerenczJapanAmy Elsner NEW
Misaki V PoquetteAustraliaOnyama Limba NEGOTIATION
Nicolas U RutaItalyIvan Magalhaes NEW
Stacey B PerinFranceElwin Sharvill NEGOTIATION
Julie O PaprockiFranceOnyama Limba PROPOSAL
Mujtaba M SchemmerIndiaBernardo Dominic UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Sinclair A MaletIndiaBernardo Dominic PROPOSAL
Salvatore S GillianUnited KingdomIoni Bowcher UNQUALIFIED
Emily W RoysterBrazilBernardo Dominic RENEWAL
Jeanfrancois A MacleadItalyIoni Bowcher NEW
Johnson U MorascaJapanXuxue Feng PROPOSAL
Mayumi E SergiBrazilBernardo Dominic NEGOTIATION
Leon N FigeroaRussiaAsiya Javayant NEW
Kaitlin Z OldroydSpainStephen Shaw NEW
Tony Q TollnerAustraliaIoni Bowcher PROPOSAL
Ivar Q CaudyRussiaAmy Elsner PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Morrow A MarrierAustralia2025-04-19Commercial Press QUALIFIED13Ivan Magalhaes
1001Mayumi E WieserFrance2025-04-28Truhlar And Truhlar Attys NEW68Anna Fali
1002David K FlosiFrance2025-04-12Rangoni Of Florence RENEWAL22Xuxue Feng
1003Kaitlin C BologniaItaly2025-04-04Truhlar And Truhlar Attys PROPOSAL40Bernardo Dominic
1004Johnson B SaylorsSpain2025-04-06Chemel, James L Cpa NEGOTIATION4Xuxue Feng
1005Smith L BowleyCanada2025-04-15Benton, John B Jr UNQUALIFIED64Amy Elsner
1006Mujtaba F VenereUnited Kingdom2025-04-15Rangoni Of Florence RENEWAL92Ivan Magalhaes
1007Alejandro M FlosiSpain2025-04-20Feltz Printing Service NEGOTIATION58Anna Fali
1008Sinclair U MacleadItaly2025-04-02Truhlar And Truhlar Attys QUALIFIED35Stephen Shaw
1009Mujtaba E BriddickFrance2025-04-30Chapman, Ross E Esq PROPOSAL98Onyama Limba
1010Deepesh Q VenereJapan2025-04-09King, Christopher A Esq NEW24Anna Fali
1011Leon N GillianRussia2025-04-09Commercial Press NEW54Amy Elsner
1012Costa M FigeroaRussia2025-04-15Feiner Bros PROPOSAL79Asiya Javayant
1013Mujtaba C RutaBrazil2025-04-26Printing Dimensions NEW71Anna Fali
1014Octavia P PerinRussia2025-04-26Commercial Press NEW27Ioni Bowcher
1015Francesco J CaldareraJapan2025-04-11King, Christopher A Esq QUALIFIED98Bernardo Dominic
1016Emily A DilliardItaly2025-04-26Benton, John B Jr NEW92Ioni Bowcher
1017Silvio Y RimBrazil2025-04-21Truhlar And Truhlar Attys QUALIFIED39Anna Fali
1018Aruna T PaprockiFrance2025-04-06Commercial Press NEGOTIATION62Asiya Javayant
1019Antonio W StockhamFrance2025-04-17Printing Dimensions NEW97Anna Fali
1020Leon S CaldareraFrance2025-04-20Chemel, James L Cpa NEGOTIATION64Amy Elsner
1021James C RimArgentina2025-04-26Feltz Printing Service PROPOSAL65Stephen Shaw
1022Salvatore U MorascaRussia2025-04-19Rousseaux, Michael Esq QUALIFIED79Onyama Limba
1023Morrow J WaycottUnited Kingdom2025-04-10King, Christopher A Esq RENEWAL95Anna Fali
1024Johnson V MacleadIndia2025-04-21Morlong Associates NEGOTIATION11Bernardo Dominic
1025Clifford L CampainSpain2025-04-28Buckley Miller Wright PROPOSAL84Asiya Javayant
1026Maria N BowleyBrazil2025-04-25Buckley Miller Wright RENEWAL96Xuxue Feng
1027Johnson W AlbaresRussia2025-04-09Commercial Press NEGOTIATION78Ioni Bowcher
1028Costa E DilliardFrance2025-04-03Dorl, James J Esq UNQUALIFIED17Ivan Magalhaes
1029Mayumi X StensethAustralia2025-04-06Dorl, James J Esq QUALIFIED82Asiya Javayant
1030Silvio V FollerFrance2025-04-10Rousseaux, Michael Esq RENEWAL64Ivan Magalhaes
1031James O AlbaresAustralia2025-04-30Commercial Press PROPOSAL27Ioni Bowcher
1032Silvio F PaprockiBrazil2025-04-24Chapman, Ross E Esq RENEWAL23Anna Fali
1033Arvin B NestleJapan2025-04-20Buckley Miller Wright UNQUALIFIED19Elwin Sharvill
1034Murillo I GillianBrazil2025-04-05Feiner Bros PROPOSAL42Bernardo Dominic
1035Chavez G StockhamJapan2025-04-11King, Christopher A Esq RENEWAL33Bernardo Dominic
1036Sinclair G MarrierCanada2025-04-17Buckley Miller Wright PROPOSAL70Elwin Sharvill
1037Costa V RulapaughSpain2025-04-09Benton, John B Jr UNQUALIFIED70Ivan Magalhaes
1038Sinclair C WhobreyJapan2025-04-09Rangoni Of Florence NEGOTIATION35Elwin Sharvill
1039Emily W VenereGermany2025-04-29King, Christopher A Esq QUALIFIED31Stephen Shaw
1040Jefferson R WhobreyFrance2025-04-20Printing Dimensions RENEWAL55Onyama Limba
1041Aditya T AmigonJapan2025-04-12Truhlar And Truhlar Attys PROPOSAL13Ioni Bowcher
1042Faith N DoeItaly2025-04-22Morlong Associates UNQUALIFIED90Ioni Bowcher
1043Alejandro L ShinkoIndia2025-04-01Printing Dimensions RENEWAL24Anna Fali
1044Kadeem N FollerUnited Kingdom2025-04-06Feiner Bros NEW71Ivan Magalhaes
1045Leja M RimSpain2025-04-02Buckley Miller Wright NEW73Ioni Bowcher
1046Aika G ButtArgentina2025-04-04Dorl, James J Esq NEW72Ivan Magalhaes
1047Munro D PaprockiItaly2025-04-30Chanay, Jeffrey A Esq NEW11Asiya Javayant
1048Arvin P SchemmerArgentina2025-04-26Benton, John B Jr QUALIFIED63Xuxue Feng
1049Leon T VocelkaGermany2025-04-04Printing Dimensions UNQUALIFIED8Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Tony B RoysterFranceBernardo Dominic UNQUALIFIED
Rodrigues E WaycottAustraliaXuxue Feng QUALIFIED
Antonio G DarakjyRussiaStephen Shaw QUALIFIED
Morrow L FlosiBrazilAmy Elsner NEGOTIATION
Murillo W NickaAustraliaAnna Fali NEGOTIATION
Stacey Y StensethSpainIvan Magalhaes PROPOSAL
Adams K NickaSpainXuxue Feng NEGOTIATION
Smith K SchemmerRussiaAsiya Javayant NEW
Chavez A BriddickIndiaIoni Bowcher UNQUALIFIED
Ricardo U GauchoArgentinaAnna Fali NEGOTIATION
Jeanfrancois X StockhamJapanAnna Fali NEW
Leja D KuskoAustraliaElwin Sharvill QUALIFIED
David F ButtFranceIoni Bowcher UNQUALIFIED
Maria D SchemmerIndiaAmy Elsner NEGOTIATION
Ivar K NestleBrazilAsiya Javayant RENEWAL
Jeanfrancois T SlusarskiUnited KingdomXuxue Feng RENEWAL
Ashley T ButtBrazilOnyama Limba QUALIFIED
Mayumi B DarakjyArgentinaOnyama Limba PROPOSAL
Clifford M VenereFranceIoni Bowcher PROPOSAL
Ricardo I MaletIndiaOnyama Limba UNQUALIFIED
Jefferson F FerenczArgentinaIoni Bowcher RENEWAL
Misaki Y GlickGermanyIvan Magalhaes UNQUALIFIED
Darci F AmigonJapanElwin Sharvill RENEWAL
Wickens J SchemmerJapanAsiya Javayant PROPOSAL
Rodrigues B MaletCanadaElwin Sharvill RENEWAL
Emily W RulapaughItalyStephen Shaw NEGOTIATION
Ricardo V CampainJapanIvan Magalhaes NEGOTIATION
Ricardo V SlusarskiUnited KingdomBernardo Dominic NEW
Mujtaba B SaylorsBrazilIvan Magalhaes NEW
Francesco B PerinAustraliaStephen Shaw RENEWAL
Greenwood N FigeroaArgentinaIoni Bowcher QUALIFIED
Darci X MaletAustraliaAnna Fali NEW
Antonio B FigeroaFranceIoni Bowcher RENEWAL
Jennifer M OstroskyIndiaXuxue Feng UNQUALIFIED
Leon Y BologniaSpainStephen Shaw PROPOSAL
Salvatore O StockhamUnited KingdomOnyama Limba NEGOTIATION
Jefferson A RulapaughBrazilAnna Fali NEW
Jones W StensethBrazilAnna Fali UNQUALIFIED
Aditya K OstroskyItalyXuxue Feng NEGOTIATION
Jennifer Y ChuiAustraliaIvan Magalhaes NEGOTIATION
Alejandro K FlosiJapanXuxue Feng NEW
Smith S RimUnited KingdomAnna Fali RENEWAL
Adams L SlusarskiArgentinaAnna Fali UNQUALIFIED
Aruna K CaudySpainIoni Bowcher PROPOSAL
Isabel M OldroydUnited KingdomElwin Sharvill UNQUALIFIED
Mayumi T InouyeSpainAsiya Javayant NEW
Clifford Y FlosiSpainElwin Sharvill NEGOTIATION
Aika A RulapaughCanadaAmy Elsner PROPOSAL
Darci P SchemmerAustraliaOnyama Limba PROPOSAL
Smith B AlbaresBrazilElwin Sharvill NEW
Frozen Columns
Name
Cody N Amigon
Jeanfrancois E Caudy
Alejandro D Malet
David X Inouye
Antonio D Butt
Emily F Shinko
Jeanfrancois J Butt
Leon X Inouye
Ricardo B Stockham
Claire X Whobrey
Clifford S Waycott
Aika Y Saylors
Adams W Rulapaugh
Aditya A Stockham
Juan V Briddick
Chavez J Inouye
Leja M Ferencz
Smith H Vocelka
Mayumi H Marrier
Emily M Royster
Smith O Garufi
Sinclair F Briddick
Tony J Butt
Jones R Ferencz
Misaki B Dilliard
Aika F Malet
Silvio Z Ostrosky
Ricardo M Glick
Mayumi G Inouye
Claire C Sergi
Maria L Caudy
Tony K Malet
Juan L Figeroa
Chavez I Foller
Adams L Stenseth
Misaki B Bolognia
Claire D Rim
Murillo V Gaucho
Faith F Kusko
Jones X Marrier
Stacey K Garufi
Arvin T Ferencz
Smith B Garufi
Ashley E Darakjy
Leon I Briddick
Sinclair O Campain
Stacey E Rim
Misaki P Rulapaugh
Ashley B Dilliard
Aditya Y Stockham
IdCountryDate
1000Argentina2025-04-21
1001France2025-04-08
1002Australia2025-04-24
1003Canada2025-04-17
1004Russia2025-04-13
1005Japan2025-04-15
1006Spain2025-04-19
1007Argentina2025-04-26
1008Germany2025-04-27
1009Canada2025-04-20
1010India2025-04-26
1011Brazil2025-04-10
1012Germany2025-04-18
1013France2025-04-05
1014Brazil2025-04-14
1015France2025-04-09
1016France2025-04-05
1017Russia2025-04-17
1018France2025-04-11
1019Japan2025-04-13
1020India2025-04-09
1021Canada2025-04-17
1022Australia2025-04-30
1023Brazil2025-04-15
1024Japan2025-04-14
1025India2025-04-05
1026Russia2025-04-12
1027Germany2025-04-15
1028France2025-04-20
1029Spain2025-04-19
1030Australia2025-04-21
1031Italy2025-04-24
1032France2025-04-02
1033Canada2025-04-16
1034Italy2025-04-12
1035Russia2025-04-22
1036Argentina2025-04-12
1037Brazil2025-04-21
1038Argentina2025-04-27
1039Spain2025-04-18
1040Russia2025-04-21
1041Canada2025-04-03
1042Spain2025-04-12
1043Spain2025-04-16
1044Canada2025-04-05
1045Brazil2025-04-03
1046Australia2025-04-08
1047Argentina2025-04-19
1048Russia2025-04-20
1049Spain2025-04-28

On-Demand Data

NameIdCountryDate
Arvin G Morasca1000Italy2025-04-20
Maisha Z Gaucho1001Brazil2025-04-08
Maisha D Maclead1002India2025-04-09
Alejandro F Perin1003Brazil2025-04-09
Silvio M Amigon1004Argentina2025-04-12
Leja K Flosi1005Argentina2025-04-26
Darci Y Doe1006United Kingdom2025-04-27
Ricardo J Sergi1007Australia2025-04-04
Ivar S Wieser1008France2025-04-08
Ivar Z Nicka1009Brazil2025-04-13
David D Ferencz1010Brazil2025-04-08
Maisha I Bowley1011Argentina2025-04-01
Alejandro T Gaucho1012Argentina2025-04-22
Aruna G Albares1013Australia2025-04-06
Costa D Poquette1014Germany2025-04-28
Adams U Sergi1015Argentina2025-04-16
Francesco F Stenseth1016Brazil2025-04-11
Juan F Schemmer1017France2025-04-22
Ricardo S Darakjy1018Japan2025-04-28
Kaitlin N Rulapaugh1019Canada2025-04-08
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
David V CaudyFranceOnyama Limba QUALIFIED
Ricardo V MacleadGermanyBernardo Dominic NEW
Jefferson T WaycottRussiaIvan Magalhaes NEGOTIATION
Aika U StockhamGermanyAnna Fali UNQUALIFIED
Leon M BologniaIndiaElwin Sharvill NEW
Leon D GillianFranceStephen Shaw QUALIFIED
Aruna D StensethUnited KingdomOnyama Limba NEW
Claire I OldroydGermanyXuxue Feng NEGOTIATION
Tony Q FerenczFranceAnna Fali UNQUALIFIED
Kaitlin O VocelkaIndiaXuxue Feng RENEWAL
Chavez E BologniaItalyStephen Shaw NEW
Alejandro L ChuiGermanyXuxue Feng NEGOTIATION
Cody V CampainUnited KingdomXuxue Feng QUALIFIED
Cody G ChuiFranceAmy Elsner RENEWAL
Salvatore I ChuiItalyElwin Sharvill PROPOSAL
Mujtaba O GauchoJapanBernardo Dominic NEW
Jefferson I PerinUnited KingdomElwin Sharvill RENEWAL
Jones L CaudyJapanStephen Shaw PROPOSAL
Jennifer E InouyeCanadaXuxue Feng UNQUALIFIED
Chavez V MacleadSpainOnyama Limba NEGOTIATION
Greenwood F PoquetteSpainElwin Sharvill PROPOSAL
Maisha Q PaprockiFranceAsiya Javayant NEW
Juan S MaletItalyXuxue Feng PROPOSAL
Leja O StockhamSpainIvan Magalhaes QUALIFIED
Smith N ShinkoFranceIoni Bowcher NEW
Julie U OldroydBrazilBernardo Dominic QUALIFIED
Cody D CaudyItalyAnna Fali UNQUALIFIED
Munro Z StockhamFranceIvan Magalhaes NEGOTIATION
Emily A SergiGermanyAsiya Javayant UNQUALIFIED
Wickens B BriddickUnited KingdomOnyama Limba NEW
Darci Q ChuiJapanIoni Bowcher RENEWAL
Munro X SchemmerCanadaXuxue Feng QUALIFIED
Darci I DilliardCanadaStephen Shaw NEW
Aika W WhobreyUnited KingdomXuxue Feng PROPOSAL
Greenwood L StensethBrazilOnyama Limba UNQUALIFIED
Munro A DarakjyBrazilAnna Fali PROPOSAL
Juan L PoquetteSpainIvan Magalhaes PROPOSAL
Francesco Y CaudyFranceXuxue Feng NEGOTIATION
Octavia A FigeroaItalyIvan Magalhaes QUALIFIED
Murillo K PaprockiCanadaIvan Magalhaes 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>