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
Johnson M PoquetteItalyStephen Shaw PROPOSAL
Francesco D SergiFranceBernardo Dominic RENEWAL
Rodrigues Z BowleyJapanAmy Elsner UNQUALIFIED
Octavia J KuskoItalyStephen Shaw QUALIFIED
Izzy Y RimRussiaStephen Shaw NEW
Isabel N RimItalyOnyama Limba NEW
Arvin X PerinUnited KingdomAnna Fali PROPOSAL
Antonio A FlosiRussiaIoni Bowcher NEGOTIATION
James S SergiSpainOnyama Limba UNQUALIFIED
Wickens I GillianSpainOnyama Limba PROPOSAL
Morrow H VocelkaJapanElwin Sharvill NEGOTIATION
Mayumi F AmigonIndiaBernardo Dominic QUALIFIED
Izzy N InouyeGermanyAnna Fali NEGOTIATION
Antonio J ButtArgentinaXuxue Feng NEGOTIATION
Aditya K SaylorsSpainElwin Sharvill RENEWAL
Deepesh K KuskoJapanIvan Magalhaes RENEWAL
Alejandro F OldroydRussiaIoni Bowcher NEW
Jeanfrancois N MarrierAustraliaStephen Shaw UNQUALIFIED
Adams E FollerJapanOnyama Limba NEW
Darci H InouyeItalyIvan Magalhaes NEW
Darci B AlbaresIndiaIvan Magalhaes NEW
Mayumi H MaletArgentinaIoni Bowcher RENEWAL
Isabel V MaletFranceStephen Shaw UNQUALIFIED
Cody N KolmetzBrazilBernardo Dominic UNQUALIFIED
Emily A GlickItalyElwin Sharvill NEW
Greenwood D CaldareraSpainOnyama Limba NEGOTIATION
Munro M InouyeArgentinaAmy Elsner RENEWAL
Ricardo I AlbaresBrazilBernardo Dominic NEW
Ivar F PaprockiBrazilStephen Shaw PROPOSAL
Maria E RutaArgentinaStephen Shaw PROPOSAL
Isabel E OldroydArgentinaIvan Magalhaes UNQUALIFIED
Arvin R MaletBrazilAmy Elsner NEGOTIATION
Maria Z RulapaughItalyIoni Bowcher RENEWAL
Ivar D AmigonIndiaOnyama Limba UNQUALIFIED
Salvatore A FerenczJapanIvan Magalhaes PROPOSAL
Aika X GarufiCanadaStephen Shaw NEW
Alejandro T NickaIndiaAsiya Javayant RENEWAL
Leon C AmigonGermanyXuxue Feng UNQUALIFIED
Emily T OstroskyIndiaIoni Bowcher QUALIFIED
Rodrigues S MaletSpainElwin Sharvill QUALIFIED
Izzy C SaylorsArgentinaAmy Elsner NEGOTIATION
Maisha F DarakjyBrazilStephen Shaw QUALIFIED
Johnson S SaylorsSpainIoni Bowcher QUALIFIED
Darci V BowleyIndiaAsiya Javayant RENEWAL
Stacey O WaycottItalyIvan Magalhaes UNQUALIFIED
Izzy Z DilliardGermanyOnyama Limba QUALIFIED
Jennifer Z StockhamIndiaElwin Sharvill PROPOSAL
Adams T CaldareraIndiaIvan Magalhaes NEGOTIATION
Ivar G SchemmerBrazilElwin Sharvill PROPOSAL
Greenwood I SchemmerSpainElwin Sharvill QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Deepesh G FigeroaUnited KingdomAnna Fali NEW
James C PaprockiIndiaStephen Shaw QUALIFIED
Munro Y WhobreyJapanAsiya Javayant NEGOTIATION
Ivar E CaldareraIndiaElwin Sharvill NEGOTIATION
Kadeem N WieserBrazilStephen Shaw QUALIFIED
Munro O WieserRussiaBernardo Dominic RENEWAL
Aruna D FlosiFranceBernardo Dominic QUALIFIED
Mujtaba Z FlosiCanadaAmy Elsner NEW
Tony Q GlickCanadaAnna Fali QUALIFIED
Maria E AmigonBrazilOnyama Limba PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Izzy Y MacleadFrance2025-04-03Truhlar And Truhlar Attys UNQUALIFIED11Xuxue Feng
1001Aika P MarrierRussia2025-04-01Printing Dimensions RENEWAL67Xuxue Feng
1002Jefferson W PerinAustralia2025-04-14Buckley Miller Wright NEGOTIATION90Ivan Magalhaes
1003Jefferson V SchemmerSpain2025-04-04Chapman, Ross E Esq NEGOTIATION18Elwin Sharvill
1004Sinclair O IturbideIndia2025-04-13Chanay, Jeffrey A Esq PROPOSAL75Ioni Bowcher
1005Stacey Z StensethFrance2025-04-04Commercial Press NEGOTIATION56Ivan Magalhaes
1006Isabel R ButtJapan2025-04-18Feiner Bros QUALIFIED5Bernardo Dominic
1007Salvatore A FigeroaGermany2025-04-04Dorl, James J Esq UNQUALIFIED13Anna Fali
1008Jeanfrancois K CaldareraGermany2025-04-26Chanay, Jeffrey A Esq NEW72Ioni Bowcher
1009Nicolas V MaletFrance2025-04-22Dorl, James J Esq PROPOSAL40Ioni Bowcher
1010Leja I CaudyRussia2025-04-19Printing Dimensions NEW28Stephen Shaw
1011Claire A CampainUnited Kingdom2025-04-16Buckley Miller Wright NEW18Xuxue Feng
1012Leja X GillianUnited Kingdom2025-04-05King, Christopher A Esq NEW65Anna Fali
1013Octavia N WhobreyFrance2025-04-23Benton, John B Jr NEGOTIATION49Stephen Shaw
1014David Q BriddickFrance2025-04-16Chemel, James L Cpa NEW45Onyama Limba
1015Rodrigues T StockhamGermany2025-04-05Chapman, Ross E Esq QUALIFIED24Asiya Javayant
1016Jennifer L PaprockiGermany2025-04-11Feltz Printing Service NEGOTIATION98Ioni Bowcher
1017Clifford J ChuiJapan2025-04-06Feltz Printing Service NEW9Stephen Shaw
1018Smith Z RutaSpain2025-04-20Dorl, James J Esq NEGOTIATION1Asiya Javayant
1019Chavez H RimAustralia2025-04-04Feltz Printing Service NEW95Ivan Magalhaes
1020Chavez L SaylorsItaly2025-04-02Rangoni Of Florence NEW88Amy Elsner
1021Sinclair X WhobreyItaly2025-04-10Feiner Bros QUALIFIED0Stephen Shaw
1022Leon U GarufiSpain2025-04-28Feiner Bros NEW72Anna Fali
1023Misaki J MaletItaly2025-04-21Printing Dimensions PROPOSAL34Ioni Bowcher
1024James I GillianIndia2025-04-29Benton, John B Jr NEGOTIATION85Ioni Bowcher
1025Tony D AlbaresBrazil2025-04-29Commercial Press NEGOTIATION82Xuxue Feng
1026Salvatore R CaldareraAustralia2025-04-16King, Christopher A Esq RENEWAL24Asiya Javayant
1027Costa K ShinkoGermany2025-04-28Rangoni Of Florence QUALIFIED70Anna Fali
1028Kaitlin H KolmetzAustralia2025-04-03Morlong Associates NEGOTIATION68Amy Elsner
1029Jeanfrancois Y RimUnited Kingdom2025-04-30Feltz Printing Service PROPOSAL50Ivan Magalhaes
1030Sinclair A MaletAustralia2025-04-20Buckley Miller Wright NEW87Ioni Bowcher
1031Antonio P FigeroaUnited Kingdom2025-04-03Dorl, James J Esq RENEWAL97Elwin Sharvill
1032Cody B WhobreyUnited Kingdom2025-04-03Feltz Printing Service QUALIFIED12Ivan Magalhaes
1033Rodrigues J GlickAustralia2025-04-05Chapman, Ross E Esq NEGOTIATION87Amy Elsner
1034Julie G PaprockiSpain2025-04-08Benton, John B Jr QUALIFIED67Stephen Shaw
1035Stacey F StensethJapan2025-04-20King, Christopher A Esq QUALIFIED54Ioni Bowcher
1036Maisha F DilliardGermany2025-04-09King, Christopher A Esq QUALIFIED41Elwin Sharvill
1037Greenwood P SaylorsSpain2025-04-22Commercial Press PROPOSAL49Anna Fali
1038Maria Q GlickArgentina2025-04-18Dorl, James J Esq PROPOSAL94Amy Elsner
1039Adams A PerinBrazil2025-04-26Commercial Press UNQUALIFIED2Onyama Limba
1040Emily K DoeSpain2025-04-16Feltz Printing Service QUALIFIED54Elwin Sharvill
1041Aditya J GillianGermany2025-04-01Morlong Associates NEGOTIATION4Bernardo Dominic
1042Murillo F FigeroaFrance2025-04-17Dorl, James J Esq RENEWAL74Ioni Bowcher
1043David X DoeIndia2025-04-14Buckley Miller Wright UNQUALIFIED9Xuxue Feng
1044Darci L MacleadSpain2025-04-12Rangoni Of Florence QUALIFIED2Ioni Bowcher
1045Sinclair Q SlusarskiAustralia2025-04-05Rousseaux, Michael Esq NEGOTIATION88Bernardo Dominic
1046Chavez S PerinBrazil2025-04-17Chanay, Jeffrey A Esq PROPOSAL80Amy Elsner
1047Deepesh Y StockhamSpain2025-04-03Chapman, Ross E Esq PROPOSAL17Asiya Javayant
1048Leja D WhobreyUnited Kingdom2025-04-12Feiner Bros NEGOTIATION68Amy Elsner
1049James Z CaudyCanada2025-04-27Dorl, James J Esq PROPOSAL25Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Juan E PerinIndiaAsiya Javayant RENEWAL
Rodrigues P WaycottAustraliaAsiya Javayant NEGOTIATION
Smith F StockhamItalyXuxue Feng NEW
Kaitlin W RutaFranceAmy Elsner UNQUALIFIED
Arvin C GlickArgentinaOnyama Limba NEW
Aika V FerenczArgentinaAnna Fali NEW
Darci L TollnerItalyBernardo Dominic UNQUALIFIED
Mayumi F MaletFranceIoni Bowcher RENEWAL
Jefferson F SergiJapanIoni Bowcher NEGOTIATION
Aruna H FlosiSpainIoni Bowcher PROPOSAL
Cody W NickaGermanyIoni Bowcher NEW
Francesco A StockhamFranceIoni Bowcher UNQUALIFIED
Deepesh S DilliardArgentinaAsiya Javayant NEW
Johnson B GarufiFranceAmy Elsner UNQUALIFIED
Clifford O SlusarskiAustraliaXuxue Feng QUALIFIED
Kaitlin H GlickGermanyIoni Bowcher RENEWAL
Salvatore Y AmigonItalyXuxue Feng QUALIFIED
Faith C BologniaGermanyElwin Sharvill QUALIFIED
Rodrigues L VocelkaFranceIvan Magalhaes NEGOTIATION
Munro M CaldareraUnited KingdomElwin Sharvill NEW
Adams W SlusarskiUnited KingdomAsiya Javayant NEW
Tony Z RutaIndiaBernardo Dominic RENEWAL
Aditya I IturbideIndiaXuxue Feng NEGOTIATION
Costa R DarakjyUnited KingdomStephen Shaw NEW
Tony T GauchoFranceBernardo Dominic QUALIFIED
Smith W KolmetzJapanAsiya Javayant RENEWAL
Stacey Q FigeroaIndiaStephen Shaw PROPOSAL
Costa Q TollnerItalyOnyama Limba PROPOSAL
Greenwood R VocelkaAustraliaIvan Magalhaes NEW
Claire J MacleadRussiaBernardo Dominic NEW
Aruna G FollerSpainBernardo Dominic RENEWAL
Claire O AmigonFranceBernardo Dominic NEW
Aika T KolmetzUnited KingdomElwin Sharvill UNQUALIFIED
Mujtaba V BowleyRussiaStephen Shaw NEGOTIATION
Julie O DoeArgentinaElwin Sharvill NEW
David F InouyeBrazilIoni Bowcher NEW
Rodrigues U BowleyUnited KingdomIoni Bowcher PROPOSAL
Sinclair H GillianIndiaIoni Bowcher UNQUALIFIED
Leja O ShinkoBrazilAsiya Javayant NEGOTIATION
Costa T RulapaughIndiaXuxue Feng RENEWAL
Clifford P PaprockiJapanIoni Bowcher UNQUALIFIED
Ricardo P DilliardFranceElwin Sharvill NEW
Leon T ChuiGermanyAsiya Javayant UNQUALIFIED
Kadeem G SaylorsFranceAnna Fali PROPOSAL
Maisha A MarrierFranceOnyama Limba NEGOTIATION
Murillo K AmigonSpainAnna Fali UNQUALIFIED
Claire Q PaprockiJapanXuxue Feng NEGOTIATION
Aruna F DoeRussiaIvan Magalhaes RENEWAL
Murillo F TollnerAustraliaAmy Elsner RENEWAL
Deepesh U OstroskyUnited KingdomStephen Shaw NEGOTIATION
Frozen Columns
Name
Maisha H Foller
Jennifer F Caldarera
Ricardo R Morasca
Silvio U Slusarski
Leja Q Vocelka
Julie Q Nicka
Ashley X Briddick
Jennifer T Slusarski
Jennifer X Caldarera
Wickens Y Wieser
James M Bolognia
Rodrigues D Shinko
Alejandro W Poquette
Aika N Bowley
Alejandro P Malet
Murillo P Doe
Maisha U Stenseth
Emily F Iturbide
Jennifer U Bowley
Tony B Iturbide
Jennifer R Garufi
Costa G Rim
Morrow R Caldarera
Alejandro Q Glick
Deepesh H Rulapaugh
Maria Q Ruta
Leja V Ferencz
Deepesh E Figeroa
Jefferson N Glick
Adams J Garufi
Jones Q Iturbide
Emily T Gillian
Wickens V Amigon
Jefferson M Perin
Clifford R Slusarski
David N Slusarski
Smith H Rulapaugh
Costa R Morasca
Juan X Waycott
Jones X Rim
Murillo S Caudy
Greenwood M Caldarera
Munro A Venere
Aruna R Stenseth
Julie V Malet
Silvio J Poquette
Julie G Malet
Mayumi Q Stockham
Aika H Wieser
Kadeem G Caudy
IdCountryDate
1000Australia2025-04-23
1001Japan2025-04-29
1002Argentina2025-04-11
1003Germany2025-04-03
1004Argentina2025-04-06
1005India2025-04-30
1006Germany2025-04-28
1007Brazil2025-04-11
1008Japan2025-04-25
1009Spain2025-04-20
1010France2025-04-13
1011Russia2025-04-26
1012Italy2025-04-05
1013Germany2025-04-04
1014Australia2025-04-02
1015Japan2025-04-12
1016Argentina2025-04-07
1017Brazil2025-04-10
1018India2025-04-03
1019United Kingdom2025-04-21
1020Germany2025-04-28
1021Spain2025-04-29
1022Germany2025-04-27
1023Brazil2025-04-03
1024Japan2025-04-09
1025France2025-04-06
1026Brazil2025-04-17
1027Argentina2025-04-21
1028Brazil2025-04-01
1029Canada2025-04-20
1030Argentina2025-04-13
1031Canada2025-04-22
1032Japan2025-04-06
1033United Kingdom2025-04-23
1034Japan2025-04-18
1035Japan2025-04-03
1036Italy2025-04-12
1037France2025-04-30
1038Brazil2025-04-16
1039Germany2025-04-09
1040Argentina2025-04-05
1041Italy2025-04-08
1042Brazil2025-04-14
1043Japan2025-04-02
1044Australia2025-04-20
1045France2025-04-25
1046Argentina2025-04-13
1047Italy2025-04-02
1048United Kingdom2025-04-02
1049United Kingdom2025-04-11

On-Demand Data

NameIdCountryDate
Leja E Morasca1000Argentina2025-04-23
Salvatore E Chui1001Germany2025-04-03
Tony J Oldroyd1002Russia2025-04-26
Rodrigues C Wieser1003Russia2025-04-25
Leon G Rulapaugh1004Spain2025-04-25
Murillo F Oldroyd1005Japan2025-04-27
Julie S Sergi1006Italy2025-04-28
Francesco U Flosi1007Italy2025-04-21
Maisha U Waycott1008Japan2025-04-04
Johnson A Rim1009India2025-04-13
Ricardo G Vocelka1010United Kingdom2025-04-05
Stacey J Rulapaugh1011Brazil2025-04-16
Darci A Chui1012Australia2025-04-10
Mayumi I Albares1013United Kingdom2025-04-23
Maria C Briddick1014Brazil2025-04-13
Cody S Garufi1015Canada2025-04-11
Leja L Waycott1016India2025-04-05
Claire H Nestle1017India2025-04-01
Claire M Darakjy1018Russia2025-04-18
Arvin T Rulapaugh1019United Kingdom2025-04-16
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aditya U StensethRussiaOnyama Limba RENEWAL
Sinclair H WhobreyIndiaBernardo Dominic UNQUALIFIED
Aika W MorascaFranceIvan Magalhaes QUALIFIED
Antonio T FigeroaAustraliaOnyama Limba NEW
Maria L InouyeItalyOnyama Limba NEGOTIATION
Ricardo X ChuiFranceIoni Bowcher RENEWAL
David L MaletGermanyStephen Shaw UNQUALIFIED
Aika N InouyeJapanBernardo Dominic PROPOSAL
Jones R CampainFranceOnyama Limba PROPOSAL
Ricardo J InouyeJapanBernardo Dominic QUALIFIED
Mujtaba T AmigonIndiaBernardo Dominic QUALIFIED
David Y WieserBrazilIoni Bowcher NEW
Cody W StensethGermanyAmy Elsner PROPOSAL
Octavia R GillianSpainIvan Magalhaes PROPOSAL
Smith I BologniaCanadaElwin Sharvill NEGOTIATION
Octavia W ChuiGermanyOnyama Limba PROPOSAL
Claire B StensethFranceIoni Bowcher UNQUALIFIED
Morrow J DoeAustraliaAsiya Javayant PROPOSAL
Darci P SergiItalyIvan Magalhaes UNQUALIFIED
Deepesh Z MacleadArgentinaElwin Sharvill QUALIFIED
Izzy A SlusarskiAustraliaIvan Magalhaes NEGOTIATION
Maisha H KuskoGermanyAnna Fali PROPOSAL
Maria J WieserItalyXuxue Feng UNQUALIFIED
Ricardo F MorascaRussiaIoni Bowcher RENEWAL
Greenwood F MaletIndiaXuxue Feng RENEWAL
Ricardo M TollnerRussiaElwin Sharvill UNQUALIFIED
Cody T MaletItalyOnyama Limba PROPOSAL
Kadeem H CampainCanadaStephen Shaw NEW
Faith D RoysterRussiaBernardo Dominic RENEWAL
Rodrigues G PaprockiGermanyOnyama Limba RENEWAL
Salvatore C FigeroaItalyAnna Fali NEW
Faith Y RoysterBrazilAnna Fali PROPOSAL
Costa L SchemmerCanadaBernardo Dominic PROPOSAL
Morrow F IturbideUnited KingdomAsiya Javayant UNQUALIFIED
Antonio M FerenczBrazilStephen Shaw NEW
Aditya R GauchoFranceAmy Elsner NEW
Salvatore Z MorascaGermanyBernardo Dominic PROPOSAL
Rodrigues N RulapaughGermanyIvan Magalhaes NEGOTIATION
Stacey U FigeroaItalyAsiya Javayant UNQUALIFIED
Maria A FerenczIndiaBernardo Dominic 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>