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 G BologniaCanadaAnna Fali NEGOTIATION
Julie V ChuiBrazilIvan Magalhaes QUALIFIED
Izzy V AmigonBrazilAmy Elsner RENEWAL
Alejandro B StensethRussiaIvan Magalhaes NEW
Mujtaba O CampainRussiaIvan Magalhaes UNQUALIFIED
Silvio T WhobreyAustraliaOnyama Limba PROPOSAL
Emily O OstroskyCanadaElwin Sharvill UNQUALIFIED
Salvatore D FigeroaArgentinaIoni Bowcher PROPOSAL
Ricardo E BologniaBrazilBernardo Dominic NEW
Kaitlin B MacleadGermanyIoni Bowcher PROPOSAL
Ashley T SaylorsUnited KingdomAsiya Javayant NEGOTIATION
Ricardo Y FlosiRussiaStephen Shaw UNQUALIFIED
Leja Z FigeroaAustraliaElwin Sharvill QUALIFIED
Leon Q SergiCanadaStephen Shaw UNQUALIFIED
Maisha T DilliardAustraliaStephen Shaw NEW
Costa X PerinIndiaAnna Fali NEGOTIATION
Aditya G ShinkoRussiaOnyama Limba PROPOSAL
Kaitlin E RulapaughArgentinaIvan Magalhaes QUALIFIED
Kaitlin Y MarrierJapanStephen Shaw PROPOSAL
Wickens D BriddickItalyIvan Magalhaes RENEWAL
Kaitlin N MaletSpainIvan Magalhaes NEW
Juan W MorascaIndiaElwin Sharvill PROPOSAL
Maria W GillianItalyBernardo Dominic RENEWAL
Leja B WhobreyItalyAmy Elsner RENEWAL
Maisha G ButtBrazilStephen Shaw NEW
Adams V RoysterUnited KingdomIoni Bowcher NEGOTIATION
Cody A NickaItalyOnyama Limba QUALIFIED
Murillo N RutaAustraliaAmy Elsner NEGOTIATION
Mayumi X SlusarskiArgentinaElwin Sharvill PROPOSAL
Kadeem B PerinFranceAsiya Javayant UNQUALIFIED
Johnson D GarufiCanadaIoni Bowcher QUALIFIED
Misaki W StockhamGermanyIoni Bowcher PROPOSAL
Julie L VenereBrazilAnna Fali RENEWAL
Arvin P CaldareraArgentinaBernardo Dominic RENEWAL
Kaitlin K DoeRussiaBernardo Dominic PROPOSAL
Silvio J PaprockiRussiaAnna Fali QUALIFIED
Leja A GarufiJapanIoni Bowcher UNQUALIFIED
Deepesh R DoeSpainBernardo Dominic NEGOTIATION
Jennifer V AlbaresJapanStephen Shaw NEW
Leja O WhobreySpainElwin Sharvill NEGOTIATION
Rodrigues F PaprockiRussiaXuxue Feng QUALIFIED
Sinclair P GauchoItalyBernardo Dominic PROPOSAL
Mayumi V GillianItalyBernardo Dominic PROPOSAL
Sinclair N MaletBrazilElwin Sharvill QUALIFIED
Sinclair I FerenczItalyAmy Elsner NEGOTIATION
Leon R ChuiIndiaXuxue Feng RENEWAL
Faith X MarrierAustraliaElwin Sharvill RENEWAL
Aruna L DoeItalyOnyama Limba NEGOTIATION
Johnson N StensethGermanyIoni Bowcher QUALIFIED
Alejandro L GauchoJapanIvan Magalhaes UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Octavia R PoquetteBrazilXuxue Feng RENEWAL
Clifford X MacleadCanadaXuxue Feng UNQUALIFIED
Kadeem T OstroskyIndiaBernardo Dominic PROPOSAL
Cody C BriddickGermanyOnyama Limba PROPOSAL
Salvatore R KolmetzBrazilIvan Magalhaes RENEWAL
Julie G WieserCanadaAnna Fali UNQUALIFIED
Rodrigues I KolmetzSpainAmy Elsner NEW
Leja L MacleadUnited KingdomElwin Sharvill PROPOSAL
David I FigeroaUnited KingdomElwin Sharvill NEW
Darci A StensethJapanStephen Shaw RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Octavia P OstroskyJapan2025-04-26Feiner Bros UNQUALIFIED8Stephen Shaw
1001Antonio O CampainGermany2025-04-05Truhlar And Truhlar Attys PROPOSAL29Onyama Limba
1002Claire M DilliardBrazil2025-04-16Truhlar And Truhlar Attys PROPOSAL87Onyama Limba
1003Tony O GauchoGermany2025-04-25Chemel, James L Cpa PROPOSAL88Bernardo Dominic
1004Aika W CampainSpain2025-04-01Printing Dimensions PROPOSAL5Ioni Bowcher
1005Costa W MacleadJapan2025-04-19Rousseaux, Michael Esq RENEWAL36Elwin Sharvill
1006David W RutaIndia2025-04-04Chapman, Ross E Esq RENEWAL41Onyama Limba
1007Maria J ShinkoFrance2025-04-29Morlong Associates QUALIFIED99Onyama Limba
1008Darci T KuskoBrazil2025-04-29Feltz Printing Service UNQUALIFIED58Ioni Bowcher
1009Alejandro F SaylorsSpain2025-04-13Morlong Associates UNQUALIFIED21Onyama Limba
1010Julie E AlbaresAustralia2025-04-11Chapman, Ross E Esq NEW78Anna Fali
1011Costa E SergiItaly2025-04-22Dorl, James J Esq RENEWAL66Bernardo Dominic
1012Mujtaba Y RimUnited Kingdom2025-04-19Printing Dimensions NEGOTIATION47Elwin Sharvill
1013James M DarakjyIndia2025-04-29King, Christopher A Esq QUALIFIED31Elwin Sharvill
1014Ashley S VenereAustralia2025-04-11Truhlar And Truhlar Attys NEW97Ivan Magalhaes
1015Mujtaba H RulapaughRussia2025-04-08Printing Dimensions NEGOTIATION82Bernardo Dominic
1016Leja I PerinUnited Kingdom2025-04-11Chanay, Jeffrey A Esq PROPOSAL63Ioni Bowcher
1017Adams V ShinkoSpain2025-04-12Benton, John B Jr NEW0Elwin Sharvill
1018Aditya Q VenereAustralia2025-04-18Buckley Miller Wright NEW25Anna Fali
1019Clifford C VenereCanada2025-04-20Printing Dimensions UNQUALIFIED16Ioni Bowcher
1020Francesco R StockhamRussia2025-04-19Truhlar And Truhlar Attys NEW22Ivan Magalhaes
1021Rodrigues S GauchoFrance2025-04-02Rousseaux, Michael Esq NEW5Asiya Javayant
1022Silvio V ButtCanada2025-04-10Morlong Associates NEGOTIATION19Xuxue Feng
1023Misaki N OstroskyArgentina2025-04-24Rangoni Of Florence NEGOTIATION21Stephen Shaw
1024Johnson L GauchoGermany2025-04-27King, Christopher A Esq PROPOSAL16Stephen Shaw
1025Morrow E SaylorsIndia2025-04-20Dorl, James J Esq QUALIFIED94Onyama Limba
1026Faith T OldroydFrance2025-04-27Feiner Bros QUALIFIED88Ioni Bowcher
1027James D VocelkaIndia2025-04-02Rangoni Of Florence NEGOTIATION56Amy Elsner
1028Maria H CampainGermany2025-04-27Chanay, Jeffrey A Esq NEW95Bernardo Dominic
1029Munro R CampainGermany2025-04-02Truhlar And Truhlar Attys UNQUALIFIED89Anna Fali
1030Salvatore Z TollnerJapan2025-04-25Benton, John B Jr NEGOTIATION77Bernardo Dominic
1031Kaitlin O GillianSpain2025-04-03Chanay, Jeffrey A Esq UNQUALIFIED19Bernardo Dominic
1032Morrow L DilliardIndia2025-04-25Feltz Printing Service QUALIFIED98Ioni Bowcher
1033Costa O ShinkoIndia2025-04-29Rousseaux, Michael Esq QUALIFIED85Amy Elsner
1034Rodrigues R RulapaughGermany2025-04-21King, Christopher A Esq NEGOTIATION51Asiya Javayant
1035Faith E KuskoBrazil2025-04-11Chanay, Jeffrey A Esq QUALIFIED70Asiya Javayant
1036James W BriddickJapan2025-04-20Chanay, Jeffrey A Esq RENEWAL30Onyama Limba
1037Chavez U BologniaGermany2025-04-07Morlong Associates PROPOSAL49Asiya Javayant
1038Julie L VocelkaRussia2025-04-28Rangoni Of Florence UNQUALIFIED96Xuxue Feng
1039Misaki V InouyeFrance2025-04-01Rangoni Of Florence NEGOTIATION71Ioni Bowcher
1040Kadeem T RimAustralia2025-04-03Chemel, James L Cpa PROPOSAL84Ivan Magalhaes
1041Mujtaba E InouyeIndia2025-04-10Chanay, Jeffrey A Esq QUALIFIED39Xuxue Feng
1042Deepesh I ShinkoSpain2025-04-08Buckley Miller Wright RENEWAL13Stephen Shaw
1043Leon V CaudyCanada2025-04-27Benton, John B Jr PROPOSAL22Anna Fali
1044Ashley J InouyeRussia2025-04-17Rangoni Of Florence QUALIFIED51Asiya Javayant
1045Aika N RutaAustralia2025-04-21Chapman, Ross E Esq NEGOTIATION73Ioni Bowcher
1046Tony U TollnerAustralia2025-04-05Chanay, Jeffrey A Esq QUALIFIED90Ivan Magalhaes
1047Silvio O MaletRussia2025-04-08Dorl, James J Esq NEGOTIATION18Anna Fali
1048Octavia J RutaCanada2025-04-18Rangoni Of Florence UNQUALIFIED15Ivan Magalhaes
1049Tony D CaldareraBrazil2025-04-23Morlong Associates NEW36Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Salvatore L PerinArgentinaBernardo Dominic PROPOSAL
Wickens I DarakjyArgentinaBernardo Dominic NEW
Jefferson P PoquetteBrazilXuxue Feng UNQUALIFIED
Aika M VenereIndiaAnna Fali NEW
Rodrigues W StensethArgentinaBernardo Dominic RENEWAL
David T SaylorsUnited KingdomAsiya Javayant QUALIFIED
Octavia C BologniaArgentinaStephen Shaw RENEWAL
Murillo O GauchoArgentinaIoni Bowcher UNQUALIFIED
Wickens P MorascaJapanAnna Fali QUALIFIED
Julie C DilliardJapanAmy Elsner QUALIFIED
Arvin U IturbideCanadaElwin Sharvill UNQUALIFIED
Isabel P AlbaresUnited KingdomOnyama Limba RENEWAL
Sinclair Q VocelkaAustraliaIoni Bowcher PROPOSAL
Rodrigues T FollerItalyStephen Shaw NEGOTIATION
James L KuskoRussiaElwin Sharvill RENEWAL
Francesco E OstroskyGermanyXuxue Feng NEGOTIATION
Greenwood O FlosiItalyAnna Fali RENEWAL
Aika Z RimBrazilAnna Fali UNQUALIFIED
Emily I InouyeAustraliaIoni Bowcher UNQUALIFIED
Clifford T AmigonArgentinaAmy Elsner RENEWAL
Leja H FerenczIndiaStephen Shaw NEGOTIATION
Isabel G PaprockiIndiaOnyama Limba UNQUALIFIED
Isabel X RimJapanStephen Shaw UNQUALIFIED
Ashley G OldroydUnited KingdomStephen Shaw NEW
Antonio E GauchoCanadaXuxue Feng QUALIFIED
Greenwood B BologniaArgentinaBernardo Dominic PROPOSAL
Nicolas P KolmetzIndiaBernardo Dominic NEW
Rodrigues P GauchoSpainStephen Shaw NEGOTIATION
Cody M RimAustraliaAmy Elsner NEW
Emily N MacleadCanadaBernardo Dominic UNQUALIFIED
Arvin C ButtBrazilIoni Bowcher NEGOTIATION
Sinclair Y CaldareraAustraliaIvan Magalhaes RENEWAL
Jones E GarufiJapanIoni Bowcher UNQUALIFIED
Leon F CaudyCanadaIoni Bowcher QUALIFIED
Salvatore W FlosiSpainOnyama Limba UNQUALIFIED
Ricardo D FigeroaBrazilElwin Sharvill RENEWAL
Aruna M PerinIndiaStephen Shaw PROPOSAL
Maisha G GarufiArgentinaAnna Fali QUALIFIED
Antonio E VenereJapanIvan Magalhaes NEGOTIATION
Sinclair T PoquetteBrazilElwin Sharvill PROPOSAL
David Y AmigonGermanyOnyama Limba NEW
Chavez E KolmetzIndiaStephen Shaw UNQUALIFIED
Deepesh K RoysterSpainIoni Bowcher QUALIFIED
Juan I MaletBrazilStephen Shaw UNQUALIFIED
Juan C PerinAustraliaElwin Sharvill RENEWAL
Leja R VenereItalyIoni Bowcher QUALIFIED
Stacey P RimGermanyStephen Shaw UNQUALIFIED
Juan J FlosiItalyBernardo Dominic NEGOTIATION
Octavia Q FigeroaIndiaAmy Elsner NEW
Chavez Y MaletFranceAsiya Javayant NEGOTIATION
Frozen Columns
Name
Stacey X Marrier
Tony N Rulapaugh
Aditya S Poquette
Aditya U Malet
Greenwood D Sergi
Kadeem Y Glick
Maisha D Figeroa
Leja C Nicka
Mujtaba X Caldarera
Kadeem S Tollner
Ivar I Oldroyd
Isabel I Ferencz
James V Doe
Aditya S Slusarski
Antonio F Stockham
Wickens S Dilliard
Isabel E Wieser
Clifford I Waycott
Arvin I Shinko
Chavez V Kolmetz
Wickens C Tollner
Adams R Ferencz
Maisha F Flosi
Aruna N Gaucho
Kadeem X Stenseth
Nicolas W Doe
Sinclair N Glick
Aditya Q Malet
Alejandro Q Venere
Mujtaba P Wieser
Maria F Ostrosky
Isabel J Nestle
Isabel N Slusarski
Mujtaba S Ferencz
Kadeem R Albares
Deepesh F Wieser
Ashley Y Malet
Emily E Ostrosky
Greenwood V Tollner
Rodrigues C Kolmetz
Octavia O Chui
Emily Z Glick
Costa J Bowley
Maisha Y Dilliard
Morrow P Garufi
Nicolas M Ostrosky
Stacey Q Glick
Ivar V Maclead
Jones M Bolognia
Ashley D Darakjy
IdCountryDate
1000Brazil2025-04-07
1001Spain2025-04-26
1002Italy2025-04-16
1003United Kingdom2025-04-09
1004Brazil2025-04-29
1005Germany2025-04-26
1006Russia2025-04-01
1007Brazil2025-04-12
1008Spain2025-04-24
1009India2025-04-08
1010Italy2025-04-09
1011Brazil2025-04-01
1012Italy2025-04-18
1013Germany2025-04-02
1014Spain2025-04-27
1015Canada2025-04-28
1016Germany2025-04-09
1017Russia2025-04-16
1018United Kingdom2025-04-26
1019Italy2025-04-26
1020Russia2025-04-04
1021Germany2025-04-18
1022Argentina2025-04-02
1023Italy2025-04-11
1024Italy2025-04-22
1025Russia2025-04-02
1026Japan2025-04-01
1027Canada2025-04-06
1028Japan2025-04-01
1029Japan2025-04-04
1030Argentina2025-04-28
1031United Kingdom2025-04-28
1032Italy2025-04-14
1033Canada2025-04-14
1034Canada2025-04-26
1035Australia2025-04-25
1036Australia2025-04-10
1037Italy2025-03-31
1038India2025-04-17
1039Australia2025-04-01
1040France2025-04-19
1041United Kingdom2025-04-07
1042Brazil2025-04-14
1043Australia2025-04-27
1044India2025-04-10
1045Brazil2025-04-08
1046Argentina2025-04-03
1047Argentina2025-04-11
1048Argentina2025-03-31
1049India2025-04-14

On-Demand Data

NameIdCountryDate
Jones Y Perin1000Argentina2025-04-16
Julie Y Poquette1001Argentina2025-04-02
Morrow L Darakjy1002Germany2025-04-05
Ricardo A Darakjy1003France2025-04-27
Kaitlin D Butt1004France2025-04-20
Cody M Stockham1005Spain2025-04-16
Faith S Doe1006Germany2025-04-07
Isabel R Nestle1007Italy2025-04-15
Nicolas S Gaucho1008Brazil2025-04-09
Antonio V Oldroyd1009Argentina2025-04-11
Izzy H Slusarski1010Italy2025-04-14
Maisha X Ostrosky1011Canada2025-04-11
Costa L Whobrey1012Russia2025-04-11
Salvatore L Kusko1013Brazil2025-04-07
Aruna X Nestle1014Argentina2025-04-11
Arvin A Malet1015Brazil2025-04-15
Maria P Poquette1016Australia2025-04-03
Claire T Venere1017Italy2025-04-18
Mayumi F Morasca1018Germany2025-04-17
Ivar F Chui1019Canada2025-04-26
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Ivar A IturbideGermanyOnyama Limba NEW
Johnson B ShinkoCanadaAsiya Javayant QUALIFIED
Claire E DilliardArgentinaAsiya Javayant UNQUALIFIED
Claire R SergiItalyXuxue Feng UNQUALIFIED
Morrow R TollnerAustraliaElwin Sharvill NEGOTIATION
Maisha X FollerBrazilBernardo Dominic NEGOTIATION
Izzy Y RimGermanyAnna Fali NEW
James C AlbaresIndiaAmy Elsner UNQUALIFIED
Adams J BologniaItalyIvan Magalhaes QUALIFIED
Antonio Z GauchoUnited KingdomStephen Shaw PROPOSAL
Darci N AmigonUnited KingdomBernardo Dominic NEGOTIATION
Ashley S AmigonJapanOnyama Limba UNQUALIFIED
Darci W CampainIndiaXuxue Feng UNQUALIFIED
Morrow K IturbideUnited KingdomBernardo Dominic PROPOSAL
Nicolas Z InouyeUnited KingdomBernardo Dominic UNQUALIFIED
Kadeem K WaycottFranceStephen Shaw RENEWAL
Misaki G CampainAustraliaAnna Fali QUALIFIED
Arvin N WaycottItalyIoni Bowcher UNQUALIFIED
Chavez J KuskoFranceAmy Elsner NEGOTIATION
Emily V StockhamUnited KingdomAmy Elsner NEGOTIATION
Claire Y MacleadJapanIvan Magalhaes PROPOSAL
Sinclair D KolmetzArgentinaStephen Shaw QUALIFIED
Ashley S DoeCanadaAnna Fali RENEWAL
Wickens R TollnerFranceElwin Sharvill RENEWAL
Arvin B DarakjyAustraliaXuxue Feng PROPOSAL
Jones S GlickCanadaXuxue Feng RENEWAL
Smith M CaudyAustraliaStephen Shaw NEW
Tony F ButtSpainAsiya Javayant UNQUALIFIED
Ivar W DoeCanadaBernardo Dominic UNQUALIFIED
Antonio O GauchoCanadaOnyama Limba NEW
Francesco L GlickUnited KingdomBernardo Dominic NEW
Maria S SaylorsSpainAsiya Javayant QUALIFIED
Maisha H ChuiCanadaOnyama Limba PROPOSAL
Isabel Y VenereCanadaAmy Elsner QUALIFIED
Mayumi P CaudyArgentinaElwin Sharvill RENEWAL
Murillo Y FlosiFranceStephen Shaw RENEWAL
Juan C KuskoGermanyStephen Shaw NEW
Ricardo H BowleyGermanyAnna Fali NEW
Kadeem W MarrierItalyAsiya Javayant NEGOTIATION
Murillo S KuskoFranceAmy Elsner 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>