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
Chavez BriddickItalyAnna Fali QUALIFIED
Emily WhobreyUnited KingdomIvan Magalhaes NEGOTIATION
Jones VocelkaRussiaBernardo Dominic NEGOTIATION
Izzy GarufiFranceOnyama Limba NEGOTIATION
Stacey MacleadUnited KingdomElwin Sharvill NEW
Rodrigues CampainAustraliaElwin Sharvill QUALIFIED
David DarakjySpainElwin Sharvill PROPOSAL
Ivar PaprockiGermanyBernardo Dominic UNQUALIFIED
James ButtIndiaStephen Shaw NEW
Cody SaylorsAustraliaAsiya Javayant NEGOTIATION
Jeanfrancois VenereCanadaIvan Magalhaes QUALIFIED
Clifford RimCanadaStephen Shaw QUALIFIED
Adams MorascaSpainBernardo Dominic QUALIFIED
Leja CaldareraSpainOnyama Limba NEGOTIATION
Arvin AlbaresItalyElwin Sharvill NEGOTIATION
Wickens NestleItalyOnyama Limba NEW
Smith GlickJapanAnna Fali RENEWAL
Jeanfrancois VenereJapanBernardo Dominic QUALIFIED
Faith GillianIndiaOnyama Limba UNQUALIFIED
Murillo MaletArgentinaAsiya Javayant UNQUALIFIED
Leon OldroydUnited KingdomIoni Bowcher RENEWAL
Isabel BowleyIndiaXuxue Feng QUALIFIED
Jefferson SchemmerItalyStephen Shaw QUALIFIED
Misaki RoysterItalyElwin Sharvill NEGOTIATION
Sinclair WaycottAustraliaIvan Magalhaes RENEWAL
Deepesh ChuiCanadaIoni Bowcher NEGOTIATION
Stacey MacleadArgentinaOnyama Limba NEGOTIATION
Jeanfrancois VenereItalyAnna Fali PROPOSAL
Maisha RulapaughIndiaXuxue Feng NEW
Antonio CaudyItalyIvan Magalhaes RENEWAL
Darci PoquetteRussiaXuxue Feng QUALIFIED
Costa DilliardBrazilAsiya Javayant RENEWAL
Silvio SlusarskiUnited KingdomAsiya Javayant QUALIFIED
James ButtAustraliaOnyama Limba PROPOSAL
Juan WieserUnited KingdomXuxue Feng NEW
Arvin AlbaresUnited KingdomAsiya Javayant PROPOSAL
Francesco ShinkoAustraliaOnyama Limba UNQUALIFIED
Alejandro PerinJapanOnyama Limba QUALIFIED
Aika InouyeItalyElwin Sharvill NEGOTIATION
Sinclair WaycottAustraliaIoni Bowcher UNQUALIFIED
Ashley DoeCanadaAmy Elsner NEGOTIATION
Wickens NestleItalyAsiya Javayant RENEWAL
Maisha RulapaughAustraliaXuxue Feng NEGOTIATION
Ashley DoeJapanAmy Elsner NEGOTIATION
Silvio SlusarskiAustraliaAnna Fali QUALIFIED
Mayumi KolmetzJapanStephen Shaw UNQUALIFIED
Emily WhobreyJapanIoni Bowcher NEW
Chavez BriddickRussiaIoni Bowcher NEGOTIATION
Kadeem FlosiItalyAnna Fali PROPOSAL
Juan WieserBrazilXuxue Feng UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Isabel BowleyGermanyAnna Fali RENEWAL
Julie StensethRussiaAnna Fali UNQUALIFIED
James ButtJapanIvan Magalhaes RENEWAL
Tony FollerFranceIvan Magalhaes UNQUALIFIED
Wickens NestleItalyIoni Bowcher NEGOTIATION
James ButtGermanyElwin Sharvill PROPOSAL
Ivar PaprockiUnited KingdomIoni Bowcher NEGOTIATION
Murillo MaletJapanAsiya Javayant NEGOTIATION
Munro FerenczGermanyIvan Magalhaes RENEWAL
Sinclair WaycottCanadaStephen Shaw RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Rodrigues CampainGermany2026-05-20Chapman, Ross E Esq PROPOSAL64Asiya Javayant
1001Claire TollnerIndia2026-05-25Truhlar And Truhlar Attys RENEWAL11Elwin Sharvill
1002Francesco ShinkoRussia2026-05-05Truhlar And Truhlar Attys NEW1Ivan Magalhaes
1003Maria MarrierArgentina2026-05-14Chemel, James L Cpa RENEWAL14Ioni Bowcher
1004Cody SaylorsSpain2026-05-10Chanay, Jeffrey A Esq UNQUALIFIED99Stephen Shaw
1005Adams MorascaBrazil2026-05-08Rousseaux, Michael Esq RENEWAL51Bernardo Dominic
1006David DarakjyGermany2026-05-06Buckley Miller Wright QUALIFIED91Onyama Limba
1007Deepesh ChuiCanada2026-05-17Printing Dimensions NEW54Ivan Magalhaes
1008Costa DilliardSpain2026-05-23Feiner Bros PROPOSAL42Ivan Magalhaes
1009Arvin AlbaresRussia2026-05-18Chanay, Jeffrey A Esq QUALIFIED65Onyama Limba
1010Munro FerenczFrance2026-05-13Chapman, Ross E Esq NEGOTIATION39Asiya Javayant
1011Ashley DoeBrazil2026-05-06Feltz Printing Service PROPOSAL6Onyama Limba
1012Stacey MacleadAustralia2026-05-09Printing Dimensions QUALIFIED5Bernardo Dominic
1013Johnson SergiRussia2026-05-19Feiner Bros NEGOTIATION81Asiya Javayant
1014Clifford RimRussia2026-05-09Morlong Associates NEGOTIATION15Ivan Magalhaes
1015Smith GlickFrance2026-05-12Commercial Press RENEWAL24Amy Elsner
1016Rodrigues CampainUnited Kingdom2026-05-07Commercial Press PROPOSAL46Anna Fali
1017Maria MarrierJapan2026-05-20Commercial Press NEW90Anna Fali
1018Tony FollerItaly2026-05-18Chapman, Ross E Esq PROPOSAL46Onyama Limba
1019Izzy GarufiItaly2026-05-28Chapman, Ross E Esq RENEWAL0Anna Fali
1020Ivar PaprockiJapan2026-05-18Rousseaux, Michael Esq NEW62Anna Fali
1021Deepesh ChuiIndia2026-05-09Chapman, Ross E Esq QUALIFIED18Anna Fali
1022Jefferson SchemmerJapan2026-05-09Chapman, Ross E Esq RENEWAL94Stephen Shaw
1023Silvio SlusarskiItaly2026-05-27Chapman, Ross E Esq QUALIFIED31Elwin Sharvill
1024Aika InouyeRussia2026-05-29Morlong Associates QUALIFIED1Onyama Limba
1025Leon OldroydJapan2026-05-05Dorl, James J Esq UNQUALIFIED43Stephen Shaw
1026Mujtaba NickaJapan2026-05-25Chanay, Jeffrey A Esq NEW26Ioni Bowcher
1027Cody SaylorsCanada2026-05-10Chemel, James L Cpa PROPOSAL81Ioni Bowcher
1028Leon OldroydAustralia2026-05-28Chemel, James L Cpa NEGOTIATION53Ioni Bowcher
1029Aruna FigeroaSpain2026-05-11Truhlar And Truhlar Attys NEGOTIATION6Ioni Bowcher
1030Francesco ShinkoAustralia2026-05-08King, Christopher A Esq QUALIFIED12Asiya Javayant
1031Murillo MaletJapan2026-05-06Morlong Associates RENEWAL16Elwin Sharvill
1032Greenwood BologniaAustralia2026-05-10Commercial Press QUALIFIED54Elwin Sharvill
1033Chavez BriddickArgentina2026-05-09Feiner Bros NEGOTIATION21Ioni Bowcher
1034Octavia MaletJapan2026-05-14Dorl, James J Esq RENEWAL38Amy Elsner
1035Silvio SlusarskiBrazil2026-05-20Chanay, Jeffrey A Esq PROPOSAL60Amy Elsner
1036Darci PoquetteRussia2026-05-21Truhlar And Truhlar Attys UNQUALIFIED35Ivan Magalhaes
1037Jefferson SchemmerIndia2026-05-26Chemel, James L Cpa QUALIFIED46Elwin Sharvill
1038Stacey MacleadBrazil2026-05-14Chemel, James L Cpa RENEWAL0Elwin Sharvill
1039Aditya KuskoRussia2026-05-07King, Christopher A Esq NEW8Xuxue Feng
1040Maisha RulapaughGermany2026-05-11King, Christopher A Esq UNQUALIFIED17Ivan Magalhaes
1041Darci PoquetteBrazil2026-05-01Printing Dimensions NEW97Onyama Limba
1042Greenwood BologniaAustralia2026-05-15Benton, John B Jr RENEWAL33Stephen Shaw
1043Wickens NestleRussia2026-05-07Rangoni Of Florence NEGOTIATION0Stephen Shaw
1044Julie StensethIndia2026-05-02Benton, John B Jr PROPOSAL66Onyama Limba
1045Munro FerenczArgentina2026-05-15Dorl, James J Esq PROPOSAL25Anna Fali
1046Faith GillianSpain2026-05-05Chanay, Jeffrey A Esq RENEWAL96Ivan Magalhaes
1047Aditya KuskoUnited Kingdom2026-05-08Feiner Bros QUALIFIED46Anna Fali
1048Deepesh ChuiCanada2026-05-05Dorl, James J Esq NEW8Xuxue Feng
1049Faith GillianGermany2026-05-03King, Christopher A Esq RENEWAL15Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Cody SaylorsAustraliaXuxue Feng NEW
Mujtaba NickaRussiaOnyama Limba UNQUALIFIED
Antonio CaudyCanadaAnna Fali NEW
Octavia MaletUnited KingdomBernardo Dominic NEGOTIATION
Ivar PaprockiItalyXuxue Feng NEW
Costa DilliardJapanXuxue Feng UNQUALIFIED
Juan WieserAustraliaIvan Magalhaes NEW
Rodrigues CampainJapanIvan Magalhaes RENEWAL
Jeanfrancois VenereUnited KingdomAnna Fali QUALIFIED
Aruna FigeroaIndiaOnyama Limba PROPOSAL
Wickens NestleAustraliaBernardo Dominic UNQUALIFIED
Aika InouyeJapanBernardo Dominic UNQUALIFIED
Claire TollnerUnited KingdomXuxue Feng QUALIFIED
Leja CaldareraItalyAmy Elsner NEW
Mujtaba NickaIndiaIvan Magalhaes QUALIFIED
Stacey MacleadItalyElwin Sharvill PROPOSAL
Tony FollerAustraliaIvan Magalhaes PROPOSAL
Munro FerenczArgentinaStephen Shaw PROPOSAL
Kadeem FlosiBrazilElwin Sharvill RENEWAL
Silvio SlusarskiAustraliaXuxue Feng NEGOTIATION
Tony FollerUnited KingdomStephen Shaw QUALIFIED
Johnson SergiRussiaXuxue Feng NEGOTIATION
Claire TollnerBrazilElwin Sharvill NEW
Ashley DoeAustraliaIoni Bowcher UNQUALIFIED
Leja CaldareraCanadaAmy Elsner QUALIFIED
Deepesh ChuiJapanAmy Elsner NEGOTIATION
Jeanfrancois VenereUnited KingdomXuxue Feng PROPOSAL
Isabel BowleyRussiaIvan Magalhaes NEW
Mayumi KolmetzGermanyIoni Bowcher UNQUALIFIED
Misaki RoysterIndiaAnna Fali QUALIFIED
Greenwood BologniaSpainOnyama Limba QUALIFIED
David DarakjyRussiaIvan Magalhaes NEW
Leon OldroydItalyAmy Elsner NEGOTIATION
Maisha RulapaughArgentinaAmy Elsner UNQUALIFIED
Aika InouyeRussiaAnna Fali NEGOTIATION
Juan WieserJapanStephen Shaw RENEWAL
Arvin AlbaresAustraliaIoni Bowcher PROPOSAL
David DarakjyCanadaStephen Shaw RENEWAL
Wickens NestleJapanAsiya Javayant PROPOSAL
Aditya KuskoGermanyAmy Elsner NEGOTIATION
Nicolas IturbideUnited KingdomXuxue Feng NEW
Ivar PaprockiItalyAsiya Javayant PROPOSAL
Aruna FigeroaGermanyOnyama Limba QUALIFIED
Murillo MaletRussiaAnna Fali QUALIFIED
Kadeem FlosiUnited KingdomAsiya Javayant UNQUALIFIED
Wickens NestleGermanyElwin Sharvill PROPOSAL
Jennifer AmigonArgentinaAnna Fali QUALIFIED
Izzy GarufiCanadaIoni Bowcher RENEWAL
Antonio CaudyAustraliaAsiya Javayant QUALIFIED
Johnson SergiArgentinaAmy Elsner NEW
Frozen Columns
Name
Aruna Figeroa
Darci Poquette
Leja Caldarera
Faith Gillian
Isabel Bowley
Nicolas Iturbide
Chavez Briddick
Leon Oldroyd
Deepesh Chui
Mayumi Kolmetz
Leja Caldarera
Murillo Malet
Cody Saylors
Deepesh Chui
Jennifer Amigon
Nicolas Iturbide
Alejandro Perin
Jefferson Schemmer
Murillo Malet
Isabel Bowley
Stacey Maclead
Julie Stenseth
Salvatore Stockham
Nicolas Iturbide
Octavia Malet
Aika Inouye
Arvin Albares
Greenwood Bolognia
Maisha Rulapaugh
Clifford Rim
Isabel Bowley
Faith Gillian
Arvin Albares
Greenwood Bolognia
Faith Gillian
Silvio Slusarski
Juan Wieser
Ashley Doe
Jennifer Amigon
Salvatore Stockham
Clifford Rim
Mujtaba Nicka
Ricardo Gaucho
Julie Stenseth
Darci Poquette
Tony Foller
Maria Marrier
Rodrigues Campain
Silvio Slusarski
Alejandro Perin
IdCountryDate
1000Russia2026-05-06
1001India2026-05-28
1002Japan2026-05-04
1003Spain2026-05-26
1004Russia2026-05-14
1005Italy2026-05-23
1006Australia2026-05-04
1007India2026-05-16
1008Argentina2026-05-05
1009Argentina2026-05-08
1010Italy2026-05-03
1011Japan2026-05-30
1012India2026-05-28
1013India2026-05-14
1014Brazil2026-05-26
1015Canada2026-05-24
1016Australia2026-05-20
1017Germany2026-05-17
1018United Kingdom2026-05-15
1019Russia2026-05-05
1020United Kingdom2026-05-25
1021Argentina2026-05-16
1022Brazil2026-05-09
1023Australia2026-05-18
1024Spain2026-05-26
1025Germany2026-05-14
1026France2026-05-28
1027Argentina2026-05-24
1028Brazil2026-05-10
1029United Kingdom2026-05-12
1030Brazil2026-05-12
1031India2026-05-09
1032Canada2026-05-10
1033Argentina2026-05-27
1034Spain2026-05-03
1035Germany2026-05-30
1036Canada2026-05-29
1037Japan2026-05-16
1038Italy2026-05-19
1039Canada2026-05-09
1040India2026-05-19
1041Argentina2026-05-10
1042Italy2026-05-09
1043Germany2026-05-25
1044Argentina2026-05-08
1045Argentina2026-05-28
1046Canada2026-05-23
1047Spain2026-05-30
1048Brazil2026-05-10
1049Italy2026-05-28

On-Demand Data

NameIdCountryDate
Kaitlin Ostrosky1000Italy2026-05-23
Misaki Royster1001Australia2026-05-04
Ashley Doe1002Spain2026-05-04
Silvio Slusarski1003Canada2026-05-15
Leon Oldroyd1004Canada2026-05-02
Aika Inouye1005Australia2026-05-21
Sinclair Waycott1006Germany2026-05-28
Jefferson Schemmer1007Brazil2026-05-02
Clifford Rim1008Spain2026-05-22
Jeanfrancois Venere1009Italy2026-05-12
Maria Marrier1010Brazil2026-05-27
Juan Wieser1011India2026-05-05
Aika Inouye1012Italy2026-05-13
Tony Foller1013Russia2026-05-22
Murillo Malet1014Spain2026-05-17
Antonio Caudy1015Russia2026-05-19
Aika Inouye1016Italy2026-05-02
Maisha Rulapaugh1017Germany2026-05-11
Silvio Slusarski1018Australia2026-05-01
Darci Poquette1019Japan2026-05-14
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Francesco ShinkoItalyOnyama Limba NEW
Mujtaba NickaRussiaXuxue Feng PROPOSAL
Salvatore StockhamGermanyAsiya Javayant NEGOTIATION
Jennifer AmigonGermanyIoni Bowcher RENEWAL
Adams MorascaJapanBernardo Dominic PROPOSAL
James ButtRussiaXuxue Feng QUALIFIED
Kaitlin OstroskyJapanAsiya Javayant NEW
Morrow RutaArgentinaAmy Elsner PROPOSAL
Francesco ShinkoCanadaOnyama Limba QUALIFIED
Maria MarrierCanadaAnna Fali NEGOTIATION
Mujtaba NickaFranceBernardo Dominic QUALIFIED
Darci PoquetteArgentinaBernardo Dominic NEGOTIATION
Clifford RimFranceStephen Shaw NEGOTIATION
Faith GillianFranceOnyama Limba PROPOSAL
Maria MarrierAustraliaIoni Bowcher NEGOTIATION
Adams MorascaUnited KingdomAnna Fali QUALIFIED
Aruna FigeroaCanadaAnna Fali QUALIFIED
Octavia MaletUnited KingdomElwin Sharvill PROPOSAL
Leon OldroydBrazilXuxue Feng NEW
Aika InouyeArgentinaOnyama Limba NEW
Sinclair WaycottJapanAsiya Javayant UNQUALIFIED
Kaitlin OstroskyIndiaStephen Shaw QUALIFIED
Salvatore StockhamCanadaIoni Bowcher RENEWAL
Maria MarrierFranceAmy Elsner NEGOTIATION
Jefferson SchemmerGermanyIvan Magalhaes NEGOTIATION
Leon OldroydAustraliaAmy Elsner NEGOTIATION
Faith GillianBrazilXuxue Feng UNQUALIFIED
Salvatore StockhamRussiaIvan Magalhaes NEW
Isabel BowleyJapanStephen Shaw NEW
Sinclair WaycottIndiaIvan Magalhaes RENEWAL
Sinclair WaycottUnited KingdomAmy Elsner QUALIFIED
Costa DilliardIndiaStephen Shaw NEW
Misaki RoysterItalyElwin Sharvill RENEWAL
Alejandro PerinBrazilElwin Sharvill RENEWAL
Ivar PaprockiJapanOnyama Limba RENEWAL
Julie StensethGermanyIoni Bowcher NEGOTIATION
Costa DilliardUnited KingdomXuxue Feng UNQUALIFIED
Munro FerenczItalyIvan Magalhaes NEGOTIATION
Aruna FigeroaArgentinaAmy Elsner QUALIFIED
Cody SaylorsGermanyAmy Elsner 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>