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
Francesco ShinkoUnited KingdomElwin Sharvill QUALIFIED
Ivar PaprockiJapanStephen Shaw RENEWAL
Emily WhobreyJapanBernardo Dominic NEGOTIATION
Maria MarrierRussiaAmy Elsner RENEWAL
Aditya KuskoArgentinaAmy Elsner QUALIFIED
James ButtBrazilAnna Fali UNQUALIFIED
Mayumi KolmetzUnited KingdomElwin Sharvill UNQUALIFIED
Jeanfrancois VenereUnited KingdomAnna Fali NEGOTIATION
Kaitlin OstroskyIndiaAsiya Javayant QUALIFIED
Munro FerenczJapanAsiya Javayant RENEWAL
Nicolas IturbideRussiaBernardo Dominic UNQUALIFIED
Alejandro PerinFranceIvan Magalhaes RENEWAL
Kaitlin OstroskyIndiaAnna Fali NEW
Cody SaylorsAustraliaOnyama Limba QUALIFIED
Greenwood BologniaIndiaAmy Elsner UNQUALIFIED
Kadeem FlosiFranceElwin Sharvill NEGOTIATION
Aika InouyeCanadaXuxue Feng NEGOTIATION
Claire TollnerUnited KingdomOnyama Limba PROPOSAL
David DarakjyFranceElwin Sharvill UNQUALIFIED
Maria MarrierCanadaAmy Elsner NEGOTIATION
Alejandro PerinBrazilIoni Bowcher NEW
Stacey MacleadRussiaBernardo Dominic QUALIFIED
Munro FerenczArgentinaElwin Sharvill NEW
Jeanfrancois VenereCanadaIoni Bowcher UNQUALIFIED
Misaki RoysterAustraliaAmy Elsner RENEWAL
Juan WieserCanadaBernardo Dominic QUALIFIED
Chavez BriddickBrazilElwin Sharvill PROPOSAL
Morrow RutaCanadaIoni Bowcher RENEWAL
Greenwood BologniaItalyAsiya Javayant QUALIFIED
Aditya KuskoIndiaStephen Shaw RENEWAL
Morrow RutaJapanAmy Elsner NEGOTIATION
Kaitlin OstroskyCanadaAsiya Javayant UNQUALIFIED
Stacey MacleadAustraliaBernardo Dominic NEW
Mayumi KolmetzBrazilElwin Sharvill PROPOSAL
Silvio SlusarskiCanadaElwin Sharvill RENEWAL
Greenwood BologniaFranceIoni Bowcher NEW
Mayumi KolmetzGermanyStephen Shaw NEGOTIATION
Leja CaldareraGermanyBernardo Dominic UNQUALIFIED
Jefferson SchemmerRussiaElwin Sharvill QUALIFIED
Leon OldroydArgentinaStephen Shaw QUALIFIED
Cody SaylorsFranceBernardo Dominic NEGOTIATION
Greenwood BologniaAustraliaIvan Magalhaes RENEWAL
Maria MarrierUnited KingdomAsiya Javayant RENEWAL
Wickens NestleItalyIoni Bowcher NEW
Ivar PaprockiFranceStephen Shaw QUALIFIED
Munro FerenczGermanyStephen Shaw NEGOTIATION
Alejandro PerinIndiaAnna Fali NEW
Julie StensethBrazilIvan Magalhaes NEGOTIATION
Rodrigues CampainJapanStephen Shaw PROPOSAL
Darci PoquetteFranceAmy Elsner RENEWAL
Horizontal
NameCountryRepresentativeStatus
Silvio SlusarskiAustraliaXuxue Feng QUALIFIED
Clifford RimCanadaAmy Elsner QUALIFIED
Aditya KuskoArgentinaElwin Sharvill QUALIFIED
Antonio CaudyItalyAnna Fali NEGOTIATION
Greenwood BologniaJapanIvan Magalhaes NEGOTIATION
Juan WieserRussiaStephen Shaw QUALIFIED
Jeanfrancois VenereUnited KingdomIoni Bowcher NEW
Sinclair WaycottCanadaAmy Elsner PROPOSAL
Octavia MaletIndiaAsiya Javayant QUALIFIED
Sinclair WaycottUnited KingdomBernardo Dominic RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Tony FollerIndia2026-04-02Benton, John B Jr RENEWAL45Elwin Sharvill
1001Mayumi KolmetzAustralia2026-04-04Buckley Miller Wright UNQUALIFIED96Stephen Shaw
1002Faith GillianGermany2026-04-06Rangoni Of Florence NEW30Asiya Javayant
1003Jeanfrancois VenereBrazil2026-04-19Chemel, James L Cpa RENEWAL28Amy Elsner
1004Izzy GarufiFrance2026-04-07Truhlar And Truhlar Attys QUALIFIED66Xuxue Feng
1005Antonio CaudyIndia2026-03-28Buckley Miller Wright NEW82Bernardo Dominic
1006Misaki RoysterArgentina2026-04-20Rousseaux, Michael Esq RENEWAL73Asiya Javayant
1007Clifford RimArgentina2026-04-04Chemel, James L Cpa QUALIFIED3Onyama Limba
1008Leon OldroydSpain2026-04-14Chapman, Ross E Esq NEGOTIATION83Ioni Bowcher
1009Jennifer AmigonItaly2026-04-20Buckley Miller Wright NEW80Xuxue Feng
1010Deepesh ChuiUnited Kingdom2026-04-07Printing Dimensions RENEWAL54Xuxue Feng
1011Maria MarrierIndia2026-04-08Dorl, James J Esq UNQUALIFIED23Bernardo Dominic
1012Aditya KuskoBrazil2026-03-29Chanay, Jeffrey A Esq PROPOSAL33Elwin Sharvill
1013Izzy GarufiAustralia2026-04-14Chapman, Ross E Esq QUALIFIED0Ioni Bowcher
1014Costa DilliardUnited Kingdom2026-04-13Feiner Bros NEW76Ivan Magalhaes
1015Izzy GarufiGermany2026-04-06Truhlar And Truhlar Attys PROPOSAL53Bernardo Dominic
1016Claire TollnerArgentina2026-03-28Truhlar And Truhlar Attys NEW78Anna Fali
1017Francesco ShinkoJapan2026-04-05Feiner Bros UNQUALIFIED17Amy Elsner
1018Leon OldroydBrazil2026-04-23Dorl, James J Esq NEGOTIATION2Elwin Sharvill
1019Mujtaba NickaRussia2026-04-18Commercial Press NEGOTIATION55Onyama Limba
1020Isabel BowleyUnited Kingdom2026-04-05Buckley Miller Wright NEW45Xuxue Feng
1021Aditya KuskoBrazil2026-04-10Chanay, Jeffrey A Esq NEGOTIATION2Ivan Magalhaes
1022Alejandro PerinCanada2026-04-05Chemel, James L Cpa QUALIFIED80Onyama Limba
1023Jefferson SchemmerFrance2026-03-26Printing Dimensions NEW5Anna Fali
1024Isabel BowleyArgentina2026-04-04Dorl, James J Esq RENEWAL78Elwin Sharvill
1025Salvatore StockhamAustralia2026-04-11Commercial Press PROPOSAL49Stephen Shaw
1026Izzy GarufiFrance2026-04-22Chanay, Jeffrey A Esq QUALIFIED74Ioni Bowcher
1027Misaki RoysterJapan2026-03-27Feltz Printing Service RENEWAL33Ioni Bowcher
1028Johnson SergiGermany2026-04-21Feiner Bros NEGOTIATION12Asiya Javayant
1029Octavia MaletUnited Kingdom2026-04-08Feiner Bros RENEWAL61Ioni Bowcher
1030Jeanfrancois VenereSpain2026-03-31Feltz Printing Service PROPOSAL6Xuxue Feng
1031Francesco ShinkoAustralia2026-03-28Commercial Press RENEWAL86Stephen Shaw
1032Stacey MacleadFrance2026-04-04King, Christopher A Esq RENEWAL63Bernardo Dominic
1033Nicolas IturbideUnited Kingdom2026-03-27Feiner Bros NEW15Bernardo Dominic
1034Emily WhobreyGermany2026-04-10Buckley Miller Wright NEGOTIATION17Amy Elsner
1035Mujtaba NickaGermany2026-03-26Printing Dimensions QUALIFIED21Onyama Limba
1036Rodrigues CampainBrazil2026-04-12Dorl, James J Esq RENEWAL34Asiya Javayant
1037Clifford RimAustralia2026-04-23Buckley Miller Wright NEGOTIATION84Stephen Shaw
1038Antonio CaudyGermany2026-04-09Truhlar And Truhlar Attys NEGOTIATION9Elwin Sharvill
1039Jefferson SchemmerBrazil2026-04-09Chemel, James L Cpa QUALIFIED86Ioni Bowcher
1040Aika InouyeBrazil2026-04-17Printing Dimensions PROPOSAL17Asiya Javayant
1041Munro FerenczUnited Kingdom2026-03-31Rangoni Of Florence NEGOTIATION36Bernardo Dominic
1042Leon OldroydFrance2026-04-19Feltz Printing Service QUALIFIED74Asiya Javayant
1043Johnson SergiBrazil2026-04-22Truhlar And Truhlar Attys QUALIFIED81Bernardo Dominic
1044Faith GillianItaly2026-03-28Dorl, James J Esq NEW55Ioni Bowcher
1045Emily WhobreyBrazil2026-04-03Buckley Miller Wright NEW66Ioni Bowcher
1046Mujtaba NickaJapan2026-04-21Commercial Press RENEWAL9Stephen Shaw
1047Francesco ShinkoRussia2026-04-11Chemel, James L Cpa NEGOTIATION66Bernardo Dominic
1048Izzy GarufiItaly2026-03-28Commercial Press PROPOSAL98Bernardo Dominic
1049Leja CaldareraGermany2026-04-10Chapman, Ross E Esq QUALIFIED31Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Kadeem FlosiGermanyBernardo Dominic PROPOSAL
Smith GlickIndiaAmy Elsner PROPOSAL
Mayumi KolmetzAustraliaAnna Fali NEW
Deepesh ChuiBrazilIvan Magalhaes RENEWAL
Francesco ShinkoSpainStephen Shaw PROPOSAL
James ButtItalyIoni Bowcher UNQUALIFIED
Faith GillianRussiaAnna Fali NEW
Rodrigues CampainArgentinaIoni Bowcher UNQUALIFIED
Faith GillianRussiaIvan Magalhaes RENEWAL
Claire TollnerSpainXuxue Feng NEW
Munro FerenczIndiaAsiya Javayant NEW
Aruna FigeroaItalyOnyama Limba PROPOSAL
Aruna FigeroaGermanyIvan Magalhaes QUALIFIED
Ivar PaprockiRussiaXuxue Feng QUALIFIED
Darci PoquetteJapanIvan Magalhaes NEW
Kadeem FlosiFranceOnyama Limba UNQUALIFIED
Octavia MaletAustraliaElwin Sharvill QUALIFIED
Jefferson SchemmerJapanXuxue Feng QUALIFIED
Octavia MaletGermanyAnna Fali NEW
Stacey MacleadUnited KingdomXuxue Feng PROPOSAL
Jeanfrancois VenereIndiaIvan Magalhaes UNQUALIFIED
James ButtFranceIvan Magalhaes NEGOTIATION
Mujtaba NickaSpainXuxue Feng NEGOTIATION
Mujtaba NickaAustraliaAmy Elsner UNQUALIFIED
Julie StensethItalyBernardo Dominic PROPOSAL
Costa DilliardRussiaAmy Elsner NEGOTIATION
Jefferson SchemmerSpainIoni Bowcher PROPOSAL
Alejandro PerinFranceIvan Magalhaes NEW
Nicolas IturbideBrazilIoni Bowcher NEGOTIATION
Jeanfrancois VenereSpainOnyama Limba UNQUALIFIED
Maria MarrierAustraliaIoni Bowcher QUALIFIED
Tony FollerSpainBernardo Dominic RENEWAL
Adams MorascaArgentinaAmy Elsner NEW
Aditya KuskoBrazilAnna Fali QUALIFIED
Julie StensethFranceAnna Fali RENEWAL
Maria MarrierIndiaXuxue Feng PROPOSAL
Jefferson SchemmerFranceStephen Shaw QUALIFIED
Munro FerenczCanadaAsiya Javayant NEGOTIATION
Maria MarrierRussiaAsiya Javayant QUALIFIED
Mujtaba NickaCanadaAmy Elsner UNQUALIFIED
Kadeem FlosiAustraliaAnna Fali NEGOTIATION
Emily WhobreyGermanyBernardo Dominic NEW
Jones VocelkaIndiaIoni Bowcher QUALIFIED
Misaki RoysterBrazilXuxue Feng NEGOTIATION
Mujtaba NickaBrazilXuxue Feng UNQUALIFIED
Jeanfrancois VenereJapanXuxue Feng RENEWAL
Izzy GarufiItalyOnyama Limba NEGOTIATION
Faith GillianAustraliaStephen Shaw UNQUALIFIED
Deepesh ChuiGermanyXuxue Feng NEW
Kadeem FlosiBrazilOnyama Limba UNQUALIFIED
Frozen Columns
Name
Ashley Doe
Kaitlin Ostrosky
Cody Saylors
Wickens Nestle
Cody Saylors
Wickens Nestle
Izzy Garufi
Wickens Nestle
Jefferson Schemmer
Francesco Shinko
Morrow Ruta
Izzy Garufi
Rodrigues Campain
Ivar Paprocki
Isabel Bowley
Johnson Sergi
Alejandro Perin
Leon Oldroyd
David Darakjy
Sinclair Waycott
Chavez Briddick
Izzy Garufi
Ashley Doe
Claire Tollner
Antonio Caudy
Aruna Figeroa
David Darakjy
Cody Saylors
Chavez Briddick
Jefferson Schemmer
Emily Whobrey
Salvatore Stockham
Darci Poquette
Isabel Bowley
Silvio Slusarski
Kadeem Flosi
Adams Morasca
Ricardo Gaucho
Antonio Caudy
Rodrigues Campain
Wickens Nestle
Deepesh Chui
Jefferson Schemmer
Tony Foller
Antonio Caudy
Claire Tollner
Octavia Malet
Antonio Caudy
Faith Gillian
Ricardo Gaucho
IdCountryDate
1000United Kingdom2026-04-08
1001Australia2026-04-15
1002India2026-04-06
1003Germany2026-04-10
1004Brazil2026-03-30
1005United Kingdom2026-04-08
1006Australia2026-04-22
1007Italy2026-03-31
1008United Kingdom2026-04-22
1009Russia2026-03-26
1010Russia2026-04-13
1011Russia2026-04-17
1012Argentina2026-04-07
1013Germany2026-04-10
1014United Kingdom2026-04-14
1015India2026-04-10
1016Canada2026-03-30
1017Japan2026-04-12
1018Italy2026-04-22
1019India2026-04-14
1020Italy2026-04-08
1021India2026-04-03
1022Argentina2026-04-07
1023Argentina2026-04-17
1024Russia2026-04-01
1025Canada2026-03-29
1026Spain2026-03-28
1027Russia2026-04-09
1028India2026-04-24
1029Australia2026-04-21
1030France2026-03-27
1031Russia2026-03-31
1032India2026-03-26
1033Brazil2026-03-29
1034Germany2026-04-19
1035Spain2026-03-30
1036United Kingdom2026-04-12
1037Canada2026-04-24
1038Japan2026-04-09
1039United Kingdom2026-04-14
1040Germany2026-04-06
1041France2026-03-30
1042Spain2026-04-22
1043Italy2026-03-27
1044Argentina2026-04-22
1045Argentina2026-04-15
1046Canada2026-03-31
1047Japan2026-04-23
1048Spain2026-04-23
1049Germany2026-04-05

On-Demand Data

NameIdCountryDate
Emily Whobrey1000Germany2026-03-28
Rodrigues Campain1001Japan2026-04-22
Ivar Paprocki1002Canada2026-04-15
Silvio Slusarski1003Australia2026-03-30
Murillo Malet1004Australia2026-04-17
Maria Marrier1005Canada2026-04-22
Misaki Royster1006Italy2026-04-18
Alejandro Perin1007Canada2026-04-02
Misaki Royster1008Russia2026-04-04
Ivar Paprocki1009Spain2026-04-11
Ivar Paprocki1010Japan2026-04-02
Mujtaba Nicka1011Australia2026-04-06
Aditya Kusko1012Italy2026-03-28
Arvin Albares1013Canada2026-04-19
Jennifer Amigon1014Spain2026-03-27
Octavia Malet1015Australia2026-04-09
Wickens Nestle1016Argentina2026-04-21
Jeanfrancois Venere1017Canada2026-04-05
Darci Poquette1018Japan2026-04-10
Munro Ferencz1019India2026-04-24
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Morrow RutaUnited KingdomAmy Elsner NEW
Claire TollnerSpainAmy Elsner RENEWAL
Jefferson SchemmerArgentinaAmy Elsner RENEWAL
Jefferson SchemmerAustraliaElwin Sharvill NEW
Mayumi KolmetzRussiaXuxue Feng UNQUALIFIED
Jennifer AmigonRussiaAmy Elsner NEGOTIATION
Faith GillianJapanBernardo Dominic RENEWAL
Cody SaylorsSpainAmy Elsner PROPOSAL
Kaitlin OstroskyUnited KingdomBernardo Dominic NEGOTIATION
Emily WhobreyUnited KingdomIoni Bowcher PROPOSAL
Aditya KuskoIndiaAnna Fali UNQUALIFIED
Nicolas IturbideAustraliaElwin Sharvill NEGOTIATION
Aditya KuskoBrazilIvan Magalhaes NEGOTIATION
David DarakjyAustraliaAnna Fali RENEWAL
Silvio SlusarskiGermanyIoni Bowcher UNQUALIFIED
Faith GillianRussiaStephen Shaw RENEWAL
Costa DilliardBrazilAmy Elsner QUALIFIED
Greenwood BologniaCanadaIoni Bowcher UNQUALIFIED
Maria MarrierFranceIoni Bowcher RENEWAL
Darci PoquetteIndiaBernardo Dominic UNQUALIFIED
Cody SaylorsItalyXuxue Feng PROPOSAL
Adams MorascaJapanAmy Elsner PROPOSAL
Jones VocelkaCanadaBernardo Dominic RENEWAL
Maria MarrierSpainElwin Sharvill RENEWAL
Izzy GarufiCanadaElwin Sharvill NEGOTIATION
Smith GlickGermanyIvan Magalhaes QUALIFIED
Aruna FigeroaGermanyBernardo Dominic PROPOSAL
Murillo MaletCanadaElwin Sharvill RENEWAL
Izzy GarufiGermanyIvan Magalhaes NEW
Juan WieserBrazilOnyama Limba QUALIFIED
Johnson SergiArgentinaStephen Shaw PROPOSAL
Wickens NestleCanadaIvan Magalhaes UNQUALIFIED
Jones VocelkaItalyXuxue Feng NEGOTIATION
Ricardo GauchoBrazilIvan Magalhaes UNQUALIFIED
Ivar PaprockiFranceStephen Shaw UNQUALIFIED
Greenwood BologniaBrazilAnna Fali QUALIFIED
Murillo MaletGermanyXuxue Feng QUALIFIED
Silvio SlusarskiArgentinaBernardo Dominic UNQUALIFIED
Johnson SergiFranceIoni Bowcher NEGOTIATION
Juan WieserSpainXuxue Feng NEW

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