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
Misaki M RutaUnited KingdomXuxue Feng PROPOSAL
Adams Q StensethJapanBernardo Dominic NEGOTIATION
Emily A GillianFranceAmy Elsner UNQUALIFIED
Deepesh X SlusarskiGermanyAnna Fali PROPOSAL
Aditya K SchemmerItalyIoni Bowcher PROPOSAL
Kaitlin B DilliardAustraliaAsiya Javayant RENEWAL
Arvin D RutaAustraliaAnna Fali NEW
Misaki U CampainUnited KingdomBernardo Dominic PROPOSAL
Faith B ButtArgentinaIvan Magalhaes PROPOSAL
Octavia V DarakjyFranceIoni Bowcher UNQUALIFIED
Smith Y IturbideFranceAmy Elsner NEW
Faith Y RimRussiaAnna Fali NEGOTIATION
Leon X PoquetteJapanIoni Bowcher PROPOSAL
Greenwood L ShinkoRussiaIoni Bowcher NEW
Ricardo V DoeRussiaOnyama Limba RENEWAL
Clifford F DoeJapanIoni Bowcher NEGOTIATION
Julie P GarufiItalyBernardo Dominic PROPOSAL
Misaki F StensethSpainElwin Sharvill PROPOSAL
Emily Y FerenczItalyXuxue Feng NEGOTIATION
Munro T GlickJapanIvan Magalhaes QUALIFIED
Leja W GauchoFranceOnyama Limba QUALIFIED
Kadeem Y FlosiSpainIoni Bowcher PROPOSAL
Aditya A ShinkoAustraliaOnyama Limba RENEWAL
Aruna T FollerSpainStephen Shaw RENEWAL
Aruna P VenereRussiaOnyama Limba PROPOSAL
Misaki Q GarufiRussiaIoni Bowcher QUALIFIED
David F AlbaresItalyAsiya Javayant QUALIFIED
Leon D OldroydIndiaXuxue Feng NEGOTIATION
Isabel F WieserBrazilAnna Fali NEW
Cody U DoeArgentinaAnna Fali QUALIFIED
Misaki N SchemmerJapanBernardo Dominic PROPOSAL
Rodrigues U RoysterBrazilBernardo Dominic UNQUALIFIED
Julie Y DoeRussiaStephen Shaw NEW
Stacey H KuskoIndiaAnna Fali UNQUALIFIED
Aika F GarufiFranceXuxue Feng NEW
Julie Q ChuiItalyStephen Shaw PROPOSAL
Mujtaba G FollerSpainBernardo Dominic PROPOSAL
Adams C AmigonBrazilAnna Fali NEGOTIATION
Mayumi G CampainCanadaIvan Magalhaes QUALIFIED
Julie O StensethItalyOnyama Limba NEW
Morrow Y GauchoGermanyXuxue Feng QUALIFIED
Johnson P OldroydSpainAnna Fali PROPOSAL
Jennifer H MorascaAustraliaElwin Sharvill PROPOSAL
Aditya D MarrierRussiaXuxue Feng NEW
Claire H MaletBrazilOnyama Limba PROPOSAL
Julie I WieserArgentinaXuxue Feng NEGOTIATION
Aditya U PaprockiRussiaAsiya Javayant QUALIFIED
Izzy M GarufiSpainOnyama Limba UNQUALIFIED
Smith S OldroydSpainIoni Bowcher NEGOTIATION
Silvio Q RutaUnited KingdomAmy Elsner RENEWAL
Horizontal
NameCountryRepresentativeStatus
Jefferson S PoquetteRussiaAsiya Javayant QUALIFIED
Jeanfrancois D AmigonRussiaAsiya Javayant RENEWAL
Izzy X ChuiAustraliaAmy Elsner NEGOTIATION
Maisha J PaprockiArgentinaXuxue Feng RENEWAL
Leja E FlosiAustraliaOnyama Limba QUALIFIED
Jefferson G GauchoItalyElwin Sharvill RENEWAL
Arvin V WieserItalyAnna Fali UNQUALIFIED
Wickens A RutaUnited KingdomAsiya Javayant UNQUALIFIED
Ashley Y ChuiAustraliaAnna Fali NEW
Leon O BologniaSpainXuxue Feng RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Greenwood C GillianArgentina2025-05-11Feiner Bros NEGOTIATION15Anna Fali
1001Costa Y GarufiRussia2025-04-16Truhlar And Truhlar Attys UNQUALIFIED53Stephen Shaw
1002Deepesh V WieserGermany2025-05-03Buckley Miller Wright RENEWAL63Asiya Javayant
1003Adams T BriddickItaly2025-04-13Rousseaux, Michael Esq PROPOSAL85Onyama Limba
1004Munro F RimIndia2025-05-08Commercial Press RENEWAL96Stephen Shaw
1005James Y RimCanada2025-05-07Commercial Press PROPOSAL50Anna Fali
1006Mayumi P SlusarskiSpain2025-04-30Truhlar And Truhlar Attys QUALIFIED16Elwin Sharvill
1007Alejandro G RimBrazil2025-04-26Rousseaux, Michael Esq NEGOTIATION92Bernardo Dominic
1008Juan M CaldareraGermany2025-05-08Printing Dimensions QUALIFIED2Elwin Sharvill
1009Mujtaba Y VocelkaArgentina2025-05-03Rangoni Of Florence PROPOSAL66Anna Fali
1010Johnson S PoquetteBrazil2025-04-30Truhlar And Truhlar Attys NEGOTIATION94Onyama Limba
1011Smith S CaudyJapan2025-04-26Chanay, Jeffrey A Esq NEGOTIATION86Elwin Sharvill
1012Jennifer Y SlusarskiUnited Kingdom2025-05-09Chanay, Jeffrey A Esq UNQUALIFIED79Elwin Sharvill
1013Greenwood O TollnerRussia2025-04-29Buckley Miller Wright RENEWAL75Anna Fali
1014Ashley Z RulapaughFrance2025-05-08Feiner Bros RENEWAL90Bernardo Dominic
1015Maria F DoeRussia2025-04-22Morlong Associates NEGOTIATION38Xuxue Feng
1016Tony R TollnerGermany2025-05-10Commercial Press UNQUALIFIED11Ioni Bowcher
1017Arvin B KuskoItaly2025-04-27Rousseaux, Michael Esq RENEWAL18Asiya Javayant
1018Isabel U MaletAustralia2025-05-04King, Christopher A Esq NEGOTIATION12Stephen Shaw
1019Johnson C GarufiIndia2025-05-12Truhlar And Truhlar Attys NEGOTIATION83Anna Fali
1020Juan Y FigeroaCanada2025-05-10Rangoni Of Florence NEGOTIATION77Asiya Javayant
1021Jennifer D MorascaJapan2025-05-09Chanay, Jeffrey A Esq NEW70Stephen Shaw
1022James O NickaRussia2025-04-24Printing Dimensions NEW21Onyama Limba
1023Misaki V MaletBrazil2025-05-07Commercial Press NEW86Ivan Magalhaes
1024Maria M BowleyRussia2025-04-15Rousseaux, Michael Esq NEGOTIATION62Ioni Bowcher
1025Murillo V DarakjyItaly2025-05-04Dorl, James J Esq QUALIFIED58Stephen Shaw
1026Stacey T VocelkaRussia2025-04-23Feiner Bros NEW37Stephen Shaw
1027Jennifer C KuskoRussia2025-05-06Chanay, Jeffrey A Esq NEGOTIATION10Xuxue Feng
1028Tony O MacleadRussia2025-05-04Chapman, Ross E Esq UNQUALIFIED93Stephen Shaw
1029Tony S FerenczAustralia2025-04-29Dorl, James J Esq UNQUALIFIED51Asiya Javayant
1030Stacey D PerinJapan2025-05-11Truhlar And Truhlar Attys QUALIFIED35Ivan Magalhaes
1031Salvatore E ShinkoGermany2025-04-19Rangoni Of Florence UNQUALIFIED41Ioni Bowcher
1032Kadeem I RulapaughRussia2025-04-30Chapman, Ross E Esq UNQUALIFIED7Elwin Sharvill
1033Claire M CaudySpain2025-04-21Chanay, Jeffrey A Esq NEGOTIATION94Asiya Javayant
1034Murillo R RulapaughRussia2025-04-30Feltz Printing Service QUALIFIED33Xuxue Feng
1035Leon O SergiBrazil2025-05-05Buckley Miller Wright UNQUALIFIED11Onyama Limba
1036Jeanfrancois X CampainJapan2025-05-12Dorl, James J Esq NEGOTIATION50Anna Fali
1037Sinclair K MorascaRussia2025-04-15Rousseaux, Michael Esq UNQUALIFIED99Asiya Javayant
1038Jones U FigeroaSpain2025-04-14Rangoni Of Florence PROPOSAL47Asiya Javayant
1039James B KolmetzItaly2025-05-01Truhlar And Truhlar Attys NEW37Onyama Limba
1040Tony X WhobreySpain2025-05-12Rangoni Of Florence RENEWAL17Ivan Magalhaes
1041Arvin K CaudyGermany2025-05-08Feiner Bros NEGOTIATION18Anna Fali
1042Antonio U TollnerAustralia2025-04-29Feltz Printing Service QUALIFIED57Xuxue Feng
1043Arvin P OstroskyItaly2025-04-24Benton, John B Jr QUALIFIED20Amy Elsner
1044Julie U OstroskyRussia2025-05-07Commercial Press RENEWAL39Bernardo Dominic
1045James T FerenczRussia2025-04-26Truhlar And Truhlar Attys PROPOSAL47Onyama Limba
1046Costa B BriddickUnited Kingdom2025-04-14Buckley Miller Wright QUALIFIED92Stephen Shaw
1047Isabel K PaprockiRussia2025-04-25Feiner Bros UNQUALIFIED92Ioni Bowcher
1048Maisha B ShinkoIndia2025-05-12Chanay, Jeffrey A Esq NEGOTIATION27Stephen Shaw
1049Mujtaba D StockhamFrance2025-05-12Truhlar And Truhlar Attys UNQUALIFIED21Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Aika H DarakjyIndiaAmy Elsner UNQUALIFIED
Aditya T MaletItalyBernardo Dominic PROPOSAL
Johnson I WhobreyFranceXuxue Feng PROPOSAL
Wickens X IturbideFranceStephen Shaw NEW
Claire E AmigonAustraliaBernardo Dominic PROPOSAL
Wickens T OstroskyItalyStephen Shaw NEW
Ashley X BowleyItalyAmy Elsner NEW
Johnson U OstroskyArgentinaXuxue Feng PROPOSAL
Salvatore O StensethFranceAsiya Javayant RENEWAL
Isabel A IturbideBrazilIvan Magalhaes UNQUALIFIED
James O TollnerGermanyStephen Shaw NEW
Tony H PoquetteBrazilBernardo Dominic PROPOSAL
Cody F PerinIndiaXuxue Feng PROPOSAL
Ivar Z DarakjyBrazilStephen Shaw NEGOTIATION
Cody W WieserItalyAsiya Javayant NEGOTIATION
Claire E IturbideIndiaBernardo Dominic QUALIFIED
Juan A MarrierFranceElwin Sharvill NEW
Jefferson U NickaIndiaOnyama Limba QUALIFIED
Stacey F StockhamUnited KingdomAnna Fali UNQUALIFIED
Silvio O SergiRussiaIvan Magalhaes NEW
Cody K NickaUnited KingdomIvan Magalhaes PROPOSAL
Darci H SaylorsAustraliaOnyama Limba NEGOTIATION
Arvin A OstroskyRussiaAsiya Javayant NEGOTIATION
Izzy G SaylorsAustraliaElwin Sharvill NEW
Jeanfrancois V NickaJapanXuxue Feng NEGOTIATION
Aruna G DoeIndiaAmy Elsner UNQUALIFIED
Ricardo Z NickaBrazilIoni Bowcher QUALIFIED
Misaki X GauchoUnited KingdomOnyama Limba NEGOTIATION
Ashley R GauchoAustraliaAnna Fali QUALIFIED
Salvatore J VocelkaItalyOnyama Limba NEW
Cody Y RulapaughJapanElwin Sharvill RENEWAL
Mujtaba W WaycottFranceAnna Fali QUALIFIED
Faith E NestleGermanyStephen Shaw PROPOSAL
Adams E VocelkaItalyXuxue Feng QUALIFIED
Izzy Q PerinIndiaAnna Fali NEW
Julie E CampainAustraliaBernardo Dominic UNQUALIFIED
Rodrigues W VenereItalyAnna Fali PROPOSAL
Emily G WieserBrazilStephen Shaw UNQUALIFIED
Leja O ChuiIndiaXuxue Feng UNQUALIFIED
Jones P VenereCanadaElwin Sharvill UNQUALIFIED
Sinclair A GlickFranceAnna Fali UNQUALIFIED
Aruna B SaylorsSpainOnyama Limba NEW
Francesco J CaldareraBrazilElwin Sharvill PROPOSAL
Kaitlin P DarakjyCanadaAmy Elsner PROPOSAL
Octavia X NestleRussiaBernardo Dominic NEGOTIATION
Izzy F SchemmerFranceIvan Magalhaes RENEWAL
Costa C StensethSpainIvan Magalhaes NEGOTIATION
Izzy R WieserArgentinaIvan Magalhaes PROPOSAL
Salvatore J VenereIndiaIoni Bowcher UNQUALIFIED
Deepesh X WaycottIndiaIoni Bowcher QUALIFIED
Frozen Columns
Name
David O Chui
Silvio V Schemmer
Francesco N Marrier
Stacey B Paprocki
Juan G Foller
Aika K Maclead
Costa W Doe
Ricardo V Kusko
Jeanfrancois O Garufi
Munro Q Bowley
Rodrigues Q Stenseth
Jefferson J Marrier
Claire B Royster
Adams G Shinko
Izzy D Maclead
Tony H Morasca
Stacey C Royster
Maisha F Campain
Mujtaba U Malet
Stacey I Iturbide
Smith W Paprocki
Chavez M Tollner
Ricardo J Ostrosky
James M Poquette
Juan T Doe
Maria J Oldroyd
Wickens P Garufi
Salvatore N Ferencz
Clifford X Wieser
Juan F Ostrosky
Aditya I Oldroyd
Faith A Oldroyd
Claire C Malet
Claire F Tollner
Chavez K Glick
Deepesh H Butt
Salvatore K Kusko
Claire U Albares
Maisha R Royster
Izzy F Slusarski
Leon R Albares
Ashley O Iturbide
Smith N Bolognia
Izzy N Dilliard
Mayumi F Ruta
Julie D Shinko
Sinclair A Flosi
Maisha B Gaucho
Julie P Darakjy
Ashley I Tollner
IdCountryDate
1000Spain2025-04-16
1001United Kingdom2025-05-09
1002India2025-04-17
1003Germany2025-05-11
1004Brazil2025-05-04
1005Germany2025-04-22
1006Italy2025-05-02
1007Italy2025-04-20
1008Canada2025-04-27
1009Russia2025-05-06
1010Australia2025-05-01
1011Brazil2025-05-03
1012United Kingdom2025-05-03
1013Japan2025-04-15
1014Argentina2025-04-28
1015Australia2025-05-04
1016Italy2025-04-30
1017India2025-05-12
1018Italy2025-04-20
1019Argentina2025-05-04
1020France2025-05-11
1021Spain2025-04-25
1022Australia2025-04-26
1023Germany2025-04-13
1024India2025-04-27
1025Italy2025-04-18
1026United Kingdom2025-04-20
1027Canada2025-05-10
1028Japan2025-04-28
1029Brazil2025-04-28
1030Brazil2025-04-23
1031Italy2025-04-18
1032Canada2025-04-20
1033United Kingdom2025-04-19
1034United Kingdom2025-05-11
1035Russia2025-05-07
1036Japan2025-04-22
1037Brazil2025-04-18
1038Argentina2025-04-14
1039India2025-04-18
1040France2025-05-01
1041Argentina2025-04-30
1042Canada2025-04-22
1043France2025-05-08
1044Germany2025-04-13
1045Brazil2025-04-30
1046United Kingdom2025-05-01
1047Germany2025-04-27
1048Argentina2025-04-29
1049Brazil2025-04-26

On-Demand Data

NameIdCountryDate
Mujtaba J Chui1000France2025-05-03
Munro F Garufi1001Germany2025-04-25
Maria Y Malet1002Russia2025-05-09
Ashley O Ferencz1003Japan2025-05-03
Johnson D Marrier1004Germany2025-05-06
Deepesh K Marrier1005Brazil2025-04-21
Silvio Z Flosi1006France2025-04-21
Deepesh W Waycott1007Russia2025-04-14
Isabel N Slusarski1008Russia2025-05-05
David T Stockham1009Italy2025-05-06
Rodrigues C Saylors1010Canada2025-04-22
Rodrigues B Waycott1011Spain2025-04-20
Jeanfrancois V Caudy1012Brazil2025-05-06
Tony D Rulapaugh1013France2025-04-20
Ashley N Butt1014Russia2025-04-26
Johnson T Morasca1015France2025-05-07
Jennifer G Gillian1016Italy2025-04-15
Francesco J Doe1017India2025-04-17
Emily J Saylors1018France2025-04-13
Deepesh W Garufi1019Japan2025-04-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Tony J SlusarskiUnited KingdomAnna Fali NEW
Mujtaba Q ButtArgentinaStephen Shaw RENEWAL
Aruna F SchemmerArgentinaAsiya Javayant UNQUALIFIED
Darci S VenereRussiaIvan Magalhaes PROPOSAL
Izzy A DoeJapanIoni Bowcher RENEWAL
James K GauchoBrazilStephen Shaw NEW
Maria D SlusarskiGermanyAnna Fali UNQUALIFIED
Clifford Y RutaGermanyAsiya Javayant RENEWAL
Salvatore S BologniaBrazilIvan Magalhaes QUALIFIED
Johnson N BologniaFranceXuxue Feng PROPOSAL
Mayumi X BowleyArgentinaIoni Bowcher QUALIFIED
Salvatore Z GlickFranceOnyama Limba NEGOTIATION
Greenwood O MacleadUnited KingdomIoni Bowcher QUALIFIED
Jennifer T SaylorsItalyAmy Elsner PROPOSAL
Murillo E SergiItalyAmy Elsner PROPOSAL
Faith Q KolmetzSpainOnyama Limba PROPOSAL
Deepesh A MaletIndiaElwin Sharvill PROPOSAL
Wickens A SaylorsJapanBernardo Dominic RENEWAL
Octavia U IturbideRussiaAnna Fali PROPOSAL
James J PerinItalyBernardo Dominic NEGOTIATION
Jennifer N WhobreyArgentinaBernardo Dominic NEGOTIATION
Tony O SaylorsBrazilIoni Bowcher RENEWAL
Chavez F KolmetzSpainAmy Elsner NEGOTIATION
James H CaldareraRussiaElwin Sharvill PROPOSAL
Misaki S MorascaArgentinaBernardo Dominic NEGOTIATION
Emily B DilliardUnited KingdomStephen Shaw PROPOSAL
Wickens J ChuiArgentinaOnyama Limba PROPOSAL
James A MaletSpainIvan Magalhaes NEGOTIATION
Julie J PaprockiSpainOnyama Limba NEGOTIATION
James G TollnerItalyAmy Elsner NEGOTIATION
Smith I GillianCanadaXuxue Feng UNQUALIFIED
Julie R GarufiJapanIvan Magalhaes QUALIFIED
Julie J GarufiItalyIoni Bowcher NEW
Aruna B SergiCanadaElwin Sharvill UNQUALIFIED
Silvio H StockhamIndiaStephen Shaw QUALIFIED
Greenwood R CampainCanadaAsiya Javayant QUALIFIED
Tony R CaudyGermanyOnyama Limba NEGOTIATION
Misaki J GillianArgentinaBernardo Dominic UNQUALIFIED
Stacey D IturbideJapanBernardo Dominic NEGOTIATION
Rodrigues C WaycottSpainBernardo Dominic 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>