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
Jefferson SchemmerIndiaXuxue Feng PROPOSAL
Smith GlickSpainStephen Shaw QUALIFIED
Claire TollnerArgentinaAmy Elsner RENEWAL
Costa DilliardBrazilAnna Fali QUALIFIED
Isabel BowleyBrazilAmy Elsner PROPOSAL
Cody SaylorsCanadaOnyama Limba UNQUALIFIED
Johnson SergiItalyAmy Elsner NEGOTIATION
Jefferson SchemmerBrazilAnna Fali NEW
Leja CaldareraAustraliaBernardo Dominic PROPOSAL
Ivar PaprockiItalyBernardo Dominic UNQUALIFIED
Kadeem FlosiArgentinaStephen Shaw UNQUALIFIED
Jefferson SchemmerSpainIoni Bowcher UNQUALIFIED
Sinclair WaycottUnited KingdomElwin Sharvill RENEWAL
Munro FerenczBrazilIvan Magalhaes NEW
Kaitlin OstroskyItalyStephen Shaw QUALIFIED
Francesco ShinkoBrazilAmy Elsner NEW
James ButtItalyIvan Magalhaes QUALIFIED
Mayumi KolmetzItalyIvan Magalhaes RENEWAL
Ivar PaprockiIndiaElwin Sharvill NEW
Arvin AlbaresSpainIvan Magalhaes QUALIFIED
Jeanfrancois VenereFranceBernardo Dominic PROPOSAL
Maria MarrierRussiaElwin Sharvill QUALIFIED
Mayumi KolmetzFranceAmy Elsner RENEWAL
Antonio CaudyArgentinaOnyama Limba UNQUALIFIED
Claire TollnerItalyStephen Shaw PROPOSAL
Murillo MaletIndiaAnna Fali NEGOTIATION
Clifford RimUnited KingdomIvan Magalhaes QUALIFIED
Kaitlin OstroskyIndiaAsiya Javayant UNQUALIFIED
Leon OldroydAustraliaAsiya Javayant RENEWAL
Costa DilliardBrazilOnyama Limba PROPOSAL
Kaitlin OstroskyAustraliaAmy Elsner QUALIFIED
Adams MorascaGermanyOnyama Limba QUALIFIED
Stacey MacleadItalyOnyama Limba NEW
Cody SaylorsIndiaAsiya Javayant NEW
Greenwood BologniaBrazilStephen Shaw UNQUALIFIED
Faith GillianUnited KingdomStephen Shaw PROPOSAL
Mujtaba NickaJapanIoni Bowcher NEGOTIATION
Octavia MaletArgentinaAnna Fali QUALIFIED
Jeanfrancois VenereSpainAsiya Javayant UNQUALIFIED
Silvio SlusarskiBrazilBernardo Dominic RENEWAL
Greenwood BologniaAustraliaAmy Elsner PROPOSAL
Kaitlin OstroskyFranceOnyama Limba PROPOSAL
Smith GlickRussiaXuxue Feng UNQUALIFIED
Clifford RimRussiaIvan Magalhaes RENEWAL
Tony FollerFranceIoni Bowcher QUALIFIED
Antonio CaudyBrazilAmy Elsner NEW
Alejandro PerinAustraliaIvan Magalhaes RENEWAL
Greenwood BologniaIndiaAmy Elsner QUALIFIED
Morrow RutaJapanElwin Sharvill NEGOTIATION
Aditya KuskoIndiaXuxue Feng UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Jefferson SchemmerIndiaIvan Magalhaes NEGOTIATION
Silvio SlusarskiBrazilAsiya Javayant NEW
Nicolas IturbideIndiaIvan Magalhaes NEW
Murillo MaletSpainIvan Magalhaes QUALIFIED
Greenwood BologniaAustraliaXuxue Feng RENEWAL
Johnson SergiUnited KingdomAsiya Javayant RENEWAL
Kadeem FlosiArgentinaStephen Shaw QUALIFIED
Leon OldroydArgentinaBernardo Dominic UNQUALIFIED
David DarakjyCanadaXuxue Feng NEGOTIATION
Misaki RoysterIndiaIvan Magalhaes NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Costa DilliardItaly2026-05-22Commercial Press UNQUALIFIED51Onyama Limba
1001Jones VocelkaArgentina2026-06-06Printing Dimensions RENEWAL19Asiya Javayant
1002Aika InouyeSpain2026-05-16Benton, John B Jr PROPOSAL93Ioni Bowcher
1003Ivar PaprockiJapan2026-06-01Benton, John B Jr NEW98Elwin Sharvill
1004Darci PoquetteAustralia2026-05-30Dorl, James J Esq NEW80Amy Elsner
1005Costa DilliardUnited Kingdom2026-05-27Morlong Associates RENEWAL87Elwin Sharvill
1006Jennifer AmigonJapan2026-05-30Commercial Press QUALIFIED47Asiya Javayant
1007Emily WhobreyBrazil2026-05-15Dorl, James J Esq QUALIFIED20Onyama Limba
1008Maria MarrierIndia2026-05-24Chapman, Ross E Esq QUALIFIED4Asiya Javayant
1009Leja CaldareraAustralia2026-05-28King, Christopher A Esq RENEWAL97Anna Fali
1010Izzy GarufiSpain2026-06-06Rangoni Of Florence NEW44Elwin Sharvill
1011Izzy GarufiRussia2026-06-11Chemel, James L Cpa PROPOSAL95Stephen Shaw
1012Ricardo GauchoBrazil2026-05-22Commercial Press UNQUALIFIED77Ivan Magalhaes
1013Stacey MacleadSpain2026-05-20Feiner Bros NEW19Elwin Sharvill
1014Wickens NestleAustralia2026-05-14Dorl, James J Esq PROPOSAL93Ioni Bowcher
1015Chavez BriddickAustralia2026-05-16Chapman, Ross E Esq UNQUALIFIED11Asiya Javayant
1016Salvatore StockhamAustralia2026-05-18Rousseaux, Michael Esq UNQUALIFIED77Ioni Bowcher
1017Misaki RoysterItaly2026-06-09Feiner Bros NEGOTIATION67Onyama Limba
1018Mujtaba NickaCanada2026-05-19Commercial Press PROPOSAL65Onyama Limba
1019Claire TollnerBrazil2026-06-07Morlong Associates NEGOTIATION90Elwin Sharvill
1020Antonio CaudyAustralia2026-05-17Chapman, Ross E Esq PROPOSAL59Anna Fali
1021Nicolas IturbideRussia2026-06-12Rousseaux, Michael Esq NEW43Asiya Javayant
1022Darci PoquetteArgentina2026-05-25Truhlar And Truhlar Attys NEGOTIATION93Ivan Magalhaes
1023Alejandro PerinFrance2026-06-08Dorl, James J Esq RENEWAL11Ioni Bowcher
1024James ButtSpain2026-06-06Rangoni Of Florence QUALIFIED50Onyama Limba
1025Clifford RimArgentina2026-06-08Chapman, Ross E Esq UNQUALIFIED45Ioni Bowcher
1026Misaki RoysterFrance2026-06-01Chapman, Ross E Esq PROPOSAL3Amy Elsner
1027Faith GillianUnited Kingdom2026-06-01Rousseaux, Michael Esq PROPOSAL59Xuxue Feng
1028Ivar PaprockiIndia2026-05-18Chemel, James L Cpa UNQUALIFIED28Bernardo Dominic
1029Jones VocelkaGermany2026-06-07Chanay, Jeffrey A Esq PROPOSAL78Xuxue Feng
1030Faith GillianAustralia2026-06-08Benton, John B Jr PROPOSAL17Ivan Magalhaes
1031Johnson SergiRussia2026-06-01Feiner Bros NEGOTIATION55Asiya Javayant
1032Johnson SergiRussia2026-05-15Chapman, Ross E Esq UNQUALIFIED57Ioni Bowcher
1033Misaki RoysterItaly2026-06-11Chanay, Jeffrey A Esq RENEWAL62Anna Fali
1034Antonio CaudyGermany2026-05-24Chemel, James L Cpa PROPOSAL35Asiya Javayant
1035Claire TollnerItaly2026-06-08Rangoni Of Florence NEGOTIATION16Stephen Shaw
1036Smith GlickAustralia2026-05-21Dorl, James J Esq PROPOSAL64Stephen Shaw
1037Antonio CaudySpain2026-06-11Benton, John B Jr PROPOSAL13Ivan Magalhaes
1038Clifford RimAustralia2026-05-30Rangoni Of Florence RENEWAL48Onyama Limba
1039Aditya KuskoIndia2026-05-28Rangoni Of Florence RENEWAL52Onyama Limba
1040Deepesh ChuiSpain2026-06-10Benton, John B Jr QUALIFIED64Bernardo Dominic
1041Faith GillianFrance2026-05-15Chapman, Ross E Esq NEW6Anna Fali
1042Juan WieserCanada2026-05-16Benton, John B Jr NEGOTIATION19Ivan Magalhaes
1043Antonio CaudyArgentina2026-05-27Dorl, James J Esq RENEWAL55Asiya Javayant
1044Mayumi KolmetzRussia2026-05-28Chanay, Jeffrey A Esq UNQUALIFIED84Amy Elsner
1045Alejandro PerinArgentina2026-06-11Dorl, James J Esq PROPOSAL28Anna Fali
1046Stacey MacleadItaly2026-06-04Morlong Associates NEW5Ivan Magalhaes
1047Tony FollerUnited Kingdom2026-06-02Dorl, James J Esq NEGOTIATION32Ivan Magalhaes
1048Tony FollerArgentina2026-05-25Commercial Press QUALIFIED29Stephen Shaw
1049Alejandro PerinAustralia2026-05-25Commercial Press RENEWAL57Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Mayumi KolmetzIndiaXuxue Feng UNQUALIFIED
Alejandro PerinIndiaAsiya Javayant RENEWAL
Kaitlin OstroskyBrazilAnna Fali NEGOTIATION
Tony FollerArgentinaIoni Bowcher QUALIFIED
Isabel BowleyItalyXuxue Feng QUALIFIED
Maria MarrierItalyAmy Elsner UNQUALIFIED
Jeanfrancois VenereIndiaXuxue Feng NEGOTIATION
Chavez BriddickArgentinaOnyama Limba NEGOTIATION
Munro FerenczCanadaIoni Bowcher NEW
Clifford RimRussiaOnyama Limba PROPOSAL
Nicolas IturbideGermanyBernardo Dominic RENEWAL
Arvin AlbaresIndiaXuxue Feng NEW
Morrow RutaJapanStephen Shaw RENEWAL
Jennifer AmigonItalyElwin Sharvill RENEWAL
Tony FollerItalyIvan Magalhaes RENEWAL
Alejandro PerinIndiaBernardo Dominic PROPOSAL
Mujtaba NickaSpainAsiya Javayant QUALIFIED
Smith GlickGermanyIvan Magalhaes NEGOTIATION
Ivar PaprockiFranceOnyama Limba PROPOSAL
Deepesh ChuiFranceBernardo Dominic RENEWAL
Ivar PaprockiAustraliaElwin Sharvill PROPOSAL
Mayumi KolmetzSpainOnyama Limba NEGOTIATION
Johnson SergiRussiaBernardo Dominic NEW
Aruna FigeroaJapanAmy Elsner NEW
Clifford RimRussiaElwin Sharvill PROPOSAL
Morrow RutaUnited KingdomIvan Magalhaes PROPOSAL
Jones VocelkaFranceOnyama Limba UNQUALIFIED
Jefferson SchemmerCanadaElwin Sharvill UNQUALIFIED
Morrow RutaCanadaAsiya Javayant QUALIFIED
Octavia MaletItalyIvan Magalhaes PROPOSAL
Faith GillianBrazilOnyama Limba NEGOTIATION
Murillo MaletUnited KingdomAnna Fali RENEWAL
Izzy GarufiAustraliaElwin Sharvill RENEWAL
Johnson SergiUnited KingdomOnyama Limba RENEWAL
Misaki RoysterCanadaXuxue Feng RENEWAL
Jeanfrancois VenereGermanyAnna Fali QUALIFIED
Sinclair WaycottCanadaStephen Shaw PROPOSAL
Francesco ShinkoIndiaAsiya Javayant PROPOSAL
Emily WhobreyAustraliaAmy Elsner RENEWAL
James ButtJapanIoni Bowcher PROPOSAL
James ButtArgentinaStephen Shaw NEW
Leja CaldareraGermanyAmy Elsner NEGOTIATION
Cody SaylorsItalyXuxue Feng NEGOTIATION
Julie StensethGermanyStephen Shaw QUALIFIED
Jennifer AmigonCanadaAsiya Javayant UNQUALIFIED
Maisha RulapaughIndiaOnyama Limba QUALIFIED
Octavia MaletItalyXuxue Feng NEW
Morrow RutaCanadaIvan Magalhaes NEW
Deepesh ChuiItalyAsiya Javayant UNQUALIFIED
Ashley DoeSpainAnna Fali QUALIFIED
Frozen Columns
Name
Tony Foller
Cody Saylors
Juan Wieser
Salvatore Stockham
Jefferson Schemmer
Salvatore Stockham
Wickens Nestle
Kaitlin Ostrosky
Wickens Nestle
Alejandro Perin
Antonio Caudy
Maria Marrier
Deepesh Chui
Cody Saylors
Ricardo Gaucho
Arvin Albares
Jennifer Amigon
Juan Wieser
Stacey Maclead
James Butt
Salvatore Stockham
Aika Inouye
Isabel Bowley
Greenwood Bolognia
Aditya Kusko
Leja Caldarera
Munro Ferencz
Faith Gillian
Stacey Maclead
Kaitlin Ostrosky
Smith Glick
Mujtaba Nicka
Kadeem Flosi
Greenwood Bolognia
Ivar Paprocki
Aditya Kusko
Clifford Rim
Leja Caldarera
David Darakjy
Smith Glick
Johnson Sergi
Leon Oldroyd
Faith Gillian
Mayumi Kolmetz
Deepesh Chui
Misaki Royster
Kaitlin Ostrosky
Julie Stenseth
Aika Inouye
Smith Glick
IdCountryDate
1000Japan2026-05-17
1001France2026-05-25
1002France2026-06-10
1003France2026-05-25
1004India2026-06-07
1005Australia2026-06-09
1006Italy2026-06-06
1007United Kingdom2026-05-30
1008Argentina2026-06-11
1009Australia2026-05-28
1010France2026-06-06
1011Canada2026-06-07
1012Canada2026-05-17
1013France2026-05-18
1014Germany2026-06-03
1015Australia2026-05-29
1016Italy2026-06-04
1017Italy2026-05-23
1018Argentina2026-06-08
1019Italy2026-05-20
1020India2026-05-27
1021France2026-05-21
1022Australia2026-05-21
1023France2026-05-14
1024India2026-06-09
1025Brazil2026-06-12
1026Russia2026-05-22
1027India2026-05-23
1028Brazil2026-05-28
1029Germany2026-06-05
1030France2026-05-29
1031Australia2026-05-24
1032Russia2026-06-10
1033Brazil2026-05-27
1034Brazil2026-05-24
1035Spain2026-06-10
1036Spain2026-05-18
1037Brazil2026-05-25
1038Japan2026-06-09
1039Argentina2026-06-05
1040France2026-05-25
1041France2026-06-08
1042Russia2026-05-17
1043Brazil2026-06-07
1044Australia2026-05-24
1045Italy2026-06-07
1046Spain2026-06-05
1047Argentina2026-06-10
1048Australia2026-05-31
1049Brazil2026-06-02

On-Demand Data

NameIdCountryDate
Francesco Shinko1000Argentina2026-06-01
Clifford Rim1001Argentina2026-05-27
Salvatore Stockham1002Russia2026-06-03
Adams Morasca1003Argentina2026-05-25
Deepesh Chui1004Germany2026-05-30
Claire Tollner1005Russia2026-05-23
Sinclair Waycott1006Japan2026-06-05
Leon Oldroyd1007Japan2026-05-25
Antonio Caudy1008Russia2026-05-19
Tony Foller1009Italy2026-05-30
Isabel Bowley1010Russia2026-06-09
Jones Vocelka1011Spain2026-05-26
Adams Morasca1012Brazil2026-06-02
Kaitlin Ostrosky1013India2026-05-23
Sinclair Waycott1014United Kingdom2026-06-08
Maria Marrier1015United Kingdom2026-06-06
Aika Inouye1016France2026-06-04
Jennifer Amigon1017Argentina2026-05-31
Chavez Briddick1018Brazil2026-05-23
Kaitlin Ostrosky1019Brazil2026-06-01
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Maisha RulapaughBrazilBernardo Dominic UNQUALIFIED
Ricardo GauchoUnited KingdomXuxue Feng NEW
Juan WieserAustraliaBernardo Dominic RENEWAL
Jennifer AmigonItalyStephen Shaw NEGOTIATION
Rodrigues CampainCanadaAsiya Javayant NEGOTIATION
Adams MorascaBrazilXuxue Feng UNQUALIFIED
Isabel BowleyIndiaAmy Elsner RENEWAL
Arvin AlbaresUnited KingdomAsiya Javayant NEGOTIATION
Stacey MacleadGermanyXuxue Feng NEW
Salvatore StockhamUnited KingdomIvan Magalhaes PROPOSAL
Arvin AlbaresArgentinaXuxue Feng NEGOTIATION
Clifford RimAustraliaBernardo Dominic UNQUALIFIED
Aika InouyeBrazilAsiya Javayant NEGOTIATION
Misaki RoysterBrazilOnyama Limba NEGOTIATION
Silvio SlusarskiCanadaIvan Magalhaes NEGOTIATION
Silvio SlusarskiAustraliaBernardo Dominic NEGOTIATION
Alejandro PerinIndiaAnna Fali NEW
Antonio CaudyArgentinaElwin Sharvill UNQUALIFIED
Salvatore StockhamAustraliaAmy Elsner QUALIFIED
Misaki RoysterRussiaOnyama Limba NEGOTIATION
James ButtJapanAnna Fali NEGOTIATION
Tony FollerIndiaIoni Bowcher NEW
Chavez BriddickIndiaStephen Shaw PROPOSAL
Jefferson SchemmerCanadaAnna Fali NEGOTIATION
James ButtItalyXuxue Feng QUALIFIED
Munro FerenczRussiaStephen Shaw PROPOSAL
Murillo MaletArgentinaBernardo Dominic NEW
Nicolas IturbideArgentinaIoni Bowcher QUALIFIED
Ashley DoeIndiaAsiya Javayant PROPOSAL
Munro FerenczRussiaElwin Sharvill PROPOSAL
Isabel BowleyCanadaAmy Elsner PROPOSAL
Nicolas IturbideItalyIvan Magalhaes RENEWAL
Jeanfrancois VenereRussiaAnna Fali NEGOTIATION
Izzy GarufiBrazilAsiya Javayant NEW
Maria MarrierBrazilXuxue Feng NEW
Johnson SergiAustraliaOnyama Limba NEGOTIATION
Antonio CaudyBrazilOnyama Limba RENEWAL
Deepesh ChuiUnited KingdomAnna Fali NEW
Silvio SlusarskiSpainElwin Sharvill NEGOTIATION
Jefferson SchemmerIndiaOnyama Limba PROPOSAL

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