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
Darci PoquetteCanadaBernardo Dominic NEGOTIATION
James ButtGermanyElwin Sharvill NEW
Silvio SlusarskiItalyIoni Bowcher NEW
Leon OldroydRussiaXuxue Feng NEW
Mujtaba NickaRussiaIvan Magalhaes NEGOTIATION
Octavia MaletBrazilAmy Elsner PROPOSAL
Mayumi KolmetzBrazilOnyama Limba UNQUALIFIED
Murillo MaletFranceXuxue Feng UNQUALIFIED
Darci PoquetteJapanIvan Magalhaes RENEWAL
Cody SaylorsGermanyAsiya Javayant RENEWAL
Silvio SlusarskiItalyIoni Bowcher RENEWAL
Johnson SergiJapanIvan Magalhaes NEW
Mayumi KolmetzFranceAnna Fali UNQUALIFIED
Nicolas IturbideBrazilXuxue Feng RENEWAL
Wickens NestleGermanyAnna Fali NEW
Alejandro PerinArgentinaStephen Shaw QUALIFIED
Silvio SlusarskiGermanyElwin Sharvill UNQUALIFIED
Mujtaba NickaFranceXuxue Feng QUALIFIED
Izzy GarufiUnited KingdomAnna Fali NEGOTIATION
Jennifer AmigonCanadaAmy Elsner RENEWAL
Jennifer AmigonItalyIoni Bowcher RENEWAL
Jones VocelkaFranceAsiya Javayant UNQUALIFIED
Kaitlin OstroskyIndiaAsiya Javayant QUALIFIED
Ashley DoeRussiaAsiya Javayant RENEWAL
Adams MorascaAustraliaOnyama Limba QUALIFIED
Rodrigues CampainIndiaIoni Bowcher QUALIFIED
Rodrigues CampainGermanyIoni Bowcher PROPOSAL
Rodrigues CampainBrazilElwin Sharvill NEW
Johnson SergiRussiaElwin Sharvill PROPOSAL
Ricardo GauchoAustraliaStephen Shaw PROPOSAL
Adams MorascaRussiaBernardo Dominic RENEWAL
Aditya KuskoJapanElwin Sharvill NEW
Costa DilliardBrazilAsiya Javayant RENEWAL
Smith GlickArgentinaAnna Fali RENEWAL
Adams MorascaAustraliaOnyama Limba PROPOSAL
Jennifer AmigonSpainOnyama Limba RENEWAL
Mujtaba NickaItalyOnyama Limba RENEWAL
Aika InouyeIndiaAnna Fali RENEWAL
Leja CaldareraBrazilAmy Elsner NEGOTIATION
Ricardo GauchoJapanStephen Shaw PROPOSAL
Arvin AlbaresItalyStephen Shaw UNQUALIFIED
Darci PoquetteBrazilXuxue Feng QUALIFIED
Jennifer AmigonFranceAnna Fali NEW
Salvatore StockhamArgentinaStephen Shaw QUALIFIED
Mujtaba NickaAustraliaElwin Sharvill UNQUALIFIED
Smith GlickAustraliaStephen Shaw RENEWAL
Arvin AlbaresArgentinaAmy Elsner RENEWAL
Aika InouyeCanadaIoni Bowcher NEW
Cody SaylorsGermanyAnna Fali RENEWAL
Ivar PaprockiIndiaAsiya Javayant RENEWAL
Horizontal
NameCountryRepresentativeStatus
Ashley DoeUnited KingdomAmy Elsner QUALIFIED
Claire TollnerSpainBernardo Dominic PROPOSAL
Murillo MaletItalyIvan Magalhaes NEGOTIATION
Morrow RutaRussiaXuxue Feng RENEWAL
Sinclair WaycottFranceBernardo Dominic QUALIFIED
Octavia MaletRussiaBernardo Dominic NEW
Wickens NestleAustraliaIoni Bowcher NEGOTIATION
Costa DilliardItalyIoni Bowcher NEGOTIATION
Greenwood BologniaGermanyStephen Shaw NEGOTIATION
Faith GillianUnited KingdomAsiya Javayant NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Chavez BriddickItaly2025-10-04Dorl, James J Esq NEW95Stephen Shaw
1001Kadeem FlosiSpain2025-09-13Commercial Press QUALIFIED40Ioni Bowcher
1002Maria MarrierIndia2025-09-20Printing Dimensions PROPOSAL86Stephen Shaw
1003Ivar PaprockiRussia2025-09-28King, Christopher A Esq PROPOSAL81Stephen Shaw
1004Ashley DoeCanada2025-09-26Feltz Printing Service PROPOSAL87Bernardo Dominic
1005Isabel BowleyCanada2025-09-18Benton, John B Jr PROPOSAL32Bernardo Dominic
1006Francesco ShinkoItaly2025-10-02Feiner Bros NEW74Elwin Sharvill
1007Mayumi KolmetzRussia2025-09-21Benton, John B Jr NEW74Asiya Javayant
1008Cody SaylorsCanada2025-10-03Chapman, Ross E Esq RENEWAL9Anna Fali
1009Misaki RoysterCanada2025-09-27Morlong Associates RENEWAL69Asiya Javayant
1010Costa DilliardFrance2025-09-29Rousseaux, Michael Esq PROPOSAL34Xuxue Feng
1011Nicolas IturbideRussia2025-10-09Commercial Press QUALIFIED48Ioni Bowcher
1012Darci PoquetteIndia2025-09-16Chapman, Ross E Esq RENEWAL37Elwin Sharvill
1013Smith GlickBrazil2025-09-27Benton, John B Jr RENEWAL22Ivan Magalhaes
1014Kadeem FlosiItaly2025-10-06Feltz Printing Service NEGOTIATION60Elwin Sharvill
1015Izzy GarufiRussia2025-09-27Benton, John B Jr RENEWAL29Stephen Shaw
1016Leja CaldareraIndia2025-09-23Rousseaux, Michael Esq NEGOTIATION36Elwin Sharvill
1017Arvin AlbaresCanada2025-09-27Benton, John B Jr NEGOTIATION52Bernardo Dominic
1018Izzy GarufiCanada2025-09-28Chemel, James L Cpa NEGOTIATION88Xuxue Feng
1019Maisha RulapaughCanada2025-09-27Feiner Bros UNQUALIFIED97Stephen Shaw
1020Octavia MaletSpain2025-09-14Rangoni Of Florence QUALIFIED93Anna Fali
1021Mayumi KolmetzBrazil2025-09-15Commercial Press QUALIFIED95Stephen Shaw
1022James ButtSpain2025-09-16Truhlar And Truhlar Attys QUALIFIED85Onyama Limba
1023Jennifer AmigonSpain2025-09-13Commercial Press NEGOTIATION92Asiya Javayant
1024Leon OldroydAustralia2025-09-28King, Christopher A Esq QUALIFIED65Stephen Shaw
1025Wickens NestleRussia2025-09-28Chemel, James L Cpa UNQUALIFIED80Asiya Javayant
1026Misaki RoysterBrazil2025-10-02Printing Dimensions NEW62Stephen Shaw
1027Antonio CaudyUnited Kingdom2025-09-27Rousseaux, Michael Esq NEGOTIATION22Asiya Javayant
1028Francesco ShinkoRussia2025-10-06Rousseaux, Michael Esq QUALIFIED44Ivan Magalhaes
1029Julie StensethRussia2025-09-23Chemel, James L Cpa PROPOSAL35Elwin Sharvill
1030Misaki RoysterSpain2025-10-03Dorl, James J Esq QUALIFIED45Stephen Shaw
1031Kaitlin OstroskyGermany2025-09-21Printing Dimensions PROPOSAL92Ivan Magalhaes
1032Costa DilliardItaly2025-09-19Chemel, James L Cpa RENEWAL23Onyama Limba
1033Darci PoquetteBrazil2025-09-12Buckley Miller Wright RENEWAL52Elwin Sharvill
1034Julie StensethSpain2025-09-18Truhlar And Truhlar Attys RENEWAL29Asiya Javayant
1035Octavia MaletUnited Kingdom2025-09-19Feiner Bros QUALIFIED84Anna Fali
1036Smith GlickRussia2025-10-02Chapman, Ross E Esq RENEWAL65Ivan Magalhaes
1037James ButtBrazil2025-10-02Benton, John B Jr RENEWAL66Elwin Sharvill
1038Faith GillianIndia2025-09-28Buckley Miller Wright RENEWAL52Xuxue Feng
1039Ricardo GauchoRussia2025-09-16Morlong Associates PROPOSAL66Stephen Shaw
1040Izzy GarufiJapan2025-10-03Rousseaux, Michael Esq NEW99Ioni Bowcher
1041Greenwood BologniaUnited Kingdom2025-10-01Printing Dimensions UNQUALIFIED74Amy Elsner
1042Morrow RutaArgentina2025-09-27Chemel, James L Cpa NEGOTIATION73Stephen Shaw
1043Misaki RoysterGermany2025-09-11Commercial Press UNQUALIFIED6Stephen Shaw
1044Tony FollerBrazil2025-09-19Rousseaux, Michael Esq PROPOSAL66Bernardo Dominic
1045Aditya KuskoIndia2025-10-08Chanay, Jeffrey A Esq NEW59Xuxue Feng
1046Jennifer AmigonUnited Kingdom2025-10-05Truhlar And Truhlar Attys UNQUALIFIED11Stephen Shaw
1047David DarakjyCanada2025-09-15Truhlar And Truhlar Attys NEW34Onyama Limba
1048James ButtSpain2025-09-21Chanay, Jeffrey A Esq QUALIFIED18Ivan Magalhaes
1049Deepesh ChuiJapan2025-09-24Morlong Associates QUALIFIED88Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Adams MorascaCanadaAnna Fali NEGOTIATION
Mujtaba NickaIndiaOnyama Limba UNQUALIFIED
Francesco ShinkoRussiaAnna Fali NEGOTIATION
Tony FollerCanadaAmy Elsner UNQUALIFIED
Jefferson SchemmerJapanXuxue Feng RENEWAL
Leon OldroydItalyAmy Elsner PROPOSAL
Kaitlin OstroskyJapanStephen Shaw NEGOTIATION
Smith GlickArgentinaAnna Fali QUALIFIED
Ricardo GauchoItalyIoni Bowcher UNQUALIFIED
Ashley DoeSpainAnna Fali QUALIFIED
Maisha RulapaughItalyElwin Sharvill RENEWAL
Faith GillianBrazilOnyama Limba NEW
Maisha RulapaughItalyAsiya Javayant NEW
Aruna FigeroaItalyIvan Magalhaes UNQUALIFIED
Claire TollnerFranceAmy Elsner NEGOTIATION
Emily WhobreyFranceXuxue Feng NEGOTIATION
Arvin AlbaresCanadaElwin Sharvill NEGOTIATION
Silvio SlusarskiGermanyAnna Fali UNQUALIFIED
Kaitlin OstroskyArgentinaAnna Fali NEW
Cody SaylorsCanadaAmy Elsner NEGOTIATION
Isabel BowleyItalyStephen Shaw UNQUALIFIED
Francesco ShinkoRussiaXuxue Feng RENEWAL
Maria MarrierSpainBernardo Dominic UNQUALIFIED
Chavez BriddickCanadaAnna Fali RENEWAL
Stacey MacleadCanadaAmy Elsner NEGOTIATION
Juan WieserArgentinaStephen Shaw RENEWAL
Julie StensethRussiaStephen Shaw QUALIFIED
Morrow RutaCanadaXuxue Feng QUALIFIED
Maria MarrierJapanOnyama Limba NEGOTIATION
Adams MorascaAustraliaAmy Elsner PROPOSAL
Julie StensethBrazilElwin Sharvill NEW
Aditya KuskoItalyAnna Fali NEGOTIATION
Mujtaba NickaAustraliaIoni Bowcher RENEWAL
Aditya KuskoUnited KingdomXuxue Feng PROPOSAL
Morrow RutaUnited KingdomIoni Bowcher UNQUALIFIED
Sinclair WaycottCanadaAsiya Javayant UNQUALIFIED
Ricardo GauchoArgentinaAsiya Javayant UNQUALIFIED
Arvin AlbaresGermanyOnyama Limba NEW
Munro FerenczFranceXuxue Feng UNQUALIFIED
David DarakjyBrazilAsiya Javayant NEGOTIATION
Leon OldroydIndiaIvan Magalhaes PROPOSAL
Smith GlickJapanBernardo Dominic NEW
Aditya KuskoIndiaAsiya Javayant NEGOTIATION
Jones VocelkaSpainAnna Fali NEW
Juan WieserFranceAsiya Javayant NEGOTIATION
Izzy GarufiBrazilIoni Bowcher QUALIFIED
Ashley DoeJapanXuxue Feng NEW
Rodrigues CampainIndiaAmy Elsner QUALIFIED
Francesco ShinkoRussiaAmy Elsner QUALIFIED
Alejandro PerinAustraliaAsiya Javayant QUALIFIED
Frozen Columns
Name
Claire Tollner
Misaki Royster
James Butt
Greenwood Bolognia
James Butt
Nicolas Iturbide
Leon Oldroyd
Murillo Malet
Juan Wieser
Rodrigues Campain
Morrow Ruta
Julie Stenseth
Murillo Malet
Ricardo Gaucho
Costa Dilliard
Silvio Slusarski
Ashley Doe
Sinclair Waycott
Emily Whobrey
Leon Oldroyd
Izzy Garufi
Stacey Maclead
Faith Gillian
Jefferson Schemmer
Jennifer Amigon
David Darakjy
Alejandro Perin
Faith Gillian
Morrow Ruta
Isabel Bowley
Alejandro Perin
Greenwood Bolognia
Faith Gillian
Misaki Royster
Aruna Figeroa
Kadeem Flosi
Adams Morasca
Izzy Garufi
Salvatore Stockham
Juan Wieser
Chavez Briddick
Tony Foller
Jeanfrancois Venere
Rodrigues Campain
Darci Poquette
Maisha Rulapaugh
Claire Tollner
Smith Glick
Faith Gillian
Nicolas Iturbide
IdCountryDate
1000France2025-09-18
1001Germany2025-09-19
1002France2025-10-05
1003Russia2025-09-11
1004Australia2025-09-29
1005United Kingdom2025-09-30
1006Japan2025-10-10
1007Japan2025-09-24
1008United Kingdom2025-09-16
1009Brazil2025-10-03
1010Germany2025-09-22
1011Brazil2025-09-20
1012India2025-09-13
1013France2025-10-08
1014Spain2025-09-21
1015Japan2025-09-23
1016United Kingdom2025-10-09
1017Italy2025-09-26
1018Japan2025-10-03
1019France2025-09-19
1020Australia2025-10-01
1021Japan2025-09-22
1022France2025-09-28
1023Argentina2025-10-08
1024France2025-09-15
1025United Kingdom2025-10-06
1026Canada2025-10-08
1027Argentina2025-09-14
1028India2025-10-01
1029Australia2025-09-19
1030Argentina2025-09-12
1031Brazil2025-10-01
1032Argentina2025-09-22
1033Australia2025-09-13
1034Japan2025-09-23
1035Canada2025-09-27
1036Brazil2025-10-09
1037Japan2025-10-07
1038Canada2025-10-06
1039Canada2025-09-30
1040Brazil2025-09-24
1041Australia2025-09-16
1042France2025-09-20
1043Canada2025-09-12
1044Spain2025-09-17
1045Brazil2025-10-09
1046India2025-09-26
1047Canada2025-09-19
1048Argentina2025-10-05
1049Canada2025-09-16

On-Demand Data

NameIdCountryDate
Maria Marrier1000United Kingdom2025-09-24
Mujtaba Nicka1001Spain2025-09-22
Aditya Kusko1002Spain2025-09-20
Jones Vocelka1003Brazil2025-09-26
Izzy Garufi1004Spain2025-10-07
Ashley Doe1005France2025-10-05
Deepesh Chui1006United Kingdom2025-09-14
Tony Foller1007United Kingdom2025-09-24
Izzy Garufi1008Japan2025-09-15
Ricardo Gaucho1009Australia2025-09-18
Smith Glick1010France2025-09-29
Isabel Bowley1011Canada2025-09-13
Maisha Rulapaugh1012Russia2025-09-19
Aditya Kusko1013Japan2025-10-03
Juan Wieser1014Australia2025-09-13
Sinclair Waycott1015Russia2025-10-03
Nicolas Iturbide1016Germany2025-09-19
Tony Foller1017France2025-10-07
Darci Poquette1018Canada2025-09-16
Chavez Briddick1019Russia2025-10-09
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Costa DilliardUnited KingdomAnna Fali NEW
Julie StensethFranceOnyama Limba PROPOSAL
Jennifer AmigonGermanyAnna Fali QUALIFIED
Stacey MacleadIndiaXuxue Feng NEW
Cody SaylorsBrazilStephen Shaw PROPOSAL
Murillo MaletAustraliaElwin Sharvill PROPOSAL
Munro FerenczJapanStephen Shaw UNQUALIFIED
Maria MarrierBrazilAsiya Javayant UNQUALIFIED
Claire TollnerArgentinaStephen Shaw UNQUALIFIED
Aditya KuskoIndiaIvan Magalhaes NEGOTIATION
Nicolas IturbideRussiaAnna Fali NEW
Cody SaylorsIndiaIoni Bowcher NEGOTIATION
Maisha RulapaughBrazilIvan Magalhaes NEGOTIATION
Antonio CaudyBrazilXuxue Feng NEW
Maisha RulapaughIndiaIvan Magalhaes QUALIFIED
Salvatore StockhamArgentinaStephen Shaw QUALIFIED
Tony FollerFranceAsiya Javayant QUALIFIED
Rodrigues CampainCanadaIoni Bowcher PROPOSAL
Ivar PaprockiRussiaAsiya Javayant PROPOSAL
Faith GillianArgentinaStephen Shaw RENEWAL
Greenwood BologniaCanadaAnna Fali QUALIFIED
Kaitlin OstroskyUnited KingdomBernardo Dominic NEW
Ashley DoeAustraliaIoni Bowcher PROPOSAL
Faith GillianFranceXuxue Feng NEGOTIATION
Julie StensethCanadaStephen Shaw NEW
Johnson SergiFranceOnyama Limba NEW
Isabel BowleyRussiaAnna Fali UNQUALIFIED
Francesco ShinkoBrazilXuxue Feng NEW
Kadeem FlosiGermanyBernardo Dominic NEGOTIATION
Ivar PaprockiIndiaAnna Fali QUALIFIED
Murillo MaletFranceXuxue Feng NEGOTIATION
Kaitlin OstroskyAustraliaAmy Elsner RENEWAL
Murillo MaletCanadaXuxue Feng QUALIFIED
Costa DilliardAustraliaAmy Elsner NEGOTIATION
Jeanfrancois VenereArgentinaAmy Elsner RENEWAL
Rodrigues CampainBrazilIoni Bowcher NEW
Jones VocelkaGermanyXuxue Feng NEW
Rodrigues CampainItalyIoni Bowcher UNQUALIFIED
Smith GlickFranceOnyama Limba NEW
Francesco ShinkoArgentinaElwin Sharvill 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>