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
Sinclair WaycottFranceAsiya Javayant PROPOSAL
Aditya KuskoIndiaAmy Elsner RENEWAL
Maria MarrierJapanElwin Sharvill UNQUALIFIED
Emily WhobreyAustraliaIoni Bowcher NEW
Faith GillianRussiaAmy Elsner QUALIFIED
Octavia MaletUnited KingdomXuxue Feng QUALIFIED
Maisha RulapaughBrazilIvan Magalhaes QUALIFIED
Aruna FigeroaJapanStephen Shaw QUALIFIED
Jeanfrancois VenereIndiaXuxue Feng NEGOTIATION
Silvio SlusarskiArgentinaElwin Sharvill PROPOSAL
Munro FerenczAustraliaStephen Shaw RENEWAL
Costa DilliardItalyStephen Shaw QUALIFIED
Adams MorascaCanadaIvan Magalhaes PROPOSAL
Johnson SergiItalyOnyama Limba NEGOTIATION
Tony FollerUnited KingdomAnna Fali RENEWAL
Aditya KuskoUnited KingdomElwin Sharvill UNQUALIFIED
Octavia MaletRussiaBernardo Dominic QUALIFIED
Misaki RoysterGermanyIvan Magalhaes RENEWAL
Sinclair WaycottItalyStephen Shaw QUALIFIED
Rodrigues CampainRussiaIvan Magalhaes NEW
Murillo MaletFranceIvan Magalhaes PROPOSAL
Cody SaylorsSpainOnyama Limba RENEWAL
Aika InouyeCanadaElwin Sharvill PROPOSAL
Octavia MaletBrazilIvan Magalhaes RENEWAL
Stacey MacleadFranceAnna Fali PROPOSAL
Tony FollerJapanIvan Magalhaes QUALIFIED
Jennifer AmigonArgentinaOnyama Limba NEGOTIATION
Chavez BriddickJapanIvan Magalhaes RENEWAL
Isabel BowleySpainElwin Sharvill PROPOSAL
Johnson SergiFranceStephen Shaw UNQUALIFIED
Salvatore StockhamJapanAsiya Javayant QUALIFIED
Clifford RimAustraliaStephen Shaw RENEWAL
Francesco ShinkoJapanXuxue Feng RENEWAL
Jones VocelkaRussiaStephen Shaw RENEWAL
Maisha RulapaughBrazilAsiya Javayant NEW
James ButtItalyIvan Magalhaes RENEWAL
Kadeem FlosiUnited KingdomBernardo Dominic NEW
Faith GillianJapanElwin Sharvill NEW
Munro FerenczAustraliaAmy Elsner UNQUALIFIED
Munro FerenczRussiaBernardo Dominic NEW
Aditya KuskoArgentinaElwin Sharvill UNQUALIFIED
Salvatore StockhamRussiaOnyama Limba NEGOTIATION
Deepesh ChuiAustraliaStephen Shaw NEGOTIATION
Wickens NestleJapanAsiya Javayant QUALIFIED
David DarakjyCanadaAnna Fali PROPOSAL
Silvio SlusarskiArgentinaBernardo Dominic QUALIFIED
Francesco ShinkoRussiaAmy Elsner NEGOTIATION
Izzy GarufiJapanXuxue Feng UNQUALIFIED
Rodrigues CampainRussiaStephen Shaw UNQUALIFIED
Francesco ShinkoBrazilAmy Elsner UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Sinclair WaycottSpainAmy Elsner RENEWAL
Kadeem FlosiAustraliaBernardo Dominic QUALIFIED
Faith GillianSpainXuxue Feng RENEWAL
Octavia MaletJapanIvan Magalhaes PROPOSAL
Aruna FigeroaAustraliaAsiya Javayant QUALIFIED
James ButtIndiaStephen Shaw RENEWAL
Ivar PaprockiIndiaIvan Magalhaes NEGOTIATION
Munro FerenczArgentinaIoni Bowcher NEW
Deepesh ChuiUnited KingdomIvan Magalhaes NEGOTIATION
Leja CaldareraFranceOnyama Limba NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Cody SaylorsArgentina2026-05-02Truhlar And Truhlar Attys PROPOSAL57Elwin Sharvill
1001Julie StensethJapan2026-05-07Feltz Printing Service RENEWAL2Onyama Limba
1002Greenwood BologniaItaly2026-05-08Chapman, Ross E Esq NEW40Elwin Sharvill
1003Johnson SergiRussia2026-05-02Rangoni Of Florence PROPOSAL22Asiya Javayant
1004Clifford RimArgentina2026-04-24Feltz Printing Service NEW11Onyama Limba
1005Darci PoquetteRussia2026-05-03Feltz Printing Service RENEWAL71Stephen Shaw
1006Aruna FigeroaRussia2026-05-07Dorl, James J Esq NEW37Bernardo Dominic
1007Jennifer AmigonIndia2026-05-14Printing Dimensions QUALIFIED51Ioni Bowcher
1008Arvin AlbaresCanada2026-05-08Chanay, Jeffrey A Esq RENEWAL68Xuxue Feng
1009Smith GlickRussia2026-05-02Truhlar And Truhlar Attys NEW62Asiya Javayant
1010Salvatore StockhamJapan2026-05-14Morlong Associates RENEWAL51Anna Fali
1011Leja CaldareraBrazil2026-05-02Truhlar And Truhlar Attys NEGOTIATION83Ioni Bowcher
1012Jeanfrancois VenereSpain2026-05-14Feltz Printing Service PROPOSAL91Stephen Shaw
1013Aruna FigeroaItaly2026-04-17Printing Dimensions UNQUALIFIED0Xuxue Feng
1014Aditya KuskoFrance2026-04-16Chemel, James L Cpa RENEWAL59Elwin Sharvill
1015Mayumi KolmetzIndia2026-05-01Commercial Press PROPOSAL48Onyama Limba
1016Mujtaba NickaFrance2026-04-21Chapman, Ross E Esq NEW92Anna Fali
1017Deepesh ChuiBrazil2026-05-10King, Christopher A Esq RENEWAL67Asiya Javayant
1018Emily WhobreyArgentina2026-05-01Rousseaux, Michael Esq QUALIFIED15Anna Fali
1019Antonio CaudyGermany2026-05-14Commercial Press NEW84Stephen Shaw
1020Maisha RulapaughFrance2026-05-01Chemel, James L Cpa UNQUALIFIED97Asiya Javayant
1021Faith GillianIndia2026-04-23Printing Dimensions UNQUALIFIED54Bernardo Dominic
1022Claire TollnerFrance2026-04-26Rousseaux, Michael Esq NEGOTIATION95Onyama Limba
1023Stacey MacleadUnited Kingdom2026-05-11Morlong Associates NEW21Ivan Magalhaes
1024Jeanfrancois VenereRussia2026-05-03Buckley Miller Wright UNQUALIFIED19Ioni Bowcher
1025Smith GlickGermany2026-05-04Dorl, James J Esq RENEWAL0Ivan Magalhaes
1026Johnson SergiJapan2026-05-06Feltz Printing Service NEW52Asiya Javayant
1027Jefferson SchemmerRussia2026-05-04Chapman, Ross E Esq NEGOTIATION79Amy Elsner
1028Jefferson SchemmerBrazil2026-04-24Chanay, Jeffrey A Esq NEGOTIATION98Xuxue Feng
1029Rodrigues CampainSpain2026-04-27Benton, John B Jr NEW60Asiya Javayant
1030Maisha RulapaughBrazil2026-04-28Rangoni Of Florence RENEWAL73Asiya Javayant
1031Adams MorascaFrance2026-04-19Printing Dimensions PROPOSAL97Amy Elsner
1032Arvin AlbaresItaly2026-04-25Chemel, James L Cpa NEW58Amy Elsner
1033Isabel BowleyGermany2026-04-28Chanay, Jeffrey A Esq UNQUALIFIED71Ioni Bowcher
1034Faith GillianSpain2026-05-08Feltz Printing Service RENEWAL12Onyama Limba
1035Misaki RoysterIndia2026-05-14Printing Dimensions NEW1Anna Fali
1036Antonio CaudyBrazil2026-04-19Truhlar And Truhlar Attys NEW2Asiya Javayant
1037Murillo MaletJapan2026-04-27Chanay, Jeffrey A Esq PROPOSAL89Xuxue Feng
1038Aruna FigeroaGermany2026-04-27Chemel, James L Cpa QUALIFIED59Anna Fali
1039Julie StensethSpain2026-04-16Printing Dimensions PROPOSAL49Anna Fali
1040Kadeem FlosiIndia2026-05-01Feltz Printing Service NEW88Asiya Javayant
1041Munro FerenczAustralia2026-04-22Printing Dimensions NEW80Bernardo Dominic
1042Faith GillianCanada2026-04-30Feltz Printing Service NEW88Ivan Magalhaes
1043Faith GillianBrazil2026-04-18Chanay, Jeffrey A Esq RENEWAL71Anna Fali
1044Arvin AlbaresFrance2026-05-09Benton, John B Jr UNQUALIFIED1Amy Elsner
1045Izzy GarufiItaly2026-04-28Feltz Printing Service NEGOTIATION67Xuxue Feng
1046Chavez BriddickJapan2026-04-22Chanay, Jeffrey A Esq NEGOTIATION98Bernardo Dominic
1047Alejandro PerinIndia2026-05-04Rousseaux, Michael Esq UNQUALIFIED79Stephen Shaw
1048Aika InouyeUnited Kingdom2026-04-26Morlong Associates NEGOTIATION63Stephen Shaw
1049Misaki RoysterAustralia2026-05-13Commercial Press QUALIFIED37Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Johnson SergiArgentinaStephen Shaw PROPOSAL
Johnson SergiArgentinaStephen Shaw QUALIFIED
Misaki RoysterSpainAmy Elsner QUALIFIED
Leon OldroydRussiaAnna Fali NEGOTIATION
Sinclair WaycottIndiaStephen Shaw PROPOSAL
Cody SaylorsArgentinaStephen Shaw UNQUALIFIED
Stacey MacleadUnited KingdomAnna Fali UNQUALIFIED
Maisha RulapaughFranceAmy Elsner QUALIFIED
Leja CaldareraFranceAnna Fali QUALIFIED
Nicolas IturbideJapanOnyama Limba QUALIFIED
Ashley DoeSpainXuxue Feng QUALIFIED
Ashley DoeArgentinaBernardo Dominic QUALIFIED
Kadeem FlosiAustraliaElwin Sharvill UNQUALIFIED
Alejandro PerinJapanBernardo Dominic NEW
Leon OldroydAustraliaStephen Shaw NEW
Juan WieserGermanyIvan Magalhaes NEGOTIATION
Jones VocelkaIndiaIoni Bowcher PROPOSAL
Mayumi KolmetzBrazilIvan Magalhaes RENEWAL
Clifford RimCanadaIvan Magalhaes PROPOSAL
Clifford RimRussiaAmy Elsner UNQUALIFIED
Smith GlickGermanyIoni Bowcher NEGOTIATION
Adams MorascaFranceAmy Elsner QUALIFIED
Leja CaldareraIndiaIoni Bowcher UNQUALIFIED
Aditya KuskoSpainAsiya Javayant UNQUALIFIED
Aditya KuskoGermanyIoni Bowcher RENEWAL
Faith GillianAustraliaIvan Magalhaes RENEWAL
Isabel BowleyIndiaAnna Fali PROPOSAL
Jefferson SchemmerFranceBernardo Dominic NEGOTIATION
Jefferson SchemmerCanadaIvan Magalhaes NEGOTIATION
Aika InouyeJapanOnyama Limba PROPOSAL
Tony FollerItalyAsiya Javayant NEGOTIATION
Ricardo GauchoAustraliaAnna Fali RENEWAL
Deepesh ChuiItalyAsiya Javayant UNQUALIFIED
David DarakjyArgentinaBernardo Dominic QUALIFIED
Adams MorascaArgentinaIvan Magalhaes RENEWAL
Nicolas IturbideFranceBernardo Dominic NEW
Mayumi KolmetzGermanyAmy Elsner NEGOTIATION
Rodrigues CampainGermanyIoni Bowcher PROPOSAL
Morrow RutaCanadaAnna Fali PROPOSAL
Juan WieserIndiaOnyama Limba UNQUALIFIED
Francesco ShinkoFranceIoni Bowcher UNQUALIFIED
Izzy GarufiArgentinaIoni Bowcher RENEWAL
Aditya KuskoGermanyAmy Elsner QUALIFIED
Antonio CaudySpainBernardo Dominic UNQUALIFIED
Tony FollerFranceIoni Bowcher PROPOSAL
Jones VocelkaSpainAsiya Javayant RENEWAL
Costa DilliardUnited KingdomAmy Elsner QUALIFIED
Munro FerenczGermanyStephen Shaw UNQUALIFIED
Isabel BowleyItalyElwin Sharvill UNQUALIFIED
Adams MorascaCanadaIoni Bowcher PROPOSAL
Frozen Columns
Name
Johnson Sergi
Francesco Shinko
Cody Saylors
Arvin Albares
Kaitlin Ostrosky
Sinclair Waycott
Misaki Royster
Arvin Albares
Greenwood Bolognia
Jeanfrancois Venere
Clifford Rim
Jennifer Amigon
Emily Whobrey
Darci Poquette
Arvin Albares
Maisha Rulapaugh
Wickens Nestle
Aruna Figeroa
Isabel Bowley
Isabel Bowley
Darci Poquette
Juan Wieser
Greenwood Bolognia
Deepesh Chui
Tony Foller
Cody Saylors
Deepesh Chui
Salvatore Stockham
James Butt
Mujtaba Nicka
Adams Morasca
Emily Whobrey
Adams Morasca
Nicolas Iturbide
Claire Tollner
Ricardo Gaucho
Munro Ferencz
Maisha Rulapaugh
Chavez Briddick
Clifford Rim
Clifford Rim
Johnson Sergi
Deepesh Chui
Ricardo Gaucho
Emily Whobrey
Arvin Albares
Clifford Rim
Jefferson Schemmer
Izzy Garufi
Kadeem Flosi
IdCountryDate
1000France2026-04-26
1001Canada2026-05-09
1002United Kingdom2026-05-14
1003Australia2026-04-30
1004United Kingdom2026-05-09
1005Argentina2026-05-11
1006United Kingdom2026-05-11
1007Japan2026-05-06
1008France2026-04-18
1009Argentina2026-05-03
1010Canada2026-04-29
1011Japan2026-04-22
1012Australia2026-04-16
1013United Kingdom2026-04-17
1014United Kingdom2026-04-28
1015France2026-04-21
1016Spain2026-05-09
1017Spain2026-04-24
1018Canada2026-05-01
1019Germany2026-05-10
1020Canada2026-05-03
1021Canada2026-04-22
1022Brazil2026-05-09
1023United Kingdom2026-04-25
1024Japan2026-04-29
1025Spain2026-04-26
1026Russia2026-04-15
1027Argentina2026-04-19
1028Australia2026-05-07
1029Germany2026-04-25
1030Russia2026-04-24
1031Canada2026-05-01
1032Japan2026-05-01
1033Japan2026-04-20
1034India2026-04-26
1035Argentina2026-04-27
1036India2026-04-22
1037Australia2026-04-30
1038Japan2026-05-14
1039Germany2026-05-04
1040Spain2026-05-09
1041Brazil2026-05-08
1042France2026-05-07
1043Russia2026-04-27
1044Argentina2026-05-11
1045Japan2026-04-21
1046Australia2026-04-28
1047Australia2026-05-13
1048United Kingdom2026-04-18
1049Spain2026-04-22

On-Demand Data

NameIdCountryDate
Clifford Rim1000India2026-04-21
Sinclair Waycott1001Japan2026-05-04
Adams Morasca1002Germany2026-05-09
Jeanfrancois Venere1003France2026-04-29
Maria Marrier1004Australia2026-04-16
Sinclair Waycott1005France2026-05-05
Nicolas Iturbide1006Italy2026-05-06
Clifford Rim1007Germany2026-04-27
Wickens Nestle1008United Kingdom2026-05-03
Jefferson Schemmer1009Canada2026-04-27
Rodrigues Campain1010Australia2026-04-21
Alejandro Perin1011United Kingdom2026-05-10
Leja Caldarera1012Australia2026-04-20
Clifford Rim1013Brazil2026-04-23
Sinclair Waycott1014France2026-05-01
Izzy Garufi1015Italy2026-05-14
Rodrigues Campain1016United Kingdom2026-04-22
Mujtaba Nicka1017India2026-05-13
David Darakjy1018Argentina2026-04-15
David Darakjy1019Germany2026-04-29
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Sinclair WaycottBrazilAmy Elsner NEW
Nicolas IturbideSpainAnna Fali QUALIFIED
Jefferson SchemmerCanadaIvan Magalhaes QUALIFIED
Morrow RutaJapanElwin Sharvill NEGOTIATION
Jeanfrancois VenereBrazilIvan Magalhaes UNQUALIFIED
Octavia MaletAustraliaStephen Shaw RENEWAL
Murillo MaletArgentinaXuxue Feng NEGOTIATION
Kadeem FlosiItalyXuxue Feng NEGOTIATION
Jeanfrancois VenereRussiaIvan Magalhaes UNQUALIFIED
Leon OldroydRussiaAmy Elsner NEW
Ricardo GauchoIndiaElwin Sharvill PROPOSAL
Francesco ShinkoSpainElwin Sharvill UNQUALIFIED
Costa DilliardBrazilAmy Elsner QUALIFIED
Wickens NestleAustraliaIoni Bowcher QUALIFIED
Ashley DoeIndiaAmy Elsner QUALIFIED
Francesco ShinkoAustraliaOnyama Limba RENEWAL
Murillo MaletGermanyAmy Elsner UNQUALIFIED
Morrow RutaArgentinaBernardo Dominic UNQUALIFIED
Tony FollerBrazilIvan Magalhaes PROPOSAL
Chavez BriddickSpainAsiya Javayant QUALIFIED
Emily WhobreyArgentinaAnna Fali RENEWAL
Kaitlin OstroskyBrazilIvan Magalhaes NEGOTIATION
Mayumi KolmetzUnited KingdomOnyama Limba NEGOTIATION
Emily WhobreyCanadaXuxue Feng NEGOTIATION
Ivar PaprockiFranceAmy Elsner RENEWAL
Adams MorascaRussiaBernardo Dominic NEGOTIATION
Sinclair WaycottJapanIoni Bowcher NEGOTIATION
Morrow RutaIndiaStephen Shaw QUALIFIED
Adams MorascaGermanyStephen Shaw NEW
Johnson SergiArgentinaAnna Fali QUALIFIED
Munro FerenczRussiaAsiya Javayant PROPOSAL
Arvin AlbaresIndiaBernardo Dominic RENEWAL
Kadeem FlosiIndiaAnna Fali RENEWAL
Leon OldroydArgentinaAmy Elsner UNQUALIFIED
Nicolas IturbideBrazilBernardo Dominic NEGOTIATION
Wickens NestleAustraliaIoni Bowcher QUALIFIED
Maria MarrierUnited KingdomElwin Sharvill UNQUALIFIED
Kaitlin OstroskyAustraliaStephen Shaw NEW
Julie StensethIndiaIoni Bowcher NEW
Antonio CaudyUnited KingdomXuxue Feng 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>