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
Aditya KuskoItalyXuxue Feng QUALIFIED
Adams MorascaRussiaIoni Bowcher PROPOSAL
Mayumi KolmetzJapanAmy Elsner QUALIFIED
Deepesh ChuiSpainStephen Shaw NEW
Aruna FigeroaCanadaAmy Elsner QUALIFIED
Juan WieserItalyAmy Elsner NEGOTIATION
Emily WhobreyJapanOnyama Limba RENEWAL
Aruna FigeroaAustraliaStephen Shaw PROPOSAL
Costa DilliardArgentinaXuxue Feng PROPOSAL
Morrow RutaRussiaStephen Shaw QUALIFIED
Murillo MaletJapanIoni Bowcher NEGOTIATION
Mujtaba NickaGermanyAsiya Javayant QUALIFIED
Juan WieserCanadaIvan Magalhaes NEGOTIATION
Juan WieserSpainOnyama Limba UNQUALIFIED
Cody SaylorsBrazilAnna Fali NEW
Costa DilliardArgentinaIoni Bowcher PROPOSAL
Tony FollerArgentinaIvan Magalhaes NEGOTIATION
Jennifer AmigonBrazilStephen Shaw NEW
Claire TollnerFranceAsiya Javayant NEW
Adams MorascaCanadaBernardo Dominic UNQUALIFIED
Kaitlin OstroskyFranceXuxue Feng UNQUALIFIED
Misaki RoysterBrazilIvan Magalhaes RENEWAL
Kadeem FlosiFranceOnyama Limba NEGOTIATION
Adams MorascaRussiaIoni Bowcher PROPOSAL
Alejandro PerinSpainOnyama Limba UNQUALIFIED
Emily WhobreyBrazilAnna Fali UNQUALIFIED
Izzy GarufiIndiaOnyama Limba NEGOTIATION
Darci PoquetteArgentinaIvan Magalhaes QUALIFIED
Chavez BriddickIndiaAmy Elsner RENEWAL
Costa DilliardCanadaElwin Sharvill NEGOTIATION
Misaki RoysterFranceIoni Bowcher RENEWAL
Wickens NestleFranceStephen Shaw PROPOSAL
Cody SaylorsAustraliaAnna Fali RENEWAL
Emily WhobreyFranceAmy Elsner NEGOTIATION
Greenwood BologniaArgentinaAnna Fali UNQUALIFIED
Maisha RulapaughArgentinaBernardo Dominic NEGOTIATION
Cody SaylorsRussiaIvan Magalhaes PROPOSAL
Darci PoquetteArgentinaXuxue Feng NEW
Alejandro PerinItalyXuxue Feng NEW
Salvatore StockhamUnited KingdomElwin Sharvill NEGOTIATION
Juan WieserCanadaAnna Fali QUALIFIED
Jennifer AmigonFranceIvan Magalhaes QUALIFIED
Silvio SlusarskiBrazilBernardo Dominic PROPOSAL
Munro FerenczArgentinaAmy Elsner NEW
Darci PoquetteFranceBernardo Dominic NEW
Octavia MaletUnited KingdomBernardo Dominic UNQUALIFIED
Smith GlickSpainBernardo Dominic NEW
Arvin AlbaresItalyElwin Sharvill RENEWAL
Julie StensethFranceStephen Shaw NEGOTIATION
David DarakjyBrazilAnna Fali UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Jeanfrancois VenereAustraliaXuxue Feng NEGOTIATION
Adams MorascaJapanStephen Shaw QUALIFIED
Maisha RulapaughSpainAmy Elsner NEGOTIATION
Kadeem FlosiArgentinaAmy Elsner NEGOTIATION
Deepesh ChuiFranceIoni Bowcher UNQUALIFIED
Adams MorascaIndiaElwin Sharvill NEGOTIATION
Claire TollnerArgentinaBernardo Dominic NEGOTIATION
Munro FerenczAustraliaAmy Elsner NEGOTIATION
Ricardo GauchoJapanAsiya Javayant RENEWAL
Silvio SlusarskiJapanOnyama Limba QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Faith GillianIndia2026-04-29Feiner Bros NEW67Elwin Sharvill
1001Kadeem FlosiSpain2026-04-19Rangoni Of Florence NEW61Elwin Sharvill
1002Costa DilliardCanada2026-05-08Dorl, James J Esq QUALIFIED96Ioni Bowcher
1003Octavia MaletJapan2026-05-03Morlong Associates PROPOSAL84Elwin Sharvill
1004Stacey MacleadJapan2026-04-19Chanay, Jeffrey A Esq NEGOTIATION94Stephen Shaw
1005Silvio SlusarskiArgentina2026-04-20Benton, John B Jr PROPOSAL91Ioni Bowcher
1006Isabel BowleyBrazil2026-04-22King, Christopher A Esq QUALIFIED24Anna Fali
1007Deepesh ChuiBrazil2026-04-18King, Christopher A Esq NEW70Ioni Bowcher
1008Kaitlin OstroskyCanada2026-04-29Commercial Press NEW81Amy Elsner
1009Cody SaylorsFrance2026-04-18Truhlar And Truhlar Attys NEGOTIATION48Onyama Limba
1010Deepesh ChuiJapan2026-05-06Feltz Printing Service QUALIFIED63Stephen Shaw
1011Aditya KuskoGermany2026-04-12Chemel, James L Cpa NEW24Anna Fali
1012Greenwood BologniaGermany2026-05-02Chanay, Jeffrey A Esq UNQUALIFIED44Onyama Limba
1013Kaitlin OstroskyAustralia2026-04-13Feiner Bros PROPOSAL49Anna Fali
1014Alejandro PerinRussia2026-05-05Printing Dimensions NEGOTIATION91Stephen Shaw
1015Maisha RulapaughJapan2026-04-19Benton, John B Jr NEGOTIATION57Elwin Sharvill
1016Maisha RulapaughSpain2026-04-24Benton, John B Jr NEW52Asiya Javayant
1017Silvio SlusarskiGermany2026-04-28Morlong Associates PROPOSAL45Asiya Javayant
1018Faith GillianAustralia2026-05-08Chemel, James L Cpa QUALIFIED40Bernardo Dominic
1019Juan WieserFrance2026-04-11Chanay, Jeffrey A Esq RENEWAL73Ioni Bowcher
1020Leja CaldareraArgentina2026-05-05Feltz Printing Service NEW51Stephen Shaw
1021Jones VocelkaFrance2026-04-13Feiner Bros QUALIFIED61Asiya Javayant
1022Johnson SergiBrazil2026-04-17Dorl, James J Esq RENEWAL41Bernardo Dominic
1023Jones VocelkaGermany2026-04-13Truhlar And Truhlar Attys NEW33Stephen Shaw
1024Costa DilliardBrazil2026-04-23Rangoni Of Florence NEGOTIATION47Bernardo Dominic
1025Antonio CaudyIndia2026-05-04Chemel, James L Cpa UNQUALIFIED48Stephen Shaw
1026David DarakjyRussia2026-05-02Dorl, James J Esq PROPOSAL11Bernardo Dominic
1027Tony FollerRussia2026-05-01Truhlar And Truhlar Attys NEW92Ivan Magalhaes
1028Claire TollnerRussia2026-04-23Printing Dimensions NEW12Ivan Magalhaes
1029Nicolas IturbideCanada2026-05-08Buckley Miller Wright QUALIFIED78Anna Fali
1030Greenwood BologniaFrance2026-04-22Rousseaux, Michael Esq PROPOSAL21Xuxue Feng
1031Octavia MaletJapan2026-04-12Buckley Miller Wright NEGOTIATION28Onyama Limba
1032Chavez BriddickAustralia2026-04-13Chemel, James L Cpa NEGOTIATION49Anna Fali
1033Maria MarrierBrazil2026-04-22Chemel, James L Cpa UNQUALIFIED17Xuxue Feng
1034James ButtIndia2026-04-21Morlong Associates NEW41Bernardo Dominic
1035Munro FerenczSpain2026-04-14Commercial Press QUALIFIED46Ioni Bowcher
1036Alejandro PerinArgentina2026-04-27Rangoni Of Florence NEGOTIATION25Amy Elsner
1037Isabel BowleyBrazil2026-04-23King, Christopher A Esq NEGOTIATION44Anna Fali
1038Greenwood BologniaRussia2026-04-13Rangoni Of Florence NEW95Elwin Sharvill
1039David DarakjyUnited Kingdom2026-04-29Printing Dimensions UNQUALIFIED65Amy Elsner
1040Darci PoquetteArgentina2026-04-15Feiner Bros RENEWAL56Onyama Limba
1041Faith GillianAustralia2026-05-09Chemel, James L Cpa NEW29Elwin Sharvill
1042Ricardo GauchoCanada2026-04-15Feltz Printing Service PROPOSAL94Asiya Javayant
1043Kaitlin OstroskySpain2026-05-09Commercial Press PROPOSAL98Elwin Sharvill
1044Jennifer AmigonRussia2026-05-06Dorl, James J Esq RENEWAL16Asiya Javayant
1045Izzy GarufiRussia2026-04-23Rangoni Of Florence UNQUALIFIED76Ivan Magalhaes
1046Munro FerenczBrazil2026-04-10Feiner Bros UNQUALIFIED45Bernardo Dominic
1047Clifford RimFrance2026-04-25Truhlar And Truhlar Attys NEW19Bernardo Dominic
1048Silvio SlusarskiJapan2026-04-12Rousseaux, Michael Esq NEGOTIATION10Bernardo Dominic
1049Adams MorascaUnited Kingdom2026-04-19Feiner Bros UNQUALIFIED46Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Deepesh ChuiArgentinaIoni Bowcher PROPOSAL
Jennifer AmigonArgentinaOnyama Limba NEGOTIATION
Claire TollnerArgentinaAmy Elsner QUALIFIED
Leja CaldareraIndiaOnyama Limba NEW
Tony FollerArgentinaAnna Fali NEW
Jones VocelkaCanadaStephen Shaw RENEWAL
Nicolas IturbideRussiaBernardo Dominic NEGOTIATION
Chavez BriddickCanadaAsiya Javayant PROPOSAL
Ashley DoeAustraliaOnyama Limba NEGOTIATION
Costa DilliardFranceXuxue Feng UNQUALIFIED
Murillo MaletItalyXuxue Feng NEGOTIATION
Ashley DoeRussiaBernardo Dominic PROPOSAL
Leon OldroydArgentinaAnna Fali UNQUALIFIED
Cody SaylorsBrazilAnna Fali RENEWAL
Jefferson SchemmerCanadaIoni Bowcher RENEWAL
Arvin AlbaresItalyBernardo Dominic UNQUALIFIED
Adams MorascaFranceIoni Bowcher UNQUALIFIED
David DarakjyAustraliaStephen Shaw QUALIFIED
Sinclair WaycottIndiaElwin Sharvill NEGOTIATION
Jefferson SchemmerAustraliaStephen Shaw UNQUALIFIED
Nicolas IturbideSpainXuxue Feng NEW
James ButtJapanBernardo Dominic QUALIFIED
Greenwood BologniaCanadaElwin Sharvill NEGOTIATION
Mujtaba NickaRussiaIvan Magalhaes QUALIFIED
Maisha RulapaughRussiaXuxue Feng PROPOSAL
Izzy GarufiBrazilOnyama Limba UNQUALIFIED
Kadeem FlosiRussiaAnna Fali NEW
Greenwood BologniaItalyAsiya Javayant UNQUALIFIED
Jones VocelkaRussiaXuxue Feng QUALIFIED
Misaki RoysterRussiaElwin Sharvill PROPOSAL
Jeanfrancois VenereFranceXuxue Feng UNQUALIFIED
Clifford RimItalyBernardo Dominic NEGOTIATION
Mujtaba NickaGermanyIoni Bowcher RENEWAL
Emily WhobreyRussiaOnyama Limba NEGOTIATION
Kadeem FlosiRussiaIvan Magalhaes NEGOTIATION
Deepesh ChuiBrazilOnyama Limba NEGOTIATION
Leon OldroydJapanAnna Fali RENEWAL
Chavez BriddickBrazilIoni Bowcher NEGOTIATION
Murillo MaletJapanOnyama Limba PROPOSAL
Kaitlin OstroskyItalyOnyama Limba NEGOTIATION
Francesco ShinkoIndiaIvan Magalhaes QUALIFIED
Antonio CaudyIndiaStephen Shaw QUALIFIED
Jeanfrancois VenereGermanyIvan Magalhaes NEGOTIATION
Munro FerenczArgentinaAsiya Javayant NEW
Jennifer AmigonIndiaIoni Bowcher PROPOSAL
Aditya KuskoArgentinaStephen Shaw UNQUALIFIED
Arvin AlbaresFranceXuxue Feng NEW
Leja CaldareraGermanyBernardo Dominic NEGOTIATION
Isabel BowleyAustraliaAsiya Javayant NEGOTIATION
Clifford RimSpainAsiya Javayant NEGOTIATION
Frozen Columns
Name
Leon Oldroyd
Smith Glick
Greenwood Bolognia
Munro Ferencz
Ricardo Gaucho
Leja Caldarera
Costa Dilliard
Tony Foller
Stacey Maclead
Maisha Rulapaugh
Ashley Doe
Jennifer Amigon
Faith Gillian
David Darakjy
Octavia Malet
Sinclair Waycott
Francesco Shinko
Johnson Sergi
Izzy Garufi
Misaki Royster
Cody Saylors
Jones Vocelka
Adams Morasca
Claire Tollner
Maria Marrier
Aruna Figeroa
Munro Ferencz
Rodrigues Campain
Munro Ferencz
Leja Caldarera
Leja Caldarera
Emily Whobrey
Tony Foller
Maisha Rulapaugh
Aika Inouye
Francesco Shinko
Aditya Kusko
Murillo Malet
Ashley Doe
Emily Whobrey
Octavia Malet
Salvatore Stockham
Faith Gillian
Tony Foller
Ricardo Gaucho
Julie Stenseth
Aditya Kusko
Claire Tollner
Chavez Briddick
Juan Wieser
IdCountryDate
1000India2026-05-04
1001Italy2026-04-14
1002Russia2026-04-13
1003India2026-05-07
1004India2026-05-05
1005Australia2026-04-10
1006United Kingdom2026-04-28
1007Spain2026-04-11
1008Russia2026-04-16
1009Japan2026-04-12
1010Australia2026-04-20
1011India2026-04-21
1012Canada2026-05-08
1013Russia2026-04-26
1014Italy2026-04-20
1015Argentina2026-04-23
1016Spain2026-04-23
1017Australia2026-04-22
1018Canada2026-04-28
1019Germany2026-04-29
1020Spain2026-04-27
1021India2026-04-17
1022Russia2026-04-28
1023Australia2026-05-02
1024Germany2026-04-11
1025Germany2026-05-05
1026Spain2026-04-15
1027Spain2026-04-30
1028United Kingdom2026-04-16
1029France2026-04-15
1030Germany2026-05-05
1031Japan2026-05-09
1032Australia2026-04-29
1033Japan2026-04-15
1034France2026-04-18
1035Germany2026-04-10
1036Italy2026-05-06
1037Australia2026-04-13
1038Japan2026-05-09
1039Canada2026-04-22
1040Germany2026-04-18
1041Germany2026-04-19
1042Canada2026-05-09
1043Japan2026-04-28
1044Germany2026-04-30
1045Spain2026-04-16
1046France2026-04-29
1047Japan2026-04-18
1048Australia2026-04-23
1049Germany2026-05-02

On-Demand Data

NameIdCountryDate
Maisha Rulapaugh1000Brazil2026-04-29
Deepesh Chui1001Spain2026-05-05
Munro Ferencz1002Canada2026-04-27
Emily Whobrey1003Argentina2026-05-01
Ivar Paprocki1004Spain2026-04-21
Arvin Albares1005United Kingdom2026-05-03
Ricardo Gaucho1006Argentina2026-05-09
Aruna Figeroa1007Germany2026-05-06
Greenwood Bolognia1008Russia2026-04-16
Mujtaba Nicka1009Canada2026-04-13
Aditya Kusko1010Russia2026-04-19
Greenwood Bolognia1011France2026-04-15
Smith Glick1012United Kingdom2026-04-21
James Butt1013Italy2026-04-14
Tony Foller1014France2026-05-09
Morrow Ruta1015France2026-04-19
Deepesh Chui1016Japan2026-04-22
Octavia Malet1017Russia2026-05-06
Murillo Malet1018Australia2026-04-10
Aika Inouye1019United Kingdom2026-05-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Greenwood BologniaBrazilXuxue Feng NEGOTIATION
Chavez BriddickArgentinaStephen Shaw NEGOTIATION
Ashley DoeGermanyXuxue Feng RENEWAL
Mayumi KolmetzSpainOnyama Limba NEGOTIATION
Mujtaba NickaRussiaAnna Fali NEGOTIATION
Isabel BowleyArgentinaBernardo Dominic PROPOSAL
David DarakjyFranceElwin Sharvill QUALIFIED
Aruna FigeroaBrazilStephen Shaw NEW
Rodrigues CampainBrazilAsiya Javayant UNQUALIFIED
Deepesh ChuiUnited KingdomIvan Magalhaes UNQUALIFIED
Adams MorascaAustraliaAsiya Javayant NEW
Ashley DoeBrazilBernardo Dominic PROPOSAL
Greenwood BologniaCanadaOnyama Limba RENEWAL
Kaitlin OstroskySpainBernardo Dominic NEW
Claire TollnerIndiaIoni Bowcher NEGOTIATION
Octavia MaletFranceXuxue Feng RENEWAL
Sinclair WaycottGermanyElwin Sharvill NEGOTIATION
Emily WhobreyFranceAmy Elsner NEGOTIATION
Francesco ShinkoCanadaBernardo Dominic NEW
Leja CaldareraArgentinaIvan Magalhaes NEGOTIATION
Morrow RutaRussiaIvan Magalhaes NEW
Sinclair WaycottRussiaBernardo Dominic NEW
Julie StensethFranceElwin Sharvill NEGOTIATION
Rodrigues CampainArgentinaStephen Shaw PROPOSAL
Misaki RoysterArgentinaXuxue Feng QUALIFIED
Stacey MacleadSpainAmy Elsner QUALIFIED
Alejandro PerinAustraliaAnna Fali RENEWAL
David DarakjyAustraliaElwin Sharvill RENEWAL
Emily WhobreyCanadaOnyama Limba NEGOTIATION
Deepesh ChuiItalyAmy Elsner NEW
Darci PoquetteAustraliaOnyama Limba RENEWAL
Murillo MaletGermanyAsiya Javayant QUALIFIED
Johnson SergiAustraliaAnna Fali RENEWAL
James ButtAustraliaBernardo Dominic UNQUALIFIED
Silvio SlusarskiSpainStephen Shaw RENEWAL
Claire TollnerIndiaBernardo Dominic UNQUALIFIED
Faith GillianFranceXuxue Feng PROPOSAL
Silvio SlusarskiUnited KingdomStephen Shaw NEGOTIATION
Aditya KuskoSpainStephen Shaw NEGOTIATION
Tony FollerBrazilIvan Magalhaes 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>