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
Wickens NestleGermanyBernardo Dominic UNQUALIFIED
Jones VocelkaArgentinaElwin Sharvill NEW
Smith GlickIndiaElwin Sharvill UNQUALIFIED
Maria MarrierAustraliaIvan Magalhaes NEW
Morrow RutaGermanyIoni Bowcher RENEWAL
Izzy GarufiGermanyAmy Elsner UNQUALIFIED
Chavez BriddickIndiaBernardo Dominic NEGOTIATION
Mayumi KolmetzSpainElwin Sharvill NEGOTIATION
Costa DilliardCanadaAnna Fali NEW
Leja CaldareraArgentinaAmy Elsner NEW
James ButtJapanAsiya Javayant NEGOTIATION
Faith GillianJapanElwin Sharvill UNQUALIFIED
Isabel BowleyIndiaXuxue Feng PROPOSAL
Ricardo GauchoItalyXuxue Feng RENEWAL
Adams MorascaCanadaOnyama Limba RENEWAL
Cody SaylorsCanadaOnyama Limba QUALIFIED
Tony FollerCanadaIvan Magalhaes RENEWAL
Jennifer AmigonRussiaOnyama Limba PROPOSAL
Juan WieserGermanyXuxue Feng NEGOTIATION
Murillo MaletGermanyOnyama Limba RENEWAL
Emily WhobreyUnited KingdomElwin Sharvill NEW
Leon OldroydAustraliaOnyama Limba UNQUALIFIED
Antonio CaudyFranceAsiya Javayant PROPOSAL
Maria MarrierItalyOnyama Limba NEGOTIATION
Jennifer AmigonFranceAsiya Javayant QUALIFIED
Aditya KuskoFranceIvan Magalhaes QUALIFIED
Mujtaba NickaGermanyXuxue Feng NEW
Faith GillianItalyBernardo Dominic PROPOSAL
Misaki RoysterRussiaBernardo Dominic PROPOSAL
Aruna FigeroaRussiaAsiya Javayant QUALIFIED
Chavez BriddickUnited KingdomIvan Magalhaes UNQUALIFIED
Cody SaylorsBrazilBernardo Dominic UNQUALIFIED
Aruna FigeroaGermanyIvan Magalhaes RENEWAL
Izzy GarufiSpainIoni Bowcher RENEWAL
Clifford RimJapanXuxue Feng NEW
Aruna FigeroaGermanyAmy Elsner UNQUALIFIED
Jones VocelkaRussiaBernardo Dominic UNQUALIFIED
David DarakjyBrazilAnna Fali NEW
Isabel BowleyBrazilAmy Elsner QUALIFIED
Deepesh ChuiFranceAsiya Javayant QUALIFIED
Juan WieserCanadaXuxue Feng NEGOTIATION
Faith GillianSpainIvan Magalhaes QUALIFIED
Ivar PaprockiItalyStephen Shaw NEGOTIATION
Octavia MaletFranceElwin Sharvill NEW
Smith GlickJapanBernardo Dominic UNQUALIFIED
Antonio CaudyJapanXuxue Feng UNQUALIFIED
Wickens NestleBrazilXuxue Feng NEGOTIATION
Izzy GarufiItalyIvan Magalhaes UNQUALIFIED
Chavez BriddickAustraliaAsiya Javayant NEW
Alejandro PerinBrazilElwin Sharvill NEW
Horizontal
NameCountryRepresentativeStatus
Greenwood BologniaCanadaIoni Bowcher UNQUALIFIED
Emily WhobreyGermanyAsiya Javayant UNQUALIFIED
David DarakjyJapanStephen Shaw NEW
Emily WhobreyJapanXuxue Feng RENEWAL
Misaki RoysterAustraliaXuxue Feng RENEWAL
Morrow RutaCanadaOnyama Limba PROPOSAL
Salvatore StockhamUnited KingdomIvan Magalhaes PROPOSAL
Izzy GarufiAustraliaAmy Elsner RENEWAL
Izzy GarufiSpainBernardo Dominic NEGOTIATION
Ashley DoeFranceXuxue Feng NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Jennifer AmigonSpain2025-08-15Buckley Miller Wright NEW48Bernardo Dominic
1001Nicolas IturbideUnited Kingdom2025-07-25Printing Dimensions NEW73Ioni Bowcher
1002Mayumi KolmetzAustralia2025-08-08Morlong Associates RENEWAL69Amy Elsner
1003Julie StensethGermany2025-08-06Feltz Printing Service RENEWAL15Anna Fali
1004Faith GillianFrance2025-08-13Chanay, Jeffrey A Esq QUALIFIED21Bernardo Dominic
1005Smith GlickFrance2025-08-01Benton, John B Jr PROPOSAL68Bernardo Dominic
1006Octavia MaletRussia2025-08-10Morlong Associates UNQUALIFIED86Anna Fali
1007Mujtaba NickaBrazil2025-08-12King, Christopher A Esq QUALIFIED62Elwin Sharvill
1008Stacey MacleadIndia2025-08-02Rousseaux, Michael Esq NEW8Onyama Limba
1009Ricardo GauchoJapan2025-07-31Chapman, Ross E Esq NEW17Stephen Shaw
1010Aika InouyeJapan2025-08-12Rangoni Of Florence QUALIFIED75Xuxue Feng
1011Izzy GarufiRussia2025-08-18Dorl, James J Esq PROPOSAL65Onyama Limba
1012Cody SaylorsJapan2025-08-19Printing Dimensions QUALIFIED68Stephen Shaw
1013Clifford RimIndia2025-07-28Rousseaux, Michael Esq NEGOTIATION19Anna Fali
1014David DarakjyAustralia2025-07-23Dorl, James J Esq NEGOTIATION79Ioni Bowcher
1015Aika InouyeRussia2025-08-19Feltz Printing Service RENEWAL10Onyama Limba
1016Deepesh ChuiArgentina2025-08-11Printing Dimensions NEW51Elwin Sharvill
1017Jefferson SchemmerSpain2025-07-30Truhlar And Truhlar Attys NEW98Bernardo Dominic
1018Mayumi KolmetzFrance2025-07-30Rousseaux, Michael Esq NEGOTIATION26Anna Fali
1019Sinclair WaycottRussia2025-08-10Buckley Miller Wright QUALIFIED89Ivan Magalhaes
1020Tony FollerRussia2025-08-11Feltz Printing Service RENEWAL38Elwin Sharvill
1021Johnson SergiSpain2025-08-20Chemel, James L Cpa QUALIFIED40Ivan Magalhaes
1022Maria MarrierJapan2025-08-07Rousseaux, Michael Esq PROPOSAL39Asiya Javayant
1023Mujtaba NickaItaly2025-08-09Printing Dimensions QUALIFIED8Stephen Shaw
1024Leja CaldareraItaly2025-08-03Benton, John B Jr UNQUALIFIED39Amy Elsner
1025Kaitlin OstroskyGermany2025-08-12Chemel, James L Cpa RENEWAL93Anna Fali
1026Jennifer AmigonJapan2025-07-24Rousseaux, Michael Esq PROPOSAL37Ioni Bowcher
1027Greenwood BologniaJapan2025-08-03Dorl, James J Esq RENEWAL18Stephen Shaw
1028Juan WieserFrance2025-08-17Chanay, Jeffrey A Esq PROPOSAL0Ivan Magalhaes
1029Smith GlickArgentina2025-08-05Chapman, Ross E Esq RENEWAL40Amy Elsner
1030Ivar PaprockiBrazil2025-07-30Commercial Press UNQUALIFIED13Elwin Sharvill
1031Aika InouyeFrance2025-08-14Feiner Bros QUALIFIED70Ivan Magalhaes
1032Leja CaldareraItaly2025-08-02Feltz Printing Service PROPOSAL57Xuxue Feng
1033Claire TollnerIndia2025-07-30Truhlar And Truhlar Attys QUALIFIED77Ioni Bowcher
1034Faith GillianCanada2025-08-08Morlong Associates RENEWAL38Amy Elsner
1035Silvio SlusarskiJapan2025-08-09Printing Dimensions NEGOTIATION6Anna Fali
1036Leon OldroydCanada2025-08-07Buckley Miller Wright UNQUALIFIED20Anna Fali
1037Claire TollnerFrance2025-08-06Feltz Printing Service UNQUALIFIED63Elwin Sharvill
1038Jones VocelkaCanada2025-07-28King, Christopher A Esq QUALIFIED70Xuxue Feng
1039Arvin AlbaresFrance2025-08-01Commercial Press PROPOSAL16Asiya Javayant
1040Murillo MaletCanada2025-08-10Dorl, James J Esq PROPOSAL8Anna Fali
1041Rodrigues CampainSpain2025-07-30Rousseaux, Michael Esq NEW8Ivan Magalhaes
1042Darci PoquetteFrance2025-08-09Feiner Bros NEGOTIATION84Ioni Bowcher
1043Jeanfrancois VenereItaly2025-08-14Chemel, James L Cpa PROPOSAL63Ioni Bowcher
1044Misaki RoysterArgentina2025-08-04Rangoni Of Florence NEGOTIATION86Stephen Shaw
1045Ashley DoeGermany2025-07-26Feltz Printing Service PROPOSAL98Onyama Limba
1046Clifford RimAustralia2025-08-17Truhlar And Truhlar Attys PROPOSAL14Ivan Magalhaes
1047Aditya KuskoSpain2025-08-17Rangoni Of Florence QUALIFIED64Elwin Sharvill
1048Faith GillianFrance2025-08-05Rousseaux, Michael Esq QUALIFIED8Elwin Sharvill
1049Kaitlin OstroskyGermany2025-08-21Commercial Press UNQUALIFIED47Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Kaitlin OstroskyUnited KingdomOnyama Limba PROPOSAL
Aditya KuskoRussiaAnna Fali UNQUALIFIED
Arvin AlbaresCanadaIoni Bowcher RENEWAL
Misaki RoysterCanadaOnyama Limba RENEWAL
Aika InouyeGermanyStephen Shaw NEGOTIATION
Aditya KuskoUnited KingdomIvan Magalhaes QUALIFIED
Juan WieserIndiaOnyama Limba NEGOTIATION
Salvatore StockhamAustraliaBernardo Dominic UNQUALIFIED
Clifford RimArgentinaXuxue Feng PROPOSAL
Sinclair WaycottIndiaStephen Shaw PROPOSAL
Izzy GarufiItalyAmy Elsner RENEWAL
Leja CaldareraUnited KingdomIvan Magalhaes NEGOTIATION
Leja CaldareraUnited KingdomElwin Sharvill NEW
Kaitlin OstroskyRussiaIvan Magalhaes NEGOTIATION
Johnson SergiSpainAnna Fali NEW
Juan WieserSpainBernardo Dominic NEGOTIATION
Maria MarrierRussiaAsiya Javayant NEGOTIATION
Chavez BriddickRussiaXuxue Feng QUALIFIED
Arvin AlbaresSpainIoni Bowcher NEGOTIATION
Francesco ShinkoSpainStephen Shaw RENEWAL
Alejandro PerinBrazilIoni Bowcher NEGOTIATION
Deepesh ChuiRussiaBernardo Dominic NEW
Juan WieserItalyAnna Fali QUALIFIED
Leon OldroydIndiaAsiya Javayant RENEWAL
Ashley DoeCanadaElwin Sharvill UNQUALIFIED
Darci PoquetteFranceIvan Magalhaes RENEWAL
Leja CaldareraCanadaIoni Bowcher NEW
Faith GillianBrazilAmy Elsner NEW
Maisha RulapaughSpainStephen Shaw NEW
Chavez BriddickBrazilStephen Shaw NEW
Wickens NestleUnited KingdomIoni Bowcher QUALIFIED
Tony FollerCanadaAsiya Javayant UNQUALIFIED
Smith GlickJapanAsiya Javayant QUALIFIED
Cody SaylorsJapanElwin Sharvill NEGOTIATION
Mujtaba NickaSpainXuxue Feng UNQUALIFIED
James ButtArgentinaAmy Elsner PROPOSAL
Jones VocelkaCanadaBernardo Dominic PROPOSAL
Morrow RutaIndiaElwin Sharvill NEW
Octavia MaletIndiaBernardo Dominic NEGOTIATION
Tony FollerFranceAsiya Javayant NEW
Antonio CaudyAustraliaElwin Sharvill NEW
Emily WhobreyIndiaOnyama Limba UNQUALIFIED
Aruna FigeroaBrazilOnyama Limba QUALIFIED
Jefferson SchemmerUnited KingdomIoni Bowcher RENEWAL
Faith GillianBrazilAsiya Javayant PROPOSAL
Costa DilliardIndiaOnyama Limba NEW
Claire TollnerIndiaAsiya Javayant QUALIFIED
Costa DilliardArgentinaElwin Sharvill RENEWAL
Juan WieserItalyBernardo Dominic NEGOTIATION
Aruna FigeroaArgentinaAsiya Javayant NEGOTIATION
Frozen Columns
Name
Julie Stenseth
Aditya Kusko
Mujtaba Nicka
Juan Wieser
Kaitlin Ostrosky
David Darakjy
Mujtaba Nicka
Clifford Rim
Tony Foller
Francesco Shinko
Arvin Albares
Aditya Kusko
Jones Vocelka
Chavez Briddick
Leja Caldarera
Costa Dilliard
Rodrigues Campain
Jones Vocelka
David Darakjy
Faith Gillian
Silvio Slusarski
David Darakjy
Greenwood Bolognia
Adams Morasca
Tony Foller
Aditya Kusko
Octavia Malet
Costa Dilliard
Leon Oldroyd
Salvatore Stockham
Salvatore Stockham
James Butt
James Butt
Adams Morasca
Sinclair Waycott
Julie Stenseth
Kaitlin Ostrosky
Clifford Rim
Nicolas Iturbide
Wickens Nestle
Julie Stenseth
Octavia Malet
Sinclair Waycott
Octavia Malet
Arvin Albares
Aika Inouye
Leon Oldroyd
Jefferson Schemmer
Tony Foller
Mujtaba Nicka
IdCountryDate
1000Italy2025-08-17
1001United Kingdom2025-08-13
1002Canada2025-08-04
1003France2025-08-15
1004France2025-07-26
1005Germany2025-08-05
1006Germany2025-08-16
1007France2025-08-08
1008France2025-08-01
1009Spain2025-07-24
1010Spain2025-08-08
1011Germany2025-07-31
1012Brazil2025-08-09
1013Brazil2025-08-16
1014India2025-08-21
1015Canada2025-07-29
1016Spain2025-08-18
1017France2025-07-29
1018Germany2025-07-26
1019Brazil2025-08-04
1020France2025-07-25
1021United Kingdom2025-08-06
1022Italy2025-08-18
1023Russia2025-08-13
1024Russia2025-08-11
1025Argentina2025-08-04
1026Canada2025-08-11
1027Canada2025-08-04
1028Australia2025-08-05
1029Spain2025-07-29
1030Brazil2025-08-18
1031Canada2025-07-23
1032France2025-08-14
1033Italy2025-07-25
1034United Kingdom2025-08-07
1035United Kingdom2025-08-19
1036France2025-08-18
1037Germany2025-07-25
1038Germany2025-08-06
1039Argentina2025-07-23
1040Spain2025-07-29
1041Spain2025-08-05
1042Brazil2025-08-04
1043Japan2025-07-30
1044Russia2025-08-19
1045Germany2025-07-29
1046Japan2025-07-26
1047Japan2025-08-01
1048India2025-07-28
1049Argentina2025-07-27

On-Demand Data

NameIdCountryDate
Ashley Doe1000Germany2025-08-14
Wickens Nestle1001Russia2025-07-27
Maisha Rulapaugh1002Spain2025-07-26
Greenwood Bolognia1003France2025-07-31
Francesco Shinko1004Japan2025-08-14
Ashley Doe1005Brazil2025-08-05
Leon Oldroyd1006United Kingdom2025-08-04
Cody Saylors1007Italy2025-08-09
Clifford Rim1008Canada2025-07-23
Isabel Bowley1009Italy2025-08-02
Darci Poquette1010Canada2025-08-11
Octavia Malet1011Germany2025-07-29
Silvio Slusarski1012Brazil2025-08-20
Smith Glick1013Japan2025-08-13
Francesco Shinko1014Germany2025-08-06
Darci Poquette1015Germany2025-07-31
Murillo Malet1016Argentina2025-07-28
Costa Dilliard1017Germany2025-08-02
Munro Ferencz1018Argentina2025-07-31
Julie Stenseth1019United Kingdom2025-08-14
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Cody SaylorsGermanyElwin Sharvill UNQUALIFIED
Aditya KuskoBrazilIoni Bowcher QUALIFIED
Mujtaba NickaRussiaIoni Bowcher UNQUALIFIED
Greenwood BologniaBrazilAmy Elsner UNQUALIFIED
Deepesh ChuiJapanBernardo Dominic RENEWAL
Leon OldroydSpainBernardo Dominic NEGOTIATION
Ricardo GauchoArgentinaXuxue Feng QUALIFIED
Morrow RutaSpainOnyama Limba PROPOSAL
Aika InouyeAustraliaOnyama Limba RENEWAL
Julie StensethFranceIvan Magalhaes QUALIFIED
Leon OldroydItalyStephen Shaw UNQUALIFIED
Mayumi KolmetzBrazilOnyama Limba NEGOTIATION
David DarakjyRussiaXuxue Feng RENEWAL
Julie StensethBrazilAsiya Javayant UNQUALIFIED
Juan WieserArgentinaAsiya Javayant UNQUALIFIED
Arvin AlbaresSpainStephen Shaw NEGOTIATION
Rodrigues CampainFranceOnyama Limba NEGOTIATION
Mujtaba NickaIndiaStephen Shaw QUALIFIED
Murillo MaletBrazilAsiya Javayant UNQUALIFIED
Costa DilliardCanadaElwin Sharvill NEGOTIATION
Chavez BriddickSpainStephen Shaw RENEWAL
Wickens NestleJapanIvan Magalhaes QUALIFIED
David DarakjySpainAmy Elsner PROPOSAL
Izzy GarufiJapanOnyama Limba PROPOSAL
Emily WhobreySpainElwin Sharvill RENEWAL
Octavia MaletItalyAsiya Javayant NEW
Juan WieserJapanXuxue Feng NEGOTIATION
Isabel BowleySpainAnna Fali RENEWAL
Murillo MaletIndiaAsiya Javayant RENEWAL
Wickens NestleRussiaAsiya Javayant NEGOTIATION
Jefferson SchemmerRussiaStephen Shaw NEW
Francesco ShinkoAustraliaXuxue Feng UNQUALIFIED
Kadeem FlosiSpainBernardo Dominic NEGOTIATION
Wickens NestleFranceAsiya Javayant PROPOSAL
Leon OldroydJapanIvan Magalhaes QUALIFIED
Tony FollerSpainAnna Fali QUALIFIED
Smith GlickSpainStephen Shaw UNQUALIFIED
Maria MarrierAustraliaAmy Elsner QUALIFIED
Jeanfrancois VenereJapanIvan Magalhaes QUALIFIED
Adams MorascaGermanyAmy Elsner PROPOSAL

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