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
Jennifer AmigonAustraliaOnyama Limba RENEWAL
Leja CaldareraCanadaIvan Magalhaes NEW
Juan WieserIndiaAsiya Javayant NEGOTIATION
Jones VocelkaRussiaElwin Sharvill RENEWAL
Aika InouyeBrazilIoni Bowcher UNQUALIFIED
Aika InouyeArgentinaAmy Elsner NEGOTIATION
Kadeem FlosiRussiaIvan Magalhaes NEW
Nicolas IturbideItalyElwin Sharvill RENEWAL
Silvio SlusarskiAustraliaAmy Elsner UNQUALIFIED
Aruna FigeroaJapanIoni Bowcher UNQUALIFIED
Arvin AlbaresIndiaIoni Bowcher UNQUALIFIED
Murillo MaletUnited KingdomBernardo Dominic PROPOSAL
Ricardo GauchoIndiaAnna Fali RENEWAL
Darci PoquetteItalyAnna Fali UNQUALIFIED
Johnson SergiCanadaXuxue Feng NEW
Kaitlin OstroskyJapanIoni Bowcher PROPOSAL
Aditya KuskoItalyStephen Shaw PROPOSAL
Salvatore StockhamIndiaXuxue Feng PROPOSAL
Jefferson SchemmerSpainAmy Elsner PROPOSAL
David DarakjyItalyIvan Magalhaes UNQUALIFIED
Johnson SergiAustraliaStephen Shaw RENEWAL
Ivar PaprockiBrazilElwin Sharvill PROPOSAL
David DarakjyCanadaAmy Elsner QUALIFIED
Antonio CaudyJapanIoni Bowcher UNQUALIFIED
Emily WhobreyIndiaAsiya Javayant NEW
Jefferson SchemmerUnited KingdomIvan Magalhaes RENEWAL
Mayumi KolmetzIndiaIoni Bowcher PROPOSAL
Alejandro PerinItalyAsiya Javayant UNQUALIFIED
Jones VocelkaFranceElwin Sharvill PROPOSAL
Morrow RutaSpainOnyama Limba NEW
Nicolas IturbideGermanyAnna Fali NEGOTIATION
Wickens NestleItalyAnna Fali PROPOSAL
Stacey MacleadBrazilElwin Sharvill QUALIFIED
Morrow RutaSpainBernardo Dominic NEGOTIATION
Tony FollerItalyIvan Magalhaes QUALIFIED
Mujtaba NickaBrazilIvan Magalhaes UNQUALIFIED
Leja CaldareraRussiaElwin Sharvill QUALIFIED
Leon OldroydRussiaStephen Shaw PROPOSAL
Mayumi KolmetzSpainIvan Magalhaes NEW
Claire TollnerUnited KingdomAsiya Javayant RENEWAL
Juan WieserSpainBernardo Dominic NEW
Jones VocelkaItalyElwin Sharvill UNQUALIFIED
Sinclair WaycottItalyAsiya Javayant UNQUALIFIED
Alejandro PerinCanadaStephen Shaw NEW
Nicolas IturbideFranceAsiya Javayant UNQUALIFIED
Leon OldroydGermanyAmy Elsner NEW
Smith GlickArgentinaOnyama Limba UNQUALIFIED
Jennifer AmigonGermanyElwin Sharvill QUALIFIED
Ivar PaprockiSpainElwin Sharvill PROPOSAL
Ashley DoeCanadaAsiya Javayant RENEWAL
Horizontal
NameCountryRepresentativeStatus
Wickens NestleUnited KingdomIoni Bowcher PROPOSAL
Clifford RimFranceIoni Bowcher PROPOSAL
Wickens NestleBrazilIvan Magalhaes UNQUALIFIED
Cody SaylorsIndiaAnna Fali QUALIFIED
Jefferson SchemmerAustraliaIoni Bowcher RENEWAL
David DarakjyJapanAsiya Javayant NEW
Clifford RimRussiaStephen Shaw UNQUALIFIED
Emily WhobreyJapanBernardo Dominic RENEWAL
Antonio CaudyArgentinaAsiya Javayant NEW
Maisha RulapaughBrazilAnna Fali QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Costa DilliardArgentina2026-05-11Commercial Press RENEWAL39Elwin Sharvill
1001Deepesh ChuiArgentina2026-05-12Dorl, James J Esq NEGOTIATION75Elwin Sharvill
1002Jeanfrancois VenereSpain2026-05-14Truhlar And Truhlar Attys RENEWAL30Asiya Javayant
1003Jeanfrancois VenereItaly2026-05-15King, Christopher A Esq PROPOSAL10Anna Fali
1004Johnson SergiIndia2026-05-10Commercial Press UNQUALIFIED36Anna Fali
1005Jefferson SchemmerAustralia2026-05-09Chapman, Ross E Esq UNQUALIFIED26Ioni Bowcher
1006Alejandro PerinArgentina2026-05-21Buckley Miller Wright RENEWAL59Anna Fali
1007Darci PoquetteUnited Kingdom2026-05-19Printing Dimensions PROPOSAL74Elwin Sharvill
1008Jeanfrancois VenereRussia2026-05-21Chemel, James L Cpa NEW61Ioni Bowcher
1009Rodrigues CampainCanada2026-05-15Commercial Press NEW62Onyama Limba
1010Isabel BowleyItaly2026-05-01Buckley Miller Wright UNQUALIFIED90Amy Elsner
1011Alejandro PerinCanada2026-05-08King, Christopher A Esq RENEWAL91Ivan Magalhaes
1012Costa DilliardAustralia2026-05-24Chanay, Jeffrey A Esq NEGOTIATION7Onyama Limba
1013Cody SaylorsSpain2026-05-20Morlong Associates QUALIFIED58Stephen Shaw
1014Clifford RimItaly2026-05-22Buckley Miller Wright QUALIFIED27Onyama Limba
1015Arvin AlbaresBrazil2026-05-23Rangoni Of Florence QUALIFIED43Bernardo Dominic
1016Clifford RimSpain2026-05-18Morlong Associates NEW50Ivan Magalhaes
1017Tony FollerCanada2026-05-28Rousseaux, Michael Esq QUALIFIED69Asiya Javayant
1018Maria MarrierIndia2026-05-06Commercial Press NEGOTIATION99Ivan Magalhaes
1019Greenwood BologniaRussia2026-05-10Rousseaux, Michael Esq NEW94Amy Elsner
1020Leja CaldareraRussia2026-05-25Printing Dimensions NEW15Amy Elsner
1021Silvio SlusarskiIndia2026-05-07Rangoni Of Florence RENEWAL40Anna Fali
1022Greenwood BologniaFrance2026-05-05Buckley Miller Wright QUALIFIED54Bernardo Dominic
1023Arvin AlbaresJapan2026-05-03Rangoni Of Florence NEGOTIATION44Ioni Bowcher
1024Aruna FigeroaItaly2026-05-17Buckley Miller Wright NEGOTIATION94Anna Fali
1025James ButtItaly2026-05-01Feltz Printing Service UNQUALIFIED82Xuxue Feng
1026Alejandro PerinSpain2026-05-01Rangoni Of Florence RENEWAL18Onyama Limba
1027David DarakjyArgentina2026-05-10Buckley Miller Wright PROPOSAL12Elwin Sharvill
1028Johnson SergiUnited Kingdom2026-05-22Printing Dimensions PROPOSAL67Elwin Sharvill
1029Claire TollnerRussia2026-05-17Benton, John B Jr QUALIFIED87Asiya Javayant
1030Antonio CaudyJapan2026-05-21Truhlar And Truhlar Attys QUALIFIED71Ioni Bowcher
1031Jones VocelkaUnited Kingdom2026-05-24Buckley Miller Wright NEGOTIATION19Anna Fali
1032Ashley DoeArgentina2026-05-09Chapman, Ross E Esq NEW49Stephen Shaw
1033Leon OldroydGermany2026-05-09Morlong Associates NEW6Ioni Bowcher
1034Sinclair WaycottFrance2026-05-11Chanay, Jeffrey A Esq QUALIFIED31Bernardo Dominic
1035Antonio CaudyBrazil2026-05-22Dorl, James J Esq PROPOSAL54Xuxue Feng
1036Darci PoquetteAustralia2026-05-01Chapman, Ross E Esq NEW74Elwin Sharvill
1037Chavez BriddickUnited Kingdom2026-05-10Truhlar And Truhlar Attys RENEWAL10Xuxue Feng
1038Johnson SergiArgentina2026-05-12Rangoni Of Florence PROPOSAL93Amy Elsner
1039Aika InouyeBrazil2026-05-14Printing Dimensions RENEWAL47Onyama Limba
1040Juan WieserCanada2026-05-21Feiner Bros NEW76Stephen Shaw
1041Wickens NestleArgentina2026-05-27Printing Dimensions UNQUALIFIED28Amy Elsner
1042Ricardo GauchoGermany2026-05-07Benton, John B Jr RENEWAL83Xuxue Feng
1043Ashley DoeFrance2026-05-29Chapman, Ross E Esq RENEWAL22Onyama Limba
1044Nicolas IturbideUnited Kingdom2026-05-01Chanay, Jeffrey A Esq PROPOSAL64Onyama Limba
1045Jennifer AmigonIndia2026-05-17Chapman, Ross E Esq NEW67Ioni Bowcher
1046Misaki RoysterSpain2026-05-05Truhlar And Truhlar Attys NEW75Bernardo Dominic
1047Jefferson SchemmerAustralia2026-05-22Buckley Miller Wright RENEWAL94Anna Fali
1048Morrow RutaBrazil2026-05-07Printing Dimensions RENEWAL7Onyama Limba
1049Ricardo GauchoGermany2026-05-22Feltz Printing Service NEGOTIATION56Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Salvatore StockhamGermanyBernardo Dominic QUALIFIED
Jones VocelkaIndiaBernardo Dominic UNQUALIFIED
Mujtaba NickaRussiaElwin Sharvill NEGOTIATION
Sinclair WaycottArgentinaIoni Bowcher UNQUALIFIED
Kadeem FlosiItalyAnna Fali UNQUALIFIED
Stacey MacleadCanadaOnyama Limba UNQUALIFIED
Salvatore StockhamJapanIvan Magalhaes NEGOTIATION
Misaki RoysterBrazilElwin Sharvill NEGOTIATION
Munro FerenczRussiaBernardo Dominic QUALIFIED
Nicolas IturbideUnited KingdomAsiya Javayant UNQUALIFIED
Misaki RoysterBrazilOnyama Limba RENEWAL
Aditya KuskoAustraliaXuxue Feng RENEWAL
Nicolas IturbideIndiaAnna Fali NEGOTIATION
Jeanfrancois VenereRussiaAnna Fali NEW
Kaitlin OstroskyItalyElwin Sharvill PROPOSAL
Leon OldroydCanadaStephen Shaw NEW
Aditya KuskoRussiaIoni Bowcher NEGOTIATION
Munro FerenczCanadaIvan Magalhaes NEGOTIATION
Johnson SergiFranceOnyama Limba NEW
Johnson SergiCanadaIvan Magalhaes NEGOTIATION
Wickens NestleSpainStephen Shaw NEGOTIATION
Morrow RutaBrazilIvan Magalhaes NEGOTIATION
Murillo MaletRussiaIoni Bowcher RENEWAL
Maria MarrierSpainIoni Bowcher UNQUALIFIED
Mujtaba NickaArgentinaIoni Bowcher QUALIFIED
James ButtFranceAmy Elsner RENEWAL
Antonio CaudySpainAsiya Javayant UNQUALIFIED
Emily WhobreyArgentinaAmy Elsner PROPOSAL
Antonio CaudyUnited KingdomStephen Shaw NEW
Stacey MacleadFranceAnna Fali QUALIFIED
James ButtJapanElwin Sharvill NEGOTIATION
Wickens NestleSpainIoni Bowcher QUALIFIED
Murillo MaletArgentinaAmy Elsner NEW
Octavia MaletUnited KingdomAsiya Javayant UNQUALIFIED
Silvio SlusarskiBrazilXuxue Feng QUALIFIED
Claire TollnerBrazilAnna Fali UNQUALIFIED
Isabel BowleyUnited KingdomAsiya Javayant QUALIFIED
Sinclair WaycottFranceElwin Sharvill RENEWAL
Jones VocelkaBrazilBernardo Dominic RENEWAL
Aika InouyeBrazilOnyama Limba QUALIFIED
Faith GillianArgentinaAsiya Javayant NEGOTIATION
Stacey MacleadGermanyStephen Shaw NEGOTIATION
Rodrigues CampainBrazilOnyama Limba NEW
James ButtArgentinaBernardo Dominic NEW
Tony FollerIndiaAnna Fali NEW
Faith GillianFranceStephen Shaw PROPOSAL
Cody SaylorsJapanBernardo Dominic QUALIFIED
Antonio CaudyJapanIvan Magalhaes NEW
Emily WhobreyCanadaOnyama Limba UNQUALIFIED
Claire TollnerGermanyBernardo Dominic QUALIFIED
Frozen Columns
Name
Ashley Doe
Izzy Garufi
Kadeem Flosi
Clifford Rim
David Darakjy
Morrow Ruta
Jones Vocelka
Jefferson Schemmer
Claire Tollner
Isabel Bowley
Kaitlin Ostrosky
Faith Gillian
Arvin Albares
Darci Poquette
Maria Marrier
Johnson Sergi
Faith Gillian
Claire Tollner
Munro Ferencz
Jefferson Schemmer
Aika Inouye
Francesco Shinko
James Butt
Leja Caldarera
Mujtaba Nicka
Julie Stenseth
Mujtaba Nicka
Darci Poquette
Maria Marrier
Arvin Albares
James Butt
Izzy Garufi
Maisha Rulapaugh
Rodrigues Campain
Sinclair Waycott
Deepesh Chui
Alejandro Perin
Tony Foller
Claire Tollner
Maisha Rulapaugh
Antonio Caudy
Aruna Figeroa
Julie Stenseth
Darci Poquette
Aika Inouye
Costa Dilliard
Darci Poquette
James Butt
Aditya Kusko
Ashley Doe
IdCountryDate
1000Australia2026-05-05
1001Argentina2026-05-07
1002Canada2026-05-19
1003Italy2026-05-24
1004Japan2026-05-27
1005Brazil2026-05-02
1006Russia2026-05-12
1007Argentina2026-05-19
1008Italy2026-05-17
1009India2026-05-27
1010Australia2026-05-14
1011Argentina2026-05-14
1012United Kingdom2026-05-21
1013Canada2026-05-15
1014India2026-05-27
1015Spain2026-05-28
1016Brazil2026-05-11
1017Australia2026-05-02
1018India2026-05-27
1019France2026-05-07
1020Russia2026-05-14
1021Russia2026-05-06
1022Germany2026-05-23
1023France2026-05-13
1024Canada2026-05-10
1025Germany2026-05-08
1026Brazil2026-05-29
1027United Kingdom2026-05-22
1028Argentina2026-05-18
1029France2026-05-06
1030Australia2026-05-07
1031Spain2026-05-30
1032Canada2026-05-24
1033Argentina2026-05-22
1034Russia2026-05-23
1035Italy2026-05-25
1036Italy2026-05-30
1037Australia2026-05-07
1038India2026-05-21
1039United Kingdom2026-05-27
1040Australia2026-05-13
1041Italy2026-05-02
1042Argentina2026-05-30
1043Spain2026-05-28
1044Russia2026-05-29
1045Russia2026-05-09
1046France2026-05-20
1047Spain2026-05-21
1048India2026-05-10
1049Japan2026-05-28

On-Demand Data

NameIdCountryDate
Wickens Nestle1000Spain2026-05-18
Cody Saylors1001Italy2026-05-27
Arvin Albares1002Germany2026-05-09
Claire Tollner1003Australia2026-05-13
Misaki Royster1004Russia2026-05-13
Clifford Rim1005Italy2026-05-09
Adams Morasca1006Canada2026-05-01
Murillo Malet1007United Kingdom2026-05-05
Morrow Ruta1008Spain2026-05-21
Morrow Ruta1009Italy2026-05-29
Wickens Nestle1010Canada2026-05-02
Wickens Nestle1011Brazil2026-05-02
Misaki Royster1012United Kingdom2026-05-27
Antonio Caudy1013Argentina2026-05-28
Greenwood Bolognia1014Spain2026-05-15
Silvio Slusarski1015Spain2026-05-03
Aika Inouye1016United Kingdom2026-05-29
Arvin Albares1017Russia2026-05-09
Stacey Maclead1018Italy2026-05-30
Julie Stenseth1019Argentina2026-05-20
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Leon OldroydArgentinaElwin Sharvill RENEWAL
Leon OldroydJapanOnyama Limba NEGOTIATION
Silvio SlusarskiFranceIoni Bowcher QUALIFIED
Clifford RimGermanyIoni Bowcher RENEWAL
Smith GlickAustraliaStephen Shaw QUALIFIED
Salvatore StockhamUnited KingdomElwin Sharvill RENEWAL
Clifford RimGermanyStephen Shaw UNQUALIFIED
Chavez BriddickItalyIvan Magalhaes UNQUALIFIED
Leja CaldareraIndiaIvan Magalhaes NEGOTIATION
Salvatore StockhamIndiaAsiya Javayant PROPOSAL
Morrow RutaUnited KingdomStephen Shaw NEW
Kadeem FlosiJapanAmy Elsner RENEWAL
Leon OldroydGermanyIoni Bowcher RENEWAL
Jones VocelkaBrazilXuxue Feng NEGOTIATION
Wickens NestleRussiaAmy Elsner NEW
Octavia MaletAustraliaAmy Elsner NEGOTIATION
Deepesh ChuiItalyStephen Shaw QUALIFIED
Adams MorascaRussiaXuxue Feng PROPOSAL
Adams MorascaArgentinaBernardo Dominic UNQUALIFIED
Arvin AlbaresBrazilIvan Magalhaes UNQUALIFIED
Ricardo GauchoCanadaAnna Fali UNQUALIFIED
Greenwood BologniaBrazilXuxue Feng PROPOSAL
Alejandro PerinItalyAsiya Javayant PROPOSAL
Misaki RoysterGermanyIoni Bowcher NEW
Izzy GarufiFranceElwin Sharvill NEGOTIATION
Antonio CaudyIndiaXuxue Feng NEW
Aditya KuskoJapanElwin Sharvill QUALIFIED
Jefferson SchemmerUnited KingdomOnyama Limba NEW
Faith GillianCanadaBernardo Dominic PROPOSAL
Emily WhobreyGermanyBernardo Dominic RENEWAL
Kadeem FlosiIndiaAsiya Javayant NEGOTIATION
Morrow RutaBrazilIoni Bowcher UNQUALIFIED
Rodrigues CampainRussiaAmy Elsner UNQUALIFIED
Emily WhobreyGermanyStephen Shaw NEGOTIATION
David DarakjyUnited KingdomAmy Elsner NEGOTIATION
Costa DilliardIndiaOnyama Limba RENEWAL
Claire TollnerItalyAsiya Javayant NEGOTIATION
Octavia MaletJapanIvan Magalhaes NEW
Sinclair WaycottGermanyStephen Shaw NEGOTIATION
Isabel BowleyIndiaXuxue Feng 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>