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
Munro T WaycottGermanyAnna Fali NEGOTIATION
Mayumi O NestleItalyBernardo Dominic PROPOSAL
Maisha T FigeroaAustraliaIvan Magalhaes PROPOSAL
Kaitlin L StensethArgentinaElwin Sharvill NEW
Sinclair F IturbideRussiaOnyama Limba RENEWAL
Chavez O FlosiCanadaElwin Sharvill NEW
Aruna Y NestleRussiaAnna Fali NEGOTIATION
Jefferson Z KolmetzArgentinaIoni Bowcher QUALIFIED
Julie F MarrierArgentinaElwin Sharvill QUALIFIED
Clifford M MacleadRussiaIoni Bowcher PROPOSAL
Sinclair M AmigonBrazilAsiya Javayant QUALIFIED
Kadeem T OstroskyCanadaAmy Elsner PROPOSAL
Costa T GlickItalyAnna Fali UNQUALIFIED
Jennifer H PaprockiIndiaIvan Magalhaes QUALIFIED
Faith J StensethBrazilAmy Elsner NEGOTIATION
Nicolas V FollerItalyAnna Fali NEW
Morrow E DilliardArgentinaIvan Magalhaes PROPOSAL
Arvin Q VocelkaGermanyIvan Magalhaes UNQUALIFIED
Leon G FerenczArgentinaAsiya Javayant QUALIFIED
Jones W ButtUnited KingdomOnyama Limba UNQUALIFIED
Faith Y GillianBrazilStephen Shaw NEGOTIATION
Kaitlin D OstroskyArgentinaStephen Shaw NEW
Ivar B WhobreyArgentinaElwin Sharvill PROPOSAL
Maria Q MarrierCanadaXuxue Feng UNQUALIFIED
Aditya G ShinkoGermanyIoni Bowcher RENEWAL
Johnson A WhobreyRussiaBernardo Dominic NEW
Morrow I StockhamIndiaBernardo Dominic RENEWAL
Jennifer F CaldareraCanadaIvan Magalhaes UNQUALIFIED
Ricardo A SergiGermanyOnyama Limba NEW
Francesco N NickaSpainElwin Sharvill NEW
Smith W RutaUnited KingdomOnyama Limba RENEWAL
Adams V SaylorsJapanIvan Magalhaes UNQUALIFIED
Stacey V SergiGermanyElwin Sharvill NEW
Juan P IturbideItalyAmy Elsner PROPOSAL
Rodrigues P FerenczCanadaOnyama Limba NEGOTIATION
Kaitlin U GarufiIndiaStephen Shaw PROPOSAL
Emily X GillianFranceStephen Shaw RENEWAL
Deepesh F DoeJapanStephen Shaw NEW
James N CaudyGermanyIvan Magalhaes UNQUALIFIED
Ashley N RimGermanyElwin Sharvill UNQUALIFIED
Alejandro P KuskoCanadaStephen Shaw QUALIFIED
Deepesh T NestleUnited KingdomElwin Sharvill PROPOSAL
Octavia L GauchoJapanOnyama Limba UNQUALIFIED
Munro P PerinRussiaStephen Shaw RENEWAL
Leon F DilliardJapanOnyama Limba UNQUALIFIED
Ricardo Q FerenczUnited KingdomIvan Magalhaes PROPOSAL
Johnson F VenereRussiaIoni Bowcher UNQUALIFIED
Cody V GlickGermanyStephen Shaw RENEWAL
Ricardo L RimIndiaElwin Sharvill UNQUALIFIED
Darci M RulapaughItalyBernardo Dominic NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Julie R ButtArgentinaXuxue Feng PROPOSAL
David V MaletRussiaXuxue Feng UNQUALIFIED
Deepesh H SaylorsItalyStephen Shaw UNQUALIFIED
Wickens I BologniaAustraliaAnna Fali NEGOTIATION
Jeanfrancois T AmigonCanadaOnyama Limba RENEWAL
Juan Y ChuiSpainStephen Shaw RENEWAL
Wickens F GlickBrazilAnna Fali NEW
Silvio U IturbideJapanAmy Elsner RENEWAL
Leon L PerinUnited KingdomStephen Shaw NEGOTIATION
Munro K KuskoFranceBernardo Dominic RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Silvio P GarufiAustralia2024-08-25Dorl, James J Esq RENEWAL21Ivan Magalhaes
1001Jennifer X DilliardSpain2024-09-08Buckley Miller Wright UNQUALIFIED61Asiya Javayant
1002Aruna U GlickBrazil2024-08-25Truhlar And Truhlar Attys RENEWAL25Xuxue Feng
1003Chavez H GauchoUnited Kingdom2024-09-06Buckley Miller Wright QUALIFIED54Ivan Magalhaes
1004Antonio P RulapaughAustralia2024-09-19Benton, John B Jr NEGOTIATION82Amy Elsner
1005Francesco W WaycottArgentina2024-09-04Buckley Miller Wright UNQUALIFIED1Asiya Javayant
1006Silvio H StockhamFrance2024-09-06Printing Dimensions NEGOTIATION78Xuxue Feng
1007Maisha X NickaArgentina2024-08-26Benton, John B Jr QUALIFIED23Onyama Limba
1008Tony R BologniaIndia2024-08-31Printing Dimensions RENEWAL59Xuxue Feng
1009Claire N TollnerFrance2024-09-20Rousseaux, Michael Esq NEW66Onyama Limba
1010David N WhobreyJapan2024-09-05Benton, John B Jr NEGOTIATION19Ioni Bowcher
1011Leja W RutaGermany2024-09-12Printing Dimensions PROPOSAL67Asiya Javayant
1012Maisha P CaldareraArgentina2024-09-03Benton, John B Jr UNQUALIFIED87Xuxue Feng
1013Maria C CampainJapan2024-09-19King, Christopher A Esq PROPOSAL60Elwin Sharvill
1014Mujtaba O MarrierCanada2024-09-20Chapman, Ross E Esq RENEWAL7Anna Fali
1015Chavez D GillianFrance2024-08-30Printing Dimensions QUALIFIED65Anna Fali
1016Claire H BologniaItaly2024-09-18Rousseaux, Michael Esq NEGOTIATION26Amy Elsner
1017Wickens I StockhamBrazil2024-08-30Rangoni Of Florence PROPOSAL17Elwin Sharvill
1018Jeanfrancois O MarrierGermany2024-09-12Chanay, Jeffrey A Esq UNQUALIFIED61Elwin Sharvill
1019Silvio G MaletSpain2024-08-29Chemel, James L Cpa PROPOSAL29Ivan Magalhaes
1020Johnson Q BologniaJapan2024-09-01Chapman, Ross E Esq NEGOTIATION47Onyama Limba
1021Leon S OldroydJapan2024-08-31Chapman, Ross E Esq QUALIFIED51Elwin Sharvill
1022Morrow X RutaRussia2024-09-18Commercial Press RENEWAL64Onyama Limba
1023Sinclair A RimJapan2024-09-10Buckley Miller Wright UNQUALIFIED70Ioni Bowcher
1024Greenwood I KolmetzCanada2024-08-31Commercial Press NEGOTIATION73Ioni Bowcher
1025Emily Z NickaFrance2024-08-26Rangoni Of Florence PROPOSAL93Asiya Javayant
1026Antonio W FerenczGermany2024-09-10Feltz Printing Service NEGOTIATION69Asiya Javayant
1027Jefferson M VocelkaJapan2024-09-03Feiner Bros NEW47Onyama Limba
1028James M BowleySpain2024-08-28Printing Dimensions UNQUALIFIED36Asiya Javayant
1029Morrow D DoeJapan2024-09-07Rousseaux, Michael Esq PROPOSAL22Xuxue Feng
1030Smith K GlickJapan2024-09-11Feltz Printing Service RENEWAL23Bernardo Dominic
1031Claire F IturbideUnited Kingdom2024-09-01King, Christopher A Esq RENEWAL10Amy Elsner
1032Wickens H ButtGermany2024-09-09Rousseaux, Michael Esq UNQUALIFIED6Bernardo Dominic
1033Silvio S GlickAustralia2024-09-23Truhlar And Truhlar Attys NEGOTIATION17Ivan Magalhaes
1034David T BologniaCanada2024-08-29Morlong Associates NEGOTIATION26Anna Fali
1035Claire Q AmigonSpain2024-09-03Rousseaux, Michael Esq UNQUALIFIED74Asiya Javayant
1036Johnson K NestleJapan2024-09-19King, Christopher A Esq NEGOTIATION53Stephen Shaw
1037Octavia S SergiFrance2024-08-25Feltz Printing Service UNQUALIFIED72Stephen Shaw
1038Octavia Q PoquetteIndia2024-08-31Commercial Press RENEWAL28Bernardo Dominic
1039Rodrigues N RoysterAustralia2024-09-20Chemel, James L Cpa QUALIFIED29Anna Fali
1040Leon B ButtCanada2024-08-31Chanay, Jeffrey A Esq RENEWAL66Bernardo Dominic
1041Alejandro G MaletBrazil2024-09-21Feiner Bros UNQUALIFIED76Asiya Javayant
1042Salvatore M DilliardFrance2024-08-26Printing Dimensions RENEWAL12Ivan Magalhaes
1043David Z TollnerJapan2024-08-29Chanay, Jeffrey A Esq UNQUALIFIED5Stephen Shaw
1044Aditya U WieserCanada2024-09-16Printing Dimensions QUALIFIED43Onyama Limba
1045Johnson D IturbideJapan2024-08-28Feltz Printing Service UNQUALIFIED63Bernardo Dominic
1046David U BologniaSpain2024-09-04Chapman, Ross E Esq PROPOSAL92Xuxue Feng
1047Leon D RimUnited Kingdom2024-09-09Feltz Printing Service PROPOSAL68Asiya Javayant
1048Munro L ChuiArgentina2024-08-27Benton, John B Jr UNQUALIFIED39Ioni Bowcher
1049Salvatore A RulapaughSpain2024-09-19Printing Dimensions RENEWAL64Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Costa M MorascaFranceXuxue Feng QUALIFIED
Mujtaba I PoquetteJapanAmy Elsner QUALIFIED
Misaki S PoquetteAustraliaOnyama Limba RENEWAL
Maisha O DoeFranceElwin Sharvill UNQUALIFIED
Smith N SergiItalyElwin Sharvill UNQUALIFIED
Alejandro P MaletGermanyAsiya Javayant NEGOTIATION
Rodrigues W GlickIndiaAmy Elsner NEGOTIATION
Salvatore S PerinIndiaAnna Fali NEW
Aruna S TollnerCanadaElwin Sharvill NEGOTIATION
Mujtaba C VenereArgentinaAsiya Javayant NEGOTIATION
Ashley Y OstroskyCanadaAnna Fali QUALIFIED
Jones D BologniaFranceStephen Shaw NEGOTIATION
Chavez W VocelkaJapanIvan Magalhaes NEGOTIATION
Adams F ShinkoSpainIvan Magalhaes NEGOTIATION
Tony G FerenczAustraliaElwin Sharvill PROPOSAL
Salvatore J VenereJapanIvan Magalhaes QUALIFIED
Aika Z MaletJapanBernardo Dominic QUALIFIED
Francesco N ButtJapanAnna Fali RENEWAL
Nicolas A MaletCanadaXuxue Feng NEW
Tony C CaldareraIndiaIoni Bowcher QUALIFIED
Wickens V ShinkoBrazilAnna Fali UNQUALIFIED
Murillo Y CaldareraRussiaOnyama Limba PROPOSAL
Jefferson H RulapaughIndiaBernardo Dominic NEW
Murillo G StockhamFranceAmy Elsner PROPOSAL
Claire Y AmigonBrazilIoni Bowcher QUALIFIED
Maria M KuskoAustraliaIoni Bowcher RENEWAL
Tony F OldroydIndiaIvan Magalhaes RENEWAL
Stacey O DilliardCanadaXuxue Feng RENEWAL
Izzy B SlusarskiArgentinaAnna Fali PROPOSAL
Johnson V StensethCanadaXuxue Feng UNQUALIFIED
Rodrigues M GillianGermanyIoni Bowcher QUALIFIED
Kadeem Q KolmetzItalyIvan Magalhaes QUALIFIED
James X MacleadUnited KingdomElwin Sharvill PROPOSAL
Murillo M SergiFranceIoni Bowcher PROPOSAL
Cody T CampainItalyAsiya Javayant RENEWAL
Jefferson L FollerItalyIoni Bowcher QUALIFIED
Sinclair K RulapaughUnited KingdomIoni Bowcher UNQUALIFIED
James U FigeroaFranceAsiya Javayant PROPOSAL
Ivar H CampainArgentinaIvan Magalhaes NEW
Ricardo X ButtFranceAmy Elsner PROPOSAL
Kaitlin R NestleArgentinaXuxue Feng RENEWAL
Mayumi V DarakjyArgentinaAmy Elsner PROPOSAL
Francesco F RulapaughAustraliaElwin Sharvill UNQUALIFIED
Kaitlin Q MarrierUnited KingdomIoni Bowcher UNQUALIFIED
Aruna G GauchoItalyXuxue Feng PROPOSAL
James T NestleUnited KingdomAsiya Javayant NEW
Emily G IturbideIndiaIvan Magalhaes PROPOSAL
Francesco E GillianRussiaXuxue Feng NEW
Ivar V GauchoItalyAsiya Javayant RENEWAL
Greenwood X SaylorsFranceXuxue Feng NEGOTIATION
Frozen Columns
Name
Alejandro S Tollner
Jefferson G Doe
Smith H Caldarera
Julie T Flosi
Silvio S Saylors
Murillo A Gaucho
Izzy J Chui
Izzy D Caldarera
Jennifer A Sergi
Mujtaba S Stockham
Cody J Flosi
Maria F Morasca
Ricardo G Morasca
Smith S Malet
Isabel Z Briddick
Leja M Vocelka
Deepesh Y Gillian
Maisha S Rulapaugh
Munro M Kusko
Ashley V Malet
Deepesh N Kolmetz
Julie C Campain
Munro C Dilliard
Chavez I Caldarera
Izzy F Bowley
Maisha L Doe
Aika I Shinko
Claire M Flosi
Tony T Albares
Juan T Ostrosky
James Q Bolognia
Maisha L Kusko
Antonio B Rim
Julie S Ferencz
Salvatore I Inouye
Stacey I Shinko
Maisha P Maclead
Leja N Foller
Izzy X Rulapaugh
Antonio B Bowley
Alejandro S Rim
Aruna T Vocelka
Jones I Shinko
Aika M Perin
Mayumi L Perin
Chavez N Wieser
Kaitlin D Ruta
Salvatore H Sergi
Salvatore H Venere
Cody Y Kusko
IdCountryDate
1000Russia2024-08-30
1001Brazil2024-08-28
1002Spain2024-08-27
1003Argentina2024-09-13
1004India2024-09-10
1005Australia2024-09-11
1006Australia2024-08-29
1007Brazil2024-09-12
1008United Kingdom2024-09-19
1009Italy2024-08-26
1010Spain2024-09-01
1011Germany2024-09-22
1012United Kingdom2024-09-17
1013United Kingdom2024-09-07
1014Brazil2024-09-14
1015France2024-09-01
1016Canada2024-08-26
1017Canada2024-08-26
1018Spain2024-09-08
1019India2024-09-23
1020Argentina2024-09-21
1021Canada2024-09-15
1022United Kingdom2024-09-13
1023Germany2024-09-08
1024Japan2024-09-15
1025Canada2024-09-05
1026Germany2024-09-11
1027Canada2024-09-10
1028Russia2024-09-06
1029India2024-09-08
1030India2024-09-12
1031Argentina2024-09-11
1032Italy2024-09-14
1033India2024-09-21
1034United Kingdom2024-09-19
1035United Kingdom2024-09-21
1036Italy2024-08-25
1037Spain2024-08-31
1038United Kingdom2024-08-26
1039Argentina2024-08-30
1040Australia2024-09-23
1041Italy2024-09-23
1042Italy2024-09-09
1043Russia2024-09-16
1044Argentina2024-08-25
1045France2024-08-28
1046Spain2024-09-07
1047India2024-08-30
1048Japan2024-09-03
1049Japan2024-09-17

On-Demand Data

NameIdCountryDate
Murillo H Briddick1000Germany2024-08-30
Juan M Flosi1001Canada2024-09-19
Johnson R Ferencz1002Australia2024-09-04
Leon T Sergi1003France2024-09-01
Johnson C Morasca1004Argentina2024-09-05
Jones G Malet1005Russia2024-08-27
Jennifer Z Ostrosky1006Russia2024-09-13
Smith J Maclead1007Russia2024-08-25
Antonio V Ruta1008Japan2024-09-11
Francesco G Malet1009Russia2024-09-06
Darci U Tollner1010France2024-08-29
Mujtaba E Briddick1011Canada2024-09-20
Salvatore R Foller1012Spain2024-09-03
Aditya T Nicka1013Spain2024-08-28
Arvin J Nestle1014Argentina2024-09-03
Ricardo A Slusarski1015France2024-09-21
Aditya I Tollner1016Argentina2024-09-21
Munro M Sergi1017United Kingdom2024-09-16
Jennifer H Schemmer1018United Kingdom2024-09-06
Kaitlin S Campain1019Germany2024-08-26
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Adams W DarakjyAustraliaIoni Bowcher NEW
Aditya I WaycottGermanyElwin Sharvill UNQUALIFIED
Isabel Q MaletAustraliaAnna Fali NEGOTIATION
Stacey N FollerJapanOnyama Limba NEGOTIATION
Ricardo A KuskoUnited KingdomAmy Elsner PROPOSAL
Octavia G BologniaRussiaIvan Magalhaes NEGOTIATION
Cody T ChuiJapanIvan Magalhaes NEW
Jeanfrancois K StensethGermanyAmy Elsner PROPOSAL
Deepesh Q DoeBrazilElwin Sharvill NEGOTIATION
Clifford A ButtFranceAsiya Javayant NEW
Maria E OldroydBrazilXuxue Feng NEGOTIATION
Maria T BowleySpainBernardo Dominic QUALIFIED
Jennifer Q InouyeJapanElwin Sharvill RENEWAL
Alejandro R IturbideItalyStephen Shaw UNQUALIFIED
Murillo P ButtIndiaIoni Bowcher PROPOSAL
Darci E FerenczArgentinaBernardo Dominic NEW
David N CaldareraJapanAnna Fali RENEWAL
Deepesh P WieserJapanAnna Fali NEW
Johnson N BowleyBrazilXuxue Feng NEW
Costa T PerinGermanyAmy Elsner NEGOTIATION
Aika P RoysterArgentinaXuxue Feng NEW
Cody B GillianGermanyIvan Magalhaes NEW
Smith L KuskoSpainIoni Bowcher UNQUALIFIED
Izzy P FollerRussiaAnna Fali NEW
Arvin V IturbideArgentinaAnna Fali QUALIFIED
Alejandro Z MorascaUnited KingdomElwin Sharvill QUALIFIED
Mujtaba U TollnerFranceStephen Shaw RENEWAL
Costa P RimFranceIoni Bowcher NEGOTIATION
Greenwood E RimJapanAnna Fali PROPOSAL
Salvatore X ShinkoGermanyAmy Elsner NEGOTIATION
Mayumi K BowleyItalyAnna Fali PROPOSAL
Alejandro C RimArgentinaXuxue Feng NEW
Kaitlin U StockhamBrazilStephen Shaw RENEWAL
Misaki L OldroydAustraliaAnna Fali PROPOSAL
Tony V MarrierAustraliaStephen Shaw UNQUALIFIED
Darci S OstroskyIndiaAsiya Javayant UNQUALIFIED
Jefferson T VenereSpainAmy Elsner RENEWAL
Stacey Q CampainSpainBernardo Dominic NEW
Ashley Q MorascaFranceStephen Shaw NEGOTIATION
James H WhobreyIndiaAnna Fali 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>