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
Aruna FigeroaBrazilIvan Magalhaes PROPOSAL
Alejandro PerinArgentinaElwin Sharvill RENEWAL
Isabel BowleyGermanyIvan Magalhaes RENEWAL
Tony FollerArgentinaAsiya Javayant NEW
Ricardo GauchoBrazilAmy Elsner NEGOTIATION
Chavez BriddickFranceStephen Shaw NEW
Munro FerenczAustraliaXuxue Feng UNQUALIFIED
Leon OldroydCanadaOnyama Limba PROPOSAL
Stacey MacleadIndiaElwin Sharvill NEW
Maisha RulapaughAustraliaAmy Elsner RENEWAL
Munro FerenczSpainIvan Magalhaes QUALIFIED
Antonio CaudyFranceIoni Bowcher QUALIFIED
Misaki RoysterCanadaXuxue Feng NEGOTIATION
Darci PoquetteFranceAsiya Javayant QUALIFIED
Ivar PaprockiIndiaAsiya Javayant QUALIFIED
Tony FollerItalyAsiya Javayant NEW
Antonio CaudyItalyAmy Elsner PROPOSAL
Munro FerenczRussiaIoni Bowcher PROPOSAL
Faith GillianItalyAsiya Javayant NEGOTIATION
Julie StensethSpainStephen Shaw RENEWAL
Jennifer AmigonAustraliaStephen Shaw UNQUALIFIED
James ButtAustraliaElwin Sharvill NEGOTIATION
Tony FollerBrazilIoni Bowcher RENEWAL
Arvin AlbaresItalyAnna Fali PROPOSAL
Tony FollerItalyAmy Elsner PROPOSAL
Maisha RulapaughIndiaElwin Sharvill UNQUALIFIED
Alejandro PerinRussiaIoni Bowcher UNQUALIFIED
Alejandro PerinUnited KingdomStephen Shaw NEGOTIATION
Cody SaylorsJapanOnyama Limba UNQUALIFIED
Chavez BriddickUnited KingdomAmy Elsner QUALIFIED
Cody SaylorsSpainIvan Magalhaes NEW
Stacey MacleadFranceBernardo Dominic PROPOSAL
Octavia MaletCanadaAnna Fali UNQUALIFIED
Leja CaldareraArgentinaElwin Sharvill QUALIFIED
Kaitlin OstroskyJapanIoni Bowcher NEGOTIATION
Alejandro PerinJapanIoni Bowcher NEW
Silvio SlusarskiJapanAnna Fali PROPOSAL
Isabel BowleyJapanIvan Magalhaes NEW
Francesco ShinkoFranceBernardo Dominic NEW
Julie StensethUnited KingdomXuxue Feng NEW
Mayumi KolmetzArgentinaIvan Magalhaes QUALIFIED
Juan WieserArgentinaBernardo Dominic NEW
Leja CaldareraRussiaAsiya Javayant QUALIFIED
Clifford RimBrazilElwin Sharvill UNQUALIFIED
Jennifer AmigonUnited KingdomAmy Elsner NEW
Stacey MacleadUnited KingdomStephen Shaw RENEWAL
Rodrigues CampainIndiaAsiya Javayant UNQUALIFIED
Cody SaylorsCanadaAmy Elsner PROPOSAL
Octavia MaletRussiaBernardo Dominic RENEWAL
Alejandro PerinBrazilAmy Elsner UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Stacey MacleadRussiaBernardo Dominic NEW
Adams MorascaRussiaIvan Magalhaes UNQUALIFIED
Costa DilliardIndiaXuxue Feng RENEWAL
Jennifer AmigonAustraliaAmy Elsner PROPOSAL
Aika InouyeUnited KingdomAsiya Javayant NEW
Ashley DoeItalyElwin Sharvill RENEWAL
Francesco ShinkoBrazilOnyama Limba UNQUALIFIED
Wickens NestleRussiaAsiya Javayant PROPOSAL
James ButtFranceElwin Sharvill QUALIFIED
Wickens NestleItalyAnna Fali RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Jefferson SchemmerRussia2026-05-24Chemel, James L Cpa RENEWAL3Asiya Javayant
1001Greenwood BologniaUnited Kingdom2026-05-21Benton, John B Jr NEGOTIATION33Amy Elsner
1002Aika InouyeFrance2026-05-23Commercial Press UNQUALIFIED91Amy Elsner
1003Salvatore StockhamAustralia2026-06-06Commercial Press NEGOTIATION76Ioni Bowcher
1004Greenwood BologniaSpain2026-05-08Feltz Printing Service UNQUALIFIED94Ioni Bowcher
1005Jennifer AmigonArgentina2026-05-20Rousseaux, Michael Esq NEW16Bernardo Dominic
1006Izzy GarufiJapan2026-05-10Benton, John B Jr QUALIFIED17Xuxue Feng
1007Leon OldroydGermany2026-05-27Benton, John B Jr UNQUALIFIED56Bernardo Dominic
1008Jones VocelkaCanada2026-05-24Benton, John B Jr RENEWAL48Bernardo Dominic
1009Maria MarrierUnited Kingdom2026-05-09Chanay, Jeffrey A Esq RENEWAL11Asiya Javayant
1010Alejandro PerinFrance2026-05-22Chapman, Ross E Esq RENEWAL97Elwin Sharvill
1011Ricardo GauchoItaly2026-05-13King, Christopher A Esq PROPOSAL76Ioni Bowcher
1012David DarakjyAustralia2026-05-13Chanay, Jeffrey A Esq PROPOSAL75Onyama Limba
1013Francesco ShinkoGermany2026-06-05Feltz Printing Service UNQUALIFIED53Ivan Magalhaes
1014Julie StensethSpain2026-05-23Truhlar And Truhlar Attys NEW33Amy Elsner
1015Jennifer AmigonCanada2026-05-10Buckley Miller Wright QUALIFIED8Amy Elsner
1016Murillo MaletGermany2026-05-18Chapman, Ross E Esq UNQUALIFIED55Asiya Javayant
1017Aruna FigeroaIndia2026-05-28Chanay, Jeffrey A Esq RENEWAL7Ioni Bowcher
1018Leja CaldareraFrance2026-05-21Rangoni Of Florence NEW7Ioni Bowcher
1019Smith GlickFrance2026-05-11Feiner Bros UNQUALIFIED30Asiya Javayant
1020Nicolas IturbideCanada2026-05-25Rousseaux, Michael Esq NEGOTIATION83Asiya Javayant
1021David DarakjyRussia2026-05-25Chanay, Jeffrey A Esq NEW76Xuxue Feng
1022Ashley DoeCanada2026-05-19Chemel, James L Cpa QUALIFIED19Amy Elsner
1023Deepesh ChuiCanada2026-05-22Buckley Miller Wright QUALIFIED66Ivan Magalhaes
1024Alejandro PerinIndia2026-06-02Morlong Associates QUALIFIED77Xuxue Feng
1025Aruna FigeroaArgentina2026-06-01Benton, John B Jr NEW37Amy Elsner
1026Johnson SergiFrance2026-06-04Chemel, James L Cpa NEGOTIATION7Elwin Sharvill
1027Cody SaylorsCanada2026-05-20Rousseaux, Michael Esq PROPOSAL25Bernardo Dominic
1028Leon OldroydAustralia2026-05-22King, Christopher A Esq QUALIFIED4Onyama Limba
1029Aika InouyeRussia2026-06-02Rousseaux, Michael Esq RENEWAL57Onyama Limba
1030Aditya KuskoFrance2026-05-27Dorl, James J Esq PROPOSAL52Amy Elsner
1031Ricardo GauchoAustralia2026-05-30King, Christopher A Esq QUALIFIED80Bernardo Dominic
1032Ashley DoeItaly2026-05-16Printing Dimensions UNQUALIFIED85Amy Elsner
1033Leja CaldareraJapan2026-05-21Feiner Bros PROPOSAL45Elwin Sharvill
1034Leon OldroydBrazil2026-05-25Buckley Miller Wright NEW32Asiya Javayant
1035Mayumi KolmetzRussia2026-05-28Chemel, James L Cpa NEGOTIATION38Bernardo Dominic
1036Jefferson SchemmerBrazil2026-05-28Chemel, James L Cpa QUALIFIED4Amy Elsner
1037Smith GlickIndia2026-05-22Printing Dimensions QUALIFIED47Ivan Magalhaes
1038Claire TollnerBrazil2026-05-23Commercial Press RENEWAL36Stephen Shaw
1039Darci PoquetteArgentina2026-05-16Commercial Press RENEWAL87Ivan Magalhaes
1040Jones VocelkaBrazil2026-05-22Benton, John B Jr NEGOTIATION79Xuxue Feng
1041Darci PoquetteArgentina2026-05-28Chemel, James L Cpa PROPOSAL61Stephen Shaw
1042Johnson SergiBrazil2026-05-24Rousseaux, Michael Esq NEGOTIATION41Bernardo Dominic
1043Adams MorascaArgentina2026-05-25Feiner Bros PROPOSAL16Xuxue Feng
1044Mayumi KolmetzSpain2026-05-29Feltz Printing Service QUALIFIED2Amy Elsner
1045Chavez BriddickFrance2026-05-15Dorl, James J Esq UNQUALIFIED66Amy Elsner
1046Johnson SergiAustralia2026-05-09King, Christopher A Esq RENEWAL66Stephen Shaw
1047Chavez BriddickBrazil2026-05-27King, Christopher A Esq RENEWAL36Ioni Bowcher
1048Leon OldroydCanada2026-06-06Feiner Bros QUALIFIED23Bernardo Dominic
1049Alejandro PerinFrance2026-05-24Chapman, Ross E Esq RENEWAL70Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Jones VocelkaBrazilIvan Magalhaes QUALIFIED
Jeanfrancois VenereGermanyXuxue Feng PROPOSAL
Johnson SergiUnited KingdomIvan Magalhaes QUALIFIED
Misaki RoysterGermanyOnyama Limba PROPOSAL
Ashley DoeFranceBernardo Dominic PROPOSAL
Mujtaba NickaGermanyIvan Magalhaes NEGOTIATION
Adams MorascaSpainOnyama Limba QUALIFIED
Greenwood BologniaCanadaAsiya Javayant RENEWAL
Murillo MaletCanadaStephen Shaw RENEWAL
Aditya KuskoBrazilStephen Shaw UNQUALIFIED
Smith GlickBrazilElwin Sharvill UNQUALIFIED
Leja CaldareraRussiaBernardo Dominic RENEWAL
Jennifer AmigonArgentinaXuxue Feng PROPOSAL
Leon OldroydIndiaBernardo Dominic RENEWAL
Clifford RimRussiaStephen Shaw RENEWAL
Cody SaylorsRussiaOnyama Limba RENEWAL
Ricardo GauchoBrazilIvan Magalhaes UNQUALIFIED
Aditya KuskoRussiaAnna Fali UNQUALIFIED
Aditya KuskoGermanyOnyama Limba NEGOTIATION
Deepesh ChuiFranceIvan Magalhaes QUALIFIED
Mayumi KolmetzAustraliaXuxue Feng RENEWAL
Murillo MaletItalyBernardo Dominic NEW
Julie StensethGermanyStephen Shaw UNQUALIFIED
Aika InouyeJapanIvan Magalhaes NEW
Wickens NestleArgentinaAmy Elsner NEGOTIATION
Morrow RutaCanadaAnna Fali RENEWAL
Octavia MaletRussiaAmy Elsner UNQUALIFIED
David DarakjyRussiaIoni Bowcher QUALIFIED
Ivar PaprockiIndiaBernardo Dominic NEGOTIATION
Sinclair WaycottBrazilIoni Bowcher PROPOSAL
Salvatore StockhamUnited KingdomAsiya Javayant NEGOTIATION
Chavez BriddickAustraliaBernardo Dominic NEW
Maisha RulapaughIndiaOnyama Limba NEW
Alejandro PerinIndiaStephen Shaw NEGOTIATION
Nicolas IturbideAustraliaIoni Bowcher RENEWAL
Costa DilliardAustraliaStephen Shaw NEGOTIATION
Alejandro PerinIndiaAsiya Javayant RENEWAL
Jones VocelkaFranceAsiya Javayant QUALIFIED
Izzy GarufiJapanIvan Magalhaes PROPOSAL
Greenwood BologniaAustraliaIoni Bowcher RENEWAL
Aruna FigeroaIndiaOnyama Limba UNQUALIFIED
Misaki RoysterGermanyAsiya Javayant NEGOTIATION
Mujtaba NickaRussiaAsiya Javayant QUALIFIED
Maria MarrierGermanyXuxue Feng PROPOSAL
Francesco ShinkoRussiaAsiya Javayant UNQUALIFIED
Emily WhobreyAustraliaAnna Fali NEGOTIATION
Maria MarrierBrazilAmy Elsner NEGOTIATION
Silvio SlusarskiGermanyBernardo Dominic NEGOTIATION
Cody SaylorsFranceAnna Fali UNQUALIFIED
Murillo MaletItalyBernardo Dominic QUALIFIED
Frozen Columns
Name
Claire Tollner
Munro Ferencz
Morrow Ruta
Antonio Caudy
Aruna Figeroa
Antonio Caudy
Silvio Slusarski
Jeanfrancois Venere
Juan Wieser
Francesco Shinko
Kaitlin Ostrosky
Maria Marrier
Izzy Garufi
Jeanfrancois Venere
Greenwood Bolognia
Stacey Maclead
Octavia Malet
Johnson Sergi
Ivar Paprocki
Alejandro Perin
Jennifer Amigon
Salvatore Stockham
Cody Saylors
Ashley Doe
Antonio Caudy
Maisha Rulapaugh
Maria Marrier
Smith Glick
James Butt
Greenwood Bolognia
Octavia Malet
Rodrigues Campain
Aika Inouye
Aika Inouye
Darci Poquette
Ivar Paprocki
Greenwood Bolognia
Salvatore Stockham
Aika Inouye
Maisha Rulapaugh
Maria Marrier
Kadeem Flosi
Alejandro Perin
Ashley Doe
Maria Marrier
Mayumi Kolmetz
Ivar Paprocki
Tony Foller
Johnson Sergi
Faith Gillian
IdCountryDate
1000Australia2026-05-31
1001India2026-06-03
1002Australia2026-05-15
1003India2026-05-20
1004Canada2026-06-01
1005Canada2026-05-20
1006Russia2026-05-24
1007India2026-05-29
1008Argentina2026-05-17
1009France2026-05-19
1010United Kingdom2026-05-24
1011Brazil2026-06-03
1012Argentina2026-06-01
1013United Kingdom2026-06-04
1014Germany2026-05-23
1015France2026-05-25
1016France2026-06-05
1017France2026-05-19
1018India2026-05-12
1019India2026-06-04
1020Japan2026-05-12
1021Japan2026-05-12
1022Brazil2026-06-06
1023Germany2026-06-03
1024Brazil2026-05-28
1025Japan2026-05-23
1026Argentina2026-05-27
1027France2026-05-15
1028India2026-05-15
1029United Kingdom2026-05-27
1030India2026-05-08
1031Russia2026-05-14
1032Brazil2026-06-03
1033Brazil2026-05-18
1034Brazil2026-05-17
1035Spain2026-05-15
1036Australia2026-05-25
1037Canada2026-05-18
1038Japan2026-06-05
1039France2026-05-16
1040Russia2026-05-08
1041India2026-06-06
1042United Kingdom2026-05-29
1043Spain2026-05-31
1044Germany2026-05-28
1045Japan2026-05-14
1046Japan2026-05-29
1047Spain2026-05-10
1048United Kingdom2026-05-26
1049Germany2026-05-14

On-Demand Data

NameIdCountryDate
Stacey Maclead1000India2026-05-26
Ricardo Gaucho1001Spain2026-05-19
Aika Inouye1002Germany2026-05-28
Wickens Nestle1003United Kingdom2026-05-14
Antonio Caudy1004France2026-06-02
Ricardo Gaucho1005Australia2026-05-31
Maria Marrier1006Spain2026-05-15
Johnson Sergi1007Australia2026-05-18
Kaitlin Ostrosky1008Germany2026-05-09
Adams Morasca1009Spain2026-05-30
Adams Morasca1010France2026-05-13
Jennifer Amigon1011Australia2026-05-11
Julie Stenseth1012Australia2026-05-20
Cody Saylors1013United Kingdom2026-05-15
Emily Whobrey1014Argentina2026-05-09
Mayumi Kolmetz1015Argentina2026-05-09
Emily Whobrey1016India2026-06-06
Ricardo Gaucho1017Australia2026-05-25
Jefferson Schemmer1018Australia2026-05-12
David Darakjy1019Japan2026-05-21
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Wickens NestleJapanAnna Fali NEGOTIATION
Leon OldroydGermanyOnyama Limba PROPOSAL
Stacey MacleadBrazilXuxue Feng RENEWAL
Tony FollerRussiaBernardo Dominic PROPOSAL
Morrow RutaJapanElwin Sharvill UNQUALIFIED
Sinclair WaycottSpainAmy Elsner NEGOTIATION
Aika InouyeFranceXuxue Feng PROPOSAL
Antonio CaudyArgentinaOnyama Limba RENEWAL
Mujtaba NickaSpainOnyama Limba UNQUALIFIED
Deepesh ChuiFranceStephen Shaw QUALIFIED
Nicolas IturbideAustraliaAnna Fali QUALIFIED
Maisha RulapaughJapanBernardo Dominic NEGOTIATION
Darci PoquetteGermanyElwin Sharvill RENEWAL
Wickens NestleJapanOnyama Limba RENEWAL
Aruna FigeroaCanadaIvan Magalhaes NEW
Francesco ShinkoBrazilAsiya Javayant PROPOSAL
Stacey MacleadSpainStephen Shaw NEW
Kaitlin OstroskyBrazilIoni Bowcher RENEWAL
Jones VocelkaRussiaOnyama Limba RENEWAL
Mayumi KolmetzJapanAsiya Javayant QUALIFIED
Faith GillianArgentinaAsiya Javayant QUALIFIED
Jeanfrancois VenereJapanAnna Fali PROPOSAL
Francesco ShinkoBrazilAnna Fali UNQUALIFIED
Aika InouyeArgentinaElwin Sharvill NEW
Salvatore StockhamRussiaBernardo Dominic QUALIFIED
Ricardo GauchoCanadaBernardo Dominic RENEWAL
Cody SaylorsUnited KingdomIoni Bowcher RENEWAL
Smith GlickIndiaAmy Elsner NEW
Leon OldroydBrazilIoni Bowcher NEGOTIATION
Jeanfrancois VenereItalyAnna Fali QUALIFIED
Antonio CaudyUnited KingdomAnna Fali NEGOTIATION
Aika InouyeJapanXuxue Feng PROPOSAL
Maisha RulapaughCanadaOnyama Limba NEW
Greenwood BologniaSpainIoni Bowcher QUALIFIED
Aika InouyeIndiaBernardo Dominic QUALIFIED
Mayumi KolmetzSpainOnyama Limba PROPOSAL
Mayumi KolmetzGermanyOnyama Limba NEGOTIATION
Julie StensethBrazilAsiya Javayant PROPOSAL
Claire TollnerItalyIoni Bowcher UNQUALIFIED
Tony FollerGermanyIoni 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>