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
Isabel P BowleyItalyAmy Elsner NEW
Faith W RoysterFranceElwin Sharvill RENEWAL
Jeanfrancois H BologniaGermanyAnna Fali UNQUALIFIED
Leja U BowleyJapanXuxue Feng PROPOSAL
Costa Z OstroskyFranceOnyama Limba NEW
Salvatore Q FollerUnited KingdomElwin Sharvill NEW
Aruna D PaprockiArgentinaStephen Shaw UNQUALIFIED
Aditya H SaylorsArgentinaAsiya Javayant RENEWAL
Jefferson K CampainSpainIoni Bowcher NEGOTIATION
Jennifer F GauchoJapanBernardo Dominic RENEWAL
Tony P RulapaughGermanyAnna Fali PROPOSAL
Aruna Q BologniaFranceOnyama Limba NEW
Leon O SergiJapanXuxue Feng NEGOTIATION
Mujtaba F MaletFranceAsiya Javayant NEW
Aika V BriddickIndiaBernardo Dominic QUALIFIED
Wickens Q OstroskyBrazilAnna Fali PROPOSAL
Mujtaba V WhobreyItalyXuxue Feng RENEWAL
Faith W BriddickCanadaOnyama Limba NEGOTIATION
Jefferson Q AmigonSpainAsiya Javayant UNQUALIFIED
Claire Y MaletRussiaIvan Magalhaes QUALIFIED
Adams R OstroskyFranceOnyama Limba NEGOTIATION
Kaitlin O VenereCanadaElwin Sharvill QUALIFIED
Rodrigues N BowleySpainAmy Elsner RENEWAL
Ashley K BowleyJapanOnyama Limba PROPOSAL
David O DoeUnited KingdomXuxue Feng QUALIFIED
James S RulapaughUnited KingdomAmy Elsner NEW
Rodrigues Q CaldareraAustraliaAnna Fali PROPOSAL
Clifford A StensethAustraliaBernardo Dominic UNQUALIFIED
Faith Y PerinAustraliaBernardo Dominic NEGOTIATION
Morrow Y WhobreyItalyIvan Magalhaes RENEWAL
Sinclair R AmigonSpainElwin Sharvill RENEWAL
Silvio Y ShinkoIndiaIvan Magalhaes NEGOTIATION
Deepesh A GauchoJapanStephen Shaw NEGOTIATION
Ashley D GlickCanadaOnyama Limba RENEWAL
Isabel P FollerItalyOnyama Limba UNQUALIFIED
Johnson T SchemmerRussiaAmy Elsner RENEWAL
Antonio U StensethBrazilAmy Elsner NEW
Aika K KolmetzFranceIoni Bowcher UNQUALIFIED
Jefferson P SaylorsJapanAnna Fali NEW
Johnson D NickaRussiaAnna Fali UNQUALIFIED
Deepesh H ButtCanadaAmy Elsner NEGOTIATION
Costa L PaprockiJapanAnna Fali UNQUALIFIED
Kaitlin C AmigonRussiaAsiya Javayant RENEWAL
Julie B RutaFranceAmy Elsner QUALIFIED
Costa N DoeAustraliaXuxue Feng UNQUALIFIED
Jennifer G CaldareraCanadaBernardo Dominic PROPOSAL
Misaki Y AmigonIndiaAnna Fali QUALIFIED
Maria J MaletBrazilElwin Sharvill NEGOTIATION
Aditya C RimSpainIvan Magalhaes UNQUALIFIED
Stacey P MorascaIndiaStephen Shaw NEW
Horizontal
NameCountryRepresentativeStatus
Kaitlin H MaletRussiaIvan Magalhaes RENEWAL
Rodrigues J SergiSpainIoni Bowcher NEW
Ivar M PaprockiItalyOnyama Limba RENEWAL
Clifford Z StockhamCanadaAsiya Javayant NEW
Nicolas I FollerJapanAnna Fali PROPOSAL
Johnson I StockhamBrazilIvan Magalhaes NEGOTIATION
Francesco F IturbideAustraliaAsiya Javayant NEW
Jones Q StockhamJapanOnyama Limba NEW
Rodrigues S DoeRussiaBernardo Dominic NEGOTIATION
Claire Y KolmetzUnited KingdomStephen Shaw PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Ricardo Y TollnerGermany2025-05-28Chanay, Jeffrey A Esq NEW17Stephen Shaw
1001Mujtaba T MorascaArgentina2025-06-05Feltz Printing Service QUALIFIED88Ivan Magalhaes
1002Deepesh D FlosiItaly2025-06-15Rousseaux, Michael Esq NEGOTIATION60Xuxue Feng
1003Murillo F CaudyRussia2025-06-09Truhlar And Truhlar Attys QUALIFIED23Ivan Magalhaes
1004Sinclair F CaldareraUnited Kingdom2025-05-23Chemel, James L Cpa RENEWAL7Asiya Javayant
1005Aditya I WhobreyIndia2025-05-30Truhlar And Truhlar Attys RENEWAL85Ivan Magalhaes
1006Misaki F PerinJapan2025-05-20King, Christopher A Esq RENEWAL91Elwin Sharvill
1007Mayumi O StensethArgentina2025-05-30Benton, John B Jr NEGOTIATION63Elwin Sharvill
1008Tony H ChuiArgentina2025-06-11Benton, John B Jr NEGOTIATION60Asiya Javayant
1009Antonio F MorascaJapan2025-05-20Printing Dimensions RENEWAL44Onyama Limba
1010Leon F MorascaBrazil2025-06-01Chapman, Ross E Esq NEGOTIATION58Elwin Sharvill
1011Misaki C ShinkoItaly2025-06-13Printing Dimensions UNQUALIFIED4Anna Fali
1012Leon Z CaldareraJapan2025-06-01Benton, John B Jr QUALIFIED59Xuxue Feng
1013Jennifer T DarakjyFrance2025-06-11King, Christopher A Esq QUALIFIED25Xuxue Feng
1014Arvin M IturbideIndia2025-06-05Chemel, James L Cpa NEW13Onyama Limba
1015Johnson J GauchoCanada2025-05-19Morlong Associates NEGOTIATION3Onyama Limba
1016Wickens K TollnerUnited Kingdom2025-06-15Dorl, James J Esq PROPOSAL39Ioni Bowcher
1017David P FlosiFrance2025-05-18Commercial Press NEGOTIATION83Asiya Javayant
1018Chavez P SaylorsSpain2025-06-06Rangoni Of Florence NEW53Bernardo Dominic
1019Aruna D GarufiUnited Kingdom2025-06-01Morlong Associates NEW35Stephen Shaw
1020Darci D MorascaJapan2025-05-20Chanay, Jeffrey A Esq NEGOTIATION92Xuxue Feng
1021Greenwood Y GillianCanada2025-06-06Feltz Printing Service PROPOSAL65Elwin Sharvill
1022Maisha C GarufiJapan2025-05-31Rangoni Of Florence RENEWAL73Ivan Magalhaes
1023Maria O BologniaIndia2025-06-12Rangoni Of Florence RENEWAL90Bernardo Dominic
1024Cody J KolmetzCanada2025-06-12Chanay, Jeffrey A Esq QUALIFIED12Anna Fali
1025David E PerinJapan2025-05-27Commercial Press QUALIFIED3Asiya Javayant
1026Rodrigues Q ChuiFrance2025-05-24King, Christopher A Esq PROPOSAL16Bernardo Dominic
1027Morrow F RoysterSpain2025-06-11Feltz Printing Service NEW86Elwin Sharvill
1028Deepesh Y WaycottBrazil2025-06-09Feltz Printing Service RENEWAL98Anna Fali
1029Jefferson E FerenczBrazil2025-05-27Benton, John B Jr UNQUALIFIED64Elwin Sharvill
1030Kadeem D RimUnited Kingdom2025-06-15Morlong Associates UNQUALIFIED64Ioni Bowcher
1031Jennifer G BriddickCanada2025-06-14Buckley Miller Wright QUALIFIED61Anna Fali
1032Salvatore K SaylorsJapan2025-06-14Chapman, Ross E Esq QUALIFIED29Stephen Shaw
1033Ivar H FlosiCanada2025-05-21Chemel, James L Cpa NEW52Onyama Limba
1034James E BologniaAustralia2025-06-02Buckley Miller Wright NEGOTIATION51Stephen Shaw
1035Juan C RimUnited Kingdom2025-05-27Truhlar And Truhlar Attys PROPOSAL8Ioni Bowcher
1036Clifford Q TollnerCanada2025-06-08Feiner Bros QUALIFIED57Onyama Limba
1037Jones Y IturbideFrance2025-06-07Rousseaux, Michael Esq UNQUALIFIED23Asiya Javayant
1038Wickens W InouyeJapan2025-05-30Dorl, James J Esq PROPOSAL83Ivan Magalhaes
1039Deepesh F AlbaresBrazil2025-06-04Feltz Printing Service NEGOTIATION61Elwin Sharvill
1040Kadeem P FlosiSpain2025-05-19Printing Dimensions PROPOSAL18Anna Fali
1041Jefferson D KolmetzAustralia2025-05-19Commercial Press PROPOSAL36Stephen Shaw
1042Jeanfrancois Y PerinIndia2025-06-11Feltz Printing Service NEW75Bernardo Dominic
1043Alejandro E VenereJapan2025-05-28Chapman, Ross E Esq RENEWAL18Amy Elsner
1044Ricardo A CaudyIndia2025-06-02Printing Dimensions NEGOTIATION32Ioni Bowcher
1045Jefferson R ChuiAustralia2025-06-08Chanay, Jeffrey A Esq UNQUALIFIED25Anna Fali
1046David G PoquetteCanada2025-05-25Benton, John B Jr PROPOSAL20Ioni Bowcher
1047Arvin K RimItaly2025-05-21Buckley Miller Wright NEGOTIATION35Asiya Javayant
1048Emily B CaldareraFrance2025-05-19Commercial Press UNQUALIFIED22Asiya Javayant
1049Leja L RutaUnited Kingdom2025-05-18Rangoni Of Florence QUALIFIED97Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Silvio E MaletItalyAsiya Javayant NEW
Adams S ButtAustraliaStephen Shaw PROPOSAL
Greenwood D RoysterIndiaBernardo Dominic RENEWAL
Salvatore D BologniaItalyAsiya Javayant RENEWAL
Misaki G ButtSpainIvan Magalhaes NEW
Kadeem W ButtArgentinaXuxue Feng QUALIFIED
Salvatore C ButtAustraliaStephen Shaw QUALIFIED
Mayumi R AmigonGermanyOnyama Limba NEW
Isabel D AmigonAustraliaAsiya Javayant UNQUALIFIED
Darci S AmigonSpainAnna Fali PROPOSAL
Wickens W CaldareraCanadaXuxue Feng PROPOSAL
Johnson H WaycottFranceIvan Magalhaes NEW
James G OstroskyCanadaIoni Bowcher PROPOSAL
Ashley B GlickGermanyIoni Bowcher RENEWAL
Aditya M CaldareraAustraliaXuxue Feng NEW
Silvio H DarakjyRussiaIoni Bowcher PROPOSAL
Murillo F RoysterRussiaElwin Sharvill QUALIFIED
Leon X SergiItalyIoni Bowcher UNQUALIFIED
David V OstroskySpainOnyama Limba PROPOSAL
Smith L NestleFranceAnna Fali UNQUALIFIED
Leon Y SchemmerGermanyOnyama Limba PROPOSAL
James J AmigonItalyIvan Magalhaes QUALIFIED
Izzy W MorascaRussiaStephen Shaw NEW
Maisha C VocelkaUnited KingdomElwin Sharvill UNQUALIFIED
Salvatore S RimIndiaAsiya Javayant NEGOTIATION
Sinclair F CampainGermanyIoni Bowcher RENEWAL
Nicolas J OstroskyArgentinaIvan Magalhaes PROPOSAL
Ricardo M PerinAustraliaStephen Shaw NEGOTIATION
Aditya T PerinArgentinaElwin Sharvill RENEWAL
Izzy C AlbaresSpainAmy Elsner QUALIFIED
Juan O TollnerFranceBernardo Dominic QUALIFIED
Isabel Z SchemmerRussiaStephen Shaw NEGOTIATION
Costa V PerinCanadaAmy Elsner UNQUALIFIED
Johnson A SchemmerBrazilBernardo Dominic QUALIFIED
Maisha U FlosiAustraliaIoni Bowcher RENEWAL
Francesco N AlbaresIndiaOnyama Limba RENEWAL
Deepesh B MorascaJapanStephen Shaw RENEWAL
Deepesh Y SchemmerGermanyAnna Fali UNQUALIFIED
Arvin S BriddickArgentinaAsiya Javayant RENEWAL
Johnson U PaprockiJapanBernardo Dominic RENEWAL
Stacey U BologniaUnited KingdomAsiya Javayant NEGOTIATION
Jefferson L ShinkoItalyBernardo Dominic PROPOSAL
Kaitlin R FollerFranceElwin Sharvill UNQUALIFIED
Octavia F ButtJapanBernardo Dominic UNQUALIFIED
Nicolas X CaudySpainAmy Elsner PROPOSAL
Kadeem R KolmetzBrazilAsiya Javayant PROPOSAL
Kadeem I RimBrazilStephen Shaw UNQUALIFIED
Izzy R AlbaresBrazilIoni Bowcher UNQUALIFIED
Claire F MaletCanadaBernardo Dominic RENEWAL
Ricardo O DilliardBrazilElwin Sharvill PROPOSAL
Frozen Columns
Name
Ashley N Tollner
Munro D Kolmetz
David U Perin
Johnson K Inouye
Greenwood R Ostrosky
Stacey N Malet
David W Sergi
Stacey G Doe
Smith O Stockham
Smith P Inouye
Ricardo L Vocelka
Rodrigues L Ruta
Maria H Flosi
Jeanfrancois T Morasca
Leon C Ostrosky
Johnson R Wieser
Darci B Morasca
Aika D Sergi
Murillo M Kolmetz
Ashley X Gaucho
Rodrigues R Kolmetz
Costa D Bowley
Leja K Doe
Nicolas H Sergi
Johnson Y Bolognia
Clifford G Caudy
Maria C Flosi
Aika A Marrier
Alejandro I Bolognia
David J Figeroa
Aditya H Ostrosky
Wickens L Tollner
Murillo N Nicka
Maria I Dilliard
Maria F Schemmer
Alejandro U Waycott
David F Poquette
Jefferson P Butt
Ashley J Rim
Kaitlin E Albares
Chavez I Butt
Silvio I Kusko
James B Briddick
Maisha Z Shinko
Costa Y Kusko
Adams T Royster
Darci U Marrier
Chavez V Stenseth
Leja D Stockham
Tony T Chui
IdCountryDate
1000Argentina2025-06-14
1001Russia2025-05-25
1002France2025-06-01
1003Italy2025-06-13
1004France2025-06-04
1005France2025-06-01
1006Italy2025-06-09
1007Italy2025-05-19
1008United Kingdom2025-05-31
1009France2025-05-20
1010Italy2025-06-15
1011Australia2025-06-01
1012Russia2025-06-11
1013Brazil2025-05-22
1014Japan2025-06-12
1015India2025-06-11
1016France2025-06-13
1017Russia2025-05-22
1018Germany2025-05-22
1019India2025-05-24
1020Canada2025-05-23
1021United Kingdom2025-06-10
1022Russia2025-05-19
1023Spain2025-05-23
1024India2025-05-18
1025Brazil2025-06-10
1026Japan2025-06-15
1027Australia2025-06-09
1028Italy2025-06-02
1029Argentina2025-05-20
1030Russia2025-05-31
1031Russia2025-06-04
1032France2025-05-20
1033Russia2025-05-30
1034Brazil2025-05-27
1035India2025-05-19
1036France2025-06-11
1037Canada2025-06-05
1038France2025-06-01
1039Germany2025-06-13
1040Argentina2025-05-28
1041France2025-05-23
1042Italy2025-05-23
1043Australia2025-06-16
1044France2025-05-29
1045Canada2025-06-06
1046Russia2025-05-22
1047Germany2025-05-18
1048Japan2025-05-27
1049Germany2025-05-22

On-Demand Data

NameIdCountryDate
Cody A Rulapaugh1000India2025-06-01
Darci R Campain1001Brazil2025-06-05
Claire D Ostrosky1002United Kingdom2025-06-02
Jennifer P Shinko1003Italy2025-05-18
Rodrigues B Tollner1004France2025-06-15
Smith A Garufi1005Japan2025-06-15
Salvatore B Nestle1006Spain2025-05-24
Costa N Doe1007Italy2025-06-07
Sinclair A Slusarski1008United Kingdom2025-05-29
Murillo R Malet1009Brazil2025-05-22
Emily O Gillian1010United Kingdom2025-05-22
Julie W Kusko1011Russia2025-06-02
Mujtaba B Stockham1012Japan2025-06-06
Adams P Ferencz1013Spain2025-05-29
Jefferson I Nicka1014Spain2025-06-07
Smith Z Venere1015Russia2025-05-19
Smith O Shinko1016Spain2025-05-26
Rodrigues Y Sergi1017France2025-06-08
Sinclair P Butt1018France2025-06-10
Murillo I Sergi1019Spain2025-05-22
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Isabel D OstroskyItalyXuxue Feng QUALIFIED
Clifford P BologniaRussiaAsiya Javayant NEGOTIATION
Munro D BriddickGermanyIvan Magalhaes NEW
Aruna K RimSpainAnna Fali QUALIFIED
David Y MarrierGermanyOnyama Limba UNQUALIFIED
David R BriddickJapanStephen Shaw PROPOSAL
David J GlickJapanAnna Fali NEW
Antonio P SaylorsAustraliaXuxue Feng PROPOSAL
Julie W KuskoBrazilStephen Shaw NEW
Izzy L MarrierGermanyBernardo Dominic NEW
Leon K MaletRussiaIoni Bowcher PROPOSAL
Arvin F RoysterCanadaAmy Elsner PROPOSAL
Greenwood Z MarrierItalyXuxue Feng PROPOSAL
Emily M StockhamJapanAsiya Javayant QUALIFIED
Mayumi A VenereGermanyBernardo Dominic RENEWAL
Chavez D RutaArgentinaAsiya Javayant NEW
Izzy B RimIndiaXuxue Feng RENEWAL
Aditya R VocelkaFranceAnna Fali PROPOSAL
Johnson A VenereIndiaOnyama Limba NEGOTIATION
Emily E ButtRussiaStephen Shaw PROPOSAL
Maisha Q MorascaFranceAnna Fali UNQUALIFIED
Salvatore L MorascaBrazilOnyama Limba PROPOSAL
Murillo D StensethUnited KingdomStephen Shaw PROPOSAL
Faith Z MarrierAustraliaOnyama Limba PROPOSAL
Isabel Z OldroydRussiaElwin Sharvill RENEWAL
Murillo B OldroydCanadaElwin Sharvill NEW
Adams Z RoysterUnited KingdomAmy Elsner QUALIFIED
Aika O FlosiRussiaXuxue Feng NEW
Rodrigues P FerenczRussiaIoni Bowcher NEW
Izzy G FlosiRussiaIvan Magalhaes NEGOTIATION
Salvatore F SchemmerAustraliaElwin Sharvill RENEWAL
Maria V RulapaughJapanElwin Sharvill QUALIFIED
Jones X FlosiIndiaOnyama Limba NEW
Aditya F OstroskyBrazilStephen Shaw QUALIFIED
Octavia C FlosiGermanyXuxue Feng PROPOSAL
Ivar D BowleyIndiaXuxue Feng RENEWAL
Salvatore N IturbideAustraliaIoni Bowcher NEW
Stacey G BologniaRussiaAnna Fali NEW
Jones I PaprockiUnited KingdomAsiya Javayant NEW
Adams P BriddickArgentinaAnna Fali 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>