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
Francesco ShinkoRussiaElwin Sharvill NEW
Costa DilliardArgentinaElwin Sharvill RENEWAL
Mujtaba NickaCanadaOnyama Limba RENEWAL
Ashley DoeAustraliaAsiya Javayant PROPOSAL
Maisha RulapaughAustraliaBernardo Dominic RENEWAL
Adams MorascaAustraliaElwin Sharvill QUALIFIED
Maisha RulapaughJapanIoni Bowcher UNQUALIFIED
Alejandro PerinBrazilElwin Sharvill NEGOTIATION
Leon OldroydIndiaOnyama Limba QUALIFIED
Isabel BowleyFranceIoni Bowcher QUALIFIED
Greenwood BologniaArgentinaElwin Sharvill NEW
Ivar PaprockiSpainIoni Bowcher NEGOTIATION
Munro FerenczJapanOnyama Limba NEW
Smith GlickAustraliaIoni Bowcher NEW
Clifford RimIndiaStephen Shaw NEW
Alejandro PerinJapanIoni Bowcher UNQUALIFIED
Isabel BowleyJapanOnyama Limba RENEWAL
Faith GillianRussiaBernardo Dominic NEW
Silvio SlusarskiJapanStephen Shaw PROPOSAL
Jefferson SchemmerSpainElwin Sharvill NEW
Maria MarrierRussiaElwin Sharvill PROPOSAL
Aika InouyeJapanIvan Magalhaes PROPOSAL
Salvatore StockhamBrazilAnna Fali RENEWAL
Chavez BriddickArgentinaBernardo Dominic RENEWAL
Leja CaldareraCanadaOnyama Limba PROPOSAL
Deepesh ChuiAustraliaOnyama Limba NEGOTIATION
Wickens NestleArgentinaElwin Sharvill RENEWAL
Kadeem FlosiAustraliaAsiya Javayant UNQUALIFIED
Maria MarrierCanadaElwin Sharvill UNQUALIFIED
Alejandro PerinArgentinaAnna Fali PROPOSAL
Aditya KuskoJapanAsiya Javayant NEW
Arvin AlbaresGermanyAmy Elsner UNQUALIFIED
Nicolas IturbideItalyOnyama Limba NEGOTIATION
Darci PoquetteAustraliaAsiya Javayant QUALIFIED
Jones VocelkaFranceIvan Magalhaes UNQUALIFIED
Alejandro PerinAustraliaXuxue Feng PROPOSAL
Mayumi KolmetzJapanAnna Fali NEW
Jefferson SchemmerGermanyOnyama Limba PROPOSAL
Aruna FigeroaBrazilAsiya Javayant UNQUALIFIED
Isabel BowleyIndiaOnyama Limba RENEWAL
Aika InouyeIndiaIvan Magalhaes RENEWAL
Julie StensethSpainElwin Sharvill UNQUALIFIED
Jefferson SchemmerBrazilXuxue Feng QUALIFIED
Isabel BowleyUnited KingdomBernardo Dominic NEGOTIATION
Sinclair WaycottItalyAsiya Javayant RENEWAL
Maisha RulapaughRussiaAsiya Javayant QUALIFIED
Jones VocelkaArgentinaAsiya Javayant NEW
Clifford RimRussiaIoni Bowcher NEGOTIATION
Isabel BowleyIndiaAnna Fali RENEWAL
Deepesh ChuiItalyIoni Bowcher QUALIFIED
Horizontal
NameCountryRepresentativeStatus
David DarakjyItalyAsiya Javayant NEW
Greenwood BologniaCanadaAsiya Javayant RENEWAL
David DarakjyAustraliaXuxue Feng RENEWAL
Wickens NestleCanadaIoni Bowcher UNQUALIFIED
Alejandro PerinUnited KingdomStephen Shaw PROPOSAL
Ivar PaprockiGermanyBernardo Dominic UNQUALIFIED
Costa DilliardItalyAnna Fali PROPOSAL
Darci PoquetteFranceIoni Bowcher PROPOSAL
Greenwood BologniaRussiaIvan Magalhaes QUALIFIED
Maria MarrierGermanyXuxue Feng RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Darci PoquetteSpain2026-05-27Buckley Miller Wright QUALIFIED51Ioni Bowcher
1001Morrow RutaArgentina2026-05-22Feltz Printing Service QUALIFIED51Stephen Shaw
1002Francesco ShinkoSpain2026-06-15Printing Dimensions NEGOTIATION17Xuxue Feng
1003Emily WhobreyJapan2026-05-17Rangoni Of Florence NEW25Xuxue Feng
1004Adams MorascaSpain2026-05-21Chanay, Jeffrey A Esq NEW9Ioni Bowcher
1005Misaki RoysterItaly2026-06-03Rangoni Of Florence QUALIFIED28Amy Elsner
1006Nicolas IturbideArgentina2026-06-02Rangoni Of Florence PROPOSAL3Ioni Bowcher
1007Darci PoquetteAustralia2026-06-08Buckley Miller Wright NEW19Bernardo Dominic
1008Jefferson SchemmerUnited Kingdom2026-05-25Printing Dimensions RENEWAL80Ioni Bowcher
1009Johnson SergiRussia2026-06-11Commercial Press UNQUALIFIED47Onyama Limba
1010Jones VocelkaRussia2026-06-04Chanay, Jeffrey A Esq UNQUALIFIED8Onyama Limba
1011Faith GillianSpain2026-05-19Morlong Associates NEGOTIATION84Asiya Javayant
1012Kadeem FlosiArgentina2026-05-26Truhlar And Truhlar Attys NEW22Elwin Sharvill
1013Adams MorascaAustralia2026-06-08Dorl, James J Esq QUALIFIED50Stephen Shaw
1014Juan WieserCanada2026-06-08Dorl, James J Esq UNQUALIFIED96Ioni Bowcher
1015Sinclair WaycottRussia2026-06-03Rangoni Of Florence PROPOSAL84Onyama Limba
1016Mayumi KolmetzJapan2026-05-30Dorl, James J Esq NEW50Xuxue Feng
1017Juan WieserAustralia2026-05-28Chapman, Ross E Esq RENEWAL75Elwin Sharvill
1018Arvin AlbaresJapan2026-05-30Feltz Printing Service NEW42Anna Fali
1019Kaitlin OstroskyIndia2026-06-01Commercial Press NEW84Stephen Shaw
1020Stacey MacleadRussia2026-05-31King, Christopher A Esq UNQUALIFIED3Anna Fali
1021Chavez BriddickBrazil2026-05-25Morlong Associates NEGOTIATION86Ioni Bowcher
1022Jefferson SchemmerFrance2026-05-26Commercial Press QUALIFIED70Asiya Javayant
1023Alejandro PerinAustralia2026-05-31King, Christopher A Esq NEGOTIATION45Ivan Magalhaes
1024Kaitlin OstroskyAustralia2026-05-29Dorl, James J Esq PROPOSAL80Amy Elsner
1025Tony FollerIndia2026-06-14Rangoni Of Florence PROPOSAL47Ioni Bowcher
1026Adams MorascaRussia2026-05-19King, Christopher A Esq NEW63Xuxue Feng
1027Faith GillianCanada2026-05-18King, Christopher A Esq NEW79Anna Fali
1028Jones VocelkaAustralia2026-05-20King, Christopher A Esq QUALIFIED31Onyama Limba
1029Leon OldroydBrazil2026-05-28Feltz Printing Service PROPOSAL20Anna Fali
1030Maria MarrierRussia2026-06-13Dorl, James J Esq RENEWAL1Anna Fali
1031Greenwood BologniaJapan2026-06-05Benton, John B Jr NEGOTIATION75Ioni Bowcher
1032Wickens NestleAustralia2026-06-14Morlong Associates QUALIFIED74Amy Elsner
1033Arvin AlbaresFrance2026-06-06Benton, John B Jr NEGOTIATION22Stephen Shaw
1034Chavez BriddickGermany2026-06-03Dorl, James J Esq PROPOSAL48Xuxue Feng
1035Ashley DoeUnited Kingdom2026-06-08Benton, John B Jr RENEWAL11Bernardo Dominic
1036Maisha RulapaughRussia2026-06-06Commercial Press NEW57Stephen Shaw
1037Johnson SergiArgentina2026-06-12Benton, John B Jr NEGOTIATION51Ioni Bowcher
1038Isabel BowleyAustralia2026-06-13Benton, John B Jr NEGOTIATION90Amy Elsner
1039Maria MarrierUnited Kingdom2026-06-12Printing Dimensions PROPOSAL89Elwin Sharvill
1040Aika InouyeAustralia2026-06-07King, Christopher A Esq NEGOTIATION45Onyama Limba
1041Jefferson SchemmerFrance2026-06-06Morlong Associates QUALIFIED59Anna Fali
1042Greenwood BologniaJapan2026-06-12Benton, John B Jr RENEWAL95Onyama Limba
1043Alejandro PerinFrance2026-05-28Feiner Bros NEW50Amy Elsner
1044Murillo MaletFrance2026-06-01King, Christopher A Esq NEW15Onyama Limba
1045Jeanfrancois VenereCanada2026-06-08Buckley Miller Wright PROPOSAL45Ioni Bowcher
1046Tony FollerCanada2026-06-14Printing Dimensions PROPOSAL80Anna Fali
1047Jeanfrancois VenereUnited Kingdom2026-06-03Rangoni Of Florence NEGOTIATION39Asiya Javayant
1048Leja CaldareraGermany2026-05-31Morlong Associates UNQUALIFIED69Stephen Shaw
1049Alejandro PerinBrazil2026-06-02Buckley Miller Wright QUALIFIED62Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Kadeem FlosiGermanyElwin Sharvill PROPOSAL
Leon OldroydJapanElwin Sharvill NEGOTIATION
Sinclair WaycottCanadaBernardo Dominic NEW
Clifford RimBrazilAnna Fali NEGOTIATION
Jennifer AmigonItalyOnyama Limba NEW
Octavia MaletAustraliaAmy Elsner QUALIFIED
Maria MarrierCanadaAmy Elsner UNQUALIFIED
Leon OldroydIndiaElwin Sharvill UNQUALIFIED
Faith GillianJapanOnyama Limba NEW
Jones VocelkaSpainAnna Fali PROPOSAL
Juan WieserIndiaOnyama Limba QUALIFIED
Stacey MacleadArgentinaAsiya Javayant PROPOSAL
Tony FollerItalyStephen Shaw PROPOSAL
Misaki RoysterRussiaIvan Magalhaes NEGOTIATION
Jeanfrancois VenereSpainIvan Magalhaes NEGOTIATION
Deepesh ChuiJapanXuxue Feng RENEWAL
Johnson SergiBrazilIoni Bowcher UNQUALIFIED
Cody SaylorsAustraliaAnna Fali UNQUALIFIED
Isabel BowleyAustraliaBernardo Dominic RENEWAL
Faith GillianRussiaIoni Bowcher QUALIFIED
Stacey MacleadAustraliaIoni Bowcher UNQUALIFIED
Emily WhobreyBrazilIoni Bowcher NEW
Claire TollnerUnited KingdomElwin Sharvill RENEWAL
Johnson SergiItalyElwin Sharvill RENEWAL
Jones VocelkaUnited KingdomIvan Magalhaes NEGOTIATION
Mayumi KolmetzGermanyIvan Magalhaes NEGOTIATION
Stacey MacleadSpainXuxue Feng QUALIFIED
Jefferson SchemmerIndiaBernardo Dominic QUALIFIED
Adams MorascaItalyElwin Sharvill RENEWAL
Ricardo GauchoFranceOnyama Limba PROPOSAL
Aika InouyeUnited KingdomBernardo Dominic RENEWAL
Ivar PaprockiItalyAnna Fali NEGOTIATION
Francesco ShinkoFranceIvan Magalhaes PROPOSAL
Ashley DoeJapanOnyama Limba NEGOTIATION
Clifford RimFranceBernardo Dominic UNQUALIFIED
Jones VocelkaRussiaIvan Magalhaes NEW
Cody SaylorsJapanStephen Shaw PROPOSAL
Costa DilliardCanadaAsiya Javayant NEGOTIATION
Alejandro PerinIndiaBernardo Dominic PROPOSAL
Mayumi KolmetzGermanyAmy Elsner QUALIFIED
Maria MarrierAustraliaAsiya Javayant UNQUALIFIED
Adams MorascaRussiaIoni Bowcher QUALIFIED
Mayumi KolmetzCanadaAnna Fali QUALIFIED
Aruna FigeroaSpainAsiya Javayant RENEWAL
Morrow RutaRussiaIvan Magalhaes UNQUALIFIED
Jones VocelkaSpainAmy Elsner RENEWAL
Isabel BowleyUnited KingdomAnna Fali NEW
James ButtRussiaStephen Shaw PROPOSAL
Greenwood BologniaAustraliaAnna Fali RENEWAL
Nicolas IturbideBrazilXuxue Feng NEW
Frozen Columns
Name
Leja Caldarera
Deepesh Chui
Emily Whobrey
Smith Glick
Antonio Caudy
Isabel Bowley
Smith Glick
Leja Caldarera
Johnson Sergi
Darci Poquette
Alejandro Perin
Octavia Malet
Jeanfrancois Venere
Stacey Maclead
Silvio Slusarski
Cody Saylors
Morrow Ruta
Jeanfrancois Venere
Aruna Figeroa
Faith Gillian
Murillo Malet
Adams Morasca
Antonio Caudy
Aruna Figeroa
Jefferson Schemmer
Stacey Maclead
Izzy Garufi
Jones Vocelka
Mujtaba Nicka
Octavia Malet
Munro Ferencz
Misaki Royster
Leon Oldroyd
Kadeem Flosi
Octavia Malet
Johnson Sergi
Francesco Shinko
Jeanfrancois Venere
Emily Whobrey
Jeanfrancois Venere
Izzy Garufi
Antonio Caudy
Costa Dilliard
Jennifer Amigon
Francesco Shinko
Ashley Doe
Murillo Malet
Silvio Slusarski
Adams Morasca
Wickens Nestle
IdCountryDate
1000Russia2026-05-19
1001Canada2026-05-25
1002India2026-05-18
1003Germany2026-05-28
1004France2026-05-20
1005Australia2026-05-27
1006Brazil2026-06-08
1007Argentina2026-05-29
1008Japan2026-05-26
1009France2026-05-18
1010India2026-06-07
1011Italy2026-05-18
1012Japan2026-06-02
1013Canada2026-05-30
1014Canada2026-05-26
1015United Kingdom2026-05-18
1016Russia2026-06-13
1017Germany2026-05-29
1018United Kingdom2026-05-25
1019Spain2026-06-01
1020Australia2026-05-18
1021Spain2026-05-22
1022Argentina2026-05-22
1023India2026-06-09
1024Italy2026-05-29
1025Russia2026-06-09
1026India2026-05-28
1027United Kingdom2026-05-31
1028France2026-06-13
1029Russia2026-06-03
1030Germany2026-06-12
1031Spain2026-06-06
1032Canada2026-06-14
1033Argentina2026-05-24
1034India2026-05-28
1035Spain2026-06-08
1036France2026-05-18
1037France2026-05-29
1038Japan2026-06-12
1039Japan2026-05-18
1040Russia2026-05-21
1041Russia2026-05-22
1042Japan2026-06-11
1043Japan2026-06-04
1044United Kingdom2026-06-09
1045United Kingdom2026-06-04
1046Brazil2026-06-15
1047Germany2026-06-12
1048Russia2026-05-22
1049Canada2026-06-14

On-Demand Data

NameIdCountryDate
Aditya Kusko1000Argentina2026-05-30
David Darakjy1001India2026-06-05
Wickens Nestle1002Spain2026-05-25
Alejandro Perin1003Canada2026-05-20
Leon Oldroyd1004Argentina2026-06-13
Johnson Sergi1005India2026-06-02
Mayumi Kolmetz1006Italy2026-06-05
Kaitlin Ostrosky1007Germany2026-06-03
James Butt1008Japan2026-05-20
Mayumi Kolmetz1009Germany2026-06-15
Arvin Albares1010Italy2026-05-29
Ashley Doe1011Japan2026-05-22
Jeanfrancois Venere1012France2026-06-03
Deepesh Chui1013United Kingdom2026-05-30
Izzy Garufi1014Germany2026-06-11
Deepesh Chui1015Italy2026-06-05
Aruna Figeroa1016Brazil2026-05-20
Juan Wieser1017Italy2026-06-12
Jones Vocelka1018Italy2026-06-01
Aditya Kusko1019Canada2026-06-13
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Misaki RoysterRussiaOnyama Limba PROPOSAL
Misaki RoysterIndiaAmy Elsner QUALIFIED
Arvin AlbaresArgentinaBernardo Dominic NEGOTIATION
Greenwood BologniaIndiaAsiya Javayant UNQUALIFIED
Alejandro PerinAustraliaAsiya Javayant QUALIFIED
Munro FerenczUnited KingdomAsiya Javayant RENEWAL
Leon OldroydGermanyXuxue Feng UNQUALIFIED
David DarakjyGermanyIvan Magalhaes RENEWAL
Arvin AlbaresAustraliaAmy Elsner UNQUALIFIED
Isabel BowleyItalyAsiya Javayant QUALIFIED
Clifford RimGermanyAnna Fali UNQUALIFIED
Costa DilliardCanadaIoni Bowcher NEGOTIATION
Ivar PaprockiRussiaBernardo Dominic NEGOTIATION
Maisha RulapaughIndiaAmy Elsner PROPOSAL
Adams MorascaFranceIvan Magalhaes NEGOTIATION
Johnson SergiJapanElwin Sharvill RENEWAL
Clifford RimJapanOnyama Limba RENEWAL
Jennifer AmigonSpainAsiya Javayant PROPOSAL
Izzy GarufiUnited KingdomAnna Fali UNQUALIFIED
Isabel BowleyItalyAmy Elsner QUALIFIED
Aika InouyeJapanOnyama Limba NEGOTIATION
Antonio CaudyUnited KingdomXuxue Feng PROPOSAL
Maisha RulapaughArgentinaAsiya Javayant NEW
Ricardo GauchoAustraliaIvan Magalhaes NEW
Izzy GarufiGermanyXuxue Feng NEGOTIATION
Morrow RutaGermanyIoni Bowcher PROPOSAL
Mujtaba NickaJapanStephen Shaw PROPOSAL
Chavez BriddickFranceAnna Fali QUALIFIED
Johnson SergiBrazilIoni Bowcher RENEWAL
Mayumi KolmetzIndiaAmy Elsner QUALIFIED
Emily WhobreyArgentinaElwin Sharvill RENEWAL
Kaitlin OstroskyBrazilAnna Fali UNQUALIFIED
Cody SaylorsArgentinaElwin Sharvill RENEWAL
Adams MorascaBrazilIvan Magalhaes NEW
Emily WhobreyFranceIvan Magalhaes RENEWAL
Stacey MacleadSpainElwin Sharvill UNQUALIFIED
Kadeem FlosiBrazilIvan Magalhaes RENEWAL
James ButtUnited KingdomAsiya Javayant QUALIFIED
Nicolas IturbideBrazilStephen Shaw NEGOTIATION
Arvin AlbaresSpainIvan Magalhaes QUALIFIED

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