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
Kadeem FlosiSpainXuxue Feng UNQUALIFIED
Ricardo GauchoAustraliaAsiya Javayant NEW
Costa DilliardJapanBernardo Dominic NEGOTIATION
Misaki RoysterUnited KingdomXuxue Feng NEW
Isabel BowleySpainAnna Fali PROPOSAL
Morrow RutaUnited KingdomBernardo Dominic NEW
Johnson SergiCanadaOnyama Limba QUALIFIED
Greenwood BologniaItalyAsiya Javayant RENEWAL
Deepesh ChuiIndiaAnna Fali QUALIFIED
Izzy GarufiGermanyIvan Magalhaes PROPOSAL
Wickens NestleAustraliaIoni Bowcher QUALIFIED
Greenwood BologniaAustraliaIoni Bowcher PROPOSAL
Silvio SlusarskiFranceBernardo Dominic QUALIFIED
Emily WhobreyRussiaElwin Sharvill PROPOSAL
Ashley DoeIndiaIoni Bowcher NEW
Emily WhobreyItalyAmy Elsner RENEWAL
Sinclair WaycottRussiaIoni Bowcher UNQUALIFIED
Smith GlickArgentinaIvan Magalhaes NEW
Misaki RoysterFranceXuxue Feng PROPOSAL
Izzy GarufiIndiaAsiya Javayant NEW
Tony FollerIndiaElwin Sharvill RENEWAL
Greenwood BologniaSpainAsiya Javayant QUALIFIED
Isabel BowleyItalyXuxue Feng NEGOTIATION
Sinclair WaycottIndiaOnyama Limba NEW
Antonio CaudyUnited KingdomOnyama Limba NEGOTIATION
Murillo MaletCanadaIvan Magalhaes NEW
Aditya KuskoSpainAnna Fali UNQUALIFIED
Morrow RutaItalyIvan Magalhaes RENEWAL
Greenwood BologniaRussiaIvan Magalhaes NEW
James ButtArgentinaElwin Sharvill NEW
Faith GillianBrazilElwin Sharvill NEGOTIATION
Antonio CaudyCanadaAnna Fali RENEWAL
Claire TollnerUnited KingdomOnyama Limba NEGOTIATION
Julie StensethUnited KingdomElwin Sharvill NEGOTIATION
Jennifer AmigonRussiaXuxue Feng RENEWAL
Izzy GarufiUnited KingdomBernardo Dominic PROPOSAL
Mayumi KolmetzUnited KingdomAmy Elsner NEGOTIATION
Stacey MacleadUnited KingdomElwin Sharvill PROPOSAL
Darci PoquetteGermanyAsiya Javayant NEGOTIATION
Munro FerenczArgentinaBernardo Dominic RENEWAL
Clifford RimJapanXuxue Feng NEW
Octavia MaletItalyAnna Fali PROPOSAL
Julie StensethIndiaOnyama Limba RENEWAL
Ivar PaprockiCanadaElwin Sharvill RENEWAL
Leja CaldareraArgentinaOnyama Limba RENEWAL
Aditya KuskoIndiaOnyama Limba UNQUALIFIED
Adams MorascaSpainAmy Elsner PROPOSAL
Octavia MaletRussiaIoni Bowcher NEGOTIATION
Leja CaldareraCanadaAsiya Javayant QUALIFIED
Clifford RimUnited KingdomAmy Elsner QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Smith GlickArgentinaStephen Shaw QUALIFIED
Jefferson SchemmerBrazilStephen Shaw NEGOTIATION
Cody SaylorsCanadaElwin Sharvill UNQUALIFIED
Munro FerenczUnited KingdomAsiya Javayant PROPOSAL
Jones VocelkaIndiaXuxue Feng NEW
Arvin AlbaresArgentinaIoni Bowcher NEW
Antonio CaudyIndiaIoni Bowcher NEGOTIATION
Morrow RutaJapanIvan Magalhaes RENEWAL
Deepesh ChuiFranceBernardo Dominic NEGOTIATION
Salvatore StockhamBrazilElwin Sharvill UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Jefferson SchemmerArgentina2026-05-21Rousseaux, Michael Esq QUALIFIED38Xuxue Feng
1001Rodrigues CampainJapan2026-06-06Rangoni Of Florence PROPOSAL82Bernardo Dominic
1002Juan WieserRussia2026-05-26King, Christopher A Esq PROPOSAL40Xuxue Feng
1003Antonio CaudyArgentina2026-06-01Rousseaux, Michael Esq UNQUALIFIED83Asiya Javayant
1004Francesco ShinkoIndia2026-06-08Chemel, James L Cpa QUALIFIED70Onyama Limba
1005Aditya KuskoSpain2026-06-03Truhlar And Truhlar Attys NEGOTIATION65Ivan Magalhaes
1006Jennifer AmigonFrance2026-05-12Commercial Press QUALIFIED3Onyama Limba
1007Claire TollnerJapan2026-05-13Printing Dimensions NEGOTIATION62Xuxue Feng
1008Octavia MaletJapan2026-05-18Morlong Associates PROPOSAL95Xuxue Feng
1009Aika InouyeCanada2026-05-18Printing Dimensions UNQUALIFIED32Bernardo Dominic
1010Juan WieserAustralia2026-06-06Printing Dimensions NEW20Ivan Magalhaes
1011James ButtAustralia2026-06-07Benton, John B Jr QUALIFIED55Stephen Shaw
1012Juan WieserIndia2026-05-19Chemel, James L Cpa QUALIFIED47Stephen Shaw
1013Stacey MacleadRussia2026-06-08Feiner Bros NEGOTIATION79Elwin Sharvill
1014Maisha RulapaughCanada2026-06-03Dorl, James J Esq QUALIFIED47Amy Elsner
1015Arvin AlbaresArgentina2026-05-25Printing Dimensions RENEWAL67Onyama Limba
1016Nicolas IturbideSpain2026-06-06Truhlar And Truhlar Attys QUALIFIED49Amy Elsner
1017Mujtaba NickaFrance2026-05-14King, Christopher A Esq PROPOSAL38Bernardo Dominic
1018Emily WhobreySpain2026-06-04Commercial Press RENEWAL12Ivan Magalhaes
1019Misaki RoysterIndia2026-06-04Morlong Associates PROPOSAL70Ivan Magalhaes
1020Ricardo GauchoIndia2026-05-23Commercial Press PROPOSAL92Ioni Bowcher
1021Kadeem FlosiSpain2026-05-26Commercial Press PROPOSAL56Stephen Shaw
1022Rodrigues CampainRussia2026-05-22Chapman, Ross E Esq UNQUALIFIED85Asiya Javayant
1023James ButtRussia2026-06-05Truhlar And Truhlar Attys PROPOSAL68Ivan Magalhaes
1024Leon OldroydSpain2026-05-27Rousseaux, Michael Esq NEGOTIATION19Xuxue Feng
1025Rodrigues CampainAustralia2026-06-03Chapman, Ross E Esq NEW13Bernardo Dominic
1026Morrow RutaArgentina2026-06-05Chanay, Jeffrey A Esq NEGOTIATION68Asiya Javayant
1027James ButtJapan2026-05-31Rousseaux, Michael Esq UNQUALIFIED74Elwin Sharvill
1028Clifford RimCanada2026-05-23King, Christopher A Esq QUALIFIED0Bernardo Dominic
1029Faith GillianAustralia2026-05-17Printing Dimensions NEW54Bernardo Dominic
1030Jennifer AmigonGermany2026-06-07King, Christopher A Esq QUALIFIED9Xuxue Feng
1031Francesco ShinkoArgentina2026-05-31Chapman, Ross E Esq RENEWAL75Elwin Sharvill
1032Sinclair WaycottUnited Kingdom2026-06-07Chemel, James L Cpa QUALIFIED50Ivan Magalhaes
1033Emily WhobreyRussia2026-05-21Rangoni Of Florence RENEWAL15Amy Elsner
1034Jeanfrancois VenereBrazil2026-05-24Morlong Associates PROPOSAL33Bernardo Dominic
1035Smith GlickItaly2026-06-07Chapman, Ross E Esq RENEWAL10Bernardo Dominic
1036Ashley DoeBrazil2026-05-28Commercial Press RENEWAL91Onyama Limba
1037Jennifer AmigonJapan2026-06-08Feiner Bros QUALIFIED15Ioni Bowcher
1038Kaitlin OstroskyIndia2026-05-30Benton, John B Jr UNQUALIFIED75Stephen Shaw
1039James ButtJapan2026-05-24Rousseaux, Michael Esq NEW58Asiya Javayant
1040Octavia MaletCanada2026-05-30Chemel, James L Cpa PROPOSAL80Xuxue Feng
1041Clifford RimCanada2026-06-09Truhlar And Truhlar Attys NEGOTIATION73Bernardo Dominic
1042Sinclair WaycottGermany2026-06-09King, Christopher A Esq PROPOSAL96Anna Fali
1043Antonio CaudyUnited Kingdom2026-05-23Feltz Printing Service NEW32Xuxue Feng
1044Aruna FigeroaItaly2026-05-15Truhlar And Truhlar Attys NEW44Asiya Javayant
1045Nicolas IturbideIndia2026-06-04Buckley Miller Wright UNQUALIFIED20Bernardo Dominic
1046Octavia MaletCanada2026-05-13Chapman, Ross E Esq RENEWAL37Anna Fali
1047Morrow RutaSpain2026-06-02Benton, John B Jr NEGOTIATION79Onyama Limba
1048Ashley DoeCanada2026-05-15Commercial Press PROPOSAL53Stephen Shaw
1049Emily WhobreyIndia2026-05-14Commercial Press RENEWAL54Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Tony FollerJapanAmy Elsner PROPOSAL
Leja CaldareraCanadaAsiya Javayant RENEWAL
Ricardo GauchoFranceOnyama Limba QUALIFIED
Deepesh ChuiJapanAnna Fali UNQUALIFIED
Rodrigues CampainIndiaElwin Sharvill QUALIFIED
Leon OldroydBrazilIvan Magalhaes NEW
Jeanfrancois VenereBrazilIoni Bowcher UNQUALIFIED
Munro FerenczGermanyAmy Elsner UNQUALIFIED
Juan WieserUnited KingdomStephen Shaw NEW
Aika InouyeBrazilElwin Sharvill NEW
Aika InouyeFranceXuxue Feng NEW
James ButtJapanStephen Shaw PROPOSAL
Wickens NestleItalyStephen Shaw RENEWAL
Aruna FigeroaUnited KingdomAmy Elsner RENEWAL
Octavia MaletJapanAmy Elsner UNQUALIFIED
Tony FollerRussiaBernardo Dominic UNQUALIFIED
Wickens NestleAustraliaAmy Elsner NEW
Izzy GarufiAustraliaXuxue Feng NEGOTIATION
James ButtIndiaElwin Sharvill RENEWAL
Octavia MaletIndiaStephen Shaw RENEWAL
Mujtaba NickaAustraliaIoni Bowcher QUALIFIED
Juan WieserSpainStephen Shaw RENEWAL
Claire TollnerSpainIvan Magalhaes NEGOTIATION
Tony FollerAustraliaAsiya Javayant RENEWAL
Aika InouyeIndiaAnna Fali NEW
Jefferson SchemmerBrazilOnyama Limba PROPOSAL
Ricardo GauchoCanadaIvan Magalhaes NEGOTIATION
Ricardo GauchoAustraliaIvan Magalhaes UNQUALIFIED
Aika InouyeIndiaXuxue Feng QUALIFIED
Murillo MaletUnited KingdomIvan Magalhaes PROPOSAL
Aruna FigeroaIndiaOnyama Limba QUALIFIED
Misaki RoysterItalyElwin Sharvill QUALIFIED
Maria MarrierAustraliaStephen Shaw PROPOSAL
Stacey MacleadSpainBernardo Dominic UNQUALIFIED
Nicolas IturbideGermanyStephen Shaw RENEWAL
Ashley DoeItalyBernardo Dominic RENEWAL
Nicolas IturbideCanadaAmy Elsner QUALIFIED
Aruna FigeroaIndiaElwin Sharvill NEGOTIATION
Wickens NestleRussiaIoni Bowcher NEW
Claire TollnerRussiaBernardo Dominic PROPOSAL
Leon OldroydUnited KingdomBernardo Dominic NEW
Kaitlin OstroskyCanadaXuxue Feng RENEWAL
Deepesh ChuiCanadaIvan Magalhaes UNQUALIFIED
Aruna FigeroaFranceOnyama Limba PROPOSAL
Smith GlickItalyIoni Bowcher PROPOSAL
Faith GillianCanadaStephen Shaw NEGOTIATION
Aruna FigeroaItalyAmy Elsner UNQUALIFIED
Alejandro PerinJapanAnna Fali UNQUALIFIED
Chavez BriddickGermanyAsiya Javayant NEW
Claire TollnerJapanAsiya Javayant NEW
Frozen Columns
Name
David Darakjy
Aika Inouye
Emily Whobrey
Leja Caldarera
Aruna Figeroa
Arvin Albares
Clifford Rim
Emily Whobrey
Juan Wieser
Aika Inouye
Faith Gillian
Faith Gillian
Jones Vocelka
James Butt
Chavez Briddick
Smith Glick
Juan Wieser
Claire Tollner
Leon Oldroyd
Cody Saylors
Francesco Shinko
Julie Stenseth
Isabel Bowley
Kadeem Flosi
Kadeem Flosi
Jennifer Amigon
Izzy Garufi
Juan Wieser
Jefferson Schemmer
Clifford Rim
Jennifer Amigon
Wickens Nestle
Deepesh Chui
Jennifer Amigon
Nicolas Iturbide
David Darakjy
Wickens Nestle
Kadeem Flosi
Aika Inouye
Stacey Maclead
Chavez Briddick
Cody Saylors
Darci Poquette
Chavez Briddick
Johnson Sergi
Salvatore Stockham
Aruna Figeroa
Chavez Briddick
Maria Marrier
Emily Whobrey
IdCountryDate
1000Germany2026-06-10
1001Brazil2026-06-06
1002United Kingdom2026-05-16
1003Canada2026-05-31
1004United Kingdom2026-05-31
1005Russia2026-05-22
1006Brazil2026-05-24
1007United Kingdom2026-06-05
1008India2026-06-03
1009India2026-05-27
1010Spain2026-05-12
1011Japan2026-06-06
1012Italy2026-05-12
1013Italy2026-05-17
1014United Kingdom2026-06-04
1015France2026-05-17
1016Argentina2026-05-14
1017United Kingdom2026-06-10
1018Argentina2026-05-30
1019Brazil2026-05-18
1020France2026-05-16
1021Italy2026-05-29
1022India2026-05-16
1023Spain2026-05-14
1024Russia2026-06-02
1025Canada2026-05-19
1026United Kingdom2026-05-24
1027Russia2026-05-18
1028Japan2026-05-13
1029Australia2026-05-25
1030Russia2026-05-19
1031Argentina2026-05-14
1032Brazil2026-05-23
1033Japan2026-06-07
1034Canada2026-05-21
1035India2026-05-30
1036Japan2026-06-02
1037France2026-05-31
1038Australia2026-05-27
1039United Kingdom2026-06-01
1040Australia2026-05-30
1041United Kingdom2026-05-24
1042India2026-06-07
1043Australia2026-05-13
1044Australia2026-06-09
1045Japan2026-05-24
1046Brazil2026-05-21
1047Canada2026-05-19
1048Canada2026-05-14
1049Japan2026-05-29

On-Demand Data

NameIdCountryDate
Misaki Royster1000Russia2026-06-08
Maria Marrier1001Italy2026-05-30
Tony Foller1002India2026-05-22
Cody Saylors1003Italy2026-05-29
Munro Ferencz1004Australia2026-05-30
Jeanfrancois Venere1005Argentina2026-05-29
Costa Dilliard1006Italy2026-05-31
Jefferson Schemmer1007Spain2026-05-20
Ivar Paprocki1008Argentina2026-05-21
Munro Ferencz1009Russia2026-05-22
David Darakjy1010India2026-05-24
Ivar Paprocki1011Australia2026-05-24
Julie Stenseth1012Spain2026-05-20
Aditya Kusko1013Russia2026-05-23
Claire Tollner1014Spain2026-05-17
Greenwood Bolognia1015Australia2026-05-26
Juan Wieser1016Australia2026-05-22
Arvin Albares1017Argentina2026-05-17
Misaki Royster1018United Kingdom2026-05-17
Ivar Paprocki1019France2026-05-18
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Costa DilliardIndiaStephen Shaw NEW
Salvatore StockhamAustraliaXuxue Feng PROPOSAL
Sinclair WaycottBrazilAsiya Javayant PROPOSAL
Jennifer AmigonUnited KingdomElwin Sharvill RENEWAL
Sinclair WaycottJapanElwin Sharvill PROPOSAL
Cody SaylorsAustraliaIoni Bowcher NEGOTIATION
Johnson SergiJapanAmy Elsner NEGOTIATION
Francesco ShinkoRussiaBernardo Dominic UNQUALIFIED
Sinclair WaycottAustraliaAmy Elsner PROPOSAL
Sinclair WaycottSpainAnna Fali PROPOSAL
Jones VocelkaUnited KingdomAsiya Javayant RENEWAL
Sinclair WaycottIndiaXuxue Feng RENEWAL
Izzy GarufiJapanBernardo Dominic QUALIFIED
Cody SaylorsSpainAsiya Javayant NEW
Emily WhobreyBrazilOnyama Limba NEGOTIATION
Stacey MacleadArgentinaAnna Fali NEGOTIATION
Jennifer AmigonArgentinaAnna Fali PROPOSAL
Mujtaba NickaFranceXuxue Feng NEGOTIATION
Tony FollerUnited KingdomIvan Magalhaes QUALIFIED
Jeanfrancois VenereIndiaIoni Bowcher QUALIFIED
Emily WhobreyUnited KingdomIvan Magalhaes RENEWAL
Deepesh ChuiGermanyStephen Shaw UNQUALIFIED
Ricardo GauchoArgentinaAsiya Javayant NEW
Aruna FigeroaFranceAmy Elsner UNQUALIFIED
Cody SaylorsArgentinaAmy Elsner RENEWAL
Tony FollerGermanyAnna Fali QUALIFIED
Nicolas IturbideItalyElwin Sharvill PROPOSAL
Aruna FigeroaArgentinaElwin Sharvill PROPOSAL
Leon OldroydIndiaXuxue Feng NEW
Claire TollnerSpainOnyama Limba RENEWAL
David DarakjyGermanyOnyama Limba QUALIFIED
Clifford RimBrazilAsiya Javayant QUALIFIED
Ashley DoeJapanIvan Magalhaes QUALIFIED
Kaitlin OstroskyGermanyAmy Elsner QUALIFIED
Claire TollnerGermanyBernardo Dominic RENEWAL
Aika InouyeArgentinaIoni Bowcher PROPOSAL
Ricardo GauchoArgentinaStephen Shaw QUALIFIED
Maisha RulapaughFranceBernardo Dominic NEW
Claire TollnerSpainIoni Bowcher QUALIFIED
Darci PoquetteAustraliaOnyama Limba UNQUALIFIED

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