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
Ricardo GauchoBrazilOnyama Limba NEGOTIATION
Deepesh ChuiAustraliaAmy Elsner NEGOTIATION
Leja CaldareraCanadaElwin Sharvill NEGOTIATION
Jefferson SchemmerArgentinaAnna Fali PROPOSAL
Rodrigues CampainUnited KingdomXuxue Feng NEGOTIATION
Juan WieserFranceAsiya Javayant PROPOSAL
Adams MorascaBrazilBernardo Dominic UNQUALIFIED
Deepesh ChuiUnited KingdomXuxue Feng UNQUALIFIED
Wickens NestleBrazilElwin Sharvill NEGOTIATION
Jefferson SchemmerRussiaAsiya Javayant NEW
Aruna FigeroaFranceAmy Elsner UNQUALIFIED
Salvatore StockhamBrazilAsiya Javayant UNQUALIFIED
Emily WhobreyGermanyIvan Magalhaes NEGOTIATION
Kadeem FlosiBrazilAsiya Javayant PROPOSAL
Deepesh ChuiIndiaStephen Shaw PROPOSAL
Munro FerenczAustraliaIvan Magalhaes QUALIFIED
Stacey MacleadCanadaIvan Magalhaes RENEWAL
Tony FollerUnited KingdomIoni Bowcher RENEWAL
Alejandro PerinCanadaXuxue Feng QUALIFIED
Ashley DoeAustraliaIvan Magalhaes RENEWAL
Salvatore StockhamCanadaBernardo Dominic UNQUALIFIED
Mujtaba NickaBrazilAmy Elsner UNQUALIFIED
Morrow RutaFranceStephen Shaw UNQUALIFIED
Kaitlin OstroskyGermanyIvan Magalhaes NEGOTIATION
Munro FerenczJapanAsiya Javayant RENEWAL
Izzy GarufiUnited KingdomAmy Elsner RENEWAL
Chavez BriddickAustraliaOnyama Limba NEW
Greenwood BologniaJapanIoni Bowcher UNQUALIFIED
Kaitlin OstroskySpainAnna Fali UNQUALIFIED
Jefferson SchemmerArgentinaIoni Bowcher NEW
Murillo MaletBrazilOnyama Limba UNQUALIFIED
Maria MarrierSpainAsiya Javayant UNQUALIFIED
Jeanfrancois VenereGermanyAmy Elsner PROPOSAL
Cody SaylorsBrazilOnyama Limba QUALIFIED
Greenwood BologniaAustraliaXuxue Feng NEW
Greenwood BologniaUnited KingdomAsiya Javayant NEGOTIATION
James ButtFranceAsiya Javayant PROPOSAL
Arvin AlbaresSpainElwin Sharvill PROPOSAL
Murillo MaletFranceIvan Magalhaes PROPOSAL
Mujtaba NickaFranceBernardo Dominic QUALIFIED
David DarakjyArgentinaOnyama Limba NEW
Kadeem FlosiItalyStephen Shaw QUALIFIED
Maisha RulapaughRussiaAnna Fali NEGOTIATION
Faith GillianGermanyIoni Bowcher UNQUALIFIED
Sinclair WaycottSpainIoni Bowcher UNQUALIFIED
Darci PoquetteUnited KingdomBernardo Dominic UNQUALIFIED
Ricardo GauchoRussiaIvan Magalhaes UNQUALIFIED
Clifford RimAustraliaAnna Fali NEW
Faith GillianAustraliaStephen Shaw RENEWAL
Johnson SergiItalyBernardo Dominic NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Stacey MacleadCanadaIvan Magalhaes UNQUALIFIED
Nicolas IturbideGermanyAsiya Javayant RENEWAL
Aruna FigeroaIndiaBernardo Dominic RENEWAL
Arvin AlbaresIndiaOnyama Limba PROPOSAL
Chavez BriddickRussiaAnna Fali UNQUALIFIED
Ivar PaprockiJapanIoni Bowcher RENEWAL
Octavia MaletRussiaStephen Shaw RENEWAL
Costa DilliardFranceIvan Magalhaes QUALIFIED
Murillo MaletRussiaIvan Magalhaes PROPOSAL
Kaitlin OstroskyBrazilAmy Elsner NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Wickens NestleFrance2026-05-18Chanay, Jeffrey A Esq UNQUALIFIED60Amy Elsner
1001Arvin AlbaresGermany2026-05-14Dorl, James J Esq RENEWAL69Amy Elsner
1002Ricardo GauchoArgentina2026-05-06Commercial Press RENEWAL98Bernardo Dominic
1003Misaki RoysterArgentina2026-04-29Printing Dimensions UNQUALIFIED18Ioni Bowcher
1004Silvio SlusarskiSpain2026-05-21Rousseaux, Michael Esq PROPOSAL55Ioni Bowcher
1005Tony FollerJapan2026-05-18Feiner Bros UNQUALIFIED78Anna Fali
1006Maria MarrierFrance2026-04-27Rousseaux, Michael Esq RENEWAL79Amy Elsner
1007Mujtaba NickaRussia2026-05-02Rangoni Of Florence RENEWAL2Asiya Javayant
1008Ricardo GauchoBrazil2026-05-18Chapman, Ross E Esq PROPOSAL77Anna Fali
1009Rodrigues CampainArgentina2026-04-30Truhlar And Truhlar Attys QUALIFIED98Anna Fali
1010Izzy GarufiAustralia2026-05-03Morlong Associates QUALIFIED13Bernardo Dominic
1011Jeanfrancois VenereCanada2026-05-07Benton, John B Jr RENEWAL91Bernardo Dominic
1012Morrow RutaRussia2026-05-18King, Christopher A Esq QUALIFIED66Ivan Magalhaes
1013Ivar PaprockiUnited Kingdom2026-05-16Chemel, James L Cpa PROPOSAL71Amy Elsner
1014Jeanfrancois VenereJapan2026-05-04Chanay, Jeffrey A Esq QUALIFIED41Amy Elsner
1015Juan WieserIndia2026-05-13Feltz Printing Service UNQUALIFIED57Anna Fali
1016Izzy GarufiGermany2026-05-12Chemel, James L Cpa QUALIFIED91Asiya Javayant
1017Francesco ShinkoSpain2026-04-29Chemel, James L Cpa PROPOSAL81Bernardo Dominic
1018Jennifer AmigonGermany2026-04-23Morlong Associates UNQUALIFIED65Onyama Limba
1019Juan WieserBrazil2026-05-14Commercial Press PROPOSAL23Stephen Shaw
1020Tony FollerFrance2026-05-19Commercial Press QUALIFIED17Onyama Limba
1021Aika InouyeUnited Kingdom2026-05-17Commercial Press RENEWAL35Bernardo Dominic
1022Maisha RulapaughUnited Kingdom2026-04-23Printing Dimensions NEW30Ioni Bowcher
1023Octavia MaletJapan2026-04-22Benton, John B Jr QUALIFIED40Asiya Javayant
1024Costa DilliardUnited Kingdom2026-05-10Truhlar And Truhlar Attys NEW90Bernardo Dominic
1025Morrow RutaRussia2026-05-20Rousseaux, Michael Esq PROPOSAL49Ivan Magalhaes
1026Octavia MaletFrance2026-05-08Morlong Associates PROPOSAL50Ivan Magalhaes
1027Aruna FigeroaAustralia2026-05-06Dorl, James J Esq PROPOSAL90Stephen Shaw
1028Mujtaba NickaGermany2026-05-01Chemel, James L Cpa PROPOSAL81Anna Fali
1029Rodrigues CampainSpain2026-05-05Chapman, Ross E Esq NEGOTIATION97Asiya Javayant
1030Stacey MacleadAustralia2026-04-24Feiner Bros UNQUALIFIED28Anna Fali
1031Rodrigues CampainIndia2026-05-19Chanay, Jeffrey A Esq NEGOTIATION81Xuxue Feng
1032Ricardo GauchoArgentina2026-05-17Feltz Printing Service UNQUALIFIED69Xuxue Feng
1033Octavia MaletRussia2026-04-23Feltz Printing Service QUALIFIED5Ioni Bowcher
1034Jeanfrancois VenereArgentina2026-05-02Printing Dimensions QUALIFIED35Anna Fali
1035Aditya KuskoUnited Kingdom2026-05-12Rangoni Of Florence QUALIFIED83Asiya Javayant
1036Darci PoquetteJapan2026-05-16Chanay, Jeffrey A Esq PROPOSAL91Asiya Javayant
1037Aditya KuskoRussia2026-05-01Chemel, James L Cpa NEW39Ivan Magalhaes
1038Mujtaba NickaAustralia2026-05-08Chemel, James L Cpa QUALIFIED74Anna Fali
1039Clifford RimCanada2026-04-23Chanay, Jeffrey A Esq QUALIFIED49Anna Fali
1040Jeanfrancois VenereUnited Kingdom2026-04-22Morlong Associates NEGOTIATION92Amy Elsner
1041Francesco ShinkoFrance2026-05-01Chemel, James L Cpa PROPOSAL78Anna Fali
1042Salvatore StockhamRussia2026-05-20Commercial Press PROPOSAL7Asiya Javayant
1043Alejandro PerinRussia2026-05-19Commercial Press NEW99Ivan Magalhaes
1044Kadeem FlosiCanada2026-05-11Printing Dimensions RENEWAL16Onyama Limba
1045Aruna FigeroaIndia2026-05-03Printing Dimensions NEGOTIATION19Elwin Sharvill
1046Stacey MacleadItaly2026-05-13Benton, John B Jr QUALIFIED72Elwin Sharvill
1047Leja CaldareraRussia2026-05-12Chemel, James L Cpa RENEWAL99Bernardo Dominic
1048Nicolas IturbideArgentina2026-05-12Printing Dimensions RENEWAL6Bernardo Dominic
1049Kadeem FlosiIndia2026-05-13Benton, John B Jr NEGOTIATION55Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Maisha RulapaughArgentinaStephen Shaw RENEWAL
Jefferson SchemmerJapanAsiya Javayant NEGOTIATION
Silvio SlusarskiUnited KingdomStephen Shaw RENEWAL
Faith GillianRussiaAnna Fali UNQUALIFIED
Ricardo GauchoBrazilAsiya Javayant QUALIFIED
Julie StensethRussiaAmy Elsner RENEWAL
Francesco ShinkoArgentinaOnyama Limba RENEWAL
David DarakjyGermanyAnna Fali QUALIFIED
Deepesh ChuiIndiaAsiya Javayant PROPOSAL
Jeanfrancois VenereIndiaIoni Bowcher PROPOSAL
Stacey MacleadBrazilIvan Magalhaes UNQUALIFIED
Kadeem FlosiJapanBernardo Dominic QUALIFIED
Misaki RoysterUnited KingdomXuxue Feng UNQUALIFIED
Jones VocelkaRussiaBernardo Dominic NEW
Ricardo GauchoBrazilIvan Magalhaes NEGOTIATION
Jefferson SchemmerFranceXuxue Feng PROPOSAL
Misaki RoysterArgentinaIoni Bowcher NEW
Julie StensethGermanyIvan Magalhaes NEGOTIATION
Alejandro PerinItalyXuxue Feng NEGOTIATION
Silvio SlusarskiRussiaElwin Sharvill UNQUALIFIED
Ricardo GauchoArgentinaStephen Shaw NEGOTIATION
Maisha RulapaughRussiaStephen Shaw NEW
Leja CaldareraAustraliaIoni Bowcher PROPOSAL
Chavez BriddickRussiaStephen Shaw RENEWAL
Clifford RimSpainOnyama Limba NEW
Ivar PaprockiUnited KingdomElwin Sharvill QUALIFIED
Murillo MaletIndiaIvan Magalhaes NEGOTIATION
Smith GlickFranceStephen Shaw QUALIFIED
Adams MorascaIndiaElwin Sharvill PROPOSAL
Izzy GarufiUnited KingdomAnna Fali NEW
Francesco ShinkoJapanElwin Sharvill QUALIFIED
Ashley DoeCanadaXuxue Feng RENEWAL
Murillo MaletIndiaIoni Bowcher NEW
Murillo MaletItalyStephen Shaw UNQUALIFIED
Arvin AlbaresGermanyXuxue Feng NEW
Stacey MacleadFranceAmy Elsner NEW
Mujtaba NickaAustraliaXuxue Feng PROPOSAL
Nicolas IturbideIndiaAmy Elsner NEGOTIATION
Greenwood BologniaGermanyElwin Sharvill QUALIFIED
Leon OldroydGermanyXuxue Feng UNQUALIFIED
Mujtaba NickaJapanOnyama Limba QUALIFIED
Misaki RoysterAustraliaAnna Fali UNQUALIFIED
Greenwood BologniaFranceBernardo Dominic NEGOTIATION
Rodrigues CampainRussiaBernardo Dominic NEGOTIATION
Emily WhobreyCanadaBernardo Dominic RENEWAL
Clifford RimUnited KingdomOnyama Limba NEGOTIATION
Murillo MaletCanadaOnyama Limba PROPOSAL
Kadeem FlosiIndiaAsiya Javayant NEGOTIATION
Johnson SergiAustraliaIvan Magalhaes QUALIFIED
Ivar PaprockiCanadaBernardo Dominic NEGOTIATION
Frozen Columns
Name
Mayumi Kolmetz
Isabel Bowley
Aruna Figeroa
Cody Saylors
Maisha Rulapaugh
Tony Foller
Morrow Ruta
Morrow Ruta
Costa Dilliard
Kadeem Flosi
Faith Gillian
Emily Whobrey
Rodrigues Campain
Costa Dilliard
Stacey Maclead
Kaitlin Ostrosky
Ivar Paprocki
Deepesh Chui
David Darakjy
Aika Inouye
Morrow Ruta
Misaki Royster
Morrow Ruta
Misaki Royster
Stacey Maclead
Murillo Malet
Darci Poquette
Mujtaba Nicka
Julie Stenseth
Ashley Doe
Juan Wieser
Jennifer Amigon
Kadeem Flosi
Salvatore Stockham
Jones Vocelka
Adams Morasca
Aruna Figeroa
Kaitlin Ostrosky
Claire Tollner
James Butt
Isabel Bowley
Clifford Rim
Mujtaba Nicka
Johnson Sergi
Clifford Rim
Aika Inouye
Leon Oldroyd
Morrow Ruta
Maria Marrier
Munro Ferencz
IdCountryDate
1000Canada2026-05-18
1001Brazil2026-04-27
1002India2026-04-24
1003France2026-05-06
1004Australia2026-04-27
1005United Kingdom2026-05-08
1006India2026-05-09
1007Japan2026-05-07
1008France2026-04-23
1009Brazil2026-04-26
1010Australia2026-05-09
1011Japan2026-04-26
1012Argentina2026-04-22
1013Russia2026-05-14
1014Spain2026-05-03
1015Spain2026-04-29
1016Italy2026-04-23
1017Australia2026-05-21
1018France2026-05-20
1019Argentina2026-04-23
1020Germany2026-05-01
1021Italy2026-05-18
1022Italy2026-05-14
1023Germany2026-05-18
1024Brazil2026-04-25
1025Russia2026-05-16
1026Spain2026-04-25
1027Brazil2026-05-11
1028Spain2026-05-20
1029France2026-05-19
1030Argentina2026-05-08
1031Japan2026-05-14
1032Brazil2026-05-19
1033Brazil2026-05-06
1034France2026-05-11
1035Japan2026-05-11
1036Brazil2026-05-03
1037Germany2026-05-03
1038Argentina2026-05-10
1039Canada2026-05-01
1040Canada2026-05-03
1041France2026-05-21
1042France2026-05-08
1043Australia2026-05-11
1044Spain2026-04-27
1045Canada2026-04-25
1046Canada2026-05-07
1047Italy2026-04-25
1048Italy2026-04-25
1049Argentina2026-04-26

On-Demand Data

NameIdCountryDate
Aruna Figeroa1000United Kingdom2026-05-07
Misaki Royster1001Canada2026-05-19
Ashley Doe1002India2026-04-26
Mujtaba Nicka1003Canada2026-04-24
Aruna Figeroa1004Brazil2026-04-29
Mujtaba Nicka1005Japan2026-04-22
Arvin Albares1006Australia2026-05-06
Maria Marrier1007Spain2026-04-26
James Butt1008Spain2026-05-11
Mayumi Kolmetz1009Brazil2026-05-17
Nicolas Iturbide1010Russia2026-05-09
Munro Ferencz1011Italy2026-04-29
Ivar Paprocki1012United Kingdom2026-05-14
Rodrigues Campain1013United Kingdom2026-05-16
Johnson Sergi1014Japan2026-04-30
Jefferson Schemmer1015Brazil2026-05-13
Alejandro Perin1016Argentina2026-05-21
Leja Caldarera1017Japan2026-05-04
Nicolas Iturbide1018Germany2026-05-04
Octavia Malet1019Argentina2026-05-04
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Faith GillianArgentinaAsiya Javayant NEW
Arvin AlbaresRussiaAnna Fali RENEWAL
Claire TollnerJapanElwin Sharvill PROPOSAL
Leon OldroydItalyXuxue Feng NEW
Stacey MacleadCanadaAmy Elsner QUALIFIED
Darci PoquetteBrazilStephen Shaw UNQUALIFIED
Jones VocelkaIndiaOnyama Limba NEW
Maria MarrierAustraliaBernardo Dominic UNQUALIFIED
Faith GillianSpainIvan Magalhaes RENEWAL
Silvio SlusarskiUnited KingdomAmy Elsner RENEWAL
Maria MarrierFranceStephen Shaw PROPOSAL
Julie StensethFranceIoni Bowcher PROPOSAL
Juan WieserCanadaStephen Shaw UNQUALIFIED
Ivar PaprockiCanadaXuxue Feng RENEWAL
Aika InouyeArgentinaElwin Sharvill UNQUALIFIED
Costa DilliardIndiaAnna Fali UNQUALIFIED
Juan WieserUnited KingdomIvan Magalhaes NEW
Costa DilliardFranceElwin Sharvill PROPOSAL
Jefferson SchemmerArgentinaElwin Sharvill UNQUALIFIED
Aika InouyeArgentinaAsiya Javayant RENEWAL
Izzy GarufiAustraliaAmy Elsner NEGOTIATION
Mayumi KolmetzUnited KingdomXuxue Feng RENEWAL
Aditya KuskoGermanyAnna Fali QUALIFIED
Costa DilliardJapanAsiya Javayant QUALIFIED
Octavia MaletUnited KingdomElwin Sharvill QUALIFIED
Aika InouyeFranceOnyama Limba UNQUALIFIED
Jeanfrancois VenereCanadaBernardo Dominic PROPOSAL
Alejandro PerinRussiaIvan Magalhaes RENEWAL
Stacey MacleadUnited KingdomBernardo Dominic RENEWAL
Stacey MacleadUnited KingdomIvan Magalhaes QUALIFIED
Francesco ShinkoSpainElwin Sharvill RENEWAL
Mujtaba NickaCanadaAsiya Javayant PROPOSAL
Maria MarrierItalyIvan Magalhaes NEGOTIATION
Murillo MaletItalyElwin Sharvill UNQUALIFIED
Alejandro PerinBrazilOnyama Limba UNQUALIFIED
Kaitlin OstroskyItalyIoni Bowcher UNQUALIFIED
Rodrigues CampainJapanXuxue Feng PROPOSAL
Kaitlin OstroskyCanadaStephen Shaw UNQUALIFIED
Ivar PaprockiAustraliaBernardo Dominic UNQUALIFIED
Julie StensethAustraliaXuxue Feng NEGOTIATION

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