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
Mayumi KolmetzRussiaIoni Bowcher PROPOSAL
Faith GillianArgentinaXuxue Feng NEW
Cody SaylorsSpainOnyama Limba RENEWAL
Ivar PaprockiUnited KingdomStephen Shaw PROPOSAL
Jefferson SchemmerGermanyAmy Elsner QUALIFIED
Octavia MaletBrazilIvan Magalhaes NEW
Jefferson SchemmerCanadaOnyama Limba QUALIFIED
Claire TollnerUnited KingdomAnna Fali NEGOTIATION
Johnson SergiRussiaIvan Magalhaes NEW
Aditya KuskoAustraliaAnna Fali PROPOSAL
Kadeem FlosiRussiaIvan Magalhaes UNQUALIFIED
Faith GillianFranceAnna Fali QUALIFIED
Leon OldroydCanadaBernardo Dominic NEW
Mujtaba NickaItalyStephen Shaw UNQUALIFIED
Leja CaldareraCanadaIvan Magalhaes NEGOTIATION
Deepesh ChuiAustraliaElwin Sharvill UNQUALIFIED
Tony FollerJapanOnyama Limba NEW
Antonio CaudyArgentinaOnyama Limba UNQUALIFIED
Ricardo GauchoJapanElwin Sharvill PROPOSAL
Clifford RimRussiaStephen Shaw NEW
Leon OldroydGermanyIvan Magalhaes NEGOTIATION
Francesco ShinkoUnited KingdomIvan Magalhaes UNQUALIFIED
James ButtSpainElwin Sharvill NEW
Faith GillianRussiaOnyama Limba QUALIFIED
Aika InouyeUnited KingdomIoni Bowcher RENEWAL
Greenwood BologniaAustraliaStephen Shaw NEW
David DarakjyIndiaStephen Shaw RENEWAL
Maisha RulapaughJapanAsiya Javayant NEGOTIATION
Leon OldroydRussiaBernardo Dominic UNQUALIFIED
Julie StensethSpainBernardo Dominic NEGOTIATION
Stacey MacleadBrazilIoni Bowcher NEGOTIATION
Sinclair WaycottFranceXuxue Feng PROPOSAL
Chavez BriddickFranceAsiya Javayant PROPOSAL
Jefferson SchemmerArgentinaStephen Shaw UNQUALIFIED
Leja CaldareraArgentinaBernardo Dominic QUALIFIED
Francesco ShinkoUnited KingdomAmy Elsner RENEWAL
Aruna FigeroaSpainAsiya Javayant NEW
Jones VocelkaUnited KingdomBernardo Dominic PROPOSAL
Maisha RulapaughSpainXuxue Feng NEGOTIATION
Silvio SlusarskiUnited KingdomAnna Fali UNQUALIFIED
Chavez BriddickSpainElwin Sharvill NEGOTIATION
Clifford RimArgentinaXuxue Feng NEW
Salvatore StockhamIndiaIvan Magalhaes UNQUALIFIED
Aruna FigeroaIndiaIvan Magalhaes NEGOTIATION
Arvin AlbaresRussiaBernardo Dominic NEGOTIATION
Maria MarrierGermanyBernardo Dominic QUALIFIED
Leon OldroydArgentinaIoni Bowcher RENEWAL
Kadeem FlosiJapanIoni Bowcher NEGOTIATION
Francesco ShinkoUnited KingdomAnna Fali RENEWAL
Sinclair WaycottJapanOnyama Limba PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Costa DilliardJapanXuxue Feng NEGOTIATION
Costa DilliardSpainIvan Magalhaes PROPOSAL
Aika InouyeItalyAsiya Javayant UNQUALIFIED
Ivar PaprockiCanadaIvan Magalhaes PROPOSAL
Misaki RoysterGermanyIvan Magalhaes RENEWAL
Juan WieserIndiaOnyama Limba NEW
Claire TollnerGermanyXuxue Feng NEW
Darci PoquetteSpainAmy Elsner RENEWAL
Francesco ShinkoRussiaOnyama Limba RENEWAL
Isabel BowleyArgentinaAmy Elsner PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Nicolas IturbideCanada2026-05-01Buckley Miller Wright QUALIFIED82Onyama Limba
1001Jones VocelkaJapan2026-05-02Commercial Press RENEWAL49Ivan Magalhaes
1002Maisha RulapaughArgentina2026-05-05Benton, John B Jr UNQUALIFIED73Asiya Javayant
1003Claire TollnerUnited Kingdom2026-04-23Rousseaux, Michael Esq NEGOTIATION60Stephen Shaw
1004Francesco ShinkoIndia2026-04-11Chapman, Ross E Esq QUALIFIED34Xuxue Feng
1005Mujtaba NickaUnited Kingdom2026-04-19Dorl, James J Esq PROPOSAL27Elwin Sharvill
1006Nicolas IturbideItaly2026-05-01King, Christopher A Esq PROPOSAL21Ivan Magalhaes
1007Maria MarrierArgentina2026-04-15Chanay, Jeffrey A Esq PROPOSAL45Onyama Limba
1008Aruna FigeroaBrazil2026-04-23Feiner Bros PROPOSAL9Elwin Sharvill
1009Nicolas IturbideBrazil2026-04-16Chanay, Jeffrey A Esq RENEWAL91Anna Fali
1010Jefferson SchemmerJapan2026-05-03Buckley Miller Wright PROPOSAL1Ivan Magalhaes
1011Leja CaldareraUnited Kingdom2026-04-25Printing Dimensions UNQUALIFIED52Ivan Magalhaes
1012Nicolas IturbideFrance2026-05-04Morlong Associates QUALIFIED93Amy Elsner
1013Misaki RoysterJapan2026-05-08Buckley Miller Wright NEGOTIATION26Elwin Sharvill
1014Silvio SlusarskiRussia2026-04-14Benton, John B Jr PROPOSAL73Asiya Javayant
1015Antonio CaudySpain2026-04-22Chapman, Ross E Esq RENEWAL62Ivan Magalhaes
1016Jefferson SchemmerArgentina2026-05-05Chapman, Ross E Esq UNQUALIFIED68Anna Fali
1017Arvin AlbaresGermany2026-04-15Chemel, James L Cpa RENEWAL79Bernardo Dominic
1018Leja CaldareraArgentina2026-05-08Feltz Printing Service NEGOTIATION2Stephen Shaw
1019Misaki RoysterRussia2026-04-14King, Christopher A Esq RENEWAL77Amy Elsner
1020Aditya KuskoSpain2026-05-03Buckley Miller Wright RENEWAL51Ioni Bowcher
1021Cody SaylorsArgentina2026-05-05Dorl, James J Esq NEGOTIATION19Onyama Limba
1022Mujtaba NickaIndia2026-05-06Rousseaux, Michael Esq UNQUALIFIED14Anna Fali
1023Alejandro PerinFrance2026-04-26Morlong Associates PROPOSAL78Elwin Sharvill
1024Kadeem FlosiBrazil2026-04-20Feltz Printing Service PROPOSAL27Xuxue Feng
1025Alejandro PerinSpain2026-04-15Chanay, Jeffrey A Esq QUALIFIED54Ivan Magalhaes
1026Faith GillianFrance2026-04-10Printing Dimensions QUALIFIED44Stephen Shaw
1027Julie StensethGermany2026-05-01Benton, John B Jr QUALIFIED41Ioni Bowcher
1028Aika InouyeFrance2026-05-02Commercial Press NEGOTIATION54Xuxue Feng
1029Aruna FigeroaIndia2026-05-05Commercial Press PROPOSAL58Amy Elsner
1030Mujtaba NickaJapan2026-05-04Rousseaux, Michael Esq NEGOTIATION96Stephen Shaw
1031Adams MorascaArgentina2026-05-09Dorl, James J Esq QUALIFIED99Ioni Bowcher
1032Costa DilliardBrazil2026-04-19Printing Dimensions QUALIFIED14Anna Fali
1033Clifford RimItaly2026-04-30Dorl, James J Esq NEW44Onyama Limba
1034Francesco ShinkoSpain2026-05-01Commercial Press QUALIFIED97Elwin Sharvill
1035Juan WieserFrance2026-04-10Rousseaux, Michael Esq RENEWAL87Stephen Shaw
1036Aruna FigeroaJapan2026-04-17Chanay, Jeffrey A Esq NEW21Anna Fali
1037James ButtSpain2026-04-22Rangoni Of Florence QUALIFIED49Xuxue Feng
1038Jennifer AmigonGermany2026-04-17Printing Dimensions QUALIFIED41Amy Elsner
1039Murillo MaletRussia2026-04-12Buckley Miller Wright UNQUALIFIED36Bernardo Dominic
1040Salvatore StockhamJapan2026-04-27Commercial Press PROPOSAL97Onyama Limba
1041Darci PoquetteAustralia2026-05-01King, Christopher A Esq NEW58Ioni Bowcher
1042Aruna FigeroaJapan2026-04-28Buckley Miller Wright QUALIFIED12Stephen Shaw
1043Mujtaba NickaItaly2026-04-14Printing Dimensions QUALIFIED61Onyama Limba
1044Julie StensethGermany2026-05-04Feiner Bros QUALIFIED64Asiya Javayant
1045Ashley DoeFrance2026-05-03Truhlar And Truhlar Attys NEGOTIATION59Bernardo Dominic
1046Leja CaldareraCanada2026-05-01Rangoni Of Florence UNQUALIFIED58Ivan Magalhaes
1047Claire TollnerJapan2026-04-11Chapman, Ross E Esq RENEWAL72Amy Elsner
1048Kadeem FlosiBrazil2026-05-08Benton, John B Jr PROPOSAL50Stephen Shaw
1049Jefferson SchemmerCanada2026-05-04Rangoni Of Florence NEW89Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Murillo MaletAustraliaAnna Fali NEW
Isabel BowleyGermanyBernardo Dominic QUALIFIED
Ashley DoeItalyIoni Bowcher PROPOSAL
Wickens NestleJapanBernardo Dominic UNQUALIFIED
Misaki RoysterJapanElwin Sharvill UNQUALIFIED
Ashley DoeArgentinaStephen Shaw QUALIFIED
Clifford RimJapanStephen Shaw RENEWAL
Kadeem FlosiRussiaStephen Shaw NEW
Johnson SergiRussiaIoni Bowcher RENEWAL
Leja CaldareraUnited KingdomIvan Magalhaes UNQUALIFIED
Greenwood BologniaIndiaIvan Magalhaes UNQUALIFIED
Arvin AlbaresGermanyStephen Shaw QUALIFIED
Jefferson SchemmerAustraliaAnna Fali PROPOSAL
Claire TollnerItalyElwin Sharvill PROPOSAL
Aditya KuskoAustraliaBernardo Dominic NEGOTIATION
Kaitlin OstroskyIndiaIvan Magalhaes NEW
Smith GlickArgentinaXuxue Feng NEW
Emily WhobreyUnited KingdomIvan Magalhaes NEGOTIATION
Ricardo GauchoGermanyElwin Sharvill NEW
Darci PoquetteRussiaXuxue Feng NEGOTIATION
Ashley DoeFranceAsiya Javayant RENEWAL
Jennifer AmigonIndiaOnyama Limba UNQUALIFIED
Claire TollnerJapanAmy Elsner RENEWAL
Chavez BriddickCanadaOnyama Limba PROPOSAL
Johnson SergiIndiaAnna Fali NEGOTIATION
Izzy GarufiUnited KingdomBernardo Dominic PROPOSAL
Emily WhobreyRussiaElwin Sharvill PROPOSAL
Arvin AlbaresItalyXuxue Feng NEW
Ricardo GauchoCanadaStephen Shaw PROPOSAL
Ricardo GauchoAustraliaXuxue Feng NEGOTIATION
Octavia MaletCanadaElwin Sharvill QUALIFIED
Leon OldroydBrazilIvan Magalhaes PROPOSAL
Costa DilliardIndiaAmy Elsner PROPOSAL
Julie StensethBrazilAmy Elsner NEW
David DarakjySpainElwin Sharvill PROPOSAL
Adams MorascaRussiaAsiya Javayant NEW
Leja CaldareraArgentinaIoni Bowcher RENEWAL
Emily WhobreyBrazilIoni Bowcher PROPOSAL
Rodrigues CampainAustraliaStephen Shaw UNQUALIFIED
Cody SaylorsRussiaElwin Sharvill NEW
Darci PoquetteItalyElwin Sharvill UNQUALIFIED
Costa DilliardArgentinaIoni Bowcher NEW
Arvin AlbaresUnited KingdomStephen Shaw PROPOSAL
Jennifer AmigonFranceElwin Sharvill NEW
Jennifer AmigonUnited KingdomAnna Fali NEW
Francesco ShinkoSpainAsiya Javayant UNQUALIFIED
Aruna FigeroaArgentinaBernardo Dominic UNQUALIFIED
Ashley DoeBrazilElwin Sharvill UNQUALIFIED
Tony FollerCanadaAsiya Javayant QUALIFIED
Claire TollnerGermanyAnna Fali PROPOSAL
Frozen Columns
Name
James Butt
Kadeem Flosi
Nicolas Iturbide
Misaki Royster
Arvin Albares
Izzy Garufi
Jeanfrancois Venere
Juan Wieser
Izzy Garufi
Izzy Garufi
Isabel Bowley
Greenwood Bolognia
Izzy Garufi
Alejandro Perin
Julie Stenseth
Ivar Paprocki
Nicolas Iturbide
Jeanfrancois Venere
Leon Oldroyd
Silvio Slusarski
Mayumi Kolmetz
Izzy Garufi
Misaki Royster
Johnson Sergi
Deepesh Chui
Deepesh Chui
Antonio Caudy
Francesco Shinko
Stacey Maclead
Isabel Bowley
Johnson Sergi
Darci Poquette
Leon Oldroyd
Darci Poquette
Mayumi Kolmetz
Maria Marrier
Francesco Shinko
Chavez Briddick
Antonio Caudy
Cody Saylors
Rodrigues Campain
Aruna Figeroa
Cody Saylors
Kaitlin Ostrosky
Aruna Figeroa
Greenwood Bolognia
Aruna Figeroa
Mayumi Kolmetz
Morrow Ruta
Salvatore Stockham
IdCountryDate
1000France2026-04-27
1001Germany2026-04-23
1002Spain2026-04-29
1003United Kingdom2026-05-09
1004Brazil2026-05-08
1005Germany2026-04-22
1006Brazil2026-05-09
1007Australia2026-04-20
1008Brazil2026-04-19
1009India2026-05-09
1010India2026-04-13
1011Brazil2026-04-25
1012Argentina2026-04-22
1013Argentina2026-04-28
1014India2026-04-23
1015United Kingdom2026-04-20
1016Germany2026-05-03
1017Australia2026-05-09
1018Brazil2026-05-03
1019Japan2026-04-14
1020Australia2026-04-18
1021Brazil2026-05-05
1022Argentina2026-05-04
1023Brazil2026-04-25
1024United Kingdom2026-04-11
1025United Kingdom2026-05-01
1026Russia2026-04-18
1027United Kingdom2026-04-24
1028United Kingdom2026-04-19
1029Japan2026-04-18
1030France2026-05-07
1031Canada2026-04-22
1032Russia2026-04-10
1033Spain2026-05-07
1034Spain2026-04-30
1035Argentina2026-05-05
1036Canada2026-04-12
1037Spain2026-04-21
1038Canada2026-05-07
1039Germany2026-05-07
1040Germany2026-04-29
1041Argentina2026-04-17
1042Canada2026-05-07
1043Germany2026-05-07
1044Japan2026-04-20
1045Italy2026-05-01
1046Australia2026-04-30
1047India2026-04-29
1048Japan2026-04-17
1049Argentina2026-04-10

On-Demand Data

NameIdCountryDate
Leja Caldarera1000Germany2026-04-10
Tony Foller1001Germany2026-04-13
Wickens Nestle1002Japan2026-04-20
Nicolas Iturbide1003Germany2026-04-10
Misaki Royster1004Japan2026-05-01
Mayumi Kolmetz1005India2026-04-15
Salvatore Stockham1006Japan2026-04-23
Jennifer Amigon1007India2026-04-10
Nicolas Iturbide1008Italy2026-04-23
Cody Saylors1009Australia2026-05-05
Darci Poquette1010Brazil2026-05-03
Kadeem Flosi1011Argentina2026-05-04
Antonio Caudy1012India2026-05-06
Sinclair Waycott1013United Kingdom2026-05-02
Aruna Figeroa1014France2026-05-03
Aditya Kusko1015Russia2026-04-24
Ricardo Gaucho1016Italy2026-05-03
Nicolas Iturbide1017Italy2026-04-20
Arvin Albares1018Argentina2026-04-28
Darci Poquette1019Spain2026-04-22
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Leja CaldareraJapanStephen Shaw QUALIFIED
Emily WhobreySpainXuxue Feng NEGOTIATION
Arvin AlbaresItalyOnyama Limba QUALIFIED
Wickens NestleUnited KingdomAmy Elsner RENEWAL
Claire TollnerUnited KingdomIvan Magalhaes RENEWAL
Alejandro PerinBrazilIvan Magalhaes QUALIFIED
Stacey MacleadUnited KingdomIvan Magalhaes UNQUALIFIED
Aika InouyeCanadaElwin Sharvill RENEWAL
Murillo MaletJapanOnyama Limba QUALIFIED
Mayumi KolmetzJapanAsiya Javayant UNQUALIFIED
David DarakjyAustraliaElwin Sharvill UNQUALIFIED
Maisha RulapaughItalyXuxue Feng RENEWAL
Antonio CaudyJapanXuxue Feng NEGOTIATION
Ashley DoeGermanyAsiya Javayant QUALIFIED
Aditya KuskoFranceElwin Sharvill NEW
Julie StensethJapanBernardo Dominic UNQUALIFIED
Jefferson SchemmerRussiaStephen Shaw PROPOSAL
Antonio CaudyIndiaBernardo Dominic PROPOSAL
Munro FerenczSpainElwin Sharvill PROPOSAL
Ricardo GauchoIndiaIvan Magalhaes PROPOSAL
Chavez BriddickGermanyAmy Elsner QUALIFIED
Antonio CaudyArgentinaIvan Magalhaes NEW
Munro FerenczSpainBernardo Dominic RENEWAL
Costa DilliardFranceAsiya Javayant QUALIFIED
Kaitlin OstroskyCanadaXuxue Feng QUALIFIED
Deepesh ChuiFranceAsiya Javayant PROPOSAL
Kaitlin OstroskyCanadaXuxue Feng PROPOSAL
Johnson SergiGermanyBernardo Dominic RENEWAL
Izzy GarufiIndiaIvan Magalhaes QUALIFIED
James ButtBrazilAnna Fali NEGOTIATION
Alejandro PerinJapanIvan Magalhaes PROPOSAL
Clifford RimUnited KingdomIoni Bowcher PROPOSAL
Jones VocelkaArgentinaAnna Fali QUALIFIED
Kaitlin OstroskyItalyAnna Fali NEW
Johnson SergiJapanAmy Elsner QUALIFIED
Alejandro PerinIndiaAmy Elsner PROPOSAL
Cody SaylorsBrazilBernardo Dominic NEW
Jennifer AmigonJapanElwin Sharvill PROPOSAL
Munro FerenczSpainStephen Shaw NEW
Salvatore StockhamAustraliaElwin Sharvill RENEWAL

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