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
Johnson SergiBrazilElwin Sharvill NEW
Murillo MaletSpainOnyama Limba NEGOTIATION
Costa DilliardRussiaElwin Sharvill NEGOTIATION
Kaitlin OstroskyBrazilAsiya Javayant PROPOSAL
Nicolas IturbideUnited KingdomIvan Magalhaes RENEWAL
Izzy GarufiUnited KingdomOnyama Limba RENEWAL
Johnson SergiGermanyAnna Fali UNQUALIFIED
Wickens NestleItalyAnna Fali NEW
Misaki RoysterArgentinaAsiya Javayant QUALIFIED
David DarakjyRussiaAmy Elsner QUALIFIED
Maisha RulapaughItalyIvan Magalhaes PROPOSAL
Juan WieserBrazilIoni Bowcher QUALIFIED
Chavez BriddickAustraliaBernardo Dominic PROPOSAL
Kaitlin OstroskyGermanyIvan Magalhaes QUALIFIED
Ricardo GauchoFranceIvan Magalhaes NEGOTIATION
Cody SaylorsSpainAnna Fali RENEWAL
Nicolas IturbideArgentinaElwin Sharvill QUALIFIED
Francesco ShinkoJapanXuxue Feng NEGOTIATION
Ivar PaprockiItalyAmy Elsner QUALIFIED
Murillo MaletSpainAmy Elsner NEGOTIATION
Faith GillianBrazilAsiya Javayant UNQUALIFIED
Tony FollerFranceIvan Magalhaes PROPOSAL
Claire TollnerAustraliaOnyama Limba PROPOSAL
Kadeem FlosiArgentinaAsiya Javayant UNQUALIFIED
Claire TollnerSpainBernardo Dominic NEGOTIATION
Leja CaldareraGermanyIoni Bowcher UNQUALIFIED
Deepesh ChuiUnited KingdomIvan Magalhaes PROPOSAL
Misaki RoysterUnited KingdomBernardo Dominic NEW
Leja CaldareraRussiaAnna Fali NEGOTIATION
Jones VocelkaCanadaAsiya Javayant UNQUALIFIED
Chavez BriddickJapanBernardo Dominic NEW
Mayumi KolmetzCanadaIvan Magalhaes PROPOSAL
Faith GillianSpainAmy Elsner QUALIFIED
Wickens NestleAustraliaAnna Fali PROPOSAL
Greenwood BologniaFranceElwin Sharvill UNQUALIFIED
Aruna FigeroaArgentinaStephen Shaw NEGOTIATION
Arvin AlbaresUnited KingdomElwin Sharvill UNQUALIFIED
Wickens NestleCanadaIoni Bowcher NEW
Alejandro PerinCanadaStephen Shaw QUALIFIED
Ivar PaprockiJapanXuxue Feng RENEWAL
Murillo MaletSpainAnna Fali NEGOTIATION
Costa DilliardJapanAsiya Javayant UNQUALIFIED
Tony FollerIndiaAmy Elsner PROPOSAL
Salvatore StockhamBrazilBernardo Dominic NEGOTIATION
Aika InouyeIndiaAnna Fali NEGOTIATION
Aika InouyeItalyStephen Shaw RENEWAL
Faith GillianArgentinaIvan Magalhaes RENEWAL
Alejandro PerinRussiaBernardo Dominic UNQUALIFIED
Munro FerenczJapanAsiya Javayant QUALIFIED
Morrow RutaBrazilIvan Magalhaes UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Salvatore StockhamFranceAsiya Javayant PROPOSAL
Alejandro PerinRussiaIvan Magalhaes UNQUALIFIED
Sinclair WaycottIndiaIoni Bowcher PROPOSAL
Clifford RimItalyElwin Sharvill RENEWAL
Johnson SergiCanadaXuxue Feng UNQUALIFIED
Deepesh ChuiItalyBernardo Dominic NEGOTIATION
Isabel BowleyGermanyStephen Shaw PROPOSAL
Isabel BowleyRussiaStephen Shaw NEGOTIATION
Leon OldroydGermanyIoni Bowcher NEW
Antonio CaudyBrazilStephen Shaw PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Wickens NestleArgentina2026-04-15Commercial Press NEGOTIATION4Amy Elsner
1001Claire TollnerArgentina2026-05-03Buckley Miller Wright QUALIFIED3Onyama Limba
1002Maria MarrierAustralia2026-05-02Rousseaux, Michael Esq NEW17Stephen Shaw
1003Stacey MacleadSpain2026-04-21Commercial Press UNQUALIFIED79Amy Elsner
1004Alejandro PerinGermany2026-04-14Chapman, Ross E Esq UNQUALIFIED97Bernardo Dominic
1005Ivar PaprockiRussia2026-04-10Feiner Bros RENEWAL86Ioni Bowcher
1006Isabel BowleyGermany2026-04-17Rangoni Of Florence NEGOTIATION40Asiya Javayant
1007Munro FerenczBrazil2026-04-10Chapman, Ross E Esq PROPOSAL64Asiya Javayant
1008Ricardo GauchoArgentina2026-04-07Chanay, Jeffrey A Esq PROPOSAL90Asiya Javayant
1009Maisha RulapaughIndia2026-04-21Dorl, James J Esq PROPOSAL47Asiya Javayant
1010Darci PoquetteUnited Kingdom2026-04-15Chemel, James L Cpa NEW49Asiya Javayant
1011Alejandro PerinGermany2026-04-25Dorl, James J Esq QUALIFIED92Amy Elsner
1012Kadeem FlosiAustralia2026-04-27Chanay, Jeffrey A Esq RENEWAL14Elwin Sharvill
1013Sinclair WaycottGermany2026-04-22King, Christopher A Esq NEGOTIATION85Ivan Magalhaes
1014Salvatore StockhamGermany2026-04-15Commercial Press NEW91Ivan Magalhaes
1015Munro FerenczUnited Kingdom2026-05-05Commercial Press NEW28Ivan Magalhaes
1016Salvatore StockhamBrazil2026-04-23Morlong Associates QUALIFIED78Xuxue Feng
1017Mujtaba NickaGermany2026-04-11Feiner Bros QUALIFIED64Ioni Bowcher
1018Salvatore StockhamArgentina2026-04-08Rousseaux, Michael Esq NEGOTIATION40Xuxue Feng
1019Leon OldroydCanada2026-04-11Commercial Press PROPOSAL20Onyama Limba
1020Kadeem FlosiGermany2026-05-03Morlong Associates UNQUALIFIED4Elwin Sharvill
1021Julie StensethItaly2026-04-14Chemel, James L Cpa RENEWAL60Elwin Sharvill
1022Murillo MaletAustralia2026-05-01Buckley Miller Wright QUALIFIED77Onyama Limba
1023Izzy GarufiGermany2026-04-25Feiner Bros PROPOSAL85Ivan Magalhaes
1024Aditya KuskoJapan2026-04-17Chanay, Jeffrey A Esq UNQUALIFIED88Onyama Limba
1025Adams MorascaCanada2026-04-09Chapman, Ross E Esq QUALIFIED12Amy Elsner
1026Rodrigues CampainArgentina2026-04-29Chanay, Jeffrey A Esq QUALIFIED46Asiya Javayant
1027Claire TollnerUnited Kingdom2026-05-03Rousseaux, Michael Esq NEGOTIATION37Ivan Magalhaes
1028Wickens NestleItaly2026-04-27Buckley Miller Wright NEGOTIATION51Elwin Sharvill
1029Octavia MaletJapan2026-04-22Buckley Miller Wright NEW46Elwin Sharvill
1030Jennifer AmigonArgentina2026-05-01Feltz Printing Service UNQUALIFIED2Anna Fali
1031Johnson SergiIndia2026-05-04Commercial Press UNQUALIFIED63Anna Fali
1032Greenwood BologniaItaly2026-04-12Feiner Bros RENEWAL64Anna Fali
1033Costa DilliardAustralia2026-04-22Commercial Press PROPOSAL70Xuxue Feng
1034Julie StensethBrazil2026-04-22Rousseaux, Michael Esq PROPOSAL92Xuxue Feng
1035Jennifer AmigonArgentina2026-04-18Chanay, Jeffrey A Esq NEGOTIATION29Bernardo Dominic
1036Jefferson SchemmerGermany2026-04-07Morlong Associates UNQUALIFIED15Stephen Shaw
1037Ashley DoeArgentina2026-04-30Commercial Press RENEWAL93Anna Fali
1038Izzy GarufiArgentina2026-05-03Rousseaux, Michael Esq NEGOTIATION7Xuxue Feng
1039Greenwood BologniaIndia2026-05-06Feiner Bros PROPOSAL4Ivan Magalhaes
1040Aditya KuskoRussia2026-05-03Truhlar And Truhlar Attys UNQUALIFIED50Onyama Limba
1041Emily WhobreyAustralia2026-05-05Feltz Printing Service NEW77Onyama Limba
1042Sinclair WaycottFrance2026-04-11Morlong Associates PROPOSAL73Amy Elsner
1043Claire TollnerJapan2026-04-19Rousseaux, Michael Esq NEW63Bernardo Dominic
1044Stacey MacleadGermany2026-04-09King, Christopher A Esq PROPOSAL68Elwin Sharvill
1045Octavia MaletBrazil2026-04-14Buckley Miller Wright NEGOTIATION67Elwin Sharvill
1046Aruna FigeroaCanada2026-04-11Rangoni Of Florence UNQUALIFIED78Elwin Sharvill
1047David DarakjyArgentina2026-04-15Chanay, Jeffrey A Esq NEGOTIATION24Amy Elsner
1048Arvin AlbaresArgentina2026-04-26Buckley Miller Wright QUALIFIED67Ivan Magalhaes
1049Greenwood BologniaRussia2026-05-05Chapman, Ross E Esq PROPOSAL13Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Mayumi KolmetzUnited KingdomBernardo Dominic PROPOSAL
Cody SaylorsGermanyAmy Elsner PROPOSAL
Silvio SlusarskiRussiaElwin Sharvill PROPOSAL
Leja CaldareraBrazilBernardo Dominic PROPOSAL
Misaki RoysterRussiaStephen Shaw RENEWAL
Rodrigues CampainFranceOnyama Limba PROPOSAL
Aditya KuskoCanadaAmy Elsner RENEWAL
Ricardo GauchoAustraliaAsiya Javayant RENEWAL
Alejandro PerinItalyBernardo Dominic NEW
Mayumi KolmetzJapanElwin Sharvill RENEWAL
Cody SaylorsCanadaXuxue Feng NEGOTIATION
Claire TollnerItalyAnna Fali NEW
Greenwood BologniaRussiaAnna Fali PROPOSAL
Adams MorascaItalyAmy Elsner UNQUALIFIED
Jeanfrancois VenereCanadaAsiya Javayant QUALIFIED
Murillo MaletRussiaAmy Elsner UNQUALIFIED
Stacey MacleadSpainAnna Fali UNQUALIFIED
Munro FerenczItalyIvan Magalhaes QUALIFIED
Octavia MaletUnited KingdomAmy Elsner PROPOSAL
James ButtFranceIvan Magalhaes NEGOTIATION
Claire TollnerCanadaAnna Fali NEW
Stacey MacleadSpainBernardo Dominic QUALIFIED
Alejandro PerinCanadaIvan Magalhaes PROPOSAL
Jeanfrancois VenereCanadaAnna Fali UNQUALIFIED
Leon OldroydBrazilOnyama Limba RENEWAL
Octavia MaletUnited KingdomElwin Sharvill UNQUALIFIED
Francesco ShinkoBrazilOnyama Limba RENEWAL
Rodrigues CampainItalyAmy Elsner NEGOTIATION
Arvin AlbaresCanadaElwin Sharvill RENEWAL
Juan WieserGermanyIoni Bowcher NEW
Salvatore StockhamGermanyXuxue Feng UNQUALIFIED
Aditya KuskoBrazilElwin Sharvill PROPOSAL
Jennifer AmigonFranceAsiya Javayant UNQUALIFIED
Emily WhobreyGermanyAnna Fali PROPOSAL
Wickens NestleArgentinaStephen Shaw QUALIFIED
Juan WieserArgentinaXuxue Feng PROPOSAL
Octavia MaletUnited KingdomElwin Sharvill NEW
Jeanfrancois VenereAustraliaOnyama Limba RENEWAL
Johnson SergiIndiaElwin Sharvill UNQUALIFIED
Julie StensethIndiaAnna Fali UNQUALIFIED
Jefferson SchemmerItalyAsiya Javayant PROPOSAL
Wickens NestleItalyXuxue Feng RENEWAL
Murillo MaletItalyBernardo Dominic QUALIFIED
Misaki RoysterItalyIoni Bowcher UNQUALIFIED
Aditya KuskoIndiaBernardo Dominic PROPOSAL
Cody SaylorsArgentinaAnna Fali PROPOSAL
Rodrigues CampainFranceXuxue Feng UNQUALIFIED
Deepesh ChuiFranceBernardo Dominic UNQUALIFIED
Octavia MaletIndiaAmy Elsner NEGOTIATION
Deepesh ChuiGermanyIoni Bowcher NEGOTIATION
Frozen Columns
Name
Maria Marrier
Adams Morasca
Aruna Figeroa
Jennifer Amigon
Mayumi Kolmetz
Leja Caldarera
Claire Tollner
Alejandro Perin
Julie Stenseth
Johnson Sergi
Leja Caldarera
Kadeem Flosi
Faith Gillian
Stacey Maclead
Antonio Caudy
Cody Saylors
Adams Morasca
Rodrigues Campain
Ricardo Gaucho
Mujtaba Nicka
Nicolas Iturbide
Chavez Briddick
Julie Stenseth
Faith Gillian
Octavia Malet
Maria Marrier
Chavez Briddick
Wickens Nestle
Clifford Rim
Julie Stenseth
Clifford Rim
Silvio Slusarski
Arvin Albares
Johnson Sergi
Ivar Paprocki
Jones Vocelka
David Darakjy
James Butt
Sinclair Waycott
Ivar Paprocki
Rodrigues Campain
Ashley Doe
Smith Glick
Maria Marrier
Greenwood Bolognia
Jeanfrancois Venere
Octavia Malet
Morrow Ruta
Morrow Ruta
Adams Morasca
IdCountryDate
1000Germany2026-04-07
1001United Kingdom2026-04-28
1002Brazil2026-05-04
1003United Kingdom2026-05-04
1004Brazil2026-04-11
1005India2026-05-02
1006Australia2026-04-19
1007Russia2026-04-18
1008Spain2026-04-15
1009Spain2026-04-30
1010France2026-04-27
1011Japan2026-04-28
1012Spain2026-04-14
1013Australia2026-04-08
1014France2026-04-14
1015Canada2026-04-16
1016United Kingdom2026-04-24
1017Spain2026-04-30
1018Brazil2026-04-13
1019France2026-04-24
1020United Kingdom2026-04-18
1021Canada2026-04-11
1022Argentina2026-05-05
1023United Kingdom2026-05-05
1024Russia2026-04-16
1025Argentina2026-04-23
1026Germany2026-05-01
1027Canada2026-04-14
1028Brazil2026-04-12
1029Australia2026-04-19
1030Germany2026-05-02
1031Brazil2026-04-11
1032Brazil2026-04-21
1033Brazil2026-05-05
1034Italy2026-04-20
1035Spain2026-05-02
1036Italy2026-04-07
1037Spain2026-05-01
1038Argentina2026-05-04
1039Germany2026-05-06
1040Italy2026-04-29
1041United Kingdom2026-04-24
1042Canada2026-04-24
1043Spain2026-04-10
1044Germany2026-04-19
1045India2026-04-15
1046Brazil2026-04-08
1047Germany2026-05-01
1048India2026-04-27
1049Russia2026-04-21

On-Demand Data

NameIdCountryDate
Aditya Kusko1000Australia2026-04-21
Maria Marrier1001Brazil2026-04-20
Adams Morasca1002Spain2026-04-24
Maria Marrier1003Japan2026-04-26
Maisha Rulapaugh1004France2026-05-05
Faith Gillian1005France2026-04-11
Francesco Shinko1006India2026-05-02
Aika Inouye1007United Kingdom2026-04-21
Nicolas Iturbide1008Italy2026-04-20
Nicolas Iturbide1009Germany2026-04-27
Johnson Sergi1010Germany2026-04-13
Smith Glick1011Canada2026-04-21
Juan Wieser1012Japan2026-04-22
Darci Poquette1013Germany2026-04-20
Clifford Rim1014India2026-05-02
Costa Dilliard1015India2026-05-05
Clifford Rim1016Canada2026-04-15
Jennifer Amigon1017Canada2026-05-06
Mujtaba Nicka1018Australia2026-05-06
Silvio Slusarski1019Japan2026-04-24
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Rodrigues CampainArgentinaXuxue Feng PROPOSAL
Aika InouyeAustraliaBernardo Dominic NEGOTIATION
Morrow RutaBrazilIoni Bowcher NEW
Sinclair WaycottItalyAnna Fali QUALIFIED
Jeanfrancois VenereAustraliaAsiya Javayant UNQUALIFIED
Adams MorascaFranceBernardo Dominic NEGOTIATION
Stacey MacleadRussiaOnyama Limba PROPOSAL
Aruna FigeroaUnited KingdomAmy Elsner RENEWAL
Clifford RimAustraliaOnyama Limba RENEWAL
Kadeem FlosiRussiaXuxue Feng NEGOTIATION
Costa DilliardAustraliaIvan Magalhaes NEGOTIATION
Emily WhobreyRussiaIvan Magalhaes PROPOSAL
Leja CaldareraItalyAmy Elsner NEW
Antonio CaudyRussiaOnyama Limba RENEWAL
Maria MarrierJapanStephen Shaw NEGOTIATION
Antonio CaudyRussiaElwin Sharvill NEGOTIATION
Adams MorascaSpainBernardo Dominic UNQUALIFIED
Aika InouyeUnited KingdomIvan Magalhaes NEGOTIATION
Mayumi KolmetzItalyXuxue Feng NEGOTIATION
Morrow RutaRussiaBernardo Dominic NEW
Jeanfrancois VenereArgentinaAmy Elsner UNQUALIFIED
Darci PoquetteCanadaXuxue Feng NEW
Mayumi KolmetzBrazilBernardo Dominic NEW
Misaki RoysterIndiaOnyama Limba RENEWAL
Darci PoquetteSpainXuxue Feng NEGOTIATION
Jefferson SchemmerBrazilAsiya Javayant UNQUALIFIED
Chavez BriddickSpainStephen Shaw PROPOSAL
Sinclair WaycottFranceBernardo Dominic QUALIFIED
Kadeem FlosiUnited KingdomAmy Elsner PROPOSAL
Munro FerenczRussiaIoni Bowcher PROPOSAL
Wickens NestleJapanAsiya Javayant PROPOSAL
James ButtCanadaIvan Magalhaes UNQUALIFIED
Clifford RimAustraliaIvan Magalhaes RENEWAL
Smith GlickJapanAmy Elsner NEGOTIATION
Adams MorascaArgentinaIvan Magalhaes PROPOSAL
Mujtaba NickaSpainXuxue Feng RENEWAL
Jennifer AmigonGermanyAmy Elsner UNQUALIFIED
Salvatore StockhamSpainStephen Shaw QUALIFIED
Johnson SergiSpainBernardo Dominic NEGOTIATION
Isabel BowleyFranceStephen Shaw 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>