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
Smith GlickBrazilElwin Sharvill NEGOTIATION
Mayumi KolmetzSpainBernardo Dominic PROPOSAL
Ivar PaprockiArgentinaAnna Fali QUALIFIED
Silvio SlusarskiSpainBernardo Dominic QUALIFIED
Maria MarrierArgentinaElwin Sharvill NEW
Johnson SergiCanadaIoni Bowcher NEGOTIATION
Alejandro PerinFranceAmy Elsner PROPOSAL
Darci PoquetteAustraliaBernardo Dominic RENEWAL
Tony FollerAustraliaStephen Shaw RENEWAL
James ButtGermanyIoni Bowcher NEW
Adams MorascaUnited KingdomStephen Shaw RENEWAL
Deepesh ChuiIndiaIvan Magalhaes NEGOTIATION
Smith GlickCanadaOnyama Limba UNQUALIFIED
Maisha RulapaughCanadaElwin Sharvill NEGOTIATION
Wickens NestleArgentinaAmy Elsner PROPOSAL
Ashley DoeJapanBernardo Dominic UNQUALIFIED
Nicolas IturbideAustraliaAnna Fali RENEWAL
Rodrigues CampainAustraliaBernardo Dominic RENEWAL
Greenwood BologniaSpainXuxue Feng PROPOSAL
Ivar PaprockiUnited KingdomBernardo Dominic QUALIFIED
Ivar PaprockiRussiaIoni Bowcher QUALIFIED
Izzy GarufiFranceElwin Sharvill PROPOSAL
Aika InouyeGermanyAsiya Javayant RENEWAL
Leja CaldareraArgentinaAmy Elsner RENEWAL
Salvatore StockhamIndiaAnna Fali UNQUALIFIED
Jennifer AmigonBrazilAnna Fali NEW
Aruna FigeroaSpainOnyama Limba NEGOTIATION
Costa DilliardSpainIoni Bowcher PROPOSAL
Rodrigues CampainUnited KingdomIoni Bowcher UNQUALIFIED
Aditya KuskoBrazilAnna Fali QUALIFIED
Stacey MacleadArgentinaAnna Fali PROPOSAL
Arvin AlbaresRussiaXuxue Feng UNQUALIFIED
Faith GillianFranceIoni Bowcher PROPOSAL
Stacey MacleadIndiaIoni Bowcher RENEWAL
Costa DilliardBrazilAmy Elsner NEW
Maria MarrierItalyAmy Elsner RENEWAL
Aika InouyeItalyAmy Elsner UNQUALIFIED
Nicolas IturbideFranceIoni Bowcher NEGOTIATION
Greenwood BologniaRussiaBernardo Dominic NEW
Murillo MaletRussiaStephen Shaw NEGOTIATION
Stacey MacleadSpainAnna Fali QUALIFIED
Tony FollerFranceXuxue Feng QUALIFIED
Munro FerenczArgentinaOnyama Limba NEW
Jefferson SchemmerGermanyAsiya Javayant QUALIFIED
Salvatore StockhamIndiaXuxue Feng UNQUALIFIED
James ButtIndiaAnna Fali NEW
David DarakjyAustraliaAnna Fali NEGOTIATION
Arvin AlbaresBrazilAnna Fali NEW
Clifford RimRussiaXuxue Feng PROPOSAL
Rodrigues CampainIndiaIvan Magalhaes NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Arvin AlbaresSpainOnyama Limba PROPOSAL
Mujtaba NickaBrazilIvan Magalhaes RENEWAL
Adams MorascaGermanyOnyama Limba NEW
James ButtGermanyAnna Fali UNQUALIFIED
Leon OldroydCanadaOnyama Limba QUALIFIED
Izzy GarufiAustraliaAmy Elsner NEGOTIATION
Jones VocelkaRussiaIoni Bowcher RENEWAL
Octavia MaletJapanBernardo Dominic QUALIFIED
Stacey MacleadItalyIvan Magalhaes PROPOSAL
Salvatore StockhamJapanOnyama Limba PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Mujtaba NickaIndia2026-05-02Dorl, James J Esq NEW79Amy Elsner
1001Jennifer AmigonItaly2026-04-21Benton, John B Jr NEGOTIATION63Amy Elsner
1002Stacey MacleadCanada2026-04-30King, Christopher A Esq NEW13Amy Elsner
1003Aika InouyeArgentina2026-04-22Feltz Printing Service RENEWAL94Amy Elsner
1004Ricardo GauchoGermany2026-05-10Chapman, Ross E Esq NEW62Onyama Limba
1005Aika InouyeGermany2026-04-18Rousseaux, Michael Esq QUALIFIED46Elwin Sharvill
1006Aditya KuskoGermany2026-04-18Truhlar And Truhlar Attys RENEWAL26Asiya Javayant
1007Octavia MaletBrazil2026-04-28Chanay, Jeffrey A Esq QUALIFIED51Bernardo Dominic
1008Mujtaba NickaRussia2026-04-21Morlong Associates QUALIFIED33Stephen Shaw
1009Jefferson SchemmerUnited Kingdom2026-04-19Buckley Miller Wright PROPOSAL65Bernardo Dominic
1010Salvatore StockhamJapan2026-05-06Feltz Printing Service NEGOTIATION54Ivan Magalhaes
1011James ButtRussia2026-05-03Chanay, Jeffrey A Esq NEGOTIATION64Ivan Magalhaes
1012Isabel BowleyFrance2026-04-30King, Christopher A Esq RENEWAL53Ioni Bowcher
1013Mayumi KolmetzRussia2026-04-16Benton, John B Jr RENEWAL84Xuxue Feng
1014Chavez BriddickBrazil2026-05-04Truhlar And Truhlar Attys QUALIFIED29Elwin Sharvill
1015Aditya KuskoBrazil2026-05-12Chemel, James L Cpa QUALIFIED7Ivan Magalhaes
1016Ricardo GauchoCanada2026-04-27Truhlar And Truhlar Attys QUALIFIED87Onyama Limba
1017Stacey MacleadFrance2026-04-18Morlong Associates UNQUALIFIED30Xuxue Feng
1018Nicolas IturbideBrazil2026-04-21Feltz Printing Service NEW68Amy Elsner
1019Maria MarrierSpain2026-04-29Feiner Bros NEW83Ioni Bowcher
1020Mayumi KolmetzArgentina2026-04-27Feltz Printing Service RENEWAL86Xuxue Feng
1021Maria MarrierGermany2026-04-16Feiner Bros NEGOTIATION78Amy Elsner
1022Jennifer AmigonCanada2026-05-01Truhlar And Truhlar Attys NEGOTIATION15Anna Fali
1023Murillo MaletJapan2026-05-12Morlong Associates NEW89Amy Elsner
1024David DarakjyGermany2026-05-13Truhlar And Truhlar Attys QUALIFIED70Xuxue Feng
1025Sinclair WaycottJapan2026-04-27Feltz Printing Service PROPOSAL45Stephen Shaw
1026Aruna FigeroaCanada2026-05-04Chanay, Jeffrey A Esq UNQUALIFIED77Anna Fali
1027Cody SaylorsUnited Kingdom2026-04-19King, Christopher A Esq NEW14Bernardo Dominic
1028Wickens NestleRussia2026-04-24Morlong Associates UNQUALIFIED92Asiya Javayant
1029Francesco ShinkoFrance2026-04-29Rousseaux, Michael Esq QUALIFIED81Stephen Shaw
1030Aika InouyeIndia2026-05-01Chemel, James L Cpa NEW87Xuxue Feng
1031Costa DilliardJapan2026-04-21King, Christopher A Esq PROPOSAL26Amy Elsner
1032Aditya KuskoRussia2026-04-24Printing Dimensions UNQUALIFIED24Ivan Magalhaes
1033Mayumi KolmetzCanada2026-05-08Chanay, Jeffrey A Esq NEW44Amy Elsner
1034Aditya KuskoGermany2026-05-07Rangoni Of Florence PROPOSAL66Bernardo Dominic
1035Aditya KuskoIndia2026-05-08Chanay, Jeffrey A Esq PROPOSAL6Stephen Shaw
1036Ricardo GauchoArgentina2026-04-26Chanay, Jeffrey A Esq RENEWAL55Anna Fali
1037Francesco ShinkoItaly2026-04-27Rangoni Of Florence NEW13Onyama Limba
1038Kaitlin OstroskyGermany2026-04-26Feltz Printing Service QUALIFIED36Elwin Sharvill
1039Ivar PaprockiAustralia2026-04-21Truhlar And Truhlar Attys NEGOTIATION31Ivan Magalhaes
1040Tony FollerJapan2026-05-11Truhlar And Truhlar Attys RENEWAL42Onyama Limba
1041Darci PoquetteArgentina2026-04-27Printing Dimensions PROPOSAL59Onyama Limba
1042Isabel BowleyFrance2026-05-11Buckley Miller Wright NEGOTIATION90Elwin Sharvill
1043Jones VocelkaAustralia2026-05-03Truhlar And Truhlar Attys PROPOSAL40Amy Elsner
1044Ashley DoeGermany2026-04-24Feiner Bros RENEWAL0Elwin Sharvill
1045Costa DilliardUnited Kingdom2026-04-27Printing Dimensions QUALIFIED21Bernardo Dominic
1046Leon OldroydFrance2026-05-04Morlong Associates UNQUALIFIED4Onyama Limba
1047Faith GillianIndia2026-05-04Dorl, James J Esq NEGOTIATION38Stephen Shaw
1048Chavez BriddickRussia2026-05-13Commercial Press PROPOSAL99Ioni Bowcher
1049Clifford RimRussia2026-04-25Benton, John B Jr NEGOTIATION60Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
David DarakjyUnited KingdomAsiya Javayant RENEWAL
Mayumi KolmetzRussiaAmy Elsner RENEWAL
Ashley DoeArgentinaAsiya Javayant UNQUALIFIED
Stacey MacleadArgentinaBernardo Dominic NEW
Adams MorascaSpainIvan Magalhaes UNQUALIFIED
Leon OldroydIndiaIoni Bowcher UNQUALIFIED
David DarakjyCanadaOnyama Limba QUALIFIED
Chavez BriddickAustraliaIvan Magalhaes PROPOSAL
Kadeem FlosiGermanyAnna Fali PROPOSAL
Maisha RulapaughArgentinaAmy Elsner NEW
Juan WieserIndiaStephen Shaw RENEWAL
Stacey MacleadArgentinaAsiya Javayant NEGOTIATION
Adams MorascaUnited KingdomAmy Elsner NEW
Deepesh ChuiArgentinaIoni Bowcher NEW
Misaki RoysterRussiaStephen Shaw NEGOTIATION
Aditya KuskoRussiaAnna Fali PROPOSAL
David DarakjyGermanyIoni Bowcher NEW
Murillo MaletRussiaStephen Shaw UNQUALIFIED
Smith GlickIndiaAmy Elsner PROPOSAL
Aika InouyeBrazilIoni Bowcher QUALIFIED
Wickens NestleRussiaBernardo Dominic QUALIFIED
Ashley DoeUnited KingdomStephen Shaw RENEWAL
Julie StensethBrazilIoni Bowcher RENEWAL
Izzy GarufiJapanIoni Bowcher UNQUALIFIED
Clifford RimJapanStephen Shaw QUALIFIED
Faith GillianSpainXuxue Feng UNQUALIFIED
Silvio SlusarskiBrazilBernardo Dominic NEGOTIATION
Jefferson SchemmerRussiaAmy Elsner QUALIFIED
Sinclair WaycottGermanyIoni Bowcher UNQUALIFIED
Leon OldroydRussiaAnna Fali PROPOSAL
Kadeem FlosiFranceIoni Bowcher UNQUALIFIED
Stacey MacleadUnited KingdomOnyama Limba NEGOTIATION
Jones VocelkaArgentinaAsiya Javayant NEW
Nicolas IturbideIndiaStephen Shaw PROPOSAL
Francesco ShinkoSpainAnna Fali QUALIFIED
Stacey MacleadGermanyElwin Sharvill NEGOTIATION
Antonio CaudyAustraliaAnna Fali NEGOTIATION
Salvatore StockhamIndiaAsiya Javayant PROPOSAL
Aditya KuskoIndiaOnyama Limba PROPOSAL
Aditya KuskoJapanStephen Shaw NEW
Aruna FigeroaSpainAsiya Javayant RENEWAL
Greenwood BologniaAustraliaElwin Sharvill NEW
Julie StensethIndiaAmy Elsner RENEWAL
Octavia MaletCanadaAnna Fali RENEWAL
Leja CaldareraSpainElwin Sharvill RENEWAL
Salvatore StockhamUnited KingdomAnna Fali NEW
Maisha RulapaughBrazilAmy Elsner QUALIFIED
Sinclair WaycottArgentinaXuxue Feng NEW
Rodrigues CampainArgentinaAsiya Javayant PROPOSAL
Claire TollnerIndiaXuxue Feng PROPOSAL
Frozen Columns
Name
Darci Poquette
Darci Poquette
Clifford Rim
Kadeem Flosi
Julie Stenseth
Alejandro Perin
Kaitlin Ostrosky
Silvio Slusarski
Alejandro Perin
Ricardo Gaucho
Leja Caldarera
Jeanfrancois Venere
Mujtaba Nicka
Salvatore Stockham
Alejandro Perin
Clifford Rim
Darci Poquette
Izzy Garufi
Clifford Rim
James Butt
Tony Foller
Darci Poquette
Ivar Paprocki
Darci Poquette
Ashley Doe
Darci Poquette
Silvio Slusarski
Wickens Nestle
Maisha Rulapaugh
Maisha Rulapaugh
Deepesh Chui
Clifford Rim
David Darakjy
Stacey Maclead
Arvin Albares
Aditya Kusko
Alejandro Perin
Mujtaba Nicka
Stacey Maclead
Emily Whobrey
Leon Oldroyd
Antonio Caudy
Faith Gillian
Greenwood Bolognia
Faith Gillian
Leja Caldarera
Jeanfrancois Venere
Maisha Rulapaugh
David Darakjy
Mayumi Kolmetz
IdCountryDate
1000Germany2026-04-17
1001Argentina2026-04-23
1002Australia2026-05-02
1003Germany2026-04-29
1004Italy2026-04-27
1005France2026-04-28
1006Russia2026-04-28
1007India2026-04-21
1008Italy2026-05-02
1009Japan2026-04-20
1010France2026-04-23
1011United Kingdom2026-04-25
1012United Kingdom2026-05-10
1013Italy2026-04-23
1014Italy2026-04-28
1015Japan2026-05-01
1016Argentina2026-04-25
1017Spain2026-04-27
1018Argentina2026-05-05
1019Russia2026-04-30
1020Japan2026-05-07
1021Japan2026-05-07
1022Italy2026-04-18
1023Germany2026-05-08
1024Brazil2026-05-11
1025Italy2026-05-08
1026Brazil2026-05-10
1027Germany2026-04-18
1028India2026-04-21
1029Italy2026-05-01
1030Argentina2026-04-20
1031United Kingdom2026-05-11
1032Germany2026-05-06
1033Italy2026-05-01
1034France2026-04-23
1035Germany2026-05-04
1036Argentina2026-04-24
1037India2026-04-29
1038France2026-04-27
1039Japan2026-05-07
1040India2026-05-07
1041France2026-05-07
1042Germany2026-04-25
1043Canada2026-04-28
1044Japan2026-04-24
1045Canada2026-04-25
1046United Kingdom2026-05-09
1047United Kingdom2026-05-09
1048India2026-05-04
1049France2026-05-09

On-Demand Data

NameIdCountryDate
Mujtaba Nicka1000Germany2026-05-05
Leon Oldroyd1001France2026-04-20
Aditya Kusko1002United Kingdom2026-05-13
Salvatore Stockham1003United Kingdom2026-04-29
Francesco Shinko1004Australia2026-04-24
Ricardo Gaucho1005Canada2026-04-26
Smith Glick1006Italy2026-05-03
Maisha Rulapaugh1007Brazil2026-05-02
Cody Saylors1008Canada2026-05-14
Jennifer Amigon1009India2026-04-17
Ashley Doe1010France2026-05-06
Aditya Kusko1011United Kingdom2026-05-12
Octavia Malet1012Japan2026-05-01
Misaki Royster1013Canada2026-05-12
Maisha Rulapaugh1014Russia2026-04-30
Maria Marrier1015Spain2026-05-15
Munro Ferencz1016Brazil2026-05-03
Maria Marrier1017Japan2026-05-13
Cody Saylors1018Russia2026-05-12
Arvin Albares1019United Kingdom2026-04-26
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Costa DilliardFranceOnyama Limba RENEWAL
Murillo MaletFranceBernardo Dominic NEW
Chavez BriddickCanadaStephen Shaw RENEWAL
Jennifer AmigonGermanyAnna Fali UNQUALIFIED
Aruna FigeroaRussiaElwin Sharvill NEGOTIATION
Munro FerenczBrazilXuxue Feng RENEWAL
Kaitlin OstroskyCanadaBernardo Dominic RENEWAL
Mujtaba NickaSpainElwin Sharvill RENEWAL
Julie StensethItalyXuxue Feng QUALIFIED
Jefferson SchemmerJapanAmy Elsner QUALIFIED
Leja CaldareraIndiaOnyama Limba UNQUALIFIED
Arvin AlbaresFranceBernardo Dominic RENEWAL
Octavia MaletRussiaAmy Elsner UNQUALIFIED
Kadeem FlosiSpainAmy Elsner NEW
Jennifer AmigonJapanAsiya Javayant NEW
Izzy GarufiSpainAmy Elsner RENEWAL
Mayumi KolmetzGermanyIvan Magalhaes UNQUALIFIED
Isabel BowleyRussiaAmy Elsner RENEWAL
Leon OldroydJapanXuxue Feng QUALIFIED
Johnson SergiSpainStephen Shaw NEGOTIATION
Nicolas IturbideFranceStephen Shaw NEW
Clifford RimIndiaAnna Fali QUALIFIED
Kaitlin OstroskyGermanyIoni Bowcher QUALIFIED
Jeanfrancois VenereIndiaIvan Magalhaes RENEWAL
Aika InouyeFranceAnna Fali UNQUALIFIED
Izzy GarufiItalyAmy Elsner NEW
Arvin AlbaresCanadaIvan Magalhaes NEGOTIATION
Claire TollnerFranceAmy Elsner RENEWAL
Wickens NestleFranceStephen Shaw RENEWAL
Leja CaldareraUnited KingdomAmy Elsner PROPOSAL
Mujtaba NickaBrazilOnyama Limba NEGOTIATION
Claire TollnerGermanyIvan Magalhaes QUALIFIED
Maisha RulapaughJapanIvan Magalhaes UNQUALIFIED
Francesco ShinkoIndiaAnna Fali QUALIFIED
Adams MorascaArgentinaAnna Fali PROPOSAL
Sinclair WaycottUnited KingdomAnna Fali PROPOSAL
Misaki RoysterItalyAsiya Javayant QUALIFIED
Nicolas IturbideAustraliaStephen Shaw QUALIFIED
Clifford RimItalyAsiya Javayant UNQUALIFIED
Leon OldroydAustraliaIoni Bowcher NEW

<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>