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
Alejandro PerinRussiaIvan Magalhaes QUALIFIED
Silvio SlusarskiJapanStephen Shaw NEGOTIATION
Juan WieserSpainIvan Magalhaes NEW
Arvin AlbaresCanadaAmy Elsner NEGOTIATION
Alejandro PerinCanadaOnyama Limba NEGOTIATION
Sinclair WaycottIndiaStephen Shaw NEGOTIATION
Nicolas IturbideCanadaAnna Fali PROPOSAL
Antonio CaudyUnited KingdomStephen Shaw NEW
Arvin AlbaresItalyAsiya Javayant NEGOTIATION
Claire TollnerRussiaAsiya Javayant RENEWAL
Julie StensethRussiaElwin Sharvill QUALIFIED
Aruna FigeroaGermanyOnyama Limba PROPOSAL
Izzy GarufiBrazilOnyama Limba NEGOTIATION
Rodrigues CampainBrazilAnna Fali NEW
Johnson SergiUnited KingdomBernardo Dominic QUALIFIED
Julie StensethBrazilElwin Sharvill UNQUALIFIED
Salvatore StockhamIndiaElwin Sharvill NEGOTIATION
Jefferson SchemmerIndiaAnna Fali NEW
Sinclair WaycottSpainXuxue Feng QUALIFIED
Rodrigues CampainArgentinaBernardo Dominic QUALIFIED
Aruna FigeroaRussiaStephen Shaw NEGOTIATION
Emily WhobreyJapanElwin Sharvill NEW
Maisha RulapaughJapanBernardo Dominic RENEWAL
Costa DilliardCanadaIoni Bowcher QUALIFIED
Leja CaldareraItalyBernardo Dominic QUALIFIED
Rodrigues CampainCanadaOnyama Limba NEW
Mayumi KolmetzAustraliaIoni Bowcher RENEWAL
Maisha RulapaughGermanyBernardo Dominic PROPOSAL
Rodrigues CampainAustraliaIoni Bowcher NEW
Antonio CaudyGermanyIoni Bowcher QUALIFIED
Mujtaba NickaIndiaAsiya Javayant NEW
Aruna FigeroaArgentinaIoni Bowcher NEGOTIATION
Silvio SlusarskiCanadaAsiya Javayant NEW
Munro FerenczItalyAmy Elsner NEGOTIATION
Costa DilliardCanadaAnna Fali UNQUALIFIED
Faith GillianGermanyXuxue Feng QUALIFIED
Jeanfrancois VenereBrazilIvan Magalhaes UNQUALIFIED
Johnson SergiRussiaIoni Bowcher PROPOSAL
David DarakjyFranceIoni Bowcher NEGOTIATION
Mujtaba NickaRussiaIvan Magalhaes UNQUALIFIED
Izzy GarufiArgentinaBernardo Dominic NEGOTIATION
Sinclair WaycottUnited KingdomOnyama Limba QUALIFIED
Morrow RutaBrazilIvan Magalhaes NEGOTIATION
Rodrigues CampainIndiaXuxue Feng QUALIFIED
Adams MorascaCanadaStephen Shaw QUALIFIED
Misaki RoysterFranceElwin Sharvill NEW
Rodrigues CampainRussiaAsiya Javayant NEW
Octavia MaletUnited KingdomIvan Magalhaes RENEWAL
Maria MarrierIndiaElwin Sharvill RENEWAL
Salvatore StockhamAustraliaIvan Magalhaes QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Aika InouyeItalyOnyama Limba NEW
Francesco ShinkoItalyAnna Fali UNQUALIFIED
Alejandro PerinItalyXuxue Feng NEGOTIATION
Mujtaba NickaRussiaAnna Fali NEW
Mayumi KolmetzGermanyOnyama Limba PROPOSAL
Wickens NestleItalyElwin Sharvill QUALIFIED
Juan WieserGermanyIoni Bowcher PROPOSAL
Morrow RutaIndiaBernardo Dominic NEW
Leja CaldareraSpainAmy Elsner NEGOTIATION
Murillo MaletAustraliaXuxue Feng RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Nicolas IturbideRussia2026-03-30Rousseaux, Michael Esq NEGOTIATION34Ioni Bowcher
1001Greenwood BologniaItaly2026-04-19King, Christopher A Esq PROPOSAL94Anna Fali
1002Stacey MacleadUnited Kingdom2026-03-23Rangoni Of Florence NEW71Amy Elsner
1003Aditya KuskoUnited Kingdom2026-04-10Benton, John B Jr NEW62Asiya Javayant
1004Ashley DoeItaly2026-04-12Printing Dimensions QUALIFIED81Asiya Javayant
1005Maria MarrierBrazil2026-03-29Chemel, James L Cpa UNQUALIFIED72Bernardo Dominic
1006Francesco ShinkoUnited Kingdom2026-03-31Printing Dimensions QUALIFIED70Asiya Javayant
1007Greenwood BologniaRussia2026-04-06Buckley Miller Wright PROPOSAL0Xuxue Feng
1008Kaitlin OstroskyGermany2026-04-07Benton, John B Jr QUALIFIED44Ivan Magalhaes
1009Kadeem FlosiUnited Kingdom2026-03-22Chemel, James L Cpa RENEWAL30Elwin Sharvill
1010Alejandro PerinGermany2026-04-04Chemel, James L Cpa NEW11Bernardo Dominic
1011Emily WhobreyItaly2026-03-27Printing Dimensions NEW59Bernardo Dominic
1012Ricardo GauchoItaly2026-04-10Dorl, James J Esq UNQUALIFIED90Elwin Sharvill
1013Greenwood BologniaRussia2026-04-04Feiner Bros NEGOTIATION99Ioni Bowcher
1014Misaki RoysterSpain2026-03-31Rousseaux, Michael Esq UNQUALIFIED42Amy Elsner
1015James ButtBrazil2026-04-14Printing Dimensions PROPOSAL12Anna Fali
1016Emily WhobreyItaly2026-04-04Chemel, James L Cpa RENEWAL36Stephen Shaw
1017Johnson SergiItaly2026-04-15Benton, John B Jr UNQUALIFIED70Onyama Limba
1018Murillo MaletGermany2026-04-01Feltz Printing Service RENEWAL75Ivan Magalhaes
1019Alejandro PerinJapan2026-04-16Rousseaux, Michael Esq QUALIFIED61Bernardo Dominic
1020Misaki RoysterGermany2026-03-28Buckley Miller Wright NEW28Ioni Bowcher
1021Johnson SergiRussia2026-04-13Morlong Associates PROPOSAL94Stephen Shaw
1022Morrow RutaArgentina2026-04-02Printing Dimensions PROPOSAL62Anna Fali
1023Francesco ShinkoUnited Kingdom2026-04-04Rangoni Of Florence PROPOSAL22Onyama Limba
1024Julie StensethFrance2026-04-03Benton, John B Jr NEGOTIATION77Elwin Sharvill
1025Aika InouyeRussia2026-04-02Feltz Printing Service PROPOSAL19Asiya Javayant
1026Claire TollnerGermany2026-04-03Dorl, James J Esq PROPOSAL63Ioni Bowcher
1027Julie StensethRussia2026-04-12Rousseaux, Michael Esq QUALIFIED90Bernardo Dominic
1028Smith GlickItaly2026-03-22Benton, John B Jr RENEWAL28Stephen Shaw
1029Cody SaylorsItaly2026-04-12Rangoni Of Florence NEW65Elwin Sharvill
1030Tony FollerJapan2026-03-22Benton, John B Jr NEW78Anna Fali
1031Wickens NestleUnited Kingdom2026-03-28Chapman, Ross E Esq QUALIFIED86Anna Fali
1032David DarakjySpain2026-03-27Feiner Bros QUALIFIED5Xuxue Feng
1033Chavez BriddickItaly2026-04-12Morlong Associates PROPOSAL0Ivan Magalhaes
1034Faith GillianFrance2026-04-11Feltz Printing Service QUALIFIED21Ioni Bowcher
1035Clifford RimIndia2026-03-22Rousseaux, Michael Esq QUALIFIED87Asiya Javayant
1036Aditya KuskoFrance2026-04-01Truhlar And Truhlar Attys NEW56Anna Fali
1037Leja CaldareraIndia2026-04-15Benton, John B Jr UNQUALIFIED28Asiya Javayant
1038Ricardo GauchoJapan2026-04-01Dorl, James J Esq QUALIFIED18Xuxue Feng
1039Jennifer AmigonArgentina2026-03-28Printing Dimensions PROPOSAL53Xuxue Feng
1040Octavia MaletJapan2026-03-25Chanay, Jeffrey A Esq NEGOTIATION43Amy Elsner
1041Ashley DoeCanada2026-03-21Morlong Associates QUALIFIED8Bernardo Dominic
1042Adams MorascaIndia2026-04-19Printing Dimensions QUALIFIED72Xuxue Feng
1043Kaitlin OstroskyJapan2026-04-17Truhlar And Truhlar Attys NEW64Ioni Bowcher
1044Salvatore StockhamIndia2026-04-05Dorl, James J Esq NEW95Bernardo Dominic
1045Johnson SergiBrazil2026-04-05Rangoni Of Florence PROPOSAL60Ioni Bowcher
1046Misaki RoysterUnited Kingdom2026-04-19Feiner Bros PROPOSAL46Stephen Shaw
1047Jones VocelkaItaly2026-04-03Chanay, Jeffrey A Esq RENEWAL52Anna Fali
1048Kadeem FlosiBrazil2026-04-06Morlong Associates PROPOSAL43Anna Fali
1049Stacey MacleadFrance2026-04-19Dorl, James J Esq PROPOSAL94Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Alejandro PerinItalyIoni Bowcher NEGOTIATION
Maisha RulapaughSpainStephen Shaw UNQUALIFIED
Mayumi KolmetzAustraliaStephen Shaw UNQUALIFIED
Maria MarrierGermanyOnyama Limba PROPOSAL
Adams MorascaRussiaOnyama Limba RENEWAL
Aditya KuskoFranceAmy Elsner NEGOTIATION
Maria MarrierItalyAsiya Javayant NEGOTIATION
Morrow RutaUnited KingdomXuxue Feng NEGOTIATION
Ivar PaprockiCanadaStephen Shaw UNQUALIFIED
Ivar PaprockiSpainStephen Shaw PROPOSAL
Mujtaba NickaUnited KingdomAnna Fali RENEWAL
Munro FerenczSpainStephen Shaw RENEWAL
Stacey MacleadSpainStephen Shaw PROPOSAL
Jefferson SchemmerJapanOnyama Limba NEGOTIATION
Juan WieserFranceElwin Sharvill PROPOSAL
Nicolas IturbideArgentinaOnyama Limba RENEWAL
Jones VocelkaGermanyAmy Elsner NEGOTIATION
Clifford RimCanadaXuxue Feng PROPOSAL
Arvin AlbaresJapanAsiya Javayant PROPOSAL
Isabel BowleyCanadaOnyama Limba NEW
Misaki RoysterRussiaAnna Fali QUALIFIED
Misaki RoysterFranceAsiya Javayant UNQUALIFIED
Clifford RimFranceBernardo Dominic NEW
Jones VocelkaArgentinaAsiya Javayant NEGOTIATION
David DarakjyArgentinaBernardo Dominic NEW
Deepesh ChuiArgentinaIvan Magalhaes PROPOSAL
Alejandro PerinGermanyIoni Bowcher UNQUALIFIED
Jefferson SchemmerSpainElwin Sharvill NEGOTIATION
James ButtRussiaStephen Shaw QUALIFIED
Greenwood BologniaJapanElwin Sharvill NEW
Wickens NestleGermanyOnyama Limba RENEWAL
Smith GlickFranceIvan Magalhaes RENEWAL
Aika InouyeItalyOnyama Limba NEGOTIATION
Wickens NestleBrazilXuxue Feng PROPOSAL
Deepesh ChuiCanadaOnyama Limba UNQUALIFIED
Octavia MaletRussiaIoni Bowcher RENEWAL
Mayumi KolmetzItalyOnyama Limba UNQUALIFIED
Alejandro PerinFranceStephen Shaw QUALIFIED
Ricardo GauchoIndiaOnyama Limba QUALIFIED
Nicolas IturbideItalyAmy Elsner RENEWAL
Costa DilliardGermanyStephen Shaw UNQUALIFIED
Jennifer AmigonIndiaBernardo Dominic NEW
Silvio SlusarskiIndiaAnna Fali QUALIFIED
Jefferson SchemmerItalyStephen Shaw NEW
Mujtaba NickaCanadaOnyama Limba RENEWAL
Aika InouyeItalyIoni Bowcher NEGOTIATION
Sinclair WaycottAustraliaElwin Sharvill RENEWAL
Jeanfrancois VenereCanadaXuxue Feng RENEWAL
Nicolas IturbideArgentinaXuxue Feng PROPOSAL
Munro FerenczItalyElwin Sharvill RENEWAL
Frozen Columns
Name
Aika Inouye
Maisha Rulapaugh
Maria Marrier
Tony Foller
Stacey Maclead
Stacey Maclead
Juan Wieser
Costa Dilliard
Antonio Caudy
Aditya Kusko
Mujtaba Nicka
Silvio Slusarski
Munro Ferencz
Maria Marrier
Julie Stenseth
Darci Poquette
Isabel Bowley
Izzy Garufi
Julie Stenseth
Arvin Albares
Smith Glick
Misaki Royster
Deepesh Chui
Sinclair Waycott
Morrow Ruta
Silvio Slusarski
Adams Morasca
Misaki Royster
Francesco Shinko
Costa Dilliard
Murillo Malet
Cody Saylors
Jefferson Schemmer
Salvatore Stockham
Francesco Shinko
Mayumi Kolmetz
Alejandro Perin
Murillo Malet
Izzy Garufi
Silvio Slusarski
Izzy Garufi
Tony Foller
Isabel Bowley
Chavez Briddick
Octavia Malet
Johnson Sergi
Wickens Nestle
David Darakjy
Tony Foller
Leja Caldarera
IdCountryDate
1000Germany2026-03-30
1001Brazil2026-04-13
1002India2026-04-16
1003France2026-04-13
1004Argentina2026-04-04
1005United Kingdom2026-03-31
1006Japan2026-03-27
1007Argentina2026-04-13
1008United Kingdom2026-03-22
1009Italy2026-03-25
1010Argentina2026-04-02
1011Italy2026-04-19
1012Brazil2026-04-07
1013Japan2026-04-11
1014Argentina2026-03-21
1015Argentina2026-04-01
1016Italy2026-04-16
1017Canada2026-03-26
1018United Kingdom2026-04-18
1019Argentina2026-04-17
1020Brazil2026-04-01
1021Spain2026-04-01
1022Japan2026-04-09
1023Germany2026-04-07
1024United Kingdom2026-04-03
1025Brazil2026-03-26
1026Germany2026-04-15
1027Argentina2026-04-12
1028Brazil2026-04-03
1029Germany2026-03-28
1030France2026-04-03
1031Argentina2026-03-22
1032Russia2026-04-06
1033Germany2026-04-07
1034Brazil2026-04-07
1035Brazil2026-04-04
1036France2026-03-23
1037United Kingdom2026-03-30
1038India2026-04-03
1039Russia2026-03-22
1040Germany2026-04-03
1041Japan2026-04-04
1042United Kingdom2026-04-01
1043Germany2026-03-30
1044Brazil2026-04-09
1045Australia2026-04-03
1046Australia2026-04-04
1047Spain2026-04-01
1048Canada2026-04-06
1049Brazil2026-04-02

On-Demand Data

NameIdCountryDate
Morrow Ruta1000India2026-04-05
Ashley Doe1001Japan2026-03-30
Greenwood Bolognia1002France2026-03-27
Juan Wieser1003India2026-04-05
Kaitlin Ostrosky1004Canada2026-04-09
Faith Gillian1005France2026-04-05
Ricardo Gaucho1006Germany2026-03-22
Jones Vocelka1007Canada2026-04-07
Ashley Doe1008Japan2026-04-13
Adams Morasca1009Brazil2026-04-12
Maria Marrier1010Brazil2026-04-14
Izzy Garufi1011Brazil2026-04-06
Juan Wieser1012Russia2026-04-18
Mujtaba Nicka1013Spain2026-04-08
Jennifer Amigon1014Brazil2026-04-11
Murillo Malet1015Japan2026-03-21
Faith Gillian1016Australia2026-04-17
Jefferson Schemmer1017Italy2026-03-21
Claire Tollner1018Argentina2026-04-01
Sinclair Waycott1019United Kingdom2026-04-19
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Clifford RimRussiaBernardo Dominic UNQUALIFIED
Salvatore StockhamFranceOnyama Limba PROPOSAL
Salvatore StockhamIndiaXuxue Feng RENEWAL
Mayumi KolmetzSpainXuxue Feng UNQUALIFIED
Munro FerenczSpainBernardo Dominic NEW
Greenwood BologniaCanadaAsiya Javayant RENEWAL
Ashley DoeAustraliaBernardo Dominic NEW
Octavia MaletGermanyXuxue Feng QUALIFIED
Octavia MaletRussiaOnyama Limba RENEWAL
Kadeem FlosiAustraliaAnna Fali UNQUALIFIED
Nicolas IturbideGermanyOnyama Limba PROPOSAL
Jeanfrancois VenereBrazilAmy Elsner RENEWAL
Misaki RoysterSpainXuxue Feng QUALIFIED
Antonio CaudySpainIvan Magalhaes UNQUALIFIED
Costa DilliardAustraliaXuxue Feng RENEWAL
Ashley DoeArgentinaAmy Elsner PROPOSAL
Morrow RutaSpainIoni Bowcher NEGOTIATION
Silvio SlusarskiJapanOnyama Limba RENEWAL
Jeanfrancois VenereArgentinaStephen Shaw UNQUALIFIED
Aruna FigeroaArgentinaIvan Magalhaes RENEWAL
Darci PoquetteIndiaIvan Magalhaes UNQUALIFIED
Antonio CaudyUnited KingdomAnna Fali RENEWAL
Francesco ShinkoArgentinaElwin Sharvill NEW
Clifford RimSpainElwin Sharvill QUALIFIED
Cody SaylorsRussiaAsiya Javayant NEW
Johnson SergiUnited KingdomElwin Sharvill NEW
Salvatore StockhamIndiaOnyama Limba RENEWAL
Leja CaldareraIndiaAnna Fali QUALIFIED
James ButtIndiaXuxue Feng UNQUALIFIED
Darci PoquetteRussiaAnna Fali NEW
Nicolas IturbideBrazilOnyama Limba PROPOSAL
Cody SaylorsArgentinaXuxue Feng QUALIFIED
Clifford RimFranceElwin Sharvill RENEWAL
Deepesh ChuiItalyAsiya Javayant QUALIFIED
Murillo MaletSpainAmy Elsner QUALIFIED
Francesco ShinkoCanadaBernardo Dominic PROPOSAL
Silvio SlusarskiSpainXuxue Feng PROPOSAL
Jennifer AmigonItalyElwin Sharvill NEGOTIATION
Cody SaylorsAustraliaAnna Fali UNQUALIFIED
Wickens NestleUnited 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>