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
Chavez BriddickCanadaIoni Bowcher PROPOSAL
Sinclair WaycottAustraliaXuxue Feng PROPOSAL
Julie StensethSpainAmy Elsner QUALIFIED
Wickens NestleArgentinaAnna Fali RENEWAL
Alejandro PerinIndiaIvan Magalhaes UNQUALIFIED
Francesco ShinkoArgentinaIvan Magalhaes QUALIFIED
Antonio CaudyItalyAmy Elsner PROPOSAL
Cody SaylorsAustraliaElwin Sharvill QUALIFIED
Alejandro PerinArgentinaStephen Shaw UNQUALIFIED
Johnson SergiGermanyAnna Fali NEGOTIATION
Maria MarrierIndiaXuxue Feng RENEWAL
Francesco ShinkoAustraliaAmy Elsner PROPOSAL
Misaki RoysterUnited KingdomStephen Shaw PROPOSAL
Darci PoquetteItalyAnna Fali UNQUALIFIED
Juan WieserArgentinaStephen Shaw QUALIFIED
Francesco ShinkoSpainXuxue Feng NEW
Jones VocelkaCanadaAnna Fali RENEWAL
Ricardo GauchoSpainIvan Magalhaes UNQUALIFIED
Johnson SergiGermanyStephen Shaw NEW
Antonio CaudyUnited KingdomXuxue Feng RENEWAL
Antonio CaudySpainOnyama Limba PROPOSAL
Darci PoquetteGermanyStephen Shaw NEGOTIATION
Misaki RoysterSpainAmy Elsner PROPOSAL
Emily WhobreyItalyAnna Fali PROPOSAL
Rodrigues CampainArgentinaOnyama Limba UNQUALIFIED
Kadeem FlosiIndiaXuxue Feng QUALIFIED
Ivar PaprockiIndiaXuxue Feng QUALIFIED
Johnson SergiBrazilIoni Bowcher PROPOSAL
Clifford RimGermanyElwin Sharvill UNQUALIFIED
Jennifer AmigonAustraliaAsiya Javayant UNQUALIFIED
Kaitlin OstroskyJapanStephen Shaw UNQUALIFIED
Jeanfrancois VenereJapanIvan Magalhaes NEW
Leja CaldareraSpainStephen Shaw NEW
Aditya KuskoSpainIvan Magalhaes PROPOSAL
Salvatore StockhamUnited KingdomAnna Fali NEW
Kadeem FlosiGermanyOnyama Limba UNQUALIFIED
Costa DilliardArgentinaAsiya Javayant RENEWAL
David DarakjyRussiaBernardo Dominic QUALIFIED
Jeanfrancois VenereJapanAmy Elsner NEW
Salvatore StockhamJapanBernardo Dominic QUALIFIED
Murillo MaletRussiaElwin Sharvill NEGOTIATION
Kadeem FlosiJapanStephen Shaw UNQUALIFIED
James ButtGermanyAmy Elsner NEGOTIATION
Murillo MaletIndiaAsiya Javayant RENEWAL
Stacey MacleadCanadaStephen Shaw PROPOSAL
Rodrigues CampainRussiaElwin Sharvill UNQUALIFIED
Kadeem FlosiFranceAsiya Javayant NEW
Maisha RulapaughArgentinaAnna Fali NEGOTIATION
Isabel BowleyUnited KingdomIvan Magalhaes UNQUALIFIED
Emily WhobreyCanadaElwin Sharvill RENEWAL
Horizontal
NameCountryRepresentativeStatus
Chavez BriddickBrazilIoni Bowcher UNQUALIFIED
Alejandro PerinRussiaIvan Magalhaes NEW
Izzy GarufiRussiaElwin Sharvill NEGOTIATION
Clifford RimIndiaIoni Bowcher PROPOSAL
Kadeem FlosiArgentinaAnna Fali QUALIFIED
Aruna FigeroaAustraliaOnyama Limba NEW
Ricardo GauchoJapanAmy Elsner NEGOTIATION
Rodrigues CampainSpainIvan Magalhaes NEGOTIATION
Leon OldroydSpainStephen Shaw UNQUALIFIED
Kadeem FlosiUnited KingdomXuxue Feng QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Cody SaylorsRussia2025-08-04Printing Dimensions QUALIFIED34Stephen Shaw
1001Greenwood BologniaAustralia2025-07-22Benton, John B Jr NEW85Amy Elsner
1002Francesco ShinkoBrazil2025-08-13Morlong Associates NEGOTIATION68Ioni Bowcher
1003Claire TollnerArgentina2025-08-10Rangoni Of Florence QUALIFIED67Bernardo Dominic
1004Ricardo GauchoIndia2025-07-20Chemel, James L Cpa QUALIFIED77Ioni Bowcher
1005Johnson SergiJapan2025-07-19Morlong Associates QUALIFIED24Amy Elsner
1006Izzy GarufiRussia2025-07-21Rousseaux, Michael Esq RENEWAL1Bernardo Dominic
1007Isabel BowleyAustralia2025-08-10Morlong Associates NEGOTIATION35Amy Elsner
1008Arvin AlbaresSpain2025-07-23Chapman, Ross E Esq UNQUALIFIED18Xuxue Feng
1009Greenwood BologniaArgentina2025-08-13Buckley Miller Wright NEGOTIATION66Anna Fali
1010Aika InouyeAustralia2025-08-12Printing Dimensions PROPOSAL77Xuxue Feng
1011Nicolas IturbideItaly2025-08-02Feiner Bros NEGOTIATION4Elwin Sharvill
1012Emily WhobreyJapan2025-07-31Truhlar And Truhlar Attys UNQUALIFIED52Anna Fali
1013Kadeem FlosiItaly2025-07-22Benton, John B Jr NEGOTIATION19Bernardo Dominic
1014Mujtaba NickaAustralia2025-08-02Dorl, James J Esq NEW24Anna Fali
1015Salvatore StockhamIndia2025-07-20Dorl, James J Esq RENEWAL69Anna Fali
1016Sinclair WaycottBrazil2025-08-05Rousseaux, Michael Esq NEGOTIATION90Asiya Javayant
1017Emily WhobreyArgentina2025-07-24Chanay, Jeffrey A Esq QUALIFIED81Stephen Shaw
1018Nicolas IturbideSpain2025-07-19King, Christopher A Esq PROPOSAL75Asiya Javayant
1019Jeanfrancois VenereFrance2025-07-26Printing Dimensions QUALIFIED65Onyama Limba
1020Chavez BriddickJapan2025-08-02Dorl, James J Esq NEW10Asiya Javayant
1021Izzy GarufiJapan2025-07-26Chapman, Ross E Esq NEGOTIATION76Bernardo Dominic
1022Ashley DoeGermany2025-08-13Buckley Miller Wright UNQUALIFIED18Asiya Javayant
1023Aditya KuskoAustralia2025-08-08King, Christopher A Esq UNQUALIFIED65Xuxue Feng
1024Nicolas IturbideUnited Kingdom2025-07-19Buckley Miller Wright UNQUALIFIED73Stephen Shaw
1025Aika InouyeItaly2025-07-30Feiner Bros NEW40Bernardo Dominic
1026Arvin AlbaresItaly2025-07-29Truhlar And Truhlar Attys NEW8Elwin Sharvill
1027Emily WhobreyAustralia2025-08-06Dorl, James J Esq NEGOTIATION28Asiya Javayant
1028Chavez BriddickArgentina2025-08-14Chanay, Jeffrey A Esq RENEWAL49Ioni Bowcher
1029Smith GlickIndia2025-08-07Benton, John B Jr NEW22Anna Fali
1030Mujtaba NickaAustralia2025-08-14Rousseaux, Michael Esq NEGOTIATION47Onyama Limba
1031Jones VocelkaSpain2025-07-29Feiner Bros PROPOSAL9Stephen Shaw
1032Clifford RimIndia2025-07-30King, Christopher A Esq UNQUALIFIED56Onyama Limba
1033Ricardo GauchoFrance2025-08-08Benton, John B Jr UNQUALIFIED16Amy Elsner
1034Deepesh ChuiIndia2025-07-25Rousseaux, Michael Esq UNQUALIFIED62Ioni Bowcher
1035Leja CaldareraGermany2025-08-13Chanay, Jeffrey A Esq NEW35Elwin Sharvill
1036Ricardo GauchoBrazil2025-07-25Chemel, James L Cpa NEW32Ioni Bowcher
1037Wickens NestleItaly2025-08-04Morlong Associates UNQUALIFIED87Xuxue Feng
1038Smith GlickFrance2025-07-24Printing Dimensions QUALIFIED84Bernardo Dominic
1039Jefferson SchemmerArgentina2025-07-21Buckley Miller Wright NEW39Anna Fali
1040Aditya KuskoArgentina2025-08-05Morlong Associates UNQUALIFIED47Anna Fali
1041Jefferson SchemmerSpain2025-08-03Morlong Associates PROPOSAL17Stephen Shaw
1042Adams MorascaRussia2025-07-20Benton, John B Jr NEGOTIATION96Anna Fali
1043Izzy GarufiSpain2025-08-07Rangoni Of Florence RENEWAL42Onyama Limba
1044James ButtItaly2025-07-25Rousseaux, Michael Esq PROPOSAL42Stephen Shaw
1045Misaki RoysterFrance2025-08-11Buckley Miller Wright PROPOSAL71Anna Fali
1046Munro FerenczIndia2025-07-26Printing Dimensions QUALIFIED82Bernardo Dominic
1047James ButtJapan2025-08-11Feiner Bros UNQUALIFIED30Onyama Limba
1048Misaki RoysterAustralia2025-08-07Chemel, James L Cpa PROPOSAL48Stephen Shaw
1049Chavez BriddickCanada2025-08-09Feiner Bros UNQUALIFIED98Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Stacey MacleadRussiaXuxue Feng RENEWAL
Costa DilliardIndiaAsiya Javayant UNQUALIFIED
Aruna FigeroaRussiaOnyama Limba NEGOTIATION
Salvatore StockhamItalyOnyama Limba NEGOTIATION
Kaitlin OstroskySpainIvan Magalhaes RENEWAL
Octavia MaletBrazilIvan Magalhaes PROPOSAL
Aditya KuskoItalyElwin Sharvill NEW
Rodrigues CampainUnited KingdomElwin Sharvill UNQUALIFIED
Rodrigues CampainAustraliaElwin Sharvill NEW
James ButtBrazilElwin Sharvill QUALIFIED
Mayumi KolmetzGermanyIoni Bowcher NEW
Antonio CaudyFranceElwin Sharvill NEW
Costa DilliardGermanyXuxue Feng UNQUALIFIED
David DarakjyRussiaXuxue Feng QUALIFIED
Silvio SlusarskiSpainBernardo Dominic UNQUALIFIED
Ashley DoeIndiaBernardo Dominic UNQUALIFIED
Octavia MaletArgentinaStephen Shaw QUALIFIED
Mujtaba NickaArgentinaXuxue Feng PROPOSAL
Alejandro PerinCanadaOnyama Limba UNQUALIFIED
Stacey MacleadBrazilIvan Magalhaes RENEWAL
Rodrigues CampainArgentinaStephen Shaw QUALIFIED
Clifford RimIndiaOnyama Limba NEW
Octavia MaletArgentinaXuxue Feng UNQUALIFIED
Cody SaylorsSpainAmy Elsner RENEWAL
Kadeem FlosiAustraliaOnyama Limba RENEWAL
Juan WieserItalyStephen Shaw NEGOTIATION
Kadeem FlosiArgentinaAsiya Javayant NEGOTIATION
Darci PoquetteJapanAmy Elsner NEW
Stacey MacleadIndiaElwin Sharvill NEW
Faith GillianRussiaAsiya Javayant NEW
Chavez BriddickIndiaIvan Magalhaes QUALIFIED
Emily WhobreyItalyAnna Fali PROPOSAL
David DarakjyJapanIoni Bowcher QUALIFIED
Alejandro PerinBrazilAnna Fali NEGOTIATION
Claire TollnerGermanyXuxue Feng NEW
Nicolas IturbideGermanyXuxue Feng PROPOSAL
Cody SaylorsCanadaStephen Shaw NEW
Octavia MaletItalyIoni Bowcher RENEWAL
Jefferson SchemmerItalyIoni Bowcher PROPOSAL
James ButtBrazilXuxue Feng UNQUALIFIED
Darci PoquetteUnited KingdomElwin Sharvill UNQUALIFIED
Ricardo GauchoItalyAmy Elsner PROPOSAL
Murillo MaletItalyElwin Sharvill NEGOTIATION
Aika InouyeArgentinaXuxue Feng PROPOSAL
Munro FerenczArgentinaIvan Magalhaes QUALIFIED
David DarakjyRussiaXuxue Feng RENEWAL
Aditya KuskoBrazilXuxue Feng QUALIFIED
Isabel BowleyArgentinaAmy Elsner QUALIFIED
Costa DilliardRussiaElwin Sharvill RENEWAL
Jefferson SchemmerBrazilElwin Sharvill RENEWAL
Frozen Columns
Name
Maria Marrier
Salvatore Stockham
Aditya Kusko
Ashley Doe
Silvio Slusarski
Leon Oldroyd
Leja Caldarera
Isabel Bowley
Jennifer Amigon
Ashley Doe
Aika Inouye
Deepesh Chui
Silvio Slusarski
Sinclair Waycott
Claire Tollner
Izzy Garufi
Aika Inouye
Maria Marrier
Tony Foller
Morrow Ruta
James Butt
Stacey Maclead
Octavia Malet
Aditya Kusko
Alejandro Perin
Juan Wieser
Misaki Royster
Wickens Nestle
Stacey Maclead
Jeanfrancois Venere
Clifford Rim
Alejandro Perin
Nicolas Iturbide
Mayumi Kolmetz
Maisha Rulapaugh
James Butt
Clifford Rim
Jones Vocelka
Antonio Caudy
Cody Saylors
Claire Tollner
Jones Vocelka
Chavez Briddick
Sinclair Waycott
Greenwood Bolognia
Juan Wieser
Kaitlin Ostrosky
Munro Ferencz
Greenwood Bolognia
Jefferson Schemmer
IdCountryDate
1000United Kingdom2025-07-29
1001Argentina2025-07-19
1002Brazil2025-07-26
1003Germany2025-08-11
1004India2025-08-08
1005India2025-08-06
1006Argentina2025-08-04
1007France2025-08-01
1008Brazil2025-07-24
1009France2025-08-07
1010Argentina2025-08-15
1011Australia2025-07-25
1012Argentina2025-08-16
1013India2025-08-15
1014Germany2025-08-16
1015Australia2025-08-16
1016Italy2025-07-21
1017Canada2025-08-10
1018Australia2025-08-12
1019Italy2025-08-15
1020Russia2025-08-06
1021Russia2025-07-31
1022Australia2025-07-26
1023France2025-08-04
1024United Kingdom2025-08-12
1025Italy2025-07-27
1026France2025-07-25
1027Brazil2025-07-28
1028Germany2025-08-06
1029Germany2025-08-09
1030Australia2025-07-29
1031Italy2025-08-15
1032Australia2025-08-12
1033Russia2025-08-09
1034France2025-07-23
1035Italy2025-07-27
1036Spain2025-08-04
1037Spain2025-08-06
1038France2025-07-26
1039Japan2025-07-19
1040India2025-08-03
1041Argentina2025-07-24
1042Australia2025-07-30
1043Argentina2025-07-24
1044Argentina2025-08-04
1045Italy2025-08-12
1046Argentina2025-08-04
1047Russia2025-07-30
1048Brazil2025-08-16
1049United Kingdom2025-08-15

On-Demand Data

NameIdCountryDate
Jefferson Schemmer1000Australia2025-07-19
Misaki Royster1001Germany2025-08-14
Smith Glick1002Germany2025-07-30
Silvio Slusarski1003Japan2025-08-12
Cody Saylors1004Spain2025-08-15
Jennifer Amigon1005Russia2025-08-10
Wickens Nestle1006Germany2025-07-26
Stacey Maclead1007France2025-08-12
Costa Dilliard1008Brazil2025-07-19
James Butt1009United Kingdom2025-08-03
Nicolas Iturbide1010Spain2025-08-08
Deepesh Chui1011France2025-08-13
Chavez Briddick1012Argentina2025-08-09
Ashley Doe1013India2025-08-11
Silvio Slusarski1014Canada2025-08-11
Jones Vocelka1015United Kingdom2025-07-20
Izzy Garufi1016Argentina2025-07-27
Claire Tollner1017United Kingdom2025-08-02
Julie Stenseth1018Japan2025-07-26
Emily Whobrey1019Spain2025-08-15
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Silvio SlusarskiJapanAsiya Javayant NEGOTIATION
Ricardo GauchoJapanAsiya Javayant PROPOSAL
Nicolas IturbideFranceAsiya Javayant UNQUALIFIED
Misaki RoysterJapanBernardo Dominic QUALIFIED
Aditya KuskoUnited KingdomStephen Shaw RENEWAL
Octavia MaletArgentinaAsiya Javayant NEW
Antonio CaudyBrazilBernardo Dominic QUALIFIED
Isabel BowleyJapanBernardo Dominic QUALIFIED
Nicolas IturbideUnited KingdomIvan Magalhaes QUALIFIED
Jefferson SchemmerAustraliaAsiya Javayant RENEWAL
Sinclair WaycottAustraliaAsiya Javayant RENEWAL
Faith GillianItalyStephen Shaw NEW
Nicolas IturbideGermanyXuxue Feng NEW
Misaki RoysterBrazilAsiya Javayant NEGOTIATION
Tony FollerArgentinaAsiya Javayant UNQUALIFIED
Ivar PaprockiJapanElwin Sharvill NEW
Ivar PaprockiSpainAnna Fali UNQUALIFIED
Greenwood BologniaSpainElwin Sharvill UNQUALIFIED
Jennifer AmigonCanadaElwin Sharvill NEW
Misaki RoysterFranceAsiya Javayant UNQUALIFIED
Claire TollnerArgentinaAnna Fali UNQUALIFIED
Emily WhobreyCanadaAmy Elsner PROPOSAL
James ButtCanadaStephen Shaw QUALIFIED
Morrow RutaItalyXuxue Feng NEW
Rodrigues CampainAustraliaOnyama Limba RENEWAL
Faith GillianGermanyAsiya Javayant UNQUALIFIED
Ricardo GauchoAustraliaIvan Magalhaes RENEWAL
Maria MarrierSpainAnna Fali UNQUALIFIED
Costa DilliardRussiaStephen Shaw PROPOSAL
Smith GlickCanadaIoni Bowcher NEGOTIATION
Ricardo GauchoSpainStephen Shaw RENEWAL
Leon OldroydItalyBernardo Dominic RENEWAL
Salvatore StockhamBrazilAnna Fali UNQUALIFIED
Jefferson SchemmerAustraliaStephen Shaw PROPOSAL
Faith GillianCanadaAsiya Javayant RENEWAL
Alejandro PerinFranceIoni Bowcher UNQUALIFIED
Johnson SergiRussiaStephen Shaw NEGOTIATION
Antonio CaudyJapanElwin Sharvill NEW
Smith GlickCanadaBernardo Dominic RENEWAL
Emily WhobreyGermanyXuxue 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>