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
Johnson SergiItalyStephen Shaw QUALIFIED
Kaitlin OstroskyIndiaElwin Sharvill NEW
Murillo MaletArgentinaOnyama Limba QUALIFIED
Johnson SergiArgentinaStephen Shaw NEGOTIATION
Darci PoquetteRussiaXuxue Feng UNQUALIFIED
Antonio CaudyAustraliaXuxue Feng UNQUALIFIED
Morrow RutaGermanyOnyama Limba RENEWAL
Sinclair WaycottArgentinaOnyama Limba RENEWAL
Leon OldroydBrazilAmy Elsner RENEWAL
Leon OldroydArgentinaAnna Fali UNQUALIFIED
Ricardo GauchoAustraliaAmy Elsner UNQUALIFIED
Julie StensethBrazilAsiya Javayant UNQUALIFIED
Izzy GarufiAustraliaAmy Elsner NEGOTIATION
Maria MarrierJapanOnyama Limba PROPOSAL
Morrow RutaBrazilAmy Elsner QUALIFIED
Isabel BowleyItalyOnyama Limba NEW
Leja CaldareraBrazilAmy Elsner UNQUALIFIED
Aruna FigeroaFranceIvan Magalhaes NEW
Silvio SlusarskiArgentinaXuxue Feng NEW
Deepesh ChuiAustraliaIvan Magalhaes PROPOSAL
Arvin AlbaresJapanOnyama Limba RENEWAL
Clifford RimFranceOnyama Limba NEW
Jones VocelkaBrazilAsiya Javayant QUALIFIED
Aika InouyeJapanAsiya Javayant UNQUALIFIED
Nicolas IturbideAustraliaAnna Fali NEGOTIATION
Johnson SergiBrazilOnyama Limba NEW
Munro FerenczItalyIoni Bowcher PROPOSAL
Julie StensethGermanyXuxue Feng PROPOSAL
Aruna FigeroaRussiaIoni Bowcher NEW
Leon OldroydIndiaAnna Fali NEW
Jefferson SchemmerBrazilXuxue Feng QUALIFIED
David DarakjyIndiaBernardo Dominic QUALIFIED
Octavia MaletCanadaIoni Bowcher NEW
Wickens NestleAustraliaAnna Fali PROPOSAL
Ashley DoeBrazilAsiya Javayant RENEWAL
Rodrigues CampainGermanyIoni Bowcher NEGOTIATION
Leon OldroydRussiaAsiya Javayant QUALIFIED
David DarakjyItalyAmy Elsner NEW
Johnson SergiBrazilBernardo Dominic PROPOSAL
Jeanfrancois VenereJapanAsiya Javayant UNQUALIFIED
Maria MarrierGermanyIvan Magalhaes NEGOTIATION
Mujtaba NickaSpainAnna Fali PROPOSAL
Leon OldroydFranceBernardo Dominic UNQUALIFIED
Julie StensethSpainAmy Elsner QUALIFIED
Maisha RulapaughFranceAsiya Javayant QUALIFIED
Cody SaylorsJapanAsiya Javayant NEW
Maria MarrierJapanElwin Sharvill QUALIFIED
Misaki RoysterBrazilAsiya Javayant PROPOSAL
Clifford RimSpainStephen Shaw NEW
Cody SaylorsJapanAsiya Javayant NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Sinclair WaycottSpainIoni Bowcher NEGOTIATION
Adams MorascaItalyStephen Shaw UNQUALIFIED
Isabel BowleyBrazilStephen Shaw UNQUALIFIED
Clifford RimRussiaBernardo Dominic QUALIFIED
Ricardo GauchoBrazilAnna Fali PROPOSAL
Julie StensethGermanyAmy Elsner RENEWAL
Aditya KuskoRussiaBernardo Dominic NEGOTIATION
Munro FerenczArgentinaAmy Elsner NEW
Leon OldroydItalyAmy Elsner QUALIFIED
Aditya KuskoItalyBernardo Dominic NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Deepesh ChuiItaly2026-04-27Printing Dimensions RENEWAL1Stephen Shaw
1001Stacey MacleadAustralia2026-05-05Chapman, Ross E Esq UNQUALIFIED30Amy Elsner
1002Antonio CaudyArgentina2026-05-19Printing Dimensions PROPOSAL66Ivan Magalhaes
1003Faith GillianFrance2026-05-05Morlong Associates NEW41Ivan Magalhaes
1004Cody SaylorsItaly2026-05-08Feiner Bros PROPOSAL9Bernardo Dominic
1005Adams MorascaFrance2026-04-24Buckley Miller Wright QUALIFIED55Elwin Sharvill
1006Stacey MacleadArgentina2026-05-09Buckley Miller Wright PROPOSAL56Elwin Sharvill
1007Antonio CaudyBrazil2026-05-21King, Christopher A Esq PROPOSAL1Amy Elsner
1008Murillo MaletAustralia2026-04-24King, Christopher A Esq PROPOSAL46Anna Fali
1009Munro FerenczCanada2026-04-30Feltz Printing Service RENEWAL65Asiya Javayant
1010Juan WieserRussia2026-05-08Printing Dimensions NEGOTIATION46Asiya Javayant
1011Kaitlin OstroskyArgentina2026-05-10Commercial Press PROPOSAL92Ivan Magalhaes
1012Aruna FigeroaUnited Kingdom2026-04-29Morlong Associates NEGOTIATION98Ioni Bowcher
1013Isabel BowleyIndia2026-04-27King, Christopher A Esq PROPOSAL40Amy Elsner
1014Salvatore StockhamArgentina2026-04-29Feiner Bros NEGOTIATION62Elwin Sharvill
1015Stacey MacleadAustralia2026-04-24Feiner Bros PROPOSAL67Ioni Bowcher
1016Greenwood BologniaCanada2026-05-17Chapman, Ross E Esq NEW86Ivan Magalhaes
1017Mayumi KolmetzJapan2026-05-07Benton, John B Jr PROPOSAL51Elwin Sharvill
1018Nicolas IturbideRussia2026-04-25Rangoni Of Florence UNQUALIFIED17Elwin Sharvill
1019Sinclair WaycottCanada2026-05-11Dorl, James J Esq RENEWAL93Elwin Sharvill
1020Aditya KuskoArgentina2026-05-04Commercial Press RENEWAL93Onyama Limba
1021Leon OldroydItaly2026-05-11Feltz Printing Service NEW94Xuxue Feng
1022Jones VocelkaCanada2026-05-21Truhlar And Truhlar Attys QUALIFIED99Bernardo Dominic
1023Salvatore StockhamUnited Kingdom2026-04-24Chanay, Jeffrey A Esq QUALIFIED71Onyama Limba
1024Jeanfrancois VenereFrance2026-05-13Dorl, James J Esq RENEWAL86Elwin Sharvill
1025Arvin AlbaresCanada2026-05-04Benton, John B Jr NEGOTIATION8Stephen Shaw
1026Aditya KuskoSpain2026-04-29Rangoni Of Florence PROPOSAL99Amy Elsner
1027Stacey MacleadRussia2026-05-23Rousseaux, Michael Esq NEGOTIATION94Asiya Javayant
1028Salvatore StockhamFrance2026-05-08Buckley Miller Wright QUALIFIED26Amy Elsner
1029Wickens NestleRussia2026-05-11Commercial Press PROPOSAL87Bernardo Dominic
1030Greenwood BologniaRussia2026-05-07Rousseaux, Michael Esq UNQUALIFIED18Onyama Limba
1031Alejandro PerinIndia2026-05-07Morlong Associates RENEWAL90Asiya Javayant
1032Tony FollerIndia2026-05-13Rousseaux, Michael Esq QUALIFIED81Stephen Shaw
1033Murillo MaletGermany2026-05-03Chanay, Jeffrey A Esq PROPOSAL69Ivan Magalhaes
1034Julie StensethGermany2026-05-18Truhlar And Truhlar Attys NEGOTIATION29Ioni Bowcher
1035Mayumi KolmetzIndia2026-05-08Commercial Press QUALIFIED79Onyama Limba
1036Greenwood BologniaCanada2026-05-07Morlong Associates NEW60Stephen Shaw
1037Darci PoquetteItaly2026-05-06Printing Dimensions PROPOSAL96Anna Fali
1038Ivar PaprockiSpain2026-04-28Buckley Miller Wright RENEWAL12Asiya Javayant
1039Ricardo GauchoAustralia2026-05-18Morlong Associates RENEWAL68Asiya Javayant
1040Silvio SlusarskiGermany2026-05-05Feiner Bros UNQUALIFIED9Stephen Shaw
1041Deepesh ChuiJapan2026-05-16Morlong Associates NEGOTIATION66Ivan Magalhaes
1042Jennifer AmigonFrance2026-05-11Printing Dimensions NEW61Bernardo Dominic
1043Ricardo GauchoCanada2026-04-27Feltz Printing Service UNQUALIFIED24Xuxue Feng
1044Chavez BriddickAustralia2026-05-05Commercial Press NEGOTIATION5Stephen Shaw
1045Darci PoquetteBrazil2026-04-30Feiner Bros NEGOTIATION40Anna Fali
1046Morrow RutaAustralia2026-05-19Chemel, James L Cpa QUALIFIED75Elwin Sharvill
1047Mayumi KolmetzRussia2026-04-30Rousseaux, Michael Esq PROPOSAL70Elwin Sharvill
1048James ButtGermany2026-05-03Chemel, James L Cpa RENEWAL35Asiya Javayant
1049Julie StensethBrazil2026-05-23Truhlar And Truhlar Attys RENEWAL78Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Arvin AlbaresFranceOnyama Limba UNQUALIFIED
Aruna FigeroaAustraliaAmy Elsner UNQUALIFIED
Smith GlickGermanyElwin Sharvill UNQUALIFIED
Jones VocelkaCanadaXuxue Feng UNQUALIFIED
Johnson SergiUnited KingdomAsiya Javayant RENEWAL
Antonio CaudyRussiaAsiya Javayant UNQUALIFIED
Adams MorascaAustraliaAnna Fali UNQUALIFIED
Stacey MacleadBrazilAmy Elsner NEW
Kadeem FlosiCanadaXuxue Feng NEGOTIATION
Emily WhobreyIndiaIoni Bowcher NEGOTIATION
Wickens NestleItalyAsiya Javayant PROPOSAL
Smith GlickIndiaStephen Shaw NEW
Munro FerenczSpainIoni Bowcher UNQUALIFIED
Leja CaldareraAustraliaIvan Magalhaes NEW
Murillo MaletGermanyElwin Sharvill PROPOSAL
Aruna FigeroaUnited KingdomStephen Shaw NEW
Ivar PaprockiUnited KingdomBernardo Dominic NEGOTIATION
Jones VocelkaArgentinaAsiya Javayant UNQUALIFIED
Leja CaldareraGermanyElwin Sharvill NEGOTIATION
Costa DilliardGermanyElwin Sharvill RENEWAL
Kaitlin OstroskySpainIvan Magalhaes PROPOSAL
Wickens NestleItalyIoni Bowcher UNQUALIFIED
Aruna FigeroaBrazilOnyama Limba PROPOSAL
Mayumi KolmetzItalyAnna Fali UNQUALIFIED
Kadeem FlosiArgentinaBernardo Dominic UNQUALIFIED
Ashley DoeCanadaBernardo Dominic PROPOSAL
Cody SaylorsBrazilIvan Magalhaes UNQUALIFIED
Claire TollnerSpainAsiya Javayant NEGOTIATION
Misaki RoysterAustraliaXuxue Feng RENEWAL
Stacey MacleadSpainBernardo Dominic QUALIFIED
Mujtaba NickaIndiaOnyama Limba RENEWAL
Aika InouyeSpainStephen Shaw NEGOTIATION
Aruna FigeroaItalyIvan Magalhaes PROPOSAL
Tony FollerSpainStephen Shaw NEW
Munro FerenczRussiaIvan Magalhaes NEGOTIATION
Greenwood BologniaJapanOnyama Limba UNQUALIFIED
Izzy GarufiSpainIoni Bowcher QUALIFIED
Mayumi KolmetzIndiaIvan Magalhaes NEGOTIATION
Aika InouyeUnited KingdomAnna Fali NEW
Leon OldroydBrazilIoni Bowcher QUALIFIED
Nicolas IturbideCanadaAsiya Javayant NEW
Emily WhobreyRussiaIoni Bowcher RENEWAL
Johnson SergiSpainBernardo Dominic NEGOTIATION
Arvin AlbaresIndiaAsiya Javayant UNQUALIFIED
Isabel BowleyFranceIvan Magalhaes PROPOSAL
Murillo MaletBrazilStephen Shaw PROPOSAL
Leon OldroydJapanStephen Shaw UNQUALIFIED
Aditya KuskoRussiaStephen Shaw UNQUALIFIED
Munro FerenczSpainAsiya Javayant PROPOSAL
Juan WieserIndiaIvan Magalhaes NEGOTIATION
Frozen Columns
Name
Misaki Royster
Silvio Slusarski
Kadeem Flosi
Wickens Nestle
Claire Tollner
Tony Foller
Silvio Slusarski
Mayumi Kolmetz
Wickens Nestle
Adams Morasca
Ashley Doe
Rodrigues Campain
Jones Vocelka
Wickens Nestle
Johnson Sergi
Tony Foller
Murillo Malet
Clifford Rim
Misaki Royster
Costa Dilliard
David Darakjy
Aika Inouye
Deepesh Chui
Aika Inouye
Kadeem Flosi
Deepesh Chui
Emily Whobrey
Leja Caldarera
Aika Inouye
Morrow Ruta
Deepesh Chui
Emily Whobrey
David Darakjy
Izzy Garufi
Julie Stenseth
Nicolas Iturbide
Claire Tollner
Maria Marrier
Silvio Slusarski
Izzy Garufi
Aika Inouye
Octavia Malet
Antonio Caudy
Mayumi Kolmetz
Jones Vocelka
James Butt
Arvin Albares
Morrow Ruta
Kaitlin Ostrosky
Kaitlin Ostrosky
IdCountryDate
1000Argentina2026-04-24
1001United Kingdom2026-05-01
1002Canada2026-05-22
1003France2026-05-23
1004Brazil2026-05-10
1005Japan2026-05-14
1006Japan2026-05-01
1007Argentina2026-05-19
1008United Kingdom2026-05-23
1009Brazil2026-05-09
1010Canada2026-05-18
1011Japan2026-05-19
1012Australia2026-05-22
1013France2026-05-20
1014India2026-05-05
1015Italy2026-05-03
1016India2026-05-13
1017Spain2026-05-05
1018United Kingdom2026-05-04
1019Australia2026-05-03
1020Argentina2026-05-05
1021United Kingdom2026-04-24
1022Spain2026-04-29
1023India2026-05-07
1024India2026-05-06
1025Spain2026-04-25
1026Spain2026-04-29
1027United Kingdom2026-05-08
1028Brazil2026-05-15
1029United Kingdom2026-04-28
1030France2026-05-16
1031Russia2026-04-27
1032Italy2026-05-23
1033Germany2026-05-09
1034India2026-05-10
1035Russia2026-04-26
1036Australia2026-04-24
1037Spain2026-05-01
1038Russia2026-05-03
1039Australia2026-04-26
1040France2026-05-14
1041Russia2026-05-20
1042Spain2026-05-09
1043Japan2026-05-09
1044Japan2026-05-19
1045Spain2026-05-23
1046Russia2026-05-16
1047Canada2026-05-04
1048United Kingdom2026-05-20
1049Germany2026-05-03

On-Demand Data

NameIdCountryDate
Greenwood Bolognia1000Argentina2026-05-22
Jones Vocelka1001Italy2026-05-11
Jefferson Schemmer1002France2026-05-21
Wickens Nestle1003United Kingdom2026-05-09
Munro Ferencz1004Japan2026-05-18
Silvio Slusarski1005Russia2026-05-11
Costa Dilliard1006Italy2026-05-17
Faith Gillian1007Germany2026-05-23
Isabel Bowley1008Italy2026-05-21
Ivar Paprocki1009Japan2026-05-02
Claire Tollner1010Japan2026-05-11
Emily Whobrey1011Italy2026-04-27
Misaki Royster1012Brazil2026-05-02
Izzy Garufi1013Argentina2026-05-09
Chavez Briddick1014Canada2026-05-05
Leja Caldarera1015United Kingdom2026-05-16
Juan Wieser1016Russia2026-05-06
Nicolas Iturbide1017United Kingdom2026-05-17
Stacey Maclead1018Japan2026-04-24
Isabel Bowley1019Spain2026-04-27
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Octavia MaletJapanAnna Fali QUALIFIED
Johnson SergiIndiaStephen Shaw PROPOSAL
Juan WieserSpainStephen Shaw UNQUALIFIED
Ashley DoeAustraliaAsiya Javayant NEW
Rodrigues CampainGermanyXuxue Feng QUALIFIED
Juan WieserAustraliaOnyama Limba QUALIFIED
Cody SaylorsCanadaXuxue Feng PROPOSAL
Wickens NestleGermanyAmy Elsner PROPOSAL
Emily WhobreyGermanyAmy Elsner NEW
Claire TollnerUnited KingdomIvan Magalhaes QUALIFIED
Costa DilliardAustraliaIvan Magalhaes NEGOTIATION
Cody SaylorsFranceIvan Magalhaes PROPOSAL
Leja CaldareraArgentinaIoni Bowcher NEGOTIATION
Adams MorascaArgentinaElwin Sharvill QUALIFIED
Leon OldroydBrazilAnna Fali NEW
Francesco ShinkoItalyOnyama Limba NEGOTIATION
Ivar PaprockiGermanyOnyama Limba NEW
Ivar PaprockiRussiaElwin Sharvill PROPOSAL
Misaki RoysterBrazilOnyama Limba RENEWAL
Arvin AlbaresFranceElwin Sharvill NEW
Ricardo GauchoItalyAmy Elsner NEW
Clifford RimGermanyElwin Sharvill PROPOSAL
Emily WhobreyAustraliaAnna Fali QUALIFIED
Julie StensethJapanAsiya Javayant RENEWAL
Antonio CaudyBrazilXuxue Feng UNQUALIFIED
Jones VocelkaItalyIoni Bowcher NEGOTIATION
Octavia MaletFranceStephen Shaw NEGOTIATION
Adams MorascaJapanBernardo Dominic PROPOSAL
Arvin AlbaresBrazilStephen Shaw UNQUALIFIED
Munro FerenczGermanyAmy Elsner PROPOSAL
Nicolas IturbideGermanyIoni Bowcher PROPOSAL
Adams MorascaRussiaAsiya Javayant RENEWAL
Nicolas IturbideCanadaAnna Fali UNQUALIFIED
Aruna FigeroaUnited KingdomXuxue Feng QUALIFIED
Julie StensethUnited KingdomXuxue Feng PROPOSAL
Mujtaba NickaAustraliaAsiya Javayant NEGOTIATION
Darci PoquetteUnited KingdomIvan Magalhaes NEGOTIATION
Leon OldroydFranceAsiya Javayant NEGOTIATION
Aditya KuskoItalyStephen Shaw UNQUALIFIED
Jeanfrancois VenereItalyXuxue Feng NEW

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