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
Cody SaylorsJapanStephen Shaw QUALIFIED
Misaki RoysterItalyAnna Fali QUALIFIED
James ButtCanadaIoni Bowcher QUALIFIED
Claire TollnerCanadaXuxue Feng QUALIFIED
Wickens NestleIndiaXuxue Feng PROPOSAL
Misaki RoysterArgentinaElwin Sharvill RENEWAL
Kaitlin OstroskyRussiaAmy Elsner UNQUALIFIED
Tony FollerIndiaOnyama Limba NEW
Clifford RimIndiaAnna Fali QUALIFIED
Ashley DoeBrazilStephen Shaw RENEWAL
Rodrigues CampainJapanAsiya Javayant RENEWAL
Kadeem FlosiArgentinaOnyama Limba QUALIFIED
Ashley DoeGermanyIoni Bowcher QUALIFIED
Julie StensethArgentinaAsiya Javayant UNQUALIFIED
Faith GillianIndiaXuxue Feng UNQUALIFIED
Aruna FigeroaCanadaBernardo Dominic NEGOTIATION
Izzy GarufiCanadaXuxue Feng PROPOSAL
Murillo MaletArgentinaIoni Bowcher NEGOTIATION
Kaitlin OstroskyGermanyIvan Magalhaes QUALIFIED
Leja CaldareraJapanOnyama Limba RENEWAL
Silvio SlusarskiCanadaAsiya Javayant QUALIFIED
Emily WhobreyIndiaAsiya Javayant PROPOSAL
Faith GillianBrazilAsiya Javayant RENEWAL
Jeanfrancois VenereJapanElwin Sharvill RENEWAL
Costa DilliardFranceXuxue Feng PROPOSAL
Johnson SergiCanadaAnna Fali RENEWAL
Darci PoquetteItalyIvan Magalhaes UNQUALIFIED
David DarakjyBrazilXuxue Feng RENEWAL
Smith GlickAustraliaStephen Shaw RENEWAL
Mujtaba NickaIndiaXuxue Feng NEGOTIATION
Francesco ShinkoIndiaIoni Bowcher RENEWAL
Chavez BriddickItalyOnyama Limba RENEWAL
Izzy GarufiFranceIvan Magalhaes PROPOSAL
Morrow RutaUnited KingdomOnyama Limba NEW
Arvin AlbaresSpainIvan Magalhaes NEW
Ricardo GauchoRussiaBernardo Dominic QUALIFIED
Tony FollerRussiaAsiya Javayant QUALIFIED
Leja CaldareraItalyXuxue Feng NEGOTIATION
James ButtSpainIoni Bowcher PROPOSAL
Kaitlin OstroskyJapanIoni Bowcher RENEWAL
Jefferson SchemmerGermanyAmy Elsner RENEWAL
Julie StensethJapanAsiya Javayant QUALIFIED
Ivar PaprockiAustraliaIoni Bowcher RENEWAL
Octavia MaletAustraliaAsiya Javayant NEGOTIATION
Alejandro PerinUnited KingdomXuxue Feng UNQUALIFIED
Jennifer AmigonSpainOnyama Limba UNQUALIFIED
Izzy GarufiJapanBernardo Dominic NEGOTIATION
Kaitlin OstroskyGermanyIoni Bowcher UNQUALIFIED
Ivar PaprockiItalyAnna Fali UNQUALIFIED
Francesco ShinkoArgentinaOnyama Limba UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Aditya KuskoArgentinaIoni Bowcher QUALIFIED
Murillo MaletArgentinaElwin Sharvill NEGOTIATION
Greenwood BologniaRussiaAmy Elsner NEGOTIATION
Deepesh ChuiJapanIoni Bowcher UNQUALIFIED
Murillo MaletBrazilBernardo Dominic NEW
Kadeem FlosiUnited KingdomAnna Fali UNQUALIFIED
Octavia MaletAustraliaIoni Bowcher QUALIFIED
Darci PoquetteAustraliaIvan Magalhaes PROPOSAL
Smith GlickAustraliaOnyama Limba PROPOSAL
Ricardo GauchoItalyOnyama Limba UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Rodrigues CampainBrazil2026-04-09Rangoni Of Florence UNQUALIFIED50Stephen Shaw
1001Ivar PaprockiIndia2026-04-06Chanay, Jeffrey A Esq UNQUALIFIED77Stephen Shaw
1002Sinclair WaycottUnited Kingdom2026-04-18Dorl, James J Esq PROPOSAL87Bernardo Dominic
1003Smith GlickBrazil2026-04-09Benton, John B Jr NEW45Ivan Magalhaes
1004Misaki RoysterIndia2026-04-19Benton, John B Jr NEGOTIATION75Stephen Shaw
1005Mujtaba NickaFrance2026-04-19Commercial Press QUALIFIED34Elwin Sharvill
1006Ashley DoeBrazil2026-04-05Chemel, James L Cpa NEGOTIATION10Anna Fali
1007Mayumi KolmetzArgentina2026-03-25Feltz Printing Service RENEWAL12Amy Elsner
1008Wickens NestleUnited Kingdom2026-03-24Morlong Associates QUALIFIED91Anna Fali
1009Tony FollerIndia2026-04-07Rousseaux, Michael Esq NEGOTIATION3Xuxue Feng
1010Francesco ShinkoAustralia2026-03-23Morlong Associates NEGOTIATION21Ivan Magalhaes
1011Francesco ShinkoArgentina2026-04-06Dorl, James J Esq NEGOTIATION28Ivan Magalhaes
1012Arvin AlbaresFrance2026-04-19King, Christopher A Esq NEGOTIATION95Stephen Shaw
1013Deepesh ChuiItaly2026-04-09Commercial Press PROPOSAL44Onyama Limba
1014Emily WhobreyBrazil2026-04-10Buckley Miller Wright RENEWAL37Onyama Limba
1015Arvin AlbaresArgentina2026-04-04Morlong Associates PROPOSAL60Amy Elsner
1016Darci PoquetteBrazil2026-03-28Feltz Printing Service NEW12Ivan Magalhaes
1017Stacey MacleadBrazil2026-04-08Rousseaux, Michael Esq RENEWAL11Ioni Bowcher
1018Claire TollnerFrance2026-04-03Benton, John B Jr QUALIFIED29Anna Fali
1019Leon OldroydIndia2026-04-04Chapman, Ross E Esq NEGOTIATION89Onyama Limba
1020Arvin AlbaresItaly2026-04-12Buckley Miller Wright PROPOSAL42Elwin Sharvill
1021Leon OldroydCanada2026-04-13Benton, John B Jr QUALIFIED41Stephen Shaw
1022David DarakjyUnited Kingdom2026-03-24Chapman, Ross E Esq NEW52Stephen Shaw
1023Leon OldroydFrance2026-04-06Rousseaux, Michael Esq RENEWAL58Stephen Shaw
1024Arvin AlbaresArgentina2026-04-01Dorl, James J Esq NEGOTIATION88Elwin Sharvill
1025Aruna FigeroaGermany2026-04-07Benton, John B Jr UNQUALIFIED88Asiya Javayant
1026James ButtArgentina2026-03-31Feiner Bros RENEWAL60Elwin Sharvill
1027Leja CaldareraRussia2026-03-29Feltz Printing Service PROPOSAL38Asiya Javayant
1028Alejandro PerinCanada2026-03-28Commercial Press NEGOTIATION56Onyama Limba
1029Kadeem FlosiAustralia2026-03-27Chapman, Ross E Esq PROPOSAL33Bernardo Dominic
1030Emily WhobreySpain2026-04-08Chanay, Jeffrey A Esq RENEWAL85Amy Elsner
1031Ricardo GauchoRussia2026-04-04Rangoni Of Florence NEGOTIATION61Ivan Magalhaes
1032Isabel BowleyBrazil2026-03-31King, Christopher A Esq NEW95Ivan Magalhaes
1033Misaki RoysterAustralia2026-04-04Feiner Bros UNQUALIFIED16Ioni Bowcher
1034Adams MorascaAustralia2026-04-14Morlong Associates QUALIFIED33Anna Fali
1035Misaki RoysterBrazil2026-04-10Chapman, Ross E Esq QUALIFIED48Bernardo Dominic
1036Aditya KuskoArgentina2026-03-26Chemel, James L Cpa UNQUALIFIED12Amy Elsner
1037Kadeem FlosiBrazil2026-04-19Morlong Associates NEGOTIATION5Asiya Javayant
1038Isabel BowleyUnited Kingdom2026-04-07Chapman, Ross E Esq NEGOTIATION70Asiya Javayant
1039Adams MorascaFrance2026-03-28Chemel, James L Cpa PROPOSAL36Onyama Limba
1040Emily WhobreyJapan2026-04-16Buckley Miller Wright RENEWAL42Ivan Magalhaes
1041Antonio CaudyBrazil2026-04-07Feiner Bros PROPOSAL31Ioni Bowcher
1042Aika InouyeFrance2026-03-31Rousseaux, Michael Esq PROPOSAL11Asiya Javayant
1043Johnson SergiIndia2026-03-27Rangoni Of Florence NEGOTIATION14Amy Elsner
1044James ButtItaly2026-04-14Morlong Associates RENEWAL5Onyama Limba
1045Kadeem FlosiBrazil2026-04-07Feiner Bros UNQUALIFIED18Amy Elsner
1046Chavez BriddickGermany2026-04-15Feiner Bros RENEWAL85Onyama Limba
1047Greenwood BologniaIndia2026-03-29Chapman, Ross E Esq UNQUALIFIED89Amy Elsner
1048Jefferson SchemmerUnited Kingdom2026-03-24Chanay, Jeffrey A Esq QUALIFIED17Ivan Magalhaes
1049Maisha RulapaughItaly2026-03-30Commercial Press RENEWAL23Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Sinclair WaycottIndiaBernardo Dominic NEW
Silvio SlusarskiItalyIoni Bowcher PROPOSAL
Sinclair WaycottJapanIvan Magalhaes PROPOSAL
James ButtFranceStephen Shaw PROPOSAL
Aika InouyeRussiaStephen Shaw QUALIFIED
Jennifer AmigonGermanyAnna Fali NEGOTIATION
Cody SaylorsSpainIoni Bowcher PROPOSAL
Ashley DoeBrazilAmy Elsner PROPOSAL
Nicolas IturbideArgentinaXuxue Feng NEGOTIATION
Tony FollerGermanyStephen Shaw RENEWAL
Smith GlickItalyAmy Elsner RENEWAL
Chavez BriddickUnited KingdomBernardo Dominic PROPOSAL
Wickens NestleArgentinaElwin Sharvill RENEWAL
Emily WhobreyUnited KingdomAnna Fali NEW
Maisha RulapaughFranceIoni Bowcher UNQUALIFIED
Stacey MacleadFranceBernardo Dominic UNQUALIFIED
Faith GillianAustraliaElwin Sharvill QUALIFIED
David DarakjyJapanAsiya Javayant PROPOSAL
Jones VocelkaArgentinaIvan Magalhaes NEW
Chavez BriddickUnited KingdomOnyama Limba RENEWAL
Arvin AlbaresGermanyIvan Magalhaes QUALIFIED
Johnson SergiSpainXuxue Feng PROPOSAL
Kaitlin OstroskySpainXuxue Feng QUALIFIED
Cody SaylorsJapanIvan Magalhaes QUALIFIED
Faith GillianUnited KingdomIoni Bowcher PROPOSAL
Leon OldroydFranceAsiya Javayant UNQUALIFIED
Ivar PaprockiItalyOnyama Limba NEW
Aruna FigeroaSpainBernardo Dominic UNQUALIFIED
Maria MarrierIndiaIoni Bowcher RENEWAL
Munro FerenczJapanIvan Magalhaes NEGOTIATION
Julie StensethArgentinaStephen Shaw PROPOSAL
Aruna FigeroaSpainAnna Fali UNQUALIFIED
Maisha RulapaughSpainStephen Shaw NEW
Mayumi KolmetzGermanyBernardo Dominic RENEWAL
Rodrigues CampainJapanAmy Elsner NEGOTIATION
Aika InouyeCanadaStephen Shaw NEGOTIATION
Clifford RimAustraliaAmy Elsner PROPOSAL
Jefferson SchemmerAustraliaIoni Bowcher NEW
Greenwood BologniaRussiaElwin Sharvill NEW
Misaki RoysterArgentinaIvan Magalhaes QUALIFIED
Faith GillianJapanAnna Fali QUALIFIED
Francesco ShinkoFranceElwin Sharvill NEGOTIATION
Jefferson SchemmerArgentinaBernardo Dominic NEW
Mujtaba NickaJapanIoni Bowcher NEW
Claire TollnerArgentinaIoni Bowcher NEGOTIATION
Maisha RulapaughJapanAnna Fali UNQUALIFIED
Octavia MaletBrazilAsiya Javayant UNQUALIFIED
Jefferson SchemmerBrazilIvan Magalhaes UNQUALIFIED
Johnson SergiFranceAsiya Javayant QUALIFIED
Maria MarrierBrazilAmy Elsner UNQUALIFIED
Frozen Columns
Name
Julie Stenseth
Antonio Caudy
Deepesh Chui
Aika Inouye
Emily Whobrey
Darci Poquette
Alejandro Perin
Francesco Shinko
Rodrigues Campain
Johnson Sergi
Jeanfrancois Venere
Murillo Malet
Leon Oldroyd
Greenwood Bolognia
Deepesh Chui
Jeanfrancois Venere
Adams Morasca
Arvin Albares
Deepesh Chui
Deepesh Chui
Adams Morasca
Chavez Briddick
David Darakjy
Costa Dilliard
Salvatore Stockham
Octavia Malet
Smith Glick
Alejandro Perin
Emily Whobrey
Adams Morasca
Alejandro Perin
Aditya Kusko
Izzy Garufi
Ivar Paprocki
Leja Caldarera
Aika Inouye
Misaki Royster
Emily Whobrey
Clifford Rim
Murillo Malet
Misaki Royster
David Darakjy
Kadeem Flosi
Jefferson Schemmer
Emily Whobrey
Silvio Slusarski
Clifford Rim
Darci Poquette
Ashley Doe
Clifford Rim
IdCountryDate
1000Australia2026-04-19
1001Japan2026-04-14
1002India2026-03-25
1003Italy2026-04-10
1004Germany2026-04-21
1005Argentina2026-03-26
1006France2026-03-26
1007Spain2026-04-18
1008United Kingdom2026-03-26
1009Australia2026-04-09
1010Japan2026-03-27
1011Germany2026-04-19
1012United Kingdom2026-03-25
1013Brazil2026-03-30
1014United Kingdom2026-04-05
1015Brazil2026-04-03
1016Canada2026-04-13
1017Japan2026-04-07
1018Japan2026-04-21
1019Germany2026-03-27
1020Canada2026-04-03
1021Japan2026-04-20
1022Russia2026-04-07
1023Argentina2026-04-03
1024Australia2026-03-23
1025Brazil2026-03-25
1026Argentina2026-03-31
1027France2026-03-30
1028Russia2026-03-29
1029Argentina2026-04-15
1030Japan2026-03-31
1031Japan2026-04-09
1032Japan2026-04-19
1033France2026-04-21
1034France2026-03-26
1035Argentina2026-03-30
1036Brazil2026-03-27
1037Russia2026-04-09
1038United Kingdom2026-04-12
1039India2026-04-06
1040Germany2026-04-01
1041Spain2026-03-24
1042Italy2026-04-13
1043France2026-04-10
1044United Kingdom2026-04-07
1045Argentina2026-04-08
1046Argentina2026-04-07
1047United Kingdom2026-04-17
1048Spain2026-04-02
1049Russia2026-04-17

On-Demand Data

NameIdCountryDate
Greenwood Bolognia1000Italy2026-03-30
Isabel Bowley1001Canada2026-03-31
Alejandro Perin1002Japan2026-03-31
Murillo Malet1003Australia2026-03-31
Antonio Caudy1004Italy2026-03-24
Salvatore Stockham1005France2026-03-24
Maisha Rulapaugh1006Argentina2026-04-19
Izzy Garufi1007India2026-03-24
Aditya Kusko1008Canada2026-04-11
Arvin Albares1009Argentina2026-04-01
Ivar Paprocki1010Russia2026-04-14
Greenwood Bolognia1011Italy2026-03-29
Francesco Shinko1012Japan2026-03-31
Jefferson Schemmer1013Canada2026-04-09
Maisha Rulapaugh1014Australia2026-04-06
Johnson Sergi1015France2026-04-20
Ricardo Gaucho1016Spain2026-04-02
Jennifer Amigon1017Canada2026-03-27
Aika Inouye1018Canada2026-04-10
Misaki Royster1019Russia2026-04-15
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Wickens NestleItalyAsiya Javayant PROPOSAL
Aika InouyeFranceXuxue Feng RENEWAL
Faith GillianFranceIoni Bowcher NEW
Stacey MacleadItalyIvan Magalhaes RENEWAL
Cody SaylorsUnited KingdomIvan Magalhaes PROPOSAL
Antonio CaudyArgentinaIvan Magalhaes QUALIFIED
Johnson SergiCanadaOnyama Limba QUALIFIED
Jones VocelkaJapanIvan Magalhaes RENEWAL
Sinclair WaycottIndiaAnna Fali RENEWAL
David DarakjyFranceIvan Magalhaes NEGOTIATION
Kadeem FlosiArgentinaAnna Fali PROPOSAL
Chavez BriddickItalyBernardo Dominic UNQUALIFIED
Ivar PaprockiIndiaIvan Magalhaes UNQUALIFIED
Jennifer AmigonCanadaStephen Shaw NEGOTIATION
Antonio CaudyArgentinaBernardo Dominic NEGOTIATION
Maisha RulapaughSpainBernardo Dominic UNQUALIFIED
Salvatore StockhamFranceIoni Bowcher UNQUALIFIED
Aika InouyeUnited KingdomStephen Shaw PROPOSAL
Maisha RulapaughArgentinaAsiya Javayant PROPOSAL
Jones VocelkaCanadaStephen Shaw NEW
Jennifer AmigonIndiaAmy Elsner RENEWAL
Ivar PaprockiAustraliaElwin Sharvill UNQUALIFIED
Leja CaldareraSpainAnna Fali RENEWAL
Maria MarrierFranceAnna Fali NEW
Sinclair WaycottGermanyAmy Elsner RENEWAL
Silvio SlusarskiUnited KingdomAsiya Javayant NEGOTIATION
Salvatore StockhamCanadaStephen Shaw UNQUALIFIED
Aditya KuskoJapanAnna Fali QUALIFIED
Kadeem FlosiJapanAsiya Javayant UNQUALIFIED
Alejandro PerinJapanAmy Elsner QUALIFIED
Aruna FigeroaRussiaIoni Bowcher QUALIFIED
Rodrigues CampainGermanyBernardo Dominic NEGOTIATION
Kadeem FlosiRussiaIvan Magalhaes PROPOSAL
Ashley DoeAustraliaIvan Magalhaes RENEWAL
Chavez BriddickArgentinaAnna Fali RENEWAL
Tony FollerCanadaBernardo Dominic QUALIFIED
Leja CaldareraSpainOnyama Limba NEGOTIATION
Kaitlin OstroskyBrazilAmy Elsner NEW
Chavez BriddickArgentinaOnyama Limba QUALIFIED
Murillo MaletUnited KingdomAmy Elsner PROPOSAL

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