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
Faith GillianSpainAmy Elsner QUALIFIED
Silvio SlusarskiSpainElwin Sharvill NEGOTIATION
Adams MorascaItalyAnna Fali PROPOSAL
Johnson SergiJapanBernardo Dominic QUALIFIED
David DarakjyCanadaAsiya Javayant QUALIFIED
Munro FerenczGermanyBernardo Dominic NEW
Salvatore StockhamSpainElwin Sharvill PROPOSAL
Cody SaylorsCanadaIvan Magalhaes PROPOSAL
Ivar PaprockiArgentinaOnyama Limba QUALIFIED
Francesco ShinkoIndiaXuxue Feng QUALIFIED
Claire TollnerSpainIvan Magalhaes RENEWAL
Arvin AlbaresRussiaAsiya Javayant NEW
Izzy GarufiGermanyIvan Magalhaes PROPOSAL
Maria MarrierItalyAsiya Javayant PROPOSAL
Silvio SlusarskiUnited KingdomAsiya Javayant RENEWAL
Ivar PaprockiBrazilIvan Magalhaes QUALIFIED
Mujtaba NickaAustraliaBernardo Dominic UNQUALIFIED
Costa DilliardBrazilStephen Shaw RENEWAL
Arvin AlbaresBrazilElwin Sharvill UNQUALIFIED
Maria MarrierItalyXuxue Feng NEW
Johnson SergiUnited KingdomXuxue Feng UNQUALIFIED
Munro FerenczUnited KingdomBernardo Dominic QUALIFIED
Mayumi KolmetzBrazilOnyama Limba NEGOTIATION
David DarakjyAustraliaXuxue Feng PROPOSAL
Aditya KuskoFranceXuxue Feng NEGOTIATION
Jeanfrancois VenereUnited KingdomXuxue Feng PROPOSAL
Aruna FigeroaSpainAnna Fali NEW
Smith GlickBrazilElwin Sharvill NEGOTIATION
Smith GlickGermanyStephen Shaw UNQUALIFIED
Munro FerenczUnited KingdomXuxue Feng RENEWAL
Clifford RimRussiaIoni Bowcher NEW
Mujtaba NickaAustraliaBernardo Dominic UNQUALIFIED
Emily WhobreyUnited KingdomIvan Magalhaes RENEWAL
Johnson SergiFranceIoni Bowcher UNQUALIFIED
Misaki RoysterUnited KingdomAsiya Javayant RENEWAL
Leon OldroydIndiaIoni Bowcher PROPOSAL
Morrow RutaCanadaOnyama Limba RENEWAL
Deepesh ChuiSpainStephen Shaw NEW
Arvin AlbaresGermanyOnyama Limba NEW
Ashley DoeGermanyOnyama Limba NEGOTIATION
Leja CaldareraJapanOnyama Limba PROPOSAL
Juan WieserRussiaXuxue Feng QUALIFIED
Maria MarrierArgentinaElwin Sharvill NEW
Ivar PaprockiGermanyElwin Sharvill UNQUALIFIED
Murillo MaletFranceStephen Shaw UNQUALIFIED
Murillo MaletCanadaStephen Shaw PROPOSAL
Mujtaba NickaSpainIoni Bowcher PROPOSAL
Kaitlin OstroskyRussiaAmy Elsner PROPOSAL
Kadeem FlosiIndiaAsiya Javayant PROPOSAL
Silvio SlusarskiRussiaStephen Shaw UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Cody SaylorsArgentinaXuxue Feng PROPOSAL
Nicolas IturbideSpainElwin Sharvill NEW
Nicolas IturbideFranceBernardo Dominic RENEWAL
Emily WhobreyItalyElwin Sharvill NEGOTIATION
Maisha RulapaughBrazilBernardo Dominic NEGOTIATION
Morrow RutaUnited KingdomAmy Elsner RENEWAL
Munro FerenczIndiaAsiya Javayant PROPOSAL
Leja CaldareraItalyElwin Sharvill UNQUALIFIED
Jennifer AmigonBrazilIoni Bowcher NEGOTIATION
James ButtArgentinaXuxue Feng NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Ashley DoeRussia2026-05-20Dorl, James J Esq RENEWAL22Stephen Shaw
1001Deepesh ChuiItaly2026-05-26Rousseaux, Michael Esq NEGOTIATION89Anna Fali
1002Emily WhobreyIndia2026-05-27Benton, John B Jr RENEWAL70Stephen Shaw
1003Isabel BowleyArgentina2026-05-07Chapman, Ross E Esq NEGOTIATION56Stephen Shaw
1004Faith GillianBrazil2026-05-14Chemel, James L Cpa QUALIFIED99Amy Elsner
1005Maria MarrierUnited Kingdom2026-05-30Truhlar And Truhlar Attys NEGOTIATION2Anna Fali
1006Kadeem FlosiCanada2026-05-04Chapman, Ross E Esq NEW30Xuxue Feng
1007Jefferson SchemmerRussia2026-05-03Feltz Printing Service UNQUALIFIED66Asiya Javayant
1008Johnson SergiSpain2026-05-29Feltz Printing Service UNQUALIFIED82Bernardo Dominic
1009Arvin AlbaresRussia2026-05-04Feiner Bros NEW31Ioni Bowcher
1010Antonio CaudyCanada2026-05-22Buckley Miller Wright NEGOTIATION18Ivan Magalhaes
1011Isabel BowleyBrazil2026-05-28Rousseaux, Michael Esq PROPOSAL76Elwin Sharvill
1012Mayumi KolmetzIndia2026-05-26Rangoni Of Florence NEW66Bernardo Dominic
1013Johnson SergiItaly2026-05-23Truhlar And Truhlar Attys QUALIFIED11Onyama Limba
1014Wickens NestleBrazil2026-05-05Feltz Printing Service UNQUALIFIED19Ioni Bowcher
1015Maisha RulapaughSpain2026-05-27Buckley Miller Wright NEW5Amy Elsner
1016Munro FerenczUnited Kingdom2026-05-02Morlong Associates RENEWAL38Xuxue Feng
1017Sinclair WaycottFrance2026-05-05Truhlar And Truhlar Attys NEGOTIATION15Amy Elsner
1018David DarakjyIndia2026-05-11Rangoni Of Florence NEW61Elwin Sharvill
1019Faith GillianJapan2026-05-16Printing Dimensions NEGOTIATION99Amy Elsner
1020Murillo MaletItaly2026-05-26Commercial Press RENEWAL30Anna Fali
1021Mujtaba NickaRussia2026-05-05Morlong Associates NEGOTIATION67Stephen Shaw
1022Aruna FigeroaUnited Kingdom2026-05-21Dorl, James J Esq QUALIFIED91Ioni Bowcher
1023Izzy GarufiFrance2026-05-07Commercial Press NEW5Ivan Magalhaes
1024Ricardo GauchoArgentina2026-05-10Morlong Associates PROPOSAL59Bernardo Dominic
1025Nicolas IturbideGermany2026-05-08Commercial Press UNQUALIFIED27Ioni Bowcher
1026Izzy GarufiRussia2026-05-13Commercial Press PROPOSAL28Asiya Javayant
1027Greenwood BologniaAustralia2026-05-02Feiner Bros QUALIFIED67Ivan Magalhaes
1028Ivar PaprockiAustralia2026-05-21Chemel, James L Cpa QUALIFIED1Bernardo Dominic
1029Johnson SergiRussia2026-05-23Buckley Miller Wright QUALIFIED10Asiya Javayant
1030Silvio SlusarskiIndia2026-05-16Chanay, Jeffrey A Esq RENEWAL11Ivan Magalhaes
1031Clifford RimBrazil2026-05-12Chemel, James L Cpa PROPOSAL96Stephen Shaw
1032James ButtFrance2026-05-07Benton, John B Jr QUALIFIED18Ioni Bowcher
1033Ivar PaprockiCanada2026-05-16Benton, John B Jr PROPOSAL81Xuxue Feng
1034Jefferson SchemmerUnited Kingdom2026-05-03Truhlar And Truhlar Attys QUALIFIED21Onyama Limba
1035Munro FerenczArgentina2026-05-06Chanay, Jeffrey A Esq PROPOSAL16Onyama Limba
1036Julie StensethUnited Kingdom2026-05-18Truhlar And Truhlar Attys PROPOSAL8Bernardo Dominic
1037Emily WhobreyJapan2026-05-25Chemel, James L Cpa PROPOSAL47Bernardo Dominic
1038Ivar PaprockiItaly2026-05-11Truhlar And Truhlar Attys UNQUALIFIED65Elwin Sharvill
1039Leja CaldareraRussia2026-05-29Dorl, James J Esq QUALIFIED65Onyama Limba
1040Jones VocelkaCanada2026-05-26Morlong Associates NEGOTIATION69Ivan Magalhaes
1041Ashley DoeArgentina2026-05-22King, Christopher A Esq PROPOSAL73Xuxue Feng
1042Jeanfrancois VenereGermany2026-05-27Chapman, Ross E Esq PROPOSAL19Elwin Sharvill
1043Nicolas IturbideUnited Kingdom2026-05-24Buckley Miller Wright PROPOSAL9Stephen Shaw
1044Kaitlin OstroskyIndia2026-05-17Rangoni Of Florence RENEWAL71Amy Elsner
1045Faith GillianItaly2026-05-23Rousseaux, Michael Esq NEGOTIATION81Onyama Limba
1046Darci PoquetteFrance2026-05-19Truhlar And Truhlar Attys NEW17Ioni Bowcher
1047Chavez BriddickItaly2026-05-30Feiner Bros RENEWAL86Asiya Javayant
1048Aika InouyeJapan2026-05-29Morlong Associates QUALIFIED6Xuxue Feng
1049Darci PoquetteAustralia2026-05-09Morlong Associates RENEWAL71Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Emily WhobreyCanadaAmy Elsner UNQUALIFIED
Kadeem FlosiSpainAsiya Javayant NEGOTIATION
Aruna FigeroaIndiaOnyama Limba NEGOTIATION
Claire TollnerAustraliaXuxue Feng NEW
Greenwood BologniaGermanyOnyama Limba PROPOSAL
Ricardo GauchoCanadaAmy Elsner QUALIFIED
Darci PoquetteGermanyOnyama Limba UNQUALIFIED
Chavez BriddickArgentinaIvan Magalhaes UNQUALIFIED
Johnson SergiAustraliaOnyama Limba NEGOTIATION
Salvatore StockhamSpainXuxue Feng UNQUALIFIED
Chavez BriddickCanadaIvan Magalhaes QUALIFIED
Greenwood BologniaItalyStephen Shaw RENEWAL
Jennifer AmigonBrazilIoni Bowcher NEW
Jeanfrancois VenereArgentinaAnna Fali UNQUALIFIED
Faith GillianArgentinaOnyama Limba RENEWAL
Mayumi KolmetzArgentinaIvan Magalhaes UNQUALIFIED
David DarakjyIndiaAmy Elsner QUALIFIED
Ricardo GauchoIndiaElwin Sharvill UNQUALIFIED
Jeanfrancois VenereItalyIoni Bowcher RENEWAL
Clifford RimIndiaOnyama Limba QUALIFIED
Murillo MaletFranceBernardo Dominic RENEWAL
Silvio SlusarskiBrazilXuxue Feng NEW
Greenwood BologniaRussiaAnna Fali NEW
Claire TollnerFranceStephen Shaw NEW
Ashley DoeAustraliaAnna Fali PROPOSAL
Antonio CaudyAustraliaIvan Magalhaes NEW
Aditya KuskoAustraliaElwin Sharvill PROPOSAL
Morrow RutaBrazilStephen Shaw UNQUALIFIED
Arvin AlbaresArgentinaIvan Magalhaes QUALIFIED
Deepesh ChuiUnited KingdomIoni Bowcher NEW
Darci PoquetteGermanyIvan Magalhaes QUALIFIED
Silvio SlusarskiUnited KingdomAmy Elsner NEW
Deepesh ChuiRussiaAsiya Javayant QUALIFIED
Tony FollerBrazilIoni Bowcher PROPOSAL
Antonio CaudyRussiaElwin Sharvill NEGOTIATION
Greenwood BologniaCanadaIoni Bowcher NEW
Darci PoquetteAustraliaAsiya Javayant QUALIFIED
Aruna FigeroaItalyBernardo Dominic PROPOSAL
Chavez BriddickSpainStephen Shaw PROPOSAL
Alejandro PerinUnited KingdomAnna Fali NEW
Faith GillianArgentinaAnna Fali NEGOTIATION
Aruna FigeroaJapanAnna Fali QUALIFIED
Munro FerenczIndiaElwin Sharvill RENEWAL
Deepesh ChuiSpainOnyama Limba UNQUALIFIED
Jones VocelkaRussiaStephen Shaw PROPOSAL
Silvio SlusarskiUnited KingdomBernardo Dominic UNQUALIFIED
Jeanfrancois VenereJapanAsiya Javayant NEGOTIATION
Jeanfrancois VenereRussiaXuxue Feng QUALIFIED
Aika InouyeJapanAsiya Javayant NEW
David DarakjyIndiaBernardo Dominic NEW
Frozen Columns
Name
Leja Caldarera
Tony Foller
Smith Glick
Juan Wieser
Jones Vocelka
Darci Poquette
Octavia Malet
Aika Inouye
Alejandro Perin
Francesco Shinko
Mujtaba Nicka
Aruna Figeroa
Antonio Caudy
Chavez Briddick
Salvatore Stockham
Mujtaba Nicka
Nicolas Iturbide
Tony Foller
Aika Inouye
Cody Saylors
Isabel Bowley
Jefferson Schemmer
Maisha Rulapaugh
Murillo Malet
Tony Foller
Silvio Slusarski
Octavia Malet
Johnson Sergi
Alejandro Perin
Kadeem Flosi
Leja Caldarera
Isabel Bowley
Munro Ferencz
Jefferson Schemmer
Misaki Royster
Clifford Rim
Greenwood Bolognia
Arvin Albares
Adams Morasca
Aditya Kusko
Jefferson Schemmer
Deepesh Chui
Francesco Shinko
Francesco Shinko
Tony Foller
Stacey Maclead
Ashley Doe
Maisha Rulapaugh
Aditya Kusko
Deepesh Chui
IdCountryDate
1000Australia2026-05-07
1001Germany2026-05-10
1002France2026-05-15
1003United Kingdom2026-05-28
1004Argentina2026-05-14
1005Italy2026-05-12
1006France2026-05-28
1007Italy2026-05-29
1008Japan2026-05-21
1009Germany2026-05-04
1010Spain2026-05-14
1011United Kingdom2026-05-27
1012Canada2026-05-17
1013Australia2026-05-16
1014Argentina2026-05-06
1015France2026-05-27
1016Germany2026-05-05
1017Argentina2026-05-30
1018Argentina2026-05-16
1019Italy2026-05-21
1020Spain2026-05-24
1021Russia2026-05-25
1022Argentina2026-05-26
1023Canada2026-05-16
1024India2026-05-24
1025Germany2026-05-11
1026United Kingdom2026-05-15
1027France2026-05-16
1028Japan2026-05-28
1029United Kingdom2026-05-02
1030Russia2026-05-19
1031Brazil2026-05-08
1032France2026-05-16
1033France2026-05-28
1034France2026-05-09
1035Italy2026-05-14
1036Argentina2026-05-03
1037United Kingdom2026-05-18
1038Russia2026-05-02
1039Russia2026-05-27
1040Australia2026-05-10
1041Australia2026-05-19
1042Spain2026-05-09
1043United Kingdom2026-05-11
1044Australia2026-05-10
1045Russia2026-05-11
1046United Kingdom2026-05-02
1047Australia2026-05-16
1048United Kingdom2026-05-17
1049France2026-05-19

On-Demand Data

NameIdCountryDate
Alejandro Perin1000Brazil2026-05-23
Darci Poquette1001Spain2026-05-19
Ashley Doe1002Argentina2026-05-04
Faith Gillian1003Japan2026-05-04
James Butt1004Australia2026-05-29
Jeanfrancois Venere1005India2026-05-05
Octavia Malet1006India2026-05-09
Sinclair Waycott1007Australia2026-05-26
Arvin Albares1008Italy2026-05-21
Maria Marrier1009Italy2026-05-14
Kaitlin Ostrosky1010Italy2026-05-03
Sinclair Waycott1011Japan2026-05-04
Johnson Sergi1012Japan2026-05-24
Kadeem Flosi1013Brazil2026-05-16
Antonio Caudy1014Australia2026-05-15
Jennifer Amigon1015Australia2026-05-12
James Butt1016Australia2026-05-01
Maisha Rulapaugh1017Argentina2026-05-19
Maria Marrier1018Japan2026-05-14
Darci Poquette1019Brazil2026-05-15
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Chavez BriddickIndiaAmy Elsner PROPOSAL
Greenwood BologniaRussiaElwin Sharvill NEGOTIATION
Greenwood BologniaItalyIoni Bowcher QUALIFIED
Claire TollnerBrazilAmy Elsner RENEWAL
Adams MorascaIndiaBernardo Dominic QUALIFIED
Adams MorascaSpainAmy Elsner PROPOSAL
Faith GillianCanadaAsiya Javayant NEW
Francesco ShinkoUnited KingdomAsiya Javayant NEGOTIATION
Francesco ShinkoCanadaOnyama Limba QUALIFIED
Adams MorascaSpainElwin Sharvill NEGOTIATION
Leja CaldareraSpainBernardo Dominic NEGOTIATION
Maria MarrierCanadaOnyama Limba RENEWAL
Silvio SlusarskiUnited KingdomElwin Sharvill RENEWAL
Deepesh ChuiItalyAmy Elsner RENEWAL
Juan WieserUnited KingdomElwin Sharvill NEGOTIATION
Cody SaylorsSpainAnna Fali NEW
Alejandro PerinGermanyIoni Bowcher PROPOSAL
Mayumi KolmetzIndiaElwin Sharvill NEGOTIATION
Faith GillianArgentinaIoni Bowcher PROPOSAL
Maisha RulapaughFranceAmy Elsner RENEWAL
Maisha RulapaughRussiaIvan Magalhaes UNQUALIFIED
Aruna FigeroaGermanyIvan Magalhaes NEW
Octavia MaletRussiaIoni Bowcher UNQUALIFIED
Faith GillianSpainOnyama Limba UNQUALIFIED
Claire TollnerRussiaBernardo Dominic UNQUALIFIED
Julie StensethItalyOnyama Limba PROPOSAL
Alejandro PerinIndiaAmy Elsner PROPOSAL
Jeanfrancois VenereArgentinaStephen Shaw NEW
Greenwood BologniaCanadaStephen Shaw QUALIFIED
Smith GlickAustraliaStephen Shaw QUALIFIED
Munro FerenczRussiaAsiya Javayant NEGOTIATION
Silvio SlusarskiRussiaOnyama Limba PROPOSAL
Rodrigues CampainUnited KingdomIoni Bowcher PROPOSAL
Ricardo GauchoFranceOnyama Limba UNQUALIFIED
Cody SaylorsSpainIoni Bowcher PROPOSAL
Leja CaldareraGermanyIoni Bowcher QUALIFIED
Ricardo GauchoBrazilAmy Elsner QUALIFIED
Alejandro PerinRussiaIvan Magalhaes QUALIFIED
Ashley DoeSpainIoni Bowcher PROPOSAL
Emily WhobreyFranceElwin Sharvill QUALIFIED

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