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
Octavia X GarufiSpainAmy Elsner NEGOTIATION
Arvin M PoquetteArgentinaStephen Shaw UNQUALIFIED
Mujtaba A StensethIndiaAnna Fali UNQUALIFIED
Mayumi K ShinkoUnited KingdomXuxue Feng NEGOTIATION
Johnson A RimJapanIvan Magalhaes PROPOSAL
Misaki L BowleyRussiaBernardo Dominic PROPOSAL
Octavia E VenereArgentinaAmy Elsner NEW
Mujtaba Y WhobreyAustraliaIoni Bowcher UNQUALIFIED
Clifford C RulapaughBrazilIoni Bowcher NEW
Murillo N CaldareraArgentinaAsiya Javayant QUALIFIED
Kadeem B TollnerFranceAsiya Javayant QUALIFIED
Darci C StensethFranceAmy Elsner QUALIFIED
Smith Q SaylorsRussiaAmy Elsner PROPOSAL
Ricardo Q AmigonArgentinaAmy Elsner PROPOSAL
Jones B WaycottGermanyIvan Magalhaes NEGOTIATION
David L CampainGermanyBernardo Dominic NEW
Darci J DoeGermanyAsiya Javayant UNQUALIFIED
Greenwood S IturbideItalyXuxue Feng RENEWAL
Cody C DarakjySpainAmy Elsner QUALIFIED
Johnson G StockhamCanadaIoni Bowcher QUALIFIED
Ashley Z IturbideUnited KingdomAnna Fali QUALIFIED
Maisha Y MaletSpainBernardo Dominic NEW
Wickens Q PoquetteCanadaAsiya Javayant NEW
Johnson N GillianFranceIvan Magalhaes NEW
Johnson O IturbideAustraliaAsiya Javayant UNQUALIFIED
Morrow X TollnerSpainStephen Shaw QUALIFIED
Claire Z WhobreyArgentinaAnna Fali RENEWAL
Johnson N VenereAustraliaXuxue Feng PROPOSAL
Ricardo B FigeroaCanadaAmy Elsner NEW
Antonio U ButtSpainStephen Shaw PROPOSAL
Morrow Y GillianFranceIoni Bowcher RENEWAL
Munro M WhobreyIndiaAmy Elsner NEW
Juan X NickaArgentinaAsiya Javayant QUALIFIED
Claire H OstroskyJapanXuxue Feng NEW
Aika R ShinkoJapanXuxue Feng NEW
Ivar Y WaycottAustraliaAnna Fali QUALIFIED
Wickens Q DilliardGermanyIoni Bowcher PROPOSAL
Alejandro X KolmetzSpainElwin Sharvill UNQUALIFIED
Octavia T BriddickRussiaAnna Fali NEGOTIATION
Octavia H KuskoIndiaIoni Bowcher UNQUALIFIED
Jeanfrancois G StensethJapanAnna Fali NEW
Izzy G SaylorsUnited KingdomAmy Elsner QUALIFIED
Silvio L FlosiRussiaXuxue Feng NEW
David W IturbideFranceAmy Elsner UNQUALIFIED
Mayumi I SaylorsAustraliaIoni Bowcher NEW
Isabel W PaprockiBrazilIoni Bowcher NEW
Silvio C RimArgentinaXuxue Feng NEW
Aruna D GarufiGermanyStephen Shaw UNQUALIFIED
Jones E SchemmerGermanyStephen Shaw QUALIFIED
Faith W RulapaughBrazilIoni Bowcher RENEWAL
Horizontal
NameCountryRepresentativeStatus
Jennifer N NickaFranceStephen Shaw NEW
Salvatore E NestleGermanyAnna Fali PROPOSAL
Johnson K NickaJapanIoni Bowcher NEGOTIATION
Leja N MorascaAustraliaBernardo Dominic UNQUALIFIED
Aika V OldroydUnited KingdomElwin Sharvill UNQUALIFIED
Salvatore Y CaldareraAustraliaBernardo Dominic QUALIFIED
Jeanfrancois T StockhamFranceXuxue Feng NEGOTIATION
Antonio O StockhamArgentinaStephen Shaw PROPOSAL
Murillo Y TollnerSpainXuxue Feng RENEWAL
Darci T NestleCanadaStephen Shaw QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Isabel C ShinkoAustralia2025-04-08Feltz Printing Service QUALIFIED29Onyama Limba
1001Misaki A RoysterFrance2025-04-13Rousseaux, Michael Esq RENEWAL57Bernardo Dominic
1002Ricardo P SchemmerBrazil2025-04-29Rousseaux, Michael Esq UNQUALIFIED49Ivan Magalhaes
1003Cody Z RimJapan2025-04-23Printing Dimensions QUALIFIED9Ivan Magalhaes
1004Ricardo Y DoeRussia2025-04-06Feiner Bros PROPOSAL54Ioni Bowcher
1005Tony K WaycottCanada2025-04-08Rangoni Of Florence NEGOTIATION92Anna Fali
1006Francesco C BriddickGermany2025-04-08Buckley Miller Wright PROPOSAL69Anna Fali
1007Kadeem O FigeroaGermany2025-04-30Truhlar And Truhlar Attys NEGOTIATION16Elwin Sharvill
1008Rodrigues R InouyeArgentina2025-04-05Truhlar And Truhlar Attys PROPOSAL3Amy Elsner
1009Ivar Z DoeRussia2025-04-23Chemel, James L Cpa UNQUALIFIED13Asiya Javayant
1010Salvatore S NickaItaly2025-04-23Truhlar And Truhlar Attys PROPOSAL32Asiya Javayant
1011Chavez H WhobreyAustralia2025-04-10Rangoni Of Florence QUALIFIED84Onyama Limba
1012Greenwood C SchemmerArgentina2025-04-27Feiner Bros NEGOTIATION0Onyama Limba
1013Jennifer F SaylorsItaly2025-04-17Rousseaux, Michael Esq RENEWAL79Elwin Sharvill
1014Emily W DoeCanada2025-04-10King, Christopher A Esq QUALIFIED19Bernardo Dominic
1015Faith B FlosiAustralia2025-04-16Feiner Bros UNQUALIFIED26Onyama Limba
1016Cody W SlusarskiIndia2025-04-20Chanay, Jeffrey A Esq NEW26Stephen Shaw
1017Smith E AlbaresCanada2025-04-11King, Christopher A Esq NEW23Bernardo Dominic
1018Faith H RimFrance2025-04-12Truhlar And Truhlar Attys QUALIFIED4Bernardo Dominic
1019Morrow M SaylorsFrance2025-04-04Feiner Bros QUALIFIED97Ivan Magalhaes
1020Maisha K GlickGermany2025-04-01Rangoni Of Florence UNQUALIFIED37Stephen Shaw
1021David I RoysterIndia2025-04-17King, Christopher A Esq PROPOSAL90Bernardo Dominic
1022Emily R InouyeFrance2025-04-20Rousseaux, Michael Esq QUALIFIED35Anna Fali
1023Cody Q GauchoItaly2025-04-07Benton, John B Jr NEGOTIATION24Xuxue Feng
1024Munro Y MaletRussia2025-04-11Dorl, James J Esq QUALIFIED80Onyama Limba
1025Smith O ChuiIndia2025-04-08Commercial Press NEW57Amy Elsner
1026Leja Q OldroydIndia2025-04-04Benton, John B Jr PROPOSAL24Asiya Javayant
1027Juan Y OstroskySpain2025-04-07Feiner Bros PROPOSAL97Asiya Javayant
1028Sinclair C FerenczArgentina2025-04-04Dorl, James J Esq UNQUALIFIED52Elwin Sharvill
1029David X RutaGermany2025-04-06Rangoni Of Florence PROPOSAL65Anna Fali
1030Misaki A InouyeBrazil2025-04-24Chanay, Jeffrey A Esq NEGOTIATION47Ioni Bowcher
1031Aditya T MorascaUnited Kingdom2025-04-28Benton, John B Jr PROPOSAL75Amy Elsner
1032Izzy C ShinkoUnited Kingdom2025-04-08Benton, John B Jr PROPOSAL3Stephen Shaw
1033Nicolas K DoeBrazil2025-04-26Truhlar And Truhlar Attys QUALIFIED87Onyama Limba
1034Tony O WieserSpain2025-04-02Truhlar And Truhlar Attys NEGOTIATION72Asiya Javayant
1035Aika R GauchoItaly2025-04-10Feiner Bros UNQUALIFIED61Xuxue Feng
1036Ricardo F CampainFrance2025-04-18Printing Dimensions PROPOSAL70Elwin Sharvill
1037Aditya A WieserUnited Kingdom2025-04-13Chemel, James L Cpa PROPOSAL99Amy Elsner
1038Jefferson M StockhamIndia2025-04-07Rangoni Of Florence PROPOSAL51Bernardo Dominic
1039Kaitlin G DoeUnited Kingdom2025-04-22Chemel, James L Cpa UNQUALIFIED56Xuxue Feng
1040Chavez M StensethJapan2025-04-10King, Christopher A Esq NEW68Stephen Shaw
1041Octavia D RulapaughJapan2025-04-01Benton, John B Jr QUALIFIED58Bernardo Dominic
1042Silvio B VocelkaSpain2025-04-18Commercial Press NEW43Elwin Sharvill
1043Salvatore A KuskoRussia2025-04-20Feiner Bros NEGOTIATION22Stephen Shaw
1044Ricardo V VenereFrance2025-04-17Feiner Bros NEW80Stephen Shaw
1045Costa A StockhamAustralia2025-04-16Morlong Associates NEW27Anna Fali
1046Silvio O ButtSpain2025-04-27King, Christopher A Esq NEW53Elwin Sharvill
1047Aruna W OstroskyItaly2025-04-29Chapman, Ross E Esq RENEWAL54Ivan Magalhaes
1048Leon G AmigonIndia2025-04-05Chemel, James L Cpa QUALIFIED32Elwin Sharvill
1049Arvin W TollnerItaly2025-04-15Chapman, Ross E Esq PROPOSAL4Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Emily G TollnerGermanyOnyama Limba QUALIFIED
Deepesh H OstroskyFranceBernardo Dominic PROPOSAL
Claire Q PerinSpainOnyama Limba NEGOTIATION
Morrow T WhobreyAustraliaAnna Fali PROPOSAL
Morrow L AmigonUnited KingdomOnyama Limba RENEWAL
Rodrigues K ChuiSpainBernardo Dominic QUALIFIED
Salvatore R StensethSpainIoni Bowcher NEGOTIATION
Faith Y WieserJapanIvan Magalhaes NEGOTIATION
Tony X RulapaughIndiaXuxue Feng PROPOSAL
Jeanfrancois Y SchemmerAustraliaOnyama Limba NEW
Clifford T WhobreyRussiaAsiya Javayant RENEWAL
Alejandro I PaprockiGermanyXuxue Feng RENEWAL
Leja E DilliardItalyElwin Sharvill RENEWAL
Silvio G PaprockiSpainXuxue Feng NEGOTIATION
Stacey T KolmetzCanadaXuxue Feng UNQUALIFIED
Faith O GlickCanadaXuxue Feng UNQUALIFIED
Salvatore G OldroydSpainOnyama Limba QUALIFIED
Jefferson B GauchoUnited KingdomOnyama Limba UNQUALIFIED
Aditya G SchemmerBrazilBernardo Dominic NEW
Stacey K GlickIndiaOnyama Limba RENEWAL
Claire H OldroydSpainXuxue Feng RENEWAL
Nicolas U DarakjyRussiaElwin Sharvill PROPOSAL
Kaitlin J KolmetzFranceAsiya Javayant RENEWAL
Rodrigues Y WhobreyAustraliaAmy Elsner UNQUALIFIED
Deepesh M GauchoItalyIvan Magalhaes RENEWAL
Chavez T AmigonJapanStephen Shaw NEW
Maria E OldroydArgentinaElwin Sharvill UNQUALIFIED
Stacey V BologniaItalyOnyama Limba NEW
Cody U WieserBrazilIoni Bowcher NEW
Wickens N StockhamGermanyStephen Shaw UNQUALIFIED
Kaitlin K BologniaUnited KingdomElwin Sharvill NEGOTIATION
Tony G PoquetteUnited KingdomAmy Elsner RENEWAL
Johnson T CaudyUnited KingdomStephen Shaw PROPOSAL
Jones V PoquetteFranceXuxue Feng RENEWAL
Nicolas E WhobreyItalyStephen Shaw NEW
Silvio Y SaylorsJapanIoni Bowcher NEW
Murillo R NickaSpainAmy Elsner NEW
Juan Q SaylorsArgentinaAnna Fali NEW
Aruna J BowleyItalyAnna Fali RENEWAL
Aditya W GauchoCanadaIvan Magalhaes NEW
Johnson F AlbaresAustraliaOnyama Limba PROPOSAL
Wickens C ChuiUnited KingdomAmy Elsner RENEWAL
Ashley I GarufiItalyOnyama Limba UNQUALIFIED
Murillo A PaprockiAustraliaAsiya Javayant RENEWAL
Wickens L VocelkaFranceBernardo Dominic UNQUALIFIED
Ashley L MorascaUnited KingdomOnyama Limba NEGOTIATION
Jeanfrancois O MarrierRussiaAsiya Javayant NEW
Aika M BowleyGermanyIvan Magalhaes NEGOTIATION
Emily I NestleSpainAsiya Javayant RENEWAL
Aruna Z BowleyArgentinaBernardo Dominic NEGOTIATION
Frozen Columns
Name
Jeanfrancois M Briddick
Kaitlin Q Stockham
David Z Slusarski
Ivar Y Shinko
Isabel T Wieser
Nicolas B Flosi
Sinclair N Malet
Clifford B Albares
David P Caudy
Kadeem V Malet
Sinclair H Darakjy
Adams H Wieser
Maisha Q Kolmetz
Isabel R Slusarski
Aruna G Poquette
Francesco V Caldarera
Mayumi N Amigon
Tony Q Malet
Aika G Rim
Smith Z Sergi
Nicolas U Saylors
James V Schemmer
Misaki H Gillian
Emily N Royster
Aika Q Doe
David H Amigon
Johnson Z Sergi
Darci Q Rulapaugh
Faith R Sergi
Johnson G Kusko
Silvio E Foller
Ricardo P Doe
Aditya X Kolmetz
Johnson W Morasca
Jefferson M Rulapaugh
James K Slusarski
Ivar X Slusarski
Sinclair E Sergi
Smith J Bowley
Octavia T Poquette
Kaitlin C Kolmetz
Sinclair R Stockham
Rodrigues N Iturbide
Silvio R Campain
Smith Q Venere
Francesco D Paprocki
Aika N Albares
Silvio D Amigon
Emily V Paprocki
Costa X Campain
IdCountryDate
1000Argentina2025-04-04
1001Brazil2025-04-11
1002Japan2025-04-17
1003France2025-04-24
1004Spain2025-04-24
1005Japan2025-04-12
1006Russia2025-04-17
1007Russia2025-04-28
1008Japan2025-04-25
1009Spain2025-04-13
1010Germany2025-04-18
1011Canada2025-04-21
1012Australia2025-04-09
1013Argentina2025-04-14
1014Germany2025-04-21
1015Canada2025-04-08
1016Japan2025-04-01
1017Canada2025-04-05
1018France2025-04-08
1019Japan2025-04-25
1020Italy2025-04-03
1021Australia2025-04-23
1022Spain2025-04-03
1023Japan2025-04-29
1024Brazil2025-04-23
1025Canada2025-04-30
1026Japan2025-04-24
1027Spain2025-04-08
1028Italy2025-04-29
1029India2025-04-08
1030Canada2025-04-02
1031India2025-04-14
1032Italy2025-04-21
1033Russia2025-04-07
1034France2025-04-26
1035Spain2025-04-15
1036Brazil2025-04-20
1037France2025-04-02
1038India2025-04-17
1039Germany2025-04-21
1040Australia2025-04-16
1041Japan2025-04-16
1042United Kingdom2025-04-01
1043Brazil2025-04-15
1044Spain2025-04-03
1045Spain2025-04-25
1046United Kingdom2025-04-01
1047Japan2025-04-14
1048Argentina2025-04-16
1049India2025-04-26

On-Demand Data

NameIdCountryDate
Tony T Butt1000Spain2025-04-19
Jennifer J Schemmer1001Argentina2025-04-19
Ashley K Rulapaugh1002India2025-04-05
David E Oldroyd1003Brazil2025-04-04
Adams Q Inouye1004Argentina2025-04-03
Francesco Z Amigon1005Australia2025-04-13
Maria P Doe1006Italy2025-04-02
Costa L Darakjy1007United Kingdom2025-04-01
Kadeem V Venere1008Japan2025-04-03
Jefferson Q Stenseth1009France2025-04-29
Tony G Whobrey1010Japan2025-04-23
Jefferson Z Ruta1011Germany2025-04-16
Kaitlin O Waycott1012Germany2025-04-14
Jeanfrancois F Nestle1013Argentina2025-04-17
Faith T Malet1014Russia2025-04-19
Isabel S Ostrosky1015Russia2025-04-02
Arvin R Rulapaugh1016Brazil2025-04-04
Silvio W Caldarera1017Argentina2025-04-02
Wickens S Figeroa1018Spain2025-04-03
Silvio L Nestle1019United Kingdom2025-04-26
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aika O ChuiRussiaIoni Bowcher UNQUALIFIED
Isabel Q MorascaIndiaStephen Shaw NEGOTIATION
Arvin E RulapaughArgentinaIvan Magalhaes NEGOTIATION
Octavia N MaletIndiaAmy Elsner QUALIFIED
Darci V BriddickBrazilStephen Shaw NEGOTIATION
Nicolas Z ButtArgentinaAsiya Javayant PROPOSAL
Jeanfrancois X BologniaGermanyOnyama Limba RENEWAL
Octavia O AlbaresIndiaAsiya Javayant UNQUALIFIED
Misaki W InouyeBrazilXuxue Feng RENEWAL
Clifford X RoysterSpainAnna Fali RENEWAL
Darci Z ChuiFranceAmy Elsner UNQUALIFIED
Stacey V MacleadIndiaAnna Fali NEGOTIATION
Aika D VocelkaGermanyIvan Magalhaes QUALIFIED
Misaki T RimGermanyAnna Fali NEW
Misaki Q CaudyItalyStephen Shaw RENEWAL
Munro T GarufiUnited KingdomElwin Sharvill UNQUALIFIED
Alejandro Z ChuiBrazilAmy Elsner NEGOTIATION
Aditya J InouyeJapanAnna Fali PROPOSAL
Jennifer G StensethArgentinaOnyama Limba NEGOTIATION
Francesco P SaylorsGermanyIvan Magalhaes RENEWAL
Ivar N InouyeBrazilElwin Sharvill NEGOTIATION
James X RoysterSpainOnyama Limba NEGOTIATION
Mayumi K BriddickJapanIoni Bowcher NEW
Arvin S KolmetzAustraliaIoni Bowcher RENEWAL
Misaki W NestleFranceIvan Magalhaes UNQUALIFIED
Mayumi J AmigonSpainAnna Fali PROPOSAL
Maisha I WieserBrazilIvan Magalhaes PROPOSAL
Morrow P SlusarskiCanadaStephen Shaw UNQUALIFIED
Cody R CaldareraAustraliaOnyama Limba UNQUALIFIED
Ivar P PoquetteJapanAnna Fali PROPOSAL
Greenwood X MacleadCanadaIoni Bowcher PROPOSAL
Darci M IturbideJapanAmy Elsner RENEWAL
Stacey H NestleRussiaAnna Fali NEW
Cody Q KolmetzArgentinaOnyama Limba RENEWAL
Jefferson W RulapaughCanadaIoni Bowcher NEW
Adams Z BowleyFranceIoni Bowcher RENEWAL
Chavez K CaudyIndiaAnna Fali RENEWAL
Jennifer F RutaJapanOnyama Limba NEW
Nicolas T GlickAustraliaStephen Shaw NEW
Juan Z BowleyJapanIvan Magalhaes 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>