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
Izzy GarufiJapanXuxue Feng RENEWAL
Jefferson SchemmerArgentinaElwin Sharvill NEW
Rodrigues CampainBrazilAnna Fali PROPOSAL
Stacey MacleadArgentinaBernardo Dominic QUALIFIED
Aruna FigeroaIndiaAmy Elsner RENEWAL
Jefferson SchemmerArgentinaAsiya Javayant RENEWAL
Alejandro PerinArgentinaBernardo Dominic RENEWAL
Jefferson SchemmerGermanyIvan Magalhaes NEGOTIATION
Leja CaldareraAustraliaOnyama Limba QUALIFIED
Francesco ShinkoAustraliaOnyama Limba NEW
Ashley DoeFranceBernardo Dominic RENEWAL
Jefferson SchemmerCanadaOnyama Limba PROPOSAL
Costa DilliardGermanyBernardo Dominic PROPOSAL
Murillo MaletGermanyAnna Fali QUALIFIED
Ricardo GauchoCanadaIoni Bowcher PROPOSAL
Faith GillianRussiaXuxue Feng QUALIFIED
Leon OldroydCanadaAsiya Javayant QUALIFIED
Murillo MaletAustraliaXuxue Feng PROPOSAL
Cody SaylorsGermanyXuxue Feng PROPOSAL
Morrow RutaIndiaXuxue Feng NEW
Cody SaylorsUnited KingdomOnyama Limba NEW
Greenwood BologniaGermanyXuxue Feng PROPOSAL
Munro FerenczFranceAnna Fali QUALIFIED
Ashley DoeBrazilBernardo Dominic PROPOSAL
Jones VocelkaIndiaElwin Sharvill UNQUALIFIED
Adams MorascaJapanXuxue Feng PROPOSAL
Smith GlickRussiaStephen Shaw UNQUALIFIED
Aika InouyeItalyIvan Magalhaes NEW
Julie StensethCanadaIvan Magalhaes NEW
Stacey MacleadFranceStephen Shaw PROPOSAL
Darci PoquetteIndiaIoni Bowcher RENEWAL
Wickens NestleRussiaAnna Fali NEW
Misaki RoysterCanadaAsiya Javayant UNQUALIFIED
Maisha RulapaughUnited KingdomBernardo Dominic UNQUALIFIED
Sinclair WaycottBrazilIoni Bowcher UNQUALIFIED
Aruna FigeroaGermanyAsiya Javayant NEW
Maria MarrierRussiaStephen Shaw UNQUALIFIED
Mayumi KolmetzAustraliaAsiya Javayant NEW
Ivar PaprockiJapanXuxue Feng QUALIFIED
Kaitlin OstroskyJapanBernardo Dominic NEW
Isabel BowleySpainElwin Sharvill RENEWAL
Rodrigues CampainRussiaOnyama Limba PROPOSAL
Kaitlin OstroskyIndiaStephen Shaw NEGOTIATION
Antonio CaudyBrazilAnna Fali PROPOSAL
Munro FerenczUnited KingdomXuxue Feng NEW
Johnson SergiSpainAnna Fali QUALIFIED
Salvatore StockhamArgentinaBernardo Dominic NEGOTIATION
Chavez BriddickRussiaIvan Magalhaes NEGOTIATION
David DarakjyRussiaIvan Magalhaes RENEWAL
Isabel BowleyFranceStephen Shaw NEW
Horizontal
NameCountryRepresentativeStatus
Leja CaldareraUnited KingdomXuxue Feng UNQUALIFIED
Leja CaldareraCanadaElwin Sharvill QUALIFIED
Leon OldroydFranceIoni Bowcher RENEWAL
Wickens NestleBrazilAsiya Javayant RENEWAL
Stacey MacleadUnited KingdomIoni Bowcher NEGOTIATION
Aika InouyeCanadaIoni Bowcher QUALIFIED
Smith GlickBrazilStephen Shaw UNQUALIFIED
Salvatore StockhamRussiaElwin Sharvill QUALIFIED
Ashley DoeBrazilElwin Sharvill RENEWAL
Leon OldroydJapanOnyama Limba NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Juan WieserJapan2026-05-29Morlong Associates NEGOTIATION29Elwin Sharvill
1001Morrow RutaItaly2026-05-24Dorl, James J Esq PROPOSAL62Elwin Sharvill
1002Aditya KuskoSpain2026-05-14Chapman, Ross E Esq NEGOTIATION21Bernardo Dominic
1003Smith GlickGermany2026-05-28Feltz Printing Service NEW87Ioni Bowcher
1004Aditya KuskoRussia2026-05-16Commercial Press QUALIFIED61Elwin Sharvill
1005Johnson SergiItaly2026-05-31Chapman, Ross E Esq PROPOSAL93Anna Fali
1006Julie StensethCanada2026-05-29Dorl, James J Esq NEW88Stephen Shaw
1007Kaitlin OstroskySpain2026-06-01Chemel, James L Cpa RENEWAL50Stephen Shaw
1008Kadeem FlosiRussia2026-05-19Feiner Bros NEW80Elwin Sharvill
1009Sinclair WaycottGermany2026-05-27Morlong Associates NEW75Ivan Magalhaes
1010Leja CaldareraCanada2026-05-13Rousseaux, Michael Esq NEW79Onyama Limba
1011Adams MorascaFrance2026-05-22Feltz Printing Service RENEWAL90Bernardo Dominic
1012Francesco ShinkoRussia2026-05-17Chapman, Ross E Esq PROPOSAL73Asiya Javayant
1013Cody SaylorsGermany2026-05-23Truhlar And Truhlar Attys PROPOSAL49Amy Elsner
1014Leon OldroydCanada2026-05-27Chapman, Ross E Esq NEGOTIATION4Bernardo Dominic
1015Jefferson SchemmerFrance2026-05-29Chemel, James L Cpa UNQUALIFIED52Onyama Limba
1016Costa DilliardArgentina2026-05-13Commercial Press PROPOSAL47Onyama Limba
1017Maisha RulapaughItaly2026-05-17Rangoni Of Florence UNQUALIFIED36Stephen Shaw
1018David DarakjyJapan2026-06-10King, Christopher A Esq NEW71Amy Elsner
1019Darci PoquetteJapan2026-06-01Commercial Press PROPOSAL47Onyama Limba
1020Izzy GarufiSpain2026-06-09Commercial Press NEW60Onyama Limba
1021Leon OldroydUnited Kingdom2026-05-27Commercial Press QUALIFIED91Xuxue Feng
1022Jones VocelkaItaly2026-05-22Rousseaux, Michael Esq RENEWAL75Amy Elsner
1023Octavia MaletBrazil2026-06-06Chapman, Ross E Esq NEGOTIATION35Onyama Limba
1024Emily WhobreyItaly2026-06-06Truhlar And Truhlar Attys NEGOTIATION52Ivan Magalhaes
1025Leja CaldareraBrazil2026-05-14Commercial Press QUALIFIED78Onyama Limba
1026Antonio CaudyArgentina2026-05-25Rousseaux, Michael Esq UNQUALIFIED56Amy Elsner
1027David DarakjyUnited Kingdom2026-05-25Benton, John B Jr PROPOSAL8Stephen Shaw
1028Murillo MaletIndia2026-05-12Dorl, James J Esq RENEWAL55Elwin Sharvill
1029Jefferson SchemmerItaly2026-05-13Feltz Printing Service NEGOTIATION48Xuxue Feng
1030Faith GillianGermany2026-05-30Dorl, James J Esq RENEWAL57Stephen Shaw
1031Juan WieserJapan2026-05-26Feiner Bros NEGOTIATION21Ivan Magalhaes
1032Tony FollerBrazil2026-05-24Feltz Printing Service NEGOTIATION53Ioni Bowcher
1033Clifford RimAustralia2026-05-16Feiner Bros NEGOTIATION83Anna Fali
1034Munro FerenczBrazil2026-05-26Benton, John B Jr QUALIFIED47Ivan Magalhaes
1035Nicolas IturbideItaly2026-05-25Chanay, Jeffrey A Esq NEGOTIATION35Elwin Sharvill
1036Claire TollnerSpain2026-05-31Rangoni Of Florence NEW70Bernardo Dominic
1037Claire TollnerIndia2026-06-02Benton, John B Jr NEW20Onyama Limba
1038Isabel BowleyIndia2026-06-09Benton, John B Jr NEW86Amy Elsner
1039Murillo MaletArgentina2026-05-24Rousseaux, Michael Esq NEW83Anna Fali
1040Octavia MaletCanada2026-06-01Rousseaux, Michael Esq QUALIFIED66Anna Fali
1041Salvatore StockhamAustralia2026-06-10Chanay, Jeffrey A Esq RENEWAL99Ioni Bowcher
1042Greenwood BologniaBrazil2026-06-09Chemel, James L Cpa PROPOSAL3Amy Elsner
1043Nicolas IturbideRussia2026-06-05Buckley Miller Wright NEW81Amy Elsner
1044Izzy GarufiBrazil2026-06-08Feltz Printing Service UNQUALIFIED35Stephen Shaw
1045Wickens NestleRussia2026-05-23Benton, John B Jr UNQUALIFIED2Stephen Shaw
1046Leon OldroydFrance2026-05-18Chemel, James L Cpa QUALIFIED28Bernardo Dominic
1047Kaitlin OstroskyJapan2026-06-06Chanay, Jeffrey A Esq NEGOTIATION98Asiya Javayant
1048Clifford RimJapan2026-05-26King, Christopher A Esq UNQUALIFIED90Elwin Sharvill
1049Julie StensethSpain2026-06-10Chapman, Ross E Esq UNQUALIFIED37Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Sinclair WaycottSpainAsiya Javayant RENEWAL
Jeanfrancois VenereItalyStephen Shaw PROPOSAL
Darci PoquetteRussiaBernardo Dominic QUALIFIED
Sinclair WaycottCanadaAmy Elsner RENEWAL
Ashley DoeFranceOnyama Limba QUALIFIED
Emily WhobreyUnited KingdomAnna Fali RENEWAL
Aika InouyeSpainStephen Shaw PROPOSAL
Costa DilliardIndiaIoni Bowcher PROPOSAL
Mujtaba NickaArgentinaStephen Shaw RENEWAL
Antonio CaudyAustraliaOnyama Limba NEW
Jones VocelkaAustraliaAnna Fali UNQUALIFIED
Darci PoquetteItalyAsiya Javayant UNQUALIFIED
Mujtaba NickaSpainAmy Elsner NEW
Izzy GarufiGermanyElwin Sharvill UNQUALIFIED
Nicolas IturbideFranceAnna Fali UNQUALIFIED
Maria MarrierJapanIvan Magalhaes RENEWAL
Faith GillianRussiaAsiya Javayant NEGOTIATION
Sinclair WaycottIndiaOnyama Limba NEGOTIATION
Francesco ShinkoSpainElwin Sharvill PROPOSAL
Darci PoquetteUnited KingdomAnna Fali RENEWAL
Darci PoquetteFranceAmy Elsner RENEWAL
Ricardo GauchoArgentinaAmy Elsner PROPOSAL
Alejandro PerinGermanyStephen Shaw UNQUALIFIED
Jeanfrancois VenereFranceIoni Bowcher NEW
Octavia MaletFranceXuxue Feng NEW
Wickens NestleBrazilIvan Magalhaes RENEWAL
Ashley DoeGermanyElwin Sharvill QUALIFIED
Ivar PaprockiSpainAnna Fali RENEWAL
Costa DilliardArgentinaAsiya Javayant UNQUALIFIED
Octavia MaletAustraliaStephen Shaw NEGOTIATION
Darci PoquetteArgentinaIvan Magalhaes NEGOTIATION
Smith GlickItalyAsiya Javayant QUALIFIED
Octavia MaletGermanyXuxue Feng PROPOSAL
Smith GlickAustraliaIoni Bowcher NEW
Nicolas IturbideJapanIvan Magalhaes RENEWAL
Claire TollnerGermanyAnna Fali PROPOSAL
Rodrigues CampainAustraliaAsiya Javayant PROPOSAL
Izzy GarufiBrazilElwin Sharvill NEGOTIATION
Greenwood BologniaRussiaOnyama Limba QUALIFIED
Aditya KuskoFranceAmy Elsner QUALIFIED
Smith GlickAustraliaAmy Elsner RENEWAL
Ashley DoeGermanyIvan Magalhaes RENEWAL
Silvio SlusarskiFranceBernardo Dominic NEGOTIATION
Jeanfrancois VenereIndiaXuxue Feng RENEWAL
Emily WhobreyRussiaAmy Elsner QUALIFIED
Deepesh ChuiArgentinaAsiya Javayant PROPOSAL
Deepesh ChuiAustraliaIvan Magalhaes QUALIFIED
Maria MarrierSpainIvan Magalhaes RENEWAL
Leja CaldareraSpainXuxue Feng QUALIFIED
Maisha RulapaughIndiaBernardo Dominic NEGOTIATION
Frozen Columns
Name
Nicolas Iturbide
Salvatore Stockham
Antonio Caudy
Emily Whobrey
Emily Whobrey
Stacey Maclead
Jennifer Amigon
Salvatore Stockham
Aruna Figeroa
Jones Vocelka
Arvin Albares
Rodrigues Campain
Francesco Shinko
Misaki Royster
Cody Saylors
Juan Wieser
Jones Vocelka
Silvio Slusarski
Ashley Doe
Kadeem Flosi
Francesco Shinko
Maisha Rulapaugh
James Butt
Tony Foller
Juan Wieser
Ashley Doe
Emily Whobrey
Isabel Bowley
Ricardo Gaucho
Izzy Garufi
Leja Caldarera
Aditya Kusko
Chavez Briddick
Nicolas Iturbide
Jefferson Schemmer
Faith Gillian
Misaki Royster
Tony Foller
Wickens Nestle
Jones Vocelka
Alejandro Perin
Smith Glick
Cody Saylors
Claire Tollner
Aruna Figeroa
Mayumi Kolmetz
Izzy Garufi
Ivar Paprocki
Maria Marrier
Jeanfrancois Venere
IdCountryDate
1000Brazil2026-05-14
1001United Kingdom2026-06-04
1002India2026-05-15
1003Japan2026-05-23
1004Germany2026-06-01
1005Spain2026-05-30
1006Australia2026-06-04
1007Italy2026-06-05
1008France2026-05-21
1009Japan2026-05-31
1010Germany2026-05-12
1011Japan2026-05-20
1012Italy2026-05-31
1013France2026-05-25
1014Argentina2026-06-07
1015Russia2026-05-26
1016India2026-05-28
1017Australia2026-05-27
1018Brazil2026-05-15
1019Italy2026-05-17
1020Australia2026-06-05
1021Spain2026-05-31
1022Spain2026-05-18
1023Italy2026-05-28
1024United Kingdom2026-06-07
1025Japan2026-05-14
1026United Kingdom2026-05-28
1027Australia2026-05-28
1028United Kingdom2026-05-13
1029Australia2026-05-17
1030Japan2026-05-15
1031Spain2026-06-01
1032France2026-05-23
1033India2026-05-13
1034India2026-05-18
1035France2026-06-06
1036Russia2026-05-16
1037France2026-05-30
1038India2026-06-04
1039Brazil2026-05-15
1040France2026-05-15
1041India2026-06-02
1042Russia2026-06-09
1043France2026-05-21
1044Canada2026-05-27
1045Canada2026-06-03
1046United Kingdom2026-05-22
1047United Kingdom2026-05-18
1048Australia2026-05-28
1049France2026-06-10

On-Demand Data

NameIdCountryDate
Isabel Bowley1000Canada2026-05-12
Johnson Sergi1001Argentina2026-06-10
Octavia Malet1002Italy2026-05-14
Kaitlin Ostrosky1003India2026-06-09
Cody Saylors1004Australia2026-05-22
Clifford Rim1005Brazil2026-05-19
Munro Ferencz1006Italy2026-05-24
Murillo Malet1007United Kingdom2026-05-27
Johnson Sergi1008India2026-06-04
Silvio Slusarski1009Italy2026-05-31
Costa Dilliard1010Russia2026-05-14
Leja Caldarera1011Russia2026-05-29
Ashley Doe1012France2026-05-21
Smith Glick1013Argentina2026-05-12
Maria Marrier1014Italy2026-06-07
Jennifer Amigon1015Italy2026-05-28
Kaitlin Ostrosky1016Argentina2026-05-21
Mujtaba Nicka1017Russia2026-06-07
Octavia Malet1018United Kingdom2026-05-21
Claire Tollner1019Italy2026-05-23
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Maria MarrierArgentinaAsiya Javayant NEW
Rodrigues CampainItalyOnyama Limba PROPOSAL
Aika InouyeItalyIoni Bowcher NEGOTIATION
Costa DilliardUnited KingdomAmy Elsner PROPOSAL
Ashley DoeSpainBernardo Dominic NEGOTIATION
David DarakjyAustraliaElwin Sharvill NEW
Rodrigues CampainArgentinaIvan Magalhaes PROPOSAL
Silvio SlusarskiBrazilAsiya Javayant NEW
Aruna FigeroaFranceIvan Magalhaes NEW
Julie StensethBrazilIoni Bowcher RENEWAL
Ricardo GauchoSpainBernardo Dominic UNQUALIFIED
Greenwood BologniaIndiaAnna Fali QUALIFIED
Greenwood BologniaBrazilStephen Shaw PROPOSAL
Jefferson SchemmerBrazilAnna Fali UNQUALIFIED
Johnson SergiUnited KingdomAsiya Javayant PROPOSAL
Octavia MaletUnited KingdomXuxue Feng PROPOSAL
Johnson SergiSpainAmy Elsner QUALIFIED
Kaitlin OstroskyRussiaIvan Magalhaes QUALIFIED
Tony FollerArgentinaIoni Bowcher NEGOTIATION
Leon OldroydFranceIoni Bowcher QUALIFIED
Nicolas IturbideItalyAsiya Javayant RENEWAL
Silvio SlusarskiUnited KingdomIoni Bowcher UNQUALIFIED
Jennifer AmigonArgentinaElwin Sharvill UNQUALIFIED
Silvio SlusarskiFranceIvan Magalhaes NEW
Jones VocelkaBrazilXuxue Feng UNQUALIFIED
Deepesh ChuiRussiaBernardo Dominic PROPOSAL
Ivar PaprockiArgentinaOnyama Limba UNQUALIFIED
Isabel BowleyCanadaAsiya Javayant NEW
Munro FerenczUnited KingdomXuxue Feng RENEWAL
Misaki RoysterBrazilAmy Elsner NEGOTIATION
Octavia MaletJapanElwin Sharvill PROPOSAL
Cody SaylorsArgentinaOnyama Limba NEW
Sinclair WaycottSpainOnyama Limba QUALIFIED
Octavia MaletArgentinaElwin Sharvill NEGOTIATION
Sinclair WaycottItalyIoni Bowcher PROPOSAL
Mujtaba NickaBrazilAmy Elsner RENEWAL
Kaitlin OstroskyArgentinaStephen Shaw NEGOTIATION
Morrow RutaCanadaStephen Shaw UNQUALIFIED
Kadeem FlosiIndiaAsiya Javayant RENEWAL
Leon OldroydAustraliaAnna Fali QUALIFIED

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