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
Aruna G DarakjySpainAsiya Javayant NEGOTIATION
Francesco Y PaprockiFranceIvan Magalhaes NEGOTIATION
Octavia P FerenczAustraliaOnyama Limba RENEWAL
Rodrigues D NestleFranceAmy Elsner NEGOTIATION
Wickens P SchemmerGermanyXuxue Feng PROPOSAL
Aruna F PaprockiSpainStephen Shaw QUALIFIED
Stacey F WhobreyRussiaOnyama Limba NEW
Silvio U CampainUnited KingdomAsiya Javayant NEGOTIATION
Kadeem F FollerRussiaXuxue Feng UNQUALIFIED
Isabel N OldroydCanadaIoni Bowcher RENEWAL
Wickens D SlusarskiIndiaAmy Elsner PROPOSAL
Claire Y CaudyIndiaAsiya Javayant RENEWAL
Nicolas I GillianBrazilOnyama Limba RENEWAL
Johnson R AmigonUnited KingdomBernardo Dominic NEGOTIATION
Munro M RoysterAustraliaBernardo Dominic QUALIFIED
Isabel X RutaGermanyOnyama Limba RENEWAL
Wickens N PoquetteJapanXuxue Feng UNQUALIFIED
Jennifer O MaletCanadaXuxue Feng QUALIFIED
Alejandro W AmigonSpainIvan Magalhaes NEGOTIATION
Tony Z FerenczAustraliaBernardo Dominic QUALIFIED
Darci C StensethBrazilBernardo Dominic NEW
Ricardo F GillianAustraliaStephen Shaw NEW
Kaitlin R GillianFranceAnna Fali NEW
Francesco J MacleadAustraliaIoni Bowcher PROPOSAL
Chavez T DarakjyBrazilOnyama Limba NEGOTIATION
Adams J VocelkaIndiaIvan Magalhaes PROPOSAL
Stacey N NickaItalyIoni Bowcher PROPOSAL
Costa U SaylorsFranceIvan Magalhaes NEGOTIATION
Jennifer T ButtFranceAnna Fali PROPOSAL
Francesco N SergiCanadaXuxue Feng NEW
Ivar B ShinkoBrazilBernardo Dominic NEW
Isabel E StockhamCanadaAnna Fali QUALIFIED
Emily W GarufiBrazilXuxue Feng NEGOTIATION
Aika H OldroydSpainAnna Fali PROPOSAL
Morrow E StockhamJapanBernardo Dominic NEGOTIATION
Ivar T RulapaughJapanIoni Bowcher QUALIFIED
Leja W StockhamCanadaAnna Fali UNQUALIFIED
Cody B MaletCanadaOnyama Limba UNQUALIFIED
Ashley G NestleGermanyIvan Magalhaes QUALIFIED
Francesco G ButtFranceXuxue Feng NEW
Faith O MacleadCanadaAsiya Javayant NEGOTIATION
Cody S WieserIndiaStephen Shaw RENEWAL
Emily S RoysterCanadaIoni Bowcher QUALIFIED
Jennifer S WieserItalyAmy Elsner UNQUALIFIED
Julie G MaletArgentinaAsiya Javayant NEGOTIATION
Ricardo A ChuiJapanElwin Sharvill QUALIFIED
Deepesh Z TollnerBrazilAmy Elsner UNQUALIFIED
Rodrigues B BowleyArgentinaElwin Sharvill QUALIFIED
Aruna W DoeUnited KingdomOnyama Limba NEGOTIATION
Mujtaba F MaletAustraliaStephen Shaw NEW
Horizontal
NameCountryRepresentativeStatus
Jefferson A FlosiUnited KingdomAmy Elsner QUALIFIED
Wickens P MarrierArgentinaXuxue Feng QUALIFIED
Emily K FlosiSpainBernardo Dominic RENEWAL
Alejandro X FigeroaSpainXuxue Feng QUALIFIED
Aditya F SchemmerSpainElwin Sharvill UNQUALIFIED
Leon R TollnerSpainAmy Elsner PROPOSAL
Mujtaba Z FollerSpainIvan Magalhaes RENEWAL
Ricardo C GlickCanadaElwin Sharvill QUALIFIED
Octavia O IturbideGermanyAmy Elsner RENEWAL
Juan U RulapaughIndiaElwin Sharvill NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Alejandro F DoeBrazil2025-06-06Feiner Bros RENEWAL81Asiya Javayant
1001Cody P ButtFrance2025-05-29Rousseaux, Michael Esq UNQUALIFIED42Bernardo Dominic
1002Wickens D AlbaresFrance2025-05-21Morlong Associates NEGOTIATION43Onyama Limba
1003Claire Q RoysterIndia2025-05-28Chapman, Ross E Esq PROPOSAL61Asiya Javayant
1004Faith P StensethCanada2025-06-02Dorl, James J Esq NEGOTIATION16Ioni Bowcher
1005Kadeem X PaprockiIndia2025-05-22Feiner Bros PROPOSAL87Elwin Sharvill
1006Darci H IturbideJapan2025-06-10Rousseaux, Michael Esq PROPOSAL96Bernardo Dominic
1007Silvio K ChuiFrance2025-06-12Benton, John B Jr UNQUALIFIED39Elwin Sharvill
1008Mayumi I DarakjyJapan2025-05-19Buckley Miller Wright PROPOSAL85Asiya Javayant
1009Johnson K GillianGermany2025-05-20Truhlar And Truhlar Attys QUALIFIED65Elwin Sharvill
1010Murillo M PerinGermany2025-05-28Feiner Bros UNQUALIFIED88Anna Fali
1011Arvin C GillianGermany2025-06-08Printing Dimensions RENEWAL89Amy Elsner
1012Octavia H IturbideArgentina2025-05-18Truhlar And Truhlar Attys RENEWAL94Ioni Bowcher
1013Jones J InouyeBrazil2025-05-25Chapman, Ross E Esq QUALIFIED36Xuxue Feng
1014Chavez L VenereCanada2025-05-27King, Christopher A Esq QUALIFIED75Ioni Bowcher
1015Jones C StockhamFrance2025-06-16Truhlar And Truhlar Attys RENEWAL94Ivan Magalhaes
1016Leja M FollerFrance2025-05-23Chapman, Ross E Esq UNQUALIFIED61Bernardo Dominic
1017Faith E WieserBrazil2025-05-20Rousseaux, Michael Esq PROPOSAL45Amy Elsner
1018Mayumi U KuskoCanada2025-05-20King, Christopher A Esq QUALIFIED8Stephen Shaw
1019Silvio H GillianUnited Kingdom2025-05-23Chanay, Jeffrey A Esq RENEWAL89Bernardo Dominic
1020Julie T SlusarskiBrazil2025-06-04Feiner Bros PROPOSAL12Ioni Bowcher
1021Aditya M RulapaughFrance2025-05-26Chapman, Ross E Esq QUALIFIED63Bernardo Dominic
1022Nicolas J FigeroaBrazil2025-06-11Commercial Press QUALIFIED35Asiya Javayant
1023Francesco E CaudyBrazil2025-06-04Printing Dimensions UNQUALIFIED94Xuxue Feng
1024Emily M FerenczIndia2025-05-29King, Christopher A Esq PROPOSAL96Ioni Bowcher
1025Aditya X MacleadItaly2025-06-15Rousseaux, Michael Esq RENEWAL65Asiya Javayant
1026Wickens Y NickaFrance2025-06-15Feltz Printing Service PROPOSAL3Xuxue Feng
1027Murillo W PoquetteArgentina2025-05-29Buckley Miller Wright NEGOTIATION79Onyama Limba
1028Mayumi Q SchemmerGermany2025-06-10Commercial Press NEGOTIATION54Anna Fali
1029Jefferson J ButtUnited Kingdom2025-06-07Rousseaux, Michael Esq UNQUALIFIED93Asiya Javayant
1030Maisha O SchemmerRussia2025-06-09Rangoni Of Florence NEW61Asiya Javayant
1031Aika U FerenczArgentina2025-06-12Printing Dimensions QUALIFIED36Asiya Javayant
1032Kadeem S MacleadIndia2025-06-01Commercial Press PROPOSAL33Bernardo Dominic
1033Costa W AmigonSpain2025-06-11Dorl, James J Esq RENEWAL87Anna Fali
1034Juan T WhobreyItaly2025-05-25Dorl, James J Esq RENEWAL18Ioni Bowcher
1035Claire N RoysterArgentina2025-05-28Commercial Press QUALIFIED75Elwin Sharvill
1036Clifford E StockhamFrance2025-06-09Rousseaux, Michael Esq PROPOSAL35Anna Fali
1037Deepesh B PerinIndia2025-05-29Truhlar And Truhlar Attys QUALIFIED19Asiya Javayant
1038Misaki O OldroydFrance2025-06-12Chanay, Jeffrey A Esq NEGOTIATION24Ivan Magalhaes
1039Morrow X MarrierGermany2025-05-30Printing Dimensions RENEWAL87Bernardo Dominic
1040Misaki K GillianCanada2025-06-07King, Christopher A Esq NEGOTIATION40Ivan Magalhaes
1041Arvin F CaldareraItaly2025-05-20King, Christopher A Esq QUALIFIED3Ivan Magalhaes
1042Ricardo M DilliardCanada2025-05-20Truhlar And Truhlar Attys UNQUALIFIED66Anna Fali
1043Deepesh B DarakjyGermany2025-05-22Rousseaux, Michael Esq NEW44Asiya Javayant
1044Julie P PerinIndia2025-05-25Chanay, Jeffrey A Esq NEGOTIATION73Anna Fali
1045Mujtaba V StensethRussia2025-06-02King, Christopher A Esq UNQUALIFIED94Amy Elsner
1046Jones Y RulapaughIndia2025-05-30Buckley Miller Wright NEW48Ivan Magalhaes
1047Deepesh D DarakjyRussia2025-05-23Chapman, Ross E Esq NEGOTIATION69Amy Elsner
1048Silvio D KolmetzFrance2025-05-26Morlong Associates PROPOSAL57Asiya Javayant
1049Murillo J GillianGermany2025-06-11Buckley Miller Wright PROPOSAL74Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Antonio R MorascaCanadaIvan Magalhaes UNQUALIFIED
Antonio X SchemmerItalyStephen Shaw NEW
Clifford Z BologniaBrazilBernardo Dominic QUALIFIED
Stacey Q WhobreySpainBernardo Dominic RENEWAL
Misaki I DilliardItalyElwin Sharvill PROPOSAL
Morrow B GillianIndiaXuxue Feng QUALIFIED
Darci P FerenczAustraliaAnna Fali UNQUALIFIED
Juan G VocelkaUnited KingdomAnna Fali UNQUALIFIED
Chavez H MarrierSpainIvan Magalhaes NEGOTIATION
Costa U CampainRussiaElwin Sharvill UNQUALIFIED
Misaki X SergiArgentinaXuxue Feng QUALIFIED
Aika Y WhobreyFranceElwin Sharvill PROPOSAL
Greenwood H SlusarskiBrazilAmy Elsner NEGOTIATION
Cody W RutaArgentinaIvan Magalhaes NEGOTIATION
Kaitlin I GillianIndiaBernardo Dominic RENEWAL
Julie T WaycottSpainIvan Magalhaes PROPOSAL
Kadeem J BowleyArgentinaXuxue Feng QUALIFIED
Ivar I BriddickRussiaElwin Sharvill QUALIFIED
Maria M GlickRussiaBernardo Dominic QUALIFIED
Emily Q RulapaughItalyOnyama Limba NEW
Leja B MacleadFranceElwin Sharvill PROPOSAL
Juan Y SchemmerFranceIvan Magalhaes NEGOTIATION
Kaitlin J PaprockiCanadaBernardo Dominic RENEWAL
Mayumi C FigeroaUnited KingdomBernardo Dominic NEGOTIATION
Kaitlin B FollerAustraliaBernardo Dominic NEW
Juan J ButtFranceStephen Shaw NEW
James S IturbideFranceIoni Bowcher QUALIFIED
Julie P MarrierItalyAmy Elsner RENEWAL
Isabel D RoysterRussiaOnyama Limba NEGOTIATION
Claire R OldroydSpainAnna Fali NEGOTIATION
Murillo N CaldareraArgentinaXuxue Feng RENEWAL
Faith W CampainSpainStephen Shaw UNQUALIFIED
Clifford U AlbaresArgentinaStephen Shaw UNQUALIFIED
Smith K GarufiAustraliaElwin Sharvill NEGOTIATION
Octavia M BriddickSpainIvan Magalhaes QUALIFIED
Arvin U IturbideArgentinaIvan Magalhaes UNQUALIFIED
Izzy J DilliardUnited KingdomIvan Magalhaes UNQUALIFIED
Aruna L WaycottRussiaAmy Elsner NEW
Ashley K ButtGermanyIvan Magalhaes QUALIFIED
Smith M IturbideIndiaIvan Magalhaes UNQUALIFIED
Chavez W CampainCanadaBernardo Dominic PROPOSAL
Alejandro H BowleyAustraliaAmy Elsner QUALIFIED
Smith W WieserItalyAnna Fali NEGOTIATION
Aditya L RimRussiaXuxue Feng NEGOTIATION
Stacey F RoysterSpainAmy Elsner QUALIFIED
Rodrigues R PaprockiArgentinaAnna Fali UNQUALIFIED
Emily S FlosiSpainOnyama Limba NEGOTIATION
Aruna H GlickBrazilIoni Bowcher QUALIFIED
Mujtaba F CampainUnited KingdomIvan Magalhaes RENEWAL
Maria S AmigonItalyIoni Bowcher QUALIFIED
Frozen Columns
Name
Salvatore U Butt
Izzy D Flosi
Chavez L Albares
Jefferson T Kolmetz
David J Ruta
Salvatore J Venere
Nicolas I Waycott
Johnson U Vocelka
Emily R Inouye
Ashley D Chui
Juan Y Rulapaugh
Munro B Caldarera
Salvatore P Stockham
Jeanfrancois C Glick
Octavia C Gillian
David B Ruta
Tony N Amigon
Maria Y Dilliard
Chavez M Bolognia
Alejandro N Iturbide
Isabel R Caudy
Munro S Darakjy
Mayumi X Flosi
Francesco F Morasca
Leja A Whobrey
Murillo N Garufi
Juan F Bowley
Johnson A Wieser
Aika F Darakjy
Leon I Caudy
Johnson G Stenseth
Wickens X Perin
Misaki O Amigon
Aika O Caldarera
Misaki U Caudy
Juan H Figeroa
Salvatore Y Vocelka
Salvatore Y Malet
Greenwood R Marrier
James X Malet
Mayumi M Flosi
Jones L Garufi
Maisha O Figeroa
Claire W Nicka
Misaki N Rulapaugh
Julie Q Bowley
Maisha P Poquette
Cody V Darakjy
Antonio G Shinko
Johnson R Stockham
IdCountryDate
1000Russia2025-05-18
1001Australia2025-06-01
1002France2025-06-09
1003France2025-05-20
1004Argentina2025-06-05
1005Canada2025-06-07
1006Spain2025-05-25
1007Germany2025-05-30
1008Germany2025-05-28
1009Argentina2025-05-21
1010Russia2025-05-23
1011Canada2025-05-18
1012Germany2025-06-14
1013Italy2025-05-19
1014India2025-05-19
1015India2025-06-02
1016Japan2025-05-19
1017Australia2025-06-06
1018Canada2025-05-24
1019United Kingdom2025-05-19
1020Germany2025-05-29
1021France2025-06-16
1022Canada2025-06-04
1023Canada2025-05-22
1024Germany2025-06-15
1025Spain2025-05-28
1026India2025-05-31
1027United Kingdom2025-06-14
1028Italy2025-06-10
1029United Kingdom2025-06-08
1030Germany2025-06-07
1031India2025-05-19
1032Spain2025-06-05
1033Brazil2025-05-20
1034United Kingdom2025-06-07
1035Japan2025-05-22
1036Argentina2025-06-05
1037Canada2025-05-31
1038Canada2025-06-14
1039India2025-05-25
1040Canada2025-06-09
1041Germany2025-06-12
1042United Kingdom2025-06-02
1043Argentina2025-06-14
1044Japan2025-05-28
1045United Kingdom2025-06-15
1046United Kingdom2025-06-13
1047Russia2025-06-13
1048Italy2025-06-16
1049Brazil2025-06-10

On-Demand Data

NameIdCountryDate
Mujtaba V Glick1000Canada2025-06-02
Smith H Stockham1001Canada2025-06-11
Claire G Doe1002Spain2025-06-08
Ashley F Butt1003Brazil2025-05-21
Johnson B Shinko1004Russia2025-06-13
Silvio U Amigon1005Brazil2025-05-26
Aika T Whobrey1006Australia2025-05-22
Salvatore C Flosi1007France2025-05-24
Silvio G Flosi1008India2025-06-05
Chavez E Saylors1009Canada2025-05-31
Morrow T Gillian1010Argentina2025-05-24
Maria C Stenseth1011Germany2025-05-24
Deepesh M Ruta1012Canada2025-06-01
Jeanfrancois O Venere1013Japan2025-06-02
Arvin B Doe1014India2025-06-01
Francesco D Flosi1015India2025-05-27
Octavia F Gillian1016United Kingdom2025-05-23
Maisha F Nicka1017France2025-05-18
Greenwood R Glick1018Brazil2025-06-12
Clifford J Ruta1019Russia2025-06-07
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Leon P CaudyFranceAsiya Javayant PROPOSAL
Alejandro X NestleJapanIoni Bowcher PROPOSAL
Greenwood J WieserUnited KingdomXuxue Feng NEW
Ivar M AmigonJapanIvan Magalhaes RENEWAL
Morrow U GillianSpainElwin Sharvill QUALIFIED
David T FerenczJapanAsiya Javayant NEGOTIATION
Faith Z StensethRussiaXuxue Feng PROPOSAL
David Y SlusarskiIndiaAnna Fali QUALIFIED
Sinclair O BriddickCanadaBernardo Dominic NEGOTIATION
Antonio Y RimItalyAnna Fali QUALIFIED
James T GillianGermanyAnna Fali NEW
James K RimBrazilOnyama Limba NEGOTIATION
Kaitlin H FigeroaItalyAsiya Javayant NEW
Alejandro E ChuiAustraliaAsiya Javayant NEW
Octavia B OstroskySpainAsiya Javayant NEGOTIATION
Cody X CaldareraSpainElwin Sharvill NEGOTIATION
Juan O FollerIndiaBernardo Dominic PROPOSAL
Darci N FlosiFranceOnyama Limba UNQUALIFIED
Darci Q NestleBrazilBernardo Dominic PROPOSAL
Jennifer T IturbideFranceElwin Sharvill QUALIFIED
Aditya N SlusarskiItalyXuxue Feng UNQUALIFIED
Faith M KolmetzFranceIvan Magalhaes NEW
Adams C FollerJapanXuxue Feng NEW
David Z OldroydArgentinaAnna Fali PROPOSAL
Kaitlin E VocelkaAustraliaAnna Fali PROPOSAL
David P VocelkaSpainOnyama Limba PROPOSAL
Izzy C StensethIndiaElwin Sharvill QUALIFIED
Deepesh S ChuiArgentinaIvan Magalhaes QUALIFIED
Adams B RoysterUnited KingdomIvan Magalhaes PROPOSAL
Mayumi G PaprockiGermanyElwin Sharvill QUALIFIED
Ashley Q FerenczUnited KingdomIoni Bowcher NEGOTIATION
David W ShinkoGermanyIoni Bowcher UNQUALIFIED
Deepesh B FerenczGermanyBernardo Dominic PROPOSAL
David W TollnerCanadaOnyama Limba NEW
Arvin U RutaIndiaBernardo Dominic PROPOSAL
Alejandro T RimUnited KingdomIoni Bowcher PROPOSAL
Juan J DilliardJapanStephen Shaw UNQUALIFIED
Maria G OstroskyItalyIvan Magalhaes NEW
Murillo F DoeAustraliaIoni Bowcher UNQUALIFIED
Leja T RoysterGermanyStephen Shaw 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>