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
Johnson U SaylorsUnited KingdomStephen Shaw NEW
Morrow U VocelkaFranceAmy Elsner PROPOSAL
Leon L NickaUnited KingdomIoni Bowcher PROPOSAL
Ashley I FlosiCanadaBernardo Dominic UNQUALIFIED
Jennifer X AmigonCanadaAnna Fali PROPOSAL
Nicolas F ButtGermanyIvan Magalhaes QUALIFIED
Ricardo P VocelkaArgentinaBernardo Dominic PROPOSAL
Chavez W SergiUnited KingdomAsiya Javayant NEGOTIATION
Jones A GauchoJapanAmy Elsner PROPOSAL
Maria Y KuskoSpainAmy Elsner QUALIFIED
Ivar Y KolmetzSpainOnyama Limba RENEWAL
Aruna N AmigonBrazilAmy Elsner PROPOSAL
Darci M GlickJapanBernardo Dominic NEGOTIATION
Ashley C GlickJapanBernardo Dominic PROPOSAL
Claire I WhobreyRussiaBernardo Dominic RENEWAL
Kaitlin R StensethBrazilStephen Shaw NEW
David X OldroydIndiaIvan Magalhaes QUALIFIED
David E FollerBrazilIvan Magalhaes QUALIFIED
Adams N NestleCanadaIvan Magalhaes PROPOSAL
Morrow V MarrierUnited KingdomAmy Elsner PROPOSAL
Juan G GillianAustraliaStephen Shaw PROPOSAL
Maisha J WhobreyFranceIvan Magalhaes QUALIFIED
Mujtaba D DarakjyArgentinaOnyama Limba PROPOSAL
Francesco Q PerinRussiaElwin Sharvill NEW
Mujtaba G PoquetteItalyIoni Bowcher PROPOSAL
Juan E SaylorsBrazilBernardo Dominic PROPOSAL
Claire C SchemmerRussiaXuxue Feng QUALIFIED
Octavia T RulapaughJapanAmy Elsner PROPOSAL
Mayumi B GillianIndiaBernardo Dominic NEGOTIATION
Leon C KolmetzUnited KingdomAnna Fali UNQUALIFIED
Misaki I SlusarskiUnited KingdomStephen Shaw RENEWAL
Kaitlin T FollerGermanyAmy Elsner QUALIFIED
Julie P RutaUnited KingdomOnyama Limba NEW
Juan N AlbaresArgentinaAmy Elsner QUALIFIED
Kadeem D FigeroaRussiaIvan Magalhaes UNQUALIFIED
Kaitlin T KuskoUnited KingdomStephen Shaw NEW
Kadeem Z TollnerRussiaStephen Shaw RENEWAL
Ivar F DarakjyFranceOnyama Limba RENEWAL
Jones L GauchoSpainAnna Fali UNQUALIFIED
Jennifer G SergiGermanyIvan Magalhaes NEGOTIATION
Salvatore F TollnerSpainBernardo Dominic NEW
Aika W SaylorsUnited KingdomAnna Fali RENEWAL
Francesco K DilliardArgentinaXuxue Feng RENEWAL
Kadeem Q ShinkoRussiaStephen Shaw PROPOSAL
Adams E SaylorsFranceAsiya Javayant PROPOSAL
Salvatore J DoeAustraliaAsiya Javayant UNQUALIFIED
Aruna D FigeroaCanadaStephen Shaw RENEWAL
Cody J SchemmerArgentinaOnyama Limba NEGOTIATION
Sinclair B PaprockiSpainAnna Fali NEGOTIATION
Munro Y SergiAustraliaStephen Shaw NEW
Horizontal
NameCountryRepresentativeStatus
Mujtaba U VenereAustraliaIoni Bowcher UNQUALIFIED
Smith G VenereFranceAmy Elsner PROPOSAL
Silvio T MarrierJapanAsiya Javayant NEW
Rodrigues D TollnerUnited KingdomElwin Sharvill UNQUALIFIED
Jeanfrancois E RimIndiaBernardo Dominic NEW
Tony P FerenczItalyBernardo Dominic PROPOSAL
Juan A MarrierFranceBernardo Dominic NEW
Ricardo G RutaUnited KingdomAsiya Javayant NEGOTIATION
Rodrigues N PaprockiUnited KingdomAnna Fali UNQUALIFIED
Costa W GillianBrazilStephen Shaw UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000James O BowleyFrance2024-09-07Truhlar And Truhlar Attys QUALIFIED94Amy Elsner
1001Juan F ChuiGermany2024-09-10Chapman, Ross E Esq RENEWAL20Anna Fali
1002Salvatore P StockhamJapan2024-09-08Feiner Bros NEW80Elwin Sharvill
1003Arvin F MacleadItaly2024-09-15Printing Dimensions NEW28Bernardo Dominic
1004Aika L WieserCanada2024-09-23Buckley Miller Wright UNQUALIFIED41Elwin Sharvill
1005Darci R SlusarskiUnited Kingdom2024-09-20Benton, John B Jr QUALIFIED76Elwin Sharvill
1006Deepesh T VocelkaRussia2024-09-05Feiner Bros QUALIFIED50Elwin Sharvill
1007Greenwood G BowleyBrazil2024-08-31Rangoni Of Florence NEW19Amy Elsner
1008Emily D GillianCanada2024-09-01Rangoni Of Florence RENEWAL68Asiya Javayant
1009Jones X MaletIndia2024-09-15Dorl, James J Esq NEW79Stephen Shaw
1010Faith A KolmetzIndia2024-09-06Truhlar And Truhlar Attys QUALIFIED32Anna Fali
1011Isabel E WaycottItaly2024-09-04Truhlar And Truhlar Attys PROPOSAL57Xuxue Feng
1012Greenwood W MorascaArgentina2024-08-30Chapman, Ross E Esq NEGOTIATION42Xuxue Feng
1013Maisha L BologniaItaly2024-09-09Dorl, James J Esq NEGOTIATION18Ivan Magalhaes
1014Adams B VenereCanada2024-08-28King, Christopher A Esq UNQUALIFIED79Ioni Bowcher
1015Misaki G NickaAustralia2024-08-31Truhlar And Truhlar Attys QUALIFIED59Xuxue Feng
1016Jeanfrancois I MaletFrance2024-09-18Printing Dimensions NEW36Xuxue Feng
1017Ivar D SergiItaly2024-09-10Rousseaux, Michael Esq NEW51Xuxue Feng
1018Claire L PaprockiBrazil2024-09-01Benton, John B Jr PROPOSAL21Bernardo Dominic
1019Silvio N ShinkoJapan2024-09-25Printing Dimensions QUALIFIED60Amy Elsner
1020Aika Q CaudyGermany2024-09-10Buckley Miller Wright RENEWAL13Anna Fali
1021Costa G StensethIndia2024-08-30Feiner Bros NEW0Ioni Bowcher
1022Maria H VenereIndia2024-09-06Chemel, James L Cpa QUALIFIED48Ivan Magalhaes
1023Mayumi E RulapaughIndia2024-09-21Rousseaux, Michael Esq PROPOSAL47Elwin Sharvill
1024Isabel O VocelkaItaly2024-09-05Chanay, Jeffrey A Esq NEGOTIATION0Xuxue Feng
1025Juan G KuskoItaly2024-09-11Feltz Printing Service QUALIFIED80Anna Fali
1026Francesco J MaletRussia2024-09-02Chemel, James L Cpa NEW42Onyama Limba
1027Sinclair P FerenczRussia2024-09-09Benton, John B Jr RENEWAL89Bernardo Dominic
1028Julie V PerinCanada2024-09-10Dorl, James J Esq NEGOTIATION63Ioni Bowcher
1029Antonio J MacleadSpain2024-09-22Feiner Bros NEGOTIATION81Bernardo Dominic
1030Kaitlin P SaylorsJapan2024-09-06Morlong Associates RENEWAL13Ivan Magalhaes
1031Chavez Q NickaRussia2024-09-16Printing Dimensions PROPOSAL83Anna Fali
1032Misaki M BologniaCanada2024-08-28Benton, John B Jr NEW32Bernardo Dominic
1033James H MorascaUnited Kingdom2024-08-28Truhlar And Truhlar Attys QUALIFIED42Ioni Bowcher
1034Misaki W OstroskyJapan2024-09-23Truhlar And Truhlar Attys NEW9Elwin Sharvill
1035Jefferson N DilliardIndia2024-08-28Dorl, James J Esq NEW87Onyama Limba
1036Aika D PerinRussia2024-09-20Rousseaux, Michael Esq PROPOSAL28Ioni Bowcher
1037Kaitlin O AlbaresUnited Kingdom2024-09-14Printing Dimensions NEW25Onyama Limba
1038Jeanfrancois P RutaItaly2024-08-29Buckley Miller Wright UNQUALIFIED95Ioni Bowcher
1039Jeanfrancois E SergiFrance2024-09-24Buckley Miller Wright NEGOTIATION97Ioni Bowcher
1040Silvio Y WaycottFrance2024-09-17Chapman, Ross E Esq NEW13Amy Elsner
1041Juan X CampainIndia2024-09-16Feiner Bros PROPOSAL33Elwin Sharvill
1042James A MaletUnited Kingdom2024-09-08Commercial Press PROPOSAL58Bernardo Dominic
1043Adams S ShinkoCanada2024-09-23Buckley Miller Wright UNQUALIFIED1Anna Fali
1044Murillo Y ButtCanada2024-08-27Chemel, James L Cpa NEGOTIATION33Ivan Magalhaes
1045Murillo N RoysterRussia2024-08-27King, Christopher A Esq PROPOSAL93Stephen Shaw
1046Munro E ChuiGermany2024-09-05Feiner Bros PROPOSAL56Xuxue Feng
1047Emily Y NickaArgentina2024-09-01Morlong Associates NEW74Ioni Bowcher
1048Maria N SchemmerSpain2024-09-11King, Christopher A Esq UNQUALIFIED91Ioni Bowcher
1049Chavez J CampainJapan2024-09-16Chemel, James L Cpa NEGOTIATION90Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Kaitlin F KolmetzCanadaAnna Fali NEW
Antonio L ButtUnited KingdomElwin Sharvill NEGOTIATION
Stacey S AlbaresIndiaAsiya Javayant RENEWAL
Johnson T InouyeCanadaBernardo Dominic NEGOTIATION
Ashley B OstroskyFranceXuxue Feng PROPOSAL
Jefferson Q BriddickAustraliaStephen Shaw UNQUALIFIED
Salvatore W MorascaItalyBernardo Dominic RENEWAL
Jennifer K BowleyBrazilAsiya Javayant UNQUALIFIED
Juan J VenereIndiaIoni Bowcher PROPOSAL
Francesco I AlbaresItalyAmy Elsner PROPOSAL
Misaki W DarakjyFranceAsiya Javayant RENEWAL
Stacey X MarrierFranceAnna Fali NEW
Arvin N DarakjySpainAmy Elsner RENEWAL
Cody J ButtGermanyStephen Shaw NEW
Kaitlin K BriddickRussiaElwin Sharvill QUALIFIED
Smith C AlbaresIndiaBernardo Dominic NEGOTIATION
Maria N VocelkaUnited KingdomIvan Magalhaes QUALIFIED
Chavez T RoysterCanadaElwin Sharvill RENEWAL
Jones W ShinkoBrazilIvan Magalhaes QUALIFIED
Francesco H OstroskyRussiaBernardo Dominic QUALIFIED
Greenwood Z ButtIndiaOnyama Limba RENEWAL
Ricardo A NestleCanadaAmy Elsner PROPOSAL
Aika Z RulapaughJapanStephen Shaw NEW
Sinclair X CaudyJapanAnna Fali NEGOTIATION
Ashley R SergiAustraliaXuxue Feng RENEWAL
Aruna T ShinkoFranceElwin Sharvill RENEWAL
Aditya J DilliardCanadaStephen Shaw QUALIFIED
James E MaletFranceAsiya Javayant PROPOSAL
Deepesh Z GarufiItalyElwin Sharvill PROPOSAL
Costa W AlbaresJapanOnyama Limba RENEWAL
Isabel P FlosiAustraliaAmy Elsner QUALIFIED
Morrow N OldroydFranceBernardo Dominic PROPOSAL
Maria H MaletFranceAsiya Javayant PROPOSAL
Mujtaba S NickaCanadaXuxue Feng NEW
Murillo M MorascaArgentinaIvan Magalhaes NEW
Tony I PoquetteCanadaAsiya Javayant PROPOSAL
Sinclair R PerinIndiaStephen Shaw QUALIFIED
Leja G MorascaFranceAmy Elsner NEW
Morrow K DoeIndiaIoni Bowcher NEW
Maisha V SaylorsGermanyBernardo Dominic UNQUALIFIED
Alejandro V FigeroaRussiaXuxue Feng QUALIFIED
James T WhobreyJapanElwin Sharvill RENEWAL
Juan G PerinBrazilStephen Shaw NEGOTIATION
Costa B VocelkaAustraliaElwin Sharvill NEW
Julie Y GillianItalyOnyama Limba QUALIFIED
Maisha E VenereArgentinaXuxue Feng NEW
Jeanfrancois N BowleyItalyIvan Magalhaes NEGOTIATION
Nicolas H BologniaItalyStephen Shaw UNQUALIFIED
Silvio Z SaylorsJapanElwin Sharvill PROPOSAL
Munro C RoysterCanadaBernardo Dominic NEGOTIATION
Frozen Columns
Name
Emily Q Rulapaugh
Stacey H Malet
Jennifer S Ostrosky
Darci G Caudy
Adams P Marrier
Jennifer K Iturbide
Izzy L Briddick
Leon J Darakjy
Ivar B Tollner
Leon R Malet
Nicolas G Dilliard
Smith M Darakjy
Nicolas K Perin
Juan D Kusko
Johnson U Venere
Costa F Caldarera
Munro X Flosi
Maria I Morasca
Chavez W Bolognia
Arvin G Ruta
Sinclair X Perin
Murillo A Gaucho
Leon Y Stockham
Faith H Gillian
David F Oldroyd
Rodrigues Y Waycott
Alejandro K Paprocki
Murillo M Garufi
Chavez Y Whobrey
Silvio V Chui
Morrow K Rim
Maisha O Glick
Antonio A Marrier
Morrow A Malet
Juan U Nestle
Juan D Malet
Johnson D Caldarera
Faith X Poquette
Cody C Sergi
Deepesh O Sergi
Tony U Venere
Rodrigues T Ruta
Sinclair K Whobrey
Munro M Gillian
Jeanfrancois X Iturbide
Costa K Shinko
Aruna H Briddick
Jeanfrancois R Perin
Kaitlin M Gillian
Sinclair E Nestle
IdCountryDate
1000Argentina2024-09-24
1001Russia2024-09-16
1002Australia2024-09-10
1003India2024-09-08
1004France2024-09-20
1005Germany2024-09-02
1006France2024-09-03
1007Brazil2024-08-28
1008United Kingdom2024-09-07
1009United Kingdom2024-09-06
1010Russia2024-09-03
1011Japan2024-09-06
1012France2024-08-28
1013Spain2024-08-28
1014United Kingdom2024-09-08
1015Brazil2024-09-18
1016Germany2024-09-07
1017United Kingdom2024-09-25
1018Italy2024-09-21
1019Japan2024-09-03
1020Japan2024-09-04
1021United Kingdom2024-08-29
1022Russia2024-09-06
1023France2024-09-09
1024Canada2024-09-18
1025United Kingdom2024-09-07
1026Brazil2024-09-24
1027Russia2024-09-15
1028Russia2024-09-05
1029Japan2024-09-13
1030Argentina2024-09-19
1031India2024-09-08
1032Brazil2024-08-29
1033Brazil2024-09-07
1034Spain2024-09-25
1035Australia2024-09-25
1036Brazil2024-08-29
1037Australia2024-09-24
1038Argentina2024-09-17
1039Germany2024-09-06
1040France2024-09-17
1041Canada2024-09-03
1042Brazil2024-09-15
1043Japan2024-09-22
1044Canada2024-09-15
1045Canada2024-08-28
1046Argentina2024-09-16
1047Argentina2024-08-27
1048Canada2024-09-03
1049Russia2024-09-18

On-Demand Data

NameIdCountryDate
Mujtaba W Bolognia1000France2024-09-22
Kadeem J Dilliard1001Spain2024-09-03
Ashley J Amigon1002India2024-09-01
Mayumi Z Inouye1003Japan2024-08-27
Jefferson W Perin1004Brazil2024-09-14
Sinclair Z Nicka1005Italy2024-09-09
Jones C Bowley1006Italy2024-09-06
Maisha L Nestle1007India2024-09-22
Murillo P Figeroa1008Spain2024-09-11
Darci F Maclead1009Italy2024-09-21
Alejandro I Caldarera1010Germany2024-09-11
Aruna D Maclead1011France2024-09-04
Francesco J Inouye1012Spain2024-09-19
Jeanfrancois I Malet1013Australia2024-09-09
Ivar S Garufi1014Germany2024-09-19
Julie J Kusko1015Russia2024-09-11
Jeanfrancois F Bowley1016Italy2024-09-05
Alejandro E Marrier1017Germany2024-09-18
Claire X Foller1018Brazil2024-09-04
Jeanfrancois Q Poquette1019Germany2024-09-14
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Mujtaba V PoquetteJapanAnna Fali PROPOSAL
Ivar U DarakjyAustraliaBernardo Dominic NEW
Smith X RoysterRussiaStephen Shaw NEGOTIATION
Rodrigues O GarufiGermanyIoni Bowcher NEW
David E OstroskyArgentinaIvan Magalhaes NEGOTIATION
Izzy M PerinCanadaXuxue Feng RENEWAL
Jennifer X WaycottAustraliaAsiya Javayant NEW
Wickens U SchemmerCanadaAsiya Javayant QUALIFIED
Octavia N RimItalyXuxue Feng QUALIFIED
Jeanfrancois S GauchoUnited KingdomAnna Fali RENEWAL
Jeanfrancois A StensethBrazilXuxue Feng UNQUALIFIED
Murillo M FollerGermanyElwin Sharvill PROPOSAL
Nicolas M SchemmerFranceXuxue Feng RENEWAL
Kadeem R WaycottJapanIoni Bowcher NEW
Aika C ShinkoSpainIoni Bowcher NEGOTIATION
Aika X BriddickAustraliaStephen Shaw NEGOTIATION
Greenwood T PerinFranceElwin Sharvill NEGOTIATION
Deepesh G CampainUnited KingdomAsiya Javayant PROPOSAL
Munro X GarufiBrazilIoni Bowcher PROPOSAL
Murillo B NickaRussiaElwin Sharvill PROPOSAL
Maisha W RimUnited KingdomElwin Sharvill UNQUALIFIED
Claire E VenereItalyAsiya Javayant RENEWAL
Izzy M DarakjyAustraliaElwin Sharvill PROPOSAL
Leja J CaudyJapanBernardo Dominic UNQUALIFIED
Mayumi W PerinRussiaOnyama Limba UNQUALIFIED
Salvatore L ButtArgentinaElwin Sharvill UNQUALIFIED
Sinclair D PaprockiItalyXuxue Feng PROPOSAL
Ivar R FigeroaGermanyAsiya Javayant RENEWAL
Emily F GlickUnited KingdomAnna Fali QUALIFIED
Johnson X FlosiBrazilElwin Sharvill UNQUALIFIED
Maria P SchemmerIndiaStephen Shaw QUALIFIED
Ashley C AlbaresSpainIoni Bowcher RENEWAL
Arvin E IturbideSpainBernardo Dominic QUALIFIED
Greenwood E IturbideItalyAnna Fali NEW
Costa Z VocelkaBrazilIvan Magalhaes QUALIFIED
Mujtaba M FlosiSpainAmy Elsner UNQUALIFIED
Octavia Y ButtCanadaIoni Bowcher QUALIFIED
Jennifer C DarakjyItalyBernardo Dominic RENEWAL
Emily T IturbideBrazilBernardo Dominic PROPOSAL
Aruna F PoquetteArgentinaAmy Elsner 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>