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
Octavia MaletGermanyXuxue Feng QUALIFIED
Faith GillianFranceIvan Magalhaes RENEWAL
Ashley DoeItalyIoni Bowcher NEW
Leja CaldareraItalyAnna Fali NEW
Jones VocelkaFranceXuxue Feng NEGOTIATION
Isabel BowleySpainStephen Shaw QUALIFIED
Jeanfrancois VenereIndiaIoni Bowcher QUALIFIED
Silvio SlusarskiBrazilElwin Sharvill NEW
Misaki RoysterBrazilAmy Elsner PROPOSAL
Smith GlickJapanOnyama Limba PROPOSAL
Arvin AlbaresIndiaAmy Elsner RENEWAL
Ricardo GauchoJapanStephen Shaw PROPOSAL
David DarakjyIndiaAnna Fali PROPOSAL
Cody SaylorsJapanAmy Elsner RENEWAL
Tony FollerRussiaAnna Fali NEGOTIATION
Arvin AlbaresJapanBernardo Dominic QUALIFIED
Rodrigues CampainArgentinaAnna Fali QUALIFIED
Maisha RulapaughItalyStephen Shaw RENEWAL
Jefferson SchemmerIndiaOnyama Limba PROPOSAL
Misaki RoysterRussiaStephen Shaw UNQUALIFIED
Jennifer AmigonSpainStephen Shaw QUALIFIED
Mayumi KolmetzAustraliaAsiya Javayant NEW
Greenwood BologniaAustraliaElwin Sharvill UNQUALIFIED
Costa DilliardSpainXuxue Feng NEGOTIATION
Munro FerenczItalyXuxue Feng PROPOSAL
Morrow RutaFranceElwin Sharvill NEW
Aruna FigeroaRussiaIvan Magalhaes UNQUALIFIED
Jennifer AmigonFranceBernardo Dominic QUALIFIED
Johnson SergiItalyXuxue Feng UNQUALIFIED
Kadeem FlosiBrazilAmy Elsner QUALIFIED
Maisha RulapaughSpainXuxue Feng QUALIFIED
Rodrigues CampainAustraliaAnna Fali UNQUALIFIED
Julie StensethItalyStephen Shaw PROPOSAL
Morrow RutaFranceIvan Magalhaes QUALIFIED
Clifford RimFranceXuxue Feng NEGOTIATION
Adams MorascaJapanAnna Fali NEW
Emily WhobreyAustraliaAmy Elsner PROPOSAL
Chavez BriddickIndiaIoni Bowcher RENEWAL
Silvio SlusarskiJapanElwin Sharvill NEW
Morrow RutaBrazilAsiya Javayant QUALIFIED
Kadeem FlosiSpainOnyama Limba RENEWAL
Salvatore StockhamIndiaBernardo Dominic NEW
Leon OldroydUnited KingdomIvan Magalhaes NEW
Claire TollnerRussiaXuxue Feng RENEWAL
Murillo MaletAustraliaAsiya Javayant RENEWAL
Kaitlin OstroskyArgentinaElwin Sharvill NEW
Faith GillianSpainElwin Sharvill NEGOTIATION
Jones VocelkaBrazilBernardo Dominic PROPOSAL
Aditya KuskoUnited KingdomElwin Sharvill UNQUALIFIED
Deepesh ChuiAustraliaIoni Bowcher NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Jeanfrancois VenereJapanStephen Shaw NEW
Salvatore StockhamAustraliaStephen Shaw QUALIFIED
Claire TollnerAustraliaAsiya Javayant PROPOSAL
Murillo MaletBrazilIvan Magalhaes RENEWAL
Deepesh ChuiGermanyAnna Fali UNQUALIFIED
Deepesh ChuiFranceElwin Sharvill NEW
Kaitlin OstroskyCanadaAmy Elsner QUALIFIED
Tony FollerIndiaAsiya Javayant UNQUALIFIED
Greenwood BologniaArgentinaElwin Sharvill NEW
Cody SaylorsGermanyXuxue Feng QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Arvin AlbaresGermany2026-05-01Rousseaux, Michael Esq RENEWAL62Asiya Javayant
1001Greenwood BologniaCanada2026-04-08Rousseaux, Michael Esq NEW75Amy Elsner
1002Leon OldroydSpain2026-04-17Buckley Miller Wright QUALIFIED0Xuxue Feng
1003James ButtJapan2026-04-29Buckley Miller Wright PROPOSAL89Ivan Magalhaes
1004Leon OldroydAustralia2026-04-12Buckley Miller Wright NEW10Ivan Magalhaes
1005Juan WieserIndia2026-04-23King, Christopher A Esq UNQUALIFIED26Stephen Shaw
1006Octavia MaletCanada2026-04-15Chapman, Ross E Esq PROPOSAL97Anna Fali
1007Isabel BowleyCanada2026-04-05Morlong Associates NEW20Anna Fali
1008Sinclair WaycottArgentina2026-04-26Printing Dimensions QUALIFIED86Ioni Bowcher
1009Adams MorascaFrance2026-04-08Buckley Miller Wright UNQUALIFIED46Onyama Limba
1010Jeanfrancois VenereBrazil2026-04-02Rangoni Of Florence NEGOTIATION26Bernardo Dominic
1011Darci PoquetteItaly2026-04-04Truhlar And Truhlar Attys NEGOTIATION99Asiya Javayant
1012Ricardo GauchoArgentina2026-04-09Truhlar And Truhlar Attys QUALIFIED42Stephen Shaw
1013Isabel BowleyGermany2026-04-27Feltz Printing Service NEGOTIATION29Amy Elsner
1014Wickens NestleAustralia2026-04-02Chemel, James L Cpa NEW30Anna Fali
1015Rodrigues CampainItaly2026-04-08Commercial Press QUALIFIED91Ivan Magalhaes
1016Wickens NestleRussia2026-04-07Morlong Associates RENEWAL10Xuxue Feng
1017Morrow RutaRussia2026-04-27Benton, John B Jr PROPOSAL17Anna Fali
1018Julie StensethItaly2026-04-15Feltz Printing Service NEW36Ioni Bowcher
1019Ricardo GauchoSpain2026-04-23Printing Dimensions NEGOTIATION84Elwin Sharvill
1020Jennifer AmigonRussia2026-04-17Feiner Bros RENEWAL85Ivan Magalhaes
1021Clifford RimSpain2026-04-11Feltz Printing Service PROPOSAL78Asiya Javayant
1022Jefferson SchemmerSpain2026-04-07Chemel, James L Cpa NEGOTIATION19Ivan Magalhaes
1023Deepesh ChuiBrazil2026-04-15Truhlar And Truhlar Attys QUALIFIED13Elwin Sharvill
1024Juan WieserFrance2026-04-16Commercial Press NEW85Amy Elsner
1025Mujtaba NickaArgentina2026-04-02Rousseaux, Michael Esq QUALIFIED32Ivan Magalhaes
1026Juan WieserBrazil2026-04-04Commercial Press QUALIFIED62Asiya Javayant
1027Aditya KuskoArgentina2026-04-20Morlong Associates NEGOTIATION52Amy Elsner
1028Alejandro PerinFrance2026-04-09Feiner Bros UNQUALIFIED83Ioni Bowcher
1029James ButtSpain2026-04-26Morlong Associates NEW1Onyama Limba
1030Sinclair WaycottItaly2026-04-15Chemel, James L Cpa RENEWAL86Ioni Bowcher
1031Smith GlickRussia2026-04-20Benton, John B Jr NEGOTIATION93Asiya Javayant
1032Faith GillianAustralia2026-04-24Feiner Bros PROPOSAL80Xuxue Feng
1033Nicolas IturbideCanada2026-04-21King, Christopher A Esq RENEWAL89Elwin Sharvill
1034Arvin AlbaresItaly2026-04-09Chemel, James L Cpa NEW80Amy Elsner
1035Munro FerenczCanada2026-04-19Dorl, James J Esq RENEWAL69Amy Elsner
1036Johnson SergiFrance2026-04-13Rangoni Of Florence QUALIFIED96Elwin Sharvill
1037Claire TollnerJapan2026-04-20Rangoni Of Florence QUALIFIED24Ivan Magalhaes
1038Costa DilliardItaly2026-04-09Rousseaux, Michael Esq QUALIFIED84Amy Elsner
1039Jefferson SchemmerItaly2026-04-24Morlong Associates NEW86Xuxue Feng
1040Kaitlin OstroskyItaly2026-04-19Printing Dimensions NEGOTIATION57Ioni Bowcher
1041Deepesh ChuiJapan2026-04-11Feiner Bros RENEWAL9Asiya Javayant
1042Chavez BriddickRussia2026-04-12Chapman, Ross E Esq QUALIFIED77Anna Fali
1043Greenwood BologniaSpain2026-04-09Dorl, James J Esq NEGOTIATION5Anna Fali
1044Cody SaylorsJapan2026-04-18Buckley Miller Wright NEW45Ivan Magalhaes
1045Claire TollnerGermany2026-04-06Feiner Bros UNQUALIFIED68Elwin Sharvill
1046Faith GillianAustralia2026-04-11Printing Dimensions RENEWAL13Ivan Magalhaes
1047Julie StensethBrazil2026-04-10Benton, John B Jr QUALIFIED12Onyama Limba
1048Emily WhobreyFrance2026-04-06Rousseaux, Michael Esq NEGOTIATION23Amy Elsner
1049Smith GlickAustralia2026-04-14Buckley Miller Wright NEGOTIATION79Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Jeanfrancois VenereUnited KingdomStephen Shaw UNQUALIFIED
Silvio SlusarskiBrazilIoni Bowcher QUALIFIED
Mujtaba NickaIndiaElwin Sharvill NEGOTIATION
Murillo MaletJapanXuxue Feng QUALIFIED
Jeanfrancois VenereItalyElwin Sharvill RENEWAL
Antonio CaudyCanadaOnyama Limba QUALIFIED
Ivar PaprockiRussiaIoni Bowcher RENEWAL
Emily WhobreyUnited KingdomIoni Bowcher QUALIFIED
Jennifer AmigonFranceIoni Bowcher PROPOSAL
Francesco ShinkoGermanyIoni Bowcher PROPOSAL
Kadeem FlosiBrazilIvan Magalhaes RENEWAL
Jefferson SchemmerSpainStephen Shaw PROPOSAL
Maria MarrierFranceXuxue Feng RENEWAL
Adams MorascaJapanElwin Sharvill PROPOSAL
Julie StensethGermanyAsiya Javayant PROPOSAL
Leon OldroydRussiaBernardo Dominic NEW
Juan WieserItalyIvan Magalhaes PROPOSAL
Stacey MacleadJapanStephen Shaw PROPOSAL
Chavez BriddickItalyXuxue Feng NEW
Emily WhobreyUnited KingdomIoni Bowcher NEW
Faith GillianCanadaIoni Bowcher RENEWAL
Aika InouyeCanadaIoni Bowcher PROPOSAL
Aruna FigeroaRussiaIvan Magalhaes QUALIFIED
Faith GillianSpainBernardo Dominic NEGOTIATION
Rodrigues CampainCanadaBernardo Dominic PROPOSAL
Octavia MaletItalyBernardo Dominic QUALIFIED
Wickens NestleArgentinaXuxue Feng UNQUALIFIED
Jones VocelkaBrazilElwin Sharvill UNQUALIFIED
Salvatore StockhamAustraliaIoni Bowcher UNQUALIFIED
Greenwood BologniaJapanBernardo Dominic NEW
Juan WieserUnited KingdomIvan Magalhaes PROPOSAL
Jones VocelkaCanadaAsiya Javayant RENEWAL
Leja CaldareraUnited KingdomStephen Shaw RENEWAL
Adams MorascaIndiaAsiya Javayant NEGOTIATION
Jefferson SchemmerRussiaElwin Sharvill RENEWAL
Ivar PaprockiFranceIvan Magalhaes QUALIFIED
Greenwood BologniaJapanAsiya Javayant NEGOTIATION
Salvatore StockhamItalyStephen Shaw UNQUALIFIED
Maisha RulapaughArgentinaStephen Shaw NEGOTIATION
Deepesh ChuiUnited KingdomElwin Sharvill NEGOTIATION
Jeanfrancois VenereRussiaAnna Fali QUALIFIED
Sinclair WaycottUnited KingdomAmy Elsner PROPOSAL
Ashley DoeIndiaXuxue Feng PROPOSAL
Mayumi KolmetzItalyIvan Magalhaes QUALIFIED
Claire TollnerFranceAsiya Javayant NEW
Jeanfrancois VenereIndiaOnyama Limba QUALIFIED
Maisha RulapaughAustraliaElwin Sharvill PROPOSAL
Aditya KuskoJapanBernardo Dominic NEGOTIATION
Misaki RoysterFranceXuxue Feng NEGOTIATION
Kaitlin OstroskyBrazilAmy Elsner PROPOSAL
Frozen Columns
Name
Darci Poquette
Isabel Bowley
Salvatore Stockham
Silvio Slusarski
James Butt
Darci Poquette
Maisha Rulapaugh
Greenwood Bolognia
Octavia Malet
Mayumi Kolmetz
Leja Caldarera
Leon Oldroyd
Aruna Figeroa
Misaki Royster
Misaki Royster
Jones Vocelka
Jeanfrancois Venere
Emily Whobrey
Ashley Doe
Nicolas Iturbide
Leja Caldarera
Sinclair Waycott
Ivar Paprocki
Ricardo Gaucho
Jefferson Schemmer
Octavia Malet
Johnson Sergi
Deepesh Chui
Chavez Briddick
Isabel Bowley
James Butt
Adams Morasca
Maisha Rulapaugh
David Darakjy
Nicolas Iturbide
Alejandro Perin
Ivar Paprocki
Smith Glick
Izzy Garufi
Adams Morasca
Antonio Caudy
Deepesh Chui
Kadeem Flosi
Izzy Garufi
Deepesh Chui
Wickens Nestle
Aika Inouye
David Darakjy
Salvatore Stockham
Silvio Slusarski
IdCountryDate
1000United Kingdom2026-04-27
1001Japan2026-04-10
1002Italy2026-04-08
1003India2026-04-05
1004France2026-04-27
1005India2026-04-02
1006Argentina2026-04-16
1007Spain2026-04-15
1008Brazil2026-04-02
1009Japan2026-04-19
1010Russia2026-04-13
1011Argentina2026-04-15
1012United Kingdom2026-04-06
1013Brazil2026-04-20
1014Canada2026-04-27
1015United Kingdom2026-04-14
1016Japan2026-04-13
1017Spain2026-04-05
1018Brazil2026-04-14
1019Australia2026-04-09
1020Brazil2026-04-25
1021Spain2026-04-09
1022Brazil2026-04-09
1023Australia2026-04-05
1024France2026-04-08
1025Australia2026-04-27
1026India2026-04-18
1027Germany2026-04-10
1028United Kingdom2026-04-27
1029India2026-04-26
1030Spain2026-04-14
1031Italy2026-04-12
1032India2026-04-18
1033United Kingdom2026-04-15
1034France2026-04-24
1035Argentina2026-04-20
1036Russia2026-04-27
1037Russia2026-05-01
1038France2026-04-10
1039Brazil2026-04-28
1040Australia2026-04-13
1041Germany2026-04-20
1042Germany2026-04-29
1043Brazil2026-04-10
1044Italy2026-04-11
1045United Kingdom2026-04-27
1046Argentina2026-04-25
1047India2026-04-10
1048Brazil2026-04-16
1049India2026-04-20

On-Demand Data

NameIdCountryDate
Wickens Nestle1000Russia2026-04-19
Octavia Malet1001Brazil2026-04-13
Ricardo Gaucho1002Canada2026-04-05
Sinclair Waycott1003Japan2026-04-23
Munro Ferencz1004Spain2026-04-04
Leon Oldroyd1005Brazil2026-04-27
Aditya Kusko1006Spain2026-04-19
Adams Morasca1007Australia2026-04-15
Claire Tollner1008Japan2026-04-02
Darci Poquette1009Japan2026-04-08
David Darakjy1010Spain2026-04-02
Cody Saylors1011United Kingdom2026-04-13
Julie Stenseth1012Germany2026-04-17
Salvatore Stockham1013Brazil2026-04-10
Juan Wieser1014Argentina2026-04-17
Tony Foller1015Australia2026-04-06
Aditya Kusko1016France2026-04-17
Morrow Ruta1017Japan2026-04-04
Ricardo Gaucho1018Canada2026-04-22
Faith Gillian1019Argentina2026-04-09
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Chavez BriddickGermanyAmy Elsner NEGOTIATION
James ButtItalyAnna Fali UNQUALIFIED
Mujtaba NickaRussiaStephen Shaw NEW
Darci PoquetteBrazilAmy Elsner NEW
Darci PoquetteItalyIvan Magalhaes PROPOSAL
Jefferson SchemmerRussiaAsiya Javayant UNQUALIFIED
Jeanfrancois VenereArgentinaIoni Bowcher QUALIFIED
Jefferson SchemmerFranceIvan Magalhaes NEGOTIATION
Rodrigues CampainSpainElwin Sharvill UNQUALIFIED
Antonio CaudyBrazilBernardo Dominic QUALIFIED
Jennifer AmigonItalyElwin Sharvill UNQUALIFIED
Emily WhobreyJapanBernardo Dominic NEGOTIATION
Jones VocelkaJapanIvan Magalhaes NEW
Octavia MaletJapanOnyama Limba RENEWAL
Claire TollnerItalyXuxue Feng PROPOSAL
Isabel BowleyGermanyIoni Bowcher QUALIFIED
Misaki RoysterItalyAsiya Javayant NEGOTIATION
Tony FollerArgentinaAmy Elsner NEGOTIATION
Misaki RoysterArgentinaIoni Bowcher PROPOSAL
Ivar PaprockiJapanStephen Shaw RENEWAL
Ashley DoeCanadaIoni Bowcher UNQUALIFIED
Maisha RulapaughIndiaAsiya Javayant PROPOSAL
Kadeem FlosiCanadaOnyama Limba UNQUALIFIED
Francesco ShinkoItalyIoni Bowcher RENEWAL
Salvatore StockhamItalyIoni Bowcher PROPOSAL
Ricardo GauchoSpainIoni Bowcher NEGOTIATION
Leon OldroydGermanyOnyama Limba NEW
Kadeem FlosiUnited KingdomOnyama Limba NEW
Murillo MaletBrazilAnna Fali PROPOSAL
Chavez BriddickFranceXuxue Feng PROPOSAL
Smith GlickUnited KingdomOnyama Limba NEW
Silvio SlusarskiRussiaOnyama Limba RENEWAL
Salvatore StockhamGermanyXuxue Feng NEW
Mayumi KolmetzFranceOnyama Limba NEGOTIATION
Julie StensethAustraliaElwin Sharvill NEGOTIATION
Arvin AlbaresUnited KingdomBernardo Dominic NEW
Leja CaldareraFranceXuxue Feng RENEWAL
Chavez BriddickAustraliaStephen Shaw PROPOSAL
Ricardo GauchoUnited KingdomAmy Elsner UNQUALIFIED
Jennifer AmigonGermanyElwin Sharvill PROPOSAL

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