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
Smith P CaudyBrazilAsiya Javayant QUALIFIED
Stacey M StockhamCanadaAsiya Javayant NEGOTIATION
Darci J MaletRussiaAsiya Javayant QUALIFIED
Deepesh X DarakjyAustraliaOnyama Limba RENEWAL
Julie C MorascaBrazilAsiya Javayant QUALIFIED
Munro Y MarrierJapanOnyama Limba NEW
Ricardo D BowleyUnited KingdomElwin Sharvill PROPOSAL
Darci U KolmetzItalyAsiya Javayant RENEWAL
Leon V RutaSpainBernardo Dominic NEW
Ricardo Q GlickCanadaElwin Sharvill NEGOTIATION
Greenwood T WaycottBrazilOnyama Limba NEW
Mujtaba G InouyeAustraliaAsiya Javayant PROPOSAL
Leon H RutaSpainOnyama Limba QUALIFIED
Mujtaba O FigeroaItalyAmy Elsner NEGOTIATION
Salvatore U SchemmerCanadaIoni Bowcher QUALIFIED
Mujtaba Z TollnerFranceAmy Elsner UNQUALIFIED
Leja A WaycottCanadaIoni Bowcher NEGOTIATION
Greenwood L DilliardIndiaStephen Shaw QUALIFIED
Faith N FerenczCanadaAmy Elsner QUALIFIED
Leja E NickaArgentinaStephen Shaw PROPOSAL
Darci I NickaCanadaBernardo Dominic RENEWAL
Mujtaba X PaprockiIndiaOnyama Limba PROPOSAL
Jefferson B MarrierGermanyAsiya Javayant QUALIFIED
Rodrigues C GillianArgentinaXuxue Feng UNQUALIFIED
Cody N RoysterJapanIoni Bowcher NEW
Sinclair Y InouyeFranceIvan Magalhaes PROPOSAL
Jennifer Y RoysterBrazilElwin Sharvill RENEWAL
Claire G KuskoRussiaOnyama Limba NEGOTIATION
Izzy M StockhamUnited KingdomXuxue Feng PROPOSAL
Greenwood B SchemmerAustraliaElwin Sharvill UNQUALIFIED
Cody K WhobreyUnited KingdomAnna Fali RENEWAL
Morrow R VocelkaSpainIvan Magalhaes UNQUALIFIED
Ashley U TollnerFranceIvan Magalhaes RENEWAL
Misaki Q VenereAustraliaIvan Magalhaes PROPOSAL
Rodrigues R VocelkaArgentinaElwin Sharvill PROPOSAL
Jones F MacleadBrazilAnna Fali NEW
Jefferson M MarrierUnited KingdomBernardo Dominic RENEWAL
Tony V OstroskyFranceElwin Sharvill NEGOTIATION
Ricardo D DilliardGermanyElwin Sharvill UNQUALIFIED
Clifford N CaudyFranceElwin Sharvill PROPOSAL
Salvatore Q CaudyAustraliaElwin Sharvill PROPOSAL
Leja I AlbaresUnited KingdomAmy Elsner NEGOTIATION
Juan B MarrierIndiaBernardo Dominic QUALIFIED
Jennifer A AmigonFranceIvan Magalhaes NEGOTIATION
David Z WhobreyBrazilElwin Sharvill PROPOSAL
Rodrigues V DarakjyItalyAmy Elsner PROPOSAL
James Q RutaArgentinaOnyama Limba RENEWAL
Murillo Q ShinkoCanadaElwin Sharvill NEW
Ricardo W RoysterCanadaIvan Magalhaes PROPOSAL
Julie G VenereBrazilIvan Magalhaes PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Julie I NickaJapanAnna Fali RENEWAL
Juan W InouyeJapanAsiya Javayant RENEWAL
Jefferson D InouyeCanadaAmy Elsner QUALIFIED
Jones O KolmetzItalyBernardo Dominic NEGOTIATION
David S VenereIndiaIoni Bowcher PROPOSAL
Arvin V OstroskyArgentinaIvan Magalhaes NEW
Jefferson F FollerUnited KingdomAsiya Javayant UNQUALIFIED
Ricardo A GarufiFranceIvan Magalhaes PROPOSAL
Ricardo X MaletFranceElwin Sharvill QUALIFIED
Munro X MacleadFranceAsiya Javayant NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000James Q ButtGermany2025-03-31Buckley Miller Wright NEGOTIATION35Elwin Sharvill
1001Izzy P FollerItaly2025-04-27Dorl, James J Esq PROPOSAL53Stephen Shaw
1002Leon L SaylorsSpain2025-04-28Feiner Bros NEW83Ivan Magalhaes
1003Isabel X WaycottBrazil2025-04-15Benton, John B Jr NEGOTIATION95Xuxue Feng
1004Rodrigues S WieserRussia2025-04-26Buckley Miller Wright NEW17Bernardo Dominic
1005Misaki W MacleadRussia2025-04-24Truhlar And Truhlar Attys UNQUALIFIED81Ioni Bowcher
1006Jennifer U MacleadJapan2025-04-11Chanay, Jeffrey A Esq NEW50Amy Elsner
1007Rodrigues G MaletUnited Kingdom2025-04-23Chemel, James L Cpa NEGOTIATION71Elwin Sharvill
1008Kadeem H DarakjyGermany2025-04-19Buckley Miller Wright QUALIFIED1Xuxue Feng
1009Jefferson S GillianArgentina2025-04-18Chanay, Jeffrey A Esq PROPOSAL73Ivan Magalhaes
1010Wickens I SlusarskiJapan2025-04-14Feltz Printing Service NEGOTIATION39Ioni Bowcher
1011Adams W TollnerIndia2025-04-22Morlong Associates RENEWAL76Amy Elsner
1012Julie V AmigonGermany2025-04-28Feiner Bros NEW4Onyama Limba
1013Leon C BologniaBrazil2025-04-03Feiner Bros NEGOTIATION61Elwin Sharvill
1014Ricardo H NestleGermany2025-04-01King, Christopher A Esq NEW76Asiya Javayant
1015Maisha M RutaGermany2025-04-04Chemel, James L Cpa QUALIFIED20Ioni Bowcher
1016Morrow X SlusarskiUnited Kingdom2025-04-25Feltz Printing Service NEW3Bernardo Dominic
1017Jefferson Y SergiFrance2025-04-03Chemel, James L Cpa NEW9Anna Fali
1018Ashley F OstroskyGermany2025-04-20Feltz Printing Service UNQUALIFIED32Xuxue Feng
1019Smith L ChuiUnited Kingdom2025-04-01Chanay, Jeffrey A Esq RENEWAL37Xuxue Feng
1020Nicolas H GlickRussia2025-04-07Morlong Associates NEGOTIATION88Ioni Bowcher
1021Johnson S GillianItaly2025-03-31Dorl, James J Esq NEGOTIATION22Bernardo Dominic
1022Ricardo K MorascaItaly2025-04-10Commercial Press NEW76Onyama Limba
1023Deepesh G MorascaCanada2025-04-27Benton, John B Jr UNQUALIFIED36Asiya Javayant
1024Julie E SergiArgentina2025-04-20Feltz Printing Service NEW91Bernardo Dominic
1025Alejandro X SchemmerCanada2025-04-14Feiner Bros RENEWAL44Stephen Shaw
1026Maria M SchemmerSpain2025-04-07Benton, John B Jr RENEWAL9Elwin Sharvill
1027Silvio A MorascaGermany2025-04-16Chemel, James L Cpa PROPOSAL58Xuxue Feng
1028Costa Z ButtUnited Kingdom2025-04-23Commercial Press NEW76Asiya Javayant
1029Leon T SergiGermany2025-04-21Printing Dimensions QUALIFIED9Anna Fali
1030Faith A FollerItaly2025-04-28Chapman, Ross E Esq NEW62Bernardo Dominic
1031Juan K MorascaGermany2025-04-22Buckley Miller Wright NEW17Asiya Javayant
1032Faith Z DilliardFrance2025-04-18Buckley Miller Wright PROPOSAL42Asiya Javayant
1033Antonio V CaudyBrazil2025-04-12Chanay, Jeffrey A Esq NEW79Ivan Magalhaes
1034Isabel L MacleadBrazil2025-04-09Printing Dimensions PROPOSAL97Anna Fali
1035Wickens F OstroskyJapan2025-04-22Buckley Miller Wright NEW21Asiya Javayant
1036Darci Z FollerArgentina2025-04-08Commercial Press NEGOTIATION88Stephen Shaw
1037Isabel E InouyeIndia2025-04-22Printing Dimensions UNQUALIFIED10Elwin Sharvill
1038Clifford L SaylorsCanada2025-04-04Feltz Printing Service RENEWAL38Amy Elsner
1039Juan E VenereGermany2025-04-18Commercial Press PROPOSAL18Anna Fali
1040Leja H VocelkaIndia2025-04-22Printing Dimensions UNQUALIFIED61Asiya Javayant
1041Deepesh T MarrierRussia2025-04-20Buckley Miller Wright RENEWAL92Stephen Shaw
1042Morrow O GillianJapan2025-04-12Dorl, James J Esq NEGOTIATION96Stephen Shaw
1043Stacey P GillianCanada2025-04-28Chapman, Ross E Esq NEGOTIATION22Anna Fali
1044James U WieserCanada2025-04-13Truhlar And Truhlar Attys QUALIFIED1Bernardo Dominic
1045Wickens P KuskoItaly2025-04-21Chanay, Jeffrey A Esq QUALIFIED11Bernardo Dominic
1046Maria P SaylorsBrazil2025-04-27Feiner Bros PROPOSAL60Anna Fali
1047Antonio L VenereAustralia2025-04-25Dorl, James J Esq QUALIFIED77Stephen Shaw
1048Greenwood H BriddickAustralia2025-04-08Chanay, Jeffrey A Esq QUALIFIED85Stephen Shaw
1049Emily V PoquetteFrance2025-04-01Commercial Press RENEWAL73Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Misaki P BriddickIndiaBernardo Dominic NEGOTIATION
Antonio M FigeroaAustraliaAsiya Javayant QUALIFIED
Aruna G PoquetteFranceStephen Shaw NEW
Clifford C WieserUnited KingdomAnna Fali NEW
Morrow M KuskoAustraliaAsiya Javayant UNQUALIFIED
Chavez U MorascaCanadaAnna Fali NEGOTIATION
Jennifer H KolmetzSpainAsiya Javayant QUALIFIED
Johnson T NestleCanadaElwin Sharvill QUALIFIED
James Y ButtAustraliaBernardo Dominic NEGOTIATION
Misaki M IturbideItalyAmy Elsner NEGOTIATION
Octavia Y TollnerBrazilBernardo Dominic RENEWAL
Salvatore P ButtFranceXuxue Feng UNQUALIFIED
Jennifer J PaprockiCanadaXuxue Feng UNQUALIFIED
Alejandro P GillianRussiaBernardo Dominic UNQUALIFIED
Adams L NestleGermanyBernardo Dominic NEGOTIATION
Smith C ButtItalyOnyama Limba UNQUALIFIED
Juan S WaycottGermanyBernardo Dominic QUALIFIED
Nicolas T PerinRussiaAnna Fali UNQUALIFIED
Munro U DarakjyIndiaAnna Fali QUALIFIED
Emily C WieserItalyElwin Sharvill NEW
Claire U IturbideRussiaOnyama Limba NEGOTIATION
Stacey E ChuiRussiaBernardo Dominic PROPOSAL
Claire J RoysterFranceIoni Bowcher NEGOTIATION
Aditya M MaletSpainIvan Magalhaes NEW
Kaitlin A GlickBrazilElwin Sharvill PROPOSAL
Leon C DarakjyCanadaAmy Elsner NEW
Ivar F SlusarskiIndiaStephen Shaw NEW
Faith Y StockhamArgentinaOnyama Limba NEW
Morrow Q ButtUnited KingdomXuxue Feng PROPOSAL
Aruna U WhobreyArgentinaIvan Magalhaes PROPOSAL
Munro U CaudyRussiaElwin Sharvill NEW
Tony T RimGermanyAsiya Javayant NEGOTIATION
Adams N InouyeBrazilAsiya Javayant RENEWAL
Clifford B ChuiBrazilXuxue Feng UNQUALIFIED
Rodrigues Y FollerArgentinaIvan Magalhaes UNQUALIFIED
Sinclair G BriddickGermanyAsiya Javayant NEGOTIATION
Julie J InouyeAustraliaAmy Elsner NEW
Rodrigues U VocelkaFranceOnyama Limba RENEWAL
James H AmigonItalyAsiya Javayant UNQUALIFIED
Faith J GlickUnited KingdomIoni Bowcher QUALIFIED
Nicolas E KolmetzArgentinaStephen Shaw NEW
Silvio O InouyeBrazilAmy Elsner NEGOTIATION
Alejandro O FerenczIndiaOnyama Limba RENEWAL
Adams S ChuiCanadaStephen Shaw UNQUALIFIED
Mujtaba G BologniaBrazilAnna Fali QUALIFIED
Jefferson D KolmetzAustraliaElwin Sharvill NEGOTIATION
Maria Q WieserArgentinaBernardo Dominic NEW
Aditya X GauchoBrazilBernardo Dominic NEW
Maria Z FlosiUnited KingdomIvan Magalhaes RENEWAL
Costa X IturbideAustraliaStephen Shaw NEGOTIATION
Frozen Columns
Name
Munro W Darakjy
Ivar M Ruta
Adams C Ostrosky
Aika V Venere
Emily D Vocelka
Octavia Q Sergi
Kadeem U Dilliard
Salvatore Q Ferencz
Greenwood Q Figeroa
Clifford Y Campain
Clifford H Kolmetz
Maria E Slusarski
Octavia G Oldroyd
Kaitlin H Rim
Ivar U Malet
Aruna K Schemmer
Emily X Rim
Chavez P Whobrey
Salvatore D Vocelka
Silvio Z Glick
Silvio P Oldroyd
Silvio T Albares
Munro Y Rim
Octavia K Rulapaugh
Wickens Q Oldroyd
Munro D Kolmetz
Jennifer R Gillian
Darci D Malet
Rodrigues I Poquette
Sinclair D Paprocki
Aruna N Glick
Jeanfrancois V Saylors
Kadeem A Stenseth
David O Inouye
Faith J Garufi
Emily E Chui
Munro C Shinko
Juan E Foller
David F Slusarski
Cody H Ostrosky
David V Campain
Stacey V Poquette
James W Gillian
Misaki D Marrier
David W Rulapaugh
Maisha B Nestle
Johnson L Kusko
Izzy C Gillian
Tony I Bolognia
Octavia Y Rim
IdCountryDate
1000United Kingdom2025-04-19
1001Spain2025-04-26
1002India2025-04-01
1003Canada2025-04-10
1004Spain2025-04-17
1005Canada2025-04-09
1006Germany2025-04-17
1007Germany2025-04-03
1008France2025-04-16
1009Canada2025-04-03
1010Australia2025-04-11
1011India2025-04-04
1012France2025-04-20
1013Spain2025-04-15
1014Canada2025-04-10
1015Japan2025-04-04
1016France2025-04-09
1017Brazil2025-04-28
1018India2025-04-25
1019Argentina2025-04-06
1020India2025-04-09
1021Italy2025-04-20
1022Australia2025-04-07
1023India2025-04-10
1024Brazil2025-04-24
1025Italy2025-04-07
1026Canada2025-04-01
1027Spain2025-04-27
1028Japan2025-04-16
1029Australia2025-04-25
1030Russia2025-04-15
1031United Kingdom2025-04-01
1032Germany2025-04-03
1033Japan2025-04-16
1034Canada2025-04-07
1035India2025-04-06
1036Brazil2025-04-22
1037Australia2025-03-31
1038Russia2025-04-19
1039Italy2025-04-21
1040Italy2025-04-15
1041Argentina2025-04-04
1042Canada2025-04-01
1043Australia2025-03-31
1044Russia2025-04-28
1045Italy2025-04-23
1046Japan2025-04-03
1047Brazil2025-04-11
1048France2025-04-18
1049Germany2025-04-13

On-Demand Data

NameIdCountryDate
Johnson P Waycott1000Japan2025-04-21
Silvio L Caldarera1001United Kingdom2025-04-09
Cody T Perin1002Australia2025-04-25
Antonio Q Gillian1003Spain2025-04-21
Maria A Albares1004Japan2025-04-21
Claire P Amigon1005Australia2025-04-28
Jeanfrancois R Wieser1006Japan2025-04-02
Murillo Z Kusko1007Russia2025-04-04
Izzy X Saylors1008Argentina2025-04-10
Costa D Doe1009Japan2025-04-19
Faith C Maclead1010India2025-04-21
Sinclair G Nestle1011Russia2025-04-23
Leon Z Malet1012Italy2025-04-02
Antonio G Royster1013Canada2025-04-16
Smith U Flosi1014Canada2025-04-28
Jeanfrancois Y Stockham1015United Kingdom2025-04-24
Ivar W Vocelka1016Spain2025-04-05
Chavez G Shinko1017Germany2025-04-09
Kadeem C Ruta1018United Kingdom2025-04-15
Rodrigues M Schemmer1019Brazil2025-04-23
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Sinclair L FollerUnited KingdomXuxue Feng NEGOTIATION
Kadeem D ShinkoRussiaStephen Shaw PROPOSAL
Maisha U MorascaBrazilStephen Shaw NEW
Julie S IturbideItalyAsiya Javayant NEGOTIATION
Leja L SlusarskiItalyIoni Bowcher NEW
Rodrigues N VocelkaAustraliaIvan Magalhaes NEGOTIATION
Kadeem I NickaArgentinaAnna Fali NEGOTIATION
Claire Z RulapaughFranceAsiya Javayant NEW
Octavia W BriddickAustraliaElwin Sharvill PROPOSAL
Mayumi O FerenczFranceAmy Elsner QUALIFIED
Jeanfrancois K RulapaughAustraliaElwin Sharvill NEW
Claire J BriddickIndiaElwin Sharvill RENEWAL
Aditya F WieserUnited KingdomBernardo Dominic PROPOSAL
Isabel Y AlbaresJapanBernardo Dominic PROPOSAL
Emily Y RimRussiaOnyama Limba RENEWAL
Chavez H StockhamBrazilElwin Sharvill PROPOSAL
Morrow Y PerinItalyOnyama Limba NEGOTIATION
Claire P SaylorsCanadaBernardo Dominic RENEWAL
Stacey T KuskoArgentinaAsiya Javayant QUALIFIED
Tony G FigeroaBrazilXuxue Feng UNQUALIFIED
Murillo F AlbaresFranceAnna Fali NEGOTIATION
Murillo Z MaletCanadaAmy Elsner NEW
Adams C CaudyArgentinaIvan Magalhaes PROPOSAL
Ivar Q GauchoCanadaBernardo Dominic QUALIFIED
Clifford B CaldareraGermanyStephen Shaw QUALIFIED
Cody P AmigonGermanyXuxue Feng PROPOSAL
Jeanfrancois A PoquetteSpainIvan Magalhaes NEGOTIATION
Aditya W StockhamGermanyXuxue Feng UNQUALIFIED
Leon T FollerItalyBernardo Dominic RENEWAL
Aditya U CaudyAustraliaStephen Shaw PROPOSAL
Isabel Q DilliardJapanStephen Shaw UNQUALIFIED
Costa A PoquetteAustraliaAnna Fali QUALIFIED
Ivar P BriddickRussiaAsiya Javayant NEW
Leon E NestleArgentinaIoni Bowcher NEW
Morrow S SaylorsItalyElwin Sharvill UNQUALIFIED
Murillo P GarufiJapanXuxue Feng RENEWAL
Alejandro H AlbaresSpainStephen Shaw RENEWAL
Jefferson Y DilliardJapanIoni Bowcher PROPOSAL
Ashley S BowleySpainStephen Shaw RENEWAL
Adams M SaylorsAustraliaAsiya Javayant PROPOSAL

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