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
Chavez BriddickGermanyAsiya Javayant NEW
Arvin AlbaresRussiaAsiya Javayant NEGOTIATION
Greenwood BologniaIndiaAnna Fali NEW
Aika InouyeCanadaIoni Bowcher UNQUALIFIED
Leja CaldareraAustraliaBernardo Dominic UNQUALIFIED
Misaki RoysterCanadaBernardo Dominic NEW
Wickens NestleArgentinaAsiya Javayant RENEWAL
Morrow RutaSpainAnna Fali PROPOSAL
Leja CaldareraBrazilOnyama Limba QUALIFIED
Maisha RulapaughCanadaBernardo Dominic RENEWAL
Greenwood BologniaSpainAmy Elsner UNQUALIFIED
Izzy GarufiRussiaStephen Shaw UNQUALIFIED
Sinclair WaycottJapanXuxue Feng PROPOSAL
Julie StensethArgentinaBernardo Dominic NEW
Tony FollerItalyAmy Elsner RENEWAL
Aditya KuskoIndiaAsiya Javayant RENEWAL
Mayumi KolmetzGermanyElwin Sharvill NEW
Jones VocelkaFranceBernardo Dominic UNQUALIFIED
Greenwood BologniaFranceAmy Elsner NEGOTIATION
Salvatore StockhamFranceAmy Elsner NEGOTIATION
Maisha RulapaughIndiaBernardo Dominic NEGOTIATION
Jones VocelkaUnited KingdomAmy Elsner UNQUALIFIED
Stacey MacleadGermanyStephen Shaw QUALIFIED
Isabel BowleyUnited KingdomElwin Sharvill RENEWAL
Wickens NestleItalyAnna Fali NEW
Morrow RutaItalyAmy Elsner PROPOSAL
Munro FerenczFranceAnna Fali PROPOSAL
Tony FollerAustraliaXuxue Feng NEW
Clifford RimUnited KingdomXuxue Feng UNQUALIFIED
Clifford RimIndiaXuxue Feng QUALIFIED
Antonio CaudyAustraliaOnyama Limba NEGOTIATION
Salvatore StockhamRussiaAnna Fali NEW
Aruna FigeroaIndiaStephen Shaw NEW
Aruna FigeroaCanadaStephen Shaw PROPOSAL
Octavia MaletUnited KingdomStephen Shaw NEW
Alejandro PerinArgentinaOnyama Limba NEGOTIATION
Darci PoquetteItalyIvan Magalhaes UNQUALIFIED
Costa DilliardJapanIoni Bowcher PROPOSAL
Ashley DoeIndiaIvan Magalhaes PROPOSAL
Octavia MaletIndiaAnna Fali QUALIFIED
Francesco ShinkoArgentinaOnyama Limba NEW
David DarakjyCanadaXuxue Feng PROPOSAL
Stacey MacleadArgentinaBernardo Dominic QUALIFIED
Isabel BowleyIndiaBernardo Dominic QUALIFIED
Tony FollerCanadaBernardo Dominic UNQUALIFIED
Clifford RimAustraliaIvan Magalhaes NEW
Misaki RoysterFranceStephen Shaw PROPOSAL
Mujtaba NickaItalyOnyama Limba RENEWAL
Misaki RoysterIndiaIvan Magalhaes QUALIFIED
Johnson SergiSpainAmy Elsner RENEWAL
Horizontal
NameCountryRepresentativeStatus
Smith GlickAustraliaOnyama Limba UNQUALIFIED
Alejandro PerinFranceAnna Fali UNQUALIFIED
Aruna FigeroaAustraliaAsiya Javayant PROPOSAL
Smith GlickAustraliaIvan Magalhaes NEW
Jones VocelkaAustraliaIvan Magalhaes NEGOTIATION
Aika InouyeGermanyAmy Elsner UNQUALIFIED
Faith GillianFranceIvan Magalhaes PROPOSAL
Izzy GarufiAustraliaAmy Elsner QUALIFIED
Jones VocelkaSpainAsiya Javayant NEGOTIATION
Rodrigues CampainAustraliaElwin Sharvill NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Wickens NestleFrance2026-05-22Commercial Press NEW9Anna Fali
1001Ricardo GauchoGermany2026-05-13Commercial Press RENEWAL66Xuxue Feng
1002Ashley DoeArgentina2026-05-09Rangoni Of Florence PROPOSAL19Elwin Sharvill
1003Juan WieserUnited Kingdom2026-05-25Chapman, Ross E Esq QUALIFIED71Anna Fali
1004Mayumi KolmetzUnited Kingdom2026-05-16Rousseaux, Michael Esq QUALIFIED10Ioni Bowcher
1005Silvio SlusarskiCanada2026-05-10Printing Dimensions PROPOSAL54Xuxue Feng
1006Smith GlickFrance2026-05-23King, Christopher A Esq PROPOSAL15Anna Fali
1007Aika InouyeBrazil2026-05-19Truhlar And Truhlar Attys RENEWAL74Stephen Shaw
1008Jennifer AmigonSpain2026-05-17Benton, John B Jr UNQUALIFIED38Bernardo Dominic
1009Aruna FigeroaFrance2026-05-20Dorl, James J Esq NEGOTIATION68Ivan Magalhaes
1010Faith GillianCanada2026-05-16Rousseaux, Michael Esq UNQUALIFIED5Bernardo Dominic
1011Salvatore StockhamCanada2026-05-30Feiner Bros UNQUALIFIED79Amy Elsner
1012Ricardo GauchoUnited Kingdom2026-05-20Printing Dimensions PROPOSAL62Anna Fali
1013Ivar PaprockiAustralia2026-05-19Feiner Bros UNQUALIFIED22Bernardo Dominic
1014Juan WieserArgentina2026-05-04Feiner Bros UNQUALIFIED93Elwin Sharvill
1015Arvin AlbaresGermany2026-05-07Morlong Associates RENEWAL89Xuxue Feng
1016Munro FerenczAustralia2026-05-22Rangoni Of Florence NEGOTIATION40Elwin Sharvill
1017Ricardo GauchoCanada2026-05-07Rousseaux, Michael Esq NEGOTIATION18Amy Elsner
1018Jones VocelkaJapan2026-05-07Dorl, James J Esq NEGOTIATION83Ivan Magalhaes
1019Isabel BowleyAustralia2026-05-20Morlong Associates PROPOSAL41Bernardo Dominic
1020Smith GlickAustralia2026-05-03Truhlar And Truhlar Attys NEW99Xuxue Feng
1021Salvatore StockhamUnited Kingdom2026-05-30Chanay, Jeffrey A Esq UNQUALIFIED68Bernardo Dominic
1022Juan WieserArgentina2026-05-22Feltz Printing Service PROPOSAL48Stephen Shaw
1023Jeanfrancois VenereSpain2026-05-25Benton, John B Jr PROPOSAL83Onyama Limba
1024Darci PoquetteRussia2026-05-27Printing Dimensions UNQUALIFIED95Bernardo Dominic
1025Aika InouyeItaly2026-05-21Chapman, Ross E Esq PROPOSAL61Bernardo Dominic
1026Leja CaldareraIndia2026-05-14Dorl, James J Esq NEW76Xuxue Feng
1027Juan WieserUnited Kingdom2026-05-28Truhlar And Truhlar Attys UNQUALIFIED11Amy Elsner
1028Aditya KuskoSpain2026-05-22King, Christopher A Esq NEW45Ivan Magalhaes
1029Darci PoquetteArgentina2026-05-13Chemel, James L Cpa NEW8Ivan Magalhaes
1030Misaki RoysterIndia2026-05-26Benton, John B Jr NEW38Elwin Sharvill
1031Leja CaldareraCanada2026-05-30King, Christopher A Esq NEW68Onyama Limba
1032Leon OldroydRussia2026-05-30Printing Dimensions QUALIFIED14Xuxue Feng
1033Arvin AlbaresAustralia2026-05-04Chemel, James L Cpa UNQUALIFIED56Xuxue Feng
1034Munro FerenczAustralia2026-05-03Chemel, James L Cpa QUALIFIED27Asiya Javayant
1035Ivar PaprockiUnited Kingdom2026-05-04Truhlar And Truhlar Attys NEGOTIATION51Xuxue Feng
1036Julie StensethRussia2026-05-19Dorl, James J Esq UNQUALIFIED85Xuxue Feng
1037Kaitlin OstroskyCanada2026-05-22Benton, John B Jr NEW68Amy Elsner
1038Morrow RutaJapan2026-05-20Benton, John B Jr NEGOTIATION19Onyama Limba
1039Johnson SergiUnited Kingdom2026-05-01Commercial Press NEW60Xuxue Feng
1040Wickens NestleUnited Kingdom2026-05-30Truhlar And Truhlar Attys QUALIFIED42Ioni Bowcher
1041Chavez BriddickUnited Kingdom2026-05-11Morlong Associates NEGOTIATION17Bernardo Dominic
1042Alejandro PerinArgentina2026-05-05Truhlar And Truhlar Attys RENEWAL65Ivan Magalhaes
1043Maisha RulapaughRussia2026-05-11Buckley Miller Wright QUALIFIED66Anna Fali
1044Antonio CaudyJapan2026-05-07King, Christopher A Esq NEGOTIATION32Bernardo Dominic
1045Smith GlickUnited Kingdom2026-05-15Feltz Printing Service NEW56Xuxue Feng
1046Rodrigues CampainRussia2026-05-28Rousseaux, Michael Esq PROPOSAL10Bernardo Dominic
1047Alejandro PerinBrazil2026-05-14Rousseaux, Michael Esq PROPOSAL76Anna Fali
1048Murillo MaletSpain2026-05-08Rangoni Of Florence NEW83Ivan Magalhaes
1049Jennifer AmigonCanada2026-05-24Feltz Printing Service RENEWAL81Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Maria MarrierGermanyElwin Sharvill PROPOSAL
Sinclair WaycottIndiaIoni Bowcher PROPOSAL
Ricardo GauchoIndiaAnna Fali NEW
Julie StensethUnited KingdomOnyama Limba NEGOTIATION
Costa DilliardRussiaOnyama Limba RENEWAL
Alejandro PerinBrazilOnyama Limba QUALIFIED
Izzy GarufiItalyBernardo Dominic QUALIFIED
Claire TollnerRussiaElwin Sharvill RENEWAL
Claire TollnerJapanAnna Fali UNQUALIFIED
Claire TollnerArgentinaAsiya Javayant NEGOTIATION
Leja CaldareraSpainOnyama Limba NEW
Stacey MacleadSpainStephen Shaw RENEWAL
Rodrigues CampainArgentinaXuxue Feng NEW
Murillo MaletBrazilAsiya Javayant RENEWAL
Sinclair WaycottAustraliaBernardo Dominic QUALIFIED
Julie StensethArgentinaElwin Sharvill NEW
Chavez BriddickFranceIvan Magalhaes NEGOTIATION
Emily WhobreyAustraliaStephen Shaw RENEWAL
Octavia MaletJapanXuxue Feng PROPOSAL
Greenwood BologniaFranceOnyama Limba NEGOTIATION
Jones VocelkaJapanAsiya Javayant QUALIFIED
Leon OldroydGermanyOnyama Limba UNQUALIFIED
Izzy GarufiFranceOnyama Limba NEGOTIATION
Nicolas IturbideSpainBernardo Dominic UNQUALIFIED
Darci PoquetteRussiaAnna Fali PROPOSAL
Nicolas IturbideUnited KingdomIvan Magalhaes UNQUALIFIED
Aditya KuskoRussiaOnyama Limba NEGOTIATION
James ButtIndiaOnyama Limba RENEWAL
Alejandro PerinAustraliaOnyama Limba NEW
Octavia MaletRussiaElwin Sharvill PROPOSAL
Morrow RutaFranceXuxue Feng UNQUALIFIED
Silvio SlusarskiItalyStephen Shaw RENEWAL
Faith GillianFranceXuxue Feng QUALIFIED
Misaki RoysterAustraliaIvan Magalhaes PROPOSAL
Cody SaylorsFranceBernardo Dominic UNQUALIFIED
Francesco ShinkoJapanAsiya Javayant QUALIFIED
Maisha RulapaughRussiaAsiya Javayant QUALIFIED
Rodrigues CampainGermanyElwin Sharvill RENEWAL
Aika InouyeJapanIoni Bowcher RENEWAL
Isabel BowleyRussiaOnyama Limba RENEWAL
Aruna FigeroaArgentinaAnna Fali PROPOSAL
Aika InouyeFranceElwin Sharvill PROPOSAL
Johnson SergiAustraliaIoni Bowcher PROPOSAL
Tony FollerAustraliaStephen Shaw NEW
Tony FollerFranceStephen Shaw QUALIFIED
Antonio CaudyArgentinaStephen Shaw QUALIFIED
Leja CaldareraUnited KingdomOnyama Limba PROPOSAL
Aika InouyeCanadaIoni Bowcher PROPOSAL
Tony FollerItalyAnna Fali QUALIFIED
Murillo MaletRussiaBernardo Dominic QUALIFIED
Frozen Columns
Name
Ashley Doe
Chavez Briddick
Leon Oldroyd
Juan Wieser
Ashley Doe
Munro Ferencz
Izzy Garufi
Munro Ferencz
Maisha Rulapaugh
Aika Inouye
Stacey Maclead
Ricardo Gaucho
Adams Morasca
Misaki Royster
Sinclair Waycott
Aditya Kusko
David Darakjy
Isabel Bowley
Ivar Paprocki
Rodrigues Campain
Maria Marrier
Ivar Paprocki
Aika Inouye
Izzy Garufi
Ricardo Gaucho
Munro Ferencz
Ivar Paprocki
Deepesh Chui
Johnson Sergi
Ashley Doe
Aditya Kusko
Rodrigues Campain
Kaitlin Ostrosky
Claire Tollner
Arvin Albares
Nicolas Iturbide
Chavez Briddick
Wickens Nestle
Cody Saylors
Jones Vocelka
Julie Stenseth
Darci Poquette
Ivar Paprocki
Cody Saylors
Alejandro Perin
Izzy Garufi
Leja Caldarera
Cody Saylors
Aika Inouye
Wickens Nestle
IdCountryDate
1000Germany2026-05-02
1001Japan2026-05-11
1002Spain2026-05-17
1003Japan2026-05-12
1004India2026-05-13
1005Italy2026-05-27
1006United Kingdom2026-05-16
1007India2026-05-02
1008Canada2026-05-19
1009Germany2026-05-27
1010Italy2026-05-13
1011Germany2026-05-19
1012Argentina2026-05-09
1013Argentina2026-05-08
1014France2026-05-15
1015United Kingdom2026-05-16
1016Japan2026-05-02
1017Canada2026-05-25
1018Australia2026-05-11
1019Russia2026-05-22
1020Australia2026-05-10
1021Japan2026-05-05
1022Japan2026-05-27
1023Australia2026-05-06
1024Japan2026-05-25
1025Canada2026-05-07
1026Italy2026-05-30
1027United Kingdom2026-05-21
1028Germany2026-05-25
1029Spain2026-05-25
1030Germany2026-05-19
1031Italy2026-05-20
1032Japan2026-05-21
1033Spain2026-05-02
1034United Kingdom2026-05-12
1035Germany2026-05-29
1036Canada2026-05-19
1037Japan2026-05-22
1038India2026-05-04
1039Italy2026-05-03
1040Australia2026-05-23
1041Canada2026-05-23
1042France2026-05-14
1043Spain2026-05-15
1044Russia2026-05-01
1045Canada2026-05-21
1046India2026-05-08
1047United Kingdom2026-05-23
1048France2026-05-16
1049Russia2026-05-18

On-Demand Data

NameIdCountryDate
Jefferson Schemmer1000Australia2026-05-24
Smith Glick1001India2026-05-26
Costa Dilliard1002Italy2026-05-23
Aditya Kusko1003Brazil2026-05-06
Smith Glick1004France2026-05-02
Stacey Maclead1005Argentina2026-05-12
Kadeem Flosi1006Spain2026-05-03
Emily Whobrey1007Russia2026-05-04
Claire Tollner1008Russia2026-05-02
Wickens Nestle1009Italy2026-05-07
Wickens Nestle1010Canada2026-05-29
Mayumi Kolmetz1011Germany2026-05-22
Alejandro Perin1012France2026-05-16
Misaki Royster1013Russia2026-05-28
Leon Oldroyd1014France2026-05-10
Sinclair Waycott1015France2026-05-01
Ivar Paprocki1016United Kingdom2026-05-24
Nicolas Iturbide1017India2026-05-13
Salvatore Stockham1018Brazil2026-05-24
Chavez Briddick1019France2026-05-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Claire TollnerSpainStephen Shaw UNQUALIFIED
Claire TollnerGermanyAsiya Javayant NEGOTIATION
Juan WieserSpainAsiya Javayant UNQUALIFIED
Leja CaldareraSpainIoni Bowcher UNQUALIFIED
Alejandro PerinArgentinaBernardo Dominic NEW
Nicolas IturbideIndiaIoni Bowcher PROPOSAL
David DarakjyRussiaIoni Bowcher RENEWAL
Ivar PaprockiBrazilXuxue Feng NEGOTIATION
Aruna FigeroaIndiaAmy Elsner RENEWAL
Maisha RulapaughJapanStephen Shaw QUALIFIED
Silvio SlusarskiBrazilOnyama Limba PROPOSAL
Silvio SlusarskiArgentinaIoni Bowcher PROPOSAL
David DarakjyBrazilAsiya Javayant UNQUALIFIED
Aruna FigeroaIndiaXuxue Feng PROPOSAL
Leja CaldareraJapanStephen Shaw PROPOSAL
Kaitlin OstroskySpainIoni Bowcher PROPOSAL
Julie StensethGermanyAmy Elsner QUALIFIED
Francesco ShinkoFranceAnna Fali NEGOTIATION
Francesco ShinkoUnited KingdomStephen Shaw PROPOSAL
Isabel BowleyRussiaXuxue Feng RENEWAL
Emily WhobreyAustraliaAnna Fali NEW
Arvin AlbaresRussiaIoni Bowcher UNQUALIFIED
Greenwood BologniaFranceAsiya Javayant PROPOSAL
Aditya KuskoJapanElwin Sharvill NEW
Salvatore StockhamRussiaIvan Magalhaes UNQUALIFIED
Isabel BowleyBrazilAnna Fali NEGOTIATION
Jennifer AmigonArgentinaAnna Fali NEW
Ricardo GauchoSpainXuxue Feng NEW
Stacey MacleadIndiaBernardo Dominic NEW
Tony FollerItalyIoni Bowcher RENEWAL
Arvin AlbaresAustraliaOnyama Limba NEW
Rodrigues CampainArgentinaIvan Magalhaes UNQUALIFIED
Clifford RimRussiaAsiya Javayant RENEWAL
Maria MarrierRussiaAmy Elsner UNQUALIFIED
Munro FerenczUnited KingdomIoni Bowcher NEGOTIATION
Francesco ShinkoAustraliaElwin Sharvill NEW
Salvatore StockhamFranceAnna Fali NEW
Maisha RulapaughCanadaAsiya Javayant UNQUALIFIED
Wickens NestleFranceBernardo Dominic QUALIFIED
Chavez BriddickAustraliaIvan Magalhaes 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>