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
Ivar PaprockiItalyOnyama Limba RENEWAL
Aruna FigeroaCanadaAnna Fali UNQUALIFIED
Antonio CaudyUnited KingdomAmy Elsner QUALIFIED
Kadeem FlosiFranceAsiya Javayant PROPOSAL
Jennifer AmigonArgentinaOnyama Limba RENEWAL
Faith GillianFranceAnna Fali QUALIFIED
Julie StensethFranceIoni Bowcher UNQUALIFIED
Nicolas IturbideAustraliaStephen Shaw RENEWAL
Mayumi KolmetzItalyElwin Sharvill UNQUALIFIED
Juan WieserSpainAsiya Javayant RENEWAL
Morrow RutaBrazilIoni Bowcher NEGOTIATION
Leja CaldareraItalyAsiya Javayant PROPOSAL
Arvin AlbaresGermanyAmy Elsner NEW
Leon OldroydFranceAnna Fali UNQUALIFIED
Johnson SergiAustraliaAsiya Javayant RENEWAL
Rodrigues CampainIndiaElwin Sharvill PROPOSAL
Rodrigues CampainJapanOnyama Limba PROPOSAL
Jeanfrancois VenereUnited KingdomAnna Fali RENEWAL
Darci PoquetteGermanyAnna Fali RENEWAL
Alejandro PerinItalyAmy Elsner NEGOTIATION
Salvatore StockhamBrazilElwin Sharvill NEW
Salvatore StockhamItalyAnna Fali NEGOTIATION
Chavez BriddickBrazilStephen Shaw NEW
James ButtSpainXuxue Feng RENEWAL
Leon OldroydFranceAnna Fali QUALIFIED
Julie StensethSpainOnyama Limba QUALIFIED
Darci PoquetteSpainIvan Magalhaes NEW
Aditya KuskoItalyOnyama Limba RENEWAL
Claire TollnerArgentinaXuxue Feng RENEWAL
Isabel BowleyBrazilOnyama Limba RENEWAL
Salvatore StockhamFranceOnyama Limba PROPOSAL
Maisha RulapaughArgentinaElwin Sharvill UNQUALIFIED
Greenwood BologniaCanadaIvan Magalhaes NEW
Leja CaldareraGermanyIvan Magalhaes NEW
Jones VocelkaCanadaAnna Fali UNQUALIFIED
Mujtaba NickaAustraliaIvan Magalhaes UNQUALIFIED
Maria MarrierIndiaBernardo Dominic NEGOTIATION
Faith GillianGermanyIvan Magalhaes QUALIFIED
Mayumi KolmetzJapanAsiya Javayant UNQUALIFIED
Wickens NestleUnited KingdomElwin Sharvill PROPOSAL
Adams MorascaRussiaAmy Elsner NEW
Arvin AlbaresUnited KingdomIvan Magalhaes QUALIFIED
Tony FollerArgentinaIoni Bowcher PROPOSAL
Silvio SlusarskiFranceOnyama Limba PROPOSAL
Cody SaylorsJapanStephen Shaw RENEWAL
Wickens NestleIndiaOnyama Limba NEW
Maria MarrierRussiaElwin Sharvill NEW
Izzy GarufiJapanElwin Sharvill QUALIFIED
Mujtaba NickaFranceXuxue Feng NEGOTIATION
Faith GillianCanadaXuxue Feng UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Jones VocelkaFranceXuxue Feng NEW
Rodrigues CampainAustraliaIoni Bowcher NEW
Cody SaylorsSpainElwin Sharvill NEW
Rodrigues CampainRussiaIvan Magalhaes RENEWAL
Aruna FigeroaRussiaAmy Elsner PROPOSAL
Adams MorascaAustraliaIvan Magalhaes NEGOTIATION
David DarakjyUnited KingdomAmy Elsner RENEWAL
Costa DilliardSpainXuxue Feng UNQUALIFIED
Johnson SergiRussiaStephen Shaw UNQUALIFIED
Greenwood BologniaItalyXuxue Feng PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Nicolas IturbideIndia2025-10-09Rousseaux, Michael Esq QUALIFIED1Ioni Bowcher
1001Misaki RoysterAustralia2025-10-06Feltz Printing Service RENEWAL5Asiya Javayant
1002Salvatore StockhamIndia2025-09-19Feiner Bros PROPOSAL46Onyama Limba
1003Aika InouyeBrazil2025-10-05Truhlar And Truhlar Attys QUALIFIED62Anna Fali
1004Clifford RimItaly2025-09-26Chapman, Ross E Esq NEW43Amy Elsner
1005Maria MarrierUnited Kingdom2025-09-30Chemel, James L Cpa PROPOSAL69Anna Fali
1006Cody SaylorsJapan2025-09-21Printing Dimensions RENEWAL74Onyama Limba
1007Stacey MacleadRussia2025-09-12Chapman, Ross E Esq RENEWAL15Onyama Limba
1008Costa DilliardSpain2025-09-29Morlong Associates PROPOSAL2Anna Fali
1009David DarakjyBrazil2025-09-25Morlong Associates UNQUALIFIED4Asiya Javayant
1010Kadeem FlosiCanada2025-10-05Commercial Press NEGOTIATION88Onyama Limba
1011Silvio SlusarskiRussia2025-09-22Feiner Bros PROPOSAL54Anna Fali
1012Darci PoquetteAustralia2025-09-27Rousseaux, Michael Esq PROPOSAL30Amy Elsner
1013Arvin AlbaresRussia2025-10-01Benton, John B Jr NEGOTIATION74Bernardo Dominic
1014Clifford RimUnited Kingdom2025-09-16Rousseaux, Michael Esq UNQUALIFIED50Elwin Sharvill
1015James ButtSpain2025-09-29Chemel, James L Cpa NEGOTIATION79Onyama Limba
1016Morrow RutaSpain2025-09-30Printing Dimensions NEGOTIATION17Elwin Sharvill
1017Mujtaba NickaUnited Kingdom2025-10-09Rousseaux, Michael Esq UNQUALIFIED44Onyama Limba
1018Maisha RulapaughItaly2025-09-26Dorl, James J Esq PROPOSAL37Elwin Sharvill
1019Alejandro PerinUnited Kingdom2025-09-28Chapman, Ross E Esq RENEWAL56Asiya Javayant
1020Murillo MaletRussia2025-09-23Chapman, Ross E Esq NEGOTIATION93Ivan Magalhaes
1021Darci PoquetteRussia2025-10-10Chanay, Jeffrey A Esq NEGOTIATION70Elwin Sharvill
1022Ashley DoeItaly2025-09-17Commercial Press PROPOSAL95Elwin Sharvill
1023David DarakjyBrazil2025-09-23Printing Dimensions PROPOSAL26Onyama Limba
1024Wickens NestleSpain2025-09-29Feltz Printing Service PROPOSAL16Amy Elsner
1025Greenwood BologniaFrance2025-10-07Rangoni Of Florence NEW39Bernardo Dominic
1026Ashley DoeRussia2025-09-22Feltz Printing Service NEGOTIATION30Onyama Limba
1027Ricardo GauchoIndia2025-10-02Printing Dimensions QUALIFIED35Ivan Magalhaes
1028Kadeem FlosiFrance2025-09-30Feiner Bros NEGOTIATION85Onyama Limba
1029Rodrigues CampainJapan2025-09-11Rangoni Of Florence RENEWAL17Bernardo Dominic
1030Maria MarrierIndia2025-09-29Feltz Printing Service NEW31Asiya Javayant
1031Kaitlin OstroskyIndia2025-10-02Morlong Associates NEW98Bernardo Dominic
1032Francesco ShinkoUnited Kingdom2025-10-01Morlong Associates PROPOSAL27Amy Elsner
1033Ivar PaprockiAustralia2025-09-17Commercial Press NEGOTIATION74Ivan Magalhaes
1034Maisha RulapaughFrance2025-09-28Chapman, Ross E Esq QUALIFIED15Stephen Shaw
1035Jeanfrancois VenereGermany2025-09-27Chapman, Ross E Esq UNQUALIFIED69Anna Fali
1036Juan WieserArgentina2025-09-25Buckley Miller Wright PROPOSAL30Asiya Javayant
1037Julie StensethAustralia2025-09-23Dorl, James J Esq PROPOSAL19Anna Fali
1038Jones VocelkaItaly2025-09-14King, Christopher A Esq QUALIFIED86Ioni Bowcher
1039Jennifer AmigonSpain2025-09-30Benton, John B Jr NEGOTIATION40Amy Elsner
1040Kadeem FlosiCanada2025-09-20Commercial Press QUALIFIED78Amy Elsner
1041Isabel BowleyArgentina2025-09-25Rangoni Of Florence NEW64Bernardo Dominic
1042Murillo MaletCanada2025-10-07Feiner Bros NEW18Xuxue Feng
1043Stacey MacleadFrance2025-10-09Chapman, Ross E Esq UNQUALIFIED50Xuxue Feng
1044Ivar PaprockiRussia2025-10-05Feiner Bros NEW1Amy Elsner
1045Ivar PaprockiGermany2025-09-26Truhlar And Truhlar Attys NEW9Stephen Shaw
1046Stacey MacleadCanada2025-09-21Feltz Printing Service NEW30Ioni Bowcher
1047Jones VocelkaJapan2025-10-05Chanay, Jeffrey A Esq NEGOTIATION21Asiya Javayant
1048Octavia MaletGermany2025-10-03Buckley Miller Wright RENEWAL29Xuxue Feng
1049Emily WhobreySpain2025-10-04Commercial Press NEW31Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
James ButtCanadaOnyama Limba RENEWAL
Ashley DoeUnited KingdomBernardo Dominic NEGOTIATION
Ashley DoeUnited KingdomXuxue Feng NEW
Morrow RutaBrazilElwin Sharvill NEGOTIATION
Mayumi KolmetzSpainAmy Elsner NEGOTIATION
Jefferson SchemmerUnited KingdomAsiya Javayant QUALIFIED
Mujtaba NickaJapanAnna Fali RENEWAL
Ricardo GauchoBrazilElwin Sharvill NEW
Arvin AlbaresSpainBernardo Dominic RENEWAL
Wickens NestleRussiaAnna Fali NEGOTIATION
Claire TollnerCanadaAsiya Javayant RENEWAL
Sinclair WaycottJapanAsiya Javayant PROPOSAL
Ashley DoeJapanAmy Elsner UNQUALIFIED
Claire TollnerBrazilOnyama Limba RENEWAL
Deepesh ChuiAustraliaXuxue Feng NEGOTIATION
Juan WieserFranceElwin Sharvill NEW
Jeanfrancois VenereAustraliaElwin Sharvill NEGOTIATION
Clifford RimItalyIvan Magalhaes PROPOSAL
Cody SaylorsIndiaXuxue Feng NEW
Leon OldroydIndiaAsiya Javayant QUALIFIED
Adams MorascaRussiaOnyama Limba UNQUALIFIED
Emily WhobreyArgentinaAnna Fali QUALIFIED
Aditya KuskoArgentinaBernardo Dominic RENEWAL
Mujtaba NickaGermanyXuxue Feng UNQUALIFIED
Isabel BowleyFranceIoni Bowcher QUALIFIED
Claire TollnerItalyAnna Fali NEGOTIATION
Rodrigues CampainSpainStephen Shaw QUALIFIED
Tony FollerSpainAmy Elsner QUALIFIED
Morrow RutaItalyAnna Fali NEW
Jones VocelkaCanadaElwin Sharvill UNQUALIFIED
Leon OldroydSpainIvan Magalhaes PROPOSAL
Maria MarrierSpainStephen Shaw NEW
Tony FollerArgentinaStephen Shaw NEGOTIATION
Ivar PaprockiFranceIvan Magalhaes QUALIFIED
Leja CaldareraFranceAsiya Javayant QUALIFIED
Smith GlickCanadaXuxue Feng UNQUALIFIED
Ashley DoeGermanyAmy Elsner QUALIFIED
Faith GillianItalyIoni Bowcher PROPOSAL
Julie StensethUnited KingdomXuxue Feng PROPOSAL
Kadeem FlosiUnited KingdomAsiya Javayant RENEWAL
Smith GlickCanadaBernardo Dominic QUALIFIED
Claire TollnerArgentinaAmy Elsner NEGOTIATION
Julie StensethRussiaXuxue Feng PROPOSAL
Ivar PaprockiIndiaStephen Shaw NEGOTIATION
Mujtaba NickaBrazilBernardo Dominic NEGOTIATION
Ashley DoeIndiaIvan Magalhaes PROPOSAL
Smith GlickFranceOnyama Limba UNQUALIFIED
David DarakjyGermanyAnna Fali NEW
Smith GlickArgentinaElwin Sharvill PROPOSAL
Deepesh ChuiArgentinaXuxue Feng RENEWAL
Frozen Columns
Name
Alejandro Perin
Munro Ferencz
Mujtaba Nicka
David Darakjy
Maisha Rulapaugh
Leja Caldarera
Izzy Garufi
Sinclair Waycott
Chavez Briddick
Rodrigues Campain
Mayumi Kolmetz
Misaki Royster
Smith Glick
Johnson Sergi
Nicolas Iturbide
Francesco Shinko
Deepesh Chui
Mujtaba Nicka
Arvin Albares
Silvio Slusarski
Adams Morasca
Stacey Maclead
Sinclair Waycott
Ricardo Gaucho
Deepesh Chui
Julie Stenseth
Julie Stenseth
Julie Stenseth
David Darakjy
Octavia Malet
Chavez Briddick
Chavez Briddick
Stacey Maclead
Alejandro Perin
David Darakjy
Smith Glick
Munro Ferencz
Aditya Kusko
Misaki Royster
Juan Wieser
Jefferson Schemmer
Julie Stenseth
Aika Inouye
Kadeem Flosi
Octavia Malet
Leon Oldroyd
Smith Glick
Cody Saylors
Darci Poquette
Stacey Maclead
IdCountryDate
1000Germany2025-09-16
1001United Kingdom2025-09-15
1002India2025-09-14
1003Argentina2025-10-02
1004Brazil2025-09-17
1005Argentina2025-09-22
1006Argentina2025-10-04
1007Argentina2025-09-12
1008Germany2025-10-04
1009Russia2025-09-30
1010Japan2025-09-18
1011France2025-09-29
1012France2025-09-11
1013Japan2025-09-28
1014Japan2025-09-29
1015Russia2025-09-17
1016Canada2025-10-02
1017Germany2025-09-16
1018Brazil2025-09-23
1019Italy2025-09-27
1020Russia2025-09-13
1021Canada2025-10-02
1022Spain2025-09-17
1023Spain2025-10-05
1024Canada2025-10-01
1025Italy2025-09-16
1026Spain2025-10-04
1027United Kingdom2025-09-24
1028Russia2025-09-22
1029Russia2025-09-29
1030Russia2025-10-02
1031Russia2025-09-22
1032Argentina2025-10-03
1033Spain2025-10-06
1034Russia2025-09-12
1035Brazil2025-10-03
1036India2025-09-14
1037Russia2025-09-17
1038India2025-09-28
1039Italy2025-09-11
1040Argentina2025-09-28
1041Japan2025-09-29
1042India2025-10-06
1043Japan2025-09-27
1044Russia2025-10-05
1045Brazil2025-10-04
1046United Kingdom2025-10-08
1047Australia2025-09-16
1048Japan2025-09-17
1049Spain2025-10-10

On-Demand Data

NameIdCountryDate
Chavez Briddick1000France2025-10-08
Chavez Briddick1001Argentina2025-09-30
Clifford Rim1002Japan2025-10-09
Adams Morasca1003Japan2025-09-20
Juan Wieser1004Australia2025-09-21
Antonio Caudy1005Italy2025-09-14
Kaitlin Ostrosky1006Australia2025-09-24
Rodrigues Campain1007Spain2025-10-03
Deepesh Chui1008Russia2025-10-05
Ashley Doe1009India2025-10-06
Maisha Rulapaugh1010Spain2025-10-04
Mujtaba Nicka1011Germany2025-09-20
Leon Oldroyd1012Japan2025-10-09
Izzy Garufi1013Germany2025-09-14
Chavez Briddick1014Brazil2025-09-24
Sinclair Waycott1015France2025-10-04
Izzy Garufi1016United Kingdom2025-09-13
Munro Ferencz1017Spain2025-09-21
Maria Marrier1018United Kingdom2025-10-08
Stacey Maclead1019Argentina2025-09-27
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Octavia MaletArgentinaBernardo Dominic NEGOTIATION
Costa DilliardUnited KingdomStephen Shaw NEW
Deepesh ChuiAustraliaBernardo Dominic PROPOSAL
Mayumi KolmetzCanadaXuxue Feng QUALIFIED
Salvatore StockhamRussiaXuxue Feng NEGOTIATION
Aika InouyeIndiaAnna Fali QUALIFIED
Jones VocelkaBrazilAnna Fali NEW
Kaitlin OstroskyItalyOnyama Limba RENEWAL
Deepesh ChuiGermanyAsiya Javayant QUALIFIED
Smith GlickBrazilStephen Shaw UNQUALIFIED
Ricardo GauchoBrazilElwin Sharvill NEGOTIATION
Jennifer AmigonGermanyXuxue Feng NEGOTIATION
Clifford RimFranceAnna Fali QUALIFIED
Kaitlin OstroskyAustraliaIoni Bowcher UNQUALIFIED
Nicolas IturbideRussiaAmy Elsner QUALIFIED
Tony FollerRussiaIoni Bowcher QUALIFIED
Stacey MacleadIndiaAsiya Javayant NEGOTIATION
Johnson SergiSpainAnna Fali UNQUALIFIED
Jeanfrancois VenereAustraliaXuxue Feng PROPOSAL
Juan WieserAustraliaAnna Fali RENEWAL
Ivar PaprockiCanadaElwin Sharvill PROPOSAL
Mujtaba NickaItalyIoni Bowcher UNQUALIFIED
Morrow RutaUnited KingdomStephen Shaw NEGOTIATION
Alejandro PerinAustraliaStephen Shaw RENEWAL
Darci PoquetteGermanyAmy Elsner RENEWAL
Mayumi KolmetzJapanIvan Magalhaes NEGOTIATION
Mayumi KolmetzIndiaStephen Shaw RENEWAL
Juan WieserBrazilAsiya Javayant QUALIFIED
James ButtArgentinaBernardo Dominic UNQUALIFIED
Aditya KuskoRussiaAsiya Javayant RENEWAL
Kadeem FlosiGermanyOnyama Limba UNQUALIFIED
Salvatore StockhamSpainAnna Fali QUALIFIED
Morrow RutaArgentinaAnna Fali RENEWAL
David DarakjyAustraliaStephen Shaw NEGOTIATION
Wickens NestleUnited KingdomStephen Shaw NEW
Morrow RutaJapanAsiya Javayant PROPOSAL
Maisha RulapaughRussiaAnna Fali QUALIFIED
Aditya KuskoJapanIvan Magalhaes NEW
Emily WhobreyItalyAsiya Javayant PROPOSAL
Kaitlin OstroskyRussiaIoni 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>