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
Claire TollnerFranceOnyama Limba RENEWAL
Jefferson SchemmerIndiaAsiya Javayant QUALIFIED
Jones VocelkaJapanAsiya Javayant RENEWAL
Munro FerenczFranceStephen Shaw QUALIFIED
Murillo MaletAustraliaOnyama Limba NEW
Clifford RimIndiaIvan Magalhaes QUALIFIED
Salvatore StockhamBrazilAnna Fali NEGOTIATION
David DarakjyFranceAsiya Javayant UNQUALIFIED
Aruna FigeroaFranceAsiya Javayant NEW
Alejandro PerinJapanStephen Shaw NEGOTIATION
Leja CaldareraFranceBernardo Dominic QUALIFIED
Mujtaba NickaAustraliaXuxue Feng NEW
Wickens NestleGermanyAmy Elsner UNQUALIFIED
Aditya KuskoBrazilXuxue Feng NEGOTIATION
Munro FerenczGermanyAmy Elsner QUALIFIED
Isabel BowleyArgentinaIoni Bowcher NEW
Arvin AlbaresSpainBernardo Dominic QUALIFIED
Silvio SlusarskiIndiaAsiya Javayant UNQUALIFIED
Juan WieserAustraliaAnna Fali NEW
Francesco ShinkoCanadaAsiya Javayant NEGOTIATION
Mayumi KolmetzIndiaAmy Elsner UNQUALIFIED
David DarakjyIndiaAmy Elsner NEW
Mujtaba NickaUnited KingdomAnna Fali UNQUALIFIED
Costa DilliardAustraliaIvan Magalhaes NEW
Maria MarrierItalyStephen Shaw NEW
Maria MarrierArgentinaBernardo Dominic QUALIFIED
Claire TollnerArgentinaAmy Elsner RENEWAL
James ButtRussiaXuxue Feng NEGOTIATION
Mayumi KolmetzUnited KingdomAnna Fali RENEWAL
Costa DilliardIndiaAnna Fali RENEWAL
Murillo MaletSpainIoni Bowcher RENEWAL
Chavez BriddickAustraliaBernardo Dominic PROPOSAL
Claire TollnerJapanIoni Bowcher UNQUALIFIED
Claire TollnerAustraliaStephen Shaw RENEWAL
Aruna FigeroaJapanOnyama Limba NEGOTIATION
Faith GillianFranceIoni Bowcher UNQUALIFIED
Silvio SlusarskiAustraliaStephen Shaw RENEWAL
Maisha RulapaughFranceStephen Shaw QUALIFIED
Tony FollerUnited KingdomAsiya Javayant RENEWAL
Leon OldroydGermanyAsiya Javayant UNQUALIFIED
Chavez BriddickRussiaAsiya Javayant UNQUALIFIED
Deepesh ChuiIndiaAmy Elsner NEGOTIATION
Octavia MaletUnited KingdomAnna Fali UNQUALIFIED
James ButtGermanyBernardo Dominic NEW
Munro FerenczFranceAnna Fali RENEWAL
Clifford RimItalyXuxue Feng UNQUALIFIED
Francesco ShinkoSpainOnyama Limba NEGOTIATION
Jones VocelkaIndiaBernardo Dominic QUALIFIED
James ButtGermanyBernardo Dominic UNQUALIFIED
Isabel BowleyBrazilStephen Shaw NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Jeanfrancois VenereBrazilIvan Magalhaes RENEWAL
Darci PoquetteJapanAmy Elsner UNQUALIFIED
Smith GlickArgentinaAsiya Javayant QUALIFIED
Kaitlin OstroskyGermanyAmy Elsner NEW
Antonio CaudyFranceElwin Sharvill RENEWAL
Jefferson SchemmerUnited KingdomIoni Bowcher PROPOSAL
Darci PoquetteFranceAsiya Javayant RENEWAL
Francesco ShinkoItalyAmy Elsner UNQUALIFIED
Francesco ShinkoArgentinaElwin Sharvill NEGOTIATION
Aruna FigeroaFranceIoni Bowcher NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Mayumi KolmetzCanada2025-09-19Feiner Bros PROPOSAL34Xuxue Feng
1001Morrow RutaRussia2025-09-27Dorl, James J Esq NEW80Ioni Bowcher
1002Antonio CaudyRussia2025-10-09Commercial Press UNQUALIFIED77Bernardo Dominic
1003Antonio CaudyArgentina2025-09-18Benton, John B Jr RENEWAL13Stephen Shaw
1004Deepesh ChuiIndia2025-09-27Morlong Associates UNQUALIFIED10Elwin Sharvill
1005Aika InouyeUnited Kingdom2025-10-06Chemel, James L Cpa QUALIFIED43Bernardo Dominic
1006Stacey MacleadGermany2025-09-26Chapman, Ross E Esq PROPOSAL21Stephen Shaw
1007Ricardo GauchoGermany2025-09-17Rangoni Of Florence RENEWAL26Anna Fali
1008Octavia MaletCanada2025-10-06Commercial Press RENEWAL20Asiya Javayant
1009Isabel BowleyAustralia2025-10-10Dorl, James J Esq PROPOSAL97Ivan Magalhaes
1010Costa DilliardUnited Kingdom2025-09-24Chapman, Ross E Esq UNQUALIFIED46Xuxue Feng
1011Cody SaylorsCanada2025-09-21Feltz Printing Service PROPOSAL72Anna Fali
1012Jones VocelkaArgentina2025-09-27Benton, John B Jr PROPOSAL38Ivan Magalhaes
1013Aruna FigeroaItaly2025-10-10Truhlar And Truhlar Attys RENEWAL68Anna Fali
1014Octavia MaletSpain2025-10-05Benton, John B Jr NEGOTIATION55Anna Fali
1015Ricardo GauchoArgentina2025-10-11Chapman, Ross E Esq QUALIFIED16Ivan Magalhaes
1016Leon OldroydGermany2025-10-08Dorl, James J Esq QUALIFIED64Stephen Shaw
1017Greenwood BologniaFrance2025-09-18Rousseaux, Michael Esq RENEWAL47Onyama Limba
1018Aditya KuskoArgentina2025-10-12Rangoni Of Florence NEW9Bernardo Dominic
1019Nicolas IturbideUnited Kingdom2025-09-30Benton, John B Jr NEGOTIATION52Amy Elsner
1020Octavia MaletFrance2025-09-28Feiner Bros UNQUALIFIED78Ivan Magalhaes
1021Claire TollnerUnited Kingdom2025-09-20Chanay, Jeffrey A Esq UNQUALIFIED39Ioni Bowcher
1022Sinclair WaycottIndia2025-09-20Dorl, James J Esq NEW60Onyama Limba
1023Johnson SergiIndia2025-10-06Chapman, Ross E Esq NEGOTIATION65Asiya Javayant
1024Salvatore StockhamRussia2025-09-19Chanay, Jeffrey A Esq NEGOTIATION69Elwin Sharvill
1025James ButtSpain2025-10-14Benton, John B Jr RENEWAL40Xuxue Feng
1026Tony FollerIndia2025-09-27Feltz Printing Service PROPOSAL28Onyama Limba
1027Leja CaldareraRussia2025-09-24King, Christopher A Esq NEW96Elwin Sharvill
1028Emily WhobreyGermany2025-10-12Morlong Associates NEGOTIATION24Ioni Bowcher
1029Jefferson SchemmerIndia2025-10-11Benton, John B Jr RENEWAL93Onyama Limba
1030Morrow RutaSpain2025-09-27Chapman, Ross E Esq UNQUALIFIED44Anna Fali
1031Francesco ShinkoGermany2025-09-27Chanay, Jeffrey A Esq RENEWAL71Ivan Magalhaes
1032Nicolas IturbideItaly2025-10-06Printing Dimensions RENEWAL6Xuxue Feng
1033Ricardo GauchoAustralia2025-09-29Printing Dimensions RENEWAL11Elwin Sharvill
1034Silvio SlusarskiBrazil2025-09-18Chapman, Ross E Esq UNQUALIFIED92Asiya Javayant
1035Morrow RutaSpain2025-10-02King, Christopher A Esq NEGOTIATION20Ivan Magalhaes
1036Maisha RulapaughRussia2025-09-24Printing Dimensions RENEWAL75Amy Elsner
1037Aruna FigeroaArgentina2025-10-08Printing Dimensions NEW47Xuxue Feng
1038Jennifer AmigonSpain2025-10-05Chanay, Jeffrey A Esq PROPOSAL77Stephen Shaw
1039Jennifer AmigonRussia2025-09-22Feiner Bros NEGOTIATION92Elwin Sharvill
1040Nicolas IturbideRussia2025-09-29King, Christopher A Esq UNQUALIFIED13Ivan Magalhaes
1041Greenwood BologniaBrazil2025-09-21Chanay, Jeffrey A Esq RENEWAL93Stephen Shaw
1042Mujtaba NickaItaly2025-10-07Chapman, Ross E Esq RENEWAL38Anna Fali
1043Jeanfrancois VenereIndia2025-09-22Truhlar And Truhlar Attys NEW48Ivan Magalhaes
1044James ButtCanada2025-09-17Truhlar And Truhlar Attys QUALIFIED96Stephen Shaw
1045Arvin AlbaresSpain2025-09-17Buckley Miller Wright PROPOSAL75Elwin Sharvill
1046Wickens NestleCanada2025-09-27Printing Dimensions NEW81Onyama Limba
1047Stacey MacleadBrazil2025-10-08Feiner Bros NEW2Ivan Magalhaes
1048Salvatore StockhamFrance2025-10-15Morlong Associates PROPOSAL96Ioni Bowcher
1049Aruna FigeroaUnited Kingdom2025-10-11Buckley Miller Wright PROPOSAL92Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Juan WieserArgentinaIoni Bowcher UNQUALIFIED
Ricardo GauchoJapanXuxue Feng UNQUALIFIED
Ivar PaprockiBrazilOnyama Limba QUALIFIED
Misaki RoysterCanadaBernardo Dominic RENEWAL
Izzy GarufiUnited KingdomIoni Bowcher PROPOSAL
Wickens NestleRussiaOnyama Limba NEGOTIATION
Claire TollnerUnited KingdomAnna Fali NEW
Maisha RulapaughAustraliaAnna Fali NEW
Jennifer AmigonUnited KingdomOnyama Limba QUALIFIED
Munro FerenczSpainAsiya Javayant RENEWAL
Cody SaylorsRussiaOnyama Limba QUALIFIED
Jennifer AmigonAustraliaIoni Bowcher QUALIFIED
Greenwood BologniaJapanBernardo Dominic NEW
Maria MarrierBrazilIoni Bowcher QUALIFIED
Arvin AlbaresBrazilIoni Bowcher NEGOTIATION
Arvin AlbaresGermanyElwin Sharvill RENEWAL
Mujtaba NickaSpainAsiya Javayant RENEWAL
James ButtArgentinaIoni Bowcher UNQUALIFIED
Kaitlin OstroskyCanadaIoni Bowcher NEGOTIATION
Mayumi KolmetzAustraliaAsiya Javayant PROPOSAL
Leja CaldareraFranceAmy Elsner NEGOTIATION
Octavia MaletArgentinaAsiya Javayant RENEWAL
Misaki RoysterFranceIoni Bowcher NEGOTIATION
Maisha RulapaughItalyAmy Elsner QUALIFIED
Greenwood BologniaUnited KingdomAnna Fali NEW
Jeanfrancois VenereFranceOnyama Limba UNQUALIFIED
Faith GillianGermanyIoni Bowcher PROPOSAL
Smith GlickItalyStephen Shaw UNQUALIFIED
Kaitlin OstroskyItalyAnna Fali QUALIFIED
Ivar PaprockiCanadaXuxue Feng PROPOSAL
Sinclair WaycottArgentinaStephen Shaw PROPOSAL
Morrow RutaRussiaIvan Magalhaes NEW
Costa DilliardArgentinaXuxue Feng UNQUALIFIED
Julie StensethAustraliaBernardo Dominic NEW
Jennifer AmigonRussiaAmy Elsner NEW
Francesco ShinkoJapanStephen Shaw NEW
Aika InouyeSpainAmy Elsner NEW
Aruna FigeroaItalyAsiya Javayant RENEWAL
Izzy GarufiAustraliaIvan Magalhaes NEGOTIATION
Morrow RutaCanadaIvan Magalhaes QUALIFIED
Leon OldroydFranceIoni Bowcher RENEWAL
Ricardo GauchoSpainIvan Magalhaes QUALIFIED
Mayumi KolmetzJapanBernardo Dominic PROPOSAL
Adams MorascaGermanyBernardo Dominic QUALIFIED
Silvio SlusarskiArgentinaIvan Magalhaes NEGOTIATION
Claire TollnerJapanXuxue Feng PROPOSAL
Smith GlickRussiaBernardo Dominic PROPOSAL
Munro FerenczRussiaOnyama Limba PROPOSAL
Salvatore StockhamSpainOnyama Limba PROPOSAL
Cody SaylorsFranceElwin Sharvill RENEWAL
Frozen Columns
Name
Alejandro Perin
Claire Tollner
Deepesh Chui
Jones Vocelka
Mayumi Kolmetz
Kaitlin Ostrosky
Alejandro Perin
Ashley Doe
Misaki Royster
Alejandro Perin
Alejandro Perin
Clifford Rim
Mujtaba Nicka
Ivar Paprocki
Aditya Kusko
Antonio Caudy
Jennifer Amigon
Jefferson Schemmer
Leon Oldroyd
Greenwood Bolognia
Emily Whobrey
Sinclair Waycott
Jones Vocelka
Maria Marrier
Jones Vocelka
Murillo Malet
Wickens Nestle
Ashley Doe
Darci Poquette
Arvin Albares
Ricardo Gaucho
Clifford Rim
Costa Dilliard
Ricardo Gaucho
Aruna Figeroa
Kadeem Flosi
Maria Marrier
David Darakjy
Aruna Figeroa
Izzy Garufi
James Butt
Greenwood Bolognia
Alejandro Perin
Maisha Rulapaugh
Arvin Albares
Aditya Kusko
Costa Dilliard
Jeanfrancois Venere
Greenwood Bolognia
Adams Morasca
IdCountryDate
1000Italy2025-09-21
1001Spain2025-09-29
1002Russia2025-10-05
1003United Kingdom2025-09-30
1004Germany2025-09-22
1005Australia2025-10-10
1006Russia2025-09-26
1007Spain2025-10-12
1008Germany2025-10-02
1009Japan2025-10-02
1010Brazil2025-10-02
1011United Kingdom2025-10-08
1012Spain2025-09-28
1013Australia2025-09-25
1014Australia2025-10-11
1015Russia2025-10-11
1016Spain2025-10-12
1017Russia2025-09-25
1018Canada2025-09-17
1019Australia2025-09-25
1020Argentina2025-10-16
1021France2025-09-19
1022Canada2025-09-21
1023Canada2025-10-12
1024Australia2025-10-15
1025India2025-09-24
1026United Kingdom2025-10-09
1027Canada2025-10-03
1028Japan2025-09-19
1029Canada2025-09-27
1030Spain2025-09-28
1031Russia2025-09-20
1032Italy2025-09-26
1033Canada2025-09-24
1034Japan2025-10-04
1035Russia2025-09-28
1036Brazil2025-10-16
1037Canada2025-09-28
1038Australia2025-10-10
1039India2025-10-12
1040Spain2025-09-17
1041Australia2025-10-10
1042Germany2025-10-09
1043Japan2025-10-15
1044India2025-10-04
1045Germany2025-10-04
1046Spain2025-09-25
1047United Kingdom2025-10-02
1048Italy2025-09-20
1049France2025-09-22

On-Demand Data

NameIdCountryDate
Rodrigues Campain1000United Kingdom2025-09-26
Ivar Paprocki1001Russia2025-09-30
Nicolas Iturbide1002United Kingdom2025-10-04
Leon Oldroyd1003Italy2025-09-30
Jones Vocelka1004France2025-10-08
Ivar Paprocki1005Germany2025-09-19
Adams Morasca1006Japan2025-10-01
Ashley Doe1007India2025-10-07
Silvio Slusarski1008India2025-10-04
Kadeem Flosi1009France2025-09-24
Jeanfrancois Venere1010France2025-09-28
Aruna Figeroa1011Brazil2025-09-28
Claire Tollner1012Australia2025-10-13
Antonio Caudy1013Canada2025-09-17
Octavia Malet1014India2025-09-30
Juan Wieser1015United Kingdom2025-10-10
Stacey Maclead1016India2025-10-04
Johnson Sergi1017India2025-10-14
Morrow Ruta1018Brazil2025-10-03
James Butt1019Brazil2025-09-21
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Nicolas IturbideBrazilIoni Bowcher NEGOTIATION
Salvatore StockhamUnited KingdomIvan Magalhaes RENEWAL
Leja CaldareraIndiaIoni Bowcher RENEWAL
Leja CaldareraSpainAnna Fali RENEWAL
James ButtRussiaElwin Sharvill PROPOSAL
Octavia MaletGermanyAmy Elsner NEGOTIATION
Mujtaba NickaIndiaOnyama Limba NEGOTIATION
Jones VocelkaIndiaAnna Fali PROPOSAL
Johnson SergiIndiaIvan Magalhaes PROPOSAL
Leja CaldareraAustraliaOnyama Limba QUALIFIED
Ivar PaprockiIndiaBernardo Dominic NEW
David DarakjyArgentinaAsiya Javayant QUALIFIED
Aika InouyeRussiaElwin Sharvill NEGOTIATION
David DarakjyItalyAnna Fali NEW
Antonio CaudyAustraliaAmy Elsner NEGOTIATION
Adams MorascaCanadaBernardo Dominic PROPOSAL
Mujtaba NickaItalyXuxue Feng PROPOSAL
Chavez BriddickFranceBernardo Dominic RENEWAL
Arvin AlbaresCanadaIvan Magalhaes UNQUALIFIED
Adams MorascaRussiaAnna Fali PROPOSAL
Wickens NestleSpainAnna Fali NEGOTIATION
Aika InouyeItalyXuxue Feng RENEWAL
Ivar PaprockiIndiaAmy Elsner NEW
Salvatore StockhamJapanOnyama Limba QUALIFIED
Aditya KuskoArgentinaAmy Elsner QUALIFIED
Rodrigues CampainRussiaAsiya Javayant UNQUALIFIED
Misaki RoysterUnited KingdomIvan Magalhaes NEW
Nicolas IturbideCanadaIvan Magalhaes UNQUALIFIED
Misaki RoysterAustraliaIoni Bowcher UNQUALIFIED
Antonio CaudyCanadaElwin Sharvill RENEWAL
Sinclair WaycottBrazilAnna Fali NEGOTIATION
Wickens NestleGermanyAsiya Javayant RENEWAL
Greenwood BologniaIndiaElwin Sharvill NEW
Tony FollerIndiaElwin Sharvill NEGOTIATION
Costa DilliardItalyXuxue Feng NEGOTIATION
Octavia MaletAustraliaAmy Elsner NEW
Silvio SlusarskiJapanOnyama Limba PROPOSAL
Izzy GarufiRussiaIvan Magalhaes UNQUALIFIED
Maisha RulapaughIndiaBernardo Dominic NEGOTIATION
Aruna FigeroaRussiaAsiya Javayant 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>