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
Adams L KuskoJapanIvan Magalhaes PROPOSAL
Salvatore R VenereCanadaOnyama Limba PROPOSAL
Darci U FigeroaJapanBernardo Dominic RENEWAL
Nicolas C GillianGermanyStephen Shaw PROPOSAL
Wickens Z MarrierJapanStephen Shaw NEW
Ricardo K GillianArgentinaXuxue Feng PROPOSAL
Tony B PaprockiBrazilAnna Fali RENEWAL
Izzy F GlickUnited KingdomIoni Bowcher RENEWAL
Emily W AlbaresItalyBernardo Dominic NEGOTIATION
Darci X KuskoArgentinaIoni Bowcher NEW
Clifford V FerenczJapanIoni Bowcher NEGOTIATION
Ivar X ShinkoUnited KingdomBernardo Dominic NEGOTIATION
Aditya P GarufiArgentinaStephen Shaw RENEWAL
Costa J PerinRussiaAnna Fali QUALIFIED
Nicolas A AmigonBrazilAnna Fali QUALIFIED
Sinclair M SlusarskiItalyOnyama Limba PROPOSAL
Silvio K NestleSpainIoni Bowcher QUALIFIED
David U DoeBrazilIoni Bowcher QUALIFIED
Tony C DilliardIndiaIvan Magalhaes NEGOTIATION
Aruna P RimAustraliaAnna Fali UNQUALIFIED
Adams P RoysterSpainIoni Bowcher UNQUALIFIED
Smith S MacleadCanadaIvan Magalhaes QUALIFIED
Jeanfrancois T CampainSpainAsiya Javayant NEW
James H StensethUnited KingdomStephen Shaw QUALIFIED
Rodrigues K GillianUnited KingdomAmy Elsner UNQUALIFIED
Adams N RoysterBrazilElwin Sharvill UNQUALIFIED
Silvio W ButtIndiaXuxue Feng QUALIFIED
Octavia Y VenereRussiaOnyama Limba PROPOSAL
Maisha R SchemmerItalyAnna Fali RENEWAL
Tony S VenereBrazilOnyama Limba NEGOTIATION
Adams P NestleArgentinaXuxue Feng RENEWAL
Ricardo T CaldareraJapanIoni Bowcher UNQUALIFIED
Cody G GillianArgentinaOnyama Limba NEW
James X DarakjyFranceAmy Elsner UNQUALIFIED
Maisha N RulapaughCanadaAsiya Javayant NEW
Jennifer P SlusarskiGermanyIvan Magalhaes RENEWAL
Kaitlin Z RutaIndiaElwin Sharvill QUALIFIED
Clifford S StockhamSpainBernardo Dominic NEW
Kaitlin E GillianCanadaOnyama Limba NEGOTIATION
Jeanfrancois X WieserAustraliaElwin Sharvill QUALIFIED
Deepesh X SergiAustraliaBernardo Dominic UNQUALIFIED
Emily H CaudyUnited KingdomStephen Shaw RENEWAL
Ashley Q NickaGermanyBernardo Dominic NEGOTIATION
James V ChuiArgentinaAnna Fali NEW
Mayumi E ButtUnited KingdomAnna Fali QUALIFIED
Misaki U PoquetteSpainBernardo Dominic PROPOSAL
David U DarakjyArgentinaAmy Elsner RENEWAL
Smith M TollnerItalyOnyama Limba NEGOTIATION
Misaki X SchemmerRussiaAmy Elsner NEW
Ricardo C DilliardRussiaBernardo Dominic NEW
Horizontal
NameCountryRepresentativeStatus
Salvatore V BologniaBrazilAmy Elsner PROPOSAL
Antonio H FigeroaIndiaAsiya Javayant PROPOSAL
Wickens L ChuiUnited KingdomXuxue Feng NEGOTIATION
Munro R IturbideAustraliaAmy Elsner PROPOSAL
Jennifer S WhobreyFranceIvan Magalhaes QUALIFIED
Isabel R CampainSpainAnna Fali RENEWAL
Aditya H RutaArgentinaIoni Bowcher NEGOTIATION
Munro K GauchoJapanXuxue Feng NEW
Maisha G AlbaresIndiaAmy Elsner NEGOTIATION
Sinclair S AmigonRussiaIvan Magalhaes PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Leon D KolmetzCanada2025-04-21Chemel, James L Cpa NEGOTIATION21Anna Fali
1001Emily G ButtFrance2025-04-29Rousseaux, Michael Esq UNQUALIFIED92Ioni Bowcher
1002Aika O MacleadIndia2025-04-10Rousseaux, Michael Esq PROPOSAL18Ioni Bowcher
1003Octavia L RutaJapan2025-05-02Morlong Associates NEW64Elwin Sharvill
1004Maisha V PoquetteFrance2025-04-17Chemel, James L Cpa QUALIFIED60Elwin Sharvill
1005Darci O ButtRussia2025-04-16Printing Dimensions NEW52Onyama Limba
1006Ricardo W FerenczIndia2025-04-12Rangoni Of Florence RENEWAL47Bernardo Dominic
1007Isabel Z FerenczBrazil2025-04-29Buckley Miller Wright QUALIFIED50Ivan Magalhaes
1008Costa K ChuiCanada2025-04-10Feltz Printing Service NEW46Stephen Shaw
1009Stacey B StockhamRussia2025-04-10Chemel, James L Cpa QUALIFIED26Ivan Magalhaes
1010Maisha R OldroydSpain2025-04-24Printing Dimensions NEGOTIATION33Ioni Bowcher
1011Alejandro H MarrierGermany2025-05-01Benton, John B Jr NEW97Xuxue Feng
1012Deepesh L ChuiCanada2025-04-27Truhlar And Truhlar Attys QUALIFIED53Bernardo Dominic
1013David X VenereGermany2025-04-21Rousseaux, Michael Esq QUALIFIED72Onyama Limba
1014Leja D WaycottFrance2025-04-17Feiner Bros NEGOTIATION8Amy Elsner
1015Aika X VenereAustralia2025-04-12Rangoni Of Florence NEW65Elwin Sharvill
1016Kadeem R DarakjyAustralia2025-04-17Rangoni Of Florence RENEWAL87Ivan Magalhaes
1017Juan Z BowleyIndia2025-04-28Chapman, Ross E Esq RENEWAL65Onyama Limba
1018Aruna Y MaletArgentina2025-04-20Truhlar And Truhlar Attys PROPOSAL86Bernardo Dominic
1019Emily F MacleadJapan2025-05-03King, Christopher A Esq NEGOTIATION40Ioni Bowcher
1020Murillo A WhobreyRussia2025-05-04Buckley Miller Wright NEW49Ioni Bowcher
1021Mujtaba Z VocelkaCanada2025-05-08Commercial Press NEGOTIATION70Asiya Javayant
1022Stacey F FlosiAustralia2025-04-22Feiner Bros UNQUALIFIED10Xuxue Feng
1023Misaki A FlosiBrazil2025-05-03Chanay, Jeffrey A Esq UNQUALIFIED35Asiya Javayant
1024Darci P MorascaIndia2025-04-21Commercial Press RENEWAL62Amy Elsner
1025Arvin T AmigonUnited Kingdom2025-04-15Feltz Printing Service PROPOSAL77Onyama Limba
1026Wickens V GauchoJapan2025-04-25Chanay, Jeffrey A Esq RENEWAL3Bernardo Dominic
1027Maria S StensethArgentina2025-04-10King, Christopher A Esq QUALIFIED34Ioni Bowcher
1028Murillo O PerinUnited Kingdom2025-04-17Printing Dimensions PROPOSAL93Amy Elsner
1029James W KolmetzBrazil2025-05-08King, Christopher A Esq NEW21Ivan Magalhaes
1030Juan E StensethIndia2025-04-28Dorl, James J Esq PROPOSAL11Bernardo Dominic
1031Silvio E DarakjyJapan2025-04-09Feiner Bros NEGOTIATION50Ivan Magalhaes
1032Mujtaba B SaylorsArgentina2025-04-26King, Christopher A Esq UNQUALIFIED77Ioni Bowcher
1033James G MaletGermany2025-05-08Chanay, Jeffrey A Esq QUALIFIED10Bernardo Dominic
1034Maisha C SlusarskiSpain2025-05-04Chemel, James L Cpa NEW35Asiya Javayant
1035Tony J VocelkaRussia2025-05-05Benton, John B Jr NEGOTIATION12Anna Fali
1036Juan X GlickUnited Kingdom2025-05-06King, Christopher A Esq QUALIFIED95Elwin Sharvill
1037Jennifer O MorascaArgentina2025-05-08Chemel, James L Cpa QUALIFIED81Amy Elsner
1038Aditya T GillianSpain2025-04-19Feltz Printing Service QUALIFIED4Stephen Shaw
1039Julie Z DoeRussia2025-05-02Rousseaux, Michael Esq UNQUALIFIED42Elwin Sharvill
1040Costa Z GarufiArgentina2025-04-23Dorl, James J Esq NEGOTIATION77Asiya Javayant
1041Sinclair H GauchoGermany2025-04-25Dorl, James J Esq NEGOTIATION7Stephen Shaw
1042Costa F MorascaJapan2025-04-29Commercial Press PROPOSAL39Ivan Magalhaes
1043James X DilliardItaly2025-04-20Rousseaux, Michael Esq RENEWAL42Anna Fali
1044Murillo K PoquetteIndia2025-04-22Rousseaux, Michael Esq QUALIFIED9Anna Fali
1045James N RimFrance2025-04-14Feltz Printing Service PROPOSAL76Amy Elsner
1046Izzy D MarrierFrance2025-04-15Printing Dimensions QUALIFIED9Asiya Javayant
1047Darci K OldroydArgentina2025-04-19Morlong Associates PROPOSAL83Onyama Limba
1048Aruna K MaletRussia2025-04-18Morlong Associates PROPOSAL66Elwin Sharvill
1049Antonio S AlbaresIndia2025-04-30Benton, John B Jr RENEWAL27Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Sinclair E RimAustraliaElwin Sharvill NEGOTIATION
Cody K InouyeRussiaBernardo Dominic NEGOTIATION
Silvio Q ButtRussiaOnyama Limba UNQUALIFIED
Claire M WhobreyUnited KingdomAnna Fali QUALIFIED
Munro W WaycottGermanyAmy Elsner QUALIFIED
Mayumi V WhobreyRussiaIvan Magalhaes RENEWAL
Kaitlin C InouyeRussiaOnyama Limba UNQUALIFIED
Greenwood J KuskoAustraliaXuxue Feng NEGOTIATION
Maria X InouyeItalyXuxue Feng QUALIFIED
Stacey L MaletItalyStephen Shaw PROPOSAL
Kadeem M ButtBrazilIvan Magalhaes QUALIFIED
Faith H PaprockiCanadaIoni Bowcher UNQUALIFIED
Francesco B DoeBrazilAsiya Javayant QUALIFIED
Kaitlin K PoquetteItalyOnyama Limba NEW
Sinclair T PaprockiItalyAmy Elsner PROPOSAL
Aditya X FlosiUnited KingdomOnyama Limba UNQUALIFIED
Costa I StensethAustraliaStephen Shaw QUALIFIED
Cody U FigeroaIndiaElwin Sharvill NEGOTIATION
Claire Z NickaArgentinaElwin Sharvill QUALIFIED
Nicolas L FerenczJapanAsiya Javayant UNQUALIFIED
Francesco Q VocelkaAustraliaXuxue Feng RENEWAL
Costa I WhobreyIndiaAnna Fali PROPOSAL
Isabel W NickaBrazilElwin Sharvill PROPOSAL
Jennifer F PerinBrazilBernardo Dominic UNQUALIFIED
Aika L SaylorsAustraliaIoni Bowcher NEGOTIATION
Aruna B FlosiArgentinaOnyama Limba PROPOSAL
Tony H WaycottRussiaIoni Bowcher UNQUALIFIED
Wickens C ChuiFranceOnyama Limba PROPOSAL
Ricardo K PoquetteAustraliaAsiya Javayant UNQUALIFIED
Munro Z SaylorsSpainOnyama Limba NEW
Chavez M MorascaBrazilElwin Sharvill PROPOSAL
Tony Q GillianIndiaAmy Elsner RENEWAL
Mujtaba E RutaSpainAnna Fali UNQUALIFIED
Maisha G StensethCanadaAnna Fali NEW
Munro J RulapaughArgentinaBernardo Dominic PROPOSAL
Antonio V KuskoSpainIoni Bowcher PROPOSAL
Maria O SergiRussiaOnyama Limba RENEWAL
Izzy L FlosiCanadaXuxue Feng UNQUALIFIED
Stacey B StensethAustraliaStephen Shaw NEW
Aruna Y StensethCanadaElwin Sharvill NEGOTIATION
Sinclair R VocelkaBrazilAmy Elsner UNQUALIFIED
David C FigeroaSpainXuxue Feng UNQUALIFIED
Leja Z FlosiGermanyAmy Elsner UNQUALIFIED
Claire N BriddickAustraliaXuxue Feng NEGOTIATION
Wickens B PoquetteRussiaAsiya Javayant NEGOTIATION
Leon V GarufiJapanBernardo Dominic RENEWAL
Aika P WieserAustraliaElwin Sharvill UNQUALIFIED
Cody V SaylorsIndiaIoni Bowcher UNQUALIFIED
Wickens I PerinFranceAmy Elsner RENEWAL
Ashley C CampainUnited KingdomAsiya Javayant PROPOSAL
Frozen Columns
Name
Claire S Inouye
Nicolas D Wieser
Jeanfrancois J Malet
Aika Q Bolognia
Ivar B Amigon
Aditya T Rulapaugh
Ricardo C Bowley
Stacey X Flosi
Emily G Darakjy
Izzy S Oldroyd
Leon T Schemmer
Nicolas U Doe
Jefferson M Morasca
Misaki I Bowley
Greenwood K Slusarski
Faith Y Kusko
Wickens K Perin
Murillo R Rim
Silvio A Tollner
Costa W Tollner
Faith V Royster
Misaki E Figeroa
Jones Q Morasca
Cody F Briddick
Darci N Whobrey
Smith M Tollner
Faith M Rulapaugh
Emily X Venere
Silvio X Ostrosky
Darci H Royster
Arvin N Marrier
Faith V Figeroa
Adams Z Gillian
Aditya T Marrier
Arvin Z Tollner
Jones O Nicka
Julie D Schemmer
Faith K Poquette
Misaki Y Albares
Ivar R Campain
Claire Q Briddick
Julie A Glick
Ricardo U Wieser
Kadeem L Ruta
Jones Y Vocelka
Tony B Ruta
Claire E Doe
Faith I Marrier
Leon Q Shinko
Misaki Z Gaucho
IdCountryDate
1000Brazil2025-04-28
1001Germany2025-04-19
1002Brazil2025-05-02
1003Germany2025-04-27
1004India2025-05-02
1005Canada2025-04-19
1006Argentina2025-04-16
1007Germany2025-04-18
1008Spain2025-04-15
1009Brazil2025-04-18
1010Canada2025-04-10
1011Russia2025-04-26
1012Canada2025-04-20
1013Italy2025-04-22
1014France2025-04-27
1015Spain2025-04-27
1016Italy2025-04-21
1017Germany2025-04-19
1018Japan2025-04-19
1019Italy2025-05-03
1020Germany2025-05-03
1021Argentina2025-04-15
1022Argentina2025-04-28
1023Germany2025-04-13
1024Spain2025-05-08
1025Russia2025-04-25
1026Japan2025-04-14
1027Canada2025-04-13
1028United Kingdom2025-04-13
1029United Kingdom2025-04-21
1030Brazil2025-04-14
1031United Kingdom2025-05-03
1032France2025-04-22
1033India2025-04-13
1034Brazil2025-04-26
1035France2025-04-22
1036Canada2025-04-26
1037United Kingdom2025-05-01
1038Japan2025-04-13
1039Russia2025-04-16
1040United Kingdom2025-04-12
1041Spain2025-05-05
1042United Kingdom2025-04-28
1043Spain2025-04-13
1044Japan2025-05-02
1045Spain2025-04-30
1046France2025-04-16
1047Russia2025-04-14
1048Italy2025-04-26
1049Canada2025-04-09

On-Demand Data

NameIdCountryDate
Nicolas R Rim1000Germany2025-04-26
Francesco N Marrier1001France2025-04-25
Antonio E Royster1002United Kingdom2025-04-25
Costa T Oldroyd1003Argentina2025-04-26
Nicolas X Iturbide1004Brazil2025-04-29
Isabel J Doe1005Spain2025-05-05
Mujtaba E Darakjy1006Brazil2025-04-21
Chavez E Stenseth1007Spain2025-04-24
Cody A Marrier1008Germany2025-04-30
Chavez L Waycott1009Brazil2025-04-12
Morrow L Royster1010Brazil2025-04-25
Ivar G Ruta1011Argentina2025-04-10
Claire U Caudy1012Argentina2025-04-19
Ricardo P Shinko1013Australia2025-04-21
Tony P Nicka1014Germany2025-05-03
Emily D Figeroa1015Argentina2025-04-16
Aditya R Iturbide1016United Kingdom2025-04-19
Kaitlin H Dilliard1017Japan2025-04-27
Nicolas K Schemmer1018Brazil2025-05-04
Jennifer I Shinko1019France2025-04-19
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Maria K GillianJapanBernardo Dominic NEGOTIATION
Kaitlin R DarakjyUnited KingdomAsiya Javayant NEGOTIATION
Jeanfrancois T BriddickArgentinaAmy Elsner NEGOTIATION
Aika G RimFranceElwin Sharvill NEGOTIATION
Kadeem I BowleyGermanyAsiya Javayant QUALIFIED
Francesco R CaudyArgentinaAmy Elsner PROPOSAL
Arvin M SaylorsIndiaStephen Shaw NEW
Salvatore T SaylorsIndiaStephen Shaw NEW
Kadeem K KolmetzIndiaBernardo Dominic UNQUALIFIED
Kaitlin R GlickAustraliaIoni Bowcher UNQUALIFIED
Misaki G StensethFranceOnyama Limba RENEWAL
Maisha L NestleGermanyAmy Elsner NEW
David I VocelkaAustraliaAsiya Javayant QUALIFIED
Nicolas F FerenczAustraliaIvan Magalhaes NEW
Ashley E ChuiCanadaAsiya Javayant QUALIFIED
Rodrigues U RimItalyStephen Shaw QUALIFIED
Cody A MaletCanadaAmy Elsner RENEWAL
James G RimAustraliaIoni Bowcher NEGOTIATION
Greenwood Q OldroydFranceBernardo Dominic QUALIFIED
Chavez L KolmetzIndiaStephen Shaw QUALIFIED
Maria Y StockhamCanadaOnyama Limba RENEWAL
Maria T BowleyItalyIoni Bowcher PROPOSAL
Nicolas Q FollerFranceAnna Fali RENEWAL
Alejandro V StockhamArgentinaIvan Magalhaes PROPOSAL
Faith Q NestleSpainAsiya Javayant RENEWAL
Stacey Y VenereGermanyIoni Bowcher NEW
Maria N WaycottAustraliaStephen Shaw QUALIFIED
Arvin J ShinkoIndiaAmy Elsner NEGOTIATION
Jeanfrancois W GauchoRussiaIoni Bowcher RENEWAL
Silvio I PoquetteCanadaIoni Bowcher NEGOTIATION
Munro P GillianArgentinaAsiya Javayant NEW
Arvin D RimRussiaAmy Elsner NEW
Julie D KuskoBrazilAnna Fali UNQUALIFIED
Ashley M AmigonArgentinaIoni Bowcher NEGOTIATION
Stacey W KuskoAustraliaIvan Magalhaes PROPOSAL
Julie L SlusarskiFranceIvan Magalhaes RENEWAL
Emily D MacleadUnited KingdomOnyama Limba UNQUALIFIED
Greenwood P MacleadBrazilElwin Sharvill UNQUALIFIED
Murillo T GillianFranceIoni Bowcher UNQUALIFIED
Jones K NestleIndiaAnna Fali PROPOSAL

<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>