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
Aditya KuskoItalyIoni Bowcher NEGOTIATION
Wickens NestleIndiaIoni Bowcher NEW
Tony FollerRussiaAmy Elsner NEGOTIATION
Arvin AlbaresAustraliaElwin Sharvill QUALIFIED
Misaki RoysterRussiaAmy Elsner QUALIFIED
David DarakjyJapanAsiya Javayant QUALIFIED
Alejandro PerinAustraliaXuxue Feng NEGOTIATION
Kadeem FlosiRussiaElwin Sharvill NEW
Cody SaylorsBrazilIoni Bowcher UNQUALIFIED
Johnson SergiGermanyStephen Shaw PROPOSAL
Rodrigues CampainSpainOnyama Limba NEW
Morrow RutaFranceOnyama Limba NEW
Misaki RoysterUnited KingdomOnyama Limba QUALIFIED
Arvin AlbaresJapanXuxue Feng NEGOTIATION
Cody SaylorsFranceElwin Sharvill NEGOTIATION
Juan WieserFranceBernardo Dominic UNQUALIFIED
Tony FollerUnited KingdomBernardo Dominic NEGOTIATION
Arvin AlbaresCanadaAmy Elsner QUALIFIED
Julie StensethJapanBernardo Dominic NEW
Deepesh ChuiAustraliaStephen Shaw NEGOTIATION
Izzy GarufiArgentinaAsiya Javayant RENEWAL
Stacey MacleadItalyAnna Fali PROPOSAL
Ivar PaprockiSpainIoni Bowcher PROPOSAL
James ButtFranceAsiya Javayant QUALIFIED
Tony FollerSpainAmy Elsner NEGOTIATION
Nicolas IturbideArgentinaOnyama Limba PROPOSAL
Wickens NestleFranceIvan Magalhaes NEGOTIATION
Jefferson SchemmerGermanyStephen Shaw UNQUALIFIED
Aditya KuskoAustraliaIoni Bowcher PROPOSAL
Clifford RimAustraliaOnyama Limba PROPOSAL
Silvio SlusarskiAustraliaAnna Fali QUALIFIED
Jeanfrancois VenereRussiaOnyama Limba NEGOTIATION
Johnson SergiFranceIvan Magalhaes PROPOSAL
Jeanfrancois VenereBrazilAmy Elsner PROPOSAL
Sinclair WaycottGermanyAnna Fali QUALIFIED
Tony FollerFranceBernardo Dominic NEW
Chavez BriddickIndiaAmy Elsner RENEWAL
Kadeem FlosiCanadaAsiya Javayant UNQUALIFIED
Aika InouyeUnited KingdomIoni Bowcher NEW
Johnson SergiCanadaAmy Elsner NEW
Murillo MaletJapanXuxue Feng RENEWAL
Sinclair WaycottArgentinaXuxue Feng PROPOSAL
Alejandro PerinFranceAmy Elsner NEW
Clifford RimUnited KingdomAmy Elsner NEGOTIATION
Leja CaldareraJapanBernardo Dominic PROPOSAL
Munro FerenczAustraliaIoni Bowcher NEGOTIATION
Jefferson SchemmerRussiaAmy Elsner NEW
Izzy GarufiCanadaIoni Bowcher NEGOTIATION
Misaki RoysterIndiaAsiya Javayant NEW
Ricardo GauchoItalyBernardo Dominic RENEWAL
Horizontal
NameCountryRepresentativeStatus
Greenwood BologniaBrazilAnna Fali QUALIFIED
Nicolas IturbideGermanyStephen Shaw RENEWAL
Wickens NestleBrazilXuxue Feng NEW
Maisha RulapaughIndiaIoni Bowcher QUALIFIED
Ashley DoeFranceElwin Sharvill RENEWAL
Tony FollerGermanyBernardo Dominic NEW
Morrow RutaJapanIvan Magalhaes UNQUALIFIED
Silvio SlusarskiIndiaStephen Shaw QUALIFIED
Wickens NestleGermanyIvan Magalhaes QUALIFIED
Jefferson SchemmerSpainElwin Sharvill RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Juan WieserArgentina2025-10-03King, Christopher A Esq RENEWAL33Ioni Bowcher
1001Cody SaylorsGermany2025-09-20Commercial Press QUALIFIED9Elwin Sharvill
1002Stacey MacleadAustralia2025-09-20Feiner Bros PROPOSAL87Onyama Limba
1003Maisha RulapaughRussia2025-10-03Buckley Miller Wright NEW4Asiya Javayant
1004Isabel BowleyJapan2025-10-02Morlong Associates UNQUALIFIED6Asiya Javayant
1005Leon OldroydCanada2025-09-08Feiner Bros QUALIFIED43Ioni Bowcher
1006Mujtaba NickaRussia2025-10-06Feltz Printing Service UNQUALIFIED82Xuxue Feng
1007Silvio SlusarskiArgentina2025-09-12Printing Dimensions RENEWAL22Bernardo Dominic
1008Ivar PaprockiArgentina2025-09-17Printing Dimensions UNQUALIFIED10Asiya Javayant
1009Greenwood BologniaFrance2025-10-01Commercial Press UNQUALIFIED83Ivan Magalhaes
1010Ashley DoeIndia2025-09-19Truhlar And Truhlar Attys UNQUALIFIED67Amy Elsner
1011Arvin AlbaresSpain2025-09-08Dorl, James J Esq PROPOSAL78Onyama Limba
1012Aika InouyeIndia2025-09-28Truhlar And Truhlar Attys RENEWAL87Ioni Bowcher
1013Sinclair WaycottCanada2025-10-01Benton, John B Jr NEGOTIATION98Amy Elsner
1014Darci PoquetteIndia2025-09-14Chapman, Ross E Esq PROPOSAL95Asiya Javayant
1015Faith GillianAustralia2025-09-10Chanay, Jeffrey A Esq NEW46Ivan Magalhaes
1016Claire TollnerAustralia2025-09-25Chapman, Ross E Esq NEGOTIATION51Ivan Magalhaes
1017Adams MorascaItaly2025-09-30Benton, John B Jr NEW49Ivan Magalhaes
1018Francesco ShinkoSpain2025-10-05Printing Dimensions UNQUALIFIED96Stephen Shaw
1019Izzy GarufiBrazil2025-10-05Commercial Press NEGOTIATION99Bernardo Dominic
1020Tony FollerFrance2025-09-28Chanay, Jeffrey A Esq QUALIFIED5Elwin Sharvill
1021Mujtaba NickaGermany2025-10-06Rangoni Of Florence RENEWAL96Ivan Magalhaes
1022Morrow RutaItaly2025-09-16Chemel, James L Cpa PROPOSAL99Asiya Javayant
1023Leon OldroydRussia2025-09-12Benton, John B Jr RENEWAL94Bernardo Dominic
1024Ricardo GauchoCanada2025-10-01Chemel, James L Cpa RENEWAL32Anna Fali
1025Greenwood BologniaBrazil2025-09-24Benton, John B Jr RENEWAL16Onyama Limba
1026Faith GillianUnited Kingdom2025-09-30Feltz Printing Service NEW12Elwin Sharvill
1027Antonio CaudyJapan2025-10-04Chapman, Ross E Esq PROPOSAL54Amy Elsner
1028Adams MorascaItaly2025-09-19Dorl, James J Esq RENEWAL95Stephen Shaw
1029Mujtaba NickaCanada2025-09-21Feltz Printing Service RENEWAL59Anna Fali
1030Greenwood BologniaGermany2025-09-16Buckley Miller Wright NEW16Xuxue Feng
1031Arvin AlbaresItaly2025-10-03Benton, John B Jr RENEWAL86Elwin Sharvill
1032Adams MorascaItaly2025-10-04King, Christopher A Esq RENEWAL26Stephen Shaw
1033Salvatore StockhamIndia2025-09-20Rousseaux, Michael Esq PROPOSAL50Xuxue Feng
1034David DarakjyRussia2025-10-05Feiner Bros NEW74Elwin Sharvill
1035Sinclair WaycottUnited Kingdom2025-09-27Printing Dimensions NEW27Onyama Limba
1036Jeanfrancois VenereGermany2025-09-20King, Christopher A Esq RENEWAL5Stephen Shaw
1037Ricardo GauchoBrazil2025-09-26Benton, John B Jr QUALIFIED51Elwin Sharvill
1038Sinclair WaycottArgentina2025-10-05Truhlar And Truhlar Attys NEW33Anna Fali
1039Cody SaylorsIndia2025-09-07Feiner Bros PROPOSAL45Elwin Sharvill
1040Wickens NestleUnited Kingdom2025-09-21Dorl, James J Esq NEGOTIATION19Amy Elsner
1041Alejandro PerinFrance2025-09-16Commercial Press UNQUALIFIED2Asiya Javayant
1042Aika InouyeJapan2025-10-01Morlong Associates NEGOTIATION88Ivan Magalhaes
1043Leon OldroydRussia2025-10-06Feltz Printing Service UNQUALIFIED75Asiya Javayant
1044Claire TollnerIndia2025-09-30Feltz Printing Service UNQUALIFIED48Asiya Javayant
1045Tony FollerItaly2025-10-01Commercial Press RENEWAL69Onyama Limba
1046Octavia MaletIndia2025-10-04Rangoni Of Florence PROPOSAL77Ioni Bowcher
1047Greenwood BologniaArgentina2025-10-02Chapman, Ross E Esq RENEWAL86Elwin Sharvill
1048Francesco ShinkoSpain2025-09-27Rangoni Of Florence QUALIFIED15Ioni Bowcher
1049Morrow RutaUnited Kingdom2025-10-02Chanay, Jeffrey A Esq RENEWAL28Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Nicolas IturbideRussiaIvan Magalhaes NEGOTIATION
James ButtFranceOnyama Limba QUALIFIED
Arvin AlbaresGermanyAsiya Javayant NEGOTIATION
Leja CaldareraRussiaElwin Sharvill NEW
James ButtItalyElwin Sharvill PROPOSAL
Munro FerenczGermanyAsiya Javayant NEGOTIATION
Julie StensethGermanyAsiya Javayant RENEWAL
Emily WhobreySpainBernardo Dominic QUALIFIED
Munro FerenczIndiaOnyama Limba PROPOSAL
Juan WieserCanadaAnna Fali QUALIFIED
Faith GillianAustraliaElwin Sharvill RENEWAL
Salvatore StockhamJapanAmy Elsner NEW
Chavez BriddickGermanyElwin Sharvill QUALIFIED
Nicolas IturbideItalyBernardo Dominic RENEWAL
Salvatore StockhamCanadaStephen Shaw RENEWAL
Kadeem FlosiIndiaXuxue Feng QUALIFIED
Leja CaldareraArgentinaBernardo Dominic NEW
Arvin AlbaresGermanyIoni Bowcher NEGOTIATION
Cody SaylorsAustraliaElwin Sharvill RENEWAL
Jeanfrancois VenereSpainOnyama Limba QUALIFIED
Salvatore StockhamJapanXuxue Feng PROPOSAL
Adams MorascaBrazilAnna Fali NEW
Maisha RulapaughGermanyAmy Elsner UNQUALIFIED
Darci PoquetteRussiaStephen Shaw UNQUALIFIED
Darci PoquetteGermanyAsiya Javayant PROPOSAL
Morrow RutaBrazilAmy Elsner PROPOSAL
Munro FerenczSpainBernardo Dominic PROPOSAL
James ButtGermanyStephen Shaw RENEWAL
Claire TollnerCanadaOnyama Limba PROPOSAL
Mayumi KolmetzGermanyOnyama Limba QUALIFIED
Misaki RoysterArgentinaAnna Fali QUALIFIED
Darci PoquetteUnited KingdomIoni Bowcher NEW
Aika InouyeArgentinaIoni Bowcher NEGOTIATION
Rodrigues CampainCanadaAsiya Javayant RENEWAL
Jeanfrancois VenereCanadaAsiya Javayant UNQUALIFIED
Ivar PaprockiUnited KingdomXuxue Feng RENEWAL
Darci PoquetteRussiaIvan Magalhaes NEGOTIATION
James ButtIndiaXuxue Feng RENEWAL
Kadeem FlosiBrazilBernardo Dominic NEGOTIATION
Alejandro PerinJapanAmy Elsner NEW
Aditya KuskoAustraliaElwin Sharvill QUALIFIED
Jefferson SchemmerCanadaIoni Bowcher RENEWAL
Isabel BowleyGermanyAmy Elsner UNQUALIFIED
Darci PoquetteArgentinaAmy Elsner NEGOTIATION
Maria MarrierCanadaAsiya Javayant RENEWAL
Morrow RutaCanadaBernardo Dominic NEGOTIATION
Stacey MacleadAustraliaAsiya Javayant QUALIFIED
Francesco ShinkoBrazilOnyama Limba NEGOTIATION
Faith GillianArgentinaIvan Magalhaes NEW
Juan WieserArgentinaIoni Bowcher PROPOSAL
Frozen Columns
Name
Silvio Slusarski
Nicolas Iturbide
Rodrigues Campain
Antonio Caudy
Maisha Rulapaugh
Francesco Shinko
Kadeem Flosi
Claire Tollner
Aruna Figeroa
Smith Glick
Clifford Rim
Clifford Rim
Sinclair Waycott
Wickens Nestle
Jennifer Amigon
Kaitlin Ostrosky
Silvio Slusarski
Izzy Garufi
Alejandro Perin
Jefferson Schemmer
Ivar Paprocki
Isabel Bowley
Francesco Shinko
Darci Poquette
James Butt
Maisha Rulapaugh
Alejandro Perin
Smith Glick
Emily Whobrey
Sinclair Waycott
Maisha Rulapaugh
James Butt
Kadeem Flosi
Smith Glick
Alejandro Perin
Julie Stenseth
Jones Vocelka
Greenwood Bolognia
Emily Whobrey
Emily Whobrey
Adams Morasca
Leon Oldroyd
Cody Saylors
Isabel Bowley
Jeanfrancois Venere
James Butt
Francesco Shinko
Chavez Briddick
Sinclair Waycott
Kadeem Flosi
IdCountryDate
1000France2025-09-25
1001Argentina2025-09-26
1002France2025-09-10
1003Australia2025-09-19
1004Brazil2025-10-04
1005Japan2025-09-24
1006Argentina2025-09-15
1007Australia2025-09-27
1008India2025-09-10
1009India2025-09-13
1010India2025-10-01
1011Spain2025-09-19
1012United Kingdom2025-09-14
1013United Kingdom2025-09-19
1014Germany2025-09-11
1015Spain2025-09-15
1016Australia2025-10-05
1017India2025-09-25
1018India2025-10-02
1019Germany2025-09-10
1020Japan2025-10-01
1021Brazil2025-09-09
1022Australia2025-09-23
1023Spain2025-09-13
1024France2025-09-09
1025Germany2025-09-07
1026Germany2025-09-11
1027Italy2025-09-30
1028Russia2025-10-01
1029India2025-09-17
1030India2025-10-05
1031United Kingdom2025-09-07
1032Italy2025-09-23
1033Italy2025-09-17
1034Germany2025-10-06
1035Argentina2025-09-12
1036India2025-09-14
1037Germany2025-09-25
1038United Kingdom2025-09-25
1039Germany2025-09-17
1040Italy2025-09-29
1041Germany2025-09-11
1042Spain2025-09-29
1043Brazil2025-09-18
1044Brazil2025-10-04
1045Spain2025-09-07
1046Australia2025-09-19
1047United Kingdom2025-09-29
1048India2025-09-25
1049Spain2025-10-06

On-Demand Data

NameIdCountryDate
Mayumi Kolmetz1000Italy2025-09-07
Maria Marrier1001Germany2025-09-17
Francesco Shinko1002Japan2025-10-05
Aika Inouye1003Italy2025-09-18
Greenwood Bolognia1004Russia2025-10-06
Faith Gillian1005Russia2025-09-24
Jennifer Amigon1006France2025-09-14
Stacey Maclead1007India2025-09-22
Silvio Slusarski1008Canada2025-10-05
Sinclair Waycott1009Australia2025-09-18
Jefferson Schemmer1010Germany2025-09-16
Greenwood Bolognia1011France2025-10-03
Adams Morasca1012Canada2025-10-06
Antonio Caudy1013Japan2025-09-23
Jennifer Amigon1014Japan2025-09-17
Emily Whobrey1015Japan2025-09-23
Alejandro Perin1016Argentina2025-09-16
Darci Poquette1017Spain2025-09-11
Kaitlin Ostrosky1018Argentina2025-09-20
Maria Marrier1019Germany2025-09-08
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Maisha RulapaughGermanyAsiya Javayant PROPOSAL
Emily WhobreyGermanyElwin Sharvill NEW
Salvatore StockhamFranceAnna Fali NEGOTIATION
Jennifer AmigonGermanyIoni Bowcher NEW
Juan WieserSpainIoni Bowcher PROPOSAL
Chavez BriddickAustraliaAsiya Javayant QUALIFIED
Emily WhobreyFranceBernardo Dominic QUALIFIED
Octavia MaletItalyIvan Magalhaes UNQUALIFIED
Stacey MacleadUnited KingdomIoni Bowcher QUALIFIED
Izzy GarufiJapanStephen Shaw PROPOSAL
Munro FerenczRussiaIoni Bowcher RENEWAL
Costa DilliardAustraliaXuxue Feng NEGOTIATION
Claire TollnerFranceAsiya Javayant UNQUALIFIED
Ivar PaprockiBrazilBernardo Dominic NEGOTIATION
Greenwood BologniaGermanyAsiya Javayant NEGOTIATION
Rodrigues CampainIndiaOnyama Limba NEW
Aruna FigeroaSpainAmy Elsner UNQUALIFIED
Leja CaldareraRussiaOnyama Limba QUALIFIED
Salvatore StockhamAustraliaIvan Magalhaes NEW
Emily WhobreyRussiaAmy Elsner UNQUALIFIED
Julie StensethRussiaAsiya Javayant NEGOTIATION
Ivar PaprockiBrazilAmy Elsner QUALIFIED
Isabel BowleySpainIvan Magalhaes PROPOSAL
Ricardo GauchoGermanyBernardo Dominic PROPOSAL
Isabel BowleyArgentinaOnyama Limba RENEWAL
Leja CaldareraBrazilIvan Magalhaes QUALIFIED
Greenwood BologniaArgentinaOnyama Limba QUALIFIED
Antonio CaudyGermanyXuxue Feng PROPOSAL
Mayumi KolmetzBrazilAsiya Javayant RENEWAL
Arvin AlbaresJapanAsiya Javayant NEW
Cody SaylorsAustraliaIoni Bowcher NEGOTIATION
Aruna FigeroaItalyIvan Magalhaes QUALIFIED
David DarakjyJapanIoni Bowcher NEGOTIATION
Jefferson SchemmerAustraliaAsiya Javayant UNQUALIFIED
Mayumi KolmetzArgentinaAmy Elsner PROPOSAL
Francesco ShinkoCanadaStephen Shaw NEW
Tony FollerRussiaIvan Magalhaes PROPOSAL
Faith GillianItalyBernardo Dominic NEW
Munro FerenczIndiaAmy Elsner PROPOSAL
Morrow RutaSpainBernardo Dominic 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.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>