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
Cody V PoquetteItalyBernardo Dominic NEGOTIATION
Juan B FlosiCanadaOnyama Limba UNQUALIFIED
Clifford V MorascaJapanXuxue Feng UNQUALIFIED
Adams R CampainIndiaBernardo Dominic PROPOSAL
Aditya L PerinFranceIoni Bowcher RENEWAL
Faith S WieserGermanyAsiya Javayant NEGOTIATION
Arvin N PoquetteArgentinaAmy Elsner NEGOTIATION
Emily Y GarufiJapanStephen Shaw NEW
Stacey I PaprockiIndiaAmy Elsner NEW
Jefferson Z RimGermanyAnna Fali NEW
Stacey B MacleadRussiaIoni Bowcher RENEWAL
Nicolas A BologniaJapanStephen Shaw RENEWAL
Ricardo Z CaudyItalyBernardo Dominic QUALIFIED
Jeanfrancois Z FerenczBrazilAsiya Javayant QUALIFIED
Cody N StockhamRussiaOnyama Limba NEGOTIATION
Jennifer W RutaAustraliaXuxue Feng NEW
Jones D BowleyGermanyBernardo Dominic PROPOSAL
Jeanfrancois T GlickArgentinaAnna Fali RENEWAL
Wickens Z MacleadUnited KingdomStephen Shaw RENEWAL
Clifford O TollnerJapanIoni Bowcher NEW
Maisha X GarufiCanadaStephen Shaw RENEWAL
Antonio T GillianCanadaElwin Sharvill RENEWAL
David E PaprockiArgentinaAsiya Javayant NEW
Tony W DilliardRussiaXuxue Feng NEGOTIATION
Stacey Y GarufiArgentinaAmy Elsner UNQUALIFIED
Cody M FlosiJapanIvan Magalhaes NEGOTIATION
Arvin Z FollerRussiaStephen Shaw RENEWAL
Mujtaba L ButtAustraliaIvan Magalhaes UNQUALIFIED
Johnson B VenereSpainStephen Shaw RENEWAL
Aika M FollerRussiaAnna Fali RENEWAL
Smith P GlickIndiaAmy Elsner NEW
Arvin F FigeroaSpainXuxue Feng NEGOTIATION
Julie C RutaAustraliaElwin Sharvill QUALIFIED
Kadeem W WieserIndiaStephen Shaw QUALIFIED
Misaki M WhobreyIndiaOnyama Limba RENEWAL
Rodrigues H PaprockiItalyAmy Elsner NEW
Silvio R MacleadIndiaAsiya Javayant UNQUALIFIED
Francesco B WaycottAustraliaOnyama Limba PROPOSAL
Ricardo L GarufiCanadaAsiya Javayant UNQUALIFIED
Wickens Z ButtFranceAnna Fali QUALIFIED
Darci B MacleadCanadaIvan Magalhaes NEGOTIATION
Leon K SergiBrazilIoni Bowcher QUALIFIED
Cody N GarufiCanadaAsiya Javayant PROPOSAL
Julie U StockhamRussiaAnna Fali RENEWAL
Mujtaba E PoquetteSpainBernardo Dominic NEGOTIATION
Juan Q NestleGermanyIvan Magalhaes UNQUALIFIED
Munro W DilliardArgentinaOnyama Limba NEGOTIATION
Johnson I KuskoFranceBernardo Dominic UNQUALIFIED
Wickens K VenereIndiaIvan Magalhaes QUALIFIED
James W VenereAustraliaOnyama Limba NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Nicolas J InouyeUnited KingdomIoni Bowcher PROPOSAL
Claire B WhobreyJapanElwin Sharvill PROPOSAL
James Y GauchoCanadaAsiya Javayant QUALIFIED
Emily S CampainBrazilIvan Magalhaes RENEWAL
Stacey V ButtRussiaIoni Bowcher PROPOSAL
Octavia L WhobreyIndiaAmy Elsner UNQUALIFIED
Jefferson A FerenczFranceOnyama Limba NEGOTIATION
Jennifer G DoeArgentinaOnyama Limba NEGOTIATION
Morrow Y InouyeRussiaIvan Magalhaes NEGOTIATION
Greenwood N GlickRussiaIvan Magalhaes UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Izzy Y SergiCanada2025-04-28Truhlar And Truhlar Attys PROPOSAL53Stephen Shaw
1001Alejandro S OldroydItaly2025-04-29Chanay, Jeffrey A Esq UNQUALIFIED11Ioni Bowcher
1002Jones P SchemmerRussia2025-04-24Rousseaux, Michael Esq RENEWAL1Elwin Sharvill
1003Juan K VocelkaAustralia2025-04-08Printing Dimensions NEW19Xuxue Feng
1004Aika K GlickBrazil2025-04-16Feltz Printing Service PROPOSAL89Anna Fali
1005Wickens Y ChuiGermany2025-04-02King, Christopher A Esq QUALIFIED38Ivan Magalhaes
1006Kadeem M DilliardArgentina2025-04-07Benton, John B Jr RENEWAL59Xuxue Feng
1007Aditya M KolmetzItaly2025-04-20Printing Dimensions PROPOSAL22Onyama Limba
1008Juan O InouyeArgentina2025-04-26Rangoni Of Florence NEGOTIATION8Xuxue Feng
1009Leja K RimAustralia2025-04-13Rangoni Of Florence PROPOSAL56Stephen Shaw
1010Adams S WhobreyCanada2025-04-05Chemel, James L Cpa NEGOTIATION79Onyama Limba
1011Antonio I PaprockiRussia2025-04-30Buckley Miller Wright PROPOSAL42Elwin Sharvill
1012Aditya L IturbideIndia2025-04-01Chapman, Ross E Esq NEGOTIATION29Amy Elsner
1013Salvatore G CaldareraJapan2025-04-11Truhlar And Truhlar Attys PROPOSAL4Asiya Javayant
1014Clifford D PaprockiUnited Kingdom2025-04-21Printing Dimensions RENEWAL98Ioni Bowcher
1015Silvio I RulapaughUnited Kingdom2025-04-24Feltz Printing Service UNQUALIFIED93Asiya Javayant
1016Morrow L ShinkoGermany2025-04-07Chanay, Jeffrey A Esq RENEWAL24Asiya Javayant
1017Aruna X DarakjyBrazil2025-04-26Chemel, James L Cpa PROPOSAL25Onyama Limba
1018Clifford R PoquetteGermany2025-04-13Benton, John B Jr NEGOTIATION16Ivan Magalhaes
1019Jones P AmigonCanada2025-04-27Commercial Press QUALIFIED9Amy Elsner
1020Smith F NickaArgentina2025-04-06Rangoni Of Florence NEGOTIATION74Ioni Bowcher
1021James H OldroydSpain2025-04-30Chemel, James L Cpa NEGOTIATION53Amy Elsner
1022Octavia K WaycottJapan2025-04-28King, Christopher A Esq RENEWAL43Amy Elsner
1023Tony T KolmetzJapan2025-04-02Buckley Miller Wright NEW50Anna Fali
1024Francesco T PoquetteIndia2025-04-07Benton, John B Jr NEW71Anna Fali
1025Chavez S ShinkoFrance2025-04-27Buckley Miller Wright PROPOSAL64Asiya Javayant
1026Ricardo G RulapaughBrazil2025-04-17Truhlar And Truhlar Attys QUALIFIED49Stephen Shaw
1027Maisha V MorascaRussia2025-04-28King, Christopher A Esq RENEWAL20Asiya Javayant
1028Aditya R GarufiItaly2025-04-04Chanay, Jeffrey A Esq PROPOSAL40Anna Fali
1029Nicolas T StockhamBrazil2025-04-08Chapman, Ross E Esq PROPOSAL38Anna Fali
1030Smith C MorascaGermany2025-04-22Printing Dimensions PROPOSAL45Xuxue Feng
1031Ricardo F DilliardArgentina2025-04-07Benton, John B Jr UNQUALIFIED1Xuxue Feng
1032Deepesh Z ChuiArgentina2025-04-28Chemel, James L Cpa QUALIFIED59Asiya Javayant
1033Izzy P MaletCanada2025-04-29Buckley Miller Wright UNQUALIFIED44Onyama Limba
1034Jennifer W FollerSpain2025-04-06Truhlar And Truhlar Attys NEGOTIATION33Elwin Sharvill
1035Nicolas G MacleadItaly2025-04-28Chemel, James L Cpa QUALIFIED31Ioni Bowcher
1036Alejandro H AmigonItaly2025-04-28Dorl, James J Esq RENEWAL9Bernardo Dominic
1037Juan W SlusarskiAustralia2025-04-21Chemel, James L Cpa PROPOSAL74Ioni Bowcher
1038Ricardo A TollnerUnited Kingdom2025-04-18Chapman, Ross E Esq NEW23Ioni Bowcher
1039Adams J ButtRussia2025-04-04Morlong Associates NEGOTIATION28Onyama Limba
1040Chavez Q IturbideBrazil2025-04-16King, Christopher A Esq NEGOTIATION66Ivan Magalhaes
1041Ricardo F MaletSpain2025-04-08Dorl, James J Esq RENEWAL61Elwin Sharvill
1042James O StensethAustralia2025-04-18Buckley Miller Wright PROPOSAL64Amy Elsner
1043Deepesh T DilliardGermany2025-04-29Chapman, Ross E Esq RENEWAL59Asiya Javayant
1044Jones B OldroydFrance2025-04-09Dorl, James J Esq QUALIFIED7Asiya Javayant
1045Costa N OstroskyCanada2025-04-21Buckley Miller Wright NEGOTIATION22Onyama Limba
1046Deepesh T StockhamBrazil2025-04-11Commercial Press PROPOSAL73Anna Fali
1047Jennifer W GarufiRussia2025-04-23Dorl, James J Esq RENEWAL28Xuxue Feng
1048Munro C SchemmerArgentina2025-04-22Dorl, James J Esq UNQUALIFIED42Anna Fali
1049Munro H GlickArgentina2025-04-06Chanay, Jeffrey A Esq RENEWAL4Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Deepesh N FerenczSpainElwin Sharvill NEGOTIATION
Silvio P PoquetteBrazilAmy Elsner QUALIFIED
Kaitlin D ShinkoArgentinaAmy Elsner NEGOTIATION
Wickens S FerenczItalyIoni Bowcher QUALIFIED
Johnson S GarufiFranceXuxue Feng UNQUALIFIED
Faith T ShinkoSpainAmy Elsner QUALIFIED
Faith D VenereBrazilIoni Bowcher NEW
David R SaylorsGermanyAsiya Javayant RENEWAL
Emily U GillianItalyAsiya Javayant RENEWAL
Tony W FerenczCanadaXuxue Feng NEGOTIATION
Clifford U DarakjyUnited KingdomStephen Shaw PROPOSAL
Jeanfrancois S SergiSpainStephen Shaw NEW
Leon Z GillianCanadaIvan Magalhaes NEGOTIATION
Sinclair M SchemmerRussiaOnyama Limba NEW
Cody R MacleadJapanAsiya Javayant UNQUALIFIED
Silvio X OstroskyIndiaBernardo Dominic PROPOSAL
Murillo M DarakjyArgentinaIoni Bowcher RENEWAL
Wickens G VenereIndiaIoni Bowcher QUALIFIED
Arvin W GauchoFranceAmy Elsner PROPOSAL
Munro A BowleyBrazilBernardo Dominic UNQUALIFIED
Rodrigues J VenereItalyAnna Fali NEGOTIATION
David Q IturbideSpainAmy Elsner NEGOTIATION
Rodrigues C RutaGermanyXuxue Feng PROPOSAL
Darci R GauchoCanadaStephen Shaw PROPOSAL
Smith Q SaylorsIndiaIoni Bowcher PROPOSAL
Costa M MacleadSpainElwin Sharvill RENEWAL
Stacey D DoeSpainAsiya Javayant PROPOSAL
Chavez G MacleadItalyAmy Elsner RENEWAL
Juan J FerenczIndiaIoni Bowcher PROPOSAL
Stacey H RoysterSpainAmy Elsner QUALIFIED
Nicolas I RimBrazilIvan Magalhaes NEW
Jefferson K FlosiBrazilAnna Fali UNQUALIFIED
Jennifer E KolmetzCanadaAmy Elsner QUALIFIED
Faith V StockhamIndiaStephen Shaw RENEWAL
Antonio H RimRussiaAsiya Javayant NEW
Jefferson T VocelkaGermanyIvan Magalhaes NEGOTIATION
Ivar U ButtCanadaAmy Elsner NEW
Aika W NestleCanadaBernardo Dominic NEGOTIATION
Murillo R BriddickCanadaBernardo Dominic QUALIFIED
Francesco J PaprockiFranceStephen Shaw NEW
Alejandro Q BologniaIndiaBernardo Dominic UNQUALIFIED
Morrow H OstroskyIndiaXuxue Feng RENEWAL
Misaki Q DarakjyGermanyIoni Bowcher UNQUALIFIED
Faith I GauchoIndiaOnyama Limba QUALIFIED
Jones A ShinkoBrazilOnyama Limba QUALIFIED
Rodrigues Z DoeBrazilBernardo Dominic NEW
Izzy Z DoeIndiaIoni Bowcher RENEWAL
Jones U TollnerSpainAmy Elsner NEW
Smith E ButtGermanyXuxue Feng QUALIFIED
Smith I KuskoJapanElwin Sharvill NEGOTIATION
Frozen Columns
Name
Johnson M Doe
Clifford A Oldroyd
Francesco G Rulapaugh
Rodrigues C Poquette
Francesco L Venere
Smith Z Sergi
Tony L Royster
Emily M Malet
Maisha M Ruta
Munro E Gaucho
Misaki S Foller
Jeanfrancois J Kusko
Izzy E Chui
Jennifer Q Kolmetz
Juan S Glick
Octavia N Ferencz
Leon U Nestle
Aika S Slusarski
Aika X Waycott
Wickens S Figeroa
Isabel U Butt
Silvio N Flosi
Mujtaba L Garufi
Jeanfrancois B Marrier
Greenwood A Malet
Misaki K Venere
Tony D Garufi
David W Saylors
Chavez R Slusarski
Jennifer K Rulapaugh
Stacey W Bolognia
Johnson L Wieser
Chavez J Ostrosky
Sinclair T Sergi
Ivar M Chui
Darci R Shinko
Jones R Darakjy
Costa R Figeroa
Mayumi Q Royster
Stacey T Briddick
Tony H Figeroa
Izzy X Gillian
Salvatore Y Caudy
Salvatore F Wieser
Emily U Wieser
Ricardo R Whobrey
Aika P Stockham
Mujtaba W Rim
David T Vocelka
Arvin W Wieser
IdCountryDate
1000India2025-04-12
1001Germany2025-04-04
1002Brazil2025-04-26
1003Spain2025-04-17
1004Canada2025-04-04
1005Canada2025-04-04
1006Spain2025-04-21
1007Japan2025-04-25
1008Brazil2025-04-26
1009Germany2025-04-15
1010Germany2025-04-17
1011Australia2025-04-25
1012Brazil2025-04-21
1013United Kingdom2025-04-11
1014United Kingdom2025-04-30
1015Argentina2025-04-06
1016Spain2025-04-24
1017France2025-04-29
1018Canada2025-04-09
1019United Kingdom2025-04-30
1020Argentina2025-04-05
1021France2025-04-21
1022Russia2025-04-09
1023Italy2025-04-26
1024United Kingdom2025-04-11
1025Japan2025-04-05
1026Italy2025-04-29
1027United Kingdom2025-04-27
1028Germany2025-04-02
1029Russia2025-04-09
1030Russia2025-04-07
1031Germany2025-04-20
1032Italy2025-04-04
1033Germany2025-04-18
1034Japan2025-04-17
1035Italy2025-04-06
1036Australia2025-04-30
1037Russia2025-04-26
1038Japan2025-04-06
1039Japan2025-04-21
1040United Kingdom2025-04-23
1041France2025-04-29
1042Germany2025-04-17
1043India2025-04-07
1044France2025-04-27
1045Brazil2025-04-21
1046Australia2025-04-07
1047India2025-04-27
1048Italy2025-04-22
1049Italy2025-04-20

On-Demand Data

NameIdCountryDate
Mujtaba U Bowley1000Canada2025-04-12
Kadeem W Doe1001Russia2025-04-15
Julie V Saylors1002Italy2025-04-18
David O Butt1003Canada2025-04-10
Tony V Maclead1004Argentina2025-04-11
Costa Y Oldroyd1005Japan2025-04-13
Greenwood J Maclead1006United Kingdom2025-04-25
Izzy X Doe1007United Kingdom2025-04-24
Francesco O Malet1008India2025-04-12
Darci M Morasca1009Japan2025-04-18
Emily A Stockham1010Brazil2025-04-24
Arvin X Vocelka1011Canada2025-04-21
Ashley R Wieser1012India2025-04-26
Rodrigues D Inouye1013Italy2025-04-11
Tony B Waycott1014Canada2025-04-18
Cody G Marrier1015United Kingdom2025-04-14
Julie U Rulapaugh1016Italy2025-04-12
Stacey M Saylors1017Italy2025-04-20
Salvatore O Maclead1018Italy2025-04-26
Izzy M Darakjy1019Germany2025-04-09
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Johnson Z InouyeAustraliaElwin Sharvill NEGOTIATION
Sinclair R BologniaSpainStephen Shaw PROPOSAL
Darci F FollerAustraliaStephen Shaw QUALIFIED
Kadeem C CaldareraSpainOnyama Limba PROPOSAL
Jones T WaycottSpainAsiya Javayant NEGOTIATION
Faith E MaletJapanElwin Sharvill NEGOTIATION
Adams W IturbideAustraliaXuxue Feng UNQUALIFIED
Juan F MacleadSpainAnna Fali RENEWAL
Adams S MaletRussiaIvan Magalhaes NEGOTIATION
Misaki Y PerinItalyElwin Sharvill PROPOSAL
Salvatore X IturbideJapanXuxue Feng QUALIFIED
Juan C OstroskyUnited KingdomAsiya Javayant PROPOSAL
Adams L KuskoSpainXuxue Feng PROPOSAL
Deepesh J RutaGermanyOnyama Limba RENEWAL
Francesco D BriddickRussiaOnyama Limba UNQUALIFIED
Greenwood X VenereJapanOnyama Limba NEW
Johnson I FigeroaFranceAsiya Javayant NEW
James Q PoquetteJapanAmy Elsner QUALIFIED
Darci Q BowleyAustraliaBernardo Dominic NEW
Kadeem H CampainAustraliaBernardo Dominic NEGOTIATION
Greenwood A IturbideArgentinaIvan Magalhaes NEGOTIATION
Deepesh U CaudyRussiaIvan Magalhaes RENEWAL
Faith W DoeCanadaIoni Bowcher PROPOSAL
Wickens H NickaUnited KingdomElwin Sharvill UNQUALIFIED
Ashley E MorascaGermanyElwin Sharvill NEW
Wickens F GillianSpainIvan Magalhaes UNQUALIFIED
Emily R SergiUnited KingdomAnna Fali PROPOSAL
Deepesh K PerinAustraliaAmy Elsner UNQUALIFIED
Kadeem F PaprockiAustraliaBernardo Dominic UNQUALIFIED
Jennifer X DoeItalyBernardo Dominic UNQUALIFIED
Faith S MarrierGermanyBernardo Dominic RENEWAL
Leon M FigeroaIndiaIoni Bowcher PROPOSAL
Deepesh H IturbideIndiaAmy Elsner NEGOTIATION
Jeanfrancois O MorascaCanadaOnyama Limba NEGOTIATION
Jones W ChuiIndiaAnna Fali UNQUALIFIED
Tony A GarufiSpainIvan Magalhaes PROPOSAL
Arvin Q IturbideArgentinaIoni Bowcher RENEWAL
Antonio A GlickCanadaStephen Shaw PROPOSAL
Tony Q PerinRussiaAsiya Javayant NEGOTIATION
Rodrigues I OstroskyCanadaBernardo Dominic RENEWAL

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