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
Adams MorascaIndiaAnna Fali NEGOTIATION
Julie StensethFranceIvan Magalhaes UNQUALIFIED
Wickens NestleBrazilBernardo Dominic PROPOSAL
Octavia MaletSpainAsiya Javayant QUALIFIED
Jeanfrancois VenereFranceOnyama Limba RENEWAL
Stacey MacleadArgentinaElwin Sharvill NEGOTIATION
Chavez BriddickJapanIoni Bowcher NEW
Munro FerenczIndiaAsiya Javayant RENEWAL
Deepesh ChuiCanadaStephen Shaw NEGOTIATION
Adams MorascaAustraliaAnna Fali QUALIFIED
Nicolas IturbideRussiaStephen Shaw NEW
Stacey MacleadItalyIoni Bowcher UNQUALIFIED
Salvatore StockhamSpainAmy Elsner NEW
Ricardo GauchoCanadaAsiya Javayant QUALIFIED
Alejandro PerinFranceBernardo Dominic PROPOSAL
Ivar PaprockiSpainAnna Fali PROPOSAL
Alejandro PerinSpainStephen Shaw NEGOTIATION
Jefferson SchemmerArgentinaBernardo Dominic RENEWAL
James ButtFranceBernardo Dominic NEGOTIATION
Misaki RoysterIndiaIoni Bowcher RENEWAL
David DarakjyItalyAnna Fali QUALIFIED
Kaitlin OstroskyUnited KingdomStephen Shaw RENEWAL
James ButtFranceIoni Bowcher NEGOTIATION
Cody SaylorsJapanXuxue Feng PROPOSAL
Misaki RoysterSpainStephen Shaw PROPOSAL
Adams MorascaRussiaOnyama Limba NEGOTIATION
Maisha RulapaughItalyIoni Bowcher PROPOSAL
Greenwood BologniaCanadaIoni Bowcher QUALIFIED
Greenwood BologniaAustraliaOnyama Limba RENEWAL
Octavia MaletRussiaElwin Sharvill NEW
Kaitlin OstroskyArgentinaBernardo Dominic NEW
Isabel BowleyGermanyXuxue Feng NEW
Jeanfrancois VenereGermanyAnna Fali PROPOSAL
Clifford RimAustraliaOnyama Limba QUALIFIED
Sinclair WaycottIndiaStephen Shaw QUALIFIED
Arvin AlbaresIndiaIvan Magalhaes PROPOSAL
Antonio CaudyItalyStephen Shaw QUALIFIED
Ivar PaprockiGermanyElwin Sharvill NEW
Aruna FigeroaBrazilElwin Sharvill NEGOTIATION
Adams MorascaGermanyXuxue Feng RENEWAL
Faith GillianGermanyIoni Bowcher RENEWAL
Smith GlickCanadaBernardo Dominic QUALIFIED
Jones VocelkaIndiaElwin Sharvill NEW
Leon OldroydItalyIvan Magalhaes NEW
Octavia MaletArgentinaOnyama Limba RENEWAL
Leja CaldareraItalyAsiya Javayant NEGOTIATION
Octavia MaletSpainAmy Elsner NEW
Jones VocelkaFranceOnyama Limba QUALIFIED
Costa DilliardBrazilIvan Magalhaes NEW
Octavia MaletJapanAsiya Javayant NEW
Horizontal
NameCountryRepresentativeStatus
Smith GlickArgentinaIvan Magalhaes UNQUALIFIED
Greenwood BologniaGermanyOnyama Limba NEW
Salvatore StockhamJapanOnyama Limba PROPOSAL
Faith GillianCanadaIoni Bowcher NEW
Kadeem FlosiFranceIoni Bowcher RENEWAL
Costa DilliardFranceAsiya Javayant NEW
Aditya KuskoArgentinaStephen Shaw NEGOTIATION
Ricardo GauchoIndiaElwin Sharvill RENEWAL
Misaki RoysterRussiaIvan Magalhaes QUALIFIED
Rodrigues CampainItalyAmy Elsner PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Murillo MaletSpain2026-04-16Feiner Bros NEW17Stephen Shaw
1001Costa DilliardUnited Kingdom2026-05-01Truhlar And Truhlar Attys UNQUALIFIED63Elwin Sharvill
1002Cody SaylorsArgentina2026-04-17Truhlar And Truhlar Attys NEGOTIATION12Amy Elsner
1003Adams MorascaArgentina2026-04-20Morlong Associates UNQUALIFIED69Anna Fali
1004Johnson SergiAustralia2026-04-17Feiner Bros PROPOSAL3Elwin Sharvill
1005Chavez BriddickAustralia2026-04-19Morlong Associates PROPOSAL77Ioni Bowcher
1006Tony FollerJapan2026-04-15Truhlar And Truhlar Attys UNQUALIFIED33Ivan Magalhaes
1007Antonio CaudyItaly2026-04-08Rousseaux, Michael Esq UNQUALIFIED5Bernardo Dominic
1008Kaitlin OstroskyUnited Kingdom2026-04-14Truhlar And Truhlar Attys PROPOSAL26Asiya Javayant
1009Deepesh ChuiArgentina2026-04-13Chanay, Jeffrey A Esq UNQUALIFIED58Anna Fali
1010Izzy GarufiRussia2026-04-21Truhlar And Truhlar Attys UNQUALIFIED34Onyama Limba
1011Nicolas IturbideIndia2026-04-20Feltz Printing Service NEGOTIATION39Amy Elsner
1012Kadeem FlosiAustralia2026-04-08Buckley Miller Wright QUALIFIED64Ioni Bowcher
1013Claire TollnerBrazil2026-04-04Chanay, Jeffrey A Esq PROPOSAL62Ivan Magalhaes
1014Cody SaylorsBrazil2026-04-27Rangoni Of Florence NEW18Amy Elsner
1015Aruna FigeroaItaly2026-04-10Commercial Press RENEWAL84Anna Fali
1016Mayumi KolmetzJapan2026-04-14Truhlar And Truhlar Attys QUALIFIED84Onyama Limba
1017Ivar PaprockiIndia2026-04-27Printing Dimensions NEGOTIATION76Ioni Bowcher
1018Chavez BriddickAustralia2026-04-24Morlong Associates NEGOTIATION36Xuxue Feng
1019Wickens NestleItaly2026-04-12Dorl, James J Esq PROPOSAL75Bernardo Dominic
1020Izzy GarufiJapan2026-04-27King, Christopher A Esq QUALIFIED12Ioni Bowcher
1021Aruna FigeroaJapan2026-04-29Chanay, Jeffrey A Esq PROPOSAL51Elwin Sharvill
1022Costa DilliardAustralia2026-04-08Dorl, James J Esq NEW0Xuxue Feng
1023Francesco ShinkoAustralia2026-04-30Chanay, Jeffrey A Esq NEGOTIATION24Bernardo Dominic
1024Arvin AlbaresCanada2026-04-26Rousseaux, Michael Esq RENEWAL89Anna Fali
1025Ivar PaprockiRussia2026-04-15Feltz Printing Service QUALIFIED99Asiya Javayant
1026Faith GillianUnited Kingdom2026-05-01Morlong Associates PROPOSAL75Asiya Javayant
1027Murillo MaletCanada2026-04-25Morlong Associates PROPOSAL85Anna Fali
1028Jones VocelkaGermany2026-04-06Benton, John B Jr UNQUALIFIED44Stephen Shaw
1029Jennifer AmigonFrance2026-04-21Chemel, James L Cpa NEGOTIATION46Anna Fali
1030Nicolas IturbideArgentina2026-04-21Chemel, James L Cpa NEGOTIATION30Ivan Magalhaes
1031Murillo MaletUnited Kingdom2026-04-08Truhlar And Truhlar Attys NEGOTIATION88Anna Fali
1032Munro FerenczBrazil2026-04-04Truhlar And Truhlar Attys NEGOTIATION87Stephen Shaw
1033Kadeem FlosiFrance2026-04-06Buckley Miller Wright QUALIFIED59Anna Fali
1034Mujtaba NickaAustralia2026-04-16Feiner Bros PROPOSAL87Onyama Limba
1035Cody SaylorsIndia2026-04-24Buckley Miller Wright UNQUALIFIED84Amy Elsner
1036Ashley DoeSpain2026-04-13Morlong Associates UNQUALIFIED39Xuxue Feng
1037Jefferson SchemmerGermany2026-04-22Chapman, Ross E Esq UNQUALIFIED72Ivan Magalhaes
1038Cody SaylorsRussia2026-04-20Rangoni Of Florence NEGOTIATION7Bernardo Dominic
1039Jeanfrancois VenereIndia2026-04-24Feltz Printing Service UNQUALIFIED66Onyama Limba
1040Juan WieserCanada2026-04-07Dorl, James J Esq NEGOTIATION75Ioni Bowcher
1041Maria MarrierGermany2026-04-05Truhlar And Truhlar Attys RENEWAL10Xuxue Feng
1042Claire TollnerUnited Kingdom2026-04-15Dorl, James J Esq QUALIFIED77Bernardo Dominic
1043Jones VocelkaItaly2026-04-22Benton, John B Jr PROPOSAL71Anna Fali
1044Jones VocelkaJapan2026-04-15Printing Dimensions PROPOSAL24Onyama Limba
1045Chavez BriddickItaly2026-04-07Benton, John B Jr RENEWAL68Stephen Shaw
1046Johnson SergiRussia2026-04-22Feltz Printing Service UNQUALIFIED4Xuxue Feng
1047Aditya KuskoFrance2026-04-21Feltz Printing Service NEW40Elwin Sharvill
1048Maisha RulapaughIndia2026-04-20Commercial Press QUALIFIED80Elwin Sharvill
1049Jennifer AmigonGermany2026-04-17Chapman, Ross E Esq RENEWAL75Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Morrow RutaAustraliaBernardo Dominic RENEWAL
Kadeem FlosiAustraliaIoni Bowcher PROPOSAL
Munro FerenczSpainElwin Sharvill UNQUALIFIED
Faith GillianSpainIoni Bowcher PROPOSAL
Ivar PaprockiCanadaXuxue Feng NEW
Francesco ShinkoFranceXuxue Feng NEGOTIATION
Costa DilliardCanadaStephen Shaw RENEWAL
Clifford RimFranceAnna Fali UNQUALIFIED
Arvin AlbaresJapanOnyama Limba NEGOTIATION
Johnson SergiRussiaBernardo Dominic UNQUALIFIED
Ricardo GauchoRussiaIvan Magalhaes NEW
Leja CaldareraRussiaAnna Fali UNQUALIFIED
James ButtBrazilAsiya Javayant NEW
Mayumi KolmetzIndiaElwin Sharvill RENEWAL
Murillo MaletUnited KingdomAnna Fali NEW
Aruna FigeroaAustraliaIvan Magalhaes NEW
Johnson SergiFranceStephen Shaw QUALIFIED
Alejandro PerinItalyStephen Shaw PROPOSAL
Clifford RimRussiaAmy Elsner PROPOSAL
Faith GillianRussiaBernardo Dominic QUALIFIED
Murillo MaletJapanAnna Fali RENEWAL
Maria MarrierArgentinaAsiya Javayant UNQUALIFIED
Tony FollerCanadaAmy Elsner UNQUALIFIED
Deepesh ChuiRussiaElwin Sharvill NEGOTIATION
Mujtaba NickaItalyIvan Magalhaes UNQUALIFIED
Octavia MaletArgentinaAsiya Javayant RENEWAL
Jeanfrancois VenereIndiaStephen Shaw QUALIFIED
Deepesh ChuiBrazilElwin Sharvill NEGOTIATION
Ivar PaprockiJapanXuxue Feng NEW
Morrow RutaUnited KingdomOnyama Limba RENEWAL
Aruna FigeroaArgentinaElwin Sharvill PROPOSAL
Tony FollerSpainIvan Magalhaes NEW
Johnson SergiFranceOnyama Limba NEW
Kaitlin OstroskyBrazilOnyama Limba NEW
Sinclair WaycottCanadaBernardo Dominic RENEWAL
Stacey MacleadGermanyIoni Bowcher PROPOSAL
Leon OldroydAustraliaXuxue Feng PROPOSAL
Johnson SergiGermanyOnyama Limba NEW
Mujtaba NickaFranceBernardo Dominic UNQUALIFIED
Greenwood BologniaAustraliaBernardo Dominic UNQUALIFIED
Murillo MaletIndiaStephen Shaw QUALIFIED
James ButtRussiaAsiya Javayant RENEWAL
Jones VocelkaArgentinaOnyama Limba QUALIFIED
Darci PoquetteUnited KingdomElwin Sharvill NEW
Salvatore StockhamRussiaOnyama Limba RENEWAL
Emily WhobreyUnited KingdomIvan Magalhaes RENEWAL
James ButtAustraliaElwin Sharvill QUALIFIED
Chavez BriddickIndiaElwin Sharvill PROPOSAL
Mujtaba NickaFranceIvan Magalhaes QUALIFIED
Misaki RoysterRussiaElwin Sharvill NEW
Frozen Columns
Name
Octavia Malet
Ricardo Gaucho
David Darakjy
Murillo Malet
Aruna Figeroa
Jennifer Amigon
Arvin Albares
Costa Dilliard
Munro Ferencz
Leja Caldarera
Ricardo Gaucho
Greenwood Bolognia
Tony Foller
Octavia Malet
Johnson Sergi
Greenwood Bolognia
Leon Oldroyd
Jeanfrancois Venere
Silvio Slusarski
Antonio Caudy
David Darakjy
Juan Wieser
Jennifer Amigon
Alejandro Perin
Francesco Shinko
Ivar Paprocki
Julie Stenseth
Smith Glick
Murillo Malet
Octavia Malet
Murillo Malet
Wickens Nestle
Tony Foller
Munro Ferencz
Silvio Slusarski
Maria Marrier
Stacey Maclead
Aruna Figeroa
Jennifer Amigon
Claire Tollner
Arvin Albares
Rodrigues Campain
Stacey Maclead
Maria Marrier
Juan Wieser
Aika Inouye
Kadeem Flosi
Alejandro Perin
Leon Oldroyd
Alejandro Perin
IdCountryDate
1000United Kingdom2026-04-12
1001India2026-04-21
1002Canada2026-04-16
1003Germany2026-04-15
1004Japan2026-04-24
1005Brazil2026-04-21
1006Canada2026-04-12
1007United Kingdom2026-05-03
1008United Kingdom2026-04-23
1009Spain2026-04-23
1010Argentina2026-04-28
1011India2026-04-26
1012Australia2026-04-19
1013Canada2026-04-26
1014Russia2026-04-30
1015Canada2026-04-07
1016Australia2026-04-13
1017Germany2026-04-24
1018Canada2026-04-15
1019Spain2026-04-12
1020Canada2026-04-27
1021India2026-04-09
1022Australia2026-04-28
1023France2026-04-29
1024Argentina2026-04-05
1025Australia2026-04-28
1026United Kingdom2026-04-27
1027United Kingdom2026-04-13
1028France2026-04-11
1029Argentina2026-04-13
1030Argentina2026-04-15
1031Russia2026-04-16
1032Russia2026-04-11
1033France2026-04-19
1034Japan2026-04-05
1035Argentina2026-04-14
1036United Kingdom2026-04-10
1037Russia2026-04-24
1038Canada2026-04-09
1039Germany2026-04-19
1040Germany2026-04-27
1041Canada2026-04-06
1042Germany2026-04-20
1043Argentina2026-05-03
1044France2026-04-21
1045Spain2026-04-08
1046Russia2026-04-09
1047Japan2026-04-18
1048Canada2026-04-04
1049Brazil2026-04-04

On-Demand Data

NameIdCountryDate
Smith Glick1000Japan2026-05-01
Greenwood Bolognia1001Germany2026-04-04
Murillo Malet1002Canada2026-04-08
Jennifer Amigon1003Argentina2026-04-22
Misaki Royster1004Spain2026-04-20
Kaitlin Ostrosky1005Japan2026-04-15
Rodrigues Campain1006Brazil2026-04-04
David Darakjy1007Brazil2026-04-12
Mayumi Kolmetz1008Argentina2026-04-12
Greenwood Bolognia1009Australia2026-04-23
Maisha Rulapaugh1010Spain2026-04-28
Clifford Rim1011Italy2026-05-01
Murillo Malet1012Japan2026-04-26
Antonio Caudy1013Canada2026-04-26
Jefferson Schemmer1014Australia2026-04-13
Kadeem Flosi1015Australia2026-04-25
Arvin Albares1016Canada2026-04-18
Ashley Doe1017Australia2026-04-16
Chavez Briddick1018Spain2026-04-14
Jones Vocelka1019Spain2026-04-20
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aruna FigeroaJapanElwin Sharvill NEW
Salvatore StockhamAustraliaStephen Shaw NEGOTIATION
Rodrigues CampainArgentinaXuxue Feng NEGOTIATION
Octavia MaletFranceIoni Bowcher NEW
Leon OldroydJapanXuxue Feng PROPOSAL
Stacey MacleadArgentinaAsiya Javayant RENEWAL
Faith GillianRussiaIoni Bowcher RENEWAL
Ricardo GauchoSpainIoni Bowcher UNQUALIFIED
Darci PoquetteItalyAmy Elsner RENEWAL
Adams MorascaBrazilIvan Magalhaes NEGOTIATION
Julie StensethCanadaIoni Bowcher NEW
Tony FollerAustraliaBernardo Dominic RENEWAL
Darci PoquetteSpainXuxue Feng UNQUALIFIED
Isabel BowleyAustraliaXuxue Feng NEW
Isabel BowleyIndiaXuxue Feng UNQUALIFIED
Rodrigues CampainSpainIvan Magalhaes UNQUALIFIED
Chavez BriddickJapanAmy Elsner NEGOTIATION
Maisha RulapaughJapanAnna Fali UNQUALIFIED
Greenwood BologniaGermanyOnyama Limba UNQUALIFIED
Wickens NestleItalyIvan Magalhaes NEW
Octavia MaletItalyIvan Magalhaes NEW
Ivar PaprockiFranceAnna Fali NEW
Jones VocelkaUnited KingdomAnna Fali RENEWAL
Octavia MaletAustraliaAsiya Javayant NEW
Adams MorascaArgentinaAsiya Javayant NEW
Izzy GarufiSpainIvan Magalhaes NEW
David DarakjyIndiaElwin Sharvill UNQUALIFIED
Kadeem FlosiItalyElwin Sharvill UNQUALIFIED
Wickens NestleFranceAsiya Javayant NEW
Johnson SergiArgentinaXuxue Feng RENEWAL
Faith GillianIndiaBernardo Dominic PROPOSAL
Greenwood BologniaAustraliaAmy Elsner NEGOTIATION
Mujtaba NickaFranceAmy Elsner QUALIFIED
Clifford RimIndiaAnna Fali NEGOTIATION
Salvatore StockhamIndiaElwin Sharvill NEGOTIATION
Johnson SergiSpainXuxue Feng NEW
Kaitlin OstroskyBrazilIoni Bowcher NEGOTIATION
Salvatore StockhamArgentinaAnna Fali UNQUALIFIED
Murillo MaletUnited KingdomOnyama Limba UNQUALIFIED
Tony FollerBrazilIoni Bowcher 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>