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
Antonio Z MaletSpainOnyama Limba PROPOSAL
Jones M WieserRussiaAsiya Javayant QUALIFIED
Stacey P StensethJapanIvan Magalhaes RENEWAL
Emily A MaletUnited KingdomStephen Shaw PROPOSAL
Mayumi F SchemmerUnited KingdomIoni Bowcher NEW
Julie L BriddickArgentinaIvan Magalhaes NEGOTIATION
Tony M MacleadCanadaXuxue Feng NEGOTIATION
Isabel Y StensethJapanElwin Sharvill UNQUALIFIED
Juan K SergiJapanStephen Shaw QUALIFIED
Munro I KuskoJapanAsiya Javayant NEGOTIATION
Cody L AmigonAustraliaAsiya Javayant NEW
Ricardo G SergiItalyAnna Fali PROPOSAL
Cody F OstroskyJapanBernardo Dominic UNQUALIFIED
Munro Q CampainItalyAnna Fali QUALIFIED
Mujtaba C GlickUnited KingdomIoni Bowcher UNQUALIFIED
Emily A GauchoJapanAnna Fali NEW
Cody R RimItalyElwin Sharvill NEGOTIATION
Munro S FlosiArgentinaBernardo Dominic QUALIFIED
Nicolas G AmigonFranceAmy Elsner RENEWAL
Costa I BologniaRussiaElwin Sharvill NEW
Tony A SlusarskiJapanAnna Fali NEGOTIATION
Octavia O CaldareraIndiaElwin Sharvill NEGOTIATION
Isabel V WieserRussiaElwin Sharvill PROPOSAL
Misaki B MacleadItalyAsiya Javayant PROPOSAL
Smith H PoquetteCanadaAsiya Javayant NEW
Isabel Y GillianArgentinaElwin Sharvill RENEWAL
Misaki Z WieserBrazilElwin Sharvill NEW
Kadeem Q CampainFranceAsiya Javayant UNQUALIFIED
Julie W VocelkaGermanyAmy Elsner NEW
Isabel P SlusarskiGermanyIvan Magalhaes QUALIFIED
Francesco K OldroydArgentinaAmy Elsner PROPOSAL
Murillo J StockhamUnited KingdomXuxue Feng NEW
Rodrigues M WaycottAustraliaIoni Bowcher PROPOSAL
Sinclair E TollnerCanadaAsiya Javayant UNQUALIFIED
Clifford E PoquetteArgentinaAmy Elsner UNQUALIFIED
Faith S OldroydUnited KingdomOnyama Limba NEGOTIATION
Emily X TollnerUnited KingdomBernardo Dominic PROPOSAL
Francesco C SaylorsBrazilAsiya Javayant UNQUALIFIED
Johnson Q DilliardUnited KingdomAmy Elsner NEW
Ivar V ButtRussiaIoni Bowcher QUALIFIED
Tony T DoeArgentinaBernardo Dominic NEW
Mayumi N ChuiSpainOnyama Limba QUALIFIED
Maria E FlosiAustraliaAsiya Javayant UNQUALIFIED
Clifford S FerenczArgentinaOnyama Limba RENEWAL
Misaki J DarakjyIndiaAnna Fali QUALIFIED
Octavia W KuskoJapanStephen Shaw PROPOSAL
Adams V StockhamAustraliaIvan Magalhaes RENEWAL
Maria T DilliardAustraliaAsiya Javayant QUALIFIED
Smith V CaudyCanadaAnna Fali QUALIFIED
Jennifer A CaudyGermanyAnna Fali PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Deepesh Y SchemmerSpainOnyama Limba UNQUALIFIED
Morrow Q FerenczSpainIvan Magalhaes QUALIFIED
Clifford N AlbaresRussiaIoni Bowcher QUALIFIED
Tony M MarrierRussiaElwin Sharvill QUALIFIED
James X GarufiJapanAmy Elsner RENEWAL
Darci O ShinkoCanadaXuxue Feng PROPOSAL
Ivar L MarrierCanadaIoni Bowcher NEW
Johnson L VenereJapanAnna Fali RENEWAL
Johnson M ButtJapanAsiya Javayant NEW
Juan Q OstroskyIndiaBernardo Dominic QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Salvatore U ButtIndia2025-04-16Rangoni Of Florence NEGOTIATION26Ioni Bowcher
1001Julie D TollnerItaly2025-04-08Chanay, Jeffrey A Esq UNQUALIFIED50Ivan Magalhaes
1002Costa L AlbaresUnited Kingdom2025-04-14Feltz Printing Service PROPOSAL12Amy Elsner
1003David B WieserIndia2025-04-29Rangoni Of Florence UNQUALIFIED63Anna Fali
1004Smith H PerinAustralia2025-04-03Buckley Miller Wright QUALIFIED86Stephen Shaw
1005Greenwood E ChuiJapan2025-04-29Benton, John B Jr UNQUALIFIED62Elwin Sharvill
1006Sinclair O StockhamBrazil2025-04-11Benton, John B Jr NEGOTIATION38Anna Fali
1007Salvatore V TollnerBrazil2025-04-15Commercial Press NEW11Ioni Bowcher
1008Costa L StockhamUnited Kingdom2025-04-06Chapman, Ross E Esq UNQUALIFIED36Xuxue Feng
1009Greenwood W MarrierCanada2025-04-04Feiner Bros NEW79Amy Elsner
1010Octavia N CaudyArgentina2025-04-17Chapman, Ross E Esq NEGOTIATION69Ioni Bowcher
1011Ivar U DilliardBrazil2025-04-24Morlong Associates PROPOSAL87Ioni Bowcher
1012Nicolas Y BologniaCanada2025-04-29Benton, John B Jr RENEWAL86Amy Elsner
1013Alejandro V WhobreyBrazil2025-04-02Commercial Press RENEWAL78Amy Elsner
1014Cody Z ShinkoRussia2025-04-07Truhlar And Truhlar Attys RENEWAL46Asiya Javayant
1015Mujtaba W DoeCanada2025-04-25Rousseaux, Michael Esq UNQUALIFIED96Bernardo Dominic
1016Clifford N VenereItaly2025-04-15Commercial Press UNQUALIFIED84Xuxue Feng
1017Leja O BologniaGermany2025-04-12Rousseaux, Michael Esq RENEWAL81Elwin Sharvill
1018Francesco N GlickArgentina2025-04-08Commercial Press RENEWAL76Onyama Limba
1019Octavia L SergiGermany2025-04-23Commercial Press PROPOSAL29Amy Elsner
1020Adams X MaletSpain2025-04-22Commercial Press RENEWAL11Elwin Sharvill
1021Ricardo P VenereJapan2025-04-25Buckley Miller Wright NEW68Stephen Shaw
1022James Q RimRussia2025-04-06Chanay, Jeffrey A Esq QUALIFIED88Xuxue Feng
1023Mayumi Y FigeroaSpain2025-04-12Feiner Bros NEGOTIATION64Xuxue Feng
1024Ashley P GarufiCanada2025-04-25Rangoni Of Florence NEW94Elwin Sharvill
1025Jennifer I WieserItaly2025-04-24Printing Dimensions UNQUALIFIED25Anna Fali
1026Leon D MarrierGermany2025-04-15Rousseaux, Michael Esq NEW83Anna Fali
1027Morrow G RulapaughItaly2025-04-21King, Christopher A Esq RENEWAL13Bernardo Dominic
1028Julie D ButtArgentina2025-04-02Feltz Printing Service PROPOSAL27Ioni Bowcher
1029Alejandro H DoeItaly2025-04-02Commercial Press QUALIFIED97Amy Elsner
1030James S ChuiGermany2025-04-07Chapman, Ross E Esq UNQUALIFIED50Bernardo Dominic
1031Morrow I CaudyGermany2025-04-07Buckley Miller Wright NEGOTIATION67Amy Elsner
1032Julie B SaylorsUnited Kingdom2025-03-31Chanay, Jeffrey A Esq PROPOSAL62Ioni Bowcher
1033Stacey I TollnerItaly2025-04-21King, Christopher A Esq RENEWAL86Amy Elsner
1034Leon M MaletCanada2025-04-10Morlong Associates UNQUALIFIED32Anna Fali
1035Cody J WaycottAustralia2025-04-02Dorl, James J Esq PROPOSAL68Asiya Javayant
1036Ivar U DoeArgentina2025-04-18Chemel, James L Cpa NEW66Elwin Sharvill
1037Jeanfrancois Q KolmetzFrance2025-04-20King, Christopher A Esq PROPOSAL40Xuxue Feng
1038Aruna X FerenczRussia2025-04-19Chapman, Ross E Esq NEGOTIATION27Bernardo Dominic
1039Aika E CaudyFrance2025-04-22Commercial Press UNQUALIFIED90Bernardo Dominic
1040Wickens A GillianGermany2025-04-08Feiner Bros QUALIFIED52Bernardo Dominic
1041Mujtaba D RutaArgentina2025-04-13Printing Dimensions PROPOSAL75Elwin Sharvill
1042Kaitlin R MaletCanada2025-04-04Chanay, Jeffrey A Esq PROPOSAL31Onyama Limba
1043Mayumi U WaycottArgentina2025-04-01Truhlar And Truhlar Attys NEGOTIATION62Elwin Sharvill
1044Izzy W GillianSpain2025-04-22Feiner Bros RENEWAL28Xuxue Feng
1045Alejandro W RutaGermany2025-04-18Truhlar And Truhlar Attys PROPOSAL33Xuxue Feng
1046Wickens R PerinRussia2025-04-01Buckley Miller Wright NEW94Bernardo Dominic
1047Alejandro C MorascaAustralia2025-04-16Chapman, Ross E Esq RENEWAL64Stephen Shaw
1048Mayumi L SergiJapan2025-04-12Chemel, James L Cpa NEGOTIATION62Xuxue Feng
1049Murillo T BowleyFrance2025-04-25Chapman, Ross E Esq PROPOSAL83Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
David F KolmetzRussiaIoni Bowcher PROPOSAL
Emily P MorascaItalyXuxue Feng RENEWAL
Leja K MaletArgentinaXuxue Feng NEGOTIATION
Salvatore U NestleBrazilBernardo Dominic UNQUALIFIED
Deepesh X StockhamGermanyAsiya Javayant PROPOSAL
Stacey C AlbaresArgentinaAsiya Javayant NEGOTIATION
Adams V OldroydJapanStephen Shaw RENEWAL
Octavia T GauchoJapanAsiya Javayant QUALIFIED
Kadeem V KolmetzSpainElwin Sharvill PROPOSAL
Francesco J KolmetzRussiaOnyama Limba NEGOTIATION
Julie T WieserIndiaElwin Sharvill QUALIFIED
Adams X WieserUnited KingdomXuxue Feng NEGOTIATION
Kaitlin G RimArgentinaBernardo Dominic QUALIFIED
Isabel Z SchemmerIndiaElwin Sharvill NEW
Silvio M VocelkaUnited KingdomOnyama Limba QUALIFIED
Chavez O KolmetzFranceAmy Elsner NEW
Darci P WaycottIndiaAmy Elsner NEGOTIATION
James L ButtIndiaAnna Fali QUALIFIED
Mujtaba D OstroskyIndiaBernardo Dominic PROPOSAL
Claire W GillianRussiaIvan Magalhaes RENEWAL
Greenwood Q PaprockiJapanIvan Magalhaes QUALIFIED
Munro A BologniaSpainOnyama Limba PROPOSAL
Munro K SaylorsUnited KingdomXuxue Feng QUALIFIED
David M RulapaughCanadaXuxue Feng UNQUALIFIED
Stacey Y OstroskyAustraliaIoni Bowcher UNQUALIFIED
Mujtaba U PerinItalyXuxue Feng UNQUALIFIED
Johnson G MorascaIndiaBernardo Dominic PROPOSAL
Clifford A SchemmerGermanyAsiya Javayant RENEWAL
Silvio S SchemmerJapanAsiya Javayant NEGOTIATION
Jones A FigeroaAustraliaIoni Bowcher UNQUALIFIED
Antonio W AlbaresBrazilAsiya Javayant QUALIFIED
Rodrigues Y FlosiUnited KingdomIvan Magalhaes NEGOTIATION
Morrow I ChuiFranceIoni Bowcher NEW
Nicolas E RimIndiaAmy Elsner QUALIFIED
Ashley U RoysterArgentinaStephen Shaw QUALIFIED
Sinclair F MarrierRussiaAsiya Javayant NEGOTIATION
David L BologniaAustraliaElwin Sharvill QUALIFIED
Ricardo B KolmetzRussiaIvan Magalhaes PROPOSAL
Maria S FlosiJapanAmy Elsner QUALIFIED
Jefferson L ShinkoRussiaAsiya Javayant RENEWAL
James Y StensethGermanyAnna Fali UNQUALIFIED
Adams N GauchoUnited KingdomStephen Shaw NEW
Johnson X FollerIndiaOnyama Limba NEW
Murillo A TollnerUnited KingdomXuxue Feng RENEWAL
Claire P NestleBrazilIvan Magalhaes NEGOTIATION
Wickens X GarufiRussiaIvan Magalhaes RENEWAL
James V DoeIndiaElwin Sharvill NEW
Arvin P RoysterGermanyBernardo Dominic PROPOSAL
Nicolas B TollnerSpainStephen Shaw NEW
Maria P VenereJapanAnna Fali NEGOTIATION
Frozen Columns
Name
Claire O Perin
Wickens Q Butt
Kadeem O Butt
Stacey V Doe
Kadeem P Caudy
Ashley E Kolmetz
James A Royster
Juan V Figeroa
James B Kolmetz
Greenwood J Briddick
Alejandro B Darakjy
Murillo Z Caudy
Claire N Slusarski
Aditya F Glick
Alejandro N Ferencz
Stacey Y Glick
Munro J Vocelka
Costa V Whobrey
Costa Q Inouye
Isabel S Albares
Kadeem K Nicka
Ashley C Kolmetz
Kadeem H Amigon
Julie S Ruta
Nicolas D Schemmer
Deepesh H Nicka
Alejandro H Bolognia
Claire J Amigon
Stacey Q Rulapaugh
Salvatore A Amigon
Jeanfrancois B Caudy
Costa K Paprocki
Maisha L Iturbide
Ashley K Amigon
Mujtaba D Morasca
Costa I Shinko
Tony I Nestle
Wickens P Nestle
James E Foller
Aditya Z Vocelka
Juan B Morasca
Alejandro O Morasca
James N Maclead
Jeanfrancois R Gaucho
David D Maclead
Deepesh W Ruta
Clifford S Caldarera
Leja U Stenseth
Ivar C Poquette
Stacey F Darakjy
IdCountryDate
1000Japan2025-04-09
1001Japan2025-04-20
1002Spain2025-04-18
1003Canada2025-04-12
1004France2025-04-07
1005Italy2025-04-08
1006Germany2025-04-19
1007Australia2025-04-18
1008Japan2025-04-13
1009Japan2025-04-21
1010Japan2025-04-02
1011Australia2025-04-22
1012Russia2025-04-09
1013Australia2025-04-24
1014Canada2025-04-22
1015India2025-04-05
1016Russia2025-04-11
1017Russia2025-04-25
1018Canada2025-04-29
1019Italy2025-04-11
1020Japan2025-04-04
1021Germany2025-04-22
1022France2025-04-06
1023France2025-04-12
1024United Kingdom2025-04-14
1025Australia2025-04-13
1026United Kingdom2025-04-25
1027Spain2025-04-14
1028Germany2025-04-15
1029India2025-04-23
1030Australia2025-04-19
1031Spain2025-04-28
1032Canada2025-04-14
1033Spain2025-04-03
1034Germany2025-04-06
1035Spain2025-04-06
1036Argentina2025-04-06
1037Spain2025-04-16
1038Germany2025-04-29
1039France2025-04-03
1040India2025-04-20
1041India2025-04-24
1042Argentina2025-04-01
1043Canada2025-04-16
1044Germany2025-04-01
1045Spain2025-04-20
1046Brazil2025-04-26
1047Italy2025-04-13
1048India2025-04-29
1049Canada2025-04-04

On-Demand Data

NameIdCountryDate
Adams Z Iturbide1000United Kingdom2025-04-10
Maisha R Oldroyd1001Russia2025-04-25
Francesco R Oldroyd1002Japan2025-04-18
Morrow O Slusarski1003Japan2025-04-09
David F Caudy1004Brazil2025-04-21
Sinclair T Gaucho1005France2025-04-26
Octavia N Flosi1006France2025-04-26
Izzy L Kusko1007Canada2025-04-05
Francesco F Albares1008India2025-04-11
Ricardo V Saylors1009Argentina2025-04-14
Jennifer R Rim1010India2025-04-09
Antonio E Malet1011Brazil2025-04-07
Jennifer S Bolognia1012India2025-04-02
Julie L Morasca1013India2025-04-13
Ricardo Q Rulapaugh1014Italy2025-04-19
Darci C Tollner1015France2025-04-15
Darci K Nestle1016India2025-04-12
Francesco E Darakjy1017Argentina2025-03-31
Octavia G Sergi1018Japan2025-04-26
Aruna G Nestle1019France2025-04-09
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Izzy W PerinGermanyIvan Magalhaes UNQUALIFIED
James O VenereItalyElwin Sharvill PROPOSAL
Salvatore O DarakjyIndiaStephen Shaw PROPOSAL
Clifford C WaycottBrazilAmy Elsner PROPOSAL
Isabel R FigeroaSpainElwin Sharvill RENEWAL
Maria T RoysterItalyBernardo Dominic UNQUALIFIED
Mayumi A PoquetteCanadaAsiya Javayant UNQUALIFIED
Francesco Z DilliardFranceAmy Elsner PROPOSAL
Maisha A SchemmerFranceIvan Magalhaes QUALIFIED
Greenwood A SchemmerSpainAsiya Javayant PROPOSAL
Jones B ChuiJapanAsiya Javayant UNQUALIFIED
Rodrigues R OldroydFranceStephen Shaw NEGOTIATION
Mayumi F CampainBrazilIvan Magalhaes NEW
Ashley G WaycottUnited KingdomIvan Magalhaes QUALIFIED
Mayumi R KolmetzRussiaXuxue Feng RENEWAL
Darci I ChuiArgentinaAmy Elsner RENEWAL
David U IturbideAustraliaAsiya Javayant QUALIFIED
Stacey G WhobreyBrazilElwin Sharvill NEGOTIATION
David Y RutaBrazilIvan Magalhaes RENEWAL
Adams C OstroskyFranceAsiya Javayant RENEWAL
Silvio P IturbideSpainAnna Fali PROPOSAL
Leja Y RimFranceElwin Sharvill QUALIFIED
Misaki C AlbaresAustraliaAsiya Javayant RENEWAL
Deepesh U MaletRussiaElwin Sharvill NEW
James M GillianSpainAmy Elsner QUALIFIED
Ashley I WhobreySpainIoni Bowcher RENEWAL
Rodrigues A BriddickRussiaAsiya Javayant UNQUALIFIED
Ricardo C SlusarskiAustraliaIoni Bowcher UNQUALIFIED
Kadeem N InouyeSpainBernardo Dominic RENEWAL
Jennifer Z ChuiCanadaElwin Sharvill UNQUALIFIED
Munro R SaylorsUnited KingdomIoni Bowcher NEW
Mayumi A RimIndiaAsiya Javayant QUALIFIED
Francesco Z SlusarskiJapanXuxue Feng RENEWAL
Antonio O BowleyCanadaStephen Shaw UNQUALIFIED
Ashley F TollnerRussiaBernardo Dominic PROPOSAL
James I BowleyGermanyElwin Sharvill NEW
Maisha A AlbaresFranceXuxue Feng QUALIFIED
Maisha V PaprockiAustraliaAnna Fali PROPOSAL
Ricardo O RutaIndiaStephen Shaw UNQUALIFIED
Ricardo D PoquetteUnited KingdomOnyama Limba 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>