Locale

Language
English
English
English
French
German
German
German
Italian
Korean
Spanish
Catalan
Dutch
Portuguese
Portuguese
Arabic
Arabic
Bulgarian
Bangla
Bosnian
Czech
Greek
Estonian
Persian
Finnish
Danish
Hindi
Indonesian
Icelandic
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
Uzbek
Vietnamese
Chinese
Chinese

Input Style

Free Themes

Built-in component themes created by the PrimeFaces Theme Designer.

Saga Saga
Vela Vela
Arya Arya

Legacy Free Themes

Luna Amber Luna Amber
Luna Blue Luna Blue
Luna Green Luna Green
Luna Pink Luna Pink
Nova Nova
Nova Nova Alt
Nova Nova Accent

DataTable Scroll

Both vertical and horizontal scrolling of the data is supported with optional frozen rows-columns and on-demand loading features.

Vertical
NameCountryRepresentativeStatus
Arvin AlbaresIndiaStephen Shaw NEW
Julie StensethIndiaAsiya Javayant QUALIFIED
Julie StensethUnited KingdomXuxue Feng NEW
Jefferson SchemmerSpainXuxue Feng RENEWAL
Greenwood BologniaArgentinaAnna Fali PROPOSAL
Rodrigues CampainUnited KingdomIoni Bowcher PROPOSAL
Arvin AlbaresJapanStephen Shaw UNQUALIFIED
Costa DilliardBrazilAsiya Javayant NEGOTIATION
Murillo MaletSpainIvan Magalhaes PROPOSAL
Aditya KuskoIndiaBernardo Dominic NEGOTIATION
Francesco ShinkoUnited KingdomElwin Sharvill NEGOTIATION
Salvatore StockhamFranceIoni Bowcher NEW
Arvin AlbaresIndiaAmy Elsner UNQUALIFIED
Emily WhobreySpainOnyama Limba NEW
Jefferson SchemmerJapanXuxue Feng RENEWAL
Johnson SergiBrazilAnna Fali NEGOTIATION
James ButtSpainOnyama Limba RENEWAL
Smith GlickFranceIoni Bowcher NEGOTIATION
Murillo MaletArgentinaAmy Elsner PROPOSAL
Misaki RoysterAustraliaOnyama Limba NEGOTIATION
Silvio SlusarskiSpainElwin Sharvill RENEWAL
Antonio CaudyUnited KingdomOnyama Limba PROPOSAL
Claire TollnerBrazilBernardo Dominic QUALIFIED
Claire TollnerCanadaBernardo Dominic NEGOTIATION
Darci PoquetteCanadaIvan Magalhaes NEW
Munro FerenczIndiaAnna Fali RENEWAL
Jeanfrancois VenereArgentinaAmy Elsner NEGOTIATION
Leon OldroydItalyAsiya Javayant PROPOSAL
Maria MarrierGermanyAnna Fali UNQUALIFIED
Arvin AlbaresUnited KingdomOnyama Limba QUALIFIED
Greenwood BologniaGermanyAsiya Javayant QUALIFIED
Izzy GarufiCanadaXuxue Feng PROPOSAL
Nicolas IturbideJapanXuxue Feng NEW
Francesco ShinkoIndiaXuxue Feng RENEWAL
Maisha RulapaughArgentinaAmy Elsner UNQUALIFIED
Francesco ShinkoAustraliaAmy Elsner QUALIFIED
Nicolas IturbideIndiaBernardo Dominic QUALIFIED
Greenwood BologniaItalyAsiya Javayant NEW
Costa DilliardJapanAmy Elsner UNQUALIFIED
Francesco ShinkoIndiaIoni Bowcher PROPOSAL
Jeanfrancois VenereJapanIoni Bowcher NEGOTIATION
Cody SaylorsCanadaOnyama Limba PROPOSAL
Misaki RoysterIndiaAnna Fali NEGOTIATION
Jeanfrancois VenereUnited KingdomIoni Bowcher PROPOSAL
Julie StensethSpainAnna Fali NEW
Nicolas IturbideFranceXuxue Feng NEW
Morrow RutaIndiaBernardo Dominic NEW
Jennifer AmigonFranceIoni Bowcher RENEWAL
Nicolas IturbideUnited KingdomAsiya Javayant PROPOSAL
Leja CaldareraSpainAsiya Javayant QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Juan WieserArgentinaBernardo Dominic QUALIFIED
Antonio CaudyAustraliaStephen Shaw UNQUALIFIED
Silvio SlusarskiFranceAmy Elsner RENEWAL
Smith GlickGermanyIvan Magalhaes QUALIFIED
Antonio CaudyCanadaAmy Elsner QUALIFIED
Clifford RimItalyIoni Bowcher PROPOSAL
Aruna FigeroaGermanyIoni Bowcher QUALIFIED
Jones VocelkaAustraliaAsiya Javayant UNQUALIFIED
Jones VocelkaIndiaAnna Fali PROPOSAL
Antonio CaudyAustraliaAmy Elsner QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Deepesh ChuiSpain2025-09-17Buckley Miller Wright QUALIFIED17Elwin Sharvill
1001Francesco ShinkoSpain2025-08-26Chapman, Ross E Esq QUALIFIED72Amy Elsner
1002Jeanfrancois VenereAustralia2025-09-06Morlong Associates RENEWAL18Stephen Shaw
1003Mujtaba NickaItaly2025-09-10Chanay, Jeffrey A Esq RENEWAL19Stephen Shaw
1004Octavia MaletItaly2025-08-23Chapman, Ross E Esq PROPOSAL25Amy Elsner
1005Morrow RutaUnited Kingdom2025-09-17Printing Dimensions RENEWAL19Elwin Sharvill
1006Claire TollnerBrazil2025-09-20Morlong Associates NEGOTIATION96Elwin Sharvill
1007Murillo MaletItaly2025-09-06Commercial Press UNQUALIFIED21Anna Fali
1008Ivar PaprockiGermany2025-09-13Buckley Miller Wright RENEWAL49Onyama Limba
1009Izzy GarufiSpain2025-09-04Rangoni Of Florence PROPOSAL7Xuxue Feng
1010Jennifer AmigonUnited Kingdom2025-09-09King, Christopher A Esq NEW82Elwin Sharvill
1011Kadeem FlosiItaly2025-08-24Buckley Miller Wright PROPOSAL24Anna Fali
1012Jeanfrancois VenereBrazil2025-09-04Rangoni Of Florence UNQUALIFIED87Ioni Bowcher
1013Antonio CaudyCanada2025-09-13Morlong Associates UNQUALIFIED18Stephen Shaw
1014Murillo MaletGermany2025-09-05Buckley Miller Wright UNQUALIFIED23Amy Elsner
1015Aditya KuskoAustralia2025-09-01Feiner Bros UNQUALIFIED60Onyama Limba
1016Leja CaldareraItaly2025-09-02Chemel, James L Cpa QUALIFIED21Elwin Sharvill
1017Smith GlickAustralia2025-09-13Morlong Associates PROPOSAL72Asiya Javayant
1018Juan WieserCanada2025-09-04Chanay, Jeffrey A Esq UNQUALIFIED12Ioni Bowcher
1019Morrow RutaBrazil2025-09-04Chemel, James L Cpa NEGOTIATION61Asiya Javayant
1020Juan WieserSpain2025-09-05Feiner Bros RENEWAL49Bernardo Dominic
1021Silvio SlusarskiSpain2025-09-16Truhlar And Truhlar Attys QUALIFIED83Ivan Magalhaes
1022Cody SaylorsSpain2025-08-26Truhlar And Truhlar Attys NEW16Bernardo Dominic
1023Octavia MaletItaly2025-09-19Morlong Associates PROPOSAL2Bernardo Dominic
1024Arvin AlbaresFrance2025-09-18Chanay, Jeffrey A Esq UNQUALIFIED42Xuxue Feng
1025Izzy GarufiRussia2025-09-21Chapman, Ross E Esq NEW82Bernardo Dominic
1026James ButtCanada2025-09-15Chemel, James L Cpa NEGOTIATION50Stephen Shaw
1027Faith GillianSpain2025-09-03Morlong Associates QUALIFIED25Anna Fali
1028Faith GillianSpain2025-09-19Feltz Printing Service UNQUALIFIED4Amy Elsner
1029Ashley DoeIndia2025-09-09Rousseaux, Michael Esq PROPOSAL41Ivan Magalhaes
1030Costa DilliardGermany2025-09-11Rangoni Of Florence QUALIFIED51Amy Elsner
1031Rodrigues CampainCanada2025-09-08Chanay, Jeffrey A Esq RENEWAL49Anna Fali
1032Maria MarrierUnited Kingdom2025-09-02Buckley Miller Wright UNQUALIFIED10Bernardo Dominic
1033Johnson SergiSpain2025-09-16Buckley Miller Wright NEW15Ioni Bowcher
1034Leja CaldareraUnited Kingdom2025-09-04Commercial Press NEW35Bernardo Dominic
1035Mujtaba NickaSpain2025-09-08Benton, John B Jr RENEWAL20Ivan Magalhaes
1036David DarakjyCanada2025-09-03Feltz Printing Service UNQUALIFIED34Xuxue Feng
1037Izzy GarufiSpain2025-09-05Chanay, Jeffrey A Esq QUALIFIED53Onyama Limba
1038Mayumi KolmetzBrazil2025-08-31Truhlar And Truhlar Attys QUALIFIED79Amy Elsner
1039Alejandro PerinFrance2025-08-25Benton, John B Jr RENEWAL48Anna Fali
1040Alejandro PerinRussia2025-09-20Buckley Miller Wright UNQUALIFIED77Anna Fali
1041Costa DilliardJapan2025-09-17Feiner Bros QUALIFIED29Ioni Bowcher
1042Ashley DoeArgentina2025-09-10King, Christopher A Esq NEW35Bernardo Dominic
1043Smith GlickArgentina2025-09-06Morlong Associates PROPOSAL59Xuxue Feng
1044Jeanfrancois VenereAustralia2025-09-03Chapman, Ross E Esq NEGOTIATION28Asiya Javayant
1045Chavez BriddickGermany2025-08-24Rousseaux, Michael Esq PROPOSAL1Ioni Bowcher
1046Leja CaldareraGermany2025-08-28Rousseaux, Michael Esq PROPOSAL64Ivan Magalhaes
1047Ricardo GauchoGermany2025-09-15King, Christopher A Esq QUALIFIED33Elwin Sharvill
1048Kadeem FlosiFrance2025-09-02Commercial Press NEW69Ivan Magalhaes
1049Mujtaba NickaGermany2025-08-29Printing Dimensions UNQUALIFIED54Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Cody SaylorsItalyStephen Shaw QUALIFIED
Deepesh ChuiSpainAnna Fali QUALIFIED
Julie StensethSpainAmy Elsner RENEWAL
Octavia MaletJapanStephen Shaw PROPOSAL
Johnson SergiCanadaAnna Fali UNQUALIFIED
Leon OldroydIndiaIvan Magalhaes QUALIFIED
Chavez BriddickItalyIoni Bowcher RENEWAL
Johnson SergiGermanyBernardo Dominic UNQUALIFIED
Munro FerenczCanadaIoni Bowcher RENEWAL
Claire TollnerArgentinaStephen Shaw UNQUALIFIED
Jeanfrancois VenereCanadaXuxue Feng UNQUALIFIED
Jefferson SchemmerFranceElwin Sharvill NEW
Aruna FigeroaAustraliaStephen Shaw NEW
Izzy GarufiUnited KingdomAmy Elsner RENEWAL
Silvio SlusarskiIndiaStephen Shaw QUALIFIED
Nicolas IturbideAustraliaStephen Shaw QUALIFIED
Rodrigues CampainIndiaElwin Sharvill PROPOSAL
Izzy GarufiGermanyIvan Magalhaes UNQUALIFIED
Faith GillianItalyElwin Sharvill UNQUALIFIED
Silvio SlusarskiAustraliaXuxue Feng PROPOSAL
Kadeem FlosiAustraliaAnna Fali RENEWAL
Darci PoquetteItalyBernardo Dominic RENEWAL
Clifford RimCanadaOnyama Limba NEW
Aika InouyeRussiaOnyama Limba PROPOSAL
Kaitlin OstroskyCanadaIoni Bowcher NEGOTIATION
Costa DilliardArgentinaAmy Elsner NEGOTIATION
Clifford RimSpainElwin Sharvill NEW
Octavia MaletBrazilXuxue Feng QUALIFIED
Maisha RulapaughIndiaBernardo Dominic QUALIFIED
Francesco ShinkoJapanXuxue Feng NEGOTIATION
Emily WhobreyAustraliaXuxue Feng RENEWAL
Octavia MaletItalyBernardo Dominic NEW
Tony FollerSpainStephen Shaw UNQUALIFIED
Ivar PaprockiSpainAmy Elsner UNQUALIFIED
Izzy GarufiGermanyIoni Bowcher QUALIFIED
Greenwood BologniaSpainAnna Fali QUALIFIED
Chavez BriddickCanadaAnna Fali QUALIFIED
Sinclair WaycottJapanStephen Shaw NEGOTIATION
Mujtaba NickaFranceIvan Magalhaes QUALIFIED
Leon OldroydCanadaIoni Bowcher PROPOSAL
James ButtFranceIoni Bowcher NEW
Mujtaba NickaFranceStephen Shaw QUALIFIED
Aditya KuskoJapanElwin Sharvill NEGOTIATION
Deepesh ChuiIndiaAnna Fali NEW
Costa DilliardRussiaIvan Magalhaes NEW
Aditya KuskoRussiaAsiya Javayant NEW
Aruna FigeroaItalyIvan Magalhaes PROPOSAL
Faith GillianSpainAnna Fali NEGOTIATION
Claire TollnerCanadaAmy Elsner NEW
Faith GillianArgentinaAsiya Javayant NEW
Frozen Columns
Name
Ricardo Gaucho
Munro Ferencz
Costa Dilliard
Smith Glick
Darci Poquette
Tony Foller
Salvatore Stockham
Cody Saylors
Clifford Rim
Aditya Kusko
Jones Vocelka
Jefferson Schemmer
Adams Morasca
Alejandro Perin
Johnson Sergi
Emily Whobrey
Kaitlin Ostrosky
Silvio Slusarski
Darci Poquette
Morrow Ruta
Alejandro Perin
Mayumi Kolmetz
Morrow Ruta
Juan Wieser
Sinclair Waycott
Morrow Ruta
Aika Inouye
Alejandro Perin
Adams Morasca
Tony Foller
Johnson Sergi
Jennifer Amigon
Kaitlin Ostrosky
Aditya Kusko
Morrow Ruta
Munro Ferencz
Sinclair Waycott
Munro Ferencz
Mayumi Kolmetz
Julie Stenseth
Chavez Briddick
Greenwood Bolognia
Leon Oldroyd
Jeanfrancois Venere
Greenwood Bolognia
Mujtaba Nicka
Darci Poquette
Murillo Malet
Misaki Royster
Cody Saylors
IdCountryDate
1000Japan2025-09-14
1001Russia2025-09-13
1002Russia2025-09-14
1003France2025-09-05
1004Brazil2025-09-16
1005Japan2025-09-13
1006Italy2025-09-20
1007Canada2025-09-13
1008United Kingdom2025-09-05
1009France2025-09-06
1010Italy2025-09-16
1011Canada2025-09-08
1012Argentina2025-08-29
1013Argentina2025-08-27
1014Brazil2025-09-05
1015Russia2025-09-03
1016Japan2025-09-11
1017United Kingdom2025-09-16
1018Brazil2025-08-26
1019Japan2025-09-04
1020United Kingdom2025-09-14
1021Canada2025-08-31
1022Canada2025-09-16
1023Japan2025-09-02
1024Germany2025-09-15
1025Canada2025-08-26
1026Russia2025-08-28
1027Spain2025-09-05
1028Argentina2025-09-04
1029Germany2025-09-03
1030Spain2025-09-10
1031Canada2025-09-07
1032France2025-08-23
1033Spain2025-09-13
1034Russia2025-08-24
1035Germany2025-08-27
1036Brazil2025-09-21
1037Russia2025-08-25
1038Japan2025-09-21
1039United Kingdom2025-09-07
1040France2025-08-23
1041Argentina2025-09-04
1042Brazil2025-09-04
1043France2025-09-13
1044Russia2025-09-07
1045Russia2025-08-23
1046Brazil2025-09-15
1047Brazil2025-09-06
1048Brazil2025-09-19
1049India2025-09-08

On-Demand Data

NameIdCountryDate
Jeanfrancois Venere1000Japan2025-09-14
Isabel Bowley1001Spain2025-09-08
Kaitlin Ostrosky1002Russia2025-09-16
Francesco Shinko1003Germany2025-09-19
Alejandro Perin1004Japan2025-09-05
Sinclair Waycott1005Italy2025-08-23
Isabel Bowley1006United Kingdom2025-08-25
Faith Gillian1007Australia2025-09-17
Darci Poquette1008Italy2025-09-10
Nicolas Iturbide1009Italy2025-09-10
Claire Tollner1010United Kingdom2025-09-12
David Darakjy1011Australia2025-09-09
Maisha Rulapaugh1012Italy2025-08-28
Alejandro Perin1013India2025-08-31
Leon Oldroyd1014United Kingdom2025-09-01
Morrow Ruta1015Italy2025-09-08
Jefferson Schemmer1016Japan2025-08-27
Aruna Figeroa1017Canada2025-09-07
Ivar Paprocki1018Brazil2025-08-31
Rodrigues Campain1019India2025-09-13
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Izzy GarufiAustraliaAmy Elsner UNQUALIFIED
Alejandro PerinAustraliaAsiya Javayant UNQUALIFIED
Leja CaldareraAustraliaStephen Shaw PROPOSAL
Cody SaylorsGermanyBernardo Dominic PROPOSAL
Aruna FigeroaSpainStephen Shaw NEW
Munro FerenczRussiaStephen Shaw RENEWAL
James ButtArgentinaStephen Shaw UNQUALIFIED
James ButtBrazilAnna Fali PROPOSAL
Greenwood BologniaAustraliaAsiya Javayant NEW
Ashley DoeCanadaAmy Elsner PROPOSAL
Alejandro PerinAustraliaBernardo Dominic UNQUALIFIED
Claire TollnerItalyElwin Sharvill RENEWAL
Jefferson SchemmerJapanBernardo Dominic RENEWAL
Ivar PaprockiItalyIvan Magalhaes RENEWAL
Leon OldroydCanadaIvan Magalhaes QUALIFIED
Isabel BowleyArgentinaAnna Fali UNQUALIFIED
Arvin AlbaresUnited KingdomXuxue Feng PROPOSAL
Aruna FigeroaAustraliaXuxue Feng NEW
Wickens NestleSpainStephen Shaw QUALIFIED
Misaki RoysterJapanStephen Shaw PROPOSAL
Francesco ShinkoRussiaIvan Magalhaes UNQUALIFIED
Deepesh ChuiUnited KingdomIoni Bowcher UNQUALIFIED
Ivar PaprockiBrazilXuxue Feng PROPOSAL
Smith GlickFranceAmy Elsner NEW
Deepesh ChuiUnited KingdomIoni Bowcher QUALIFIED
Johnson SergiArgentinaStephen Shaw RENEWAL
Ashley DoeAustraliaOnyama Limba UNQUALIFIED
Darci PoquetteFranceOnyama Limba NEGOTIATION
Isabel BowleyJapanIoni Bowcher NEGOTIATION
Claire TollnerAustraliaIvan Magalhaes NEW
Ricardo GauchoItalyAnna Fali QUALIFIED
Deepesh ChuiAustraliaOnyama Limba NEGOTIATION
Nicolas IturbideArgentinaStephen Shaw NEW
Isabel BowleyGermanyIvan Magalhaes PROPOSAL
Antonio CaudyAustraliaAmy Elsner NEW
Antonio CaudyCanadaAnna Fali UNQUALIFIED
Ricardo GauchoJapanAnna Fali QUALIFIED
Maisha RulapaughAustraliaIvan Magalhaes RENEWAL
Chavez BriddickIndiaBernardo Dominic RENEWAL
Ivar PaprockiArgentinaAmy Elsner NEGOTIATION

<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.statusName}">#{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.statusName}">#{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.statusName}">#{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.statusName}">#{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.statusName}">#{customer.status}</span>
            </p:column>
        </p:dataTable>
    </div>

</h:form>