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
Antonio D FerenczItalyAmy Elsner PROPOSAL
Murillo D MaletFranceAnna Fali NEW
Leon R FigeroaCanadaIoni Bowcher PROPOSAL
Deepesh M WhobreyItalyAmy Elsner QUALIFIED
Juan P WaycottJapanIoni Bowcher NEGOTIATION
Aika V WhobreyRussiaAmy Elsner NEW
Jones P RulapaughArgentinaAnna Fali PROPOSAL
Sinclair B TollnerJapanIvan Magalhaes NEGOTIATION
Mayumi V GarufiRussiaXuxue Feng PROPOSAL
Smith K ButtSpainBernardo Dominic PROPOSAL
Costa G BologniaUnited KingdomOnyama Limba UNQUALIFIED
Misaki A VocelkaUnited KingdomXuxue Feng NEW
Darci O ChuiCanadaAsiya Javayant NEGOTIATION
James N GillianRussiaXuxue Feng NEGOTIATION
Faith D MorascaBrazilElwin Sharvill RENEWAL
Salvatore H RimRussiaXuxue Feng RENEWAL
Izzy Q RulapaughAustraliaOnyama Limba NEW
Mujtaba O MarrierUnited KingdomAsiya Javayant NEGOTIATION
David U FigeroaJapanElwin Sharvill PROPOSAL
Nicolas R MaletCanadaXuxue Feng RENEWAL
Munro A InouyeAustraliaAnna Fali RENEWAL
Stacey O SergiIndiaAnna Fali NEW
Johnson D FlosiCanadaOnyama Limba UNQUALIFIED
Kadeem H KuskoArgentinaAnna Fali RENEWAL
Aruna D PaprockiRussiaStephen Shaw RENEWAL
David P FigeroaJapanIvan Magalhaes QUALIFIED
Rodrigues H ShinkoGermanyAnna Fali QUALIFIED
Julie M GauchoCanadaElwin Sharvill UNQUALIFIED
Julie E FigeroaCanadaAsiya Javayant QUALIFIED
Johnson J DoeSpainAnna Fali RENEWAL
Munro X BriddickFranceIoni Bowcher QUALIFIED
Octavia D KuskoIndiaStephen Shaw NEGOTIATION
Johnson I GlickFranceXuxue Feng RENEWAL
Claire Z GarufiIndiaAnna Fali UNQUALIFIED
Jones U FerenczArgentinaOnyama Limba RENEWAL
Deepesh P OstroskyUnited KingdomIoni Bowcher NEW
Isabel R MorascaAustraliaElwin Sharvill PROPOSAL
Sinclair P SlusarskiCanadaAmy Elsner NEGOTIATION
Ashley A NestleCanadaAnna Fali NEW
Antonio Y OldroydRussiaAsiya Javayant UNQUALIFIED
Salvatore E RoysterSpainBernardo Dominic NEGOTIATION
Ivar M GarufiItalyIvan Magalhaes QUALIFIED
Ivar A VenereArgentinaAnna Fali RENEWAL
Johnson S ButtAustraliaBernardo Dominic QUALIFIED
Faith K CampainRussiaBernardo Dominic PROPOSAL
Adams O BriddickItalyAmy Elsner QUALIFIED
Silvio D BowleyAustraliaOnyama Limba PROPOSAL
Aruna T SaylorsFranceAmy Elsner PROPOSAL
Antonio A AlbaresBrazilStephen Shaw RENEWAL
Francesco D OldroydJapanAnna Fali NEW
Horizontal
NameCountryRepresentativeStatus
Jones H WhobreyFranceAnna Fali RENEWAL
Maisha G PerinSpainOnyama Limba NEGOTIATION
Mayumi F FerenczCanadaXuxue Feng RENEWAL
Julie K CaldareraRussiaAnna Fali PROPOSAL
Morrow T FerenczJapanOnyama Limba PROPOSAL
Antonio I NickaAustraliaAsiya Javayant PROPOSAL
Ivar R OstroskyGermanyIvan Magalhaes NEGOTIATION
Morrow X RoysterIndiaIoni Bowcher UNQUALIFIED
Smith A OldroydItalyAsiya Javayant QUALIFIED
Silvio A SchemmerRussiaAnna Fali RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Emily B RoysterUnited Kingdom2025-06-08Feltz Printing Service NEW52Onyama Limba
1001David K VenereJapan2025-05-25Chemel, James L Cpa PROPOSAL96Asiya Javayant
1002Aditya W MorascaSpain2025-06-13Chanay, Jeffrey A Esq QUALIFIED68Amy Elsner
1003Jones N StockhamItaly2025-05-19Commercial Press UNQUALIFIED2Onyama Limba
1004Antonio Y CaldareraItaly2025-06-03Rangoni Of Florence UNQUALIFIED84Stephen Shaw
1005Maisha Z SaylorsBrazil2025-06-06Feltz Printing Service RENEWAL47Xuxue Feng
1006Wickens M ShinkoItaly2025-05-20Chanay, Jeffrey A Esq PROPOSAL18Ivan Magalhaes
1007Deepesh J PaprockiItaly2025-05-26Rousseaux, Michael Esq UNQUALIFIED53Ivan Magalhaes
1008Julie J SaylorsUnited Kingdom2025-06-08Benton, John B Jr UNQUALIFIED65Asiya Javayant
1009Darci U TollnerAustralia2025-05-20Feiner Bros NEGOTIATION1Amy Elsner
1010Kaitlin Q NestleRussia2025-06-01Chanay, Jeffrey A Esq NEGOTIATION88Xuxue Feng
1011Leja O PerinUnited Kingdom2025-06-01King, Christopher A Esq NEW88Ivan Magalhaes
1012Izzy P NickaCanada2025-06-05Truhlar And Truhlar Attys NEW63Ioni Bowcher
1013Alejandro C PoquetteBrazil2025-05-23Chapman, Ross E Esq PROPOSAL61Bernardo Dominic
1014Morrow S ButtIndia2025-06-12Benton, John B Jr RENEWAL39Bernardo Dominic
1015Kadeem G CaudyItaly2025-06-13Rangoni Of Florence NEGOTIATION28Anna Fali
1016Costa Y CaldareraFrance2025-06-14Commercial Press RENEWAL3Ivan Magalhaes
1017Juan U AlbaresFrance2025-05-19Chapman, Ross E Esq QUALIFIED8Ivan Magalhaes
1018Maisha F FollerFrance2025-06-02Benton, John B Jr PROPOSAL65Amy Elsner
1019Munro E ButtSpain2025-05-23Morlong Associates UNQUALIFIED96Stephen Shaw
1020Silvio O FerenczCanada2025-05-30Chanay, Jeffrey A Esq PROPOSAL87Ioni Bowcher
1021Aditya K FlosiFrance2025-05-23Rangoni Of Florence RENEWAL50Elwin Sharvill
1022Costa B PaprockiArgentina2025-05-25Feiner Bros PROPOSAL83Amy Elsner
1023Adams V IturbideArgentina2025-06-07King, Christopher A Esq NEGOTIATION79Asiya Javayant
1024Ashley E CaldareraSpain2025-05-31Feiner Bros PROPOSAL89Stephen Shaw
1025Francesco Z CaldareraCanada2025-05-27Commercial Press PROPOSAL20Ivan Magalhaes
1026Ivar O StockhamItaly2025-05-21Rangoni Of Florence QUALIFIED3Bernardo Dominic
1027Clifford L GillianUnited Kingdom2025-06-13Morlong Associates NEGOTIATION83Ivan Magalhaes
1028Alejandro R MaletBrazil2025-05-25Buckley Miller Wright NEGOTIATION47Ivan Magalhaes
1029Alejandro X DoeCanada2025-06-13King, Christopher A Esq PROPOSAL2Ioni Bowcher
1030Mayumi J SlusarskiJapan2025-06-02Chemel, James L Cpa UNQUALIFIED26Xuxue Feng
1031Jennifer N ButtAustralia2025-05-25Rangoni Of Florence UNQUALIFIED29Bernardo Dominic
1032Deepesh Y ShinkoBrazil2025-05-26Feiner Bros NEGOTIATION32Asiya Javayant
1033Munro H NestleCanada2025-05-28Truhlar And Truhlar Attys UNQUALIFIED89Anna Fali
1034Kaitlin Y SaylorsFrance2025-06-06Chanay, Jeffrey A Esq NEGOTIATION39Elwin Sharvill
1035David V PerinFrance2025-05-27Buckley Miller Wright NEGOTIATION67Elwin Sharvill
1036Sinclair D PaprockiCanada2025-05-17Truhlar And Truhlar Attys PROPOSAL27Anna Fali
1037Morrow W GarufiGermany2025-05-22Rangoni Of Florence RENEWAL19Anna Fali
1038Stacey W PoquetteItaly2025-06-06Dorl, James J Esq RENEWAL15Stephen Shaw
1039Cody X VocelkaRussia2025-05-25Printing Dimensions PROPOSAL36Stephen Shaw
1040Mujtaba H KuskoRussia2025-06-11Feiner Bros UNQUALIFIED70Stephen Shaw
1041Francesco W ButtJapan2025-05-21Printing Dimensions UNQUALIFIED19Ioni Bowcher
1042Murillo G KuskoRussia2025-05-23Buckley Miller Wright QUALIFIED54Elwin Sharvill
1043Murillo B BowleyIndia2025-05-24Chapman, Ross E Esq RENEWAL37Ioni Bowcher
1044Smith V SchemmerIndia2025-06-09Rousseaux, Michael Esq NEW96Onyama Limba
1045Jennifer V InouyeAustralia2025-05-25Chanay, Jeffrey A Esq QUALIFIED20Asiya Javayant
1046Antonio V OldroydIndia2025-06-14Rangoni Of Florence UNQUALIFIED70Elwin Sharvill
1047Munro S NestleFrance2025-06-09Truhlar And Truhlar Attys UNQUALIFIED77Anna Fali
1048Antonio Y DarakjyCanada2025-06-01King, Christopher A Esq QUALIFIED81Asiya Javayant
1049Ivar P BologniaFrance2025-05-20Feltz Printing Service RENEWAL44Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Juan M OstroskyAustraliaXuxue Feng PROPOSAL
Emily C WaycottJapanBernardo Dominic PROPOSAL
Francesco D MacleadCanadaIoni Bowcher QUALIFIED
Leon C PoquetteSpainAsiya Javayant PROPOSAL
Chavez Z RimItalyIvan Magalhaes UNQUALIFIED
Kadeem A KuskoIndiaOnyama Limba UNQUALIFIED
Nicolas Q WaycottJapanElwin Sharvill QUALIFIED
Jennifer G KolmetzSpainAsiya Javayant PROPOSAL
Rodrigues Z VocelkaSpainOnyama Limba QUALIFIED
Aditya J BowleyJapanStephen Shaw RENEWAL
Johnson I RutaRussiaOnyama Limba UNQUALIFIED
Mujtaba O FigeroaFranceIvan Magalhaes RENEWAL
Smith O GlickCanadaStephen Shaw UNQUALIFIED
Salvatore N PerinUnited KingdomStephen Shaw PROPOSAL
Tony H DarakjyGermanyElwin Sharvill PROPOSAL
Juan I KuskoUnited KingdomAmy Elsner NEW
Claire A PaprockiIndiaBernardo Dominic NEW
Aditya J WieserJapanElwin Sharvill NEW
Silvio D RulapaughItalyXuxue Feng PROPOSAL
Munro Z NickaJapanAsiya Javayant QUALIFIED
Isabel P NestleRussiaAsiya Javayant PROPOSAL
James F OldroydUnited KingdomAmy Elsner PROPOSAL
Deepesh U RimIndiaIvan Magalhaes NEGOTIATION
Mujtaba K NestleRussiaAsiya Javayant UNQUALIFIED
Leon W PoquetteRussiaBernardo Dominic NEGOTIATION
Jones S WhobreyUnited KingdomElwin Sharvill NEGOTIATION
Ashley P CaudyGermanyBernardo Dominic PROPOSAL
Francesco S OstroskyBrazilIoni Bowcher PROPOSAL
Salvatore I ButtArgentinaStephen Shaw UNQUALIFIED
Leon W WhobreyAustraliaAnna Fali PROPOSAL
Morrow R FigeroaRussiaXuxue Feng NEGOTIATION
Jeanfrancois Z PaprockiFranceAsiya Javayant NEGOTIATION
Ricardo E CaudyCanadaAmy Elsner NEW
Kaitlin N GlickGermanyOnyama Limba RENEWAL
Ricardo T ButtUnited KingdomAsiya Javayant NEGOTIATION
Kadeem A PerinArgentinaStephen Shaw UNQUALIFIED
James V RimItalyAmy Elsner NEW
Murillo F MaletSpainIoni Bowcher RENEWAL
Ricardo E WhobreyItalyIoni Bowcher QUALIFIED
Emily R GlickIndiaBernardo Dominic QUALIFIED
Ricardo K FerenczItalyStephen Shaw RENEWAL
Wickens W IturbideArgentinaAnna Fali NEW
Claire H GillianAustraliaElwin Sharvill NEW
Deepesh E CaldareraBrazilXuxue Feng NEGOTIATION
Morrow V GauchoItalyIvan Magalhaes QUALIFIED
Jones K RulapaughCanadaIoni Bowcher RENEWAL
Leja Z WaycottGermanyOnyama Limba PROPOSAL
Claire D DilliardBrazilOnyama Limba NEW
Jones I KuskoSpainAmy Elsner QUALIFIED
Darci P RoysterUnited KingdomXuxue Feng NEW
Frozen Columns
Name
Greenwood C Oldroyd
Ashley I Darakjy
David Q Briddick
Misaki C Caldarera
Nicolas N Iturbide
Murillo F Maclead
Izzy K Perin
Sinclair H Poquette
Johnson R Tollner
Francesco E Kolmetz
Sinclair C Rulapaugh
James G Campain
Julie W Butt
Ricardo G Nicka
Tony X Ostrosky
Antonio D Foller
Francesco C Doe
Adams B Ostrosky
Clifford Q Vocelka
James J Gaucho
Mayumi F Oldroyd
Mayumi J Shinko
Deepesh H Schemmer
Leon A Schemmer
Munro P Perin
Aruna W Oldroyd
Rodrigues O Caudy
Clifford U Maclead
Izzy T Malet
Clifford A Butt
Greenwood H Bowley
Jefferson C Ruta
Julie Z Inouye
Kadeem Y Ostrosky
Misaki J Maclead
Misaki U Dilliard
Misaki J Darakjy
Rodrigues K Whobrey
Ricardo P Royster
Silvio H Kolmetz
Arvin E Bowley
Aika Y Whobrey
Alejandro F Garufi
Julie X Doe
Cody R Rim
Kaitlin A Waycott
Kadeem Y Whobrey
Wickens U Whobrey
Cody L Ferencz
Antonio F Stenseth
IdCountryDate
1000Spain2025-05-19
1001United Kingdom2025-05-21
1002Australia2025-05-19
1003France2025-06-13
1004Argentina2025-05-27
1005Canada2025-05-24
1006India2025-06-01
1007Canada2025-06-09
1008United Kingdom2025-05-20
1009Australia2025-05-20
1010India2025-05-25
1011Canada2025-05-17
1012Spain2025-05-23
1013Russia2025-05-16
1014India2025-06-14
1015France2025-05-24
1016Brazil2025-05-22
1017Spain2025-05-28
1018Argentina2025-06-07
1019Japan2025-06-13
1020Australia2025-05-28
1021India2025-06-01
1022Italy2025-05-24
1023Germany2025-05-28
1024Canada2025-05-29
1025Italy2025-06-03
1026Australia2025-06-12
1027Australia2025-06-02
1028France2025-06-09
1029Argentina2025-06-06
1030Spain2025-05-22
1031India2025-06-03
1032Spain2025-06-01
1033Australia2025-06-10
1034Brazil2025-06-14
1035Argentina2025-05-29
1036Canada2025-05-25
1037France2025-05-20
1038Brazil2025-05-26
1039Russia2025-06-14
1040Germany2025-06-06
1041Spain2025-06-10
1042Japan2025-06-01
1043India2025-06-09
1044Argentina2025-05-20
1045Germany2025-06-05
1046Australia2025-05-17
1047United Kingdom2025-05-19
1048Italy2025-06-14
1049Spain2025-05-17

On-Demand Data

NameIdCountryDate
Claire Z Waycott1000Canada2025-06-08
Ivar I Perin1001Germany2025-06-14
Smith O Flosi1002Russia2025-05-24
Jefferson P Tollner1003France2025-06-10
Rodrigues L Tollner1004Canada2025-06-11
Morrow U Vocelka1005India2025-06-02
Johnson R Gillian1006Russia2025-06-05
Ashley Z Morasca1007India2025-05-24
Chavez L Caudy1008Brazil2025-06-07
Wickens A Darakjy1009Argentina2025-06-08
Sinclair G Poquette1010United Kingdom2025-06-08
Clifford U Bolognia1011Russia2025-05-31
Arvin K Gillian1012Italy2025-05-24
Juan U Glick1013Russia2025-06-14
Aruna K Caudy1014Brazil2025-05-20
Ricardo O Bowley1015Australia2025-05-31
Sinclair R Oldroyd1016Italy2025-05-24
Jennifer Q Inouye1017Australia2025-05-16
Alejandro F Gaucho1018Canada2025-06-01
Rodrigues C Maclead1019Canada2025-05-30
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Mujtaba G GauchoGermanyIvan Magalhaes NEW
Jones X IturbideItalyStephen Shaw UNQUALIFIED
Emily L MacleadCanadaBernardo Dominic PROPOSAL
Tony K ChuiUnited KingdomIvan Magalhaes RENEWAL
Chavez Y AmigonRussiaOnyama Limba NEGOTIATION
Munro J GauchoJapanIvan Magalhaes QUALIFIED
Maria O NickaSpainOnyama Limba PROPOSAL
Arvin R CampainBrazilAsiya Javayant NEW
Jefferson A RutaAustraliaElwin Sharvill RENEWAL
Maisha C FerenczAustraliaAnna Fali PROPOSAL
Arvin G GauchoFranceIvan Magalhaes UNQUALIFIED
Costa V MaletCanadaAmy Elsner NEW
Adams H BowleyJapanIoni Bowcher NEW
Juan Z RutaSpainElwin Sharvill PROPOSAL
Francesco U GauchoFranceElwin Sharvill UNQUALIFIED
Deepesh D StockhamAustraliaAnna Fali PROPOSAL
Octavia Q StensethJapanBernardo Dominic NEGOTIATION
Munro O FerenczJapanOnyama Limba RENEWAL
Claire T CaudyIndiaElwin Sharvill PROPOSAL
Jones P TollnerUnited KingdomStephen Shaw QUALIFIED
Costa O RulapaughRussiaStephen Shaw PROPOSAL
Aditya O WhobreyJapanAmy Elsner RENEWAL
Darci M GauchoUnited KingdomAsiya Javayant PROPOSAL
Murillo R SchemmerAustraliaAsiya Javayant NEGOTIATION
Julie C ChuiCanadaAnna Fali RENEWAL
Kaitlin V GlickAustraliaAnna Fali RENEWAL
Nicolas T KolmetzJapanOnyama Limba PROPOSAL
Morrow L GlickIndiaAnna Fali PROPOSAL
Ricardo H WhobreyArgentinaAnna Fali NEW
Jefferson K RoysterIndiaAmy Elsner RENEWAL
Arvin O SaylorsBrazilBernardo Dominic RENEWAL
Misaki Q RoysterGermanyXuxue Feng UNQUALIFIED
Jeanfrancois Z KolmetzUnited KingdomStephen Shaw PROPOSAL
Misaki Y VenereCanadaIvan Magalhaes QUALIFIED
Maisha E RimIndiaAmy Elsner NEW
David R BologniaRussiaAsiya Javayant NEW
Leja I MacleadJapanAsiya Javayant UNQUALIFIED
Mujtaba P VenereIndiaXuxue Feng QUALIFIED
Cody D FlosiUnited KingdomAmy Elsner UNQUALIFIED
Maisha J OldroydAustraliaAnna Fali UNQUALIFIED

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