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
Julie StensethJapanIoni Bowcher NEW
Emily WhobreyFranceAnna Fali NEW
Silvio SlusarskiCanadaIvan Magalhaes QUALIFIED
Mayumi KolmetzCanadaElwin Sharvill NEGOTIATION
Clifford RimRussiaIoni Bowcher RENEWAL
Nicolas IturbideSpainBernardo Dominic PROPOSAL
Nicolas IturbideItalyAsiya Javayant UNQUALIFIED
Francesco ShinkoAustraliaAnna Fali PROPOSAL
Munro FerenczArgentinaAnna Fali NEGOTIATION
Wickens NestleGermanyIoni Bowcher RENEWAL
Tony FollerFranceIvan Magalhaes NEGOTIATION
Jeanfrancois VenereAustraliaOnyama Limba QUALIFIED
Costa DilliardRussiaBernardo Dominic PROPOSAL
Kadeem FlosiArgentinaElwin Sharvill NEGOTIATION
Murillo MaletSpainXuxue Feng RENEWAL
Deepesh ChuiCanadaOnyama Limba NEW
Ashley DoeSpainElwin Sharvill NEGOTIATION
Adams MorascaUnited KingdomBernardo Dominic PROPOSAL
Kadeem FlosiFranceXuxue Feng UNQUALIFIED
Aika InouyeArgentinaBernardo Dominic UNQUALIFIED
James ButtGermanyBernardo Dominic PROPOSAL
Smith GlickJapanIvan Magalhaes QUALIFIED
Rodrigues CampainUnited KingdomElwin Sharvill PROPOSAL
Alejandro PerinRussiaIoni Bowcher PROPOSAL
Jefferson SchemmerFranceOnyama Limba NEGOTIATION
Kaitlin OstroskyFranceBernardo Dominic NEGOTIATION
Clifford RimJapanAmy Elsner NEW
Kadeem FlosiSpainAsiya Javayant PROPOSAL
Mujtaba NickaIndiaIvan Magalhaes RENEWAL
Sinclair WaycottCanadaAsiya Javayant RENEWAL
Maria MarrierRussiaOnyama Limba UNQUALIFIED
Aruna FigeroaUnited KingdomElwin Sharvill RENEWAL
Smith GlickBrazilOnyama Limba PROPOSAL
Mujtaba NickaCanadaIoni Bowcher QUALIFIED
Emily WhobreyArgentinaStephen Shaw PROPOSAL
Murillo MaletSpainOnyama Limba NEGOTIATION
Morrow RutaUnited KingdomIoni Bowcher UNQUALIFIED
Aika InouyeArgentinaBernardo Dominic NEGOTIATION
Ricardo GauchoArgentinaIvan Magalhaes UNQUALIFIED
Alejandro PerinSpainBernardo Dominic PROPOSAL
Ivar PaprockiGermanyIoni Bowcher PROPOSAL
Leja CaldareraIndiaAmy Elsner RENEWAL
Nicolas IturbideSpainXuxue Feng NEW
Ivar PaprockiJapanAsiya Javayant UNQUALIFIED
Juan WieserSpainXuxue Feng NEW
Jeanfrancois VenereBrazilIvan Magalhaes NEW
Sinclair WaycottArgentinaAsiya Javayant RENEWAL
Octavia MaletIndiaStephen Shaw NEGOTIATION
Jennifer AmigonIndiaIvan Magalhaes RENEWAL
Claire TollnerAustraliaAsiya Javayant QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Munro FerenczBrazilBernardo Dominic RENEWAL
Misaki RoysterItalyBernardo Dominic PROPOSAL
Ricardo GauchoAustraliaAsiya Javayant UNQUALIFIED
Kaitlin OstroskyUnited KingdomAnna Fali UNQUALIFIED
Costa DilliardCanadaAsiya Javayant UNQUALIFIED
Jones VocelkaRussiaBernardo Dominic QUALIFIED
Izzy GarufiFranceAmy Elsner RENEWAL
Misaki RoysterSpainXuxue Feng PROPOSAL
Kadeem FlosiJapanElwin Sharvill NEGOTIATION
Izzy GarufiRussiaElwin Sharvill PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Costa DilliardRussia2025-09-11Buckley Miller Wright NEGOTIATION98Anna Fali
1001James ButtSpain2025-08-22Commercial Press QUALIFIED52Amy Elsner
1002Mayumi KolmetzGermany2025-09-01Rousseaux, Michael Esq QUALIFIED9Ioni Bowcher
1003Izzy GarufiJapan2025-09-08Printing Dimensions NEW26Ioni Bowcher
1004Kadeem FlosiSpain2025-08-30Morlong Associates QUALIFIED79Xuxue Feng
1005Munro FerenczBrazil2025-09-01Truhlar And Truhlar Attys RENEWAL48Onyama Limba
1006Juan WieserRussia2025-08-23Printing Dimensions QUALIFIED73Ioni Bowcher
1007Munro FerenczJapan2025-09-10Rangoni Of Florence NEGOTIATION53Ioni Bowcher
1008Juan WieserJapan2025-09-01Printing Dimensions NEGOTIATION76Anna Fali
1009Claire TollnerRussia2025-09-06Printing Dimensions QUALIFIED63Asiya Javayant
1010Claire TollnerItaly2025-09-05Chapman, Ross E Esq NEGOTIATION9Ivan Magalhaes
1011Alejandro PerinGermany2025-09-11Rousseaux, Michael Esq NEW44Bernardo Dominic
1012Ashley DoeBrazil2025-09-13Rangoni Of Florence QUALIFIED85Ivan Magalhaes
1013Wickens NestleUnited Kingdom2025-08-19Morlong Associates RENEWAL93Onyama Limba
1014Francesco ShinkoGermany2025-09-02King, Christopher A Esq RENEWAL60Ioni Bowcher
1015Salvatore StockhamJapan2025-09-15Printing Dimensions PROPOSAL66Onyama Limba
1016Salvatore StockhamFrance2025-08-25King, Christopher A Esq PROPOSAL61Stephen Shaw
1017Leon OldroydJapan2025-09-13Rousseaux, Michael Esq NEGOTIATION1Bernardo Dominic
1018Nicolas IturbideBrazil2025-08-20King, Christopher A Esq RENEWAL68Ioni Bowcher
1019Deepesh ChuiUnited Kingdom2025-09-14Benton, John B Jr NEW55Amy Elsner
1020Arvin AlbaresCanada2025-09-10Dorl, James J Esq QUALIFIED56Amy Elsner
1021Mayumi KolmetzRussia2025-09-04Rousseaux, Michael Esq NEGOTIATION53Xuxue Feng
1022Octavia MaletArgentina2025-08-21Benton, John B Jr RENEWAL59Onyama Limba
1023Greenwood BologniaCanada2025-08-26Printing Dimensions PROPOSAL28Stephen Shaw
1024Cody SaylorsItaly2025-08-29Rangoni Of Florence NEW13Stephen Shaw
1025Darci PoquetteFrance2025-09-01Morlong Associates NEW5Ioni Bowcher
1026Claire TollnerFrance2025-09-11Buckley Miller Wright QUALIFIED42Ivan Magalhaes
1027James ButtUnited Kingdom2025-09-05Benton, John B Jr UNQUALIFIED78Amy Elsner
1028Greenwood BologniaIndia2025-09-07Rangoni Of Florence QUALIFIED30Onyama Limba
1029Costa DilliardFrance2025-09-17King, Christopher A Esq PROPOSAL78Ioni Bowcher
1030Johnson SergiUnited Kingdom2025-08-20Morlong Associates RENEWAL14Asiya Javayant
1031Jeanfrancois VenereArgentina2025-08-26Chemel, James L Cpa RENEWAL87Ioni Bowcher
1032Misaki RoysterFrance2025-08-26Feltz Printing Service NEW78Stephen Shaw
1033Costa DilliardItaly2025-09-11Benton, John B Jr NEW53Xuxue Feng
1034Greenwood BologniaJapan2025-09-10Rousseaux, Michael Esq RENEWAL26Elwin Sharvill
1035Aruna FigeroaBrazil2025-09-09Rangoni Of Florence PROPOSAL2Xuxue Feng
1036Munro FerenczJapan2025-09-10Rangoni Of Florence NEGOTIATION25Ioni Bowcher
1037Morrow RutaGermany2025-09-11Printing Dimensions PROPOSAL78Anna Fali
1038Stacey MacleadRussia2025-09-04Truhlar And Truhlar Attys QUALIFIED47Bernardo Dominic
1039Francesco ShinkoBrazil2025-09-06Benton, John B Jr NEW12Stephen Shaw
1040Rodrigues CampainSpain2025-08-29Chanay, Jeffrey A Esq RENEWAL81Stephen Shaw
1041Jennifer AmigonRussia2025-09-11Commercial Press PROPOSAL98Onyama Limba
1042Nicolas IturbideSpain2025-09-02Feiner Bros NEW62Asiya Javayant
1043Smith GlickBrazil2025-09-17Benton, John B Jr QUALIFIED37Asiya Javayant
1044Leon OldroydAustralia2025-09-07Dorl, James J Esq NEGOTIATION89Xuxue Feng
1045Maria MarrierBrazil2025-08-29King, Christopher A Esq PROPOSAL2Onyama Limba
1046Jones VocelkaIndia2025-09-14Buckley Miller Wright UNQUALIFIED64Amy Elsner
1047Wickens NestleAustralia2025-09-08Benton, John B Jr PROPOSAL14Ioni Bowcher
1048Isabel BowleyBrazil2025-08-25King, Christopher A Esq NEW88Asiya Javayant
1049Aditya KuskoFrance2025-08-19Benton, John B Jr QUALIFIED66Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Munro FerenczIndiaBernardo Dominic PROPOSAL
Murillo MaletBrazilOnyama Limba QUALIFIED
Arvin AlbaresArgentinaIvan Magalhaes NEGOTIATION
David DarakjyGermanyAmy Elsner QUALIFIED
Kadeem FlosiIndiaIvan Magalhaes PROPOSAL
Darci PoquetteCanadaStephen Shaw UNQUALIFIED
Clifford RimCanadaIoni Bowcher PROPOSAL
Murillo MaletGermanyStephen Shaw QUALIFIED
Ashley DoeGermanyAmy Elsner NEW
Jennifer AmigonAustraliaElwin Sharvill RENEWAL
Mujtaba NickaSpainElwin Sharvill NEGOTIATION
Stacey MacleadBrazilAnna Fali PROPOSAL
Deepesh ChuiSpainIvan Magalhaes PROPOSAL
Stacey MacleadJapanAnna Fali RENEWAL
Aika InouyeAustraliaIvan Magalhaes PROPOSAL
Jeanfrancois VenereRussiaIvan Magalhaes RENEWAL
Aditya KuskoFranceIvan Magalhaes NEGOTIATION
Maisha RulapaughBrazilAsiya Javayant RENEWAL
Ricardo GauchoJapanBernardo Dominic RENEWAL
Leja CaldareraRussiaBernardo Dominic NEW
Johnson SergiUnited KingdomXuxue Feng QUALIFIED
Johnson SergiCanadaIvan Magalhaes NEGOTIATION
Tony FollerArgentinaBernardo Dominic RENEWAL
Sinclair WaycottJapanAnna Fali NEGOTIATION
Murillo MaletGermanyElwin Sharvill PROPOSAL
Kaitlin OstroskyFranceStephen Shaw QUALIFIED
Greenwood BologniaIndiaXuxue Feng RENEWAL
Arvin AlbaresArgentinaIoni Bowcher RENEWAL
Mayumi KolmetzCanadaIvan Magalhaes NEGOTIATION
Johnson SergiIndiaIvan Magalhaes RENEWAL
Silvio SlusarskiJapanIoni Bowcher QUALIFIED
Emily WhobreyArgentinaBernardo Dominic RENEWAL
Ashley DoeItalyAnna Fali QUALIFIED
Jones VocelkaCanadaStephen Shaw NEGOTIATION
Ricardo GauchoJapanStephen Shaw UNQUALIFIED
Salvatore StockhamAustraliaAsiya Javayant RENEWAL
Emily WhobreyBrazilIvan Magalhaes RENEWAL
Jones VocelkaGermanyOnyama Limba NEGOTIATION
Mujtaba NickaItalyIvan Magalhaes NEW
Chavez BriddickRussiaAsiya Javayant NEW
Alejandro PerinCanadaElwin Sharvill RENEWAL
Tony FollerUnited KingdomXuxue Feng NEGOTIATION
Johnson SergiGermanyStephen Shaw NEGOTIATION
Costa DilliardAustraliaAmy Elsner RENEWAL
Ivar PaprockiIndiaXuxue Feng NEW
Morrow RutaSpainIoni Bowcher QUALIFIED
Ricardo GauchoUnited KingdomOnyama Limba NEW
James ButtCanadaBernardo Dominic UNQUALIFIED
Chavez BriddickBrazilXuxue Feng NEGOTIATION
Aditya KuskoArgentinaAsiya Javayant PROPOSAL
Frozen Columns
Name
Aika Inouye
Claire Tollner
Jennifer Amigon
Murillo Malet
Sinclair Waycott
Claire Tollner
Claire Tollner
Rodrigues Campain
Chavez Briddick
Morrow Ruta
Jeanfrancois Venere
Deepesh Chui
Johnson Sergi
Clifford Rim
Tony Foller
Rodrigues Campain
Mayumi Kolmetz
Stacey Maclead
Johnson Sergi
Maria Marrier
Wickens Nestle
Jeanfrancois Venere
Faith Gillian
Deepesh Chui
Mayumi Kolmetz
Antonio Caudy
Johnson Sergi
David Darakjy
Isabel Bowley
James Butt
Arvin Albares
Maria Marrier
Isabel Bowley
Silvio Slusarski
Faith Gillian
Darci Poquette
Aditya Kusko
Rodrigues Campain
Mujtaba Nicka
Costa Dilliard
Adams Morasca
Greenwood Bolognia
Alejandro Perin
Morrow Ruta
Aditya Kusko
David Darakjy
Ricardo Gaucho
Isabel Bowley
Kaitlin Ostrosky
Faith Gillian
IdCountryDate
1000United Kingdom2025-09-15
1001Germany2025-09-05
1002France2025-09-15
1003France2025-09-07
1004Germany2025-09-03
1005Canada2025-08-31
1006Argentina2025-09-08
1007France2025-08-31
1008Canada2025-08-27
1009India2025-09-07
1010Japan2025-08-24
1011Australia2025-08-27
1012Russia2025-09-04
1013United Kingdom2025-08-19
1014Canada2025-08-27
1015Germany2025-09-11
1016Italy2025-09-02
1017Spain2025-09-13
1018Italy2025-09-17
1019Germany2025-09-06
1020Japan2025-08-31
1021Canada2025-09-12
1022Argentina2025-08-26
1023Canada2025-08-20
1024Germany2025-09-06
1025Russia2025-09-05
1026Canada2025-09-02
1027Russia2025-08-31
1028United Kingdom2025-08-31
1029Australia2025-08-19
1030France2025-09-06
1031Brazil2025-09-09
1032Canada2025-09-05
1033Germany2025-08-28
1034Canada2025-08-23
1035France2025-09-15
1036United Kingdom2025-09-06
1037Italy2025-09-12
1038France2025-09-09
1039India2025-08-21
1040United Kingdom2025-08-19
1041India2025-08-23
1042United Kingdom2025-09-09
1043Brazil2025-08-31
1044Japan2025-09-06
1045Russia2025-09-09
1046Canada2025-09-14
1047Japan2025-08-30
1048United Kingdom2025-08-28
1049Russia2025-09-16

On-Demand Data

NameIdCountryDate
Wickens Nestle1000Australia2025-08-30
Mayumi Kolmetz1001Canada2025-09-16
Mayumi Kolmetz1002Japan2025-08-22
Francesco Shinko1003Japan2025-09-01
Rodrigues Campain1004Russia2025-09-08
Jones Vocelka1005India2025-09-03
Wickens Nestle1006Russia2025-08-21
Antonio Caudy1007Argentina2025-08-31
Octavia Malet1008Spain2025-09-03
Francesco Shinko1009United Kingdom2025-08-23
Chavez Briddick1010United Kingdom2025-09-12
Darci Poquette1011United Kingdom2025-09-04
Costa Dilliard1012Brazil2025-09-07
Julie Stenseth1013Australia2025-08-20
Wickens Nestle1014India2025-08-24
Kadeem Flosi1015Japan2025-08-29
Aditya Kusko1016India2025-09-07
Isabel Bowley1017Spain2025-09-09
Juan Wieser1018France2025-09-09
Morrow Ruta1019United Kingdom2025-08-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Smith GlickAustraliaXuxue Feng NEW
Misaki RoysterIndiaElwin Sharvill PROPOSAL
Smith GlickBrazilIvan Magalhaes RENEWAL
Aruna FigeroaIndiaElwin Sharvill PROPOSAL
Antonio CaudyUnited KingdomIoni Bowcher RENEWAL
Morrow RutaBrazilXuxue Feng UNQUALIFIED
Tony FollerArgentinaIvan Magalhaes RENEWAL
Ivar PaprockiItalyBernardo Dominic NEGOTIATION
Aika InouyeUnited KingdomAsiya Javayant NEW
Francesco ShinkoJapanAnna Fali RENEWAL
Smith GlickCanadaXuxue Feng RENEWAL
Jefferson SchemmerAustraliaIoni Bowcher QUALIFIED
Antonio CaudyCanadaIoni Bowcher NEGOTIATION
Ivar PaprockiGermanyAmy Elsner UNQUALIFIED
Johnson SergiJapanIvan Magalhaes PROPOSAL
Ashley DoeIndiaElwin Sharvill NEW
Maisha RulapaughCanadaIoni Bowcher NEW
Misaki RoysterUnited KingdomElwin Sharvill UNQUALIFIED
Greenwood BologniaAustraliaAsiya Javayant RENEWAL
Jeanfrancois VenereUnited KingdomAnna Fali RENEWAL
Arvin AlbaresJapanIvan Magalhaes NEGOTIATION
Jones VocelkaIndiaStephen Shaw NEGOTIATION
Stacey MacleadSpainAnna Fali NEW
Kaitlin OstroskyGermanyIvan Magalhaes UNQUALIFIED
Arvin AlbaresIndiaOnyama Limba NEW
Arvin AlbaresSpainBernardo Dominic RENEWAL
Mujtaba NickaBrazilOnyama Limba QUALIFIED
Jefferson SchemmerItalyElwin Sharvill PROPOSAL
Maria MarrierAustraliaOnyama Limba QUALIFIED
Jefferson SchemmerGermanyOnyama Limba NEW
Aditya KuskoGermanyBernardo Dominic QUALIFIED
Stacey MacleadAustraliaIvan Magalhaes UNQUALIFIED
Misaki RoysterUnited KingdomAmy Elsner NEGOTIATION
Mujtaba NickaSpainIoni Bowcher UNQUALIFIED
Kaitlin OstroskySpainStephen Shaw QUALIFIED
Octavia MaletJapanElwin Sharvill NEGOTIATION
Isabel BowleyItalyAnna Fali NEGOTIATION
Tony FollerRussiaAmy Elsner QUALIFIED
David DarakjyFranceOnyama Limba UNQUALIFIED
Faith GillianIndiaStephen Shaw 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>