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
Misaki RoysterItalyAnna Fali QUALIFIED
Costa DilliardCanadaIoni Bowcher NEGOTIATION
Johnson SergiIndiaIoni Bowcher UNQUALIFIED
Francesco ShinkoCanadaAnna Fali UNQUALIFIED
Jefferson SchemmerAustraliaOnyama Limba NEGOTIATION
Johnson SergiRussiaOnyama Limba NEGOTIATION
Morrow RutaArgentinaIoni Bowcher NEW
Maria MarrierAustraliaOnyama Limba RENEWAL
Octavia MaletBrazilXuxue Feng RENEWAL
Maria MarrierRussiaIvan Magalhaes QUALIFIED
Jeanfrancois VenereGermanyElwin Sharvill RENEWAL
Johnson SergiItalyIvan Magalhaes NEW
Cody SaylorsItalyBernardo Dominic NEGOTIATION
Ricardo GauchoSpainOnyama Limba NEW
Rodrigues CampainJapanXuxue Feng NEW
Murillo MaletArgentinaAnna Fali PROPOSAL
Faith GillianFranceAmy Elsner QUALIFIED
Maisha RulapaughItalyXuxue Feng NEGOTIATION
Deepesh ChuiJapanOnyama Limba NEW
Arvin AlbaresIndiaElwin Sharvill NEW
Maisha RulapaughAustraliaElwin Sharvill NEW
Stacey MacleadGermanyOnyama Limba UNQUALIFIED
Stacey MacleadJapanAnna Fali QUALIFIED
Izzy GarufiUnited KingdomAmy Elsner NEGOTIATION
Morrow RutaFranceBernardo Dominic QUALIFIED
Stacey MacleadCanadaStephen Shaw NEW
David DarakjyGermanyXuxue Feng QUALIFIED
Tony FollerUnited KingdomXuxue Feng NEGOTIATION
Aditya KuskoArgentinaIoni Bowcher NEW
Silvio SlusarskiCanadaOnyama Limba RENEWAL
Kaitlin OstroskySpainAnna Fali UNQUALIFIED
Morrow RutaRussiaAnna Fali PROPOSAL
Aika InouyeRussiaOnyama Limba QUALIFIED
Ivar PaprockiItalyElwin Sharvill RENEWAL
Claire TollnerJapanIoni Bowcher UNQUALIFIED
Maria MarrierItalyBernardo Dominic PROPOSAL
Darci PoquetteCanadaStephen Shaw QUALIFIED
Faith GillianFranceStephen Shaw QUALIFIED
Salvatore StockhamGermanyIvan Magalhaes PROPOSAL
Munro FerenczRussiaAmy Elsner RENEWAL
Chavez BriddickJapanAmy Elsner UNQUALIFIED
Jennifer AmigonSpainStephen Shaw PROPOSAL
Maisha RulapaughAustraliaAmy Elsner QUALIFIED
Octavia MaletArgentinaAnna Fali NEGOTIATION
David DarakjyArgentinaStephen Shaw RENEWAL
Alejandro PerinRussiaElwin Sharvill UNQUALIFIED
Ricardo GauchoGermanyIoni Bowcher QUALIFIED
Deepesh ChuiUnited KingdomIvan Magalhaes NEW
Darci PoquetteBrazilXuxue Feng QUALIFIED
Munro FerenczJapanStephen Shaw NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Faith GillianBrazilAsiya Javayant NEW
Murillo MaletCanadaBernardo Dominic NEW
Emily WhobreyCanadaAnna Fali NEW
Leja CaldareraBrazilXuxue Feng PROPOSAL
Darci PoquetteBrazilElwin Sharvill NEGOTIATION
James ButtBrazilIvan Magalhaes QUALIFIED
James ButtFranceIvan Magalhaes PROPOSAL
Tony FollerAustraliaAmy Elsner QUALIFIED
Darci PoquetteGermanyIoni Bowcher NEW
Izzy GarufiUnited KingdomAsiya Javayant QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aditya KuskoJapan2025-10-17Commercial Press PROPOSAL73Amy Elsner
1001Murillo MaletBrazil2025-10-15Rangoni Of Florence UNQUALIFIED5Stephen Shaw
1002Claire TollnerGermany2025-10-21Rousseaux, Michael Esq UNQUALIFIED33Ioni Bowcher
1003Ivar PaprockiRussia2025-10-29Commercial Press PROPOSAL43Elwin Sharvill
1004Jones VocelkaUnited Kingdom2025-10-13Benton, John B Jr PROPOSAL33Elwin Sharvill
1005Deepesh ChuiSpain2025-10-25Morlong Associates NEGOTIATION88Anna Fali
1006Salvatore StockhamUnited Kingdom2025-10-06Benton, John B Jr QUALIFIED14Elwin Sharvill
1007David DarakjyAustralia2025-10-28Chapman, Ross E Esq NEGOTIATION30Xuxue Feng
1008Costa DilliardFrance2025-10-26Feiner Bros PROPOSAL94Elwin Sharvill
1009Emily WhobreyRussia2025-10-25Feltz Printing Service PROPOSAL15Ioni Bowcher
1010Cody SaylorsUnited Kingdom2025-10-21Dorl, James J Esq RENEWAL49Anna Fali
1011Kadeem FlosiGermany2025-10-03King, Christopher A Esq UNQUALIFIED38Elwin Sharvill
1012Octavia MaletGermany2025-10-17Dorl, James J Esq NEGOTIATION31Onyama Limba
1013Juan WieserIndia2025-10-29Chanay, Jeffrey A Esq QUALIFIED28Xuxue Feng
1014Salvatore StockhamGermany2025-10-26Chanay, Jeffrey A Esq QUALIFIED1Ivan Magalhaes
1015Juan WieserFrance2025-10-27Commercial Press RENEWAL27Ioni Bowcher
1016Leon OldroydRussia2025-10-14King, Christopher A Esq NEW46Amy Elsner
1017Morrow RutaGermany2025-10-28Benton, John B Jr PROPOSAL30Ivan Magalhaes
1018Darci PoquetteItaly2025-10-25Buckley Miller Wright UNQUALIFIED98Ioni Bowcher
1019Juan WieserRussia2025-11-01Truhlar And Truhlar Attys NEW2Anna Fali
1020Morrow RutaItaly2025-10-13King, Christopher A Esq NEGOTIATION3Amy Elsner
1021Greenwood BologniaBrazil2025-10-22Benton, John B Jr NEGOTIATION3Ioni Bowcher
1022Smith GlickIndia2025-10-20Morlong Associates RENEWAL34Ioni Bowcher
1023Ricardo GauchoGermany2025-10-26King, Christopher A Esq PROPOSAL23Ivan Magalhaes
1024Antonio CaudyAustralia2025-10-20Rangoni Of Florence QUALIFIED87Ioni Bowcher
1025Izzy GarufiUnited Kingdom2025-10-08Chapman, Ross E Esq NEGOTIATION50Ivan Magalhaes
1026Morrow RutaItaly2025-10-21Commercial Press QUALIFIED37Bernardo Dominic
1027Salvatore StockhamFrance2025-10-27Buckley Miller Wright QUALIFIED82Xuxue Feng
1028James ButtBrazil2025-10-22Dorl, James J Esq UNQUALIFIED28Xuxue Feng
1029Aruna FigeroaUnited Kingdom2025-10-19Morlong Associates QUALIFIED68Anna Fali
1030Nicolas IturbideItaly2025-10-24Chanay, Jeffrey A Esq NEW49Bernardo Dominic
1031Ricardo GauchoItaly2025-10-14Printing Dimensions NEGOTIATION52Ivan Magalhaes
1032Ashley DoeCanada2025-10-25Feltz Printing Service NEW34Anna Fali
1033Mujtaba NickaBrazil2025-10-09King, Christopher A Esq UNQUALIFIED11Anna Fali
1034Sinclair WaycottUnited Kingdom2025-10-23Morlong Associates UNQUALIFIED97Xuxue Feng
1035Alejandro PerinCanada2025-10-26Feltz Printing Service QUALIFIED82Amy Elsner
1036Arvin AlbaresCanada2025-10-05Benton, John B Jr UNQUALIFIED56Amy Elsner
1037David DarakjyFrance2025-10-03Feiner Bros PROPOSAL91Ioni Bowcher
1038Leon OldroydAustralia2025-10-06King, Christopher A Esq RENEWAL2Amy Elsner
1039Stacey MacleadIndia2025-10-12Feiner Bros RENEWAL34Asiya Javayant
1040Jeanfrancois VenereSpain2025-10-26Truhlar And Truhlar Attys UNQUALIFIED83Xuxue Feng
1041Francesco ShinkoSpain2025-10-23Truhlar And Truhlar Attys QUALIFIED32Stephen Shaw
1042Tony FollerAustralia2025-10-14Feiner Bros PROPOSAL47Elwin Sharvill
1043Mayumi KolmetzArgentina2025-10-20Dorl, James J Esq NEGOTIATION7Amy Elsner
1044Deepesh ChuiArgentina2025-10-27Commercial Press RENEWAL73Xuxue Feng
1045Misaki RoysterIndia2025-10-15Feiner Bros NEW5Asiya Javayant
1046Morrow RutaRussia2025-10-08Chanay, Jeffrey A Esq NEGOTIATION38Amy Elsner
1047Isabel BowleyBrazil2025-10-11Printing Dimensions QUALIFIED48Ioni Bowcher
1048Murillo MaletUnited Kingdom2025-10-04Benton, John B Jr NEGOTIATION55Asiya Javayant
1049Costa DilliardSpain2025-10-24Chemel, James L Cpa QUALIFIED6Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Munro FerenczItalyElwin Sharvill NEW
Francesco ShinkoCanadaOnyama Limba QUALIFIED
Cody SaylorsCanadaBernardo Dominic QUALIFIED
Stacey MacleadArgentinaElwin Sharvill PROPOSAL
Izzy GarufiJapanStephen Shaw NEGOTIATION
Jennifer AmigonAustraliaStephen Shaw QUALIFIED
Cody SaylorsAustraliaAmy Elsner RENEWAL
Cody SaylorsCanadaBernardo Dominic NEW
Ashley DoeIndiaBernardo Dominic QUALIFIED
Stacey MacleadRussiaStephen Shaw PROPOSAL
Nicolas IturbideItalyOnyama Limba NEW
Murillo MaletJapanStephen Shaw PROPOSAL
Munro FerenczUnited KingdomXuxue Feng QUALIFIED
James ButtSpainXuxue Feng PROPOSAL
Alejandro PerinBrazilIoni Bowcher PROPOSAL
Julie StensethJapanOnyama Limba NEW
Tony FollerBrazilBernardo Dominic QUALIFIED
Mujtaba NickaJapanBernardo Dominic QUALIFIED
Ashley DoeCanadaIvan Magalhaes NEGOTIATION
Darci PoquetteBrazilIvan Magalhaes QUALIFIED
Adams MorascaRussiaAsiya Javayant NEW
Wickens NestleBrazilXuxue Feng RENEWAL
Alejandro PerinRussiaOnyama Limba RENEWAL
Murillo MaletBrazilIoni Bowcher RENEWAL
Salvatore StockhamItalyAnna Fali PROPOSAL
Deepesh ChuiSpainElwin Sharvill QUALIFIED
Isabel BowleyBrazilXuxue Feng PROPOSAL
Julie StensethSpainOnyama Limba QUALIFIED
Misaki RoysterIndiaElwin Sharvill RENEWAL
Johnson SergiIndiaAsiya Javayant RENEWAL
Murillo MaletRussiaXuxue Feng PROPOSAL
Cody SaylorsArgentinaElwin Sharvill NEGOTIATION
Misaki RoysterFranceIvan Magalhaes QUALIFIED
Antonio CaudyBrazilXuxue Feng QUALIFIED
Jefferson SchemmerFranceIoni Bowcher NEW
Julie StensethGermanyStephen Shaw UNQUALIFIED
Costa DilliardSpainElwin Sharvill NEW
Juan WieserCanadaElwin Sharvill NEW
Cody SaylorsUnited KingdomAnna Fali QUALIFIED
Darci PoquetteArgentinaBernardo Dominic QUALIFIED
Octavia MaletIndiaXuxue Feng NEW
Clifford RimUnited KingdomIoni Bowcher PROPOSAL
Jennifer AmigonItalyAmy Elsner RENEWAL
Isabel BowleyGermanyIoni Bowcher PROPOSAL
Octavia MaletItalyIvan Magalhaes UNQUALIFIED
Ashley DoeItalyOnyama Limba NEGOTIATION
Salvatore StockhamIndiaIvan Magalhaes NEGOTIATION
Johnson SergiFranceAnna Fali PROPOSAL
Munro FerenczJapanBernardo Dominic PROPOSAL
Silvio SlusarskiSpainXuxue Feng UNQUALIFIED
Frozen Columns
Name
Isabel Bowley
Alejandro Perin
Silvio Slusarski
Clifford Rim
Aditya Kusko
Antonio Caudy
Murillo Malet
Izzy Garufi
Stacey Maclead
Tony Foller
Clifford Rim
Rodrigues Campain
Octavia Malet
Leon Oldroyd
Octavia Malet
Arvin Albares
Arvin Albares
Adams Morasca
Ivar Paprocki
Munro Ferencz
Faith Gillian
Ricardo Gaucho
Isabel Bowley
Silvio Slusarski
Juan Wieser
David Darakjy
David Darakjy
Juan Wieser
Alejandro Perin
Antonio Caudy
Jones Vocelka
Misaki Royster
Nicolas Iturbide
Maisha Rulapaugh
Leon Oldroyd
Munro Ferencz
Emily Whobrey
Salvatore Stockham
Jefferson Schemmer
Octavia Malet
Jennifer Amigon
Aditya Kusko
Wickens Nestle
Julie Stenseth
Claire Tollner
Aruna Figeroa
Silvio Slusarski
Clifford Rim
Aruna Figeroa
Morrow Ruta
IdCountryDate
1000France2025-10-29
1001United Kingdom2025-10-29
1002Germany2025-10-21
1003Spain2025-10-04
1004United Kingdom2025-10-24
1005Japan2025-10-07
1006Japan2025-10-17
1007France2025-10-28
1008Italy2025-10-07
1009Italy2025-10-05
1010Brazil2025-10-06
1011Italy2025-10-30
1012France2025-10-03
1013India2025-10-18
1014Germany2025-10-25
1015United Kingdom2025-10-06
1016Brazil2025-10-26
1017Canada2025-10-12
1018Australia2025-10-20
1019United Kingdom2025-10-25
1020Brazil2025-10-15
1021United Kingdom2025-10-10
1022Italy2025-10-26
1023Italy2025-10-03
1024United Kingdom2025-10-30
1025Germany2025-10-26
1026United Kingdom2025-10-03
1027Russia2025-10-18
1028Argentina2025-10-30
1029Spain2025-10-18
1030Germany2025-10-20
1031India2025-10-23
1032France2025-10-21
1033Argentina2025-10-19
1034India2025-10-14
1035Spain2025-10-29
1036Brazil2025-10-18
1037Argentina2025-10-30
1038Japan2025-10-03
1039Brazil2025-11-01
1040Brazil2025-10-16
1041Japan2025-10-31
1042Brazil2025-10-19
1043Japan2025-10-18
1044France2025-10-15
1045India2025-10-08
1046Italy2025-10-14
1047Italy2025-10-27
1048Spain2025-10-04
1049India2025-10-23

On-Demand Data

NameIdCountryDate
Aika Inouye1000Italy2025-10-06
Maria Marrier1001Canada2025-10-28
Smith Glick1002Spain2025-10-21
Johnson Sergi1003Russia2025-11-01
Leja Caldarera1004Italy2025-10-23
Faith Gillian1005Germany2025-10-25
Wickens Nestle1006Spain2025-10-19
Johnson Sergi1007United Kingdom2025-10-30
Silvio Slusarski1008Brazil2025-10-18
Izzy Garufi1009Spain2025-10-20
Isabel Bowley1010Italy2025-10-28
Juan Wieser1011Australia2025-10-10
Leja Caldarera1012Canada2025-10-30
Greenwood Bolognia1013Germany2025-10-24
Aruna Figeroa1014Russia2025-10-18
Sinclair Waycott1015Russia2025-10-21
Juan Wieser1016Australia2025-10-19
Jones Vocelka1017Australia2025-10-11
Costa Dilliard1018Brazil2025-10-10
Sinclair Waycott1019Canada2025-10-05
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Adams MorascaCanadaOnyama Limba QUALIFIED
Jennifer AmigonUnited KingdomAsiya Javayant NEGOTIATION
Aruna FigeroaFranceBernardo Dominic UNQUALIFIED
Jeanfrancois VenereGermanyAsiya Javayant PROPOSAL
Cody SaylorsRussiaBernardo Dominic NEGOTIATION
Ashley DoeAustraliaXuxue Feng RENEWAL
Morrow RutaArgentinaAmy Elsner NEGOTIATION
Aika InouyeArgentinaAnna Fali QUALIFIED
Leja CaldareraArgentinaIvan Magalhaes NEW
Ivar PaprockiSpainAsiya Javayant RENEWAL
Juan WieserFranceOnyama Limba RENEWAL
Alejandro PerinFranceStephen Shaw NEGOTIATION
Sinclair WaycottRussiaAmy Elsner NEGOTIATION
Morrow RutaUnited KingdomAmy Elsner UNQUALIFIED
Jones VocelkaAustraliaBernardo Dominic PROPOSAL
Aika InouyeUnited KingdomXuxue Feng QUALIFIED
James ButtItalyXuxue Feng UNQUALIFIED
Murillo MaletItalyBernardo Dominic QUALIFIED
Munro FerenczGermanyAmy Elsner NEW
Maria MarrierSpainElwin Sharvill QUALIFIED
Leja CaldareraSpainStephen Shaw NEGOTIATION
Kadeem FlosiItalyOnyama Limba QUALIFIED
Murillo MaletCanadaIvan Magalhaes UNQUALIFIED
Francesco ShinkoUnited KingdomIvan Magalhaes PROPOSAL
Tony FollerGermanyElwin Sharvill PROPOSAL
Nicolas IturbideJapanStephen Shaw RENEWAL
Julie StensethArgentinaXuxue Feng NEGOTIATION
Emily WhobreyArgentinaOnyama Limba RENEWAL
James ButtFranceBernardo Dominic RENEWAL
Julie StensethRussiaXuxue Feng NEW
Wickens NestleArgentinaBernardo Dominic UNQUALIFIED
Leon OldroydAustraliaIvan Magalhaes RENEWAL
James ButtFranceBernardo Dominic NEW
Kaitlin OstroskyIndiaOnyama Limba UNQUALIFIED
Ivar PaprockiGermanyElwin Sharvill RENEWAL
Alejandro PerinRussiaStephen Shaw PROPOSAL
Octavia MaletItalyOnyama Limba PROPOSAL
Adams MorascaJapanBernardo Dominic UNQUALIFIED
Costa DilliardAustraliaBernardo Dominic NEW
Ricardo GauchoBrazilIoni Bowcher 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>