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
Munro FerenczArgentinaAmy Elsner NEW
Emily WhobreyRussiaIvan Magalhaes QUALIFIED
Costa DilliardJapanStephen Shaw NEGOTIATION
Aditya KuskoUnited KingdomXuxue Feng RENEWAL
Cody SaylorsSpainAsiya Javayant NEW
Murillo MaletArgentinaAmy Elsner UNQUALIFIED
Stacey MacleadAustraliaIoni Bowcher PROPOSAL
Juan WieserCanadaElwin Sharvill RENEWAL
Jefferson SchemmerJapanXuxue Feng NEGOTIATION
Johnson SergiFranceStephen Shaw RENEWAL
Claire TollnerFranceBernardo Dominic UNQUALIFIED
Nicolas IturbideFranceIoni Bowcher UNQUALIFIED
Smith GlickUnited KingdomIvan Magalhaes UNQUALIFIED
Arvin AlbaresItalyElwin Sharvill QUALIFIED
Chavez BriddickFranceIvan Magalhaes RENEWAL
Juan WieserJapanXuxue Feng PROPOSAL
Jeanfrancois VenereBrazilAnna Fali UNQUALIFIED
Rodrigues CampainUnited KingdomAmy Elsner QUALIFIED
Faith GillianUnited KingdomAsiya Javayant PROPOSAL
Jones VocelkaRussiaAmy Elsner UNQUALIFIED
Maria MarrierArgentinaBernardo Dominic QUALIFIED
Izzy GarufiSpainAmy Elsner PROPOSAL
Alejandro PerinIndiaOnyama Limba QUALIFIED
Ricardo GauchoSpainOnyama Limba RENEWAL
Morrow RutaItalyStephen Shaw NEW
Francesco ShinkoRussiaIoni Bowcher QUALIFIED
Ivar PaprockiSpainAmy Elsner UNQUALIFIED
Izzy GarufiRussiaBernardo Dominic QUALIFIED
Maria MarrierIndiaOnyama Limba PROPOSAL
Munro FerenczGermanyAsiya Javayant PROPOSAL
Juan WieserCanadaStephen Shaw UNQUALIFIED
Aditya KuskoGermanyElwin Sharvill NEW
Juan WieserBrazilOnyama Limba PROPOSAL
Ashley DoeUnited KingdomAsiya Javayant NEGOTIATION
James ButtJapanAnna Fali UNQUALIFIED
Murillo MaletUnited KingdomBernardo Dominic QUALIFIED
Jones VocelkaIndiaAnna Fali NEW
Ricardo GauchoGermanyAsiya Javayant NEGOTIATION
Munro FerenczRussiaElwin Sharvill QUALIFIED
Murillo MaletBrazilXuxue Feng QUALIFIED
Johnson SergiUnited KingdomBernardo Dominic UNQUALIFIED
Jefferson SchemmerGermanyOnyama Limba QUALIFIED
Faith GillianUnited KingdomBernardo Dominic NEGOTIATION
Murillo MaletAustraliaStephen Shaw NEW
Rodrigues CampainAustraliaIvan Magalhaes RENEWAL
Antonio CaudyUnited KingdomXuxue Feng UNQUALIFIED
Smith GlickBrazilOnyama Limba RENEWAL
Claire TollnerFranceBernardo Dominic QUALIFIED
James ButtItalyXuxue Feng NEGOTIATION
Arvin AlbaresIndiaAsiya Javayant PROPOSAL
Horizontal
NameCountryRepresentativeStatus
David DarakjyArgentinaIvan Magalhaes RENEWAL
Julie StensethIndiaXuxue Feng RENEWAL
Morrow RutaUnited KingdomBernardo Dominic NEW
Leja CaldareraAustraliaIvan Magalhaes QUALIFIED
Aika InouyeArgentinaIvan Magalhaes UNQUALIFIED
Greenwood BologniaRussiaStephen Shaw NEW
Jennifer AmigonRussiaAsiya Javayant RENEWAL
Darci PoquetteSpainAsiya Javayant NEGOTIATION
Munro FerenczIndiaIvan Magalhaes PROPOSAL
Aditya KuskoAustraliaStephen Shaw RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Munro FerenczJapan2025-08-21Feiner Bros PROPOSAL86Asiya Javayant
1001Smith GlickRussia2025-08-19Truhlar And Truhlar Attys NEW39Asiya Javayant
1002Jefferson SchemmerGermany2025-08-30Chemel, James L Cpa QUALIFIED17Stephen Shaw
1003Maria MarrierSpain2025-09-01Commercial Press NEW15Onyama Limba
1004Emily WhobreyGermany2025-08-21Commercial Press RENEWAL95Xuxue Feng
1005Cody SaylorsRussia2025-09-12Chemel, James L Cpa UNQUALIFIED26Ivan Magalhaes
1006Greenwood BologniaIndia2025-09-02Commercial Press UNQUALIFIED10Onyama Limba
1007Stacey MacleadArgentina2025-08-31Buckley Miller Wright RENEWAL92Amy Elsner
1008Ashley DoeIndia2025-08-22Feltz Printing Service NEW26Asiya Javayant
1009Kaitlin OstroskyUnited Kingdom2025-08-22Rousseaux, Michael Esq QUALIFIED9Elwin Sharvill
1010Adams MorascaUnited Kingdom2025-09-11Dorl, James J Esq UNQUALIFIED56Stephen Shaw
1011Kaitlin OstroskyBrazil2025-09-06Chapman, Ross E Esq RENEWAL72Anna Fali
1012James ButtIndia2025-09-03Chanay, Jeffrey A Esq NEW29Amy Elsner
1013Adams MorascaSpain2025-08-31Chanay, Jeffrey A Esq PROPOSAL7Amy Elsner
1014Adams MorascaArgentina2025-08-21Chemel, James L Cpa PROPOSAL61Onyama Limba
1015Deepesh ChuiAustralia2025-09-02Rangoni Of Florence RENEWAL20Ioni Bowcher
1016Aika InouyeBrazil2025-09-11Chapman, Ross E Esq QUALIFIED40Amy Elsner
1017Maisha RulapaughAustralia2025-09-13Rangoni Of Florence PROPOSAL48Xuxue Feng
1018Ricardo GauchoSpain2025-08-28Rangoni Of Florence RENEWAL70Amy Elsner
1019Kadeem FlosiSpain2025-08-28Feltz Printing Service RENEWAL14Ioni Bowcher
1020Jennifer AmigonBrazil2025-09-17Morlong Associates PROPOSAL13Stephen Shaw
1021David DarakjyIndia2025-09-07King, Christopher A Esq UNQUALIFIED77Bernardo Dominic
1022Maria MarrierGermany2025-09-02Rangoni Of Florence PROPOSAL69Stephen Shaw
1023Munro FerenczJapan2025-09-02King, Christopher A Esq NEGOTIATION63Elwin Sharvill
1024Nicolas IturbideCanada2025-08-28Morlong Associates NEGOTIATION72Ivan Magalhaes
1025Claire TollnerItaly2025-09-14King, Christopher A Esq PROPOSAL14Anna Fali
1026Costa DilliardItaly2025-08-19Benton, John B Jr PROPOSAL54Ivan Magalhaes
1027Faith GillianSpain2025-09-08Feltz Printing Service NEW22Asiya Javayant
1028David DarakjyRussia2025-08-25Chemel, James L Cpa UNQUALIFIED19Elwin Sharvill
1029Adams MorascaFrance2025-09-01Feiner Bros PROPOSAL25Ivan Magalhaes
1030Leja CaldareraIndia2025-09-06King, Christopher A Esq UNQUALIFIED63Amy Elsner
1031Wickens NestleIndia2025-09-17Chemel, James L Cpa NEGOTIATION72Elwin Sharvill
1032Morrow RutaRussia2025-08-31Commercial Press UNQUALIFIED17Bernardo Dominic
1033Jones VocelkaAustralia2025-08-19Rangoni Of Florence NEGOTIATION76Stephen Shaw
1034Francesco ShinkoIndia2025-09-15Truhlar And Truhlar Attys QUALIFIED80Bernardo Dominic
1035Julie StensethJapan2025-08-29Buckley Miller Wright RENEWAL86Stephen Shaw
1036Adams MorascaGermany2025-08-21Printing Dimensions NEW80Elwin Sharvill
1037Maisha RulapaughFrance2025-08-24Printing Dimensions NEW33Bernardo Dominic
1038Tony FollerRussia2025-09-11Commercial Press UNQUALIFIED43Ivan Magalhaes
1039Alejandro PerinGermany2025-09-08Morlong Associates PROPOSAL52Amy Elsner
1040Leja CaldareraArgentina2025-09-04Rangoni Of Florence QUALIFIED70Bernardo Dominic
1041Alejandro PerinRussia2025-09-03Chemel, James L Cpa RENEWAL41Onyama Limba
1042Maria MarrierArgentina2025-09-05Chanay, Jeffrey A Esq NEW15Onyama Limba
1043Leja CaldareraUnited Kingdom2025-09-17Feiner Bros NEGOTIATION26Xuxue Feng
1044Aruna FigeroaIndia2025-09-04Morlong Associates QUALIFIED57Elwin Sharvill
1045Juan WieserArgentina2025-09-13Chanay, Jeffrey A Esq NEW7Bernardo Dominic
1046Sinclair WaycottFrance2025-09-09Feltz Printing Service NEGOTIATION59Xuxue Feng
1047Mujtaba NickaSpain2025-08-28King, Christopher A Esq PROPOSAL44Anna Fali
1048Deepesh ChuiIndia2025-09-02Buckley Miller Wright QUALIFIED98Bernardo Dominic
1049Ivar PaprockiSpain2025-09-15Dorl, James J Esq QUALIFIED28Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Claire TollnerFranceStephen Shaw UNQUALIFIED
Francesco ShinkoJapanAnna Fali RENEWAL
Misaki RoysterAustraliaIvan Magalhaes NEGOTIATION
Jones VocelkaRussiaBernardo Dominic NEW
Maisha RulapaughRussiaOnyama Limba UNQUALIFIED
Costa DilliardFranceAsiya Javayant RENEWAL
Ashley DoeUnited KingdomAmy Elsner PROPOSAL
Emily WhobreyUnited KingdomElwin Sharvill QUALIFIED
Mujtaba NickaFranceElwin Sharvill RENEWAL
Leon OldroydSpainAmy Elsner UNQUALIFIED
Maisha RulapaughIndiaXuxue Feng NEGOTIATION
Jennifer AmigonIndiaStephen Shaw NEGOTIATION
Kaitlin OstroskyFranceOnyama Limba UNQUALIFIED
Aika InouyeIndiaXuxue Feng PROPOSAL
Emily WhobreyCanadaAmy Elsner RENEWAL
Sinclair WaycottUnited KingdomAsiya Javayant RENEWAL
Maisha RulapaughFranceIoni Bowcher QUALIFIED
Silvio SlusarskiUnited KingdomAmy Elsner UNQUALIFIED
Cody SaylorsItalyIoni Bowcher NEGOTIATION
Darci PoquetteSpainAnna Fali QUALIFIED
David DarakjyAustraliaBernardo Dominic UNQUALIFIED
Cody SaylorsRussiaIoni Bowcher NEW
Chavez BriddickRussiaAmy Elsner QUALIFIED
Costa DilliardItalyStephen Shaw PROPOSAL
Murillo MaletIndiaAmy Elsner NEW
Nicolas IturbideAustraliaOnyama Limba RENEWAL
Ricardo GauchoArgentinaIoni Bowcher UNQUALIFIED
Nicolas IturbideJapanAmy Elsner PROPOSAL
Izzy GarufiRussiaAsiya Javayant NEGOTIATION
Antonio CaudyUnited KingdomXuxue Feng PROPOSAL
Arvin AlbaresRussiaBernardo Dominic PROPOSAL
Tony FollerCanadaOnyama Limba QUALIFIED
Isabel BowleyUnited KingdomStephen Shaw QUALIFIED
Claire TollnerIndiaIvan Magalhaes PROPOSAL
Wickens NestleBrazilIvan Magalhaes QUALIFIED
Rodrigues CampainSpainStephen Shaw QUALIFIED
Ashley DoeIndiaElwin Sharvill NEGOTIATION
Cody SaylorsSpainBernardo Dominic RENEWAL
Rodrigues CampainJapanOnyama Limba PROPOSAL
Rodrigues CampainUnited KingdomXuxue Feng QUALIFIED
Munro FerenczBrazilAsiya Javayant PROPOSAL
Julie StensethBrazilXuxue Feng UNQUALIFIED
Jones VocelkaFranceBernardo Dominic RENEWAL
Claire TollnerBrazilAsiya Javayant UNQUALIFIED
Mayumi KolmetzSpainXuxue Feng RENEWAL
Kaitlin OstroskyBrazilIvan Magalhaes RENEWAL
Leja CaldareraItalyElwin Sharvill RENEWAL
Aditya KuskoBrazilXuxue Feng QUALIFIED
Maria MarrierJapanStephen Shaw NEGOTIATION
Ricardo GauchoItalyBernardo Dominic QUALIFIED
Frozen Columns
Name
Jeanfrancois Venere
Nicolas Iturbide
Aika Inouye
Ivar Paprocki
Octavia Malet
Cody Saylors
Ivar Paprocki
Deepesh Chui
Julie Stenseth
Sinclair Waycott
Rodrigues Campain
Silvio Slusarski
Sinclair Waycott
Maria Marrier
Emily Whobrey
Alejandro Perin
Deepesh Chui
Silvio Slusarski
Julie Stenseth
Munro Ferencz
Ivar Paprocki
Julie Stenseth
Aika Inouye
Claire Tollner
Emily Whobrey
Ivar Paprocki
Jennifer Amigon
Mayumi Kolmetz
Stacey Maclead
Ashley Doe
Antonio Caudy
Juan Wieser
Aika Inouye
Aditya Kusko
Julie Stenseth
Kadeem Flosi
Izzy Garufi
Munro Ferencz
Leja Caldarera
Smith Glick
Antonio Caudy
Alejandro Perin
Julie Stenseth
Kadeem Flosi
Darci Poquette
Stacey Maclead
Darci Poquette
Mujtaba Nicka
Isabel Bowley
Misaki Royster
IdCountryDate
1000Canada2025-08-29
1001Australia2025-09-16
1002United Kingdom2025-09-06
1003Argentina2025-08-26
1004Italy2025-09-06
1005Italy2025-09-17
1006Australia2025-08-26
1007Russia2025-09-14
1008Canada2025-08-19
1009Australia2025-08-30
1010United Kingdom2025-08-29
1011United Kingdom2025-09-13
1012Canada2025-09-05
1013Germany2025-08-29
1014Argentina2025-08-20
1015Germany2025-08-26
1016Russia2025-09-16
1017Italy2025-09-09
1018Italy2025-08-22
1019Russia2025-09-03
1020Brazil2025-09-10
1021Canada2025-09-04
1022Italy2025-09-13
1023Italy2025-09-17
1024India2025-08-30
1025India2025-08-29
1026United Kingdom2025-08-20
1027Argentina2025-09-16
1028India2025-09-09
1029France2025-08-22
1030Brazil2025-09-10
1031Brazil2025-09-02
1032Spain2025-09-08
1033Italy2025-08-20
1034Germany2025-08-31
1035Spain2025-08-20
1036Australia2025-08-31
1037Spain2025-09-07
1038France2025-09-11
1039France2025-08-28
1040Canada2025-09-15
1041Brazil2025-09-02
1042Spain2025-09-09
1043Brazil2025-09-10
1044Canada2025-09-11
1045Canada2025-09-14
1046Italy2025-08-24
1047Germany2025-09-16
1048India2025-09-15
1049Italy2025-08-30

On-Demand Data

NameIdCountryDate
Emily Whobrey1000Germany2025-08-21
Ivar Paprocki1001France2025-08-29
Aruna Figeroa1002Italy2025-09-13
Jefferson Schemmer1003Japan2025-09-05
Sinclair Waycott1004Argentina2025-09-17
Rodrigues Campain1005Russia2025-08-20
Cody Saylors1006United Kingdom2025-08-26
Kadeem Flosi1007Brazil2025-09-08
Adams Morasca1008Argentina2025-09-15
David Darakjy1009India2025-09-15
Julie Stenseth1010Japan2025-09-16
Cody Saylors1011Russia2025-08-25
Juan Wieser1012Russia2025-09-13
Arvin Albares1013India2025-09-02
Misaki Royster1014Canada2025-08-28
Murillo Malet1015Brazil2025-08-31
Aditya Kusko1016Russia2025-09-13
Ricardo Gaucho1017Russia2025-08-27
Ricardo Gaucho1018Argentina2025-09-17
Tony Foller1019Russia2025-09-07
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
James ButtAustraliaAsiya Javayant QUALIFIED
Jennifer AmigonRussiaBernardo Dominic PROPOSAL
Munro FerenczRussiaElwin Sharvill PROPOSAL
James ButtArgentinaXuxue Feng NEGOTIATION
Silvio SlusarskiUnited KingdomIoni Bowcher UNQUALIFIED
Juan WieserItalyIoni Bowcher RENEWAL
Darci PoquetteUnited KingdomAmy Elsner RENEWAL
Kadeem FlosiFranceElwin Sharvill RENEWAL
Costa DilliardAustraliaAnna Fali QUALIFIED
Darci PoquetteItalyBernardo Dominic NEGOTIATION
Aruna FigeroaBrazilXuxue Feng NEGOTIATION
Ivar PaprockiFranceAsiya Javayant RENEWAL
Misaki RoysterFranceElwin Sharvill RENEWAL
Antonio CaudyJapanAmy Elsner RENEWAL
Juan WieserSpainBernardo Dominic NEW
Kadeem FlosiRussiaAnna Fali NEW
Greenwood BologniaUnited KingdomIoni Bowcher NEW
Costa DilliardItalyStephen Shaw RENEWAL
Munro FerenczJapanXuxue Feng UNQUALIFIED
Mujtaba NickaRussiaElwin Sharvill QUALIFIED
Aruna FigeroaArgentinaStephen Shaw QUALIFIED
Kadeem FlosiCanadaElwin Sharvill QUALIFIED
Stacey MacleadBrazilIoni Bowcher PROPOSAL
Clifford RimIndiaAnna Fali RENEWAL
Izzy GarufiArgentinaOnyama Limba QUALIFIED
Kadeem FlosiCanadaAmy Elsner PROPOSAL
Mayumi KolmetzAustraliaOnyama Limba NEGOTIATION
Ivar PaprockiUnited KingdomIoni Bowcher NEW
Clifford RimCanadaXuxue Feng UNQUALIFIED
Arvin AlbaresSpainElwin Sharvill UNQUALIFIED
Julie StensethBrazilStephen Shaw NEW
Clifford RimIndiaOnyama Limba NEGOTIATION
Rodrigues CampainItalyOnyama Limba NEGOTIATION
Johnson SergiRussiaOnyama Limba RENEWAL
Julie StensethCanadaAsiya Javayant NEGOTIATION
Octavia MaletUnited KingdomAmy Elsner RENEWAL
Cody SaylorsIndiaIoni Bowcher NEGOTIATION
Jeanfrancois VenereRussiaIvan Magalhaes RENEWAL
Kaitlin OstroskyBrazilOnyama Limba RENEWAL
Chavez BriddickIndiaBernardo Dominic 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>