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
Greenwood N SlusarskiItalyStephen Shaw QUALIFIED
Deepesh Z WaycottIndiaAmy Elsner NEGOTIATION
Adams Z InouyeRussiaXuxue Feng UNQUALIFIED
Octavia J GauchoGermanyAnna Fali NEGOTIATION
Mujtaba U CaldareraSpainAnna Fali PROPOSAL
Nicolas S WaycottIndiaStephen Shaw NEGOTIATION
Wickens R KuskoIndiaElwin Sharvill NEW
Ashley A GarufiCanadaOnyama Limba RENEWAL
Aditya Q StensethUnited KingdomAnna Fali UNQUALIFIED
Jennifer W WhobreyUnited KingdomOnyama Limba NEW
Faith D StensethIndiaIoni Bowcher NEGOTIATION
Smith F SaylorsItalyAmy Elsner NEW
Munro B InouyeArgentinaAsiya Javayant QUALIFIED
Aruna N PerinCanadaXuxue Feng UNQUALIFIED
Wickens Q PerinAustraliaStephen Shaw NEW
Misaki S NestleGermanyAnna Fali NEW
Aditya B RoysterIndiaAmy Elsner QUALIFIED
Jeanfrancois O StockhamUnited KingdomBernardo Dominic PROPOSAL
Tony L DarakjyJapanXuxue Feng UNQUALIFIED
Rodrigues S MaletArgentinaElwin Sharvill UNQUALIFIED
Kadeem E BologniaIndiaIvan Magalhaes UNQUALIFIED
Jeanfrancois O MarrierRussiaAsiya Javayant PROPOSAL
Aditya Y KolmetzRussiaIoni Bowcher NEW
Arvin S SaylorsSpainElwin Sharvill RENEWAL
Kaitlin G GlickIndiaIvan Magalhaes NEGOTIATION
Johnson H PerinJapanAsiya Javayant PROPOSAL
Leja R RoysterItalyBernardo Dominic PROPOSAL
Aditya U MaletArgentinaOnyama Limba NEW
Ivar A ButtFranceAmy Elsner NEGOTIATION
Ashley E SchemmerRussiaIvan Magalhaes RENEWAL
Alejandro V StockhamGermanyStephen Shaw PROPOSAL
Julie K IturbideJapanAnna Fali NEW
Maria G FlosiFranceAsiya Javayant UNQUALIFIED
Nicolas O SlusarskiItalyIoni Bowcher NEW
Stacey L SaylorsGermanyAsiya Javayant NEGOTIATION
Kaitlin E MaletBrazilOnyama Limba PROPOSAL
Jefferson P KolmetzIndiaBernardo Dominic RENEWAL
Isabel O GlickGermanyAmy Elsner NEGOTIATION
Aditya U SchemmerSpainAmy Elsner UNQUALIFIED
Jeanfrancois E GarufiSpainIvan Magalhaes UNQUALIFIED
Wickens H BriddickRussiaIoni Bowcher RENEWAL
Leon N WhobreyUnited KingdomXuxue Feng QUALIFIED
Mayumi P BologniaRussiaElwin Sharvill PROPOSAL
Arvin D DoeBrazilXuxue Feng NEGOTIATION
Maisha G FollerCanadaIoni Bowcher PROPOSAL
Mujtaba V StockhamJapanBernardo Dominic RENEWAL
Nicolas G PoquetteUnited KingdomStephen Shaw QUALIFIED
Sinclair Z CaldareraUnited KingdomBernardo Dominic RENEWAL
Kadeem B PaprockiItalyAsiya Javayant NEW
Kadeem B GillianArgentinaAnna Fali PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Izzy C MorascaUnited KingdomElwin Sharvill NEW
Johnson J OldroydArgentinaBernardo Dominic QUALIFIED
Claire M BologniaAustraliaAmy Elsner NEGOTIATION
Misaki C CaldareraRussiaXuxue Feng NEW
Aika F CaudyItalyAmy Elsner RENEWAL
Aruna B BriddickFranceOnyama Limba UNQUALIFIED
Juan M MacleadIndiaAsiya Javayant NEGOTIATION
Munro C CaldareraArgentinaBernardo Dominic UNQUALIFIED
Stacey M SaylorsBrazilXuxue Feng NEW
Maria U BologniaIndiaXuxue Feng RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Leon D IturbideJapan2025-06-07Feiner Bros UNQUALIFIED32Bernardo Dominic
1001Octavia Z InouyeSpain2025-05-25King, Christopher A Esq QUALIFIED46Onyama Limba
1002Emily R FerenczArgentina2025-06-12Feltz Printing Service PROPOSAL79Anna Fali
1003Faith K PerinIndia2025-06-06Dorl, James J Esq QUALIFIED93Ivan Magalhaes
1004Munro O CaldareraItaly2025-06-07Chapman, Ross E Esq NEGOTIATION17Elwin Sharvill
1005Julie L DoeSpain2025-05-27Truhlar And Truhlar Attys UNQUALIFIED98Ivan Magalhaes
1006Johnson E OstroskyAustralia2025-05-30Dorl, James J Esq PROPOSAL24Bernardo Dominic
1007Stacey W RutaUnited Kingdom2025-05-22Printing Dimensions QUALIFIED37Bernardo Dominic
1008Rodrigues A FlosiBrazil2025-06-02Benton, John B Jr QUALIFIED73Asiya Javayant
1009Murillo I CampainBrazil2025-06-04Feiner Bros RENEWAL75Xuxue Feng
1010Stacey G ShinkoArgentina2025-05-17Chemel, James L Cpa NEGOTIATION86Ioni Bowcher
1011Aika J AlbaresIndia2025-06-01Chapman, Ross E Esq UNQUALIFIED39Anna Fali
1012Izzy K ButtFrance2025-05-20Commercial Press UNQUALIFIED82Onyama Limba
1013Faith G VocelkaJapan2025-06-12Dorl, James J Esq QUALIFIED75Anna Fali
1014Kaitlin F DarakjyArgentina2025-06-14Chapman, Ross E Esq PROPOSAL10Xuxue Feng
1015Julie I ShinkoBrazil2025-06-05Commercial Press NEW23Ivan Magalhaes
1016Kadeem S InouyeIndia2025-05-26Morlong Associates QUALIFIED92Ivan Magalhaes
1017David M NestleUnited Kingdom2025-06-01Benton, John B Jr QUALIFIED29Onyama Limba
1018Cody K OstroskyIndia2025-06-10Printing Dimensions QUALIFIED29Asiya Javayant
1019Juan H AlbaresFrance2025-06-03Commercial Press UNQUALIFIED13Stephen Shaw
1020Aditya O CampainIndia2025-06-02Chanay, Jeffrey A Esq QUALIFIED80Amy Elsner
1021Mujtaba R MacleadBrazil2025-05-23Chemel, James L Cpa NEW60Asiya Javayant
1022Arvin Y WaycottArgentina2025-05-28Dorl, James J Esq UNQUALIFIED89Ioni Bowcher
1023Mujtaba B InouyeGermany2025-06-12Rousseaux, Michael Esq PROPOSAL92Stephen Shaw
1024Francesco C GillianSpain2025-05-16Truhlar And Truhlar Attys RENEWAL78Ioni Bowcher
1025Arvin I StockhamUnited Kingdom2025-06-14Feltz Printing Service PROPOSAL98Ioni Bowcher
1026Morrow H VocelkaFrance2025-05-19Truhlar And Truhlar Attys PROPOSAL66Ivan Magalhaes
1027Deepesh R GillianFrance2025-05-18Chapman, Ross E Esq RENEWAL9Ioni Bowcher
1028Clifford P ShinkoIndia2025-06-07Benton, John B Jr NEW85Ivan Magalhaes
1029Kaitlin H MaletItaly2025-05-27Printing Dimensions PROPOSAL99Ioni Bowcher
1030Morrow X TollnerGermany2025-06-08Printing Dimensions NEGOTIATION93Asiya Javayant
1031Cody F MarrierIndia2025-05-29Chanay, Jeffrey A Esq PROPOSAL81Xuxue Feng
1032Maria E PaprockiSpain2025-05-31Printing Dimensions RENEWAL77Xuxue Feng
1033Wickens F GarufiBrazil2025-06-06Chanay, Jeffrey A Esq RENEWAL33Anna Fali
1034Silvio O GillianCanada2025-06-05Chemel, James L Cpa PROPOSAL74Ioni Bowcher
1035Ricardo N PoquetteArgentina2025-05-22Morlong Associates QUALIFIED15Onyama Limba
1036Julie U VenereSpain2025-06-13Commercial Press RENEWAL83Ivan Magalhaes
1037Ricardo S GauchoFrance2025-05-28Truhlar And Truhlar Attys PROPOSAL85Ivan Magalhaes
1038James V BowleyUnited Kingdom2025-05-28Morlong Associates QUALIFIED66Stephen Shaw
1039Jones E PaprockiItaly2025-05-24Chanay, Jeffrey A Esq NEGOTIATION47Ioni Bowcher
1040Mujtaba Q GillianItaly2025-05-23Commercial Press QUALIFIED49Anna Fali
1041Costa A OldroydAustralia2025-05-19Truhlar And Truhlar Attys QUALIFIED58Elwin Sharvill
1042Sinclair A StensethGermany2025-05-31Commercial Press NEW99Anna Fali
1043Julie R SlusarskiBrazil2025-05-24Rousseaux, Michael Esq PROPOSAL14Ioni Bowcher
1044Sinclair R PoquetteRussia2025-06-04Feiner Bros RENEWAL31Ivan Magalhaes
1045Mujtaba J BowleyAustralia2025-05-20Morlong Associates RENEWAL30Anna Fali
1046Jeanfrancois Y SlusarskiFrance2025-05-30Rousseaux, Michael Esq NEGOTIATION3Anna Fali
1047Murillo R StockhamAustralia2025-05-24Feltz Printing Service RENEWAL23Onyama Limba
1048Smith K FerenczItaly2025-05-19Chapman, Ross E Esq NEGOTIATION90Amy Elsner
1049Cody D SaylorsItaly2025-05-20Benton, John B Jr QUALIFIED67Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Deepesh D RutaItalyIvan Magalhaes NEGOTIATION
James E AmigonItalyIoni Bowcher NEW
Kaitlin X FerenczGermanyXuxue Feng QUALIFIED
Jones X SlusarskiItalyIoni Bowcher QUALIFIED
Faith X CampainGermanyIoni Bowcher QUALIFIED
Leja B StensethJapanIoni Bowcher QUALIFIED
Johnson T CaudyRussiaStephen Shaw UNQUALIFIED
Ricardo I AmigonRussiaElwin Sharvill NEGOTIATION
Greenwood Q FerenczJapanAmy Elsner RENEWAL
Ricardo L WhobreyRussiaBernardo Dominic NEW
Octavia P SaylorsArgentinaAmy Elsner QUALIFIED
Ricardo S PerinUnited KingdomAmy Elsner NEW
Arvin M CaudyUnited KingdomBernardo Dominic RENEWAL
Stacey A SlusarskiJapanOnyama Limba QUALIFIED
Arvin M BriddickBrazilIvan Magalhaes NEW
Alejandro R DoeJapanIvan Magalhaes RENEWAL
Greenwood O GlickJapanIoni Bowcher QUALIFIED
Aruna T OldroydItalyElwin Sharvill QUALIFIED
Ivar G SergiCanadaAnna Fali NEGOTIATION
Aruna D SchemmerIndiaElwin Sharvill RENEWAL
Adams P StensethJapanXuxue Feng NEGOTIATION
David D ChuiItalyOnyama Limba UNQUALIFIED
Mayumi P GillianUnited KingdomXuxue Feng PROPOSAL
Leja L OldroydCanadaAnna Fali UNQUALIFIED
Jennifer D PerinRussiaElwin Sharvill QUALIFIED
Octavia I FlosiIndiaIoni Bowcher UNQUALIFIED
Juan F GarufiItalyBernardo Dominic PROPOSAL
Antonio A DarakjyUnited KingdomXuxue Feng NEGOTIATION
Faith N RimGermanyElwin Sharvill RENEWAL
Aika Q RulapaughRussiaXuxue Feng QUALIFIED
Wickens D OstroskySpainIvan Magalhaes QUALIFIED
Faith S FlosiGermanyAmy Elsner NEGOTIATION
Ashley F FigeroaJapanAnna Fali RENEWAL
Morrow T ChuiArgentinaIoni Bowcher RENEWAL
Faith L VocelkaArgentinaElwin Sharvill NEGOTIATION
Wickens W RoysterAustraliaXuxue Feng NEGOTIATION
Ashley A NestleGermanyAsiya Javayant QUALIFIED
Izzy O DarakjyIndiaStephen Shaw UNQUALIFIED
Adams N AmigonArgentinaStephen Shaw NEW
Claire Y FerenczAustraliaBernardo Dominic QUALIFIED
Maisha T SaylorsIndiaBernardo Dominic QUALIFIED
Nicolas Q ButtItalyOnyama Limba QUALIFIED
Mujtaba H GauchoArgentinaElwin Sharvill UNQUALIFIED
Deepesh I IturbideAustraliaAsiya Javayant NEGOTIATION
Claire C StensethJapanAmy Elsner UNQUALIFIED
Julie A BowleyUnited KingdomIoni Bowcher NEW
Claire V TollnerJapanOnyama Limba NEGOTIATION
Alejandro C MorascaGermanyAmy Elsner UNQUALIFIED
Alejandro H MacleadGermanyElwin Sharvill RENEWAL
Johnson H DoeCanadaStephen Shaw NEGOTIATION
Frozen Columns
Name
Ricardo T Campain
Aika A Garufi
Emily P Amigon
Morrow E Royster
Silvio K Rim
Salvatore A Ruta
Ivar Q Saylors
Aditya H Rulapaugh
Jones X Gillian
Morrow S Caldarera
Darci K Glick
Aditya Q Darakjy
Greenwood J Foller
Alejandro A Nicka
Kadeem J Maclead
Greenwood N Marrier
Alejandro P Waycott
Jeanfrancois P Iturbide
Maria T Malet
Rodrigues X Gillian
Kaitlin N Albares
Ricardo R Iturbide
Stacey T Saylors
Kaitlin C Kusko
Tony J Caldarera
Ivar D Paprocki
Aditya W Schemmer
Jones Y Caldarera
James K Nestle
Aika I Nicka
Greenwood V Doe
Kadeem T Garufi
Kaitlin M Kolmetz
Kaitlin E Briddick
Kaitlin L Chui
Antonio E Poquette
Silvio P Maclead
Izzy M Caldarera
Maria J Waycott
Sinclair B Vocelka
Greenwood I Whobrey
Adams A Doe
Silvio C Poquette
Arvin I Perin
Nicolas G Dilliard
Leon M Saylors
Mujtaba D Caudy
Julie P Oldroyd
Rodrigues M Caudy
Kaitlin O Caudy
IdCountryDate
1000Russia2025-05-28
1001Australia2025-06-03
1002France2025-05-29
1003Argentina2025-05-24
1004Germany2025-06-13
1005Russia2025-06-09
1006France2025-05-16
1007Italy2025-06-10
1008United Kingdom2025-05-25
1009Canada2025-05-17
1010Russia2025-06-09
1011United Kingdom2025-06-09
1012Australia2025-06-09
1013Spain2025-06-13
1014Argentina2025-05-27
1015Australia2025-06-09
1016Spain2025-05-29
1017India2025-05-22
1018Italy2025-05-16
1019Brazil2025-06-06
1020Italy2025-06-04
1021Japan2025-05-22
1022Canada2025-05-26
1023Germany2025-06-12
1024Australia2025-05-29
1025Canada2025-06-05
1026Brazil2025-05-23
1027Brazil2025-06-02
1028Australia2025-05-21
1029India2025-06-10
1030Russia2025-06-13
1031Brazil2025-06-10
1032Russia2025-06-07
1033Germany2025-05-20
1034Germany2025-05-18
1035Japan2025-05-17
1036Australia2025-05-24
1037Brazil2025-06-02
1038Canada2025-06-06
1039India2025-05-17
1040Argentina2025-06-09
1041Italy2025-05-20
1042India2025-06-12
1043Spain2025-05-23
1044Argentina2025-06-03
1045Canada2025-05-17
1046India2025-05-20
1047India2025-06-09
1048Japan2025-06-06
1049Russia2025-06-06

On-Demand Data

NameIdCountryDate
Kadeem F Poquette1000Brazil2025-05-21
Antonio M Briddick1001Germany2025-06-02
Adams J Caldarera1002Germany2025-05-18
Deepesh M Stockham1003Argentina2025-06-02
Darci L Schemmer1004Germany2025-05-17
Ricardo G Schemmer1005Australia2025-06-13
Juan U Flosi1006Germany2025-05-27
Mujtaba C Shinko1007Argentina2025-06-04
Arvin E Poquette1008Russia2025-06-08
David M Ferencz1009Australia2025-06-10
Aika I Venere1010United Kingdom2025-05-27
Munro Y Saylors1011Spain2025-06-10
David R Dilliard1012Brazil2025-06-09
Deepesh J Figeroa1013United Kingdom2025-05-27
Adams J Malet1014Germany2025-05-19
Juan A Oldroyd1015Australia2025-06-05
James K Morasca1016Italy2025-06-03
Darci N Ruta1017Italy2025-05-23
Clifford S Wieser1018Canada2025-06-09
Izzy N Caldarera1019Italy2025-06-12
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Murillo Z InouyeUnited KingdomElwin Sharvill RENEWAL
Adams P WhobreyItalyIvan Magalhaes QUALIFIED
Cody M WaycottJapanAnna Fali QUALIFIED
Rodrigues B MarrierArgentinaAsiya Javayant UNQUALIFIED
Rodrigues T CaldareraIndiaAmy Elsner PROPOSAL
Jefferson J ChuiCanadaAmy Elsner PROPOSAL
Salvatore T NickaBrazilIoni Bowcher RENEWAL
Leon S KolmetzSpainXuxue Feng QUALIFIED
Ashley I FlosiRussiaAmy Elsner QUALIFIED
Jefferson X NestleItalyAmy Elsner QUALIFIED
Stacey I StockhamSpainAsiya Javayant NEGOTIATION
Isabel Y DilliardFranceBernardo Dominic NEW
David P MarrierArgentinaIvan Magalhaes UNQUALIFIED
Aika U WhobreyBrazilIoni Bowcher QUALIFIED
Aruna Y ButtCanadaElwin Sharvill NEGOTIATION
Isabel A IturbideCanadaBernardo Dominic UNQUALIFIED
Misaki P DarakjyBrazilOnyama Limba NEW
Jones V CaudyFranceAmy Elsner NEW
Faith V VocelkaSpainOnyama Limba RENEWAL
Darci W GillianFranceIoni Bowcher PROPOSAL
Alejandro G MaletGermanyIoni Bowcher QUALIFIED
Smith H MaletBrazilBernardo Dominic QUALIFIED
Munro M GauchoJapanBernardo Dominic PROPOSAL
Leja N FigeroaArgentinaAmy Elsner RENEWAL
Chavez Q SergiAustraliaStephen Shaw QUALIFIED
Ivar W FollerArgentinaAnna Fali NEW
Nicolas T BriddickUnited KingdomAsiya Javayant QUALIFIED
Julie Y RoysterItalyOnyama Limba UNQUALIFIED
Isabel J OstroskyRussiaAsiya Javayant RENEWAL
Cody I ShinkoAustraliaAsiya Javayant PROPOSAL
Julie U GillianItalyAnna Fali UNQUALIFIED
Mayumi B OstroskyJapanAsiya Javayant PROPOSAL
Jones F GillianRussiaAnna Fali UNQUALIFIED
Octavia E SaylorsFranceAmy Elsner NEGOTIATION
Emily S CaudyFranceBernardo Dominic NEW
Salvatore F SchemmerJapanStephen Shaw RENEWAL
Ivar N KuskoArgentinaAnna Fali PROPOSAL
Juan K AmigonJapanBernardo Dominic QUALIFIED
Ashley Q IturbideAustraliaIvan Magalhaes UNQUALIFIED
Misaki X TollnerRussiaIoni Bowcher 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>