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
Izzy GarufiGermanyIvan Magalhaes UNQUALIFIED
Ricardo GauchoAustraliaXuxue Feng PROPOSAL
Misaki RoysterItalyStephen Shaw RENEWAL
Aditya KuskoAustraliaAsiya Javayant QUALIFIED
Mayumi KolmetzJapanBernardo Dominic QUALIFIED
Aruna FigeroaSpainAmy Elsner PROPOSAL
Murillo MaletArgentinaElwin Sharvill QUALIFIED
Greenwood BologniaAustraliaOnyama Limba RENEWAL
Antonio CaudyArgentinaElwin Sharvill NEW
Maria MarrierUnited KingdomBernardo Dominic QUALIFIED
Isabel BowleyAustraliaOnyama Limba UNQUALIFIED
Arvin AlbaresBrazilIoni Bowcher PROPOSAL
Juan WieserUnited KingdomStephen Shaw QUALIFIED
Tony FollerGermanyAnna Fali QUALIFIED
Jeanfrancois VenereGermanyAnna Fali UNQUALIFIED
Jones VocelkaArgentinaOnyama Limba NEW
Darci PoquetteItalyAnna Fali PROPOSAL
Misaki RoysterAustraliaAmy Elsner NEGOTIATION
Wickens NestleAustraliaOnyama Limba NEW
Jennifer AmigonGermanyIvan Magalhaes NEGOTIATION
Stacey MacleadSpainAnna Fali QUALIFIED
Adams MorascaUnited KingdomBernardo Dominic NEW
Jefferson SchemmerBrazilElwin Sharvill PROPOSAL
Darci PoquetteSpainAsiya Javayant UNQUALIFIED
Maria MarrierAustraliaAsiya Javayant UNQUALIFIED
Smith GlickSpainIoni Bowcher RENEWAL
Mayumi KolmetzGermanyAmy Elsner PROPOSAL
Darci PoquetteArgentinaXuxue Feng UNQUALIFIED
Izzy GarufiIndiaAsiya Javayant NEGOTIATION
Greenwood BologniaRussiaOnyama Limba PROPOSAL
Leon OldroydIndiaAmy Elsner NEGOTIATION
Mujtaba NickaGermanyElwin Sharvill UNQUALIFIED
Deepesh ChuiAustraliaXuxue Feng NEGOTIATION
Claire TollnerJapanBernardo Dominic UNQUALIFIED
Clifford RimBrazilIoni Bowcher NEGOTIATION
Ricardo GauchoCanadaElwin Sharvill UNQUALIFIED
Johnson SergiJapanXuxue Feng PROPOSAL
Clifford RimIndiaXuxue Feng NEGOTIATION
Morrow RutaGermanyAnna Fali RENEWAL
Greenwood BologniaRussiaBernardo Dominic RENEWAL
Nicolas IturbideUnited KingdomBernardo Dominic RENEWAL
Murillo MaletItalyBernardo Dominic NEGOTIATION
Maria MarrierSpainAsiya Javayant QUALIFIED
Jennifer AmigonGermanyAnna Fali RENEWAL
Isabel BowleySpainIoni Bowcher QUALIFIED
Clifford RimArgentinaOnyama Limba NEGOTIATION
Stacey MacleadAustraliaBernardo Dominic NEW
Sinclair WaycottRussiaElwin Sharvill PROPOSAL
Julie StensethSpainIvan Magalhaes RENEWAL
Maria MarrierSpainAnna Fali UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Leja CaldareraFranceIoni Bowcher RENEWAL
Tony FollerFranceElwin Sharvill NEGOTIATION
Aruna FigeroaJapanStephen Shaw NEW
Mujtaba NickaIndiaAnna Fali NEW
Murillo MaletFranceStephen Shaw QUALIFIED
Aditya KuskoRussiaIvan Magalhaes RENEWAL
Mujtaba NickaJapanIvan Magalhaes PROPOSAL
Juan WieserItalyAmy Elsner NEW
Faith GillianCanadaAnna Fali NEGOTIATION
Ricardo GauchoCanadaBernardo Dominic NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Murillo MaletBrazil2025-08-27Truhlar And Truhlar Attys NEW62Amy Elsner
1001Kaitlin OstroskyBrazil2025-09-04Printing Dimensions RENEWAL38Anna Fali
1002Cody SaylorsJapan2025-09-08Chanay, Jeffrey A Esq RENEWAL9Stephen Shaw
1003Emily WhobreySpain2025-09-21Truhlar And Truhlar Attys UNQUALIFIED48Anna Fali
1004Stacey MacleadJapan2025-09-07Dorl, James J Esq QUALIFIED79Ivan Magalhaes
1005Wickens NestleBrazil2025-09-10Morlong Associates RENEWAL18Bernardo Dominic
1006Sinclair WaycottJapan2025-08-26Feiner Bros NEW74Xuxue Feng
1007Antonio CaudyCanada2025-09-22Morlong Associates PROPOSAL45Asiya Javayant
1008Morrow RutaBrazil2025-08-27Printing Dimensions QUALIFIED46Amy Elsner
1009Mayumi KolmetzIndia2025-09-11Feiner Bros NEW40Stephen Shaw
1010Julie StensethGermany2025-09-02Rousseaux, Michael Esq RENEWAL78Ivan Magalhaes
1011Octavia MaletGermany2025-09-12Benton, John B Jr RENEWAL91Elwin Sharvill
1012Octavia MaletSpain2025-09-18Morlong Associates NEW36Onyama Limba
1013Jones VocelkaIndia2025-08-30Rousseaux, Michael Esq RENEWAL14Amy Elsner
1014Ricardo GauchoFrance2025-08-30Buckley Miller Wright RENEWAL44Ioni Bowcher
1015Jones VocelkaGermany2025-08-31Chanay, Jeffrey A Esq NEW20Bernardo Dominic
1016Jefferson SchemmerFrance2025-09-13Truhlar And Truhlar Attys UNQUALIFIED3Stephen Shaw
1017Johnson SergiRussia2025-09-09Chapman, Ross E Esq NEW16Bernardo Dominic
1018Julie StensethItaly2025-09-08Morlong Associates UNQUALIFIED82Xuxue Feng
1019Darci PoquetteIndia2025-09-07Morlong Associates RENEWAL31Bernardo Dominic
1020Ashley DoeSpain2025-09-16Commercial Press QUALIFIED11Stephen Shaw
1021Jefferson SchemmerRussia2025-09-15Rousseaux, Michael Esq QUALIFIED84Xuxue Feng
1022Aruna FigeroaCanada2025-09-09King, Christopher A Esq PROPOSAL13Ivan Magalhaes
1023Mujtaba NickaAustralia2025-09-24Printing Dimensions PROPOSAL39Ivan Magalhaes
1024Izzy GarufiArgentina2025-09-12Benton, John B Jr UNQUALIFIED71Stephen Shaw
1025Kadeem FlosiUnited Kingdom2025-09-13Chemel, James L Cpa NEGOTIATION47Ioni Bowcher
1026Johnson SergiCanada2025-09-06Printing Dimensions QUALIFIED74Bernardo Dominic
1027Ivar PaprockiSpain2025-09-13Benton, John B Jr RENEWAL70Xuxue Feng
1028Jefferson SchemmerSpain2025-09-10Commercial Press QUALIFIED28Amy Elsner
1029Nicolas IturbideFrance2025-08-27Commercial Press QUALIFIED94Anna Fali
1030Ashley DoeCanada2025-09-19Feiner Bros PROPOSAL86Amy Elsner
1031Cody SaylorsCanada2025-09-02Feiner Bros UNQUALIFIED44Ivan Magalhaes
1032Jeanfrancois VenereRussia2025-09-04Printing Dimensions UNQUALIFIED74Ivan Magalhaes
1033Munro FerenczSpain2025-08-31Feltz Printing Service QUALIFIED78Amy Elsner
1034Isabel BowleyGermany2025-08-29Chanay, Jeffrey A Esq PROPOSAL3Stephen Shaw
1035Leja CaldareraGermany2025-09-01Printing Dimensions QUALIFIED62Stephen Shaw
1036Jeanfrancois VenereIndia2025-09-04Buckley Miller Wright NEW54Onyama Limba
1037Alejandro PerinBrazil2025-08-31Chanay, Jeffrey A Esq QUALIFIED17Asiya Javayant
1038Emily WhobreyJapan2025-09-12Truhlar And Truhlar Attys QUALIFIED54Amy Elsner
1039Ricardo GauchoGermany2025-09-02Commercial Press QUALIFIED64Amy Elsner
1040Nicolas IturbideAustralia2025-09-07Commercial Press PROPOSAL83Asiya Javayant
1041Antonio CaudyJapan2025-09-05Buckley Miller Wright PROPOSAL90Asiya Javayant
1042Deepesh ChuiItaly2025-09-15King, Christopher A Esq RENEWAL65Xuxue Feng
1043Izzy GarufiRussia2025-08-30Buckley Miller Wright PROPOSAL38Ivan Magalhaes
1044Ashley DoeItaly2025-09-03Chapman, Ross E Esq UNQUALIFIED70Amy Elsner
1045Murillo MaletRussia2025-08-29Chapman, Ross E Esq UNQUALIFIED72Bernardo Dominic
1046Greenwood BologniaItaly2025-09-15Benton, John B Jr NEGOTIATION41Onyama Limba
1047Jones VocelkaJapan2025-09-14Chemel, James L Cpa PROPOSAL61Amy Elsner
1048Johnson SergiAustralia2025-09-03Rangoni Of Florence PROPOSAL22Bernardo Dominic
1049Deepesh ChuiItaly2025-09-04Commercial Press RENEWAL34Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Ashley DoeSpainIoni Bowcher NEGOTIATION
Tony FollerJapanBernardo Dominic PROPOSAL
Leon OldroydSpainXuxue Feng NEW
Juan WieserFranceIvan Magalhaes QUALIFIED
Antonio CaudyGermanyBernardo Dominic RENEWAL
Chavez BriddickArgentinaOnyama Limba RENEWAL
James ButtGermanyXuxue Feng PROPOSAL
Jones VocelkaAustraliaAmy Elsner RENEWAL
Mayumi KolmetzBrazilAsiya Javayant NEGOTIATION
Isabel BowleyAustraliaAnna Fali PROPOSAL
Costa DilliardAustraliaIoni Bowcher UNQUALIFIED
Leja CaldareraRussiaAsiya Javayant UNQUALIFIED
Maria MarrierJapanStephen Shaw QUALIFIED
Wickens NestleItalyIoni Bowcher RENEWAL
Claire TollnerFranceXuxue Feng UNQUALIFIED
Ricardo GauchoUnited KingdomStephen Shaw PROPOSAL
Johnson SergiArgentinaStephen Shaw NEGOTIATION
Izzy GarufiUnited KingdomOnyama Limba QUALIFIED
Mujtaba NickaUnited KingdomElwin Sharvill QUALIFIED
Sinclair WaycottCanadaBernardo Dominic PROPOSAL
Leja CaldareraIndiaAnna Fali PROPOSAL
Chavez BriddickUnited KingdomIvan Magalhaes RENEWAL
Kadeem FlosiIndiaIvan Magalhaes PROPOSAL
Jeanfrancois VenereGermanyBernardo Dominic NEGOTIATION
Ivar PaprockiGermanyIoni Bowcher NEW
Faith GillianBrazilAsiya Javayant RENEWAL
Costa DilliardBrazilIoni Bowcher RENEWAL
Jones VocelkaRussiaOnyama Limba RENEWAL
Nicolas IturbideFranceAnna Fali PROPOSAL
Mayumi KolmetzRussiaAnna Fali NEGOTIATION
Mayumi KolmetzItalyIvan Magalhaes QUALIFIED
Octavia MaletAustraliaIvan Magalhaes NEW
Kadeem FlosiArgentinaIvan Magalhaes NEW
Maria MarrierAustraliaIvan Magalhaes NEW
Smith GlickIndiaOnyama Limba PROPOSAL
Tony FollerFranceXuxue Feng NEGOTIATION
Morrow RutaIndiaAmy Elsner UNQUALIFIED
Juan WieserCanadaXuxue Feng PROPOSAL
Alejandro PerinArgentinaIoni Bowcher PROPOSAL
Nicolas IturbideBrazilIoni Bowcher NEW
Kadeem FlosiFranceIvan Magalhaes QUALIFIED
Misaki RoysterJapanStephen Shaw QUALIFIED
Sinclair WaycottAustraliaOnyama Limba QUALIFIED
Costa DilliardUnited KingdomStephen Shaw PROPOSAL
Johnson SergiIndiaStephen Shaw NEGOTIATION
Aditya KuskoGermanyIoni Bowcher NEW
Wickens NestleBrazilIvan Magalhaes RENEWAL
Julie StensethCanadaStephen Shaw UNQUALIFIED
Greenwood BologniaArgentinaAnna Fali UNQUALIFIED
Adams MorascaSpainAsiya Javayant NEGOTIATION
Frozen Columns
Name
Wickens Nestle
Aika Inouye
Silvio Slusarski
Maria Marrier
Emily Whobrey
Aika Inouye
Chavez Briddick
James Butt
Francesco Shinko
Mayumi Kolmetz
Octavia Malet
Mayumi Kolmetz
Murillo Malet
Tony Foller
Ricardo Gaucho
Jeanfrancois Venere
Julie Stenseth
Morrow Ruta
Salvatore Stockham
Sinclair Waycott
Mayumi Kolmetz
Jennifer Amigon
Aditya Kusko
Stacey Maclead
Jeanfrancois Venere
Maria Marrier
Faith Gillian
Salvatore Stockham
Juan Wieser
Ashley Doe
Octavia Malet
Chavez Briddick
Emily Whobrey
Antonio Caudy
Stacey Maclead
Chavez Briddick
Claire Tollner
Maria Marrier
Misaki Royster
Leon Oldroyd
Rodrigues Campain
Clifford Rim
Maisha Rulapaugh
Ricardo Gaucho
Ashley Doe
Smith Glick
Nicolas Iturbide
Octavia Malet
Aruna Figeroa
Octavia Malet
IdCountryDate
1000Canada2025-09-14
1001United Kingdom2025-09-17
1002United Kingdom2025-08-31
1003Spain2025-09-01
1004United Kingdom2025-09-10
1005Brazil2025-08-29
1006Germany2025-09-22
1007Brazil2025-09-23
1008Australia2025-09-23
1009United Kingdom2025-09-15
1010Argentina2025-09-10
1011Russia2025-09-06
1012France2025-09-05
1013India2025-09-05
1014France2025-09-23
1015Russia2025-08-28
1016India2025-09-15
1017Japan2025-09-08
1018United Kingdom2025-09-22
1019Germany2025-09-02
1020Germany2025-09-22
1021Australia2025-09-19
1022Spain2025-09-21
1023Australia2025-09-08
1024Brazil2025-09-16
1025United Kingdom2025-09-02
1026Russia2025-09-11
1027Spain2025-09-21
1028Brazil2025-09-24
1029France2025-09-19
1030Japan2025-09-08
1031Canada2025-09-01
1032Japan2025-09-01
1033Russia2025-09-23
1034Brazil2025-09-18
1035United Kingdom2025-09-16
1036India2025-09-04
1037United Kingdom2025-09-11
1038Spain2025-09-04
1039India2025-09-24
1040Japan2025-09-21
1041United Kingdom2025-09-15
1042Australia2025-08-27
1043India2025-09-02
1044Italy2025-09-10
1045Russia2025-09-01
1046Argentina2025-09-12
1047Italy2025-09-05
1048Canada2025-09-09
1049France2025-09-18

On-Demand Data

NameIdCountryDate
Johnson Sergi1000Brazil2025-09-03
Aruna Figeroa1001France2025-08-31
Munro Ferencz1002Canada2025-09-19
Izzy Garufi1003Australia2025-08-29
Jeanfrancois Venere1004Japan2025-09-04
Salvatore Stockham1005Spain2025-09-03
Claire Tollner1006Canada2025-09-01
Munro Ferencz1007Spain2025-09-13
Claire Tollner1008Canada2025-09-09
Leon Oldroyd1009Spain2025-08-26
Chavez Briddick1010Australia2025-09-12
Silvio Slusarski1011Argentina2025-09-18
Tony Foller1012India2025-09-10
Mayumi Kolmetz1013Germany2025-09-06
Jeanfrancois Venere1014Italy2025-09-24
Morrow Ruta1015Australia2025-09-18
Julie Stenseth1016Japan2025-09-02
Faith Gillian1017India2025-09-10
Jefferson Schemmer1018Canada2025-09-09
Julie Stenseth1019Canada2025-08-31
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Maria MarrierAustraliaStephen Shaw NEW
Juan WieserItalyOnyama Limba QUALIFIED
Cody SaylorsAustraliaBernardo Dominic QUALIFIED
Maisha RulapaughGermanyIoni Bowcher NEGOTIATION
Silvio SlusarskiJapanBernardo Dominic RENEWAL
Aruna FigeroaGermanyAsiya Javayant RENEWAL
Ricardo GauchoJapanAnna Fali QUALIFIED
Clifford RimGermanyIoni Bowcher PROPOSAL
Alejandro PerinJapanOnyama Limba PROPOSAL
Ivar PaprockiSpainXuxue Feng UNQUALIFIED
Jefferson SchemmerIndiaAnna Fali QUALIFIED
Antonio CaudyGermanyOnyama Limba RENEWAL
Johnson SergiBrazilAsiya Javayant QUALIFIED
Johnson SergiItalyIoni Bowcher RENEWAL
Juan WieserFranceAmy Elsner QUALIFIED
Ricardo GauchoBrazilBernardo Dominic PROPOSAL
Chavez BriddickBrazilElwin Sharvill PROPOSAL
Jeanfrancois VenereItalyStephen Shaw UNQUALIFIED
Claire TollnerSpainElwin Sharvill NEW
Kadeem FlosiItalyXuxue Feng RENEWAL
Alejandro PerinSpainAmy Elsner UNQUALIFIED
David DarakjySpainStephen Shaw NEW
Misaki RoysterRussiaBernardo Dominic NEGOTIATION
Murillo MaletJapanElwin Sharvill PROPOSAL
Kadeem FlosiJapanXuxue Feng QUALIFIED
Greenwood BologniaAustraliaAnna Fali PROPOSAL
Murillo MaletBrazilOnyama Limba NEGOTIATION
Jefferson SchemmerArgentinaAsiya Javayant NEGOTIATION
Emily WhobreyJapanBernardo Dominic RENEWAL
Mayumi KolmetzBrazilIvan Magalhaes PROPOSAL
Maisha RulapaughCanadaAsiya Javayant UNQUALIFIED
Tony FollerGermanyAmy Elsner PROPOSAL
Antonio CaudyCanadaBernardo Dominic RENEWAL
Leja CaldareraSpainElwin Sharvill QUALIFIED
Ricardo GauchoUnited KingdomIvan Magalhaes NEW
Mayumi KolmetzArgentinaAmy Elsner UNQUALIFIED
Julie StensethCanadaAnna Fali QUALIFIED
Sinclair WaycottIndiaAmy Elsner RENEWAL
Munro FerenczItalyOnyama Limba PROPOSAL
Misaki RoysterItalyXuxue Feng 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>