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
Munro X SlusarskiAustraliaAmy Elsner NEGOTIATION
Tony Y VenereUnited KingdomAmy Elsner UNQUALIFIED
Jeanfrancois U MaletRussiaBernardo Dominic UNQUALIFIED
James C CampainSpainAsiya Javayant NEW
Claire N CaldareraCanadaBernardo Dominic NEW
Francesco P RulapaughFranceAmy Elsner PROPOSAL
Deepesh F WhobreyCanadaAmy Elsner NEGOTIATION
Ivar Y BologniaBrazilAsiya Javayant RENEWAL
David Z GauchoBrazilOnyama Limba PROPOSAL
Francesco Z TollnerIndiaIvan Magalhaes RENEWAL
Jeanfrancois O SlusarskiIndiaBernardo Dominic QUALIFIED
Greenwood X IturbideSpainAsiya Javayant PROPOSAL
Aika Z FigeroaAustraliaOnyama Limba PROPOSAL
Francesco B KolmetzItalyXuxue Feng UNQUALIFIED
Sinclair Q OstroskyAustraliaAmy Elsner NEGOTIATION
Nicolas W BologniaArgentinaIoni Bowcher NEGOTIATION
Stacey I AmigonJapanStephen Shaw RENEWAL
Rodrigues A MarrierGermanyStephen Shaw QUALIFIED
Leja B CaudyJapanAsiya Javayant NEGOTIATION
Aditya H StockhamSpainXuxue Feng RENEWAL
Greenwood A CaldareraGermanyIoni Bowcher UNQUALIFIED
Costa V StensethCanadaAmy Elsner PROPOSAL
Misaki S OldroydIndiaAsiya Javayant NEW
Mayumi U MaletRussiaIvan Magalhaes NEW
Izzy K NickaIndiaAsiya Javayant UNQUALIFIED
Johnson Q ButtItalyIvan Magalhaes UNQUALIFIED
Salvatore N FigeroaIndiaBernardo Dominic QUALIFIED
Salvatore X KolmetzIndiaAnna Fali RENEWAL
Misaki D PaprockiUnited KingdomIvan Magalhaes PROPOSAL
Johnson X PoquetteItalyBernardo Dominic PROPOSAL
Misaki M SaylorsGermanyXuxue Feng RENEWAL
Salvatore N MaletSpainAsiya Javayant UNQUALIFIED
Mayumi A WaycottSpainElwin Sharvill QUALIFIED
Misaki K GlickUnited KingdomAmy Elsner RENEWAL
Leon K ButtBrazilStephen Shaw PROPOSAL
Jeanfrancois E RimAustraliaIvan Magalhaes NEW
Wickens V BologniaAustraliaStephen Shaw UNQUALIFIED
Juan Q StensethFranceBernardo Dominic UNQUALIFIED
Johnson M VenereRussiaAnna Fali RENEWAL
Ivar U GauchoJapanIoni Bowcher NEW
Clifford T RulapaughItalyIvan Magalhaes UNQUALIFIED
Munro X IturbideGermanyIvan Magalhaes NEW
Leon N DilliardUnited KingdomIoni Bowcher RENEWAL
Kadeem Q MarrierItalyIvan Magalhaes QUALIFIED
Maisha B GarufiJapanBernardo Dominic RENEWAL
Ricardo B GauchoSpainAnna Fali NEGOTIATION
Jennifer O KolmetzGermanyXuxue Feng PROPOSAL
Munro U VenereItalyAnna Fali NEW
Claire S CaldareraBrazilAnna Fali PROPOSAL
Arvin Y DilliardJapanAsiya Javayant RENEWAL
Horizontal
NameCountryRepresentativeStatus
Jeanfrancois S TollnerCanadaStephen Shaw RENEWAL
Salvatore F RimFranceIoni Bowcher UNQUALIFIED
Maisha O MarrierBrazilIoni Bowcher NEGOTIATION
Claire T KuskoItalyOnyama Limba PROPOSAL
Alejandro F MaletSpainAnna Fali RENEWAL
Arvin D DoeRussiaBernardo Dominic RENEWAL
Misaki G TollnerSpainAmy Elsner PROPOSAL
Jennifer R FlosiGermanyXuxue Feng NEGOTIATION
Jones T VenereRussiaXuxue Feng NEW
Julie Y CaudyGermanyIoni Bowcher RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Murillo G AlbaresGermany2025-04-02Feltz Printing Service PROPOSAL41Amy Elsner
1001Munro T DilliardBrazil2025-04-10Chanay, Jeffrey A Esq NEW94Onyama Limba
1002Kaitlin W TollnerFrance2025-04-17Feiner Bros PROPOSAL96Anna Fali
1003Ivar K NestleGermany2025-04-24Dorl, James J Esq NEGOTIATION37Ioni Bowcher
1004Morrow C MaletAustralia2025-04-23Morlong Associates PROPOSAL72Onyama Limba
1005Antonio A MaletSpain2025-04-20Benton, John B Jr NEW79Bernardo Dominic
1006Jones E GauchoJapan2025-04-25Morlong Associates UNQUALIFIED56Xuxue Feng
1007Sinclair L CaldareraUnited Kingdom2025-04-29Chapman, Ross E Esq QUALIFIED12Elwin Sharvill
1008Misaki L PaprockiCanada2025-04-11Chapman, Ross E Esq UNQUALIFIED58Anna Fali
1009Jefferson F NickaBrazil2025-04-13Chapman, Ross E Esq UNQUALIFIED22Elwin Sharvill
1010Aditya L StensethArgentina2025-04-18Chapman, Ross E Esq RENEWAL4Amy Elsner
1011Costa A FigeroaItaly2025-04-09Rousseaux, Michael Esq UNQUALIFIED30Amy Elsner
1012Claire Z FlosiJapan2025-04-02Feltz Printing Service NEGOTIATION75Amy Elsner
1013Smith I MarrierRussia2025-04-29Rousseaux, Michael Esq NEGOTIATION52Stephen Shaw
1014Costa V MorascaSpain2025-04-05Feltz Printing Service NEW87Onyama Limba
1015Tony I PerinArgentina2025-04-28Commercial Press RENEWAL82Elwin Sharvill
1016Antonio Y CaudyGermany2025-04-12Feiner Bros NEW19Elwin Sharvill
1017Mayumi O DilliardFrance2025-04-21Morlong Associates PROPOSAL14Bernardo Dominic
1018Morrow Y RulapaughItaly2025-04-08Feltz Printing Service UNQUALIFIED26Stephen Shaw
1019Stacey R DarakjyUnited Kingdom2025-04-26Rousseaux, Michael Esq NEGOTIATION72Xuxue Feng
1020Jefferson E PaprockiArgentina2025-04-22Chapman, Ross E Esq UNQUALIFIED11Elwin Sharvill
1021Emily G AlbaresRussia2025-04-17Dorl, James J Esq RENEWAL73Ivan Magalhaes
1022Deepesh W KolmetzBrazil2025-04-01Buckley Miller Wright QUALIFIED18Asiya Javayant
1023Silvio B NestleGermany2025-04-18Feltz Printing Service RENEWAL6Ivan Magalhaes
1024Tony D FlosiFrance2025-04-01Chemel, James L Cpa NEGOTIATION79Stephen Shaw
1025Morrow W MaletRussia2025-04-17Benton, John B Jr NEW0Asiya Javayant
1026Antonio Z ChuiItaly2025-04-02Chanay, Jeffrey A Esq PROPOSAL66Onyama Limba
1027Deepesh E StensethBrazil2025-04-24Benton, John B Jr NEGOTIATION50Stephen Shaw
1028Claire M WhobreyArgentina2025-04-23Feltz Printing Service UNQUALIFIED92Amy Elsner
1029Jeanfrancois J GauchoSpain2025-04-25Dorl, James J Esq UNQUALIFIED93Ivan Magalhaes
1030Chavez Q WaycottAustralia2025-04-12Buckley Miller Wright NEGOTIATION89Bernardo Dominic
1031Kadeem U DoeAustralia2025-04-06Chanay, Jeffrey A Esq QUALIFIED74Elwin Sharvill
1032Juan Z PoquetteIndia2025-04-15Chanay, Jeffrey A Esq NEW36Anna Fali
1033Nicolas W MaletSpain2025-04-22Chapman, Ross E Esq QUALIFIED67Amy Elsner
1034Costa G WaycottAustralia2025-04-02Rousseaux, Michael Esq RENEWAL17Stephen Shaw
1035Smith T ShinkoSpain2025-04-23Buckley Miller Wright NEW55Anna Fali
1036Arvin I RoysterUnited Kingdom2025-04-09Chemel, James L Cpa UNQUALIFIED7Amy Elsner
1037Jeanfrancois V DarakjyRussia2025-04-01Truhlar And Truhlar Attys QUALIFIED29Anna Fali
1038Mujtaba V WieserFrance2025-04-12Buckley Miller Wright QUALIFIED32Bernardo Dominic
1039Jennifer J WaycottItaly2025-04-19Rousseaux, Michael Esq NEW5Amy Elsner
1040Cody Y GauchoArgentina2025-04-01Chapman, Ross E Esq PROPOSAL12Ivan Magalhaes
1041Octavia J MarrierGermany2025-04-13Buckley Miller Wright NEGOTIATION13Elwin Sharvill
1042Misaki J WhobreyAustralia2025-04-15Chanay, Jeffrey A Esq QUALIFIED28Ivan Magalhaes
1043Juan C NickaUnited Kingdom2025-04-16Buckley Miller Wright QUALIFIED50Xuxue Feng
1044Aditya K WaycottCanada2025-04-10Chanay, Jeffrey A Esq NEW16Asiya Javayant
1045Clifford A CampainIndia2025-04-12Rousseaux, Michael Esq NEW22Anna Fali
1046Leja K WaycottAustralia2025-04-05Commercial Press QUALIFIED50Stephen Shaw
1047Jefferson B DilliardAustralia2025-04-17Chemel, James L Cpa QUALIFIED71Amy Elsner
1048Costa A DilliardItaly2025-04-26Truhlar And Truhlar Attys UNQUALIFIED72Elwin Sharvill
1049Maria Q BologniaSpain2025-04-02King, Christopher A Esq PROPOSAL27Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Mujtaba L DoeSpainAnna Fali QUALIFIED
Wickens D SaylorsFranceIvan Magalhaes PROPOSAL
Adams W OstroskyFranceIoni Bowcher QUALIFIED
Leja L SaylorsFranceAsiya Javayant QUALIFIED
Greenwood E CaudyUnited KingdomAnna Fali NEW
Claire N CaudyCanadaAsiya Javayant UNQUALIFIED
Kaitlin I BowleyItalyIoni Bowcher PROPOSAL
James O PaprockiJapanBernardo Dominic RENEWAL
Murillo F FollerGermanyXuxue Feng NEW
Mujtaba Z GillianRussiaAmy Elsner RENEWAL
Clifford Q RutaUnited KingdomIvan Magalhaes UNQUALIFIED
Leon V MaletItalyAnna Fali QUALIFIED
Greenwood I WaycottGermanyAmy Elsner PROPOSAL
Maisha A ShinkoIndiaAmy Elsner RENEWAL
Maria N FlosiFranceAsiya Javayant NEW
Emily A WhobreyItalyIoni Bowcher NEGOTIATION
Johnson S KuskoJapanAmy Elsner UNQUALIFIED
Ashley T BriddickBrazilIoni Bowcher RENEWAL
Adams K WaycottSpainBernardo Dominic PROPOSAL
Jefferson R MaletSpainOnyama Limba PROPOSAL
Jeanfrancois X KuskoRussiaAsiya Javayant UNQUALIFIED
Munro Q OldroydBrazilElwin Sharvill PROPOSAL
Munro I NestleArgentinaBernardo Dominic RENEWAL
Stacey A PerinAustraliaAmy Elsner RENEWAL
Leon N DilliardGermanyXuxue Feng QUALIFIED
Maria U PerinArgentinaIvan Magalhaes NEGOTIATION
Ivar C InouyeAustraliaBernardo Dominic RENEWAL
Francesco C SchemmerJapanIoni Bowcher PROPOSAL
Arvin N WhobreySpainOnyama Limba PROPOSAL
Ivar A SaylorsIndiaStephen Shaw QUALIFIED
Salvatore R GlickAustraliaIoni Bowcher QUALIFIED
Alejandro S DilliardCanadaXuxue Feng NEW
Clifford A FollerArgentinaAsiya Javayant NEGOTIATION
Faith M NestleGermanyXuxue Feng NEW
Kadeem R WhobreyUnited KingdomBernardo Dominic RENEWAL
Sinclair O FerenczRussiaAmy Elsner PROPOSAL
Deepesh T VenereArgentinaIoni Bowcher UNQUALIFIED
Ashley P FigeroaUnited KingdomElwin Sharvill NEGOTIATION
Wickens B FlosiSpainIoni Bowcher NEGOTIATION
Chavez Z PaprockiIndiaOnyama Limba RENEWAL
Smith J CaudyCanadaStephen Shaw NEGOTIATION
Jeanfrancois B PaprockiRussiaAsiya Javayant PROPOSAL
Leja P CaldareraGermanyIoni Bowcher QUALIFIED
Chavez R NickaSpainElwin Sharvill NEW
Jeanfrancois D ChuiSpainAnna Fali RENEWAL
Maisha X AmigonBrazilAmy Elsner PROPOSAL
Nicolas U FollerUnited KingdomAmy Elsner RENEWAL
Julie W MorascaJapanStephen Shaw NEGOTIATION
Mayumi Y GarufiAustraliaStephen Shaw NEW
Chavez Q PoquetteRussiaAnna Fali QUALIFIED
Frozen Columns
Name
Sinclair O Amigon
Jeanfrancois T Malet
Chavez P Rulapaugh
Ashley L Malet
Jones B Waycott
Leon Y Schemmer
Maisha B Oldroyd
Murillo X Briddick
Jeanfrancois F Iturbide
Leja J Maclead
Sinclair R Bolognia
Kadeem E Marrier
Smith Z Foller
Faith U Nestle
Maria C Wieser
Ricardo Y Malet
Smith N Saylors
James T Morasca
James H Shinko
Leja F Whobrey
Leja V Caudy
Francesco K Slusarski
Ashley J Campain
Mujtaba Q Malet
Morrow Q Doe
Jennifer L Perin
Misaki Q Nestle
Isabel N Gaucho
Ivar R Wieser
Smith X Butt
Claire U Waycott
Wickens X Ruta
Ashley E Stenseth
Kaitlin J Iturbide
Greenwood K Sergi
Ivar R Nestle
Silvio H Ostrosky
Greenwood B Dilliard
Sinclair J Albares
James M Morasca
Aruna I Waycott
Munro C Perin
Smith B Kolmetz
Salvatore U Bowley
Cody V Whobrey
Leja B Kolmetz
Antonio D Glick
Octavia K Maclead
Smith I Amigon
Aruna J Rim
IdCountryDate
1000Argentina2025-04-01
1001Italy2025-04-20
1002Germany2025-04-12
1003Russia2025-04-04
1004Canada2025-04-15
1005Canada2025-04-19
1006India2025-04-16
1007Germany2025-04-10
1008Brazil2025-04-16
1009Australia2025-04-22
1010Japan2025-04-16
1011France2025-04-26
1012Australia2025-04-24
1013United Kingdom2025-04-17
1014Russia2025-04-18
1015United Kingdom2025-04-11
1016United Kingdom2025-04-06
1017Canada2025-04-21
1018United Kingdom2025-04-02
1019Russia2025-04-15
1020Brazil2025-04-17
1021Japan2025-04-29
1022Russia2025-04-22
1023Germany2025-04-27
1024France2025-04-23
1025Australia2025-04-14
1026United Kingdom2025-04-10
1027Spain2025-04-09
1028Germany2025-04-06
1029France2025-04-20
1030United Kingdom2025-04-04
1031France2025-04-02
1032India2025-04-07
1033Germany2025-04-06
1034United Kingdom2025-04-01
1035France2025-04-22
1036India2025-04-27
1037United Kingdom2025-04-02
1038Germany2025-04-25
1039India2025-04-29
1040India2025-04-22
1041India2025-04-03
1042Canada2025-04-20
1043Brazil2025-04-15
1044Australia2025-04-03
1045United Kingdom2025-04-11
1046Russia2025-04-24
1047Brazil2025-04-29
1048Japan2025-04-19
1049Russia2025-04-09

On-Demand Data

NameIdCountryDate
Clifford B Gillian1000India2025-04-10
Greenwood G Poquette1001Spain2025-04-21
Ashley H Ruta1002Australia2025-04-17
Cody B Ferencz1003Australia2025-04-01
Leja A Ostrosky1004Spain2025-04-29
Jefferson R Garufi1005Germany2025-04-09
Sinclair K Malet1006Australia2025-04-23
Maisha E Waycott1007Japan2025-04-17
Ashley Q Maclead1008Germany2025-03-31
Antonio T Caldarera1009Australia2025-03-31
Morrow A Perin1010Brazil2025-04-11
Maisha P Iturbide1011Italy2025-04-12
Aditya Z Inouye1012Russia2025-04-24
Ricardo I Kolmetz1013Australia2025-04-29
Salvatore R Stockham1014India2025-04-21
Leon M Slusarski1015France2025-04-17
Jennifer D Marrier1016Japan2025-04-04
Salvatore A Poquette1017Germany2025-04-09
Nicolas U Saylors1018Argentina2025-04-24
Clifford R Gillian1019France2025-04-04
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Leon L DoeAustraliaXuxue Feng RENEWAL
Aika B BriddickBrazilXuxue Feng PROPOSAL
Leon O KuskoJapanStephen Shaw RENEWAL
Jefferson A AmigonBrazilIvan Magalhaes RENEWAL
Antonio E StockhamArgentinaAsiya Javayant QUALIFIED
Aruna W RoysterSpainIoni Bowcher NEGOTIATION
Faith Q SchemmerGermanyOnyama Limba NEGOTIATION
Kaitlin S RimUnited KingdomXuxue Feng UNQUALIFIED
Misaki N MaletRussiaOnyama Limba PROPOSAL
Kadeem J GlickBrazilXuxue Feng PROPOSAL
Maisha X VocelkaArgentinaIvan Magalhaes RENEWAL
Wickens O GarufiIndiaIvan Magalhaes NEW
Murillo S SaylorsFranceIvan Magalhaes NEGOTIATION
Rodrigues F NickaRussiaBernardo Dominic NEGOTIATION
Stacey T NickaSpainIoni Bowcher UNQUALIFIED
Morrow J MaletArgentinaIvan Magalhaes QUALIFIED
Mayumi V WieserFranceIvan Magalhaes NEGOTIATION
Aruna Y BologniaFranceOnyama Limba NEGOTIATION
Isabel N TollnerJapanElwin Sharvill NEGOTIATION
Murillo O FollerGermanyIvan Magalhaes RENEWAL
Claire T CaldareraGermanyBernardo Dominic QUALIFIED
Faith O AmigonAustraliaIoni Bowcher RENEWAL
Izzy D DarakjyArgentinaBernardo Dominic RENEWAL
Isabel D GarufiRussiaBernardo Dominic RENEWAL
Chavez G StockhamFranceXuxue Feng NEW
Salvatore L FlosiIndiaXuxue Feng PROPOSAL
Mayumi C StensethAustraliaAmy Elsner QUALIFIED
Stacey F CaldareraRussiaAmy Elsner NEGOTIATION
Ricardo K GauchoGermanyBernardo Dominic PROPOSAL
Darci Q OstroskyJapanIvan Magalhaes NEW
Nicolas C OstroskyGermanyBernardo Dominic QUALIFIED
Munro S AlbaresCanadaIoni Bowcher NEW
Rodrigues S DoeIndiaElwin Sharvill QUALIFIED
Stacey T CaudyFranceElwin Sharvill UNQUALIFIED
Nicolas G SchemmerItalyBernardo Dominic QUALIFIED
Mujtaba G SaylorsSpainAnna Fali QUALIFIED
Misaki I AmigonAustraliaAmy Elsner RENEWAL
Jefferson Z ChuiCanadaXuxue Feng RENEWAL
Claire U KuskoFranceAnna Fali RENEWAL
Chavez U SergiFranceElwin Sharvill 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>