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
Costa Y GillianAustraliaIoni Bowcher NEGOTIATION
Clifford S FlosiRussiaAmy Elsner PROPOSAL
Clifford T BologniaSpainStephen Shaw QUALIFIED
Kadeem X BologniaIndiaXuxue Feng RENEWAL
Octavia N StensethJapanOnyama Limba NEW
Alejandro Z FlosiBrazilAsiya Javayant UNQUALIFIED
Jefferson A SergiSpainBernardo Dominic NEGOTIATION
Wickens B NickaJapanStephen Shaw PROPOSAL
Salvatore K SaylorsItalyAmy Elsner NEGOTIATION
Maisha B AmigonJapanIvan Magalhaes UNQUALIFIED
Johnson X DoeSpainStephen Shaw NEGOTIATION
Murillo G AlbaresRussiaXuxue Feng NEW
Murillo I OstroskyAustraliaIoni Bowcher UNQUALIFIED
Aditya K MarrierJapanBernardo Dominic PROPOSAL
Silvio Y WaycottItalyIoni Bowcher QUALIFIED
Wickens G ShinkoSpainAmy Elsner RENEWAL
Francesco D MaletAustraliaAsiya Javayant UNQUALIFIED
Jennifer N FigeroaRussiaStephen Shaw UNQUALIFIED
Ashley E RulapaughSpainStephen Shaw NEGOTIATION
Tony D RoysterJapanIoni Bowcher NEGOTIATION
Chavez Q ChuiFranceXuxue Feng RENEWAL
Munro I MarrierSpainAnna Fali RENEWAL
Wickens P DoeArgentinaBernardo Dominic RENEWAL
Chavez R KolmetzFranceAnna Fali PROPOSAL
Aruna I BowleyItalyIvan Magalhaes UNQUALIFIED
Ivar V DarakjyGermanyOnyama Limba UNQUALIFIED
Greenwood E NestleFranceAsiya Javayant NEGOTIATION
Antonio F DoeBrazilIvan Magalhaes PROPOSAL
Arvin L VenereBrazilBernardo Dominic QUALIFIED
Ashley U ChuiAustraliaStephen Shaw NEGOTIATION
Misaki T AlbaresUnited KingdomAnna Fali RENEWAL
Maisha B BriddickSpainIoni Bowcher UNQUALIFIED
Sinclair R GlickAustraliaAnna Fali PROPOSAL
Izzy B SaylorsItalyIoni Bowcher QUALIFIED
Leon K GlickFranceIoni Bowcher QUALIFIED
Ashley A MaletIndiaIvan Magalhaes RENEWAL
Juan A GillianRussiaAnna Fali RENEWAL
Mayumi V RoysterUnited KingdomXuxue Feng QUALIFIED
Chavez F WaycottItalyXuxue Feng NEGOTIATION
Sinclair F GlickFranceAnna Fali QUALIFIED
Jennifer E PaprockiBrazilElwin Sharvill RENEWAL
Maisha A NickaCanadaIvan Magalhaes NEGOTIATION
Silvio L SergiBrazilXuxue Feng NEGOTIATION
Greenwood H NickaBrazilAsiya Javayant NEGOTIATION
Greenwood S FlosiGermanyElwin Sharvill NEGOTIATION
Deepesh M AlbaresGermanyAsiya Javayant PROPOSAL
Francesco X NickaAustraliaAnna Fali RENEWAL
Cody K AlbaresGermanyOnyama Limba QUALIFIED
Greenwood D RutaUnited KingdomIvan Magalhaes RENEWAL
Leja G PerinGermanyAsiya Javayant UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Chavez W RulapaughJapanIvan Magalhaes QUALIFIED
Clifford C FigeroaIndiaAmy Elsner QUALIFIED
Francesco Z RulapaughCanadaAmy Elsner QUALIFIED
Morrow M OldroydGermanyOnyama Limba PROPOSAL
Octavia T OldroydGermanyOnyama Limba QUALIFIED
Izzy Q PaprockiFranceAnna Fali UNQUALIFIED
Stacey Q FollerGermanyAmy Elsner NEGOTIATION
Mujtaba Q KolmetzUnited KingdomIvan Magalhaes RENEWAL
Arvin A InouyeJapanOnyama Limba NEGOTIATION
Maisha O CaldareraSpainElwin Sharvill PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Deepesh P CaldareraGermany2025-06-08Benton, John B Jr RENEWAL35Asiya Javayant
1001Aditya H RoysterRussia2025-06-01Feiner Bros QUALIFIED6Bernardo Dominic
1002Johnson Q FerenczBrazil2025-05-22Rangoni Of Florence NEW82Bernardo Dominic
1003Kadeem Z RulapaughAustralia2025-06-01Feltz Printing Service UNQUALIFIED49Ivan Magalhaes
1004Murillo F TollnerItaly2025-06-15Printing Dimensions QUALIFIED40Anna Fali
1005Ivar F BologniaRussia2025-05-21Feltz Printing Service UNQUALIFIED42Onyama Limba
1006Morrow J FlosiSpain2025-05-22Morlong Associates UNQUALIFIED41Bernardo Dominic
1007Antonio Y InouyeBrazil2025-06-08King, Christopher A Esq QUALIFIED37Stephen Shaw
1008Ricardo G DarakjyRussia2025-05-24Feiner Bros UNQUALIFIED10Asiya Javayant
1009Munro G DoeJapan2025-05-28Chemel, James L Cpa QUALIFIED35Amy Elsner
1010Aditya V MorascaFrance2025-05-28Feiner Bros PROPOSAL59Bernardo Dominic
1011Kaitlin D StockhamJapan2025-06-14Chemel, James L Cpa RENEWAL16Amy Elsner
1012Alejandro S GlickGermany2025-06-12Feltz Printing Service NEW84Amy Elsner
1013Chavez Y ShinkoCanada2025-06-14Chanay, Jeffrey A Esq NEW57Anna Fali
1014Aika Q DoeJapan2025-05-19Commercial Press QUALIFIED49Asiya Javayant
1015Cody X InouyeArgentina2025-05-28Chemel, James L Cpa QUALIFIED65Stephen Shaw
1016Emily F RoysterCanada2025-06-10Buckley Miller Wright PROPOSAL6Ivan Magalhaes
1017Maisha N GauchoBrazil2025-05-20King, Christopher A Esq RENEWAL41Amy Elsner
1018Juan J MacleadRussia2025-06-04Chanay, Jeffrey A Esq NEGOTIATION64Bernardo Dominic
1019Maria N CampainSpain2025-06-11Benton, John B Jr QUALIFIED22Asiya Javayant
1020Mujtaba V PaprockiUnited Kingdom2025-06-14Dorl, James J Esq PROPOSAL92Ivan Magalhaes
1021Ivar E TollnerJapan2025-05-17Chemel, James L Cpa PROPOSAL33Onyama Limba
1022Antonio N BologniaRussia2025-06-13Rangoni Of Florence NEW9Asiya Javayant
1023Antonio O FigeroaArgentina2025-06-09Morlong Associates UNQUALIFIED59Xuxue Feng
1024Munro D ButtBrazil2025-06-15Chemel, James L Cpa NEW26Amy Elsner
1025Alejandro A MarrierIndia2025-05-27Truhlar And Truhlar Attys NEW84Onyama Limba
1026Juan A PaprockiItaly2025-05-27Printing Dimensions NEGOTIATION11Ioni Bowcher
1027Antonio D ShinkoGermany2025-06-11Feiner Bros QUALIFIED56Ioni Bowcher
1028Emily V FigeroaBrazil2025-05-28Printing Dimensions UNQUALIFIED49Xuxue Feng
1029Leon S SlusarskiIndia2025-05-31Printing Dimensions QUALIFIED51Ivan Magalhaes
1030Izzy K VocelkaIndia2025-05-31King, Christopher A Esq NEW31Elwin Sharvill
1031Munro F WhobreyItaly2025-06-12Feltz Printing Service QUALIFIED56Bernardo Dominic
1032Octavia Z WaycottBrazil2025-06-11Feltz Printing Service UNQUALIFIED73Anna Fali
1033Arvin L AlbaresFrance2025-05-26Feltz Printing Service UNQUALIFIED78Onyama Limba
1034Chavez W NestleUnited Kingdom2025-05-29Chapman, Ross E Esq UNQUALIFIED82Bernardo Dominic
1035Rodrigues K GillianUnited Kingdom2025-05-20Rangoni Of Florence QUALIFIED2Xuxue Feng
1036Morrow F WhobreyUnited Kingdom2025-05-23Feiner Bros PROPOSAL47Bernardo Dominic
1037Antonio G RutaGermany2025-05-31Feltz Printing Service QUALIFIED18Stephen Shaw
1038Maisha Y CaldareraJapan2025-06-15Dorl, James J Esq PROPOSAL85Elwin Sharvill
1039Sinclair U WieserCanada2025-06-02Benton, John B Jr UNQUALIFIED5Ioni Bowcher
1040Silvio T DoeFrance2025-05-23Feiner Bros NEW85Bernardo Dominic
1041Tony H SergiSpain2025-06-05Rousseaux, Michael Esq PROPOSAL11Onyama Limba
1042Darci C BologniaFrance2025-05-29Feltz Printing Service PROPOSAL92Onyama Limba
1043Sinclair I WhobreyCanada2025-06-14Morlong Associates NEW68Anna Fali
1044James C CaudyAustralia2025-06-10King, Christopher A Esq QUALIFIED12Ivan Magalhaes
1045James G CaldareraArgentina2025-05-26Chapman, Ross E Esq PROPOSAL92Stephen Shaw
1046Francesco X StensethItaly2025-05-21Rangoni Of Florence QUALIFIED80Xuxue Feng
1047Rodrigues Y ButtRussia2025-06-11Printing Dimensions RENEWAL90Asiya Javayant
1048Adams G KuskoBrazil2025-06-14Feltz Printing Service RENEWAL44Stephen Shaw
1049Darci A InouyeIndia2025-06-09Dorl, James J Esq UNQUALIFIED18Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Octavia O ShinkoSpainBernardo Dominic QUALIFIED
Clifford W RoysterAustraliaIoni Bowcher NEW
Leon J TollnerJapanXuxue Feng NEW
Tony M GillianBrazilOnyama Limba PROPOSAL
Salvatore H BowleySpainOnyama Limba QUALIFIED
Octavia E AmigonGermanyXuxue Feng UNQUALIFIED
Smith Y MaletUnited KingdomAmy Elsner NEGOTIATION
Juan Y KuskoBrazilIvan Magalhaes PROPOSAL
Emily Z BriddickUnited KingdomAsiya Javayant QUALIFIED
Antonio N NestleUnited KingdomAmy Elsner RENEWAL
Mayumi O PoquetteIndiaOnyama Limba PROPOSAL
Emily O ButtSpainAmy Elsner QUALIFIED
Francesco Q GarufiArgentinaAsiya Javayant RENEWAL
Ivar U FollerItalyIoni Bowcher UNQUALIFIED
Antonio C MaletBrazilIoni Bowcher NEW
Octavia A GlickJapanOnyama Limba NEGOTIATION
David H VocelkaSpainXuxue Feng NEGOTIATION
Ivar I RutaFranceStephen Shaw NEW
Murillo U KuskoGermanyIoni Bowcher UNQUALIFIED
Isabel P PoquetteUnited KingdomElwin Sharvill NEGOTIATION
Maisha V WieserFranceOnyama Limba QUALIFIED
Maria Z MacleadSpainAnna Fali RENEWAL
Juan T VenereSpainAnna Fali UNQUALIFIED
Antonio F FerenczJapanIvan Magalhaes PROPOSAL
Adams V IturbideCanadaOnyama Limba NEGOTIATION
Jefferson T FigeroaArgentinaXuxue Feng NEGOTIATION
Adams K MorascaAustraliaBernardo Dominic NEGOTIATION
James M CampainArgentinaStephen Shaw NEW
Deepesh B OstroskyRussiaIvan Magalhaes RENEWAL
Jefferson D MarrierSpainAnna Fali QUALIFIED
Munro D CampainArgentinaIvan Magalhaes UNQUALIFIED
Isabel Z KolmetzIndiaIvan Magalhaes QUALIFIED
Julie Q RulapaughItalyElwin Sharvill NEGOTIATION
Aruna M CampainBrazilOnyama Limba QUALIFIED
Nicolas Y SergiItalyStephen Shaw QUALIFIED
Jennifer O DarakjyGermanyAsiya Javayant NEW
Ivar M StockhamUnited KingdomAmy Elsner NEW
Wickens T BriddickArgentinaOnyama Limba UNQUALIFIED
Claire G SchemmerAustraliaIoni Bowcher NEW
Claire H KuskoJapanAnna Fali NEW
Deepesh H PerinGermanyElwin Sharvill NEGOTIATION
Stacey X DilliardArgentinaAmy Elsner NEGOTIATION
Mayumi F MarrierGermanyStephen Shaw NEW
Jones V MarrierCanadaAsiya Javayant NEGOTIATION
Johnson J SergiSpainAsiya Javayant NEGOTIATION
Antonio P SchemmerCanadaAmy Elsner PROPOSAL
Nicolas S GauchoItalyXuxue Feng UNQUALIFIED
Isabel F VenereItalyIoni Bowcher NEGOTIATION
Kaitlin N MarrierBrazilAnna Fali PROPOSAL
Chavez L MaletGermanyBernardo Dominic RENEWAL
Frozen Columns
Name
Antonio Z Doe
Ricardo P Rulapaugh
Izzy Q Rulapaugh
Maisha Q Kolmetz
Izzy M Stenseth
Darci W Kolmetz
Izzy N Stenseth
Rodrigues M Venere
Tony G Kolmetz
Ashley S Butt
Jones K Sergi
Silvio M Ostrosky
Julie N Caudy
Mayumi Y Shinko
Chavez J Paprocki
Julie D Slusarski
Francesco X Stenseth
Darci Y Whobrey
Murillo C Perin
Stacey X Chui
Johnson G Amigon
Mujtaba H Vocelka
Julie G Figeroa
Jennifer W Bowley
Kaitlin U Shinko
Kadeem H Paprocki
Jeanfrancois M Albares
Maria N Inouye
Murillo H Shinko
Rodrigues I Inouye
Jennifer B Bowley
Nicolas M Waycott
Faith B Butt
Maisha I Morasca
Jones A Perin
Aditya B Doe
Rodrigues O Ruta
Izzy P Stockham
Munro C Dilliard
Antonio B Ostrosky
Ricardo F Malet
Rodrigues S Maclead
Alejandro V Slusarski
Cody S Morasca
Leon Q Schemmer
Cody V Dilliard
Deepesh X Slusarski
Sinclair C Sergi
Ashley O Tollner
Jeanfrancois I Maclead
IdCountryDate
1000India2025-06-05
1001Brazil2025-06-13
1002Brazil2025-05-17
1003Italy2025-06-08
1004Argentina2025-05-26
1005Russia2025-05-21
1006Brazil2025-05-23
1007Italy2025-05-21
1008Australia2025-05-29
1009Russia2025-05-22
1010Germany2025-06-07
1011Germany2025-05-28
1012Russia2025-05-26
1013France2025-05-30
1014Argentina2025-05-30
1015Canada2025-06-14
1016United Kingdom2025-05-17
1017Russia2025-05-21
1018Australia2025-06-13
1019Argentina2025-06-07
1020France2025-06-14
1021Canada2025-06-03
1022Germany2025-06-04
1023Japan2025-05-17
1024Germany2025-05-30
1025Russia2025-06-02
1026Japan2025-05-21
1027Spain2025-06-01
1028Russia2025-05-28
1029United Kingdom2025-05-17
1030Australia2025-06-02
1031Russia2025-06-08
1032India2025-05-23
1033Germany2025-06-11
1034Brazil2025-05-24
1035Argentina2025-06-13
1036India2025-05-17
1037United Kingdom2025-05-22
1038United Kingdom2025-05-24
1039Australia2025-06-04
1040United Kingdom2025-06-03
1041Italy2025-06-08
1042Australia2025-05-21
1043Germany2025-05-29
1044India2025-06-08
1045Germany2025-05-20
1046Canada2025-05-28
1047Russia2025-05-17
1048France2025-05-30
1049France2025-05-23

On-Demand Data

NameIdCountryDate
Misaki G Campain1000Spain2025-05-30
Arvin F Iturbide1001Japan2025-06-04
Jennifer R Butt1002Australia2025-05-30
Isabel P Gillian1003United Kingdom2025-05-22
Julie E Amigon1004United Kingdom2025-06-02
Misaki H Malet1005Australia2025-06-09
Leja S Waycott1006Italy2025-06-10
Morrow C Slusarski1007Russia2025-06-06
Morrow C Morasca1008Russia2025-05-31
Greenwood U Kusko1009Spain2025-06-13
Aditya M Darakjy1010Russia2025-05-17
Arvin X Flosi1011Germany2025-05-19
Stacey N Schemmer1012Russia2025-06-03
Adams X Nicka1013Russia2025-06-12
Aditya Z Kusko1014Australia2025-06-05
Ivar F Waycott1015Argentina2025-05-22
Jeanfrancois T Darakjy1016Germany2025-06-03
Jefferson M Bowley1017Canada2025-06-15
Darci U Malet1018Italy2025-06-13
Maisha O Figeroa1019Russia2025-06-12
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Izzy Y ShinkoFranceElwin Sharvill NEGOTIATION
David O MorascaAustraliaElwin Sharvill NEGOTIATION
Juan G OldroydItalyXuxue Feng RENEWAL
Clifford L DarakjyArgentinaElwin Sharvill NEW
Octavia C CampainArgentinaAsiya Javayant NEW
Ashley J DilliardAustraliaElwin Sharvill PROPOSAL
Julie X CaudyRussiaOnyama Limba NEW
Antonio Z MorascaBrazilIvan Magalhaes NEGOTIATION
Stacey Q NickaAustraliaOnyama Limba QUALIFIED
Aditya I BriddickJapanOnyama Limba QUALIFIED
Clifford Q VenereItalyAnna Fali QUALIFIED
Tony T NickaRussiaIoni Bowcher RENEWAL
Claire N CaldareraRussiaAmy Elsner UNQUALIFIED
Juan X FigeroaBrazilStephen Shaw UNQUALIFIED
Munro K PerinRussiaBernardo Dominic UNQUALIFIED
Ashley Q SchemmerUnited KingdomAmy Elsner NEW
Misaki O MaletFranceAnna Fali PROPOSAL
Ashley P NickaAustraliaIvan Magalhaes NEGOTIATION
Aruna E OldroydRussiaIoni Bowcher NEGOTIATION
Francesco M RutaFranceAmy Elsner NEW
Chavez R OstroskyFranceXuxue Feng RENEWAL
Morrow N AlbaresRussiaBernardo Dominic UNQUALIFIED
Aditya C FigeroaItalyXuxue Feng PROPOSAL
Misaki E WaycottAustraliaAmy Elsner NEW
Clifford G WieserCanadaXuxue Feng RENEWAL
Antonio I AmigonIndiaAmy Elsner UNQUALIFIED
Maria C GauchoAustraliaStephen Shaw QUALIFIED
Aika S RoysterRussiaAnna Fali RENEWAL
Francesco G ButtGermanyOnyama Limba PROPOSAL
Wickens B MacleadGermanyIvan Magalhaes QUALIFIED
Jefferson H SchemmerSpainElwin Sharvill NEW
Juan Q ShinkoJapanOnyama Limba RENEWAL
Misaki S VenereSpainBernardo Dominic NEGOTIATION
Murillo Q InouyeGermanyBernardo Dominic NEGOTIATION
Deepesh F FerenczIndiaOnyama Limba RENEWAL
Claire W RulapaughItalyAmy Elsner QUALIFIED
Clifford Y DilliardSpainXuxue Feng NEW
Kaitlin J FlosiGermanyElwin Sharvill PROPOSAL
Aruna P IturbideSpainAnna Fali UNQUALIFIED
Claire Z CaudyIndiaElwin Sharvill 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>