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
James ButtSpainBernardo Dominic NEW
Ricardo GauchoArgentinaXuxue Feng RENEWAL
Greenwood BologniaCanadaBernardo Dominic NEGOTIATION
Ivar PaprockiBrazilBernardo Dominic UNQUALIFIED
Misaki RoysterItalyIvan Magalhaes RENEWAL
Cody SaylorsCanadaElwin Sharvill NEW
David DarakjyFranceAnna Fali RENEWAL
Aruna FigeroaUnited KingdomIvan Magalhaes NEW
Alejandro PerinGermanyBernardo Dominic UNQUALIFIED
Mayumi KolmetzRussiaXuxue Feng UNQUALIFIED
Leja CaldareraRussiaBernardo Dominic NEW
Alejandro PerinItalyElwin Sharvill PROPOSAL
Maisha RulapaughSpainStephen Shaw UNQUALIFIED
Aruna FigeroaItalyStephen Shaw RENEWAL
Ivar PaprockiRussiaAnna Fali QUALIFIED
Jeanfrancois VenereItalyXuxue Feng QUALIFIED
Leon OldroydJapanXuxue Feng RENEWAL
Ricardo GauchoIndiaAsiya Javayant NEW
Ricardo GauchoItalyElwin Sharvill UNQUALIFIED
Mujtaba NickaIndiaStephen Shaw QUALIFIED
Jefferson SchemmerBrazilBernardo Dominic RENEWAL
Johnson SergiSpainBernardo Dominic UNQUALIFIED
David DarakjyArgentinaOnyama Limba RENEWAL
Sinclair WaycottArgentinaIoni Bowcher UNQUALIFIED
Wickens NestleCanadaAsiya Javayant QUALIFIED
Ivar PaprockiGermanyOnyama Limba QUALIFIED
Rodrigues CampainJapanStephen Shaw PROPOSAL
Arvin AlbaresUnited KingdomIoni Bowcher PROPOSAL
Costa DilliardArgentinaStephen Shaw UNQUALIFIED
Aruna FigeroaCanadaBernardo Dominic QUALIFIED
Izzy GarufiJapanBernardo Dominic RENEWAL
Darci PoquetteAustraliaAnna Fali PROPOSAL
Ricardo GauchoFranceBernardo Dominic PROPOSAL
Ricardo GauchoIndiaAmy Elsner PROPOSAL
Izzy GarufiGermanyIoni Bowcher NEGOTIATION
Faith GillianRussiaBernardo Dominic NEW
Julie StensethSpainElwin Sharvill RENEWAL
Tony FollerJapanXuxue Feng NEGOTIATION
Arvin AlbaresRussiaOnyama Limba NEGOTIATION
Kadeem FlosiSpainIoni Bowcher NEW
Julie StensethUnited KingdomBernardo Dominic QUALIFIED
Emily WhobreyJapanAnna Fali PROPOSAL
Aika InouyeUnited KingdomXuxue Feng QUALIFIED
James ButtItalyIoni Bowcher PROPOSAL
Jones VocelkaFranceStephen Shaw UNQUALIFIED
Leon OldroydBrazilBernardo Dominic UNQUALIFIED
Greenwood BologniaIndiaBernardo Dominic PROPOSAL
David DarakjyBrazilIvan Magalhaes NEGOTIATION
Ricardo GauchoItalyStephen Shaw PROPOSAL
Nicolas IturbideFranceOnyama Limba NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Mayumi KolmetzUnited KingdomBernardo Dominic NEW
Mayumi KolmetzJapanAmy Elsner RENEWAL
Deepesh ChuiItalyStephen Shaw UNQUALIFIED
Morrow RutaJapanXuxue Feng UNQUALIFIED
Adams MorascaFranceAnna Fali UNQUALIFIED
Maisha RulapaughIndiaAnna Fali NEGOTIATION
Greenwood BologniaCanadaAmy Elsner NEGOTIATION
Ashley DoeItalyIvan Magalhaes RENEWAL
Julie StensethArgentinaXuxue Feng QUALIFIED
Jennifer AmigonUnited KingdomOnyama Limba NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Kaitlin OstroskyItaly2026-04-24Feiner Bros NEGOTIATION79Xuxue Feng
1001Morrow RutaBrazil2026-04-17Chapman, Ross E Esq NEW73Ioni Bowcher
1002Julie StensethArgentina2026-05-07King, Christopher A Esq PROPOSAL52Amy Elsner
1003Kaitlin OstroskyItaly2026-05-03King, Christopher A Esq QUALIFIED55Bernardo Dominic
1004Antonio CaudyFrance2026-05-09Truhlar And Truhlar Attys PROPOSAL76Onyama Limba
1005Jeanfrancois VenereJapan2026-05-05Dorl, James J Esq NEGOTIATION0Anna Fali
1006Smith GlickUnited Kingdom2026-04-16Truhlar And Truhlar Attys QUALIFIED4Xuxue Feng
1007Francesco ShinkoRussia2026-04-18Feltz Printing Service UNQUALIFIED14Asiya Javayant
1008Aika InouyeFrance2026-04-23King, Christopher A Esq UNQUALIFIED63Xuxue Feng
1009Arvin AlbaresFrance2026-04-30Feiner Bros RENEWAL30Ivan Magalhaes
1010Francesco ShinkoFrance2026-04-21Buckley Miller Wright NEGOTIATION95Elwin Sharvill
1011Julie StensethSpain2026-04-16King, Christopher A Esq NEW99Elwin Sharvill
1012Aditya KuskoArgentina2026-04-10Morlong Associates NEGOTIATION30Bernardo Dominic
1013Julie StensethSpain2026-04-27Rangoni Of Florence UNQUALIFIED17Stephen Shaw
1014Ricardo GauchoRussia2026-04-15Benton, John B Jr NEW41Elwin Sharvill
1015Darci PoquetteIndia2026-04-14King, Christopher A Esq RENEWAL7Xuxue Feng
1016Stacey MacleadGermany2026-04-10Rangoni Of Florence UNQUALIFIED52Ioni Bowcher
1017Clifford RimSpain2026-05-05Chanay, Jeffrey A Esq UNQUALIFIED43Xuxue Feng
1018Julie StensethRussia2026-04-29Commercial Press UNQUALIFIED54Anna Fali
1019Emily WhobreyAustralia2026-04-18Morlong Associates NEW79Ioni Bowcher
1020Emily WhobreyFrance2026-04-10Morlong Associates NEGOTIATION77Ivan Magalhaes
1021Munro FerenczAustralia2026-04-15Feltz Printing Service RENEWAL63Elwin Sharvill
1022Leon OldroydBrazil2026-05-08Rangoni Of Florence NEW45Elwin Sharvill
1023Tony FollerArgentina2026-04-10Buckley Miller Wright PROPOSAL86Elwin Sharvill
1024Emily WhobreyBrazil2026-04-27Morlong Associates UNQUALIFIED88Ivan Magalhaes
1025Francesco ShinkoBrazil2026-05-02Chanay, Jeffrey A Esq UNQUALIFIED38Bernardo Dominic
1026Jefferson SchemmerJapan2026-04-13Commercial Press RENEWAL30Ivan Magalhaes
1027Kadeem FlosiSpain2026-04-14Chapman, Ross E Esq RENEWAL60Stephen Shaw
1028Jones VocelkaFrance2026-05-04King, Christopher A Esq QUALIFIED27Anna Fali
1029Antonio CaudyGermany2026-04-18Rangoni Of Florence RENEWAL84Anna Fali
1030Aika InouyeAustralia2026-05-08Rousseaux, Michael Esq PROPOSAL9Elwin Sharvill
1031Rodrigues CampainGermany2026-05-04Printing Dimensions QUALIFIED6Amy Elsner
1032Kaitlin OstroskyItaly2026-04-20Rousseaux, Michael Esq PROPOSAL62Anna Fali
1033Aika InouyeRussia2026-04-28Buckley Miller Wright QUALIFIED62Bernardo Dominic
1034Chavez BriddickJapan2026-04-23Commercial Press NEW62Anna Fali
1035Chavez BriddickGermany2026-05-04Chapman, Ross E Esq QUALIFIED6Xuxue Feng
1036Johnson SergiFrance2026-05-03King, Christopher A Esq UNQUALIFIED36Elwin Sharvill
1037Tony FollerUnited Kingdom2026-04-21Chanay, Jeffrey A Esq PROPOSAL61Ioni Bowcher
1038Chavez BriddickGermany2026-04-16Benton, John B Jr UNQUALIFIED2Ioni Bowcher
1039Jefferson SchemmerRussia2026-04-14Chanay, Jeffrey A Esq UNQUALIFIED16Amy Elsner
1040Deepesh ChuiUnited Kingdom2026-05-09Rangoni Of Florence QUALIFIED13Ivan Magalhaes
1041Kaitlin OstroskyJapan2026-05-04Chapman, Ross E Esq RENEWAL75Asiya Javayant
1042Kadeem FlosiArgentina2026-04-13Morlong Associates UNQUALIFIED0Stephen Shaw
1043David DarakjySpain2026-05-05King, Christopher A Esq NEGOTIATION70Asiya Javayant
1044Kaitlin OstroskyRussia2026-04-23Feiner Bros RENEWAL99Elwin Sharvill
1045Deepesh ChuiCanada2026-04-12Buckley Miller Wright NEW41Ioni Bowcher
1046Misaki RoysterRussia2026-04-29Benton, John B Jr NEGOTIATION79Asiya Javayant
1047Kadeem FlosiGermany2026-05-02Feiner Bros PROPOSAL0Ioni Bowcher
1048Antonio CaudyUnited Kingdom2026-05-02Buckley Miller Wright NEGOTIATION9Anna Fali
1049Wickens NestleRussia2026-04-20Buckley Miller Wright PROPOSAL47Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Tony FollerJapanXuxue Feng QUALIFIED
Aruna FigeroaItalyIoni Bowcher NEGOTIATION
Stacey MacleadIndiaBernardo Dominic PROPOSAL
Johnson SergiGermanyAsiya Javayant QUALIFIED
Rodrigues CampainItalyIoni Bowcher UNQUALIFIED
Johnson SergiGermanyElwin Sharvill QUALIFIED
Izzy GarufiGermanyIvan Magalhaes RENEWAL
Mayumi KolmetzFranceAmy Elsner RENEWAL
Juan WieserItalyAmy Elsner QUALIFIED
Aruna FigeroaRussiaAnna Fali NEW
James ButtCanadaIoni Bowcher QUALIFIED
Aditya KuskoAustraliaIoni Bowcher QUALIFIED
Maisha RulapaughIndiaAnna Fali UNQUALIFIED
Cody SaylorsBrazilOnyama Limba NEGOTIATION
Deepesh ChuiSpainAmy Elsner RENEWAL
Salvatore StockhamBrazilAnna Fali RENEWAL
Deepesh ChuiCanadaBernardo Dominic RENEWAL
Jefferson SchemmerSpainAsiya Javayant NEW
Salvatore StockhamGermanyAnna Fali RENEWAL
David DarakjyFranceElwin Sharvill NEW
Kaitlin OstroskyItalyXuxue Feng NEGOTIATION
James ButtSpainIoni Bowcher NEGOTIATION
Aruna FigeroaIndiaIoni Bowcher NEGOTIATION
Cody SaylorsIndiaBernardo Dominic RENEWAL
Darci PoquetteGermanyStephen Shaw PROPOSAL
Jefferson SchemmerItalyXuxue Feng RENEWAL
Antonio CaudyJapanIvan Magalhaes NEGOTIATION
Misaki RoysterArgentinaAnna Fali NEGOTIATION
Ivar PaprockiUnited KingdomIoni Bowcher UNQUALIFIED
Juan WieserFranceAnna Fali PROPOSAL
Isabel BowleyArgentinaAmy Elsner NEW
Jefferson SchemmerUnited KingdomOnyama Limba NEW
Emily WhobreyArgentinaOnyama Limba UNQUALIFIED
Faith GillianSpainIoni Bowcher PROPOSAL
Misaki RoysterGermanyAnna Fali RENEWAL
Maria MarrierBrazilIvan Magalhaes QUALIFIED
Stacey MacleadJapanElwin Sharvill RENEWAL
Antonio CaudyIndiaStephen Shaw PROPOSAL
Darci PoquetteGermanyIoni Bowcher QUALIFIED
Mayumi KolmetzIndiaIvan Magalhaes PROPOSAL
Smith GlickCanadaAmy Elsner QUALIFIED
Aditya KuskoArgentinaOnyama Limba RENEWAL
Munro FerenczArgentinaAsiya Javayant RENEWAL
Kaitlin OstroskyIndiaAnna Fali NEW
Nicolas IturbideFranceIoni Bowcher PROPOSAL
Aditya KuskoArgentinaAmy Elsner UNQUALIFIED
Faith GillianAustraliaXuxue Feng PROPOSAL
Adams MorascaJapanElwin Sharvill PROPOSAL
Misaki RoysterArgentinaAmy Elsner NEW
Smith GlickSpainOnyama Limba UNQUALIFIED
Frozen Columns
Name
Antonio Caudy
David Darakjy
Ashley Doe
Stacey Maclead
Leja Caldarera
Arvin Albares
Costa Dilliard
Julie Stenseth
Stacey Maclead
David Darakjy
Octavia Malet
Munro Ferencz
Rodrigues Campain
James Butt
Jefferson Schemmer
Munro Ferencz
Johnson Sergi
Francesco Shinko
Morrow Ruta
Clifford Rim
Greenwood Bolognia
Arvin Albares
Misaki Royster
Mayumi Kolmetz
Ivar Paprocki
Leja Caldarera
Julie Stenseth
Mujtaba Nicka
Ivar Paprocki
Aditya Kusko
Claire Tollner
Adams Morasca
Kadeem Flosi
Silvio Slusarski
Johnson Sergi
Cody Saylors
Octavia Malet
Sinclair Waycott
Ashley Doe
Wickens Nestle
Deepesh Chui
Leon Oldroyd
Antonio Caudy
Rodrigues Campain
Silvio Slusarski
Kadeem Flosi
Jefferson Schemmer
Mujtaba Nicka
Ricardo Gaucho
Jefferson Schemmer
IdCountryDate
1000France2026-05-05
1001Brazil2026-05-07
1002Japan2026-04-25
1003Japan2026-04-25
1004Argentina2026-05-02
1005Italy2026-05-06
1006Brazil2026-05-03
1007India2026-05-02
1008United Kingdom2026-04-18
1009Spain2026-04-25
1010Canada2026-04-21
1011Canada2026-05-03
1012India2026-05-04
1013Spain2026-05-09
1014France2026-04-10
1015France2026-05-08
1016Spain2026-04-29
1017United Kingdom2026-04-14
1018France2026-05-06
1019Japan2026-04-19
1020United Kingdom2026-04-13
1021Russia2026-04-10
1022France2026-04-25
1023France2026-04-11
1024Argentina2026-04-29
1025Spain2026-04-22
1026Russia2026-05-03
1027France2026-04-14
1028Italy2026-05-08
1029India2026-04-13
1030Brazil2026-05-03
1031Italy2026-04-13
1032Germany2026-04-29
1033France2026-05-08
1034Italy2026-05-04
1035Italy2026-04-18
1036Australia2026-05-02
1037France2026-04-12
1038India2026-04-26
1039Italy2026-04-27
1040Italy2026-05-09
1041Spain2026-05-06
1042Canada2026-04-29
1043Japan2026-05-04
1044Brazil2026-04-10
1045Argentina2026-04-10
1046Brazil2026-05-06
1047France2026-04-28
1048France2026-05-03
1049Russia2026-04-16

On-Demand Data

NameIdCountryDate
James Butt1000Germany2026-04-11
Salvatore Stockham1001Australia2026-05-01
Isabel Bowley1002Japan2026-04-18
Jennifer Amigon1003Russia2026-05-06
Wickens Nestle1004Argentina2026-04-28
Silvio Slusarski1005Japan2026-05-08
Julie Stenseth1006Russia2026-05-05
Aika Inouye1007India2026-04-13
Salvatore Stockham1008France2026-05-05
Francesco Shinko1009Japan2026-04-24
Costa Dilliard1010Australia2026-04-28
Mayumi Kolmetz1011Australia2026-04-15
David Darakjy1012Canada2026-04-27
Ricardo Gaucho1013Brazil2026-04-28
Kadeem Flosi1014Argentina2026-04-11
Leja Caldarera1015United Kingdom2026-04-26
Johnson Sergi1016India2026-05-03
Costa Dilliard1017Russia2026-04-22
Nicolas Iturbide1018Australia2026-04-15
Ricardo Gaucho1019Russia2026-04-30
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Leja CaldareraJapanIvan Magalhaes RENEWAL
Costa DilliardItalyAsiya Javayant QUALIFIED
Faith GillianCanadaIvan Magalhaes NEW
Claire TollnerGermanyIoni Bowcher NEW
Smith GlickArgentinaIvan Magalhaes NEW
Clifford RimAustraliaBernardo Dominic NEGOTIATION
Juan WieserCanadaIvan Magalhaes NEW
Aika InouyeGermanyXuxue Feng PROPOSAL
Maisha RulapaughSpainStephen Shaw QUALIFIED
Aditya KuskoJapanOnyama Limba RENEWAL
Ricardo GauchoFranceIvan Magalhaes NEGOTIATION
Octavia MaletBrazilIoni Bowcher NEGOTIATION
Antonio CaudyIndiaIvan Magalhaes QUALIFIED
Leja CaldareraRussiaIvan Magalhaes QUALIFIED
Misaki RoysterIndiaIoni Bowcher RENEWAL
Costa DilliardGermanyAmy Elsner NEW
Johnson SergiArgentinaAmy Elsner NEW
Izzy GarufiIndiaAsiya Javayant UNQUALIFIED
Faith GillianCanadaAnna Fali PROPOSAL
Faith GillianAustraliaOnyama Limba NEW
Kaitlin OstroskyArgentinaOnyama Limba QUALIFIED
Leja CaldareraIndiaAmy Elsner NEW
Ricardo GauchoBrazilStephen Shaw UNQUALIFIED
Chavez BriddickAustraliaStephen Shaw PROPOSAL
Aditya KuskoArgentinaElwin Sharvill NEGOTIATION
Arvin AlbaresBrazilOnyama Limba RENEWAL
Salvatore StockhamIndiaXuxue Feng PROPOSAL
Alejandro PerinCanadaBernardo Dominic UNQUALIFIED
Greenwood BologniaFranceBernardo Dominic RENEWAL
Aruna FigeroaUnited KingdomXuxue Feng QUALIFIED
Deepesh ChuiGermanyAnna Fali RENEWAL
Salvatore StockhamUnited KingdomIoni Bowcher PROPOSAL
James ButtIndiaXuxue Feng QUALIFIED
Jefferson SchemmerFranceAsiya Javayant NEGOTIATION
Maria MarrierUnited KingdomAnna Fali QUALIFIED
Kadeem FlosiArgentinaIoni Bowcher PROPOSAL
Ricardo GauchoCanadaXuxue Feng QUALIFIED
Johnson SergiItalyElwin Sharvill QUALIFIED
Jones VocelkaCanadaBernardo Dominic UNQUALIFIED
Francesco ShinkoFranceAmy Elsner 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>