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
Isabel BowleyCanadaBernardo Dominic QUALIFIED
Izzy GarufiJapanIvan Magalhaes NEGOTIATION
Faith GillianIndiaIvan Magalhaes PROPOSAL
Munro FerenczSpainIoni Bowcher PROPOSAL
Juan WieserRussiaAnna Fali NEGOTIATION
Jennifer AmigonItalyIoni Bowcher NEW
Cody SaylorsRussiaAsiya Javayant QUALIFIED
Maria MarrierFranceAnna Fali QUALIFIED
Arvin AlbaresIndiaAnna Fali NEW
Kadeem FlosiCanadaAnna Fali PROPOSAL
Octavia MaletUnited KingdomStephen Shaw UNQUALIFIED
Ashley DoeCanadaAnna Fali UNQUALIFIED
Alejandro PerinUnited KingdomXuxue Feng NEGOTIATION
Arvin AlbaresItalyOnyama Limba PROPOSAL
Salvatore StockhamUnited KingdomAnna Fali UNQUALIFIED
Francesco ShinkoCanadaAmy Elsner UNQUALIFIED
Jeanfrancois VenereAustraliaAnna Fali PROPOSAL
Isabel BowleyRussiaStephen Shaw RENEWAL
Salvatore StockhamRussiaAsiya Javayant RENEWAL
Maria MarrierFranceBernardo Dominic UNQUALIFIED
Alejandro PerinFranceAnna Fali NEGOTIATION
Munro FerenczIndiaElwin Sharvill UNQUALIFIED
Mujtaba NickaIndiaXuxue Feng PROPOSAL
Kadeem FlosiBrazilBernardo Dominic NEGOTIATION
Cody SaylorsBrazilStephen Shaw QUALIFIED
Aditya KuskoGermanyAnna Fali UNQUALIFIED
Claire TollnerFranceAnna Fali UNQUALIFIED
Julie StensethBrazilOnyama Limba PROPOSAL
Misaki RoysterArgentinaStephen Shaw QUALIFIED
Claire TollnerRussiaIvan Magalhaes PROPOSAL
Clifford RimArgentinaAsiya Javayant QUALIFIED
Adams MorascaSpainXuxue Feng NEGOTIATION
Stacey MacleadBrazilAsiya Javayant UNQUALIFIED
Claire TollnerSpainOnyama Limba RENEWAL
Mujtaba NickaUnited KingdomAnna Fali QUALIFIED
Octavia MaletSpainBernardo Dominic UNQUALIFIED
Adams MorascaJapanAmy Elsner PROPOSAL
Isabel BowleySpainAnna Fali QUALIFIED
Aruna FigeroaSpainAmy Elsner NEW
Stacey MacleadBrazilStephen Shaw UNQUALIFIED
Emily WhobreyCanadaIvan Magalhaes QUALIFIED
Sinclair WaycottIndiaAsiya Javayant RENEWAL
Mayumi KolmetzCanadaBernardo Dominic NEGOTIATION
Juan WieserJapanIoni Bowcher PROPOSAL
Maria MarrierArgentinaStephen Shaw QUALIFIED
Jones VocelkaArgentinaAsiya Javayant NEW
Kadeem FlosiSpainAsiya Javayant UNQUALIFIED
Jeanfrancois VenereBrazilStephen Shaw NEW
Aika InouyeBrazilIvan Magalhaes RENEWAL
Leja CaldareraAustraliaXuxue Feng UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Sinclair WaycottItalyIoni Bowcher QUALIFIED
Leja CaldareraFranceOnyama Limba QUALIFIED
Mujtaba NickaFranceAsiya Javayant NEW
Alejandro PerinFranceIvan Magalhaes QUALIFIED
Faith GillianFranceElwin Sharvill NEGOTIATION
Jones VocelkaItalyIoni Bowcher QUALIFIED
Jones VocelkaFranceAsiya Javayant RENEWAL
Greenwood BologniaUnited KingdomOnyama Limba NEW
Jones VocelkaGermanyAnna Fali QUALIFIED
Ricardo GauchoGermanyAnna Fali QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Arvin AlbaresRussia2026-05-13Printing Dimensions PROPOSAL38Ioni Bowcher
1001Mayumi KolmetzCanada2026-04-30Feiner Bros QUALIFIED54Xuxue Feng
1002Costa DilliardAustralia2026-05-03King, Christopher A Esq RENEWAL91Ioni Bowcher
1003Misaki RoysterArgentina2026-04-18Truhlar And Truhlar Attys NEW16Bernardo Dominic
1004Antonio CaudyCanada2026-05-07Chemel, James L Cpa QUALIFIED29Onyama Limba
1005Morrow RutaAustralia2026-04-17Feltz Printing Service NEW65Xuxue Feng
1006Aruna FigeroaCanada2026-05-06Feiner Bros NEGOTIATION69Onyama Limba
1007Munro FerenczGermany2026-04-20Rangoni Of Florence NEGOTIATION31Xuxue Feng
1008Ashley DoeFrance2026-04-19Commercial Press NEGOTIATION73Ioni Bowcher
1009Nicolas IturbideUnited Kingdom2026-04-21Chanay, Jeffrey A Esq NEW8Bernardo Dominic
1010Jefferson SchemmerGermany2026-04-18Feltz Printing Service NEGOTIATION86Elwin Sharvill
1011Julie StensethSpain2026-04-23Dorl, James J Esq UNQUALIFIED14Stephen Shaw
1012Kadeem FlosiArgentina2026-04-18Rousseaux, Michael Esq NEGOTIATION92Ivan Magalhaes
1013Emily WhobreyJapan2026-05-08Feiner Bros PROPOSAL56Asiya Javayant
1014Sinclair WaycottCanada2026-04-26Printing Dimensions UNQUALIFIED44Onyama Limba
1015Sinclair WaycottRussia2026-04-22King, Christopher A Esq RENEWAL21Bernardo Dominic
1016Kadeem FlosiBrazil2026-05-01Chanay, Jeffrey A Esq UNQUALIFIED2Amy Elsner
1017Jennifer AmigonArgentina2026-04-15Chemel, James L Cpa QUALIFIED37Bernardo Dominic
1018Sinclair WaycottAustralia2026-04-15Commercial Press NEW70Onyama Limba
1019Darci PoquetteRussia2026-04-17Feltz Printing Service UNQUALIFIED93Elwin Sharvill
1020Greenwood BologniaBrazil2026-05-12Feltz Printing Service PROPOSAL2Amy Elsner
1021Deepesh ChuiItaly2026-04-29Rousseaux, Michael Esq NEW23Xuxue Feng
1022Ricardo GauchoBrazil2026-05-09Morlong Associates QUALIFIED36Ioni Bowcher
1023Kaitlin OstroskyJapan2026-05-10Feltz Printing Service RENEWAL53Stephen Shaw
1024Silvio SlusarskiSpain2026-04-18Dorl, James J Esq RENEWAL17Bernardo Dominic
1025Silvio SlusarskiArgentina2026-04-17Morlong Associates UNQUALIFIED49Ivan Magalhaes
1026Silvio SlusarskiAustralia2026-04-25Rangoni Of Florence NEW79Ivan Magalhaes
1027Greenwood BologniaAustralia2026-04-30King, Christopher A Esq RENEWAL5Anna Fali
1028Kaitlin OstroskyItaly2026-05-02Dorl, James J Esq RENEWAL46Ioni Bowcher
1029Deepesh ChuiItaly2026-05-01Dorl, James J Esq PROPOSAL25Asiya Javayant
1030Jennifer AmigonCanada2026-05-12Chanay, Jeffrey A Esq RENEWAL75Asiya Javayant
1031Murillo MaletArgentina2026-05-08Feltz Printing Service PROPOSAL24Stephen Shaw
1032Johnson SergiBrazil2026-05-02Feltz Printing Service NEGOTIATION73Anna Fali
1033Kaitlin OstroskyItaly2026-05-02Morlong Associates RENEWAL11Bernardo Dominic
1034Faith GillianAustralia2026-04-14King, Christopher A Esq QUALIFIED72Asiya Javayant
1035Aika InouyeItaly2026-05-11Morlong Associates UNQUALIFIED75Onyama Limba
1036Ashley DoeGermany2026-05-12Rangoni Of Florence NEGOTIATION4Elwin Sharvill
1037Wickens NestleJapan2026-04-16Commercial Press RENEWAL13Xuxue Feng
1038Antonio CaudyCanada2026-04-28Feltz Printing Service RENEWAL11Stephen Shaw
1039Claire TollnerArgentina2026-04-25Printing Dimensions RENEWAL30Onyama Limba
1040Salvatore StockhamArgentina2026-05-08Feiner Bros NEW74Ivan Magalhaes
1041Chavez BriddickIndia2026-05-08Dorl, James J Esq NEGOTIATION8Onyama Limba
1042Claire TollnerBrazil2026-05-08Chemel, James L Cpa PROPOSAL70Amy Elsner
1043Emily WhobreyRussia2026-05-08Truhlar And Truhlar Attys QUALIFIED24Elwin Sharvill
1044Leon OldroydRussia2026-04-28Feiner Bros UNQUALIFIED17Onyama Limba
1045Izzy GarufiItaly2026-04-21King, Christopher A Esq PROPOSAL87Onyama Limba
1046Leja CaldareraUnited Kingdom2026-04-24Commercial Press RENEWAL42Xuxue Feng
1047Kaitlin OstroskyAustralia2026-05-03Chanay, Jeffrey A Esq PROPOSAL28Anna Fali
1048Jennifer AmigonFrance2026-04-27Chemel, James L Cpa PROPOSAL22Ivan Magalhaes
1049Darci PoquetteItaly2026-05-12Benton, John B Jr NEGOTIATION32Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Jeanfrancois VenereArgentinaStephen Shaw PROPOSAL
Isabel BowleyBrazilAsiya Javayant QUALIFIED
Stacey MacleadCanadaOnyama Limba NEGOTIATION
Tony FollerAustraliaAmy Elsner PROPOSAL
Faith GillianAustraliaOnyama Limba NEW
Maria MarrierFranceAmy Elsner UNQUALIFIED
David DarakjyUnited KingdomAnna Fali RENEWAL
Arvin AlbaresCanadaAsiya Javayant PROPOSAL
Leon OldroydBrazilXuxue Feng NEGOTIATION
Sinclair WaycottBrazilIoni Bowcher PROPOSAL
Darci PoquetteJapanAnna Fali NEW
Munro FerenczSpainOnyama Limba NEGOTIATION
Greenwood BologniaUnited KingdomStephen Shaw RENEWAL
Cody SaylorsRussiaXuxue Feng PROPOSAL
Jefferson SchemmerItalyElwin Sharvill RENEWAL
Faith GillianSpainBernardo Dominic RENEWAL
David DarakjyArgentinaIvan Magalhaes RENEWAL
Leja CaldareraAustraliaAsiya Javayant RENEWAL
Izzy GarufiItalyAsiya Javayant NEW
Leon OldroydCanadaStephen Shaw UNQUALIFIED
Munro FerenczBrazilBernardo Dominic PROPOSAL
Ricardo GauchoBrazilAmy Elsner PROPOSAL
Ricardo GauchoCanadaXuxue Feng NEW
Misaki RoysterRussiaAmy Elsner UNQUALIFIED
Adams MorascaArgentinaStephen Shaw NEGOTIATION
Izzy GarufiUnited KingdomBernardo Dominic RENEWAL
Munro FerenczArgentinaXuxue Feng NEGOTIATION
Costa DilliardArgentinaStephen Shaw PROPOSAL
Leja CaldareraArgentinaIvan Magalhaes QUALIFIED
Nicolas IturbideIndiaAnna Fali NEGOTIATION
Smith GlickFranceOnyama Limba NEW
Faith GillianCanadaAsiya Javayant RENEWAL
Smith GlickItalyStephen Shaw PROPOSAL
Juan WieserUnited KingdomOnyama Limba RENEWAL
Aika InouyeItalyBernardo Dominic NEW
Murillo MaletRussiaOnyama Limba PROPOSAL
Jones VocelkaAustraliaBernardo Dominic RENEWAL
Deepesh ChuiJapanStephen Shaw RENEWAL
Stacey MacleadGermanyElwin Sharvill NEW
Claire TollnerArgentinaXuxue Feng NEW
Alejandro PerinFranceOnyama Limba UNQUALIFIED
Ricardo GauchoRussiaIoni Bowcher NEGOTIATION
Darci PoquetteRussiaBernardo Dominic NEGOTIATION
Claire TollnerAustraliaXuxue Feng QUALIFIED
Deepesh ChuiRussiaAsiya Javayant PROPOSAL
Faith GillianBrazilAsiya Javayant NEGOTIATION
Leon OldroydItalyOnyama Limba UNQUALIFIED
Jeanfrancois VenereUnited KingdomAnna Fali UNQUALIFIED
Kaitlin OstroskyArgentinaAmy Elsner NEW
Izzy GarufiArgentinaXuxue Feng UNQUALIFIED
Frozen Columns
Name
Salvatore Stockham
Munro Ferencz
Mujtaba Nicka
Jones Vocelka
Isabel Bowley
Ricardo Gaucho
Antonio Caudy
Octavia Malet
Aruna Figeroa
Tony Foller
James Butt
Aruna Figeroa
Darci Poquette
Silvio Slusarski
Johnson Sergi
Ricardo Gaucho
Stacey Maclead
Tony Foller
Cody Saylors
Greenwood Bolognia
Aruna Figeroa
Adams Morasca
Arvin Albares
Izzy Garufi
Jennifer Amigon
Rodrigues Campain
Antonio Caudy
Wickens Nestle
Greenwood Bolognia
Ivar Paprocki
Tony Foller
James Butt
Mayumi Kolmetz
Faith Gillian
Darci Poquette
Julie Stenseth
Tony Foller
Julie Stenseth
Antonio Caudy
Kadeem Flosi
Jennifer Amigon
Adams Morasca
Wickens Nestle
Rodrigues Campain
Juan Wieser
Aika Inouye
Maria Marrier
Isabel Bowley
Alejandro Perin
Faith Gillian
IdCountryDate
1000Brazil2026-05-04
1001Spain2026-05-05
1002India2026-05-02
1003Spain2026-04-24
1004Argentina2026-04-27
1005Argentina2026-04-15
1006India2026-05-04
1007India2026-04-16
1008Germany2026-04-23
1009Germany2026-05-04
1010Brazil2026-04-19
1011Japan2026-04-21
1012Spain2026-04-20
1013France2026-05-10
1014Spain2026-04-19
1015Spain2026-04-16
1016Italy2026-04-19
1017India2026-04-16
1018Australia2026-05-12
1019Canada2026-05-05
1020Canada2026-05-11
1021United Kingdom2026-05-01
1022Japan2026-04-24
1023Spain2026-05-05
1024India2026-05-06
1025India2026-04-29
1026Japan2026-04-25
1027Italy2026-05-07
1028Spain2026-04-30
1029Spain2026-04-27
1030Spain2026-04-23
1031Italy2026-04-14
1032Australia2026-04-26
1033India2026-04-22
1034Canada2026-05-05
1035Russia2026-04-30
1036India2026-05-11
1037United Kingdom2026-05-05
1038Italy2026-04-30
1039Italy2026-05-02
1040United Kingdom2026-04-21
1041United Kingdom2026-04-19
1042Russia2026-05-01
1043Brazil2026-04-17
1044Russia2026-04-26
1045Italy2026-04-22
1046Germany2026-04-28
1047Brazil2026-04-25
1048Japan2026-05-06
1049United Kingdom2026-04-26

On-Demand Data

NameIdCountryDate
Darci Poquette1000Australia2026-05-08
Johnson Sergi1001Australia2026-04-15
Mayumi Kolmetz1002Spain2026-05-03
Nicolas Iturbide1003Japan2026-05-06
Alejandro Perin1004Canada2026-05-06
Deepesh Chui1005Spain2026-04-28
Wickens Nestle1006Russia2026-04-24
Ashley Doe1007Russia2026-04-29
Munro Ferencz1008Japan2026-04-27
Munro Ferencz1009India2026-04-26
Octavia Malet1010Japan2026-04-24
Morrow Ruta1011Spain2026-05-03
Rodrigues Campain1012India2026-04-19
Faith Gillian1013Russia2026-04-22
Maisha Rulapaugh1014Italy2026-04-17
Mujtaba Nicka1015Japan2026-05-13
Jeanfrancois Venere1016Russia2026-04-28
Rodrigues Campain1017India2026-04-26
Mujtaba Nicka1018United Kingdom2026-04-27
Ashley Doe1019Japan2026-04-26
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Morrow RutaArgentinaAsiya Javayant RENEWAL
Misaki RoysterFranceAmy Elsner RENEWAL
James ButtUnited KingdomAmy Elsner NEGOTIATION
Jefferson SchemmerUnited KingdomIoni Bowcher PROPOSAL
Ashley DoeItalyXuxue Feng PROPOSAL
Smith GlickUnited KingdomIvan Magalhaes RENEWAL
Jeanfrancois VenereBrazilBernardo Dominic UNQUALIFIED
Julie StensethJapanAmy Elsner RENEWAL
Isabel BowleyArgentinaElwin Sharvill QUALIFIED
Maisha RulapaughAustraliaBernardo Dominic RENEWAL
Tony FollerBrazilIvan Magalhaes UNQUALIFIED
Francesco ShinkoJapanAsiya Javayant RENEWAL
Deepesh ChuiArgentinaAmy Elsner RENEWAL
Murillo MaletItalyAsiya Javayant QUALIFIED
David DarakjyRussiaIoni Bowcher NEW
Sinclair WaycottBrazilAsiya Javayant UNQUALIFIED
Aika InouyeUnited KingdomIvan Magalhaes UNQUALIFIED
Faith GillianJapanXuxue Feng UNQUALIFIED
Julie StensethArgentinaElwin Sharvill PROPOSAL
Kaitlin OstroskyCanadaXuxue Feng NEW
Alejandro PerinBrazilAnna Fali UNQUALIFIED
Maria MarrierCanadaAmy Elsner NEGOTIATION
James ButtCanadaBernardo Dominic NEGOTIATION
Aditya KuskoRussiaOnyama Limba NEGOTIATION
Murillo MaletIndiaAsiya Javayant QUALIFIED
David DarakjyFranceAmy Elsner UNQUALIFIED
Maisha RulapaughRussiaAmy Elsner PROPOSAL
Izzy GarufiItalyOnyama Limba QUALIFIED
Faith GillianFranceBernardo Dominic NEW
Octavia MaletIndiaXuxue Feng RENEWAL
Maisha RulapaughIndiaAnna Fali RENEWAL
Alejandro PerinFranceOnyama Limba NEW
Maisha RulapaughAustraliaAmy Elsner PROPOSAL
Kaitlin OstroskyArgentinaIoni Bowcher UNQUALIFIED
Alejandro PerinAustraliaBernardo Dominic PROPOSAL
Isabel BowleyGermanyElwin Sharvill PROPOSAL
Murillo MaletArgentinaAmy Elsner NEGOTIATION
Jeanfrancois VenereAustraliaAmy Elsner RENEWAL
Stacey MacleadCanadaAmy Elsner PROPOSAL
Leon OldroydIndiaAsiya Javayant 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>