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 UNQUALIFIED
Silvio SlusarskiFranceElwin Sharvill RENEWAL
Aruna FigeroaUnited KingdomXuxue Feng NEW
Aruna FigeroaBrazilAnna Fali NEW
Munro FerenczAustraliaAmy Elsner NEGOTIATION
Clifford RimSpainIvan Magalhaes QUALIFIED
Jennifer AmigonAustraliaOnyama Limba UNQUALIFIED
Julie StensethBrazilAmy Elsner PROPOSAL
Johnson SergiFranceStephen Shaw NEGOTIATION
Johnson SergiIndiaBernardo Dominic UNQUALIFIED
Juan WieserAustraliaElwin Sharvill UNQUALIFIED
Octavia MaletRussiaStephen Shaw QUALIFIED
Darci PoquetteAustraliaIvan Magalhaes RENEWAL
David DarakjyCanadaIvan Magalhaes RENEWAL
Claire TollnerItalyIoni Bowcher PROPOSAL
Jefferson SchemmerArgentinaXuxue Feng RENEWAL
Leja CaldareraIndiaAmy Elsner PROPOSAL
Ashley DoeBrazilElwin Sharvill PROPOSAL
Alejandro PerinAustraliaAsiya Javayant UNQUALIFIED
Aika InouyeItalyAnna Fali PROPOSAL
Jefferson SchemmerAustraliaStephen Shaw NEW
Julie StensethRussiaIoni Bowcher QUALIFIED
Stacey MacleadCanadaIvan Magalhaes NEW
Cody SaylorsAustraliaXuxue Feng UNQUALIFIED
David DarakjyItalyBernardo Dominic QUALIFIED
Adams MorascaIndiaAnna Fali PROPOSAL
Izzy GarufiJapanElwin Sharvill UNQUALIFIED
Isabel BowleyFranceXuxue Feng NEW
Ivar PaprockiGermanyBernardo Dominic NEW
Kaitlin OstroskyFranceAnna Fali NEGOTIATION
Silvio SlusarskiBrazilIoni Bowcher RENEWAL
Aditya KuskoAustraliaStephen Shaw UNQUALIFIED
Mayumi KolmetzAustraliaAnna Fali RENEWAL
Misaki RoysterJapanBernardo Dominic UNQUALIFIED
Maisha RulapaughCanadaAmy Elsner NEW
Ivar PaprockiJapanAsiya Javayant PROPOSAL
Costa DilliardBrazilAmy Elsner UNQUALIFIED
Mayumi KolmetzSpainElwin Sharvill QUALIFIED
Emily WhobreyAustraliaAsiya Javayant RENEWAL
Jefferson SchemmerItalyIvan Magalhaes NEGOTIATION
Nicolas IturbideJapanStephen Shaw NEGOTIATION
Leon OldroydBrazilBernardo Dominic QUALIFIED
Juan WieserCanadaAmy Elsner QUALIFIED
Silvio SlusarskiBrazilAnna Fali NEGOTIATION
Arvin AlbaresUnited KingdomXuxue Feng UNQUALIFIED
Isabel BowleyUnited KingdomAsiya Javayant QUALIFIED
Clifford RimGermanyXuxue Feng NEW
David DarakjyBrazilXuxue Feng NEW
Kaitlin OstroskyUnited KingdomAmy Elsner NEW
Claire TollnerItalyAmy Elsner UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Tony FollerSpainOnyama Limba NEGOTIATION
Kaitlin OstroskyGermanyAsiya Javayant QUALIFIED
Aditya KuskoSpainXuxue Feng QUALIFIED
Izzy GarufiGermanyAsiya Javayant QUALIFIED
Antonio CaudyCanadaIvan Magalhaes UNQUALIFIED
Maisha RulapaughGermanyAnna Fali PROPOSAL
Arvin AlbaresFranceAmy Elsner NEGOTIATION
Johnson SergiUnited KingdomIoni Bowcher NEW
Izzy GarufiIndiaAnna Fali PROPOSAL
Jones VocelkaCanadaAnna Fali UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Chavez BriddickFrance2026-06-12King, Christopher A Esq UNQUALIFIED38Onyama Limba
1001Claire TollnerFrance2026-05-20Commercial Press NEW67Stephen Shaw
1002Stacey MacleadAustralia2026-06-07Feltz Printing Service NEW29Bernardo Dominic
1003Greenwood BologniaGermany2026-06-10Chemel, James L Cpa NEW7Amy Elsner
1004Juan WieserRussia2026-05-24Chapman, Ross E Esq RENEWAL66Xuxue Feng
1005Mujtaba NickaAustralia2026-05-29Rousseaux, Michael Esq QUALIFIED61Xuxue Feng
1006Jennifer AmigonRussia2026-05-19Rangoni Of Florence RENEWAL64Stephen Shaw
1007Aditya KuskoSpain2026-05-27Dorl, James J Esq NEGOTIATION62Ioni Bowcher
1008Morrow RutaIndia2026-06-05Printing Dimensions QUALIFIED0Ivan Magalhaes
1009Johnson SergiArgentina2026-05-19Chapman, Ross E Esq RENEWAL1Xuxue Feng
1010James ButtCanada2026-05-26Rangoni Of Florence QUALIFIED46Bernardo Dominic
1011Octavia MaletIndia2026-05-29Chemel, James L Cpa QUALIFIED62Bernardo Dominic
1012Isabel BowleyCanada2026-05-24King, Christopher A Esq NEW31Ioni Bowcher
1013Ricardo GauchoSpain2026-05-23Chapman, Ross E Esq UNQUALIFIED20Ivan Magalhaes
1014Julie StensethUnited Kingdom2026-05-14Printing Dimensions UNQUALIFIED28Ivan Magalhaes
1015Jennifer AmigonIndia2026-05-25Chanay, Jeffrey A Esq NEW32Bernardo Dominic
1016Murillo MaletBrazil2026-06-09Buckley Miller Wright PROPOSAL46Bernardo Dominic
1017Jeanfrancois VenereFrance2026-05-17Chanay, Jeffrey A Esq NEGOTIATION49Ioni Bowcher
1018Octavia MaletBrazil2026-05-30Buckley Miller Wright UNQUALIFIED33Xuxue Feng
1019Murillo MaletCanada2026-06-09Printing Dimensions RENEWAL30Elwin Sharvill
1020Aika InouyeAustralia2026-05-27Chemel, James L Cpa NEW58Onyama Limba
1021Salvatore StockhamRussia2026-05-22Benton, John B Jr QUALIFIED97Xuxue Feng
1022Juan WieserAustralia2026-05-23Dorl, James J Esq NEGOTIATION95Xuxue Feng
1023Rodrigues CampainItaly2026-06-08Dorl, James J Esq RENEWAL92Xuxue Feng
1024Adams MorascaIndia2026-05-17Buckley Miller Wright UNQUALIFIED9Stephen Shaw
1025Antonio CaudyFrance2026-06-02Commercial Press NEW78Asiya Javayant
1026Wickens NestleAustralia2026-06-12Chapman, Ross E Esq NEW94Ivan Magalhaes
1027Greenwood BologniaGermany2026-05-25Chanay, Jeffrey A Esq UNQUALIFIED91Ivan Magalhaes
1028Antonio CaudyItaly2026-05-14Benton, John B Jr UNQUALIFIED45Onyama Limba
1029Stacey MacleadFrance2026-06-09Commercial Press UNQUALIFIED16Bernardo Dominic
1030Arvin AlbaresItaly2026-05-14Rangoni Of Florence PROPOSAL11Xuxue Feng
1031Mayumi KolmetzBrazil2026-06-10Buckley Miller Wright NEGOTIATION99Bernardo Dominic
1032James ButtArgentina2026-05-27Dorl, James J Esq NEW45Bernardo Dominic
1033Murillo MaletJapan2026-05-21Benton, John B Jr UNQUALIFIED80Anna Fali
1034Cody SaylorsUnited Kingdom2026-05-24Chapman, Ross E Esq RENEWAL24Onyama Limba
1035David DarakjyBrazil2026-05-28Morlong Associates UNQUALIFIED92Stephen Shaw
1036Costa DilliardRussia2026-06-04Chanay, Jeffrey A Esq UNQUALIFIED60Bernardo Dominic
1037Murillo MaletAustralia2026-05-15Rousseaux, Michael Esq RENEWAL28Ivan Magalhaes
1038Darci PoquetteArgentina2026-05-28Rousseaux, Michael Esq NEW51Asiya Javayant
1039Wickens NestleSpain2026-06-11King, Christopher A Esq UNQUALIFIED85Elwin Sharvill
1040Kadeem FlosiJapan2026-05-31Benton, John B Jr NEW43Amy Elsner
1041Octavia MaletJapan2026-05-25Rousseaux, Michael Esq NEGOTIATION29Elwin Sharvill
1042Aruna FigeroaArgentina2026-06-04Buckley Miller Wright RENEWAL69Xuxue Feng
1043Kaitlin OstroskyCanada2026-06-10Feltz Printing Service NEGOTIATION7Xuxue Feng
1044Juan WieserRussia2026-06-06Feiner Bros PROPOSAL89Bernardo Dominic
1045Deepesh ChuiRussia2026-06-08Truhlar And Truhlar Attys NEW91Elwin Sharvill
1046Smith GlickBrazil2026-05-30Buckley Miller Wright PROPOSAL47Asiya Javayant
1047Maisha RulapaughItaly2026-06-11Chemel, James L Cpa NEGOTIATION8Stephen Shaw
1048Juan WieserBrazil2026-05-29Chemel, James L Cpa RENEWAL54Xuxue Feng
1049Ricardo GauchoBrazil2026-06-11Printing Dimensions RENEWAL6Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Munro FerenczAustraliaAnna Fali NEGOTIATION
Johnson SergiItalyStephen Shaw RENEWAL
Greenwood BologniaFranceIoni Bowcher NEW
Emily WhobreyArgentinaAnna Fali PROPOSAL
Murillo MaletCanadaOnyama Limba UNQUALIFIED
James ButtSpainStephen Shaw PROPOSAL
Julie StensethFranceBernardo Dominic RENEWAL
Francesco ShinkoItalyBernardo Dominic NEW
Aika InouyeFranceAnna Fali PROPOSAL
Mujtaba NickaJapanAmy Elsner PROPOSAL
Morrow RutaSpainStephen Shaw RENEWAL
Octavia MaletFranceIoni Bowcher NEGOTIATION
Mujtaba NickaArgentinaOnyama Limba PROPOSAL
Aruna FigeroaArgentinaBernardo Dominic RENEWAL
Munro FerenczAustraliaIoni Bowcher NEGOTIATION
Wickens NestleFranceAnna Fali QUALIFIED
Cody SaylorsArgentinaIvan Magalhaes UNQUALIFIED
Ivar PaprockiJapanAsiya Javayant RENEWAL
Munro FerenczArgentinaElwin Sharvill QUALIFIED
Ashley DoeJapanAnna Fali NEGOTIATION
Rodrigues CampainFranceStephen Shaw UNQUALIFIED
Leon OldroydAustraliaIoni Bowcher QUALIFIED
Juan WieserIndiaStephen Shaw UNQUALIFIED
Octavia MaletRussiaAmy Elsner QUALIFIED
Ashley DoeIndiaAsiya Javayant QUALIFIED
Alejandro PerinJapanStephen Shaw QUALIFIED
David DarakjyFranceIvan Magalhaes RENEWAL
Jeanfrancois VenereItalyOnyama Limba QUALIFIED
Chavez BriddickJapanAsiya Javayant PROPOSAL
Claire TollnerArgentinaAnna Fali QUALIFIED
Antonio CaudyIndiaXuxue Feng UNQUALIFIED
Ricardo GauchoIndiaAmy Elsner PROPOSAL
Aika InouyeSpainBernardo Dominic QUALIFIED
Leja CaldareraIndiaElwin Sharvill UNQUALIFIED
Antonio CaudyBrazilAmy Elsner UNQUALIFIED
Mayumi KolmetzRussiaAmy Elsner NEGOTIATION
Deepesh ChuiSpainBernardo Dominic QUALIFIED
Ivar PaprockiGermanyBernardo Dominic PROPOSAL
Leja CaldareraIndiaAmy Elsner QUALIFIED
Emily WhobreyUnited KingdomAnna Fali RENEWAL
Octavia MaletRussiaIoni Bowcher UNQUALIFIED
Aditya KuskoSpainOnyama Limba PROPOSAL
Stacey MacleadGermanyAmy Elsner RENEWAL
Smith GlickIndiaAmy Elsner RENEWAL
Aika InouyeFranceAmy Elsner NEW
Faith GillianFranceAmy Elsner NEGOTIATION
Rodrigues CampainSpainElwin Sharvill PROPOSAL
Morrow RutaJapanAmy Elsner QUALIFIED
Murillo MaletCanadaAmy Elsner PROPOSAL
Tony FollerJapanXuxue Feng NEW
Frozen Columns
Name
Faith Gillian
Izzy Garufi
Chavez Briddick
Misaki Royster
Leja Caldarera
Octavia Malet
Nicolas Iturbide
Kaitlin Ostrosky
Aruna Figeroa
Mujtaba Nicka
Chavez Briddick
Jeanfrancois Venere
Misaki Royster
Claire Tollner
Mayumi Kolmetz
Costa Dilliard
Adams Morasca
Ashley Doe
Wickens Nestle
Morrow Ruta
Julie Stenseth
Ivar Paprocki
Jeanfrancois Venere
Silvio Slusarski
Leon Oldroyd
Alejandro Perin
Silvio Slusarski
Jennifer Amigon
Adams Morasca
Clifford Rim
Smith Glick
Leon Oldroyd
Maria Marrier
Tony Foller
Ricardo Gaucho
Mujtaba Nicka
Darci Poquette
Octavia Malet
Aika Inouye
Juan Wieser
Maria Marrier
Kadeem Flosi
Nicolas Iturbide
Aditya Kusko
Deepesh Chui
Juan Wieser
Claire Tollner
Julie Stenseth
Greenwood Bolognia
Costa Dilliard
IdCountryDate
1000Italy2026-06-11
1001United Kingdom2026-05-20
1002Australia2026-05-18
1003Russia2026-05-22
1004Argentina2026-06-06
1005Australia2026-05-18
1006Germany2026-06-09
1007Germany2026-05-29
1008Brazil2026-05-17
1009Germany2026-05-20
1010Russia2026-06-08
1011India2026-06-10
1012Spain2026-05-27
1013Italy2026-06-03
1014Russia2026-05-14
1015Australia2026-06-09
1016Italy2026-06-11
1017Russia2026-06-11
1018Italy2026-05-22
1019Japan2026-05-26
1020Germany2026-05-20
1021Germany2026-05-29
1022Brazil2026-05-28
1023Germany2026-06-05
1024Russia2026-05-25
1025India2026-06-05
1026Brazil2026-05-31
1027Italy2026-06-06
1028Spain2026-05-28
1029Spain2026-06-09
1030United Kingdom2026-05-28
1031France2026-05-14
1032Canada2026-05-27
1033Italy2026-06-05
1034India2026-05-25
1035Argentina2026-06-12
1036United Kingdom2026-05-29
1037Argentina2026-05-28
1038United Kingdom2026-06-03
1039Argentina2026-05-28
1040Germany2026-06-12
1041Brazil2026-06-01
1042France2026-05-26
1043India2026-06-03
1044Brazil2026-05-29
1045Brazil2026-05-24
1046Japan2026-06-06
1047Spain2026-06-11
1048Canada2026-05-21
1049Canada2026-05-17

On-Demand Data

NameIdCountryDate
Wickens Nestle1000Canada2026-06-04
Leon Oldroyd1001Germany2026-06-07
Izzy Garufi1002Australia2026-05-22
Salvatore Stockham1003France2026-05-22
Mayumi Kolmetz1004Spain2026-06-07
Maria Marrier1005Germany2026-05-16
Maisha Rulapaugh1006Argentina2026-05-18
Munro Ferencz1007Italy2026-05-31
Aika Inouye1008Spain2026-06-02
Morrow Ruta1009Spain2026-05-30
Maisha Rulapaugh1010Spain2026-06-10
Octavia Malet1011Australia2026-05-23
David Darakjy1012Germany2026-06-12
Johnson Sergi1013Brazil2026-05-27
Silvio Slusarski1014Germany2026-06-06
Jeanfrancois Venere1015France2026-05-24
Adams Morasca1016Japan2026-05-17
Octavia Malet1017Italy2026-05-25
Leja Caldarera1018Argentina2026-05-29
James Butt1019Russia2026-06-08
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Murillo MaletUnited KingdomAnna Fali NEGOTIATION
Salvatore StockhamBrazilIvan Magalhaes NEW
Claire TollnerSpainStephen Shaw PROPOSAL
Wickens NestleIndiaAmy Elsner UNQUALIFIED
James ButtItalyIoni Bowcher NEW
Tony FollerIndiaBernardo Dominic NEGOTIATION
Misaki RoysterBrazilOnyama Limba UNQUALIFIED
Maria MarrierBrazilAsiya Javayant NEW
Ivar PaprockiFranceIvan Magalhaes QUALIFIED
David DarakjyItalyBernardo Dominic NEW
Morrow RutaRussiaOnyama Limba UNQUALIFIED
Claire TollnerItalyAnna Fali NEGOTIATION
Wickens NestleUnited KingdomIoni Bowcher UNQUALIFIED
Costa DilliardArgentinaAsiya Javayant PROPOSAL
Smith GlickGermanyXuxue Feng PROPOSAL
Mayumi KolmetzSpainElwin Sharvill PROPOSAL
Rodrigues CampainRussiaAnna Fali QUALIFIED
Francesco ShinkoArgentinaIoni Bowcher UNQUALIFIED
Claire TollnerRussiaAnna Fali NEGOTIATION
Smith GlickUnited KingdomAmy Elsner NEW
Ashley DoeIndiaAmy Elsner PROPOSAL
Cody SaylorsCanadaStephen Shaw QUALIFIED
Emily WhobreyUnited KingdomAsiya Javayant NEW
Claire TollnerAustraliaStephen Shaw NEW
Mujtaba NickaFranceOnyama Limba NEW
David DarakjyCanadaAmy Elsner UNQUALIFIED
Deepesh ChuiRussiaAnna Fali UNQUALIFIED
Smith GlickRussiaIvan Magalhaes UNQUALIFIED
Aika InouyeIndiaStephen Shaw PROPOSAL
Leon OldroydRussiaXuxue Feng UNQUALIFIED
Antonio CaudyRussiaIoni Bowcher RENEWAL
Darci PoquetteBrazilBernardo Dominic QUALIFIED
Salvatore StockhamGermanyXuxue Feng QUALIFIED
Munro FerenczFranceAsiya Javayant UNQUALIFIED
Maria MarrierAustraliaElwin Sharvill NEW
Morrow RutaJapanBernardo Dominic NEW
Mujtaba NickaRussiaBernardo Dominic RENEWAL
Silvio SlusarskiSpainAsiya Javayant QUALIFIED
Wickens NestleRussiaOnyama Limba QUALIFIED
Salvatore StockhamRussiaIvan Magalhaes 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>