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 GauchoUnited KingdomAsiya Javayant RENEWAL
Jennifer AmigonUnited KingdomAmy Elsner NEW
Claire TollnerIndiaStephen Shaw UNQUALIFIED
Juan WieserFranceBernardo Dominic RENEWAL
Darci PoquetteGermanyXuxue Feng RENEWAL
Octavia MaletGermanyElwin Sharvill PROPOSAL
Leja CaldareraUnited KingdomIvan Magalhaes PROPOSAL
David DarakjyBrazilStephen Shaw UNQUALIFIED
Misaki RoysterJapanAnna Fali UNQUALIFIED
Chavez BriddickBrazilBernardo Dominic NEGOTIATION
Morrow RutaArgentinaStephen Shaw UNQUALIFIED
Arvin AlbaresRussiaAmy Elsner NEGOTIATION
Kadeem FlosiItalyXuxue Feng NEW
Juan WieserJapanIvan Magalhaes NEW
Maria MarrierArgentinaIoni Bowcher PROPOSAL
Aditya KuskoBrazilStephen Shaw PROPOSAL
Julie StensethSpainIvan Magalhaes PROPOSAL
Munro FerenczSpainBernardo Dominic NEW
Morrow RutaCanadaIoni Bowcher QUALIFIED
Jeanfrancois VenereRussiaStephen Shaw NEW
Ivar PaprockiGermanyAnna Fali NEW
Adams MorascaArgentinaBernardo Dominic QUALIFIED
Izzy GarufiItalyIoni Bowcher RENEWAL
Cody SaylorsItalyOnyama Limba NEGOTIATION
David DarakjyRussiaElwin Sharvill NEGOTIATION
Tony FollerSpainAmy Elsner NEW
Maria MarrierGermanyStephen Shaw RENEWAL
Sinclair WaycottUnited KingdomXuxue Feng PROPOSAL
Smith GlickArgentinaOnyama Limba UNQUALIFIED
Maisha RulapaughJapanBernardo Dominic UNQUALIFIED
Ashley DoeItalyBernardo Dominic PROPOSAL
Faith GillianUnited KingdomXuxue Feng RENEWAL
Silvio SlusarskiJapanIoni Bowcher RENEWAL
Johnson SergiJapanAmy Elsner NEGOTIATION
Sinclair WaycottItalyXuxue Feng NEW
Rodrigues CampainArgentinaIvan Magalhaes NEW
Izzy GarufiRussiaAsiya Javayant RENEWAL
Morrow RutaAustraliaStephen Shaw NEGOTIATION
Antonio CaudyBrazilAsiya Javayant NEGOTIATION
Ivar PaprockiGermanyOnyama Limba PROPOSAL
Smith GlickFranceBernardo Dominic UNQUALIFIED
Kadeem FlosiSpainStephen Shaw QUALIFIED
Emily WhobreyIndiaXuxue Feng PROPOSAL
Isabel BowleyFranceAmy Elsner UNQUALIFIED
James ButtRussiaStephen Shaw PROPOSAL
Emily WhobreyFranceAnna Fali QUALIFIED
Costa DilliardIndiaStephen Shaw UNQUALIFIED
Misaki RoysterSpainXuxue Feng RENEWAL
Octavia MaletItalyStephen Shaw UNQUALIFIED
James ButtBrazilIoni Bowcher NEW
Horizontal
NameCountryRepresentativeStatus
Munro FerenczFranceOnyama Limba RENEWAL
Costa DilliardItalyOnyama Limba PROPOSAL
Leon OldroydBrazilBernardo Dominic NEW
Tony FollerRussiaStephen Shaw PROPOSAL
Jefferson SchemmerCanadaXuxue Feng QUALIFIED
Emily WhobreyJapanOnyama Limba NEGOTIATION
Juan WieserFranceAnna Fali PROPOSAL
Stacey MacleadCanadaOnyama Limba UNQUALIFIED
Chavez BriddickRussiaStephen Shaw PROPOSAL
Jefferson SchemmerCanadaStephen Shaw NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Emily WhobreyItaly2025-06-17Benton, John B Jr NEW92Xuxue Feng
1001Adams MorascaItaly2025-06-05Commercial Press PROPOSAL36Xuxue Feng
1002Claire TollnerSpain2025-06-12Feiner Bros NEGOTIATION24Xuxue Feng
1003Misaki RoysterUnited Kingdom2025-06-28Printing Dimensions NEW6Xuxue Feng
1004Julie StensethFrance2025-06-28Chemel, James L Cpa PROPOSAL78Elwin Sharvill
1005Darci PoquetteArgentina2025-06-05Chapman, Ross E Esq UNQUALIFIED84Asiya Javayant
1006Leja CaldareraFrance2025-06-30Benton, John B Jr RENEWAL32Amy Elsner
1007Mujtaba NickaSpain2025-06-05Chemel, James L Cpa RENEWAL38Ivan Magalhaes
1008Jones VocelkaCanada2025-06-23Morlong Associates NEGOTIATION7Ioni Bowcher
1009Jeanfrancois VenereCanada2025-06-24Printing Dimensions QUALIFIED84Ioni Bowcher
1010Costa DilliardIndia2025-06-15Feiner Bros UNQUALIFIED49Amy Elsner
1011Clifford RimItaly2025-06-21Chemel, James L Cpa UNQUALIFIED85Asiya Javayant
1012Nicolas IturbideGermany2025-06-30Commercial Press NEW91Amy Elsner
1013Munro FerenczCanada2025-06-30Chemel, James L Cpa NEGOTIATION86Xuxue Feng
1014Rodrigues CampainItaly2025-06-28Chapman, Ross E Esq NEW19Bernardo Dominic
1015Morrow RutaCanada2025-06-25Chapman, Ross E Esq UNQUALIFIED23Elwin Sharvill
1016Izzy GarufiRussia2025-06-03Dorl, James J Esq RENEWAL92Ivan Magalhaes
1017Jefferson SchemmerIndia2025-06-26King, Christopher A Esq RENEWAL73Onyama Limba
1018Ivar PaprockiGermany2025-06-02Printing Dimensions NEGOTIATION1Elwin Sharvill
1019Jefferson SchemmerArgentina2025-06-05Printing Dimensions RENEWAL87Ioni Bowcher
1020Izzy GarufiCanada2025-06-25Chapman, Ross E Esq RENEWAL92Ioni Bowcher
1021Johnson SergiFrance2025-06-09Rangoni Of Florence NEGOTIATION50Ioni Bowcher
1022Darci PoquetteFrance2025-06-19Benton, John B Jr NEW77Anna Fali
1023Kadeem FlosiFrance2025-06-23Benton, John B Jr QUALIFIED51Asiya Javayant
1024Nicolas IturbideAustralia2025-06-13Feiner Bros NEGOTIATION97Stephen Shaw
1025Jeanfrancois VenereJapan2025-06-27Chapman, Ross E Esq UNQUALIFIED9Ioni Bowcher
1026Ashley DoeBrazil2025-06-14Chapman, Ross E Esq QUALIFIED70Ivan Magalhaes
1027Cody SaylorsCanada2025-06-09Feiner Bros QUALIFIED47Elwin Sharvill
1028Jeanfrancois VenereJapan2025-06-12Benton, John B Jr RENEWAL35Ivan Magalhaes
1029Aditya KuskoAustralia2025-06-22Feiner Bros NEGOTIATION82Stephen Shaw
1030Jeanfrancois VenereIndia2025-06-04Truhlar And Truhlar Attys NEW67Bernardo Dominic
1031Maria MarrierRussia2025-06-05Morlong Associates QUALIFIED9Stephen Shaw
1032Jennifer AmigonFrance2025-06-05Morlong Associates NEGOTIATION6Xuxue Feng
1033Chavez BriddickCanada2025-06-04Truhlar And Truhlar Attys PROPOSAL52Ioni Bowcher
1034Mayumi KolmetzBrazil2025-06-19Chemel, James L Cpa QUALIFIED72Bernardo Dominic
1035Aditya KuskoRussia2025-06-29Rousseaux, Michael Esq RENEWAL4Bernardo Dominic
1036Misaki RoysterIndia2025-06-08Feiner Bros PROPOSAL4Stephen Shaw
1037Rodrigues CampainIndia2025-06-06Feltz Printing Service PROPOSAL98Asiya Javayant
1038Sinclair WaycottFrance2025-06-29Rangoni Of Florence NEW84Asiya Javayant
1039Aruna FigeroaGermany2025-06-07Feiner Bros UNQUALIFIED72Ivan Magalhaes
1040Jefferson SchemmerUnited Kingdom2025-06-24Rangoni Of Florence NEW53Asiya Javayant
1041Jones VocelkaSpain2025-06-04Rangoni Of Florence QUALIFIED83Onyama Limba
1042Maisha RulapaughCanada2025-06-25Commercial Press NEGOTIATION47Ivan Magalhaes
1043Rodrigues CampainFrance2025-06-21Chanay, Jeffrey A Esq QUALIFIED62Ioni Bowcher
1044Sinclair WaycottGermany2025-06-17Feiner Bros PROPOSAL10Amy Elsner
1045Antonio CaudyJapan2025-06-26Buckley Miller Wright NEW23Anna Fali
1046Silvio SlusarskiCanada2025-06-08Chapman, Ross E Esq NEW48Xuxue Feng
1047Jones VocelkaIndia2025-06-18Truhlar And Truhlar Attys UNQUALIFIED89Xuxue Feng
1048Sinclair WaycottArgentina2025-06-14Printing Dimensions QUALIFIED19Ioni Bowcher
1049Alejandro PerinArgentina2025-06-01King, Christopher A Esq UNQUALIFIED61Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Deepesh ChuiArgentinaElwin Sharvill QUALIFIED
Jeanfrancois VenereSpainAnna Fali QUALIFIED
Clifford RimBrazilAnna Fali RENEWAL
Costa DilliardRussiaIvan Magalhaes PROPOSAL
Julie StensethAustraliaAnna Fali QUALIFIED
Tony FollerFranceIoni Bowcher QUALIFIED
Mayumi KolmetzItalyAsiya Javayant NEGOTIATION
Jennifer AmigonSpainIoni Bowcher RENEWAL
Francesco ShinkoGermanyAsiya Javayant RENEWAL
Kaitlin OstroskyRussiaIvan Magalhaes QUALIFIED
Maisha RulapaughItalyAmy Elsner PROPOSAL
Wickens NestleUnited KingdomXuxue Feng NEGOTIATION
Misaki RoysterItalyIvan Magalhaes QUALIFIED
Adams MorascaCanadaXuxue Feng RENEWAL
James ButtJapanAnna Fali NEGOTIATION
Greenwood BologniaSpainAmy Elsner UNQUALIFIED
Leja CaldareraIndiaIvan Magalhaes UNQUALIFIED
James ButtBrazilAmy Elsner NEW
Deepesh ChuiUnited KingdomAnna Fali RENEWAL
Greenwood BologniaIndiaAmy Elsner NEGOTIATION
Greenwood BologniaFranceOnyama Limba NEW
Isabel BowleyGermanyIoni Bowcher UNQUALIFIED
Deepesh ChuiRussiaAmy Elsner NEW
Jennifer AmigonGermanyElwin Sharvill UNQUALIFIED
Misaki RoysterIndiaIoni Bowcher NEGOTIATION
Isabel BowleyItalyIvan Magalhaes PROPOSAL
Clifford RimRussiaIoni Bowcher UNQUALIFIED
Munro FerenczRussiaElwin Sharvill NEW
Claire TollnerIndiaElwin Sharvill PROPOSAL
Johnson SergiAustraliaElwin Sharvill PROPOSAL
Aruna FigeroaAustraliaAsiya Javayant QUALIFIED
Sinclair WaycottFranceIvan Magalhaes UNQUALIFIED
Munro FerenczGermanyBernardo Dominic NEW
Mayumi KolmetzSpainXuxue Feng NEGOTIATION
Sinclair WaycottItalyAsiya Javayant RENEWAL
Sinclair WaycottJapanAsiya Javayant NEGOTIATION
Leon OldroydIndiaElwin Sharvill NEGOTIATION
Salvatore StockhamJapanBernardo Dominic QUALIFIED
Leja CaldareraBrazilBernardo Dominic NEW
Salvatore StockhamIndiaAnna Fali PROPOSAL
Kaitlin OstroskyCanadaXuxue Feng RENEWAL
Jennifer AmigonAustraliaOnyama Limba NEGOTIATION
Leon OldroydRussiaStephen Shaw UNQUALIFIED
Sinclair WaycottRussiaIoni Bowcher PROPOSAL
Octavia MaletIndiaStephen Shaw PROPOSAL
Juan WieserFranceXuxue Feng PROPOSAL
Jones VocelkaArgentinaElwin Sharvill NEGOTIATION
Julie StensethRussiaStephen Shaw NEW
Ashley DoeIndiaIvan Magalhaes NEW
Faith GillianAustraliaIoni Bowcher RENEWAL
Frozen Columns
Name
Maisha Rulapaugh
Mayumi Kolmetz
Munro Ferencz
Claire Tollner
Ivar Paprocki
Jeanfrancois Venere
Ivar Paprocki
Aika Inouye
Maria Marrier
Maria Marrier
Julie Stenseth
Murillo Malet
Izzy Garufi
James Butt
Francesco Shinko
Stacey Maclead
Maisha Rulapaugh
Ashley Doe
Jefferson Schemmer
Munro Ferencz
Kadeem Flosi
Nicolas Iturbide
Aditya Kusko
Izzy Garufi
Kadeem Flosi
Claire Tollner
Murillo Malet
Cody Saylors
Deepesh Chui
Leja Caldarera
Darci Poquette
Costa Dilliard
Murillo Malet
Johnson Sergi
Ivar Paprocki
Deepesh Chui
Silvio Slusarski
Leja Caldarera
Darci Poquette
Darci Poquette
Sinclair Waycott
Cody Saylors
Nicolas Iturbide
Claire Tollner
Leja Caldarera
Jeanfrancois Venere
Murillo Malet
Cody Saylors
Mayumi Kolmetz
Deepesh Chui
IdCountryDate
1000Spain2025-06-30
1001Italy2025-06-29
1002United Kingdom2025-06-26
1003Russia2025-06-02
1004United Kingdom2025-06-25
1005Italy2025-06-12
1006Germany2025-06-10
1007Argentina2025-06-06
1008France2025-06-08
1009Italy2025-06-12
1010Japan2025-06-23
1011Italy2025-06-12
1012Canada2025-06-14
1013Japan2025-06-13
1014Canada2025-06-20
1015Australia2025-06-14
1016Japan2025-06-23
1017India2025-06-19
1018Argentina2025-06-21
1019Japan2025-06-12
1020Japan2025-06-02
1021Italy2025-06-19
1022Argentina2025-06-28
1023Brazil2025-06-02
1024United Kingdom2025-06-13
1025Argentina2025-06-08
1026Italy2025-06-08
1027Argentina2025-06-18
1028Brazil2025-06-22
1029Germany2025-06-08
1030Japan2025-06-29
1031India2025-06-20
1032Germany2025-06-10
1033Argentina2025-06-06
1034Australia2025-06-13
1035Russia2025-06-06
1036France2025-06-26
1037Russia2025-06-22
1038Argentina2025-06-07
1039United Kingdom2025-06-03
1040Australia2025-06-06
1041France2025-06-12
1042Brazil2025-06-26
1043Brazil2025-06-18
1044Russia2025-06-09
1045Russia2025-06-22
1046Brazil2025-06-20
1047France2025-06-04
1048Canada2025-06-17
1049India2025-06-30

On-Demand Data

NameIdCountryDate
Jones Vocelka1000United Kingdom2025-06-04
Ivar Paprocki1001Canada2025-06-14
Jeanfrancois Venere1002Argentina2025-06-02
Julie Stenseth1003Australia2025-06-02
Aruna Figeroa1004Argentina2025-06-25
Kaitlin Ostrosky1005Spain2025-06-13
Sinclair Waycott1006United Kingdom2025-06-28
Claire Tollner1007Germany2025-06-16
Clifford Rim1008France2025-06-12
Juan Wieser1009India2025-06-13
Aruna Figeroa1010Spain2025-06-26
Francesco Shinko1011Germany2025-06-23
Francesco Shinko1012France2025-06-16
Aditya Kusko1013Canada2025-06-07
Jennifer Amigon1014France2025-06-11
Claire Tollner1015Italy2025-06-03
Rodrigues Campain1016Italy2025-06-28
Aruna Figeroa1017Germany2025-06-24
Jones Vocelka1018France2025-06-17
Octavia Malet1019Japan2025-06-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aditya KuskoCanadaAnna Fali NEW
Juan WieserGermanyIoni Bowcher QUALIFIED
Johnson SergiJapanIvan Magalhaes UNQUALIFIED
Nicolas IturbideBrazilAnna Fali NEW
Mujtaba NickaGermanyBernardo Dominic RENEWAL
Darci PoquetteRussiaIvan Magalhaes NEGOTIATION
Mujtaba NickaCanadaBernardo Dominic NEGOTIATION
Morrow RutaItalyBernardo Dominic RENEWAL
Misaki RoysterRussiaXuxue Feng UNQUALIFIED
Deepesh ChuiGermanyBernardo Dominic RENEWAL
Aruna FigeroaCanadaIoni Bowcher NEGOTIATION
Juan WieserArgentinaElwin Sharvill RENEWAL
Kaitlin OstroskyAustraliaBernardo Dominic NEGOTIATION
Silvio SlusarskiIndiaAmy Elsner RENEWAL
Munro FerenczIndiaStephen Shaw UNQUALIFIED
Costa DilliardAustraliaStephen Shaw NEGOTIATION
Greenwood BologniaCanadaIvan Magalhaes NEGOTIATION
Leja CaldareraJapanXuxue Feng NEW
Leon OldroydArgentinaXuxue Feng PROPOSAL
Maria MarrierUnited KingdomXuxue Feng RENEWAL
Misaki RoysterIndiaOnyama Limba RENEWAL
Jennifer AmigonSpainStephen Shaw NEW
Chavez BriddickSpainElwin Sharvill NEW
Julie StensethRussiaElwin Sharvill RENEWAL
Salvatore StockhamBrazilStephen Shaw RENEWAL
Aruna FigeroaUnited KingdomXuxue Feng UNQUALIFIED
Misaki RoysterRussiaAnna Fali UNQUALIFIED
Isabel BowleyItalyBernardo Dominic QUALIFIED
Aika InouyeSpainBernardo Dominic NEGOTIATION
Wickens NestleFranceXuxue Feng PROPOSAL
Morrow RutaGermanyElwin Sharvill RENEWAL
Misaki RoysterFranceAmy Elsner NEW
Cody SaylorsGermanyAnna Fali UNQUALIFIED
Greenwood BologniaGermanyAnna Fali NEW
Sinclair WaycottIndiaOnyama Limba RENEWAL
Mujtaba NickaAustraliaAnna Fali NEGOTIATION
Jeanfrancois VenereBrazilStephen Shaw PROPOSAL
Octavia MaletSpainAsiya Javayant PROPOSAL
James ButtJapanOnyama Limba RENEWAL
Costa DilliardRussiaXuxue 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>