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
Munro FerenczIndiaStephen Shaw NEGOTIATION
Munro FerenczUnited KingdomStephen Shaw PROPOSAL
Kadeem FlosiItalyOnyama Limba PROPOSAL
Deepesh ChuiFranceOnyama Limba RENEWAL
Jefferson SchemmerGermanyIvan Magalhaes RENEWAL
Isabel BowleyCanadaElwin Sharvill NEGOTIATION
Morrow RutaBrazilXuxue Feng NEGOTIATION
Leon OldroydRussiaIoni Bowcher RENEWAL
Aruna FigeroaUnited KingdomAsiya Javayant UNQUALIFIED
Wickens NestleAustraliaAsiya Javayant RENEWAL
Tony FollerArgentinaStephen Shaw RENEWAL
Morrow RutaRussiaBernardo Dominic PROPOSAL
David DarakjyUnited KingdomStephen Shaw NEGOTIATION
Chavez BriddickJapanIoni Bowcher PROPOSAL
Jefferson SchemmerUnited KingdomAnna Fali RENEWAL
Mujtaba NickaArgentinaAnna Fali NEGOTIATION
Wickens NestleCanadaStephen Shaw QUALIFIED
Munro FerenczItalyAmy Elsner PROPOSAL
Claire TollnerSpainAnna Fali PROPOSAL
Jennifer AmigonBrazilStephen Shaw NEGOTIATION
Jones VocelkaRussiaXuxue Feng NEGOTIATION
Julie StensethSpainOnyama Limba UNQUALIFIED
Murillo MaletItalyAnna Fali UNQUALIFIED
Octavia MaletFranceBernardo Dominic UNQUALIFIED
Sinclair WaycottBrazilStephen Shaw NEW
Stacey MacleadArgentinaIvan Magalhaes NEGOTIATION
Ashley DoeArgentinaStephen Shaw UNQUALIFIED
Isabel BowleyFranceElwin Sharvill RENEWAL
Cody SaylorsAustraliaOnyama Limba RENEWAL
Alejandro PerinRussiaStephen Shaw UNQUALIFIED
Tony FollerFranceStephen Shaw RENEWAL
Deepesh ChuiRussiaXuxue Feng PROPOSAL
Misaki RoysterUnited KingdomIoni Bowcher QUALIFIED
Deepesh ChuiItalyElwin Sharvill RENEWAL
Rodrigues CampainRussiaXuxue Feng PROPOSAL
Maisha RulapaughItalyAsiya Javayant RENEWAL
Jennifer AmigonItalyElwin Sharvill PROPOSAL
Murillo MaletIndiaAmy Elsner QUALIFIED
Isabel BowleyIndiaIoni Bowcher PROPOSAL
Salvatore StockhamRussiaIvan Magalhaes NEW
Arvin AlbaresItalyIoni Bowcher QUALIFIED
Arvin AlbaresArgentinaAnna Fali NEGOTIATION
Maisha RulapaughFranceAnna Fali RENEWAL
Tony FollerArgentinaAnna Fali UNQUALIFIED
Clifford RimFranceIvan Magalhaes QUALIFIED
Sinclair WaycottUnited KingdomIoni Bowcher QUALIFIED
David DarakjyIndiaAmy Elsner QUALIFIED
Tony FollerItalyAnna Fali UNQUALIFIED
Antonio CaudyGermanyStephen Shaw NEGOTIATION
Ivar PaprockiAustraliaOnyama Limba NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Munro FerenczAustraliaAsiya Javayant NEW
Aruna FigeroaJapanAsiya Javayant PROPOSAL
Ricardo GauchoJapanXuxue Feng QUALIFIED
Smith GlickBrazilAsiya Javayant NEGOTIATION
Alejandro PerinIndiaStephen Shaw UNQUALIFIED
Arvin AlbaresRussiaOnyama Limba RENEWAL
Ivar PaprockiArgentinaAmy Elsner RENEWAL
Jeanfrancois VenereItalyAsiya Javayant QUALIFIED
Maria MarrierIndiaStephen Shaw NEGOTIATION
Wickens NestleJapanAnna Fali PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Salvatore StockhamBrazil2026-06-15King, Christopher A Esq QUALIFIED77Xuxue Feng
1001Murillo MaletGermany2026-05-24Commercial Press UNQUALIFIED20Xuxue Feng
1002Leja CaldareraBrazil2026-05-24Chanay, Jeffrey A Esq PROPOSAL0Anna Fali
1003Alejandro PerinIndia2026-05-30Feltz Printing Service RENEWAL9Xuxue Feng
1004Murillo MaletBrazil2026-05-28Chapman, Ross E Esq QUALIFIED98Stephen Shaw
1005Antonio CaudyAustralia2026-06-13Feiner Bros UNQUALIFIED51Amy Elsner
1006Misaki RoysterBrazil2026-06-03Truhlar And Truhlar Attys NEW8Elwin Sharvill
1007Aruna FigeroaCanada2026-06-16Feltz Printing Service NEW76Xuxue Feng
1008Cody SaylorsSpain2026-06-20Rangoni Of Florence PROPOSAL90Ivan Magalhaes
1009Tony FollerCanada2026-06-02Buckley Miller Wright PROPOSAL55Elwin Sharvill
1010Ricardo GauchoFrance2026-06-10Rangoni Of Florence PROPOSAL73Xuxue Feng
1011Francesco ShinkoJapan2026-06-15Printing Dimensions NEW31Anna Fali
1012Mujtaba NickaArgentina2026-06-16Chemel, James L Cpa RENEWAL69Anna Fali
1013Aika InouyeBrazil2026-06-03Truhlar And Truhlar Attys RENEWAL75Bernardo Dominic
1014Darci PoquetteSpain2026-06-18Printing Dimensions PROPOSAL2Stephen Shaw
1015Morrow RutaArgentina2026-06-19Feltz Printing Service QUALIFIED60Onyama Limba
1016Salvatore StockhamAustralia2026-06-20Dorl, James J Esq NEGOTIATION87Xuxue Feng
1017Stacey MacleadRussia2026-05-27Morlong Associates QUALIFIED62Bernardo Dominic
1018Aika InouyeIndia2026-06-09Benton, John B Jr UNQUALIFIED38Ivan Magalhaes
1019Nicolas IturbideIndia2026-05-31Commercial Press QUALIFIED20Ioni Bowcher
1020Cody SaylorsGermany2026-06-04Chanay, Jeffrey A Esq UNQUALIFIED1Stephen Shaw
1021Greenwood BologniaBrazil2026-05-31Feltz Printing Service PROPOSAL35Bernardo Dominic
1022Sinclair WaycottAustralia2026-06-09Morlong Associates PROPOSAL4Amy Elsner
1023Aruna FigeroaSpain2026-06-09Feltz Printing Service UNQUALIFIED51Ioni Bowcher
1024Wickens NestleItaly2026-05-23Commercial Press QUALIFIED26Stephen Shaw
1025Sinclair WaycottArgentina2026-06-09Feltz Printing Service NEW90Asiya Javayant
1026Tony FollerFrance2026-06-20Rangoni Of Florence UNQUALIFIED24Bernardo Dominic
1027Ashley DoeFrance2026-05-24Dorl, James J Esq UNQUALIFIED15Anna Fali
1028Maria MarrierFrance2026-06-10Rangoni Of Florence UNQUALIFIED79Ioni Bowcher
1029Mayumi KolmetzAustralia2026-06-16Rousseaux, Michael Esq NEGOTIATION13Bernardo Dominic
1030Octavia MaletFrance2026-05-26King, Christopher A Esq QUALIFIED41Elwin Sharvill
1031Nicolas IturbideSpain2026-06-11King, Christopher A Esq UNQUALIFIED29Amy Elsner
1032Murillo MaletJapan2026-06-04Buckley Miller Wright RENEWAL43Ivan Magalhaes
1033Greenwood BologniaRussia2026-05-30Dorl, James J Esq UNQUALIFIED16Amy Elsner
1034Salvatore StockhamBrazil2026-06-10Chanay, Jeffrey A Esq PROPOSAL63Bernardo Dominic
1035Izzy GarufiSpain2026-06-01Commercial Press UNQUALIFIED29Elwin Sharvill
1036Adams MorascaSpain2026-05-24Benton, John B Jr RENEWAL41Amy Elsner
1037Ivar PaprockiJapan2026-06-02King, Christopher A Esq NEGOTIATION96Bernardo Dominic
1038Munro FerenczCanada2026-05-24Feiner Bros QUALIFIED21Bernardo Dominic
1039Alejandro PerinRussia2026-06-04Morlong Associates QUALIFIED2Bernardo Dominic
1040Clifford RimBrazil2026-06-17Buckley Miller Wright QUALIFIED4Stephen Shaw
1041Faith GillianFrance2026-06-11Commercial Press NEW21Elwin Sharvill
1042Aruna FigeroaFrance2026-06-20Chemel, James L Cpa NEW48Ivan Magalhaes
1043Stacey MacleadArgentina2026-06-14Benton, John B Jr PROPOSAL50Anna Fali
1044Murillo MaletAustralia2026-06-08Morlong Associates NEGOTIATION40Asiya Javayant
1045Mujtaba NickaGermany2026-05-25Benton, John B Jr RENEWAL12Ioni Bowcher
1046Nicolas IturbideIndia2026-06-17Chanay, Jeffrey A Esq NEGOTIATION57Stephen Shaw
1047Murillo MaletAustralia2026-06-16Morlong Associates PROPOSAL99Onyama Limba
1048Leon OldroydGermany2026-05-30Truhlar And Truhlar Attys NEGOTIATION29Asiya Javayant
1049Octavia MaletSpain2026-05-31Buckley Miller Wright PROPOSAL2Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Chavez BriddickGermanyBernardo Dominic PROPOSAL
Leon OldroydUnited KingdomIoni Bowcher UNQUALIFIED
Smith GlickCanadaBernardo Dominic UNQUALIFIED
Julie StensethUnited KingdomBernardo Dominic NEGOTIATION
Misaki RoysterGermanyBernardo Dominic NEW
Tony FollerJapanIvan Magalhaes NEW
Ashley DoeGermanyBernardo Dominic NEGOTIATION
Aika InouyeItalyStephen Shaw QUALIFIED
James ButtArgentinaIvan Magalhaes RENEWAL
Emily WhobreyItalyBernardo Dominic UNQUALIFIED
Murillo MaletSpainAnna Fali NEGOTIATION
Chavez BriddickFranceAnna Fali NEW
David DarakjyArgentinaAsiya Javayant PROPOSAL
Sinclair WaycottIndiaAnna Fali RENEWAL
Julie StensethFranceIoni Bowcher RENEWAL
Claire TollnerArgentinaIvan Magalhaes RENEWAL
Mujtaba NickaGermanyBernardo Dominic NEW
Nicolas IturbideIndiaXuxue Feng UNQUALIFIED
Aika InouyeArgentinaIvan Magalhaes PROPOSAL
Ricardo GauchoArgentinaAmy Elsner UNQUALIFIED
Salvatore StockhamItalyIoni Bowcher UNQUALIFIED
Francesco ShinkoItalyOnyama Limba PROPOSAL
Morrow RutaGermanyElwin Sharvill NEGOTIATION
Maisha RulapaughCanadaBernardo Dominic NEW
Morrow RutaJapanBernardo Dominic QUALIFIED
Munro FerenczItalyElwin Sharvill NEGOTIATION
Claire TollnerItalyStephen Shaw RENEWAL
Johnson SergiSpainOnyama Limba NEW
David DarakjyFranceIvan Magalhaes QUALIFIED
Silvio SlusarskiFranceElwin Sharvill NEW
Izzy GarufiBrazilOnyama Limba QUALIFIED
Antonio CaudyAustraliaAnna Fali RENEWAL
Adams MorascaItalyBernardo Dominic RENEWAL
Jennifer AmigonUnited KingdomStephen Shaw NEGOTIATION
Aditya KuskoItalyAnna Fali UNQUALIFIED
Greenwood BologniaBrazilAnna Fali NEGOTIATION
Leon OldroydFranceOnyama Limba NEGOTIATION
Greenwood BologniaBrazilIvan Magalhaes NEGOTIATION
Francesco ShinkoArgentinaStephen Shaw NEW
Octavia MaletJapanBernardo Dominic QUALIFIED
Faith GillianGermanyIvan Magalhaes QUALIFIED
Antonio CaudyFranceElwin Sharvill NEW
Morrow RutaSpainIvan Magalhaes NEW
Cody SaylorsBrazilXuxue Feng NEGOTIATION
Alejandro PerinJapanBernardo Dominic NEGOTIATION
Morrow RutaArgentinaAsiya Javayant NEW
Wickens NestleCanadaAsiya Javayant UNQUALIFIED
Isabel BowleyBrazilOnyama Limba PROPOSAL
Misaki RoysterItalyOnyama Limba QUALIFIED
Murillo MaletRussiaBernardo Dominic NEGOTIATION
Frozen Columns
Name
Maisha Rulapaugh
Aditya Kusko
Emily Whobrey
Ivar Paprocki
Francesco Shinko
Juan Wieser
Adams Morasca
Isabel Bowley
David Darakjy
Johnson Sergi
Antonio Caudy
Isabel Bowley
Nicolas Iturbide
Rodrigues Campain
Octavia Malet
Kadeem Flosi
Sinclair Waycott
Alejandro Perin
Rodrigues Campain
Isabel Bowley
Clifford Rim
Murillo Malet
Kadeem Flosi
Murillo Malet
Clifford Rim
Clifford Rim
Salvatore Stockham
Munro Ferencz
Jefferson Schemmer
Silvio Slusarski
Jefferson Schemmer
Stacey Maclead
Ricardo Gaucho
Chavez Briddick
Murillo Malet
Darci Poquette
Ivar Paprocki
Murillo Malet
Aruna Figeroa
Wickens Nestle
Aika Inouye
Wickens Nestle
Aditya Kusko
Wickens Nestle
Julie Stenseth
Ashley Doe
Faith Gillian
Chavez Briddick
Greenwood Bolognia
Jeanfrancois Venere
IdCountryDate
1000Italy2026-05-24
1001Argentina2026-06-20
1002Australia2026-05-30
1003Russia2026-05-26
1004United Kingdom2026-06-03
1005India2026-06-08
1006Spain2026-06-11
1007Japan2026-06-21
1008Russia2026-06-01
1009United Kingdom2026-05-29
1010United Kingdom2026-05-30
1011India2026-06-05
1012Australia2026-05-27
1013France2026-06-19
1014United Kingdom2026-05-29
1015United Kingdom2026-06-06
1016Argentina2026-06-01
1017France2026-06-14
1018Germany2026-06-19
1019Australia2026-06-17
1020India2026-06-20
1021Japan2026-06-01
1022Australia2026-05-30
1023France2026-06-15
1024Italy2026-05-25
1025Italy2026-06-04
1026Germany2026-06-04
1027India2026-06-02
1028India2026-06-09
1029Germany2026-05-26
1030United Kingdom2026-06-17
1031Argentina2026-06-14
1032Germany2026-06-16
1033United Kingdom2026-05-23
1034United Kingdom2026-06-09
1035Japan2026-06-02
1036Canada2026-06-19
1037Brazil2026-05-28
1038India2026-05-28
1039United Kingdom2026-06-07
1040Argentina2026-06-19
1041United Kingdom2026-06-10
1042Brazil2026-05-28
1043Italy2026-06-16
1044Italy2026-05-30
1045Spain2026-06-20
1046Canada2026-06-07
1047Canada2026-06-15
1048Brazil2026-06-06
1049Russia2026-06-19

On-Demand Data

NameIdCountryDate
Maria Marrier1000India2026-05-31
Salvatore Stockham1001Australia2026-06-18
Ashley Doe1002India2026-05-28
Arvin Albares1003Japan2026-06-10
Aruna Figeroa1004Russia2026-05-27
Kadeem Flosi1005Brazil2026-06-21
Stacey Maclead1006France2026-06-04
Ricardo Gaucho1007Canada2026-06-16
Alejandro Perin1008Italy2026-06-07
Mujtaba Nicka1009Argentina2026-06-01
Emily Whobrey1010India2026-06-13
Misaki Royster1011France2026-06-09
Emily Whobrey1012India2026-06-15
Jeanfrancois Venere1013Germany2026-05-23
Tony Foller1014Japan2026-06-10
Ivar Paprocki1015Italy2026-06-04
Octavia Malet1016Spain2026-05-29
Jefferson Schemmer1017Argentina2026-06-05
Aruna Figeroa1018Brazil2026-05-26
Murillo Malet1019Italy2026-06-03
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Izzy GarufiCanadaIvan Magalhaes NEGOTIATION
Greenwood BologniaItalyAmy Elsner RENEWAL
Deepesh ChuiSpainStephen Shaw RENEWAL
Francesco ShinkoSpainBernardo Dominic UNQUALIFIED
James ButtBrazilElwin Sharvill QUALIFIED
Murillo MaletSpainXuxue Feng QUALIFIED
Octavia MaletFranceBernardo Dominic RENEWAL
Leon OldroydFranceBernardo Dominic NEGOTIATION
Claire TollnerGermanyAsiya Javayant UNQUALIFIED
Salvatore StockhamAustraliaXuxue Feng UNQUALIFIED
Alejandro PerinItalyIoni Bowcher NEGOTIATION
Emily WhobreyRussiaAmy Elsner QUALIFIED
Emily WhobreySpainAnna Fali PROPOSAL
Juan WieserFranceAnna Fali NEGOTIATION
Greenwood BologniaIndiaAnna Fali QUALIFIED
Ivar PaprockiSpainAsiya Javayant PROPOSAL
Greenwood BologniaIndiaStephen Shaw NEGOTIATION
Julie StensethRussiaIoni Bowcher QUALIFIED
Emily WhobreyJapanAsiya Javayant NEGOTIATION
Misaki RoysterAustraliaAmy Elsner PROPOSAL
Ashley DoeJapanIoni Bowcher QUALIFIED
Ashley DoeJapanElwin Sharvill UNQUALIFIED
Kadeem FlosiBrazilBernardo Dominic PROPOSAL
Tony FollerArgentinaIoni Bowcher NEGOTIATION
Sinclair WaycottRussiaStephen Shaw NEW
Misaki RoysterAustraliaXuxue Feng NEGOTIATION
Greenwood BologniaCanadaAmy Elsner NEGOTIATION
Kadeem FlosiRussiaIvan Magalhaes QUALIFIED
David DarakjyItalyXuxue Feng RENEWAL
Jones VocelkaJapanBernardo Dominic PROPOSAL
Sinclair WaycottArgentinaAsiya Javayant PROPOSAL
Jeanfrancois VenereAustraliaIoni Bowcher UNQUALIFIED
Ivar PaprockiRussiaIoni Bowcher UNQUALIFIED
Smith GlickFranceIoni Bowcher NEW
Morrow RutaArgentinaIoni Bowcher PROPOSAL
Arvin AlbaresRussiaAsiya Javayant RENEWAL
Nicolas IturbideBrazilAsiya Javayant NEGOTIATION
Emily WhobreyRussiaIoni Bowcher NEW
Costa DilliardFranceIvan Magalhaes RENEWAL
Ricardo GauchoIndiaBernardo Dominic RENEWAL

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