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
Maria MarrierItalyIoni Bowcher QUALIFIED
Faith GillianIndiaStephen Shaw PROPOSAL
James ButtItalyOnyama Limba RENEWAL
Antonio CaudyItalyIoni Bowcher PROPOSAL
Leon OldroydIndiaAmy Elsner QUALIFIED
Costa DilliardArgentinaAmy Elsner NEGOTIATION
Silvio SlusarskiRussiaElwin Sharvill UNQUALIFIED
Morrow RutaIndiaOnyama Limba PROPOSAL
Darci PoquetteArgentinaAsiya Javayant QUALIFIED
Alejandro PerinBrazilAmy Elsner RENEWAL
Rodrigues CampainBrazilIvan Magalhaes QUALIFIED
Aika InouyeCanadaIvan Magalhaes PROPOSAL
Cody SaylorsItalyAnna Fali UNQUALIFIED
Francesco ShinkoItalyXuxue Feng QUALIFIED
Leja CaldareraRussiaBernardo Dominic NEGOTIATION
Stacey MacleadItalyIoni Bowcher UNQUALIFIED
Salvatore StockhamAustraliaAnna Fali QUALIFIED
Maisha RulapaughGermanyAsiya Javayant PROPOSAL
Clifford RimUnited KingdomAmy Elsner NEGOTIATION
Faith GillianRussiaAmy Elsner QUALIFIED
Greenwood BologniaJapanIoni Bowcher NEW
Chavez BriddickCanadaXuxue Feng RENEWAL
Ricardo GauchoAustraliaAmy Elsner QUALIFIED
Izzy GarufiUnited KingdomOnyama Limba QUALIFIED
Juan WieserAustraliaElwin Sharvill NEW
Silvio SlusarskiRussiaIoni Bowcher RENEWAL
Kadeem FlosiGermanyXuxue Feng QUALIFIED
Adams MorascaFranceIoni Bowcher RENEWAL
Nicolas IturbideJapanAmy Elsner PROPOSAL
Chavez BriddickUnited KingdomIvan Magalhaes NEW
Isabel BowleyAustraliaXuxue Feng NEW
Ricardo GauchoJapanAnna Fali QUALIFIED
Maisha RulapaughUnited KingdomAnna Fali UNQUALIFIED
Isabel BowleyCanadaAsiya Javayant UNQUALIFIED
Munro FerenczArgentinaElwin Sharvill RENEWAL
Jones VocelkaItalyStephen Shaw NEGOTIATION
Faith GillianUnited KingdomStephen Shaw UNQUALIFIED
Jones VocelkaArgentinaOnyama Limba QUALIFIED
Faith GillianJapanStephen Shaw NEGOTIATION
Mayumi KolmetzFranceElwin Sharvill QUALIFIED
Jones VocelkaSpainStephen Shaw NEW
Claire TollnerUnited KingdomAmy Elsner NEW
Darci PoquetteGermanyAnna Fali UNQUALIFIED
Wickens NestleFranceAmy Elsner UNQUALIFIED
Faith GillianJapanAnna Fali NEW
Jeanfrancois VenereAustraliaIvan Magalhaes QUALIFIED
Kadeem FlosiUnited KingdomOnyama Limba NEW
Octavia MaletJapanAnna Fali NEGOTIATION
Ashley DoeArgentinaAsiya Javayant QUALIFIED
Mayumi KolmetzBrazilIoni Bowcher QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Faith GillianBrazilAmy Elsner QUALIFIED
Leja CaldareraSpainElwin Sharvill NEW
Smith GlickFranceAmy Elsner UNQUALIFIED
Deepesh ChuiJapanIvan Magalhaes PROPOSAL
Ashley DoeArgentinaBernardo Dominic NEW
Kaitlin OstroskyFranceStephen Shaw NEGOTIATION
Munro FerenczUnited KingdomOnyama Limba NEGOTIATION
Misaki RoysterSpainOnyama Limba NEW
Francesco ShinkoItalyStephen Shaw PROPOSAL
Costa DilliardItalyIvan Magalhaes NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Misaki RoysterFrance2026-05-22Chapman, Ross E Esq UNQUALIFIED48Xuxue Feng
1001Clifford RimUnited Kingdom2026-05-04Chanay, Jeffrey A Esq UNQUALIFIED71Bernardo Dominic
1002Jennifer AmigonFrance2026-05-08Chemel, James L Cpa NEW98Stephen Shaw
1003Julie StensethBrazil2026-04-27Dorl, James J Esq NEGOTIATION70Anna Fali
1004Jennifer AmigonRussia2026-05-22Printing Dimensions UNQUALIFIED30Xuxue Feng
1005Claire TollnerArgentina2026-04-25Commercial Press QUALIFIED2Onyama Limba
1006Misaki RoysterCanada2026-05-04Rousseaux, Michael Esq PROPOSAL29Elwin Sharvill
1007David DarakjySpain2026-04-27Commercial Press NEGOTIATION67Asiya Javayant
1008Kadeem FlosiJapan2026-05-05Benton, John B Jr PROPOSAL78Bernardo Dominic
1009Nicolas IturbideAustralia2026-05-20Chanay, Jeffrey A Esq QUALIFIED12Ivan Magalhaes
1010Jones VocelkaArgentina2026-04-30Chanay, Jeffrey A Esq PROPOSAL58Amy Elsner
1011Maisha RulapaughIndia2026-04-25Commercial Press PROPOSAL56Anna Fali
1012Tony FollerIndia2026-04-26King, Christopher A Esq UNQUALIFIED9Ioni Bowcher
1013Maria MarrierGermany2026-04-28Printing Dimensions RENEWAL23Onyama Limba
1014Claire TollnerIndia2026-05-19Chapman, Ross E Esq RENEWAL31Stephen Shaw
1015Clifford RimCanada2026-05-04Feltz Printing Service RENEWAL94Asiya Javayant
1016Jennifer AmigonJapan2026-05-18Printing Dimensions PROPOSAL80Asiya Javayant
1017Adams MorascaCanada2026-05-05Printing Dimensions NEW49Elwin Sharvill
1018Rodrigues CampainUnited Kingdom2026-05-13Buckley Miller Wright NEW82Ivan Magalhaes
1019Kadeem FlosiFrance2026-05-19Chanay, Jeffrey A Esq QUALIFIED53Amy Elsner
1020Munro FerenczBrazil2026-05-02Feiner Bros UNQUALIFIED48Asiya Javayant
1021Jefferson SchemmerAustralia2026-05-06Buckley Miller Wright UNQUALIFIED79Asiya Javayant
1022Aditya KuskoSpain2026-05-14Buckley Miller Wright QUALIFIED55Onyama Limba
1023Nicolas IturbideGermany2026-04-25Rousseaux, Michael Esq RENEWAL64Amy Elsner
1024Aditya KuskoAustralia2026-04-28Rangoni Of Florence NEW8Amy Elsner
1025Kadeem FlosiIndia2026-05-12Printing Dimensions RENEWAL40Amy Elsner
1026Kaitlin OstroskyGermany2026-05-06Buckley Miller Wright RENEWAL42Stephen Shaw
1027Jones VocelkaIndia2026-04-26Chanay, Jeffrey A Esq PROPOSAL11Ioni Bowcher
1028Leja CaldareraArgentina2026-05-05Chapman, Ross E Esq RENEWAL1Ioni Bowcher
1029Julie StensethUnited Kingdom2026-05-01Rangoni Of Florence NEW50Onyama Limba
1030Kaitlin OstroskyJapan2026-05-01Feltz Printing Service NEGOTIATION47Bernardo Dominic
1031Stacey MacleadRussia2026-05-14Benton, John B Jr RENEWAL32Ioni Bowcher
1032Tony FollerCanada2026-04-28Feltz Printing Service UNQUALIFIED20Ioni Bowcher
1033Maisha RulapaughIndia2026-04-28Printing Dimensions RENEWAL23Amy Elsner
1034Rodrigues CampainRussia2026-05-13Benton, John B Jr UNQUALIFIED97Bernardo Dominic
1035Wickens NestleCanada2026-05-10Chemel, James L Cpa RENEWAL89Anna Fali
1036Julie StensethUnited Kingdom2026-04-26Benton, John B Jr UNQUALIFIED45Ivan Magalhaes
1037Ashley DoeUnited Kingdom2026-05-08Feltz Printing Service NEW63Ioni Bowcher
1038Nicolas IturbideUnited Kingdom2026-04-25Rousseaux, Michael Esq NEGOTIATION92Asiya Javayant
1039Stacey MacleadGermany2026-05-02Feltz Printing Service RENEWAL55Asiya Javayant
1040Mujtaba NickaIndia2026-05-09Rousseaux, Michael Esq QUALIFIED19Ioni Bowcher
1041Maria MarrierSpain2026-05-23Feiner Bros UNQUALIFIED12Xuxue Feng
1042Darci PoquetteCanada2026-04-30Morlong Associates PROPOSAL39Elwin Sharvill
1043Maisha RulapaughItaly2026-05-22Rangoni Of Florence NEGOTIATION85Stephen Shaw
1044Aruna FigeroaGermany2026-04-30Morlong Associates QUALIFIED98Stephen Shaw
1045James ButtGermany2026-05-10Truhlar And Truhlar Attys NEW42Bernardo Dominic
1046Wickens NestleRussia2026-05-09Chanay, Jeffrey A Esq NEGOTIATION63Bernardo Dominic
1047Jeanfrancois VenereFrance2026-05-22Dorl, James J Esq UNQUALIFIED34Ioni Bowcher
1048Jefferson SchemmerCanada2026-05-21Chapman, Ross E Esq UNQUALIFIED8Ioni Bowcher
1049Jennifer AmigonIndia2026-04-29Morlong Associates NEGOTIATION74Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Cody SaylorsUnited KingdomIoni Bowcher RENEWAL
Kaitlin OstroskyBrazilBernardo Dominic UNQUALIFIED
Isabel BowleyJapanAsiya Javayant NEGOTIATION
Ricardo GauchoJapanIoni Bowcher NEGOTIATION
Nicolas IturbideBrazilAnna Fali RENEWAL
Aika InouyeArgentinaAmy Elsner QUALIFIED
Julie StensethIndiaElwin Sharvill PROPOSAL
Kadeem FlosiJapanXuxue Feng QUALIFIED
Chavez BriddickSpainBernardo Dominic NEGOTIATION
Isabel BowleyBrazilAmy Elsner UNQUALIFIED
Francesco ShinkoIndiaBernardo Dominic PROPOSAL
Stacey MacleadUnited KingdomStephen Shaw NEW
Kadeem FlosiItalyIvan Magalhaes UNQUALIFIED
Arvin AlbaresJapanAnna Fali NEW
Sinclair WaycottFranceElwin Sharvill UNQUALIFIED
Claire TollnerIndiaBernardo Dominic QUALIFIED
Aditya KuskoAustraliaIoni Bowcher PROPOSAL
Leja CaldareraArgentinaIvan Magalhaes RENEWAL
Tony FollerBrazilOnyama Limba RENEWAL
Antonio CaudyBrazilIoni Bowcher RENEWAL
Darci PoquetteJapanElwin Sharvill NEGOTIATION
Deepesh ChuiAustraliaElwin Sharvill PROPOSAL
Jeanfrancois VenereCanadaAsiya Javayant NEW
Maisha RulapaughIndiaAnna Fali QUALIFIED
Jones VocelkaBrazilOnyama Limba PROPOSAL
Octavia MaletFranceAmy Elsner NEGOTIATION
Silvio SlusarskiJapanAmy Elsner NEW
Ashley DoeUnited KingdomIvan Magalhaes QUALIFIED
Rodrigues CampainSpainXuxue Feng PROPOSAL
Leja CaldareraItalyIvan Magalhaes NEW
Deepesh ChuiArgentinaAnna Fali RENEWAL
Faith GillianFranceOnyama Limba NEW
Rodrigues CampainGermanyOnyama Limba UNQUALIFIED
Isabel BowleyGermanyIvan Magalhaes NEW
Aruna FigeroaArgentinaAmy Elsner QUALIFIED
Jeanfrancois VenereFranceElwin Sharvill NEW
Johnson SergiIndiaBernardo Dominic UNQUALIFIED
Kadeem FlosiUnited KingdomIoni Bowcher NEGOTIATION
Mayumi KolmetzUnited KingdomXuxue Feng NEW
Mayumi KolmetzIndiaBernardo Dominic PROPOSAL
Costa DilliardCanadaStephen Shaw UNQUALIFIED
Silvio SlusarskiItalyBernardo Dominic PROPOSAL
Mujtaba NickaIndiaXuxue Feng QUALIFIED
Alejandro PerinRussiaBernardo Dominic NEW
James ButtGermanyBernardo Dominic NEW
Octavia MaletJapanIoni Bowcher UNQUALIFIED
Claire TollnerJapanAsiya Javayant UNQUALIFIED
Jeanfrancois VenereAustraliaXuxue Feng NEW
Arvin AlbaresGermanyAnna Fali QUALIFIED
Munro FerenczGermanyElwin Sharvill PROPOSAL
Frozen Columns
Name
Rodrigues Campain
Juan Wieser
Adams Morasca
Nicolas Iturbide
Stacey Maclead
Kaitlin Ostrosky
Wickens Nestle
Greenwood Bolognia
Deepesh Chui
Claire Tollner
Cody Saylors
Wickens Nestle
Arvin Albares
Jennifer Amigon
Julie Stenseth
Johnson Sergi
Costa Dilliard
Maisha Rulapaugh
Kadeem Flosi
Octavia Malet
Adams Morasca
Salvatore Stockham
Arvin Albares
James Butt
Wickens Nestle
Jennifer Amigon
Octavia Malet
Misaki Royster
Ricardo Gaucho
Ashley Doe
Darci Poquette
Tony Foller
Francesco Shinko
Ashley Doe
Alejandro Perin
Maria Marrier
Isabel Bowley
Octavia Malet
Stacey Maclead
Clifford Rim
Mujtaba Nicka
Antonio Caudy
Jeanfrancois Venere
Adams Morasca
Antonio Caudy
Clifford Rim
Aika Inouye
Tony Foller
Aditya Kusko
Sinclair Waycott
IdCountryDate
1000India2026-05-06
1001Australia2026-05-10
1002Russia2026-05-20
1003Australia2026-05-19
1004Italy2026-05-05
1005Spain2026-05-08
1006Canada2026-05-05
1007Canada2026-05-02
1008India2026-05-22
1009Spain2026-05-12
1010India2026-05-24
1011France2026-05-07
1012France2026-05-21
1013Germany2026-05-02
1014Germany2026-05-04
1015Spain2026-05-18
1016Brazil2026-05-03
1017Japan2026-05-08
1018Russia2026-05-21
1019United Kingdom2026-05-10
1020France2026-05-13
1021Spain2026-05-16
1022Brazil2026-05-05
1023United Kingdom2026-05-23
1024France2026-05-23
1025Australia2026-05-03
1026Spain2026-05-04
1027Spain2026-05-13
1028France2026-05-04
1029Australia2026-05-04
1030Argentina2026-05-10
1031Italy2026-05-21
1032Germany2026-05-03
1033India2026-04-28
1034Italy2026-04-25
1035Argentina2026-05-21
1036India2026-04-26
1037Australia2026-05-17
1038India2026-05-02
1039Australia2026-05-23
1040Australia2026-05-14
1041Germany2026-05-11
1042Canada2026-05-13
1043Italy2026-05-11
1044Argentina2026-04-29
1045France2026-04-28
1046Australia2026-05-19
1047Brazil2026-05-01
1048Brazil2026-05-15
1049Brazil2026-05-10

On-Demand Data

NameIdCountryDate
Salvatore Stockham1000Russia2026-04-27
Alejandro Perin1001India2026-05-20
Claire Tollner1002Germany2026-04-29
Greenwood Bolognia1003Russia2026-05-11
Claire Tollner1004India2026-05-19
Stacey Maclead1005Canada2026-05-08
Silvio Slusarski1006Spain2026-05-05
Antonio Caudy1007Russia2026-04-28
Antonio Caudy1008Germany2026-05-22
Leja Caldarera1009Italy2026-05-03
Adams Morasca1010Spain2026-04-29
Morrow Ruta1011France2026-05-07
Ricardo Gaucho1012Italy2026-05-21
Leon Oldroyd1013Australia2026-05-19
Faith Gillian1014Spain2026-04-28
Leja Caldarera1015Canada2026-04-29
Deepesh Chui1016Brazil2026-05-14
Sinclair Waycott1017Argentina2026-05-16
Maisha Rulapaugh1018Australia2026-05-08
Salvatore Stockham1019Argentina2026-05-07
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Claire TollnerItalyElwin Sharvill PROPOSAL
Jennifer AmigonBrazilBernardo Dominic NEW
Wickens NestleSpainAnna Fali NEGOTIATION
Isabel BowleyAustraliaAsiya Javayant NEW
Ashley DoeItalyOnyama Limba NEW
Arvin AlbaresRussiaIvan Magalhaes QUALIFIED
Mujtaba NickaIndiaElwin Sharvill PROPOSAL
Cody SaylorsItalyElwin Sharvill PROPOSAL
Misaki RoysterItalyIoni Bowcher NEGOTIATION
Maisha RulapaughCanadaIvan Magalhaes NEW
Misaki RoysterRussiaAnna Fali NEGOTIATION
Ricardo GauchoIndiaXuxue Feng RENEWAL
Misaki RoysterSpainStephen Shaw UNQUALIFIED
Mujtaba NickaItalyBernardo Dominic RENEWAL
Wickens NestleAustraliaAnna Fali NEGOTIATION
Antonio CaudyJapanAsiya Javayant UNQUALIFIED
Arvin AlbaresAustraliaElwin Sharvill UNQUALIFIED
Greenwood BologniaRussiaBernardo Dominic RENEWAL
Ricardo GauchoJapanStephen Shaw UNQUALIFIED
Aruna FigeroaUnited KingdomAmy Elsner RENEWAL
David DarakjyRussiaAnna Fali NEGOTIATION
Claire TollnerIndiaElwin Sharvill NEW
Octavia MaletCanadaBernardo Dominic PROPOSAL
Sinclair WaycottSpainIvan Magalhaes NEW
Aruna FigeroaRussiaElwin Sharvill NEW
Julie StensethAustraliaXuxue Feng NEGOTIATION
Munro FerenczJapanIoni Bowcher UNQUALIFIED
Salvatore StockhamAustraliaBernardo Dominic UNQUALIFIED
Antonio CaudyCanadaAsiya Javayant PROPOSAL
Julie StensethFranceAmy Elsner QUALIFIED
Tony FollerFranceAsiya Javayant PROPOSAL
Antonio CaudyArgentinaAmy Elsner NEGOTIATION
Arvin AlbaresAustraliaXuxue Feng PROPOSAL
Mujtaba NickaGermanyAmy Elsner QUALIFIED
Leon OldroydCanadaAnna Fali PROPOSAL
Misaki RoysterCanadaBernardo Dominic NEGOTIATION
Jones VocelkaSpainIoni Bowcher NEW
Morrow RutaArgentinaXuxue Feng UNQUALIFIED
Jennifer AmigonAustraliaElwin Sharvill PROPOSAL
Emily WhobreyItalyOnyama Limba 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>