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
Faith D DilliardJapanAmy Elsner NEGOTIATION
Cody M SaylorsJapanAsiya Javayant QUALIFIED
Adams D OstroskyItalyAnna Fali RENEWAL
Tony L InouyeUnited KingdomIvan Magalhaes PROPOSAL
Octavia W NickaCanadaBernardo Dominic QUALIFIED
Ashley G GillianArgentinaStephen Shaw NEGOTIATION
Darci Z GarufiItalyIvan Magalhaes NEW
Kaitlin O DoeIndiaXuxue Feng NEW
Tony S GarufiJapanAnna Fali NEGOTIATION
Rodrigues R SlusarskiArgentinaAnna Fali NEGOTIATION
Alejandro A RutaUnited KingdomIvan Magalhaes NEW
Stacey P CaudyAustraliaOnyama Limba NEW
Silvio T SchemmerIndiaAsiya Javayant NEGOTIATION
Leon C NestleCanadaOnyama Limba PROPOSAL
Morrow M MacleadSpainXuxue Feng NEGOTIATION
Ricardo F DarakjySpainAmy Elsner PROPOSAL
Greenwood Z PoquetteJapanAsiya Javayant NEW
Antonio N SergiIndiaIvan Magalhaes UNQUALIFIED
Alejandro V StockhamItalyAsiya Javayant NEGOTIATION
Aditya C GillianCanadaAsiya Javayant QUALIFIED
Aika H WieserIndiaAmy Elsner NEW
Munro Y FerenczFranceBernardo Dominic NEW
Aika A PoquetteAustraliaXuxue Feng RENEWAL
Morrow S FerenczJapanStephen Shaw QUALIFIED
Adams P GlickSpainIvan Magalhaes PROPOSAL
Greenwood N CaldareraJapanOnyama Limba UNQUALIFIED
Alejandro Y SaylorsCanadaAnna Fali QUALIFIED
Misaki C NestleJapanOnyama Limba RENEWAL
Murillo M RutaBrazilXuxue Feng QUALIFIED
Wickens C InouyeIndiaElwin Sharvill QUALIFIED
Mujtaba X NickaJapanElwin Sharvill RENEWAL
David V WieserRussiaAmy Elsner PROPOSAL
Rodrigues H RulapaughRussiaXuxue Feng NEW
Mujtaba B BriddickBrazilIvan Magalhaes UNQUALIFIED
Julie D VocelkaIndiaIvan Magalhaes NEGOTIATION
Nicolas M BologniaIndiaAmy Elsner NEGOTIATION
Tony F SchemmerBrazilElwin Sharvill PROPOSAL
Izzy P WaycottJapanStephen Shaw PROPOSAL
Mayumi Q SlusarskiCanadaAmy Elsner RENEWAL
Aika L TollnerJapanAmy Elsner NEW
Mujtaba X OstroskyFranceStephen Shaw PROPOSAL
Misaki K BriddickRussiaStephen Shaw RENEWAL
Mayumi S VenereRussiaAsiya Javayant PROPOSAL
Kaitlin W RimIndiaElwin Sharvill RENEWAL
Faith W FigeroaItalyIoni Bowcher RENEWAL
Costa F IturbideAustraliaIoni Bowcher QUALIFIED
Costa X RutaBrazilBernardo Dominic NEW
Ashley I WaycottFranceAmy Elsner NEGOTIATION
Mujtaba Q StockhamIndiaBernardo Dominic QUALIFIED
Greenwood L RulapaughBrazilAmy Elsner PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Mujtaba M RimSpainAmy Elsner NEGOTIATION
Claire E OstroskyFranceAmy Elsner NEGOTIATION
Rodrigues Q FollerIndiaAmy Elsner PROPOSAL
Ivar W WhobreyUnited KingdomAnna Fali NEGOTIATION
Julie B GauchoUnited KingdomAnna Fali PROPOSAL
Jefferson O SaylorsSpainElwin Sharvill PROPOSAL
Misaki N StensethJapanAnna Fali PROPOSAL
Ivar Q SchemmerSpainAsiya Javayant QUALIFIED
Aditya T VocelkaRussiaIoni Bowcher UNQUALIFIED
Alejandro I PerinFranceIvan Magalhaes NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000David Y GauchoIndia2025-06-03Buckley Miller Wright QUALIFIED73Bernardo Dominic
1001Salvatore Q NickaRussia2025-05-29Rangoni Of Florence NEGOTIATION77Anna Fali
1002Jeanfrancois E ShinkoBrazil2025-05-27Morlong Associates UNQUALIFIED85Asiya Javayant
1003Silvio O NestleSpain2025-06-10Feltz Printing Service NEGOTIATION11Bernardo Dominic
1004Octavia P SlusarskiUnited Kingdom2025-05-24Dorl, James J Esq NEW87Xuxue Feng
1005Ashley A SchemmerGermany2025-06-12Chemel, James L Cpa PROPOSAL64Bernardo Dominic
1006Arvin P SaylorsRussia2025-05-30Feltz Printing Service UNQUALIFIED47Ivan Magalhaes
1007Emily L NickaUnited Kingdom2025-06-14Chapman, Ross E Esq NEW97Anna Fali
1008Adams N BologniaGermany2025-05-25Rousseaux, Michael Esq RENEWAL26Ivan Magalhaes
1009Aruna P RimArgentina2025-06-01Printing Dimensions PROPOSAL99Xuxue Feng
1010Kadeem H KuskoIndia2025-05-18Commercial Press RENEWAL94Bernardo Dominic
1011Misaki H GauchoSpain2025-06-08Morlong Associates RENEWAL55Anna Fali
1012Leja Z PoquetteBrazil2025-06-08Rousseaux, Michael Esq NEW70Amy Elsner
1013Clifford R WieserAustralia2025-05-31Morlong Associates NEGOTIATION36Anna Fali
1014Leon X CaudyBrazil2025-06-12Rangoni Of Florence NEGOTIATION64Amy Elsner
1015James C VenereFrance2025-06-09Rangoni Of Florence RENEWAL42Bernardo Dominic
1016Isabel F VenereSpain2025-05-24Feltz Printing Service QUALIFIED48Bernardo Dominic
1017Mayumi W DoeGermany2025-05-27Rousseaux, Michael Esq NEW1Ioni Bowcher
1018Aditya L ChuiCanada2025-06-08Feltz Printing Service RENEWAL97Ivan Magalhaes
1019Ivar G MarrierUnited Kingdom2025-06-10Dorl, James J Esq UNQUALIFIED19Elwin Sharvill
1020Sinclair V PaprockiIndia2025-06-01Feiner Bros UNQUALIFIED66Onyama Limba
1021Aika G BologniaIndia2025-05-26Chanay, Jeffrey A Esq RENEWAL66Ivan Magalhaes
1022Julie Y PoquetteJapan2025-05-21Morlong Associates NEW79Elwin Sharvill
1023Jones Z OldroydAustralia2025-05-26Rousseaux, Michael Esq RENEWAL57Stephen Shaw
1024James D BowleyJapan2025-05-20Commercial Press NEW76Xuxue Feng
1025Ivar P GarufiIndia2025-06-03Printing Dimensions NEGOTIATION7Asiya Javayant
1026Kadeem C VenereRussia2025-05-24Benton, John B Jr PROPOSAL28Ioni Bowcher
1027Tony J FigeroaFrance2025-05-27Morlong Associates PROPOSAL55Onyama Limba
1028Silvio I FerenczJapan2025-06-13Chanay, Jeffrey A Esq QUALIFIED64Anna Fali
1029Morrow S BriddickIndia2025-06-07Morlong Associates RENEWAL99Xuxue Feng
1030Stacey A ShinkoSpain2025-05-24Commercial Press NEW29Elwin Sharvill
1031Ashley N NestleSpain2025-06-14Morlong Associates NEW35Onyama Limba
1032Chavez B StensethIndia2025-05-29Feiner Bros NEW37Anna Fali
1033Ricardo N GillianArgentina2025-05-24Feltz Printing Service UNQUALIFIED95Stephen Shaw
1034Cody S ButtRussia2025-05-28Rousseaux, Michael Esq PROPOSAL51Stephen Shaw
1035Isabel X KuskoFrance2025-06-12Chapman, Ross E Esq NEGOTIATION9Onyama Limba
1036Maisha U SaylorsArgentina2025-05-30King, Christopher A Esq RENEWAL39Ioni Bowcher
1037Cody J RutaItaly2025-06-02Buckley Miller Wright RENEWAL52Anna Fali
1038Francesco Q DoeArgentina2025-06-09Dorl, James J Esq RENEWAL82Onyama Limba
1039Cody U KuskoCanada2025-05-30King, Christopher A Esq NEGOTIATION53Onyama Limba
1040Deepesh K BologniaItaly2025-05-30King, Christopher A Esq PROPOSAL90Asiya Javayant
1041Arvin J DilliardIndia2025-06-03Dorl, James J Esq NEGOTIATION3Asiya Javayant
1042Leja U BriddickGermany2025-06-03Commercial Press RENEWAL84Xuxue Feng
1043Claire Q GarufiIndia2025-06-09Commercial Press NEGOTIATION4Elwin Sharvill
1044Mayumi N RimIndia2025-06-13Printing Dimensions RENEWAL12Asiya Javayant
1045Smith W GillianGermany2025-05-17Morlong Associates RENEWAL45Bernardo Dominic
1046Leja G FlosiFrance2025-05-28Benton, John B Jr RENEWAL4Bernardo Dominic
1047Maria R BologniaCanada2025-05-23Chanay, Jeffrey A Esq NEGOTIATION59Onyama Limba
1048Isabel U FerenczAustralia2025-05-25Truhlar And Truhlar Attys NEGOTIATION26Bernardo Dominic
1049Emily Z KolmetzFrance2025-05-27Commercial Press NEW99Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Francesco G IturbideArgentinaAnna Fali NEGOTIATION
Adams A CampainUnited KingdomIvan Magalhaes NEGOTIATION
Ivar U SlusarskiUnited KingdomOnyama Limba UNQUALIFIED
Sinclair W DarakjyFranceOnyama Limba NEW
Julie T SlusarskiAustraliaIvan Magalhaes QUALIFIED
Kaitlin W SergiItalyAnna Fali UNQUALIFIED
Darci G SchemmerJapanBernardo Dominic UNQUALIFIED
Juan S TollnerFranceAsiya Javayant QUALIFIED
Tony Y CaudyIndiaAnna Fali RENEWAL
Kadeem T CaudyCanadaStephen Shaw UNQUALIFIED
Tony T BologniaIndiaAsiya Javayant PROPOSAL
David M PerinFranceXuxue Feng UNQUALIFIED
Kaitlin T PerinGermanyAsiya Javayant UNQUALIFIED
Maisha T CaldareraUnited KingdomAsiya Javayant PROPOSAL
Adams Z WaycottJapanIoni Bowcher UNQUALIFIED
Juan S TollnerItalyAmy Elsner UNQUALIFIED
Emily H DarakjyItalyElwin Sharvill QUALIFIED
Jennifer B ChuiAustraliaXuxue Feng PROPOSAL
Juan K AlbaresCanadaStephen Shaw UNQUALIFIED
Silvio H KuskoUnited KingdomOnyama Limba QUALIFIED
Greenwood S FollerCanadaOnyama Limba UNQUALIFIED
Adams E WhobreyRussiaStephen Shaw RENEWAL
Kadeem T FollerJapanIvan Magalhaes QUALIFIED
David Q CaldareraCanadaAsiya Javayant RENEWAL
Aika R RutaRussiaAnna Fali NEW
Izzy G RulapaughJapanAnna Fali NEGOTIATION
Clifford O WaycottIndiaIvan Magalhaes RENEWAL
Ivar H RulapaughSpainOnyama Limba UNQUALIFIED
Johnson Y RutaItalyElwin Sharvill RENEWAL
Aditya J BologniaJapanBernardo Dominic NEGOTIATION
Izzy A RutaIndiaXuxue Feng UNQUALIFIED
Kadeem C MarrierItalyAnna Fali PROPOSAL
Costa T MaletCanadaIvan Magalhaes PROPOSAL
Wickens O OstroskyJapanIoni Bowcher RENEWAL
Leja X BriddickRussiaIvan Magalhaes UNQUALIFIED
Kadeem X BologniaAustraliaXuxue Feng UNQUALIFIED
Adams B PoquetteBrazilStephen Shaw NEW
Francesco S VenereFranceOnyama Limba RENEWAL
Antonio I OstroskyAustraliaIoni Bowcher PROPOSAL
Smith W VocelkaItalyStephen Shaw PROPOSAL
Silvio D WaycottItalyAnna Fali RENEWAL
Kadeem Q WaycottItalyStephen Shaw QUALIFIED
Kadeem P WaycottGermanyAmy Elsner UNQUALIFIED
Greenwood B KolmetzSpainIoni Bowcher NEW
Jeanfrancois P KolmetzGermanyAsiya Javayant UNQUALIFIED
Aditya V RoysterFranceStephen Shaw NEGOTIATION
Claire U WaycottBrazilStephen Shaw NEGOTIATION
Octavia Q SchemmerIndiaIoni Bowcher NEW
Nicolas N GillianJapanOnyama Limba UNQUALIFIED
Clifford P VenereFranceElwin Sharvill PROPOSAL
Frozen Columns
Name
Ivar S Caudy
Aika F Butt
Leon P Wieser
Jones V Garufi
Emily V Butt
Julie V Flosi
Antonio N Perin
Johnson J Caudy
David H Garufi
Ivar L Stenseth
Tony S Butt
Salvatore L Gaucho
Jefferson L Doe
Sinclair A Malet
Antonio W Stockham
Alejandro U Saylors
Ashley Y Bolognia
Tony B Campain
Maisha M Gillian
Isabel U Malet
Adams C Nicka
Francesco M Inouye
Izzy O Royster
Jones N Amigon
Jeanfrancois K Doe
Johnson I Marrier
Aditya E Amigon
Claire V Glick
Kadeem T Malet
Jeanfrancois J Perin
Cody W Bowley
Cody O Darakjy
Kaitlin K Caudy
Maria V Paprocki
Stacey J Butt
Ivar U Marrier
Sinclair Z Nestle
Faith L Maclead
Wickens G Albares
Maisha D Stenseth
Tony R Inouye
Kadeem N Gaucho
Adams I Dilliard
Arvin S Waycott
Greenwood O Wieser
Leja G Kusko
Ivar F Wieser
Salvatore O Ferencz
Sinclair T Gillian
Isabel E Vocelka
IdCountryDate
1000Canada2025-06-10
1001Brazil2025-06-12
1002Germany2025-05-31
1003Argentina2025-05-26
1004Japan2025-05-18
1005Canada2025-05-18
1006Canada2025-05-26
1007Germany2025-06-02
1008United Kingdom2025-05-21
1009Italy2025-05-23
1010United Kingdom2025-06-02
1011Japan2025-05-21
1012United Kingdom2025-05-18
1013Brazil2025-05-27
1014Russia2025-05-25
1015Australia2025-05-22
1016Argentina2025-05-18
1017United Kingdom2025-05-29
1018India2025-06-01
1019India2025-05-19
1020India2025-06-10
1021Argentina2025-05-25
1022Australia2025-05-28
1023Italy2025-06-11
1024Spain2025-05-17
1025Italy2025-06-10
1026France2025-05-23
1027Spain2025-05-17
1028Italy2025-05-24
1029Australia2025-05-19
1030Brazil2025-06-09
1031Spain2025-05-18
1032France2025-05-17
1033Argentina2025-06-06
1034Spain2025-06-09
1035Germany2025-05-31
1036Germany2025-06-06
1037India2025-06-09
1038United Kingdom2025-06-06
1039United Kingdom2025-05-22
1040Brazil2025-05-19
1041Canada2025-06-08
1042Russia2025-05-27
1043Italy2025-05-29
1044Japan2025-06-07
1045France2025-05-26
1046France2025-06-04
1047United Kingdom2025-06-14
1048Argentina2025-06-01
1049Germany2025-06-08

On-Demand Data

NameIdCountryDate
Morrow O Caldarera1000Australia2025-06-06
Izzy E Nicka1001France2025-06-11
Jeanfrancois Q Gillian1002Germany2025-06-11
Salvatore Q Figeroa1003Japan2025-06-12
Munro F Whobrey1004Canada2025-06-06
Murillo G Maclead1005Japan2025-06-11
Clifford D Stockham1006Australia2025-06-07
Aditya L Tollner1007Germany2025-06-01
Ricardo E Sergi1008Australia2025-05-17
Tony D Waycott1009Argentina2025-06-01
Johnson C Figeroa1010Germany2025-05-30
Misaki A Royster1011Russia2025-05-24
Tony P Garufi1012Canada2025-05-31
Arvin B Caudy1013Spain2025-05-19
Faith N Morasca1014United Kingdom2025-06-15
Kadeem J Sergi1015Canada2025-06-01
Ashley N Amigon1016France2025-05-29
Aditya E Perin1017Brazil2025-06-02
Jefferson A Marrier1018Argentina2025-06-03
Costa D Dilliard1019India2025-05-26
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Nicolas J NickaCanadaStephen Shaw NEW
Ivar A OstroskyUnited KingdomAsiya Javayant UNQUALIFIED
Chavez J BriddickAustraliaXuxue Feng PROPOSAL
Ashley D StensethBrazilStephen Shaw QUALIFIED
Izzy F BowleyUnited KingdomAsiya Javayant UNQUALIFIED
Emily T AmigonUnited KingdomOnyama Limba PROPOSAL
Emily D GauchoUnited KingdomIvan Magalhaes RENEWAL
Silvio S GlickRussiaOnyama Limba NEGOTIATION
Jeanfrancois G MarrierFranceIvan Magalhaes NEW
Aditya D SergiAustraliaIvan Magalhaes RENEWAL
Deepesh D WhobreyItalyIoni Bowcher UNQUALIFIED
Munro Q MaletUnited KingdomAmy Elsner PROPOSAL
Munro P MorascaFranceOnyama Limba NEGOTIATION
Aruna T GillianRussiaIvan Magalhaes QUALIFIED
Silvio P MacleadAustraliaOnyama Limba NEW
Kaitlin Y InouyeIndiaIvan Magalhaes UNQUALIFIED
Leon W BriddickUnited KingdomAnna Fali NEW
Emily U StockhamBrazilIoni Bowcher NEW
Munro A DarakjyJapanAnna Fali RENEWAL
Cody X OstroskyBrazilOnyama Limba UNQUALIFIED
Sinclair P DarakjyGermanyBernardo Dominic PROPOSAL
Emily S ShinkoFranceStephen Shaw NEW
David G PerinItalyOnyama Limba UNQUALIFIED
Aditya O KuskoIndiaAmy Elsner UNQUALIFIED
Octavia G GillianAustraliaAnna Fali UNQUALIFIED
Sinclair B TollnerUnited KingdomIoni Bowcher RENEWAL
Maisha X GlickRussiaAsiya Javayant PROPOSAL
Deepesh L BologniaUnited KingdomIvan Magalhaes NEGOTIATION
Leja W SaylorsIndiaIvan Magalhaes PROPOSAL
Munro T IturbideFranceAsiya Javayant NEGOTIATION
Jefferson D OstroskyIndiaIvan Magalhaes NEGOTIATION
Arvin H CaldareraSpainIvan Magalhaes PROPOSAL
Costa Z PerinArgentinaIoni Bowcher QUALIFIED
Jennifer O VocelkaRussiaAmy Elsner UNQUALIFIED
Sinclair W IturbideGermanyAsiya Javayant RENEWAL
Emily R DilliardRussiaXuxue Feng NEW
Alejandro G BowleyItalyIoni Bowcher PROPOSAL
Arvin S RulapaughCanadaElwin Sharvill RENEWAL
Tony O OldroydFranceIoni Bowcher QUALIFIED
Jones H SchemmerRussiaIoni Bowcher NEGOTIATION

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