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
Aditya KuskoFranceAmy Elsner UNQUALIFIED
James ButtAustraliaIvan Magalhaes NEW
Ricardo GauchoUnited KingdomAsiya Javayant NEGOTIATION
Salvatore StockhamItalyStephen Shaw NEGOTIATION
Ricardo GauchoFranceBernardo Dominic QUALIFIED
Faith GillianCanadaAnna Fali UNQUALIFIED
Aruna FigeroaSpainXuxue Feng UNQUALIFIED
Jones VocelkaGermanyStephen Shaw NEW
Antonio CaudySpainOnyama Limba PROPOSAL
Alejandro PerinCanadaBernardo Dominic RENEWAL
Alejandro PerinSpainXuxue Feng PROPOSAL
Emily WhobreyGermanyBernardo Dominic RENEWAL
Johnson SergiRussiaStephen Shaw NEW
Kaitlin OstroskyBrazilIvan Magalhaes UNQUALIFIED
Nicolas IturbideRussiaAsiya Javayant PROPOSAL
Rodrigues CampainBrazilStephen Shaw NEW
Jeanfrancois VenereFranceBernardo Dominic NEW
Leja CaldareraAustraliaXuxue Feng UNQUALIFIED
Francesco ShinkoItalyOnyama Limba UNQUALIFIED
Aditya KuskoFranceAnna Fali PROPOSAL
Ricardo GauchoIndiaElwin Sharvill NEGOTIATION
Darci PoquetteUnited KingdomAmy Elsner QUALIFIED
Tony FollerIndiaOnyama Limba QUALIFIED
Maria MarrierItalyAnna Fali PROPOSAL
Ashley DoeFranceAsiya Javayant QUALIFIED
Rodrigues CampainCanadaAmy Elsner QUALIFIED
Juan WieserJapanOnyama Limba NEGOTIATION
Sinclair WaycottCanadaStephen Shaw NEGOTIATION
Kadeem FlosiBrazilAnna Fali NEGOTIATION
Jones VocelkaGermanyAnna Fali NEGOTIATION
Maria MarrierSpainStephen Shaw UNQUALIFIED
Jennifer AmigonSpainBernardo Dominic PROPOSAL
Rodrigues CampainGermanyAsiya Javayant NEW
Emily WhobreyItalyIoni Bowcher RENEWAL
Isabel BowleyRussiaStephen Shaw NEGOTIATION
Cody SaylorsJapanElwin Sharvill PROPOSAL
Maria MarrierArgentinaAnna Fali PROPOSAL
Julie StensethBrazilAmy Elsner RENEWAL
Salvatore StockhamRussiaXuxue Feng NEW
Jefferson SchemmerFranceIvan Magalhaes RENEWAL
Darci PoquetteRussiaAnna Fali RENEWAL
Jones VocelkaGermanyBernardo Dominic UNQUALIFIED
James ButtJapanAnna Fali UNQUALIFIED
Sinclair WaycottBrazilStephen Shaw PROPOSAL
Claire TollnerUnited KingdomAnna Fali NEW
Aika InouyeSpainAnna Fali UNQUALIFIED
Claire TollnerItalyAsiya Javayant PROPOSAL
Alejandro PerinRussiaAnna Fali QUALIFIED
Rodrigues CampainItalyAsiya Javayant NEW
David DarakjyBrazilOnyama Limba UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Faith GillianFranceIvan Magalhaes PROPOSAL
Octavia MaletRussiaStephen Shaw QUALIFIED
Greenwood BologniaAustraliaStephen Shaw RENEWAL
Claire TollnerAustraliaXuxue Feng UNQUALIFIED
Mayumi KolmetzFranceElwin Sharvill QUALIFIED
Alejandro PerinSpainXuxue Feng UNQUALIFIED
Johnson SergiAustraliaBernardo Dominic NEW
Isabel BowleyAustraliaElwin Sharvill QUALIFIED
Francesco ShinkoArgentinaXuxue Feng NEW
Antonio CaudyFranceIoni Bowcher NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000James ButtFrance2026-04-26Benton, John B Jr PROPOSAL38Asiya Javayant
1001Ashley DoeIndia2026-05-01Dorl, James J Esq RENEWAL0Ivan Magalhaes
1002Kaitlin OstroskyBrazil2026-04-29Feiner Bros NEGOTIATION49Bernardo Dominic
1003David DarakjyIndia2026-04-20Chapman, Ross E Esq RENEWAL75Xuxue Feng
1004David DarakjyJapan2026-04-18Chapman, Ross E Esq QUALIFIED84Elwin Sharvill
1005Antonio CaudySpain2026-05-04Benton, John B Jr QUALIFIED35Stephen Shaw
1006Emily WhobreyRussia2026-04-18Chemel, James L Cpa NEW65Asiya Javayant
1007Claire TollnerAustralia2026-04-11Morlong Associates RENEWAL35Xuxue Feng
1008Juan WieserRussia2026-04-10Morlong Associates NEW99Ivan Magalhaes
1009Maisha RulapaughFrance2026-04-23Feiner Bros RENEWAL87Elwin Sharvill
1010David DarakjyIndia2026-04-16Chanay, Jeffrey A Esq UNQUALIFIED70Ivan Magalhaes
1011Aika InouyeAustralia2026-04-25Commercial Press UNQUALIFIED27Xuxue Feng
1012James ButtAustralia2026-04-27King, Christopher A Esq QUALIFIED25Asiya Javayant
1013Chavez BriddickRussia2026-04-14Chapman, Ross E Esq NEGOTIATION8Xuxue Feng
1014Francesco ShinkoAustralia2026-04-20Feiner Bros NEGOTIATION25Onyama Limba
1015Stacey MacleadArgentina2026-04-25Feltz Printing Service NEGOTIATION58Bernardo Dominic
1016Jefferson SchemmerBrazil2026-04-23Chemel, James L Cpa PROPOSAL75Amy Elsner
1017Maisha RulapaughBrazil2026-05-02Feltz Printing Service PROPOSAL53Bernardo Dominic
1018Rodrigues CampainIndia2026-04-23Chapman, Ross E Esq NEGOTIATION58Elwin Sharvill
1019Sinclair WaycottAustralia2026-04-07Commercial Press UNQUALIFIED77Ioni Bowcher
1020Johnson SergiGermany2026-04-14Benton, John B Jr NEW17Stephen Shaw
1021Maria MarrierAustralia2026-04-23Commercial Press RENEWAL1Stephen Shaw
1022Salvatore StockhamRussia2026-04-27Truhlar And Truhlar Attys NEGOTIATION27Ivan Magalhaes
1023Claire TollnerBrazil2026-04-17Commercial Press NEW20Stephen Shaw
1024Morrow RutaAustralia2026-04-12Rousseaux, Michael Esq UNQUALIFIED74Onyama Limba
1025Rodrigues CampainItaly2026-04-29Rousseaux, Michael Esq NEGOTIATION33Ioni Bowcher
1026Octavia MaletIndia2026-04-25Morlong Associates PROPOSAL33Onyama Limba
1027Jennifer AmigonRussia2026-04-21Chapman, Ross E Esq PROPOSAL51Bernardo Dominic
1028Cody SaylorsSpain2026-05-03Rousseaux, Michael Esq QUALIFIED89Xuxue Feng
1029Isabel BowleyItaly2026-05-01Feiner Bros UNQUALIFIED11Stephen Shaw
1030Ashley DoeCanada2026-04-06Buckley Miller Wright UNQUALIFIED59Ioni Bowcher
1031Ashley DoeBrazil2026-04-09Commercial Press QUALIFIED37Ioni Bowcher
1032Jefferson SchemmerRussia2026-04-13Rousseaux, Michael Esq NEGOTIATION42Anna Fali
1033Aruna FigeroaItaly2026-04-07Commercial Press RENEWAL61Xuxue Feng
1034Isabel BowleySpain2026-04-25Buckley Miller Wright NEGOTIATION0Asiya Javayant
1035Misaki RoysterSpain2026-04-20Chanay, Jeffrey A Esq UNQUALIFIED14Xuxue Feng
1036Misaki RoysterAustralia2026-04-05Dorl, James J Esq RENEWAL35Ioni Bowcher
1037Sinclair WaycottArgentina2026-04-30Commercial Press RENEWAL28Ivan Magalhaes
1038Ivar PaprockiIndia2026-04-15Morlong Associates NEGOTIATION25Asiya Javayant
1039Leja CaldareraBrazil2026-04-28Chanay, Jeffrey A Esq UNQUALIFIED96Asiya Javayant
1040Antonio CaudyFrance2026-04-10Rangoni Of Florence NEW3Elwin Sharvill
1041David DarakjyJapan2026-04-28King, Christopher A Esq PROPOSAL85Xuxue Feng
1042Smith GlickArgentina2026-04-11Dorl, James J Esq RENEWAL66Bernardo Dominic
1043Mujtaba NickaCanada2026-04-14Benton, John B Jr QUALIFIED60Elwin Sharvill
1044Misaki RoysterRussia2026-04-16Commercial Press NEW19Ivan Magalhaes
1045Smith GlickIndia2026-04-26King, Christopher A Esq NEGOTIATION61Bernardo Dominic
1046Isabel BowleyIndia2026-04-28Buckley Miller Wright NEGOTIATION11Bernardo Dominic
1047Jeanfrancois VenereFrance2026-04-11Rousseaux, Michael Esq RENEWAL71Ioni Bowcher
1048Murillo MaletFrance2026-05-03Truhlar And Truhlar Attys NEGOTIATION16Ioni Bowcher
1049Stacey MacleadArgentina2026-04-29Commercial Press NEGOTIATION72Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Antonio CaudyFranceElwin Sharvill NEGOTIATION
Johnson SergiBrazilAmy Elsner UNQUALIFIED
Clifford RimArgentinaXuxue Feng NEGOTIATION
Francesco ShinkoIndiaAsiya Javayant PROPOSAL
Francesco ShinkoGermanyBernardo Dominic RENEWAL
Clifford RimAustraliaIoni Bowcher NEW
James ButtGermanyXuxue Feng PROPOSAL
Ricardo GauchoIndiaBernardo Dominic PROPOSAL
Morrow RutaBrazilBernardo Dominic QUALIFIED
Aditya KuskoUnited KingdomOnyama Limba UNQUALIFIED
Kadeem FlosiArgentinaElwin Sharvill NEGOTIATION
Smith GlickUnited KingdomAnna Fali QUALIFIED
Aruna FigeroaSpainElwin Sharvill QUALIFIED
Octavia MaletSpainOnyama Limba UNQUALIFIED
Jefferson SchemmerAustraliaIoni Bowcher PROPOSAL
Jennifer AmigonArgentinaElwin Sharvill RENEWAL
Jennifer AmigonRussiaStephen Shaw RENEWAL
Rodrigues CampainArgentinaElwin Sharvill PROPOSAL
Jefferson SchemmerItalyAmy Elsner NEGOTIATION
Antonio CaudyAustraliaAnna Fali NEW
Misaki RoysterJapanAsiya Javayant RENEWAL
Johnson SergiIndiaIvan Magalhaes RENEWAL
Francesco ShinkoArgentinaAnna Fali NEGOTIATION
Maria MarrierRussiaStephen Shaw PROPOSAL
Morrow RutaRussiaAmy Elsner NEGOTIATION
Maria MarrierIndiaIoni Bowcher NEW
Arvin AlbaresAustraliaOnyama Limba NEGOTIATION
Morrow RutaAustraliaBernardo Dominic NEGOTIATION
Leon OldroydCanadaElwin Sharvill UNQUALIFIED
Tony FollerJapanIvan Magalhaes UNQUALIFIED
Salvatore StockhamAustraliaOnyama Limba NEW
Morrow RutaFranceStephen Shaw PROPOSAL
Sinclair WaycottGermanyAsiya Javayant QUALIFIED
Leon OldroydUnited KingdomAmy Elsner RENEWAL
Ashley DoeIndiaIoni Bowcher NEGOTIATION
Nicolas IturbideGermanyIoni Bowcher UNQUALIFIED
Maisha RulapaughJapanIvan Magalhaes UNQUALIFIED
Greenwood BologniaUnited KingdomElwin Sharvill UNQUALIFIED
Mayumi KolmetzSpainIvan Magalhaes NEW
Ashley DoeItalyAnna Fali RENEWAL
Kadeem FlosiCanadaAmy Elsner QUALIFIED
Morrow RutaGermanyIoni Bowcher PROPOSAL
Alejandro PerinItalyXuxue Feng NEW
Jennifer AmigonGermanyAsiya Javayant NEGOTIATION
Juan WieserArgentinaOnyama Limba NEW
Costa DilliardAustraliaIvan Magalhaes RENEWAL
James ButtCanadaOnyama Limba PROPOSAL
Mayumi KolmetzGermanyAnna Fali PROPOSAL
Leon OldroydSpainAsiya Javayant NEGOTIATION
Cody SaylorsFranceAmy Elsner PROPOSAL
Frozen Columns
Name
Wickens Nestle
Jefferson Schemmer
Stacey Maclead
Claire Tollner
Cody Saylors
Morrow Ruta
Leon Oldroyd
Francesco Shinko
Juan Wieser
Juan Wieser
Smith Glick
Clifford Rim
Arvin Albares
Aruna Figeroa
Francesco Shinko
Sinclair Waycott
Silvio Slusarski
Jeanfrancois Venere
Maisha Rulapaugh
Francesco Shinko
Darci Poquette
Emily Whobrey
Kadeem Flosi
Emily Whobrey
Kadeem Flosi
Morrow Ruta
Claire Tollner
Leon Oldroyd
Faith Gillian
Deepesh Chui
Kaitlin Ostrosky
Nicolas Iturbide
Rodrigues Campain
Maria Marrier
Aruna Figeroa
Julie Stenseth
Octavia Malet
Deepesh Chui
Nicolas Iturbide
Deepesh Chui
Mujtaba Nicka
Aditya Kusko
Rodrigues Campain
Alejandro Perin
Aditya Kusko
Alejandro Perin
Julie Stenseth
Nicolas Iturbide
Morrow Ruta
Jefferson Schemmer
IdCountryDate
1000Australia2026-04-23
1001Russia2026-04-30
1002Canada2026-04-12
1003Japan2026-04-05
1004United Kingdom2026-04-27
1005Russia2026-05-02
1006Russia2026-05-04
1007Russia2026-04-07
1008Italy2026-04-18
1009Japan2026-04-27
1010Australia2026-04-08
1011France2026-04-09
1012India2026-04-11
1013Japan2026-04-05
1014France2026-04-12
1015Brazil2026-04-14
1016Russia2026-04-21
1017Japan2026-04-10
1018Italy2026-05-02
1019Brazil2026-04-10
1020Italy2026-04-11
1021India2026-04-12
1022Russia2026-04-30
1023France2026-04-13
1024Canada2026-04-20
1025Italy2026-04-25
1026Germany2026-05-02
1027Spain2026-04-19
1028Germany2026-04-17
1029Germany2026-04-22
1030Argentina2026-04-10
1031Spain2026-04-10
1032Australia2026-04-24
1033Japan2026-05-01
1034Canada2026-04-08
1035United Kingdom2026-04-14
1036India2026-04-19
1037United Kingdom2026-04-23
1038Russia2026-04-14
1039United Kingdom2026-04-19
1040France2026-05-02
1041India2026-04-14
1042Australia2026-04-21
1043Argentina2026-04-30
1044Canada2026-04-11
1045Canada2026-04-17
1046Japan2026-04-08
1047Italy2026-04-27
1048Spain2026-04-22
1049Canada2026-04-24

On-Demand Data

NameIdCountryDate
Jennifer Amigon1000Canada2026-04-24
Alejandro Perin1001Australia2026-04-09
Arvin Albares1002Japan2026-04-06
David Darakjy1003Argentina2026-04-12
Aruna Figeroa1004Italy2026-04-07
Antonio Caudy1005Italy2026-04-10
Jeanfrancois Venere1006France2026-04-12
Izzy Garufi1007Italy2026-04-17
Nicolas Iturbide1008India2026-04-12
Emily Whobrey1009Spain2026-05-04
Juan Wieser1010Italy2026-04-06
Munro Ferencz1011Brazil2026-04-17
Aika Inouye1012Germany2026-04-26
Leja Caldarera1013Canada2026-04-27
Leon Oldroyd1014Argentina2026-04-06
Greenwood Bolognia1015Australia2026-05-03
Isabel Bowley1016Argentina2026-05-01
Costa Dilliard1017France2026-04-28
Emily Whobrey1018Spain2026-04-13
Jefferson Schemmer1019Canada2026-05-01
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Ricardo GauchoArgentinaAnna Fali NEW
Octavia MaletFranceAmy Elsner NEW
Francesco ShinkoSpainStephen Shaw RENEWAL
Leja CaldareraIndiaAnna Fali UNQUALIFIED
Chavez BriddickAustraliaIoni Bowcher PROPOSAL
Mujtaba NickaGermanyAnna Fali PROPOSAL
Emily WhobreyIndiaAsiya Javayant NEGOTIATION
Nicolas IturbideCanadaStephen Shaw PROPOSAL
Octavia MaletSpainXuxue Feng QUALIFIED
Kaitlin OstroskyIndiaIoni Bowcher NEW
Costa DilliardArgentinaXuxue Feng NEGOTIATION
Johnson SergiBrazilIoni Bowcher NEGOTIATION
Adams MorascaAustraliaAnna Fali NEW
Antonio CaudyArgentinaElwin Sharvill UNQUALIFIED
Arvin AlbaresArgentinaAsiya Javayant RENEWAL
Costa DilliardGermanyXuxue Feng QUALIFIED
Ashley DoeFranceAnna Fali PROPOSAL
Costa DilliardIndiaIoni Bowcher NEW
Ashley DoeCanadaAmy Elsner NEGOTIATION
Jeanfrancois VenereFranceIoni Bowcher NEW
Mujtaba NickaSpainOnyama Limba NEGOTIATION
Kaitlin OstroskyIndiaIvan Magalhaes UNQUALIFIED
David DarakjyGermanyStephen Shaw UNQUALIFIED
Munro FerenczIndiaBernardo Dominic QUALIFIED
Leon OldroydArgentinaElwin Sharvill NEGOTIATION
Darci PoquetteArgentinaBernardo Dominic NEGOTIATION
Wickens NestleUnited KingdomAnna Fali PROPOSAL
Ricardo GauchoCanadaIvan Magalhaes QUALIFIED
Antonio CaudyUnited KingdomIoni Bowcher UNQUALIFIED
David DarakjyBrazilAmy Elsner PROPOSAL
David DarakjyIndiaOnyama Limba NEGOTIATION
Ricardo GauchoRussiaIoni Bowcher PROPOSAL
Kadeem FlosiBrazilIoni Bowcher NEGOTIATION
Aruna FigeroaUnited KingdomStephen Shaw NEW
Francesco ShinkoCanadaIoni Bowcher UNQUALIFIED
Leja CaldareraItalyElwin Sharvill NEW
Alejandro PerinItalyOnyama Limba NEW
Juan WieserJapanStephen Shaw QUALIFIED
Aika InouyeJapanOnyama Limba QUALIFIED
Alejandro PerinUnited KingdomIoni Bowcher UNQUALIFIED

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