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
Ricardo GauchoItalyXuxue Feng PROPOSAL
Izzy GarufiIndiaAmy Elsner PROPOSAL
David DarakjyItalyAnna Fali UNQUALIFIED
Chavez BriddickJapanOnyama Limba NEGOTIATION
Aruna FigeroaFranceOnyama Limba UNQUALIFIED
Mayumi KolmetzBrazilAsiya Javayant QUALIFIED
Jefferson SchemmerItalyIoni Bowcher QUALIFIED
Isabel BowleyItalyIvan Magalhaes NEW
Maisha RulapaughGermanyStephen Shaw NEGOTIATION
Smith GlickUnited KingdomOnyama Limba QUALIFIED
Kaitlin OstroskyItalyXuxue Feng NEGOTIATION
Julie StensethRussiaAsiya Javayant NEW
Sinclair WaycottArgentinaAnna Fali NEW
Costa DilliardArgentinaOnyama Limba RENEWAL
Leja CaldareraGermanyStephen Shaw PROPOSAL
Juan WieserGermanyIvan Magalhaes NEGOTIATION
Jones VocelkaArgentinaOnyama Limba NEW
Nicolas IturbideFranceXuxue Feng NEW
Deepesh ChuiBrazilAnna Fali QUALIFIED
Antonio CaudyArgentinaOnyama Limba NEGOTIATION
Antonio CaudyArgentinaAmy Elsner NEGOTIATION
Rodrigues CampainIndiaElwin Sharvill PROPOSAL
Claire TollnerGermanyIoni Bowcher NEW
Alejandro PerinRussiaAsiya Javayant RENEWAL
Morrow RutaGermanyAnna Fali NEW
Clifford RimRussiaBernardo Dominic RENEWAL
Silvio SlusarskiIndiaAnna Fali PROPOSAL
Maisha RulapaughCanadaAsiya Javayant PROPOSAL
Misaki RoysterRussiaElwin Sharvill PROPOSAL
Costa DilliardIndiaIoni Bowcher NEGOTIATION
Cody SaylorsSpainIoni Bowcher NEW
Aika InouyeRussiaAsiya Javayant UNQUALIFIED
Juan WieserSpainStephen Shaw PROPOSAL
Emily WhobreySpainBernardo Dominic UNQUALIFIED
Jefferson SchemmerArgentinaStephen Shaw PROPOSAL
Darci PoquetteArgentinaAnna Fali NEW
Stacey MacleadSpainOnyama Limba PROPOSAL
Darci PoquetteRussiaOnyama Limba QUALIFIED
Isabel BowleyAustraliaAmy Elsner NEW
Antonio CaudyAustraliaAnna Fali QUALIFIED
Smith GlickIndiaAmy Elsner NEGOTIATION
Julie StensethArgentinaElwin Sharvill RENEWAL
Clifford RimAustraliaXuxue Feng QUALIFIED
Jeanfrancois VenereArgentinaIvan Magalhaes NEW
David DarakjyGermanyStephen Shaw PROPOSAL
Leon OldroydSpainAsiya Javayant NEW
Morrow RutaRussiaAnna Fali RENEWAL
Aruna FigeroaCanadaIoni Bowcher QUALIFIED
Jefferson SchemmerGermanyBernardo Dominic PROPOSAL
Johnson SergiSpainOnyama Limba RENEWAL
Horizontal
NameCountryRepresentativeStatus
Smith GlickFranceAnna Fali RENEWAL
Francesco ShinkoArgentinaElwin Sharvill PROPOSAL
Morrow RutaFranceAsiya Javayant UNQUALIFIED
Smith GlickGermanyXuxue Feng NEW
Emily WhobreyFranceIoni Bowcher QUALIFIED
Darci PoquetteArgentinaAsiya Javayant PROPOSAL
Emily WhobreyGermanyIoni Bowcher NEGOTIATION
Silvio SlusarskiJapanIoni Bowcher NEW
Tony FollerFranceElwin Sharvill PROPOSAL
Antonio CaudyAustraliaAmy Elsner PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Kadeem FlosiItaly2026-05-30King, Christopher A Esq NEW64Bernardo Dominic
1001Aika InouyeGermany2026-05-25Chanay, Jeffrey A Esq NEW89Onyama Limba
1002Leon OldroydBrazil2026-06-03Feiner Bros RENEWAL80Bernardo Dominic
1003Misaki RoysterFrance2026-06-20Chapman, Ross E Esq UNQUALIFIED47Bernardo Dominic
1004Ashley DoeIndia2026-05-28King, Christopher A Esq NEW45Bernardo Dominic
1005Chavez BriddickSpain2026-06-08Dorl, James J Esq PROPOSAL38Ivan Magalhaes
1006Salvatore StockhamFrance2026-06-04Chanay, Jeffrey A Esq QUALIFIED1Ivan Magalhaes
1007Claire TollnerBrazil2026-06-19Benton, John B Jr RENEWAL91Anna Fali
1008Morrow RutaAustralia2026-06-16Chapman, Ross E Esq QUALIFIED1Anna Fali
1009Aika InouyeAustralia2026-06-19Morlong Associates RENEWAL27Xuxue Feng
1010Adams MorascaJapan2026-06-16Chemel, James L Cpa PROPOSAL83Amy Elsner
1011Ashley DoeGermany2026-05-24Dorl, James J Esq NEGOTIATION29Xuxue Feng
1012Costa DilliardItaly2026-06-16Dorl, James J Esq QUALIFIED61Xuxue Feng
1013Morrow RutaCanada2026-06-06Rangoni Of Florence RENEWAL0Stephen Shaw
1014Morrow RutaAustralia2026-06-20Dorl, James J Esq PROPOSAL12Asiya Javayant
1015Chavez BriddickRussia2026-05-30Feltz Printing Service QUALIFIED25Ivan Magalhaes
1016Aditya KuskoItaly2026-06-09Feltz Printing Service QUALIFIED64Anna Fali
1017Mayumi KolmetzRussia2026-06-19Benton, John B Jr RENEWAL15Stephen Shaw
1018Leon OldroydArgentina2026-06-16Truhlar And Truhlar Attys NEW25Elwin Sharvill
1019Jeanfrancois VenereFrance2026-06-22Chapman, Ross E Esq RENEWAL79Anna Fali
1020Aruna FigeroaJapan2026-05-31Feiner Bros PROPOSAL86Ioni Bowcher
1021Morrow RutaBrazil2026-05-25Feltz Printing Service UNQUALIFIED53Onyama Limba
1022Arvin AlbaresFrance2026-06-14Feiner Bros PROPOSAL6Asiya Javayant
1023Nicolas IturbideCanada2026-05-31Chanay, Jeffrey A Esq NEW42Xuxue Feng
1024Munro FerenczAustralia2026-05-25Commercial Press NEW14Onyama Limba
1025Isabel BowleyAustralia2026-06-05Chemel, James L Cpa RENEWAL34Xuxue Feng
1026Ashley DoeGermany2026-06-21Benton, John B Jr UNQUALIFIED66Ivan Magalhaes
1027Alejandro PerinGermany2026-06-04Rangoni Of Florence NEW29Ivan Magalhaes
1028Darci PoquetteJapan2026-06-08Feiner Bros NEGOTIATION11Anna Fali
1029Maria MarrierItaly2026-05-24Rousseaux, Michael Esq QUALIFIED63Ivan Magalhaes
1030Deepesh ChuiGermany2026-05-30Dorl, James J Esq UNQUALIFIED83Amy Elsner
1031Tony FollerSpain2026-06-05Printing Dimensions NEGOTIATION93Anna Fali
1032Stacey MacleadSpain2026-06-11Morlong Associates QUALIFIED5Xuxue Feng
1033Clifford RimItaly2026-06-16Chanay, Jeffrey A Esq NEGOTIATION79Bernardo Dominic
1034Maisha RulapaughBrazil2026-06-18Commercial Press UNQUALIFIED87Ivan Magalhaes
1035Isabel BowleySpain2026-06-20Benton, John B Jr RENEWAL35Amy Elsner
1036Izzy GarufiBrazil2026-05-25Dorl, James J Esq NEGOTIATION15Asiya Javayant
1037Leon OldroydSpain2026-05-31Morlong Associates PROPOSAL45Amy Elsner
1038Aruna FigeroaUnited Kingdom2026-06-19Dorl, James J Esq NEGOTIATION91Ivan Magalhaes
1039Deepesh ChuiBrazil2026-06-16King, Christopher A Esq NEGOTIATION6Anna Fali
1040Cody SaylorsUnited Kingdom2026-06-02Chapman, Ross E Esq UNQUALIFIED71Elwin Sharvill
1041Misaki RoysterCanada2026-05-31Benton, John B Jr NEW50Ivan Magalhaes
1042Faith GillianIndia2026-06-13Printing Dimensions NEW69Xuxue Feng
1043Arvin AlbaresSpain2026-06-13Truhlar And Truhlar Attys PROPOSAL0Asiya Javayant
1044Jones VocelkaCanada2026-06-21Chapman, Ross E Esq QUALIFIED19Ioni Bowcher
1045Alejandro PerinFrance2026-06-16Feiner Bros RENEWAL69Amy Elsner
1046Stacey MacleadRussia2026-06-22Rousseaux, Michael Esq PROPOSAL14Onyama Limba
1047Leja CaldareraCanada2026-06-13Chemel, James L Cpa UNQUALIFIED80Onyama Limba
1048Francesco ShinkoUnited Kingdom2026-05-30Feiner Bros NEGOTIATION81Elwin Sharvill
1049Juan WieserBrazil2026-06-11Dorl, James J Esq PROPOSAL64Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Silvio SlusarskiIndiaAnna Fali PROPOSAL
Wickens NestleSpainAmy Elsner PROPOSAL
Francesco ShinkoArgentinaAnna Fali QUALIFIED
Johnson SergiBrazilStephen Shaw QUALIFIED
Clifford RimFranceAnna Fali NEW
Jennifer AmigonIndiaIoni Bowcher QUALIFIED
Jeanfrancois VenereJapanElwin Sharvill RENEWAL
Arvin AlbaresItalyAmy Elsner RENEWAL
Nicolas IturbideArgentinaElwin Sharvill NEGOTIATION
Stacey MacleadItalyBernardo Dominic QUALIFIED
Maisha RulapaughItalyXuxue Feng QUALIFIED
Jeanfrancois VenereItalyOnyama Limba QUALIFIED
Salvatore StockhamCanadaAmy Elsner RENEWAL
Jennifer AmigonSpainIvan Magalhaes QUALIFIED
Silvio SlusarskiIndiaAmy Elsner RENEWAL
Tony FollerCanadaXuxue Feng NEW
Nicolas IturbideArgentinaOnyama Limba QUALIFIED
Francesco ShinkoBrazilOnyama Limba UNQUALIFIED
Izzy GarufiGermanyAnna Fali RENEWAL
Adams MorascaRussiaAsiya Javayant UNQUALIFIED
Kadeem FlosiFranceXuxue Feng NEW
Jeanfrancois VenereRussiaStephen Shaw NEGOTIATION
Ashley DoeRussiaIvan Magalhaes NEW
Munro FerenczIndiaOnyama Limba UNQUALIFIED
Silvio SlusarskiArgentinaBernardo Dominic QUALIFIED
Sinclair WaycottUnited KingdomStephen Shaw PROPOSAL
Isabel BowleyFranceStephen Shaw QUALIFIED
Johnson SergiItalyOnyama Limba NEGOTIATION
Faith GillianAustraliaAmy Elsner NEW
Murillo MaletBrazilIvan Magalhaes UNQUALIFIED
Aruna FigeroaCanadaOnyama Limba NEW
Aika InouyeArgentinaXuxue Feng NEGOTIATION
Kadeem FlosiBrazilElwin Sharvill RENEWAL
Morrow RutaItalyXuxue Feng RENEWAL
Wickens NestleBrazilIoni Bowcher UNQUALIFIED
Rodrigues CampainRussiaAmy Elsner QUALIFIED
Murillo MaletFranceAsiya Javayant NEGOTIATION
Mujtaba NickaIndiaIoni Bowcher QUALIFIED
Darci PoquetteJapanAsiya Javayant NEGOTIATION
Antonio CaudyItalyOnyama Limba UNQUALIFIED
Juan WieserJapanBernardo Dominic PROPOSAL
Octavia MaletUnited KingdomStephen Shaw QUALIFIED
Arvin AlbaresArgentinaBernardo Dominic QUALIFIED
Nicolas IturbideArgentinaAnna Fali QUALIFIED
Arvin AlbaresFranceIoni Bowcher RENEWAL
Aruna FigeroaCanadaElwin Sharvill QUALIFIED
Jeanfrancois VenereBrazilAmy Elsner RENEWAL
Aruna FigeroaJapanXuxue Feng UNQUALIFIED
Smith GlickJapanXuxue Feng UNQUALIFIED
Nicolas IturbideAustraliaIvan Magalhaes NEW
Frozen Columns
Name
Mayumi Kolmetz
Adams Morasca
Francesco Shinko
Antonio Caudy
Stacey Maclead
Jennifer Amigon
Julie Stenseth
Francesco Shinko
Aika Inouye
Ricardo Gaucho
Salvatore Stockham
Murillo Malet
Misaki Royster
Deepesh Chui
Juan Wieser
Jefferson Schemmer
Chavez Briddick
Darci Poquette
Deepesh Chui
Julie Stenseth
Kaitlin Ostrosky
Maisha Rulapaugh
Kaitlin Ostrosky
Maria Marrier
Jefferson Schemmer
Izzy Garufi
Mujtaba Nicka
Tony Foller
Leon Oldroyd
Mayumi Kolmetz
Aditya Kusko
Adams Morasca
Tony Foller
Salvatore Stockham
Clifford Rim
Greenwood Bolognia
Silvio Slusarski
Deepesh Chui
Claire Tollner
Kaitlin Ostrosky
Octavia Malet
Cody Saylors
Misaki Royster
Jennifer Amigon
Rodrigues Campain
Aika Inouye
Cody Saylors
Tony Foller
Silvio Slusarski
Emily Whobrey
IdCountryDate
1000Australia2026-06-07
1001United Kingdom2026-05-25
1002Brazil2026-06-10
1003Spain2026-06-19
1004Spain2026-06-01
1005Germany2026-06-22
1006Australia2026-06-05
1007Germany2026-06-08
1008Canada2026-06-06
1009Canada2026-05-27
1010Russia2026-06-17
1011Brazil2026-05-27
1012France2026-06-21
1013Argentina2026-06-21
1014Germany2026-06-10
1015United Kingdom2026-05-31
1016United Kingdom2026-06-06
1017India2026-06-10
1018Italy2026-06-02
1019Argentina2026-05-27
1020India2026-06-09
1021Argentina2026-05-27
1022Canada2026-05-31
1023Spain2026-06-19
1024Japan2026-05-26
1025Canada2026-05-25
1026Canada2026-06-09
1027France2026-06-16
1028Brazil2026-06-03
1029Spain2026-05-30
1030Russia2026-06-19
1031Germany2026-06-11
1032Australia2026-06-11
1033Italy2026-06-02
1034Japan2026-06-16
1035Spain2026-05-31
1036Canada2026-06-15
1037Japan2026-06-04
1038Japan2026-05-31
1039Japan2026-06-12
1040Spain2026-05-28
1041Germany2026-06-13
1042United Kingdom2026-06-09
1043Italy2026-06-08
1044Spain2026-06-04
1045India2026-06-21
1046Canada2026-05-24
1047Brazil2026-05-31
1048Germany2026-06-04
1049Brazil2026-06-09

On-Demand Data

NameIdCountryDate
Leja Caldarera1000United Kingdom2026-06-08
Jefferson Schemmer1001Brazil2026-06-05
Alejandro Perin1002Brazil2026-06-10
Greenwood Bolognia1003France2026-06-09
Kadeem Flosi1004Spain2026-06-19
Faith Gillian1005Canada2026-06-17
James Butt1006Spain2026-06-01
Deepesh Chui1007Argentina2026-06-05
Adams Morasca1008United Kingdom2026-06-03
Emily Whobrey1009Australia2026-06-18
Ricardo Gaucho1010India2026-06-18
Aditya Kusko1011Russia2026-06-01
Murillo Malet1012Germany2026-06-18
Nicolas Iturbide1013Brazil2026-05-31
Jones Vocelka1014Argentina2026-06-19
Juan Wieser1015United Kingdom2026-06-16
Salvatore Stockham1016Russia2026-06-07
James Butt1017Spain2026-06-05
Izzy Garufi1018Argentina2026-06-14
James Butt1019India2026-06-07
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jeanfrancois VenereJapanOnyama Limba QUALIFIED
Jefferson SchemmerJapanAmy Elsner QUALIFIED
Munro FerenczBrazilAmy Elsner QUALIFIED
Juan WieserGermanyBernardo Dominic UNQUALIFIED
Darci PoquetteSpainBernardo Dominic PROPOSAL
Rodrigues CampainUnited KingdomAsiya Javayant NEW
Ivar PaprockiArgentinaXuxue Feng NEGOTIATION
Rodrigues CampainFranceOnyama Limba RENEWAL
Morrow RutaUnited KingdomAnna Fali RENEWAL
Alejandro PerinCanadaOnyama Limba PROPOSAL
Maisha RulapaughIndiaIoni Bowcher UNQUALIFIED
Juan WieserSpainAsiya Javayant PROPOSAL
Kadeem FlosiFranceAsiya Javayant RENEWAL
Tony FollerFranceElwin Sharvill UNQUALIFIED
Aruna FigeroaGermanyOnyama Limba UNQUALIFIED
Alejandro PerinFranceXuxue Feng PROPOSAL
Clifford RimCanadaAmy Elsner QUALIFIED
Leja CaldareraArgentinaIvan Magalhaes UNQUALIFIED
Johnson SergiJapanAsiya Javayant RENEWAL
Deepesh ChuiSpainXuxue Feng RENEWAL
Deepesh ChuiSpainElwin Sharvill UNQUALIFIED
Greenwood BologniaFranceAnna Fali RENEWAL
Aika InouyeSpainStephen Shaw RENEWAL
Jeanfrancois VenereBrazilBernardo Dominic PROPOSAL
Ivar PaprockiSpainIvan Magalhaes QUALIFIED
Maria MarrierUnited KingdomAnna Fali PROPOSAL
Mayumi KolmetzJapanIoni Bowcher UNQUALIFIED
Jefferson SchemmerAustraliaAsiya Javayant UNQUALIFIED
Ashley DoeArgentinaIvan Magalhaes NEGOTIATION
Kaitlin OstroskyJapanXuxue Feng QUALIFIED
Clifford RimAustraliaAsiya Javayant NEW
David DarakjyFranceStephen Shaw PROPOSAL
Jeanfrancois VenereSpainStephen Shaw NEGOTIATION
Adams MorascaIndiaXuxue Feng PROPOSAL
Deepesh ChuiRussiaOnyama Limba QUALIFIED
Ricardo GauchoRussiaOnyama Limba NEGOTIATION
Nicolas IturbideRussiaXuxue Feng RENEWAL
Maria MarrierFranceIvan Magalhaes QUALIFIED
Leja CaldareraJapanAmy Elsner NEW
Costa DilliardRussiaAsiya Javayant QUALIFIED

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