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
Claire TollnerSpainAnna Fali PROPOSAL
Costa DilliardCanadaStephen Shaw UNQUALIFIED
Chavez BriddickFranceIoni Bowcher NEGOTIATION
Maisha RulapaughGermanyXuxue Feng QUALIFIED
Alejandro PerinUnited KingdomIvan Magalhaes NEW
Mujtaba NickaFranceElwin Sharvill NEGOTIATION
Ricardo GauchoArgentinaBernardo Dominic NEGOTIATION
David DarakjySpainXuxue Feng QUALIFIED
Aditya KuskoSpainOnyama Limba NEW
Jones VocelkaUnited KingdomXuxue Feng RENEWAL
Deepesh ChuiBrazilIoni Bowcher PROPOSAL
Johnson SergiAustraliaXuxue Feng RENEWAL
Aditya KuskoBrazilAsiya Javayant UNQUALIFIED
Aika InouyeJapanBernardo Dominic QUALIFIED
Faith GillianJapanElwin Sharvill RENEWAL
Isabel BowleyArgentinaXuxue Feng RENEWAL
Morrow RutaRussiaIoni Bowcher NEW
Tony FollerFranceOnyama Limba NEW
Deepesh ChuiAustraliaStephen Shaw QUALIFIED
Aika InouyeUnited KingdomAsiya Javayant UNQUALIFIED
Cody SaylorsUnited KingdomAnna Fali UNQUALIFIED
Juan WieserUnited KingdomStephen Shaw QUALIFIED
Tony FollerGermanyElwin Sharvill QUALIFIED
Chavez BriddickGermanyOnyama Limba UNQUALIFIED
Clifford RimFranceStephen Shaw QUALIFIED
Juan WieserArgentinaXuxue Feng RENEWAL
Izzy GarufiJapanXuxue Feng NEW
Stacey MacleadRussiaIvan Magalhaes UNQUALIFIED
Jennifer AmigonGermanyAmy Elsner UNQUALIFIED
Darci PoquetteCanadaAnna Fali UNQUALIFIED
James ButtIndiaIoni Bowcher NEGOTIATION
Greenwood BologniaIndiaIvan Magalhaes PROPOSAL
Tony FollerSpainAmy Elsner UNQUALIFIED
Nicolas IturbideGermanyIoni Bowcher NEGOTIATION
Munro FerenczBrazilStephen Shaw NEW
Darci PoquetteItalyAmy Elsner NEW
Silvio SlusarskiArgentinaAnna Fali QUALIFIED
Jeanfrancois VenereAustraliaOnyama Limba QUALIFIED
Mayumi KolmetzFranceAsiya Javayant QUALIFIED
James ButtJapanIoni Bowcher NEW
Kadeem FlosiRussiaIvan Magalhaes RENEWAL
Clifford RimSpainOnyama Limba QUALIFIED
Smith GlickBrazilStephen Shaw RENEWAL
Aika InouyeItalyAsiya Javayant NEW
Izzy GarufiGermanyAmy Elsner NEGOTIATION
Salvatore StockhamCanadaIvan Magalhaes NEW
Leja CaldareraFranceAsiya Javayant QUALIFIED
Chavez BriddickSpainAnna Fali RENEWAL
Arvin AlbaresIndiaAsiya Javayant QUALIFIED
Aditya KuskoRussiaIoni Bowcher PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Emily WhobreyGermanyAnna Fali RENEWAL
Mujtaba NickaItalyAmy Elsner PROPOSAL
Francesco ShinkoUnited KingdomBernardo Dominic NEW
Julie StensethFranceAnna Fali QUALIFIED
Deepesh ChuiIndiaElwin Sharvill RENEWAL
Aruna FigeroaArgentinaStephen Shaw NEW
Ricardo GauchoBrazilElwin Sharvill UNQUALIFIED
Izzy GarufiGermanyElwin Sharvill QUALIFIED
Costa DilliardArgentinaAnna Fali QUALIFIED
Morrow RutaItalyXuxue Feng NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Faith GillianBrazil2025-07-17Buckley Miller Wright QUALIFIED37Elwin Sharvill
1001Darci PoquetteSpain2025-07-19Chapman, Ross E Esq RENEWAL54Amy Elsner
1002Mujtaba NickaJapan2025-08-12Morlong Associates NEGOTIATION74Ivan Magalhaes
1003Jeanfrancois VenereBrazil2025-07-29Chapman, Ross E Esq NEGOTIATION73Amy Elsner
1004Aditya KuskoFrance2025-08-04Truhlar And Truhlar Attys NEGOTIATION70Amy Elsner
1005Munro FerenczItaly2025-08-11Morlong Associates PROPOSAL24Xuxue Feng
1006James ButtUnited Kingdom2025-08-01Buckley Miller Wright NEW29Xuxue Feng
1007Adams MorascaJapan2025-08-08Feiner Bros NEGOTIATION11Stephen Shaw
1008Chavez BriddickBrazil2025-07-26Rangoni Of Florence RENEWAL19Elwin Sharvill
1009Silvio SlusarskiArgentina2025-07-27Benton, John B Jr QUALIFIED13Elwin Sharvill
1010Jennifer AmigonSpain2025-08-12Benton, John B Jr RENEWAL46Stephen Shaw
1011Alejandro PerinBrazil2025-08-13Dorl, James J Esq NEGOTIATION51Onyama Limba
1012Darci PoquetteUnited Kingdom2025-07-26Chapman, Ross E Esq QUALIFIED61Elwin Sharvill
1013Faith GillianUnited Kingdom2025-08-09Feltz Printing Service RENEWAL2Ivan Magalhaes
1014Deepesh ChuiSpain2025-07-20Benton, John B Jr QUALIFIED90Amy Elsner
1015Octavia MaletCanada2025-07-23Truhlar And Truhlar Attys PROPOSAL89Onyama Limba
1016Clifford RimFrance2025-07-26Rousseaux, Michael Esq UNQUALIFIED8Amy Elsner
1017Ricardo GauchoUnited Kingdom2025-07-25Feltz Printing Service RENEWAL40Xuxue Feng
1018Munro FerenczItaly2025-07-22Commercial Press NEGOTIATION45Bernardo Dominic
1019Maria MarrierJapan2025-07-24Rangoni Of Florence PROPOSAL86Bernardo Dominic
1020Leja CaldareraItaly2025-08-06Chapman, Ross E Esq NEGOTIATION48Anna Fali
1021Munro FerenczFrance2025-07-17Feltz Printing Service QUALIFIED29Onyama Limba
1022Aika InouyeRussia2025-07-19Commercial Press UNQUALIFIED68Amy Elsner
1023Darci PoquetteFrance2025-08-10Chapman, Ross E Esq PROPOSAL2Bernardo Dominic
1024Alejandro PerinCanada2025-07-23Dorl, James J Esq PROPOSAL26Stephen Shaw
1025Francesco ShinkoCanada2025-08-10Morlong Associates NEGOTIATION66Ioni Bowcher
1026Francesco ShinkoCanada2025-07-18Chemel, James L Cpa QUALIFIED36Ivan Magalhaes
1027Mujtaba NickaAustralia2025-07-20Printing Dimensions RENEWAL10Stephen Shaw
1028Aditya KuskoBrazil2025-07-28Feltz Printing Service QUALIFIED12Ivan Magalhaes
1029Mayumi KolmetzRussia2025-08-08Feiner Bros PROPOSAL54Onyama Limba
1030Claire TollnerJapan2025-07-28Chapman, Ross E Esq UNQUALIFIED60Bernardo Dominic
1031Adams MorascaSpain2025-08-03Buckley Miller Wright QUALIFIED59Ioni Bowcher
1032David DarakjyJapan2025-08-07Commercial Press NEW40Anna Fali
1033Juan WieserIndia2025-07-28Chapman, Ross E Esq RENEWAL40Anna Fali
1034Johnson SergiSpain2025-08-03Printing Dimensions PROPOSAL37Anna Fali
1035Johnson SergiAustralia2025-08-08Commercial Press NEGOTIATION58Ioni Bowcher
1036Salvatore StockhamJapan2025-07-20Commercial Press NEW35Ioni Bowcher
1037Deepesh ChuiBrazil2025-07-28Morlong Associates QUALIFIED30Bernardo Dominic
1038Aika InouyeAustralia2025-07-28King, Christopher A Esq QUALIFIED29Elwin Sharvill
1039Tony FollerSpain2025-07-19Truhlar And Truhlar Attys PROPOSAL13Onyama Limba
1040Juan WieserGermany2025-07-17Dorl, James J Esq NEW1Stephen Shaw
1041Ricardo GauchoItaly2025-07-25Rangoni Of Florence NEGOTIATION3Amy Elsner
1042Kadeem FlosiJapan2025-08-04King, Christopher A Esq NEGOTIATION14Amy Elsner
1043Francesco ShinkoFrance2025-08-03Feiner Bros NEW17Ioni Bowcher
1044Nicolas IturbideUnited Kingdom2025-07-29Truhlar And Truhlar Attys QUALIFIED40Elwin Sharvill
1045Izzy GarufiRussia2025-07-25Dorl, James J Esq PROPOSAL96Onyama Limba
1046Izzy GarufiUnited Kingdom2025-08-02Commercial Press NEGOTIATION67Onyama Limba
1047Greenwood BologniaGermany2025-07-25Morlong Associates PROPOSAL73Xuxue Feng
1048Smith GlickFrance2025-08-07Chanay, Jeffrey A Esq PROPOSAL98Ioni Bowcher
1049Leon OldroydGermany2025-07-17Chapman, Ross E Esq NEGOTIATION6Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Johnson SergiCanadaIoni Bowcher QUALIFIED
Silvio SlusarskiJapanIvan Magalhaes NEW
Jones VocelkaJapanElwin Sharvill NEGOTIATION
Jeanfrancois VenereJapanAmy Elsner UNQUALIFIED
Darci PoquetteGermanyAmy Elsner UNQUALIFIED
Ashley DoeIndiaIvan Magalhaes PROPOSAL
Misaki RoysterAustraliaOnyama Limba NEGOTIATION
Aditya KuskoItalyElwin Sharvill RENEWAL
Jefferson SchemmerSpainStephen Shaw RENEWAL
Maisha RulapaughIndiaAmy Elsner RENEWAL
Wickens NestleIndiaBernardo Dominic RENEWAL
Mujtaba NickaFranceAsiya Javayant NEGOTIATION
Mayumi KolmetzRussiaIoni Bowcher PROPOSAL
Aditya KuskoBrazilAsiya Javayant RENEWAL
Aditya KuskoUnited KingdomAmy Elsner RENEWAL
Clifford RimJapanXuxue Feng PROPOSAL
Jennifer AmigonBrazilElwin Sharvill RENEWAL
Leja CaldareraCanadaAnna Fali RENEWAL
Salvatore StockhamIndiaAsiya Javayant UNQUALIFIED
Juan WieserJapanAsiya Javayant QUALIFIED
Aditya KuskoJapanIvan Magalhaes NEGOTIATION
Leja CaldareraAustraliaIvan Magalhaes RENEWAL
Costa DilliardIndiaAmy Elsner PROPOSAL
Darci PoquetteIndiaIoni Bowcher NEW
Alejandro PerinItalyXuxue Feng QUALIFIED
Sinclair WaycottRussiaAnna Fali QUALIFIED
Leon OldroydIndiaBernardo Dominic QUALIFIED
Misaki RoysterBrazilStephen Shaw PROPOSAL
Darci PoquetteCanadaIoni Bowcher NEGOTIATION
Costa DilliardUnited KingdomBernardo Dominic PROPOSAL
Salvatore StockhamItalyBernardo Dominic NEW
Deepesh ChuiAustraliaIvan Magalhaes QUALIFIED
Johnson SergiGermanyStephen Shaw NEGOTIATION
Ricardo GauchoGermanyElwin Sharvill PROPOSAL
Isabel BowleyFranceBernardo Dominic PROPOSAL
Jeanfrancois VenereRussiaXuxue Feng RENEWAL
Jeanfrancois VenereJapanAmy Elsner UNQUALIFIED
Mayumi KolmetzIndiaStephen Shaw QUALIFIED
Jefferson SchemmerFranceIvan Magalhaes UNQUALIFIED
Misaki RoysterFranceAmy Elsner RENEWAL
Salvatore StockhamRussiaOnyama Limba PROPOSAL
Aditya KuskoBrazilBernardo Dominic NEW
Clifford RimAustraliaBernardo Dominic PROPOSAL
Johnson SergiJapanIoni Bowcher NEGOTIATION
Claire TollnerCanadaIvan Magalhaes NEGOTIATION
Alejandro PerinSpainAmy Elsner PROPOSAL
Kaitlin OstroskyItalyIoni Bowcher QUALIFIED
Faith GillianRussiaIoni Bowcher NEGOTIATION
Aika InouyeGermanyIoni Bowcher NEW
Silvio SlusarskiGermanyXuxue Feng RENEWAL
Frozen Columns
Name
Costa Dilliard
Octavia Malet
Clifford Rim
Octavia Malet
Costa Dilliard
Clifford Rim
Clifford Rim
Aditya Kusko
Murillo Malet
Antonio Caudy
Morrow Ruta
Munro Ferencz
Smith Glick
Jennifer Amigon
Chavez Briddick
Emily Whobrey
Misaki Royster
Sinclair Waycott
Kadeem Flosi
Isabel Bowley
Greenwood Bolognia
Isabel Bowley
Greenwood Bolognia
Costa Dilliard
Maisha Rulapaugh
Aika Inouye
Morrow Ruta
Smith Glick
James Butt
Clifford Rim
Munro Ferencz
Aruna Figeroa
Kaitlin Ostrosky
Aditya Kusko
Antonio Caudy
Deepesh Chui
Claire Tollner
Silvio Slusarski
Ricardo Gaucho
Stacey Maclead
Deepesh Chui
David Darakjy
Kaitlin Ostrosky
Leja Caldarera
Morrow Ruta
Antonio Caudy
Maisha Rulapaugh
Faith Gillian
Octavia Malet
Octavia Malet
IdCountryDate
1000Italy2025-07-25
1001Brazil2025-07-31
1002India2025-08-12
1003Italy2025-08-03
1004Germany2025-08-01
1005Germany2025-08-10
1006Germany2025-08-12
1007Canada2025-08-05
1008Japan2025-07-23
1009Germany2025-07-27
1010Japan2025-07-17
1011Australia2025-08-10
1012India2025-07-21
1013Australia2025-07-29
1014Brazil2025-07-25
1015Japan2025-08-03
1016Italy2025-08-08
1017Brazil2025-08-07
1018Canada2025-07-21
1019United Kingdom2025-07-26
1020Italy2025-07-22
1021Argentina2025-08-08
1022India2025-08-12
1023Germany2025-08-02
1024Spain2025-08-07
1025Germany2025-07-29
1026France2025-07-18
1027Italy2025-07-20
1028Japan2025-08-10
1029Spain2025-08-06
1030Germany2025-08-12
1031United Kingdom2025-07-18
1032Brazil2025-07-20
1033Australia2025-07-15
1034Canada2025-08-12
1035Brazil2025-07-29
1036Germany2025-07-29
1037Argentina2025-08-12
1038Japan2025-08-05
1039Canada2025-08-08
1040Italy2025-07-29
1041Australia2025-07-26
1042India2025-07-24
1043India2025-07-26
1044Russia2025-07-20
1045Argentina2025-07-31
1046Japan2025-07-21
1047Japan2025-07-31
1048Russia2025-07-25
1049Argentina2025-07-21

On-Demand Data

NameIdCountryDate
Sinclair Waycott1000United Kingdom2025-08-10
Alejandro Perin1001Italy2025-07-28
Johnson Sergi1002India2025-08-01
Misaki Royster1003India2025-07-22
Arvin Albares1004India2025-08-13
Maria Marrier1005India2025-08-03
Kadeem Flosi1006Russia2025-08-07
Izzy Garufi1007India2025-07-20
Mujtaba Nicka1008Germany2025-08-10
Silvio Slusarski1009India2025-07-19
Antonio Caudy1010Spain2025-08-12
Ashley Doe1011Germany2025-07-18
Smith Glick1012Spain2025-07-22
Jefferson Schemmer1013Italy2025-07-27
Sinclair Waycott1014Japan2025-07-19
Morrow Ruta1015France2025-07-25
David Darakjy1016Japan2025-07-18
Morrow Ruta1017Argentina2025-07-31
Jennifer Amigon1018Spain2025-07-20
Clifford Rim1019India2025-08-07
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Ricardo GauchoItalyXuxue Feng RENEWAL
Faith GillianJapanXuxue Feng RENEWAL
Misaki RoysterAustraliaAnna Fali QUALIFIED
Mujtaba NickaRussiaAsiya Javayant NEW
Ashley DoeJapanAsiya Javayant PROPOSAL
Jeanfrancois VenereJapanOnyama Limba UNQUALIFIED
Chavez BriddickUnited KingdomOnyama Limba PROPOSAL
Kaitlin OstroskyIndiaAsiya Javayant PROPOSAL
David DarakjyArgentinaXuxue Feng NEGOTIATION
Adams MorascaFranceIoni Bowcher NEGOTIATION
Silvio SlusarskiJapanAmy Elsner RENEWAL
Munro FerenczJapanIoni Bowcher PROPOSAL
Kadeem FlosiSpainAmy Elsner UNQUALIFIED
Aruna FigeroaSpainIvan Magalhaes RENEWAL
Clifford RimUnited KingdomElwin Sharvill QUALIFIED
Ricardo GauchoRussiaXuxue Feng NEW
Antonio CaudyGermanyIvan Magalhaes PROPOSAL
Sinclair WaycottSpainOnyama Limba PROPOSAL
Juan WieserRussiaElwin Sharvill UNQUALIFIED
Octavia MaletGermanyIoni Bowcher PROPOSAL
Greenwood BologniaSpainStephen Shaw PROPOSAL
Juan WieserAustraliaOnyama Limba NEGOTIATION
Octavia MaletArgentinaIoni Bowcher RENEWAL
Smith GlickCanadaAnna Fali NEGOTIATION
Faith GillianBrazilAmy Elsner QUALIFIED
Leja CaldareraSpainAnna Fali QUALIFIED
James ButtUnited KingdomAmy Elsner NEW
Rodrigues CampainBrazilOnyama Limba NEW
Greenwood BologniaGermanyXuxue Feng NEW
Arvin AlbaresFranceOnyama Limba UNQUALIFIED
Aika InouyeItalyElwin Sharvill NEW
Darci PoquetteIndiaXuxue Feng NEW
Aruna FigeroaBrazilStephen Shaw PROPOSAL
Julie StensethRussiaAmy Elsner QUALIFIED
Francesco ShinkoJapanElwin Sharvill RENEWAL
Greenwood BologniaIndiaBernardo Dominic NEGOTIATION
Greenwood BologniaFranceBernardo Dominic UNQUALIFIED
Rodrigues CampainIndiaOnyama Limba RENEWAL
Silvio SlusarskiJapanXuxue Feng PROPOSAL
Salvatore StockhamUnited KingdomBernardo Dominic NEW

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