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
Cody SaylorsAustraliaAmy Elsner QUALIFIED
Silvio SlusarskiJapanOnyama Limba UNQUALIFIED
Murillo MaletCanadaStephen Shaw NEW
Kaitlin OstroskyArgentinaStephen Shaw NEW
Adams MorascaGermanyXuxue Feng NEGOTIATION
Morrow RutaArgentinaElwin Sharvill NEW
Jeanfrancois VenereRussiaAnna Fali RENEWAL
Sinclair WaycottArgentinaIoni Bowcher UNQUALIFIED
Misaki RoysterBrazilBernardo Dominic NEW
Salvatore StockhamRussiaStephen Shaw QUALIFIED
Murillo MaletGermanyElwin Sharvill NEGOTIATION
Misaki RoysterItalyAsiya Javayant NEW
Deepesh ChuiFranceAsiya Javayant NEGOTIATION
Mayumi KolmetzArgentinaBernardo Dominic QUALIFIED
Chavez BriddickBrazilAnna Fali NEW
Francesco ShinkoFranceStephen Shaw NEGOTIATION
Ashley DoeRussiaIvan Magalhaes PROPOSAL
Antonio CaudyFranceIvan Magalhaes PROPOSAL
Faith GillianCanadaBernardo Dominic PROPOSAL
Tony FollerCanadaAmy Elsner PROPOSAL
Clifford RimArgentinaAmy Elsner NEW
Chavez BriddickIndiaIoni Bowcher UNQUALIFIED
Johnson SergiCanadaBernardo Dominic PROPOSAL
Emily WhobreyRussiaAmy Elsner RENEWAL
Nicolas IturbideUnited KingdomStephen Shaw PROPOSAL
Leja CaldareraRussiaIoni Bowcher QUALIFIED
Julie StensethFranceIvan Magalhaes UNQUALIFIED
Ricardo GauchoAustraliaAsiya Javayant QUALIFIED
Maisha RulapaughSpainElwin Sharvill QUALIFIED
Kadeem FlosiRussiaAnna Fali RENEWAL
Ivar PaprockiFranceIoni Bowcher QUALIFIED
Darci PoquetteSpainAsiya Javayant PROPOSAL
Stacey MacleadCanadaIoni Bowcher PROPOSAL
Wickens NestleRussiaAsiya Javayant PROPOSAL
Stacey MacleadFranceXuxue Feng NEGOTIATION
Claire TollnerBrazilIoni Bowcher RENEWAL
Kaitlin OstroskyCanadaXuxue Feng NEW
Ashley DoeItalyIoni Bowcher QUALIFIED
Johnson SergiItalyAsiya Javayant QUALIFIED
Munro FerenczArgentinaOnyama Limba NEGOTIATION
Tony FollerRussiaIvan Magalhaes RENEWAL
Faith GillianItalyStephen Shaw NEW
Maisha RulapaughItalyElwin Sharvill UNQUALIFIED
Morrow RutaRussiaStephen Shaw NEGOTIATION
Salvatore StockhamBrazilStephen Shaw UNQUALIFIED
Izzy GarufiBrazilIoni Bowcher UNQUALIFIED
Jennifer AmigonItalyStephen Shaw RENEWAL
Wickens NestleBrazilStephen Shaw UNQUALIFIED
Julie StensethBrazilAsiya Javayant UNQUALIFIED
Francesco ShinkoAustraliaAnna Fali PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Claire TollnerGermanyIvan Magalhaes PROPOSAL
Claire TollnerIndiaAnna Fali UNQUALIFIED
Johnson SergiFranceAmy Elsner UNQUALIFIED
Kaitlin OstroskyGermanyElwin Sharvill NEGOTIATION
Kaitlin OstroskyBrazilIoni Bowcher PROPOSAL
Nicolas IturbideBrazilAmy Elsner PROPOSAL
Deepesh ChuiGermanyBernardo Dominic RENEWAL
Cody SaylorsJapanElwin Sharvill QUALIFIED
Arvin AlbaresAustraliaStephen Shaw RENEWAL
James ButtUnited KingdomAnna Fali NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Smith GlickItaly2026-05-26Truhlar And Truhlar Attys NEW31Xuxue Feng
1001Ivar PaprockiAustralia2026-05-18Feltz Printing Service PROPOSAL33Ioni Bowcher
1002Kadeem FlosiArgentina2026-05-13Morlong Associates QUALIFIED22Ivan Magalhaes
1003Mayumi KolmetzRussia2026-05-20Feltz Printing Service QUALIFIED69Anna Fali
1004Murillo MaletIndia2026-05-12King, Christopher A Esq NEGOTIATION55Bernardo Dominic
1005Izzy GarufiRussia2026-05-16Buckley Miller Wright UNQUALIFIED25Elwin Sharvill
1006Darci PoquetteJapan2026-05-29Buckley Miller Wright UNQUALIFIED32Xuxue Feng
1007Cody SaylorsIndia2026-05-23Chemel, James L Cpa RENEWAL21Anna Fali
1008Wickens NestleJapan2026-05-19Benton, John B Jr QUALIFIED67Bernardo Dominic
1009Rodrigues CampainIndia2026-05-18King, Christopher A Esq QUALIFIED75Ioni Bowcher
1010Maria MarrierIndia2026-05-16Truhlar And Truhlar Attys NEW56Elwin Sharvill
1011Adams MorascaItaly2026-06-05Printing Dimensions PROPOSAL83Onyama Limba
1012Julie StensethArgentina2026-06-08Morlong Associates NEW18Ioni Bowcher
1013Sinclair WaycottGermany2026-05-12Commercial Press RENEWAL7Elwin Sharvill
1014James ButtCanada2026-05-17King, Christopher A Esq NEGOTIATION27Amy Elsner
1015Leon OldroydRussia2026-06-08Buckley Miller Wright QUALIFIED61Asiya Javayant
1016Leon OldroydArgentina2026-05-17Benton, John B Jr RENEWAL98Elwin Sharvill
1017Munro FerenczJapan2026-05-15Morlong Associates PROPOSAL14Xuxue Feng
1018Johnson SergiRussia2026-06-01Rangoni Of Florence QUALIFIED44Onyama Limba
1019James ButtIndia2026-05-15King, Christopher A Esq UNQUALIFIED55Asiya Javayant
1020Chavez BriddickBrazil2026-05-25Rousseaux, Michael Esq QUALIFIED46Stephen Shaw
1021Maisha RulapaughGermany2026-06-03Morlong Associates PROPOSAL52Amy Elsner
1022Mujtaba NickaBrazil2026-06-03Rousseaux, Michael Esq NEW25Ivan Magalhaes
1023James ButtArgentina2026-06-03Chanay, Jeffrey A Esq NEGOTIATION95Ioni Bowcher
1024Izzy GarufiUnited Kingdom2026-06-04Chemel, James L Cpa NEW15Onyama Limba
1025Aruna FigeroaIndia2026-05-25Buckley Miller Wright NEGOTIATION23Asiya Javayant
1026David DarakjyItaly2026-05-18Feiner Bros NEW8Bernardo Dominic
1027Ivar PaprockiUnited Kingdom2026-05-12Feltz Printing Service NEW31Stephen Shaw
1028Arvin AlbaresIndia2026-05-13Benton, John B Jr UNQUALIFIED1Onyama Limba
1029Costa DilliardAustralia2026-06-06Chemel, James L Cpa QUALIFIED17Ivan Magalhaes
1030David DarakjySpain2026-06-05Benton, John B Jr QUALIFIED41Elwin Sharvill
1031Aditya KuskoGermany2026-05-25Commercial Press RENEWAL87Anna Fali
1032Clifford RimGermany2026-05-17Truhlar And Truhlar Attys UNQUALIFIED70Amy Elsner
1033Johnson SergiSpain2026-05-15Rangoni Of Florence UNQUALIFIED31Elwin Sharvill
1034Deepesh ChuiArgentina2026-05-25Benton, John B Jr UNQUALIFIED65Bernardo Dominic
1035Arvin AlbaresRussia2026-05-13Chemel, James L Cpa RENEWAL8Elwin Sharvill
1036Nicolas IturbideSpain2026-05-11Chanay, Jeffrey A Esq PROPOSAL48Ivan Magalhaes
1037Greenwood BologniaAustralia2026-05-30King, Christopher A Esq NEGOTIATION68Stephen Shaw
1038Clifford RimCanada2026-06-08Truhlar And Truhlar Attys RENEWAL85Anna Fali
1039Greenwood BologniaItaly2026-06-08Benton, John B Jr RENEWAL18Stephen Shaw
1040Isabel BowleyIndia2026-05-18Dorl, James J Esq PROPOSAL57Onyama Limba
1041Aruna FigeroaBrazil2026-05-28Buckley Miller Wright RENEWAL93Onyama Limba
1042Darci PoquetteGermany2026-05-25Benton, John B Jr RENEWAL57Onyama Limba
1043Salvatore StockhamUnited Kingdom2026-05-15Morlong Associates NEW2Stephen Shaw
1044Ashley DoeAustralia2026-05-24Buckley Miller Wright UNQUALIFIED45Ivan Magalhaes
1045Chavez BriddickSpain2026-05-19Truhlar And Truhlar Attys UNQUALIFIED72Onyama Limba
1046Ivar PaprockiJapan2026-05-17Printing Dimensions UNQUALIFIED33Xuxue Feng
1047Ivar PaprockiItaly2026-05-14Commercial Press PROPOSAL42Stephen Shaw
1048Kadeem FlosiGermany2026-06-04Feltz Printing Service UNQUALIFIED62Bernardo Dominic
1049Silvio SlusarskiUnited Kingdom2026-05-19Chanay, Jeffrey A Esq NEW60Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
James ButtBrazilAmy Elsner UNQUALIFIED
Tony FollerArgentinaOnyama Limba PROPOSAL
Aruna FigeroaGermanyAsiya Javayant QUALIFIED
Smith GlickBrazilBernardo Dominic PROPOSAL
Isabel BowleyAustraliaAsiya Javayant UNQUALIFIED
Francesco ShinkoGermanyAsiya Javayant PROPOSAL
Aditya KuskoItalyAnna Fali QUALIFIED
Munro FerenczCanadaXuxue Feng PROPOSAL
Ricardo GauchoUnited KingdomIvan Magalhaes UNQUALIFIED
Adams MorascaCanadaBernardo Dominic NEW
Maria MarrierUnited KingdomXuxue Feng UNQUALIFIED
Mayumi KolmetzJapanBernardo Dominic NEGOTIATION
Salvatore StockhamUnited KingdomBernardo Dominic QUALIFIED
Adams MorascaAustraliaOnyama Limba NEW
Francesco ShinkoGermanyOnyama Limba PROPOSAL
James ButtCanadaElwin Sharvill NEW
Wickens NestleAustraliaStephen Shaw NEW
Aika InouyeAustraliaIvan Magalhaes QUALIFIED
James ButtArgentinaAmy Elsner PROPOSAL
Silvio SlusarskiArgentinaXuxue Feng QUALIFIED
Izzy GarufiItalyElwin Sharvill NEW
Maisha RulapaughItalyXuxue Feng PROPOSAL
Francesco ShinkoSpainAnna Fali NEW
Ricardo GauchoJapanBernardo Dominic NEW
Alejandro PerinIndiaIoni Bowcher RENEWAL
Darci PoquetteArgentinaElwin Sharvill NEW
Murillo MaletBrazilBernardo Dominic RENEWAL
Tony FollerJapanAmy Elsner NEW
Clifford RimRussiaOnyama Limba NEW
Ricardo GauchoGermanyAmy Elsner PROPOSAL
Arvin AlbaresGermanyElwin Sharvill PROPOSAL
Johnson SergiCanadaBernardo Dominic NEGOTIATION
Octavia MaletAustraliaOnyama Limba NEGOTIATION
Francesco ShinkoFranceAnna Fali RENEWAL
Ricardo GauchoArgentinaAmy Elsner UNQUALIFIED
Jennifer AmigonCanadaStephen Shaw QUALIFIED
Ivar PaprockiFranceElwin Sharvill QUALIFIED
David DarakjyArgentinaAsiya Javayant PROPOSAL
Aika InouyeSpainAnna Fali QUALIFIED
Alejandro PerinIndiaXuxue Feng UNQUALIFIED
Kadeem FlosiUnited KingdomXuxue Feng QUALIFIED
Aruna FigeroaFranceBernardo Dominic QUALIFIED
Greenwood BologniaJapanIvan Magalhaes RENEWAL
Jeanfrancois VenereAustraliaXuxue Feng NEW
Jennifer AmigonAustraliaAnna Fali RENEWAL
Salvatore StockhamJapanAmy Elsner RENEWAL
Clifford RimIndiaBernardo Dominic PROPOSAL
Aika InouyeJapanIvan Magalhaes QUALIFIED
Aruna FigeroaArgentinaAmy Elsner QUALIFIED
Julie StensethItalyBernardo Dominic NEW
Frozen Columns
Name
Ivar Paprocki
Juan Wieser
Leon Oldroyd
Claire Tollner
Stacey Maclead
Leon Oldroyd
David Darakjy
Misaki Royster
David Darakjy
Adams Morasca
Chavez Briddick
Juan Wieser
Ricardo Gaucho
Claire Tollner
Izzy Garufi
Ivar Paprocki
Morrow Ruta
Salvatore Stockham
Jeanfrancois Venere
Darci Poquette
Ashley Doe
Jeanfrancois Venere
Tony Foller
Sinclair Waycott
Darci Poquette
Aditya Kusko
Cody Saylors
Jennifer Amigon
Johnson Sergi
Clifford Rim
Jefferson Schemmer
Ivar Paprocki
Murillo Malet
Tony Foller
Nicolas Iturbide
Jones Vocelka
Ivar Paprocki
Leja Caldarera
Maria Marrier
Maisha Rulapaugh
Darci Poquette
Deepesh Chui
Greenwood Bolognia
Izzy Garufi
Francesco Shinko
Faith Gillian
Leja Caldarera
Julie Stenseth
Johnson Sergi
Arvin Albares
IdCountryDate
1000Spain2026-06-04
1001Japan2026-05-12
1002Russia2026-06-03
1003Russia2026-05-17
1004Japan2026-05-31
1005Argentina2026-05-15
1006Australia2026-06-04
1007United Kingdom2026-05-19
1008Argentina2026-06-06
1009France2026-05-28
1010United Kingdom2026-05-13
1011Spain2026-06-05
1012Germany2026-05-13
1013United Kingdom2026-06-06
1014Australia2026-05-26
1015Italy2026-05-13
1016Spain2026-06-06
1017Argentina2026-05-24
1018Brazil2026-05-15
1019Spain2026-05-14
1020Canada2026-06-06
1021Australia2026-06-04
1022Russia2026-05-31
1023Germany2026-06-08
1024India2026-05-30
1025Germany2026-06-02
1026Italy2026-06-09
1027Canada2026-05-27
1028Russia2026-05-29
1029Germany2026-05-26
1030Argentina2026-05-26
1031Canada2026-05-31
1032Germany2026-06-02
1033Germany2026-05-13
1034Australia2026-06-05
1035Argentina2026-05-23
1036Russia2026-05-14
1037Italy2026-05-15
1038Germany2026-06-04
1039Brazil2026-05-15
1040France2026-06-01
1041Brazil2026-05-31
1042Australia2026-05-25
1043Russia2026-06-04
1044Russia2026-05-17
1045United Kingdom2026-06-03
1046Canada2026-05-18
1047France2026-05-22
1048Brazil2026-05-23
1049Brazil2026-06-07

On-Demand Data

NameIdCountryDate
Munro Ferencz1000Italy2026-05-23
Morrow Ruta1001Italy2026-06-09
Leon Oldroyd1002Russia2026-05-20
Sinclair Waycott1003Russia2026-05-19
Nicolas Iturbide1004Canada2026-05-14
Rodrigues Campain1005United Kingdom2026-06-06
Isabel Bowley1006Australia2026-05-25
James Butt1007France2026-05-19
Misaki Royster1008Italy2026-05-14
Johnson Sergi1009Argentina2026-05-16
Adams Morasca1010France2026-06-09
Greenwood Bolognia1011Russia2026-06-06
David Darakjy1012Spain2026-06-09
Jennifer Amigon1013Australia2026-06-09
Greenwood Bolognia1014Brazil2026-05-26
Stacey Maclead1015Argentina2026-05-21
Murillo Malet1016France2026-06-01
Maria Marrier1017Germany2026-05-30
Aika Inouye1018United Kingdom2026-06-06
Francesco Shinko1019Brazil2026-05-21
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Faith GillianBrazilStephen Shaw QUALIFIED
Isabel BowleyFranceIoni Bowcher NEW
Silvio SlusarskiSpainElwin Sharvill QUALIFIED
Munro FerenczIndiaIvan Magalhaes NEW
Morrow RutaFranceOnyama Limba UNQUALIFIED
Leon OldroydRussiaXuxue Feng NEW
Ricardo GauchoSpainXuxue Feng RENEWAL
David DarakjyIndiaXuxue Feng NEGOTIATION
Leon OldroydArgentinaAnna Fali RENEWAL
Mayumi KolmetzFranceAnna Fali RENEWAL
Deepesh ChuiIndiaElwin Sharvill NEW
Kadeem FlosiBrazilIvan Magalhaes UNQUALIFIED
Morrow RutaAustraliaXuxue Feng UNQUALIFIED
Misaki RoysterUnited KingdomAsiya Javayant QUALIFIED
Salvatore StockhamSpainAmy Elsner PROPOSAL
Faith GillianSpainIvan Magalhaes RENEWAL
Emily WhobreyFranceBernardo Dominic NEW
Clifford RimBrazilElwin Sharvill QUALIFIED
Stacey MacleadIndiaXuxue Feng NEW
Nicolas IturbideArgentinaIvan Magalhaes UNQUALIFIED
Arvin AlbaresBrazilAnna Fali RENEWAL
Munro FerenczIndiaIoni Bowcher NEGOTIATION
Francesco ShinkoItalyIoni Bowcher NEGOTIATION
Julie StensethCanadaAmy Elsner NEW
Adams MorascaGermanyAmy Elsner NEGOTIATION
Sinclair WaycottUnited KingdomAmy Elsner NEW
Leon OldroydRussiaElwin Sharvill RENEWAL
Salvatore StockhamSpainOnyama Limba QUALIFIED
Silvio SlusarskiGermanyBernardo Dominic NEGOTIATION
Mayumi KolmetzRussiaBernardo Dominic PROPOSAL
Tony FollerSpainOnyama Limba UNQUALIFIED
Kadeem FlosiSpainAsiya Javayant QUALIFIED
Maisha RulapaughUnited KingdomBernardo Dominic NEGOTIATION
Costa DilliardFranceOnyama Limba NEGOTIATION
Francesco ShinkoSpainElwin Sharvill RENEWAL
Clifford RimGermanyOnyama Limba PROPOSAL
Ashley DoeSpainAmy Elsner NEGOTIATION
Jefferson SchemmerFranceIoni Bowcher NEGOTIATION
Aditya KuskoFranceBernardo Dominic UNQUALIFIED
Tony FollerBrazilAmy Elsner 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>