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 F NestleRussiaAsiya Javayant UNQUALIFIED
Ricardo L MaletArgentinaOnyama Limba NEGOTIATION
Tony K DoeCanadaAsiya Javayant PROPOSAL
Jones F KolmetzSpainAmy Elsner RENEWAL
Stacey R DarakjySpainIoni Bowcher RENEWAL
Murillo Y ChuiSpainIoni Bowcher NEGOTIATION
Alejandro H StockhamCanadaAsiya Javayant NEW
Maisha U RimGermanyBernardo Dominic NEW
Chavez L StensethAustraliaBernardo Dominic QUALIFIED
Octavia W CampainArgentinaAsiya Javayant UNQUALIFIED
Deepesh L MacleadArgentinaBernardo Dominic PROPOSAL
Faith C WaycottGermanyAnna Fali QUALIFIED
Misaki N PaprockiArgentinaElwin Sharvill QUALIFIED
Rodrigues W CaldareraArgentinaBernardo Dominic NEW
Antonio W VenereSpainElwin Sharvill QUALIFIED
Juan E SlusarskiGermanyOnyama Limba PROPOSAL
Tony W SaylorsIndiaXuxue Feng NEW
Clifford K WaycottRussiaOnyama Limba RENEWAL
David T SaylorsBrazilBernardo Dominic QUALIFIED
Aruna U FollerSpainStephen Shaw NEGOTIATION
Faith N PoquetteRussiaElwin Sharvill RENEWAL
Darci M GauchoGermanyBernardo Dominic RENEWAL
Isabel R FlosiJapanAnna Fali UNQUALIFIED
Adams D FigeroaJapanAsiya Javayant NEGOTIATION
Kadeem L MarrierSpainAnna Fali UNQUALIFIED
Rodrigues O InouyeSpainStephen Shaw QUALIFIED
Mujtaba U FollerGermanyAsiya Javayant UNQUALIFIED
Darci Z BriddickAustraliaAnna Fali PROPOSAL
Rodrigues Q ChuiUnited KingdomOnyama Limba PROPOSAL
Maria U CampainRussiaAsiya Javayant NEGOTIATION
Greenwood Z SaylorsItalyIoni Bowcher PROPOSAL
Murillo I WhobreyBrazilElwin Sharvill RENEWAL
Maisha Z OldroydRussiaBernardo Dominic NEGOTIATION
Wickens F FollerFranceElwin Sharvill NEW
Ricardo U FollerFranceBernardo Dominic PROPOSAL
Maria O FollerSpainIoni Bowcher RENEWAL
Ricardo Z ChuiSpainStephen Shaw NEGOTIATION
David K ShinkoIndiaXuxue Feng NEW
Kaitlin R ButtGermanyElwin Sharvill NEGOTIATION
Ivar P DoeIndiaXuxue Feng PROPOSAL
Izzy I ButtUnited KingdomIoni Bowcher NEW
Wickens J MorascaItalyIoni Bowcher PROPOSAL
Ricardo M DarakjyUnited KingdomIvan Magalhaes QUALIFIED
Ricardo A DoeRussiaIoni Bowcher RENEWAL
Maisha F OldroydArgentinaStephen Shaw NEGOTIATION
Silvio T GillianItalyIoni Bowcher PROPOSAL
Adams A ButtGermanyAnna Fali UNQUALIFIED
Isabel W BriddickFranceIvan Magalhaes NEGOTIATION
Murillo F MaletItalyAsiya Javayant NEGOTIATION
Kaitlin A ShinkoAustraliaXuxue Feng NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Octavia E ShinkoArgentinaStephen Shaw RENEWAL
Darci L FerenczIndiaAnna Fali QUALIFIED
Maisha B DilliardFranceElwin Sharvill UNQUALIFIED
Claire X MaletItalyAsiya Javayant PROPOSAL
Leja Q TollnerAustraliaIvan Magalhaes RENEWAL
Mayumi G StockhamJapanBernardo Dominic QUALIFIED
Julie F FollerFranceOnyama Limba PROPOSAL
Maria D FollerFranceStephen Shaw NEW
Deepesh M FigeroaArgentinaElwin Sharvill PROPOSAL
Jennifer Z CaudyJapanXuxue Feng NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Costa T MacleadIndia2025-05-28Buckley Miller Wright NEW74Onyama Limba
1001David U AmigonSpain2025-06-13Rousseaux, Michael Esq PROPOSAL87Anna Fali
1002Arvin O MarrierFrance2025-06-06Morlong Associates NEGOTIATION19Ioni Bowcher
1003Jennifer Y ChuiIndia2025-06-02Benton, John B Jr UNQUALIFIED47Elwin Sharvill
1004Mujtaba E CaldareraJapan2025-06-02Truhlar And Truhlar Attys PROPOSAL56Stephen Shaw
1005Mujtaba E VocelkaFrance2025-05-23Rousseaux, Michael Esq QUALIFIED65Bernardo Dominic
1006Silvio P KolmetzUnited Kingdom2025-05-20Benton, John B Jr NEGOTIATION52Bernardo Dominic
1007Greenwood V CampainGermany2025-06-12Chemel, James L Cpa PROPOSAL28Onyama Limba
1008Emily F SaylorsIndia2025-05-19Truhlar And Truhlar Attys NEGOTIATION61Xuxue Feng
1009Sinclair M PaprockiGermany2025-06-03Dorl, James J Esq QUALIFIED87Elwin Sharvill
1010Leja O KolmetzFrance2025-06-06Truhlar And Truhlar Attys QUALIFIED18Onyama Limba
1011James Y InouyeSpain2025-05-21King, Christopher A Esq NEW48Stephen Shaw
1012Morrow B FerenczIndia2025-05-27Truhlar And Truhlar Attys NEW55Anna Fali
1013Francesco X IturbideArgentina2025-06-12Rangoni Of Florence RENEWAL32Ioni Bowcher
1014Adams I RoysterGermany2025-05-21Rangoni Of Florence PROPOSAL20Amy Elsner
1015Maisha Y VenereIndia2025-06-01Chemel, James L Cpa UNQUALIFIED10Elwin Sharvill
1016Arvin T VenereGermany2025-05-24Dorl, James J Esq UNQUALIFIED69Stephen Shaw
1017Jennifer W InouyeArgentina2025-06-10Buckley Miller Wright UNQUALIFIED65Elwin Sharvill
1018Costa L VenereGermany2025-05-26Feiner Bros UNQUALIFIED56Onyama Limba
1019Julie X OstroskyJapan2025-06-01Dorl, James J Esq QUALIFIED7Ivan Magalhaes
1020David K BologniaAustralia2025-05-16Rangoni Of Florence NEGOTIATION93Bernardo Dominic
1021Murillo O ButtJapan2025-06-01Dorl, James J Esq PROPOSAL93Onyama Limba
1022Juan R GillianArgentina2025-06-01Chemel, James L Cpa PROPOSAL25Amy Elsner
1023Clifford P MarrierUnited Kingdom2025-06-13Truhlar And Truhlar Attys PROPOSAL71Stephen Shaw
1024Wickens O DilliardCanada2025-05-27Morlong Associates PROPOSAL4Bernardo Dominic
1025Johnson R MorascaJapan2025-06-14Chemel, James L Cpa PROPOSAL99Ioni Bowcher
1026Clifford E ShinkoCanada2025-05-17Rangoni Of Florence UNQUALIFIED1Asiya Javayant
1027Jefferson L RulapaughFrance2025-06-07Chanay, Jeffrey A Esq QUALIFIED19Onyama Limba
1028Isabel S CaudyGermany2025-05-16Benton, John B Jr NEGOTIATION54Ivan Magalhaes
1029Rodrigues Q RulapaughUnited Kingdom2025-05-26Buckley Miller Wright QUALIFIED46Onyama Limba
1030Kadeem O SaylorsItaly2025-05-27Rangoni Of Florence NEGOTIATION51Amy Elsner
1031Darci Q OldroydGermany2025-05-16Morlong Associates PROPOSAL24Amy Elsner
1032Mujtaba B OldroydGermany2025-05-25Printing Dimensions RENEWAL36Ioni Bowcher
1033Stacey Y SergiGermany2025-06-03Feiner Bros QUALIFIED60Asiya Javayant
1034Maria D CaldareraAustralia2025-05-30Dorl, James J Esq NEW40Xuxue Feng
1035Deepesh L StensethBrazil2025-06-13Rangoni Of Florence NEW86Ivan Magalhaes
1036Smith I RoysterArgentina2025-05-19Chapman, Ross E Esq RENEWAL8Elwin Sharvill
1037Ivar U OldroydArgentina2025-05-23Truhlar And Truhlar Attys NEW82Anna Fali
1038Isabel K FigeroaBrazil2025-05-31King, Christopher A Esq NEW83Asiya Javayant
1039Sinclair O KuskoGermany2025-05-17Morlong Associates NEW86Bernardo Dominic
1040Sinclair G StockhamRussia2025-05-23Printing Dimensions QUALIFIED82Stephen Shaw
1041Deepesh G KuskoCanada2025-06-07Feiner Bros QUALIFIED29Xuxue Feng
1042Alejandro X PoquetteRussia2025-05-24Buckley Miller Wright RENEWAL74Asiya Javayant
1043Isabel T SlusarskiCanada2025-06-10Feltz Printing Service NEGOTIATION22Ivan Magalhaes
1044Misaki W PoquetteUnited Kingdom2025-05-17King, Christopher A Esq RENEWAL47Onyama Limba
1045Maria G PerinIndia2025-06-13Dorl, James J Esq NEGOTIATION73Anna Fali
1046Leon H NestleIndia2025-05-26Chemel, James L Cpa UNQUALIFIED19Stephen Shaw
1047Antonio G ShinkoRussia2025-06-14Buckley Miller Wright PROPOSAL35Stephen Shaw
1048Isabel Z CaldareraGermany2025-05-31Buckley Miller Wright NEGOTIATION5Ioni Bowcher
1049Maisha J SchemmerCanada2025-05-30Rousseaux, Michael Esq UNQUALIFIED83Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Costa E DilliardSpainAsiya Javayant NEW
Aruna E BowleyIndiaStephen Shaw NEGOTIATION
Darci X MarrierRussiaAsiya Javayant UNQUALIFIED
Juan R InouyeCanadaOnyama Limba NEW
Sinclair E VocelkaAustraliaStephen Shaw UNQUALIFIED
Jennifer M FollerFranceXuxue Feng UNQUALIFIED
Misaki S PaprockiIndiaAsiya Javayant QUALIFIED
Kaitlin W NestleItalyIvan Magalhaes QUALIFIED
Izzy A BowleyJapanAmy Elsner NEGOTIATION
Morrow C SergiUnited KingdomAnna Fali UNQUALIFIED
Darci X KolmetzAustraliaBernardo Dominic NEGOTIATION
Wickens R CaldareraJapanStephen Shaw UNQUALIFIED
Leja T GlickUnited KingdomBernardo Dominic UNQUALIFIED
Salvatore P PaprockiItalyAsiya Javayant RENEWAL
Jennifer F MaletRussiaXuxue Feng NEW
Julie G RutaAustraliaIoni Bowcher RENEWAL
Costa Z BriddickRussiaBernardo Dominic PROPOSAL
Aika C MorascaIndiaElwin Sharvill QUALIFIED
Claire T AmigonRussiaBernardo Dominic RENEWAL
Francesco F MarrierArgentinaAsiya Javayant PROPOSAL
Julie D PerinArgentinaIoni Bowcher RENEWAL
Silvio X VocelkaGermanyAsiya Javayant QUALIFIED
Ricardo J WhobreyUnited KingdomAnna Fali UNQUALIFIED
Aditya E FollerSpainAnna Fali UNQUALIFIED
Adams V DilliardIndiaAsiya Javayant PROPOSAL
Julie N GarufiJapanAmy Elsner QUALIFIED
Munro S NestleUnited KingdomIvan Magalhaes QUALIFIED
Francesco Q VocelkaUnited KingdomBernardo Dominic NEW
Darci H GlickAustraliaXuxue Feng RENEWAL
Morrow I DarakjyBrazilIvan Magalhaes QUALIFIED
Julie R SlusarskiUnited KingdomIvan Magalhaes UNQUALIFIED
Mujtaba C BologniaRussiaIoni Bowcher RENEWAL
Aditya W OstroskyRussiaXuxue Feng PROPOSAL
Maria R SergiItalyIvan Magalhaes PROPOSAL
Silvio E MaletItalyAsiya Javayant NEW
Jennifer Y DarakjyCanadaAsiya Javayant UNQUALIFIED
Maria F WaycottUnited KingdomStephen Shaw QUALIFIED
Darci G BowleyItalyXuxue Feng NEW
Morrow L KuskoCanadaAmy Elsner RENEWAL
Costa T StockhamCanadaOnyama Limba NEGOTIATION
Mujtaba M GillianBrazilStephen Shaw NEGOTIATION
Aditya T InouyeItalyIvan Magalhaes NEW
Sinclair D RulapaughSpainOnyama Limba NEW
Jefferson I StockhamFranceAmy Elsner QUALIFIED
Cody U MaletFranceXuxue Feng RENEWAL
Misaki M OstroskyItalyElwin Sharvill UNQUALIFIED
Wickens D FlosiUnited KingdomOnyama Limba QUALIFIED
Antonio H RoysterSpainIoni Bowcher NEGOTIATION
Clifford W InouyeJapanXuxue Feng UNQUALIFIED
Aruna B RimUnited KingdomAsiya Javayant NEGOTIATION
Frozen Columns
Name
Leon U Glick
Cody K Glick
Faith X Waycott
Ashley N Schemmer
Mayumi B Amigon
Salvatore K Sergi
Deepesh N Bolognia
Rodrigues M Albares
Arvin F Perin
Claire C Ferencz
Silvio V Tollner
Misaki B Briddick
Murillo Z Darakjy
Johnson I Schemmer
David U Rulapaugh
Jones V Ostrosky
Kaitlin R Venere
Leja K Maclead
Stacey M Rulapaugh
Kadeem J Chui
Misaki I Iturbide
Greenwood Z Shinko
Octavia F Chui
Antonio L Glick
Aditya N Nicka
Rodrigues G Paprocki
Kadeem N Iturbide
Octavia S Ferencz
Clifford Q Paprocki
Tony J Oldroyd
Munro Y Glick
Kadeem M Tollner
Juan H Caudy
Greenwood B Tollner
Costa L Caldarera
Claire Y Sergi
Aruna S Iturbide
Kadeem B Malet
Sinclair N Slusarski
Jefferson H Rim
Clifford S Campain
Ashley K Caldarera
Silvio L Morasca
Aika V Saylors
Ashley V Dilliard
Nicolas U Gaucho
Kadeem J Caudy
Costa B Albares
James G Vocelka
James Y Schemmer
IdCountryDate
1000Japan2025-05-24
1001Australia2025-05-21
1002India2025-05-26
1003Spain2025-05-16
1004United Kingdom2025-06-09
1005Japan2025-06-05
1006Canada2025-06-07
1007Argentina2025-05-24
1008Germany2025-05-29
1009United Kingdom2025-05-18
1010Australia2025-05-23
1011Japan2025-05-28
1012Canada2025-05-31
1013Argentina2025-06-05
1014United Kingdom2025-06-08
1015Germany2025-06-08
1016Russia2025-05-19
1017Argentina2025-06-13
1018Australia2025-06-05
1019Spain2025-06-05
1020United Kingdom2025-06-05
1021Brazil2025-06-12
1022India2025-05-17
1023Canada2025-06-07
1024Germany2025-06-13
1025Australia2025-06-04
1026Germany2025-06-04
1027Australia2025-05-29
1028United Kingdom2025-06-02
1029Brazil2025-05-23
1030India2025-05-26
1031Australia2025-06-08
1032Japan2025-06-01
1033United Kingdom2025-06-07
1034Spain2025-05-16
1035Brazil2025-06-04
1036France2025-06-09
1037Australia2025-05-16
1038United Kingdom2025-05-17
1039Canada2025-05-19
1040Italy2025-05-30
1041Italy2025-05-31
1042Germany2025-06-02
1043Spain2025-06-03
1044Argentina2025-06-01
1045Spain2025-06-09
1046Germany2025-06-02
1047India2025-05-29
1048Italy2025-05-30
1049Argentina2025-05-19

On-Demand Data

NameIdCountryDate
Jeanfrancois Q Nestle1000Italy2025-06-10
Jefferson G Malet1001Japan2025-05-30
Juan J Dilliard1002Japan2025-06-09
Ricardo Y Rim1003Japan2025-05-30
Emily U Bowley1004Australia2025-06-09
Wickens R Bolognia1005India2025-06-09
Ricardo R Gillian1006Argentina2025-05-21
Faith R Sergi1007France2025-05-30
Misaki H Marrier1008Japan2025-05-23
Antonio J Bowley1009Brazil2025-05-17
Ashley Q Caldarera1010India2025-06-02
Maisha M Bolognia1011United Kingdom2025-06-10
Isabel S Ostrosky1012India2025-06-04
Wickens K Butt1013Germany2025-05-27
Leon J Flosi1014Canada2025-05-25
Wickens D Wieser1015Spain2025-06-14
Sinclair P Gaucho1016Argentina2025-05-18
Morrow K Whobrey1017Spain2025-06-04
Tony P Stockham1018India2025-05-25
Leon S Iturbide1019Argentina2025-05-29
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Salvatore W AlbaresIndiaElwin Sharvill UNQUALIFIED
Octavia Z SchemmerCanadaAnna Fali RENEWAL
Ivar G NestleArgentinaAmy Elsner QUALIFIED
Stacey J TollnerCanadaIoni Bowcher RENEWAL
Jeanfrancois B KolmetzItalyAsiya Javayant QUALIFIED
Nicolas G BowleyFranceOnyama Limba QUALIFIED
Misaki N MarrierUnited KingdomElwin Sharvill PROPOSAL
Maisha C FerenczRussiaOnyama Limba NEGOTIATION
Arvin P MarrierGermanyIoni Bowcher NEGOTIATION
Izzy W MaletRussiaAmy Elsner QUALIFIED
Jones D PerinFranceAmy Elsner UNQUALIFIED
Johnson G GarufiBrazilOnyama Limba PROPOSAL
Deepesh T BowleyArgentinaAnna Fali QUALIFIED
Claire M OldroydRussiaXuxue Feng PROPOSAL
Jefferson H CaudyJapanAmy Elsner NEGOTIATION
Sinclair L OstroskyIndiaBernardo Dominic NEW
Jefferson H VocelkaUnited KingdomAmy Elsner NEW
Salvatore K SaylorsRussiaBernardo Dominic NEGOTIATION
Alejandro I CampainCanadaIvan Magalhaes NEGOTIATION
Silvio J GlickRussiaIvan Magalhaes QUALIFIED
Stacey W GauchoUnited KingdomAmy Elsner PROPOSAL
Francesco D DoeJapanElwin Sharvill NEW
Alejandro P RimBrazilIvan Magalhaes RENEWAL
Faith H RimSpainIoni Bowcher NEGOTIATION
Smith D RutaUnited KingdomAmy Elsner NEGOTIATION
Jones A FigeroaSpainIoni Bowcher QUALIFIED
Kadeem I MarrierFranceAsiya Javayant PROPOSAL
Isabel R MorascaBrazilAnna Fali NEW
Ricardo P InouyeCanadaXuxue Feng UNQUALIFIED
Jones Y VocelkaSpainIvan Magalhaes NEGOTIATION
Munro H NestleRussiaOnyama Limba RENEWAL
Adams S RutaSpainXuxue Feng PROPOSAL
Chavez B WieserArgentinaElwin Sharvill NEGOTIATION
Faith D BriddickUnited KingdomOnyama Limba RENEWAL
Claire A KolmetzArgentinaAnna Fali UNQUALIFIED
Murillo N ButtJapanXuxue Feng UNQUALIFIED
Aruna O SlusarskiCanadaAnna Fali RENEWAL
Munro M RutaSpainOnyama Limba QUALIFIED
Kaitlin X GlickFranceStephen Shaw RENEWAL
Morrow W MaletCanadaBernardo 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>