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
Claire J IturbideArgentinaElwin Sharvill NEGOTIATION
Francesco U StockhamRussiaIvan Magalhaes NEGOTIATION
Aika I RulapaughGermanyOnyama Limba NEW
Maria R AlbaresFranceOnyama Limba NEW
Salvatore W BologniaGermanyBernardo Dominic NEW
Emily K VenereFranceStephen Shaw NEW
Maisha T GillianIndiaXuxue Feng NEGOTIATION
Antonio H CaudyBrazilStephen Shaw UNQUALIFIED
Antonio A StensethItalyStephen Shaw NEW
Stacey W AmigonUnited KingdomOnyama Limba PROPOSAL
Ivar A TollnerGermanyAsiya Javayant UNQUALIFIED
Aruna U RimArgentinaOnyama Limba UNQUALIFIED
Salvatore K PerinCanadaAsiya Javayant NEGOTIATION
Tony X KuskoUnited KingdomStephen Shaw QUALIFIED
Silvio B GarufiCanadaAnna Fali PROPOSAL
Kadeem P RoysterBrazilXuxue Feng UNQUALIFIED
Faith I PoquetteCanadaXuxue Feng NEGOTIATION
Isabel X SlusarskiFranceAsiya Javayant UNQUALIFIED
James Z DoeUnited KingdomAnna Fali QUALIFIED
Adams P AlbaresGermanyStephen Shaw QUALIFIED
Faith G RimJapanIoni Bowcher PROPOSAL
Ivar K GillianBrazilAmy Elsner NEGOTIATION
Julie A GillianUnited KingdomAnna Fali NEGOTIATION
Kaitlin J FigeroaFranceStephen Shaw QUALIFIED
Maisha G GauchoRussiaIvan Magalhaes QUALIFIED
Aika W BowleyFranceAsiya Javayant QUALIFIED
Johnson S SaylorsJapanAsiya Javayant RENEWAL
Francesco Z FerenczItalyAmy Elsner UNQUALIFIED
Jennifer D CaudyIndiaIvan Magalhaes QUALIFIED
Kaitlin B DarakjyUnited KingdomIvan Magalhaes NEGOTIATION
Chavez R AlbaresAustraliaIvan Magalhaes NEW
Clifford W ShinkoSpainXuxue Feng UNQUALIFIED
Wickens W CampainIndiaIoni Bowcher QUALIFIED
Alejandro H SergiBrazilBernardo Dominic NEW
Darci V GlickJapanIvan Magalhaes NEGOTIATION
Leja Z IturbideAustraliaElwin Sharvill RENEWAL
Juan H DoeGermanyAnna Fali UNQUALIFIED
Maisha O GillianFranceXuxue Feng RENEWAL
Mayumi X BologniaFranceBernardo Dominic PROPOSAL
Rodrigues C BriddickAustraliaIoni Bowcher NEGOTIATION
Stacey P OldroydBrazilIvan Magalhaes NEW
Morrow R FigeroaRussiaIoni Bowcher RENEWAL
Kadeem J WhobreyItalyElwin Sharvill RENEWAL
Smith D KolmetzRussiaIoni Bowcher NEW
Julie M BowleyArgentinaElwin Sharvill PROPOSAL
Jefferson T TollnerFranceAsiya Javayant RENEWAL
James L CaudyRussiaElwin Sharvill QUALIFIED
Cody V WhobreyIndiaIoni Bowcher PROPOSAL
Aika L PoquetteSpainAnna Fali NEW
Aruna D ShinkoBrazilIvan Magalhaes QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Misaki M OstroskyJapanIoni Bowcher QUALIFIED
Octavia X OldroydBrazilStephen Shaw NEGOTIATION
Costa E DarakjyArgentinaBernardo Dominic RENEWAL
Ricardo C VenereArgentinaIoni Bowcher QUALIFIED
Francesco W DilliardItalyXuxue Feng NEW
Murillo L WieserArgentinaElwin Sharvill QUALIFIED
Antonio L GauchoFranceXuxue Feng NEGOTIATION
Darci F DilliardCanadaAmy Elsner NEGOTIATION
Mayumi V VenereAustraliaAnna Fali QUALIFIED
Izzy Y ButtUnited KingdomOnyama Limba NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Faith A PoquetteGermany2025-06-04Feiner Bros NEGOTIATION62Amy Elsner
1001Rodrigues W PerinIndia2025-06-02Rangoni Of Florence RENEWAL12Ioni Bowcher
1002Octavia L SaylorsAustralia2025-05-25Printing Dimensions NEGOTIATION51Bernardo Dominic
1003Maisha M RutaUnited Kingdom2025-06-02Commercial Press PROPOSAL64Elwin Sharvill
1004Munro G InouyeFrance2025-05-28King, Christopher A Esq UNQUALIFIED6Stephen Shaw
1005Francesco E ShinkoAustralia2025-06-16Chemel, James L Cpa UNQUALIFIED3Bernardo Dominic
1006Silvio R FollerRussia2025-05-30Buckley Miller Wright RENEWAL54Anna Fali
1007Sinclair R MaletGermany2025-05-20Feltz Printing Service NEW44Elwin Sharvill
1008Silvio Q BologniaItaly2025-06-13Chemel, James L Cpa PROPOSAL45Asiya Javayant
1009Kadeem C OldroydBrazil2025-06-05Chanay, Jeffrey A Esq NEGOTIATION75Ioni Bowcher
1010Isabel H BowleyRussia2025-06-01Morlong Associates QUALIFIED34Ivan Magalhaes
1011Kaitlin X AlbaresAustralia2025-06-11Chemel, James L Cpa NEW93Elwin Sharvill
1012David S MarrierFrance2025-05-25Dorl, James J Esq PROPOSAL25Onyama Limba
1013Misaki B DarakjyGermany2025-05-19Benton, John B Jr PROPOSAL15Onyama Limba
1014Smith U OldroydAustralia2025-06-01King, Christopher A Esq QUALIFIED59Stephen Shaw
1015Mayumi K GlickItaly2025-06-07Commercial Press QUALIFIED26Bernardo Dominic
1016Aditya K AmigonSpain2025-06-16Chapman, Ross E Esq NEGOTIATION81Onyama Limba
1017Darci Q RimIndia2025-06-06Rangoni Of Florence UNQUALIFIED38Bernardo Dominic
1018Wickens V PerinFrance2025-06-02Morlong Associates NEGOTIATION65Bernardo Dominic
1019Misaki V RoysterIndia2025-06-08Chemel, James L Cpa NEGOTIATION68Asiya Javayant
1020Cody L StensethItaly2025-05-25Buckley Miller Wright NEGOTIATION27Stephen Shaw
1021Johnson V SaylorsBrazil2025-05-24Rousseaux, Michael Esq PROPOSAL90Amy Elsner
1022Chavez H BologniaAustralia2025-05-31Feltz Printing Service NEGOTIATION99Amy Elsner
1023Aika C PerinAustralia2025-05-25Morlong Associates NEW6Onyama Limba
1024Mayumi I AlbaresRussia2025-06-05Chemel, James L Cpa NEGOTIATION94Stephen Shaw
1025Sinclair O RulapaughArgentina2025-06-08Rangoni Of Florence NEW34Bernardo Dominic
1026Isabel W WhobreySpain2025-06-15Buckley Miller Wright QUALIFIED83Elwin Sharvill
1027Chavez E GauchoCanada2025-06-02Truhlar And Truhlar Attys UNQUALIFIED57Asiya Javayant
1028Silvio F PerinArgentina2025-05-29Chanay, Jeffrey A Esq RENEWAL94Asiya Javayant
1029Antonio W MacleadAustralia2025-06-03Printing Dimensions UNQUALIFIED9Anna Fali
1030Stacey A FollerUnited Kingdom2025-06-14Feltz Printing Service NEGOTIATION40Bernardo Dominic
1031Mayumi C RulapaughFrance2025-05-24Rousseaux, Michael Esq UNQUALIFIED40Bernardo Dominic
1032Maria Y BologniaUnited Kingdom2025-06-07Benton, John B Jr PROPOSAL85Xuxue Feng
1033Morrow Z MaletItaly2025-06-07Benton, John B Jr PROPOSAL76Bernardo Dominic
1034Silvio C GauchoJapan2025-05-24Feltz Printing Service NEW14Amy Elsner
1035Aruna R BowleySpain2025-06-15Chapman, Ross E Esq NEGOTIATION53Ioni Bowcher
1036Jeanfrancois T ShinkoAustralia2025-05-24Chanay, Jeffrey A Esq NEGOTIATION9Xuxue Feng
1037Claire Z StockhamFrance2025-06-02Benton, John B Jr NEGOTIATION24Onyama Limba
1038Adams H SergiIndia2025-06-10Chapman, Ross E Esq QUALIFIED56Xuxue Feng
1039David M VenereGermany2025-05-22Chapman, Ross E Esq PROPOSAL84Anna Fali
1040Salvatore W WhobreyJapan2025-05-19Dorl, James J Esq QUALIFIED11Onyama Limba
1041Jones A GlickJapan2025-06-13Dorl, James J Esq NEW37Amy Elsner
1042Claire Q VocelkaSpain2025-05-29Truhlar And Truhlar Attys NEW52Amy Elsner
1043James H KuskoIndia2025-06-12Rousseaux, Michael Esq RENEWAL87Bernardo Dominic
1044Francesco L TollnerRussia2025-06-13Chanay, Jeffrey A Esq PROPOSAL48Stephen Shaw
1045Misaki R TollnerFrance2025-05-26Commercial Press QUALIFIED19Ivan Magalhaes
1046Misaki A StockhamRussia2025-06-12Feiner Bros RENEWAL20Onyama Limba
1047Leja J CaldareraIndia2025-06-13King, Christopher A Esq QUALIFIED24Anna Fali
1048Silvio G KolmetzJapan2025-06-11Truhlar And Truhlar Attys NEW76Elwin Sharvill
1049Leja H DilliardArgentina2025-06-12King, Christopher A Esq QUALIFIED95Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Murillo P InouyeIndiaXuxue Feng PROPOSAL
Cody R MaletFranceXuxue Feng NEW
Rodrigues Y AmigonArgentinaAnna Fali RENEWAL
Izzy P CaudyGermanyStephen Shaw NEGOTIATION
Misaki Q OldroydItalyElwin Sharvill NEGOTIATION
Francesco D PoquetteArgentinaAsiya Javayant UNQUALIFIED
Faith T MaletCanadaElwin Sharvill QUALIFIED
Misaki B OstroskyUnited KingdomElwin Sharvill PROPOSAL
Juan H CaldareraUnited KingdomXuxue Feng PROPOSAL
Stacey B KolmetzGermanyIoni Bowcher NEW
Kadeem J GauchoRussiaAsiya Javayant PROPOSAL
Darci C WieserIndiaIoni Bowcher RENEWAL
Tony R FerenczCanadaXuxue Feng UNQUALIFIED
Nicolas P MaletRussiaBernardo Dominic NEW
Faith I ButtItalyAnna Fali QUALIFIED
James Z CaudyUnited KingdomOnyama Limba UNQUALIFIED
Izzy P NestleUnited KingdomBernardo Dominic UNQUALIFIED
Costa O RoysterItalyIoni Bowcher RENEWAL
Jeanfrancois D OstroskyRussiaElwin Sharvill RENEWAL
Silvio R WaycottArgentinaAnna Fali UNQUALIFIED
Kaitlin V RimFranceOnyama Limba UNQUALIFIED
Claire G DarakjyIndiaBernardo Dominic QUALIFIED
Leon H BologniaArgentinaAnna Fali NEW
Ivar S WhobreyCanadaAsiya Javayant RENEWAL
Emily E GlickSpainElwin Sharvill UNQUALIFIED
Darci X NestleUnited KingdomBernardo Dominic UNQUALIFIED
Kadeem Z WieserBrazilAmy Elsner NEGOTIATION
Mayumi U SaylorsArgentinaBernardo Dominic RENEWAL
Jones W NestleJapanStephen Shaw QUALIFIED
Arvin H BriddickCanadaIvan Magalhaes PROPOSAL
Arvin V BriddickGermanyIvan Magalhaes RENEWAL
Nicolas D VenereJapanIvan Magalhaes RENEWAL
Munro Q ButtArgentinaIoni Bowcher NEGOTIATION
Emily G FigeroaBrazilBernardo Dominic PROPOSAL
Izzy L DilliardFranceAsiya Javayant NEGOTIATION
Mayumi G AmigonItalyStephen Shaw NEW
Leon O MacleadGermanyStephen Shaw NEW
Mayumi Y MorascaBrazilElwin Sharvill PROPOSAL
Rodrigues U SchemmerIndiaXuxue Feng NEGOTIATION
Mayumi F DilliardItalyAmy Elsner UNQUALIFIED
Jones O SchemmerArgentinaXuxue Feng RENEWAL
Emily U StockhamIndiaStephen Shaw QUALIFIED
Kaitlin O StensethUnited KingdomIvan Magalhaes UNQUALIFIED
Silvio F DoeGermanyOnyama Limba NEGOTIATION
Aruna A OstroskySpainIvan Magalhaes RENEWAL
Leja Z CaldareraSpainXuxue Feng RENEWAL
Ivar L WieserBrazilElwin Sharvill QUALIFIED
Izzy T FlosiUnited KingdomAmy Elsner NEW
Darci S StensethFranceStephen Shaw UNQUALIFIED
David B DarakjyAustraliaOnyama Limba UNQUALIFIED
Frozen Columns
Name
Kadeem A Wieser
Faith A Perin
Aika U Perin
Darci G Kolmetz
Alejandro J Amigon
Jones C Garufi
Francesco V Slusarski
Munro A Chui
Leja L Rulapaugh
Nicolas A Figeroa
Faith V Gillian
James U Ruta
Jennifer K Poquette
Clifford G Oldroyd
Aditya O Marrier
Jennifer Q Perin
Isabel V Wieser
Tony M Doe
Leon M Glick
Jefferson J Iturbide
Misaki Y Gillian
Stacey S Rim
Misaki M Gillian
Ashley A Stockham
Munro C Slusarski
Cody Q Gillian
Johnson G Marrier
Leon K Perin
Emily Q Bowley
Nicolas M Darakjy
Ricardo T Malet
Clifford W Stenseth
Darci J Wieser
Stacey V Figeroa
Clifford D Maclead
Octavia J Figeroa
James M Shinko
Cody E Dilliard
Maisha V Ruta
David N Perin
Isabel L Waycott
Deepesh C Slusarski
Murillo F Nestle
Jefferson D Poquette
Tony R Ostrosky
Chavez W Venere
Alejandro L Nicka
Smith I Ostrosky
Darci W Gillian
Costa D Schemmer
IdCountryDate
1000France2025-05-22
1001Italy2025-06-11
1002France2025-05-22
1003Russia2025-06-07
1004Russia2025-05-23
1005Spain2025-06-14
1006Russia2025-05-30
1007Italy2025-05-23
1008Italy2025-06-16
1009Japan2025-05-23
1010Spain2025-05-20
1011Japan2025-06-01
1012Russia2025-06-09
1013France2025-05-31
1014Australia2025-06-01
1015Japan2025-06-13
1016United Kingdom2025-06-12
1017India2025-06-07
1018Brazil2025-05-19
1019United Kingdom2025-05-20
1020Canada2025-06-06
1021Russia2025-05-27
1022Canada2025-06-07
1023Canada2025-06-06
1024Canada2025-06-02
1025Australia2025-06-07
1026Argentina2025-05-26
1027Spain2025-05-21
1028Argentina2025-05-30
1029Argentina2025-06-02
1030India2025-06-16
1031Russia2025-05-27
1032India2025-05-31
1033France2025-05-24
1034Japan2025-06-02
1035Canada2025-06-14
1036India2025-05-30
1037Spain2025-06-03
1038Canada2025-06-15
1039Russia2025-05-30
1040Spain2025-06-11
1041Australia2025-05-22
1042Argentina2025-06-03
1043Argentina2025-06-10
1044United Kingdom2025-05-27
1045India2025-06-03
1046Japan2025-06-07
1047Brazil2025-06-16
1048United Kingdom2025-05-29
1049France2025-06-02

On-Demand Data

NameIdCountryDate
Claire T Ferencz1000Canada2025-06-15
Maria M Kolmetz1001Brazil2025-05-28
Faith F Royster1002Russia2025-05-24
Cody G Nicka1003India2025-06-03
Octavia G Butt1004Germany2025-06-13
Adams O Flosi1005United Kingdom2025-05-25
Tony O Iturbide1006Germany2025-05-21
Octavia F Caldarera1007Brazil2025-06-06
Juan T Dilliard1008Japan2025-05-23
Tony B Inouye1009France2025-05-18
Sinclair Q Ferencz1010Italy2025-06-10
Aruna Q Caudy1011Brazil2025-06-03
Adams I Caudy1012Germany2025-05-21
Aika V Bowley1013Japan2025-06-02
Maisha B Caudy1014Russia2025-06-11
Smith K Slusarski1015Canada2025-06-12
Greenwood W Caldarera1016Germany2025-06-03
Izzy X Paprocki1017Japan2025-06-13
Mujtaba K Figeroa1018Brazil2025-06-09
Ivar V Oldroyd1019Russia2025-05-26
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Rodrigues H KolmetzFranceStephen Shaw UNQUALIFIED
Munro Q OstroskyGermanyOnyama Limba RENEWAL
Aika R GauchoFranceBernardo Dominic NEW
Emily W FollerBrazilAmy Elsner QUALIFIED
Leja O FollerUnited KingdomAnna Fali QUALIFIED
Salvatore C GillianItalyAnna Fali QUALIFIED
Maria E KolmetzItalyElwin Sharvill NEW
Leja B BriddickIndiaBernardo Dominic QUALIFIED
Claire V WieserRussiaXuxue Feng NEGOTIATION
Ivar V KolmetzCanadaAmy Elsner UNQUALIFIED
Jones G RoysterCanadaIoni Bowcher NEW
Izzy J GauchoJapanAmy Elsner NEW
Nicolas Z MacleadRussiaAnna Fali NEGOTIATION
Rodrigues R KolmetzSpainIvan Magalhaes UNQUALIFIED
Wickens D FlosiAustraliaOnyama Limba RENEWAL
Jennifer S WhobreyAustraliaOnyama Limba UNQUALIFIED
Murillo O GarufiCanadaXuxue Feng QUALIFIED
Faith Z VenereBrazilAnna Fali PROPOSAL
Deepesh W MacleadBrazilStephen Shaw PROPOSAL
Munro G DarakjyBrazilAnna Fali RENEWAL
Sinclair Z PaprockiFranceXuxue Feng NEW
Morrow H DoeFranceOnyama Limba UNQUALIFIED
David C CampainCanadaIvan Magalhaes NEGOTIATION
Mayumi R MaletIndiaAsiya Javayant PROPOSAL
Faith M AmigonItalyBernardo Dominic UNQUALIFIED
Jones Q DoeAustraliaIvan Magalhaes NEGOTIATION
Isabel E BologniaUnited KingdomIvan Magalhaes NEGOTIATION
Munro J PerinGermanyBernardo Dominic RENEWAL
Adams B VenereJapanAnna Fali QUALIFIED
Aditya X CampainJapanAnna Fali RENEWAL
Murillo P WieserSpainElwin Sharvill RENEWAL
Juan G BriddickArgentinaStephen Shaw NEW
Darci J SchemmerIndiaIoni Bowcher PROPOSAL
Adams P NestleJapanIvan Magalhaes NEW
Morrow C DilliardIndiaAmy Elsner NEGOTIATION
Morrow N PerinBrazilIoni Bowcher QUALIFIED
Julie H FlosiArgentinaAsiya Javayant QUALIFIED
Rodrigues I CaudyJapanAsiya Javayant NEW
Faith A IturbideRussiaElwin Sharvill PROPOSAL
Misaki Q WhobreyIndiaStephen Shaw NEW

<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>