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 W SchemmerArgentinaStephen Shaw QUALIFIED
Mujtaba F OstroskySpainIvan Magalhaes UNQUALIFIED
Costa G SlusarskiCanadaXuxue Feng NEW
David I AmigonBrazilIvan Magalhaes UNQUALIFIED
Jones D RutaItalyElwin Sharvill PROPOSAL
Munro O CaldareraFranceXuxue Feng NEW
Morrow F SaylorsArgentinaAsiya Javayant NEW
Isabel L TollnerBrazilBernardo Dominic QUALIFIED
Juan P MacleadFranceIoni Bowcher PROPOSAL
Jennifer K FigeroaGermanyStephen Shaw PROPOSAL
Ashley J BowleyFranceAsiya Javayant PROPOSAL
Mujtaba B StensethJapanStephen Shaw UNQUALIFIED
Clifford D WhobreyUnited KingdomIoni Bowcher NEGOTIATION
Sinclair W SergiGermanyIoni Bowcher NEGOTIATION
Antonio Z RulapaughCanadaOnyama Limba RENEWAL
Jefferson W ChuiFranceAmy Elsner PROPOSAL
Izzy R BriddickAustraliaXuxue Feng NEGOTIATION
Darci A BowleyBrazilXuxue Feng PROPOSAL
Claire S WaycottCanadaBernardo Dominic QUALIFIED
Jefferson S FigeroaGermanyAnna Fali NEGOTIATION
Johnson N FigeroaAustraliaXuxue Feng QUALIFIED
Sinclair L FigeroaAustraliaIoni Bowcher UNQUALIFIED
Johnson A SaylorsIndiaAsiya Javayant UNQUALIFIED
Jeanfrancois D GauchoIndiaIoni Bowcher PROPOSAL
Chavez Z VenereItalyAmy Elsner RENEWAL
Johnson G IturbideBrazilStephen Shaw UNQUALIFIED
Emily D BologniaCanadaElwin Sharvill NEGOTIATION
Isabel R SaylorsGermanyAsiya Javayant PROPOSAL
Jefferson Q DoeArgentinaAsiya Javayant QUALIFIED
Maisha R FigeroaJapanStephen Shaw UNQUALIFIED
Rodrigues V RoysterCanadaIvan Magalhaes NEW
Claire J FlosiIndiaElwin Sharvill UNQUALIFIED
Tony Z CaudySpainElwin Sharvill NEW
Misaki H InouyeRussiaXuxue Feng NEW
Isabel V MacleadFranceIoni Bowcher NEGOTIATION
Stacey K CampainCanadaStephen Shaw QUALIFIED
Jeanfrancois Z MacleadJapanAnna Fali NEGOTIATION
Morrow S VocelkaIndiaOnyama Limba RENEWAL
Mujtaba R MarrierAustraliaIvan Magalhaes NEGOTIATION
Clifford Z VocelkaRussiaAnna Fali UNQUALIFIED
Sinclair O MacleadCanadaIvan Magalhaes QUALIFIED
Octavia Q StensethFranceIvan Magalhaes PROPOSAL
Isabel F ButtJapanAmy Elsner NEW
Ivar D RimItalyAnna Fali QUALIFIED
Chavez V DilliardFranceOnyama Limba PROPOSAL
Jefferson T BowleyBrazilAnna Fali PROPOSAL
Leon R SergiUnited KingdomBernardo Dominic UNQUALIFIED
Darci M InouyeItalyAsiya Javayant PROPOSAL
Smith C BologniaUnited KingdomIvan Magalhaes RENEWAL
Johnson V GlickRussiaXuxue Feng PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Nicolas H DilliardItalyElwin Sharvill UNQUALIFIED
Misaki A AmigonJapanStephen Shaw UNQUALIFIED
Costa B StensethSpainXuxue Feng PROPOSAL
Arvin D MaletFranceIoni Bowcher RENEWAL
Emily H NestleFranceIoni Bowcher NEGOTIATION
Leon L GillianCanadaBernardo Dominic RENEWAL
Murillo F WieserJapanElwin Sharvill NEW
Johnson S GarufiSpainStephen Shaw UNQUALIFIED
Smith F BowleyAustraliaIoni Bowcher QUALIFIED
Jennifer P StockhamSpainAnna Fali NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Juan B FerenczArgentina2025-05-27Printing Dimensions PROPOSAL55Amy Elsner
1001Ricardo K StockhamAustralia2025-05-27Rousseaux, Michael Esq QUALIFIED37Ivan Magalhaes
1002Antonio Z GlickArgentina2025-06-07Rousseaux, Michael Esq NEGOTIATION94Onyama Limba
1003Jones Y MorascaUnited Kingdom2025-06-10Morlong Associates NEW85Asiya Javayant
1004Jefferson U CaldareraSpain2025-06-06Buckley Miller Wright UNQUALIFIED93Amy Elsner
1005Alejandro P FlosiFrance2025-05-26Benton, John B Jr QUALIFIED49Ivan Magalhaes
1006Faith E BologniaUnited Kingdom2025-06-02Chapman, Ross E Esq UNQUALIFIED0Xuxue Feng
1007Aika K BowleyItaly2025-06-07Feltz Printing Service RENEWAL6Anna Fali
1008Nicolas C BriddickUnited Kingdom2025-05-18Feiner Bros NEW21Anna Fali
1009Adams Q TollnerFrance2025-06-06Feltz Printing Service QUALIFIED38Amy Elsner
1010Jefferson T SaylorsItaly2025-06-15Dorl, James J Esq RENEWAL79Asiya Javayant
1011Aruna R CaudyBrazil2025-06-09Feltz Printing Service RENEWAL19Anna Fali
1012Alejandro N IturbideArgentina2025-05-26King, Christopher A Esq RENEWAL99Onyama Limba
1013Jennifer M AlbaresFrance2025-06-02Chanay, Jeffrey A Esq NEW94Ioni Bowcher
1014Smith X OstroskyFrance2025-06-15Benton, John B Jr NEW52Asiya Javayant
1015Smith O GarufiSpain2025-05-22Feiner Bros QUALIFIED83Ioni Bowcher
1016Leon X WhobreyIndia2025-06-04Dorl, James J Esq PROPOSAL62Elwin Sharvill
1017David R KolmetzUnited Kingdom2025-06-01King, Christopher A Esq UNQUALIFIED29Elwin Sharvill
1018Murillo A MarrierFrance2025-06-13Benton, John B Jr NEGOTIATION72Ivan Magalhaes
1019Maisha K GauchoCanada2025-05-21Rangoni Of Florence QUALIFIED77Asiya Javayant
1020Kadeem O GlickCanada2025-06-05Chemel, James L Cpa NEGOTIATION53Elwin Sharvill
1021Rodrigues A NickaBrazil2025-06-02Buckley Miller Wright NEW53Bernardo Dominic
1022Wickens W TollnerItaly2025-05-25Printing Dimensions NEW53Ivan Magalhaes
1023Maria G VenereAustralia2025-06-03Feltz Printing Service QUALIFIED93Elwin Sharvill
1024Morrow E GarufiUnited Kingdom2025-05-21Buckley Miller Wright PROPOSAL94Xuxue Feng
1025Ashley J NickaAustralia2025-06-10King, Christopher A Esq RENEWAL37Asiya Javayant
1026Kadeem D RimBrazil2025-05-30Chapman, Ross E Esq RENEWAL55Asiya Javayant
1027Misaki F DoeRussia2025-05-21Dorl, James J Esq UNQUALIFIED85Ioni Bowcher
1028Leon Q FigeroaGermany2025-05-25Dorl, James J Esq NEW71Amy Elsner
1029Misaki E WhobreyGermany2025-05-30Printing Dimensions RENEWAL32Amy Elsner
1030Sinclair L MaletCanada2025-05-30Morlong Associates UNQUALIFIED70Amy Elsner
1031Leja F CampainArgentina2025-05-29Morlong Associates UNQUALIFIED33Asiya Javayant
1032Ricardo I FollerBrazil2025-06-14King, Christopher A Esq UNQUALIFIED63Elwin Sharvill
1033Faith F AlbaresArgentina2025-05-29Printing Dimensions RENEWAL85Ioni Bowcher
1034James E KuskoAustralia2025-06-02Feltz Printing Service RENEWAL9Ioni Bowcher
1035Munro R GauchoBrazil2025-06-14Chanay, Jeffrey A Esq NEGOTIATION27Ivan Magalhaes
1036Ashley Y FlosiFrance2025-06-04Buckley Miller Wright UNQUALIFIED85Onyama Limba
1037Jennifer Y PoquetteIndia2025-05-24Printing Dimensions NEGOTIATION10Stephen Shaw
1038Greenwood T IturbideCanada2025-06-12Chemel, James L Cpa UNQUALIFIED67Xuxue Feng
1039Wickens W FlosiJapan2025-05-22Benton, John B Jr UNQUALIFIED73Bernardo Dominic
1040Izzy G InouyeJapan2025-05-20Feiner Bros NEW44Amy Elsner
1041Greenwood W FlosiGermany2025-06-01Feiner Bros NEW21Asiya Javayant
1042Leja N WhobreyAustralia2025-06-16Morlong Associates NEGOTIATION60Bernardo Dominic
1043Clifford Q WaycottJapan2025-06-16Chanay, Jeffrey A Esq RENEWAL68Xuxue Feng
1044Julie F StensethArgentina2025-05-25Chanay, Jeffrey A Esq NEW28Xuxue Feng
1045Aruna N RoysterGermany2025-05-30Rangoni Of Florence RENEWAL6Amy Elsner
1046Costa W FlosiItaly2025-06-06Dorl, James J Esq RENEWAL20Amy Elsner
1047Rodrigues J PaprockiBrazil2025-06-16Chapman, Ross E Esq NEW67Anna Fali
1048Salvatore O PoquetteJapan2025-06-03Benton, John B Jr QUALIFIED10Amy Elsner
1049Jeanfrancois I MorascaAustralia2025-06-05Commercial Press NEGOTIATION14Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Sinclair Z AmigonFranceStephen Shaw QUALIFIED
Stacey N RutaGermanyStephen Shaw RENEWAL
Costa R RoysterUnited KingdomOnyama Limba NEW
Wickens N IturbideAustraliaBernardo Dominic PROPOSAL
Claire Q GillianRussiaElwin Sharvill RENEWAL
Johnson A SlusarskiFranceAsiya Javayant UNQUALIFIED
Leja A PerinArgentinaAnna Fali PROPOSAL
Silvio N MorascaItalyAsiya Javayant QUALIFIED
Izzy G RutaAustraliaIvan Magalhaes NEGOTIATION
Munro Q PaprockiGermanyXuxue Feng PROPOSAL
Jennifer I KuskoUnited KingdomAnna Fali NEGOTIATION
Izzy H RulapaughArgentinaBernardo Dominic NEW
Rodrigues F KuskoBrazilXuxue Feng PROPOSAL
Juan N OstroskyFranceStephen Shaw NEW
Stacey L TollnerUnited KingdomIvan Magalhaes QUALIFIED
Darci E VocelkaArgentinaXuxue Feng NEGOTIATION
Murillo O ChuiCanadaIvan Magalhaes NEGOTIATION
Antonio V AlbaresGermanyOnyama Limba NEGOTIATION
Mayumi D PerinBrazilElwin Sharvill UNQUALIFIED
Leon T MaletSpainIvan Magalhaes RENEWAL
Rodrigues R GauchoIndiaAmy Elsner NEW
Stacey A KolmetzBrazilBernardo Dominic RENEWAL
Costa J GillianRussiaAnna Fali UNQUALIFIED
Arvin G MarrierRussiaIvan Magalhaes PROPOSAL
Faith T GillianItalyBernardo Dominic QUALIFIED
Chavez T PoquetteArgentinaStephen Shaw PROPOSAL
Aika Z SaylorsUnited KingdomIoni Bowcher NEGOTIATION
Kaitlin O CampainFranceAnna Fali PROPOSAL
Mayumi C KuskoRussiaOnyama Limba UNQUALIFIED
Arvin R VocelkaSpainOnyama Limba UNQUALIFIED
Aruna V WhobreyFranceOnyama Limba PROPOSAL
Aditya Z RoysterAustraliaIvan Magalhaes NEW
Izzy D BowleyRussiaIoni Bowcher NEGOTIATION
Kadeem L VenereCanadaAnna Fali PROPOSAL
Costa W RoysterUnited KingdomIvan Magalhaes NEGOTIATION
Claire L OstroskyUnited KingdomIvan Magalhaes QUALIFIED
Claire V PerinUnited KingdomElwin Sharvill QUALIFIED
Francesco I SaylorsArgentinaOnyama Limba UNQUALIFIED
Mujtaba W MaletAustraliaAsiya Javayant QUALIFIED
Isabel Q ButtGermanyXuxue Feng QUALIFIED
James S MaletJapanIoni Bowcher PROPOSAL
Adams R SlusarskiIndiaXuxue Feng UNQUALIFIED
Johnson Q WhobreyGermanyXuxue Feng PROPOSAL
Arvin Z NickaJapanAsiya Javayant RENEWAL
Aika G NestleUnited KingdomAsiya Javayant PROPOSAL
Stacey Q OldroydRussiaOnyama Limba NEGOTIATION
Deepesh G PoquetteGermanyAmy Elsner NEW
Costa W MaletGermanyAsiya Javayant UNQUALIFIED
Aditya H PoquetteCanadaXuxue Feng PROPOSAL
Claire M BologniaBrazilStephen Shaw QUALIFIED
Frozen Columns
Name
Cody J Saylors
Kaitlin J Foller
Alejandro L Tollner
Smith C Dilliard
Tony U Bowley
Chavez A Saylors
Juan I Butt
Wickens E Campain
Smith D Perin
Mayumi D Amigon
Clifford D Bolognia
Smith K Slusarski
Adams E Gaucho
Tony L Darakjy
Wickens Z Malet
Tony Z Paprocki
Silvio K Bowley
Murillo G Tollner
Morrow M Briddick
Aditya U Venere
Silvio T Waycott
Leon B Amigon
Jefferson H Bolognia
Cody V Darakjy
Jefferson Z Royster
Murillo W Ferencz
Isabel L Foller
Aruna E Caudy
Ricardo X Ostrosky
Ivar T Flosi
Mayumi F Nicka
Arvin U Dilliard
Kadeem F Stenseth
Nicolas M Bolognia
Alejandro C Royster
David P Venere
Emily P Caudy
Maisha Z Butt
Juan Z Caudy
Emily U Caudy
Nicolas R Saylors
Leja Q Malet
Cody J Marrier
Cody R Caudy
Murillo T Morasca
James K Rim
Chavez D Gillian
Julie L Saylors
Kaitlin G Caudy
Jeanfrancois G Kolmetz
IdCountryDate
1000Argentina2025-05-26
1001Italy2025-06-02
1002Argentina2025-06-04
1003Brazil2025-06-09
1004Australia2025-06-08
1005Russia2025-05-19
1006Australia2025-05-20
1007Canada2025-05-27
1008Spain2025-06-06
1009Japan2025-06-10
1010Argentina2025-05-22
1011Germany2025-06-07
1012Canada2025-06-02
1013United Kingdom2025-06-07
1014Italy2025-06-13
1015Canada2025-06-15
1016Australia2025-06-04
1017United Kingdom2025-05-28
1018Spain2025-05-24
1019Australia2025-05-25
1020India2025-06-16
1021Russia2025-06-15
1022France2025-05-29
1023Brazil2025-05-28
1024India2025-06-01
1025India2025-05-21
1026Japan2025-06-14
1027Spain2025-05-27
1028Russia2025-05-27
1029Spain2025-05-31
1030United Kingdom2025-05-18
1031Spain2025-05-19
1032Russia2025-06-15
1033Italy2025-06-13
1034Russia2025-05-21
1035Germany2025-05-21
1036Russia2025-06-14
1037France2025-05-20
1038Argentina2025-06-11
1039Japan2025-06-04
1040Argentina2025-05-26
1041India2025-06-13
1042India2025-05-22
1043India2025-06-12
1044Argentina2025-05-18
1045Spain2025-06-16
1046Spain2025-05-19
1047Italy2025-06-16
1048Australia2025-05-31
1049Argentina2025-05-18

On-Demand Data

NameIdCountryDate
Smith F Slusarski1000Italy2025-05-27
Greenwood V Waycott1001Canada2025-05-22
Sinclair W Flosi1002Australia2025-06-02
Kaitlin X Albares1003Argentina2025-06-06
David R Kusko1004Canada2025-06-11
Emily D Inouye1005France2025-06-02
Salvatore X Foller1006United Kingdom2025-06-09
Morrow S Maclead1007France2025-05-20
Costa I Paprocki1008United Kingdom2025-06-09
Silvio V Schemmer1009United Kingdom2025-06-14
Ricardo H Inouye1010France2025-05-31
Wickens X Wieser1011Italy2025-05-19
Arvin C Shinko1012Spain2025-05-24
Arvin A Inouye1013Spain2025-05-28
Darci W Butt1014India2025-05-31
Mayumi D Slusarski1015Australia2025-05-22
Jefferson J Gillian1016Russia2025-06-04
Costa Q Bowley1017Russia2025-05-27
Ricardo U Morasca1018United Kingdom2025-05-20
Leon W Saylors1019Russia2025-05-20
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Arvin A CaudyArgentinaAsiya Javayant PROPOSAL
James P ButtCanadaIoni Bowcher NEGOTIATION
Jefferson L PoquetteCanadaBernardo Dominic NEGOTIATION
David H BowleyGermanyElwin Sharvill NEW
Deepesh C GlickAustraliaIvan Magalhaes RENEWAL
Silvio G BriddickUnited KingdomAsiya Javayant QUALIFIED
Antonio R SlusarskiCanadaElwin Sharvill PROPOSAL
Antonio A MaletUnited KingdomAmy Elsner NEGOTIATION
Costa L KolmetzJapanOnyama Limba PROPOSAL
Johnson R KolmetzItalyAsiya Javayant UNQUALIFIED
Alejandro V VenereCanadaIvan Magalhaes PROPOSAL
Jeanfrancois D KuskoGermanyIvan Magalhaes QUALIFIED
Ricardo K InouyeIndiaAsiya Javayant RENEWAL
Mayumi G StensethAustraliaOnyama Limba NEGOTIATION
Emily Q FerenczFranceBernardo Dominic PROPOSAL
Leon C RulapaughUnited KingdomOnyama Limba PROPOSAL
Claire C FollerGermanyBernardo Dominic NEGOTIATION
Octavia M VocelkaJapanBernardo Dominic NEGOTIATION
Mujtaba Y FigeroaUnited KingdomAsiya Javayant RENEWAL
Sinclair R WaycottUnited KingdomAmy Elsner RENEWAL
Darci F OstroskyBrazilBernardo Dominic QUALIFIED
Emily Z FlosiSpainAmy Elsner UNQUALIFIED
Darci M MorascaUnited KingdomXuxue Feng UNQUALIFIED
Sinclair M GarufiUnited KingdomBernardo Dominic RENEWAL
Francesco N DoeCanadaAnna Fali RENEWAL
Aditya E PerinSpainOnyama Limba RENEWAL
Tony G RimUnited KingdomIoni Bowcher PROPOSAL
Leon Y GillianBrazilOnyama Limba UNQUALIFIED
Rodrigues A RimSpainElwin Sharvill UNQUALIFIED
Salvatore P ButtRussiaAmy Elsner QUALIFIED
Nicolas S FigeroaGermanyAnna Fali NEGOTIATION
Emily K CaudyJapanIvan Magalhaes PROPOSAL
Leja Q SaylorsUnited KingdomAmy Elsner PROPOSAL
Murillo M SlusarskiBrazilBernardo Dominic UNQUALIFIED
Smith Z BowleyFranceXuxue Feng UNQUALIFIED
Izzy V ChuiSpainIoni Bowcher QUALIFIED
Misaki D StensethSpainAmy Elsner NEGOTIATION
Deepesh I DoeArgentinaAnna Fali RENEWAL
Juan C WieserBrazilIvan Magalhaes QUALIFIED
Aditya C OstroskyCanadaStephen Shaw 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>