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
Deepesh Q BriddickJapanAnna Fali RENEWAL
Emily A ChuiUnited KingdomAmy Elsner RENEWAL
Julie H ButtAustraliaIoni Bowcher PROPOSAL
Arvin A CaldareraItalyXuxue Feng NEW
Kaitlin I MaletBrazilStephen Shaw QUALIFIED
Julie E CampainGermanyXuxue Feng QUALIFIED
Ivar Q FollerIndiaBernardo Dominic UNQUALIFIED
Tony T RimAustraliaIvan Magalhaes QUALIFIED
Kaitlin Z SergiArgentinaStephen Shaw NEW
Mayumi R ShinkoCanadaBernardo Dominic UNQUALIFIED
Deepesh C ButtBrazilAsiya Javayant NEW
Alejandro J VenereGermanyIvan Magalhaes NEGOTIATION
Kadeem S MarrierFranceIoni Bowcher NEGOTIATION
Misaki O WieserRussiaElwin Sharvill QUALIFIED
Alejandro F OldroydArgentinaOnyama Limba UNQUALIFIED
Sinclair N BriddickAustraliaAnna Fali QUALIFIED
Izzy U AlbaresIndiaBernardo Dominic RENEWAL
Adams U GlickItalyXuxue Feng NEW
Nicolas U PerinArgentinaBernardo Dominic NEW
Deepesh A RutaCanadaIvan Magalhaes PROPOSAL
Rodrigues K RutaIndiaAmy Elsner NEW
Aditya H GauchoIndiaAmy Elsner UNQUALIFIED
Wickens H RutaJapanAmy Elsner NEW
Jeanfrancois K DoeRussiaAsiya Javayant PROPOSAL
Aditya P AlbaresJapanStephen Shaw QUALIFIED
Claire P StensethGermanyXuxue Feng UNQUALIFIED
Greenwood I ShinkoBrazilIvan Magalhaes PROPOSAL
Cody U ShinkoRussiaAnna Fali NEW
Silvio O GlickAustraliaIvan Magalhaes NEGOTIATION
Murillo M RimItalyXuxue Feng NEGOTIATION
Misaki B GillianArgentinaStephen Shaw NEGOTIATION
Kaitlin Z OstroskyCanadaOnyama Limba UNQUALIFIED
Alejandro T OldroydCanadaStephen Shaw QUALIFIED
Aika P AmigonAustraliaAnna Fali RENEWAL
Salvatore Z MarrierArgentinaBernardo Dominic QUALIFIED
Wickens H TollnerJapanAnna Fali UNQUALIFIED
Julie V GauchoJapanBernardo Dominic NEGOTIATION
Leon O InouyeBrazilStephen Shaw NEGOTIATION
Julie I SaylorsFranceOnyama Limba RENEWAL
Faith J BriddickItalyAmy Elsner NEGOTIATION
Jefferson W BowleyJapanXuxue Feng NEGOTIATION
Costa W CampainRussiaStephen Shaw NEGOTIATION
Ashley Z PaprockiAustraliaAsiya Javayant RENEWAL
Arvin N BriddickGermanyIoni Bowcher QUALIFIED
Emily H KolmetzGermanyIvan Magalhaes RENEWAL
Ivar G AlbaresBrazilOnyama Limba PROPOSAL
Murillo A CaudyRussiaElwin Sharvill NEGOTIATION
Cody U ButtAustraliaXuxue Feng NEGOTIATION
Ivar B CaudyAustraliaXuxue Feng NEW
Juan J PaprockiRussiaXuxue Feng PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Smith B GillianCanadaElwin Sharvill UNQUALIFIED
Kaitlin Z BowleyAustraliaIvan Magalhaes QUALIFIED
Leon M NestleAustraliaXuxue Feng UNQUALIFIED
Murillo F CampainRussiaOnyama Limba RENEWAL
Leon K OstroskyJapanAmy Elsner QUALIFIED
Antonio C AlbaresArgentinaIvan Magalhaes RENEWAL
Faith X CaldareraRussiaElwin Sharvill PROPOSAL
Stacey M FigeroaCanadaAsiya Javayant NEGOTIATION
Darci W PerinIndiaAsiya Javayant NEGOTIATION
Rodrigues L MorascaRussiaOnyama Limba QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Nicolas H RimRussia2025-05-19Chapman, Ross E Esq PROPOSAL27Bernardo Dominic
1001Arvin L SchemmerBrazil2025-06-10Chapman, Ross E Esq PROPOSAL8Elwin Sharvill
1002Mujtaba I FerenczArgentina2025-06-06Feltz Printing Service QUALIFIED15Xuxue Feng
1003Julie Q FollerJapan2025-06-12King, Christopher A Esq QUALIFIED17Anna Fali
1004Leja K BriddickRussia2025-05-23Commercial Press UNQUALIFIED70Ioni Bowcher
1005Ricardo U WieserBrazil2025-05-31King, Christopher A Esq NEGOTIATION55Amy Elsner
1006Costa E ChuiAustralia2025-06-08King, Christopher A Esq UNQUALIFIED80Ivan Magalhaes
1007Claire X PerinIndia2025-06-14Truhlar And Truhlar Attys PROPOSAL99Anna Fali
1008Darci S FerenczCanada2025-06-03Benton, John B Jr UNQUALIFIED90Asiya Javayant
1009Misaki U MorascaSpain2025-05-31Buckley Miller Wright PROPOSAL29Ivan Magalhaes
1010Clifford B FlosiItaly2025-05-21Chemel, James L Cpa RENEWAL31Onyama Limba
1011Munro E PoquetteJapan2025-05-31Chanay, Jeffrey A Esq NEW63Ivan Magalhaes
1012Emily N GillianFrance2025-05-24King, Christopher A Esq QUALIFIED99Ioni Bowcher
1013Misaki S MacleadSpain2025-06-02Chanay, Jeffrey A Esq RENEWAL16Elwin Sharvill
1014Ashley P CaldareraJapan2025-05-22Rousseaux, Michael Esq UNQUALIFIED86Stephen Shaw
1015Ivar V RulapaughSpain2025-05-20Chanay, Jeffrey A Esq RENEWAL72Bernardo Dominic
1016Maisha V PerinSpain2025-06-01Chanay, Jeffrey A Esq QUALIFIED94Bernardo Dominic
1017Greenwood X MorascaCanada2025-06-07Printing Dimensions UNQUALIFIED10Ioni Bowcher
1018Jennifer L PoquetteFrance2025-05-22Dorl, James J Esq RENEWAL33Stephen Shaw
1019Smith C AlbaresIndia2025-06-11Commercial Press PROPOSAL62Ivan Magalhaes
1020Leon E BowleyArgentina2025-05-24Benton, John B Jr PROPOSAL78Amy Elsner
1021David V FollerIndia2025-06-06Benton, John B Jr NEGOTIATION51Bernardo Dominic
1022Misaki V GauchoIndia2025-06-12Truhlar And Truhlar Attys NEGOTIATION75Ivan Magalhaes
1023David R SchemmerCanada2025-06-09Chemel, James L Cpa RENEWAL82Ioni Bowcher
1024Salvatore P NestleFrance2025-05-21Chapman, Ross E Esq PROPOSAL60Onyama Limba
1025James K PoquetteRussia2025-05-21Feiner Bros NEGOTIATION1Bernardo Dominic
1026Ricardo J WhobreyFrance2025-06-07Feltz Printing Service PROPOSAL37Ioni Bowcher
1027Costa W RulapaughBrazil2025-06-03Truhlar And Truhlar Attys RENEWAL0Bernardo Dominic
1028Misaki W KuskoAustralia2025-06-02Rangoni Of Florence UNQUALIFIED76Amy Elsner
1029Aika C MacleadCanada2025-05-30Chapman, Ross E Esq UNQUALIFIED26Xuxue Feng
1030Jefferson D CampainSpain2025-05-23Feiner Bros RENEWAL72Stephen Shaw
1031Smith E BriddickAustralia2025-05-25Rangoni Of Florence UNQUALIFIED18Asiya Javayant
1032Mayumi G SlusarskiItaly2025-05-28Truhlar And Truhlar Attys NEW35Stephen Shaw
1033Kadeem P WieserSpain2025-05-20Rousseaux, Michael Esq PROPOSAL39Ioni Bowcher
1034Isabel Y WaycottItaly2025-05-31Feiner Bros NEGOTIATION23Elwin Sharvill
1035Darci F PerinGermany2025-05-22King, Christopher A Esq NEGOTIATION68Bernardo Dominic
1036Stacey J NickaIndia2025-06-04Chemel, James L Cpa UNQUALIFIED64Bernardo Dominic
1037Antonio Q GauchoArgentina2025-06-12King, Christopher A Esq UNQUALIFIED26Ioni Bowcher
1038Faith D RulapaughJapan2025-05-28Dorl, James J Esq NEGOTIATION86Asiya Javayant
1039Deepesh H SaylorsUnited Kingdom2025-05-30Feltz Printing Service PROPOSAL92Ivan Magalhaes
1040Adams T GlickIndia2025-05-26Truhlar And Truhlar Attys RENEWAL22Ivan Magalhaes
1041Chavez X PaprockiBrazil2025-05-31Benton, John B Jr QUALIFIED70Xuxue Feng
1042Smith H RulapaughRussia2025-05-21Truhlar And Truhlar Attys QUALIFIED43Anna Fali
1043Mujtaba F NestleBrazil2025-06-10Feltz Printing Service RENEWAL34Ivan Magalhaes
1044Jones R OstroskyJapan2025-06-01Truhlar And Truhlar Attys UNQUALIFIED38Bernardo Dominic
1045Johnson S KuskoArgentina2025-05-30Chapman, Ross E Esq NEGOTIATION93Ioni Bowcher
1046Emily Y GauchoFrance2025-06-08Feiner Bros NEGOTIATION62Ivan Magalhaes
1047Aika O RoysterItaly2025-06-01Benton, John B Jr UNQUALIFIED40Asiya Javayant
1048Chavez U MaletRussia2025-05-22Truhlar And Truhlar Attys RENEWAL71Ioni Bowcher
1049Murillo L BriddickBrazil2025-06-08Feltz Printing Service RENEWAL6Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Claire D ButtArgentinaOnyama Limba RENEWAL
Deepesh G IturbideAustraliaStephen Shaw QUALIFIED
Darci O DoeItalyAnna Fali PROPOSAL
Misaki R CaudyBrazilAmy Elsner QUALIFIED
Munro E IturbideIndiaBernardo Dominic RENEWAL
Greenwood V PoquetteGermanyXuxue Feng QUALIFIED
Aditya K BriddickGermanyIvan Magalhaes NEGOTIATION
Smith E GauchoAustraliaIvan Magalhaes QUALIFIED
Deepesh L FlosiArgentinaBernardo Dominic RENEWAL
Faith B BriddickUnited KingdomIoni Bowcher UNQUALIFIED
Rodrigues J FlosiRussiaElwin Sharvill PROPOSAL
Tony O ButtRussiaBernardo Dominic RENEWAL
Sinclair G MorascaItalyElwin Sharvill QUALIFIED
Chavez G NestleGermanyAmy Elsner RENEWAL
Isabel O InouyeSpainXuxue Feng NEW
Jefferson N CaudyGermanyAmy Elsner RENEWAL
Claire Y FollerJapanIvan Magalhaes NEW
Kadeem E CampainRussiaBernardo Dominic UNQUALIFIED
Claire V PaprockiItalyIoni Bowcher UNQUALIFIED
Darci C FollerItalyBernardo Dominic RENEWAL
Cody P InouyeRussiaIvan Magalhaes RENEWAL
Ashley X WhobreyBrazilAsiya Javayant NEGOTIATION
Claire O WhobreyItalyAmy Elsner PROPOSAL
Izzy L GillianIndiaBernardo Dominic PROPOSAL
Francesco E RoysterBrazilAnna Fali RENEWAL
Smith I ButtBrazilIvan Magalhaes PROPOSAL
Mujtaba H BriddickUnited KingdomOnyama Limba QUALIFIED
Smith C InouyeCanadaXuxue Feng QUALIFIED
Emily R InouyeGermanyAnna Fali UNQUALIFIED
Misaki Q FollerIndiaAmy Elsner RENEWAL
Jennifer E GauchoArgentinaOnyama Limba PROPOSAL
Ashley Y MaletFranceOnyama Limba PROPOSAL
David K IturbideJapanAsiya Javayant NEGOTIATION
Jefferson Q NestleSpainStephen Shaw PROPOSAL
Mujtaba K ChuiRussiaStephen Shaw NEW
Ashley N DoeGermanyAnna Fali QUALIFIED
Ricardo Q MaletItalyElwin Sharvill NEGOTIATION
Clifford E WhobreyIndiaIvan Magalhaes NEGOTIATION
Chavez Z SaylorsJapanIvan Magalhaes NEW
Antonio O BologniaFranceAnna Fali QUALIFIED
Misaki X ButtBrazilIvan Magalhaes NEW
Jennifer A CaldareraGermanyOnyama Limba NEW
Adams Z KolmetzArgentinaElwin Sharvill UNQUALIFIED
Jones H KuskoCanadaStephen Shaw PROPOSAL
Claire H DarakjyCanadaAsiya Javayant PROPOSAL
Ricardo K AlbaresBrazilIoni Bowcher PROPOSAL
James Q SchemmerJapanStephen Shaw RENEWAL
Izzy N RoysterGermanyIoni Bowcher NEW
Isabel P GauchoFranceElwin Sharvill NEW
Isabel U MarrierIndiaBernardo Dominic NEGOTIATION
Frozen Columns
Name
Greenwood E Glick
James S Flosi
Arvin W Ostrosky
Aika P Ostrosky
Ricardo W Garufi
Morrow U Caldarera
David L Venere
Tony K Chui
Nicolas W Shinko
Maria Z Darakjy
Kaitlin N Campain
Juan K Royster
Ricardo F Kolmetz
Clifford A Malet
Munro G Bowley
Deepesh D Rim
Maria R Sergi
Greenwood R Paprocki
Adams L Bowley
Rodrigues N Oldroyd
Salvatore P Perin
Nicolas C Foller
Deepesh N Albares
Salvatore W Gillian
Darci X Schemmer
Aruna Q Gaucho
Stacey Z Caldarera
Misaki E Venere
Alejandro T Oldroyd
Maisha R Stockham
Ricardo Y Ostrosky
Chavez L Oldroyd
Stacey J Shinko
Jefferson S Ferencz
James O Schemmer
Jennifer J Poquette
Mujtaba L Gaucho
Emily D Iturbide
Nicolas D Schemmer
Ricardo S Royster
Jennifer O Gaucho
Emily S Paprocki
Aruna O Ruta
Greenwood L Nicka
Misaki M Garufi
Darci N Albares
Julie F Rulapaugh
Izzy L Amigon
Wickens I Maclead
Adams U Paprocki
IdCountryDate
1000Canada2025-06-16
1001Germany2025-05-27
1002India2025-06-07
1003India2025-06-13
1004Japan2025-06-15
1005United Kingdom2025-06-05
1006Italy2025-05-24
1007Spain2025-06-07
1008Australia2025-06-03
1009France2025-05-20
1010France2025-06-16
1011Japan2025-05-29
1012India2025-06-15
1013Brazil2025-05-24
1014Germany2025-06-10
1015Germany2025-06-02
1016Russia2025-05-28
1017Australia2025-05-18
1018United Kingdom2025-06-15
1019Canada2025-05-20
1020Brazil2025-06-03
1021Australia2025-06-09
1022United Kingdom2025-06-12
1023France2025-06-15
1024Germany2025-06-04
1025Germany2025-06-09
1026Spain2025-06-14
1027France2025-05-29
1028Australia2025-06-05
1029Brazil2025-05-27
1030Italy2025-05-30
1031Italy2025-05-27
1032India2025-05-21
1033Japan2025-05-19
1034France2025-05-20
1035Argentina2025-06-12
1036India2025-05-31
1037Germany2025-05-18
1038Argentina2025-06-02
1039Canada2025-06-06
1040Canada2025-06-13
1041Brazil2025-06-06
1042France2025-06-03
1043Canada2025-05-23
1044Japan2025-06-11
1045Argentina2025-06-03
1046France2025-05-28
1047Australia2025-06-16
1048Canada2025-06-09
1049Japan2025-06-04

On-Demand Data

NameIdCountryDate
Chavez X Figeroa1000India2025-06-02
Misaki S Saylors1001Italy2025-05-29
Costa P Caldarera1002Canada2025-06-13
Wickens V Whobrey1003United Kingdom2025-06-15
Wickens N Darakjy1004Japan2025-05-30
Claire C Tollner1005Italy2025-05-19
Silvio N Glick1006Russia2025-06-12
Chavez S Saylors1007United Kingdom2025-05-25
James M Amigon1008Germany2025-06-12
Chavez H Ferencz1009Russia2025-06-12
Salvatore C Saylors1010Canada2025-06-14
Smith G Butt1011France2025-05-25
Ricardo O Waycott1012Canada2025-06-09
Ashley X Waycott1013Russia2025-06-06
Salvatore M Briddick1014Russia2025-05-30
Aika Z Stenseth1015Japan2025-06-08
Tony O Stockham1016Russia2025-05-20
Munro T Nestle1017Australia2025-05-24
Octavia P Paprocki1018India2025-05-26
Tony V Iturbide1019Argentina2025-06-09
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Mujtaba N MaletJapanBernardo Dominic NEGOTIATION
Izzy G MacleadFranceElwin Sharvill PROPOSAL
Silvio U StockhamGermanyAsiya Javayant PROPOSAL
Munro U OldroydFranceStephen Shaw NEGOTIATION
Smith X PerinBrazilIoni Bowcher RENEWAL
Wickens P GauchoJapanOnyama Limba RENEWAL
David B ShinkoUnited KingdomIoni Bowcher UNQUALIFIED
Jeanfrancois A ButtBrazilXuxue Feng NEGOTIATION
Morrow C GauchoUnited KingdomStephen Shaw PROPOSAL
Ricardo F DilliardBrazilStephen Shaw NEGOTIATION
Faith U PoquetteSpainIoni Bowcher PROPOSAL
Aruna M KolmetzItalyAsiya Javayant UNQUALIFIED
Francesco A IturbideFranceAnna Fali PROPOSAL
Murillo X BologniaSpainStephen Shaw RENEWAL
Isabel Y MaletUnited KingdomAsiya Javayant NEGOTIATION
Maisha P FerenczFranceIoni Bowcher NEGOTIATION
Julie N VocelkaSpainIoni Bowcher NEGOTIATION
Cody N InouyeSpainXuxue Feng RENEWAL
Arvin E StockhamArgentinaAsiya Javayant NEW
Emily C MarrierBrazilOnyama Limba NEW
Darci B FerenczFranceAsiya Javayant QUALIFIED
Jennifer L GauchoGermanyIoni Bowcher QUALIFIED
Jennifer I BologniaBrazilIoni Bowcher UNQUALIFIED
Leon O SchemmerBrazilOnyama Limba UNQUALIFIED
Morrow M SchemmerIndiaElwin Sharvill NEW
Arvin L OldroydCanadaXuxue Feng NEW
Aditya K WieserGermanyBernardo Dominic QUALIFIED
Aditya T FigeroaRussiaBernardo Dominic PROPOSAL
Antonio T PoquetteSpainBernardo Dominic QUALIFIED
Darci T BologniaJapanStephen Shaw QUALIFIED
Deepesh L ShinkoUnited KingdomAsiya Javayant NEGOTIATION
Sinclair N SaylorsCanadaElwin Sharvill RENEWAL
Ashley N CampainGermanyStephen Shaw UNQUALIFIED
Maisha Q NestleSpainAnna Fali PROPOSAL
Greenwood V PerinAustraliaAnna Fali NEGOTIATION
Morrow Y SlusarskiGermanyIoni Bowcher PROPOSAL
Ricardo R BowleyArgentinaAmy Elsner QUALIFIED
Stacey C RoysterArgentinaIoni Bowcher UNQUALIFIED
Jennifer M FlosiFranceAsiya Javayant NEW
Tony G CaudySpainIoni Bowcher NEW

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