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
Emily WhobreyJapanElwin Sharvill RENEWAL
Nicolas IturbideUnited KingdomAnna Fali QUALIFIED
Greenwood BologniaAustraliaOnyama Limba RENEWAL
Ashley DoeArgentinaIvan Magalhaes PROPOSAL
Jones VocelkaUnited KingdomIoni Bowcher NEW
David DarakjyJapanOnyama Limba PROPOSAL
Maria MarrierItalyBernardo Dominic PROPOSAL
Kadeem FlosiItalyXuxue Feng UNQUALIFIED
Salvatore StockhamRussiaXuxue Feng UNQUALIFIED
Jennifer AmigonGermanyAmy Elsner QUALIFIED
Jefferson SchemmerItalyIvan Magalhaes NEW
Ashley DoeJapanOnyama Limba UNQUALIFIED
Costa DilliardFranceElwin Sharvill QUALIFIED
James ButtAustraliaAsiya Javayant UNQUALIFIED
Aika InouyeJapanXuxue Feng NEGOTIATION
Mujtaba NickaRussiaAsiya Javayant NEGOTIATION
Sinclair WaycottJapanAmy Elsner RENEWAL
Leja CaldareraSpainIvan Magalhaes UNQUALIFIED
Tony FollerGermanyOnyama Limba PROPOSAL
Johnson SergiArgentinaAnna Fali QUALIFIED
Munro FerenczAustraliaStephen Shaw NEW
Leon OldroydJapanStephen Shaw NEGOTIATION
Arvin AlbaresJapanAmy Elsner PROPOSAL
Mayumi KolmetzSpainXuxue Feng UNQUALIFIED
Emily WhobreyAustraliaOnyama Limba RENEWAL
David DarakjyItalyElwin Sharvill QUALIFIED
Tony FollerSpainStephen Shaw NEGOTIATION
Clifford RimAustraliaIoni Bowcher PROPOSAL
Aditya KuskoFranceOnyama Limba RENEWAL
Ivar PaprockiJapanOnyama Limba PROPOSAL
Aditya KuskoCanadaStephen Shaw NEW
Misaki RoysterJapanXuxue Feng NEW
Arvin AlbaresSpainOnyama Limba PROPOSAL
Ricardo GauchoIndiaBernardo Dominic NEGOTIATION
Jones VocelkaItalyAmy Elsner PROPOSAL
Leon OldroydBrazilElwin Sharvill NEW
Julie StensethJapanAnna Fali QUALIFIED
Clifford RimJapanElwin Sharvill NEW
Alejandro PerinFranceXuxue Feng NEGOTIATION
Juan WieserRussiaXuxue Feng PROPOSAL
Octavia MaletArgentinaElwin Sharvill NEW
Misaki RoysterFranceElwin Sharvill NEW
Jennifer AmigonItalyBernardo Dominic RENEWAL
Jeanfrancois VenereRussiaAsiya Javayant UNQUALIFIED
Jeanfrancois VenereAustraliaAsiya Javayant NEGOTIATION
James ButtJapanAnna Fali UNQUALIFIED
Darci PoquetteRussiaIvan Magalhaes RENEWAL
Jeanfrancois VenereArgentinaBernardo Dominic RENEWAL
Johnson SergiAustraliaBernardo Dominic NEGOTIATION
Ashley DoeItalyIoni Bowcher PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Mujtaba NickaCanadaAsiya Javayant PROPOSAL
Leja CaldareraIndiaAnna Fali RENEWAL
Julie StensethBrazilAsiya Javayant UNQUALIFIED
Murillo MaletFranceBernardo Dominic NEW
Julie StensethAustraliaAmy Elsner UNQUALIFIED
Leja CaldareraGermanyAnna Fali NEGOTIATION
Rodrigues CampainArgentinaOnyama Limba RENEWAL
Smith GlickFranceIvan Magalhaes QUALIFIED
Jefferson SchemmerBrazilBernardo Dominic NEW
Julie StensethArgentinaElwin Sharvill UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Octavia MaletUnited Kingdom2025-09-30Morlong Associates NEGOTIATION96Elwin Sharvill
1001Leon OldroydFrance2025-09-22Chanay, Jeffrey A Esq QUALIFIED84Bernardo Dominic
1002Leon OldroydItaly2025-09-29King, Christopher A Esq NEW71Elwin Sharvill
1003Costa DilliardBrazil2025-09-21Printing Dimensions PROPOSAL71Ioni Bowcher
1004Maria MarrierArgentina2025-09-13Chemel, James L Cpa NEW56Stephen Shaw
1005Francesco ShinkoArgentina2025-09-30Truhlar And Truhlar Attys NEW98Xuxue Feng
1006Salvatore StockhamArgentina2025-09-28King, Christopher A Esq NEW83Stephen Shaw
1007Ricardo GauchoUnited Kingdom2025-10-07King, Christopher A Esq NEGOTIATION52Onyama Limba
1008Kadeem FlosiJapan2025-09-18Printing Dimensions NEW17Bernardo Dominic
1009Ashley DoeGermany2025-10-02Feltz Printing Service RENEWAL68Onyama Limba
1010Julie StensethSpain2025-09-24Chanay, Jeffrey A Esq UNQUALIFIED26Bernardo Dominic
1011Misaki RoysterAustralia2025-09-13Buckley Miller Wright NEW6Elwin Sharvill
1012Isabel BowleyAustralia2025-09-28King, Christopher A Esq NEW7Asiya Javayant
1013Ashley DoeItaly2025-09-14Truhlar And Truhlar Attys PROPOSAL8Stephen Shaw
1014Jennifer AmigonAustralia2025-09-13Truhlar And Truhlar Attys NEW62Elwin Sharvill
1015Emily WhobreyIndia2025-09-22Benton, John B Jr RENEWAL60Ioni Bowcher
1016Maisha RulapaughAustralia2025-09-28Commercial Press NEGOTIATION65Bernardo Dominic
1017David DarakjyBrazil2025-09-28Printing Dimensions NEGOTIATION21Stephen Shaw
1018Jefferson SchemmerSpain2025-09-15King, Christopher A Esq RENEWAL4Elwin Sharvill
1019Francesco ShinkoSpain2025-10-04Chanay, Jeffrey A Esq RENEWAL74Asiya Javayant
1020Kadeem FlosiRussia2025-10-02Printing Dimensions UNQUALIFIED55Asiya Javayant
1021Leon OldroydCanada2025-09-14Printing Dimensions NEW23Ioni Bowcher
1022Francesco ShinkoBrazil2025-10-03King, Christopher A Esq UNQUALIFIED44Asiya Javayant
1023Maisha RulapaughBrazil2025-09-18Benton, John B Jr NEGOTIATION67Ioni Bowcher
1024Kadeem FlosiAustralia2025-09-14Feltz Printing Service NEGOTIATION6Stephen Shaw
1025Munro FerenczBrazil2025-10-01Buckley Miller Wright NEGOTIATION6Bernardo Dominic
1026Leon OldroydSpain2025-09-21Benton, John B Jr UNQUALIFIED45Ivan Magalhaes
1027James ButtGermany2025-09-28Feiner Bros NEW11Ivan Magalhaes
1028Arvin AlbaresSpain2025-09-26Rangoni Of Florence NEGOTIATION14Ioni Bowcher
1029Deepesh ChuiCanada2025-09-23Buckley Miller Wright PROPOSAL40Anna Fali
1030Deepesh ChuiIndia2025-10-01King, Christopher A Esq NEGOTIATION12Xuxue Feng
1031Aruna FigeroaAustralia2025-09-30Feiner Bros RENEWAL82Onyama Limba
1032Tony FollerItaly2025-10-07Chanay, Jeffrey A Esq UNQUALIFIED95Elwin Sharvill
1033Kadeem FlosiUnited Kingdom2025-09-10Commercial Press NEW45Anna Fali
1034Greenwood BologniaArgentina2025-10-02Chemel, James L Cpa RENEWAL19Ivan Magalhaes
1035Ashley DoeUnited Kingdom2025-10-02Chemel, James L Cpa NEW29Stephen Shaw
1036Jennifer AmigonSpain2025-09-18Chapman, Ross E Esq NEGOTIATION59Ioni Bowcher
1037Nicolas IturbideGermany2025-09-24Dorl, James J Esq NEGOTIATION11Elwin Sharvill
1038Mujtaba NickaBrazil2025-09-19Dorl, James J Esq QUALIFIED19Amy Elsner
1039Jones VocelkaUnited Kingdom2025-09-18Chapman, Ross E Esq UNQUALIFIED84Ioni Bowcher
1040Deepesh ChuiIndia2025-09-23Chemel, James L Cpa NEGOTIATION20Asiya Javayant
1041Antonio CaudyIndia2025-09-11Morlong Associates NEGOTIATION82Stephen Shaw
1042Wickens NestleArgentina2025-09-20Dorl, James J Esq RENEWAL75Elwin Sharvill
1043Darci PoquetteFrance2025-09-27Rousseaux, Michael Esq NEW80Elwin Sharvill
1044Rodrigues CampainRussia2025-09-24Truhlar And Truhlar Attys UNQUALIFIED57Anna Fali
1045Greenwood BologniaFrance2025-09-10Printing Dimensions NEW63Asiya Javayant
1046Costa DilliardRussia2025-10-04Printing Dimensions UNQUALIFIED59Xuxue Feng
1047Faith GillianCanada2025-09-28Printing Dimensions RENEWAL98Stephen Shaw
1048Aruna FigeroaCanada2025-10-05Chanay, Jeffrey A Esq NEW1Elwin Sharvill
1049Smith GlickItaly2025-09-25Rangoni Of Florence RENEWAL65Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Aruna FigeroaFranceIoni Bowcher PROPOSAL
Maria MarrierUnited KingdomElwin Sharvill PROPOSAL
Aika InouyeJapanElwin Sharvill PROPOSAL
Deepesh ChuiCanadaAmy Elsner PROPOSAL
Rodrigues CampainAustraliaStephen Shaw NEW
Kadeem FlosiIndiaOnyama Limba UNQUALIFIED
Julie StensethRussiaStephen Shaw UNQUALIFIED
Jones VocelkaIndiaAmy Elsner RENEWAL
Mayumi KolmetzJapanElwin Sharvill RENEWAL
Jones VocelkaJapanOnyama Limba UNQUALIFIED
Misaki RoysterItalyStephen Shaw NEW
Leja CaldareraGermanyStephen Shaw PROPOSAL
Arvin AlbaresSpainIoni Bowcher NEW
Costa DilliardUnited KingdomBernardo Dominic PROPOSAL
Arvin AlbaresGermanyAsiya Javayant NEW
Nicolas IturbideIndiaBernardo Dominic NEW
Johnson SergiGermanyAnna Fali NEGOTIATION
Arvin AlbaresCanadaIvan Magalhaes QUALIFIED
Wickens NestleAustraliaIvan Magalhaes NEW
Faith GillianFranceAsiya Javayant NEGOTIATION
Aditya KuskoJapanStephen Shaw QUALIFIED
Stacey MacleadGermanyAsiya Javayant NEW
Maria MarrierGermanyElwin Sharvill RENEWAL
Adams MorascaBrazilElwin Sharvill QUALIFIED
Greenwood BologniaAustraliaStephen Shaw UNQUALIFIED
Tony FollerIndiaAsiya Javayant PROPOSAL
Julie StensethAustraliaStephen Shaw NEGOTIATION
Izzy GarufiJapanXuxue Feng PROPOSAL
Deepesh ChuiAustraliaBernardo Dominic NEGOTIATION
Sinclair WaycottItalyIoni Bowcher PROPOSAL
Julie StensethAustraliaAnna Fali RENEWAL
Johnson SergiBrazilAnna Fali PROPOSAL
Julie StensethAustraliaIvan Magalhaes UNQUALIFIED
Claire TollnerItalyXuxue Feng QUALIFIED
Clifford RimUnited KingdomIvan Magalhaes NEGOTIATION
Salvatore StockhamIndiaAmy Elsner PROPOSAL
Aruna FigeroaJapanOnyama Limba QUALIFIED
Smith GlickGermanyXuxue Feng NEGOTIATION
Arvin AlbaresRussiaAsiya Javayant PROPOSAL
Jones VocelkaArgentinaAnna Fali UNQUALIFIED
Sinclair WaycottCanadaXuxue Feng NEW
Octavia MaletFranceElwin Sharvill NEGOTIATION
Chavez BriddickBrazilAnna Fali NEW
David DarakjyArgentinaStephen Shaw NEW
Adams MorascaSpainIvan Magalhaes RENEWAL
Leon OldroydFranceAmy Elsner NEW
Jefferson SchemmerJapanAsiya Javayant NEW
Tony FollerCanadaStephen Shaw PROPOSAL
Misaki RoysterIndiaOnyama Limba RENEWAL
Francesco ShinkoCanadaIoni Bowcher QUALIFIED
Frozen Columns
Name
Sinclair Waycott
Kadeem Flosi
Ashley Doe
Chavez Briddick
Cody Saylors
Jeanfrancois Venere
Octavia Malet
Misaki Royster
Ashley Doe
Morrow Ruta
Ivar Paprocki
Greenwood Bolognia
Darci Poquette
Cody Saylors
Misaki Royster
Antonio Caudy
Aditya Kusko
Rodrigues Campain
Alejandro Perin
Munro Ferencz
Aruna Figeroa
Emily Whobrey
Mayumi Kolmetz
Aruna Figeroa
Clifford Rim
Leja Caldarera
Stacey Maclead
Misaki Royster
Mayumi Kolmetz
Greenwood Bolognia
Leja Caldarera
Murillo Malet
Maria Marrier
Juan Wieser
Leja Caldarera
Mujtaba Nicka
Jefferson Schemmer
Morrow Ruta
Leon Oldroyd
Arvin Albares
Aika Inouye
Jeanfrancois Venere
Jennifer Amigon
Maria Marrier
Jones Vocelka
Sinclair Waycott
Emily Whobrey
Kadeem Flosi
Ricardo Gaucho
Jefferson Schemmer
IdCountryDate
1000Argentina2025-09-08
1001Russia2025-09-20
1002Argentina2025-09-19
1003India2025-09-30
1004Australia2025-09-16
1005Russia2025-10-03
1006Russia2025-09-20
1007Argentina2025-09-13
1008Brazil2025-09-20
1009Canada2025-10-04
1010Italy2025-10-07
1011France2025-10-03
1012Italy2025-09-25
1013Canada2025-09-29
1014Brazil2025-09-23
1015France2025-09-26
1016India2025-09-14
1017India2025-09-09
1018United Kingdom2025-09-11
1019France2025-09-21
1020Australia2025-09-19
1021United Kingdom2025-09-14
1022Brazil2025-09-12
1023United Kingdom2025-09-23
1024France2025-09-21
1025Germany2025-09-24
1026Germany2025-09-17
1027Spain2025-09-12
1028Japan2025-09-14
1029United Kingdom2025-09-16
1030Brazil2025-09-09
1031Canada2025-09-24
1032Russia2025-09-22
1033Canada2025-09-11
1034Japan2025-10-07
1035Japan2025-09-18
1036Australia2025-09-24
1037Russia2025-09-12
1038India2025-09-17
1039Italy2025-10-03
1040Canada2025-09-23
1041Argentina2025-10-02
1042Brazil2025-09-13
1043France2025-09-13
1044Australia2025-10-06
1045India2025-10-04
1046Russia2025-09-30
1047Germany2025-09-10
1048Australia2025-09-21
1049India2025-10-02

On-Demand Data

NameIdCountryDate
Silvio Slusarski1000United Kingdom2025-09-21
Clifford Rim1001India2025-10-03
Julie Stenseth1002United Kingdom2025-09-25
Sinclair Waycott1003Spain2025-09-14
Tony Foller1004Japan2025-09-15
Darci Poquette1005Canada2025-09-28
Cody Saylors1006Argentina2025-09-08
Nicolas Iturbide1007Argentina2025-09-19
James Butt1008United Kingdom2025-09-14
Adams Morasca1009Argentina2025-09-15
Aika Inouye1010United Kingdom2025-09-19
Juan Wieser1011United Kingdom2025-09-24
Jones Vocelka1012Spain2025-09-25
Jeanfrancois Venere1013Germany2025-09-19
Kaitlin Ostrosky1014Japan2025-09-22
Ashley Doe1015Canada2025-09-12
Emily Whobrey1016Spain2025-09-25
Kaitlin Ostrosky1017Australia2025-09-27
Darci Poquette1018Germany2025-10-01
Tony Foller1019Canada2025-09-27
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Arvin AlbaresGermanyXuxue Feng NEGOTIATION
Aika InouyeArgentinaBernardo Dominic NEW
Murillo MaletCanadaElwin Sharvill RENEWAL
Leja CaldareraArgentinaAmy Elsner PROPOSAL
Maisha RulapaughFranceElwin Sharvill NEGOTIATION
Morrow RutaFranceIoni Bowcher UNQUALIFIED
Kadeem FlosiCanadaAnna Fali QUALIFIED
Jones VocelkaSpainAmy Elsner PROPOSAL
Murillo MaletGermanyBernardo Dominic UNQUALIFIED
Greenwood BologniaFranceElwin Sharvill UNQUALIFIED
Leon OldroydGermanyBernardo Dominic NEW
Greenwood BologniaBrazilAnna Fali PROPOSAL
Sinclair WaycottItalyIvan Magalhaes QUALIFIED
Misaki RoysterItalyOnyama Limba UNQUALIFIED
Johnson SergiUnited KingdomIvan Magalhaes QUALIFIED
Octavia MaletCanadaIoni Bowcher RENEWAL
Emily WhobreyJapanIvan Magalhaes UNQUALIFIED
David DarakjyAustraliaAsiya Javayant QUALIFIED
Deepesh ChuiCanadaAmy Elsner PROPOSAL
Mayumi KolmetzBrazilBernardo Dominic UNQUALIFIED
Aruna FigeroaRussiaBernardo Dominic RENEWAL
Smith GlickRussiaStephen Shaw QUALIFIED
Jones VocelkaItalyIoni Bowcher QUALIFIED
Chavez BriddickArgentinaIoni Bowcher PROPOSAL
Darci PoquetteJapanStephen Shaw QUALIFIED
Silvio SlusarskiSpainAsiya Javayant QUALIFIED
Nicolas IturbideCanadaAmy Elsner NEGOTIATION
Alejandro PerinCanadaElwin Sharvill NEGOTIATION
Adams MorascaIndiaAnna Fali UNQUALIFIED
Deepesh ChuiUnited KingdomAsiya Javayant PROPOSAL
Octavia MaletSpainIoni Bowcher NEGOTIATION
Adams MorascaGermanyIvan Magalhaes RENEWAL
Cody SaylorsBrazilIoni Bowcher RENEWAL
Alejandro PerinFranceAmy Elsner RENEWAL
Juan WieserGermanyAsiya Javayant RENEWAL
Greenwood BologniaFranceAsiya Javayant UNQUALIFIED
Munro FerenczSpainIvan Magalhaes RENEWAL
Aika InouyeBrazilAsiya Javayant UNQUALIFIED
Jeanfrancois VenereGermanyAmy Elsner RENEWAL
Emily WhobreyBrazilStephen Shaw QUALIFIED

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