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
Ricardo M SlusarskiAustraliaAsiya Javayant PROPOSAL
Stacey K DarakjyGermanyBernardo Dominic NEW
Leja I IturbideFranceOnyama Limba RENEWAL
Aditya V CaudyRussiaIvan Magalhaes NEGOTIATION
Deepesh U ButtUnited KingdomOnyama Limba UNQUALIFIED
Munro M SergiFranceElwin Sharvill NEW
Faith H CaldareraIndiaIvan Magalhaes NEW
Adams Q BowleyArgentinaStephen Shaw RENEWAL
Deepesh E KuskoRussiaStephen Shaw PROPOSAL
Arvin D KolmetzRussiaBernardo Dominic RENEWAL
Tony X KolmetzJapanBernardo Dominic QUALIFIED
Kadeem X RoysterArgentinaElwin Sharvill QUALIFIED
Munro F PaprockiRussiaBernardo Dominic QUALIFIED
Ricardo A OldroydJapanElwin Sharvill NEW
Ricardo E BologniaAustraliaAsiya Javayant NEW
Ivar Z MorascaItalyIvan Magalhaes NEW
Leon F PaprockiFranceAmy Elsner NEW
Aruna M CaldareraGermanyIvan Magalhaes NEW
Antonio W RutaSpainBernardo Dominic NEW
Johnson S BologniaRussiaStephen Shaw NEW
Ivar G BriddickArgentinaXuxue Feng QUALIFIED
Sinclair Z BriddickUnited KingdomBernardo Dominic UNQUALIFIED
Antonio S BowleyItalyAmy Elsner QUALIFIED
Costa O PerinUnited KingdomAmy Elsner UNQUALIFIED
Arvin X SchemmerIndiaIvan Magalhaes PROPOSAL
Silvio Q ShinkoIndiaStephen Shaw NEGOTIATION
Jennifer N MaletAustraliaAmy Elsner RENEWAL
Jefferson G PerinArgentinaStephen Shaw NEW
Leon X CaldareraRussiaElwin Sharvill QUALIFIED
Deepesh A FollerGermanyElwin Sharvill UNQUALIFIED
Silvio S WaycottAustraliaAmy Elsner NEW
Kadeem L VenereUnited KingdomIoni Bowcher UNQUALIFIED
Leja B MaletBrazilBernardo Dominic QUALIFIED
Mayumi P BologniaArgentinaElwin Sharvill PROPOSAL
Antonio M GillianArgentinaIvan Magalhaes NEGOTIATION
Johnson B MorascaGermanyAmy Elsner PROPOSAL
Jefferson M MorascaAustraliaIoni Bowcher UNQUALIFIED
Faith K SchemmerBrazilAnna Fali NEGOTIATION
Alejandro W PaprockiBrazilStephen Shaw NEGOTIATION
Jeanfrancois E MaletAustraliaAsiya Javayant NEGOTIATION
Octavia V GlickBrazilIoni Bowcher NEGOTIATION
Misaki I OstroskyGermanyXuxue Feng UNQUALIFIED
Wickens C BowleyGermanyElwin Sharvill NEW
Ricardo G ShinkoAustraliaElwin Sharvill NEGOTIATION
Tony S SaylorsIndiaElwin Sharvill RENEWAL
Costa P PaprockiRussiaBernardo Dominic QUALIFIED
Juan H DoeItalyXuxue Feng RENEWAL
Costa U GillianAustraliaIvan Magalhaes NEW
Izzy U CaudyItalyAmy Elsner NEW
Clifford N PoquetteBrazilAnna Fali NEW
Horizontal
NameCountryRepresentativeStatus
Arvin J SaylorsGermanyStephen Shaw NEW
Juan A VenereArgentinaAmy Elsner UNQUALIFIED
Silvio R CampainSpainIvan Magalhaes NEGOTIATION
Ivar Q CaldareraArgentinaIvan Magalhaes NEGOTIATION
Darci G MarrierFranceAnna Fali UNQUALIFIED
Costa G GillianUnited KingdomAmy Elsner QUALIFIED
Silvio R CampainItalyAsiya Javayant PROPOSAL
Izzy J NickaFranceXuxue Feng PROPOSAL
Alejandro J MarrierCanadaIoni Bowcher NEGOTIATION
Tony P FlosiUnited KingdomAnna Fali RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Costa X ShinkoAustralia2025-04-01King, Christopher A Esq NEGOTIATION41Elwin Sharvill
1001Mujtaba P InouyeBrazil2025-04-03Chanay, Jeffrey A Esq PROPOSAL43Asiya Javayant
1002Jefferson N MaletFrance2025-04-21Truhlar And Truhlar Attys PROPOSAL53Asiya Javayant
1003Faith J DilliardAustralia2025-04-26Feltz Printing Service NEGOTIATION18Onyama Limba
1004Salvatore F PaprockiGermany2025-04-04Rousseaux, Michael Esq NEGOTIATION16Asiya Javayant
1005Ricardo N TollnerUnited Kingdom2025-04-03Rousseaux, Michael Esq UNQUALIFIED24Amy Elsner
1006Jones Y StockhamCanada2025-04-22Commercial Press NEW45Anna Fali
1007Jones F RutaAustralia2025-04-02Buckley Miller Wright QUALIFIED13Asiya Javayant
1008Antonio Y DoeCanada2025-04-10Truhlar And Truhlar Attys NEGOTIATION94Amy Elsner
1009Leja Y FigeroaJapan2025-04-16Chapman, Ross E Esq QUALIFIED39Elwin Sharvill
1010Misaki M DoeSpain2025-04-02Dorl, James J Esq PROPOSAL91Stephen Shaw
1011Jennifer V KuskoUnited Kingdom2025-04-19Dorl, James J Esq PROPOSAL41Onyama Limba
1012Morrow P TollnerRussia2025-04-24King, Christopher A Esq RENEWAL66Asiya Javayant
1013Francesco U IturbideCanada2025-04-10Commercial Press UNQUALIFIED40Onyama Limba
1014Aditya B MorascaJapan2025-04-17Benton, John B Jr PROPOSAL21Xuxue Feng
1015Chavez G GarufiBrazil2025-04-14Morlong Associates UNQUALIFIED54Xuxue Feng
1016Aruna I MarrierSpain2025-04-29Feltz Printing Service RENEWAL6Ivan Magalhaes
1017Tony A WieserRussia2025-04-25Chanay, Jeffrey A Esq NEGOTIATION92Anna Fali
1018Jeanfrancois X RoysterArgentina2025-04-18Chanay, Jeffrey A Esq RENEWAL56Bernardo Dominic
1019Isabel K KolmetzUnited Kingdom2025-04-12Chanay, Jeffrey A Esq RENEWAL21Anna Fali
1020Ricardo D VocelkaFrance2025-04-10Rangoni Of Florence QUALIFIED85Xuxue Feng
1021Adams X BologniaItaly2025-04-01Printing Dimensions UNQUALIFIED32Onyama Limba
1022Aika L BologniaCanada2025-04-30Benton, John B Jr RENEWAL24Onyama Limba
1023Cody R NickaItaly2025-04-19Feiner Bros QUALIFIED14Ivan Magalhaes
1024Morrow H GarufiSpain2025-04-03Truhlar And Truhlar Attys NEW38Ivan Magalhaes
1025Maria O KolmetzArgentina2025-04-24Chemel, James L Cpa NEW62Bernardo Dominic
1026Stacey M SchemmerJapan2025-04-23Truhlar And Truhlar Attys PROPOSAL14Asiya Javayant
1027Chavez I WieserUnited Kingdom2025-04-22Morlong Associates RENEWAL98Amy Elsner
1028Aruna L AlbaresArgentina2025-04-06Rousseaux, Michael Esq RENEWAL58Asiya Javayant
1029Cody F StockhamCanada2025-04-20Truhlar And Truhlar Attys NEW24Asiya Javayant
1030Arvin P KolmetzAustralia2025-04-26Truhlar And Truhlar Attys QUALIFIED17Xuxue Feng
1031Kadeem Y GillianBrazil2025-04-27Rousseaux, Michael Esq RENEWAL9Bernardo Dominic
1032Aika U MaletIndia2025-04-05Feiner Bros PROPOSAL42Stephen Shaw
1033Misaki B DilliardUnited Kingdom2025-04-18King, Christopher A Esq UNQUALIFIED59Asiya Javayant
1034Claire H DoeUnited Kingdom2025-04-07Chapman, Ross E Esq PROPOSAL45Ivan Magalhaes
1035David S WieserUnited Kingdom2025-04-03King, Christopher A Esq NEW26Ivan Magalhaes
1036Smith M TollnerAustralia2025-04-07Rousseaux, Michael Esq PROPOSAL95Elwin Sharvill
1037Clifford H AlbaresIndia2025-04-08Buckley Miller Wright UNQUALIFIED67Ivan Magalhaes
1038Izzy E FlosiArgentina2025-04-25Buckley Miller Wright RENEWAL12Bernardo Dominic
1039Misaki V RimBrazil2025-04-12Buckley Miller Wright PROPOSAL68Ioni Bowcher
1040Claire I VenereBrazil2025-04-11Printing Dimensions QUALIFIED11Xuxue Feng
1041Mayumi G ButtCanada2025-04-06Rousseaux, Michael Esq QUALIFIED94Ioni Bowcher
1042Kadeem H DilliardArgentina2025-04-29Benton, John B Jr NEGOTIATION87Bernardo Dominic
1043Antonio E DilliardArgentina2025-04-09Rousseaux, Michael Esq NEGOTIATION81Elwin Sharvill
1044Leja M RimIndia2025-04-05Printing Dimensions NEW32Ioni Bowcher
1045Emily Z CaudyGermany2025-04-13Feiner Bros UNQUALIFIED19Ioni Bowcher
1046Deepesh O MacleadArgentina2025-04-19Buckley Miller Wright PROPOSAL26Anna Fali
1047Greenwood Z BologniaGermany2025-04-03Printing Dimensions NEW30Xuxue Feng
1048Aruna M OldroydItaly2025-04-19Buckley Miller Wright RENEWAL55Ioni Bowcher
1049Stacey S IturbideJapan2025-04-26Chapman, Ross E Esq QUALIFIED35Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Octavia D MarrierFranceXuxue Feng NEGOTIATION
Arvin M CaudyIndiaXuxue Feng UNQUALIFIED
Cody R FigeroaBrazilAmy Elsner UNQUALIFIED
Leja P FigeroaIndiaOnyama Limba RENEWAL
Wickens W GillianItalyBernardo Dominic RENEWAL
Ivar V ChuiRussiaXuxue Feng PROPOSAL
Salvatore S KuskoBrazilAnna Fali QUALIFIED
Sinclair W FigeroaBrazilXuxue Feng UNQUALIFIED
Julie H WhobreyIndiaXuxue Feng UNQUALIFIED
Isabel P BologniaArgentinaXuxue Feng RENEWAL
Murillo S FigeroaJapanAmy Elsner RENEWAL
Chavez E CaldareraAustraliaIoni Bowcher UNQUALIFIED
Jefferson Z InouyeBrazilStephen Shaw QUALIFIED
Jennifer F CaudyBrazilStephen Shaw NEGOTIATION
David K FollerIndiaBernardo Dominic RENEWAL
Aika I ButtUnited KingdomOnyama Limba QUALIFIED
Isabel O RutaSpainAmy Elsner RENEWAL
James F DarakjyArgentinaOnyama Limba UNQUALIFIED
Chavez K ChuiRussiaOnyama Limba NEGOTIATION
Johnson B AlbaresItalyStephen Shaw RENEWAL
Murillo E GarufiCanadaIvan Magalhaes NEW
Clifford C RimItalyElwin Sharvill UNQUALIFIED
Kadeem F BriddickRussiaIvan Magalhaes NEW
Ivar B SchemmerFranceIvan Magalhaes NEW
Jennifer Z MarrierJapanAmy Elsner NEW
Misaki R GlickBrazilAmy Elsner RENEWAL
Jeanfrancois P TollnerRussiaOnyama Limba QUALIFIED
Adams X VenereRussiaIvan Magalhaes NEGOTIATION
Mujtaba X FollerSpainOnyama Limba UNQUALIFIED
Clifford L MorascaSpainBernardo Dominic NEW
Costa L DoeArgentinaIvan Magalhaes RENEWAL
Munro I GlickUnited KingdomIvan Magalhaes PROPOSAL
Ashley F VenereArgentinaIoni Bowcher PROPOSAL
Aika U AmigonUnited KingdomStephen Shaw PROPOSAL
Johnson T FollerGermanyElwin Sharvill PROPOSAL
Alejandro F SlusarskiItalyAnna Fali UNQUALIFIED
Adams F SlusarskiItalyStephen Shaw NEGOTIATION
Adams V KolmetzArgentinaOnyama Limba UNQUALIFIED
Jennifer F BologniaUnited KingdomAmy Elsner PROPOSAL
Cody F ShinkoSpainIoni Bowcher RENEWAL
Claire J VenereArgentinaElwin Sharvill RENEWAL
Jeanfrancois R IturbideItalyXuxue Feng RENEWAL
Smith U GlickArgentinaIoni Bowcher RENEWAL
Leon H AlbaresIndiaAsiya Javayant RENEWAL
Julie C MorascaFranceAsiya Javayant NEW
Maria V SchemmerIndiaAnna Fali RENEWAL
Faith D MaletJapanXuxue Feng NEW
Deepesh V TollnerBrazilBernardo Dominic NEGOTIATION
Antonio J MorascaBrazilIvan Magalhaes NEW
Wickens I CampainFranceIoni Bowcher NEGOTIATION
Frozen Columns
Name
Murillo H Malet
Izzy H Bolognia
Mujtaba V Kusko
Aika X Foller
Wickens E Gaucho
Rodrigues G Butt
Jefferson Q Kusko
Adams A Doe
Murillo K Iturbide
James Q Bowley
Sinclair N Kolmetz
Chavez T Flosi
Leon H Briddick
Darci E Iturbide
Murillo O Bolognia
Ivar R Marrier
Juan P Slusarski
Arvin Q Glick
Kadeem X Nestle
David G Rim
Wickens T Flosi
Johnson N Gaucho
Jones O Darakjy
Nicolas H Figeroa
Costa R Chui
Kadeem G Whobrey
Silvio I Briddick
Mujtaba E Albares
Francesco X Marrier
Julie N Vocelka
Jones C Slusarski
Jefferson M Gaucho
Salvatore U Stenseth
Johnson S Dilliard
Octavia Y Vocelka
Kadeem B Figeroa
Jefferson U Saylors
Isabel K Bowley
Maria K Whobrey
Kadeem F Poquette
Munro M Paprocki
Deepesh F Ferencz
Francesco B Bowley
Costa K Paprocki
Aditya P Slusarski
Kadeem W Ferencz
Murillo B Rim
Izzy K Saylors
Silvio A Bowley
Jones M Caudy
IdCountryDate
1000India2025-04-01
1001Australia2025-04-08
1002Germany2025-04-18
1003United Kingdom2025-04-17
1004Spain2025-04-29
1005Australia2025-04-19
1006Russia2025-04-20
1007Spain2025-04-30
1008Italy2025-04-30
1009Argentina2025-04-03
1010Australia2025-04-12
1011Japan2025-04-25
1012India2025-04-26
1013India2025-04-17
1014Japan2025-04-26
1015Canada2025-04-04
1016Spain2025-04-24
1017United Kingdom2025-04-26
1018Spain2025-04-25
1019India2025-04-06
1020Italy2025-04-19
1021Russia2025-04-15
1022France2025-04-23
1023Australia2025-04-07
1024Russia2025-04-22
1025India2025-04-18
1026Spain2025-04-07
1027Brazil2025-04-16
1028Japan2025-04-29
1029Australia2025-04-10
1030Germany2025-04-14
1031Japan2025-04-24
1032Russia2025-04-10
1033Australia2025-04-15
1034Germany2025-04-26
1035Brazil2025-04-17
1036Italy2025-04-15
1037United Kingdom2025-04-25
1038Australia2025-04-04
1039India2025-04-27
1040Brazil2025-04-03
1041Germany2025-04-27
1042Argentina2025-04-29
1043Japan2025-04-30
1044Brazil2025-04-17
1045Brazil2025-04-02
1046Australia2025-04-12
1047Australia2025-04-19
1048Australia2025-04-11
1049Germany2025-04-01

On-Demand Data

NameIdCountryDate
Sinclair G Amigon1000India2025-04-23
Claire J Bowley1001Argentina2025-04-29
Murillo W Ferencz1002Japan2025-04-21
Clifford K Paprocki1003Japan2025-04-05
Munro X Gillian1004Japan2025-04-04
Sinclair G Garufi1005Russia2025-04-17
Ivar C Malet1006Argentina2025-04-02
Silvio Z Sergi1007Australia2025-04-14
Kadeem P Stockham1008Spain2025-04-24
Maisha U Chui1009Germany2025-04-27
Munro E Albares1010United Kingdom2025-04-06
Smith Y Butt1011Canada2025-04-08
Johnson Z Flosi1012United Kingdom2025-04-28
Silvio L Flosi1013Brazil2025-04-05
Smith I Sergi1014Germany2025-04-27
Greenwood W Bolognia1015Argentina2025-04-20
Leja B Gaucho1016France2025-04-17
Mayumi Z Stockham1017India2025-04-25
Clifford K Briddick1018Japan2025-04-20
Costa F Nicka1019Italy2025-04-14
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Emily I FerenczItalyIoni Bowcher UNQUALIFIED
Jennifer S RulapaughItalyAnna Fali UNQUALIFIED
Nicolas I KuskoFranceBernardo Dominic NEGOTIATION
Maria S PoquetteRussiaIvan Magalhaes RENEWAL
Kaitlin Z FigeroaItalyOnyama Limba QUALIFIED
Aika W ChuiJapanElwin Sharvill PROPOSAL
Silvio J FlosiAustraliaElwin Sharvill PROPOSAL
Clifford O WieserAustraliaIvan Magalhaes UNQUALIFIED
Julie O CaudyItalyStephen Shaw RENEWAL
Ivar D WieserItalyXuxue Feng QUALIFIED
Costa U FigeroaFranceAnna Fali NEW
Munro H NestleRussiaAsiya Javayant PROPOSAL
Izzy W WaycottAustraliaIvan Magalhaes UNQUALIFIED
Izzy T FigeroaGermanyStephen Shaw PROPOSAL
Maria G FerenczIndiaXuxue Feng RENEWAL
Alejandro O MacleadArgentinaBernardo Dominic RENEWAL
Morrow I NestleUnited KingdomIvan Magalhaes PROPOSAL
Juan R OldroydBrazilElwin Sharvill PROPOSAL
Munro Z ChuiBrazilBernardo Dominic UNQUALIFIED
Aditya P NestleCanadaBernardo Dominic RENEWAL
Isabel Y StockhamItalyIoni Bowcher NEW
Murillo H DoeArgentinaOnyama Limba PROPOSAL
Mujtaba N PaprockiIndiaBernardo Dominic PROPOSAL
Munro B GlickAustraliaElwin Sharvill NEGOTIATION
Aika G IturbideArgentinaXuxue Feng UNQUALIFIED
Aditya U DarakjyAustraliaAmy Elsner UNQUALIFIED
Aditya H WaycottGermanyIoni Bowcher RENEWAL
Misaki C MarrierAustraliaAsiya Javayant NEW
Silvio J CaldareraFranceIoni Bowcher PROPOSAL
Johnson J FollerAustraliaAnna Fali QUALIFIED
Clifford K DilliardItalyAsiya Javayant QUALIFIED
Greenwood Y RoysterJapanAsiya Javayant PROPOSAL
Munro A WieserFranceAmy Elsner PROPOSAL
Faith M SchemmerGermanyAnna Fali UNQUALIFIED
Julie A SaylorsUnited KingdomIoni Bowcher QUALIFIED
Jeanfrancois L RulapaughGermanyAnna Fali RENEWAL
David G FollerFranceBernardo Dominic RENEWAL
Kaitlin R AlbaresUnited KingdomOnyama Limba QUALIFIED
Clifford G DilliardArgentinaIoni Bowcher QUALIFIED
Arvin Q MaletUnited KingdomOnyama Limba 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>