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
Isabel BowleyUnited KingdomIvan Magalhaes NEW
Stacey MacleadGermanyBernardo Dominic UNQUALIFIED
Ashley DoeArgentinaAmy Elsner NEGOTIATION
Maria MarrierItalyStephen Shaw UNQUALIFIED
Deepesh ChuiArgentinaBernardo Dominic NEW
Ashley DoeRussiaStephen Shaw RENEWAL
Mujtaba NickaUnited KingdomAnna Fali NEGOTIATION
Aruna FigeroaJapanXuxue Feng NEW
Sinclair WaycottItalyIvan Magalhaes NEGOTIATION
Ivar PaprockiArgentinaXuxue Feng NEGOTIATION
Jennifer AmigonItalyIoni Bowcher PROPOSAL
Isabel BowleyRussiaBernardo Dominic QUALIFIED
Ashley DoeFranceIoni Bowcher RENEWAL
Aika InouyeSpainAmy Elsner NEGOTIATION
Ivar PaprockiCanadaAsiya Javayant NEGOTIATION
Stacey MacleadAustraliaOnyama Limba NEGOTIATION
Silvio SlusarskiGermanyAnna Fali PROPOSAL
Ricardo GauchoGermanyElwin Sharvill PROPOSAL
Ricardo GauchoRussiaBernardo Dominic PROPOSAL
Isabel BowleyItalyStephen Shaw NEW
Costa DilliardSpainAmy Elsner UNQUALIFIED
Jefferson SchemmerSpainStephen Shaw NEGOTIATION
Jennifer AmigonSpainAmy Elsner QUALIFIED
Julie StensethAustraliaElwin Sharvill NEGOTIATION
Misaki RoysterArgentinaIvan Magalhaes RENEWAL
Cody SaylorsBrazilStephen Shaw PROPOSAL
Leja CaldareraArgentinaOnyama Limba NEGOTIATION
Ricardo GauchoRussiaAsiya Javayant QUALIFIED
Mayumi KolmetzSpainOnyama Limba PROPOSAL
Maria MarrierAustraliaStephen Shaw RENEWAL
Izzy GarufiUnited KingdomXuxue Feng QUALIFIED
Julie StensethArgentinaAmy Elsner NEGOTIATION
Maisha RulapaughArgentinaStephen Shaw NEW
Adams MorascaBrazilElwin Sharvill QUALIFIED
Francesco ShinkoJapanAsiya Javayant UNQUALIFIED
Mayumi KolmetzRussiaBernardo Dominic NEW
Leon OldroydGermanyElwin Sharvill NEGOTIATION
Deepesh ChuiIndiaAnna Fali NEW
Silvio SlusarskiJapanStephen Shaw RENEWAL
Cody SaylorsArgentinaStephen Shaw NEW
Munro FerenczIndiaXuxue Feng UNQUALIFIED
Cody SaylorsAustraliaXuxue Feng RENEWAL
Jennifer AmigonRussiaStephen Shaw QUALIFIED
Wickens NestleAustraliaIoni Bowcher PROPOSAL
Maisha RulapaughRussiaIvan Magalhaes UNQUALIFIED
Aika InouyeGermanyOnyama Limba UNQUALIFIED
Octavia MaletCanadaIvan Magalhaes NEW
Sinclair WaycottFranceStephen Shaw RENEWAL
Ricardo GauchoJapanElwin Sharvill RENEWAL
Octavia MaletJapanElwin Sharvill NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Isabel BowleySpainIoni Bowcher QUALIFIED
Emily WhobreyGermanyAnna Fali NEGOTIATION
Faith GillianIndiaStephen Shaw PROPOSAL
Greenwood BologniaIndiaAnna Fali NEGOTIATION
Munro FerenczIndiaAmy Elsner NEW
Ivar PaprockiSpainAnna Fali PROPOSAL
Mayumi KolmetzBrazilAsiya Javayant QUALIFIED
Tony FollerGermanyXuxue Feng UNQUALIFIED
Misaki RoysterIndiaAmy Elsner NEGOTIATION
Jennifer AmigonGermanyAnna Fali RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Adams MorascaGermany2026-04-15Dorl, James J Esq UNQUALIFIED79Xuxue Feng
1001Maisha RulapaughRussia2026-05-03Feiner Bros NEW65Onyama Limba
1002Jefferson SchemmerItaly2026-05-02Feiner Bros NEGOTIATION74Stephen Shaw
1003James ButtCanada2026-05-12Chemel, James L Cpa RENEWAL56Amy Elsner
1004Costa DilliardFrance2026-04-22King, Christopher A Esq RENEWAL56Xuxue Feng
1005Claire TollnerFrance2026-04-30Morlong Associates UNQUALIFIED52Stephen Shaw
1006Clifford RimCanada2026-05-04Chanay, Jeffrey A Esq UNQUALIFIED29Asiya Javayant
1007Silvio SlusarskiGermany2026-04-16Commercial Press UNQUALIFIED18Elwin Sharvill
1008Kadeem FlosiFrance2026-04-13Chanay, Jeffrey A Esq UNQUALIFIED5Bernardo Dominic
1009Greenwood BologniaIndia2026-05-10Chemel, James L Cpa NEW10Amy Elsner
1010Leja CaldareraBrazil2026-05-05Benton, John B Jr QUALIFIED55Xuxue Feng
1011Francesco ShinkoArgentina2026-04-26Dorl, James J Esq RENEWAL42Ivan Magalhaes
1012Jones VocelkaSpain2026-05-05Feiner Bros QUALIFIED76Amy Elsner
1013Chavez BriddickBrazil2026-04-28Rangoni Of Florence RENEWAL97Ioni Bowcher
1014Darci PoquetteBrazil2026-04-22Feiner Bros PROPOSAL32Elwin Sharvill
1015Stacey MacleadJapan2026-04-18Benton, John B Jr NEW12Anna Fali
1016Munro FerenczRussia2026-04-13Dorl, James J Esq PROPOSAL57Elwin Sharvill
1017Greenwood BologniaAustralia2026-05-09Printing Dimensions PROPOSAL44Elwin Sharvill
1018Cody SaylorsGermany2026-04-21Chemel, James L Cpa NEW54Ivan Magalhaes
1019Jefferson SchemmerBrazil2026-05-01Benton, John B Jr RENEWAL71Amy Elsner
1020Munro FerenczBrazil2026-04-27Truhlar And Truhlar Attys QUALIFIED23Amy Elsner
1021Smith GlickItaly2026-04-27Chanay, Jeffrey A Esq PROPOSAL64Onyama Limba
1022Ivar PaprockiRussia2026-04-15Rousseaux, Michael Esq RENEWAL41Asiya Javayant
1023David DarakjyArgentina2026-04-30King, Christopher A Esq NEW27Asiya Javayant
1024Octavia MaletIndia2026-05-09Chanay, Jeffrey A Esq NEGOTIATION78Elwin Sharvill
1025Stacey MacleadSpain2026-04-24Rousseaux, Michael Esq NEW45Ivan Magalhaes
1026Murillo MaletGermany2026-04-24Dorl, James J Esq NEW33Xuxue Feng
1027Jeanfrancois VenereFrance2026-04-19Commercial Press NEGOTIATION78Elwin Sharvill
1028David DarakjyGermany2026-04-29Dorl, James J Esq RENEWAL48Stephen Shaw
1029Ricardo GauchoFrance2026-04-13Benton, John B Jr PROPOSAL20Elwin Sharvill
1030Misaki RoysterIndia2026-04-24Rousseaux, Michael Esq NEGOTIATION34Stephen Shaw
1031Clifford RimIndia2026-04-28Chapman, Ross E Esq QUALIFIED77Ivan Magalhaes
1032Leon OldroydArgentina2026-04-13Rangoni Of Florence NEGOTIATION69Anna Fali
1033Rodrigues CampainGermany2026-05-01Buckley Miller Wright UNQUALIFIED38Anna Fali
1034Adams MorascaJapan2026-05-03Feiner Bros PROPOSAL86Amy Elsner
1035Kadeem FlosiUnited Kingdom2026-04-24Dorl, James J Esq NEW91Xuxue Feng
1036Salvatore StockhamRussia2026-04-20Rangoni Of Florence RENEWAL80Ioni Bowcher
1037Aika InouyeFrance2026-04-15Chemel, James L Cpa RENEWAL30Anna Fali
1038Cody SaylorsSpain2026-04-16Chemel, James L Cpa NEGOTIATION39Anna Fali
1039Clifford RimArgentina2026-04-22Chapman, Ross E Esq PROPOSAL46Ioni Bowcher
1040Aika InouyeUnited Kingdom2026-04-16Rangoni Of Florence UNQUALIFIED49Onyama Limba
1041Munro FerenczRussia2026-04-18King, Christopher A Esq PROPOSAL68Stephen Shaw
1042Cody SaylorsGermany2026-05-07Morlong Associates QUALIFIED24Stephen Shaw
1043Rodrigues CampainUnited Kingdom2026-05-12Rangoni Of Florence NEGOTIATION72Onyama Limba
1044Emily WhobreyGermany2026-04-17Rangoni Of Florence UNQUALIFIED94Xuxue Feng
1045Adams MorascaUnited Kingdom2026-04-25Truhlar And Truhlar Attys PROPOSAL15Elwin Sharvill
1046Francesco ShinkoGermany2026-04-27Feiner Bros RENEWAL24Amy Elsner
1047Costa DilliardItaly2026-05-01Chanay, Jeffrey A Esq NEGOTIATION20Anna Fali
1048Mayumi KolmetzItaly2026-04-28King, Christopher A Esq RENEWAL58Ivan Magalhaes
1049Misaki RoysterArgentina2026-05-06Truhlar And Truhlar Attys UNQUALIFIED80Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Chavez BriddickFranceXuxue Feng UNQUALIFIED
Adams MorascaItalyAmy Elsner UNQUALIFIED
Silvio SlusarskiFranceBernardo Dominic NEGOTIATION
Julie StensethJapanOnyama Limba UNQUALIFIED
Tony FollerUnited KingdomAnna Fali QUALIFIED
Kadeem FlosiCanadaIoni Bowcher UNQUALIFIED
Izzy GarufiGermanyIoni Bowcher NEW
Izzy GarufiUnited KingdomIoni Bowcher RENEWAL
Izzy GarufiIndiaXuxue Feng PROPOSAL
Francesco ShinkoRussiaBernardo Dominic QUALIFIED
Antonio CaudyCanadaAsiya Javayant NEGOTIATION
Johnson SergiAustraliaOnyama Limba NEGOTIATION
Juan WieserArgentinaXuxue Feng QUALIFIED
Aditya KuskoSpainOnyama Limba QUALIFIED
Kaitlin OstroskyBrazilBernardo Dominic PROPOSAL
Clifford RimAustraliaBernardo Dominic UNQUALIFIED
Maisha RulapaughIndiaAsiya Javayant UNQUALIFIED
Tony FollerRussiaOnyama Limba QUALIFIED
Wickens NestleAustraliaAnna Fali UNQUALIFIED
Ivar PaprockiAustraliaAmy Elsner PROPOSAL
Mayumi KolmetzRussiaElwin Sharvill NEW
Francesco ShinkoGermanyIoni Bowcher UNQUALIFIED
Izzy GarufiUnited KingdomIvan Magalhaes UNQUALIFIED
Munro FerenczJapanIoni Bowcher NEGOTIATION
Aika InouyeIndiaElwin Sharvill NEW
Misaki RoysterCanadaAmy Elsner UNQUALIFIED
Juan WieserUnited KingdomAmy Elsner RENEWAL
Aruna FigeroaItalyStephen Shaw RENEWAL
Jennifer AmigonUnited KingdomElwin Sharvill PROPOSAL
Sinclair WaycottItalyStephen Shaw QUALIFIED
Maria MarrierUnited KingdomAsiya Javayant RENEWAL
Maisha RulapaughArgentinaElwin Sharvill QUALIFIED
Julie StensethIndiaOnyama Limba NEGOTIATION
David DarakjySpainStephen Shaw QUALIFIED
Stacey MacleadRussiaIvan Magalhaes UNQUALIFIED
Maisha RulapaughAustraliaBernardo Dominic PROPOSAL
Leja CaldareraBrazilAsiya Javayant PROPOSAL
Mujtaba NickaItalyOnyama Limba UNQUALIFIED
Silvio SlusarskiIndiaAmy Elsner UNQUALIFIED
Faith GillianCanadaElwin Sharvill QUALIFIED
Jones VocelkaCanadaAnna Fali NEGOTIATION
Johnson SergiItalyXuxue Feng UNQUALIFIED
Morrow RutaAustraliaOnyama Limba NEW
Sinclair WaycottItalyAmy Elsner QUALIFIED
Greenwood BologniaArgentinaIvan Magalhaes NEGOTIATION
Isabel BowleyCanadaBernardo Dominic NEGOTIATION
Claire TollnerFranceOnyama Limba UNQUALIFIED
Misaki RoysterRussiaStephen Shaw NEGOTIATION
Sinclair WaycottItalyIoni Bowcher QUALIFIED
Stacey MacleadRussiaStephen Shaw RENEWAL
Frozen Columns
Name
Aika Inouye
Kaitlin Ostrosky
Kaitlin Ostrosky
Cody Saylors
Murillo Malet
Stacey Maclead
Maisha Rulapaugh
Octavia Malet
Arvin Albares
Juan Wieser
Murillo Malet
Rodrigues Campain
Jeanfrancois Venere
Salvatore Stockham
Jefferson Schemmer
Emily Whobrey
Alejandro Perin
Kaitlin Ostrosky
Ivar Paprocki
Johnson Sergi
Salvatore Stockham
Aruna Figeroa
Smith Glick
Nicolas Iturbide
Chavez Briddick
Kadeem Flosi
Wickens Nestle
Jeanfrancois Venere
Rodrigues Campain
Aditya Kusko
Munro Ferencz
Sinclair Waycott
James Butt
Antonio Caudy
Kadeem Flosi
Leon Oldroyd
Greenwood Bolognia
Ricardo Gaucho
Jeanfrancois Venere
Morrow Ruta
Ashley Doe
Jeanfrancois Venere
Isabel Bowley
Misaki Royster
Nicolas Iturbide
Claire Tollner
Jefferson Schemmer
Rodrigues Campain
Ricardo Gaucho
Faith Gillian
IdCountryDate
1000Australia2026-05-09
1001United Kingdom2026-05-03
1002India2026-04-30
1003India2026-04-19
1004Japan2026-05-05
1005Russia2026-04-16
1006India2026-04-26
1007Australia2026-05-12
1008Canada2026-04-26
1009Russia2026-04-14
1010Argentina2026-05-10
1011United Kingdom2026-05-12
1012India2026-05-06
1013Brazil2026-04-29
1014United Kingdom2026-04-17
1015Russia2026-04-18
1016United Kingdom2026-04-24
1017Argentina2026-04-20
1018India2026-04-17
1019Italy2026-04-29
1020Australia2026-05-10
1021Germany2026-04-26
1022India2026-04-29
1023Argentina2026-05-04
1024France2026-05-03
1025India2026-04-20
1026Germany2026-04-16
1027Germany2026-05-02
1028Argentina2026-05-04
1029Russia2026-04-18
1030Brazil2026-05-06
1031Italy2026-05-04
1032Japan2026-05-04
1033France2026-04-14
1034United Kingdom2026-04-24
1035Australia2026-05-11
1036Germany2026-04-25
1037Canada2026-04-27
1038Spain2026-05-06
1039United Kingdom2026-04-21
1040Brazil2026-04-19
1041Argentina2026-04-27
1042India2026-04-25
1043Russia2026-05-01
1044Australia2026-05-01
1045France2026-04-27
1046India2026-04-28
1047Russia2026-05-03
1048Australia2026-05-03
1049Brazil2026-04-16

On-Demand Data

NameIdCountryDate
Juan Wieser1000Argentina2026-04-17
Ricardo Gaucho1001Russia2026-04-27
Chavez Briddick1002Russia2026-04-27
Octavia Malet1003Germany2026-04-14
Greenwood Bolognia1004Italy2026-04-26
Cody Saylors1005Brazil2026-04-17
Jones Vocelka1006Japan2026-05-06
Jefferson Schemmer1007Russia2026-05-07
Silvio Slusarski1008Japan2026-04-21
Munro Ferencz1009Japan2026-05-12
Leon Oldroyd1010United Kingdom2026-05-04
Murillo Malet1011Germany2026-04-28
Jennifer Amigon1012Russia2026-04-24
Costa Dilliard1013Brazil2026-05-06
Julie Stenseth1014Brazil2026-05-01
Aika Inouye1015Germany2026-04-20
Rodrigues Campain1016United Kingdom2026-05-05
Maisha Rulapaugh1017Russia2026-05-02
Mujtaba Nicka1018Argentina2026-04-15
Silvio Slusarski1019Brazil2026-04-27
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Silvio SlusarskiRussiaAnna Fali NEGOTIATION
Munro FerenczSpainIvan Magalhaes UNQUALIFIED
James ButtAustraliaXuxue Feng NEGOTIATION
Jennifer AmigonAustraliaAmy Elsner PROPOSAL
Isabel BowleyJapanAmy Elsner QUALIFIED
Izzy GarufiIndiaStephen Shaw PROPOSAL
Smith GlickGermanyXuxue Feng NEGOTIATION
Antonio CaudyIndiaIoni Bowcher UNQUALIFIED
Ricardo GauchoArgentinaAnna Fali NEGOTIATION
Ricardo GauchoCanadaAmy Elsner UNQUALIFIED
Jeanfrancois VenereAustraliaIvan Magalhaes PROPOSAL
Maria MarrierFranceElwin Sharvill RENEWAL
Faith GillianJapanAnna Fali UNQUALIFIED
Clifford RimArgentinaAsiya Javayant PROPOSAL
Cody SaylorsCanadaXuxue Feng RENEWAL
Jones VocelkaItalyIoni Bowcher RENEWAL
Murillo MaletRussiaOnyama Limba UNQUALIFIED
Deepesh ChuiBrazilIoni Bowcher QUALIFIED
Tony FollerAustraliaIoni Bowcher PROPOSAL
Rodrigues CampainCanadaOnyama Limba RENEWAL
Darci PoquetteArgentinaAsiya Javayant UNQUALIFIED
Faith GillianCanadaAmy Elsner PROPOSAL
Darci PoquetteItalyElwin Sharvill NEW
Chavez BriddickSpainElwin Sharvill PROPOSAL
Nicolas IturbideIndiaElwin Sharvill UNQUALIFIED
Cody SaylorsIndiaOnyama Limba NEGOTIATION
Maria MarrierRussiaAmy Elsner UNQUALIFIED
Ashley DoeSpainBernardo Dominic NEGOTIATION
Isabel BowleyArgentinaIoni Bowcher NEGOTIATION
Sinclair WaycottBrazilStephen Shaw PROPOSAL
Ivar PaprockiItalyAsiya Javayant NEGOTIATION
Jennifer AmigonJapanAmy Elsner PROPOSAL
Costa DilliardGermanyStephen Shaw NEGOTIATION
Juan WieserCanadaIoni Bowcher UNQUALIFIED
Alejandro PerinBrazilAnna Fali NEGOTIATION
Faith GillianIndiaElwin Sharvill UNQUALIFIED
Jones VocelkaIndiaAmy Elsner PROPOSAL
Jeanfrancois VenereSpainIoni Bowcher NEW
Julie StensethRussiaXuxue Feng QUALIFIED
Cody SaylorsFranceBernardo Dominic 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>