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 FollerBrazilAmy Elsner PROPOSAL
Wickens NestleFranceStephen Shaw PROPOSAL
Izzy GarufiArgentinaAsiya Javayant NEW
Rodrigues CampainFranceBernardo Dominic RENEWAL
Leja CaldareraRussiaOnyama Limba UNQUALIFIED
Claire TollnerCanadaIvan Magalhaes NEW
Deepesh ChuiRussiaAmy Elsner RENEWAL
Sinclair WaycottSpainAsiya Javayant PROPOSAL
Jones VocelkaJapanStephen Shaw QUALIFIED
Chavez BriddickAustraliaOnyama Limba RENEWAL
Sinclair WaycottBrazilStephen Shaw RENEWAL
Sinclair WaycottBrazilXuxue Feng PROPOSAL
Emily WhobreyUnited KingdomOnyama Limba QUALIFIED
Claire TollnerBrazilIoni Bowcher RENEWAL
Faith GillianFranceAmy Elsner NEGOTIATION
Aditya KuskoAustraliaStephen Shaw QUALIFIED
Cody SaylorsRussiaAmy Elsner QUALIFIED
Salvatore StockhamAustraliaOnyama Limba PROPOSAL
Silvio SlusarskiGermanyAsiya Javayant QUALIFIED
Silvio SlusarskiUnited KingdomStephen Shaw QUALIFIED
Isabel BowleyIndiaElwin Sharvill RENEWAL
Jones VocelkaCanadaIvan Magalhaes PROPOSAL
Maisha RulapaughBrazilOnyama Limba NEGOTIATION
Darci PoquetteRussiaBernardo Dominic NEGOTIATION
Aruna FigeroaFranceXuxue Feng NEW
Johnson SergiJapanAnna Fali QUALIFIED
Leja CaldareraJapanIoni Bowcher UNQUALIFIED
Izzy GarufiFranceIvan Magalhaes NEW
Jeanfrancois VenereRussiaIoni Bowcher UNQUALIFIED
Murillo MaletAustraliaXuxue Feng QUALIFIED
Alejandro PerinSpainElwin Sharvill QUALIFIED
Chavez BriddickItalyElwin Sharvill UNQUALIFIED
Chavez BriddickSpainAnna Fali RENEWAL
Kaitlin OstroskySpainOnyama Limba NEW
Darci PoquetteIndiaXuxue Feng QUALIFIED
Mayumi KolmetzSpainAnna Fali RENEWAL
Munro FerenczIndiaAnna Fali NEW
Darci PoquetteBrazilBernardo Dominic UNQUALIFIED
Alejandro PerinSpainAnna Fali UNQUALIFIED
Francesco ShinkoUnited KingdomElwin Sharvill UNQUALIFIED
Darci PoquetteRussiaElwin Sharvill NEGOTIATION
Claire TollnerJapanAnna Fali QUALIFIED
Juan WieserUnited KingdomIvan Magalhaes RENEWAL
Jones VocelkaItalyAnna Fali NEW
Kadeem FlosiAustraliaXuxue Feng UNQUALIFIED
Leon OldroydItalyIvan Magalhaes PROPOSAL
Stacey MacleadSpainAnna Fali NEGOTIATION
Antonio CaudyRussiaOnyama Limba UNQUALIFIED
Maisha RulapaughIndiaAsiya Javayant UNQUALIFIED
Johnson SergiRussiaIoni Bowcher QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Alejandro PerinJapanElwin Sharvill RENEWAL
James ButtBrazilIvan Magalhaes PROPOSAL
Ricardo GauchoArgentinaOnyama Limba NEW
Darci PoquetteGermanyAsiya Javayant RENEWAL
Francesco ShinkoArgentinaAsiya Javayant NEGOTIATION
Murillo MaletCanadaAmy Elsner PROPOSAL
Aditya KuskoBrazilIvan Magalhaes PROPOSAL
Alejandro PerinBrazilIvan Magalhaes RENEWAL
Juan WieserSpainBernardo Dominic RENEWAL
Murillo MaletFranceElwin Sharvill UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Salvatore StockhamIndia2026-04-05King, Christopher A Esq RENEWAL90Stephen Shaw
1001Juan WieserRussia2026-04-13Truhlar And Truhlar Attys PROPOSAL56Asiya Javayant
1002Stacey MacleadJapan2026-04-03Benton, John B Jr PROPOSAL31Stephen Shaw
1003Munro FerenczCanada2026-04-24Feiner Bros PROPOSAL61Amy Elsner
1004Isabel BowleyRussia2026-04-15Chemel, James L Cpa UNQUALIFIED16Xuxue Feng
1005Darci PoquetteBrazil2026-04-17Feiner Bros PROPOSAL67Elwin Sharvill
1006Maisha RulapaughBrazil2026-04-15Printing Dimensions PROPOSAL53Xuxue Feng
1007Antonio CaudyFrance2026-04-19Chemel, James L Cpa RENEWAL4Asiya Javayant
1008Nicolas IturbideJapan2026-04-17Buckley Miller Wright PROPOSAL79Elwin Sharvill
1009Arvin AlbaresGermany2026-04-16Buckley Miller Wright NEGOTIATION95Elwin Sharvill
1010Sinclair WaycottGermany2026-04-20Morlong Associates NEW80Anna Fali
1011Johnson SergiItaly2026-04-02Buckley Miller Wright QUALIFIED93Stephen Shaw
1012Tony FollerBrazil2026-03-28Dorl, James J Esq NEW40Onyama Limba
1013Faith GillianSpain2026-03-31Chemel, James L Cpa QUALIFIED42Amy Elsner
1014Munro FerenczBrazil2026-04-06Feiner Bros PROPOSAL65Asiya Javayant
1015Jennifer AmigonJapan2026-04-21Dorl, James J Esq NEW17Ioni Bowcher
1016Costa DilliardRussia2026-04-12Dorl, James J Esq UNQUALIFIED34Anna Fali
1017Izzy GarufiJapan2026-04-12King, Christopher A Esq QUALIFIED23Elwin Sharvill
1018Tony FollerIndia2026-04-05Morlong Associates NEGOTIATION77Bernardo Dominic
1019Aruna FigeroaItaly2026-03-29Feltz Printing Service RENEWAL6Asiya Javayant
1020Aika InouyeArgentina2026-04-06Morlong Associates PROPOSAL20Onyama Limba
1021Murillo MaletGermany2026-04-10Buckley Miller Wright UNQUALIFIED79Amy Elsner
1022Chavez BriddickSpain2026-04-16Benton, John B Jr QUALIFIED73Elwin Sharvill
1023Smith GlickItaly2026-04-08Rangoni Of Florence NEW1Bernardo Dominic
1024Jefferson SchemmerGermany2026-04-25Benton, John B Jr PROPOSAL74Asiya Javayant
1025Mujtaba NickaJapan2026-04-11Buckley Miller Wright QUALIFIED85Amy Elsner
1026Octavia MaletCanada2026-04-08Dorl, James J Esq PROPOSAL63Xuxue Feng
1027Tony FollerCanada2026-04-23Truhlar And Truhlar Attys NEW66Amy Elsner
1028Murillo MaletCanada2026-04-06King, Christopher A Esq UNQUALIFIED58Xuxue Feng
1029James ButtFrance2026-04-18Benton, John B Jr UNQUALIFIED49Xuxue Feng
1030Deepesh ChuiFrance2026-04-19Dorl, James J Esq NEGOTIATION32Xuxue Feng
1031Jeanfrancois VenereUnited Kingdom2026-03-28Benton, John B Jr PROPOSAL9Anna Fali
1032Mujtaba NickaIndia2026-03-30Feiner Bros PROPOSAL79Ioni Bowcher
1033Juan WieserAustralia2026-04-19Rangoni Of Florence RENEWAL34Ivan Magalhaes
1034Francesco ShinkoBrazil2026-04-13Rousseaux, Michael Esq QUALIFIED94Anna Fali
1035James ButtSpain2026-04-02Buckley Miller Wright NEGOTIATION3Ioni Bowcher
1036Leon OldroydBrazil2026-04-08Chanay, Jeffrey A Esq NEW16Amy Elsner
1037Claire TollnerItaly2026-04-02Rangoni Of Florence NEW11Ioni Bowcher
1038Kadeem FlosiFrance2026-04-01Commercial Press RENEWAL73Bernardo Dominic
1039Tony FollerIndia2026-04-23Feiner Bros QUALIFIED90Ivan Magalhaes
1040Wickens NestleItaly2026-03-31Chemel, James L Cpa QUALIFIED36Amy Elsner
1041David DarakjyItaly2026-04-07Feiner Bros NEW34Onyama Limba
1042Francesco ShinkoRussia2026-04-16Feltz Printing Service UNQUALIFIED72Amy Elsner
1043Sinclair WaycottAustralia2026-04-11Commercial Press NEGOTIATION39Ioni Bowcher
1044Arvin AlbaresJapan2026-04-18King, Christopher A Esq NEGOTIATION65Anna Fali
1045Ricardo GauchoArgentina2026-04-18Feltz Printing Service QUALIFIED7Xuxue Feng
1046David DarakjyIndia2026-04-16Buckley Miller Wright PROPOSAL18Asiya Javayant
1047Tony FollerArgentina2026-04-25Feltz Printing Service UNQUALIFIED20Amy Elsner
1048Sinclair WaycottJapan2026-04-07Commercial Press RENEWAL88Bernardo Dominic
1049Aika InouyeGermany2026-03-30Benton, John B Jr UNQUALIFIED69Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Smith GlickArgentinaAnna Fali UNQUALIFIED
Mayumi KolmetzArgentinaXuxue Feng UNQUALIFIED
Ivar PaprockiFranceAnna Fali NEGOTIATION
Greenwood BologniaItalyElwin Sharvill PROPOSAL
Mayumi KolmetzAustraliaAnna Fali QUALIFIED
Salvatore StockhamGermanyAmy Elsner RENEWAL
Cody SaylorsItalyStephen Shaw UNQUALIFIED
Chavez BriddickItalyAsiya Javayant QUALIFIED
James ButtBrazilElwin Sharvill RENEWAL
Jennifer AmigonFranceOnyama Limba QUALIFIED
Faith GillianAustraliaAmy Elsner NEGOTIATION
Sinclair WaycottJapanIvan Magalhaes PROPOSAL
Aditya KuskoItalyXuxue Feng NEW
Jennifer AmigonAustraliaAsiya Javayant UNQUALIFIED
Francesco ShinkoItalyAnna Fali NEGOTIATION
Aika InouyeIndiaXuxue Feng RENEWAL
Murillo MaletRussiaIvan Magalhaes NEGOTIATION
Kaitlin OstroskyCanadaXuxue Feng UNQUALIFIED
Mujtaba NickaAustraliaXuxue Feng UNQUALIFIED
Octavia MaletGermanyXuxue Feng PROPOSAL
Silvio SlusarskiIndiaIoni Bowcher UNQUALIFIED
Jefferson SchemmerGermanyAsiya Javayant PROPOSAL
Johnson SergiAustraliaAmy Elsner QUALIFIED
Murillo MaletSpainOnyama Limba UNQUALIFIED
Munro FerenczIndiaAnna Fali NEW
Wickens NestleJapanXuxue Feng NEW
Juan WieserJapanStephen Shaw QUALIFIED
Emily WhobreySpainOnyama Limba NEW
Wickens NestleRussiaStephen Shaw NEW
Jefferson SchemmerIndiaXuxue Feng NEW
Wickens NestleIndiaIvan Magalhaes QUALIFIED
Isabel BowleyFranceAnna Fali NEW
Cody SaylorsItalyOnyama Limba RENEWAL
Ashley DoeAustraliaElwin Sharvill PROPOSAL
Misaki RoysterBrazilAnna Fali NEW
Jennifer AmigonUnited KingdomAsiya Javayant RENEWAL
Chavez BriddickBrazilIvan Magalhaes UNQUALIFIED
Smith GlickRussiaStephen Shaw UNQUALIFIED
Izzy GarufiBrazilBernardo Dominic PROPOSAL
Wickens NestleGermanyAmy Elsner UNQUALIFIED
Salvatore StockhamItalyXuxue Feng UNQUALIFIED
Stacey MacleadRussiaStephen Shaw QUALIFIED
Ashley DoeAustraliaXuxue Feng UNQUALIFIED
Antonio CaudyGermanyXuxue Feng UNQUALIFIED
Julie StensethAustraliaIoni Bowcher UNQUALIFIED
Costa DilliardBrazilIvan Magalhaes QUALIFIED
Arvin AlbaresGermanyStephen Shaw RENEWAL
Aditya KuskoUnited KingdomAsiya Javayant QUALIFIED
Maria MarrierGermanyOnyama Limba RENEWAL
Chavez BriddickJapanAmy Elsner RENEWAL
Frozen Columns
Name
Stacey Maclead
Ricardo Gaucho
Ricardo Gaucho
Rodrigues Campain
Octavia Malet
Kaitlin Ostrosky
Jennifer Amigon
Tony Foller
Rodrigues Campain
Nicolas Iturbide
Chavez Briddick
James Butt
Octavia Malet
Johnson Sergi
Morrow Ruta
Emily Whobrey
Costa Dilliard
Jefferson Schemmer
Francesco Shinko
Ivar Paprocki
Kadeem Flosi
Mujtaba Nicka
Stacey Maclead
Sinclair Waycott
Francesco Shinko
Jeanfrancois Venere
Julie Stenseth
David Darakjy
Aika Inouye
Darci Poquette
Sinclair Waycott
Kadeem Flosi
Darci Poquette
Mujtaba Nicka
Juan Wieser
Izzy Garufi
Jefferson Schemmer
Antonio Caudy
Izzy Garufi
Morrow Ruta
Kaitlin Ostrosky
Darci Poquette
Kadeem Flosi
Morrow Ruta
Emily Whobrey
Chavez Briddick
Costa Dilliard
Izzy Garufi
Octavia Malet
Costa Dilliard
IdCountryDate
1000Argentina2026-04-21
1001United Kingdom2026-04-07
1002Germany2026-04-03
1003Spain2026-04-23
1004Brazil2026-04-25
1005Canada2026-04-16
1006Spain2026-04-21
1007United Kingdom2026-04-05
1008Brazil2026-04-17
1009India2026-03-28
1010Brazil2026-04-24
1011Germany2026-04-05
1012France2026-04-02
1013Germany2026-04-23
1014Argentina2026-04-21
1015Japan2026-04-17
1016Canada2026-03-29
1017Italy2026-04-04
1018Germany2026-03-28
1019Japan2026-04-05
1020Italy2026-04-11
1021Russia2026-04-15
1022Australia2026-04-20
1023Russia2026-04-17
1024Argentina2026-04-15
1025Russia2026-04-02
1026Australia2026-04-14
1027Canada2026-04-05
1028Canada2026-04-08
1029Spain2026-03-29
1030Spain2026-04-17
1031Germany2026-03-27
1032Spain2026-04-04
1033Spain2026-03-29
1034Australia2026-04-08
1035Australia2026-04-15
1036United Kingdom2026-04-20
1037Japan2026-04-12
1038Japan2026-04-13
1039United Kingdom2026-04-02
1040Brazil2026-04-16
1041France2026-04-07
1042Australia2026-04-04
1043Japan2026-04-11
1044United Kingdom2026-04-19
1045Canada2026-03-31
1046Japan2026-04-17
1047Canada2026-04-13
1048Brazil2026-04-13
1049Russia2026-04-05

On-Demand Data

NameIdCountryDate
Antonio Caudy1000Russia2026-04-04
Leja Caldarera1001Spain2026-04-19
Antonio Caudy1002Australia2026-04-08
Silvio Slusarski1003Japan2026-04-24
Ricardo Gaucho1004Canada2026-03-29
Wickens Nestle1005Argentina2026-04-11
Kadeem Flosi1006Japan2026-04-19
Mayumi Kolmetz1007Russia2026-03-29
Mujtaba Nicka1008United Kingdom2026-04-01
Octavia Malet1009Germany2026-04-24
Munro Ferencz1010Canada2026-04-05
Greenwood Bolognia1011Brazil2026-03-30
Juan Wieser1012United Kingdom2026-04-14
Jones Vocelka1013Japan2026-04-04
Ashley Doe1014Argentina2026-04-08
Deepesh Chui1015United Kingdom2026-04-13
Juan Wieser1016Spain2026-04-18
Rodrigues Campain1017United Kingdom2026-04-06
Deepesh Chui1018Brazil2026-04-25
Nicolas Iturbide1019Germany2026-04-10
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Mayumi KolmetzArgentinaStephen Shaw UNQUALIFIED
Jeanfrancois VenereCanadaElwin Sharvill PROPOSAL
Salvatore StockhamFranceOnyama Limba RENEWAL
Izzy GarufiIndiaOnyama Limba UNQUALIFIED
Antonio CaudyCanadaAmy Elsner QUALIFIED
Jefferson SchemmerGermanyIoni Bowcher NEW
Morrow RutaIndiaAmy Elsner NEGOTIATION
Alejandro PerinUnited KingdomStephen Shaw RENEWAL
Mayumi KolmetzCanadaAnna Fali NEGOTIATION
David DarakjyFranceIvan Magalhaes RENEWAL
Izzy GarufiGermanyIoni Bowcher PROPOSAL
Jennifer AmigonItalyAsiya Javayant UNQUALIFIED
Mujtaba NickaBrazilAnna Fali QUALIFIED
Nicolas IturbideItalyAsiya Javayant RENEWAL
Wickens NestleRussiaStephen Shaw RENEWAL
Aika InouyeAustraliaBernardo Dominic NEW
Cody SaylorsBrazilElwin Sharvill PROPOSAL
Mayumi KolmetzRussiaElwin Sharvill QUALIFIED
Izzy GarufiBrazilAnna Fali QUALIFIED
Darci PoquetteFranceAnna Fali UNQUALIFIED
Rodrigues CampainUnited KingdomAnna Fali PROPOSAL
Cody SaylorsCanadaStephen Shaw RENEWAL
Morrow RutaBrazilIoni Bowcher NEGOTIATION
Cody SaylorsItalyBernardo Dominic NEW
Greenwood BologniaBrazilElwin Sharvill RENEWAL
Ricardo GauchoArgentinaElwin Sharvill PROPOSAL
Leon OldroydBrazilStephen Shaw RENEWAL
Tony FollerUnited KingdomBernardo Dominic PROPOSAL
Claire TollnerJapanXuxue Feng UNQUALIFIED
Izzy GarufiAustraliaOnyama Limba NEGOTIATION
Jefferson SchemmerFranceBernardo Dominic PROPOSAL
Alejandro PerinSpainStephen Shaw RENEWAL
Cody SaylorsCanadaElwin Sharvill RENEWAL
Leja CaldareraItalyOnyama Limba NEW
Jennifer AmigonJapanIvan Magalhaes UNQUALIFIED
Aditya KuskoIndiaAmy Elsner RENEWAL
Cody SaylorsJapanIvan Magalhaes RENEWAL
Aditya KuskoFranceStephen Shaw PROPOSAL
David DarakjySpainXuxue Feng NEGOTIATION
Morrow RutaArgentinaElwin Sharvill RENEWAL

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