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
Juan WieserRussiaStephen Shaw NEW
Jones VocelkaGermanyAmy Elsner NEGOTIATION
Greenwood BologniaArgentinaAmy Elsner NEGOTIATION
Jennifer AmigonJapanAnna Fali RENEWAL
Emily WhobreySpainAsiya Javayant QUALIFIED
Greenwood BologniaSpainAmy Elsner QUALIFIED
Salvatore StockhamUnited KingdomBernardo Dominic RENEWAL
Jeanfrancois VenereIndiaOnyama Limba QUALIFIED
Wickens NestleArgentinaOnyama Limba PROPOSAL
Ricardo GauchoCanadaAnna Fali UNQUALIFIED
Chavez BriddickUnited KingdomIoni Bowcher NEW
Kadeem FlosiCanadaElwin Sharvill NEW
Costa DilliardCanadaXuxue Feng RENEWAL
Francesco ShinkoFranceXuxue Feng RENEWAL
Ivar PaprockiUnited KingdomElwin Sharvill NEGOTIATION
Maisha RulapaughBrazilIvan Magalhaes PROPOSAL
Leon OldroydUnited KingdomXuxue Feng NEGOTIATION
David DarakjyGermanyXuxue Feng RENEWAL
Mujtaba NickaIndiaOnyama Limba RENEWAL
Aika InouyeCanadaBernardo Dominic PROPOSAL
Stacey MacleadCanadaAnna Fali PROPOSAL
Isabel BowleyJapanXuxue Feng PROPOSAL
Aditya KuskoFranceOnyama Limba PROPOSAL
Octavia MaletJapanAsiya Javayant UNQUALIFIED
Tony FollerIndiaBernardo Dominic QUALIFIED
Morrow RutaGermanyBernardo Dominic UNQUALIFIED
Nicolas IturbideRussiaIvan Magalhaes PROPOSAL
Jeanfrancois VenereSpainBernardo Dominic UNQUALIFIED
Kadeem FlosiSpainOnyama Limba RENEWAL
Costa DilliardAustraliaAmy Elsner UNQUALIFIED
Jeanfrancois VenereRussiaAmy Elsner RENEWAL
Aika InouyeJapanStephen Shaw PROPOSAL
Faith GillianAustraliaXuxue Feng NEGOTIATION
Leon OldroydFranceBernardo Dominic RENEWAL
Stacey MacleadBrazilIvan Magalhaes RENEWAL
Rodrigues CampainBrazilIoni Bowcher NEGOTIATION
Aika InouyeArgentinaXuxue Feng UNQUALIFIED
Johnson SergiSpainIvan Magalhaes NEW
Mayumi KolmetzCanadaStephen Shaw RENEWAL
Mujtaba NickaIndiaAmy Elsner NEGOTIATION
Rodrigues CampainJapanElwin Sharvill RENEWAL
Francesco ShinkoItalyStephen Shaw RENEWAL
Cody SaylorsIndiaStephen Shaw RENEWAL
Antonio CaudyUnited KingdomXuxue Feng RENEWAL
Chavez BriddickArgentinaAnna Fali PROPOSAL
Francesco ShinkoUnited KingdomAnna Fali NEW
Mayumi KolmetzSpainIvan Magalhaes UNQUALIFIED
Rodrigues CampainItalyIvan Magalhaes UNQUALIFIED
Chavez BriddickBrazilBernardo Dominic PROPOSAL
Alejandro PerinArgentinaAsiya Javayant UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Deepesh ChuiRussiaOnyama Limba QUALIFIED
Jones VocelkaRussiaOnyama Limba RENEWAL
James ButtUnited KingdomAmy Elsner PROPOSAL
Jefferson SchemmerRussiaElwin Sharvill NEGOTIATION
Emily WhobreyIndiaOnyama Limba NEGOTIATION
Kadeem FlosiSpainElwin Sharvill PROPOSAL
Juan WieserJapanIoni Bowcher NEW
Chavez BriddickBrazilXuxue Feng QUALIFIED
Faith GillianJapanOnyama Limba RENEWAL
Faith GillianSpainElwin Sharvill UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Leja CaldareraGermany2025-03-28Truhlar And Truhlar Attys UNQUALIFIED17Ivan Magalhaes
1001Jefferson SchemmerAustralia2025-03-22Morlong Associates PROPOSAL72Ioni Bowcher
1002Ivar PaprockiArgentina2025-03-21Chanay, Jeffrey A Esq UNQUALIFIED83Asiya Javayant
1003Sinclair WaycottAustralia2025-03-19Chemel, James L Cpa PROPOSAL55Elwin Sharvill
1004Jefferson SchemmerJapan2025-03-30Benton, John B Jr PROPOSAL64Amy Elsner
1005Emily WhobreyGermany2025-03-31Chemel, James L Cpa NEGOTIATION55Asiya Javayant
1006Aruna FigeroaRussia2025-03-25King, Christopher A Esq NEGOTIATION28Elwin Sharvill
1007Jennifer AmigonSpain2025-03-26Rousseaux, Michael Esq UNQUALIFIED85Stephen Shaw
1008Wickens NestleUnited Kingdom2025-03-25Printing Dimensions QUALIFIED87Amy Elsner
1009Isabel BowleyArgentina2025-04-08Buckley Miller Wright NEGOTIATION15Elwin Sharvill
1010Maria MarrierItaly2025-03-23King, Christopher A Esq NEGOTIATION29Anna Fali
1011Greenwood BologniaAustralia2025-03-20Printing Dimensions UNQUALIFIED49Onyama Limba
1012Faith GillianItaly2025-04-02Buckley Miller Wright QUALIFIED59Bernardo Dominic
1013Leon OldroydFrance2025-03-28Chemel, James L Cpa QUALIFIED54Xuxue Feng
1014Maisha RulapaughArgentina2025-04-08King, Christopher A Esq QUALIFIED21Bernardo Dominic
1015Francesco ShinkoCanada2025-04-01Rousseaux, Michael Esq UNQUALIFIED22Stephen Shaw
1016Rodrigues CampainBrazil2025-03-26Feltz Printing Service QUALIFIED62Onyama Limba
1017Costa DilliardCanada2025-04-02Dorl, James J Esq RENEWAL60Anna Fali
1018Mujtaba NickaCanada2025-03-28Chemel, James L Cpa RENEWAL91Xuxue Feng
1019Ashley DoeBrazil2025-03-31Feltz Printing Service RENEWAL59Xuxue Feng
1020Juan WieserIndia2025-03-20Rangoni Of Florence PROPOSAL12Ivan Magalhaes
1021Faith GillianJapan2025-03-24Feltz Printing Service QUALIFIED73Anna Fali
1022Aika InouyeItaly2025-04-07Feltz Printing Service NEGOTIATION56Stephen Shaw
1023Adams MorascaIndia2025-03-24Rangoni Of Florence NEW52Asiya Javayant
1024Antonio CaudyFrance2025-04-08Feltz Printing Service PROPOSAL27Ivan Magalhaes
1025Adams MorascaUnited Kingdom2025-03-25King, Christopher A Esq NEGOTIATION19Elwin Sharvill
1026Faith GillianIndia2025-04-05Chapman, Ross E Esq NEW25Anna Fali
1027Claire TollnerArgentina2025-03-24Chanay, Jeffrey A Esq PROPOSAL64Elwin Sharvill
1028Alejandro PerinArgentina2025-03-22Dorl, James J Esq UNQUALIFIED86Onyama Limba
1029Izzy GarufiFrance2025-03-22Rangoni Of Florence RENEWAL69Anna Fali
1030Antonio CaudyJapan2025-03-22Commercial Press UNQUALIFIED71Ioni Bowcher
1031Isabel BowleySpain2025-03-18Dorl, James J Esq QUALIFIED75Asiya Javayant
1032Darci PoquetteAustralia2025-04-01Dorl, James J Esq RENEWAL3Amy Elsner
1033Johnson SergiJapan2025-04-15Chemel, James L Cpa RENEWAL88Xuxue Feng
1034Julie StensethSpain2025-03-28Commercial Press NEW52Elwin Sharvill
1035Octavia MaletCanada2025-03-21Printing Dimensions RENEWAL10Amy Elsner
1036Faith GillianArgentina2025-03-17Dorl, James J Esq QUALIFIED10Onyama Limba
1037Leon OldroydJapan2025-03-17Chapman, Ross E Esq UNQUALIFIED11Xuxue Feng
1038Stacey MacleadUnited Kingdom2025-04-09Chapman, Ross E Esq NEGOTIATION60Bernardo Dominic
1039Kadeem FlosiUnited Kingdom2025-04-05Feltz Printing Service NEW84Bernardo Dominic
1040Wickens NestleIndia2025-03-22Rousseaux, Michael Esq UNQUALIFIED64Ivan Magalhaes
1041Morrow RutaFrance2025-03-24King, Christopher A Esq QUALIFIED6Asiya Javayant
1042Johnson SergiBrazil2025-04-01Rousseaux, Michael Esq NEW54Stephen Shaw
1043Aika InouyeArgentina2025-04-14Feiner Bros UNQUALIFIED26Ioni Bowcher
1044David DarakjyRussia2025-04-12Rousseaux, Michael Esq PROPOSAL73Amy Elsner
1045Antonio CaudyUnited Kingdom2025-04-05Feiner Bros NEGOTIATION28Amy Elsner
1046Aika InouyeArgentina2025-03-26Printing Dimensions UNQUALIFIED71Xuxue Feng
1047Smith GlickFrance2025-04-11Benton, John B Jr UNQUALIFIED68Stephen Shaw
1048Silvio SlusarskiCanada2025-04-04Commercial Press NEW19Stephen Shaw
1049Munro FerenczGermany2025-03-23King, Christopher A Esq QUALIFIED70Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Wickens NestleItalyAnna Fali UNQUALIFIED
Francesco ShinkoUnited KingdomElwin Sharvill QUALIFIED
James ButtAustraliaAnna Fali NEGOTIATION
Aika InouyeJapanStephen Shaw QUALIFIED
Greenwood BologniaItalyOnyama Limba UNQUALIFIED
David DarakjyFranceElwin Sharvill UNQUALIFIED
Salvatore StockhamAustraliaAnna Fali NEGOTIATION
Arvin AlbaresUnited KingdomElwin Sharvill PROPOSAL
Sinclair WaycottItalyXuxue Feng NEGOTIATION
James ButtJapanIoni Bowcher QUALIFIED
Johnson SergiJapanStephen Shaw PROPOSAL
Wickens NestleAustraliaStephen Shaw UNQUALIFIED
Morrow RutaItalyOnyama Limba QUALIFIED
Faith GillianRussiaAsiya Javayant PROPOSAL
Claire TollnerGermanyIvan Magalhaes UNQUALIFIED
Ricardo GauchoArgentinaXuxue Feng RENEWAL
Ashley DoeGermanyAsiya Javayant QUALIFIED
Johnson SergiSpainAmy Elsner QUALIFIED
Kaitlin OstroskyArgentinaAnna Fali PROPOSAL
Julie StensethJapanStephen Shaw QUALIFIED
Isabel BowleyArgentinaAsiya Javayant NEGOTIATION
Deepesh ChuiJapanOnyama Limba UNQUALIFIED
Kaitlin OstroskyFranceStephen Shaw QUALIFIED
Izzy GarufiSpainXuxue Feng RENEWAL
David DarakjyFranceStephen Shaw QUALIFIED
Wickens NestleRussiaStephen Shaw RENEWAL
Ashley DoeFranceAnna Fali QUALIFIED
Costa DilliardArgentinaIoni Bowcher UNQUALIFIED
Salvatore StockhamAustraliaAnna Fali NEW
Jones VocelkaFranceStephen Shaw UNQUALIFIED
Octavia MaletGermanyElwin Sharvill QUALIFIED
Francesco ShinkoAustraliaIoni Bowcher RENEWAL
Antonio CaudyItalyIvan Magalhaes QUALIFIED
Ricardo GauchoGermanyIvan Magalhaes PROPOSAL
Adams MorascaIndiaOnyama Limba PROPOSAL
Mayumi KolmetzGermanyAnna Fali NEW
Antonio CaudyBrazilBernardo Dominic PROPOSAL
Kadeem FlosiArgentinaXuxue Feng RENEWAL
Aditya KuskoSpainOnyama Limba NEGOTIATION
Jefferson SchemmerFranceOnyama Limba QUALIFIED
Ivar PaprockiGermanyOnyama Limba UNQUALIFIED
Kaitlin OstroskySpainIoni Bowcher NEGOTIATION
Octavia MaletItalyBernardo Dominic NEW
Kaitlin OstroskyBrazilAsiya Javayant RENEWAL
Smith GlickRussiaXuxue Feng RENEWAL
Wickens NestleJapanIvan Magalhaes NEW
Kaitlin OstroskyArgentinaBernardo Dominic PROPOSAL
Greenwood BologniaArgentinaBernardo Dominic NEGOTIATION
Cody SaylorsAustraliaAmy Elsner QUALIFIED
Aika InouyeArgentinaElwin Sharvill UNQUALIFIED
Frozen Columns
Name
Munro Ferencz
Johnson Sergi
Isabel Bowley
Sinclair Waycott
Aruna Figeroa
Clifford Rim
Adams Morasca
Antonio Caudy
Leja Caldarera
Greenwood Bolognia
Jennifer Amigon
Mujtaba Nicka
Aditya Kusko
Claire Tollner
Jefferson Schemmer
Kadeem Flosi
Sinclair Waycott
Clifford Rim
James Butt
Cody Saylors
Kadeem Flosi
Greenwood Bolognia
Aditya Kusko
Jefferson Schemmer
Ivar Paprocki
Mujtaba Nicka
Munro Ferencz
Kaitlin Ostrosky
Mujtaba Nicka
Rodrigues Campain
Ricardo Gaucho
Smith Glick
Rodrigues Campain
Ivar Paprocki
Costa Dilliard
Smith Glick
Maria Marrier
Nicolas Iturbide
Morrow Ruta
Maisha Rulapaugh
Mujtaba Nicka
Jeanfrancois Venere
Alejandro Perin
Costa Dilliard
Izzy Garufi
Cody Saylors
Tony Foller
Octavia Malet
Morrow Ruta
David Darakjy
IdCountryDate
1000France2025-04-14
1001United Kingdom2025-03-29
1002Japan2025-03-27
1003Russia2025-03-21
1004Russia2025-03-21
1005India2025-03-21
1006Russia2025-03-28
1007Australia2025-03-25
1008France2025-04-09
1009India2025-03-24
1010Japan2025-04-10
1011Australia2025-04-12
1012Russia2025-03-31
1013India2025-04-09
1014Australia2025-03-20
1015Australia2025-04-09
1016Canada2025-03-22
1017Canada2025-04-02
1018Japan2025-04-12
1019France2025-04-10
1020Argentina2025-03-20
1021United Kingdom2025-03-30
1022France2025-03-25
1023Russia2025-04-10
1024Canada2025-03-28
1025Spain2025-04-01
1026Argentina2025-03-22
1027Japan2025-04-08
1028India2025-04-10
1029Italy2025-03-22
1030Brazil2025-04-01
1031Russia2025-04-04
1032Argentina2025-04-02
1033Australia2025-04-03
1034Canada2025-04-05
1035United Kingdom2025-03-23
1036Italy2025-04-09
1037Brazil2025-03-17
1038Australia2025-03-20
1039Brazil2025-04-13
1040United Kingdom2025-03-28
1041France2025-04-12
1042Canada2025-04-11
1043Canada2025-04-09
1044Brazil2025-04-11
1045Brazil2025-04-01
1046Japan2025-04-03
1047Germany2025-03-18
1048Germany2025-03-25
1049France2025-04-12

On-Demand Data

NameIdCountryDate
Darci Poquette1000Japan2025-04-05
Wickens Nestle1001United Kingdom2025-04-08
Rodrigues Campain1002Italy2025-04-05
Silvio Slusarski1003France2025-03-20
David Darakjy1004Russia2025-04-05
Maria Marrier1005Argentina2025-03-29
Aika Inouye1006United Kingdom2025-03-20
Claire Tollner1007Australia2025-03-20
Ashley Doe1008Argentina2025-03-21
Faith Gillian1009Spain2025-03-28
Izzy Garufi1010Spain2025-04-07
Leon Oldroyd1011Italy2025-04-04
Deepesh Chui1012Canada2025-03-31
Aruna Figeroa1013Brazil2025-03-23
Kaitlin Ostrosky1014Canada2025-03-21
Isabel Bowley1015Russia2025-03-19
Jefferson Schemmer1016Australia2025-03-17
Arvin Albares1017United Kingdom2025-04-13
Faith Gillian1018Japan2025-03-24
Chavez Briddick1019Germany2025-03-23
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Maisha RulapaughFranceAnna Fali UNQUALIFIED
Deepesh ChuiJapanElwin Sharvill UNQUALIFIED
Aruna FigeroaIndiaAsiya Javayant UNQUALIFIED
Jeanfrancois VenereIndiaIvan Magalhaes PROPOSAL
Mayumi KolmetzRussiaElwin Sharvill RENEWAL
James ButtCanadaIvan Magalhaes NEW
Jennifer AmigonGermanyAnna Fali NEGOTIATION
Adams MorascaJapanOnyama Limba QUALIFIED
Rodrigues CampainSpainIoni Bowcher NEGOTIATION
Maria MarrierIndiaAmy Elsner RENEWAL
Nicolas IturbideAustraliaBernardo Dominic UNQUALIFIED
Nicolas IturbideJapanAsiya Javayant RENEWAL
Sinclair WaycottAustraliaElwin Sharvill NEW
Wickens NestleGermanyOnyama Limba NEW
Rodrigues CampainArgentinaAsiya Javayant QUALIFIED
Smith GlickArgentinaIvan Magalhaes NEGOTIATION
Julie StensethCanadaStephen Shaw NEGOTIATION
Salvatore StockhamArgentinaAnna Fali NEGOTIATION
Jones VocelkaIndiaElwin Sharvill PROPOSAL
Clifford RimBrazilAmy Elsner PROPOSAL
Francesco ShinkoGermanyAsiya Javayant NEW
Faith GillianAustraliaBernardo Dominic NEGOTIATION
Kadeem FlosiJapanOnyama Limba NEW
Stacey MacleadRussiaBernardo Dominic QUALIFIED
Misaki RoysterCanadaIoni Bowcher PROPOSAL
Adams MorascaCanadaElwin Sharvill QUALIFIED
Tony FollerIndiaElwin Sharvill NEGOTIATION
Julie StensethRussiaBernardo Dominic RENEWAL
Jeanfrancois VenereFranceXuxue Feng QUALIFIED
Arvin AlbaresAustraliaXuxue Feng RENEWAL
Deepesh ChuiUnited KingdomXuxue Feng NEW
Darci PoquetteFranceXuxue Feng QUALIFIED
Leon OldroydAustraliaAsiya Javayant UNQUALIFIED
Aditya KuskoCanadaIoni Bowcher NEW
Clifford RimItalyAsiya Javayant PROPOSAL
Salvatore StockhamGermanyElwin Sharvill UNQUALIFIED
Faith GillianAustraliaOnyama Limba RENEWAL
Aruna FigeroaItalyAsiya Javayant PROPOSAL
Ivar PaprockiUnited KingdomXuxue Feng PROPOSAL
Maisha RulapaughJapanOnyama Limba UNQUALIFIED

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