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
Mayumi H WhobreyJapanStephen Shaw NEGOTIATION
Jeanfrancois K BowleyJapanXuxue Feng NEGOTIATION
Costa S DilliardAustraliaStephen Shaw NEW
Munro C WhobreyCanadaElwin Sharvill NEGOTIATION
Kadeem R VocelkaCanadaOnyama Limba PROPOSAL
Chavez E SchemmerRussiaIvan Magalhaes NEGOTIATION
Murillo V IturbideAustraliaStephen Shaw RENEWAL
Aditya D PaprockiArgentinaIoni Bowcher UNQUALIFIED
Isabel O OstroskyGermanyElwin Sharvill RENEWAL
Arvin W BriddickGermanyAsiya Javayant NEW
James T ChuiItalyOnyama Limba RENEWAL
Darci B PerinUnited KingdomIoni Bowcher PROPOSAL
Maisha M FigeroaSpainIoni Bowcher NEGOTIATION
Sinclair J GillianSpainAsiya Javayant UNQUALIFIED
Jones R MorascaArgentinaStephen Shaw NEGOTIATION
Stacey E DoeUnited KingdomStephen Shaw RENEWAL
Claire A TollnerBrazilIoni Bowcher NEGOTIATION
Morrow M DarakjyBrazilAmy Elsner NEW
Johnson L KuskoUnited KingdomXuxue Feng NEGOTIATION
Johnson A MarrierRussiaAsiya Javayant NEW
Stacey P GillianAustraliaAsiya Javayant PROPOSAL
Izzy N GauchoArgentinaAmy Elsner PROPOSAL
Ashley E SergiBrazilAmy Elsner PROPOSAL
Costa Z KuskoJapanIvan Magalhaes UNQUALIFIED
Nicolas C StockhamFranceStephen Shaw QUALIFIED
Deepesh N ShinkoIndiaIoni Bowcher QUALIFIED
Juan J PerinArgentinaAmy Elsner NEGOTIATION
Juan X RulapaughRussiaElwin Sharvill PROPOSAL
Tony U DilliardCanadaAmy Elsner NEGOTIATION
Misaki Z CaudySpainXuxue Feng NEW
Adams J InouyeCanadaOnyama Limba NEW
Darci N KuskoArgentinaAmy Elsner QUALIFIED
Arvin H VenereFranceElwin Sharvill NEW
Claire E DilliardBrazilIvan Magalhaes QUALIFIED
Sinclair T VenereUnited KingdomIoni Bowcher PROPOSAL
Stacey M KolmetzArgentinaElwin Sharvill NEGOTIATION
Rodrigues M FlosiGermanyIvan Magalhaes NEGOTIATION
Aika U WhobreyJapanStephen Shaw RENEWAL
Juan J ButtArgentinaBernardo Dominic PROPOSAL
Darci R VocelkaItalyStephen Shaw UNQUALIFIED
Jones I NickaSpainOnyama Limba UNQUALIFIED
Kaitlin Y FlosiGermanyAmy Elsner RENEWAL
Tony H RimBrazilOnyama Limba UNQUALIFIED
Ashley Z FlosiUnited KingdomAmy Elsner PROPOSAL
Maisha M PerinJapanOnyama Limba NEW
Julie P RulapaughUnited KingdomBernardo Dominic PROPOSAL
Morrow C RoysterFranceStephen Shaw QUALIFIED
Isabel B GlickItalyXuxue Feng NEW
Cody N KolmetzCanadaElwin Sharvill UNQUALIFIED
Greenwood X WhobreyArgentinaXuxue Feng RENEWAL
Horizontal
NameCountryRepresentativeStatus
Tony X SlusarskiBrazilStephen Shaw QUALIFIED
Jennifer R RoysterUnited KingdomStephen Shaw RENEWAL
Costa N PoquetteItalyAmy Elsner NEW
Johnson A MorascaItalyIoni Bowcher PROPOSAL
Greenwood Y MacleadGermanyOnyama Limba UNQUALIFIED
Greenwood U SlusarskiAustraliaIoni Bowcher NEGOTIATION
Smith B BologniaAustraliaAsiya Javayant RENEWAL
Kadeem L MacleadArgentinaIvan Magalhaes RENEWAL
Emily Q SchemmerUnited KingdomOnyama Limba NEW
Julie P ShinkoArgentinaIvan Magalhaes PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Emily O ButtIndia2025-04-06Commercial Press RENEWAL69Onyama Limba
1001James A StockhamGermany2025-04-14Benton, John B Jr PROPOSAL0Ivan Magalhaes
1002Francesco G NestleUnited Kingdom2025-04-05Benton, John B Jr QUALIFIED1Stephen Shaw
1003Aditya H ChuiJapan2025-04-28Feltz Printing Service UNQUALIFIED12Xuxue Feng
1004Antonio R GillianJapan2025-04-06Dorl, James J Esq QUALIFIED56Anna Fali
1005Costa V GillianJapan2025-04-09King, Christopher A Esq PROPOSAL1Ioni Bowcher
1006Aika V OldroydSpain2025-04-09King, Christopher A Esq NEW40Elwin Sharvill
1007Deepesh U CaldareraSpain2025-04-27Rangoni Of Florence QUALIFIED36Asiya Javayant
1008Aika S DilliardArgentina2025-04-27Rangoni Of Florence QUALIFIED3Stephen Shaw
1009Mayumi X SergiGermany2025-04-22Rangoni Of Florence PROPOSAL63Amy Elsner
1010Silvio B FlosiGermany2025-04-11Dorl, James J Esq QUALIFIED47Elwin Sharvill
1011Morrow A FigeroaRussia2025-04-03King, Christopher A Esq UNQUALIFIED12Amy Elsner
1012Misaki Q StensethRussia2025-04-04King, Christopher A Esq UNQUALIFIED55Ioni Bowcher
1013Nicolas E VocelkaFrance2025-04-06Printing Dimensions UNQUALIFIED56Bernardo Dominic
1014Arvin B GillianIndia2025-04-24Morlong Associates RENEWAL71Amy Elsner
1015Munro C BologniaItaly2025-04-28King, Christopher A Esq RENEWAL26Ivan Magalhaes
1016Jefferson O SchemmerGermany2025-04-29Feiner Bros QUALIFIED42Ivan Magalhaes
1017Aditya Q AmigonSpain2025-04-08Printing Dimensions NEW85Xuxue Feng
1018Morrow C RoysterUnited Kingdom2025-04-04Feltz Printing Service NEW75Ioni Bowcher
1019Morrow F PerinSpain2025-04-19Chemel, James L Cpa NEGOTIATION3Ioni Bowcher
1020Arvin I RimUnited Kingdom2025-04-02Feiner Bros UNQUALIFIED42Anna Fali
1021Adams H CaudyCanada2025-04-21Buckley Miller Wright NEW2Anna Fali
1022Kadeem X RimRussia2025-04-30Commercial Press PROPOSAL90Bernardo Dominic
1023Aruna F AlbaresRussia2025-04-05Rousseaux, Michael Esq UNQUALIFIED18Elwin Sharvill
1024Maria Q WhobreyCanada2025-04-16Commercial Press NEGOTIATION54Onyama Limba
1025Munro K CaudyIndia2025-04-15Commercial Press PROPOSAL85Xuxue Feng
1026Isabel B PaprockiFrance2025-04-06Rangoni Of Florence NEGOTIATION57Elwin Sharvill
1027Darci P MaletUnited Kingdom2025-04-03Chemel, James L Cpa QUALIFIED73Anna Fali
1028Silvio R PerinUnited Kingdom2025-04-28King, Christopher A Esq NEW47Xuxue Feng
1029Ivar O FigeroaFrance2025-04-30Chemel, James L Cpa NEW24Stephen Shaw
1030Kadeem M OstroskyIndia2025-04-28King, Christopher A Esq QUALIFIED51Asiya Javayant
1031Julie S FlosiBrazil2025-04-02King, Christopher A Esq QUALIFIED30Elwin Sharvill
1032Sinclair S ShinkoFrance2025-04-19Rousseaux, Michael Esq NEGOTIATION3Onyama Limba
1033Salvatore U BriddickGermany2025-04-04Buckley Miller Wright QUALIFIED55Elwin Sharvill
1034Munro V OstroskyAustralia2025-04-02King, Christopher A Esq QUALIFIED1Xuxue Feng
1035Adams Z RutaItaly2025-04-09Printing Dimensions RENEWAL57Amy Elsner
1036Jennifer V IturbideBrazil2025-04-27Feiner Bros NEGOTIATION79Ioni Bowcher
1037Greenwood C NestleAustralia2025-04-17King, Christopher A Esq UNQUALIFIED7Xuxue Feng
1038Aruna I RimBrazil2025-04-14Chemel, James L Cpa QUALIFIED11Ioni Bowcher
1039Mayumi J CaudyBrazil2025-04-27Chanay, Jeffrey A Esq PROPOSAL87Bernardo Dominic
1040Morrow L SaylorsIndia2025-04-14Rousseaux, Michael Esq NEGOTIATION16Asiya Javayant
1041Juan T DarakjyRussia2025-04-23Truhlar And Truhlar Attys RENEWAL11Onyama Limba
1042Julie L CampainJapan2025-04-27Buckley Miller Wright NEGOTIATION86Xuxue Feng
1043Munro D WaycottAustralia2025-04-29Chanay, Jeffrey A Esq PROPOSAL99Onyama Limba
1044Faith K CaudyRussia2025-04-21King, Christopher A Esq QUALIFIED80Amy Elsner
1045Munro E RimGermany2025-04-26King, Christopher A Esq PROPOSAL10Xuxue Feng
1046Jennifer P BologniaBrazil2025-04-19Dorl, James J Esq RENEWAL3Ioni Bowcher
1047Aika C StockhamIndia2025-05-01Chemel, James L Cpa NEGOTIATION27Anna Fali
1048Morrow A MaletRussia2025-04-17Truhlar And Truhlar Attys UNQUALIFIED29Elwin Sharvill
1049Ivar Y DarakjyIndia2025-05-01Morlong Associates UNQUALIFIED20Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Darci E InouyeSpainStephen Shaw UNQUALIFIED
Julie U IturbideSpainIoni Bowcher UNQUALIFIED
Silvio F StockhamCanadaElwin Sharvill PROPOSAL
Darci X WaycottUnited KingdomIoni Bowcher UNQUALIFIED
Izzy Y NickaBrazilIoni Bowcher RENEWAL
Francesco P SlusarskiUnited KingdomIoni Bowcher QUALIFIED
Antonio C MacleadSpainBernardo Dominic RENEWAL
Silvio F MorascaIndiaAsiya Javayant QUALIFIED
David F NestleAustraliaBernardo Dominic NEGOTIATION
Julie P BowleyItalyStephen Shaw PROPOSAL
Aruna P MaletFranceStephen Shaw UNQUALIFIED
Maisha V BowleyGermanyIvan Magalhaes NEW
Julie D RutaSpainAmy Elsner NEGOTIATION
Murillo S StockhamGermanyAmy Elsner NEGOTIATION
Sinclair R MacleadRussiaXuxue Feng PROPOSAL
Juan F StockhamGermanyAsiya Javayant RENEWAL
Jones H MaletAustraliaOnyama Limba NEGOTIATION
Ricardo L BologniaItalyIoni Bowcher RENEWAL
Izzy S TollnerIndiaAsiya Javayant NEGOTIATION
Clifford T FigeroaArgentinaAnna Fali NEW
Jennifer V KolmetzAustraliaXuxue Feng NEGOTIATION
Aditya J CaudyRussiaXuxue Feng NEGOTIATION
Julie H SlusarskiUnited KingdomStephen Shaw NEW
Aditya E GauchoFranceOnyama Limba NEGOTIATION
Leja T CaldareraItalyStephen Shaw UNQUALIFIED
Jones M PerinFranceBernardo Dominic PROPOSAL
Misaki W AlbaresRussiaAsiya Javayant QUALIFIED
Emily T GarufiItalyOnyama Limba RENEWAL
Sinclair H GlickRussiaIoni Bowcher RENEWAL
Wickens J MaletJapanIvan Magalhaes RENEWAL
Ashley D SergiRussiaAmy Elsner NEGOTIATION
Antonio D RimAustraliaBernardo Dominic RENEWAL
Octavia V SchemmerJapanElwin Sharvill PROPOSAL
Cody T NestleGermanyXuxue Feng UNQUALIFIED
Johnson H BologniaAustraliaAsiya Javayant NEW
Ivar O AmigonSpainStephen Shaw NEGOTIATION
Maria B IturbideCanadaStephen Shaw NEW
James V VocelkaBrazilIoni Bowcher RENEWAL
Wickens K SchemmerBrazilElwin Sharvill UNQUALIFIED
Alejandro D PaprockiRussiaAmy Elsner NEW
Salvatore P BologniaUnited KingdomIvan Magalhaes NEW
Maisha S SergiJapanAsiya Javayant PROPOSAL
Murillo D FlosiUnited KingdomAmy Elsner QUALIFIED
Adams T RutaFranceIoni Bowcher NEGOTIATION
Costa T CaldareraJapanIvan Magalhaes PROPOSAL
Juan W KuskoJapanElwin Sharvill RENEWAL
Ashley G PoquetteCanadaAsiya Javayant NEW
Adams H AmigonJapanAsiya Javayant NEGOTIATION
Murillo U MaletItalyOnyama Limba PROPOSAL
David W StensethJapanAnna Fali QUALIFIED
Frozen Columns
Name
Misaki L Malet
Francesco L Inouye
Munro L Chui
Morrow L Paprocki
Maria Y Foller
Misaki K Caldarera
James V Butt
Juan L Malet
Ashley Y Gillian
Faith O Gaucho
Stacey O Ostrosky
Julie R Bolognia
Rodrigues I Paprocki
Smith L Kusko
Wickens J Caldarera
Tony C Poquette
Juan K Nicka
Greenwood Z Nestle
Maria A Schemmer
Jennifer Q Malet
Greenwood D Inouye
Leon J Poquette
Mujtaba E Briddick
Emily H Inouye
Chavez R Rim
Faith E Malet
Smith G Rim
Mayumi U Nicka
Chavez B Tollner
Cody D Briddick
Aika C Sergi
Alejandro L Inouye
Francesco S Whobrey
Emily L Marrier
Tony Z Stenseth
Mujtaba U Caudy
Maria E Caldarera
Rodrigues W Nestle
Costa R Malet
Izzy U Albares
Morrow C Slusarski
Aditya W Marrier
Arvin Q Ruta
Morrow F Garufi
Costa Q Tollner
Tony R Poquette
Morrow R Wieser
Maisha K Marrier
Kadeem A Inouye
Julie C Gaucho
IdCountryDate
1000Japan2025-04-05
1001Brazil2025-04-19
1002Japan2025-04-11
1003Brazil2025-04-06
1004Italy2025-04-06
1005Australia2025-05-01
1006Argentina2025-04-14
1007Argentina2025-04-28
1008Italy2025-04-15
1009Argentina2025-04-21
1010Germany2025-04-20
1011Argentina2025-04-05
1012Spain2025-04-12
1013Spain2025-04-30
1014Australia2025-04-23
1015France2025-04-17
1016Argentina2025-04-29
1017Argentina2025-04-27
1018Australia2025-05-01
1019France2025-04-22
1020Canada2025-04-27
1021Russia2025-04-08
1022United Kingdom2025-04-24
1023India2025-04-20
1024Brazil2025-04-08
1025Canada2025-04-10
1026Brazil2025-04-19
1027United Kingdom2025-04-10
1028Germany2025-04-16
1029Italy2025-04-16
1030United Kingdom2025-04-15
1031United Kingdom2025-04-30
1032Germany2025-04-06
1033India2025-04-07
1034Argentina2025-04-15
1035Germany2025-04-06
1036Canada2025-04-12
1037Germany2025-04-16
1038India2025-04-08
1039United Kingdom2025-04-21
1040Argentina2025-04-04
1041Australia2025-04-07
1042Germany2025-04-25
1043Canada2025-04-18
1044Russia2025-04-12
1045United Kingdom2025-04-29
1046Russia2025-04-23
1047Australia2025-04-27
1048Canada2025-04-15
1049Japan2025-04-25

On-Demand Data

NameIdCountryDate
Johnson O Vocelka1000India2025-04-20
Munro W Perin1001Spain2025-04-28
Smith Z Rulapaugh1002India2025-04-26
Juan X Malet1003Australia2025-04-16
Maria Q Caudy1004India2025-04-10
Greenwood K Waycott1005Brazil2025-04-18
Adams T Schemmer1006Argentina2025-04-16
Clifford H Stenseth1007Italy2025-04-28
Smith A Nestle1008Italy2025-04-15
Jones W Vocelka1009Brazil2025-04-30
Murillo N Amigon1010Japan2025-04-14
James O Flosi1011Spain2025-04-29
Juan X Oldroyd1012Italy2025-04-08
Chavez U Saylors1013Italy2025-04-04
Cody S Gaucho1014Russia2025-04-28
Deepesh C Malet1015Italy2025-04-18
Leon T Paprocki1016Australia2025-04-25
Kadeem S Gaucho1017Spain2025-04-04
Faith Z Malet1018Argentina2025-04-29
Aruna T Venere1019Japan2025-04-24
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Smith Y KuskoAustraliaStephen Shaw NEW
Smith Q FigeroaArgentinaOnyama Limba PROPOSAL
Kaitlin J NickaAustraliaXuxue Feng QUALIFIED
Mujtaba V CaldareraItalyAnna Fali PROPOSAL
Darci B NestleJapanStephen Shaw UNQUALIFIED
Antonio C FollerCanadaOnyama Limba RENEWAL
Johnson F RimArgentinaXuxue Feng RENEWAL
Misaki C GauchoFranceElwin Sharvill RENEWAL
Cody T OstroskyFranceAmy Elsner NEW
Sinclair B RoysterArgentinaAnna Fali UNQUALIFIED
Wickens H PerinCanadaElwin Sharvill RENEWAL
Adams Y CampainFranceOnyama Limba PROPOSAL
Smith V PaprockiAustraliaOnyama Limba NEW
Johnson Y NickaFranceIoni Bowcher PROPOSAL
Antonio G WaycottRussiaAsiya Javayant QUALIFIED
Ashley T CampainRussiaIvan Magalhaes NEW
Julie Z DoeArgentinaBernardo Dominic QUALIFIED
Cody X SlusarskiGermanyIvan Magalhaes RENEWAL
Jennifer O KuskoGermanyXuxue Feng QUALIFIED
Aditya P StensethUnited KingdomAnna Fali PROPOSAL
Alejandro U AlbaresAustraliaIoni Bowcher QUALIFIED
Smith X MorascaArgentinaBernardo Dominic NEGOTIATION
Kadeem U TollnerItalyXuxue Feng PROPOSAL
Greenwood F MarrierUnited KingdomAnna Fali QUALIFIED
Jeanfrancois S ShinkoGermanyIoni Bowcher NEW
Izzy D DarakjyJapanIvan Magalhaes NEW
Deepesh X BowleyArgentinaIoni Bowcher RENEWAL
Murillo Q AmigonRussiaXuxue Feng QUALIFIED
James L VenereJapanXuxue Feng QUALIFIED
Aruna E FigeroaItalyAmy Elsner PROPOSAL
Octavia E TollnerUnited KingdomBernardo Dominic PROPOSAL
Arvin O SergiGermanyIvan Magalhaes UNQUALIFIED
Kaitlin U DarakjyFranceAnna Fali RENEWAL
Greenwood O BriddickAustraliaBernardo Dominic PROPOSAL
Ivar Z FigeroaArgentinaStephen Shaw PROPOSAL
Silvio X FerenczSpainAnna Fali NEW
Costa T CampainRussiaAnna Fali QUALIFIED
Faith P BowleyArgentinaIoni Bowcher QUALIFIED
Aika T DarakjyJapanStephen Shaw NEW
Jefferson W CaldareraBrazilAmy 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>