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
Jeanfrancois VenereJapanAmy Elsner PROPOSAL
Aika InouyeJapanXuxue Feng NEGOTIATION
Mujtaba NickaCanadaOnyama Limba RENEWAL
Faith GillianBrazilElwin Sharvill PROPOSAL
Chavez BriddickFranceIvan Magalhaes NEW
Greenwood BologniaGermanyAmy Elsner NEGOTIATION
Aika InouyeUnited KingdomBernardo Dominic UNQUALIFIED
Mujtaba NickaRussiaIoni Bowcher NEGOTIATION
Jennifer AmigonUnited KingdomIoni Bowcher RENEWAL
Izzy GarufiFranceIvan Magalhaes QUALIFIED
Salvatore StockhamArgentinaIoni Bowcher UNQUALIFIED
Aditya KuskoRussiaStephen Shaw QUALIFIED
Ricardo GauchoIndiaStephen Shaw NEGOTIATION
Adams MorascaCanadaOnyama Limba QUALIFIED
Jones VocelkaFranceStephen Shaw NEGOTIATION
Silvio SlusarskiItalyOnyama Limba UNQUALIFIED
Isabel BowleyUnited KingdomBernardo Dominic PROPOSAL
Costa DilliardJapanOnyama Limba NEW
Claire TollnerFranceBernardo Dominic RENEWAL
Ashley DoeGermanyXuxue Feng NEGOTIATION
Maisha RulapaughArgentinaAsiya Javayant NEGOTIATION
Clifford RimUnited KingdomAmy Elsner PROPOSAL
Ashley DoeFranceElwin Sharvill UNQUALIFIED
Emily WhobreyGermanyIoni Bowcher RENEWAL
Ivar PaprockiBrazilStephen Shaw NEGOTIATION
Aruna FigeroaFranceStephen Shaw QUALIFIED
Antonio CaudyArgentinaAsiya Javayant PROPOSAL
Aruna FigeroaRussiaXuxue Feng NEGOTIATION
Munro FerenczGermanyAsiya Javayant PROPOSAL
Clifford RimBrazilXuxue Feng UNQUALIFIED
Smith GlickFranceStephen Shaw NEGOTIATION
Claire TollnerRussiaOnyama Limba UNQUALIFIED
Ashley DoeUnited KingdomAsiya Javayant NEW
Jennifer AmigonItalyIvan Magalhaes NEGOTIATION
Faith GillianCanadaStephen Shaw NEW
Faith GillianAustraliaXuxue Feng PROPOSAL
Emily WhobreyBrazilAsiya Javayant PROPOSAL
Ricardo GauchoJapanIvan Magalhaes QUALIFIED
Cody SaylorsJapanStephen Shaw NEW
Jennifer AmigonUnited KingdomAmy Elsner UNQUALIFIED
Kaitlin OstroskyArgentinaAnna Fali NEW
Misaki RoysterGermanyStephen Shaw QUALIFIED
Greenwood BologniaItalyXuxue Feng RENEWAL
Jones VocelkaAustraliaAsiya Javayant QUALIFIED
Julie StensethItalyXuxue Feng NEGOTIATION
Faith GillianBrazilAsiya Javayant RENEWAL
Nicolas IturbideSpainStephen Shaw RENEWAL
Jones VocelkaGermanyIvan Magalhaes NEW
Isabel BowleyIndiaXuxue Feng QUALIFIED
Jones VocelkaJapanIvan Magalhaes NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Ricardo GauchoBrazilBernardo Dominic NEW
Faith GillianFranceIoni Bowcher NEW
Ashley DoeFranceXuxue Feng QUALIFIED
Misaki RoysterItalyBernardo Dominic RENEWAL
Smith GlickAustraliaAmy Elsner UNQUALIFIED
Stacey MacleadItalyAsiya Javayant UNQUALIFIED
Greenwood BologniaUnited KingdomBernardo Dominic NEGOTIATION
Sinclair WaycottJapanIoni Bowcher NEGOTIATION
Ricardo GauchoIndiaStephen Shaw UNQUALIFIED
Maisha RulapaughGermanyStephen Shaw NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Ricardo GauchoGermany2026-04-22Morlong Associates UNQUALIFIED91Stephen Shaw
1001Ashley DoeItaly2026-04-23Morlong Associates PROPOSAL0Elwin Sharvill
1002Maisha RulapaughGermany2026-05-08Morlong Associates QUALIFIED49Bernardo Dominic
1003Juan WieserFrance2026-04-19Morlong Associates UNQUALIFIED65Ivan Magalhaes
1004Maria MarrierItaly2026-04-28Chapman, Ross E Esq RENEWAL16Onyama Limba
1005Clifford RimUnited Kingdom2026-04-19Chemel, James L Cpa NEGOTIATION90Elwin Sharvill
1006David DarakjyCanada2026-05-02Feiner Bros RENEWAL75Amy Elsner
1007Salvatore StockhamFrance2026-05-06Chemel, James L Cpa QUALIFIED67Elwin Sharvill
1008Murillo MaletUnited Kingdom2026-04-18Dorl, James J Esq UNQUALIFIED0Bernardo Dominic
1009Clifford RimJapan2026-05-12Chanay, Jeffrey A Esq PROPOSAL95Xuxue Feng
1010Claire TollnerBrazil2026-04-28Chapman, Ross E Esq NEGOTIATION94Stephen Shaw
1011Maria MarrierCanada2026-04-21Rangoni Of Florence RENEWAL83Ioni Bowcher
1012Tony FollerBrazil2026-04-17King, Christopher A Esq PROPOSAL86Ioni Bowcher
1013Mayumi KolmetzArgentina2026-05-12King, Christopher A Esq RENEWAL61Bernardo Dominic
1014Wickens NestleArgentina2026-04-26Dorl, James J Esq QUALIFIED75Asiya Javayant
1015Ashley DoeSpain2026-04-26Commercial Press QUALIFIED69Elwin Sharvill
1016Wickens NestleSpain2026-05-12Chapman, Ross E Esq NEGOTIATION81Anna Fali
1017Cody SaylorsJapan2026-05-07Commercial Press QUALIFIED96Ioni Bowcher
1018Sinclair WaycottArgentina2026-05-14Feiner Bros NEGOTIATION60Ivan Magalhaes
1019Jefferson SchemmerGermany2026-04-27Truhlar And Truhlar Attys NEW49Asiya Javayant
1020Costa DilliardCanada2026-04-17Feltz Printing Service NEW75Stephen Shaw
1021Nicolas IturbideGermany2026-04-20Rangoni Of Florence UNQUALIFIED78Amy Elsner
1022Adams MorascaUnited Kingdom2026-05-12Chemel, James L Cpa NEW23Stephen Shaw
1023Murillo MaletArgentina2026-05-04Chemel, James L Cpa NEW26Anna Fali
1024Silvio SlusarskiJapan2026-05-03Printing Dimensions NEW54Asiya Javayant
1025Silvio SlusarskiRussia2026-05-10Rangoni Of Florence RENEWAL95Stephen Shaw
1026Francesco ShinkoCanada2026-05-11Dorl, James J Esq RENEWAL9Anna Fali
1027Aika InouyeIndia2026-05-02Truhlar And Truhlar Attys RENEWAL49Ioni Bowcher
1028Leja CaldareraAustralia2026-04-17Truhlar And Truhlar Attys UNQUALIFIED51Amy Elsner
1029Sinclair WaycottRussia2026-05-05Rousseaux, Michael Esq NEW96Bernardo Dominic
1030Jennifer AmigonUnited Kingdom2026-05-14Commercial Press NEW43Bernardo Dominic
1031Cody SaylorsRussia2026-04-25King, Christopher A Esq PROPOSAL47Amy Elsner
1032David DarakjyAustralia2026-05-12Dorl, James J Esq RENEWAL87Bernardo Dominic
1033Greenwood BologniaJapan2026-04-18Benton, John B Jr PROPOSAL87Ioni Bowcher
1034David DarakjyArgentina2026-05-06King, Christopher A Esq RENEWAL41Stephen Shaw
1035Aditya KuskoArgentina2026-05-15Benton, John B Jr NEW50Ioni Bowcher
1036Mayumi KolmetzJapan2026-04-17Chemel, James L Cpa UNQUALIFIED55Elwin Sharvill
1037Claire TollnerFrance2026-04-30King, Christopher A Esq RENEWAL78Asiya Javayant
1038Maisha RulapaughGermany2026-05-15Rangoni Of Florence UNQUALIFIED59Onyama Limba
1039Wickens NestleJapan2026-04-29Truhlar And Truhlar Attys UNQUALIFIED29Amy Elsner
1040Arvin AlbaresIndia2026-05-01Rousseaux, Michael Esq NEW35Ioni Bowcher
1041Sinclair WaycottArgentina2026-04-24Chemel, James L Cpa UNQUALIFIED67Amy Elsner
1042Stacey MacleadJapan2026-05-08Feltz Printing Service QUALIFIED93Elwin Sharvill
1043Ricardo GauchoCanada2026-04-18Commercial Press NEW7Ivan Magalhaes
1044Chavez BriddickItaly2026-04-24Rousseaux, Michael Esq NEGOTIATION97Asiya Javayant
1045Johnson SergiGermany2026-05-10Feiner Bros UNQUALIFIED1Elwin Sharvill
1046Ashley DoeRussia2026-05-08Printing Dimensions NEGOTIATION44Xuxue Feng
1047Antonio CaudyUnited Kingdom2026-04-21Dorl, James J Esq QUALIFIED65Ivan Magalhaes
1048Ricardo GauchoUnited Kingdom2026-04-27Rangoni Of Florence UNQUALIFIED29Elwin Sharvill
1049Aruna FigeroaIndia2026-05-06Printing Dimensions RENEWAL65Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Deepesh ChuiFranceStephen Shaw UNQUALIFIED
Jefferson SchemmerUnited KingdomIoni Bowcher UNQUALIFIED
Darci PoquetteJapanAmy Elsner QUALIFIED
Julie StensethRussiaStephen Shaw NEW
Murillo MaletUnited KingdomBernardo Dominic NEGOTIATION
Cody SaylorsItalyOnyama Limba NEW
James ButtFranceIoni Bowcher RENEWAL
Nicolas IturbideBrazilAnna Fali QUALIFIED
Maisha RulapaughRussiaOnyama Limba QUALIFIED
Juan WieserSpainOnyama Limba UNQUALIFIED
Arvin AlbaresSpainStephen Shaw QUALIFIED
Claire TollnerIndiaXuxue Feng QUALIFIED
Costa DilliardCanadaAnna Fali NEGOTIATION
Julie StensethArgentinaXuxue Feng NEGOTIATION
Nicolas IturbideFranceXuxue Feng RENEWAL
Jones VocelkaUnited KingdomElwin Sharvill PROPOSAL
Adams MorascaJapanAsiya Javayant NEW
Ricardo GauchoJapanIoni Bowcher QUALIFIED
Antonio CaudyJapanXuxue Feng UNQUALIFIED
Isabel BowleySpainAsiya Javayant RENEWAL
Chavez BriddickSpainAsiya Javayant QUALIFIED
Cody SaylorsCanadaIvan Magalhaes PROPOSAL
Smith GlickCanadaOnyama Limba QUALIFIED
Kadeem FlosiArgentinaAsiya Javayant QUALIFIED
Claire TollnerFranceXuxue Feng PROPOSAL
Jennifer AmigonBrazilAmy Elsner QUALIFIED
Ashley DoeCanadaAsiya Javayant NEGOTIATION
James ButtArgentinaStephen Shaw RENEWAL
Wickens NestleArgentinaStephen Shaw QUALIFIED
Morrow RutaItalyAsiya Javayant QUALIFIED
Costa DilliardBrazilAsiya Javayant NEW
Maria MarrierJapanOnyama Limba RENEWAL
Alejandro PerinAustraliaAnna Fali UNQUALIFIED
Cody SaylorsRussiaBernardo Dominic UNQUALIFIED
Leja CaldareraArgentinaAsiya Javayant NEGOTIATION
Leja CaldareraRussiaIvan Magalhaes NEGOTIATION
Darci PoquetteBrazilAmy Elsner RENEWAL
Mayumi KolmetzIndiaBernardo Dominic PROPOSAL
Aruna FigeroaCanadaElwin Sharvill PROPOSAL
Jones VocelkaArgentinaIoni Bowcher QUALIFIED
Emily WhobreyUnited KingdomXuxue Feng PROPOSAL
Maria MarrierUnited KingdomIoni Bowcher NEGOTIATION
Morrow RutaFranceOnyama Limba PROPOSAL
Kadeem FlosiCanadaAsiya Javayant UNQUALIFIED
Smith GlickAustraliaIoni Bowcher PROPOSAL
Francesco ShinkoFranceOnyama Limba QUALIFIED
Kadeem FlosiCanadaIvan Magalhaes NEW
Greenwood BologniaUnited KingdomXuxue Feng UNQUALIFIED
Misaki RoysterArgentinaAsiya Javayant QUALIFIED
Aditya KuskoBrazilAmy Elsner RENEWAL
Frozen Columns
Name
Aika Inouye
Deepesh Chui
Jones Vocelka
Misaki Royster
Rodrigues Campain
Octavia Malet
Kadeem Flosi
Stacey Maclead
Izzy Garufi
Alejandro Perin
Octavia Malet
Juan Wieser
Arvin Albares
Aruna Figeroa
Ashley Doe
Arvin Albares
Jeanfrancois Venere
Mayumi Kolmetz
Leon Oldroyd
Leja Caldarera
Maisha Rulapaugh
Mujtaba Nicka
James Butt
Maisha Rulapaugh
Greenwood Bolognia
Costa Dilliard
Julie Stenseth
Salvatore Stockham
Salvatore Stockham
Murillo Malet
Morrow Ruta
Julie Stenseth
Claire Tollner
David Darakjy
Jeanfrancois Venere
Emily Whobrey
Ivar Paprocki
Deepesh Chui
Kaitlin Ostrosky
Maria Marrier
Munro Ferencz
Aditya Kusko
Mayumi Kolmetz
Maisha Rulapaugh
Rodrigues Campain
Sinclair Waycott
Salvatore Stockham
Adams Morasca
Emily Whobrey
Jennifer Amigon
IdCountryDate
1000Germany2026-04-18
1001Australia2026-04-26
1002Canada2026-04-25
1003Brazil2026-05-01
1004Australia2026-04-16
1005India2026-05-09
1006India2026-05-06
1007United Kingdom2026-05-05
1008Spain2026-04-21
1009Japan2026-04-18
1010India2026-05-07
1011United Kingdom2026-04-20
1012Argentina2026-05-08
1013France2026-04-30
1014Japan2026-04-16
1015Spain2026-05-06
1016Brazil2026-04-26
1017Australia2026-05-14
1018Brazil2026-05-09
1019Canada2026-05-10
1020Russia2026-05-08
1021Russia2026-04-16
1022United Kingdom2026-04-16
1023United Kingdom2026-05-01
1024United Kingdom2026-04-28
1025France2026-05-10
1026Italy2026-05-09
1027Russia2026-04-16
1028Italy2026-04-19
1029Russia2026-05-01
1030France2026-04-24
1031Russia2026-05-07
1032Argentina2026-04-30
1033Brazil2026-04-21
1034Japan2026-05-13
1035Japan2026-04-30
1036Russia2026-05-06
1037Russia2026-05-11
1038Japan2026-04-21
1039United Kingdom2026-04-19
1040India2026-04-23
1041Australia2026-05-11
1042Canada2026-04-29
1043Argentina2026-04-29
1044Canada2026-05-08
1045United Kingdom2026-05-09
1046Brazil2026-04-21
1047United Kingdom2026-04-22
1048Canada2026-05-11
1049Italy2026-04-17

On-Demand Data

NameIdCountryDate
Antonio Caudy1000Canada2026-04-24
Leja Caldarera1001India2026-05-01
Aika Inouye1002Japan2026-04-18
Morrow Ruta1003France2026-04-26
Emily Whobrey1004France2026-04-23
Francesco Shinko1005France2026-05-04
Chavez Briddick1006Spain2026-04-23
Ivar Paprocki1007Germany2026-05-06
Aditya Kusko1008Canada2026-04-30
Kaitlin Ostrosky1009Germany2026-05-10
Morrow Ruta1010Italy2026-05-08
Mayumi Kolmetz1011Argentina2026-04-19
Misaki Royster1012Japan2026-04-18
Aruna Figeroa1013Japan2026-05-06
Deepesh Chui1014Canada2026-04-30
Aditya Kusko1015France2026-05-05
Arvin Albares1016United Kingdom2026-05-06
Costa Dilliard1017Canada2026-05-10
Faith Gillian1018Italy2026-04-23
Munro Ferencz1019France2026-04-28
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Rodrigues CampainUnited KingdomOnyama Limba NEW
Sinclair WaycottBrazilStephen Shaw NEGOTIATION
Claire TollnerArgentinaIoni Bowcher PROPOSAL
Smith GlickAustraliaOnyama Limba UNQUALIFIED
Smith GlickAustraliaOnyama Limba QUALIFIED
Claire TollnerItalyOnyama Limba RENEWAL
Smith GlickAustraliaIvan Magalhaes RENEWAL
Rodrigues CampainBrazilAsiya Javayant NEW
Isabel BowleyFranceAsiya Javayant UNQUALIFIED
Julie StensethRussiaStephen Shaw PROPOSAL
Ivar PaprockiArgentinaIvan Magalhaes NEGOTIATION
Izzy GarufiArgentinaIoni Bowcher RENEWAL
Faith GillianArgentinaXuxue Feng QUALIFIED
David DarakjyRussiaAnna Fali UNQUALIFIED
Jefferson SchemmerIndiaAsiya Javayant UNQUALIFIED
Nicolas IturbideRussiaBernardo Dominic PROPOSAL
Faith GillianSpainBernardo Dominic UNQUALIFIED
Greenwood BologniaArgentinaStephen Shaw RENEWAL
Alejandro PerinJapanBernardo Dominic NEGOTIATION
Kaitlin OstroskyJapanIvan Magalhaes RENEWAL
Greenwood BologniaSpainXuxue Feng UNQUALIFIED
Maria MarrierIndiaIvan Magalhaes QUALIFIED
Deepesh ChuiRussiaIvan Magalhaes UNQUALIFIED
Julie StensethRussiaElwin Sharvill RENEWAL
Aditya KuskoItalyIoni Bowcher NEGOTIATION
Costa DilliardFranceIvan Magalhaes RENEWAL
James ButtIndiaElwin Sharvill NEGOTIATION
Julie StensethJapanAsiya Javayant RENEWAL
Rodrigues CampainItalyAnna Fali PROPOSAL
Smith GlickCanadaIvan Magalhaes NEW
Leon OldroydUnited KingdomAmy Elsner NEW
Izzy GarufiSpainIoni Bowcher PROPOSAL
Ricardo GauchoCanadaBernardo Dominic NEW
Misaki RoysterUnited KingdomAmy Elsner PROPOSAL
Sinclair WaycottGermanyAsiya Javayant RENEWAL
Arvin AlbaresBrazilBernardo Dominic RENEWAL
Arvin AlbaresUnited KingdomElwin Sharvill PROPOSAL
Octavia MaletIndiaIoni Bowcher NEW
Isabel BowleyArgentinaAsiya Javayant NEW
Ivar PaprockiJapanAsiya Javayant 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>