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 BriddickBrazilElwin Sharvill PROPOSAL
Leja CaldareraCanadaXuxue Feng NEW
Adams MorascaItalyElwin Sharvill QUALIFIED
Silvio SlusarskiBrazilAnna Fali RENEWAL
Johnson SergiArgentinaElwin Sharvill QUALIFIED
Emily WhobreyUnited KingdomAmy Elsner NEGOTIATION
Aika InouyeArgentinaAmy Elsner QUALIFIED
Stacey MacleadItalyOnyama Limba UNQUALIFIED
Leja CaldareraSpainAmy Elsner NEW
Maria MarrierFranceIoni Bowcher PROPOSAL
Jefferson SchemmerItalyOnyama Limba NEGOTIATION
Aruna FigeroaIndiaAsiya Javayant NEW
Rodrigues CampainAustraliaIoni Bowcher NEGOTIATION
Murillo MaletRussiaElwin Sharvill NEW
Faith GillianGermanyXuxue Feng NEW
Costa DilliardUnited KingdomXuxue Feng UNQUALIFIED
Aditya KuskoJapanIoni Bowcher UNQUALIFIED
Clifford RimUnited KingdomIoni Bowcher PROPOSAL
Munro FerenczRussiaIoni Bowcher PROPOSAL
Mujtaba NickaBrazilIvan Magalhaes RENEWAL
Misaki RoysterGermanyOnyama Limba PROPOSAL
Francesco ShinkoJapanAsiya Javayant NEW
Johnson SergiFranceAnna Fali NEGOTIATION
Clifford RimFranceXuxue Feng RENEWAL
Kadeem FlosiRussiaXuxue Feng NEGOTIATION
Aditya KuskoSpainAmy Elsner UNQUALIFIED
Francesco ShinkoIndiaXuxue Feng RENEWAL
Arvin AlbaresSpainAnna Fali RENEWAL
Antonio CaudyAustraliaElwin Sharvill RENEWAL
Sinclair WaycottArgentinaXuxue Feng UNQUALIFIED
Nicolas IturbideFranceOnyama Limba NEW
Greenwood BologniaAustraliaAsiya Javayant QUALIFIED
Deepesh ChuiGermanyOnyama Limba QUALIFIED
David DarakjyRussiaIoni Bowcher NEW
Kaitlin OstroskyIndiaAsiya Javayant UNQUALIFIED
Aruna FigeroaBrazilOnyama Limba UNQUALIFIED
Arvin AlbaresBrazilIvan Magalhaes RENEWAL
Rodrigues CampainRussiaBernardo Dominic QUALIFIED
Stacey MacleadIndiaIvan Magalhaes PROPOSAL
Silvio SlusarskiUnited KingdomAsiya Javayant NEW
David DarakjySpainXuxue Feng NEGOTIATION
Murillo MaletAustraliaOnyama Limba PROPOSAL
James ButtItalyElwin Sharvill RENEWAL
Maisha RulapaughAustraliaAsiya Javayant NEGOTIATION
Alejandro PerinCanadaBernardo Dominic QUALIFIED
Sinclair WaycottRussiaBernardo Dominic NEW
Costa DilliardAustraliaIvan Magalhaes PROPOSAL
Alejandro PerinIndiaIoni Bowcher NEGOTIATION
Emily WhobreyGermanyElwin Sharvill QUALIFIED
Cody SaylorsBrazilAnna Fali QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Izzy GarufiSpainBernardo Dominic RENEWAL
James ButtIndiaStephen Shaw PROPOSAL
Francesco ShinkoCanadaAnna Fali NEW
Silvio SlusarskiItalyBernardo Dominic NEGOTIATION
Nicolas IturbideAustraliaAnna Fali UNQUALIFIED
Clifford RimCanadaStephen Shaw PROPOSAL
Rodrigues CampainItalyOnyama Limba NEGOTIATION
Maria MarrierAustraliaOnyama Limba UNQUALIFIED
Emily WhobreyGermanyBernardo Dominic RENEWAL
James ButtJapanAsiya Javayant RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Nicolas IturbideCanada2026-06-02Chanay, Jeffrey A Esq NEGOTIATION40Xuxue Feng
1001Adams MorascaIndia2026-05-15Feltz Printing Service UNQUALIFIED73Ivan Magalhaes
1002Mujtaba NickaAustralia2026-06-09Buckley Miller Wright QUALIFIED94Bernardo Dominic
1003Octavia MaletFrance2026-05-20Chapman, Ross E Esq UNQUALIFIED94Ivan Magalhaes
1004Tony FollerFrance2026-06-02Rangoni Of Florence PROPOSAL27Xuxue Feng
1005Silvio SlusarskiRussia2026-06-03Buckley Miller Wright PROPOSAL37Ivan Magalhaes
1006Maria MarrierBrazil2026-06-09Truhlar And Truhlar Attys PROPOSAL32Ivan Magalhaes
1007Emily WhobreyAustralia2026-05-16Truhlar And Truhlar Attys NEGOTIATION72Anna Fali
1008David DarakjyGermany2026-06-04Feltz Printing Service PROPOSAL10Ioni Bowcher
1009Stacey MacleadUnited Kingdom2026-05-18Morlong Associates QUALIFIED30Onyama Limba
1010Maisha RulapaughItaly2026-05-13Commercial Press UNQUALIFIED48Amy Elsner
1011Antonio CaudyUnited Kingdom2026-05-31Rangoni Of Florence RENEWAL91Xuxue Feng
1012David DarakjyIndia2026-06-03King, Christopher A Esq NEW55Ioni Bowcher
1013Greenwood BologniaFrance2026-05-30Rousseaux, Michael Esq UNQUALIFIED95Elwin Sharvill
1014Johnson SergiAustralia2026-06-10Chemel, James L Cpa NEGOTIATION71Onyama Limba
1015Adams MorascaFrance2026-06-10Rangoni Of Florence UNQUALIFIED28Asiya Javayant
1016Salvatore StockhamUnited Kingdom2026-05-29Rousseaux, Michael Esq UNQUALIFIED95Bernardo Dominic
1017James ButtBrazil2026-05-23Feltz Printing Service NEW6Bernardo Dominic
1018Wickens NestleJapan2026-05-18Benton, John B Jr UNQUALIFIED55Asiya Javayant
1019Munro FerenczGermany2026-06-11Dorl, James J Esq RENEWAL68Ioni Bowcher
1020Julie StensethGermany2026-05-14Benton, John B Jr NEGOTIATION70Asiya Javayant
1021Ricardo GauchoCanada2026-05-24Chanay, Jeffrey A Esq NEW98Bernardo Dominic
1022Francesco ShinkoRussia2026-06-10Printing Dimensions NEW50Anna Fali
1023Francesco ShinkoFrance2026-05-14Chanay, Jeffrey A Esq NEGOTIATION49Onyama Limba
1024Leon OldroydUnited Kingdom2026-06-11Chanay, Jeffrey A Esq RENEWAL48Xuxue Feng
1025Alejandro PerinIndia2026-05-25Printing Dimensions NEGOTIATION99Bernardo Dominic
1026James ButtCanada2026-05-13Rangoni Of Florence RENEWAL85Ivan Magalhaes
1027Antonio CaudyCanada2026-06-08Printing Dimensions NEGOTIATION81Stephen Shaw
1028Aditya KuskoIndia2026-05-15Buckley Miller Wright NEW38Elwin Sharvill
1029Nicolas IturbideAustralia2026-05-21Chemel, James L Cpa RENEWAL69Elwin Sharvill
1030Kadeem FlosiBrazil2026-05-19Dorl, James J Esq PROPOSAL90Amy Elsner
1031Costa DilliardSpain2026-05-24Buckley Miller Wright NEW69Xuxue Feng
1032Leon OldroydFrance2026-05-18Truhlar And Truhlar Attys NEGOTIATION83Anna Fali
1033Murillo MaletAustralia2026-06-02Buckley Miller Wright NEW55Elwin Sharvill
1034Silvio SlusarskiFrance2026-05-29Rangoni Of Florence NEW70Anna Fali
1035James ButtBrazil2026-05-22Chapman, Ross E Esq UNQUALIFIED29Amy Elsner
1036Munro FerenczSpain2026-06-10Feiner Bros NEGOTIATION3Stephen Shaw
1037Juan WieserBrazil2026-05-17Feiner Bros NEGOTIATION52Xuxue Feng
1038Antonio CaudyIndia2026-05-13Truhlar And Truhlar Attys PROPOSAL76Asiya Javayant
1039Octavia MaletRussia2026-06-06Dorl, James J Esq QUALIFIED92Ioni Bowcher
1040Stacey MacleadItaly2026-06-02Chemel, James L Cpa PROPOSAL67Ivan Magalhaes
1041Costa DilliardCanada2026-05-15Rousseaux, Michael Esq UNQUALIFIED87Amy Elsner
1042Adams MorascaGermany2026-06-04Feltz Printing Service PROPOSAL29Amy Elsner
1043Ashley DoeItaly2026-05-16Benton, John B Jr PROPOSAL88Asiya Javayant
1044Leja CaldareraSpain2026-05-22Rousseaux, Michael Esq RENEWAL49Amy Elsner
1045Silvio SlusarskiArgentina2026-05-17Chanay, Jeffrey A Esq UNQUALIFIED31Asiya Javayant
1046James ButtArgentina2026-05-24Buckley Miller Wright NEGOTIATION71Stephen Shaw
1047Emily WhobreyUnited Kingdom2026-05-17Benton, John B Jr QUALIFIED72Ivan Magalhaes
1048Kaitlin OstroskyUnited Kingdom2026-05-14Benton, John B Jr PROPOSAL64Anna Fali
1049Jennifer AmigonRussia2026-06-04Feltz Printing Service QUALIFIED63Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Morrow RutaAustraliaBernardo Dominic UNQUALIFIED
Nicolas IturbideBrazilAsiya Javayant UNQUALIFIED
Ashley DoeJapanAnna Fali RENEWAL
Silvio SlusarskiSpainBernardo Dominic RENEWAL
Isabel BowleyBrazilStephen Shaw NEGOTIATION
Greenwood BologniaItalyAsiya Javayant PROPOSAL
Jeanfrancois VenereIndiaIoni Bowcher RENEWAL
Alejandro PerinUnited KingdomIoni Bowcher PROPOSAL
Aruna FigeroaCanadaIoni Bowcher NEGOTIATION
Ivar PaprockiItalyOnyama Limba NEW
Morrow RutaJapanAmy Elsner QUALIFIED
Rodrigues CampainItalyAnna Fali PROPOSAL
Jones VocelkaCanadaAmy Elsner PROPOSAL
Alejandro PerinBrazilXuxue Feng QUALIFIED
Deepesh ChuiArgentinaIoni Bowcher NEW
Ricardo GauchoRussiaAsiya Javayant PROPOSAL
Costa DilliardCanadaIvan Magalhaes NEW
Tony FollerArgentinaAnna Fali NEGOTIATION
Leon OldroydGermanyStephen Shaw NEGOTIATION
Octavia MaletArgentinaBernardo Dominic RENEWAL
Maria MarrierBrazilAnna Fali UNQUALIFIED
Jefferson SchemmerJapanXuxue Feng UNQUALIFIED
Aditya KuskoSpainBernardo Dominic NEW
Chavez BriddickBrazilAsiya Javayant NEGOTIATION
Adams MorascaIndiaBernardo Dominic NEW
Nicolas IturbideFranceElwin Sharvill RENEWAL
Jennifer AmigonJapanAnna Fali UNQUALIFIED
Octavia MaletAustraliaIvan Magalhaes UNQUALIFIED
Kaitlin OstroskyAustraliaIvan Magalhaes QUALIFIED
Faith GillianJapanIoni Bowcher RENEWAL
Mayumi KolmetzJapanStephen Shaw RENEWAL
Johnson SergiItalyBernardo Dominic UNQUALIFIED
Stacey MacleadFranceAsiya Javayant RENEWAL
Alejandro PerinJapanIvan Magalhaes RENEWAL
Francesco ShinkoRussiaElwin Sharvill NEW
Antonio CaudyCanadaIoni Bowcher NEGOTIATION
Murillo MaletAustraliaIvan Magalhaes QUALIFIED
Maria MarrierSpainAsiya Javayant QUALIFIED
Jennifer AmigonSpainStephen Shaw NEGOTIATION
Aruna FigeroaItalyOnyama Limba RENEWAL
Greenwood BologniaSpainAsiya Javayant NEW
Ricardo GauchoFranceOnyama Limba QUALIFIED
Leon OldroydRussiaIvan Magalhaes NEGOTIATION
Octavia MaletBrazilAmy Elsner NEW
Rodrigues CampainRussiaIvan Magalhaes QUALIFIED
Jones VocelkaGermanyIoni Bowcher UNQUALIFIED
Costa DilliardGermanyBernardo Dominic QUALIFIED
Greenwood BologniaUnited KingdomIvan Magalhaes UNQUALIFIED
Arvin AlbaresUnited KingdomStephen Shaw NEGOTIATION
Kaitlin OstroskyGermanyStephen Shaw UNQUALIFIED
Frozen Columns
Name
David Darakjy
Alejandro Perin
Munro Ferencz
Aika Inouye
Adams Morasca
Claire Tollner
Julie Stenseth
Leja Caldarera
Mujtaba Nicka
Adams Morasca
Faith Gillian
James Butt
Mayumi Kolmetz
Alejandro Perin
Aditya Kusko
Munro Ferencz
Mayumi Kolmetz
Sinclair Waycott
Rodrigues Campain
Silvio Slusarski
Octavia Malet
Misaki Royster
Aruna Figeroa
Stacey Maclead
Ricardo Gaucho
Ricardo Gaucho
Salvatore Stockham
Claire Tollner
Nicolas Iturbide
Faith Gillian
David Darakjy
Octavia Malet
Francesco Shinko
Emily Whobrey
Wickens Nestle
Aditya Kusko
Mayumi Kolmetz
David Darakjy
Clifford Rim
Stacey Maclead
Jefferson Schemmer
Chavez Briddick
Arvin Albares
Octavia Malet
Claire Tollner
Leon Oldroyd
Greenwood Bolognia
Murillo Malet
Jeanfrancois Venere
Claire Tollner
IdCountryDate
1000France2026-06-01
1001France2026-06-03
1002Brazil2026-06-06
1003Canada2026-06-06
1004Australia2026-05-19
1005Australia2026-05-23
1006France2026-05-30
1007Germany2026-05-18
1008Argentina2026-06-01
1009France2026-06-04
1010Spain2026-06-04
1011Japan2026-06-10
1012France2026-05-27
1013Russia2026-05-21
1014Italy2026-06-03
1015India2026-06-11
1016Russia2026-06-09
1017Australia2026-05-23
1018Brazil2026-05-27
1019Brazil2026-06-04
1020Russia2026-06-05
1021Russia2026-06-09
1022Spain2026-05-20
1023Brazil2026-06-07
1024Japan2026-05-24
1025Brazil2026-05-31
1026France2026-05-15
1027Germany2026-05-22
1028Spain2026-05-17
1029France2026-05-26
1030India2026-05-20
1031Japan2026-05-31
1032Italy2026-06-03
1033Brazil2026-06-09
1034Australia2026-06-09
1035Spain2026-05-16
1036Germany2026-05-30
1037Russia2026-05-31
1038Japan2026-06-06
1039Italy2026-05-18
1040Italy2026-06-06
1041India2026-05-22
1042Brazil2026-05-27
1043United Kingdom2026-06-01
1044Russia2026-06-10
1045Australia2026-05-27
1046Spain2026-05-21
1047Australia2026-06-05
1048Japan2026-06-09
1049Japan2026-05-15

On-Demand Data

NameIdCountryDate
Jeanfrancois Venere1000Japan2026-05-14
Silvio Slusarski1001Germany2026-05-31
Maisha Rulapaugh1002Argentina2026-05-14
Jones Vocelka1003Spain2026-05-14
Salvatore Stockham1004Japan2026-05-29
Octavia Malet1005Italy2026-05-13
Nicolas Iturbide1006Italy2026-06-10
Costa Dilliard1007Australia2026-06-11
Juan Wieser1008Spain2026-05-19
Jeanfrancois Venere1009Argentina2026-05-14
Johnson Sergi1010Australia2026-05-24
Smith Glick1011Australia2026-06-05
Tony Foller1012Australia2026-05-15
Kadeem Flosi1013Australia2026-05-27
Antonio Caudy1014France2026-06-08
Claire Tollner1015United Kingdom2026-05-31
Maria Marrier1016Brazil2026-05-13
James Butt1017Germany2026-05-19
Ashley Doe1018Australia2026-05-18
Claire Tollner1019Germany2026-05-24
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Kadeem FlosiFranceAnna Fali UNQUALIFIED
Aruna FigeroaArgentinaXuxue Feng QUALIFIED
Emily WhobreyIndiaElwin Sharvill RENEWAL
Cody SaylorsIndiaIvan Magalhaes PROPOSAL
Misaki RoysterGermanyAmy Elsner PROPOSAL
Jennifer AmigonJapanAnna Fali UNQUALIFIED
Leon OldroydFranceOnyama Limba QUALIFIED
Julie StensethSpainAnna Fali RENEWAL
James ButtUnited KingdomOnyama Limba RENEWAL
Ivar PaprockiItalyIoni Bowcher NEW
Rodrigues CampainUnited KingdomXuxue Feng RENEWAL
Clifford RimItalyIvan Magalhaes PROPOSAL
Claire TollnerBrazilBernardo Dominic PROPOSAL
Maria MarrierItalyAmy Elsner NEGOTIATION
Stacey MacleadGermanyStephen Shaw NEW
Jennifer AmigonBrazilStephen Shaw RENEWAL
Jeanfrancois VenereBrazilAmy Elsner PROPOSAL
Jefferson SchemmerSpainXuxue Feng PROPOSAL
Costa DilliardUnited KingdomOnyama Limba NEW
Faith GillianBrazilOnyama Limba NEW
Faith GillianSpainIoni Bowcher NEGOTIATION
Jefferson SchemmerGermanyXuxue Feng RENEWAL
Ricardo GauchoCanadaOnyama Limba NEW
Francesco ShinkoRussiaAnna Fali PROPOSAL
Kaitlin OstroskyFranceXuxue Feng NEW
Stacey MacleadSpainAmy Elsner NEGOTIATION
Ashley DoeItalyStephen Shaw QUALIFIED
Johnson SergiCanadaStephen Shaw PROPOSAL
Munro FerenczBrazilAsiya Javayant UNQUALIFIED
Antonio CaudyFranceAmy Elsner RENEWAL
Aruna FigeroaGermanyAmy Elsner UNQUALIFIED
Arvin AlbaresFranceStephen Shaw NEW
Kadeem FlosiGermanyAmy Elsner UNQUALIFIED
Salvatore StockhamIndiaXuxue Feng RENEWAL
Darci PoquetteUnited KingdomAnna Fali QUALIFIED
Maria MarrierUnited KingdomOnyama Limba UNQUALIFIED
Faith GillianBrazilBernardo Dominic PROPOSAL
Julie StensethArgentinaAmy Elsner QUALIFIED
Julie StensethAustraliaAsiya Javayant NEW
Morrow RutaIndiaIoni Bowcher 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>