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
Morrow RutaCanadaAmy Elsner NEGOTIATION
Jennifer AmigonJapanAsiya Javayant PROPOSAL
Emily WhobreyGermanyStephen Shaw NEW
Claire TollnerAustraliaXuxue Feng NEW
Nicolas IturbideBrazilIvan Magalhaes NEW
Isabel BowleyIndiaXuxue Feng NEW
Aditya KuskoBrazilAmy Elsner UNQUALIFIED
Izzy GarufiJapanIoni Bowcher PROPOSAL
Julie StensethJapanXuxue Feng PROPOSAL
Johnson SergiGermanyAsiya Javayant UNQUALIFIED
Chavez BriddickBrazilElwin Sharvill RENEWAL
Isabel BowleyIndiaXuxue Feng PROPOSAL
Murillo MaletBrazilIvan Magalhaes NEW
Jennifer AmigonIndiaAnna Fali QUALIFIED
Tony FollerBrazilXuxue Feng PROPOSAL
Isabel BowleyIndiaAmy Elsner QUALIFIED
Salvatore StockhamSpainStephen Shaw PROPOSAL
Morrow RutaBrazilElwin Sharvill QUALIFIED
Aruna FigeroaItalyXuxue Feng PROPOSAL
Leja CaldareraAustraliaAmy Elsner UNQUALIFIED
Darci PoquetteFranceElwin Sharvill UNQUALIFIED
Chavez BriddickBrazilAsiya Javayant UNQUALIFIED
Silvio SlusarskiUnited KingdomIoni Bowcher RENEWAL
Antonio CaudyArgentinaAsiya Javayant NEGOTIATION
Arvin AlbaresArgentinaIvan Magalhaes NEW
Claire TollnerGermanyIoni Bowcher PROPOSAL
David DarakjyUnited KingdomIoni Bowcher NEGOTIATION
Julie StensethFranceBernardo Dominic NEGOTIATION
Munro FerenczItalyStephen Shaw UNQUALIFIED
Isabel BowleyItalyAmy Elsner UNQUALIFIED
Julie StensethBrazilAsiya Javayant PROPOSAL
Chavez BriddickGermanyXuxue Feng RENEWAL
Julie StensethCanadaElwin Sharvill PROPOSAL
Maria MarrierCanadaStephen Shaw PROPOSAL
Cody SaylorsRussiaAnna Fali RENEWAL
Costa DilliardSpainAmy Elsner NEGOTIATION
Sinclair WaycottFranceAnna Fali NEW
Mujtaba NickaFranceIoni Bowcher PROPOSAL
Munro FerenczSpainAnna Fali NEGOTIATION
Tony FollerUnited KingdomIoni Bowcher NEGOTIATION
James ButtAustraliaOnyama Limba NEW
Claire TollnerCanadaBernardo Dominic NEW
Johnson SergiCanadaAsiya Javayant NEW
Kadeem FlosiFranceAsiya Javayant NEW
Isabel BowleyGermanyAnna Fali NEGOTIATION
Francesco ShinkoRussiaAmy Elsner NEW
Greenwood BologniaUnited KingdomStephen Shaw PROPOSAL
Nicolas IturbideAustraliaStephen Shaw NEW
Ivar PaprockiJapanOnyama Limba RENEWAL
Francesco ShinkoCanadaAsiya Javayant UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Morrow RutaGermanyOnyama Limba QUALIFIED
Silvio SlusarskiRussiaAsiya Javayant PROPOSAL
Cody SaylorsGermanyElwin Sharvill RENEWAL
Nicolas IturbideArgentinaIoni Bowcher NEGOTIATION
Octavia MaletGermanyAsiya Javayant QUALIFIED
Wickens NestleItalyAnna Fali NEGOTIATION
James ButtGermanyAnna Fali RENEWAL
Maisha RulapaughSpainElwin Sharvill NEGOTIATION
Ricardo GauchoJapanIoni Bowcher NEGOTIATION
Juan WieserCanadaAnna Fali UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Juan WieserIndia2025-09-22Truhlar And Truhlar Attys RENEWAL14Amy Elsner
1001Arvin AlbaresSpain2025-09-22Feltz Printing Service RENEWAL27Bernardo Dominic
1002Isabel BowleyGermany2025-09-26Chanay, Jeffrey A Esq PROPOSAL28Elwin Sharvill
1003Claire TollnerCanada2025-09-20Feltz Printing Service UNQUALIFIED41Ivan Magalhaes
1004Morrow RutaCanada2025-09-19Rousseaux, Michael Esq QUALIFIED64Ivan Magalhaes
1005Adams MorascaUnited Kingdom2025-09-12Chemel, James L Cpa RENEWAL52Stephen Shaw
1006Octavia MaletBrazil2025-09-14Chanay, Jeffrey A Esq UNQUALIFIED2Stephen Shaw
1007Jefferson SchemmerSpain2025-10-03Rousseaux, Michael Esq NEGOTIATION73Stephen Shaw
1008Antonio CaudyArgentina2025-09-22Chanay, Jeffrey A Esq PROPOSAL78Xuxue Feng
1009Mayumi KolmetzUnited Kingdom2025-09-18Morlong Associates QUALIFIED7Bernardo Dominic
1010Aruna FigeroaSpain2025-09-17Feiner Bros RENEWAL87Amy Elsner
1011Salvatore StockhamRussia2025-09-15King, Christopher A Esq RENEWAL29Anna Fali
1012James ButtFrance2025-09-21Feltz Printing Service NEW87Stephen Shaw
1013Aika InouyeIndia2025-10-02Truhlar And Truhlar Attys UNQUALIFIED86Asiya Javayant
1014Darci PoquetteAustralia2025-10-02Feltz Printing Service UNQUALIFIED51Onyama Limba
1015David DarakjyGermany2025-09-19Buckley Miller Wright QUALIFIED35Amy Elsner
1016Mayumi KolmetzItaly2025-10-02Feltz Printing Service NEW30Xuxue Feng
1017Francesco ShinkoJapan2025-09-20Rousseaux, Michael Esq NEW70Amy Elsner
1018Antonio CaudyGermany2025-09-28Chanay, Jeffrey A Esq UNQUALIFIED72Asiya Javayant
1019Murillo MaletFrance2025-09-27Printing Dimensions UNQUALIFIED83Ioni Bowcher
1020Nicolas IturbideJapan2025-09-13Truhlar And Truhlar Attys NEW83Asiya Javayant
1021Deepesh ChuiCanada2025-09-14Rousseaux, Michael Esq NEW95Ioni Bowcher
1022Faith GillianRussia2025-10-09Rousseaux, Michael Esq RENEWAL50Asiya Javayant
1023Isabel BowleyGermany2025-10-05Commercial Press NEGOTIATION90Amy Elsner
1024Nicolas IturbideJapan2025-09-13Feiner Bros NEGOTIATION21Onyama Limba
1025Aruna FigeroaRussia2025-10-01Chapman, Ross E Esq NEW77Stephen Shaw
1026Claire TollnerIndia2025-09-14Truhlar And Truhlar Attys NEGOTIATION99Xuxue Feng
1027Jefferson SchemmerArgentina2025-10-01Chanay, Jeffrey A Esq RENEWAL9Asiya Javayant
1028Maria MarrierIndia2025-09-25Morlong Associates NEW52Elwin Sharvill
1029Ashley DoeJapan2025-10-05Truhlar And Truhlar Attys NEGOTIATION84Elwin Sharvill
1030Wickens NestleArgentina2025-10-01Chapman, Ross E Esq PROPOSAL9Bernardo Dominic
1031Wickens NestleBrazil2025-10-07Printing Dimensions RENEWAL42Elwin Sharvill
1032Clifford RimAustralia2025-09-30Dorl, James J Esq UNQUALIFIED79Ioni Bowcher
1033Octavia MaletUnited Kingdom2025-10-04Chemel, James L Cpa RENEWAL15Elwin Sharvill
1034Julie StensethSpain2025-09-20Printing Dimensions NEGOTIATION3Amy Elsner
1035Smith GlickFrance2025-09-13Morlong Associates NEGOTIATION61Onyama Limba
1036Jeanfrancois VenereArgentina2025-09-25Feltz Printing Service RENEWAL81Ioni Bowcher
1037Francesco ShinkoFrance2025-09-22Rousseaux, Michael Esq QUALIFIED12Asiya Javayant
1038Wickens NestleFrance2025-10-01Chanay, Jeffrey A Esq NEW31Asiya Javayant
1039Smith GlickJapan2025-09-14Rangoni Of Florence NEW63Ivan Magalhaes
1040Jennifer AmigonBrazil2025-10-04King, Christopher A Esq RENEWAL96Amy Elsner
1041Johnson SergiArgentina2025-09-21Chemel, James L Cpa QUALIFIED52Asiya Javayant
1042Aditya KuskoCanada2025-10-07Truhlar And Truhlar Attys UNQUALIFIED56Xuxue Feng
1043Leja CaldareraFrance2025-09-24Buckley Miller Wright PROPOSAL70Stephen Shaw
1044Greenwood BologniaJapan2025-10-07Chanay, Jeffrey A Esq NEW32Bernardo Dominic
1045David DarakjyItaly2025-10-04Rangoni Of Florence PROPOSAL74Anna Fali
1046Maisha RulapaughJapan2025-09-23King, Christopher A Esq NEW47Amy Elsner
1047Greenwood BologniaUnited Kingdom2025-09-19Feiner Bros PROPOSAL69Onyama Limba
1048Kadeem FlosiGermany2025-09-18King, Christopher A Esq NEW80Amy Elsner
1049Ashley DoeIndia2025-10-01Rousseaux, Michael Esq RENEWAL99Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Aruna FigeroaIndiaAmy Elsner QUALIFIED
Smith GlickBrazilIoni Bowcher QUALIFIED
Izzy GarufiGermanyElwin Sharvill RENEWAL
Rodrigues CampainJapanIvan Magalhaes NEW
Misaki RoysterRussiaXuxue Feng QUALIFIED
Tony FollerFranceOnyama Limba RENEWAL
Alejandro PerinGermanyStephen Shaw UNQUALIFIED
Octavia MaletFranceXuxue Feng RENEWAL
Isabel BowleyItalyAnna Fali PROPOSAL
Deepesh ChuiGermanyBernardo Dominic NEW
Leon OldroydSpainOnyama Limba NEGOTIATION
Emily WhobreySpainBernardo Dominic UNQUALIFIED
Aika InouyeUnited KingdomElwin Sharvill RENEWAL
Kadeem FlosiGermanyIoni Bowcher UNQUALIFIED
Murillo MaletBrazilAnna Fali QUALIFIED
Ricardo GauchoFranceAmy Elsner QUALIFIED
Munro FerenczFranceOnyama Limba QUALIFIED
Cody SaylorsArgentinaAnna Fali QUALIFIED
Sinclair WaycottSpainAsiya Javayant NEW
Wickens NestleItalyAnna Fali NEGOTIATION
Clifford RimFranceAsiya Javayant QUALIFIED
Antonio CaudyIndiaAnna Fali RENEWAL
Morrow RutaRussiaIvan Magalhaes QUALIFIED
Maisha RulapaughCanadaIoni Bowcher NEGOTIATION
Jennifer AmigonSpainElwin Sharvill NEW
Juan WieserGermanyBernardo Dominic NEW
Jones VocelkaFranceElwin Sharvill UNQUALIFIED
David DarakjyGermanyAnna Fali UNQUALIFIED
Sinclair WaycottJapanBernardo Dominic RENEWAL
Munro FerenczAustraliaXuxue Feng QUALIFIED
Mujtaba NickaBrazilOnyama Limba NEW
Nicolas IturbideItalyAmy Elsner PROPOSAL
Chavez BriddickIndiaIoni Bowcher NEW
Johnson SergiUnited KingdomStephen Shaw UNQUALIFIED
Ashley DoeItalyAmy Elsner QUALIFIED
Ashley DoeAustraliaIoni Bowcher RENEWAL
Kaitlin OstroskyAustraliaBernardo Dominic NEW
Ashley DoeSpainIvan Magalhaes PROPOSAL
Johnson SergiCanadaIoni Bowcher UNQUALIFIED
Octavia MaletRussiaXuxue Feng UNQUALIFIED
Mayumi KolmetzGermanyBernardo Dominic NEW
Ivar PaprockiFranceXuxue Feng UNQUALIFIED
Jennifer AmigonAustraliaStephen Shaw NEW
Morrow RutaArgentinaIvan Magalhaes NEW
Clifford RimGermanyStephen Shaw QUALIFIED
Stacey MacleadGermanyXuxue Feng UNQUALIFIED
David DarakjySpainBernardo Dominic RENEWAL
Julie StensethItalyElwin Sharvill NEW
Jefferson SchemmerAustraliaAmy Elsner PROPOSAL
Antonio CaudyArgentinaElwin Sharvill RENEWAL
Frozen Columns
Name
Kaitlin Ostrosky
Mujtaba Nicka
Kaitlin Ostrosky
Leja Caldarera
Jefferson Schemmer
Maisha Rulapaugh
Ashley Doe
Murillo Malet
Kaitlin Ostrosky
Ashley Doe
Cody Saylors
Claire Tollner
Juan Wieser
Johnson Sergi
Arvin Albares
David Darakjy
Johnson Sergi
Francesco Shinko
Nicolas Iturbide
Deepesh Chui
Murillo Malet
Silvio Slusarski
Emily Whobrey
Jefferson Schemmer
Misaki Royster
Misaki Royster
Misaki Royster
Salvatore Stockham
Ashley Doe
Alejandro Perin
Aditya Kusko
Aika Inouye
Silvio Slusarski
Arvin Albares
Rodrigues Campain
Salvatore Stockham
Tony Foller
Kaitlin Ostrosky
David Darakjy
Deepesh Chui
Maria Marrier
Juan Wieser
Antonio Caudy
Deepesh Chui
Faith Gillian
Misaki Royster
Leja Caldarera
Mujtaba Nicka
Rodrigues Campain
Rodrigues Campain
IdCountryDate
1000Spain2025-10-01
1001France2025-09-16
1002Spain2025-09-22
1003Spain2025-09-30
1004Canada2025-09-22
1005Australia2025-09-18
1006Japan2025-10-01
1007United Kingdom2025-09-30
1008Russia2025-09-20
1009Brazil2025-10-08
1010Italy2025-09-21
1011Italy2025-09-20
1012Italy2025-09-30
1013Australia2025-09-12
1014Spain2025-09-30
1015Russia2025-09-21
1016United Kingdom2025-09-17
1017Canada2025-09-20
1018United Kingdom2025-09-16
1019Italy2025-10-06
1020Spain2025-09-16
1021France2025-09-29
1022India2025-09-14
1023Russia2025-09-11
1024Argentina2025-09-16
1025Russia2025-09-22
1026Germany2025-09-30
1027Argentina2025-09-15
1028Germany2025-10-08
1029Italy2025-09-22
1030Argentina2025-10-07
1031Spain2025-10-04
1032United Kingdom2025-09-20
1033United Kingdom2025-10-07
1034United Kingdom2025-10-03
1035Italy2025-10-06
1036Canada2025-09-24
1037India2025-09-13
1038Russia2025-10-10
1039Italy2025-09-30
1040Brazil2025-09-24
1041Germany2025-09-17
1042Brazil2025-09-29
1043Italy2025-09-11
1044Japan2025-09-11
1045India2025-09-28
1046Canada2025-09-15
1047Russia2025-10-04
1048Italy2025-09-21
1049Brazil2025-09-11

On-Demand Data

NameIdCountryDate
David Darakjy1000Italy2025-09-16
Maria Marrier1001United Kingdom2025-09-23
David Darakjy1002Japan2025-10-04
Costa Dilliard1003Germany2025-09-12
Greenwood Bolognia1004India2025-10-09
Mayumi Kolmetz1005Japan2025-10-02
Leon Oldroyd1006Australia2025-09-22
Ivar Paprocki1007Russia2025-09-13
Maisha Rulapaugh1008Italy2025-09-20
Kadeem Flosi1009Italy2025-09-28
Mujtaba Nicka1010Australia2025-09-30
Kadeem Flosi1011India2025-09-13
Ricardo Gaucho1012Russia2025-09-29
Salvatore Stockham1013India2025-09-30
Leon Oldroyd1014Brazil2025-09-18
Costa Dilliard1015Germany2025-09-18
Aika Inouye1016Canada2025-09-16
Jennifer Amigon1017Spain2025-09-23
Cody Saylors1018Canada2025-10-04
Izzy Garufi1019Brazil2025-09-26
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jennifer AmigonSpainAsiya Javayant QUALIFIED
Jennifer AmigonJapanXuxue Feng UNQUALIFIED
David DarakjyCanadaAnna Fali QUALIFIED
Mujtaba NickaCanadaElwin Sharvill RENEWAL
Izzy GarufiIndiaXuxue Feng PROPOSAL
Rodrigues CampainGermanyBernardo Dominic QUALIFIED
Ashley DoeArgentinaAsiya Javayant NEW
Leon OldroydSpainAmy Elsner NEW
Isabel BowleyUnited KingdomStephen Shaw NEW
Julie StensethSpainIoni Bowcher RENEWAL
Johnson SergiFranceBernardo Dominic NEW
Costa DilliardArgentinaStephen Shaw RENEWAL
Salvatore StockhamAustraliaElwin Sharvill UNQUALIFIED
Chavez BriddickCanadaStephen Shaw PROPOSAL
Leon OldroydRussiaOnyama Limba UNQUALIFIED
Mujtaba NickaSpainAmy Elsner RENEWAL
Izzy GarufiIndiaIvan Magalhaes NEW
Stacey MacleadIndiaStephen Shaw PROPOSAL
Mayumi KolmetzRussiaAmy Elsner QUALIFIED
Sinclair WaycottGermanyBernardo Dominic RENEWAL
Cody SaylorsBrazilAmy Elsner NEW
Rodrigues CampainItalyOnyama Limba RENEWAL
Tony FollerRussiaAsiya Javayant RENEWAL
Aika InouyeUnited KingdomIoni Bowcher NEGOTIATION
Sinclair WaycottJapanElwin Sharvill UNQUALIFIED
Clifford RimIndiaElwin Sharvill NEW
Clifford RimCanadaAsiya Javayant NEGOTIATION
Johnson SergiRussiaAnna Fali RENEWAL
Wickens NestleRussiaIvan Magalhaes UNQUALIFIED
Kadeem FlosiGermanyBernardo Dominic NEW
Izzy GarufiBrazilAnna Fali RENEWAL
Johnson SergiUnited KingdomAmy Elsner PROPOSAL
Greenwood BologniaSpainAsiya Javayant PROPOSAL
Wickens NestleRussiaStephen Shaw QUALIFIED
Jennifer AmigonArgentinaBernardo Dominic NEW
Ricardo GauchoUnited KingdomStephen Shaw QUALIFIED
Alejandro PerinBrazilAmy Elsner RENEWAL
Chavez BriddickIndiaAsiya Javayant NEGOTIATION
Tony FollerItalyBernardo Dominic QUALIFIED
Leja CaldareraSpainAsiya Javayant 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>