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
Leja D SergiBrazilElwin Sharvill NEW
Francesco Z GarufiGermanyIoni Bowcher PROPOSAL
Aika H StensethAustraliaAnna Fali UNQUALIFIED
Aditya E DilliardUnited KingdomIvan Magalhaes NEGOTIATION
Aika U ChuiJapanOnyama Limba QUALIFIED
Claire R DarakjyGermanyStephen Shaw QUALIFIED
Arvin U BriddickItalyOnyama Limba NEW
Faith X IturbideGermanyStephen Shaw PROPOSAL
Adams U NickaAustraliaIoni Bowcher PROPOSAL
Darci D VocelkaBrazilIvan Magalhaes NEW
Salvatore M SchemmerRussiaBernardo Dominic QUALIFIED
Nicolas G PerinSpainIoni Bowcher NEGOTIATION
Chavez L CaudyGermanyIoni Bowcher NEW
Kadeem L RoysterJapanAmy Elsner NEW
Maria O FlosiSpainIvan Magalhaes RENEWAL
Greenwood R GauchoIndiaStephen Shaw QUALIFIED
Ricardo B KuskoJapanBernardo Dominic PROPOSAL
Aruna U RulapaughFranceAnna Fali NEW
Mujtaba V BriddickGermanyOnyama Limba PROPOSAL
Johnson W OldroydFranceAsiya Javayant UNQUALIFIED
Sinclair X VenereGermanyIoni Bowcher QUALIFIED
Antonio J SaylorsArgentinaAnna Fali NEGOTIATION
David K GillianGermanyAsiya Javayant UNQUALIFIED
Arvin I SergiCanadaOnyama Limba QUALIFIED
Kadeem P MaletJapanOnyama Limba RENEWAL
Sinclair Q ButtArgentinaElwin Sharvill PROPOSAL
Rodrigues D GauchoIndiaAnna Fali QUALIFIED
Wickens Z KolmetzGermanyStephen Shaw NEW
Cody P ShinkoUnited KingdomBernardo Dominic RENEWAL
Jefferson T GillianJapanAsiya Javayant UNQUALIFIED
Mayumi J MaletSpainAmy Elsner NEW
Tony F PoquetteFranceElwin Sharvill NEGOTIATION
Cody N CampainBrazilStephen Shaw PROPOSAL
Smith Q VocelkaUnited KingdomIoni Bowcher PROPOSAL
Aika R FigeroaFranceBernardo Dominic UNQUALIFIED
Juan Z NickaJapanOnyama Limba RENEWAL
Leja X PerinArgentinaXuxue Feng UNQUALIFIED
Antonio Q CaudyRussiaAnna Fali PROPOSAL
Morrow D IturbideArgentinaIoni Bowcher RENEWAL
Stacey G CaudyCanadaAsiya Javayant RENEWAL
Octavia M AlbaresFranceAsiya Javayant NEGOTIATION
Stacey H GlickAustraliaXuxue Feng RENEWAL
Aditya S DarakjyFranceAnna Fali RENEWAL
Kadeem C InouyeGermanyIoni Bowcher NEW
Maria W MaletBrazilXuxue Feng UNQUALIFIED
Emily M WieserBrazilIvan Magalhaes NEGOTIATION
Octavia W CaldareraUnited KingdomAnna Fali RENEWAL
Misaki Y RutaFranceIoni Bowcher UNQUALIFIED
Jennifer U ChuiArgentinaAmy Elsner NEGOTIATION
Kaitlin P KolmetzJapanIvan Magalhaes PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Rodrigues C GillianBrazilAnna Fali NEW
Mayumi W ShinkoJapanBernardo Dominic QUALIFIED
Silvio P PerinSpainBernardo Dominic QUALIFIED
Deepesh U KuskoBrazilBernardo Dominic NEGOTIATION
Smith N RutaJapanAmy Elsner QUALIFIED
Juan S CaudyRussiaAmy Elsner NEGOTIATION
Rodrigues O AmigonBrazilAmy Elsner RENEWAL
Ashley G NestleIndiaAsiya Javayant RENEWAL
Emily V FigeroaCanadaIvan Magalhaes NEW
Arvin L MorascaCanadaAsiya Javayant NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000David S WhobreyItaly2025-05-29Morlong Associates QUALIFIED49Bernardo Dominic
1001Jones Z VocelkaIndia2025-06-10Feltz Printing Service RENEWAL22Ioni Bowcher
1002Jones Y KuskoJapan2025-05-30Chanay, Jeffrey A Esq RENEWAL29Stephen Shaw
1003Salvatore U VocelkaRussia2025-05-20Dorl, James J Esq PROPOSAL3Bernardo Dominic
1004David H FerenczSpain2025-06-10Chemel, James L Cpa NEGOTIATION62Bernardo Dominic
1005James P DoeJapan2025-05-19Rangoni Of Florence PROPOSAL65Bernardo Dominic
1006Mayumi M WieserAustralia2025-05-26Chapman, Ross E Esq NEW26Stephen Shaw
1007Faith H AmigonFrance2025-06-14Rousseaux, Michael Esq UNQUALIFIED60Xuxue Feng
1008Leon H NickaIndia2025-06-14Rousseaux, Michael Esq NEW33Asiya Javayant
1009Morrow Q MacleadJapan2025-06-06Rangoni Of Florence NEGOTIATION29Asiya Javayant
1010Chavez U BowleyArgentina2025-06-16Buckley Miller Wright PROPOSAL58Elwin Sharvill
1011Francesco V VocelkaCanada2025-05-21Feiner Bros UNQUALIFIED74Anna Fali
1012Ivar L ShinkoRussia2025-06-08Feiner Bros RENEWAL85Ivan Magalhaes
1013Adams D SchemmerRussia2025-06-12Morlong Associates UNQUALIFIED25Elwin Sharvill
1014Arvin K ShinkoJapan2025-05-21Printing Dimensions PROPOSAL6Stephen Shaw
1015Mayumi N KuskoGermany2025-06-15Buckley Miller Wright QUALIFIED76Elwin Sharvill
1016Smith X NickaJapan2025-05-26Rousseaux, Michael Esq NEGOTIATION30Asiya Javayant
1017Emily J PaprockiSpain2025-06-09Rousseaux, Michael Esq QUALIFIED49Asiya Javayant
1018Juan Z MorascaGermany2025-05-24Feltz Printing Service QUALIFIED68Onyama Limba
1019Leon B SlusarskiUnited Kingdom2025-05-25King, Christopher A Esq NEGOTIATION92Elwin Sharvill
1020Leja B BowleyFrance2025-06-04Truhlar And Truhlar Attys QUALIFIED22Amy Elsner
1021Juan K IturbideArgentina2025-06-05Buckley Miller Wright NEW92Xuxue Feng
1022Claire Y IturbideCanada2025-05-29King, Christopher A Esq PROPOSAL61Amy Elsner
1023Cody L RulapaughUnited Kingdom2025-06-03Feiner Bros QUALIFIED88Ioni Bowcher
1024Juan H GarufiRussia2025-06-05Rangoni Of Florence PROPOSAL17Onyama Limba
1025Silvio B RoysterSpain2025-06-01Chapman, Ross E Esq QUALIFIED30Stephen Shaw
1026Mujtaba A RutaRussia2025-06-16Benton, John B Jr NEGOTIATION34Onyama Limba
1027Greenwood Y SlusarskiItaly2025-06-09Printing Dimensions RENEWAL68Amy Elsner
1028Clifford H MorascaGermany2025-05-21Feiner Bros PROPOSAL72Ivan Magalhaes
1029David F PerinSpain2025-06-14Rousseaux, Michael Esq NEW70Onyama Limba
1030Wickens F BriddickItaly2025-06-14Rangoni Of Florence QUALIFIED48Onyama Limba
1031Nicolas S WhobreyArgentina2025-06-03Morlong Associates PROPOSAL57Xuxue Feng
1032Jones P GillianJapan2025-05-25King, Christopher A Esq NEGOTIATION5Stephen Shaw
1033Sinclair Q RutaSpain2025-05-18Rousseaux, Michael Esq NEGOTIATION45Amy Elsner
1034Claire Q CaudyBrazil2025-05-29Printing Dimensions NEW56Elwin Sharvill
1035Leja J GauchoItaly2025-06-01King, Christopher A Esq UNQUALIFIED80Asiya Javayant
1036Emily A PaprockiIndia2025-06-02Rangoni Of Florence NEGOTIATION7Xuxue Feng
1037Julie L DilliardUnited Kingdom2025-06-06King, Christopher A Esq RENEWAL5Xuxue Feng
1038Izzy P NestleSpain2025-05-21Feiner Bros PROPOSAL67Bernardo Dominic
1039Jefferson U SlusarskiCanada2025-06-13Feiner Bros NEGOTIATION54Elwin Sharvill
1040Aditya X GauchoAustralia2025-05-26Buckley Miller Wright UNQUALIFIED38Asiya Javayant
1041Francesco U GarufiArgentina2025-05-19Chemel, James L Cpa QUALIFIED91Ivan Magalhaes
1042Tony V NestleGermany2025-06-09Printing Dimensions PROPOSAL15Elwin Sharvill
1043Juan H KolmetzCanada2025-06-09Feltz Printing Service NEW55Onyama Limba
1044Aika Q ShinkoAustralia2025-05-18Chanay, Jeffrey A Esq NEW93Elwin Sharvill
1045Adams P SergiAustralia2025-05-21Buckley Miller Wright QUALIFIED36Onyama Limba
1046Darci J VocelkaSpain2025-06-09Chemel, James L Cpa RENEWAL77Ivan Magalhaes
1047Ashley M AmigonRussia2025-06-08Feltz Printing Service PROPOSAL46Anna Fali
1048Murillo J DilliardUnited Kingdom2025-05-18Feltz Printing Service NEGOTIATION81Bernardo Dominic
1049Silvio F MacleadAustralia2025-06-05Truhlar And Truhlar Attys PROPOSAL63Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Clifford N BowleyUnited KingdomOnyama Limba RENEWAL
Arvin L MarrierSpainIvan Magalhaes UNQUALIFIED
Darci W FollerSpainIoni Bowcher UNQUALIFIED
Arvin U RimAustraliaStephen Shaw QUALIFIED
Sinclair T StensethItalyIvan Magalhaes QUALIFIED
Alejandro A KolmetzSpainAmy Elsner PROPOSAL
Ivar E FollerRussiaElwin Sharvill PROPOSAL
Rodrigues P GlickSpainAnna Fali NEGOTIATION
Arvin F CaldareraFranceAnna Fali NEGOTIATION
Ashley Z OldroydItalyStephen Shaw NEGOTIATION
Julie C WaycottAustraliaXuxue Feng UNQUALIFIED
Smith X MarrierRussiaIoni Bowcher UNQUALIFIED
Kaitlin W BriddickBrazilXuxue Feng UNQUALIFIED
Adams B MaletJapanElwin Sharvill QUALIFIED
Faith A DoeItalyOnyama Limba NEGOTIATION
Sinclair Q CaudyGermanyIvan Magalhaes PROPOSAL
James C PerinUnited KingdomOnyama Limba PROPOSAL
David F MorascaGermanyBernardo Dominic QUALIFIED
Mayumi J CampainAustraliaElwin Sharvill UNQUALIFIED
Ricardo H BriddickGermanyIvan Magalhaes NEGOTIATION
Jones Z AlbaresFranceStephen Shaw UNQUALIFIED
Octavia R ShinkoUnited KingdomAmy Elsner QUALIFIED
Wickens C MarrierBrazilElwin Sharvill QUALIFIED
Aika A InouyeUnited KingdomXuxue Feng UNQUALIFIED
Darci D DoeRussiaOnyama Limba RENEWAL
Kadeem J RutaRussiaIoni Bowcher PROPOSAL
Aika U SergiJapanElwin Sharvill UNQUALIFIED
Chavez X VenereGermanyElwin Sharvill QUALIFIED
Aditya D SaylorsCanadaAmy Elsner NEGOTIATION
Greenwood G GlickRussiaAsiya Javayant QUALIFIED
Nicolas V VenereBrazilXuxue Feng UNQUALIFIED
Darci E StensethJapanAmy Elsner NEGOTIATION
Antonio G BriddickFranceXuxue Feng NEGOTIATION
Ricardo B IturbideCanadaXuxue Feng PROPOSAL
Chavez G FerenczBrazilElwin Sharvill QUALIFIED
Francesco N VenereArgentinaXuxue Feng NEGOTIATION
Salvatore X NickaCanadaBernardo Dominic QUALIFIED
Mayumi L CaudySpainOnyama Limba NEW
Salvatore B WhobreyIndiaBernardo Dominic NEW
Julie D SlusarskiSpainAmy Elsner RENEWAL
Darci Q MorascaJapanIoni Bowcher NEW
Leja E ButtItalyIoni Bowcher PROPOSAL
Jefferson R RutaFranceIoni Bowcher NEGOTIATION
Greenwood T AmigonAustraliaIvan Magalhaes UNQUALIFIED
Misaki L RoysterGermanyBernardo Dominic NEW
Darci Z GillianFranceAnna Fali QUALIFIED
Sinclair K PerinSpainStephen Shaw NEGOTIATION
Johnson H DoeFranceOnyama Limba PROPOSAL
Leja N SaylorsItalyBernardo Dominic RENEWAL
Jones J KuskoUnited KingdomBernardo Dominic RENEWAL
Frozen Columns
Name
Rodrigues Q Paprocki
Octavia K Malet
Tony X Dilliard
Salvatore X Ruta
Tony Y Kusko
Misaki W Poquette
Aruna J Iturbide
Mayumi H Briddick
Maria W Saylors
Nicolas C Briddick
Greenwood T Perin
Maria B Kolmetz
Jones I Stockham
Ashley T Doe
Jennifer D Ruta
Ashley C Venere
Jefferson Y Marrier
Cody U Malet
Clifford K Shinko
Salvatore O Venere
Sinclair O Shinko
Smith V Kolmetz
Cody K Rim
Wickens W Garufi
Maisha W Doe
Mayumi K Ruta
Murillo X Garufi
Jefferson W Whobrey
Tony M Iturbide
Tony J Malet
Nicolas B Waycott
Isabel G Malet
James P Whobrey
Salvatore E Sergi
Adams O Nestle
Murillo Y Doe
Deepesh M Perin
Salvatore J Nestle
Maria H Sergi
Antonio Q Saylors
Morrow X Nestle
Misaki R Figeroa
Kadeem O Marrier
Rodrigues Q Garufi
Jefferson E Shinko
Aruna R Royster
Francesco I Shinko
Smith B Vocelka
Cody O Bolognia
Isabel D Ruta
IdCountryDate
1000Spain2025-05-18
1001Germany2025-06-03
1002Russia2025-05-25
1003United Kingdom2025-06-06
1004Russia2025-05-20
1005Spain2025-05-18
1006Spain2025-05-29
1007India2025-05-21
1008Germany2025-06-16
1009Spain2025-05-30
1010Canada2025-06-10
1011Japan2025-06-08
1012Germany2025-05-31
1013United Kingdom2025-05-30
1014Italy2025-05-27
1015Japan2025-06-02
1016Argentina2025-05-21
1017India2025-06-12
1018France2025-06-06
1019Spain2025-05-29
1020Australia2025-05-31
1021Italy2025-05-21
1022Australia2025-06-10
1023Brazil2025-06-02
1024Spain2025-05-28
1025Canada2025-06-13
1026Japan2025-05-29
1027Canada2025-06-05
1028Australia2025-06-06
1029Germany2025-05-29
1030Spain2025-06-14
1031Brazil2025-05-21
1032France2025-06-14
1033France2025-06-14
1034Germany2025-06-03
1035United Kingdom2025-06-15
1036Italy2025-06-12
1037Japan2025-05-18
1038Japan2025-06-14
1039Australia2025-06-03
1040United Kingdom2025-06-12
1041Argentina2025-06-04
1042Canada2025-05-19
1043Russia2025-06-03
1044Brazil2025-05-24
1045Australia2025-05-18
1046Australia2025-05-23
1047Japan2025-05-25
1048Germany2025-05-21
1049Spain2025-05-21

On-Demand Data

NameIdCountryDate
Rodrigues V Gaucho1000Australia2025-06-07
Costa K Amigon1001India2025-05-21
Francesco I Paprocki1002Japan2025-06-10
Aditya Z Flosi1003Italy2025-06-13
Leja R Kolmetz1004Spain2025-06-01
Izzy C Kusko1005Argentina2025-05-23
Isabel G Marrier1006Brazil2025-06-07
Misaki U Inouye1007India2025-06-11
David G Nestle1008Argentina2025-05-31
Maisha P Doe1009Russia2025-06-03
Chavez D Royster1010Argentina2025-06-03
Ashley A Gaucho1011Canada2025-06-14
Costa I Albares1012Brazil2025-06-15
Misaki C Rulapaugh1013Japan2025-06-14
James H Butt1014France2025-05-28
Maisha Z Schemmer1015Germany2025-05-18
Jefferson Y Shinko1016Italy2025-05-27
Costa L Nestle1017Argentina2025-05-18
James X Nicka1018Australia2025-06-06
Munro A Royster1019Germany2025-05-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
David O RulapaughGermanyAsiya Javayant NEW
Greenwood W RulapaughItalyBernardo Dominic UNQUALIFIED
Stacey C CampainIndiaBernardo Dominic PROPOSAL
Antonio O MarrierJapanIoni Bowcher NEGOTIATION
Deepesh U DilliardSpainOnyama Limba QUALIFIED
Faith Q PaprockiRussiaAnna Fali PROPOSAL
Mayumi K VocelkaRussiaAmy Elsner NEGOTIATION
Sinclair C DoeItalyXuxue Feng PROPOSAL
Jeanfrancois S CampainArgentinaElwin Sharvill NEW
Jones U RutaRussiaAnna Fali RENEWAL
Alejandro Y MaletItalyIvan Magalhaes UNQUALIFIED
Faith D FollerSpainXuxue Feng UNQUALIFIED
Darci D PaprockiAustraliaBernardo Dominic NEW
Cody X CaudyRussiaIoni Bowcher QUALIFIED
Tony Y KuskoArgentinaAsiya Javayant RENEWAL
Leja L FlosiFranceXuxue Feng PROPOSAL
Faith W RoysterUnited KingdomOnyama Limba RENEWAL
Adams M MaletGermanyXuxue Feng PROPOSAL
Ricardo P IturbideBrazilElwin Sharvill PROPOSAL
Stacey J BriddickAustraliaXuxue Feng UNQUALIFIED
Chavez Q SchemmerUnited KingdomXuxue Feng UNQUALIFIED
Greenwood M VocelkaFranceBernardo Dominic RENEWAL
Maria D PerinItalyXuxue Feng NEW
Tony B FollerIndiaBernardo Dominic QUALIFIED
Leon L NickaArgentinaAnna Fali PROPOSAL
Izzy B RoysterIndiaAnna Fali RENEWAL
Johnson T NestleArgentinaElwin Sharvill NEW
Deepesh L IturbideRussiaBernardo Dominic UNQUALIFIED
Ricardo R RimArgentinaIoni Bowcher RENEWAL
Munro W WaycottAustraliaXuxue Feng NEW
Greenwood E BriddickItalyAnna Fali NEW
Clifford T KuskoSpainStephen Shaw NEGOTIATION
Emily V RulapaughRussiaStephen Shaw PROPOSAL
Ivar L BriddickIndiaIoni Bowcher PROPOSAL
James B SergiArgentinaBernardo Dominic NEGOTIATION
Kaitlin K SlusarskiUnited KingdomBernardo Dominic QUALIFIED
Isabel Q DarakjyBrazilAnna Fali NEW
Costa B KolmetzSpainAsiya Javayant QUALIFIED
Wickens K ChuiBrazilStephen Shaw RENEWAL
Misaki R PoquetteJapanAnna Fali 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>