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
Tony FollerSpainIvan Magalhaes UNQUALIFIED
Cody SaylorsArgentinaOnyama Limba NEGOTIATION
Ivar PaprockiBrazilIvan Magalhaes RENEWAL
Silvio SlusarskiArgentinaBernardo Dominic QUALIFIED
Octavia MaletCanadaIvan Magalhaes NEW
Misaki RoysterItalyAnna Fali RENEWAL
Octavia MaletItalyElwin Sharvill NEW
Munro FerenczArgentinaAsiya Javayant RENEWAL
Jefferson SchemmerAustraliaAmy Elsner QUALIFIED
Antonio CaudyJapanAnna Fali PROPOSAL
Maisha RulapaughRussiaStephen Shaw NEGOTIATION
Jefferson SchemmerAustraliaIoni Bowcher NEW
Aruna FigeroaCanadaIoni Bowcher RENEWAL
Maria MarrierAustraliaAnna Fali PROPOSAL
Johnson SergiUnited KingdomAmy Elsner NEGOTIATION
Stacey MacleadIndiaAsiya Javayant PROPOSAL
Juan WieserCanadaOnyama Limba NEW
David DarakjyItalyAsiya Javayant NEW
Misaki RoysterArgentinaXuxue Feng QUALIFIED
James ButtCanadaAnna Fali PROPOSAL
Aruna FigeroaAustraliaOnyama Limba NEGOTIATION
Tony FollerRussiaOnyama Limba UNQUALIFIED
Kadeem FlosiSpainAnna Fali RENEWAL
David DarakjyBrazilElwin Sharvill RENEWAL
Chavez BriddickArgentinaStephen Shaw RENEWAL
Silvio SlusarskiUnited KingdomAmy Elsner QUALIFIED
Alejandro PerinJapanElwin Sharvill RENEWAL
Smith GlickCanadaIoni Bowcher PROPOSAL
Mayumi KolmetzRussiaBernardo Dominic PROPOSAL
Isabel BowleyJapanAmy Elsner QUALIFIED
Leja CaldareraFranceIoni Bowcher QUALIFIED
Stacey MacleadIndiaIoni Bowcher UNQUALIFIED
Antonio CaudyGermanyAsiya Javayant NEW
Jeanfrancois VenereArgentinaAmy Elsner UNQUALIFIED
Emily WhobreyRussiaOnyama Limba NEW
Silvio SlusarskiRussiaXuxue Feng UNQUALIFIED
Kadeem FlosiArgentinaXuxue Feng NEGOTIATION
Maria MarrierGermanyStephen Shaw NEGOTIATION
Ivar PaprockiCanadaBernardo Dominic RENEWAL
Jones VocelkaUnited KingdomAsiya Javayant QUALIFIED
Jennifer AmigonCanadaElwin Sharvill QUALIFIED
Sinclair WaycottGermanyXuxue Feng QUALIFIED
Misaki RoysterAustraliaStephen Shaw RENEWAL
Maria MarrierRussiaBernardo Dominic NEGOTIATION
Julie StensethGermanyAnna Fali UNQUALIFIED
Kadeem FlosiIndiaOnyama Limba NEW
Chavez BriddickRussiaAsiya Javayant NEW
Jefferson SchemmerAustraliaXuxue Feng RENEWAL
Jones VocelkaIndiaOnyama Limba QUALIFIED
Francesco ShinkoJapanAmy Elsner PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Kadeem FlosiBrazilAsiya Javayant PROPOSAL
Smith GlickFranceAsiya Javayant RENEWAL
Salvatore StockhamUnited KingdomXuxue Feng NEW
Alejandro PerinItalyXuxue Feng PROPOSAL
Julie StensethFranceOnyama Limba NEGOTIATION
Kaitlin OstroskyCanadaAnna Fali PROPOSAL
Salvatore StockhamUnited KingdomAnna Fali QUALIFIED
Sinclair WaycottItalyXuxue Feng PROPOSAL
Jeanfrancois VenereSpainElwin Sharvill QUALIFIED
Faith GillianIndiaElwin Sharvill QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Octavia MaletItaly2026-04-17Chanay, Jeffrey A Esq NEGOTIATION1Asiya Javayant
1001Faith GillianItaly2026-05-01King, Christopher A Esq PROPOSAL51Bernardo Dominic
1002Jeanfrancois VenereItaly2026-04-25Buckley Miller Wright UNQUALIFIED57Onyama Limba
1003Salvatore StockhamRussia2026-04-28Rousseaux, Michael Esq QUALIFIED36Ivan Magalhaes
1004Ivar PaprockiBrazil2026-05-03Chanay, Jeffrey A Esq PROPOSAL91Elwin Sharvill
1005Francesco ShinkoRussia2026-04-29Feltz Printing Service NEW77Anna Fali
1006Adams MorascaIndia2026-04-29Benton, John B Jr NEW10Elwin Sharvill
1007Murillo MaletFrance2026-05-06Feltz Printing Service NEW19Onyama Limba
1008Julie StensethGermany2026-05-06Dorl, James J Esq PROPOSAL44Asiya Javayant
1009Emily WhobreyBrazil2026-05-03Commercial Press NEGOTIATION70Asiya Javayant
1010Cody SaylorsSpain2026-04-10Dorl, James J Esq RENEWAL56Xuxue Feng
1011Misaki RoysterItaly2026-04-10King, Christopher A Esq QUALIFIED61Xuxue Feng
1012Greenwood BologniaJapan2026-04-28Feltz Printing Service NEW77Anna Fali
1013Emily WhobreyIndia2026-05-06Buckley Miller Wright QUALIFIED45Asiya Javayant
1014Antonio CaudyRussia2026-04-07Buckley Miller Wright RENEWAL54Stephen Shaw
1015Costa DilliardIndia2026-04-08Printing Dimensions UNQUALIFIED63Elwin Sharvill
1016Kaitlin OstroskyAustralia2026-04-09Truhlar And Truhlar Attys NEW54Stephen Shaw
1017Smith GlickRussia2026-04-14Morlong Associates NEW24Elwin Sharvill
1018Jones VocelkaAustralia2026-04-20King, Christopher A Esq RENEWAL28Anna Fali
1019Claire TollnerGermany2026-04-27Feltz Printing Service PROPOSAL4Elwin Sharvill
1020Julie StensethCanada2026-04-23Morlong Associates QUALIFIED69Elwin Sharvill
1021Octavia MaletArgentina2026-04-17Printing Dimensions PROPOSAL57Bernardo Dominic
1022Tony FollerSpain2026-04-19Chemel, James L Cpa NEW19Stephen Shaw
1023Mayumi KolmetzJapan2026-05-06Rangoni Of Florence NEGOTIATION86Bernardo Dominic
1024Smith GlickGermany2026-05-04Printing Dimensions PROPOSAL71Anna Fali
1025Salvatore StockhamArgentina2026-04-14Morlong Associates PROPOSAL30Elwin Sharvill
1026Octavia MaletGermany2026-05-04Feltz Printing Service PROPOSAL76Ioni Bowcher
1027Greenwood BologniaItaly2026-04-17Benton, John B Jr RENEWAL38Xuxue Feng
1028Faith GillianGermany2026-04-18Feiner Bros RENEWAL3Anna Fali
1029Greenwood BologniaJapan2026-05-06King, Christopher A Esq NEGOTIATION25Bernardo Dominic
1030Costa DilliardUnited Kingdom2026-04-27Truhlar And Truhlar Attys NEW68Ivan Magalhaes
1031Emily WhobreyItaly2026-04-27Feiner Bros NEW5Stephen Shaw
1032Octavia MaletCanada2026-04-14Chemel, James L Cpa NEGOTIATION90Asiya Javayant
1033Wickens NestleItaly2026-04-16Chapman, Ross E Esq UNQUALIFIED47Bernardo Dominic
1034Salvatore StockhamJapan2026-04-25Truhlar And Truhlar Attys PROPOSAL41Bernardo Dominic
1035Isabel BowleyItaly2026-04-28Dorl, James J Esq NEW54Elwin Sharvill
1036Ashley DoeItaly2026-04-27Rousseaux, Michael Esq PROPOSAL49Amy Elsner
1037Kaitlin OstroskyRussia2026-05-03Printing Dimensions UNQUALIFIED65Ioni Bowcher
1038Rodrigues CampainAustralia2026-05-03Morlong Associates NEW64Bernardo Dominic
1039Salvatore StockhamBrazil2026-04-21Dorl, James J Esq QUALIFIED30Anna Fali
1040Cody SaylorsArgentina2026-04-17Rousseaux, Michael Esq UNQUALIFIED11Ioni Bowcher
1041Jennifer AmigonIndia2026-05-06Rangoni Of Florence UNQUALIFIED13Asiya Javayant
1042Kaitlin OstroskyBrazil2026-04-29Rousseaux, Michael Esq QUALIFIED60Xuxue Feng
1043Wickens NestleItaly2026-04-16Rangoni Of Florence RENEWAL27Elwin Sharvill
1044Ashley DoeUnited Kingdom2026-04-14Feiner Bros NEW30Anna Fali
1045Rodrigues CampainJapan2026-04-27Feltz Printing Service RENEWAL89Bernardo Dominic
1046Greenwood BologniaItaly2026-04-20Chapman, Ross E Esq PROPOSAL6Anna Fali
1047Stacey MacleadIndia2026-05-03Rousseaux, Michael Esq QUALIFIED98Stephen Shaw
1048Smith GlickBrazil2026-04-26Chapman, Ross E Esq QUALIFIED45Anna Fali
1049Ivar PaprockiRussia2026-04-18Truhlar And Truhlar Attys NEW53Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Alejandro PerinJapanBernardo Dominic NEW
Silvio SlusarskiRussiaStephen Shaw QUALIFIED
Salvatore StockhamCanadaBernardo Dominic PROPOSAL
Munro FerenczRussiaBernardo Dominic PROPOSAL
Nicolas IturbideSpainAmy Elsner PROPOSAL
Cody SaylorsUnited KingdomAnna Fali QUALIFIED
Mayumi KolmetzJapanAmy Elsner NEW
Clifford RimAustraliaStephen Shaw NEGOTIATION
Tony FollerAustraliaStephen Shaw QUALIFIED
Johnson SergiBrazilElwin Sharvill NEGOTIATION
Alejandro PerinCanadaAmy Elsner RENEWAL
Juan WieserJapanIvan Magalhaes QUALIFIED
Jeanfrancois VenereSpainAsiya Javayant PROPOSAL
Jones VocelkaSpainIoni Bowcher UNQUALIFIED
Faith GillianRussiaBernardo Dominic PROPOSAL
Ivar PaprockiCanadaAmy Elsner PROPOSAL
Aditya KuskoAustraliaBernardo Dominic UNQUALIFIED
Misaki RoysterCanadaAmy Elsner UNQUALIFIED
Francesco ShinkoSpainElwin Sharvill RENEWAL
Tony FollerIndiaIoni Bowcher PROPOSAL
Jennifer AmigonGermanyBernardo Dominic NEW
Jeanfrancois VenereIndiaOnyama Limba RENEWAL
David DarakjyItalyAsiya Javayant RENEWAL
Leja CaldareraBrazilBernardo Dominic UNQUALIFIED
Jones VocelkaArgentinaAsiya Javayant UNQUALIFIED
Aruna FigeroaItalyIvan Magalhaes NEGOTIATION
Leon OldroydArgentinaAnna Fali NEW
Alejandro PerinBrazilAsiya Javayant PROPOSAL
Clifford RimJapanAmy Elsner QUALIFIED
Juan WieserIndiaStephen Shaw UNQUALIFIED
Chavez BriddickUnited KingdomIvan Magalhaes PROPOSAL
Costa DilliardItalyAnna Fali PROPOSAL
Tony FollerCanadaElwin Sharvill NEW
Aruna FigeroaRussiaIoni Bowcher NEW
Cody SaylorsArgentinaXuxue Feng NEW
Mayumi KolmetzRussiaIoni Bowcher NEGOTIATION
Darci PoquetteIndiaXuxue Feng PROPOSAL
Aditya KuskoFranceElwin Sharvill UNQUALIFIED
Juan WieserFranceAsiya Javayant UNQUALIFIED
Izzy GarufiCanadaIoni Bowcher NEGOTIATION
Munro FerenczJapanAmy Elsner NEW
Wickens NestleSpainAsiya Javayant RENEWAL
Ashley DoeSpainStephen Shaw NEW
Morrow RutaIndiaBernardo Dominic UNQUALIFIED
Ricardo GauchoArgentinaStephen Shaw UNQUALIFIED
Jennifer AmigonFranceAmy Elsner UNQUALIFIED
Sinclair WaycottGermanyXuxue Feng QUALIFIED
Salvatore StockhamBrazilIvan Magalhaes QUALIFIED
Jefferson SchemmerGermanyOnyama Limba NEGOTIATION
Murillo MaletAustraliaIoni Bowcher RENEWAL
Frozen Columns
Name
Rodrigues Campain
Julie Stenseth
Nicolas Iturbide
Darci Poquette
Faith Gillian
Emily Whobrey
Stacey Maclead
Arvin Albares
Wickens Nestle
Smith Glick
Stacey Maclead
Jeanfrancois Venere
Adams Morasca
Darci Poquette
Claire Tollner
Arvin Albares
Maisha Rulapaugh
Ricardo Gaucho
Mayumi Kolmetz
Mujtaba Nicka
Misaki Royster
Deepesh Chui
Salvatore Stockham
Jefferson Schemmer
Alejandro Perin
Francesco Shinko
Claire Tollner
Julie Stenseth
Darci Poquette
Greenwood Bolognia
Morrow Ruta
James Butt
Juan Wieser
Jeanfrancois Venere
Nicolas Iturbide
Wickens Nestle
Aika Inouye
Maisha Rulapaugh
Silvio Slusarski
Julie Stenseth
Mujtaba Nicka
Ivar Paprocki
Johnson Sergi
Jones Vocelka
Francesco Shinko
Alejandro Perin
Nicolas Iturbide
Kadeem Flosi
Faith Gillian
Emily Whobrey
IdCountryDate
1000Brazil2026-04-24
1001Canada2026-04-10
1002Australia2026-05-06
1003Germany2026-04-16
1004France2026-05-02
1005Spain2026-04-19
1006Argentina2026-04-13
1007Argentina2026-04-19
1008Japan2026-05-04
1009France2026-04-30
1010France2026-04-09
1011Russia2026-04-28
1012India2026-04-22
1013Spain2026-04-23
1014Italy2026-04-13
1015Canada2026-04-15
1016France2026-04-29
1017Canada2026-04-22
1018Brazil2026-04-14
1019Argentina2026-04-22
1020Germany2026-05-05
1021Japan2026-04-27
1022Brazil2026-04-24
1023Germany2026-04-07
1024Spain2026-04-28
1025Argentina2026-04-15
1026Italy2026-04-13
1027Spain2026-04-21
1028France2026-04-10
1029Canada2026-04-30
1030Canada2026-04-27
1031Spain2026-04-17
1032Russia2026-04-14
1033Spain2026-04-19
1034Brazil2026-04-10
1035Spain2026-04-22
1036Japan2026-05-02
1037Japan2026-05-03
1038United Kingdom2026-05-04
1039Spain2026-05-03
1040United Kingdom2026-04-28
1041Argentina2026-04-09
1042Germany2026-04-24
1043Spain2026-04-27
1044Germany2026-04-17
1045Germany2026-05-02
1046India2026-04-26
1047Japan2026-04-14
1048Italy2026-04-12
1049Canada2026-05-01

On-Demand Data

NameIdCountryDate
Leja Caldarera1000Russia2026-05-01
Francesco Shinko1001Brazil2026-05-06
Aruna Figeroa1002Argentina2026-04-15
David Darakjy1003Italy2026-04-15
Tony Foller1004Argentina2026-05-03
James Butt1005Germany2026-04-21
Sinclair Waycott1006Brazil2026-04-13
Costa Dilliard1007Argentina2026-04-13
Mayumi Kolmetz1008Australia2026-04-13
Kaitlin Ostrosky1009Argentina2026-04-13
Morrow Ruta1010Canada2026-04-20
Claire Tollner1011Italy2026-04-30
Arvin Albares1012United Kingdom2026-05-04
Jefferson Schemmer1013Japan2026-04-15
Mayumi Kolmetz1014Russia2026-04-21
Faith Gillian1015Argentina2026-04-28
Arvin Albares1016Germany2026-04-23
Rodrigues Campain1017Australia2026-04-24
Costa Dilliard1018France2026-04-17
Darci Poquette1019United Kingdom2026-04-17
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
David DarakjyJapanOnyama Limba NEGOTIATION
Costa DilliardSpainStephen Shaw PROPOSAL
Cody SaylorsCanadaAsiya Javayant QUALIFIED
Clifford RimGermanyElwin Sharvill PROPOSAL
Mujtaba NickaCanadaXuxue Feng PROPOSAL
Salvatore StockhamAustraliaAnna Fali NEW
Mayumi KolmetzJapanElwin Sharvill QUALIFIED
Chavez BriddickSpainIvan Magalhaes RENEWAL
Nicolas IturbideIndiaXuxue Feng RENEWAL
David DarakjyRussiaIoni Bowcher NEGOTIATION
Ricardo GauchoFranceElwin Sharvill QUALIFIED
Cody SaylorsAustraliaAsiya Javayant PROPOSAL
Morrow RutaBrazilStephen Shaw RENEWAL
Octavia MaletRussiaStephen Shaw NEGOTIATION
Johnson SergiUnited KingdomAsiya Javayant UNQUALIFIED
Leja CaldareraArgentinaAnna Fali NEGOTIATION
Jennifer AmigonItalyXuxue Feng RENEWAL
Kadeem FlosiBrazilElwin Sharvill NEGOTIATION
Smith GlickJapanBernardo Dominic PROPOSAL
Jones VocelkaJapanAmy Elsner UNQUALIFIED
Sinclair WaycottArgentinaIvan Magalhaes QUALIFIED
Claire TollnerUnited KingdomIoni Bowcher NEGOTIATION
Adams MorascaItalyXuxue Feng PROPOSAL
Claire TollnerGermanyAmy Elsner RENEWAL
Mayumi KolmetzFranceAmy Elsner NEW
James ButtItalyIoni Bowcher NEGOTIATION
Mayumi KolmetzJapanOnyama Limba RENEWAL
Deepesh ChuiJapanStephen Shaw NEGOTIATION
Aditya KuskoRussiaOnyama Limba RENEWAL
Alejandro PerinIndiaElwin Sharvill NEW
Antonio CaudyAustraliaIoni Bowcher NEW
Faith GillianIndiaIvan Magalhaes NEW
Wickens NestleJapanAmy Elsner QUALIFIED
Cody SaylorsGermanyElwin Sharvill NEW
Maisha RulapaughFranceStephen Shaw UNQUALIFIED
Antonio CaudySpainStephen Shaw QUALIFIED
Darci PoquetteAustraliaStephen Shaw PROPOSAL
Leja CaldareraItalyElwin Sharvill UNQUALIFIED
Faith GillianCanadaStephen Shaw QUALIFIED
Sinclair WaycottGermanyAnna Fali 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.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>