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
Juan WieserBrazilAnna Fali NEGOTIATION
David DarakjyGermanyOnyama Limba NEW
Smith GlickCanadaAmy Elsner RENEWAL
Greenwood BologniaCanadaElwin Sharvill NEW
Jones VocelkaItalyElwin Sharvill NEGOTIATION
Ashley DoeCanadaAsiya Javayant QUALIFIED
Cody SaylorsArgentinaAmy Elsner RENEWAL
David DarakjyArgentinaAsiya Javayant NEW
Maisha RulapaughItalyIoni Bowcher RENEWAL
Greenwood BologniaCanadaOnyama Limba RENEWAL
Sinclair WaycottFranceAmy Elsner QUALIFIED
Maisha RulapaughGermanyAmy Elsner NEW
Leon OldroydItalyIvan Magalhaes QUALIFIED
Adams MorascaItalyXuxue Feng RENEWAL
Leon OldroydRussiaAmy Elsner RENEWAL
Mayumi KolmetzAustraliaAnna Fali NEW
Clifford RimUnited KingdomXuxue Feng NEGOTIATION
Rodrigues CampainAustraliaBernardo Dominic UNQUALIFIED
Maisha RulapaughItalyIoni Bowcher NEGOTIATION
Cody SaylorsAustraliaIoni Bowcher NEGOTIATION
Aruna FigeroaGermanyAmy Elsner NEGOTIATION
Emily WhobreyGermanyOnyama Limba NEGOTIATION
Rodrigues CampainJapanOnyama Limba RENEWAL
Maria MarrierUnited KingdomIvan Magalhaes RENEWAL
Arvin AlbaresAustraliaOnyama Limba NEGOTIATION
Clifford RimBrazilStephen Shaw NEW
Arvin AlbaresCanadaStephen Shaw RENEWAL
Stacey MacleadCanadaXuxue Feng NEGOTIATION
Claire TollnerRussiaStephen Shaw PROPOSAL
Jennifer AmigonArgentinaXuxue Feng QUALIFIED
Arvin AlbaresSpainAnna Fali UNQUALIFIED
Leon OldroydGermanyOnyama Limba UNQUALIFIED
Aika InouyeGermanyXuxue Feng PROPOSAL
David DarakjyGermanyAnna Fali NEGOTIATION
Jeanfrancois VenereItalyIoni Bowcher NEGOTIATION
Johnson SergiIndiaIvan Magalhaes NEW
Isabel BowleyJapanOnyama Limba RENEWAL
Ashley DoeArgentinaIoni Bowcher UNQUALIFIED
Salvatore StockhamRussiaOnyama Limba QUALIFIED
Kadeem FlosiJapanBernardo Dominic RENEWAL
Izzy GarufiGermanyIoni Bowcher NEGOTIATION
Greenwood BologniaAustraliaStephen Shaw UNQUALIFIED
Arvin AlbaresArgentinaElwin Sharvill UNQUALIFIED
Jennifer AmigonRussiaAsiya Javayant RENEWAL
Jefferson SchemmerBrazilIoni Bowcher PROPOSAL
Kaitlin OstroskyItalyOnyama Limba PROPOSAL
Sinclair WaycottAustraliaElwin Sharvill NEW
Sinclair WaycottJapanXuxue Feng RENEWAL
Salvatore StockhamCanadaXuxue Feng PROPOSAL
Alejandro PerinArgentinaOnyama Limba QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Sinclair WaycottGermanyAmy Elsner RENEWAL
Misaki RoysterSpainAmy Elsner NEGOTIATION
Aruna FigeroaUnited KingdomIoni Bowcher QUALIFIED
Wickens NestleArgentinaXuxue Feng RENEWAL
Claire TollnerItalyElwin Sharvill NEGOTIATION
Leja CaldareraGermanyAnna Fali UNQUALIFIED
David DarakjyAustraliaBernardo Dominic NEGOTIATION
Kaitlin OstroskyIndiaAnna Fali NEW
James ButtIndiaOnyama Limba QUALIFIED
Leon OldroydGermanyAsiya Javayant UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Faith GillianItaly2026-06-05Feiner Bros NEW9Stephen Shaw
1001Aditya KuskoJapan2026-05-26Rousseaux, Michael Esq PROPOSAL93Ioni Bowcher
1002Clifford RimSpain2026-05-16Feltz Printing Service NEGOTIATION41Bernardo Dominic
1003Alejandro PerinBrazil2026-05-09Rangoni Of Florence NEW8Ioni Bowcher
1004Octavia MaletCanada2026-05-08King, Christopher A Esq NEGOTIATION71Amy Elsner
1005Juan WieserItaly2026-05-17Buckley Miller Wright NEW48Ivan Magalhaes
1006Darci PoquetteIndia2026-05-09Chanay, Jeffrey A Esq NEW19Amy Elsner
1007Kaitlin OstroskyIndia2026-05-24Commercial Press NEW68Asiya Javayant
1008Mujtaba NickaCanada2026-05-29Morlong Associates QUALIFIED23Ivan Magalhaes
1009Smith GlickItaly2026-05-29Dorl, James J Esq UNQUALIFIED45Bernardo Dominic
1010Adams MorascaRussia2026-05-21Dorl, James J Esq RENEWAL15Xuxue Feng
1011Aika InouyeRussia2026-05-20Rangoni Of Florence QUALIFIED31Xuxue Feng
1012Chavez BriddickIndia2026-05-13Truhlar And Truhlar Attys NEGOTIATION70Asiya Javayant
1013Kadeem FlosiBrazil2026-06-05Printing Dimensions RENEWAL76Onyama Limba
1014Aditya KuskoIndia2026-05-19Rangoni Of Florence NEGOTIATION18Asiya Javayant
1015Leja CaldareraItaly2026-05-22Chemel, James L Cpa NEW32Xuxue Feng
1016Johnson SergiGermany2026-05-24Buckley Miller Wright QUALIFIED33Anna Fali
1017Arvin AlbaresIndia2026-06-03Commercial Press UNQUALIFIED1Bernardo Dominic
1018Juan WieserBrazil2026-05-28Chapman, Ross E Esq PROPOSAL22Stephen Shaw
1019Misaki RoysterSpain2026-05-21Chanay, Jeffrey A Esq RENEWAL66Ioni Bowcher
1020Murillo MaletJapan2026-05-23Chemel, James L Cpa NEGOTIATION75Ioni Bowcher
1021Stacey MacleadGermany2026-06-04Morlong Associates UNQUALIFIED9Bernardo Dominic
1022Claire TollnerCanada2026-05-25Commercial Press NEGOTIATION74Asiya Javayant
1023Leja CaldareraGermany2026-06-05Truhlar And Truhlar Attys QUALIFIED59Onyama Limba
1024Clifford RimBrazil2026-05-31Truhlar And Truhlar Attys NEW49Anna Fali
1025Jones VocelkaItaly2026-05-08Feiner Bros UNQUALIFIED66Asiya Javayant
1026Kaitlin OstroskyAustralia2026-06-01Commercial Press NEW53Stephen Shaw
1027Jeanfrancois VenereRussia2026-05-11Feltz Printing Service PROPOSAL61Stephen Shaw
1028Aruna FigeroaItaly2026-05-08Chapman, Ross E Esq NEGOTIATION92Ivan Magalhaes
1029Deepesh ChuiRussia2026-06-06Buckley Miller Wright UNQUALIFIED65Amy Elsner
1030Munro FerenczCanada2026-05-16Feiner Bros NEGOTIATION9Anna Fali
1031Jefferson SchemmerBrazil2026-05-17Benton, John B Jr UNQUALIFIED77Asiya Javayant
1032Greenwood BologniaGermany2026-05-21Rousseaux, Michael Esq UNQUALIFIED42Xuxue Feng
1033Tony FollerGermany2026-05-21Feltz Printing Service PROPOSAL11Anna Fali
1034Maisha RulapaughFrance2026-05-15Rangoni Of Florence UNQUALIFIED71Ioni Bowcher
1035Aditya KuskoUnited Kingdom2026-05-09Rangoni Of Florence QUALIFIED24Elwin Sharvill
1036Maria MarrierRussia2026-05-17Printing Dimensions NEW18Ivan Magalhaes
1037James ButtSpain2026-05-29Chapman, Ross E Esq QUALIFIED0Ivan Magalhaes
1038Tony FollerJapan2026-05-27Morlong Associates PROPOSAL80Xuxue Feng
1039Julie StensethItaly2026-06-06Truhlar And Truhlar Attys PROPOSAL82Bernardo Dominic
1040Julie StensethJapan2026-05-29Chemel, James L Cpa QUALIFIED4Elwin Sharvill
1041Jeanfrancois VenereUnited Kingdom2026-05-30Buckley Miller Wright NEGOTIATION65Amy Elsner
1042Cody SaylorsBrazil2026-05-16Feltz Printing Service PROPOSAL97Elwin Sharvill
1043Aika InouyeIndia2026-05-23Chanay, Jeffrey A Esq RENEWAL88Amy Elsner
1044Nicolas IturbideUnited Kingdom2026-05-08Feltz Printing Service UNQUALIFIED92Stephen Shaw
1045Emily WhobreyBrazil2026-05-31Chapman, Ross E Esq QUALIFIED81Asiya Javayant
1046James ButtArgentina2026-06-02Chanay, Jeffrey A Esq UNQUALIFIED1Onyama Limba
1047Smith GlickItaly2026-05-19Rangoni Of Florence QUALIFIED29Asiya Javayant
1048Emily WhobreyItaly2026-05-10Buckley Miller Wright UNQUALIFIED24Asiya Javayant
1049Jennifer AmigonBrazil2026-06-01Rangoni Of Florence UNQUALIFIED65Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Sinclair WaycottArgentinaAsiya Javayant NEW
Mayumi KolmetzSpainElwin Sharvill RENEWAL
Jefferson SchemmerSpainOnyama Limba QUALIFIED
Maisha RulapaughJapanXuxue Feng RENEWAL
Ricardo GauchoIndiaElwin Sharvill PROPOSAL
Misaki RoysterArgentinaElwin Sharvill QUALIFIED
Jones VocelkaItalyAmy Elsner RENEWAL
Clifford RimUnited KingdomAsiya Javayant PROPOSAL
Kaitlin OstroskyIndiaIvan Magalhaes NEGOTIATION
Octavia MaletUnited KingdomOnyama Limba PROPOSAL
Kadeem FlosiGermanyAnna Fali PROPOSAL
Silvio SlusarskiCanadaAnna Fali RENEWAL
Aika InouyeUnited KingdomStephen Shaw NEW
Faith GillianBrazilXuxue Feng UNQUALIFIED
Ivar PaprockiRussiaAnna Fali QUALIFIED
Cody SaylorsAustraliaAnna Fali PROPOSAL
Arvin AlbaresAustraliaStephen Shaw NEGOTIATION
Claire TollnerAustraliaIoni Bowcher NEGOTIATION
Ricardo GauchoSpainOnyama Limba PROPOSAL
Munro FerenczArgentinaStephen Shaw RENEWAL
Octavia MaletSpainBernardo Dominic QUALIFIED
Adams MorascaAustraliaBernardo Dominic RENEWAL
Johnson SergiRussiaAsiya Javayant NEW
Julie StensethBrazilIoni Bowcher RENEWAL
Tony FollerAustraliaXuxue Feng RENEWAL
Clifford RimCanadaAsiya Javayant NEGOTIATION
Aditya KuskoRussiaIoni Bowcher QUALIFIED
Darci PoquetteIndiaAmy Elsner PROPOSAL
Kaitlin OstroskyRussiaIoni Bowcher PROPOSAL
Antonio CaudyAustraliaIoni Bowcher QUALIFIED
Emily WhobreyArgentinaBernardo Dominic NEGOTIATION
Jones VocelkaUnited KingdomElwin Sharvill RENEWAL
Jeanfrancois VenereSpainAsiya Javayant NEGOTIATION
Tony FollerJapanStephen Shaw UNQUALIFIED
Aika InouyeGermanyElwin Sharvill RENEWAL
Leja CaldareraCanadaAmy Elsner QUALIFIED
Murillo MaletAustraliaStephen Shaw RENEWAL
Morrow RutaItalyAmy Elsner NEW
Deepesh ChuiArgentinaXuxue Feng QUALIFIED
Salvatore StockhamAustraliaStephen Shaw QUALIFIED
Faith GillianJapanAsiya Javayant NEW
Clifford RimBrazilAsiya Javayant QUALIFIED
Aditya KuskoUnited KingdomIvan Magalhaes NEW
Silvio SlusarskiGermanyIvan Magalhaes NEW
Isabel BowleyCanadaBernardo Dominic NEGOTIATION
Izzy GarufiJapanStephen Shaw UNQUALIFIED
Jeanfrancois VenereAustraliaAsiya Javayant QUALIFIED
Leja CaldareraFranceIoni Bowcher QUALIFIED
Deepesh ChuiUnited KingdomXuxue Feng QUALIFIED
Darci PoquetteAustraliaIoni Bowcher RENEWAL
Frozen Columns
Name
Rodrigues Campain
Maisha Rulapaugh
Nicolas Iturbide
Alejandro Perin
Octavia Malet
Jennifer Amigon
Darci Poquette
Leja Caldarera
Juan Wieser
Juan Wieser
Smith Glick
Costa Dilliard
James Butt
Ashley Doe
Adams Morasca
Claire Tollner
Jeanfrancois Venere
Mujtaba Nicka
Maria Marrier
Chavez Briddick
Morrow Ruta
Jeanfrancois Venere
Aika Inouye
Murillo Malet
Octavia Malet
Cody Saylors
Isabel Bowley
Faith Gillian
Alejandro Perin
Kadeem Flosi
Adams Morasca
Misaki Royster
Izzy Garufi
James Butt
Julie Stenseth
Isabel Bowley
Ashley Doe
Maisha Rulapaugh
Antonio Caudy
Antonio Caudy
Wickens Nestle
Emily Whobrey
Silvio Slusarski
Adams Morasca
Darci Poquette
Jennifer Amigon
Wickens Nestle
Aruna Figeroa
Arvin Albares
Jefferson Schemmer
IdCountryDate
1000Canada2026-05-10
1001Argentina2026-06-06
1002Germany2026-05-10
1003Germany2026-05-13
1004Germany2026-05-11
1005France2026-05-15
1006Australia2026-06-03
1007Australia2026-06-04
1008India2026-05-25
1009United Kingdom2026-05-16
1010Russia2026-05-20
1011Argentina2026-05-10
1012Brazil2026-05-28
1013France2026-05-17
1014Brazil2026-05-08
1015Argentina2026-05-18
1016Italy2026-05-11
1017India2026-05-10
1018Russia2026-05-11
1019Australia2026-05-18
1020India2026-06-06
1021Russia2026-06-02
1022United Kingdom2026-05-13
1023France2026-06-02
1024Japan2026-05-28
1025India2026-06-01
1026Australia2026-05-24
1027Brazil2026-05-15
1028Brazil2026-06-02
1029Germany2026-05-11
1030India2026-05-12
1031Spain2026-06-04
1032Argentina2026-05-10
1033Spain2026-05-16
1034United Kingdom2026-05-30
1035India2026-05-18
1036Russia2026-06-01
1037Spain2026-05-20
1038Italy2026-05-30
1039Germany2026-05-11
1040Argentina2026-06-06
1041Spain2026-05-08
1042Canada2026-05-27
1043Argentina2026-05-26
1044United Kingdom2026-05-18
1045Brazil2026-05-08
1046India2026-05-20
1047Russia2026-05-14
1048Canada2026-05-13
1049Spain2026-05-10

On-Demand Data

NameIdCountryDate
Mujtaba Nicka1000Italy2026-05-15
James Butt1001Argentina2026-05-14
Tony Foller1002United Kingdom2026-05-23
Leja Caldarera1003Germany2026-05-20
Clifford Rim1004Japan2026-05-16
Misaki Royster1005United Kingdom2026-06-04
Misaki Royster1006India2026-05-11
Silvio Slusarski1007Japan2026-05-14
Johnson Sergi1008Argentina2026-05-11
Silvio Slusarski1009France2026-05-25
Kadeem Flosi1010France2026-05-14
Misaki Royster1011France2026-05-15
Ricardo Gaucho1012Argentina2026-05-25
Leja Caldarera1013Australia2026-06-02
Juan Wieser1014United Kingdom2026-05-14
Faith Gillian1015Argentina2026-05-24
Costa Dilliard1016Japan2026-05-29
Clifford Rim1017Australia2026-05-26
Faith Gillian1018United Kingdom2026-05-13
Sinclair Waycott1019Brazil2026-05-09
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Ricardo GauchoUnited KingdomIvan Magalhaes QUALIFIED
Alejandro PerinJapanAnna Fali UNQUALIFIED
Isabel BowleyFranceXuxue Feng NEGOTIATION
Arvin AlbaresAustraliaAsiya Javayant PROPOSAL
Murillo MaletIndiaStephen Shaw NEGOTIATION
Julie StensethFranceIoni Bowcher NEGOTIATION
Mayumi KolmetzUnited KingdomOnyama Limba PROPOSAL
Wickens NestleUnited KingdomStephen Shaw NEGOTIATION
Leon OldroydAustraliaAmy Elsner NEW
Isabel BowleySpainAsiya Javayant PROPOSAL
Rodrigues CampainJapanAnna Fali NEW
Julie StensethRussiaBernardo Dominic NEW
Emily WhobreyArgentinaXuxue Feng UNQUALIFIED
Salvatore StockhamJapanElwin Sharvill NEW
Claire TollnerJapanBernardo Dominic QUALIFIED
Aruna FigeroaGermanyAsiya Javayant NEW
Alejandro PerinSpainIoni Bowcher RENEWAL
Clifford RimAustraliaOnyama Limba UNQUALIFIED
Jeanfrancois VenereAustraliaIoni Bowcher PROPOSAL
Emily WhobreyJapanAmy Elsner RENEWAL
Salvatore StockhamGermanyStephen Shaw NEGOTIATION
David DarakjyArgentinaAsiya Javayant UNQUALIFIED
Cody SaylorsIndiaAnna Fali QUALIFIED
Julie StensethArgentinaAmy Elsner RENEWAL
Greenwood BologniaArgentinaXuxue Feng UNQUALIFIED
Ashley DoeJapanAnna Fali QUALIFIED
Chavez BriddickBrazilAsiya Javayant PROPOSAL
Kadeem FlosiBrazilXuxue Feng NEGOTIATION
Nicolas IturbideUnited KingdomBernardo Dominic RENEWAL
Julie StensethItalyXuxue Feng UNQUALIFIED
Leon OldroydItalyIvan Magalhaes PROPOSAL
Sinclair WaycottSpainIvan Magalhaes PROPOSAL
Salvatore StockhamUnited KingdomXuxue Feng RENEWAL
Deepesh ChuiAustraliaStephen Shaw RENEWAL
David DarakjyRussiaAmy Elsner PROPOSAL
Ashley DoeGermanyIvan Magalhaes NEW
Aruna FigeroaFranceAmy Elsner RENEWAL
Ashley DoeItalyXuxue Feng UNQUALIFIED
Izzy GarufiArgentinaIoni Bowcher UNQUALIFIED
Sinclair WaycottUnited KingdomIvan Magalhaes RENEWAL

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