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
Deepesh M KolmetzArgentinaIvan Magalhaes QUALIFIED
Mayumi K InouyeAustraliaOnyama Limba UNQUALIFIED
Wickens E CampainFranceXuxue Feng NEW
Mujtaba X TollnerAustraliaIoni Bowcher PROPOSAL
Salvatore N CampainJapanIvan Magalhaes PROPOSAL
Arvin E KolmetzGermanyBernardo Dominic UNQUALIFIED
Darci T DarakjyCanadaIoni Bowcher QUALIFIED
Mujtaba P InouyeCanadaAmy Elsner NEGOTIATION
Silvio H FlosiArgentinaXuxue Feng RENEWAL
Cody J KolmetzIndiaBernardo Dominic NEW
Clifford Z FollerJapanAmy Elsner NEGOTIATION
Leja Y CaudyJapanOnyama Limba NEW
Morrow W OstroskyArgentinaIvan Magalhaes NEW
Julie T VocelkaSpainElwin Sharvill RENEWAL
Murillo M ButtRussiaXuxue Feng PROPOSAL
Maria V MaletAustraliaAsiya Javayant UNQUALIFIED
Silvio H SchemmerArgentinaAsiya Javayant PROPOSAL
Ricardo A StensethIndiaAsiya Javayant QUALIFIED
Nicolas G FerenczBrazilXuxue Feng PROPOSAL
Claire X AlbaresBrazilAmy Elsner UNQUALIFIED
Octavia J WhobreyAustraliaAmy Elsner QUALIFIED
David Q BriddickFranceOnyama Limba RENEWAL
Costa Q VenereGermanyIvan Magalhaes NEGOTIATION
Rodrigues T RoysterAustraliaElwin Sharvill NEGOTIATION
Misaki V RoysterItalyIoni Bowcher PROPOSAL
Rodrigues X VenereBrazilStephen Shaw RENEWAL
Chavez H SaylorsIndiaAsiya Javayant QUALIFIED
Kadeem Q NestleRussiaBernardo Dominic NEGOTIATION
Salvatore V SchemmerIndiaIvan Magalhaes QUALIFIED
Sinclair P IturbideArgentinaAmy Elsner NEGOTIATION
David F CaudyCanadaIoni Bowcher NEGOTIATION
Jones U BowleyIndiaStephen Shaw NEGOTIATION
Chavez N PaprockiUnited KingdomBernardo Dominic NEGOTIATION
Aditya V FerenczBrazilAsiya Javayant NEGOTIATION
Smith L SchemmerBrazilAsiya Javayant RENEWAL
Alejandro N SaylorsItalyStephen Shaw NEW
Cody H PoquetteRussiaIoni Bowcher NEW
Cody E FollerAustraliaOnyama Limba RENEWAL
Deepesh Z KolmetzItalyAnna Fali NEW
James L CaudyAustraliaIvan Magalhaes UNQUALIFIED
Jeanfrancois Y NickaUnited KingdomElwin Sharvill NEGOTIATION
Claire E ShinkoItalyAnna Fali NEW
Claire I KuskoItalyIoni Bowcher NEGOTIATION
Maria F BologniaSpainIvan Magalhaes QUALIFIED
Munro P RulapaughJapanAmy Elsner NEW
Costa L ChuiItalyXuxue Feng NEW
Jefferson H ButtUnited KingdomElwin Sharvill QUALIFIED
Mayumi D SaylorsBrazilStephen Shaw NEGOTIATION
Aditya S GillianJapanStephen Shaw QUALIFIED
Jones R StensethGermanyAsiya Javayant NEW
Horizontal
NameCountryRepresentativeStatus
Antonio B BologniaSpainXuxue Feng UNQUALIFIED
Adams F RoysterGermanyElwin Sharvill RENEWAL
Claire V GillianBrazilBernardo Dominic QUALIFIED
Greenwood C BriddickCanadaStephen Shaw RENEWAL
Silvio J SlusarskiUnited KingdomIoni Bowcher PROPOSAL
Faith B NestleFranceXuxue Feng QUALIFIED
Jones V MacleadFranceAsiya Javayant UNQUALIFIED
James M KuskoAustraliaXuxue Feng RENEWAL
Isabel B WieserAustraliaAnna Fali UNQUALIFIED
Tony G KolmetzJapanAsiya Javayant PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aruna D SchemmerArgentina2025-04-19Rangoni Of Florence UNQUALIFIED87Asiya Javayant
1001David V BriddickBrazil2025-04-18Dorl, James J Esq PROPOSAL54Ivan Magalhaes
1002Ashley H ShinkoUnited Kingdom2025-04-15Commercial Press NEW24Onyama Limba
1003Jefferson L CaldareraCanada2025-04-15King, Christopher A Esq PROPOSAL25Stephen Shaw
1004Aditya K FollerCanada2025-04-28Rangoni Of Florence UNQUALIFIED35Ivan Magalhaes
1005Octavia F WaycottCanada2025-04-09Feltz Printing Service QUALIFIED22Anna Fali
1006Cody U KuskoUnited Kingdom2025-04-23Chanay, Jeffrey A Esq NEGOTIATION61Ivan Magalhaes
1007Jennifer M DilliardSpain2025-04-28Morlong Associates UNQUALIFIED44Elwin Sharvill
1008Chavez Z AmigonSpain2025-04-21Chapman, Ross E Esq PROPOSAL31Xuxue Feng
1009Stacey P GlickUnited Kingdom2025-04-25Truhlar And Truhlar Attys QUALIFIED55Amy Elsner
1010Leon Q WhobreyUnited Kingdom2025-04-14Chemel, James L Cpa NEW67Ivan Magalhaes
1011Adams E MaletJapan2025-04-09Printing Dimensions QUALIFIED66Ivan Magalhaes
1012Ivar Q PaprockiJapan2025-04-13Morlong Associates NEW35Anna Fali
1013Sinclair Q DoeBrazil2025-04-17Rousseaux, Michael Esq PROPOSAL72Asiya Javayant
1014Claire X SlusarskiGermany2025-04-11Benton, John B Jr QUALIFIED11Stephen Shaw
1015Greenwood G CampainArgentina2025-04-13Feltz Printing Service NEW78Bernardo Dominic
1016Sinclair E FlosiArgentina2025-04-28Commercial Press PROPOSAL8Xuxue Feng
1017Jeanfrancois T FollerGermany2025-04-01Feltz Printing Service UNQUALIFIED0Onyama Limba
1018Leja H RutaItaly2025-04-06King, Christopher A Esq RENEWAL68Stephen Shaw
1019Salvatore D NestleGermany2025-04-06Benton, John B Jr UNQUALIFIED35Onyama Limba
1020Maisha G ShinkoGermany2025-04-28Chanay, Jeffrey A Esq RENEWAL72Ioni Bowcher
1021Silvio R DoeJapan2025-04-27Benton, John B Jr RENEWAL38Asiya Javayant
1022Ricardo I PerinUnited Kingdom2025-04-22King, Christopher A Esq QUALIFIED67Xuxue Feng
1023Greenwood T VocelkaItaly2025-04-30Morlong Associates UNQUALIFIED49Asiya Javayant
1024Stacey O MarrierGermany2025-04-19Morlong Associates NEW87Elwin Sharvill
1025Leon K ButtBrazil2025-04-03Benton, John B Jr UNQUALIFIED30Anna Fali
1026Costa E WieserCanada2025-04-04Rangoni Of Florence QUALIFIED38Ivan Magalhaes
1027Kaitlin T CampainBrazil2025-04-13Buckley Miller Wright NEW82Asiya Javayant
1028Jeanfrancois K NickaSpain2025-04-26Rousseaux, Michael Esq UNQUALIFIED51Bernardo Dominic
1029Darci E CaudyBrazil2025-04-18Dorl, James J Esq QUALIFIED91Anna Fali
1030Morrow J StensethRussia2025-04-01Dorl, James J Esq RENEWAL4Stephen Shaw
1031Adams V IturbideRussia2025-04-06Feiner Bros UNQUALIFIED99Stephen Shaw
1032Faith Y DoeBrazil2025-04-15Printing Dimensions NEGOTIATION64Elwin Sharvill
1033Rodrigues X RutaFrance2025-04-16Benton, John B Jr NEW35Anna Fali
1034Maria O ShinkoArgentina2025-04-20Chemel, James L Cpa UNQUALIFIED60Ioni Bowcher
1035Claire Z OldroydGermany2025-04-22Buckley Miller Wright PROPOSAL30Asiya Javayant
1036Darci T StockhamGermany2025-04-21Printing Dimensions NEGOTIATION32Anna Fali
1037Salvatore L FerenczFrance2025-04-06King, Christopher A Esq NEGOTIATION28Anna Fali
1038Mujtaba J RimGermany2025-04-06Buckley Miller Wright NEGOTIATION14Xuxue Feng
1039Kaitlin E KolmetzBrazil2025-04-27Truhlar And Truhlar Attys NEGOTIATION3Amy Elsner
1040Claire W GillianGermany2025-04-09Commercial Press UNQUALIFIED85Ioni Bowcher
1041Morrow Q WhobreyUnited Kingdom2025-04-08Chapman, Ross E Esq NEGOTIATION81Asiya Javayant
1042Mayumi Z BowleyJapan2025-04-18Morlong Associates RENEWAL5Asiya Javayant
1043Deepesh T VocelkaBrazil2025-04-01Chemel, James L Cpa QUALIFIED31Amy Elsner
1044Jeanfrancois R NestleBrazil2025-04-30Buckley Miller Wright PROPOSAL74Onyama Limba
1045Ricardo I MaletSpain2025-04-06Chanay, Jeffrey A Esq RENEWAL26Bernardo Dominic
1046Leon M FollerSpain2025-04-21Rousseaux, Michael Esq NEW62Amy Elsner
1047Arvin X ChuiCanada2025-04-07Chemel, James L Cpa UNQUALIFIED88Onyama Limba
1048Misaki S BowleyAustralia2025-04-20Rousseaux, Michael Esq PROPOSAL78Bernardo Dominic
1049Aditya O WaycottJapan2025-04-05King, Christopher A Esq PROPOSAL0Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Tony N GillianIndiaBernardo Dominic RENEWAL
Murillo Q WaycottRussiaIoni Bowcher NEGOTIATION
Chavez X SchemmerSpainIvan Magalhaes RENEWAL
Cody V FlosiBrazilAmy Elsner PROPOSAL
James P VenereItalyBernardo Dominic NEW
James K GillianCanadaAnna Fali NEW
Izzy J IturbideFranceBernardo Dominic NEW
Julie P BowleyRussiaIvan Magalhaes RENEWAL
Kadeem M KolmetzArgentinaElwin Sharvill NEGOTIATION
Arvin E DoeGermanyElwin Sharvill NEW
Tony J CampainSpainAsiya Javayant RENEWAL
Smith D ButtBrazilBernardo Dominic QUALIFIED
Greenwood W ButtJapanAmy Elsner UNQUALIFIED
Adams A FollerBrazilOnyama Limba QUALIFIED
Emily I VocelkaJapanIoni Bowcher NEGOTIATION
Ashley R TollnerFranceAnna Fali NEW
Clifford C OldroydItalyStephen Shaw PROPOSAL
Stacey R ChuiFranceAsiya Javayant NEW
Sinclair R DarakjySpainAmy Elsner QUALIFIED
James F WieserBrazilAmy Elsner NEGOTIATION
Cody A SlusarskiIndiaAsiya Javayant NEGOTIATION
Jennifer D RimSpainIvan Magalhaes QUALIFIED
Sinclair D DilliardAustraliaXuxue Feng PROPOSAL
Jefferson I KuskoIndiaXuxue Feng NEGOTIATION
Ashley D CaldareraCanadaAsiya Javayant NEGOTIATION
Antonio Z SlusarskiArgentinaIvan Magalhaes NEW
Antonio Z PerinCanadaAnna Fali QUALIFIED
Juan V WaycottSpainIoni Bowcher RENEWAL
Mujtaba K PaprockiAustraliaBernardo Dominic RENEWAL
Sinclair F WaycottJapanAsiya Javayant UNQUALIFIED
Antonio M RimGermanyXuxue Feng NEW
Costa W MaletSpainXuxue Feng UNQUALIFIED
Aruna E SaylorsBrazilIvan Magalhaes NEGOTIATION
Ricardo C AmigonItalyAmy Elsner QUALIFIED
Juan G BriddickAustraliaIvan Magalhaes PROPOSAL
Stacey I RimAustraliaAmy Elsner RENEWAL
Salvatore T CaudyFranceIvan Magalhaes UNQUALIFIED
Wickens C RimCanadaOnyama Limba NEGOTIATION
Kaitlin Y CaldareraArgentinaElwin Sharvill QUALIFIED
Emily A GillianIndiaXuxue Feng NEGOTIATION
Alejandro M IturbideCanadaXuxue Feng NEW
Jones I GillianFranceElwin Sharvill NEGOTIATION
Munro L FlosiItalyAsiya Javayant RENEWAL
Ashley U BowleyFranceXuxue Feng PROPOSAL
Emily C ShinkoUnited KingdomAmy Elsner PROPOSAL
Nicolas U PoquetteItalyStephen Shaw QUALIFIED
Isabel U RoysterGermanyIoni Bowcher PROPOSAL
Tony N PaprockiGermanyStephen Shaw NEGOTIATION
Chavez X AmigonSpainIvan Magalhaes NEGOTIATION
Leon Q VocelkaSpainIvan Magalhaes PROPOSAL
Frozen Columns
Name
Leja I Oldroyd
Aruna P Paprocki
Jefferson D Butt
Morrow L Campain
Ricardo K Perin
Salvatore C Bowley
Murillo H Nestle
Leja Q Schemmer
Mujtaba P Perin
Ricardo X Malet
Jones T Wieser
Ashley C Paprocki
Leja S Oldroyd
Aruna B Iturbide
Julie J Butt
Aruna N Waycott
Stacey B Bolognia
Ivar I Schemmer
Kaitlin V Waycott
Johnson M Maclead
Tony A Rim
Smith V Butt
Arvin U Rim
Emily V Vocelka
Misaki Y Chui
Ivar F Paprocki
Ashley B Doe
Tony D Whobrey
Adams Y Bowley
Nicolas B Schemmer
Isabel O Slusarski
Rodrigues T Wieser
Munro C Albares
Kadeem C Chui
Izzy Y Stockham
Julie G Saylors
Nicolas Y Glick
Ricardo F Marrier
Rodrigues V Doe
Morrow X Butt
Ivar M Gaucho
Misaki J Nestle
Jennifer B Doe
Ivar D Nicka
Rodrigues L Bowley
Kadeem Y Butt
Isabel F Ferencz
Jeanfrancois S Figeroa
Emily A Oldroyd
Johnson H Campain
IdCountryDate
1000India2025-04-14
1001Italy2025-04-08
1002United Kingdom2025-04-02
1003Canada2025-04-13
1004United Kingdom2025-04-13
1005Japan2025-04-20
1006Russia2025-04-26
1007Germany2025-04-09
1008France2025-04-11
1009Russia2025-04-30
1010Spain2025-04-18
1011Spain2025-04-29
1012India2025-04-17
1013Germany2025-04-18
1014United Kingdom2025-04-01
1015India2025-04-27
1016Italy2025-04-20
1017Germany2025-04-12
1018Russia2025-04-13
1019Australia2025-04-20
1020Japan2025-04-20
1021France2025-04-19
1022Brazil2025-04-10
1023Russia2025-04-14
1024Japan2025-04-07
1025Germany2025-04-05
1026Australia2025-04-11
1027Russia2025-04-19
1028Italy2025-04-18
1029France2025-04-01
1030Japan2025-04-26
1031Spain2025-04-20
1032Italy2025-04-22
1033Canada2025-04-15
1034Australia2025-04-10
1035Canada2025-04-21
1036Japan2025-04-22
1037France2025-04-15
1038Italy2025-04-10
1039Germany2025-04-03
1040Brazil2025-04-27
1041Russia2025-04-14
1042Germany2025-04-10
1043Italy2025-04-30
1044Russia2025-04-18
1045Japan2025-04-02
1046Germany2025-04-23
1047India2025-04-25
1048Argentina2025-04-25
1049Japan2025-04-15

On-Demand Data

NameIdCountryDate
Aruna L Gillian1000Brazil2025-04-15
Nicolas N Morasca1001Russia2025-04-08
Isabel C Kolmetz1002Japan2025-04-02
Francesco M Kusko1003Russia2025-04-15
Antonio H Maclead1004Argentina2025-04-28
Claire W Flosi1005Canada2025-04-04
Costa J Figeroa1006Japan2025-04-01
Darci D Wieser1007Spain2025-04-07
Izzy Y Caldarera1008Japan2025-04-25
Maisha P Schemmer1009Spain2025-04-23
Julie C Ferencz1010Australia2025-04-08
Jennifer J Royster1011Russia2025-04-04
Chavez P Gaucho1012Italy2025-04-07
Greenwood I Ruta1013Australia2025-04-07
Ashley J Malet1014Canada2025-04-07
Mujtaba Z Doe1015France2025-04-11
David N Darakjy1016Brazil2025-04-04
Aika N Figeroa1017Germany2025-04-11
Sinclair D Malet1018France2025-04-03
Kaitlin W Poquette1019Australia2025-04-30
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Rodrigues C FerenczItalyStephen Shaw PROPOSAL
Ashley J PerinGermanyAsiya Javayant RENEWAL
Isabel H VenereGermanyAmy Elsner UNQUALIFIED
Isabel V NickaArgentinaIoni Bowcher NEW
Maisha N GarufiArgentinaStephen Shaw RENEWAL
Aditya Y AmigonJapanBernardo Dominic PROPOSAL
Ricardo E BriddickRussiaIvan Magalhaes QUALIFIED
Jennifer G BologniaFranceOnyama Limba UNQUALIFIED
Stacey V VocelkaIndiaElwin Sharvill RENEWAL
Jeanfrancois B DoeSpainXuxue Feng NEW
Jennifer X StensethJapanStephen Shaw UNQUALIFIED
Misaki X KuskoRussiaIvan Magalhaes NEGOTIATION
Munro X FlosiSpainAnna Fali NEW
Deepesh U PerinIndiaElwin Sharvill QUALIFIED
Salvatore L CaudyBrazilStephen Shaw NEW
Francesco U SlusarskiJapanAmy Elsner NEGOTIATION
Jennifer E ShinkoArgentinaAsiya Javayant UNQUALIFIED
Wickens D SchemmerAustraliaElwin Sharvill QUALIFIED
Ricardo D PerinCanadaAsiya Javayant RENEWAL
Jefferson K PaprockiIndiaIoni Bowcher RENEWAL
Deepesh X WhobreyItalyOnyama Limba RENEWAL
Rodrigues G WieserItalyAnna Fali NEGOTIATION
David O RoysterJapanBernardo Dominic NEW
Mujtaba Y StensethFranceBernardo Dominic RENEWAL
Ivar R MacleadAustraliaStephen Shaw NEGOTIATION
Johnson K SchemmerCanadaAsiya Javayant QUALIFIED
Leja T DarakjyCanadaIoni Bowcher NEGOTIATION
Octavia Z NestleGermanyStephen Shaw NEW
Silvio P SlusarskiGermanyAnna Fali NEGOTIATION
Antonio Y WaycottAustraliaAsiya Javayant RENEWAL
Misaki B FlosiItalyBernardo Dominic UNQUALIFIED
Kadeem U WaycottItalyXuxue Feng QUALIFIED
Maisha P GlickAustraliaXuxue Feng PROPOSAL
Chavez T MaletRussiaAnna Fali NEW
Ivar U FlosiBrazilElwin Sharvill QUALIFIED
Kaitlin Q DoeUnited KingdomAnna Fali RENEWAL
Greenwood J DilliardIndiaAmy Elsner UNQUALIFIED
Kadeem Y IturbideRussiaStephen Shaw NEW
Ivar S CampainSpainAmy Elsner NEGOTIATION
Clifford U StockhamItalyBernardo Dominic 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>