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
Smith GlickFranceXuxue Feng UNQUALIFIED
Murillo MaletAustraliaStephen Shaw QUALIFIED
Murillo MaletFranceOnyama Limba NEGOTIATION
James ButtFranceStephen Shaw QUALIFIED
Aditya KuskoSpainIoni Bowcher UNQUALIFIED
Jeanfrancois VenereGermanyBernardo Dominic NEW
Kadeem FlosiItalyOnyama Limba UNQUALIFIED
Francesco ShinkoArgentinaElwin Sharvill RENEWAL
Aditya KuskoIndiaXuxue Feng NEGOTIATION
Aruna FigeroaGermanyIvan Magalhaes RENEWAL
Jones VocelkaIndiaIoni Bowcher UNQUALIFIED
David DarakjyAustraliaIoni Bowcher NEGOTIATION
Jeanfrancois VenereRussiaOnyama Limba NEW
James ButtRussiaIoni Bowcher QUALIFIED
Leon OldroydFranceXuxue Feng NEW
Aditya KuskoRussiaIvan Magalhaes NEGOTIATION
Emily WhobreyGermanyIvan Magalhaes NEW
Leja CaldareraJapanStephen Shaw PROPOSAL
Faith GillianItalyAnna Fali NEGOTIATION
Jeanfrancois VenereArgentinaAnna Fali PROPOSAL
Salvatore StockhamGermanyXuxue Feng PROPOSAL
Mujtaba NickaItalyIvan Magalhaes NEGOTIATION
James ButtJapanAnna Fali UNQUALIFIED
Morrow RutaFranceAsiya Javayant QUALIFIED
Leon OldroydBrazilIvan Magalhaes QUALIFIED
Sinclair WaycottArgentinaBernardo Dominic PROPOSAL
Jefferson SchemmerCanadaAmy Elsner QUALIFIED
Octavia MaletGermanyAmy Elsner PROPOSAL
Stacey MacleadItalyStephen Shaw NEGOTIATION
Ricardo GauchoArgentinaBernardo Dominic RENEWAL
Darci PoquetteCanadaBernardo Dominic QUALIFIED
Jennifer AmigonAustraliaAsiya Javayant NEW
Juan WieserUnited KingdomIvan Magalhaes QUALIFIED
Leon OldroydItalyStephen Shaw QUALIFIED
Cody SaylorsItalyAnna Fali UNQUALIFIED
Ivar PaprockiIndiaAsiya Javayant NEW
Isabel BowleyFranceIvan Magalhaes RENEWAL
James ButtBrazilStephen Shaw QUALIFIED
Wickens NestleBrazilBernardo Dominic QUALIFIED
Faith GillianJapanAmy Elsner PROPOSAL
David DarakjyRussiaXuxue Feng NEW
Murillo MaletAustraliaAmy Elsner QUALIFIED
Murillo MaletGermanyBernardo Dominic RENEWAL
Darci PoquetteCanadaAmy Elsner NEGOTIATION
Mayumi KolmetzUnited KingdomOnyama Limba PROPOSAL
Octavia MaletGermanyAnna Fali UNQUALIFIED
Mayumi KolmetzCanadaAnna Fali RENEWAL
Jeanfrancois VenereJapanBernardo Dominic NEW
Jeanfrancois VenereCanadaOnyama Limba NEW
Ivar PaprockiBrazilOnyama Limba RENEWAL
Horizontal
NameCountryRepresentativeStatus
David DarakjyCanadaStephen Shaw RENEWAL
Darci PoquetteRussiaOnyama Limba NEGOTIATION
David DarakjyAustraliaAnna Fali UNQUALIFIED
Silvio SlusarskiBrazilAsiya Javayant PROPOSAL
Ashley DoeGermanyStephen Shaw NEGOTIATION
Deepesh ChuiBrazilAmy Elsner PROPOSAL
Jennifer AmigonIndiaElwin Sharvill QUALIFIED
Kaitlin OstroskyAustraliaBernardo Dominic NEGOTIATION
Ashley DoeItalyOnyama Limba RENEWAL
James ButtBrazilStephen Shaw NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Johnson SergiGermany2025-08-15Truhlar And Truhlar Attys PROPOSAL1Stephen Shaw
1001Adams MorascaBrazil2025-08-30Printing Dimensions NEGOTIATION81Ioni Bowcher
1002Leja CaldareraAustralia2025-08-15Dorl, James J Esq UNQUALIFIED52Bernardo Dominic
1003Nicolas IturbideCanada2025-08-28Chanay, Jeffrey A Esq NEGOTIATION77Anna Fali
1004Kadeem FlosiCanada2025-08-29Feltz Printing Service PROPOSAL66Ivan Magalhaes
1005Aditya KuskoSpain2025-08-13Chemel, James L Cpa NEGOTIATION8Elwin Sharvill
1006Mayumi KolmetzItaly2025-08-21Commercial Press RENEWAL78Xuxue Feng
1007Sinclair WaycottCanada2025-08-22Truhlar And Truhlar Attys RENEWAL12Amy Elsner
1008Aruna FigeroaArgentina2025-08-10Truhlar And Truhlar Attys NEGOTIATION90Onyama Limba
1009Deepesh ChuiIndia2025-08-31Rangoni Of Florence RENEWAL84Bernardo Dominic
1010Ricardo GauchoArgentina2025-08-16Benton, John B Jr UNQUALIFIED63Elwin Sharvill
1011Rodrigues CampainRussia2025-08-29Buckley Miller Wright NEW88Bernardo Dominic
1012Jefferson SchemmerRussia2025-09-03Benton, John B Jr UNQUALIFIED28Anna Fali
1013Stacey MacleadBrazil2025-09-04Chanay, Jeffrey A Esq NEW90Xuxue Feng
1014Claire TollnerJapan2025-08-19Feltz Printing Service UNQUALIFIED47Onyama Limba
1015Chavez BriddickItaly2025-08-20Rangoni Of Florence UNQUALIFIED95Xuxue Feng
1016Adams MorascaRussia2025-08-24King, Christopher A Esq PROPOSAL35Ivan Magalhaes
1017Jefferson SchemmerArgentina2025-08-20Benton, John B Jr NEW97Amy Elsner
1018Isabel BowleyIndia2025-08-31Printing Dimensions RENEWAL97Anna Fali
1019Jeanfrancois VenereSpain2025-08-06Printing Dimensions QUALIFIED70Anna Fali
1020Aditya KuskoUnited Kingdom2025-08-18Printing Dimensions NEGOTIATION39Onyama Limba
1021Johnson SergiAustralia2025-08-28Dorl, James J Esq NEGOTIATION11Elwin Sharvill
1022Ricardo GauchoFrance2025-08-24Dorl, James J Esq PROPOSAL43Bernardo Dominic
1023Silvio SlusarskiSpain2025-08-29Commercial Press QUALIFIED45Amy Elsner
1024Isabel BowleyFrance2025-08-24Morlong Associates UNQUALIFIED43Elwin Sharvill
1025Aika InouyeAustralia2025-08-18Rousseaux, Michael Esq PROPOSAL86Onyama Limba
1026Morrow RutaJapan2025-08-22Chanay, Jeffrey A Esq QUALIFIED12Ivan Magalhaes
1027Morrow RutaIndia2025-08-26Chemel, James L Cpa RENEWAL23Xuxue Feng
1028Stacey MacleadIndia2025-08-26Rousseaux, Michael Esq NEGOTIATION91Elwin Sharvill
1029Adams MorascaIndia2025-08-30Printing Dimensions PROPOSAL70Anna Fali
1030Cody SaylorsCanada2025-08-14Buckley Miller Wright RENEWAL83Ioni Bowcher
1031Clifford RimCanada2025-08-08King, Christopher A Esq PROPOSAL71Ivan Magalhaes
1032Juan WieserFrance2025-08-07Dorl, James J Esq PROPOSAL37Ioni Bowcher
1033David DarakjyJapan2025-08-27Rangoni Of Florence QUALIFIED70Xuxue Feng
1034Leja CaldareraAustralia2025-08-15Printing Dimensions NEGOTIATION88Elwin Sharvill
1035Salvatore StockhamSpain2025-08-07Commercial Press UNQUALIFIED53Ioni Bowcher
1036Morrow RutaUnited Kingdom2025-09-01Chemel, James L Cpa QUALIFIED23Ioni Bowcher
1037Julie StensethItaly2025-08-26Chanay, Jeffrey A Esq NEW75Ioni Bowcher
1038Smith GlickUnited Kingdom2025-08-13Feiner Bros PROPOSAL39Amy Elsner
1039Maria MarrierJapan2025-08-09Benton, John B Jr NEGOTIATION6Amy Elsner
1040Alejandro PerinGermany2025-08-10Benton, John B Jr QUALIFIED17Anna Fali
1041Emily WhobreyGermany2025-09-04Printing Dimensions RENEWAL12Asiya Javayant
1042Jones VocelkaItaly2025-08-27Chemel, James L Cpa UNQUALIFIED19Xuxue Feng
1043Jeanfrancois VenereFrance2025-08-07Commercial Press NEW84Anna Fali
1044Kaitlin OstroskyCanada2025-08-15Dorl, James J Esq RENEWAL89Amy Elsner
1045Sinclair WaycottItaly2025-08-13Buckley Miller Wright PROPOSAL76Stephen Shaw
1046Arvin AlbaresGermany2025-08-29King, Christopher A Esq UNQUALIFIED11Ivan Magalhaes
1047Isabel BowleyGermany2025-08-10Rangoni Of Florence RENEWAL15Onyama Limba
1048Kadeem FlosiUnited Kingdom2025-08-15Chanay, Jeffrey A Esq NEGOTIATION11Asiya Javayant
1049Mayumi KolmetzJapan2025-08-28Buckley Miller Wright NEGOTIATION8Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Mujtaba NickaJapanAnna Fali RENEWAL
Chavez BriddickJapanAsiya Javayant NEW
Deepesh ChuiItalyAsiya Javayant PROPOSAL
Jones VocelkaJapanElwin Sharvill QUALIFIED
Octavia MaletJapanAmy Elsner QUALIFIED
Aika InouyeItalyBernardo Dominic RENEWAL
Izzy GarufiGermanyAnna Fali QUALIFIED
Arvin AlbaresSpainAnna Fali NEGOTIATION
Cody SaylorsGermanyIoni Bowcher NEW
Emily WhobreyRussiaXuxue Feng RENEWAL
Morrow RutaAustraliaIoni Bowcher PROPOSAL
James ButtIndiaStephen Shaw PROPOSAL
Adams MorascaJapanStephen Shaw UNQUALIFIED
Silvio SlusarskiFranceIoni Bowcher NEGOTIATION
Misaki RoysterRussiaOnyama Limba RENEWAL
Johnson SergiAustraliaOnyama Limba UNQUALIFIED
Julie StensethArgentinaBernardo Dominic QUALIFIED
Greenwood BologniaUnited KingdomOnyama Limba UNQUALIFIED
Nicolas IturbideCanadaOnyama Limba NEW
Maisha RulapaughSpainElwin Sharvill NEGOTIATION
Julie StensethGermanyBernardo Dominic QUALIFIED
Jennifer AmigonFranceAnna Fali NEGOTIATION
Kaitlin OstroskyRussiaIoni Bowcher NEGOTIATION
Aruna FigeroaAustraliaIoni Bowcher NEW
Misaki RoysterJapanXuxue Feng UNQUALIFIED
Deepesh ChuiBrazilAmy Elsner PROPOSAL
Darci PoquetteCanadaStephen Shaw UNQUALIFIED
Wickens NestleGermanyStephen Shaw NEW
Alejandro PerinAustraliaElwin Sharvill RENEWAL
Johnson SergiSpainAsiya Javayant NEW
Kadeem FlosiSpainOnyama Limba NEW
Morrow RutaUnited KingdomBernardo Dominic NEGOTIATION
James ButtRussiaXuxue Feng UNQUALIFIED
Ricardo GauchoItalyIvan Magalhaes NEW
Aditya KuskoArgentinaStephen Shaw NEW
Aika InouyeSpainAsiya Javayant NEGOTIATION
Emily WhobreySpainOnyama Limba QUALIFIED
Leja CaldareraCanadaElwin Sharvill RENEWAL
Claire TollnerFranceAmy Elsner RENEWAL
Aika InouyeIndiaXuxue Feng PROPOSAL
Julie StensethAustraliaAsiya Javayant UNQUALIFIED
Arvin AlbaresAustraliaXuxue Feng NEGOTIATION
Faith GillianFranceAmy Elsner PROPOSAL
Ashley DoeFranceOnyama Limba QUALIFIED
Faith GillianCanadaStephen Shaw UNQUALIFIED
Isabel BowleyUnited KingdomAmy Elsner RENEWAL
Misaki RoysterGermanyElwin Sharvill UNQUALIFIED
Smith GlickSpainXuxue Feng NEGOTIATION
Salvatore StockhamIndiaElwin Sharvill QUALIFIED
Jefferson SchemmerUnited KingdomAsiya Javayant RENEWAL
Frozen Columns
Name
Julie Stenseth
Nicolas Iturbide
Kaitlin Ostrosky
Nicolas Iturbide
Ivar Paprocki
Octavia Malet
Arvin Albares
Mayumi Kolmetz
Stacey Maclead
Faith Gillian
Tony Foller
Aruna Figeroa
Johnson Sergi
Francesco Shinko
Salvatore Stockham
Jones Vocelka
Julie Stenseth
Salvatore Stockham
Greenwood Bolognia
Francesco Shinko
Smith Glick
Jefferson Schemmer
Alejandro Perin
Jefferson Schemmer
Izzy Garufi
Smith Glick
Costa Dilliard
Chavez Briddick
Aruna Figeroa
Izzy Garufi
Clifford Rim
Maria Marrier
Jeanfrancois Venere
Sinclair Waycott
Ricardo Gaucho
Wickens Nestle
Aruna Figeroa
Maisha Rulapaugh
Jones Vocelka
James Butt
Aika Inouye
Mujtaba Nicka
Leja Caldarera
Salvatore Stockham
Tony Foller
Mayumi Kolmetz
Antonio Caudy
Adams Morasca
Wickens Nestle
Greenwood Bolognia
IdCountryDate
1000France2025-08-30
1001Canada2025-08-24
1002Spain2025-09-02
1003France2025-08-14
1004India2025-08-10
1005Spain2025-08-08
1006United Kingdom2025-08-29
1007Brazil2025-09-01
1008Australia2025-08-24
1009Italy2025-08-12
1010Spain2025-08-07
1011Australia2025-08-23
1012France2025-08-26
1013France2025-08-29
1014Australia2025-08-16
1015Germany2025-08-08
1016Brazil2025-08-07
1017Russia2025-08-21
1018Canada2025-08-09
1019Italy2025-08-29
1020France2025-09-01
1021Brazil2025-08-16
1022Argentina2025-08-27
1023Russia2025-08-09
1024United Kingdom2025-08-14
1025Germany2025-08-10
1026France2025-09-04
1027France2025-08-08
1028Russia2025-08-10
1029Canada2025-08-10
1030Russia2025-08-06
1031Russia2025-08-16
1032Argentina2025-09-04
1033Germany2025-08-14
1034Spain2025-08-24
1035Brazil2025-08-11
1036Italy2025-08-28
1037Spain2025-08-25
1038Australia2025-08-20
1039Germany2025-08-21
1040Spain2025-09-02
1041Canada2025-08-21
1042Russia2025-08-29
1043Argentina2025-08-22
1044Canada2025-08-20
1045Australia2025-09-04
1046Italy2025-08-17
1047Canada2025-09-04
1048India2025-08-16
1049France2025-09-03

On-Demand Data

NameIdCountryDate
Ricardo Gaucho1000Japan2025-09-04
Chavez Briddick1001United Kingdom2025-08-06
Stacey Maclead1002Japan2025-08-28
Wickens Nestle1003Argentina2025-08-10
Kadeem Flosi1004Brazil2025-09-03
Mujtaba Nicka1005Italy2025-08-08
Alejandro Perin1006United Kingdom2025-08-22
James Butt1007Spain2025-08-11
Maisha Rulapaugh1008Canada2025-08-07
Emily Whobrey1009Argentina2025-09-01
Darci Poquette1010Japan2025-08-31
Leja Caldarera1011Canada2025-08-23
James Butt1012Japan2025-08-16
Francesco Shinko1013Brazil2025-08-18
Maisha Rulapaugh1014Russia2025-08-14
Ivar Paprocki1015Spain2025-09-02
Ricardo Gaucho1016Australia2025-08-25
Leja Caldarera1017Brazil2025-08-31
Adams Morasca1018Australia2025-08-07
Munro Ferencz1019Japan2025-08-21
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Munro FerenczArgentinaStephen Shaw NEW
Claire TollnerUnited KingdomOnyama Limba RENEWAL
Munro FerenczFranceXuxue Feng UNQUALIFIED
Kaitlin OstroskySpainAsiya Javayant UNQUALIFIED
Isabel BowleyFranceIoni Bowcher NEGOTIATION
Ashley DoeIndiaXuxue Feng UNQUALIFIED
Jefferson SchemmerAustraliaAsiya Javayant UNQUALIFIED
Emily WhobreyItalyIvan Magalhaes RENEWAL
Maisha RulapaughArgentinaAsiya Javayant NEGOTIATION
Aditya KuskoCanadaAmy Elsner RENEWAL
Isabel BowleyAustraliaAsiya Javayant NEGOTIATION
Kadeem FlosiItalyIvan Magalhaes UNQUALIFIED
Costa DilliardJapanBernardo Dominic RENEWAL
Kaitlin OstroskyGermanyAsiya Javayant NEGOTIATION
Antonio CaudyIndiaIoni Bowcher RENEWAL
Ashley DoeCanadaIvan Magalhaes RENEWAL
Kaitlin OstroskyRussiaBernardo Dominic UNQUALIFIED
Leja CaldareraAustraliaIoni Bowcher RENEWAL
Jefferson SchemmerArgentinaXuxue Feng PROPOSAL
Sinclair WaycottCanadaStephen Shaw UNQUALIFIED
Costa DilliardBrazilXuxue Feng PROPOSAL
Francesco ShinkoArgentinaElwin Sharvill UNQUALIFIED
Johnson SergiCanadaElwin Sharvill NEW
Isabel BowleyBrazilAmy Elsner RENEWAL
Alejandro PerinRussiaXuxue Feng RENEWAL
Julie StensethItalyOnyama Limba QUALIFIED
Sinclair WaycottSpainBernardo Dominic NEGOTIATION
Rodrigues CampainIndiaElwin Sharvill NEGOTIATION
Chavez BriddickAustraliaAmy Elsner NEW
Misaki RoysterAustraliaStephen Shaw RENEWAL
Cody SaylorsGermanyIoni Bowcher PROPOSAL
Arvin AlbaresIndiaElwin Sharvill QUALIFIED
Jones VocelkaJapanOnyama Limba NEW
Faith GillianIndiaAmy Elsner NEGOTIATION
Morrow RutaAustraliaBernardo Dominic RENEWAL
Chavez BriddickFranceAnna Fali RENEWAL
Nicolas IturbideFranceAmy Elsner RENEWAL
Ashley DoeAustraliaBernardo Dominic UNQUALIFIED
Deepesh ChuiJapanXuxue Feng UNQUALIFIED
Morrow RutaAustraliaAmy Elsner 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>