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
Maria A NestleFranceElwin Sharvill QUALIFIED
Greenwood U ChuiFranceOnyama Limba PROPOSAL
Juan Z NickaIndiaStephen Shaw NEW
Emily G FerenczCanadaOnyama Limba RENEWAL
Murillo J CaudyAustraliaStephen Shaw NEGOTIATION
Izzy L PoquetteCanadaIoni Bowcher UNQUALIFIED
Jennifer R WaycottCanadaStephen Shaw UNQUALIFIED
Faith U PaprockiArgentinaStephen Shaw RENEWAL
Julie D ShinkoFranceOnyama Limba NEW
Maisha Q ShinkoUnited KingdomIoni Bowcher RENEWAL
Stacey W AlbaresSpainIvan Magalhaes UNQUALIFIED
Faith Z GillianUnited KingdomBernardo Dominic UNQUALIFIED
Cody K AmigonItalyOnyama Limba NEW
Izzy O GillianCanadaIoni Bowcher QUALIFIED
Greenwood U SaylorsArgentinaAmy Elsner QUALIFIED
Faith O MaletRussiaIvan Magalhaes RENEWAL
Jefferson H FlosiGermanyAnna Fali NEW
Francesco F PerinArgentinaAmy Elsner QUALIFIED
Smith Z DoeAustraliaAsiya Javayant PROPOSAL
Clifford R SaylorsUnited KingdomOnyama Limba NEW
Mayumi N CampainArgentinaOnyama Limba PROPOSAL
Juan M AlbaresFranceIvan Magalhaes QUALIFIED
Stacey L WaycottSpainStephen Shaw QUALIFIED
David Q PerinJapanStephen Shaw PROPOSAL
Faith I FollerCanadaElwin Sharvill NEW
Antonio M GlickGermanyAsiya Javayant UNQUALIFIED
Jeanfrancois S WieserIndiaOnyama Limba PROPOSAL
Darci B BriddickItalyAmy Elsner RENEWAL
Clifford Z AmigonGermanyAsiya Javayant RENEWAL
Murillo S MarrierSpainIvan Magalhaes RENEWAL
Kaitlin X MaletAustraliaIoni Bowcher RENEWAL
Nicolas T FigeroaRussiaIoni Bowcher QUALIFIED
Kadeem A BologniaAustraliaElwin Sharvill UNQUALIFIED
Chavez N ButtBrazilBernardo Dominic NEGOTIATION
Octavia H CaudyFranceIoni Bowcher NEGOTIATION
Jones N ButtBrazilAnna Fali NEW
Alejandro A OldroydFranceIvan Magalhaes NEGOTIATION
Jones O PoquetteArgentinaIvan Magalhaes NEW
Chavez L BologniaArgentinaOnyama Limba UNQUALIFIED
Wickens Z ChuiSpainStephen Shaw NEW
Silvio H GlickAustraliaIoni Bowcher PROPOSAL
Ashley P RoysterCanadaAsiya Javayant NEW
Jones J MacleadGermanyAmy Elsner NEW
Leja F InouyeGermanyBernardo Dominic UNQUALIFIED
Jeanfrancois A OstroskyCanadaStephen Shaw RENEWAL
Aditya Q SchemmerAustraliaAnna Fali QUALIFIED
Murillo F MarrierAustraliaAmy Elsner NEW
Antonio D MacleadRussiaIvan Magalhaes RENEWAL
Kaitlin E GlickAustraliaAmy Elsner NEW
James A WaycottSpainAsiya Javayant RENEWAL
Horizontal
NameCountryRepresentativeStatus
Greenwood T MorascaFranceAnna Fali PROPOSAL
Smith A RutaAustraliaBernardo Dominic UNQUALIFIED
Ivar H BowleyAustraliaAnna Fali PROPOSAL
Juan U AmigonBrazilAnna Fali NEGOTIATION
Octavia A WhobreyFranceAmy Elsner NEGOTIATION
Morrow V OldroydSpainIoni Bowcher QUALIFIED
Kadeem Y GauchoGermanyAnna Fali PROPOSAL
Jones J WieserUnited KingdomBernardo Dominic QUALIFIED
Jennifer V CampainArgentinaAsiya Javayant UNQUALIFIED
Silvio A SlusarskiArgentinaAmy Elsner UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Leon D AlbaresAustralia2025-05-04Feiner Bros PROPOSAL65Asiya Javayant
1001Jennifer B PaprockiGermany2025-04-16Printing Dimensions UNQUALIFIED25Asiya Javayant
1002Deepesh G AlbaresCanada2025-05-08Chemel, James L Cpa NEW76Anna Fali
1003Sinclair T GillianArgentina2025-04-16Commercial Press QUALIFIED98Asiya Javayant
1004Maisha O DarakjyAustralia2025-04-17Chanay, Jeffrey A Esq NEGOTIATION75Stephen Shaw
1005Murillo J WhobreyUnited Kingdom2025-04-26Chanay, Jeffrey A Esq PROPOSAL13Asiya Javayant
1006Greenwood X PoquetteUnited Kingdom2025-05-08Feiner Bros PROPOSAL76Anna Fali
1007Isabel J KolmetzJapan2025-04-29Dorl, James J Esq PROPOSAL58Asiya Javayant
1008Aditya E FollerIndia2025-04-17Buckley Miller Wright NEGOTIATION14Onyama Limba
1009Arvin R SergiIndia2025-04-23King, Christopher A Esq UNQUALIFIED99Ivan Magalhaes
1010Clifford C ShinkoFrance2025-04-18Commercial Press NEW42Elwin Sharvill
1011Ashley P CaldareraBrazil2025-04-15Chanay, Jeffrey A Esq PROPOSAL54Elwin Sharvill
1012Silvio N DarakjyArgentina2025-04-24Feiner Bros PROPOSAL80Asiya Javayant
1013Maria M CaldareraItaly2025-04-19Chapman, Ross E Esq UNQUALIFIED61Onyama Limba
1014Leja K BologniaArgentina2025-05-11Dorl, James J Esq NEGOTIATION63Stephen Shaw
1015Aruna A FollerBrazil2025-04-29Feltz Printing Service RENEWAL85Ivan Magalhaes
1016Chavez E OldroydArgentina2025-05-10Rousseaux, Michael Esq NEW15Stephen Shaw
1017Izzy W MorascaFrance2025-04-26Dorl, James J Esq QUALIFIED50Onyama Limba
1018Aika F KuskoArgentina2025-05-09Commercial Press NEW30Anna Fali
1019Silvio N InouyeIndia2025-04-24Chapman, Ross E Esq UNQUALIFIED70Stephen Shaw
1020Sinclair G CaldareraBrazil2025-05-10Chanay, Jeffrey A Esq NEGOTIATION74Stephen Shaw
1021Clifford F DarakjyUnited Kingdom2025-04-23Chapman, Ross E Esq NEW79Asiya Javayant
1022Stacey S FerenczFrance2025-05-11Chanay, Jeffrey A Esq NEW37Onyama Limba
1023Aruna N OldroydGermany2025-05-08Rangoni Of Florence RENEWAL47Ivan Magalhaes
1024Ashley W WaycottBrazil2025-04-18Chapman, Ross E Esq UNQUALIFIED1Stephen Shaw
1025Costa J DoeArgentina2025-04-13Dorl, James J Esq NEGOTIATION9Bernardo Dominic
1026Ricardo E FollerArgentina2025-05-05Feltz Printing Service UNQUALIFIED53Amy Elsner
1027Salvatore P CaudyItaly2025-05-10Rangoni Of Florence QUALIFIED8Ioni Bowcher
1028Maisha V StensethSpain2025-05-11Rangoni Of Florence PROPOSAL26Anna Fali
1029Leon I SlusarskiItaly2025-05-07Benton, John B Jr NEW28Ivan Magalhaes
1030Ashley X MorascaBrazil2025-04-21Commercial Press NEW52Ioni Bowcher
1031Francesco E WhobreyJapan2025-05-10Printing Dimensions RENEWAL43Amy Elsner
1032Antonio Q RoysterIndia2025-04-14Feiner Bros UNQUALIFIED24Ivan Magalhaes
1033Adams M ShinkoBrazil2025-05-05Chapman, Ross E Esq PROPOSAL56Ioni Bowcher
1034Mujtaba N DoeCanada2025-04-21Buckley Miller Wright PROPOSAL69Amy Elsner
1035Rodrigues O VenereItaly2025-04-30Benton, John B Jr NEW27Xuxue Feng
1036Darci J MarrierGermany2025-04-22Benton, John B Jr QUALIFIED83Ioni Bowcher
1037Mujtaba N AlbaresJapan2025-04-28Chapman, Ross E Esq RENEWAL54Asiya Javayant
1038Darci E WhobreyGermany2025-04-26Feltz Printing Service UNQUALIFIED23Xuxue Feng
1039Morrow X MaletIndia2025-05-05Chemel, James L Cpa UNQUALIFIED62Ioni Bowcher
1040Leja V AmigonArgentina2025-04-21Printing Dimensions NEGOTIATION72Ivan Magalhaes
1041Johnson J SergiAustralia2025-04-14Feiner Bros RENEWAL27Ioni Bowcher
1042Izzy R NickaItaly2025-04-20Chemel, James L Cpa NEGOTIATION2Bernardo Dominic
1043Francesco I KuskoFrance2025-04-18Feltz Printing Service UNQUALIFIED53Stephen Shaw
1044Mayumi S WaycottCanada2025-04-20Benton, John B Jr PROPOSAL59Ioni Bowcher
1045James U RoysterSpain2025-04-13Chapman, Ross E Esq NEGOTIATION86Onyama Limba
1046Greenwood V DilliardArgentina2025-04-16Commercial Press PROPOSAL98Anna Fali
1047Isabel F RulapaughUnited Kingdom2025-04-27Printing Dimensions RENEWAL69Ioni Bowcher
1048Smith H DilliardRussia2025-05-08Printing Dimensions PROPOSAL54Asiya Javayant
1049James S BowleyArgentina2025-04-16Chemel, James L Cpa UNQUALIFIED27Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Izzy H MarrierUnited KingdomIvan Magalhaes NEGOTIATION
Isabel T VenereUnited KingdomXuxue Feng NEW
Isabel J WieserRussiaStephen Shaw NEGOTIATION
Antonio C MorascaIndiaBernardo Dominic QUALIFIED
Stacey B RoysterAustraliaStephen Shaw UNQUALIFIED
Claire M GillianGermanyIvan Magalhaes NEW
Adams S ChuiFranceBernardo Dominic NEGOTIATION
Misaki H MaletArgentinaAsiya Javayant NEW
Aruna G StockhamItalyStephen Shaw PROPOSAL
Faith S BriddickSpainXuxue Feng QUALIFIED
Ashley C MacleadCanadaXuxue Feng QUALIFIED
Maisha O BriddickBrazilOnyama Limba UNQUALIFIED
Morrow N CaudyAustraliaElwin Sharvill PROPOSAL
Adams Y GarufiBrazilAsiya Javayant RENEWAL
Alejandro W PaprockiJapanStephen Shaw UNQUALIFIED
Faith J VenereBrazilAmy Elsner PROPOSAL
Maria F NickaFranceElwin Sharvill QUALIFIED
Chavez K SchemmerArgentinaStephen Shaw NEW
Aruna X ChuiArgentinaOnyama Limba QUALIFIED
Deepesh K BriddickJapanBernardo Dominic RENEWAL
Aika X BologniaGermanyIvan Magalhaes PROPOSAL
Sinclair Z ButtItalyIoni Bowcher QUALIFIED
Salvatore U MarrierArgentinaBernardo Dominic PROPOSAL
Stacey H SchemmerIndiaAnna Fali UNQUALIFIED
Clifford D ChuiUnited KingdomAmy Elsner PROPOSAL
Mayumi Q KolmetzIndiaStephen Shaw NEW
Julie N WaycottArgentinaAsiya Javayant NEGOTIATION
Jefferson S NickaIndiaElwin Sharvill NEW
Antonio V InouyeItalyElwin Sharvill PROPOSAL
Maria Q FollerFranceElwin Sharvill NEW
Darci F SchemmerBrazilIvan Magalhaes PROPOSAL
Adams Z ShinkoJapanXuxue Feng NEGOTIATION
Greenwood S FerenczJapanAnna Fali PROPOSAL
Kaitlin E OstroskyAustraliaElwin Sharvill RENEWAL
Claire V MarrierArgentinaBernardo Dominic QUALIFIED
Silvio Z NickaGermanyStephen Shaw PROPOSAL
Chavez R DoeBrazilElwin Sharvill NEGOTIATION
Ricardo K GillianArgentinaIvan Magalhaes PROPOSAL
Izzy R MorascaRussiaXuxue Feng PROPOSAL
Silvio X OstroskyUnited KingdomAnna Fali UNQUALIFIED
Maria F VocelkaAustraliaStephen Shaw NEW
Jefferson M RimRussiaAmy Elsner UNQUALIFIED
Deepesh X GillianBrazilXuxue Feng RENEWAL
Isabel W BologniaIndiaStephen Shaw QUALIFIED
Cody I GarufiArgentinaIoni Bowcher NEGOTIATION
Aika R MaletGermanyBernardo Dominic UNQUALIFIED
Isabel C WieserItalyXuxue Feng QUALIFIED
Cody D FerenczUnited KingdomIvan Magalhaes PROPOSAL
Maria F CampainUnited KingdomIvan Magalhaes NEW
Jennifer V SergiCanadaAnna Fali QUALIFIED
Frozen Columns
Name
Misaki D Kolmetz
Octavia U Saylors
Stacey D Paprocki
Aditya S Inouye
Mayumi F Royster
Jeanfrancois R Bolognia
Smith Y Whobrey
Mujtaba Y Bolognia
Rodrigues F Caudy
Clifford B Kolmetz
Clifford H Nicka
Kaitlin K Stenseth
Jennifer D Malet
Adams S Maclead
Salvatore I Caldarera
Costa Y Rulapaugh
Julie L Stenseth
James S Malet
Arvin M Amigon
Morrow N Ruta
Emily D Paprocki
James N Dilliard
Rodrigues Y Rulapaugh
James F Flosi
Julie S Whobrey
Murillo Q Oldroyd
Murillo X Stockham
Murillo V Marrier
Sinclair M Ostrosky
Julie T Glick
Maisha J Kusko
Mayumi J Figeroa
Ashley O Butt
Costa T Slusarski
Jones J Poquette
Ricardo I Iturbide
Deepesh S Slusarski
Faith K Amigon
Ivar D Albares
Emily T Amigon
Maria E Malet
Salvatore C Bolognia
Murillo S Tollner
Darci H Amigon
Maisha Q Wieser
Antonio D Briddick
Ashley R Kusko
Kadeem X Stockham
Greenwood V Nicka
Greenwood I Butt
IdCountryDate
1000Canada2025-05-09
1001India2025-05-11
1002India2025-04-23
1003France2025-04-13
1004France2025-04-18
1005Australia2025-04-28
1006Japan2025-05-11
1007India2025-04-23
1008Spain2025-04-15
1009Brazil2025-04-25
1010Argentina2025-04-20
1011Canada2025-05-07
1012Argentina2025-04-19
1013Spain2025-04-20
1014United Kingdom2025-05-05
1015Australia2025-05-02
1016Canada2025-04-28
1017Russia2025-05-01
1018Japan2025-04-30
1019France2025-04-13
1020Australia2025-04-17
1021Argentina2025-05-09
1022Russia2025-05-01
1023France2025-04-18
1024Japan2025-05-05
1025Brazil2025-04-26
1026Italy2025-04-25
1027Germany2025-05-08
1028Italy2025-04-21
1029Italy2025-04-15
1030Canada2025-04-22
1031Italy2025-04-27
1032Germany2025-05-10
1033Brazil2025-04-27
1034Russia2025-04-26
1035Russia2025-04-17
1036Russia2025-05-12
1037Italy2025-05-09
1038India2025-04-30
1039Germany2025-04-17
1040Russia2025-04-26
1041Germany2025-04-30
1042Italy2025-05-02
1043Italy2025-05-09
1044Canada2025-04-19
1045India2025-04-13
1046Australia2025-04-29
1047Germany2025-04-13
1048Argentina2025-04-22
1049India2025-04-14

On-Demand Data

NameIdCountryDate
Salvatore N Vocelka1000Italy2025-04-30
Julie W Glick1001Canada2025-04-16
Kaitlin Q Wieser1002India2025-05-10
Johnson L Rulapaugh1003France2025-05-05
Smith O Bolognia1004United Kingdom2025-05-04
Isabel W Ferencz1005Argentina2025-05-11
Emily I Maclead1006Japan2025-05-12
Tony W Ferencz1007Italy2025-04-20
Francesco E Rim1008Russia2025-04-22
Maisha D Butt1009India2025-04-28
Maisha L Garufi1010Brazil2025-04-21
Emily W Glick1011Spain2025-04-30
Costa J Iturbide1012India2025-05-02
Stacey U Whobrey1013Australia2025-05-08
Deepesh X Gillian1014India2025-04-25
Silvio C Iturbide1015France2025-04-13
Leon Y Nicka1016Germany2025-04-30
Juan Z Kolmetz1017Germany2025-05-05
Smith I Dilliard1018Italy2025-04-23
Clifford M Sergi1019Argentina2025-05-10
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Murillo F GauchoJapanAsiya Javayant RENEWAL
Costa X CaldareraAustraliaAmy Elsner QUALIFIED
Faith W MarrierRussiaIvan Magalhaes QUALIFIED
Alejandro Z SlusarskiIndiaAnna Fali RENEWAL
Tony L OldroydBrazilAsiya Javayant UNQUALIFIED
Clifford P PaprockiItalyIvan Magalhaes RENEWAL
Antonio D StensethCanadaIoni Bowcher PROPOSAL
Murillo T OldroydIndiaAnna Fali NEGOTIATION
Kadeem G KolmetzJapanIvan Magalhaes UNQUALIFIED
Maisha R BriddickArgentinaBernardo Dominic QUALIFIED
Cody S RoysterIndiaAnna Fali RENEWAL
Adams V VenereAustraliaAsiya Javayant QUALIFIED
Kadeem N DilliardBrazilStephen Shaw NEGOTIATION
Jeanfrancois R CaudyFranceElwin Sharvill UNQUALIFIED
Tony R OstroskyBrazilIoni Bowcher UNQUALIFIED
Deepesh B WaycottRussiaOnyama Limba UNQUALIFIED
Darci U CaldareraItalyBernardo Dominic PROPOSAL
Clifford T IturbideBrazilXuxue Feng QUALIFIED
Faith J CaldareraRussiaAmy Elsner QUALIFIED
Jennifer C KuskoArgentinaIvan Magalhaes NEW
Silvio Z BowleyJapanStephen Shaw NEW
Rodrigues Z SchemmerGermanyAsiya Javayant PROPOSAL
Jones K PoquetteFranceAnna Fali NEGOTIATION
Jefferson Q OldroydRussiaXuxue Feng PROPOSAL
Johnson M ChuiBrazilElwin Sharvill NEW
Juan A PerinCanadaBernardo Dominic PROPOSAL
Jefferson Z VocelkaArgentinaIoni Bowcher PROPOSAL
David M VocelkaItalyStephen Shaw NEGOTIATION
Izzy W BriddickArgentinaAnna Fali PROPOSAL
Izzy A RulapaughGermanyXuxue Feng QUALIFIED
Ashley E RoysterFranceBernardo Dominic UNQUALIFIED
Tony K WieserBrazilXuxue Feng RENEWAL
Izzy C MaletBrazilIoni Bowcher NEW
Maria N CampainAustraliaXuxue Feng NEW
Silvio N DoeUnited KingdomXuxue Feng RENEWAL
Deepesh M FlosiIndiaAsiya Javayant NEGOTIATION
James N MaletCanadaIvan Magalhaes QUALIFIED
Izzy D SchemmerFranceStephen Shaw UNQUALIFIED
Silvio G SchemmerJapanBernardo Dominic UNQUALIFIED
David M StockhamBrazilIoni Bowcher 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>