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
Maisha RulapaughItalyXuxue Feng UNQUALIFIED
Kadeem FlosiUnited KingdomStephen Shaw PROPOSAL
Tony FollerAustraliaOnyama Limba NEGOTIATION
Sinclair WaycottGermanyIoni Bowcher NEW
Aruna FigeroaItalyAsiya Javayant NEGOTIATION
Jones VocelkaBrazilAnna Fali RENEWAL
Ashley DoeSpainOnyama Limba UNQUALIFIED
Francesco ShinkoRussiaXuxue Feng NEW
Darci PoquetteGermanyAmy Elsner QUALIFIED
Darci PoquetteJapanStephen Shaw PROPOSAL
Deepesh ChuiRussiaXuxue Feng QUALIFIED
Juan WieserRussiaStephen Shaw RENEWAL
Maisha RulapaughArgentinaXuxue Feng QUALIFIED
Antonio CaudyUnited KingdomAnna Fali NEGOTIATION
Misaki RoysterSpainAsiya Javayant QUALIFIED
Antonio CaudyUnited KingdomOnyama Limba NEW
Murillo MaletBrazilElwin Sharvill UNQUALIFIED
Ivar PaprockiAustraliaIvan Magalhaes NEGOTIATION
Sinclair WaycottUnited KingdomBernardo Dominic QUALIFIED
Sinclair WaycottBrazilIoni Bowcher UNQUALIFIED
Chavez BriddickCanadaElwin Sharvill NEW
Kadeem FlosiArgentinaAnna Fali PROPOSAL
Rodrigues CampainItalyIvan Magalhaes PROPOSAL
Izzy GarufiArgentinaOnyama Limba QUALIFIED
Jefferson SchemmerRussiaIoni Bowcher RENEWAL
Julie StensethSpainAmy Elsner PROPOSAL
Aditya KuskoRussiaAsiya Javayant PROPOSAL
Murillo MaletFranceIoni Bowcher NEW
Morrow RutaSpainIoni Bowcher QUALIFIED
Arvin AlbaresIndiaBernardo Dominic NEW
Rodrigues CampainFranceXuxue Feng UNQUALIFIED
Leon OldroydSpainBernardo Dominic NEW
Claire TollnerUnited KingdomXuxue Feng QUALIFIED
Mayumi KolmetzAustraliaAmy Elsner NEGOTIATION
Silvio SlusarskiGermanyIoni Bowcher UNQUALIFIED
Aditya KuskoArgentinaStephen Shaw QUALIFIED
Darci PoquetteItalyStephen Shaw UNQUALIFIED
Smith GlickCanadaAnna Fali PROPOSAL
Kadeem FlosiArgentinaIoni Bowcher RENEWAL
Morrow RutaCanadaXuxue Feng QUALIFIED
Emily WhobreyCanadaBernardo Dominic NEW
Aika InouyeSpainAnna Fali NEGOTIATION
Mayumi KolmetzJapanIvan Magalhaes NEW
Ashley DoeUnited KingdomAmy Elsner RENEWAL
Aruna FigeroaFranceIvan Magalhaes PROPOSAL
Smith GlickItalyBernardo Dominic RENEWAL
Sinclair WaycottItalyStephen Shaw QUALIFIED
Aika InouyeRussiaIvan Magalhaes NEW
Aika InouyeSpainBernardo Dominic NEW
Morrow RutaIndiaXuxue Feng NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Rodrigues CampainJapanAmy Elsner PROPOSAL
Stacey MacleadRussiaOnyama Limba QUALIFIED
Aruna FigeroaUnited KingdomStephen Shaw NEGOTIATION
Tony FollerArgentinaIvan Magalhaes NEGOTIATION
Leon OldroydSpainIvan Magalhaes NEW
Salvatore StockhamArgentinaOnyama Limba RENEWAL
Maria MarrierItalyAsiya Javayant UNQUALIFIED
Darci PoquetteIndiaAmy Elsner QUALIFIED
Maria MarrierGermanyIvan Magalhaes QUALIFIED
Clifford RimSpainXuxue Feng UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Stacey MacleadJapan2025-08-27Chemel, James L Cpa RENEWAL74Ivan Magalhaes
1001Munro FerenczJapan2025-09-04Rousseaux, Michael Esq RENEWAL42Elwin Sharvill
1002Wickens NestleItaly2025-08-16Printing Dimensions RENEWAL62Elwin Sharvill
1003Juan WieserCanada2025-08-17Buckley Miller Wright QUALIFIED78Onyama Limba
1004Tony FollerGermany2025-08-30Dorl, James J Esq RENEWAL98Ivan Magalhaes
1005Octavia MaletBrazil2025-08-20Chapman, Ross E Esq QUALIFIED96Anna Fali
1006Alejandro PerinUnited Kingdom2025-08-30Rousseaux, Michael Esq PROPOSAL50Elwin Sharvill
1007Jefferson SchemmerAustralia2025-08-20King, Christopher A Esq UNQUALIFIED82Ioni Bowcher
1008Salvatore StockhamUnited Kingdom2025-09-01Rangoni Of Florence PROPOSAL53Bernardo Dominic
1009Isabel BowleyArgentina2025-08-22Truhlar And Truhlar Attys PROPOSAL70Ivan Magalhaes
1010Wickens NestleCanada2025-09-02Commercial Press NEGOTIATION82Xuxue Feng
1011Costa DilliardRussia2025-08-25Feltz Printing Service UNQUALIFIED82Stephen Shaw
1012Jennifer AmigonIndia2025-08-27Commercial Press NEW51Amy Elsner
1013Aditya KuskoUnited Kingdom2025-09-03Printing Dimensions RENEWAL9Stephen Shaw
1014Greenwood BologniaSpain2025-08-28Dorl, James J Esq PROPOSAL21Anna Fali
1015Murillo MaletSpain2025-08-18King, Christopher A Esq QUALIFIED45Ivan Magalhaes
1016Wickens NestleIndia2025-09-06Buckley Miller Wright PROPOSAL92Anna Fali
1017Cody SaylorsItaly2025-09-07Chanay, Jeffrey A Esq NEGOTIATION84Elwin Sharvill
1018Adams MorascaJapan2025-09-12Feltz Printing Service QUALIFIED9Asiya Javayant
1019Misaki RoysterBrazil2025-08-26Truhlar And Truhlar Attys NEW53Ioni Bowcher
1020Octavia MaletGermany2025-08-30Feiner Bros RENEWAL98Ivan Magalhaes
1021Jennifer AmigonArgentina2025-09-04Commercial Press QUALIFIED4Bernardo Dominic
1022Jeanfrancois VenereIndia2025-08-19Feltz Printing Service RENEWAL59Asiya Javayant
1023Mujtaba NickaCanada2025-08-30Feiner Bros UNQUALIFIED37Anna Fali
1024Mujtaba NickaSpain2025-09-14Chanay, Jeffrey A Esq PROPOSAL10Xuxue Feng
1025Isabel BowleyItaly2025-09-02Buckley Miller Wright NEGOTIATION9Xuxue Feng
1026Sinclair WaycottRussia2025-08-20King, Christopher A Esq QUALIFIED33Ivan Magalhaes
1027Alejandro PerinGermany2025-08-21Buckley Miller Wright NEGOTIATION4Bernardo Dominic
1028Wickens NestleBrazil2025-08-22Feiner Bros UNQUALIFIED38Ivan Magalhaes
1029Ashley DoeAustralia2025-09-11Feltz Printing Service NEW78Onyama Limba
1030Aika InouyeIndia2025-09-06Chapman, Ross E Esq QUALIFIED78Ioni Bowcher
1031Mayumi KolmetzRussia2025-09-09Feiner Bros RENEWAL56Anna Fali
1032Wickens NestleArgentina2025-09-10Chanay, Jeffrey A Esq QUALIFIED27Anna Fali
1033Wickens NestleCanada2025-08-26Chemel, James L Cpa QUALIFIED92Asiya Javayant
1034Stacey MacleadIndia2025-08-23Rangoni Of Florence RENEWAL55Anna Fali
1035Kaitlin OstroskySpain2025-08-31Chapman, Ross E Esq RENEWAL31Ioni Bowcher
1036Arvin AlbaresSpain2025-08-20Chanay, Jeffrey A Esq RENEWAL21Anna Fali
1037Costa DilliardIndia2025-09-05Benton, John B Jr RENEWAL18Ioni Bowcher
1038Jones VocelkaCanada2025-08-28Buckley Miller Wright PROPOSAL26Anna Fali
1039Mayumi KolmetzFrance2025-09-02Buckley Miller Wright UNQUALIFIED74Bernardo Dominic
1040Maria MarrierRussia2025-08-29Rangoni Of Florence QUALIFIED44Amy Elsner
1041Jones VocelkaJapan2025-08-25Dorl, James J Esq NEW55Bernardo Dominic
1042Cody SaylorsFrance2025-08-26Commercial Press RENEWAL93Elwin Sharvill
1043Faith GillianArgentina2025-09-06Dorl, James J Esq PROPOSAL68Asiya Javayant
1044Jeanfrancois VenereAustralia2025-08-29Rousseaux, Michael Esq NEW74Onyama Limba
1045Arvin AlbaresArgentina2025-08-27Chapman, Ross E Esq NEW68Onyama Limba
1046Smith GlickJapan2025-08-21Feltz Printing Service UNQUALIFIED55Onyama Limba
1047David DarakjyAustralia2025-09-12Chapman, Ross E Esq UNQUALIFIED23Bernardo Dominic
1048Leon OldroydUnited Kingdom2025-08-19Commercial Press QUALIFIED8Stephen Shaw
1049Darci PoquetteAustralia2025-08-24Buckley Miller Wright UNQUALIFIED41Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Kadeem FlosiArgentinaAnna Fali UNQUALIFIED
Rodrigues CampainItalyBernardo Dominic NEW
James ButtFranceStephen Shaw RENEWAL
Tony FollerCanadaBernardo Dominic NEGOTIATION
Adams MorascaArgentinaBernardo Dominic NEGOTIATION
Aika InouyeJapanAnna Fali NEW
Nicolas IturbideRussiaIoni Bowcher NEW
Maria MarrierCanadaAsiya Javayant NEGOTIATION
Salvatore StockhamGermanyIoni Bowcher NEGOTIATION
Maisha RulapaughAustraliaAmy Elsner QUALIFIED
Kaitlin OstroskyGermanyAmy Elsner NEGOTIATION
Salvatore StockhamRussiaBernardo Dominic NEW
Misaki RoysterGermanyBernardo Dominic RENEWAL
Arvin AlbaresGermanyAnna Fali RENEWAL
Isabel BowleyAustraliaOnyama Limba UNQUALIFIED
Misaki RoysterFranceBernardo Dominic PROPOSAL
Aditya KuskoJapanStephen Shaw QUALIFIED
Salvatore StockhamBrazilAsiya Javayant UNQUALIFIED
Claire TollnerBrazilIvan Magalhaes UNQUALIFIED
Juan WieserUnited KingdomAsiya Javayant QUALIFIED
Munro FerenczSpainElwin Sharvill RENEWAL
Aruna FigeroaFranceIvan Magalhaes NEW
Salvatore StockhamBrazilXuxue Feng PROPOSAL
Arvin AlbaresGermanyAmy Elsner NEGOTIATION
Costa DilliardGermanyIoni Bowcher QUALIFIED
Alejandro PerinGermanyIvan Magalhaes NEW
Mayumi KolmetzAustraliaIvan Magalhaes RENEWAL
Clifford RimJapanStephen Shaw NEGOTIATION
Octavia MaletRussiaAmy Elsner PROPOSAL
Wickens NestleArgentinaElwin Sharvill UNQUALIFIED
Stacey MacleadSpainAsiya Javayant PROPOSAL
Arvin AlbaresItalyElwin Sharvill NEW
Costa DilliardBrazilBernardo Dominic QUALIFIED
Juan WieserGermanyBernardo Dominic NEGOTIATION
Darci PoquetteGermanyStephen Shaw RENEWAL
Jones VocelkaUnited KingdomElwin Sharvill QUALIFIED
Stacey MacleadJapanBernardo Dominic QUALIFIED
Nicolas IturbideSpainBernardo Dominic NEGOTIATION
Ivar PaprockiGermanyAnna Fali RENEWAL
Antonio CaudyRussiaStephen Shaw UNQUALIFIED
Isabel BowleySpainXuxue Feng PROPOSAL
Aditya KuskoIndiaXuxue Feng RENEWAL
Chavez BriddickFranceAmy Elsner NEW
Wickens NestleGermanyAmy Elsner QUALIFIED
Salvatore StockhamUnited KingdomBernardo Dominic QUALIFIED
Wickens NestleFranceStephen Shaw NEGOTIATION
Chavez BriddickItalyAmy Elsner QUALIFIED
Faith GillianCanadaAnna Fali NEGOTIATION
Leja CaldareraGermanyAnna Fali QUALIFIED
Faith GillianItalyAsiya Javayant QUALIFIED
Frozen Columns
Name
Adams Morasca
Francesco Shinko
Smith Glick
Ivar Paprocki
Kaitlin Ostrosky
Ashley Doe
Tony Foller
Izzy Garufi
Arvin Albares
Greenwood Bolognia
Francesco Shinko
Stacey Maclead
Greenwood Bolognia
Johnson Sergi
Jefferson Schemmer
Smith Glick
Stacey Maclead
Aika Inouye
Jefferson Schemmer
Salvatore Stockham
Morrow Ruta
Antonio Caudy
Claire Tollner
Julie Stenseth
Aruna Figeroa
Wickens Nestle
Jefferson Schemmer
Misaki Royster
Munro Ferencz
Murillo Malet
Tony Foller
Ivar Paprocki
Juan Wieser
Jeanfrancois Venere
Wickens Nestle
Jefferson Schemmer
Kaitlin Ostrosky
Jones Vocelka
Arvin Albares
Sinclair Waycott
Ivar Paprocki
Adams Morasca
Salvatore Stockham
Aika Inouye
Stacey Maclead
Aika Inouye
Francesco Shinko
Jones Vocelka
Jennifer Amigon
David Darakjy
IdCountryDate
1000India2025-09-13
1001Italy2025-09-03
1002Canada2025-08-17
1003Brazil2025-09-03
1004Russia2025-09-09
1005Spain2025-08-17
1006Japan2025-08-22
1007Japan2025-09-11
1008United Kingdom2025-09-06
1009Canada2025-08-22
1010Australia2025-08-22
1011United Kingdom2025-08-23
1012Canada2025-08-27
1013Germany2025-09-02
1014Russia2025-08-24
1015Australia2025-08-23
1016Brazil2025-09-11
1017Russia2025-09-07
1018United Kingdom2025-08-16
1019Germany2025-09-07
1020Russia2025-08-21
1021Australia2025-09-04
1022France2025-08-20
1023Brazil2025-09-05
1024Brazil2025-09-12
1025Italy2025-09-05
1026Canada2025-09-05
1027Germany2025-08-26
1028Brazil2025-08-22
1029Australia2025-09-03
1030Brazil2025-08-20
1031Japan2025-08-30
1032Germany2025-09-03
1033Australia2025-08-30
1034Russia2025-08-31
1035India2025-08-16
1036Argentina2025-09-08
1037Australia2025-08-17
1038India2025-08-21
1039Russia2025-08-31
1040Russia2025-09-01
1041United Kingdom2025-09-11
1042Australia2025-09-06
1043Italy2025-08-16
1044France2025-08-23
1045India2025-09-02
1046Brazil2025-08-28
1047Spain2025-08-30
1048Spain2025-08-16
1049Germany2025-08-21

On-Demand Data

NameIdCountryDate
Julie Stenseth1000Germany2025-09-04
Silvio Slusarski1001United Kingdom2025-09-03
Ivar Paprocki1002Italy2025-09-11
Jones Vocelka1003Russia2025-09-12
Deepesh Chui1004Australia2025-09-04
Munro Ferencz1005Italy2025-08-25
Mayumi Kolmetz1006Spain2025-08-16
Izzy Garufi1007Russia2025-08-29
Isabel Bowley1008Italy2025-09-11
Deepesh Chui1009Canada2025-09-01
Faith Gillian1010Brazil2025-09-05
Maria Marrier1011Spain2025-08-28
Maria Marrier1012Germany2025-09-03
Mujtaba Nicka1013Australia2025-08-31
Aruna Figeroa1014Canada2025-09-12
Sinclair Waycott1015France2025-08-19
Chavez Briddick1016India2025-09-03
Rodrigues Campain1017Japan2025-09-07
Chavez Briddick1018Canada2025-09-05
Maria Marrier1019Germany2025-08-27
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aditya KuskoAustraliaIvan Magalhaes RENEWAL
Ivar PaprockiBrazilIoni Bowcher PROPOSAL
Maisha RulapaughItalyStephen Shaw RENEWAL
Faith GillianGermanyXuxue Feng NEGOTIATION
Ricardo GauchoItalyBernardo Dominic QUALIFIED
Jefferson SchemmerItalyIoni Bowcher UNQUALIFIED
Aruna FigeroaArgentinaAsiya Javayant NEGOTIATION
Silvio SlusarskiBrazilAsiya Javayant RENEWAL
Maisha RulapaughSpainAmy Elsner NEW
Antonio CaudyGermanyBernardo Dominic UNQUALIFIED
Jefferson SchemmerFranceAsiya Javayant NEW
Maria MarrierFranceStephen Shaw NEGOTIATION
Aditya KuskoGermanyIoni Bowcher RENEWAL
Ricardo GauchoUnited KingdomOnyama Limba QUALIFIED
Ricardo GauchoFranceAsiya Javayant RENEWAL
Stacey MacleadUnited KingdomAmy Elsner RENEWAL
Aika InouyeBrazilElwin Sharvill QUALIFIED
Juan WieserBrazilBernardo Dominic PROPOSAL
Stacey MacleadBrazilAmy Elsner PROPOSAL
Misaki RoysterUnited KingdomXuxue Feng PROPOSAL
Chavez BriddickArgentinaAnna Fali NEGOTIATION
Izzy GarufiAustraliaBernardo Dominic NEGOTIATION
Munro FerenczArgentinaAnna Fali RENEWAL
Jennifer AmigonGermanyElwin Sharvill QUALIFIED
James ButtBrazilAnna Fali RENEWAL
Wickens NestleSpainElwin Sharvill RENEWAL
Alejandro PerinBrazilXuxue Feng PROPOSAL
Adams MorascaUnited KingdomIvan Magalhaes QUALIFIED
Ashley DoeCanadaAmy Elsner NEGOTIATION
Darci PoquetteJapanElwin Sharvill UNQUALIFIED
Morrow RutaJapanIvan Magalhaes UNQUALIFIED
Munro FerenczJapanXuxue Feng UNQUALIFIED
Leja CaldareraArgentinaIvan Magalhaes RENEWAL
Greenwood BologniaArgentinaBernardo Dominic UNQUALIFIED
Leja CaldareraCanadaIoni Bowcher QUALIFIED
Adams MorascaCanadaIoni Bowcher UNQUALIFIED
Salvatore StockhamSpainIvan Magalhaes PROPOSAL
Ricardo GauchoRussiaAmy Elsner UNQUALIFIED
Johnson SergiBrazilAmy Elsner NEGOTIATION
Morrow RutaFranceAmy Elsner 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>