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
Jennifer AmigonArgentinaElwin Sharvill UNQUALIFIED
Alejandro PerinBrazilAsiya Javayant NEGOTIATION
Isabel BowleyGermanyOnyama Limba NEGOTIATION
Maisha RulapaughArgentinaAsiya Javayant RENEWAL
Maria MarrierSpainXuxue Feng NEGOTIATION
Antonio CaudyGermanyIvan Magalhaes PROPOSAL
Ricardo GauchoCanadaAnna Fali NEW
Arvin AlbaresGermanyIvan Magalhaes UNQUALIFIED
Stacey MacleadArgentinaAsiya Javayant NEGOTIATION
Julie StensethRussiaOnyama Limba PROPOSAL
Rodrigues CampainIndiaAsiya Javayant UNQUALIFIED
Aditya KuskoArgentinaXuxue Feng NEW
Aika InouyeFranceAmy Elsner NEGOTIATION
Faith GillianBrazilAmy Elsner NEGOTIATION
Jefferson SchemmerSpainBernardo Dominic RENEWAL
Mujtaba NickaSpainAnna Fali RENEWAL
Isabel BowleyFranceStephen Shaw QUALIFIED
Kadeem FlosiJapanElwin Sharvill PROPOSAL
Faith GillianRussiaAsiya Javayant PROPOSAL
Maisha RulapaughJapanElwin Sharvill NEW
Nicolas IturbideAustraliaAnna Fali PROPOSAL
Cody SaylorsAustraliaAmy Elsner QUALIFIED
Kadeem FlosiAustraliaAsiya Javayant NEW
Smith GlickRussiaAsiya Javayant PROPOSAL
Francesco ShinkoGermanyAsiya Javayant UNQUALIFIED
Costa DilliardAustraliaElwin Sharvill QUALIFIED
Silvio SlusarskiItalyIvan Magalhaes NEW
Maria MarrierGermanyAnna Fali UNQUALIFIED
Jennifer AmigonUnited KingdomAmy Elsner NEGOTIATION
Francesco ShinkoJapanElwin Sharvill NEGOTIATION
Smith GlickBrazilIvan Magalhaes NEGOTIATION
Izzy GarufiItalyIoni Bowcher UNQUALIFIED
Julie StensethRussiaAnna Fali QUALIFIED
Mujtaba NickaAustraliaAsiya Javayant QUALIFIED
Greenwood BologniaFranceIvan Magalhaes NEW
Juan WieserGermanyStephen Shaw RENEWAL
Leja CaldareraFranceBernardo Dominic NEGOTIATION
Kaitlin OstroskyArgentinaStephen Shaw QUALIFIED
Maisha RulapaughUnited KingdomOnyama Limba NEW
Aruna FigeroaUnited KingdomXuxue Feng RENEWAL
Salvatore StockhamRussiaAnna Fali PROPOSAL
Darci PoquetteAustraliaAnna Fali QUALIFIED
Izzy GarufiArgentinaStephen Shaw NEGOTIATION
Mujtaba NickaCanadaStephen Shaw PROPOSAL
Tony FollerRussiaStephen Shaw NEGOTIATION
Stacey MacleadFranceAsiya Javayant QUALIFIED
Wickens NestleSpainStephen Shaw RENEWAL
Ashley DoeGermanyAnna Fali NEW
Clifford RimGermanyAnna Fali NEW
Isabel BowleyCanadaElwin Sharvill RENEWAL
Horizontal
NameCountryRepresentativeStatus
Rodrigues CampainJapanAnna Fali PROPOSAL
Ivar PaprockiJapanXuxue Feng QUALIFIED
Misaki RoysterBrazilIvan Magalhaes UNQUALIFIED
Misaki RoysterJapanAnna Fali QUALIFIED
Adams MorascaSpainIvan Magalhaes NEW
Sinclair WaycottArgentinaOnyama Limba NEGOTIATION
Izzy GarufiRussiaAnna Fali NEW
Adams MorascaSpainStephen Shaw QUALIFIED
Darci PoquetteItalyAmy Elsner PROPOSAL
Aruna FigeroaGermanyBernardo Dominic RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Munro FerenczSpain2025-09-08Feltz Printing Service NEW49Ivan Magalhaes
1001Aditya KuskoAustralia2025-08-16Feiner Bros NEW33Ioni Bowcher
1002Jefferson SchemmerUnited Kingdom2025-09-04Printing Dimensions NEW76Anna Fali
1003Jefferson SchemmerUnited Kingdom2025-08-25King, Christopher A Esq PROPOSAL79Ivan Magalhaes
1004Ivar PaprockiIndia2025-08-19Rangoni Of Florence QUALIFIED60Onyama Limba
1005Costa DilliardCanada2025-08-30Morlong Associates NEW40Elwin Sharvill
1006Mayumi KolmetzRussia2025-08-30Morlong Associates UNQUALIFIED40Stephen Shaw
1007Morrow RutaArgentina2025-09-03Dorl, James J Esq NEGOTIATION90Xuxue Feng
1008Johnson SergiItaly2025-09-03Chanay, Jeffrey A Esq NEW16Xuxue Feng
1009Kaitlin OstroskyIndia2025-08-13Rangoni Of Florence UNQUALIFIED43Amy Elsner
1010Mujtaba NickaSpain2025-08-22King, Christopher A Esq QUALIFIED22Xuxue Feng
1011Tony FollerFrance2025-09-02Rousseaux, Michael Esq PROPOSAL77Anna Fali
1012Aruna FigeroaFrance2025-08-18Morlong Associates RENEWAL77Ioni Bowcher
1013James ButtAustralia2025-09-01Printing Dimensions NEW21Asiya Javayant
1014Ivar PaprockiAustralia2025-08-21Commercial Press RENEWAL90Stephen Shaw
1015Adams MorascaIndia2025-08-25Dorl, James J Esq NEGOTIATION1Asiya Javayant
1016Jennifer AmigonIndia2025-09-02Buckley Miller Wright NEGOTIATION68Stephen Shaw
1017Ricardo GauchoBrazil2025-09-09Morlong Associates QUALIFIED20Anna Fali
1018James ButtRussia2025-08-14Chemel, James L Cpa NEW40Anna Fali
1019Juan WieserArgentina2025-08-19Chemel, James L Cpa NEW94Ivan Magalhaes
1020Aditya KuskoGermany2025-09-06Chanay, Jeffrey A Esq QUALIFIED83Amy Elsner
1021Emily WhobreyAustralia2025-08-18Morlong Associates UNQUALIFIED13Anna Fali
1022Greenwood BologniaJapan2025-08-22Rangoni Of Florence QUALIFIED61Asiya Javayant
1023Jeanfrancois VenereGermany2025-09-02Feiner Bros NEGOTIATION46Asiya Javayant
1024Kadeem FlosiAustralia2025-08-23Rousseaux, Michael Esq NEW60Bernardo Dominic
1025Antonio CaudyJapan2025-08-26Rousseaux, Michael Esq NEW19Stephen Shaw
1026Mayumi KolmetzSpain2025-09-06Chapman, Ross E Esq UNQUALIFIED41Xuxue Feng
1027Claire TollnerGermany2025-08-25Chanay, Jeffrey A Esq NEW34Onyama Limba
1028Antonio CaudyUnited Kingdom2025-09-06King, Christopher A Esq NEGOTIATION12Ioni Bowcher
1029Ivar PaprockiRussia2025-08-14Chapman, Ross E Esq RENEWAL3Anna Fali
1030Jones VocelkaArgentina2025-08-30Buckley Miller Wright NEGOTIATION79Amy Elsner
1031Francesco ShinkoFrance2025-09-04Chanay, Jeffrey A Esq UNQUALIFIED20Amy Elsner
1032Julie StensethJapan2025-08-30Printing Dimensions RENEWAL50Stephen Shaw
1033Jefferson SchemmerBrazil2025-08-14Rousseaux, Michael Esq NEW54Bernardo Dominic
1034Jennifer AmigonSpain2025-08-21Truhlar And Truhlar Attys PROPOSAL86Ioni Bowcher
1035Silvio SlusarskiFrance2025-09-07Truhlar And Truhlar Attys NEW19Asiya Javayant
1036David DarakjyBrazil2025-09-02Rousseaux, Michael Esq UNQUALIFIED72Stephen Shaw
1037Leja CaldareraJapan2025-08-25Benton, John B Jr RENEWAL26Stephen Shaw
1038Maria MarrierUnited Kingdom2025-08-25Chemel, James L Cpa QUALIFIED63Stephen Shaw
1039Leja CaldareraItaly2025-08-17Rousseaux, Michael Esq PROPOSAL76Anna Fali
1040Smith GlickSpain2025-08-20Benton, John B Jr NEGOTIATION85Ioni Bowcher
1041Cody SaylorsFrance2025-08-20Dorl, James J Esq PROPOSAL70Elwin Sharvill
1042Emily WhobreyRussia2025-08-18Dorl, James J Esq NEGOTIATION80Asiya Javayant
1043Adams MorascaArgentina2025-08-26Dorl, James J Esq QUALIFIED6Elwin Sharvill
1044Stacey MacleadFrance2025-08-21Rangoni Of Florence RENEWAL83Asiya Javayant
1045Greenwood BologniaRussia2025-08-15Feltz Printing Service NEGOTIATION51Elwin Sharvill
1046Jeanfrancois VenereUnited Kingdom2025-09-04Chemel, James L Cpa UNQUALIFIED0Amy Elsner
1047Antonio CaudyItaly2025-08-13Printing Dimensions UNQUALIFIED98Anna Fali
1048Mujtaba NickaAustralia2025-08-25King, Christopher A Esq RENEWAL61Elwin Sharvill
1049Jefferson SchemmerRussia2025-08-24Buckley Miller Wright NEW59Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Mayumi KolmetzBrazilElwin Sharvill NEGOTIATION
Adams MorascaAustraliaElwin Sharvill NEW
Darci PoquetteGermanyIoni Bowcher QUALIFIED
Ivar PaprockiBrazilIoni Bowcher QUALIFIED
Aika InouyeRussiaIvan Magalhaes NEW
Smith GlickFranceAmy Elsner RENEWAL
Leon OldroydUnited KingdomOnyama Limba NEW
Darci PoquetteFranceBernardo Dominic PROPOSAL
Jones VocelkaGermanyBernardo Dominic NEW
Leja CaldareraBrazilAmy Elsner UNQUALIFIED
Julie StensethAustraliaBernardo Dominic UNQUALIFIED
Ivar PaprockiBrazilElwin Sharvill NEW
Chavez BriddickItalyAmy Elsner RENEWAL
Ashley DoeBrazilIvan Magalhaes UNQUALIFIED
Francesco ShinkoSpainAsiya Javayant NEGOTIATION
Maria MarrierCanadaIvan Magalhaes RENEWAL
Julie StensethSpainOnyama Limba NEGOTIATION
Kaitlin OstroskyItalyElwin Sharvill QUALIFIED
Kaitlin OstroskyItalyAnna Fali UNQUALIFIED
Mayumi KolmetzAustraliaIoni Bowcher PROPOSAL
Darci PoquetteArgentinaOnyama Limba UNQUALIFIED
Ivar PaprockiGermanyXuxue Feng QUALIFIED
Silvio SlusarskiAustraliaAnna Fali RENEWAL
Jeanfrancois VenereItalyElwin Sharvill QUALIFIED
Mayumi KolmetzJapanStephen Shaw NEW
Julie StensethSpainStephen Shaw NEGOTIATION
Jennifer AmigonIndiaAsiya Javayant QUALIFIED
Kadeem FlosiFranceElwin Sharvill NEW
James ButtSpainOnyama Limba QUALIFIED
Antonio CaudyItalyAsiya Javayant UNQUALIFIED
Mayumi KolmetzArgentinaOnyama Limba NEGOTIATION
Jeanfrancois VenereCanadaAsiya Javayant NEGOTIATION
Leja CaldareraRussiaBernardo Dominic PROPOSAL
Ricardo GauchoAustraliaAmy Elsner NEGOTIATION
Nicolas IturbideUnited KingdomElwin Sharvill PROPOSAL
Jefferson SchemmerSpainAsiya Javayant NEW
Leja CaldareraSpainBernardo Dominic NEGOTIATION
Greenwood BologniaAustraliaOnyama Limba NEGOTIATION
Arvin AlbaresFranceAnna Fali QUALIFIED
Clifford RimCanadaIoni Bowcher QUALIFIED
Adams MorascaSpainBernardo Dominic RENEWAL
Misaki RoysterAustraliaIvan Magalhaes NEW
Johnson SergiFranceOnyama Limba UNQUALIFIED
Emily WhobreyArgentinaAsiya Javayant NEGOTIATION
Clifford RimIndiaOnyama Limba NEW
Kadeem FlosiBrazilStephen Shaw NEW
Misaki RoysterAustraliaBernardo Dominic NEGOTIATION
Faith GillianUnited KingdomIoni Bowcher NEW
Juan WieserItalyAmy Elsner RENEWAL
Ricardo GauchoGermanyIoni Bowcher QUALIFIED
Frozen Columns
Name
James Butt
Arvin Albares
Darci Poquette
Jeanfrancois Venere
Chavez Briddick
Cody Saylors
Misaki Royster
Claire Tollner
Darci Poquette
Julie Stenseth
Mayumi Kolmetz
Jennifer Amigon
Jones Vocelka
Darci Poquette
Ivar Paprocki
Adams Morasca
Izzy Garufi
Murillo Malet
Silvio Slusarski
Adams Morasca
Darci Poquette
Leon Oldroyd
Costa Dilliard
Aika Inouye
Misaki Royster
Aditya Kusko
Jennifer Amigon
Morrow Ruta
Emily Whobrey
Chavez Briddick
Alejandro Perin
Johnson Sergi
Kaitlin Ostrosky
Kaitlin Ostrosky
Mujtaba Nicka
Jones Vocelka
Francesco Shinko
Alejandro Perin
Nicolas Iturbide
Sinclair Waycott
Maisha Rulapaugh
David Darakjy
Jeanfrancois Venere
Morrow Ruta
Deepesh Chui
Ashley Doe
Jones Vocelka
Costa Dilliard
Silvio Slusarski
Faith Gillian
IdCountryDate
1000Australia2025-08-26
1001United Kingdom2025-09-03
1002Australia2025-08-13
1003France2025-09-03
1004Russia2025-08-31
1005Argentina2025-08-18
1006Italy2025-08-23
1007Australia2025-08-11
1008Canada2025-08-18
1009Japan2025-08-18
1010Spain2025-08-17
1011India2025-09-09
1012Japan2025-09-05
1013United Kingdom2025-08-27
1014Spain2025-09-03
1015Italy2025-08-13
1016France2025-09-08
1017India2025-09-01
1018United Kingdom2025-08-18
1019United Kingdom2025-08-23
1020Japan2025-08-18
1021Spain2025-08-31
1022Brazil2025-08-28
1023India2025-08-14
1024Japan2025-08-21
1025India2025-08-23
1026Germany2025-08-21
1027Argentina2025-08-22
1028Brazil2025-09-01
1029Brazil2025-08-22
1030Germany2025-08-25
1031Canada2025-08-18
1032India2025-08-12
1033Australia2025-09-06
1034Spain2025-09-01
1035France2025-08-22
1036Australia2025-08-19
1037Germany2025-08-11
1038Canada2025-09-07
1039Brazil2025-08-16
1040Germany2025-09-03
1041France2025-09-09
1042Argentina2025-08-14
1043Germany2025-08-31
1044Russia2025-08-14
1045Italy2025-09-05
1046Spain2025-08-29
1047Argentina2025-08-16
1048Argentina2025-09-03
1049Russia2025-08-22

On-Demand Data

NameIdCountryDate
Julie Stenseth1000Russia2025-08-31
Claire Tollner1001Brazil2025-08-24
Munro Ferencz1002India2025-09-09
Jefferson Schemmer1003Italy2025-08-19
Munro Ferencz1004Argentina2025-08-23
Ricardo Gaucho1005Italy2025-08-16
James Butt1006Italy2025-08-19
Leon Oldroyd1007Italy2025-08-18
Jeanfrancois Venere1008Brazil2025-08-31
Maria Marrier1009India2025-09-06
Julie Stenseth1010Japan2025-09-02
Greenwood Bolognia1011Brazil2025-08-12
Munro Ferencz1012Italy2025-09-06
Ivar Paprocki1013Australia2025-08-30
Rodrigues Campain1014Canada2025-08-17
Octavia Malet1015Spain2025-08-14
Jeanfrancois Venere1016Argentina2025-08-21
Ricardo Gaucho1017Germany2025-08-23
Jefferson Schemmer1018Canada2025-08-20
Tony Foller1019Australia2025-08-21
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
David DarakjyCanadaAmy Elsner UNQUALIFIED
Tony FollerAustraliaOnyama Limba PROPOSAL
Jennifer AmigonSpainIvan Magalhaes UNQUALIFIED
Wickens NestleJapanAsiya Javayant RENEWAL
Ashley DoeCanadaAnna Fali RENEWAL
Ivar PaprockiSpainIoni Bowcher RENEWAL
Emily WhobreyUnited KingdomStephen Shaw QUALIFIED
Mayumi KolmetzItalyAnna Fali QUALIFIED
Mujtaba NickaJapanAnna Fali PROPOSAL
Aditya KuskoGermanyElwin Sharvill NEW
Munro FerenczFranceOnyama Limba NEW
Adams MorascaGermanyAnna Fali PROPOSAL
Ricardo GauchoItalyStephen Shaw RENEWAL
Octavia MaletBrazilOnyama Limba QUALIFIED
Leon OldroydArgentinaXuxue Feng NEGOTIATION
Aditya KuskoRussiaElwin Sharvill PROPOSAL
Aditya KuskoAustraliaIvan Magalhaes PROPOSAL
Costa DilliardIndiaIvan Magalhaes NEW
Juan WieserGermanyIvan Magalhaes RENEWAL
Darci PoquetteUnited KingdomXuxue Feng PROPOSAL
Sinclair WaycottCanadaStephen Shaw RENEWAL
Emily WhobreyRussiaAnna Fali PROPOSAL
Alejandro PerinGermanyXuxue Feng NEW
Greenwood BologniaRussiaXuxue Feng PROPOSAL
Izzy GarufiBrazilElwin Sharvill PROPOSAL
Cody SaylorsBrazilAsiya Javayant NEGOTIATION
Claire TollnerFranceIvan Magalhaes PROPOSAL
Murillo MaletUnited KingdomStephen Shaw QUALIFIED
Aruna FigeroaAustraliaAnna Fali NEW
Rodrigues CampainGermanyAsiya Javayant QUALIFIED
Costa DilliardJapanAsiya Javayant PROPOSAL
Jeanfrancois VenereGermanyStephen Shaw QUALIFIED
Francesco ShinkoSpainAsiya Javayant UNQUALIFIED
Mujtaba NickaGermanyIvan Magalhaes UNQUALIFIED
Arvin AlbaresCanadaAmy Elsner QUALIFIED
Arvin AlbaresUnited KingdomAmy Elsner UNQUALIFIED
Morrow RutaSpainIoni Bowcher RENEWAL
Silvio SlusarskiSpainElwin Sharvill NEW
Arvin AlbaresJapanBernardo Dominic PROPOSAL
Aika InouyeSpainOnyama Limba 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>