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
Ricardo S GarufiRussiaIvan Magalhaes NEGOTIATION
Juan P CaldareraAustraliaBernardo Dominic NEGOTIATION
Mayumi W PoquetteJapanOnyama Limba NEGOTIATION
Darci O PerinIndiaAnna Fali NEGOTIATION
Greenwood D PoquetteBrazilBernardo Dominic UNQUALIFIED
Nicolas D RutaBrazilIoni Bowcher PROPOSAL
Claire J OldroydFranceIoni Bowcher RENEWAL
Munro G RoysterIndiaXuxue Feng PROPOSAL
Ricardo J MarrierArgentinaAmy Elsner QUALIFIED
Costa E RutaJapanAsiya Javayant NEGOTIATION
Juan T MaletBrazilBernardo Dominic RENEWAL
Greenwood Q RimUnited KingdomOnyama Limba QUALIFIED
Chavez M MorascaJapanIvan Magalhaes PROPOSAL
Antonio C GauchoCanadaAsiya Javayant NEGOTIATION
Isabel O GauchoAustraliaIvan Magalhaes RENEWAL
Faith U GillianItalyAmy Elsner NEGOTIATION
Arvin J SchemmerIndiaXuxue Feng QUALIFIED
Sinclair F GlickArgentinaIvan Magalhaes PROPOSAL
Smith Z AlbaresJapanStephen Shaw QUALIFIED
Leja B StensethBrazilBernardo Dominic NEGOTIATION
Antonio J FerenczSpainIvan Magalhaes RENEWAL
Faith L BriddickAustraliaBernardo Dominic RENEWAL
Smith X GauchoArgentinaIoni Bowcher NEGOTIATION
Mayumi R AlbaresUnited KingdomAnna Fali RENEWAL
Mujtaba S GlickIndiaXuxue Feng PROPOSAL
Izzy R AlbaresItalyXuxue Feng NEW
Salvatore T GillianBrazilBernardo Dominic RENEWAL
Mujtaba F AlbaresArgentinaAnna Fali NEGOTIATION
Jefferson P VocelkaSpainAsiya Javayant PROPOSAL
Rodrigues E MorascaBrazilAsiya Javayant UNQUALIFIED
Wickens Q GillianItalyOnyama Limba PROPOSAL
Claire F GlickCanadaAsiya Javayant QUALIFIED
Sinclair M FollerRussiaStephen Shaw RENEWAL
Clifford C CaldareraIndiaIvan Magalhaes QUALIFIED
Clifford J VenereArgentinaAnna Fali PROPOSAL
Salvatore X CaudyItalyAmy Elsner QUALIFIED
Murillo K GlickSpainIoni Bowcher UNQUALIFIED
Julie Q DarakjyRussiaIvan Magalhaes PROPOSAL
Leon R SchemmerCanadaElwin Sharvill NEW
Adams V WaycottItalyAmy Elsner PROPOSAL
Adams H WieserItalyIoni Bowcher NEGOTIATION
Rodrigues F ButtCanadaElwin Sharvill NEW
Tony W PerinSpainAsiya Javayant NEGOTIATION
Clifford F GauchoArgentinaIoni Bowcher RENEWAL
Isabel Q VenereUnited KingdomBernardo Dominic PROPOSAL
Maisha C FlosiGermanyBernardo Dominic NEGOTIATION
Mujtaba R GillianFranceElwin Sharvill NEGOTIATION
Salvatore C VenereAustraliaAnna Fali RENEWAL
Deepesh D RulapaughIndiaIvan Magalhaes NEGOTIATION
Darci K DoeJapanElwin Sharvill NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Tony T RutaGermanyXuxue Feng UNQUALIFIED
Jeanfrancois S FerenczArgentinaAsiya Javayant NEGOTIATION
Sinclair K MaletSpainXuxue Feng QUALIFIED
James R SchemmerBrazilXuxue Feng NEGOTIATION
Aditya N CaudyBrazilAsiya Javayant NEGOTIATION
Sinclair Y VocelkaCanadaStephen Shaw NEW
Maria B RoysterArgentinaXuxue Feng PROPOSAL
Darci C FigeroaArgentinaAnna Fali QUALIFIED
Izzy U NestleIndiaAsiya Javayant RENEWAL
Adams A WaycottAustraliaOnyama Limba QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Greenwood V CampainSpain2025-04-28Benton, John B Jr PROPOSAL68Stephen Shaw
1001Antonio C WaycottIndia2025-04-29Feiner Bros QUALIFIED61Ivan Magalhaes
1002Maria K OstroskyIndia2025-04-01Commercial Press UNQUALIFIED37Elwin Sharvill
1003David C OldroydRussia2025-04-22Feiner Bros QUALIFIED43Anna Fali
1004Alejandro W MacleadCanada2025-04-17Printing Dimensions RENEWAL94Anna Fali
1005Aditya F IturbideAustralia2025-04-29Benton, John B Jr NEGOTIATION12Ivan Magalhaes
1006Silvio P NickaArgentina2025-04-05Rangoni Of Florence RENEWAL93Ivan Magalhaes
1007Izzy B AmigonSpain2025-04-30Dorl, James J Esq UNQUALIFIED78Xuxue Feng
1008Costa P SchemmerCanada2025-04-06Truhlar And Truhlar Attys NEW15Ioni Bowcher
1009Isabel E AmigonJapan2025-04-27Benton, John B Jr PROPOSAL49Stephen Shaw
1010Morrow H SchemmerFrance2025-04-16Rousseaux, Michael Esq RENEWAL13Ivan Magalhaes
1011Francesco O RoysterAustralia2025-04-21Feltz Printing Service NEW57Stephen Shaw
1012Isabel R BriddickItaly2025-04-10Feltz Printing Service UNQUALIFIED56Xuxue Feng
1013Isabel P SchemmerGermany2025-04-24Chapman, Ross E Esq RENEWAL63Onyama Limba
1014Jennifer D DilliardGermany2025-04-03Truhlar And Truhlar Attys UNQUALIFIED74Amy Elsner
1015Costa G AlbaresUnited Kingdom2025-04-29King, Christopher A Esq PROPOSAL6Ivan Magalhaes
1016Silvio B GillianJapan2025-04-23Dorl, James J Esq UNQUALIFIED37Amy Elsner
1017Claire H GarufiIndia2025-04-15Morlong Associates PROPOSAL44Asiya Javayant
1018Johnson J KuskoIndia2025-04-24Feiner Bros QUALIFIED14Ivan Magalhaes
1019Aditya X SergiAustralia2025-04-17Truhlar And Truhlar Attys NEW79Stephen Shaw
1020Julie W KuskoFrance2025-04-24Buckley Miller Wright UNQUALIFIED34Onyama Limba
1021Mujtaba L AlbaresAustralia2025-04-25Morlong Associates RENEWAL98Xuxue Feng
1022Jefferson P BologniaJapan2025-04-24Benton, John B Jr NEGOTIATION58Bernardo Dominic
1023Darci Z OstroskyItaly2025-04-21Chemel, James L Cpa NEGOTIATION97Bernardo Dominic
1024Aruna U ShinkoUnited Kingdom2025-04-23Chemel, James L Cpa NEGOTIATION11Ioni Bowcher
1025Alejandro E NickaItaly2025-04-13King, Christopher A Esq PROPOSAL84Anna Fali
1026Rodrigues Y VenereArgentina2025-04-03Rousseaux, Michael Esq QUALIFIED26Amy Elsner
1027Costa N NickaSpain2025-04-23Chapman, Ross E Esq QUALIFIED66Amy Elsner
1028Smith L WieserRussia2025-04-28King, Christopher A Esq UNQUALIFIED18Bernardo Dominic
1029Salvatore R InouyeBrazil2025-04-27Commercial Press NEGOTIATION58Xuxue Feng
1030Faith U OldroydFrance2025-04-01Rangoni Of Florence QUALIFIED1Amy Elsner
1031Alejandro S PaprockiSpain2025-04-15Chemel, James L Cpa NEGOTIATION79Xuxue Feng
1032Cody R DoeUnited Kingdom2025-04-21Feiner Bros NEW34Anna Fali
1033Francesco M IturbideAustralia2025-04-15Benton, John B Jr NEGOTIATION78Elwin Sharvill
1034Juan S MorascaJapan2025-04-27Commercial Press NEW76Ivan Magalhaes
1035Aditya X AlbaresRussia2025-04-03Commercial Press NEGOTIATION71Xuxue Feng
1036Deepesh H VocelkaJapan2025-04-07Rangoni Of Florence QUALIFIED6Ioni Bowcher
1037Aditya B FigeroaSpain2025-04-03Feiner Bros UNQUALIFIED87Anna Fali
1038Mujtaba S IturbideItaly2025-04-13Feiner Bros UNQUALIFIED63Anna Fali
1039Darci V AlbaresRussia2025-04-26Benton, John B Jr UNQUALIFIED47Xuxue Feng
1040Rodrigues I MacleadJapan2025-04-03Rousseaux, Michael Esq PROPOSAL63Onyama Limba
1041Alejandro F MaletJapan2025-04-16Buckley Miller Wright UNQUALIFIED99Anna Fali
1042Murillo U PaprockiUnited Kingdom2025-04-24Dorl, James J Esq PROPOSAL31Elwin Sharvill
1043Arvin C TollnerRussia2025-04-25Buckley Miller Wright NEGOTIATION12Bernardo Dominic
1044Aruna N OldroydUnited Kingdom2025-04-15Feiner Bros RENEWAL82Bernardo Dominic
1045David G GarufiIndia2025-04-25Commercial Press UNQUALIFIED97Ioni Bowcher
1046Ivar V OstroskyArgentina2025-04-24Buckley Miller Wright PROPOSAL66Ivan Magalhaes
1047Salvatore A VocelkaArgentina2025-04-25Chanay, Jeffrey A Esq RENEWAL15Anna Fali
1048Ashley D DilliardIndia2025-04-28Rangoni Of Florence PROPOSAL93Stephen Shaw
1049Arvin C IturbideAustralia2025-04-03Benton, John B Jr UNQUALIFIED3Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Munro V ButtRussiaStephen Shaw PROPOSAL
Munro P VocelkaCanadaOnyama Limba RENEWAL
Leon B ShinkoGermanyIoni Bowcher NEGOTIATION
Faith U ButtRussiaIvan Magalhaes UNQUALIFIED
Silvio W MaletSpainIoni Bowcher NEW
Greenwood R BowleyAustraliaAnna Fali NEGOTIATION
Jones X GlickAustraliaStephen Shaw PROPOSAL
Johnson W AmigonGermanyStephen Shaw NEW
Wickens U KolmetzSpainXuxue Feng QUALIFIED
Cody W TollnerGermanyIvan Magalhaes UNQUALIFIED
Morrow R ChuiRussiaIoni Bowcher UNQUALIFIED
Faith E DarakjyCanadaIoni Bowcher RENEWAL
Aika A VenereBrazilAnna Fali UNQUALIFIED
Rodrigues I KuskoRussiaStephen Shaw UNQUALIFIED
Alejandro U StensethGermanyOnyama Limba QUALIFIED
Misaki X SchemmerArgentinaAsiya Javayant PROPOSAL
Mayumi G RoysterCanadaAnna Fali QUALIFIED
Faith J GlickGermanyAnna Fali PROPOSAL
Morrow J NestleSpainAmy Elsner RENEWAL
Aika M DarakjyAustraliaAsiya Javayant RENEWAL
Aruna M MacleadIndiaAsiya Javayant UNQUALIFIED
Arvin O FigeroaBrazilAnna Fali RENEWAL
Silvio S IturbideArgentinaAmy Elsner NEGOTIATION
Aika Z WhobreyCanadaElwin Sharvill QUALIFIED
Costa H RulapaughRussiaAmy Elsner NEW
Mujtaba C WieserJapanOnyama Limba NEW
Murillo Y GarufiGermanyStephen Shaw QUALIFIED
Julie P MarrierRussiaAsiya Javayant RENEWAL
Ashley T WaycottBrazilXuxue Feng RENEWAL
Adams Q SlusarskiJapanAmy Elsner QUALIFIED
Deepesh S SchemmerAustraliaElwin Sharvill QUALIFIED
Greenwood B ChuiUnited KingdomIoni Bowcher UNQUALIFIED
Emily T AmigonBrazilAnna Fali NEW
Sinclair Z MarrierJapanXuxue Feng QUALIFIED
Chavez Z MorascaFranceAnna Fali QUALIFIED
Jeanfrancois D IturbideJapanAsiya Javayant PROPOSAL
Francesco H CaudyAustraliaElwin Sharvill QUALIFIED
Munro L DilliardGermanyIoni Bowcher NEGOTIATION
Cody Q DarakjySpainAsiya Javayant NEGOTIATION
Claire D OldroydJapanIoni Bowcher PROPOSAL
Morrow H FollerGermanyBernardo Dominic QUALIFIED
Nicolas V ButtUnited KingdomAnna Fali PROPOSAL
Jennifer T BowleyBrazilBernardo Dominic NEW
Costa Q ChuiUnited KingdomAmy Elsner NEGOTIATION
Smith T PerinArgentinaAmy Elsner NEGOTIATION
Faith D MaletBrazilStephen Shaw PROPOSAL
Maria G ButtFranceOnyama Limba PROPOSAL
Kaitlin R MaletAustraliaIvan Magalhaes QUALIFIED
Juan A KuskoArgentinaElwin Sharvill PROPOSAL
Greenwood Q DarakjySpainIoni Bowcher UNQUALIFIED
Frozen Columns
Name
Faith H Amigon
Smith U Glick
Juan S Malet
Maria S Amigon
Stacey E Oldroyd
Maria G Inouye
Darci P Nestle
Octavia B Darakjy
Izzy C Schemmer
Tony M Venere
Aika E Nicka
Jones S Bowley
Jefferson N Waycott
Izzy U Saylors
Octavia A Paprocki
Murillo S Nestle
Kaitlin I Marrier
Morrow D Chui
Rodrigues N Iturbide
Jefferson S Waycott
Chavez P Campain
Tony O Ruta
James E Inouye
Aika P Ruta
Greenwood J Marrier
Jones R Bolognia
Jones T Chui
Isabel Z Chui
Silvio V Flosi
Munro D Kusko
Kaitlin B Ferencz
Misaki N Kolmetz
Ivar W Malet
Sinclair N Flosi
Munro P Venere
Sinclair A Dilliard
Munro I Caldarera
Greenwood J Slusarski
Kaitlin R Vocelka
Adams R Venere
Leja T Campain
Kadeem J Doe
Jones Q Rim
Adams E Kusko
Smith M Paprocki
Greenwood W Albares
Emily J Amigon
James N Morasca
Clifford I Caldarera
Cody C Kolmetz
IdCountryDate
1000Brazil2025-04-12
1001Spain2025-04-13
1002Japan2025-04-09
1003Russia2025-04-16
1004Canada2025-04-25
1005Canada2025-04-14
1006Australia2025-04-09
1007India2025-04-30
1008India2025-04-22
1009Italy2025-04-27
1010Canada2025-04-03
1011Canada2025-04-25
1012Russia2025-04-22
1013Italy2025-04-22
1014Germany2025-04-03
1015Russia2025-04-10
1016India2025-04-07
1017Brazil2025-04-18
1018Brazil2025-04-10
1019Brazil2025-04-28
1020Italy2025-04-23
1021Australia2025-04-23
1022France2025-04-07
1023Italy2025-04-09
1024Italy2025-04-28
1025Australia2025-04-17
1026Australia2025-04-25
1027United Kingdom2025-04-28
1028Russia2025-04-30
1029Japan2025-04-29
1030India2025-04-14
1031India2025-04-16
1032India2025-04-28
1033Argentina2025-04-25
1034Brazil2025-04-25
1035Spain2025-04-05
1036Germany2025-04-11
1037India2025-04-04
1038France2025-04-15
1039Argentina2025-04-18
1040Spain2025-04-23
1041Argentina2025-04-10
1042Brazil2025-04-03
1043Russia2025-04-25
1044Japan2025-04-22
1045Argentina2025-04-06
1046United Kingdom2025-04-27
1047Canada2025-04-23
1048Germany2025-04-12
1049Canada2025-04-19

On-Demand Data

NameIdCountryDate
Ricardo X Oldroyd1000Argentina2025-04-10
Maisha E Ferencz1001Russia2025-04-02
Sinclair L Darakjy1002France2025-04-24
Tony T Glick1003Argentina2025-04-02
Deepesh P Venere1004Germany2025-04-26
Isabel N Wieser1005Italy2025-04-30
Faith K Venere1006United Kingdom2025-04-12
Smith M Wieser1007Italy2025-04-24
Jennifer F Bolognia1008Brazil2025-04-01
Claire F Foller1009Japan2025-04-22
Antonio Y Rulapaugh1010Germany2025-04-15
Mujtaba P Stockham1011France2025-04-27
Kaitlin F Whobrey1012Russia2025-04-24
Tony P Briddick1013United Kingdom2025-04-21
Jefferson X Foller1014United Kingdom2025-04-17
Kaitlin Z Flosi1015United Kingdom2025-04-23
Munro R Kolmetz1016Germany2025-04-04
Morrow N Stockham1017France2025-04-01
Jennifer N Slusarski1018Russia2025-04-30
Alejandro A Nestle1019Spain2025-04-30
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Maria X NestleFranceOnyama Limba RENEWAL
Greenwood U NickaJapanIvan Magalhaes UNQUALIFIED
Aika W BowleyGermanyElwin Sharvill PROPOSAL
Stacey J FerenczJapanStephen Shaw PROPOSAL
Jones X BologniaSpainOnyama Limba QUALIFIED
Jeanfrancois P ShinkoJapanOnyama Limba PROPOSAL
Misaki H GauchoSpainBernardo Dominic RENEWAL
Chavez X BriddickFranceXuxue Feng PROPOSAL
Tony Z DarakjyAustraliaAmy Elsner NEGOTIATION
Julie U MaletItalyBernardo Dominic NEW
Francesco O MarrierJapanBernardo Dominic QUALIFIED
David K NestleJapanIoni Bowcher UNQUALIFIED
Murillo V TollnerAustraliaXuxue Feng PROPOSAL
Chavez L CaudyItalyIvan Magalhaes NEGOTIATION
Murillo F SaylorsJapanXuxue Feng RENEWAL
Maria F VocelkaGermanyAsiya Javayant PROPOSAL
Jennifer I BologniaBrazilElwin Sharvill NEGOTIATION
Antonio J MarrierUnited KingdomIvan Magalhaes PROPOSAL
Smith O WieserBrazilIvan Magalhaes UNQUALIFIED
Aruna P SaylorsUnited KingdomAnna Fali PROPOSAL
Smith D RimArgentinaAsiya Javayant NEGOTIATION
Wickens J OstroskyFranceOnyama Limba QUALIFIED
Arvin S WaycottSpainBernardo Dominic UNQUALIFIED
Jeanfrancois T ChuiJapanXuxue Feng PROPOSAL
Juan C VocelkaAustraliaElwin Sharvill NEW
Kadeem F RoysterArgentinaElwin Sharvill PROPOSAL
Isabel O GarufiJapanBernardo Dominic UNQUALIFIED
Clifford X ButtArgentinaOnyama Limba NEW
Stacey D BologniaIndiaBernardo Dominic QUALIFIED
Costa Y CaudyGermanyAmy Elsner QUALIFIED
Claire Z MaletSpainElwin Sharvill UNQUALIFIED
Juan F SchemmerCanadaOnyama Limba NEW
Silvio Z VenereAustraliaElwin Sharvill RENEWAL
Ivar N MacleadArgentinaAsiya Javayant QUALIFIED
Ashley F GillianIndiaXuxue Feng RENEWAL
Leja S RulapaughGermanyAmy Elsner NEGOTIATION
Mayumi K MaletArgentinaAsiya Javayant NEGOTIATION
Leon I MorascaJapanIvan Magalhaes RENEWAL
Claire T OstroskySpainElwin Sharvill QUALIFIED
Emily N DarakjyAustraliaElwin Sharvill 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>