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
Cody SaylorsJapanElwin Sharvill NEW
Deepesh ChuiIndiaBernardo Dominic RENEWAL
Antonio CaudySpainStephen Shaw QUALIFIED
Silvio SlusarskiAustraliaAmy Elsner NEGOTIATION
James ButtUnited KingdomStephen Shaw PROPOSAL
Munro FerenczRussiaStephen Shaw PROPOSAL
Adams MorascaItalyAnna Fali UNQUALIFIED
David DarakjyUnited KingdomAsiya Javayant NEGOTIATION
Arvin AlbaresCanadaAsiya Javayant NEW
Ivar PaprockiArgentinaXuxue Feng UNQUALIFIED
Aruna FigeroaBrazilElwin Sharvill NEW
Mayumi KolmetzIndiaIoni Bowcher NEGOTIATION
Claire TollnerGermanyIvan Magalhaes PROPOSAL
Emily WhobreyRussiaBernardo Dominic PROPOSAL
Jennifer AmigonRussiaElwin Sharvill NEGOTIATION
Maisha RulapaughBrazilAmy Elsner RENEWAL
Leja CaldareraArgentinaIvan Magalhaes PROPOSAL
Julie StensethRussiaAmy Elsner NEW
Leja CaldareraSpainStephen Shaw PROPOSAL
Antonio CaudyArgentinaIvan Magalhaes NEGOTIATION
Nicolas IturbideJapanBernardo Dominic NEW
Kadeem FlosiIndiaElwin Sharvill QUALIFIED
Aruna FigeroaGermanyAnna Fali NEW
David DarakjyCanadaStephen Shaw UNQUALIFIED
Aika InouyeGermanyElwin Sharvill NEW
Adams MorascaIndiaBernardo Dominic UNQUALIFIED
Tony FollerUnited KingdomIoni Bowcher RENEWAL
Deepesh ChuiItalyAmy Elsner NEW
Rodrigues CampainJapanBernardo Dominic RENEWAL
Nicolas IturbideUnited KingdomOnyama Limba QUALIFIED
Faith GillianJapanBernardo Dominic UNQUALIFIED
Arvin AlbaresSpainStephen Shaw PROPOSAL
Murillo MaletSpainXuxue Feng NEGOTIATION
Sinclair WaycottUnited KingdomIoni Bowcher QUALIFIED
Murillo MaletIndiaIoni Bowcher PROPOSAL
Cody SaylorsItalyBernardo Dominic QUALIFIED
Kadeem FlosiUnited KingdomXuxue Feng RENEWAL
Munro FerenczCanadaAsiya Javayant NEGOTIATION
Leon OldroydCanadaAmy Elsner UNQUALIFIED
Jones VocelkaUnited KingdomAmy Elsner NEW
Kaitlin OstroskyArgentinaAnna Fali NEGOTIATION
Adams MorascaUnited KingdomIvan Magalhaes UNQUALIFIED
Costa DilliardIndiaElwin Sharvill NEW
Faith GillianAustraliaAsiya Javayant PROPOSAL
Leja CaldareraJapanXuxue Feng UNQUALIFIED
Kadeem FlosiSpainAsiya Javayant PROPOSAL
Faith GillianBrazilElwin Sharvill NEGOTIATION
Wickens NestleRussiaAnna Fali QUALIFIED
Jeanfrancois VenereArgentinaAnna Fali PROPOSAL
Leja CaldareraRussiaElwin Sharvill RENEWAL
Horizontal
NameCountryRepresentativeStatus
Octavia MaletUnited KingdomStephen Shaw RENEWAL
Arvin AlbaresRussiaIvan Magalhaes UNQUALIFIED
Jones VocelkaSpainBernardo Dominic QUALIFIED
Clifford RimRussiaAmy Elsner NEGOTIATION
Rodrigues CampainCanadaXuxue Feng RENEWAL
Maria MarrierArgentinaAsiya Javayant NEW
Misaki RoysterJapanIvan Magalhaes NEW
Munro FerenczBrazilIoni Bowcher NEGOTIATION
Mujtaba NickaItalyStephen Shaw RENEWAL
Alejandro PerinSpainAsiya Javayant RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aditya KuskoIndia2026-04-29Rangoni Of Florence RENEWAL59Amy Elsner
1001Murillo MaletAustralia2026-04-11Buckley Miller Wright RENEWAL18Bernardo Dominic
1002Faith GillianIndia2026-05-05Benton, John B Jr PROPOSAL23Anna Fali
1003Misaki RoysterCanada2026-04-21Commercial Press RENEWAL82Anna Fali
1004Sinclair WaycottCanada2026-04-30Truhlar And Truhlar Attys RENEWAL41Elwin Sharvill
1005Aika InouyeItaly2026-04-27Rousseaux, Michael Esq NEGOTIATION68Elwin Sharvill
1006Costa DilliardRussia2026-05-06Printing Dimensions UNQUALIFIED95Xuxue Feng
1007Maria MarrierRussia2026-05-02Benton, John B Jr UNQUALIFIED64Elwin Sharvill
1008Alejandro PerinRussia2026-04-13Chapman, Ross E Esq NEW15Bernardo Dominic
1009Aruna FigeroaArgentina2026-04-12Benton, John B Jr NEW97Bernardo Dominic
1010Morrow RutaSpain2026-05-06Rangoni Of Florence NEW9Ioni Bowcher
1011Emily WhobreyGermany2026-05-02Truhlar And Truhlar Attys UNQUALIFIED31Bernardo Dominic
1012Aika InouyeArgentina2026-04-26King, Christopher A Esq NEGOTIATION40Anna Fali
1013Leja CaldareraRussia2026-04-27Buckley Miller Wright NEGOTIATION26Bernardo Dominic
1014Julie StensethSpain2026-05-03Chanay, Jeffrey A Esq NEGOTIATION8Xuxue Feng
1015Cody SaylorsRussia2026-05-05Chemel, James L Cpa RENEWAL38Xuxue Feng
1016Munro FerenczIndia2026-05-01Feiner Bros UNQUALIFIED86Elwin Sharvill
1017Clifford RimIndia2026-04-09Rangoni Of Florence RENEWAL88Onyama Limba
1018Alejandro PerinArgentina2026-04-22Truhlar And Truhlar Attys NEW12Ivan Magalhaes
1019Chavez BriddickGermany2026-04-25Dorl, James J Esq UNQUALIFIED44Elwin Sharvill
1020Jones VocelkaIndia2026-04-11Chanay, Jeffrey A Esq RENEWAL48Asiya Javayant
1021David DarakjyRussia2026-04-21Chanay, Jeffrey A Esq NEGOTIATION10Elwin Sharvill
1022Faith GillianUnited Kingdom2026-04-26Chanay, Jeffrey A Esq RENEWAL33Asiya Javayant
1023Cody SaylorsSpain2026-04-27Feiner Bros PROPOSAL20Stephen Shaw
1024Johnson SergiItaly2026-05-07Chapman, Ross E Esq QUALIFIED17Onyama Limba
1025Arvin AlbaresBrazil2026-04-24Truhlar And Truhlar Attys NEGOTIATION19Xuxue Feng
1026Izzy GarufiUnited Kingdom2026-04-23Feiner Bros QUALIFIED38Stephen Shaw
1027Maria MarrierUnited Kingdom2026-05-08Benton, John B Jr NEGOTIATION39Onyama Limba
1028Jones VocelkaIndia2026-05-06Truhlar And Truhlar Attys RENEWAL25Stephen Shaw
1029Nicolas IturbideItaly2026-05-07Rangoni Of Florence PROPOSAL78Ioni Bowcher
1030Aditya KuskoIndia2026-04-17Chapman, Ross E Esq PROPOSAL73Xuxue Feng
1031Arvin AlbaresCanada2026-05-03Feltz Printing Service QUALIFIED54Ioni Bowcher
1032Faith GillianFrance2026-04-19Benton, John B Jr PROPOSAL41Stephen Shaw
1033Aditya KuskoGermany2026-04-14Benton, John B Jr NEW95Stephen Shaw
1034Misaki RoysterJapan2026-04-15Feltz Printing Service RENEWAL76Ivan Magalhaes
1035Francesco ShinkoCanada2026-04-12Buckley Miller Wright NEGOTIATION71Stephen Shaw
1036Jennifer AmigonSpain2026-04-21Morlong Associates PROPOSAL59Asiya Javayant
1037Faith GillianRussia2026-04-12Buckley Miller Wright QUALIFIED78Stephen Shaw
1038Faith GillianSpain2026-05-06Rousseaux, Michael Esq NEW11Onyama Limba
1039Julie StensethSpain2026-04-18Morlong Associates RENEWAL16Stephen Shaw
1040Salvatore StockhamAustralia2026-04-26Feiner Bros QUALIFIED96Ioni Bowcher
1041Munro FerenczItaly2026-04-28Benton, John B Jr PROPOSAL52Ivan Magalhaes
1042Maria MarrierFrance2026-04-18Chanay, Jeffrey A Esq QUALIFIED40Amy Elsner
1043Jennifer AmigonItaly2026-04-11Dorl, James J Esq QUALIFIED58Xuxue Feng
1044Ashley DoeFrance2026-04-09Feltz Printing Service UNQUALIFIED76Bernardo Dominic
1045Kaitlin OstroskyAustralia2026-04-18Rousseaux, Michael Esq QUALIFIED91Bernardo Dominic
1046Sinclair WaycottFrance2026-05-07Printing Dimensions QUALIFIED14Anna Fali
1047Leon OldroydJapan2026-05-07Dorl, James J Esq UNQUALIFIED76Onyama Limba
1048Jeanfrancois VenereFrance2026-04-15Feiner Bros UNQUALIFIED71Amy Elsner
1049Aruna FigeroaIndia2026-05-04Chemel, James L Cpa RENEWAL33Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Cody SaylorsAustraliaOnyama Limba PROPOSAL
Claire TollnerJapanAmy Elsner RENEWAL
Darci PoquetteItalyIvan Magalhaes RENEWAL
Clifford RimGermanyBernardo Dominic NEGOTIATION
Cody SaylorsUnited KingdomOnyama Limba NEW
Smith GlickAustraliaXuxue Feng UNQUALIFIED
Cody SaylorsJapanIvan Magalhaes RENEWAL
Antonio CaudyRussiaAsiya Javayant RENEWAL
Deepesh ChuiRussiaAmy Elsner PROPOSAL
Johnson SergiFranceAnna Fali RENEWAL
Jeanfrancois VenereSpainElwin Sharvill RENEWAL
Kaitlin OstroskyGermanyBernardo Dominic UNQUALIFIED
Faith GillianRussiaAsiya Javayant QUALIFIED
Mayumi KolmetzFranceIoni Bowcher NEW
Costa DilliardItalyElwin Sharvill UNQUALIFIED
Adams MorascaItalyAsiya Javayant RENEWAL
Misaki RoysterAustraliaOnyama Limba RENEWAL
Jennifer AmigonFranceStephen Shaw PROPOSAL
Leja CaldareraUnited KingdomAsiya Javayant NEGOTIATION
Rodrigues CampainAustraliaStephen Shaw QUALIFIED
Emily WhobreyFranceIvan Magalhaes PROPOSAL
Misaki RoysterAustraliaIvan Magalhaes PROPOSAL
Kaitlin OstroskyBrazilElwin Sharvill QUALIFIED
Nicolas IturbideJapanElwin Sharvill RENEWAL
Emily WhobreyArgentinaIoni Bowcher QUALIFIED
Stacey MacleadAustraliaAsiya Javayant RENEWAL
Octavia MaletFranceElwin Sharvill QUALIFIED
Julie StensethSpainAnna Fali NEGOTIATION
Jeanfrancois VenereItalyXuxue Feng NEGOTIATION
Faith GillianIndiaIvan Magalhaes NEGOTIATION
Leja CaldareraJapanBernardo Dominic NEW
James ButtFranceStephen Shaw PROPOSAL
Mujtaba NickaFranceIvan Magalhaes UNQUALIFIED
Izzy GarufiBrazilIoni Bowcher RENEWAL
Faith GillianIndiaAnna Fali NEW
Emily WhobreyBrazilStephen Shaw NEW
Wickens NestleAustraliaAnna Fali PROPOSAL
Nicolas IturbideJapanAsiya Javayant NEW
Juan WieserUnited KingdomIvan Magalhaes PROPOSAL
Chavez BriddickCanadaOnyama Limba QUALIFIED
Sinclair WaycottItalyStephen Shaw QUALIFIED
Isabel BowleyJapanIvan Magalhaes UNQUALIFIED
Mujtaba NickaIndiaElwin Sharvill RENEWAL
Julie StensethArgentinaStephen Shaw RENEWAL
Juan WieserSpainIoni Bowcher RENEWAL
Mujtaba NickaRussiaOnyama Limba UNQUALIFIED
Jones VocelkaAustraliaOnyama Limba RENEWAL
Octavia MaletBrazilElwin Sharvill PROPOSAL
Murillo MaletIndiaAmy Elsner NEW
Nicolas IturbideCanadaBernardo Dominic PROPOSAL
Frozen Columns
Name
Ivar Paprocki
Cody Saylors
Chavez Briddick
Jefferson Schemmer
Claire Tollner
Adams Morasca
Munro Ferencz
Aditya Kusko
Rodrigues Campain
Arvin Albares
Aditya Kusko
Julie Stenseth
Faith Gillian
Jefferson Schemmer
Francesco Shinko
Emily Whobrey
Isabel Bowley
Kadeem Flosi
Alejandro Perin
Greenwood Bolognia
Aika Inouye
Leon Oldroyd
Johnson Sergi
Misaki Royster
Izzy Garufi
Claire Tollner
Costa Dilliard
Jefferson Schemmer
Maria Marrier
Johnson Sergi
Wickens Nestle
Nicolas Iturbide
Aika Inouye
Isabel Bowley
Clifford Rim
Leon Oldroyd
Francesco Shinko
Jones Vocelka
Darci Poquette
Aruna Figeroa
Aditya Kusko
Octavia Malet
Rodrigues Campain
Misaki Royster
Jefferson Schemmer
Mujtaba Nicka
Costa Dilliard
Aruna Figeroa
Ivar Paprocki
Darci Poquette
IdCountryDate
1000Spain2026-04-12
1001Spain2026-04-21
1002Canada2026-04-12
1003France2026-04-26
1004Brazil2026-04-12
1005India2026-04-14
1006Italy2026-04-15
1007Russia2026-05-01
1008Germany2026-04-29
1009Brazil2026-04-16
1010Canada2026-04-15
1011Spain2026-05-06
1012Germany2026-05-06
1013Italy2026-05-01
1014Italy2026-04-21
1015Argentina2026-04-14
1016Spain2026-05-03
1017Italy2026-05-04
1018Japan2026-04-29
1019Australia2026-04-20
1020Australia2026-04-14
1021Canada2026-04-27
1022France2026-04-30
1023France2026-04-21
1024Germany2026-05-08
1025Brazil2026-04-29
1026France2026-05-04
1027Spain2026-05-08
1028Brazil2026-04-15
1029India2026-04-22
1030Japan2026-04-13
1031Germany2026-04-12
1032India2026-04-20
1033Argentina2026-04-09
1034India2026-05-07
1035Australia2026-04-25
1036Germany2026-04-19
1037United Kingdom2026-05-01
1038Argentina2026-04-13
1039Italy2026-04-09
1040Germany2026-05-05
1041Brazil2026-05-05
1042Argentina2026-05-02
1043Germany2026-04-22
1044France2026-04-24
1045Germany2026-04-09
1046India2026-04-26
1047India2026-05-08
1048United Kingdom2026-04-14
1049Canada2026-04-12

On-Demand Data

NameIdCountryDate
Wickens Nestle1000Germany2026-04-26
Clifford Rim1001France2026-04-30
Jones Vocelka1002Spain2026-05-02
Francesco Shinko1003Australia2026-04-30
Cody Saylors1004India2026-04-22
Alejandro Perin1005Germany2026-04-27
Mayumi Kolmetz1006United Kingdom2026-04-23
David Darakjy1007Brazil2026-04-26
Claire Tollner1008India2026-04-17
Smith Glick1009Brazil2026-04-30
Octavia Malet1010Japan2026-04-20
Deepesh Chui1011Argentina2026-04-18
Jefferson Schemmer1012Argentina2026-04-16
Tony Foller1013Russia2026-04-27
Wickens Nestle1014Canada2026-04-19
Tony Foller1015Brazil2026-04-30
Francesco Shinko1016Russia2026-04-09
Ivar Paprocki1017India2026-04-12
Stacey Maclead1018United Kingdom2026-05-03
Morrow Ruta1019Italy2026-04-17
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Izzy GarufiSpainIoni Bowcher RENEWAL
Greenwood BologniaUnited KingdomAsiya Javayant PROPOSAL
Wickens NestleIndiaBernardo Dominic PROPOSAL
Kadeem FlosiSpainAmy Elsner PROPOSAL
Ricardo GauchoUnited KingdomElwin Sharvill NEW
Costa DilliardUnited KingdomIoni Bowcher NEGOTIATION
Rodrigues CampainUnited KingdomBernardo Dominic UNQUALIFIED
Mujtaba NickaGermanyIoni Bowcher PROPOSAL
Ashley DoeIndiaIvan Magalhaes QUALIFIED
Cody SaylorsAustraliaAnna Fali RENEWAL
Costa DilliardGermanyIvan Magalhaes UNQUALIFIED
Leja CaldareraItalyOnyama Limba UNQUALIFIED
Emily WhobreyAustraliaStephen Shaw NEGOTIATION
Smith GlickJapanXuxue Feng PROPOSAL
Aika InouyeCanadaIoni Bowcher NEGOTIATION
Sinclair WaycottSpainAsiya Javayant NEW
Sinclair WaycottSpainAnna Fali NEGOTIATION
Kadeem FlosiSpainOnyama Limba UNQUALIFIED
Leon OldroydItalyAsiya Javayant PROPOSAL
Costa DilliardSpainIvan Magalhaes UNQUALIFIED
Maisha RulapaughCanadaStephen Shaw NEW
Ashley DoeSpainAnna Fali PROPOSAL
Leon OldroydArgentinaAmy Elsner UNQUALIFIED
Salvatore StockhamRussiaAnna Fali QUALIFIED
Smith GlickUnited KingdomAmy Elsner RENEWAL
Smith GlickItalyIoni Bowcher NEW
Chavez BriddickJapanXuxue Feng QUALIFIED
Isabel BowleyRussiaIoni Bowcher PROPOSAL
Isabel BowleyIndiaIoni Bowcher PROPOSAL
Jefferson SchemmerArgentinaOnyama Limba UNQUALIFIED
Darci PoquetteRussiaIoni Bowcher NEGOTIATION
Misaki RoysterCanadaIoni Bowcher UNQUALIFIED
Munro FerenczFranceElwin Sharvill RENEWAL
Costa DilliardIndiaXuxue Feng PROPOSAL
James ButtArgentinaIvan Magalhaes NEGOTIATION
Jefferson SchemmerUnited KingdomAsiya Javayant PROPOSAL
David DarakjyFranceOnyama Limba UNQUALIFIED
Ivar PaprockiJapanBernardo Dominic UNQUALIFIED
Izzy GarufiItalyStephen Shaw UNQUALIFIED
Misaki RoysterIndiaXuxue Feng 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>