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 RutaUnited KingdomOnyama Limba QUALIFIED
Salvatore StockhamRussiaStephen Shaw RENEWAL
Alejandro PerinSpainAmy Elsner QUALIFIED
Kaitlin OstroskyItalyAnna Fali PROPOSAL
Cody SaylorsBrazilAnna Fali QUALIFIED
Sinclair WaycottUnited KingdomXuxue Feng PROPOSAL
Izzy GarufiAustraliaOnyama Limba NEGOTIATION
Maria MarrierAustraliaXuxue Feng PROPOSAL
Johnson SergiBrazilStephen Shaw UNQUALIFIED
Octavia MaletBrazilAsiya Javayant NEW
Faith GillianGermanyIoni Bowcher NEGOTIATION
Claire TollnerUnited KingdomIoni Bowcher QUALIFIED
Jones VocelkaAustraliaOnyama Limba NEW
Kadeem FlosiIndiaIoni Bowcher NEW
Francesco ShinkoUnited KingdomXuxue Feng QUALIFIED
Ivar PaprockiCanadaIvan Magalhaes NEGOTIATION
Costa DilliardArgentinaBernardo Dominic UNQUALIFIED
Cody SaylorsGermanyAmy Elsner QUALIFIED
Leja CaldareraUnited KingdomAnna Fali PROPOSAL
Chavez BriddickIndiaAnna Fali QUALIFIED
Leon OldroydItalyBernardo Dominic PROPOSAL
Aruna FigeroaIndiaStephen Shaw RENEWAL
Juan WieserIndiaIvan Magalhaes UNQUALIFIED
Faith GillianUnited KingdomBernardo Dominic QUALIFIED
Murillo MaletItalyXuxue Feng RENEWAL
Salvatore StockhamAustraliaOnyama Limba UNQUALIFIED
Antonio CaudyGermanyBernardo Dominic RENEWAL
Juan WieserUnited KingdomOnyama Limba PROPOSAL
Wickens NestleAustraliaStephen Shaw QUALIFIED
Claire TollnerAustraliaXuxue Feng PROPOSAL
Faith GillianCanadaXuxue Feng RENEWAL
Jeanfrancois VenereSpainAmy Elsner QUALIFIED
Octavia MaletItalyStephen Shaw QUALIFIED
Munro FerenczArgentinaOnyama Limba QUALIFIED
Costa DilliardJapanElwin Sharvill UNQUALIFIED
Aditya KuskoIndiaBernardo Dominic NEW
Kaitlin OstroskyBrazilAmy Elsner PROPOSAL
Aditya KuskoUnited KingdomAnna Fali NEGOTIATION
Nicolas IturbideAustraliaIoni Bowcher QUALIFIED
Jones VocelkaFranceIoni Bowcher NEGOTIATION
Morrow RutaIndiaIoni Bowcher PROPOSAL
Kadeem FlosiItalyElwin Sharvill UNQUALIFIED
Greenwood BologniaBrazilAmy Elsner PROPOSAL
Maria MarrierRussiaOnyama Limba QUALIFIED
Stacey MacleadUnited KingdomAnna Fali RENEWAL
Aruna FigeroaRussiaAnna Fali UNQUALIFIED
Izzy GarufiCanadaAmy Elsner NEGOTIATION
Izzy GarufiArgentinaIvan Magalhaes NEGOTIATION
Munro FerenczUnited KingdomIoni Bowcher PROPOSAL
Aruna FigeroaAustraliaIoni Bowcher NEW
Horizontal
NameCountryRepresentativeStatus
Adams MorascaAustraliaBernardo Dominic PROPOSAL
Julie StensethSpainAmy Elsner RENEWAL
Emily WhobreyGermanyAsiya Javayant NEGOTIATION
Misaki RoysterGermanyAsiya Javayant RENEWAL
Darci PoquetteSpainAsiya Javayant NEGOTIATION
Leon OldroydSpainIoni Bowcher NEGOTIATION
Aruna FigeroaFranceAnna Fali QUALIFIED
Darci PoquetteCanadaAnna Fali QUALIFIED
Morrow RutaGermanyXuxue Feng NEW
Alejandro PerinItalyXuxue Feng QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Murillo MaletAustralia2026-05-04Feiner Bros QUALIFIED35Ivan Magalhaes
1001Adams MorascaBrazil2026-04-22Morlong Associates UNQUALIFIED66Amy Elsner
1002Stacey MacleadArgentina2026-05-01Chemel, James L Cpa NEGOTIATION68Ivan Magalhaes
1003Leon OldroydItaly2026-05-01Commercial Press UNQUALIFIED84Ioni Bowcher
1004Jeanfrancois VenereArgentina2026-05-10Truhlar And Truhlar Attys PROPOSAL58Anna Fali
1005Aditya KuskoBrazil2026-05-12Buckley Miller Wright NEGOTIATION40Ioni Bowcher
1006Darci PoquetteJapan2026-05-13Rousseaux, Michael Esq NEW79Stephen Shaw
1007Salvatore StockhamIndia2026-05-09Feiner Bros RENEWAL18Ioni Bowcher
1008Octavia MaletBrazil2026-04-18Feltz Printing Service NEW59Elwin Sharvill
1009Isabel BowleyBrazil2026-05-05King, Christopher A Esq UNQUALIFIED14Onyama Limba
1010Arvin AlbaresRussia2026-04-30Truhlar And Truhlar Attys QUALIFIED72Anna Fali
1011James ButtFrance2026-05-14Truhlar And Truhlar Attys PROPOSAL85Elwin Sharvill
1012Tony FollerGermany2026-05-13Feiner Bros PROPOSAL31Ivan Magalhaes
1013Jeanfrancois VenereRussia2026-05-04Printing Dimensions RENEWAL22Onyama Limba
1014Sinclair WaycottAustralia2026-05-10Truhlar And Truhlar Attys UNQUALIFIED76Stephen Shaw
1015Cody SaylorsSpain2026-04-25King, Christopher A Esq QUALIFIED31Stephen Shaw
1016Jefferson SchemmerRussia2026-04-30Morlong Associates RENEWAL63Stephen Shaw
1017Murillo MaletSpain2026-05-11Chemel, James L Cpa NEGOTIATION43Asiya Javayant
1018Misaki RoysterBrazil2026-05-11Chanay, Jeffrey A Esq NEW32Anna Fali
1019Kadeem FlosiIndia2026-04-20King, Christopher A Esq NEGOTIATION75Amy Elsner
1020Clifford RimAustralia2026-04-24Feiner Bros PROPOSAL71Stephen Shaw
1021Claire TollnerGermany2026-05-04Rousseaux, Michael Esq UNQUALIFIED31Onyama Limba
1022Munro FerenczBrazil2026-05-07Feltz Printing Service PROPOSAL5Ioni Bowcher
1023Darci PoquetteIndia2026-05-11Rangoni Of Florence PROPOSAL68Amy Elsner
1024Arvin AlbaresSpain2026-04-22Printing Dimensions NEGOTIATION87Anna Fali
1025Isabel BowleyArgentina2026-04-29Truhlar And Truhlar Attys UNQUALIFIED56Asiya Javayant
1026Darci PoquetteBrazil2026-04-15Rangoni Of Florence NEW7Ioni Bowcher
1027Johnson SergiCanada2026-05-03Commercial Press UNQUALIFIED91Anna Fali
1028Jeanfrancois VenereAustralia2026-04-23Feltz Printing Service UNQUALIFIED1Stephen Shaw
1029Misaki RoysterUnited Kingdom2026-05-05Morlong Associates QUALIFIED48Onyama Limba
1030James ButtItaly2026-04-26Commercial Press NEW55Elwin Sharvill
1031Sinclair WaycottIndia2026-04-27Truhlar And Truhlar Attys UNQUALIFIED77Amy Elsner
1032Tony FollerAustralia2026-04-16Chanay, Jeffrey A Esq NEGOTIATION16Ioni Bowcher
1033Salvatore StockhamFrance2026-05-09Dorl, James J Esq PROPOSAL21Amy Elsner
1034Jefferson SchemmerRussia2026-05-04Commercial Press NEGOTIATION97Ioni Bowcher
1035Ashley DoeItaly2026-04-18Buckley Miller Wright NEW79Xuxue Feng
1036Ricardo GauchoFrance2026-04-21King, Christopher A Esq NEW74Anna Fali
1037Julie StensethBrazil2026-05-06King, Christopher A Esq PROPOSAL28Onyama Limba
1038Nicolas IturbideGermany2026-05-13Feltz Printing Service RENEWAL54Ivan Magalhaes
1039Morrow RutaJapan2026-05-10Chemel, James L Cpa NEGOTIATION7Stephen Shaw
1040Antonio CaudySpain2026-05-09Feltz Printing Service RENEWAL27Bernardo Dominic
1041Francesco ShinkoItaly2026-05-11Chemel, James L Cpa UNQUALIFIED49Onyama Limba
1042Darci PoquetteFrance2026-04-26Feiner Bros UNQUALIFIED25Anna Fali
1043Antonio CaudyAustralia2026-04-15Rousseaux, Michael Esq NEGOTIATION26Xuxue Feng
1044Maisha RulapaughItaly2026-05-14King, Christopher A Esq NEW93Elwin Sharvill
1045Kadeem FlosiArgentina2026-05-05Chanay, Jeffrey A Esq NEW46Xuxue Feng
1046Faith GillianBrazil2026-05-10King, Christopher A Esq QUALIFIED8Xuxue Feng
1047Ricardo GauchoBrazil2026-04-23Truhlar And Truhlar Attys NEGOTIATION45Ivan Magalhaes
1048Arvin AlbaresCanada2026-04-17King, Christopher A Esq NEGOTIATION60Stephen Shaw
1049Stacey MacleadCanada2026-04-29Chanay, Jeffrey A Esq NEGOTIATION10Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Ashley DoeGermanyAnna Fali NEGOTIATION
Julie StensethIndiaOnyama Limba QUALIFIED
Claire TollnerRussiaIvan Magalhaes PROPOSAL
David DarakjyGermanyAmy Elsner NEW
Emily WhobreySpainStephen Shaw NEGOTIATION
Silvio SlusarskiGermanyElwin Sharvill UNQUALIFIED
Maisha RulapaughUnited KingdomElwin Sharvill UNQUALIFIED
Jefferson SchemmerBrazilBernardo Dominic UNQUALIFIED
Leja CaldareraJapanIvan Magalhaes NEGOTIATION
Jefferson SchemmerUnited KingdomOnyama Limba NEW
Sinclair WaycottJapanBernardo Dominic NEGOTIATION
Darci PoquetteArgentinaXuxue Feng RENEWAL
Tony FollerArgentinaOnyama Limba UNQUALIFIED
Jennifer AmigonItalyXuxue Feng NEW
Morrow RutaFranceAsiya Javayant NEGOTIATION
Misaki RoysterItalyAmy Elsner NEW
Jefferson SchemmerJapanAnna Fali PROPOSAL
Aruna FigeroaRussiaAmy Elsner NEW
Murillo MaletJapanIvan Magalhaes NEW
Sinclair WaycottFranceElwin Sharvill QUALIFIED
Chavez BriddickArgentinaBernardo Dominic NEGOTIATION
Jefferson SchemmerCanadaElwin Sharvill QUALIFIED
Cody SaylorsArgentinaAsiya Javayant UNQUALIFIED
Aditya KuskoJapanAmy Elsner PROPOSAL
Silvio SlusarskiGermanyAmy Elsner NEW
Aditya KuskoCanadaIoni Bowcher UNQUALIFIED
Misaki RoysterBrazilOnyama Limba UNQUALIFIED
Stacey MacleadItalyStephen Shaw QUALIFIED
Arvin AlbaresArgentinaElwin Sharvill NEW
Maria MarrierJapanIoni Bowcher NEW
Deepesh ChuiSpainElwin Sharvill NEW
Aditya KuskoGermanyAmy Elsner NEGOTIATION
Alejandro PerinFranceIoni Bowcher NEW
Leja CaldareraUnited KingdomAsiya Javayant NEGOTIATION
Chavez BriddickAustraliaOnyama Limba NEGOTIATION
Jennifer AmigonCanadaElwin Sharvill PROPOSAL
Julie StensethItalyIvan Magalhaes NEGOTIATION
Clifford RimBrazilAsiya Javayant UNQUALIFIED
Jefferson SchemmerCanadaElwin Sharvill NEGOTIATION
Stacey MacleadFranceElwin Sharvill QUALIFIED
Izzy GarufiCanadaElwin Sharvill NEW
Faith GillianSpainIvan Magalhaes RENEWAL
Kaitlin OstroskyFranceElwin Sharvill NEGOTIATION
Clifford RimCanadaIoni Bowcher RENEWAL
Misaki RoysterJapanXuxue Feng NEW
Aditya KuskoUnited KingdomIoni Bowcher UNQUALIFIED
Sinclair WaycottAustraliaIvan Magalhaes RENEWAL
Alejandro PerinCanadaXuxue Feng PROPOSAL
Faith GillianItalyElwin Sharvill NEW
Nicolas IturbideUnited KingdomAnna Fali NEGOTIATION
Frozen Columns
Name
Nicolas Iturbide
Alejandro Perin
Faith Gillian
Izzy Garufi
Salvatore Stockham
Sinclair Waycott
Isabel Bowley
Emily Whobrey
Misaki Royster
Cody Saylors
Aruna Figeroa
Mujtaba Nicka
Stacey Maclead
Tony Foller
Leja Caldarera
Kaitlin Ostrosky
James Butt
Octavia Malet
Costa Dilliard
Smith Glick
Kaitlin Ostrosky
Arvin Albares
Izzy Garufi
Arvin Albares
Ivar Paprocki
Mayumi Kolmetz
Adams Morasca
Aruna Figeroa
Ivar Paprocki
Jeanfrancois Venere
Tony Foller
Smith Glick
Wickens Nestle
Alejandro Perin
Ivar Paprocki
Darci Poquette
Mayumi Kolmetz
Johnson Sergi
James Butt
Silvio Slusarski
Leja Caldarera
Izzy Garufi
Francesco Shinko
Wickens Nestle
Aditya Kusko
Salvatore Stockham
Mujtaba Nicka
Jefferson Schemmer
Nicolas Iturbide
Wickens Nestle
IdCountryDate
1000Argentina2026-05-04
1001India2026-04-27
1002Canada2026-04-26
1003Japan2026-04-25
1004Germany2026-05-11
1005Spain2026-04-21
1006France2026-05-05
1007United Kingdom2026-04-20
1008Italy2026-05-11
1009Argentina2026-04-17
1010Germany2026-04-29
1011United Kingdom2026-04-21
1012Brazil2026-05-05
1013Italy2026-04-19
1014Russia2026-04-28
1015Japan2026-05-03
1016Argentina2026-04-22
1017United Kingdom2026-05-04
1018Italy2026-05-07
1019India2026-04-20
1020Argentina2026-04-25
1021France2026-05-01
1022Brazil2026-04-16
1023Canada2026-04-19
1024Australia2026-04-15
1025Germany2026-04-25
1026Japan2026-05-13
1027Japan2026-05-07
1028Australia2026-05-10
1029Italy2026-05-13
1030Australia2026-05-09
1031India2026-05-08
1032United Kingdom2026-04-26
1033Italy2026-04-18
1034Australia2026-05-04
1035Germany2026-05-10
1036Russia2026-04-20
1037Spain2026-04-26
1038Australia2026-04-21
1039France2026-04-28
1040Japan2026-04-29
1041Canada2026-05-04
1042Canada2026-04-23
1043Italy2026-05-10
1044Canada2026-04-21
1045Spain2026-04-22
1046Italy2026-04-19
1047Australia2026-05-09
1048United Kingdom2026-04-16
1049Spain2026-05-04

On-Demand Data

NameIdCountryDate
Julie Stenseth1000Germany2026-05-11
Sinclair Waycott1001Brazil2026-05-12
Costa Dilliard1002Canada2026-04-29
Maria Marrier1003Argentina2026-05-13
Mayumi Kolmetz1004Canada2026-04-16
Mujtaba Nicka1005Argentina2026-04-17
Aruna Figeroa1006United Kingdom2026-05-10
Aruna Figeroa1007Russia2026-05-05
Misaki Royster1008France2026-04-27
Jefferson Schemmer1009Russia2026-04-25
Francesco Shinko1010Argentina2026-05-14
Munro Ferencz1011Australia2026-05-12
Mayumi Kolmetz1012India2026-05-06
Jones Vocelka1013Russia2026-05-08
Stacey Maclead1014Canada2026-05-03
Maria Marrier1015Brazil2026-05-13
Silvio Slusarski1016Brazil2026-05-14
Arvin Albares1017Spain2026-04-23
Kaitlin Ostrosky1018France2026-05-01
Jones Vocelka1019Japan2026-05-11
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Kaitlin OstroskySpainBernardo Dominic NEW
Kadeem FlosiIndiaBernardo Dominic RENEWAL
Leon OldroydCanadaElwin Sharvill RENEWAL
Faith GillianIndiaAnna Fali QUALIFIED
Mayumi KolmetzItalyIvan Magalhaes RENEWAL
Jeanfrancois VenereItalyOnyama Limba PROPOSAL
Morrow RutaCanadaElwin Sharvill NEW
Murillo MaletRussiaIoni Bowcher UNQUALIFIED
Aika InouyeIndiaIvan Magalhaes NEGOTIATION
James ButtSpainAnna Fali RENEWAL
Morrow RutaBrazilAmy Elsner PROPOSAL
Ivar PaprockiBrazilXuxue Feng QUALIFIED
Emily WhobreySpainBernardo Dominic NEW
Wickens NestleUnited KingdomIvan Magalhaes NEW
Francesco ShinkoUnited KingdomAmy Elsner PROPOSAL
Jeanfrancois VenereUnited KingdomAnna Fali NEW
Costa DilliardUnited KingdomOnyama Limba NEGOTIATION
Aditya KuskoBrazilAsiya Javayant NEGOTIATION
Jennifer AmigonBrazilXuxue Feng RENEWAL
Clifford RimFranceIvan Magalhaes NEW
Wickens NestleRussiaAnna Fali NEGOTIATION
Faith GillianBrazilXuxue Feng UNQUALIFIED
Darci PoquetteCanadaBernardo Dominic PROPOSAL
Clifford RimCanadaStephen Shaw NEW
Emily WhobreyGermanyOnyama Limba UNQUALIFIED
Leja CaldareraCanadaAmy Elsner PROPOSAL
Faith GillianItalyIoni Bowcher NEW
Chavez BriddickArgentinaBernardo Dominic QUALIFIED
Julie StensethRussiaIvan Magalhaes NEGOTIATION
Ashley DoeIndiaAnna Fali UNQUALIFIED
Costa DilliardRussiaAsiya Javayant UNQUALIFIED
Izzy GarufiItalyIvan Magalhaes NEW
James ButtSpainAmy Elsner NEGOTIATION
Kadeem FlosiItalyBernardo Dominic NEW
Jones VocelkaRussiaOnyama Limba NEW
Clifford RimUnited KingdomAmy Elsner NEW
Octavia MaletBrazilElwin Sharvill NEW
Costa DilliardItalyStephen Shaw RENEWAL
Greenwood BologniaCanadaStephen Shaw UNQUALIFIED
Jeanfrancois VenereBrazilBernardo Dominic UNQUALIFIED

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