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
Rodrigues X GlickArgentinaStephen Shaw RENEWAL
Wickens U BriddickRussiaIvan Magalhaes NEW
Stacey X MaletFranceAsiya Javayant NEGOTIATION
Octavia W KolmetzRussiaBernardo Dominic NEGOTIATION
Ivar L ChuiBrazilAnna Fali QUALIFIED
David M MarrierGermanyAmy Elsner UNQUALIFIED
Emily W KuskoSpainOnyama Limba NEGOTIATION
Aditya R VocelkaJapanStephen Shaw QUALIFIED
Jones M MarrierSpainOnyama Limba NEGOTIATION
Maria K OldroydBrazilStephen Shaw QUALIFIED
Maria D StensethRussiaStephen Shaw QUALIFIED
Maria I OldroydArgentinaAmy Elsner QUALIFIED
Smith X DoeRussiaElwin Sharvill RENEWAL
Jeanfrancois H KuskoJapanAnna Fali QUALIFIED
Aditya X AlbaresJapanXuxue Feng RENEWAL
Johnson O RulapaughIndiaStephen Shaw PROPOSAL
Ricardo C PerinGermanyElwin Sharvill UNQUALIFIED
Aditya U DarakjyJapanAsiya Javayant QUALIFIED
Maria J CaudyItalyIoni Bowcher NEW
Jones F BowleyIndiaAmy Elsner QUALIFIED
Alejandro F MorascaIndiaStephen Shaw UNQUALIFIED
Isabel X MorascaGermanyAsiya Javayant QUALIFIED
Alejandro C DoeCanadaElwin Sharvill QUALIFIED
Jeanfrancois S ButtFranceXuxue Feng QUALIFIED
Maisha K VenereSpainStephen Shaw NEW
Leja V GlickSpainXuxue Feng NEW
Morrow V RimItalyIoni Bowcher NEGOTIATION
Julie C FigeroaGermanyAnna Fali RENEWAL
Clifford H SlusarskiCanadaStephen Shaw RENEWAL
Antonio L FigeroaSpainXuxue Feng QUALIFIED
Salvatore Q RoysterFranceXuxue Feng UNQUALIFIED
Adams T VocelkaSpainIoni Bowcher UNQUALIFIED
Morrow J StensethBrazilOnyama Limba NEW
Stacey R CaldareraBrazilStephen Shaw QUALIFIED
Nicolas S DilliardItalyStephen Shaw RENEWAL
Stacey I MorascaSpainIvan Magalhaes QUALIFIED
Juan M TollnerItalyBernardo Dominic UNQUALIFIED
Clifford W RimJapanIvan Magalhaes NEW
Ricardo C GlickRussiaXuxue Feng QUALIFIED
Arvin N FigeroaSpainElwin Sharvill NEW
Salvatore O IturbideCanadaXuxue Feng PROPOSAL
Kaitlin A PoquetteIndiaAnna Fali PROPOSAL
James B StockhamRussiaAsiya Javayant NEW
Arvin L ChuiCanadaXuxue Feng RENEWAL
Leja L CampainAustraliaAsiya Javayant NEW
Misaki J StensethBrazilStephen Shaw RENEWAL
Alejandro C NestleItalyAmy Elsner QUALIFIED
Jones N GauchoItalyStephen Shaw NEGOTIATION
Leon J RulapaughSpainAmy Elsner NEW
Arvin I CampainGermanyBernardo Dominic NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Clifford W SlusarskiItalyAsiya Javayant NEW
David E PoquetteArgentinaStephen Shaw QUALIFIED
Francesco B BriddickItalyXuxue Feng NEW
Isabel N KuskoRussiaIvan Magalhaes QUALIFIED
Julie V FigeroaFranceAnna Fali UNQUALIFIED
David K MarrierJapanAsiya Javayant NEGOTIATION
Emily U RoysterItalyXuxue Feng QUALIFIED
Morrow D BriddickCanadaOnyama Limba UNQUALIFIED
Antonio B MarrierRussiaElwin Sharvill RENEWAL
David P DoeAustraliaIvan Magalhaes PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Jones D BowleyBrazil2024-09-02Truhlar And Truhlar Attys NEW29Bernardo Dominic
1001Adams J VocelkaIndia2024-09-18Truhlar And Truhlar Attys QUALIFIED54Onyama Limba
1002Costa M FollerSpain2024-09-22Rousseaux, Michael Esq QUALIFIED80Xuxue Feng
1003Izzy P PoquetteItaly2024-09-18King, Christopher A Esq RENEWAL63Stephen Shaw
1004David Q MarrierAustralia2024-09-21Dorl, James J Esq RENEWAL21Elwin Sharvill
1005Stacey A WaycottRussia2024-09-21Morlong Associates QUALIFIED83Stephen Shaw
1006Greenwood R VocelkaArgentina2024-09-24Rousseaux, Michael Esq NEW65Ivan Magalhaes
1007Aditya K SaylorsAustralia2024-09-13Printing Dimensions QUALIFIED4Elwin Sharvill
1008Greenwood D KuskoUnited Kingdom2024-09-08Buckley Miller Wright RENEWAL52Stephen Shaw
1009Claire W MarrierRussia2024-09-02Rousseaux, Michael Esq NEGOTIATION68Amy Elsner
1010Kaitlin H NestleBrazil2024-09-19Buckley Miller Wright PROPOSAL65Elwin Sharvill
1011Munro F AlbaresJapan2024-09-09Morlong Associates RENEWAL67Bernardo Dominic
1012Greenwood G ShinkoFrance2024-09-15Buckley Miller Wright QUALIFIED90Onyama Limba
1013Nicolas L BowleyFrance2024-09-03Chapman, Ross E Esq NEGOTIATION35Anna Fali
1014Emily N CaldareraFrance2024-09-18Chapman, Ross E Esq QUALIFIED10Amy Elsner
1015Mayumi E AlbaresCanada2024-09-19Morlong Associates NEW15Elwin Sharvill
1016Clifford V SlusarskiCanada2024-09-11Buckley Miller Wright UNQUALIFIED62Xuxue Feng
1017Maria V CaudyAustralia2024-09-19Feiner Bros UNQUALIFIED1Ivan Magalhaes
1018Deepesh I StockhamCanada2024-08-30Truhlar And Truhlar Attys QUALIFIED66Ivan Magalhaes
1019Greenwood Y MarrierRussia2024-09-06Chapman, Ross E Esq NEW51Amy Elsner
1020Murillo T StensethRussia2024-09-14King, Christopher A Esq QUALIFIED49Anna Fali
1021Morrow Z SchemmerIndia2024-09-17Rousseaux, Michael Esq NEW97Onyama Limba
1022Aika X CaldareraArgentina2024-09-10Truhlar And Truhlar Attys PROPOSAL38Amy Elsner
1023Claire W VenereItaly2024-09-10Feiner Bros PROPOSAL16Asiya Javayant
1024James R RutaGermany2024-09-01Chapman, Ross E Esq QUALIFIED73Ioni Bowcher
1025Darci P FollerUnited Kingdom2024-09-20Benton, John B Jr QUALIFIED71Xuxue Feng
1026Kadeem J RoysterAustralia2024-09-21Commercial Press QUALIFIED56Xuxue Feng
1027Arvin H RimGermany2024-09-25Dorl, James J Esq QUALIFIED13Stephen Shaw
1028Mujtaba Y SaylorsRussia2024-09-08Printing Dimensions QUALIFIED48Onyama Limba
1029Octavia A FlosiBrazil2024-09-09Buckley Miller Wright UNQUALIFIED54Onyama Limba
1030Antonio M IturbideArgentina2024-09-01Feiner Bros UNQUALIFIED17Amy Elsner
1031Claire L RimCanada2024-09-20Chapman, Ross E Esq RENEWAL32Amy Elsner
1032Darci H FerenczRussia2024-08-31Chemel, James L Cpa RENEWAL40Ioni Bowcher
1033Sinclair U ChuiFrance2024-09-17Chemel, James L Cpa NEGOTIATION56Ivan Magalhaes
1034Tony Q BriddickJapan2024-09-20Benton, John B Jr UNQUALIFIED42Asiya Javayant
1035Greenwood U FlosiJapan2024-09-01Buckley Miller Wright RENEWAL56Amy Elsner
1036Nicolas F SchemmerUnited Kingdom2024-09-07Dorl, James J Esq NEW77Stephen Shaw
1037Murillo H SergiAustralia2024-09-23Truhlar And Truhlar Attys UNQUALIFIED37Elwin Sharvill
1038Kadeem V FerenczGermany2024-09-11Dorl, James J Esq UNQUALIFIED23Bernardo Dominic
1039Stacey P GarufiGermany2024-08-29Morlong Associates PROPOSAL80Ivan Magalhaes
1040Stacey I FlosiFrance2024-09-19Buckley Miller Wright QUALIFIED3Xuxue Feng
1041Leon Y NickaAustralia2024-09-09Benton, John B Jr QUALIFIED0Xuxue Feng
1042Adams L OldroydItaly2024-09-16Feiner Bros UNQUALIFIED96Bernardo Dominic
1043Octavia J AlbaresJapan2024-08-28Printing Dimensions UNQUALIFIED32Ivan Magalhaes
1044Aruna L RulapaughBrazil2024-09-21Chemel, James L Cpa NEGOTIATION32Ioni Bowcher
1045Nicolas H PoquetteJapan2024-08-30Benton, John B Jr UNQUALIFIED25Onyama Limba
1046Costa K StockhamFrance2024-09-12King, Christopher A Esq NEW9Bernardo Dominic
1047Francesco V VocelkaSpain2024-08-27Commercial Press PROPOSAL87Asiya Javayant
1048Sinclair D ShinkoBrazil2024-09-15Feiner Bros PROPOSAL32Amy Elsner
1049Adams Q CampainGermany2024-09-21Benton, John B Jr RENEWAL34Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Silvio F OldroydBrazilAsiya Javayant PROPOSAL
Costa D ChuiFranceIoni Bowcher QUALIFIED
Jefferson W KuskoFranceXuxue Feng RENEWAL
Morrow Q SergiIndiaAsiya Javayant UNQUALIFIED
Misaki W SchemmerItalyOnyama Limba RENEWAL
Emily Z FlosiItalyAnna Fali PROPOSAL
Aika K GillianCanadaAnna Fali NEW
Jennifer R TollnerCanadaStephen Shaw PROPOSAL
Alejandro R ShinkoUnited KingdomOnyama Limba QUALIFIED
Misaki E TollnerUnited KingdomBernardo Dominic PROPOSAL
Salvatore L WaycottIndiaAmy Elsner QUALIFIED
Leon V RutaFranceAsiya Javayant RENEWAL
Ashley I InouyeCanadaIvan Magalhaes UNQUALIFIED
Octavia T DoeFranceBernardo Dominic PROPOSAL
Cody V ShinkoUnited KingdomIoni Bowcher NEGOTIATION
Johnson D CaudyBrazilAsiya Javayant NEGOTIATION
Juan X AlbaresSpainAsiya Javayant RENEWAL
Leon C StockhamGermanyXuxue Feng QUALIFIED
Mujtaba U ChuiJapanBernardo Dominic UNQUALIFIED
Izzy S MacleadIndiaStephen Shaw PROPOSAL
Aditya B GillianItalyBernardo Dominic QUALIFIED
Misaki D FerenczRussiaXuxue Feng PROPOSAL
Emily H GlickGermanyAmy Elsner NEW
Jennifer F MacleadBrazilElwin Sharvill NEGOTIATION
Darci N CaudyFranceIvan Magalhaes NEGOTIATION
Ricardo C DarakjySpainAmy Elsner PROPOSAL
Izzy N MorascaRussiaAnna Fali RENEWAL
Rodrigues S NickaArgentinaAmy Elsner NEGOTIATION
Julie F NestleFranceAnna Fali RENEWAL
Chavez R TollnerAustraliaXuxue Feng QUALIFIED
Greenwood F MacleadAustraliaElwin Sharvill PROPOSAL
Jefferson A CaudySpainAmy Elsner RENEWAL
Octavia I DoeRussiaIoni Bowcher QUALIFIED
Munro I MaletItalyOnyama Limba QUALIFIED
Costa Z AmigonRussiaStephen Shaw NEW
Maisha F DarakjyArgentinaBernardo Dominic NEGOTIATION
Costa J CaudyBrazilIvan Magalhaes QUALIFIED
Izzy W WieserSpainBernardo Dominic PROPOSAL
Ricardo K MaletSpainIvan Magalhaes NEW
Salvatore T FigeroaIndiaBernardo Dominic QUALIFIED
Arvin H PerinBrazilIoni Bowcher QUALIFIED
Francesco C RoysterFranceAmy Elsner RENEWAL
Cody F PaprockiCanadaIvan Magalhaes PROPOSAL
Chavez S NestleBrazilIvan Magalhaes PROPOSAL
Ricardo I PaprockiItalyOnyama Limba PROPOSAL
Munro O ShinkoGermanyAsiya Javayant PROPOSAL
Darci Z DarakjyIndiaElwin Sharvill NEW
Deepesh E StensethJapanElwin Sharvill QUALIFIED
Johnson V DarakjyCanadaElwin Sharvill NEW
Leja A FigeroaFranceOnyama Limba UNQUALIFIED
Frozen Columns
Name
Jefferson N Rulapaugh
Octavia W Sergi
Isabel K Briddick
Jennifer E Briddick
Jefferson R Marrier
Misaki L Saylors
Costa L Darakjy
Silvio Q Tollner
Leon L Stockham
Deepesh U Kusko
Isabel Y Maclead
Ashley X Gaucho
Arvin E Oldroyd
Salvatore R Amigon
Octavia G Campain
Darci H Venere
Misaki R Shinko
Arvin R Kusko
Aruna Y Iturbide
Johnson L Gaucho
Mayumi R Dilliard
Sinclair Y Caudy
Emily T Chui
Kaitlin H Iturbide
Jennifer K Doe
David B Rulapaugh
Stacey N Ruta
Smith M Waycott
Ashley Q Stenseth
Octavia M Amigon
Leja C Darakjy
Mayumi G Waycott
Rodrigues V Schemmer
Ivar A Darakjy
Alejandro A Stenseth
Maisha F Inouye
James O Ruta
Mujtaba W Venere
David D Schemmer
Jeanfrancois L Nestle
Johnson L Darakjy
Salvatore Y Vocelka
Jefferson Y Kusko
Stacey K Slusarski
Isabel Z Inouye
Kaitlin F Whobrey
Emily Z Iturbide
Clifford F Oldroyd
Munro L Whobrey
Nicolas G Ostrosky
IdCountryDate
1000France2024-09-18
1001Canada2024-09-21
1002Brazil2024-09-18
1003France2024-09-24
1004Germany2024-09-02
1005Canada2024-09-06
1006Russia2024-09-17
1007Germany2024-08-27
1008Argentina2024-09-16
1009Spain2024-09-02
1010United Kingdom2024-09-20
1011Russia2024-09-06
1012Argentina2024-09-21
1013Japan2024-09-06
1014Australia2024-09-21
1015India2024-09-16
1016Russia2024-09-07
1017Argentina2024-09-18
1018Canada2024-09-04
1019Australia2024-09-15
1020Russia2024-09-16
1021Italy2024-09-11
1022India2024-09-12
1023Germany2024-08-31
1024Canada2024-09-13
1025France2024-09-15
1026Argentina2024-09-12
1027Brazil2024-09-21
1028United Kingdom2024-09-15
1029Brazil2024-09-10
1030United Kingdom2024-09-03
1031Australia2024-08-30
1032Canada2024-08-29
1033India2024-08-29
1034Canada2024-09-02
1035Canada2024-09-03
1036Russia2024-09-24
1037Russia2024-09-15
1038France2024-08-29
1039United Kingdom2024-09-13
1040Russia2024-09-10
1041Russia2024-09-07
1042Italy2024-08-31
1043United Kingdom2024-09-06
1044Argentina2024-09-22
1045United Kingdom2024-09-05
1046Australia2024-08-29
1047Germany2024-08-31
1048Germany2024-08-31
1049India2024-09-23

On-Demand Data

NameIdCountryDate
Mujtaba A Gillian1000Argentina2024-09-18
Stacey T Nicka1001France2024-09-24
Kadeem O Albares1002Australia2024-09-14
Kadeem S Caldarera1003Russia2024-09-18
James W Iturbide1004Russia2024-09-05
Claire A Wieser1005Canada2024-09-20
Mujtaba T Sergi1006United Kingdom2024-09-19
Morrow E Flosi1007United Kingdom2024-09-16
Nicolas C Rim1008Australia2024-09-02
Costa V Wieser1009Germany2024-09-02
Mujtaba Q Foller1010Germany2024-09-01
Cody F Gillian1011Brazil2024-09-14
Antonio H Garufi1012Brazil2024-09-06
Aditya V Kolmetz1013Japan2024-09-10
David I Shinko1014Argentina2024-09-25
Rodrigues P Ostrosky1015Russia2024-09-06
Silvio W Malet1016Argentina2024-08-29
Ricardo E Flosi1017Australia2024-09-21
Johnson T Caldarera1018Italy2024-09-01
Jennifer U Dilliard1019Brazil2024-09-21
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aditya E NickaItalyOnyama Limba NEGOTIATION
Kadeem D IturbideAustraliaAmy Elsner NEW
Munro Z WaycottSpainAsiya Javayant UNQUALIFIED
Nicolas A RimJapanAmy Elsner NEGOTIATION
Jones S OldroydCanadaStephen Shaw QUALIFIED
Mayumi N NestleGermanyAsiya Javayant UNQUALIFIED
Octavia U KolmetzAustraliaOnyama Limba QUALIFIED
Ricardo E BriddickCanadaAnna Fali PROPOSAL
Ivar R WhobreyJapanAmy Elsner PROPOSAL
Chavez E SchemmerSpainStephen Shaw NEW
Mayumi C WhobreyRussiaAsiya Javayant PROPOSAL
Silvio C StockhamJapanAsiya Javayant NEGOTIATION
Munro J WhobreyRussiaAsiya Javayant NEGOTIATION
Clifford B ShinkoBrazilAsiya Javayant QUALIFIED
Rodrigues I FigeroaAustraliaOnyama Limba NEGOTIATION
Johnson Q PerinUnited KingdomAmy Elsner NEGOTIATION
Claire A VocelkaUnited KingdomAmy Elsner QUALIFIED
Arvin R IturbideArgentinaIvan Magalhaes NEW
Salvatore F RoysterJapanElwin Sharvill NEW
Greenwood M SchemmerItalyStephen Shaw UNQUALIFIED
Jones K SlusarskiSpainStephen Shaw NEW
Morrow F AlbaresUnited KingdomIvan Magalhaes NEW
Wickens O IturbideGermanyAmy Elsner RENEWAL
Wickens I IturbideUnited KingdomIoni Bowcher RENEWAL
Leja I MarrierIndiaStephen Shaw QUALIFIED
Jefferson U SlusarskiAustraliaAmy Elsner QUALIFIED
David Z RoysterCanadaAsiya Javayant PROPOSAL
Julie I CaldareraUnited KingdomElwin Sharvill UNQUALIFIED
Aruna B KolmetzFranceIoni Bowcher NEGOTIATION
James M KolmetzUnited KingdomXuxue Feng NEGOTIATION
Faith F MacleadCanadaStephen Shaw PROPOSAL
Sinclair Z MorascaArgentinaElwin Sharvill QUALIFIED
David O AlbaresArgentinaAsiya Javayant NEW
Mujtaba W BowleySpainXuxue Feng NEW
Mayumi O AlbaresJapanXuxue Feng UNQUALIFIED
Adams J GlickAustraliaIvan Magalhaes PROPOSAL
Emily T CaldareraFranceAnna Fali QUALIFIED
Stacey W MarrierItalyIoni Bowcher QUALIFIED
Aditya I CaudyJapanBernardo Dominic NEW
Jones M MarrierUnited KingdomXuxue Feng QUALIFIED

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