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
Jeanfrancois P BologniaIndiaIvan Magalhaes NEW
Antonio L CaudyFranceElwin Sharvill PROPOSAL
Leon V FigeroaFranceOnyama Limba UNQUALIFIED
Adams E WhobreyAustraliaAnna Fali QUALIFIED
Francesco V FollerSpainAnna Fali NEGOTIATION
Alejandro W RoysterRussiaAnna Fali PROPOSAL
Jennifer H StensethGermanyIoni Bowcher PROPOSAL
Ricardo B BologniaFranceIvan Magalhaes NEGOTIATION
Clifford Z PoquetteJapanAnna Fali QUALIFIED
Ricardo Y OldroydGermanyIvan Magalhaes NEGOTIATION
Tony B FlosiCanadaIoni Bowcher RENEWAL
Ivar M AlbaresAustraliaAmy Elsner RENEWAL
Kadeem Z SergiCanadaBernardo Dominic NEW
Emily N SlusarskiItalyStephen Shaw NEW
Morrow P ButtItalyXuxue Feng PROPOSAL
Rodrigues A GarufiBrazilOnyama Limba PROPOSAL
Sinclair O GillianGermanyOnyama Limba PROPOSAL
Alejandro P SchemmerItalyBernardo Dominic NEW
Aditya B VocelkaJapanAmy Elsner NEGOTIATION
Jefferson L MaletItalyBernardo Dominic NEGOTIATION
Tony I BologniaJapanOnyama Limba NEW
Francesco U DilliardArgentinaElwin Sharvill NEW
Salvatore Q InouyeJapanIoni Bowcher NEGOTIATION
Adams D NestleJapanElwin Sharvill PROPOSAL
Nicolas M FigeroaRussiaOnyama Limba RENEWAL
Tony A GlickJapanOnyama Limba NEW
Morrow Z BowleyItalyXuxue Feng PROPOSAL
Kaitlin I FollerRussiaAnna Fali QUALIFIED
Clifford V OldroydGermanyStephen Shaw QUALIFIED
Kadeem R ChuiArgentinaElwin Sharvill RENEWAL
Juan O GauchoSpainAnna Fali RENEWAL
Aditya T CaldareraFranceIvan Magalhaes NEGOTIATION
Isabel X VenereRussiaIvan Magalhaes RENEWAL
Maisha E ShinkoRussiaAsiya Javayant UNQUALIFIED
Aika C PaprockiItalyIvan Magalhaes RENEWAL
Adams W FerenczArgentinaBernardo Dominic QUALIFIED
Chavez W DarakjyUnited KingdomIvan Magalhaes NEW
Aditya Y PerinBrazilElwin Sharvill UNQUALIFIED
Ashley H NickaRussiaStephen Shaw PROPOSAL
Deepesh A FlosiJapanOnyama Limba QUALIFIED
Salvatore O VenereAustraliaIoni Bowcher PROPOSAL
David X CaudySpainOnyama Limba NEGOTIATION
Juan V WhobreyJapanAmy Elsner PROPOSAL
Mayumi V PaprockiRussiaOnyama Limba RENEWAL
Clifford I NestleUnited KingdomIoni Bowcher UNQUALIFIED
Arvin P SlusarskiJapanIvan Magalhaes RENEWAL
Johnson Y DoeSpainStephen Shaw PROPOSAL
Jefferson D StockhamFranceAnna Fali UNQUALIFIED
Alejandro L SergiCanadaAsiya Javayant PROPOSAL
Leja U ChuiBrazilIoni Bowcher NEW
Horizontal
NameCountryRepresentativeStatus
Jeanfrancois F MorascaCanadaIvan Magalhaes QUALIFIED
Arvin J AmigonJapanIvan Magalhaes UNQUALIFIED
Adams A DoeItalyOnyama Limba RENEWAL
Jennifer E KuskoFranceXuxue Feng NEGOTIATION
Kadeem J SlusarskiArgentinaAnna Fali QUALIFIED
David F ShinkoJapanAsiya Javayant QUALIFIED
Murillo Q RimCanadaXuxue Feng PROPOSAL
Alejandro T SaylorsArgentinaOnyama Limba RENEWAL
Arvin R SergiUnited KingdomIoni Bowcher RENEWAL
Misaki G BowleyCanadaOnyama Limba NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Izzy L OldroydFrance2025-04-11Truhlar And Truhlar Attys NEGOTIATION20Stephen Shaw
1001Aruna U ShinkoIndia2025-04-28Feiner Bros NEGOTIATION25Elwin Sharvill
1002Alejandro G ShinkoAustralia2025-04-28Chanay, Jeffrey A Esq UNQUALIFIED67Onyama Limba
1003Maisha Y WieserCanada2025-04-14Dorl, James J Esq NEW40Bernardo Dominic
1004Wickens C KuskoFrance2025-04-16Morlong Associates NEGOTIATION28Xuxue Feng
1005Costa D CaudyJapan2025-05-06King, Christopher A Esq RENEWAL45Amy Elsner
1006Ivar E GauchoArgentina2025-04-21Morlong Associates QUALIFIED16Bernardo Dominic
1007Wickens Y CaudyUnited Kingdom2025-04-22Chapman, Ross E Esq NEGOTIATION27Anna Fali
1008Izzy B DilliardAustralia2025-04-17Buckley Miller Wright PROPOSAL42Stephen Shaw
1009Francesco C OldroydAustralia2025-04-25Buckley Miller Wright QUALIFIED84Stephen Shaw
1010Jones J RimAustralia2025-04-13Chemel, James L Cpa RENEWAL42Ivan Magalhaes
1011Greenwood J InouyeSpain2025-04-24Morlong Associates UNQUALIFIED16Asiya Javayant
1012Ricardo M ShinkoSpain2025-05-02Truhlar And Truhlar Attys NEW55Asiya Javayant
1013David F RimRussia2025-05-05Benton, John B Jr PROPOSAL30Stephen Shaw
1014Murillo B MaletRussia2025-05-03Rousseaux, Michael Esq QUALIFIED68Amy Elsner
1015Smith A DarakjyJapan2025-05-03Chapman, Ross E Esq NEGOTIATION87Anna Fali
1016Faith Z KuskoIndia2025-05-03Chemel, James L Cpa UNQUALIFIED82Anna Fali
1017Johnson S WaycottGermany2025-04-07Rousseaux, Michael Esq NEW66Ioni Bowcher
1018Izzy F CaudyBrazil2025-05-02King, Christopher A Esq NEW62Amy Elsner
1019Kadeem M VocelkaJapan2025-04-21Benton, John B Jr QUALIFIED43Onyama Limba
1020Isabel F CampainRussia2025-04-30Feiner Bros RENEWAL87Stephen Shaw
1021Rodrigues O SergiItaly2025-05-05Morlong Associates NEW80Ioni Bowcher
1022Maria E RimUnited Kingdom2025-04-24Rousseaux, Michael Esq QUALIFIED70Elwin Sharvill
1023Maria V FollerUnited Kingdom2025-04-23Dorl, James J Esq RENEWAL97Onyama Limba
1024Smith W PerinArgentina2025-04-19Rangoni Of Florence PROPOSAL78Asiya Javayant
1025Nicolas Q FlosiIndia2025-04-19Buckley Miller Wright RENEWAL36Elwin Sharvill
1026Salvatore H BriddickCanada2025-04-29Morlong Associates UNQUALIFIED54Bernardo Dominic
1027Nicolas Y BriddickArgentina2025-04-22Rangoni Of Florence NEGOTIATION25Ioni Bowcher
1028Antonio A NickaIndia2025-04-14Feltz Printing Service NEW59Ivan Magalhaes
1029Mujtaba P SchemmerSpain2025-05-05Commercial Press NEGOTIATION99Xuxue Feng
1030Antonio J PaprockiRussia2025-04-19Commercial Press NEGOTIATION51Onyama Limba
1031Misaki M SergiSpain2025-05-04Chapman, Ross E Esq PROPOSAL87Xuxue Feng
1032Ivar A CaudyCanada2025-04-22King, Christopher A Esq NEGOTIATION95Amy Elsner
1033Greenwood J SchemmerRussia2025-04-23King, Christopher A Esq NEW85Bernardo Dominic
1034Kaitlin V RulapaughSpain2025-05-03Morlong Associates QUALIFIED72Asiya Javayant
1035David R KolmetzJapan2025-04-24Truhlar And Truhlar Attys UNQUALIFIED86Bernardo Dominic
1036Aruna R DarakjyIndia2025-04-11Benton, John B Jr NEW46Ioni Bowcher
1037Aruna I PerinCanada2025-04-28King, Christopher A Esq RENEWAL80Elwin Sharvill
1038Johnson Z VocelkaItaly2025-05-06Feltz Printing Service NEGOTIATION66Asiya Javayant
1039Emily Y StockhamRussia2025-04-21Morlong Associates NEW85Amy Elsner
1040Ashley V WaycottBrazil2025-05-03Feltz Printing Service NEGOTIATION2Amy Elsner
1041Aditya Y PoquetteGermany2025-04-10Benton, John B Jr NEW47Anna Fali
1042Darci C SlusarskiUnited Kingdom2025-04-14Truhlar And Truhlar Attys QUALIFIED99Onyama Limba
1043Ivar Z FlosiFrance2025-04-10Buckley Miller Wright NEGOTIATION77Bernardo Dominic
1044Alejandro Z StensethFrance2025-05-05Dorl, James J Esq RENEWAL74Elwin Sharvill
1045Maisha H GlickFrance2025-04-08Commercial Press RENEWAL18Elwin Sharvill
1046Octavia W PerinArgentina2025-05-02Rangoni Of Florence NEW41Ioni Bowcher
1047Silvio U NestleItaly2025-05-01Benton, John B Jr NEW83Stephen Shaw
1048Sinclair L SchemmerFrance2025-04-07Chemel, James L Cpa NEW37Ioni Bowcher
1049Sinclair L NestleBrazil2025-04-10Feltz Printing Service PROPOSAL78Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Adams C PaprockiUnited KingdomStephen Shaw NEW
Juan N DilliardArgentinaStephen Shaw NEGOTIATION
Cody M InouyeUnited KingdomAsiya Javayant PROPOSAL
Nicolas X SlusarskiItalyXuxue Feng PROPOSAL
Silvio Q WieserGermanyStephen Shaw NEGOTIATION
Aruna H WieserUnited KingdomIvan Magalhaes NEGOTIATION
Adams W CampainGermanyAmy Elsner QUALIFIED
Smith X RimGermanyIoni Bowcher NEGOTIATION
Maria B FigeroaArgentinaXuxue Feng PROPOSAL
Salvatore W CampainItalyBernardo Dominic PROPOSAL
Jennifer B DoeFranceAnna Fali NEGOTIATION
Silvio Q AlbaresGermanyIvan Magalhaes UNQUALIFIED
Izzy Z BriddickBrazilAnna Fali UNQUALIFIED
Isabel X RoysterGermanyIoni Bowcher NEW
Kadeem N KolmetzGermanyIvan Magalhaes QUALIFIED
Antonio Q IturbideRussiaAsiya Javayant RENEWAL
Izzy P WaycottGermanyIvan Magalhaes PROPOSAL
Maria S WaycottJapanOnyama Limba PROPOSAL
Darci L WhobreyFranceElwin Sharvill PROPOSAL
Smith S KuskoJapanAnna Fali NEGOTIATION
Claire Q RimRussiaOnyama Limba NEGOTIATION
Ricardo L WaycottArgentinaAnna Fali NEGOTIATION
Morrow I BologniaJapanBernardo Dominic UNQUALIFIED
Smith M BowleyFranceAsiya Javayant NEGOTIATION
Leja K MorascaIndiaBernardo Dominic QUALIFIED
Deepesh H CaldareraIndiaOnyama Limba RENEWAL
Maisha J InouyeFranceAsiya Javayant NEGOTIATION
Sinclair I PoquetteFranceXuxue Feng UNQUALIFIED
Darci Y ChuiItalyBernardo Dominic UNQUALIFIED
Leon S CaldareraGermanyIoni Bowcher QUALIFIED
Johnson N ButtUnited KingdomAnna Fali NEW
Greenwood P SergiFranceOnyama Limba UNQUALIFIED
Deepesh I GlickItalyAmy Elsner RENEWAL
Silvio K AlbaresAustraliaElwin Sharvill PROPOSAL
Nicolas O CaudyAustraliaIvan Magalhaes NEW
Nicolas V BriddickIndiaOnyama Limba QUALIFIED
Claire Z BologniaRussiaAsiya Javayant NEGOTIATION
Faith Q StensethSpainIoni Bowcher QUALIFIED
Silvio H BriddickBrazilXuxue Feng PROPOSAL
Darci E GauchoItalyAmy Elsner RENEWAL
Darci I MarrierItalyOnyama Limba NEGOTIATION
Chavez Z FlosiRussiaXuxue Feng UNQUALIFIED
Sinclair Z MaletRussiaAsiya Javayant UNQUALIFIED
Mayumi F StensethAustraliaBernardo Dominic NEW
Aika E NestleItalyAmy Elsner UNQUALIFIED
Ivar A SaylorsIndiaIoni Bowcher PROPOSAL
Aditya M StensethItalyStephen Shaw UNQUALIFIED
Aruna H MacleadFranceXuxue Feng RENEWAL
Ashley B WaycottSpainIvan Magalhaes NEGOTIATION
Costa Q OldroydRussiaElwin Sharvill PROPOSAL
Frozen Columns
Name
Alejandro U Flosi
Jones F Schemmer
Murillo R Dilliard
Nicolas F Malet
Arvin F Ostrosky
Mujtaba O Rim
Francesco J Vocelka
Deepesh X Campain
Juan C Darakjy
Jennifer L Inouye
Darci H Nicka
Mayumi C Malet
Isabel W Kusko
Arvin X Stenseth
Johnson Z Kusko
Adams R Nestle
Misaki G Figeroa
Cody E Nestle
Nicolas D Caudy
Juan G Maclead
Juan Q Wieser
Izzy S Maclead
Salvatore K Rulapaugh
Sinclair S Glick
Misaki B Stenseth
Maisha A Caldarera
Antonio M Stenseth
Jefferson Q Malet
Leon W Maclead
Smith Y Venere
Arvin C Vocelka
Darci X Malet
Smith S Slusarski
Salvatore M Schemmer
Jeanfrancois Z Inouye
Clifford H Foller
Clifford H Morasca
Wickens U Bowley
Stacey P Iturbide
Smith C Foller
Adams B Stenseth
Sinclair M Amigon
Nicolas Q Rim
Chavez X Slusarski
Rodrigues J Amigon
Jennifer J Shinko
Alejandro V Nicka
David B Ferencz
Aika B Inouye
Maisha N Waycott
IdCountryDate
1000Germany2025-05-05
1001Germany2025-05-04
1002Japan2025-04-12
1003Argentina2025-04-23
1004Germany2025-04-25
1005Russia2025-04-19
1006Italy2025-04-26
1007India2025-04-12
1008Russia2025-04-18
1009Japan2025-04-07
1010India2025-04-30
1011Argentina2025-04-28
1012Brazil2025-04-22
1013France2025-04-07
1014France2025-04-23
1015Canada2025-04-24
1016Germany2025-04-23
1017Russia2025-05-05
1018United Kingdom2025-05-05
1019Japan2025-05-02
1020Russia2025-04-28
1021United Kingdom2025-04-26
1022Canada2025-04-15
1023Argentina2025-04-24
1024India2025-04-26
1025Germany2025-04-23
1026Italy2025-04-10
1027Italy2025-04-26
1028France2025-04-11
1029Australia2025-04-12
1030Russia2025-05-03
1031Japan2025-04-11
1032Germany2025-05-01
1033India2025-05-02
1034France2025-04-14
1035Japan2025-05-02
1036France2025-04-15
1037Russia2025-04-25
1038France2025-04-19
1039Germany2025-05-04
1040United Kingdom2025-04-26
1041Japan2025-04-23
1042France2025-04-27
1043Brazil2025-04-20
1044Russia2025-04-11
1045Spain2025-04-25
1046Canada2025-04-23
1047United Kingdom2025-04-11
1048Brazil2025-04-09
1049United Kingdom2025-05-06

On-Demand Data

NameIdCountryDate
Ricardo N Kolmetz1000France2025-05-02
Murillo T Morasca1001Argentina2025-04-16
Rodrigues Q Ruta1002United Kingdom2025-04-11
Emily S Caldarera1003Japan2025-05-03
Clifford G Albares1004Japan2025-04-15
Aika G Oldroyd1005Brazil2025-05-03
Morrow H Ferencz1006Russia2025-04-10
Francesco B Wieser1007Italy2025-04-17
Jefferson W Schemmer1008Brazil2025-04-08
Johnson J Amigon1009India2025-04-21
Clifford V Albares1010Canada2025-04-26
Mayumi N Wieser1011France2025-04-13
Juan Q Caudy1012Germany2025-04-17
Chavez G Venere1013Argentina2025-04-15
Emily A Caudy1014Germany2025-05-05
Greenwood R Royster1015Italy2025-04-19
Izzy E Nestle1016India2025-04-19
Aruna Z Gaucho1017Russia2025-05-01
Smith K Stenseth1018Japan2025-04-16
Claire G Oldroyd1019Spain2025-04-19
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Leja O KolmetzCanadaStephen Shaw PROPOSAL
Alejandro V BriddickIndiaOnyama Limba UNQUALIFIED
Emily V MarrierAustraliaBernardo Dominic PROPOSAL
Isabel Z PerinJapanIoni Bowcher QUALIFIED
Isabel H NestleSpainAnna Fali NEGOTIATION
Jennifer B AlbaresJapanAsiya Javayant PROPOSAL
Murillo I BriddickSpainStephen Shaw NEGOTIATION
James H BriddickSpainAsiya Javayant PROPOSAL
David P KolmetzCanadaAmy Elsner NEGOTIATION
Mayumi F IturbideSpainAnna Fali UNQUALIFIED
Mujtaba T KolmetzJapanElwin Sharvill UNQUALIFIED
Jennifer B DilliardUnited KingdomXuxue Feng UNQUALIFIED
Aditya A VocelkaSpainAsiya Javayant RENEWAL
Stacey N GarufiArgentinaAnna Fali QUALIFIED
Francesco E NestleUnited KingdomElwin Sharvill NEGOTIATION
Isabel O TollnerSpainElwin Sharvill NEW
Antonio A RoysterItalyBernardo Dominic UNQUALIFIED
Deepesh R DoeUnited KingdomStephen Shaw UNQUALIFIED
Chavez Q MorascaSpainXuxue Feng NEW
Maisha J MorascaUnited KingdomOnyama Limba PROPOSAL
Jefferson C WieserGermanyIvan Magalhaes QUALIFIED
Mayumi J FigeroaIndiaXuxue Feng RENEWAL
Johnson E ButtGermanyIvan Magalhaes QUALIFIED
Mayumi J SaylorsIndiaOnyama Limba RENEWAL
Jennifer L RoysterAustraliaAnna Fali UNQUALIFIED
Kaitlin A BriddickUnited KingdomBernardo Dominic UNQUALIFIED
Mayumi O CaldareraUnited KingdomIoni Bowcher RENEWAL
Juan V GlickRussiaIvan Magalhaes NEGOTIATION
Ricardo X FigeroaUnited KingdomAnna Fali QUALIFIED
Maisha N FollerJapanIoni Bowcher QUALIFIED
Tony D SaylorsBrazilIoni Bowcher QUALIFIED
Cody U FollerItalyIoni Bowcher QUALIFIED
Jones X PaprockiJapanElwin Sharvill PROPOSAL
Wickens P SchemmerSpainBernardo Dominic NEGOTIATION
Mayumi L GarufiGermanyAmy Elsner NEGOTIATION
Wickens N ChuiIndiaIvan Magalhaes UNQUALIFIED
Greenwood Z ChuiSpainXuxue Feng NEW
Octavia G FerenczArgentinaAsiya Javayant QUALIFIED
Costa N SergiUnited KingdomOnyama Limba UNQUALIFIED
Julie X RutaFranceAsiya Javayant 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>