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 MarrierFranceXuxue Feng RENEWAL
Darci PoquetteItalyElwin Sharvill QUALIFIED
Nicolas IturbideItalyAmy Elsner UNQUALIFIED
Ivar PaprockiIndiaOnyama Limba QUALIFIED
Leon OldroydJapanXuxue Feng PROPOSAL
Chavez BriddickUnited KingdomAsiya Javayant UNQUALIFIED
Stacey MacleadBrazilElwin Sharvill NEW
Misaki RoysterArgentinaAsiya Javayant UNQUALIFIED
David DarakjyRussiaIoni Bowcher QUALIFIED
James ButtUnited KingdomAnna Fali QUALIFIED
Adams MorascaArgentinaElwin Sharvill UNQUALIFIED
Nicolas IturbideArgentinaAsiya Javayant PROPOSAL
Darci PoquetteRussiaAsiya Javayant NEGOTIATION
Izzy GarufiIndiaStephen Shaw QUALIFIED
Costa DilliardIndiaOnyama Limba UNQUALIFIED
Emily WhobreyBrazilIoni Bowcher NEW
Darci PoquetteCanadaIvan Magalhaes UNQUALIFIED
Maria MarrierItalyBernardo Dominic NEGOTIATION
Johnson SergiUnited KingdomAsiya Javayant PROPOSAL
Jeanfrancois VenereAustraliaStephen Shaw NEGOTIATION
Rodrigues CampainFranceIvan Magalhaes QUALIFIED
Emily WhobreyItalyIvan Magalhaes QUALIFIED
Juan WieserAustraliaXuxue Feng PROPOSAL
Cody SaylorsAustraliaOnyama Limba PROPOSAL
Munro FerenczSpainIoni Bowcher UNQUALIFIED
Tony FollerGermanyStephen Shaw UNQUALIFIED
Julie StensethSpainIoni Bowcher UNQUALIFIED
Antonio CaudyAustraliaOnyama Limba NEGOTIATION
Murillo MaletFranceBernardo Dominic NEGOTIATION
Greenwood BologniaRussiaAsiya Javayant PROPOSAL
Misaki RoysterAustraliaElwin Sharvill PROPOSAL
Misaki RoysterItalyXuxue Feng RENEWAL
Faith GillianIndiaBernardo Dominic RENEWAL
Clifford RimIndiaXuxue Feng NEW
Smith GlickRussiaAmy Elsner QUALIFIED
Jennifer AmigonJapanElwin Sharvill PROPOSAL
Claire TollnerUnited KingdomIoni Bowcher UNQUALIFIED
James ButtIndiaElwin Sharvill PROPOSAL
Costa DilliardAustraliaOnyama Limba PROPOSAL
Leja CaldareraCanadaIoni Bowcher NEW
Nicolas IturbideSpainBernardo Dominic UNQUALIFIED
Tony FollerUnited KingdomAnna Fali QUALIFIED
Munro FerenczArgentinaAnna Fali QUALIFIED
James ButtRussiaAmy Elsner NEW
Julie StensethArgentinaAsiya Javayant PROPOSAL
Munro FerenczBrazilIoni Bowcher PROPOSAL
Izzy GarufiJapanBernardo Dominic NEW
Stacey MacleadUnited KingdomIoni Bowcher NEW
Rodrigues CampainAustraliaIoni Bowcher NEGOTIATION
Aika InouyeRussiaBernardo Dominic NEW
Horizontal
NameCountryRepresentativeStatus
Jennifer AmigonGermanyElwin Sharvill UNQUALIFIED
Ivar PaprockiSpainIvan Magalhaes QUALIFIED
Faith GillianBrazilStephen Shaw PROPOSAL
Chavez BriddickItalyAsiya Javayant RENEWAL
Alejandro PerinCanadaAsiya Javayant PROPOSAL
Leon OldroydGermanyBernardo Dominic RENEWAL
Wickens NestleFranceStephen Shaw QUALIFIED
Kaitlin OstroskyJapanAsiya Javayant NEW
Octavia MaletUnited KingdomIoni Bowcher PROPOSAL
Johnson SergiCanadaAmy Elsner NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Murillo MaletIndia2026-04-15Printing Dimensions QUALIFIED7Ivan Magalhaes
1001Cody SaylorsRussia2026-04-04Truhlar And Truhlar Attys NEGOTIATION25Bernardo Dominic
1002Adams MorascaSpain2026-04-16Morlong Associates NEGOTIATION24Ioni Bowcher
1003Octavia MaletBrazil2026-04-21Chapman, Ross E Esq PROPOSAL55Elwin Sharvill
1004Antonio CaudyJapan2026-03-24Printing Dimensions RENEWAL53Onyama Limba
1005Smith GlickSpain2026-04-02Dorl, James J Esq UNQUALIFIED65Ioni Bowcher
1006Arvin AlbaresIndia2026-04-08Buckley Miller Wright RENEWAL72Bernardo Dominic
1007Leon OldroydItaly2026-04-05Rangoni Of Florence RENEWAL94Asiya Javayant
1008Jefferson SchemmerBrazil2026-04-01Chanay, Jeffrey A Esq NEGOTIATION93Ivan Magalhaes
1009Jefferson SchemmerRussia2026-04-18King, Christopher A Esq RENEWAL53Ivan Magalhaes
1010Johnson SergiSpain2026-04-08Printing Dimensions NEGOTIATION2Onyama Limba
1011Arvin AlbaresArgentina2026-04-19Rousseaux, Michael Esq UNQUALIFIED1Onyama Limba
1012Arvin AlbaresCanada2026-04-11King, Christopher A Esq NEW44Xuxue Feng
1013Kaitlin OstroskyItaly2026-03-28Rangoni Of Florence PROPOSAL80Amy Elsner
1014Kaitlin OstroskySpain2026-03-23Feltz Printing Service RENEWAL41Onyama Limba
1015Ricardo GauchoItaly2026-04-21Feltz Printing Service QUALIFIED1Onyama Limba
1016Francesco ShinkoFrance2026-04-14Feiner Bros RENEWAL1Amy Elsner
1017Mayumi KolmetzBrazil2026-03-23Buckley Miller Wright PROPOSAL16Ioni Bowcher
1018Aditya KuskoSpain2026-04-19Chemel, James L Cpa QUALIFIED5Ioni Bowcher
1019James ButtGermany2026-04-09Rousseaux, Michael Esq NEGOTIATION11Onyama Limba
1020Jennifer AmigonJapan2026-04-04Commercial Press PROPOSAL56Stephen Shaw
1021Sinclair WaycottIndia2026-03-26King, Christopher A Esq NEW57Amy Elsner
1022Octavia MaletAustralia2026-04-03Buckley Miller Wright UNQUALIFIED59Onyama Limba
1023David DarakjyCanada2026-03-24Rousseaux, Michael Esq NEW88Ivan Magalhaes
1024Julie StensethBrazil2026-04-14Rangoni Of Florence NEGOTIATION86Ioni Bowcher
1025Clifford RimGermany2026-04-17Chapman, Ross E Esq UNQUALIFIED21Bernardo Dominic
1026Rodrigues CampainGermany2026-04-14Feltz Printing Service NEW62Ioni Bowcher
1027Claire TollnerUnited Kingdom2026-04-20Chapman, Ross E Esq UNQUALIFIED91Amy Elsner
1028Faith GillianGermany2026-04-19Rangoni Of Florence PROPOSAL70Stephen Shaw
1029Kadeem FlosiJapan2026-04-15King, Christopher A Esq NEGOTIATION39Ivan Magalhaes
1030Mujtaba NickaFrance2026-03-27Feltz Printing Service RENEWAL76Xuxue Feng
1031Alejandro PerinUnited Kingdom2026-04-13Dorl, James J Esq NEW33Onyama Limba
1032Murillo MaletCanada2026-04-15Truhlar And Truhlar Attys UNQUALIFIED99Ioni Bowcher
1033Costa DilliardSpain2026-04-04Chapman, Ross E Esq QUALIFIED9Ivan Magalhaes
1034Wickens NestleArgentina2026-04-14Feltz Printing Service NEGOTIATION33Asiya Javayant
1035Murillo MaletFrance2026-03-26Feiner Bros PROPOSAL60Ivan Magalhaes
1036Ivar PaprockiRussia2026-04-18Benton, John B Jr UNQUALIFIED28Anna Fali
1037Isabel BowleyItaly2026-03-24Chemel, James L Cpa QUALIFIED41Asiya Javayant
1038Deepesh ChuiItaly2026-04-17Morlong Associates NEGOTIATION56Bernardo Dominic
1039Jefferson SchemmerUnited Kingdom2026-03-29Rousseaux, Michael Esq RENEWAL29Stephen Shaw
1040Emily WhobreyGermany2026-04-17Feiner Bros PROPOSAL86Asiya Javayant
1041Isabel BowleyJapan2026-04-06Feiner Bros RENEWAL4Xuxue Feng
1042Deepesh ChuiFrance2026-04-14Chapman, Ross E Esq RENEWAL67Elwin Sharvill
1043Nicolas IturbideItaly2026-03-28Dorl, James J Esq QUALIFIED49Bernardo Dominic
1044Kadeem FlosiCanada2026-04-21Rousseaux, Michael Esq PROPOSAL37Anna Fali
1045Wickens NestleBrazil2026-04-08Rousseaux, Michael Esq RENEWAL83Xuxue Feng
1046Jeanfrancois VenereJapan2026-03-24Commercial Press NEGOTIATION76Ivan Magalhaes
1047Ivar PaprockiBrazil2026-04-02Rangoni Of Florence RENEWAL4Onyama Limba
1048Leon OldroydBrazil2026-04-15Morlong Associates NEW9Ivan Magalhaes
1049Claire TollnerAustralia2026-04-19Morlong Associates RENEWAL30Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Alejandro PerinJapanIoni Bowcher PROPOSAL
Antonio CaudyJapanOnyama Limba RENEWAL
Juan WieserJapanOnyama Limba QUALIFIED
Maisha RulapaughCanadaAmy Elsner QUALIFIED
Wickens NestleRussiaXuxue Feng QUALIFIED
Tony FollerRussiaStephen Shaw QUALIFIED
Julie StensethFranceBernardo Dominic NEGOTIATION
Ivar PaprockiIndiaAsiya Javayant NEGOTIATION
Kadeem FlosiItalyXuxue Feng QUALIFIED
Smith GlickRussiaStephen Shaw RENEWAL
Clifford RimGermanyAnna Fali NEGOTIATION
Isabel BowleyUnited KingdomIoni Bowcher NEGOTIATION
Rodrigues CampainJapanIvan Magalhaes UNQUALIFIED
Mujtaba NickaBrazilStephen Shaw NEGOTIATION
Aditya KuskoGermanyBernardo Dominic PROPOSAL
Chavez BriddickArgentinaElwin Sharvill NEW
Faith GillianRussiaIvan Magalhaes UNQUALIFIED
Aruna FigeroaFranceAsiya Javayant QUALIFIED
Mujtaba NickaIndiaOnyama Limba NEW
Arvin AlbaresAustraliaStephen Shaw NEW
Leon OldroydGermanyIvan Magalhaes PROPOSAL
Juan WieserAustraliaAsiya Javayant NEGOTIATION
Mayumi KolmetzGermanyXuxue Feng NEGOTIATION
Clifford RimBrazilAnna Fali RENEWAL
Munro FerenczJapanElwin Sharvill UNQUALIFIED
Ricardo GauchoIndiaAsiya Javayant NEGOTIATION
Greenwood BologniaUnited KingdomOnyama Limba RENEWAL
Leja CaldareraJapanOnyama Limba PROPOSAL
Salvatore StockhamRussiaAnna Fali NEW
Jones VocelkaItalyStephen Shaw QUALIFIED
Nicolas IturbideBrazilXuxue Feng RENEWAL
Sinclair WaycottFranceIvan Magalhaes RENEWAL
Maisha RulapaughAustraliaAsiya Javayant NEGOTIATION
Costa DilliardUnited KingdomStephen Shaw UNQUALIFIED
Chavez BriddickIndiaAnna Fali PROPOSAL
Leja CaldareraSpainBernardo Dominic RENEWAL
Costa DilliardSpainStephen Shaw NEW
Tony FollerAustraliaBernardo Dominic UNQUALIFIED
Cody SaylorsJapanStephen Shaw NEGOTIATION
Nicolas IturbideSpainAmy Elsner NEW
Johnson SergiCanadaAmy Elsner NEGOTIATION
Antonio CaudyBrazilStephen Shaw PROPOSAL
Octavia MaletSpainAnna Fali NEGOTIATION
Cody SaylorsItalyOnyama Limba NEW
Jones VocelkaItalyAsiya Javayant UNQUALIFIED
Aika InouyeAustraliaIoni Bowcher PROPOSAL
Clifford RimArgentinaAmy Elsner UNQUALIFIED
Jefferson SchemmerItalyAmy Elsner PROPOSAL
Morrow RutaArgentinaAnna Fali UNQUALIFIED
Isabel BowleyItalyIvan Magalhaes UNQUALIFIED
Frozen Columns
Name
Morrow Ruta
Stacey Maclead
Ricardo Gaucho
Chavez Briddick
Nicolas Iturbide
Maisha Rulapaugh
Isabel Bowley
Maria Marrier
Aditya Kusko
Cody Saylors
Nicolas Iturbide
Aika Inouye
Octavia Malet
Munro Ferencz
Isabel Bowley
Costa Dilliard
Silvio Slusarski
Ivar Paprocki
Aruna Figeroa
Mayumi Kolmetz
Johnson Sergi
Isabel Bowley
Smith Glick
Juan Wieser
Salvatore Stockham
Johnson Sergi
Sinclair Waycott
Jeanfrancois Venere
Ivar Paprocki
Aditya Kusko
Stacey Maclead
Costa Dilliard
Aruna Figeroa
Izzy Garufi
Aika Inouye
Smith Glick
Smith Glick
Leja Caldarera
Octavia Malet
Kadeem Flosi
Leon Oldroyd
Izzy Garufi
Aditya Kusko
Chavez Briddick
Morrow Ruta
Mayumi Kolmetz
Ricardo Gaucho
Isabel Bowley
Kaitlin Ostrosky
Ivar Paprocki
IdCountryDate
1000France2026-03-27
1001France2026-04-02
1002Germany2026-03-31
1003India2026-04-19
1004Australia2026-03-31
1005Russia2026-04-13
1006Australia2026-04-21
1007Canada2026-04-01
1008Canada2026-03-28
1009Argentina2026-03-25
1010France2026-03-23
1011Spain2026-03-26
1012Germany2026-04-17
1013Germany2026-04-06
1014Canada2026-04-05
1015Italy2026-03-27
1016France2026-04-11
1017Argentina2026-04-20
1018France2026-04-09
1019Spain2026-03-28
1020France2026-04-15
1021Argentina2026-04-06
1022Russia2026-03-25
1023Germany2026-04-06
1024Germany2026-04-06
1025Italy2026-04-08
1026Brazil2026-04-02
1027Italy2026-04-18
1028Australia2026-03-31
1029Japan2026-04-05
1030Brazil2026-04-14
1031Japan2026-04-15
1032Australia2026-04-07
1033France2026-04-07
1034Brazil2026-04-13
1035Japan2026-03-30
1036Russia2026-03-29
1037India2026-04-21
1038France2026-03-23
1039India2026-03-30
1040Brazil2026-04-14
1041Canada2026-04-08
1042Australia2026-03-31
1043India2026-03-26
1044Japan2026-04-15
1045Japan2026-03-29
1046Canada2026-04-03
1047France2026-04-21
1048Russia2026-04-05
1049Canada2026-04-02

On-Demand Data

NameIdCountryDate
Leon Oldroyd1000Australia2026-04-17
Izzy Garufi1001Canada2026-03-31
Izzy Garufi1002France2026-03-23
Ricardo Gaucho1003Brazil2026-04-21
Wickens Nestle1004Spain2026-04-05
Tony Foller1005Brazil2026-03-24
Jefferson Schemmer1006France2026-04-02
Kaitlin Ostrosky1007Argentina2026-04-07
Misaki Royster1008France2026-04-09
Mujtaba Nicka1009United Kingdom2026-04-04
Aruna Figeroa1010Japan2026-03-30
Nicolas Iturbide1011Italy2026-04-18
Aika Inouye1012Spain2026-04-01
Arvin Albares1013Russia2026-04-21
Izzy Garufi1014Brazil2026-03-24
Isabel Bowley1015India2026-03-30
Juan Wieser1016Germany2026-04-16
Mujtaba Nicka1017France2026-04-13
Darci Poquette1018Spain2026-04-08
Julie Stenseth1019Brazil2026-04-13
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Cody SaylorsRussiaOnyama Limba UNQUALIFIED
Ivar PaprockiGermanyOnyama Limba NEGOTIATION
Greenwood BologniaJapanAsiya Javayant NEGOTIATION
Jones VocelkaUnited KingdomIvan Magalhaes UNQUALIFIED
Francesco ShinkoSpainElwin Sharvill PROPOSAL
Ricardo GauchoJapanBernardo Dominic NEGOTIATION
Julie StensethArgentinaIvan Magalhaes PROPOSAL
Francesco ShinkoAustraliaStephen Shaw NEGOTIATION
Ricardo GauchoArgentinaOnyama Limba QUALIFIED
Stacey MacleadUnited KingdomXuxue Feng UNQUALIFIED
Silvio SlusarskiBrazilAnna Fali PROPOSAL
Darci PoquetteUnited KingdomAnna Fali NEW
Isabel BowleyUnited KingdomIvan Magalhaes NEGOTIATION
Alejandro PerinGermanyAnna Fali QUALIFIED
Ashley DoeArgentinaXuxue Feng UNQUALIFIED
Juan WieserJapanXuxue Feng RENEWAL
Jennifer AmigonAustraliaOnyama Limba NEGOTIATION
Cody SaylorsGermanyAsiya Javayant QUALIFIED
Alejandro PerinArgentinaAmy Elsner QUALIFIED
Jennifer AmigonIndiaIoni Bowcher QUALIFIED
Wickens NestleJapanXuxue Feng RENEWAL
Emily WhobreyIndiaOnyama Limba QUALIFIED
Sinclair WaycottJapanAmy Elsner PROPOSAL
Maria MarrierArgentinaAmy Elsner QUALIFIED
Misaki RoysterJapanIvan Magalhaes PROPOSAL
Antonio CaudyJapanAsiya Javayant NEGOTIATION
Julie StensethRussiaAnna Fali QUALIFIED
Adams MorascaIndiaStephen Shaw QUALIFIED
Alejandro PerinItalyAsiya Javayant PROPOSAL
Silvio SlusarskiArgentinaAsiya Javayant RENEWAL
Cody SaylorsUnited KingdomAnna Fali NEW
Kadeem FlosiAustraliaIoni Bowcher UNQUALIFIED
Arvin AlbaresAustraliaBernardo Dominic NEGOTIATION
Izzy GarufiUnited KingdomElwin Sharvill QUALIFIED
Ricardo GauchoGermanyIoni Bowcher PROPOSAL
Mayumi KolmetzUnited KingdomStephen Shaw PROPOSAL
Maria MarrierRussiaIvan Magalhaes NEGOTIATION
Cody SaylorsGermanyOnyama Limba RENEWAL
Cody SaylorsCanadaXuxue Feng NEW
Aditya KuskoSpainBernardo Dominic NEGOTIATION

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