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
Juan WieserSpainOnyama Limba NEW
Faith GillianCanadaOnyama Limba NEGOTIATION
Alejandro PerinFranceAsiya Javayant RENEWAL
Jeanfrancois VenereArgentinaAnna Fali PROPOSAL
Clifford RimBrazilXuxue Feng RENEWAL
Claire TollnerCanadaAmy Elsner PROPOSAL
Jennifer AmigonBrazilXuxue Feng UNQUALIFIED
Murillo MaletIndiaAmy Elsner NEGOTIATION
Greenwood BologniaBrazilIvan Magalhaes NEGOTIATION
Johnson SergiBrazilBernardo Dominic PROPOSAL
Chavez BriddickUnited KingdomAsiya Javayant UNQUALIFIED
Cody SaylorsSpainStephen Shaw QUALIFIED
Leon OldroydSpainXuxue Feng NEGOTIATION
Morrow RutaIndiaAmy Elsner RENEWAL
Faith GillianRussiaIvan Magalhaes PROPOSAL
Faith GillianJapanAnna Fali PROPOSAL
James ButtItalyIoni Bowcher RENEWAL
Arvin AlbaresBrazilAsiya Javayant RENEWAL
Jeanfrancois VenereGermanyAmy Elsner NEGOTIATION
Leja CaldareraSpainStephen Shaw PROPOSAL
Leon OldroydGermanyElwin Sharvill PROPOSAL
Juan WieserArgentinaOnyama Limba UNQUALIFIED
Costa DilliardAustraliaAnna Fali NEGOTIATION
Julie StensethJapanXuxue Feng UNQUALIFIED
Ivar PaprockiGermanyIvan Magalhaes NEGOTIATION
Adams MorascaJapanStephen Shaw PROPOSAL
Chavez BriddickGermanyAnna Fali RENEWAL
Jeanfrancois VenereFranceAsiya Javayant RENEWAL
Julie StensethGermanyOnyama Limba UNQUALIFIED
Costa DilliardItalyAmy Elsner QUALIFIED
Faith GillianItalyIvan Magalhaes RENEWAL
Johnson SergiUnited KingdomAnna Fali RENEWAL
Darci PoquetteJapanIoni Bowcher PROPOSAL
Darci PoquetteUnited KingdomElwin Sharvill UNQUALIFIED
Aruna FigeroaAustraliaAnna Fali NEGOTIATION
Emily WhobreyIndiaXuxue Feng QUALIFIED
Adams MorascaItalyIvan Magalhaes NEW
Aruna FigeroaItalyOnyama Limba UNQUALIFIED
Ivar PaprockiRussiaIvan Magalhaes QUALIFIED
Silvio SlusarskiJapanIvan Magalhaes UNQUALIFIED
Stacey MacleadSpainBernardo Dominic PROPOSAL
Arvin AlbaresFranceStephen Shaw RENEWAL
Aruna FigeroaGermanyStephen Shaw NEGOTIATION
Faith GillianJapanAmy Elsner QUALIFIED
Greenwood BologniaCanadaAnna Fali NEGOTIATION
Aruna FigeroaJapanStephen Shaw QUALIFIED
Aditya KuskoCanadaIvan Magalhaes NEW
Claire TollnerBrazilAmy Elsner UNQUALIFIED
Murillo MaletUnited KingdomStephen Shaw PROPOSAL
Aditya KuskoJapanOnyama Limba RENEWAL
Horizontal
NameCountryRepresentativeStatus
Nicolas IturbideUnited KingdomIvan Magalhaes PROPOSAL
Mujtaba NickaBrazilIoni Bowcher RENEWAL
Mayumi KolmetzBrazilOnyama Limba PROPOSAL
Kadeem FlosiBrazilAnna Fali PROPOSAL
Johnson SergiIndiaAsiya Javayant NEW
Salvatore StockhamFranceAmy Elsner UNQUALIFIED
James ButtJapanIvan Magalhaes PROPOSAL
Mujtaba NickaIndiaAmy Elsner RENEWAL
Costa DilliardArgentinaIvan Magalhaes QUALIFIED
Silvio SlusarskiUnited KingdomAsiya Javayant NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Deepesh ChuiBrazil2026-05-28Feltz Printing Service UNQUALIFIED69Ivan Magalhaes
1001Smith GlickGermany2026-06-01Chapman, Ross E Esq NEGOTIATION47Amy Elsner
1002David DarakjyItaly2026-06-02Feiner Bros NEW89Elwin Sharvill
1003Stacey MacleadRussia2026-06-15Commercial Press RENEWAL60Asiya Javayant
1004Leon OldroydRussia2026-05-31Printing Dimensions PROPOSAL41Stephen Shaw
1005Adams MorascaGermany2026-06-14Printing Dimensions UNQUALIFIED17Xuxue Feng
1006Clifford RimSpain2026-05-31Dorl, James J Esq NEW30Ivan Magalhaes
1007Leja CaldareraItaly2026-06-18Printing Dimensions UNQUALIFIED76Asiya Javayant
1008Jennifer AmigonJapan2026-05-27Rangoni Of Florence NEGOTIATION16Amy Elsner
1009Wickens NestleRussia2026-05-24Dorl, James J Esq QUALIFIED48Anna Fali
1010Leja CaldareraItaly2026-06-11King, Christopher A Esq NEGOTIATION95Ivan Magalhaes
1011Ashley DoeCanada2026-06-07Printing Dimensions QUALIFIED62Asiya Javayant
1012Kaitlin OstroskyCanada2026-06-18King, Christopher A Esq UNQUALIFIED99Ivan Magalhaes
1013Jennifer AmigonIndia2026-06-17Truhlar And Truhlar Attys UNQUALIFIED59Bernardo Dominic
1014Costa DilliardSpain2026-06-06Rangoni Of Florence NEGOTIATION71Asiya Javayant
1015Isabel BowleyCanada2026-06-11Dorl, James J Esq UNQUALIFIED50Xuxue Feng
1016Wickens NestleUnited Kingdom2026-05-28Chapman, Ross E Esq NEW63Stephen Shaw
1017Kaitlin OstroskySpain2026-05-26Printing Dimensions NEW45Onyama Limba
1018Deepesh ChuiBrazil2026-06-03Chemel, James L Cpa UNQUALIFIED90Asiya Javayant
1019Isabel BowleyFrance2026-06-01Commercial Press UNQUALIFIED84Amy Elsner
1020Darci PoquetteJapan2026-06-10Feltz Printing Service NEW3Elwin Sharvill
1021Jefferson SchemmerFrance2026-06-08Chemel, James L Cpa NEGOTIATION47Xuxue Feng
1022Leon OldroydCanada2026-05-22Chanay, Jeffrey A Esq NEGOTIATION1Xuxue Feng
1023Johnson SergiIndia2026-06-08Printing Dimensions PROPOSAL28Amy Elsner
1024Smith GlickItaly2026-05-21Rangoni Of Florence NEW7Bernardo Dominic
1025Aditya KuskoGermany2026-06-10Chanay, Jeffrey A Esq QUALIFIED7Onyama Limba
1026Faith GillianRussia2026-05-30King, Christopher A Esq PROPOSAL43Xuxue Feng
1027Maria MarrierCanada2026-06-12Printing Dimensions PROPOSAL90Xuxue Feng
1028Jefferson SchemmerAustralia2026-05-23Rangoni Of Florence PROPOSAL96Asiya Javayant
1029Misaki RoysterFrance2026-06-03Chapman, Ross E Esq NEGOTIATION21Xuxue Feng
1030Julie StensethFrance2026-06-16Buckley Miller Wright QUALIFIED78Elwin Sharvill
1031Kaitlin OstroskyItaly2026-06-13Rousseaux, Michael Esq QUALIFIED73Amy Elsner
1032Wickens NestleGermany2026-06-05Printing Dimensions NEW26Ivan Magalhaes
1033Deepesh ChuiSpain2026-05-29Buckley Miller Wright UNQUALIFIED18Amy Elsner
1034Tony FollerGermany2026-06-16Feltz Printing Service NEW69Ivan Magalhaes
1035Kadeem FlosiSpain2026-06-10Chemel, James L Cpa QUALIFIED15Anna Fali
1036Octavia MaletGermany2026-06-02Benton, John B Jr UNQUALIFIED0Xuxue Feng
1037Stacey MacleadAustralia2026-06-14Benton, John B Jr PROPOSAL34Asiya Javayant
1038Isabel BowleyFrance2026-06-17King, Christopher A Esq NEGOTIATION83Amy Elsner
1039Johnson SergiFrance2026-06-15Printing Dimensions NEGOTIATION1Elwin Sharvill
1040Julie StensethFrance2026-05-29Chemel, James L Cpa QUALIFIED83Stephen Shaw
1041Chavez BriddickJapan2026-06-01Feltz Printing Service PROPOSAL3Onyama Limba
1042Leja CaldareraArgentina2026-05-21Feiner Bros PROPOSAL46Onyama Limba
1043Wickens NestleIndia2026-05-23Benton, John B Jr UNQUALIFIED59Elwin Sharvill
1044Kaitlin OstroskyCanada2026-05-30Chanay, Jeffrey A Esq QUALIFIED93Bernardo Dominic
1045Aruna FigeroaUnited Kingdom2026-06-13Dorl, James J Esq NEGOTIATION50Stephen Shaw
1046James ButtIndia2026-06-10King, Christopher A Esq NEW67Ioni Bowcher
1047Misaki RoysterArgentina2026-06-18Feiner Bros RENEWAL37Asiya Javayant
1048Chavez BriddickCanada2026-06-01Morlong Associates PROPOSAL76Stephen Shaw
1049Octavia MaletAustralia2026-06-02Buckley Miller Wright NEW38Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Wickens NestleGermanyElwin Sharvill UNQUALIFIED
Chavez BriddickFranceOnyama Limba NEW
Greenwood BologniaIndiaAmy Elsner RENEWAL
Ashley DoeBrazilIoni Bowcher NEGOTIATION
Morrow RutaGermanyStephen Shaw UNQUALIFIED
Munro FerenczGermanyIvan Magalhaes PROPOSAL
Arvin AlbaresGermanyBernardo Dominic UNQUALIFIED
Adams MorascaRussiaIvan Magalhaes NEGOTIATION
Clifford RimGermanyAmy Elsner PROPOSAL
Jeanfrancois VenereJapanOnyama Limba PROPOSAL
Claire TollnerCanadaStephen Shaw RENEWAL
Ashley DoeArgentinaBernardo Dominic UNQUALIFIED
Murillo MaletJapanBernardo Dominic RENEWAL
Kaitlin OstroskyGermanyAnna Fali PROPOSAL
Aika InouyeAustraliaAnna Fali NEGOTIATION
Alejandro PerinGermanyXuxue Feng NEW
Aditya KuskoRussiaElwin Sharvill QUALIFIED
Cody SaylorsArgentinaIoni Bowcher UNQUALIFIED
Nicolas IturbideRussiaAsiya Javayant QUALIFIED
Jones VocelkaAustraliaIvan Magalhaes PROPOSAL
Adams MorascaBrazilIvan Magalhaes QUALIFIED
Maria MarrierRussiaOnyama Limba RENEWAL
Greenwood BologniaFranceIoni Bowcher QUALIFIED
Juan WieserCanadaIoni Bowcher NEW
Ivar PaprockiItalyBernardo Dominic NEW
Johnson SergiRussiaStephen Shaw PROPOSAL
David DarakjyIndiaIoni Bowcher QUALIFIED
Mujtaba NickaJapanIoni Bowcher NEGOTIATION
Francesco ShinkoGermanyOnyama Limba UNQUALIFIED
Mujtaba NickaBrazilOnyama Limba QUALIFIED
Costa DilliardAustraliaIvan Magalhaes UNQUALIFIED
Murillo MaletCanadaElwin Sharvill QUALIFIED
Aditya KuskoGermanyAsiya Javayant NEGOTIATION
Tony FollerArgentinaStephen Shaw UNQUALIFIED
Kadeem FlosiSpainAnna Fali UNQUALIFIED
Salvatore StockhamRussiaElwin Sharvill QUALIFIED
Aika InouyeBrazilIoni Bowcher UNQUALIFIED
Johnson SergiUnited KingdomIoni Bowcher RENEWAL
David DarakjyFranceIoni Bowcher PROPOSAL
Murillo MaletUnited KingdomIoni Bowcher UNQUALIFIED
Arvin AlbaresFranceElwin Sharvill PROPOSAL
Tony FollerGermanyXuxue Feng NEGOTIATION
Maria MarrierArgentinaIvan Magalhaes NEGOTIATION
Isabel BowleyJapanIoni Bowcher NEW
Juan WieserAustraliaBernardo Dominic NEW
Murillo MaletUnited KingdomAsiya Javayant NEW
Julie StensethSpainIoni Bowcher UNQUALIFIED
Cody SaylorsRussiaElwin Sharvill NEGOTIATION
Chavez BriddickIndiaXuxue Feng PROPOSAL
Wickens NestleGermanyAsiya Javayant QUALIFIED
Frozen Columns
Name
Jeanfrancois Venere
Jones Vocelka
Darci Poquette
Arvin Albares
Greenwood Bolognia
Adams Morasca
Jeanfrancois Venere
Ashley Doe
Rodrigues Campain
Sinclair Waycott
Ricardo Gaucho
Deepesh Chui
Aditya Kusko
Julie Stenseth
Misaki Royster
Smith Glick
Kadeem Flosi
Julie Stenseth
Munro Ferencz
Arvin Albares
Izzy Garufi
Octavia Malet
Silvio Slusarski
Deepesh Chui
Mujtaba Nicka
Jeanfrancois Venere
Johnson Sergi
Sinclair Waycott
Chavez Briddick
Maisha Rulapaugh
Tony Foller
Izzy Garufi
Nicolas Iturbide
Leon Oldroyd
Jefferson Schemmer
Aika Inouye
Tony Foller
Mujtaba Nicka
Tony Foller
Ivar Paprocki
Jeanfrancois Venere
Greenwood Bolognia
Leon Oldroyd
Julie Stenseth
Stacey Maclead
Octavia Malet
Octavia Malet
Francesco Shinko
Mayumi Kolmetz
Clifford Rim
IdCountryDate
1000France2026-05-31
1001Germany2026-05-28
1002Argentina2026-06-10
1003Spain2026-06-11
1004France2026-05-23
1005Canada2026-05-22
1006United Kingdom2026-06-15
1007Japan2026-05-26
1008Brazil2026-06-01
1009Japan2026-05-23
1010Canada2026-05-26
1011Canada2026-06-10
1012Brazil2026-06-04
1013Russia2026-06-12
1014Spain2026-06-06
1015France2026-05-24
1016Brazil2026-06-13
1017Russia2026-06-10
1018Russia2026-06-04
1019Brazil2026-05-31
1020Germany2026-05-23
1021United Kingdom2026-06-11
1022India2026-06-02
1023Japan2026-05-22
1024Canada2026-06-13
1025India2026-06-13
1026Japan2026-05-28
1027India2026-06-17
1028United Kingdom2026-06-07
1029Italy2026-05-20
1030Japan2026-06-07
1031Brazil2026-05-22
1032India2026-05-23
1033Japan2026-05-23
1034France2026-06-11
1035France2026-05-21
1036Italy2026-06-01
1037France2026-05-20
1038Brazil2026-06-16
1039Spain2026-05-29
1040India2026-06-18
1041France2026-05-25
1042Japan2026-06-04
1043Italy2026-06-01
1044Spain2026-05-30
1045Canada2026-05-29
1046France2026-05-28
1047Canada2026-06-15
1048France2026-06-17
1049Italy2026-05-27

On-Demand Data

NameIdCountryDate
Stacey Maclead1000Germany2026-06-08
Misaki Royster1001Spain2026-06-11
Faith Gillian1002Germany2026-05-21
Kaitlin Ostrosky1003Russia2026-05-29
Tony Foller1004Japan2026-06-17
Jeanfrancois Venere1005Germany2026-05-27
Ricardo Gaucho1006France2026-06-12
Francesco Shinko1007Russia2026-05-23
Leon Oldroyd1008Italy2026-05-20
Faith Gillian1009Australia2026-06-13
Munro Ferencz1010Spain2026-05-26
Greenwood Bolognia1011Australia2026-05-23
Ivar Paprocki1012Canada2026-06-01
Stacey Maclead1013United Kingdom2026-05-20
Greenwood Bolognia1014India2026-06-11
Sinclair Waycott1015Spain2026-06-11
Nicolas Iturbide1016Canada2026-05-28
Sinclair Waycott1017India2026-06-11
Johnson Sergi1018Russia2026-06-16
Salvatore Stockham1019Argentina2026-05-27
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Leon OldroydArgentinaBernardo Dominic PROPOSAL
Aruna FigeroaBrazilAnna Fali UNQUALIFIED
Kaitlin OstroskyFranceOnyama Limba NEW
Faith GillianCanadaStephen Shaw UNQUALIFIED
Sinclair WaycottIndiaBernardo Dominic QUALIFIED
Ricardo GauchoFranceBernardo Dominic PROPOSAL
Sinclair WaycottSpainAsiya Javayant RENEWAL
Maisha RulapaughItalyAnna Fali PROPOSAL
David DarakjyFranceIvan Magalhaes PROPOSAL
Emily WhobreyGermanyIoni Bowcher NEW
Mayumi KolmetzFranceIvan Magalhaes UNQUALIFIED
Silvio SlusarskiJapanIoni Bowcher NEW
Sinclair WaycottItalyAmy Elsner NEGOTIATION
Wickens NestleUnited KingdomAnna Fali UNQUALIFIED
Faith GillianSpainAnna Fali NEGOTIATION
Mujtaba NickaGermanyStephen Shaw NEW
Alejandro PerinAustraliaStephen Shaw PROPOSAL
Juan WieserRussiaElwin Sharvill NEGOTIATION
Leja CaldareraAustraliaXuxue Feng QUALIFIED
Adams MorascaIndiaOnyama Limba QUALIFIED
Costa DilliardFranceAmy Elsner NEW
Arvin AlbaresArgentinaAmy Elsner UNQUALIFIED
Julie StensethIndiaBernardo Dominic NEW
Munro FerenczFranceIvan Magalhaes NEGOTIATION
Leon OldroydGermanyAmy Elsner PROPOSAL
Julie StensethCanadaIvan Magalhaes UNQUALIFIED
Juan WieserBrazilAmy Elsner QUALIFIED
Rodrigues CampainIndiaIoni Bowcher NEW
Chavez BriddickItalyBernardo Dominic PROPOSAL
Leja CaldareraGermanyIoni Bowcher RENEWAL
Costa DilliardItalyElwin Sharvill QUALIFIED
Kadeem FlosiItalyAmy Elsner PROPOSAL
Jennifer AmigonCanadaStephen Shaw UNQUALIFIED
Stacey MacleadAustraliaStephen Shaw UNQUALIFIED
David DarakjyItalyStephen Shaw PROPOSAL
Costa DilliardUnited KingdomXuxue Feng PROPOSAL
Morrow RutaGermanyAnna Fali UNQUALIFIED
Darci PoquetteCanadaXuxue Feng QUALIFIED
Claire TollnerArgentinaXuxue Feng RENEWAL
Antonio CaudyUnited KingdomOnyama Limba 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>