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
Adams MorascaSpainAsiya Javayant NEGOTIATION
Aruna FigeroaJapanAnna Fali UNQUALIFIED
Julie StensethArgentinaBernardo Dominic QUALIFIED
Misaki RoysterArgentinaAnna Fali PROPOSAL
Aditya KuskoIndiaXuxue Feng NEGOTIATION
Darci PoquetteAustraliaAsiya Javayant PROPOSAL
Stacey MacleadIndiaAnna Fali NEGOTIATION
Costa DilliardJapanElwin Sharvill PROPOSAL
Leja CaldareraGermanyStephen Shaw PROPOSAL
Jennifer AmigonIndiaAsiya Javayant NEGOTIATION
Kadeem FlosiIndiaAmy Elsner PROPOSAL
Maria MarrierSpainStephen Shaw PROPOSAL
Claire TollnerSpainStephen Shaw NEGOTIATION
Silvio SlusarskiCanadaXuxue Feng NEGOTIATION
Octavia MaletIndiaIoni Bowcher NEW
David DarakjyAustraliaStephen Shaw RENEWAL
David DarakjyJapanElwin Sharvill NEW
Maria MarrierCanadaBernardo Dominic RENEWAL
Salvatore StockhamFranceBernardo Dominic NEGOTIATION
Ashley DoeRussiaOnyama Limba QUALIFIED
Wickens NestleIndiaAmy Elsner UNQUALIFIED
Wickens NestleIndiaOnyama Limba UNQUALIFIED
Julie StensethSpainBernardo Dominic RENEWAL
Sinclair WaycottCanadaXuxue Feng NEGOTIATION
Leja CaldareraAustraliaOnyama Limba RENEWAL
Rodrigues CampainGermanyAsiya Javayant QUALIFIED
Darci PoquetteAustraliaXuxue Feng NEW
James ButtRussiaOnyama Limba UNQUALIFIED
Claire TollnerRussiaAmy Elsner RENEWAL
Jefferson SchemmerRussiaAsiya Javayant PROPOSAL
Smith GlickGermanyAnna Fali NEW
Stacey MacleadUnited KingdomBernardo Dominic NEGOTIATION
Jeanfrancois VenereBrazilOnyama Limba RENEWAL
Antonio CaudySpainAmy Elsner PROPOSAL
Costa DilliardBrazilAnna Fali NEW
Isabel BowleyBrazilIvan Magalhaes NEW
Stacey MacleadFranceXuxue Feng UNQUALIFIED
Mujtaba NickaItalyBernardo Dominic QUALIFIED
Jefferson SchemmerUnited KingdomIvan Magalhaes PROPOSAL
Costa DilliardSpainOnyama Limba QUALIFIED
Ashley DoeGermanyStephen Shaw NEGOTIATION
Cody SaylorsFranceXuxue Feng RENEWAL
Faith GillianSpainElwin Sharvill QUALIFIED
Murillo MaletCanadaOnyama Limba NEW
James ButtItalyOnyama Limba UNQUALIFIED
Isabel BowleyBrazilIvan Magalhaes PROPOSAL
Munro FerenczAustraliaBernardo Dominic PROPOSAL
Adams MorascaItalyAnna Fali PROPOSAL
Aika InouyeSpainAmy Elsner NEW
Rodrigues CampainIndiaBernardo Dominic UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Leja CaldareraAustraliaStephen Shaw NEGOTIATION
Johnson SergiCanadaStephen Shaw UNQUALIFIED
Claire TollnerAustraliaStephen Shaw PROPOSAL
Aditya KuskoCanadaIoni Bowcher QUALIFIED
Maria MarrierSpainBernardo Dominic NEGOTIATION
Maria MarrierArgentinaIvan Magalhaes QUALIFIED
Tony FollerIndiaIvan Magalhaes NEW
Aruna FigeroaIndiaAmy Elsner QUALIFIED
Misaki RoysterAustraliaAnna Fali NEW
Darci PoquetteAustraliaStephen Shaw PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Misaki RoysterJapan2026-04-01Feltz Printing Service QUALIFIED65Stephen Shaw
1001Julie StensethFrance2026-04-19Morlong Associates UNQUALIFIED95Ivan Magalhaes
1002Alejandro PerinJapan2026-04-10Morlong Associates NEW53Anna Fali
1003Antonio CaudyAustralia2026-04-21Morlong Associates NEW59Xuxue Feng
1004Mayumi KolmetzGermany2026-04-24Truhlar And Truhlar Attys PROPOSAL9Asiya Javayant
1005Francesco ShinkoAustralia2026-04-18Commercial Press QUALIFIED72Elwin Sharvill
1006Leja CaldareraBrazil2026-04-24Rousseaux, Michael Esq UNQUALIFIED90Bernardo Dominic
1007Juan WieserSpain2026-04-19Rangoni Of Florence RENEWAL96Onyama Limba
1008Arvin AlbaresGermany2026-04-27Chanay, Jeffrey A Esq PROPOSAL47Amy Elsner
1009Ivar PaprockiFrance2026-04-01Rousseaux, Michael Esq NEW33Stephen Shaw
1010Aruna FigeroaJapan2026-04-20Dorl, James J Esq PROPOSAL9Amy Elsner
1011Ashley DoeSpain2026-04-20Benton, John B Jr NEGOTIATION91Bernardo Dominic
1012Salvatore StockhamAustralia2026-04-17Morlong Associates RENEWAL55Ioni Bowcher
1013Morrow RutaIndia2026-04-10Chanay, Jeffrey A Esq UNQUALIFIED81Amy Elsner
1014Munro FerenczSpain2026-04-26Chemel, James L Cpa UNQUALIFIED34Stephen Shaw
1015Alejandro PerinArgentina2026-04-12Chemel, James L Cpa NEW29Ioni Bowcher
1016Murillo MaletSpain2026-04-13Morlong Associates UNQUALIFIED6Ioni Bowcher
1017Alejandro PerinGermany2026-04-13Rangoni Of Florence QUALIFIED18Asiya Javayant
1018Kadeem FlosiIndia2026-04-07Buckley Miller Wright PROPOSAL38Anna Fali
1019Jennifer AmigonCanada2026-04-16Feiner Bros NEGOTIATION96Ioni Bowcher
1020Sinclair WaycottSpain2026-04-15King, Christopher A Esq QUALIFIED13Elwin Sharvill
1021Wickens NestleAustralia2026-04-14King, Christopher A Esq UNQUALIFIED76Xuxue Feng
1022Rodrigues CampainBrazil2026-04-14King, Christopher A Esq RENEWAL2Asiya Javayant
1023Arvin AlbaresGermany2026-04-25Printing Dimensions QUALIFIED16Amy Elsner
1024Faith GillianGermany2026-04-21Rangoni Of Florence NEW8Anna Fali
1025Julie StensethCanada2026-03-30Chanay, Jeffrey A Esq UNQUALIFIED12Asiya Javayant
1026Faith GillianRussia2026-04-04Chapman, Ross E Esq UNQUALIFIED3Amy Elsner
1027Emily WhobreyFrance2026-04-12Feltz Printing Service NEGOTIATION6Elwin Sharvill
1028Kadeem FlosiUnited Kingdom2026-04-07Printing Dimensions UNQUALIFIED60Bernardo Dominic
1029Adams MorascaIndia2026-04-08Buckley Miller Wright UNQUALIFIED77Asiya Javayant
1030Maria MarrierBrazil2026-04-05Feiner Bros UNQUALIFIED75Anna Fali
1031Morrow RutaCanada2026-03-31Benton, John B Jr PROPOSAL94Stephen Shaw
1032Darci PoquetteIndia2026-04-24Commercial Press UNQUALIFIED60Ivan Magalhaes
1033Stacey MacleadIndia2026-04-28Rousseaux, Michael Esq PROPOSAL32Bernardo Dominic
1034Julie StensethJapan2026-04-09King, Christopher A Esq NEW20Stephen Shaw
1035Misaki RoysterAustralia2026-04-13Printing Dimensions PROPOSAL74Stephen Shaw
1036Mayumi KolmetzSpain2026-03-31Chanay, Jeffrey A Esq PROPOSAL23Anna Fali
1037Cody SaylorsCanada2026-04-08Dorl, James J Esq NEGOTIATION82Ivan Magalhaes
1038Chavez BriddickIndia2026-04-21Buckley Miller Wright UNQUALIFIED30Xuxue Feng
1039Salvatore StockhamItaly2026-04-06Feiner Bros NEGOTIATION20Bernardo Dominic
1040Francesco ShinkoUnited Kingdom2026-04-20Commercial Press PROPOSAL43Onyama Limba
1041Emily WhobreyArgentina2026-04-25Benton, John B Jr NEGOTIATION15Amy Elsner
1042Ivar PaprockiIndia2026-04-23Commercial Press UNQUALIFIED34Onyama Limba
1043Tony FollerArgentina2026-04-21Buckley Miller Wright QUALIFIED13Bernardo Dominic
1044David DarakjyAustralia2026-04-04Feiner Bros NEGOTIATION24Asiya Javayant
1045Misaki RoysterUnited Kingdom2026-04-08Feltz Printing Service RENEWAL42Ivan Magalhaes
1046Smith GlickAustralia2026-04-18Chemel, James L Cpa PROPOSAL76Stephen Shaw
1047Ashley DoeUnited Kingdom2026-03-31Feltz Printing Service NEGOTIATION92Anna Fali
1048Johnson SergiFrance2026-04-28Truhlar And Truhlar Attys RENEWAL37Xuxue Feng
1049Costa DilliardItaly2026-04-17Chapman, Ross E Esq QUALIFIED18Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Jones VocelkaRussiaXuxue Feng RENEWAL
Jefferson SchemmerArgentinaOnyama Limba NEW
David DarakjyBrazilXuxue Feng QUALIFIED
Juan WieserArgentinaXuxue Feng NEW
Juan WieserItalyOnyama Limba PROPOSAL
Darci PoquetteFranceIoni Bowcher NEGOTIATION
Misaki RoysterArgentinaAmy Elsner UNQUALIFIED
Mayumi KolmetzRussiaOnyama Limba QUALIFIED
Greenwood BologniaJapanIvan Magalhaes NEW
Darci PoquetteRussiaStephen Shaw RENEWAL
Jeanfrancois VenereBrazilAnna Fali QUALIFIED
Wickens NestleGermanyIoni Bowcher QUALIFIED
Maria MarrierGermanyElwin Sharvill NEGOTIATION
Ivar PaprockiGermanyBernardo Dominic NEW
Johnson SergiRussiaAmy Elsner NEGOTIATION
Ricardo GauchoSpainElwin Sharvill UNQUALIFIED
David DarakjyGermanyIvan Magalhaes PROPOSAL
James ButtJapanAnna Fali NEGOTIATION
Juan WieserJapanBernardo Dominic UNQUALIFIED
Clifford RimIndiaOnyama Limba NEGOTIATION
Morrow RutaIndiaOnyama Limba NEW
Jennifer AmigonJapanElwin Sharvill RENEWAL
Antonio CaudyJapanBernardo Dominic UNQUALIFIED
Mujtaba NickaJapanIoni Bowcher NEGOTIATION
Smith GlickIndiaOnyama Limba RENEWAL
Salvatore StockhamRussiaIvan Magalhaes QUALIFIED
Faith GillianArgentinaStephen Shaw UNQUALIFIED
Greenwood BologniaSpainAnna Fali NEGOTIATION
James ButtBrazilAmy Elsner UNQUALIFIED
Izzy GarufiArgentinaAnna Fali QUALIFIED
Jeanfrancois VenereIndiaIoni Bowcher NEGOTIATION
Deepesh ChuiUnited KingdomOnyama Limba RENEWAL
Wickens NestleRussiaBernardo Dominic PROPOSAL
David DarakjyUnited KingdomIvan Magalhaes QUALIFIED
Kadeem FlosiItalyOnyama Limba NEGOTIATION
Alejandro PerinIndiaOnyama Limba NEW
Jeanfrancois VenereFranceElwin Sharvill NEGOTIATION
Sinclair WaycottJapanAnna Fali NEW
Aditya KuskoCanadaOnyama Limba NEGOTIATION
Maisha RulapaughSpainXuxue Feng QUALIFIED
Francesco ShinkoGermanyOnyama Limba NEGOTIATION
Costa DilliardUnited KingdomOnyama Limba NEGOTIATION
Wickens NestleArgentinaAmy Elsner QUALIFIED
Greenwood BologniaIndiaOnyama Limba RENEWAL
Arvin AlbaresUnited KingdomAmy Elsner PROPOSAL
Francesco ShinkoGermanyOnyama Limba RENEWAL
Cody SaylorsJapanAmy Elsner QUALIFIED
Sinclair WaycottJapanBernardo Dominic QUALIFIED
Maria MarrierJapanIoni Bowcher NEGOTIATION
Darci PoquetteItalyIvan Magalhaes RENEWAL
Frozen Columns
Name
Deepesh Chui
Emily Whobrey
James Butt
Jeanfrancois Venere
Francesco Shinko
Misaki Royster
Silvio Slusarski
Juan Wieser
Juan Wieser
Aika Inouye
Munro Ferencz
Jefferson Schemmer
Aika Inouye
Munro Ferencz
Julie Stenseth
Ashley Doe
Claire Tollner
Nicolas Iturbide
Jefferson Schemmer
Munro Ferencz
Rodrigues Campain
Silvio Slusarski
Costa Dilliard
Silvio Slusarski
Clifford Rim
Mayumi Kolmetz
Leon Oldroyd
Rodrigues Campain
Mayumi Kolmetz
Jennifer Amigon
Faith Gillian
Maisha Rulapaugh
Jones Vocelka
Kaitlin Ostrosky
Mujtaba Nicka
Deepesh Chui
Adams Morasca
Kadeem Flosi
Ivar Paprocki
Jefferson Schemmer
Aditya Kusko
Alejandro Perin
Cody Saylors
Darci Poquette
Rodrigues Campain
Salvatore Stockham
Sinclair Waycott
Ivar Paprocki
Leon Oldroyd
Izzy Garufi
IdCountryDate
1000India2026-04-18
1001Japan2026-03-31
1002France2026-03-31
1003Japan2026-04-20
1004Spain2026-04-20
1005United Kingdom2026-04-07
1006Canada2026-04-06
1007Canada2026-04-26
1008France2026-04-04
1009United Kingdom2026-03-30
1010Germany2026-03-30
1011Argentina2026-04-27
1012Argentina2026-04-16
1013Japan2026-04-12
1014Italy2026-04-11
1015Canada2026-04-01
1016United Kingdom2026-04-01
1017Brazil2026-04-13
1018United Kingdom2026-04-18
1019Spain2026-04-09
1020Japan2026-04-02
1021France2026-04-03
1022Italy2026-04-20
1023Argentina2026-04-11
1024India2026-04-06
1025Germany2026-04-23
1026United Kingdom2026-04-14
1027Spain2026-04-24
1028Italy2026-04-25
1029France2026-04-14
1030Japan2026-04-23
1031Germany2026-04-21
1032Italy2026-04-02
1033United Kingdom2026-04-21
1034Germany2026-04-13
1035Canada2026-04-27
1036Italy2026-04-14
1037Japan2026-04-12
1038India2026-04-23
1039India2026-04-10
1040Japan2026-04-21
1041Brazil2026-04-22
1042Germany2026-04-15
1043Russia2026-04-22
1044Canada2026-04-23
1045France2026-04-01
1046Russia2026-04-03
1047Italy2026-04-22
1048Italy2026-04-13
1049Russia2026-04-08

On-Demand Data

NameIdCountryDate
Maria Marrier1000United Kingdom2026-04-05
Johnson Sergi1001France2026-04-06
Salvatore Stockham1002Japan2026-04-06
Munro Ferencz1003Australia2026-04-28
Morrow Ruta1004Canada2026-03-30
Mujtaba Nicka1005United Kingdom2026-04-09
Mayumi Kolmetz1006Canada2026-04-02
Jeanfrancois Venere1007Brazil2026-04-21
Clifford Rim1008Russia2026-04-17
Deepesh Chui1009Germany2026-04-06
Maria Marrier1010Canada2026-04-04
Ricardo Gaucho1011Russia2026-04-07
Mayumi Kolmetz1012Russia2026-04-14
Alejandro Perin1013United Kingdom2026-04-26
Wickens Nestle1014France2026-04-21
Alejandro Perin1015Japan2026-04-28
Murillo Malet1016India2026-04-16
Johnson Sergi1017Japan2026-04-11
Ivar Paprocki1018United Kingdom2026-04-14
Darci Poquette1019Canada2026-04-15
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Ivar PaprockiFranceBernardo Dominic UNQUALIFIED
Stacey MacleadIndiaAnna Fali NEW
Greenwood BologniaItalyIoni Bowcher RENEWAL
Murillo MaletAustraliaStephen Shaw NEGOTIATION
Aika InouyeBrazilXuxue Feng PROPOSAL
Ashley DoeGermanyAsiya Javayant NEW
Jones VocelkaCanadaAmy Elsner NEW
Francesco ShinkoGermanyStephen Shaw UNQUALIFIED
Ashley DoeItalyIoni Bowcher NEW
Juan WieserBrazilIoni Bowcher NEW
Jefferson SchemmerSpainAmy Elsner RENEWAL
Isabel BowleyUnited KingdomXuxue Feng QUALIFIED
Claire TollnerUnited KingdomElwin Sharvill RENEWAL
Jennifer AmigonCanadaIoni Bowcher NEW
Wickens NestleIndiaAsiya Javayant UNQUALIFIED
Darci PoquetteGermanyStephen Shaw QUALIFIED
Munro FerenczIndiaIvan Magalhaes PROPOSAL
Francesco ShinkoJapanOnyama Limba RENEWAL
Morrow RutaSpainAnna Fali PROPOSAL
Mayumi KolmetzBrazilStephen Shaw PROPOSAL
Aika InouyeIndiaIvan Magalhaes NEGOTIATION
Jefferson SchemmerSpainElwin Sharvill NEGOTIATION
Maria MarrierJapanAsiya Javayant NEGOTIATION
Misaki RoysterJapanStephen Shaw NEGOTIATION
Stacey MacleadAustraliaIoni Bowcher UNQUALIFIED
Tony FollerItalyIoni Bowcher QUALIFIED
Jefferson SchemmerBrazilXuxue Feng RENEWAL
Alejandro PerinGermanyIoni Bowcher NEW
Morrow RutaBrazilIoni Bowcher RENEWAL
Maria MarrierGermanyBernardo Dominic NEGOTIATION
Mayumi KolmetzGermanyAmy Elsner PROPOSAL
Emily WhobreyBrazilIvan Magalhaes PROPOSAL
Ivar PaprockiItalyIvan Magalhaes QUALIFIED
Costa DilliardCanadaAnna Fali PROPOSAL
Aika InouyeGermanyIvan Magalhaes QUALIFIED
Kadeem FlosiAustraliaIoni Bowcher RENEWAL
Aika InouyeIndiaAmy Elsner NEW
Costa DilliardIndiaAsiya Javayant NEW
Leon OldroydBrazilAnna Fali PROPOSAL
Jennifer AmigonUnited KingdomAmy Elsner 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>