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
Morrow RutaRussiaBernardo Dominic QUALIFIED
Tony FollerGermanyElwin Sharvill UNQUALIFIED
Salvatore StockhamAustraliaIvan Magalhaes NEGOTIATION
Octavia MaletRussiaAnna Fali QUALIFIED
Johnson SergiRussiaBernardo Dominic QUALIFIED
Jefferson SchemmerArgentinaAsiya Javayant NEW
Arvin AlbaresUnited KingdomAnna Fali NEGOTIATION
Aika InouyeUnited KingdomAsiya Javayant NEW
Kadeem FlosiJapanIoni Bowcher QUALIFIED
Arvin AlbaresCanadaElwin Sharvill NEW
Aditya KuskoCanadaAsiya Javayant NEGOTIATION
Tony FollerBrazilAsiya Javayant NEW
Alejandro PerinBrazilIoni Bowcher UNQUALIFIED
Emily WhobreySpainOnyama Limba PROPOSAL
Aika InouyeSpainStephen Shaw PROPOSAL
Ashley DoeFranceIvan Magalhaes PROPOSAL
Aika InouyeSpainXuxue Feng UNQUALIFIED
Adams MorascaIndiaAnna Fali NEGOTIATION
Aika InouyeFranceElwin Sharvill NEW
Cody SaylorsFranceBernardo Dominic QUALIFIED
Morrow RutaJapanIvan Magalhaes UNQUALIFIED
James ButtCanadaAsiya Javayant UNQUALIFIED
David DarakjyAustraliaBernardo Dominic NEW
Misaki RoysterGermanyAsiya Javayant QUALIFIED
Johnson SergiUnited KingdomOnyama Limba UNQUALIFIED
Claire TollnerSpainAsiya Javayant NEGOTIATION
Cody SaylorsAustraliaAsiya Javayant PROPOSAL
Juan WieserGermanyXuxue Feng UNQUALIFIED
Clifford RimSpainStephen Shaw PROPOSAL
Maria MarrierSpainAmy Elsner NEGOTIATION
Greenwood BologniaArgentinaOnyama Limba NEW
Claire TollnerCanadaAsiya Javayant UNQUALIFIED
Alejandro PerinBrazilStephen Shaw NEW
David DarakjyCanadaElwin Sharvill UNQUALIFIED
Ivar PaprockiUnited KingdomXuxue Feng RENEWAL
Ivar PaprockiGermanyAsiya Javayant RENEWAL
Aditya KuskoIndiaStephen Shaw PROPOSAL
Alejandro PerinArgentinaAmy Elsner QUALIFIED
Munro FerenczFranceStephen Shaw QUALIFIED
Johnson SergiFranceXuxue Feng NEW
Jeanfrancois VenereArgentinaIoni Bowcher UNQUALIFIED
Julie StensethItalyOnyama Limba UNQUALIFIED
Jones VocelkaRussiaXuxue Feng NEGOTIATION
Johnson SergiUnited KingdomAnna Fali PROPOSAL
Salvatore StockhamAustraliaIvan Magalhaes NEW
Chavez BriddickSpainBernardo Dominic NEGOTIATION
Aruna FigeroaIndiaAmy Elsner NEW
Faith GillianAustraliaElwin Sharvill NEGOTIATION
Misaki RoysterIndiaIoni Bowcher UNQUALIFIED
Jones VocelkaFranceStephen Shaw UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Chavez BriddickItalyXuxue Feng NEGOTIATION
Jefferson SchemmerRussiaBernardo Dominic PROPOSAL
Ashley DoeGermanyAnna Fali PROPOSAL
Kaitlin OstroskyGermanyAsiya Javayant NEGOTIATION
Chavez BriddickFranceXuxue Feng PROPOSAL
James ButtIndiaXuxue Feng QUALIFIED
Octavia MaletCanadaAnna Fali PROPOSAL
Ivar PaprockiFranceBernardo Dominic NEW
Kaitlin OstroskyCanadaStephen Shaw QUALIFIED
Stacey MacleadBrazilIvan Magalhaes QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Costa DilliardUnited Kingdom2026-05-03King, Christopher A Esq NEGOTIATION41Onyama Limba
1001Aditya KuskoAustralia2026-05-11Chanay, Jeffrey A Esq QUALIFIED16Anna Fali
1002Izzy GarufiBrazil2026-05-05Feltz Printing Service QUALIFIED97Bernardo Dominic
1003Nicolas IturbideAustralia2026-05-11Dorl, James J Esq NEW27Xuxue Feng
1004Greenwood BologniaBrazil2026-05-06Buckley Miller Wright NEW4Bernardo Dominic
1005Clifford RimAustralia2026-05-14Morlong Associates QUALIFIED70Elwin Sharvill
1006Alejandro PerinRussia2026-05-31Chanay, Jeffrey A Esq QUALIFIED62Stephen Shaw
1007Darci PoquetteRussia2026-05-28Feltz Printing Service UNQUALIFIED10Asiya Javayant
1008Greenwood BologniaAustralia2026-05-02Feltz Printing Service QUALIFIED88Ioni Bowcher
1009Jennifer AmigonCanada2026-05-06Chanay, Jeffrey A Esq QUALIFIED32Bernardo Dominic
1010Cody SaylorsFrance2026-05-30Chemel, James L Cpa NEW55Bernardo Dominic
1011Ashley DoeBrazil2026-05-25Rangoni Of Florence UNQUALIFIED91Xuxue Feng
1012Stacey MacleadAustralia2026-05-27Truhlar And Truhlar Attys UNQUALIFIED21Ivan Magalhaes
1013Aruna FigeroaJapan2026-05-28King, Christopher A Esq QUALIFIED45Amy Elsner
1014Octavia MaletItaly2026-05-31Commercial Press RENEWAL54Onyama Limba
1015Sinclair WaycottIndia2026-05-18Chanay, Jeffrey A Esq PROPOSAL29Elwin Sharvill
1016Mujtaba NickaRussia2026-05-30Feltz Printing Service PROPOSAL22Elwin Sharvill
1017Nicolas IturbideAustralia2026-05-16Feiner Bros UNQUALIFIED15Ivan Magalhaes
1018Munro FerenczUnited Kingdom2026-05-21King, Christopher A Esq RENEWAL11Anna Fali
1019Kaitlin OstroskyAustralia2026-05-14Chemel, James L Cpa PROPOSAL52Bernardo Dominic
1020Clifford RimFrance2026-05-18King, Christopher A Esq NEW67Bernardo Dominic
1021Juan WieserFrance2026-05-11Rousseaux, Michael Esq QUALIFIED67Stephen Shaw
1022Jennifer AmigonJapan2026-05-06Chapman, Ross E Esq PROPOSAL20Anna Fali
1023James ButtArgentina2026-05-03Chemel, James L Cpa UNQUALIFIED6Ivan Magalhaes
1024Jeanfrancois VenereRussia2026-05-10Chanay, Jeffrey A Esq PROPOSAL67Ivan Magalhaes
1025Salvatore StockhamArgentina2026-05-19Feiner Bros RENEWAL1Ivan Magalhaes
1026Isabel BowleyItaly2026-05-16Benton, John B Jr NEGOTIATION40Ioni Bowcher
1027Munro FerenczSpain2026-05-24Feiner Bros NEGOTIATION49Asiya Javayant
1028Aruna FigeroaArgentina2026-05-21Truhlar And Truhlar Attys PROPOSAL28Ivan Magalhaes
1029Maisha RulapaughFrance2026-05-30Feltz Printing Service RENEWAL3Ivan Magalhaes
1030Chavez BriddickRussia2026-05-31Rousseaux, Michael Esq NEW34Elwin Sharvill
1031Wickens NestleBrazil2026-05-30Rangoni Of Florence QUALIFIED16Anna Fali
1032Darci PoquetteFrance2026-05-23Chapman, Ross E Esq RENEWAL11Elwin Sharvill
1033Clifford RimFrance2026-05-19Chemel, James L Cpa PROPOSAL96Ioni Bowcher
1034Aika InouyeAustralia2026-05-04Feltz Printing Service QUALIFIED95Onyama Limba
1035Munro FerenczArgentina2026-05-21Benton, John B Jr NEW86Onyama Limba
1036Clifford RimBrazil2026-05-30Morlong Associates NEW3Amy Elsner
1037Francesco ShinkoSpain2026-05-23Commercial Press NEW65Ivan Magalhaes
1038Mayumi KolmetzFrance2026-05-13Chapman, Ross E Esq NEGOTIATION8Elwin Sharvill
1039Kaitlin OstroskySpain2026-05-18Chanay, Jeffrey A Esq UNQUALIFIED84Stephen Shaw
1040Faith GillianSpain2026-05-23Truhlar And Truhlar Attys QUALIFIED71Amy Elsner
1041Nicolas IturbideJapan2026-05-26Chapman, Ross E Esq QUALIFIED41Ioni Bowcher
1042James ButtArgentina2026-05-13Buckley Miller Wright RENEWAL44Elwin Sharvill
1043Salvatore StockhamItaly2026-05-20Commercial Press NEGOTIATION97Ioni Bowcher
1044Francesco ShinkoJapan2026-05-16Benton, John B Jr UNQUALIFIED91Stephen Shaw
1045David DarakjyJapan2026-05-26Commercial Press QUALIFIED94Ivan Magalhaes
1046Kaitlin OstroskyItaly2026-05-22Dorl, James J Esq RENEWAL30Xuxue Feng
1047Ivar PaprockiBrazil2026-05-31Feiner Bros NEGOTIATION56Bernardo Dominic
1048Mayumi KolmetzBrazil2026-05-20Benton, John B Jr QUALIFIED57Asiya Javayant
1049Maria MarrierBrazil2026-05-18Buckley Miller Wright UNQUALIFIED40Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Alejandro PerinUnited KingdomBernardo Dominic RENEWAL
Ricardo GauchoSpainAnna Fali UNQUALIFIED
Costa DilliardAustraliaOnyama Limba QUALIFIED
Arvin AlbaresFranceOnyama Limba NEW
Johnson SergiArgentinaStephen Shaw NEW
Jeanfrancois VenereArgentinaOnyama Limba UNQUALIFIED
Maisha RulapaughIndiaOnyama Limba NEW
Faith GillianArgentinaAsiya Javayant PROPOSAL
Claire TollnerRussiaElwin Sharvill UNQUALIFIED
Tony FollerAustraliaIvan Magalhaes QUALIFIED
Salvatore StockhamCanadaAmy Elsner NEW
Alejandro PerinItalyAsiya Javayant RENEWAL
Faith GillianSpainElwin Sharvill NEGOTIATION
Arvin AlbaresSpainOnyama Limba PROPOSAL
Faith GillianSpainXuxue Feng QUALIFIED
Leja CaldareraGermanyAnna Fali PROPOSAL
Sinclair WaycottSpainBernardo Dominic QUALIFIED
Cody SaylorsBrazilAnna Fali RENEWAL
Nicolas IturbideCanadaIvan Magalhaes QUALIFIED
Mayumi KolmetzFranceBernardo Dominic NEGOTIATION
Emily WhobreyAustraliaXuxue Feng NEGOTIATION
Murillo MaletIndiaElwin Sharvill NEGOTIATION
Ivar PaprockiBrazilIoni Bowcher QUALIFIED
Jennifer AmigonGermanyOnyama Limba QUALIFIED
Leon OldroydSpainXuxue Feng NEGOTIATION
Claire TollnerArgentinaAsiya Javayant UNQUALIFIED
Ashley DoeUnited KingdomIoni Bowcher QUALIFIED
Julie StensethRussiaIvan Magalhaes QUALIFIED
Silvio SlusarskiSpainBernardo Dominic QUALIFIED
Deepesh ChuiArgentinaBernardo Dominic NEGOTIATION
Kadeem FlosiSpainElwin Sharvill NEW
Morrow RutaUnited KingdomElwin Sharvill NEW
Maria MarrierItalyAmy Elsner RENEWAL
Nicolas IturbideFranceXuxue Feng RENEWAL
Clifford RimItalyAmy Elsner UNQUALIFIED
Izzy GarufiIndiaAnna Fali UNQUALIFIED
Leja CaldareraGermanyXuxue Feng RENEWAL
Maisha RulapaughJapanAmy Elsner RENEWAL
Arvin AlbaresJapanElwin Sharvill QUALIFIED
Morrow RutaJapanStephen Shaw UNQUALIFIED
Mujtaba NickaGermanyIoni Bowcher NEGOTIATION
Isabel BowleyUnited KingdomIvan Magalhaes NEW
James ButtFranceStephen Shaw NEW
Deepesh ChuiSpainIoni Bowcher NEW
Munro FerenczRussiaIvan Magalhaes NEGOTIATION
Juan WieserCanadaElwin Sharvill NEW
Arvin AlbaresItalyElwin Sharvill PROPOSAL
Kaitlin OstroskyItalyXuxue Feng PROPOSAL
Emily WhobreyRussiaAmy Elsner NEW
Francesco ShinkoCanadaOnyama Limba UNQUALIFIED
Frozen Columns
Name
Faith Gillian
Julie Stenseth
Jones Vocelka
Arvin Albares
Antonio Caudy
Jones Vocelka
Morrow Ruta
Faith Gillian
Stacey Maclead
Johnson Sergi
Aruna Figeroa
Izzy Garufi
Mayumi Kolmetz
Deepesh Chui
Misaki Royster
Jefferson Schemmer
Arvin Albares
Wickens Nestle
Ivar Paprocki
David Darakjy
Adams Morasca
Chavez Briddick
Wickens Nestle
Francesco Shinko
Izzy Garufi
Kadeem Flosi
Wickens Nestle
Greenwood Bolognia
Octavia Malet
Leon Oldroyd
David Darakjy
Aditya Kusko
James Butt
Nicolas Iturbide
Kadeem Flosi
Murillo Malet
Julie Stenseth
Salvatore Stockham
Julie Stenseth
Munro Ferencz
Francesco Shinko
Kadeem Flosi
Munro Ferencz
Smith Glick
Claire Tollner
Maisha Rulapaugh
Claire Tollner
Aditya Kusko
Maisha Rulapaugh
Maisha Rulapaugh
IdCountryDate
1000United Kingdom2026-05-28
1001Argentina2026-05-22
1002Australia2026-05-11
1003France2026-05-19
1004Brazil2026-05-19
1005Germany2026-05-15
1006Italy2026-05-17
1007Brazil2026-05-17
1008Russia2026-05-15
1009Spain2026-05-17
1010India2026-05-07
1011Australia2026-05-18
1012Canada2026-05-20
1013Russia2026-05-19
1014Brazil2026-05-29
1015India2026-05-05
1016Australia2026-05-14
1017Germany2026-05-18
1018Canada2026-05-05
1019Spain2026-05-26
1020United Kingdom2026-05-13
1021Spain2026-05-16
1022Spain2026-05-14
1023India2026-05-09
1024Brazil2026-05-25
1025France2026-05-24
1026Argentina2026-05-18
1027Spain2026-05-24
1028Italy2026-05-19
1029Australia2026-05-29
1030Argentina2026-05-26
1031France2026-05-25
1032France2026-05-31
1033Canada2026-05-30
1034France2026-05-10
1035France2026-05-10
1036France2026-05-25
1037France2026-05-02
1038United Kingdom2026-05-08
1039Italy2026-05-21
1040Brazil2026-05-19
1041Argentina2026-05-21
1042Argentina2026-05-13
1043Germany2026-05-06
1044Germany2026-05-21
1045Russia2026-05-28
1046Brazil2026-05-31
1047France2026-05-02
1048Australia2026-05-03
1049Argentina2026-05-25

On-Demand Data

NameIdCountryDate
Jefferson Schemmer1000France2026-05-12
Costa Dilliard1001India2026-05-26
Antonio Caudy1002Japan2026-05-25
Murillo Malet1003United Kingdom2026-05-22
Nicolas Iturbide1004Russia2026-05-27
Munro Ferencz1005Canada2026-05-20
Maisha Rulapaugh1006Spain2026-05-14
Munro Ferencz1007Argentina2026-05-28
Nicolas Iturbide1008United Kingdom2026-05-30
Julie Stenseth1009France2026-05-15
Ivar Paprocki1010Spain2026-05-19
Jeanfrancois Venere1011Germany2026-05-27
Leja Caldarera1012Australia2026-05-05
Munro Ferencz1013Germany2026-05-20
Antonio Caudy1014Germany2026-05-29
Greenwood Bolognia1015Japan2026-05-12
Smith Glick1016Germany2026-05-12
Rodrigues Campain1017Argentina2026-05-18
Darci Poquette1018Italy2026-05-16
Faith Gillian1019Germany2026-05-16
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Leon OldroydFranceAmy Elsner UNQUALIFIED
Nicolas IturbideBrazilXuxue Feng PROPOSAL
Emily WhobreyIndiaBernardo Dominic NEGOTIATION
Ivar PaprockiArgentinaAsiya Javayant UNQUALIFIED
Jefferson SchemmerItalyBernardo Dominic QUALIFIED
Nicolas IturbideRussiaOnyama Limba UNQUALIFIED
Ashley DoeUnited KingdomIoni Bowcher NEGOTIATION
Murillo MaletFranceAmy Elsner PROPOSAL
Julie StensethJapanIoni Bowcher RENEWAL
Stacey MacleadGermanyStephen Shaw UNQUALIFIED
Chavez BriddickAustraliaAmy Elsner QUALIFIED
Greenwood BologniaSpainOnyama Limba QUALIFIED
Julie StensethSpainElwin Sharvill NEGOTIATION
Nicolas IturbideUnited KingdomBernardo Dominic RENEWAL
Mayumi KolmetzArgentinaOnyama Limba NEGOTIATION
Francesco ShinkoSpainAmy Elsner UNQUALIFIED
Adams MorascaBrazilElwin Sharvill QUALIFIED
Faith GillianFranceAnna Fali QUALIFIED
Octavia MaletGermanyAsiya Javayant NEW
Antonio CaudyCanadaOnyama Limba NEGOTIATION
James ButtItalyElwin Sharvill PROPOSAL
Mujtaba NickaAustraliaXuxue Feng QUALIFIED
Mayumi KolmetzGermanyXuxue Feng QUALIFIED
Aika InouyeAustraliaStephen Shaw RENEWAL
Izzy GarufiAustraliaAnna Fali PROPOSAL
Cody SaylorsItalyOnyama Limba NEGOTIATION
Sinclair WaycottFranceStephen Shaw NEGOTIATION
Salvatore StockhamGermanyAnna Fali NEW
Emily WhobreyItalyIoni Bowcher QUALIFIED
Isabel BowleyIndiaOnyama Limba RENEWAL
Morrow RutaFranceIvan Magalhaes PROPOSAL
Ricardo GauchoAustraliaElwin Sharvill QUALIFIED
Antonio CaudyBrazilOnyama Limba NEGOTIATION
Antonio CaudyIndiaStephen Shaw NEGOTIATION
Chavez BriddickJapanElwin Sharvill PROPOSAL
Johnson SergiUnited KingdomOnyama Limba NEGOTIATION
Ricardo GauchoJapanBernardo Dominic RENEWAL
Rodrigues CampainFranceIvan Magalhaes UNQUALIFIED
Misaki RoysterCanadaAmy Elsner NEGOTIATION
Leon OldroydCanadaIoni Bowcher 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>