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
Salvatore StockhamSpainIoni Bowcher PROPOSAL
Rodrigues CampainUnited KingdomXuxue Feng QUALIFIED
Jones VocelkaCanadaAsiya Javayant RENEWAL
Arvin AlbaresCanadaIoni Bowcher PROPOSAL
Mayumi KolmetzArgentinaAmy Elsner UNQUALIFIED
Julie StensethSpainIvan Magalhaes UNQUALIFIED
Kaitlin OstroskyItalyStephen Shaw NEGOTIATION
James ButtAustraliaAmy Elsner NEGOTIATION
Silvio SlusarskiFranceAsiya Javayant NEGOTIATION
Clifford RimAustraliaOnyama Limba QUALIFIED
Adams MorascaIndiaOnyama Limba UNQUALIFIED
Cody SaylorsItalyAmy Elsner NEGOTIATION
Juan WieserFranceStephen Shaw UNQUALIFIED
Aditya KuskoIndiaAmy Elsner NEGOTIATION
Darci PoquetteSpainAsiya Javayant NEGOTIATION
Rodrigues CampainUnited KingdomStephen Shaw NEW
Izzy GarufiJapanAsiya Javayant UNQUALIFIED
David DarakjySpainXuxue Feng RENEWAL
David DarakjyItalyAsiya Javayant NEGOTIATION
Ricardo GauchoJapanElwin Sharvill NEGOTIATION
Aditya KuskoItalyElwin Sharvill RENEWAL
Arvin AlbaresRussiaStephen Shaw NEGOTIATION
Juan WieserAustraliaOnyama Limba NEW
Izzy GarufiRussiaStephen Shaw PROPOSAL
Johnson SergiJapanAnna Fali UNQUALIFIED
Silvio SlusarskiAustraliaAmy Elsner UNQUALIFIED
Claire TollnerCanadaIvan Magalhaes NEW
Maria MarrierItalyAsiya Javayant NEGOTIATION
Munro FerenczRussiaXuxue Feng NEW
Jeanfrancois VenereUnited KingdomAmy Elsner NEW
Morrow RutaGermanyElwin Sharvill PROPOSAL
Julie StensethJapanAmy Elsner NEW
Jones VocelkaRussiaAsiya Javayant PROPOSAL
Kaitlin OstroskyAustraliaAmy Elsner NEW
Aditya KuskoGermanyAmy Elsner QUALIFIED
Maisha RulapaughRussiaStephen Shaw UNQUALIFIED
Octavia MaletGermanyIvan Magalhaes NEW
Greenwood BologniaRussiaAsiya Javayant QUALIFIED
Leja CaldareraIndiaElwin Sharvill RENEWAL
Ivar PaprockiSpainIoni Bowcher PROPOSAL
Arvin AlbaresUnited KingdomIoni Bowcher UNQUALIFIED
Kaitlin OstroskyJapanAsiya Javayant NEGOTIATION
Misaki RoysterGermanyAmy Elsner NEW
Greenwood BologniaRussiaAnna Fali QUALIFIED
Mujtaba NickaUnited KingdomXuxue Feng QUALIFIED
Stacey MacleadArgentinaAsiya Javayant NEW
Morrow RutaIndiaOnyama Limba QUALIFIED
Stacey MacleadCanadaIvan Magalhaes NEGOTIATION
Arvin AlbaresItalyXuxue Feng PROPOSAL
Wickens NestleItalyIoni Bowcher PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Tony FollerUnited KingdomAnna Fali NEW
Cody SaylorsSpainOnyama Limba QUALIFIED
Rodrigues CampainIndiaAmy Elsner PROPOSAL
Juan WieserItalyXuxue Feng UNQUALIFIED
Isabel BowleyFranceOnyama Limba UNQUALIFIED
Stacey MacleadUnited KingdomAsiya Javayant UNQUALIFIED
Chavez BriddickGermanyIvan Magalhaes NEGOTIATION
Aika InouyeGermanyElwin Sharvill QUALIFIED
Salvatore StockhamArgentinaIoni Bowcher RENEWAL
Kaitlin OstroskyRussiaIoni Bowcher RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Arvin AlbaresFrance2026-04-14Chanay, Jeffrey A Esq NEW3Ioni Bowcher
1001Isabel BowleyRussia2026-04-14Benton, John B Jr QUALIFIED33Anna Fali
1002Kadeem FlosiAustralia2026-04-15Rousseaux, Michael Esq PROPOSAL18Amy Elsner
1003Faith GillianRussia2026-04-03Morlong Associates UNQUALIFIED43Xuxue Feng
1004Antonio CaudyItaly2026-04-16Truhlar And Truhlar Attys QUALIFIED11Bernardo Dominic
1005Jennifer AmigonSpain2026-04-09Printing Dimensions NEW34Amy Elsner
1006Greenwood BologniaFrance2026-04-10Commercial Press PROPOSAL13Anna Fali
1007Tony FollerCanada2026-04-06King, Christopher A Esq RENEWAL48Bernardo Dominic
1008Claire TollnerArgentina2026-04-06Feiner Bros UNQUALIFIED66Ivan Magalhaes
1009Julie StensethUnited Kingdom2026-04-11Rangoni Of Florence PROPOSAL47Bernardo Dominic
1010Octavia MaletJapan2026-03-27Buckley Miller Wright NEGOTIATION79Ioni Bowcher
1011Deepesh ChuiAustralia2026-04-20Benton, John B Jr RENEWAL36Amy Elsner
1012Silvio SlusarskiRussia2026-04-11Chemel, James L Cpa UNQUALIFIED33Ivan Magalhaes
1013Claire TollnerArgentina2026-04-07Dorl, James J Esq RENEWAL41Anna Fali
1014Tony FollerCanada2026-04-18Chemel, James L Cpa NEGOTIATION56Xuxue Feng
1015Ivar PaprockiBrazil2026-04-09King, Christopher A Esq NEGOTIATION1Ivan Magalhaes
1016Clifford RimUnited Kingdom2026-04-01Commercial Press NEGOTIATION87Ioni Bowcher
1017Murillo MaletItaly2026-04-21Benton, John B Jr QUALIFIED43Elwin Sharvill
1018Aditya KuskoSpain2026-04-09Morlong Associates PROPOSAL74Onyama Limba
1019Arvin AlbaresItaly2026-04-08Chanay, Jeffrey A Esq RENEWAL94Xuxue Feng
1020Francesco ShinkoItaly2026-04-16Rousseaux, Michael Esq UNQUALIFIED1Elwin Sharvill
1021Munro FerenczCanada2026-04-02Printing Dimensions NEW89Amy Elsner
1022Costa DilliardUnited Kingdom2026-04-16Rousseaux, Michael Esq QUALIFIED67Ivan Magalhaes
1023Octavia MaletIndia2026-04-10King, Christopher A Esq RENEWAL17Bernardo Dominic
1024Claire TollnerArgentina2026-04-17Benton, John B Jr PROPOSAL42Elwin Sharvill
1025Ricardo GauchoIndia2026-03-30Commercial Press NEGOTIATION56Amy Elsner
1026Darci PoquetteRussia2026-04-06Feiner Bros UNQUALIFIED40Asiya Javayant
1027Octavia MaletCanada2026-04-04Chemel, James L Cpa NEGOTIATION31Asiya Javayant
1028Leja CaldareraArgentina2026-04-20Buckley Miller Wright UNQUALIFIED15Elwin Sharvill
1029Leon OldroydBrazil2026-04-08Commercial Press RENEWAL47Xuxue Feng
1030Cody SaylorsItaly2026-03-31King, Christopher A Esq UNQUALIFIED29Ioni Bowcher
1031Kaitlin OstroskyItaly2026-04-15Chemel, James L Cpa PROPOSAL27Asiya Javayant
1032Emily WhobreySpain2026-03-26Rousseaux, Michael Esq RENEWAL79Onyama Limba
1033Rodrigues CampainUnited Kingdom2026-04-08Benton, John B Jr NEW27Ioni Bowcher
1034Johnson SergiRussia2026-03-30Dorl, James J Esq NEGOTIATION18Elwin Sharvill
1035Jennifer AmigonRussia2026-04-11Morlong Associates NEW59Elwin Sharvill
1036Morrow RutaItaly2026-04-03Feltz Printing Service UNQUALIFIED70Stephen Shaw
1037Faith GillianJapan2026-04-17Benton, John B Jr NEGOTIATION27Amy Elsner
1038Isabel BowleyJapan2026-04-06Chapman, Ross E Esq UNQUALIFIED96Anna Fali
1039James ButtUnited Kingdom2026-04-13Chanay, Jeffrey A Esq PROPOSAL96Asiya Javayant
1040Ashley DoeJapan2026-04-15Chapman, Ross E Esq QUALIFIED29Stephen Shaw
1041Smith GlickAustralia2026-04-04Commercial Press QUALIFIED34Ioni Bowcher
1042Cody SaylorsCanada2026-04-20Feltz Printing Service NEW73Ioni Bowcher
1043Ashley DoeRussia2026-03-30King, Christopher A Esq QUALIFIED24Ivan Magalhaes
1044Antonio CaudyUnited Kingdom2026-04-11Chanay, Jeffrey A Esq QUALIFIED1Asiya Javayant
1045Nicolas IturbideRussia2026-04-18Rousseaux, Michael Esq RENEWAL64Amy Elsner
1046Wickens NestleArgentina2026-04-08Feiner Bros PROPOSAL42Asiya Javayant
1047Arvin AlbaresBrazil2026-04-16Morlong Associates RENEWAL21Asiya Javayant
1048Kadeem FlosiIndia2026-03-31Buckley Miller Wright NEGOTIATION65Ioni Bowcher
1049Ricardo GauchoRussia2026-04-20Feiner Bros UNQUALIFIED54Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Jennifer AmigonFranceIvan Magalhaes UNQUALIFIED
Ivar PaprockiArgentinaOnyama Limba RENEWAL
Johnson SergiGermanyAmy Elsner UNQUALIFIED
Wickens NestleIndiaIoni Bowcher UNQUALIFIED
Johnson SergiBrazilOnyama Limba QUALIFIED
Sinclair WaycottJapanXuxue Feng RENEWAL
Johnson SergiUnited KingdomXuxue Feng UNQUALIFIED
Morrow RutaUnited KingdomIvan Magalhaes UNQUALIFIED
Jones VocelkaUnited KingdomIoni Bowcher NEGOTIATION
Juan WieserIndiaBernardo Dominic NEW
Salvatore StockhamUnited KingdomIoni Bowcher PROPOSAL
Mujtaba NickaUnited KingdomAmy Elsner RENEWAL
Mayumi KolmetzBrazilIvan Magalhaes QUALIFIED
Emily WhobreyItalyIvan Magalhaes QUALIFIED
Salvatore StockhamIndiaAsiya Javayant PROPOSAL
Jennifer AmigonAustraliaStephen Shaw PROPOSAL
Isabel BowleyIndiaAmy Elsner QUALIFIED
David DarakjyUnited KingdomElwin Sharvill RENEWAL
Murillo MaletGermanyStephen Shaw PROPOSAL
Costa DilliardCanadaIoni Bowcher UNQUALIFIED
David DarakjyBrazilIvan Magalhaes RENEWAL
Antonio CaudyUnited KingdomXuxue Feng RENEWAL
Silvio SlusarskiIndiaAsiya Javayant QUALIFIED
Julie StensethAustraliaXuxue Feng RENEWAL
Ashley DoeBrazilAmy Elsner PROPOSAL
David DarakjyItalyXuxue Feng NEGOTIATION
Jefferson SchemmerIndiaBernardo Dominic RENEWAL
Faith GillianGermanyOnyama Limba NEGOTIATION
Tony FollerAustraliaAsiya Javayant UNQUALIFIED
Aruna FigeroaItalyIvan Magalhaes NEW
Alejandro PerinRussiaStephen Shaw UNQUALIFIED
Ricardo GauchoFranceBernardo Dominic RENEWAL
Mujtaba NickaJapanAsiya Javayant RENEWAL
Morrow RutaFranceIoni Bowcher PROPOSAL
Julie StensethRussiaAnna Fali PROPOSAL
Costa DilliardJapanBernardo Dominic NEGOTIATION
Izzy GarufiSpainXuxue Feng NEGOTIATION
Smith GlickIndiaIoni Bowcher PROPOSAL
Mujtaba NickaArgentinaXuxue Feng PROPOSAL
Tony FollerFranceAnna Fali UNQUALIFIED
James ButtSpainElwin Sharvill NEW
Ricardo GauchoBrazilStephen Shaw PROPOSAL
Jones VocelkaIndiaStephen Shaw PROPOSAL
Wickens NestleFranceAmy Elsner PROPOSAL
Chavez BriddickGermanyAnna Fali NEW
Emily WhobreyUnited KingdomAnna Fali RENEWAL
Morrow RutaIndiaOnyama Limba PROPOSAL
Murillo MaletRussiaAmy Elsner UNQUALIFIED
Juan WieserFranceAsiya Javayant NEW
Julie StensethArgentinaIvan Magalhaes NEGOTIATION
Frozen Columns
Name
Costa Dilliard
Darci Poquette
Ashley Doe
Isabel Bowley
Smith Glick
Nicolas Iturbide
Leja Caldarera
Adams Morasca
Kaitlin Ostrosky
Faith Gillian
Faith Gillian
Aika Inouye
Wickens Nestle
Maisha Rulapaugh
Antonio Caudy
Kadeem Flosi
Aruna Figeroa
Stacey Maclead
Salvatore Stockham
Alejandro Perin
Jefferson Schemmer
Smith Glick
Kaitlin Ostrosky
Misaki Royster
Ivar Paprocki
Claire Tollner
Alejandro Perin
Nicolas Iturbide
Leon Oldroyd
Kaitlin Ostrosky
Maisha Rulapaugh
Clifford Rim
Tony Foller
Munro Ferencz
Jennifer Amigon
Izzy Garufi
Cody Saylors
Jefferson Schemmer
Johnson Sergi
Salvatore Stockham
Morrow Ruta
James Butt
Mujtaba Nicka
Leon Oldroyd
Aditya Kusko
Chavez Briddick
Kadeem Flosi
Kaitlin Ostrosky
Aika Inouye
Juan Wieser
IdCountryDate
1000United Kingdom2026-04-03
1001Italy2026-03-30
1002Italy2026-04-07
1003Argentina2026-03-28
1004Germany2026-04-15
1005United Kingdom2026-03-26
1006Spain2026-03-26
1007Brazil2026-04-18
1008United Kingdom2026-04-11
1009Spain2026-04-02
1010Italy2026-04-13
1011Canada2026-03-27
1012Brazil2026-04-21
1013Brazil2026-03-29
1014Canada2026-04-16
1015Australia2026-04-20
1016Germany2026-04-11
1017Canada2026-04-08
1018Canada2026-04-03
1019Spain2026-04-05
1020Italy2026-04-09
1021United Kingdom2026-03-29
1022Russia2026-04-03
1023Germany2026-03-28
1024Argentina2026-03-28
1025Italy2026-04-21
1026Canada2026-04-10
1027France2026-04-21
1028United Kingdom2026-04-16
1029India2026-04-06
1030Australia2026-03-26
1031France2026-04-04
1032Italy2026-04-23
1033Japan2026-03-27
1034Canada2026-04-17
1035Brazil2026-04-14
1036Australia2026-04-08
1037Argentina2026-04-05
1038Brazil2026-03-28
1039Canada2026-04-08
1040Australia2026-04-09
1041Canada2026-04-24
1042Brazil2026-04-19
1043France2026-04-22
1044Spain2026-04-16
1045Japan2026-04-10
1046Japan2026-04-01
1047Argentina2026-04-03
1048Brazil2026-03-27
1049India2026-04-09

On-Demand Data

NameIdCountryDate
Wickens Nestle1000France2026-04-04
Emily Whobrey1001Spain2026-04-20
Johnson Sergi1002Japan2026-04-10
Deepesh Chui1003Spain2026-04-10
Juan Wieser1004Germany2026-04-23
Aruna Figeroa1005United Kingdom2026-04-07
Nicolas Iturbide1006Italy2026-03-27
Ivar Paprocki1007United Kingdom2026-04-01
Claire Tollner1008Brazil2026-04-02
Cody Saylors1009France2026-03-31
Maria Marrier1010France2026-03-27
Cody Saylors1011Canada2026-04-21
Johnson Sergi1012France2026-04-18
Antonio Caudy1013Brazil2026-04-18
Darci Poquette1014Russia2026-04-24
Ricardo Gaucho1015Germany2026-04-18
Kaitlin Ostrosky1016India2026-04-01
Jennifer Amigon1017Spain2026-04-02
Julie Stenseth1018India2026-04-15
Salvatore Stockham1019Russia2026-04-05
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Antonio CaudyJapanIoni Bowcher NEGOTIATION
Clifford RimJapanStephen Shaw PROPOSAL
Mujtaba NickaIndiaBernardo Dominic UNQUALIFIED
Jeanfrancois VenereItalyXuxue Feng NEW
Francesco ShinkoGermanyXuxue Feng NEGOTIATION
Mujtaba NickaGermanyAmy Elsner QUALIFIED
Faith GillianCanadaIoni Bowcher QUALIFIED
Julie StensethArgentinaIoni Bowcher RENEWAL
Jefferson SchemmerBrazilXuxue Feng RENEWAL
Nicolas IturbideItalyIvan Magalhaes NEGOTIATION
Jeanfrancois VenereSpainAsiya Javayant PROPOSAL
Greenwood BologniaAustraliaXuxue Feng NEW
Johnson SergiUnited KingdomXuxue Feng UNQUALIFIED
Deepesh ChuiItalyIoni Bowcher PROPOSAL
Jennifer AmigonFranceXuxue Feng QUALIFIED
Murillo MaletUnited KingdomXuxue Feng NEW
Isabel BowleySpainAmy Elsner PROPOSAL
Johnson SergiIndiaStephen Shaw PROPOSAL
Alejandro PerinRussiaXuxue Feng PROPOSAL
James ButtCanadaAmy Elsner UNQUALIFIED
Rodrigues CampainIndiaElwin Sharvill UNQUALIFIED
Murillo MaletJapanAnna Fali PROPOSAL
Chavez BriddickJapanAmy Elsner RENEWAL
Ricardo GauchoFranceAmy Elsner NEW
Aditya KuskoBrazilIoni Bowcher NEW
Faith GillianItalyAmy Elsner NEW
Rodrigues CampainRussiaXuxue Feng RENEWAL
Smith GlickRussiaIoni Bowcher RENEWAL
Munro FerenczIndiaAsiya Javayant RENEWAL
Mayumi KolmetzSpainIvan Magalhaes NEW
Misaki RoysterBrazilStephen Shaw NEW
David DarakjySpainElwin Sharvill QUALIFIED
Ivar PaprockiGermanyXuxue Feng RENEWAL
Juan WieserIndiaStephen Shaw PROPOSAL
Nicolas IturbideFranceAmy Elsner UNQUALIFIED
Smith GlickArgentinaAmy Elsner NEGOTIATION
Deepesh ChuiArgentinaAsiya Javayant PROPOSAL
Faith GillianJapanAnna Fali UNQUALIFIED
Tony FollerIndiaXuxue Feng UNQUALIFIED
Aika InouyeFranceIvan Magalhaes 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>