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
Mayumi C InouyeFranceStephen Shaw NEGOTIATION
Jefferson N PaprockiCanadaXuxue Feng RENEWAL
Wickens N InouyeFranceOnyama Limba NEGOTIATION
Ricardo L MaletRussiaIvan Magalhaes NEW
Murillo Z InouyeGermanyStephen Shaw QUALIFIED
Jennifer P DilliardJapanIoni Bowcher RENEWAL
Silvio I OldroydRussiaAmy Elsner NEW
Darci K RulapaughBrazilIvan Magalhaes NEW
Morrow Y SlusarskiSpainIoni Bowcher NEGOTIATION
Maisha I InouyeAustraliaAnna Fali QUALIFIED
Arvin B CaldareraJapanStephen Shaw QUALIFIED
Jefferson D BowleyJapanBernardo Dominic UNQUALIFIED
Clifford N StockhamItalyAsiya Javayant RENEWAL
Stacey S AmigonIndiaIvan Magalhaes QUALIFIED
Maria S ShinkoJapanAsiya Javayant QUALIFIED
Ivar D GlickFranceAsiya Javayant QUALIFIED
Jones R DoeArgentinaXuxue Feng RENEWAL
Clifford A StockhamRussiaBernardo Dominic PROPOSAL
Aruna F MacleadRussiaAmy Elsner NEW
Ivar K KolmetzAustraliaXuxue Feng UNQUALIFIED
Deepesh Q MorascaJapanXuxue Feng PROPOSAL
Julie R GarufiJapanElwin Sharvill PROPOSAL
Silvio W ChuiAustraliaOnyama Limba PROPOSAL
Aika O OstroskyIndiaAmy Elsner NEGOTIATION
Silvio I WieserAustraliaIvan Magalhaes RENEWAL
Aditya Q VocelkaIndiaStephen Shaw QUALIFIED
Kadeem X SlusarskiFranceAmy Elsner NEGOTIATION
Aditya W FollerSpainOnyama Limba UNQUALIFIED
Silvio X GarufiSpainAsiya Javayant PROPOSAL
Deepesh F KolmetzAustraliaOnyama Limba RENEWAL
Chavez O RutaAustraliaAmy Elsner NEW
Kaitlin C SaylorsArgentinaElwin Sharvill QUALIFIED
Kadeem W RimCanadaXuxue Feng UNQUALIFIED
Leja Z AmigonJapanIvan Magalhaes NEW
Izzy B ShinkoJapanIoni Bowcher UNQUALIFIED
Salvatore Z ChuiGermanyIoni Bowcher NEGOTIATION
Leon B PaprockiBrazilIoni Bowcher NEGOTIATION
Ivar W VocelkaCanadaAnna Fali QUALIFIED
Ivar D BriddickGermanyAnna Fali NEW
Antonio M RulapaughItalyAnna Fali RENEWAL
Deepesh V TollnerRussiaStephen Shaw NEGOTIATION
Aruna X VenereSpainOnyama Limba RENEWAL
Ivar T DilliardJapanIvan Magalhaes NEGOTIATION
Clifford O GillianRussiaAnna Fali RENEWAL
Ricardo F KuskoRussiaAsiya Javayant PROPOSAL
Arvin D AlbaresJapanBernardo Dominic RENEWAL
Nicolas Y TollnerSpainAsiya Javayant NEW
Sinclair X MaletGermanyAnna Fali NEGOTIATION
Maria U MarrierGermanyIvan Magalhaes PROPOSAL
Tony Y PoquetteJapanElwin Sharvill NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Maria P StockhamJapanIvan Magalhaes UNQUALIFIED
Salvatore M WaycottAustraliaElwin Sharvill RENEWAL
Jeanfrancois Z IturbideArgentinaAmy Elsner PROPOSAL
Greenwood P NickaSpainBernardo Dominic NEGOTIATION
Mujtaba U VenereRussiaBernardo Dominic QUALIFIED
Aditya E ButtUnited KingdomAsiya Javayant NEW
Adams A ShinkoAustraliaAmy Elsner UNQUALIFIED
Tony X NestleArgentinaElwin Sharvill RENEWAL
Claire J FlosiBrazilAsiya Javayant NEGOTIATION
Johnson G BologniaIndiaAmy Elsner PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Clifford Y ChuiGermany2025-04-20Feiner Bros QUALIFIED30Asiya Javayant
1001Mujtaba Q ChuiBrazil2025-04-21Benton, John B Jr NEGOTIATION66Stephen Shaw
1002Nicolas D NestleUnited Kingdom2025-04-04Truhlar And Truhlar Attys PROPOSAL56Amy Elsner
1003Izzy B GlickCanada2025-04-30King, Christopher A Esq UNQUALIFIED8Stephen Shaw
1004Maisha V SaylorsIndia2025-04-06Buckley Miller Wright NEGOTIATION22Xuxue Feng
1005Julie H OldroydArgentina2025-04-04King, Christopher A Esq UNQUALIFIED69Asiya Javayant
1006Rodrigues J CampainJapan2025-04-16Chanay, Jeffrey A Esq PROPOSAL12Xuxue Feng
1007Leon E DilliardAustralia2025-04-24King, Christopher A Esq RENEWAL15Bernardo Dominic
1008Chavez G InouyeSpain2025-04-03Printing Dimensions NEGOTIATION36Xuxue Feng
1009Morrow X WaycottJapan2025-04-14Chanay, Jeffrey A Esq RENEWAL66Asiya Javayant
1010Rodrigues T DoeUnited Kingdom2025-04-22King, Christopher A Esq RENEWAL24Stephen Shaw
1011Julie G WhobreyArgentina2025-04-19Feiner Bros RENEWAL57Asiya Javayant
1012Smith V StockhamRussia2025-04-10Printing Dimensions NEW11Onyama Limba
1013Izzy U FerenczGermany2025-04-18Chemel, James L Cpa QUALIFIED79Ivan Magalhaes
1014Murillo S PaprockiCanada2025-04-19Chapman, Ross E Esq QUALIFIED52Stephen Shaw
1015Alejandro A SergiItaly2025-04-14Benton, John B Jr NEGOTIATION70Bernardo Dominic
1016Claire D CampainRussia2025-04-19Printing Dimensions NEGOTIATION60Amy Elsner
1017Deepesh N NickaArgentina2025-04-16Chapman, Ross E Esq UNQUALIFIED12Ioni Bowcher
1018Mujtaba M PerinCanada2025-04-27Rangoni Of Florence NEW0Xuxue Feng
1019Jennifer O PoquetteItaly2025-04-30Benton, John B Jr RENEWAL6Ioni Bowcher
1020Silvio C MarrierArgentina2025-04-12Benton, John B Jr NEGOTIATION31Ioni Bowcher
1021Izzy H NestleBrazil2025-04-22Truhlar And Truhlar Attys NEGOTIATION25Elwin Sharvill
1022Jennifer F DoeArgentina2025-04-06Chapman, Ross E Esq QUALIFIED7Stephen Shaw
1023Kadeem H RoysterGermany2025-04-17Commercial Press RENEWAL62Bernardo Dominic
1024Leja E DoeRussia2025-04-17Morlong Associates NEGOTIATION48Xuxue Feng
1025Adams H AlbaresSpain2025-04-03King, Christopher A Esq PROPOSAL6Stephen Shaw
1026Faith E VocelkaArgentina2025-04-12Chemel, James L Cpa UNQUALIFIED93Asiya Javayant
1027Aruna U NickaFrance2025-04-01Chanay, Jeffrey A Esq RENEWAL14Ivan Magalhaes
1028Leon W InouyeRussia2025-04-22Chanay, Jeffrey A Esq PROPOSAL62Ivan Magalhaes
1029Murillo R RimSpain2025-04-07Commercial Press UNQUALIFIED18Anna Fali
1030Mujtaba W TollnerIndia2025-04-27Feltz Printing Service RENEWAL64Amy Elsner
1031Aika S IturbideBrazil2025-04-22Benton, John B Jr RENEWAL78Stephen Shaw
1032Aika V NestleRussia2025-04-14Dorl, James J Esq UNQUALIFIED13Xuxue Feng
1033Kadeem I DoeFrance2025-04-06Truhlar And Truhlar Attys RENEWAL11Asiya Javayant
1034Deepesh A MaletRussia2025-04-28Feiner Bros NEW61Amy Elsner
1035Murillo I CampainItaly2025-04-13Morlong Associates NEGOTIATION8Ivan Magalhaes
1036Claire Q StockhamJapan2025-04-23Morlong Associates QUALIFIED40Amy Elsner
1037Arvin P FerenczItaly2025-04-07Rangoni Of Florence UNQUALIFIED92Ioni Bowcher
1038Leja U OldroydJapan2025-04-14Chemel, James L Cpa NEW70Ioni Bowcher
1039Maisha A WhobreyFrance2025-04-27Benton, John B Jr PROPOSAL73Ioni Bowcher
1040Ricardo Q BowleyArgentina2025-04-13Printing Dimensions QUALIFIED32Xuxue Feng
1041Maria B GauchoArgentina2025-04-28Dorl, James J Esq RENEWAL23Ioni Bowcher
1042Clifford V PaprockiIndia2025-04-17Dorl, James J Esq QUALIFIED94Stephen Shaw
1043Aruna M StensethRussia2025-04-26Feiner Bros PROPOSAL4Ivan Magalhaes
1044Mujtaba Z FlosiFrance2025-04-04Feltz Printing Service UNQUALIFIED44Asiya Javayant
1045Deepesh W KolmetzRussia2025-04-13Rousseaux, Michael Esq UNQUALIFIED38Elwin Sharvill
1046Maisha M MorascaBrazil2025-04-30Chemel, James L Cpa UNQUALIFIED8Xuxue Feng
1047Izzy G KuskoGermany2025-04-27Chanay, Jeffrey A Esq RENEWAL33Ioni Bowcher
1048Kadeem V ShinkoRussia2025-04-24Dorl, James J Esq NEGOTIATION82Elwin Sharvill
1049Kadeem B NestleItaly2025-04-12Feltz Printing Service QUALIFIED28Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Julie B DoeGermanyXuxue Feng UNQUALIFIED
Aruna T ButtSpainElwin Sharvill NEW
Deepesh U OstroskySpainStephen Shaw UNQUALIFIED
James Z CampainJapanAsiya Javayant QUALIFIED
Jefferson C ShinkoSpainIvan Magalhaes PROPOSAL
Morrow X InouyeCanadaOnyama Limba RENEWAL
Deepesh Y NickaUnited KingdomStephen Shaw RENEWAL
Aika E StockhamUnited KingdomAmy Elsner NEGOTIATION
Jefferson B InouyeBrazilXuxue Feng NEGOTIATION
Nicolas L WaycottCanadaAsiya Javayant RENEWAL
Rodrigues Z WieserBrazilOnyama Limba NEW
Isabel O PoquetteFranceStephen Shaw PROPOSAL
Rodrigues J NestleArgentinaAmy Elsner NEGOTIATION
David N RulapaughItalyStephen Shaw NEW
Stacey R CampainBrazilAnna Fali QUALIFIED
Faith J IturbideIndiaXuxue Feng QUALIFIED
Jennifer I ChuiUnited KingdomAsiya Javayant NEW
Rodrigues J WaycottUnited KingdomIoni Bowcher UNQUALIFIED
Claire D AmigonRussiaAnna Fali NEGOTIATION
Francesco N PaprockiIndiaIvan Magalhaes UNQUALIFIED
Morrow G InouyeIndiaIoni Bowcher PROPOSAL
Mayumi E WieserJapanElwin Sharvill NEGOTIATION
Smith H DilliardCanadaAmy Elsner PROPOSAL
Darci G ShinkoCanadaAmy Elsner NEGOTIATION
Costa M OstroskyCanadaAsiya Javayant QUALIFIED
Ivar O AmigonAustraliaElwin Sharvill RENEWAL
James X SlusarskiSpainAmy Elsner RENEWAL
James Q PoquetteBrazilStephen Shaw PROPOSAL
Isabel L OldroydRussiaOnyama Limba RENEWAL
Tony C DoeSpainIvan Magalhaes UNQUALIFIED
Claire S WieserUnited KingdomAsiya Javayant NEW
Alejandro C SchemmerBrazilBernardo Dominic RENEWAL
Morrow D PerinCanadaAnna Fali NEW
Costa L WhobreyRussiaElwin Sharvill UNQUALIFIED
Leja X FerenczSpainElwin Sharvill RENEWAL
Maria C PoquetteGermanyIvan Magalhaes PROPOSAL
Ivar M PerinBrazilOnyama Limba UNQUALIFIED
Arvin N WaycottGermanyBernardo Dominic UNQUALIFIED
Wickens O BriddickJapanOnyama Limba QUALIFIED
Julie J GillianRussiaIoni Bowcher UNQUALIFIED
Leja V CampainUnited KingdomIoni Bowcher QUALIFIED
Aruna X StockhamFranceIvan Magalhaes NEW
Antonio K GlickBrazilStephen Shaw NEGOTIATION
Aruna E OstroskyAustraliaIoni Bowcher PROPOSAL
Emily L RoysterItalyAsiya Javayant UNQUALIFIED
Darci K KuskoJapanAnna Fali NEGOTIATION
Tony A StensethBrazilOnyama Limba NEW
Maria R WaycottJapanAmy Elsner QUALIFIED
Emily X FigeroaUnited KingdomAsiya Javayant NEW
Deepesh Q PoquetteFranceOnyama Limba QUALIFIED
Frozen Columns
Name
Ricardo X Malet
Ricardo P Amigon
Rodrigues E Sergi
Rodrigues Q Maclead
Silvio M Saylors
Costa M Ferencz
Octavia A Foller
Izzy D Malet
Jefferson C Ferencz
Silvio T Royster
Darci B Paprocki
Arvin W Tollner
Greenwood B Bolognia
Greenwood M Royster
Maria R Maclead
Ricardo O Perin
David K Albares
Salvatore J Ruta
Greenwood R Saylors
Leja J Doe
Misaki Q Briddick
Nicolas P Albares
Aditya E Stenseth
Morrow Q Tollner
Nicolas W Marrier
Nicolas T Stockham
Rodrigues B Maclead
Rodrigues W Bowley
Jennifer A Nestle
Rodrigues V Saylors
Leon P Royster
Smith C Caudy
Antonio A Darakjy
Maria S Rulapaugh
Munro O Shinko
Izzy K Gaucho
Isabel N Sergi
Claire X Kolmetz
Ricardo C Figeroa
Jefferson S Whobrey
Silvio V Kolmetz
Leon F Paprocki
Antonio P Briddick
Jeanfrancois B Butt
Morrow T Oldroyd
James P Ruta
Isabel I Doe
Clifford C Dilliard
Emily V Gaucho
Leja Q Gaucho
IdCountryDate
1000France2025-04-23
1001Brazil2025-04-19
1002Russia2025-04-18
1003India2025-04-13
1004India2025-04-15
1005Brazil2025-04-07
1006Brazil2025-04-23
1007Australia2025-04-01
1008India2025-04-25
1009Germany2025-04-09
1010Russia2025-04-17
1011Australia2025-04-21
1012Brazil2025-04-06
1013Brazil2025-04-22
1014Australia2025-04-28
1015Russia2025-04-10
1016Brazil2025-04-30
1017Argentina2025-04-14
1018Italy2025-04-24
1019Brazil2025-04-03
1020Germany2025-04-22
1021United Kingdom2025-04-13
1022Australia2025-04-20
1023Canada2025-04-28
1024Australia2025-04-08
1025Russia2025-04-28
1026India2025-04-01
1027Brazil2025-04-03
1028Russia2025-04-18
1029Brazil2025-04-16
1030Canada2025-04-19
1031Argentina2025-04-11
1032United Kingdom2025-04-06
1033Japan2025-04-27
1034France2025-04-16
1035Germany2025-04-09
1036Australia2025-04-11
1037Argentina2025-04-04
1038Russia2025-04-16
1039Germany2025-04-02
1040Argentina2025-04-02
1041Canada2025-04-03
1042France2025-04-12
1043France2025-04-10
1044Japan2025-04-09
1045Germany2025-04-18
1046Russia2025-04-25
1047India2025-04-10
1048Australia2025-04-19
1049Argentina2025-04-23

On-Demand Data

NameIdCountryDate
Adams U Iturbide1000Russia2025-04-17
Aruna S Malet1001Germany2025-04-02
Greenwood H Stenseth1002Brazil2025-04-15
Leja S Dilliard1003Japan2025-04-14
Stacey X Stenseth1004Germany2025-04-12
Tony V Oldroyd1005Canada2025-04-10
Wickens U Poquette1006Russia2025-04-22
Faith X Shinko1007Italy2025-04-30
Aditya Q Poquette1008Canada2025-04-08
Stacey S Poquette1009Italy2025-04-03
Johnson F Nestle1010Brazil2025-04-13
Silvio R Darakjy1011Japan2025-04-18
Leja O Inouye1012United Kingdom2025-04-14
Salvatore O Malet1013Brazil2025-04-26
Nicolas B Shinko1014Italy2025-04-10
Nicolas Q Whobrey1015Argentina2025-04-11
Leon V Oldroyd1016Argentina2025-04-11
Adams K Shinko1017Italy2025-04-02
Julie D Paprocki1018Argentina2025-04-30
Jennifer N Darakjy1019India2025-04-30
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Leon N MacleadBrazilBernardo Dominic PROPOSAL
Aika Y SergiGermanyBernardo Dominic NEW
Sinclair V KuskoAustraliaOnyama Limba UNQUALIFIED
Maria D MarrierUnited KingdomElwin Sharvill NEW
Ricardo T RimFranceOnyama Limba NEGOTIATION
Juan Z BologniaBrazilIoni Bowcher NEW
Deepesh O RulapaughBrazilBernardo Dominic NEGOTIATION
Juan W CampainFranceElwin Sharvill NEGOTIATION
Smith J KuskoFranceAnna Fali NEGOTIATION
Deepesh I KolmetzItalyAmy Elsner RENEWAL
Wickens T MarrierAustraliaBernardo Dominic RENEWAL
James G RutaFranceXuxue Feng UNQUALIFIED
Johnson X DilliardGermanyIoni Bowcher RENEWAL
Alejandro G StockhamUnited KingdomBernardo Dominic RENEWAL
Chavez D IturbideArgentinaStephen Shaw NEGOTIATION
Ivar N RimSpainAsiya Javayant RENEWAL
Aika H OldroydJapanIvan Magalhaes NEW
Ricardo V VocelkaGermanyAnna Fali PROPOSAL
Stacey P PerinCanadaStephen Shaw NEGOTIATION
Johnson S WieserGermanyIvan Magalhaes RENEWAL
Leon B VenereFranceIvan Magalhaes RENEWAL
Jones U PaprockiGermanyAnna Fali NEGOTIATION
Deepesh S RutaRussiaAsiya Javayant NEGOTIATION
Ivar X RutaUnited KingdomAnna Fali RENEWAL
Tony A DilliardCanadaStephen Shaw PROPOSAL
Isabel W SaylorsRussiaBernardo Dominic NEGOTIATION
Greenwood S DarakjyItalyXuxue Feng NEGOTIATION
Alejandro X BriddickGermanyAsiya Javayant UNQUALIFIED
Ashley M RulapaughGermanyBernardo Dominic RENEWAL
Francesco N GlickJapanAnna Fali NEW
Rodrigues T RulapaughUnited KingdomAsiya Javayant NEW
Sinclair Z WhobreyRussiaAnna Fali UNQUALIFIED
Faith M FigeroaRussiaElwin Sharvill RENEWAL
Maisha Z GauchoCanadaAmy Elsner PROPOSAL
Adams U DilliardSpainIvan Magalhaes UNQUALIFIED
Emily A WaycottFranceElwin Sharvill NEGOTIATION
Emily P RulapaughBrazilXuxue Feng NEGOTIATION
Julie T PaprockiArgentinaElwin Sharvill QUALIFIED
Stacey P AmigonGermanyXuxue Feng QUALIFIED
Deepesh I DoeUnited KingdomXuxue Feng QUALIFIED

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