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
Aditya Q VocelkaItalyIoni Bowcher NEW
Rodrigues C BriddickArgentinaAnna Fali NEW
Alejandro V RoysterSpainOnyama Limba RENEWAL
Morrow I PoquetteArgentinaAnna Fali RENEWAL
Antonio I BowleyJapanOnyama Limba QUALIFIED
Isabel C MorascaAustraliaAnna Fali QUALIFIED
Leja B RutaItalyIoni Bowcher RENEWAL
Maria R NestleBrazilXuxue Feng PROPOSAL
Antonio N VenereCanadaIoni Bowcher RENEWAL
Clifford C OstroskyItalyStephen Shaw NEW
Jennifer M SchemmerIndiaIoni Bowcher PROPOSAL
Stacey H FlosiAustraliaAnna Fali PROPOSAL
Ashley R GarufiFranceOnyama Limba NEW
Adams A PoquetteCanadaIvan Magalhaes NEW
Morrow C DarakjyJapanAmy Elsner NEW
Maria H GillianFranceOnyama Limba PROPOSAL
Clifford R PoquetteUnited KingdomAmy Elsner NEGOTIATION
Alejandro R GarufiGermanyXuxue Feng NEGOTIATION
Smith N CaudyIndiaAnna Fali RENEWAL
Adams J StensethAustraliaIoni Bowcher RENEWAL
Ashley E DilliardFranceAmy Elsner QUALIFIED
Ricardo V SergiCanadaXuxue Feng PROPOSAL
Octavia E GillianRussiaAmy Elsner PROPOSAL
Smith L DoeJapanStephen Shaw QUALIFIED
Octavia K TollnerCanadaIoni Bowcher NEGOTIATION
Munro U TollnerBrazilXuxue Feng PROPOSAL
Antonio S ChuiJapanOnyama Limba QUALIFIED
Octavia U WaycottCanadaAsiya Javayant UNQUALIFIED
Nicolas V NickaAustraliaOnyama Limba UNQUALIFIED
Kaitlin Y PaprockiSpainElwin Sharvill QUALIFIED
Jefferson E OldroydIndiaStephen Shaw QUALIFIED
Julie U MorascaSpainIoni Bowcher PROPOSAL
Izzy K BowleyCanadaElwin Sharvill NEW
Salvatore C ChuiFranceIoni Bowcher PROPOSAL
Francesco C KuskoFranceElwin Sharvill NEW
Julie B MorascaJapanAmy Elsner QUALIFIED
Octavia H FollerAustraliaIoni Bowcher NEW
Jennifer T PoquetteFranceIoni Bowcher NEW
Claire U MaletArgentinaIvan Magalhaes UNQUALIFIED
Johnson J GarufiRussiaAnna Fali RENEWAL
Rodrigues Y VenereIndiaXuxue Feng UNQUALIFIED
Maisha C RulapaughGermanyAsiya Javayant QUALIFIED
Juan S IturbideSpainXuxue Feng UNQUALIFIED
Julie Q IturbideGermanyOnyama Limba PROPOSAL
Deepesh U CampainAustraliaIvan Magalhaes QUALIFIED
Alejandro B WieserBrazilOnyama Limba QUALIFIED
Antonio U PerinFranceStephen Shaw UNQUALIFIED
Claire C KuskoCanadaXuxue Feng QUALIFIED
Emily P WhobreyFranceAsiya Javayant QUALIFIED
Munro R KuskoGermanyOnyama Limba NEW
Horizontal
NameCountryRepresentativeStatus
Aditya N BriddickItalyAsiya Javayant UNQUALIFIED
Claire O StensethUnited KingdomAmy Elsner NEW
Octavia M SchemmerSpainAmy Elsner RENEWAL
James C RutaJapanOnyama Limba RENEWAL
David Q RoysterRussiaIvan Magalhaes QUALIFIED
Aika Y SergiUnited KingdomBernardo Dominic NEGOTIATION
James L NickaSpainAsiya Javayant NEW
Cody N InouyeCanadaElwin Sharvill QUALIFIED
Jennifer Z FlosiRussiaStephen Shaw UNQUALIFIED
Ricardo G AmigonUnited KingdomElwin Sharvill NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Tony F ChuiUnited Kingdom2025-06-13Chemel, James L Cpa NEW34Asiya Javayant
1001Francesco A SaylorsItaly2025-05-27Rousseaux, Michael Esq NEGOTIATION95Anna Fali
1002Emily I RimItaly2025-05-26Chanay, Jeffrey A Esq RENEWAL36Anna Fali
1003Rodrigues Q WieserRussia2025-06-08Feltz Printing Service QUALIFIED3Xuxue Feng
1004Costa D AlbaresSpain2025-06-08Morlong Associates QUALIFIED91Xuxue Feng
1005Ricardo W BologniaAustralia2025-06-10Feltz Printing Service PROPOSAL10Elwin Sharvill
1006Antonio U SaylorsCanada2025-06-05Rangoni Of Florence RENEWAL26Bernardo Dominic
1007Murillo P InouyeArgentina2025-05-27Rousseaux, Michael Esq NEW3Ivan Magalhaes
1008Izzy E MarrierJapan2025-06-05Feiner Bros RENEWAL71Ivan Magalhaes
1009Ivar E ChuiItaly2025-06-02Benton, John B Jr UNQUALIFIED70Xuxue Feng
1010Silvio L InouyeUnited Kingdom2025-05-21Feiner Bros RENEWAL41Onyama Limba
1011Francesco F RulapaughRussia2025-06-02Truhlar And Truhlar Attys PROPOSAL88Stephen Shaw
1012Chavez C VocelkaGermany2025-06-04King, Christopher A Esq NEGOTIATION59Elwin Sharvill
1013Chavez N DarakjyItaly2025-05-24Feiner Bros RENEWAL71Ivan Magalhaes
1014Aditya T GillianFrance2025-06-09Morlong Associates QUALIFIED90Stephen Shaw
1015Tony J PoquetteBrazil2025-06-04Truhlar And Truhlar Attys NEGOTIATION70Anna Fali
1016Salvatore J CaldareraJapan2025-05-30King, Christopher A Esq NEW63Elwin Sharvill
1017Julie M StensethItaly2025-05-20Rousseaux, Michael Esq RENEWAL56Ivan Magalhaes
1018David D RulapaughIndia2025-05-26Dorl, James J Esq UNQUALIFIED35Elwin Sharvill
1019Salvatore U KuskoGermany2025-06-05Rousseaux, Michael Esq UNQUALIFIED14Ioni Bowcher
1020Maria Q GauchoSpain2025-06-08Buckley Miller Wright NEGOTIATION99Bernardo Dominic
1021Wickens O StensethItaly2025-06-06Feltz Printing Service RENEWAL15Xuxue Feng
1022Stacey T CaldareraGermany2025-05-22King, Christopher A Esq UNQUALIFIED51Stephen Shaw
1023Jefferson U WaycottUnited Kingdom2025-06-14Truhlar And Truhlar Attys PROPOSAL75Ivan Magalhaes
1024Mujtaba I SlusarskiUnited Kingdom2025-05-27Chanay, Jeffrey A Esq RENEWAL27Amy Elsner
1025Rodrigues E TollnerJapan2025-05-29Truhlar And Truhlar Attys NEGOTIATION29Ivan Magalhaes
1026David Z PoquetteJapan2025-05-26Feltz Printing Service PROPOSAL72Ioni Bowcher
1027Jefferson D VocelkaRussia2025-06-16Morlong Associates NEW25Elwin Sharvill
1028Smith P GarufiSpain2025-05-26Commercial Press UNQUALIFIED90Elwin Sharvill
1029Jefferson M FerenczItaly2025-06-03Benton, John B Jr RENEWAL38Onyama Limba
1030Octavia G BologniaArgentina2025-06-07Chanay, Jeffrey A Esq PROPOSAL72Xuxue Feng
1031Julie B IturbideGermany2025-05-24Feiner Bros QUALIFIED71Bernardo Dominic
1032Jeanfrancois H RulapaughItaly2025-05-19Printing Dimensions QUALIFIED79Ivan Magalhaes
1033Costa I WaycottArgentina2025-06-04Rousseaux, Michael Esq UNQUALIFIED59Amy Elsner
1034Wickens L GillianIndia2025-06-01Dorl, James J Esq UNQUALIFIED81Stephen Shaw
1035Leon F DarakjyGermany2025-05-18Dorl, James J Esq PROPOSAL18Bernardo Dominic
1036Leon M FerenczRussia2025-05-19Chanay, Jeffrey A Esq RENEWAL94Asiya Javayant
1037Chavez X WhobreyRussia2025-05-22Dorl, James J Esq NEW10Amy Elsner
1038Julie G StockhamUnited Kingdom2025-06-15Chanay, Jeffrey A Esq RENEWAL19Bernardo Dominic
1039Leja F AlbaresItaly2025-05-31Chemel, James L Cpa RENEWAL28Xuxue Feng
1040Ricardo I MorascaJapan2025-05-21Feiner Bros QUALIFIED41Elwin Sharvill
1041Francesco N RoysterJapan2025-06-11Commercial Press PROPOSAL21Anna Fali
1042Chavez K WieserUnited Kingdom2025-05-25King, Christopher A Esq NEGOTIATION14Amy Elsner
1043Wickens I BowleyGermany2025-06-01Commercial Press RENEWAL51Ioni Bowcher
1044Faith D DoeSpain2025-05-19Chapman, Ross E Esq PROPOSAL25Ivan Magalhaes
1045Jeanfrancois V RoysterItaly2025-05-27Printing Dimensions PROPOSAL21Anna Fali
1046Sinclair M InouyeIndia2025-06-08Truhlar And Truhlar Attys PROPOSAL29Xuxue Feng
1047Faith P ButtJapan2025-06-05Printing Dimensions UNQUALIFIED85Bernardo Dominic
1048Kadeem A ButtBrazil2025-06-02Chanay, Jeffrey A Esq QUALIFIED32Stephen Shaw
1049Jeanfrancois V CampainArgentina2025-06-14Morlong Associates NEGOTIATION14Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Jefferson M PoquetteFranceAmy Elsner NEGOTIATION
Chavez A BowleyJapanAnna Fali RENEWAL
Costa A RimBrazilElwin Sharvill QUALIFIED
Octavia X RulapaughItalyElwin Sharvill PROPOSAL
Francesco H PaprockiBrazilOnyama Limba UNQUALIFIED
Alejandro E FollerBrazilIvan Magalhaes QUALIFIED
Alejandro U RulapaughIndiaAmy Elsner PROPOSAL
Mayumi L OldroydFranceXuxue Feng QUALIFIED
Morrow A VenereCanadaAnna Fali QUALIFIED
Jennifer K FollerFranceXuxue Feng NEGOTIATION
Maria Z WaycottCanadaXuxue Feng RENEWAL
Ivar G CaldareraAustraliaAmy Elsner QUALIFIED
Isabel B RutaArgentinaStephen Shaw NEW
Maisha H ChuiSpainBernardo Dominic UNQUALIFIED
Leon K GarufiItalyIvan Magalhaes UNQUALIFIED
Sinclair A CaldareraFranceAsiya Javayant NEGOTIATION
Jennifer S AlbaresIndiaBernardo Dominic NEW
Deepesh L GauchoSpainXuxue Feng NEW
Mujtaba J DarakjyBrazilAmy Elsner PROPOSAL
David C MacleadCanadaOnyama Limba RENEWAL
Francesco D GlickRussiaIoni Bowcher RENEWAL
Leja Z PoquetteGermanyIoni Bowcher QUALIFIED
Claire U ShinkoUnited KingdomStephen Shaw RENEWAL
Mujtaba X MaletArgentinaXuxue Feng UNQUALIFIED
Kaitlin B FollerAustraliaOnyama Limba NEGOTIATION
Leon M RutaFranceAmy Elsner PROPOSAL
James D VocelkaBrazilAsiya Javayant QUALIFIED
Mayumi M MaletJapanIoni Bowcher NEW
Jefferson D GillianAustraliaAmy Elsner UNQUALIFIED
Emily T VocelkaSpainXuxue Feng PROPOSAL
Aditya J ChuiBrazilAmy Elsner NEW
Isabel V CaldareraArgentinaBernardo Dominic RENEWAL
Aruna X VocelkaFranceAsiya Javayant RENEWAL
Kadeem O TollnerJapanAmy Elsner PROPOSAL
Francesco O RimUnited KingdomAnna Fali NEW
Julie F KuskoAustraliaXuxue Feng PROPOSAL
Ivar V OldroydGermanyIvan Magalhaes NEGOTIATION
Aruna F DoeBrazilIvan Magalhaes PROPOSAL
Wickens T AlbaresBrazilOnyama Limba NEGOTIATION
Johnson N FigeroaFranceAmy Elsner NEW
Kadeem I RoysterSpainAsiya Javayant RENEWAL
Kaitlin I InouyeJapanOnyama Limba UNQUALIFIED
Wickens Z GauchoBrazilIvan Magalhaes RENEWAL
Francesco A MarrierRussiaStephen Shaw RENEWAL
Octavia P PoquetteItalyIoni Bowcher NEGOTIATION
Maisha F NestleJapanAsiya Javayant UNQUALIFIED
Wickens H RulapaughBrazilIoni Bowcher NEW
Mayumi G SchemmerFranceAmy Elsner RENEWAL
Aruna S DoeBrazilAsiya Javayant NEGOTIATION
Mayumi N AmigonIndiaXuxue Feng RENEWAL
Frozen Columns
Name
Tony I Slusarski
Juan L Sergi
Stacey N Oldroyd
Jefferson H Malet
Deepesh D Poquette
Misaki K Briddick
Chavez E Ferencz
Stacey A Glick
Maisha R Ostrosky
Aruna F Caldarera
James N Ostrosky
Kaitlin M Perin
Claire D Albares
Chavez B Wieser
James Q Tollner
Kaitlin F Wieser
Munro N Butt
Wickens C Doe
Ivar I Wieser
Ivar O Darakjy
Izzy C Albares
Emily X Morasca
Izzy W Nicka
Julie D Amigon
Jones K Glick
Kaitlin J Stockham
Faith Z Flosi
James N Tollner
Leon N Schemmer
Aditya F Slusarski
Greenwood P Perin
Greenwood X Doe
Kadeem C Rim
Johnson H Bolognia
Jefferson Y Malet
Isabel H Rulapaugh
Johnson W Marrier
Wickens C Marrier
Juan B Chui
Deepesh C Doe
Clifford K Albares
Alejandro M Bolognia
Sinclair R Stockham
Greenwood J Malet
Kaitlin K Nestle
David R Garufi
Misaki X Garufi
Faith X Glick
Johnson P Morasca
Ivar I Flosi
IdCountryDate
1000Canada2025-06-05
1001India2025-06-02
1002Brazil2025-06-01
1003Russia2025-06-09
1004Argentina2025-06-13
1005Italy2025-06-14
1006Japan2025-06-05
1007France2025-05-28
1008Australia2025-05-28
1009Japan2025-06-09
1010United Kingdom2025-05-21
1011Italy2025-06-12
1012Canada2025-06-09
1013Germany2025-06-14
1014Spain2025-05-23
1015Spain2025-06-09
1016Russia2025-05-20
1017Germany2025-05-30
1018Japan2025-06-16
1019Brazil2025-05-29
1020Russia2025-05-30
1021Russia2025-06-11
1022Spain2025-05-26
1023Spain2025-05-23
1024Japan2025-05-22
1025Brazil2025-06-12
1026Canada2025-06-06
1027Japan2025-06-10
1028Argentina2025-05-30
1029Argentina2025-05-25
1030Argentina2025-06-14
1031Argentina2025-05-29
1032Italy2025-05-24
1033France2025-06-12
1034France2025-05-18
1035Russia2025-06-11
1036India2025-06-12
1037Spain2025-05-29
1038Germany2025-06-07
1039France2025-06-07
1040Canada2025-05-30
1041Argentina2025-06-11
1042United Kingdom2025-05-31
1043France2025-05-23
1044Russia2025-05-22
1045India2025-05-30
1046India2025-05-21
1047Japan2025-06-01
1048Brazil2025-06-01
1049Russia2025-05-22

On-Demand Data

NameIdCountryDate
Jennifer A Doe1000United Kingdom2025-06-05
Costa P Nestle1001Brazil2025-06-12
Jefferson G Whobrey1002Spain2025-06-15
Claire I Malet1003Japan2025-06-13
Faith U Wieser1004Japan2025-06-07
Alejandro M Glick1005India2025-05-28
Maisha U Albares1006Japan2025-05-25
Mayumi J Saylors1007Australia2025-06-08
Maisha Z Royster1008Italy2025-06-16
Jefferson C Briddick1009United Kingdom2025-05-29
Smith E Doe1010Brazil2025-06-04
Jefferson G Whobrey1011Brazil2025-05-24
Octavia D Shinko1012Canada2025-06-07
Adams X Malet1013United Kingdom2025-06-08
James W Inouye1014Australia2025-05-21
Mayumi I Nicka1015Canada2025-06-09
Munro P Ostrosky1016Australia2025-06-01
Leon G Stockham1017Argentina2025-06-15
Kaitlin V Caudy1018Argentina2025-06-02
Aditya H Campain1019Brazil2025-06-16
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Julie L VenereSpainElwin Sharvill NEGOTIATION
Aditya S VocelkaGermanyElwin Sharvill NEGOTIATION
Murillo U PoquetteAustraliaElwin Sharvill NEW
Sinclair C FollerSpainIvan Magalhaes UNQUALIFIED
Tony R CampainRussiaBernardo Dominic UNQUALIFIED
Wickens R GauchoBrazilOnyama Limba PROPOSAL
Antonio K WieserCanadaAnna Fali QUALIFIED
Aditya J StensethArgentinaElwin Sharvill UNQUALIFIED
Sinclair E WhobreyUnited KingdomOnyama Limba QUALIFIED
Leja T FerenczAustraliaOnyama Limba PROPOSAL
Murillo B ChuiGermanyAnna Fali UNQUALIFIED
Munro J SergiGermanyOnyama Limba UNQUALIFIED
James X OldroydRussiaOnyama Limba RENEWAL
Aika C OstroskyGermanyElwin Sharvill PROPOSAL
James S PerinRussiaBernardo Dominic NEGOTIATION
Misaki E SergiIndiaAsiya Javayant NEW
Aruna N CaldareraArgentinaAsiya Javayant NEGOTIATION
Arvin V SergiSpainAsiya Javayant PROPOSAL
Costa Q VenereItalyAmy Elsner RENEWAL
Darci T OldroydItalyElwin Sharvill NEGOTIATION
Adams F WaycottAustraliaAmy Elsner QUALIFIED
Kaitlin D KolmetzCanadaElwin Sharvill QUALIFIED
Stacey Q GlickAustraliaAmy Elsner PROPOSAL
Mujtaba V MaletUnited KingdomAsiya Javayant RENEWAL
Salvatore V ButtItalyStephen Shaw NEW
Rodrigues E BologniaJapanOnyama Limba PROPOSAL
Chavez A KuskoSpainAsiya Javayant QUALIFIED
Alejandro H SaylorsCanadaIoni Bowcher RENEWAL
Juan S VocelkaArgentinaElwin Sharvill RENEWAL
Leja X MaletSpainStephen Shaw NEW
Ashley M GarufiIndiaOnyama Limba QUALIFIED
Faith T GlickFranceElwin Sharvill NEW
Aditya N StockhamItalyIoni Bowcher UNQUALIFIED
Kaitlin O WieserItalyAnna Fali NEW
Ivar R MarrierGermanyElwin Sharvill NEGOTIATION
Aruna J NickaSpainBernardo Dominic PROPOSAL
Murillo E ShinkoIndiaIoni Bowcher QUALIFIED
Faith G WhobreyItalyElwin Sharvill QUALIFIED
Ricardo B RulapaughUnited KingdomIvan Magalhaes QUALIFIED
Morrow F PoquetteBrazilXuxue Feng NEW

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