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
Leon OldroydSpainBernardo Dominic PROPOSAL
Alejandro PerinItalyAmy Elsner QUALIFIED
Aruna FigeroaIndiaXuxue Feng PROPOSAL
Rodrigues CampainJapanAsiya Javayant RENEWAL
Murillo MaletFranceAnna Fali QUALIFIED
Deepesh ChuiArgentinaBernardo Dominic NEGOTIATION
Leon OldroydIndiaElwin Sharvill QUALIFIED
Silvio SlusarskiCanadaIvan Magalhaes NEGOTIATION
Maisha RulapaughSpainAsiya Javayant RENEWAL
Aditya KuskoUnited KingdomBernardo Dominic UNQUALIFIED
Julie StensethRussiaStephen Shaw NEGOTIATION
Aruna FigeroaIndiaStephen Shaw NEGOTIATION
Jefferson SchemmerGermanyIoni Bowcher QUALIFIED
Arvin AlbaresIndiaStephen Shaw UNQUALIFIED
Wickens NestleFranceElwin Sharvill PROPOSAL
Arvin AlbaresUnited KingdomAmy Elsner NEGOTIATION
Greenwood BologniaUnited KingdomElwin Sharvill NEW
David DarakjyArgentinaBernardo Dominic RENEWAL
Adams MorascaSpainIvan Magalhaes NEGOTIATION
Maria MarrierCanadaAmy Elsner NEGOTIATION
Kadeem FlosiAustraliaOnyama Limba NEW
Deepesh ChuiSpainAnna Fali NEGOTIATION
Smith GlickAustraliaOnyama Limba RENEWAL
Julie StensethGermanyBernardo Dominic NEW
Jefferson SchemmerGermanyXuxue Feng RENEWAL
Juan WieserUnited KingdomIoni Bowcher NEW
Misaki RoysterItalyXuxue Feng RENEWAL
Adams MorascaBrazilStephen Shaw PROPOSAL
Jefferson SchemmerJapanIvan Magalhaes RENEWAL
Kaitlin OstroskyJapanStephen Shaw NEGOTIATION
Leja CaldareraArgentinaXuxue Feng NEGOTIATION
Jennifer AmigonIndiaStephen Shaw NEW
Chavez BriddickCanadaXuxue Feng UNQUALIFIED
Ivar PaprockiGermanyXuxue Feng UNQUALIFIED
Costa DilliardAustraliaIoni Bowcher RENEWAL
Mayumi KolmetzSpainAnna Fali QUALIFIED
Claire TollnerIndiaAmy Elsner NEGOTIATION
Sinclair WaycottUnited KingdomIoni Bowcher UNQUALIFIED
Clifford RimArgentinaXuxue Feng QUALIFIED
Stacey MacleadSpainIoni Bowcher RENEWAL
Kadeem FlosiItalyElwin Sharvill PROPOSAL
Jones VocelkaItalyOnyama Limba NEGOTIATION
James ButtGermanyBernardo Dominic UNQUALIFIED
Smith GlickBrazilAnna Fali RENEWAL
Arvin AlbaresAustraliaIvan Magalhaes NEGOTIATION
Murillo MaletSpainIoni Bowcher RENEWAL
Kadeem FlosiGermanyStephen Shaw RENEWAL
Sinclair WaycottFranceStephen Shaw NEW
Leja CaldareraGermanyXuxue Feng NEGOTIATION
Faith GillianArgentinaElwin Sharvill QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Juan WieserRussiaOnyama Limba QUALIFIED
James ButtAustraliaElwin Sharvill RENEWAL
Cody SaylorsAustraliaAmy Elsner QUALIFIED
Darci PoquetteRussiaElwin Sharvill QUALIFIED
Misaki RoysterItalyBernardo Dominic RENEWAL
Alejandro PerinIndiaStephen Shaw PROPOSAL
Antonio CaudySpainIvan Magalhaes PROPOSAL
Nicolas IturbideAustraliaIoni Bowcher RENEWAL
Aruna FigeroaRussiaBernardo Dominic UNQUALIFIED
Jeanfrancois VenereFranceXuxue Feng RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Tony FollerJapan2026-06-14Chemel, James L Cpa NEGOTIATION18Asiya Javayant
1001Wickens NestleRussia2026-05-28Feltz Printing Service PROPOSAL38Asiya Javayant
1002Murillo MaletArgentina2026-05-22Chanay, Jeffrey A Esq QUALIFIED8Anna Fali
1003Aruna FigeroaItaly2026-05-20Buckley Miller Wright UNQUALIFIED63Xuxue Feng
1004Arvin AlbaresUnited Kingdom2026-05-21Buckley Miller Wright QUALIFIED59Elwin Sharvill
1005Rodrigues CampainJapan2026-05-17Rangoni Of Florence QUALIFIED7Stephen Shaw
1006Francesco ShinkoFrance2026-06-06Chapman, Ross E Esq RENEWAL87Bernardo Dominic
1007Maisha RulapaughRussia2026-05-28King, Christopher A Esq NEGOTIATION73Bernardo Dominic
1008Isabel BowleyCanada2026-06-10Rangoni Of Florence PROPOSAL32Stephen Shaw
1009Salvatore StockhamIndia2026-06-06Rousseaux, Michael Esq PROPOSAL95Ivan Magalhaes
1010Alejandro PerinItaly2026-06-08Benton, John B Jr NEGOTIATION24Amy Elsner
1011Jones VocelkaRussia2026-05-23Commercial Press NEGOTIATION23Ioni Bowcher
1012Julie StensethRussia2026-05-18Chapman, Ross E Esq UNQUALIFIED37Xuxue Feng
1013David DarakjyUnited Kingdom2026-06-15Chapman, Ross E Esq QUALIFIED51Ivan Magalhaes
1014Cody SaylorsSpain2026-05-22Dorl, James J Esq RENEWAL67Stephen Shaw
1015Chavez BriddickItaly2026-06-11Truhlar And Truhlar Attys NEW98Asiya Javayant
1016Isabel BowleyJapan2026-05-24Feltz Printing Service UNQUALIFIED75Amy Elsner
1017Alejandro PerinRussia2026-05-26King, Christopher A Esq QUALIFIED6Ivan Magalhaes
1018Murillo MaletBrazil2026-06-06Morlong Associates RENEWAL96Stephen Shaw
1019Alejandro PerinCanada2026-06-08Feltz Printing Service RENEWAL52Bernardo Dominic
1020Wickens NestleJapan2026-06-15King, Christopher A Esq NEGOTIATION43Xuxue Feng
1021Kaitlin OstroskyCanada2026-06-01King, Christopher A Esq UNQUALIFIED54Xuxue Feng
1022Emily WhobreyFrance2026-06-10Rousseaux, Michael Esq PROPOSAL81Amy Elsner
1023Adams MorascaAustralia2026-06-02Commercial Press PROPOSAL88Xuxue Feng
1024Greenwood BologniaItaly2026-06-03Truhlar And Truhlar Attys QUALIFIED54Bernardo Dominic
1025Francesco ShinkoFrance2026-06-07Benton, John B Jr NEGOTIATION8Bernardo Dominic
1026Isabel BowleyAustralia2026-06-02Rousseaux, Michael Esq RENEWAL22Elwin Sharvill
1027Mayumi KolmetzRussia2026-06-11Chanay, Jeffrey A Esq RENEWAL93Stephen Shaw
1028Morrow RutaSpain2026-05-29Rousseaux, Michael Esq NEW21Ioni Bowcher
1029Leja CaldareraRussia2026-06-02Commercial Press QUALIFIED8Ivan Magalhaes
1030Maria MarrierJapan2026-06-11Morlong Associates NEGOTIATION53Asiya Javayant
1031David DarakjyGermany2026-06-08Rangoni Of Florence NEGOTIATION6Stephen Shaw
1032Darci PoquetteUnited Kingdom2026-06-13Rangoni Of Florence UNQUALIFIED81Bernardo Dominic
1033Izzy GarufiRussia2026-06-13Feiner Bros UNQUALIFIED41Bernardo Dominic
1034Costa DilliardUnited Kingdom2026-05-29Rangoni Of Florence NEGOTIATION90Ioni Bowcher
1035Rodrigues CampainUnited Kingdom2026-05-30Benton, John B Jr PROPOSAL61Xuxue Feng
1036Murillo MaletAustralia2026-05-27Chanay, Jeffrey A Esq RENEWAL59Bernardo Dominic
1037Faith GillianSpain2026-06-05Rousseaux, Michael Esq RENEWAL55Amy Elsner
1038Julie StensethCanada2026-05-21Feiner Bros UNQUALIFIED81Elwin Sharvill
1039Clifford RimFrance2026-06-07Morlong Associates QUALIFIED43Anna Fali
1040Ricardo GauchoJapan2026-05-27Chapman, Ross E Esq RENEWAL38Xuxue Feng
1041Chavez BriddickFrance2026-06-06Rangoni Of Florence NEW72Stephen Shaw
1042Stacey MacleadRussia2026-06-10Morlong Associates PROPOSAL41Bernardo Dominic
1043Isabel BowleyArgentina2026-06-04Feiner Bros QUALIFIED17Ioni Bowcher
1044Kadeem FlosiItaly2026-06-12Commercial Press UNQUALIFIED90Elwin Sharvill
1045Leja CaldareraBrazil2026-06-03Printing Dimensions NEW91Bernardo Dominic
1046Jeanfrancois VenereArgentina2026-05-29King, Christopher A Esq QUALIFIED37Asiya Javayant
1047Maria MarrierItaly2026-06-03Feiner Bros NEW16Ivan Magalhaes
1048Antonio CaudyUnited Kingdom2026-05-31Feltz Printing Service QUALIFIED34Elwin Sharvill
1049Tony FollerSpain2026-06-08Commercial Press QUALIFIED57Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Maisha RulapaughItalyAsiya Javayant PROPOSAL
Leon OldroydIndiaBernardo Dominic RENEWAL
Juan WieserAustraliaBernardo Dominic RENEWAL
Stacey MacleadBrazilOnyama Limba NEW
Ivar PaprockiSpainAnna Fali PROPOSAL
Mayumi KolmetzCanadaElwin Sharvill QUALIFIED
Arvin AlbaresRussiaElwin Sharvill QUALIFIED
Deepesh ChuiJapanAmy Elsner NEW
Stacey MacleadAustraliaIvan Magalhaes RENEWAL
Juan WieserCanadaIoni Bowcher RENEWAL
Jefferson SchemmerCanadaIvan Magalhaes UNQUALIFIED
Maisha RulapaughCanadaOnyama Limba UNQUALIFIED
Emily WhobreyJapanIoni Bowcher RENEWAL
Sinclair WaycottItalyIvan Magalhaes QUALIFIED
Misaki RoysterIndiaOnyama Limba QUALIFIED
Cody SaylorsUnited KingdomStephen Shaw NEW
Rodrigues CampainRussiaXuxue Feng RENEWAL
Adams MorascaSpainElwin Sharvill RENEWAL
Izzy GarufiItalyBernardo Dominic RENEWAL
Kaitlin OstroskyGermanyElwin Sharvill NEW
Kaitlin OstroskyFranceAsiya Javayant NEW
Jeanfrancois VenereArgentinaIvan Magalhaes NEW
Greenwood BologniaSpainAmy Elsner PROPOSAL
Leon OldroydGermanyElwin Sharvill RENEWAL
Aditya KuskoRussiaOnyama Limba NEW
Adams MorascaFranceElwin Sharvill NEGOTIATION
Adams MorascaArgentinaAnna Fali NEW
Aditya KuskoArgentinaAmy Elsner QUALIFIED
Chavez BriddickFranceStephen Shaw RENEWAL
Jeanfrancois VenereJapanIvan Magalhaes NEW
Johnson SergiSpainOnyama Limba PROPOSAL
Rodrigues CampainBrazilAnna Fali NEW
Stacey MacleadRussiaElwin Sharvill NEGOTIATION
Leja CaldareraGermanyOnyama Limba NEW
Isabel BowleyIndiaOnyama Limba PROPOSAL
Leon OldroydGermanyAmy Elsner PROPOSAL
Greenwood BologniaArgentinaXuxue Feng PROPOSAL
Antonio CaudyJapanIvan Magalhaes PROPOSAL
Misaki RoysterGermanyIoni Bowcher NEW
Ivar PaprockiIndiaAsiya Javayant QUALIFIED
Sinclair WaycottItalyIvan Magalhaes NEW
Julie StensethArgentinaIoni Bowcher NEW
Nicolas IturbideUnited KingdomIoni Bowcher PROPOSAL
Izzy GarufiArgentinaIoni Bowcher NEW
Julie StensethFranceXuxue Feng RENEWAL
Maisha RulapaughArgentinaOnyama Limba NEGOTIATION
Nicolas IturbideArgentinaStephen Shaw NEW
Emily WhobreyIndiaIvan Magalhaes RENEWAL
Jones VocelkaItalyStephen Shaw UNQUALIFIED
Izzy GarufiAustraliaBernardo Dominic QUALIFIED
Frozen Columns
Name
Octavia Malet
Alejandro Perin
Arvin Albares
Misaki Royster
Kadeem Flosi
Julie Stenseth
Maisha Rulapaugh
Mayumi Kolmetz
Emily Whobrey
Juan Wieser
Kadeem Flosi
Munro Ferencz
Ricardo Gaucho
Costa Dilliard
Kadeem Flosi
Alejandro Perin
Nicolas Iturbide
Rodrigues Campain
Octavia Malet
Faith Gillian
Nicolas Iturbide
Jefferson Schemmer
Arvin Albares
Maisha Rulapaugh
Sinclair Waycott
Leon Oldroyd
Adams Morasca
Maria Marrier
Rodrigues Campain
Claire Tollner
James Butt
Maisha Rulapaugh
Sinclair Waycott
Julie Stenseth
Chavez Briddick
Cody Saylors
James Butt
Leja Caldarera
Munro Ferencz
Claire Tollner
Munro Ferencz
Stacey Maclead
Mayumi Kolmetz
Johnson Sergi
Costa Dilliard
Ashley Doe
Mayumi Kolmetz
Chavez Briddick
Jones Vocelka
Julie Stenseth
IdCountryDate
1000India2026-05-17
1001Spain2026-05-22
1002Australia2026-05-29
1003Canada2026-06-06
1004Spain2026-05-17
1005Canada2026-05-20
1006Canada2026-05-31
1007Argentina2026-06-06
1008Italy2026-05-30
1009France2026-05-17
1010United Kingdom2026-06-05
1011Australia2026-06-04
1012Italy2026-06-11
1013Japan2026-06-09
1014Spain2026-05-20
1015Canada2026-05-23
1016Italy2026-05-21
1017Japan2026-06-07
1018Russia2026-05-31
1019Japan2026-05-23
1020United Kingdom2026-05-18
1021Spain2026-05-20
1022France2026-05-23
1023Canada2026-06-09
1024Spain2026-05-30
1025Russia2026-05-18
1026Russia2026-06-05
1027Germany2026-06-13
1028Canada2026-05-29
1029Germany2026-06-05
1030Australia2026-06-01
1031Germany2026-06-04
1032Spain2026-05-30
1033India2026-06-05
1034Canada2026-05-27
1035Brazil2026-06-02
1036Brazil2026-05-31
1037Russia2026-06-10
1038Australia2026-05-27
1039France2026-05-28
1040United Kingdom2026-06-10
1041Russia2026-05-23
1042Australia2026-05-20
1043Italy2026-06-08
1044Australia2026-05-22
1045Germany2026-05-22
1046Japan2026-05-23
1047Italy2026-05-26
1048United Kingdom2026-05-26
1049Japan2026-05-18

On-Demand Data

NameIdCountryDate
Izzy Garufi1000France2026-05-19
Alejandro Perin1001Argentina2026-05-21
Ashley Doe1002Brazil2026-05-30
Leon Oldroyd1003Japan2026-05-21
Antonio Caudy1004Germany2026-05-20
Costa Dilliard1005France2026-05-28
Sinclair Waycott1006Japan2026-05-31
Jennifer Amigon1007Japan2026-05-27
Maria Marrier1008Russia2026-06-07
Aditya Kusko1009Japan2026-06-06
Leon Oldroyd1010Russia2026-06-12
David Darakjy1011Japan2026-06-14
Misaki Royster1012France2026-06-12
Nicolas Iturbide1013Japan2026-06-06
Rodrigues Campain1014Japan2026-06-03
Faith Gillian1015Spain2026-06-05
James Butt1016Brazil2026-06-15
Kadeem Flosi1017Italy2026-05-18
Costa Dilliard1018Argentina2026-06-12
Claire Tollner1019Germany2026-05-28
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Rodrigues CampainBrazilAsiya Javayant NEGOTIATION
Izzy GarufiItalyAsiya Javayant PROPOSAL
Jefferson SchemmerBrazilAnna Fali UNQUALIFIED
Darci PoquetteGermanyBernardo Dominic UNQUALIFIED
Maisha RulapaughCanadaAmy Elsner NEW
Darci PoquetteItalyElwin Sharvill UNQUALIFIED
Munro FerenczAustraliaAsiya Javayant PROPOSAL
Leon OldroydFranceIvan Magalhaes NEGOTIATION
Morrow RutaFranceElwin Sharvill UNQUALIFIED
Alejandro PerinBrazilAnna Fali QUALIFIED
Leon OldroydUnited KingdomAmy Elsner QUALIFIED
Morrow RutaGermanyXuxue Feng UNQUALIFIED
Antonio CaudyItalyAnna Fali PROPOSAL
Alejandro PerinFranceIvan Magalhaes PROPOSAL
Adams MorascaCanadaXuxue Feng RENEWAL
Arvin AlbaresGermanyXuxue Feng UNQUALIFIED
Mayumi KolmetzItalyAnna Fali UNQUALIFIED
Munro FerenczArgentinaOnyama Limba NEGOTIATION
Tony FollerRussiaAmy Elsner PROPOSAL
Morrow RutaItalyAnna Fali PROPOSAL
Ricardo GauchoRussiaAnna Fali NEW
Antonio CaudyIndiaIoni Bowcher NEGOTIATION
Antonio CaudyBrazilOnyama Limba RENEWAL
Arvin AlbaresSpainStephen Shaw QUALIFIED
Mujtaba NickaUnited KingdomAnna Fali RENEWAL
Adams MorascaBrazilElwin Sharvill NEW
Kaitlin OstroskySpainIvan Magalhaes QUALIFIED
Cody SaylorsIndiaAmy Elsner RENEWAL
Jefferson SchemmerItalyAsiya Javayant NEW
Juan WieserSpainElwin Sharvill NEW
Wickens NestleRussiaOnyama Limba PROPOSAL
Salvatore StockhamRussiaOnyama Limba PROPOSAL
Darci PoquetteArgentinaElwin Sharvill NEGOTIATION
Wickens NestleRussiaIvan Magalhaes UNQUALIFIED
Antonio CaudyBrazilElwin Sharvill PROPOSAL
Juan WieserUnited KingdomAmy Elsner NEW
Jeanfrancois VenereUnited KingdomOnyama Limba UNQUALIFIED
Isabel BowleyArgentinaIoni Bowcher PROPOSAL
Darci PoquetteUnited KingdomBernardo Dominic QUALIFIED
Stacey MacleadSpainAmy Elsner 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>