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
Mayumi B CampainBrazilAsiya Javayant PROPOSAL
Mujtaba N SchemmerRussiaAnna Fali RENEWAL
Nicolas U MaletUnited KingdomAmy Elsner QUALIFIED
Octavia D RoysterJapanAmy Elsner NEGOTIATION
Morrow J NestleArgentinaIvan Magalhaes UNQUALIFIED
Isabel E DarakjyIndiaXuxue Feng RENEWAL
Alejandro W DilliardItalyOnyama Limba UNQUALIFIED
Jones F DilliardGermanyAmy Elsner UNQUALIFIED
Tony H StensethRussiaAnna Fali RENEWAL
Arvin C GauchoCanadaAsiya Javayant RENEWAL
Chavez O StockhamJapanXuxue Feng RENEWAL
Faith I BriddickCanadaIoni Bowcher NEGOTIATION
Clifford X CaudyUnited KingdomIoni Bowcher NEGOTIATION
Faith E RutaUnited KingdomOnyama Limba RENEWAL
Aruna R CaudyJapanAmy Elsner QUALIFIED
Murillo S InouyeAustraliaXuxue Feng PROPOSAL
Jeanfrancois T BowleyArgentinaIoni Bowcher RENEWAL
Claire H RimUnited KingdomAmy Elsner RENEWAL
Francesco H MaletRussiaElwin Sharvill NEW
Aika I ChuiFranceAnna Fali NEGOTIATION
Kaitlin O GlickFranceBernardo Dominic PROPOSAL
Kaitlin R StockhamFranceElwin Sharvill PROPOSAL
Chavez F RimRussiaIoni Bowcher UNQUALIFIED
Ashley V MacleadItalyStephen Shaw RENEWAL
Mayumi I FerenczAustraliaOnyama Limba UNQUALIFIED
Aika H ButtBrazilXuxue Feng PROPOSAL
James I OldroydJapanAsiya Javayant NEGOTIATION
Wickens D SlusarskiGermanyAsiya Javayant RENEWAL
Misaki R OldroydArgentinaXuxue Feng NEW
Murillo M MorascaCanadaAnna Fali UNQUALIFIED
Claire T GarufiRussiaAnna Fali UNQUALIFIED
Leon S SlusarskiSpainOnyama Limba QUALIFIED
Maria I AlbaresBrazilOnyama Limba NEW
Maisha B ButtCanadaAnna Fali RENEWAL
Aika S RulapaughFranceAmy Elsner QUALIFIED
Alejandro D WieserArgentinaAmy Elsner NEGOTIATION
Cody G RimGermanyIoni Bowcher NEGOTIATION
Chavez P PerinItalyOnyama Limba RENEWAL
Leja T VenereFranceAnna Fali QUALIFIED
Wickens H SaylorsFranceAmy Elsner RENEWAL
Nicolas I DilliardFranceBernardo Dominic UNQUALIFIED
Juan C AmigonBrazilAmy Elsner RENEWAL
Jefferson I SaylorsItalyIvan Magalhaes NEGOTIATION
Silvio E InouyeJapanStephen Shaw UNQUALIFIED
Costa J FollerRussiaStephen Shaw NEW
Chavez U MarrierGermanyOnyama Limba RENEWAL
Antonio C OstroskyArgentinaStephen Shaw RENEWAL
Izzy E MaletItalyIvan Magalhaes RENEWAL
Costa D InouyeArgentinaStephen Shaw PROPOSAL
Emily M BologniaRussiaBernardo Dominic PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Izzy Q DoeItalyAnna Fali NEGOTIATION
Silvio B CampainBrazilBernardo Dominic NEGOTIATION
Sinclair C RimAustraliaBernardo Dominic PROPOSAL
Smith T ChuiCanadaAnna Fali NEW
Izzy Q PerinRussiaIoni Bowcher UNQUALIFIED
Costa S CampainFranceAmy Elsner RENEWAL
Clifford B CampainCanadaAmy Elsner UNQUALIFIED
Leja C MorascaFranceIoni Bowcher NEGOTIATION
Jeanfrancois A KolmetzItalyElwin Sharvill NEGOTIATION
Johnson G ChuiFranceIvan Magalhaes RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Arvin J CampainRussia2025-06-12Chanay, Jeffrey A Esq QUALIFIED80Onyama Limba
1001Ivar F AmigonGermany2025-06-12Commercial Press PROPOSAL97Anna Fali
1002Wickens T FollerSpain2025-05-29Commercial Press PROPOSAL55Ioni Bowcher
1003Aditya U CaudySpain2025-05-23Benton, John B Jr RENEWAL20Ioni Bowcher
1004David W WaycottAustralia2025-06-01Dorl, James J Esq UNQUALIFIED78Asiya Javayant
1005Jennifer I ButtAustralia2025-05-28Truhlar And Truhlar Attys PROPOSAL49Ivan Magalhaes
1006Francesco V BologniaSpain2025-05-19Feltz Printing Service NEGOTIATION85Anna Fali
1007Arvin X MarrierRussia2025-06-09Dorl, James J Esq QUALIFIED31Asiya Javayant
1008Darci H WaycottJapan2025-06-16Dorl, James J Esq UNQUALIFIED76Ioni Bowcher
1009Darci Z WhobreyItaly2025-06-16Chapman, Ross E Esq PROPOSAL34Xuxue Feng
1010Chavez C RutaCanada2025-05-21Feiner Bros QUALIFIED4Ivan Magalhaes
1011Mayumi W FollerIndia2025-06-06King, Christopher A Esq NEGOTIATION99Stephen Shaw
1012Faith W RutaFrance2025-06-07Truhlar And Truhlar Attys PROPOSAL60Amy Elsner
1013Emily T OldroydItaly2025-05-28Chapman, Ross E Esq QUALIFIED93Ivan Magalhaes
1014Francesco G SaylorsAustralia2025-05-19Truhlar And Truhlar Attys RENEWAL62Bernardo Dominic
1015Stacey P OstroskyJapan2025-06-06Printing Dimensions NEW72Onyama Limba
1016Morrow W TollnerArgentina2025-06-10Benton, John B Jr UNQUALIFIED52Anna Fali
1017Salvatore E StockhamAustralia2025-06-02Chapman, Ross E Esq NEW92Ioni Bowcher
1018Murillo Q SaylorsRussia2025-05-19Benton, John B Jr PROPOSAL22Ivan Magalhaes
1019Antonio Q WhobreySpain2025-06-13Feiner Bros UNQUALIFIED81Amy Elsner
1020Aruna M SchemmerArgentina2025-05-23Morlong Associates PROPOSAL69Stephen Shaw
1021Ricardo S OstroskyJapan2025-05-20Feiner Bros NEW18Anna Fali
1022Tony P OstroskyBrazil2025-05-21Feiner Bros RENEWAL26Anna Fali
1023Sinclair E SlusarskiBrazil2025-06-14Rangoni Of Florence UNQUALIFIED16Asiya Javayant
1024Octavia B CampainUnited Kingdom2025-05-23Chanay, Jeffrey A Esq NEW79Elwin Sharvill
1025Ashley I ButtGermany2025-06-13Benton, John B Jr RENEWAL5Xuxue Feng
1026David L NickaFrance2025-06-16Printing Dimensions PROPOSAL49Stephen Shaw
1027Nicolas U OstroskyItaly2025-06-04Feiner Bros RENEWAL74Asiya Javayant
1028Jennifer K OstroskyAustralia2025-05-18Truhlar And Truhlar Attys UNQUALIFIED91Ioni Bowcher
1029Arvin M ShinkoRussia2025-05-30Commercial Press NEW23Onyama Limba
1030Kadeem C ShinkoItaly2025-06-03Buckley Miller Wright NEW62Elwin Sharvill
1031Alejandro U ChuiSpain2025-06-08Chanay, Jeffrey A Esq UNQUALIFIED66Ivan Magalhaes
1032Adams Y FlosiBrazil2025-05-28Chapman, Ross E Esq UNQUALIFIED36Xuxue Feng
1033Munro E StockhamSpain2025-06-05Truhlar And Truhlar Attys RENEWAL60Onyama Limba
1034Adams N SergiGermany2025-05-21Morlong Associates RENEWAL14Anna Fali
1035Leon H SergiFrance2025-05-31King, Christopher A Esq PROPOSAL79Xuxue Feng
1036Maria R MacleadUnited Kingdom2025-05-19Printing Dimensions UNQUALIFIED4Asiya Javayant
1037Ricardo K MacleadBrazil2025-05-20Chapman, Ross E Esq NEW94Ioni Bowcher
1038Alejandro K FigeroaGermany2025-06-04Benton, John B Jr UNQUALIFIED82Asiya Javayant
1039Murillo H ChuiGermany2025-05-21Chanay, Jeffrey A Esq RENEWAL49Ivan Magalhaes
1040Greenwood I AlbaresIndia2025-06-09Morlong Associates NEGOTIATION92Elwin Sharvill
1041Jeanfrancois X StockhamBrazil2025-06-01Chemel, James L Cpa NEGOTIATION32Asiya Javayant
1042Jeanfrancois G KuskoSpain2025-06-03Feltz Printing Service UNQUALIFIED17Anna Fali
1043Francesco H FigeroaRussia2025-05-21Printing Dimensions RENEWAL21Xuxue Feng
1044Maisha K CaldareraIndia2025-06-16Feiner Bros QUALIFIED15Bernardo Dominic
1045Antonio I MacleadGermany2025-05-20King, Christopher A Esq NEGOTIATION94Ioni Bowcher
1046Adams T PaprockiJapan2025-06-03Buckley Miller Wright QUALIFIED74Elwin Sharvill
1047Octavia S FollerGermany2025-06-15Chapman, Ross E Esq NEGOTIATION21Amy Elsner
1048Deepesh T FollerCanada2025-06-07Chanay, Jeffrey A Esq UNQUALIFIED71Amy Elsner
1049Maria C VenereGermany2025-06-15Commercial Press NEW98Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Misaki Q ChuiAustraliaElwin Sharvill UNQUALIFIED
Leja M SergiUnited KingdomBernardo Dominic RENEWAL
Rodrigues Q DilliardIndiaIvan Magalhaes NEGOTIATION
Arvin L IturbideCanadaAnna Fali RENEWAL
David L DoeGermanyStephen Shaw NEW
Cody P TollnerJapanAsiya Javayant NEW
Emily X MaletJapanAsiya Javayant UNQUALIFIED
Maisha S InouyeIndiaBernardo Dominic NEW
Munro K GlickArgentinaBernardo Dominic RENEWAL
Misaki Z GarufiRussiaIoni Bowcher QUALIFIED
Stacey B NickaSpainAsiya Javayant NEW
Tony W ButtCanadaIvan Magalhaes PROPOSAL
Juan D GarufiBrazilStephen Shaw NEGOTIATION
Kadeem N BologniaUnited KingdomAmy Elsner NEGOTIATION
Kadeem G FollerAustraliaElwin Sharvill UNQUALIFIED
Kadeem H FlosiIndiaStephen Shaw UNQUALIFIED
Leja L ShinkoJapanIvan Magalhaes NEGOTIATION
Wickens S WieserIndiaAmy Elsner RENEWAL
Silvio Q BriddickAustraliaAnna Fali NEGOTIATION
Morrow J StockhamAustraliaXuxue Feng NEW
Munro E FlosiAustraliaElwin Sharvill PROPOSAL
Deepesh Q BologniaIndiaXuxue Feng QUALIFIED
Izzy R KuskoGermanyStephen Shaw QUALIFIED
Smith G AlbaresRussiaStephen Shaw PROPOSAL
Sinclair N CaldareraIndiaAmy Elsner QUALIFIED
Leja F ChuiCanadaXuxue Feng UNQUALIFIED
Jones J KuskoCanadaIvan Magalhaes UNQUALIFIED
Aditya I SaylorsJapanIvan Magalhaes QUALIFIED
Kaitlin Q DoeIndiaOnyama Limba RENEWAL
Aditya I WieserFranceXuxue Feng PROPOSAL
Antonio I RimGermanyXuxue Feng NEW
Greenwood Q GillianArgentinaIvan Magalhaes NEW
Aruna E CampainUnited KingdomOnyama Limba NEGOTIATION
Jeanfrancois A PoquetteRussiaAsiya Javayant NEW
Deepesh I DoeJapanAmy Elsner NEGOTIATION
Greenwood F MorascaJapanAmy Elsner NEW
Deepesh Q MorascaFranceAmy Elsner NEGOTIATION
Jones C PoquetteBrazilOnyama Limba RENEWAL
Ivar J ButtArgentinaAsiya Javayant UNQUALIFIED
Faith K PaprockiRussiaIvan Magalhaes RENEWAL
Claire J GarufiFranceOnyama Limba RENEWAL
Nicolas R WieserRussiaStephen Shaw NEW
Greenwood C NestleJapanAsiya Javayant PROPOSAL
Octavia R AmigonItalyOnyama Limba RENEWAL
Deepesh L AlbaresItalyXuxue Feng PROPOSAL
Aditya P WaycottSpainStephen Shaw NEGOTIATION
Ivar J SlusarskiIndiaAsiya Javayant NEW
Jeanfrancois O SaylorsArgentinaAnna Fali UNQUALIFIED
Adams H RutaAustraliaAsiya Javayant RENEWAL
Sinclair C CaldareraRussiaAnna Fali PROPOSAL
Frozen Columns
Name
Aditya C Perin
Kaitlin M Oldroyd
Emily S Stenseth
Aruna P Royster
Maria J Stenseth
Juan X Perin
Wickens D Malet
David W Garufi
Munro W Amigon
Jones D Oldroyd
Mujtaba U Bowley
Jefferson C Rim
Costa Y Stockham
Jefferson U Bolognia
Adams X Shinko
Jennifer K Morasca
Chavez Z Dilliard
Aruna Q Bolognia
Antonio X Kusko
James U Maclead
Munro M Royster
Ashley B Caldarera
Ashley B Bowley
Greenwood I Figeroa
Emily M Oldroyd
Morrow F Amigon
Clifford N Chui
Darci G Chui
Clifford H Oldroyd
Misaki K Venere
Silvio J Chui
Kaitlin S Gillian
Arvin U Maclead
Octavia X Rulapaugh
Juan N Schemmer
Johnson R Malet
Darci P Foller
Murillo R Poquette
Octavia H Marrier
Ivar C Campain
Alejandro Y Rulapaugh
Greenwood E Oldroyd
Mujtaba A Marrier
Stacey S Flosi
Octavia E Doe
Aruna K Maclead
Claire L Marrier
Greenwood B Marrier
Wickens A Chui
Claire T Gaucho
IdCountryDate
1000Argentina2025-05-30
1001Spain2025-06-11
1002France2025-05-26
1003Canada2025-05-28
1004United Kingdom2025-06-01
1005Japan2025-05-22
1006Germany2025-06-06
1007Brazil2025-05-28
1008Germany2025-06-08
1009Spain2025-05-27
1010India2025-06-07
1011France2025-05-31
1012Brazil2025-05-31
1013Argentina2025-05-28
1014Japan2025-06-12
1015France2025-06-15
1016France2025-05-21
1017Australia2025-06-05
1018France2025-06-04
1019Italy2025-06-14
1020Italy2025-06-16
1021Argentina2025-06-14
1022France2025-05-28
1023Japan2025-05-25
1024United Kingdom2025-06-07
1025India2025-05-29
1026Australia2025-06-02
1027France2025-05-31
1028United Kingdom2025-05-20
1029Russia2025-06-09
1030Germany2025-05-29
1031Australia2025-05-23
1032India2025-06-16
1033Australia2025-06-16
1034Brazil2025-06-03
1035India2025-06-06
1036Australia2025-06-04
1037United Kingdom2025-06-02
1038France2025-06-02
1039Japan2025-06-08
1040France2025-06-07
1041Germany2025-06-04
1042Canada2025-06-09
1043Spain2025-06-16
1044France2025-06-03
1045Canada2025-06-13
1046Brazil2025-06-05
1047Germany2025-06-06
1048France2025-06-03
1049France2025-05-30

On-Demand Data

NameIdCountryDate
Jefferson U Rulapaugh1000Italy2025-06-04
Ivar V Glick1001India2025-05-20
Adams P Tollner1002Argentina2025-05-28
Rodrigues U Kolmetz1003Brazil2025-05-22
Wickens S Iturbide1004Argentina2025-06-03
Sinclair B Kusko1005Russia2025-05-21
Aruna O Foller1006Italy2025-05-24
Octavia Y Tollner1007Russia2025-05-30
Maisha C Chui1008Brazil2025-06-02
Francesco E Glick1009Spain2025-05-23
Maria Q Schemmer1010Russia2025-06-02
Aditya E Stockham1011France2025-06-02
Mayumi W Butt1012Italy2025-05-25
Octavia T Nestle1013Japan2025-05-29
Clifford I Whobrey1014Brazil2025-06-02
Tony I Gillian1015Australia2025-05-24
Faith D Darakjy1016Australia2025-06-01
Ivar K Campain1017Argentina2025-06-01
Julie L Briddick1018Spain2025-05-21
Arvin A Tollner1019Spain2025-05-26
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Kaitlin J CaldareraSpainElwin Sharvill RENEWAL
Sinclair K ButtArgentinaAmy Elsner NEGOTIATION
Wickens J CaudyArgentinaIoni Bowcher PROPOSAL
Faith A AmigonAustraliaOnyama Limba QUALIFIED
Jefferson S ChuiCanadaAmy Elsner NEGOTIATION
Izzy M OstroskyIndiaAnna Fali NEGOTIATION
Rodrigues S VocelkaJapanAmy Elsner RENEWAL
Izzy H FollerAustraliaIoni Bowcher PROPOSAL
Francesco J DoeAustraliaOnyama Limba RENEWAL
Claire B StockhamRussiaIoni Bowcher NEW
Silvio P RoysterAustraliaIvan Magalhaes QUALIFIED
Emily A WaycottItalyAsiya Javayant PROPOSAL
Cody I ChuiItalyElwin Sharvill RENEWAL
Smith J MorascaSpainIoni Bowcher RENEWAL
Kadeem Z WhobreyGermanyBernardo Dominic NEW
Murillo F PaprockiCanadaBernardo Dominic QUALIFIED
Juan I InouyeRussiaOnyama Limba PROPOSAL
Costa U BriddickCanadaOnyama Limba UNQUALIFIED
Stacey S KuskoJapanIoni Bowcher NEGOTIATION
Izzy W OldroydGermanyAsiya Javayant NEW
Alejandro N GlickSpainElwin Sharvill PROPOSAL
Stacey C CaudyUnited KingdomIoni Bowcher UNQUALIFIED
Maisha J WhobreyIndiaOnyama Limba QUALIFIED
Jeanfrancois Z DilliardArgentinaAnna Fali RENEWAL
Claire T StockhamUnited KingdomXuxue Feng NEGOTIATION
Smith J BriddickCanadaStephen Shaw NEGOTIATION
Murillo N DoeAustraliaAmy Elsner UNQUALIFIED
Wickens J CampainJapanStephen Shaw PROPOSAL
Octavia M BriddickArgentinaElwin Sharvill NEGOTIATION
Arvin A PoquetteAustraliaIvan Magalhaes UNQUALIFIED
Misaki T DoeFranceXuxue Feng UNQUALIFIED
Antonio H SergiFranceBernardo Dominic NEGOTIATION
Jennifer T InouyeJapanXuxue Feng PROPOSAL
Francesco H NestleItalyXuxue Feng UNQUALIFIED
Cody U RimItalyBernardo Dominic UNQUALIFIED
Jeanfrancois K SchemmerFranceAmy Elsner RENEWAL
Antonio B OstroskyAustraliaElwin Sharvill UNQUALIFIED
Tony A WieserUnited KingdomAsiya Javayant RENEWAL
Ashley N FlosiRussiaOnyama Limba NEW
Cody Z ShinkoBrazilIoni Bowcher NEW

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