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
Rodrigues T ChuiGermanyIvan Magalhaes RENEWAL
Stacey F StockhamCanadaElwin Sharvill PROPOSAL
Clifford S IturbideArgentinaIoni Bowcher NEW
Ashley R VenereBrazilStephen Shaw NEW
Leja T CaldareraGermanyAmy Elsner RENEWAL
Munro T MorascaBrazilXuxue Feng PROPOSAL
Adams R FigeroaJapanElwin Sharvill PROPOSAL
Greenwood D KuskoFranceXuxue Feng NEGOTIATION
Kadeem L DilliardCanadaIoni Bowcher UNQUALIFIED
Deepesh L GillianIndiaAsiya Javayant NEGOTIATION
Leja S WaycottCanadaOnyama Limba QUALIFIED
Munro C StensethUnited KingdomXuxue Feng UNQUALIFIED
Johnson J MacleadIndiaStephen Shaw PROPOSAL
Ashley F FlosiBrazilAsiya Javayant NEGOTIATION
Sinclair F DoeBrazilAsiya Javayant NEGOTIATION
Murillo Z StockhamBrazilAnna Fali QUALIFIED
Darci K OstroskyJapanXuxue Feng UNQUALIFIED
James W ShinkoArgentinaXuxue Feng NEW
Jones Z SergiJapanOnyama Limba RENEWAL
Munro X RulapaughBrazilBernardo Dominic RENEWAL
Chavez F MacleadArgentinaIvan Magalhaes UNQUALIFIED
Izzy C ButtItalyIvan Magalhaes PROPOSAL
Jefferson X DoeAustraliaIoni Bowcher UNQUALIFIED
Aika E IturbideCanadaIvan Magalhaes RENEWAL
Munro F SergiItalyXuxue Feng UNQUALIFIED
Chavez N AmigonUnited KingdomStephen Shaw QUALIFIED
Octavia T MorascaFranceIvan Magalhaes PROPOSAL
Izzy Z SergiSpainAsiya Javayant QUALIFIED
Arvin Q PerinRussiaXuxue Feng PROPOSAL
Julie J KuskoArgentinaElwin Sharvill PROPOSAL
Jeanfrancois K RulapaughFranceIoni Bowcher NEGOTIATION
Kaitlin P StockhamAustraliaStephen Shaw PROPOSAL
Mayumi J TollnerJapanXuxue Feng RENEWAL
Sinclair B KuskoItalyOnyama Limba NEGOTIATION
Misaki B CaldareraIndiaXuxue Feng NEGOTIATION
Aruna T DilliardFranceXuxue Feng RENEWAL
Faith O FollerAustraliaIvan Magalhaes RENEWAL
Aditya R OstroskyArgentinaAsiya Javayant NEGOTIATION
Cody H PerinGermanyXuxue Feng QUALIFIED
Murillo J InouyeBrazilElwin Sharvill UNQUALIFIED
Clifford M StockhamBrazilOnyama Limba NEW
Jefferson Y BowleyJapanBernardo Dominic UNQUALIFIED
Antonio K GlickIndiaStephen Shaw PROPOSAL
David Y GauchoGermanyAmy Elsner UNQUALIFIED
Rodrigues D CampainSpainOnyama Limba NEW
Maria N DarakjyAustraliaAsiya Javayant PROPOSAL
Stacey S GarufiAustraliaOnyama Limba UNQUALIFIED
Mayumi P GillianJapanBernardo Dominic NEW
Sinclair H MaletArgentinaBernardo Dominic PROPOSAL
Mujtaba T NickaAustraliaElwin Sharvill UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Clifford V IturbideIndiaIvan Magalhaes NEGOTIATION
Smith L PaprockiArgentinaBernardo Dominic QUALIFIED
Wickens N OstroskyFranceIoni Bowcher NEGOTIATION
Darci T IturbideJapanOnyama Limba RENEWAL
Nicolas K RimFranceStephen Shaw RENEWAL
Emily I PerinAustraliaAnna Fali QUALIFIED
Johnson W SaylorsAustraliaAmy Elsner RENEWAL
Munro X SchemmerAustraliaIoni Bowcher NEW
Wickens D FlosiJapanIoni Bowcher NEW
Salvatore F FlosiCanadaOnyama Limba PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Emily D FollerIndia2024-10-20Rousseaux, Michael Esq NEGOTIATION33Bernardo Dominic
1001Arvin T PaprockiSpain2024-10-23Feltz Printing Service PROPOSAL43Xuxue Feng
1002Sinclair C CaldareraFrance2024-10-08Feltz Printing Service NEGOTIATION63Onyama Limba
1003Rodrigues D FigeroaItaly2024-10-10King, Christopher A Esq RENEWAL36Xuxue Feng
1004Isabel J FollerIndia2024-10-30Chapman, Ross E Esq NEGOTIATION94Anna Fali
1005Antonio G CampainFrance2024-10-04Buckley Miller Wright NEW94Onyama Limba
1006Stacey S FigeroaBrazil2024-10-12Dorl, James J Esq NEW53Anna Fali
1007Rodrigues G PerinCanada2024-10-13Chemel, James L Cpa PROPOSAL24Xuxue Feng
1008Antonio Y KolmetzAustralia2024-10-09King, Christopher A Esq NEGOTIATION45Stephen Shaw
1009Johnson N MaletFrance2024-10-21Chanay, Jeffrey A Esq NEW18Xuxue Feng
1010Kadeem T FlosiAustralia2024-10-22Benton, John B Jr QUALIFIED89Onyama Limba
1011Izzy L VocelkaUnited Kingdom2024-10-25Benton, John B Jr PROPOSAL28Anna Fali
1012Jennifer O BologniaAustralia2024-10-13Commercial Press QUALIFIED60Anna Fali
1013Rodrigues L WieserAustralia2024-10-22Chanay, Jeffrey A Esq PROPOSAL41Ioni Bowcher
1014Wickens W MacleadJapan2024-10-08Feiner Bros QUALIFIED52Elwin Sharvill
1015Cody V DarakjyArgentina2024-10-19Rousseaux, Michael Esq NEGOTIATION42Anna Fali
1016Emily E CaudyRussia2024-10-03Buckley Miller Wright NEW38Stephen Shaw
1017Antonio E ChuiUnited Kingdom2024-10-15Feiner Bros UNQUALIFIED62Stephen Shaw
1018Johnson U FollerFrance2024-10-23Chanay, Jeffrey A Esq RENEWAL21Ioni Bowcher
1019Jennifer Z PoquetteItaly2024-10-22Rangoni Of Florence NEGOTIATION98Anna Fali
1020Alejandro Y CampainBrazil2024-10-04Chapman, Ross E Esq PROPOSAL79Asiya Javayant
1021Mayumi O KolmetzSpain2024-10-27Feltz Printing Service NEGOTIATION60Ioni Bowcher
1022Jeanfrancois R GarufiUnited Kingdom2024-10-10Feiner Bros QUALIFIED51Stephen Shaw
1023Juan A CampainUnited Kingdom2024-10-10Chemel, James L Cpa UNQUALIFIED75Elwin Sharvill
1024Jennifer L CaudyAustralia2024-10-18Buckley Miller Wright NEW36Onyama Limba
1025Darci P AlbaresRussia2024-10-23Chemel, James L Cpa RENEWAL28Onyama Limba
1026Faith S DilliardRussia2024-10-07Feiner Bros NEGOTIATION64Asiya Javayant
1027Kadeem R ChuiUnited Kingdom2024-10-07Feltz Printing Service PROPOSAL24Ivan Magalhaes
1028Silvio Z SlusarskiJapan2024-10-30Truhlar And Truhlar Attys UNQUALIFIED88Asiya Javayant
1029David K SlusarskiGermany2024-10-06Buckley Miller Wright PROPOSAL54Anna Fali
1030Kaitlin S BriddickCanada2024-10-06Buckley Miller Wright QUALIFIED87Ivan Magalhaes
1031Kadeem O IturbideAustralia2024-10-29King, Christopher A Esq UNQUALIFIED65Stephen Shaw
1032Francesco P SaylorsItaly2024-10-03Buckley Miller Wright NEGOTIATION28Stephen Shaw
1033Antonio X VocelkaCanada2024-10-14Feiner Bros NEW41Stephen Shaw
1034Kadeem W MorascaItaly2024-10-03Morlong Associates NEW98Elwin Sharvill
1035Nicolas I PaprockiFrance2024-10-19Buckley Miller Wright PROPOSAL17Amy Elsner
1036James R PoquetteGermany2024-10-26Chapman, Ross E Esq UNQUALIFIED91Bernardo Dominic
1037Izzy Z CampainBrazil2024-10-31Buckley Miller Wright RENEWAL89Ivan Magalhaes
1038Izzy B GarufiFrance2024-10-20Chemel, James L Cpa QUALIFIED47Asiya Javayant
1039Leja W GarufiItaly2024-10-11Buckley Miller Wright QUALIFIED46Onyama Limba
1040Salvatore A NickaJapan2024-10-12Rangoni Of Florence NEW72Stephen Shaw
1041Ivar U MacleadFrance2024-10-30Chanay, Jeffrey A Esq PROPOSAL22Bernardo Dominic
1042Salvatore P GillianCanada2024-10-25Buckley Miller Wright RENEWAL93Elwin Sharvill
1043Maisha I NickaIndia2024-10-14Chapman, Ross E Esq UNQUALIFIED49Onyama Limba
1044Aika P BriddickItaly2024-10-21Rousseaux, Michael Esq UNQUALIFIED49Asiya Javayant
1045Ashley A BologniaCanada2024-10-02King, Christopher A Esq RENEWAL37Amy Elsner
1046Arvin E CaudyAustralia2024-10-03Chanay, Jeffrey A Esq NEGOTIATION89Ivan Magalhaes
1047Isabel G PoquetteJapan2024-10-27Printing Dimensions QUALIFIED42Onyama Limba
1048Aditya W AlbaresBrazil2024-10-11Chanay, Jeffrey A Esq UNQUALIFIED19Onyama Limba
1049Adams I MacleadAustralia2024-10-02Chapman, Ross E Esq NEW54Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Emily U WhobreyAustraliaAmy Elsner QUALIFIED
Antonio C DarakjyAustraliaStephen Shaw PROPOSAL
Costa G RutaCanadaIvan Magalhaes UNQUALIFIED
Sinclair Y ChuiIndiaOnyama Limba NEW
James N GlickGermanyBernardo Dominic PROPOSAL
Jennifer J OstroskyCanadaStephen Shaw NEGOTIATION
Emily Q InouyeSpainIoni Bowcher PROPOSAL
Maria A AlbaresFranceAnna Fali QUALIFIED
Munro P PaprockiArgentinaElwin Sharvill RENEWAL
Darci P ButtFranceAnna Fali PROPOSAL
Leon A GlickRussiaAsiya Javayant UNQUALIFIED
Mayumi I PerinJapanAmy Elsner UNQUALIFIED
Cody I OldroydGermanyAmy Elsner QUALIFIED
Greenwood H DoeGermanyElwin Sharvill UNQUALIFIED
Nicolas I ChuiBrazilAsiya Javayant RENEWAL
Misaki Y MorascaJapanStephen Shaw RENEWAL
Jones H BologniaIndiaStephen Shaw RENEWAL
Jefferson E AlbaresItalyIoni Bowcher RENEWAL
Maria X NestleUnited KingdomXuxue Feng UNQUALIFIED
Emily N SaylorsAustraliaStephen Shaw QUALIFIED
Jefferson I MorascaIndiaAsiya Javayant RENEWAL
Ricardo S WhobreyArgentinaOnyama Limba QUALIFIED
Aika Z StockhamAustraliaIoni Bowcher NEW
Costa Q CaldareraIndiaIoni Bowcher UNQUALIFIED
Ivar Z StensethUnited KingdomStephen Shaw RENEWAL
Leon Y CaudyAustraliaElwin Sharvill RENEWAL
Stacey L WieserItalyAnna Fali NEW
Adams Y RulapaughFranceXuxue Feng RENEWAL
Octavia A GillianBrazilElwin Sharvill UNQUALIFIED
Octavia T PerinJapanAnna Fali QUALIFIED
Nicolas M MaletSpainAsiya Javayant PROPOSAL
Morrow S SaylorsItalyBernardo Dominic NEGOTIATION
Smith C MaletItalyBernardo Dominic QUALIFIED
Jones N CaldareraFranceIoni Bowcher UNQUALIFIED
Leon T MaletGermanyIvan Magalhaes NEW
Costa F FigeroaIndiaElwin Sharvill RENEWAL
Emily W AmigonIndiaOnyama Limba RENEWAL
Maisha Q DilliardSpainOnyama Limba NEW
James W ShinkoSpainAnna Fali UNQUALIFIED
Munro U PaprockiAustraliaIoni Bowcher NEGOTIATION
Munro F FollerBrazilIoni Bowcher RENEWAL
Greenwood Z DoeSpainIvan Magalhaes QUALIFIED
Clifford P RutaArgentinaElwin Sharvill PROPOSAL
Izzy N FerenczFranceOnyama Limba UNQUALIFIED
Ivar U MarrierUnited KingdomElwin Sharvill QUALIFIED
Jefferson O VocelkaGermanyStephen Shaw UNQUALIFIED
Tony K OstroskyJapanBernardo Dominic QUALIFIED
Octavia Z NestleGermanyStephen Shaw UNQUALIFIED
Greenwood C AlbaresBrazilAsiya Javayant QUALIFIED
Adams B CaldareraRussiaBernardo Dominic NEGOTIATION
Frozen Columns
Name
Maria C Stockham
Jones P Inouye
Alejandro H Wieser
Tony N Whobrey
Aruna B Maclead
Smith M Tollner
Costa G Perin
Rodrigues S Wieser
Arvin Q Figeroa
Clifford Z Perin
Jefferson Y Slusarski
Jones O Slusarski
Claire F Amigon
Izzy E Briddick
Costa Z Royster
Rodrigues X Vocelka
Aruna Z Darakjy
Kaitlin F Bowley
Sinclair Z Stockham
Greenwood C Iturbide
Johnson W Bolognia
Smith E Sergi
Jennifer K Glick
Aruna P Schemmer
Izzy G Albares
Nicolas D Nestle
Aditya W Nestle
Salvatore R Gillian
Munro T Bolognia
Deepesh U Campain
Costa T Albares
Silvio M Flosi
Maisha N Whobrey
Juan F Garufi
Smith Q Morasca
Murillo R Bowley
Aditya D Iturbide
Wickens I Garufi
Aditya P Garufi
Clifford T Tollner
Rodrigues P Butt
Stacey A Bowley
Ricardo U Tollner
Kaitlin N Vocelka
Emily F Wieser
Johnson D Garufi
Arvin E Darakjy
Jeanfrancois G Ostrosky
Wickens K Rulapaugh
Adams A Schemmer
IdCountryDate
1000India2024-10-11
1001Australia2024-10-16
1002Spain2024-10-03
1003Russia2024-10-03
1004Japan2024-10-17
1005Japan2024-10-31
1006Argentina2024-10-02
1007Argentina2024-10-31
1008Spain2024-10-27
1009Argentina2024-10-22
1010Spain2024-10-05
1011Japan2024-10-20
1012Brazil2024-10-25
1013Italy2024-10-19
1014Italy2024-10-28
1015United Kingdom2024-10-26
1016Japan2024-10-02
1017Argentina2024-10-14
1018Australia2024-10-28
1019France2024-10-06
1020India2024-10-15
1021India2024-10-27
1022Germany2024-10-22
1023Russia2024-10-25
1024Russia2024-10-29
1025Japan2024-10-14
1026Spain2024-10-28
1027Argentina2024-10-25
1028Australia2024-10-17
1029Spain2024-10-15
1030Germany2024-10-24
1031Canada2024-10-25
1032Canada2024-10-03
1033India2024-10-09
1034India2024-10-30
1035Japan2024-10-14
1036Canada2024-10-18
1037Japan2024-10-07
1038United Kingdom2024-10-08
1039Australia2024-10-03
1040Italy2024-10-07
1041Japan2024-10-22
1042United Kingdom2024-10-09
1043India2024-10-10
1044Spain2024-10-05
1045France2024-10-30
1046United Kingdom2024-10-18
1047Italy2024-10-19
1048Russia2024-10-08
1049Italy2024-10-15

On-Demand Data

NameIdCountryDate
Wickens L Figeroa1000Germany2024-10-21
Costa N Foller1001Australia2024-10-23
Maisha B Kusko1002Japan2024-10-12
Sinclair K Saylors1003United Kingdom2024-10-25
Rodrigues F Ostrosky1004Russia2024-10-03
Francesco K Gillian1005Italy2024-10-15
Adams S Malet1006Russia2024-10-06
Maisha L Whobrey1007France2024-10-08
Arvin X Dilliard1008France2024-10-31
Isabel V Briddick1009Germany2024-10-12
Tony X Albares1010United Kingdom2024-10-30
Silvio X Doe1011Canada2024-10-08
Juan T Doe1012India2024-10-25
Wickens T Marrier1013Italy2024-10-07
Nicolas O Oldroyd1014Japan2024-10-13
Aditya X Iturbide1015France2024-10-06
Izzy D Stockham1016Russia2024-10-23
Silvio K Oldroyd1017Germany2024-10-08
Nicolas X Foller1018Spain2024-10-15
Jefferson R Nestle1019Canada2024-10-11
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Chavez T RoysterItalyElwin Sharvill PROPOSAL
Leon B MaletBrazilAnna Fali RENEWAL
Munro E GillianGermanyOnyama Limba UNQUALIFIED
Munro U FlosiUnited KingdomAsiya Javayant NEGOTIATION
Jennifer C DarakjyCanadaAsiya Javayant PROPOSAL
Cody Y PerinArgentinaStephen Shaw PROPOSAL
Smith N NickaSpainAsiya Javayant RENEWAL
Izzy Q KolmetzIndiaOnyama Limba NEW
Antonio Z ShinkoCanadaXuxue Feng NEGOTIATION
Chavez S DilliardUnited KingdomAsiya Javayant NEW
Izzy J SlusarskiCanadaIoni Bowcher RENEWAL
David Y RimRussiaXuxue Feng PROPOSAL
Silvio N ButtBrazilXuxue Feng PROPOSAL
Ricardo B GillianItalyOnyama Limba NEW
Chavez O CampainItalyAsiya Javayant RENEWAL
Maria K FlosiAustraliaStephen Shaw PROPOSAL
Ivar O ShinkoArgentinaIvan Magalhaes QUALIFIED
Smith Q VenereGermanyOnyama Limba UNQUALIFIED
Munro E IturbideJapanXuxue Feng NEW
Francesco L PaprockiJapanStephen Shaw NEW
Darci W SaylorsSpainIvan Magalhaes PROPOSAL
Antonio Q InouyeGermanyElwin Sharvill QUALIFIED
Mujtaba M FlosiJapanElwin Sharvill NEW
Emily J NickaCanadaIvan Magalhaes QUALIFIED
Aruna J BowleyBrazilXuxue Feng RENEWAL
Morrow O PerinIndiaIoni Bowcher RENEWAL
Jones Z FlosiJapanAmy Elsner PROPOSAL
Ricardo N WaycottUnited KingdomAmy Elsner PROPOSAL
Octavia G AmigonAustraliaAmy Elsner PROPOSAL
Aika F VenereJapanXuxue Feng NEGOTIATION
Jefferson K AlbaresArgentinaBernardo Dominic UNQUALIFIED
Antonio A FollerIndiaIvan Magalhaes QUALIFIED
Jefferson H BologniaBrazilAmy Elsner NEW
James C GauchoItalyBernardo Dominic NEW
James L VenereGermanyIoni Bowcher PROPOSAL
Antonio D InouyeRussiaBernardo Dominic PROPOSAL
Aruna D NestleCanadaAnna Fali QUALIFIED
Jefferson N GauchoCanadaAsiya Javayant QUALIFIED
Maisha L VenereRussiaStephen Shaw UNQUALIFIED
Jefferson L FollerCanadaAsiya Javayant 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>