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
Darci PoquetteCanadaStephen Shaw QUALIFIED
Munro FerenczRussiaIoni Bowcher QUALIFIED
Alejandro PerinRussiaIoni Bowcher RENEWAL
Greenwood BologniaArgentinaAnna Fali QUALIFIED
Maisha RulapaughIndiaIvan Magalhaes QUALIFIED
Alejandro PerinIndiaOnyama Limba RENEWAL
Misaki RoysterUnited KingdomXuxue Feng RENEWAL
Darci PoquetteIndiaBernardo Dominic PROPOSAL
Murillo MaletAustraliaAnna Fali NEW
Emily WhobreyItalyStephen Shaw QUALIFIED
Cody SaylorsFranceIoni Bowcher RENEWAL
Jennifer AmigonJapanAnna Fali NEGOTIATION
Stacey MacleadCanadaXuxue Feng NEW
Aruna FigeroaIndiaStephen Shaw NEW
Mujtaba NickaArgentinaAsiya Javayant UNQUALIFIED
Antonio CaudyArgentinaIvan Magalhaes NEW
Munro FerenczCanadaElwin Sharvill NEGOTIATION
Maisha RulapaughAustraliaXuxue Feng QUALIFIED
Leon OldroydSpainElwin Sharvill RENEWAL
Juan WieserAustraliaOnyama Limba UNQUALIFIED
Octavia MaletJapanAnna Fali RENEWAL
Maisha RulapaughBrazilIvan Magalhaes PROPOSAL
Sinclair WaycottGermanyAsiya Javayant NEGOTIATION
Arvin AlbaresFranceAmy Elsner NEGOTIATION
Emily WhobreySpainIoni Bowcher UNQUALIFIED
Ashley DoeUnited KingdomAmy Elsner UNQUALIFIED
Jones VocelkaGermanyAnna Fali NEGOTIATION
Octavia MaletIndiaElwin Sharvill QUALIFIED
Leja CaldareraJapanElwin Sharvill NEGOTIATION
Arvin AlbaresFranceIvan Magalhaes RENEWAL
Murillo MaletCanadaElwin Sharvill RENEWAL
Aika InouyeJapanOnyama Limba PROPOSAL
Mayumi KolmetzIndiaIvan Magalhaes NEGOTIATION
Salvatore StockhamSpainIvan Magalhaes NEW
Salvatore StockhamRussiaBernardo Dominic NEGOTIATION
Alejandro PerinAustraliaBernardo Dominic QUALIFIED
Stacey MacleadJapanAsiya Javayant UNQUALIFIED
Aditya KuskoGermanyElwin Sharvill PROPOSAL
Silvio SlusarskiItalyAmy Elsner NEGOTIATION
Jeanfrancois VenereRussiaOnyama Limba NEGOTIATION
Leon OldroydBrazilAmy Elsner PROPOSAL
Silvio SlusarskiItalyAsiya Javayant PROPOSAL
Darci PoquetteAustraliaIoni Bowcher QUALIFIED
Julie StensethFranceBernardo Dominic UNQUALIFIED
Ashley DoeIndiaStephen Shaw PROPOSAL
Isabel BowleyUnited KingdomAmy Elsner PROPOSAL
Misaki RoysterCanadaStephen Shaw PROPOSAL
Kadeem FlosiUnited KingdomAnna Fali RENEWAL
Aditya KuskoAustraliaAnna Fali QUALIFIED
Isabel BowleyGermanyStephen Shaw PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Smith GlickFranceAsiya Javayant QUALIFIED
Izzy GarufiJapanStephen Shaw NEGOTIATION
Clifford RimSpainXuxue Feng QUALIFIED
Alejandro PerinSpainIvan Magalhaes UNQUALIFIED
Jefferson SchemmerAustraliaBernardo Dominic NEGOTIATION
Octavia MaletAustraliaAmy Elsner QUALIFIED
Stacey MacleadBrazilElwin Sharvill QUALIFIED
Arvin AlbaresJapanIvan Magalhaes RENEWAL
Murillo MaletUnited KingdomAmy Elsner RENEWAL
Leon OldroydBrazilAmy Elsner NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Jefferson SchemmerBrazil2026-04-13Buckley Miller Wright QUALIFIED63Ivan Magalhaes
1001Faith GillianFrance2026-04-28Rangoni Of Florence NEW50Stephen Shaw
1002Greenwood BologniaFrance2026-04-22Printing Dimensions NEGOTIATION40Anna Fali
1003Jeanfrancois VenereIndia2026-05-03Chemel, James L Cpa QUALIFIED81Xuxue Feng
1004Julie StensethGermany2026-04-29Chemel, James L Cpa UNQUALIFIED95Stephen Shaw
1005Misaki RoysterSpain2026-04-19Feiner Bros RENEWAL53Elwin Sharvill
1006Morrow RutaSpain2026-04-21Dorl, James J Esq NEW24Ivan Magalhaes
1007Maria MarrierRussia2026-04-22Rousseaux, Michael Esq PROPOSAL19Ioni Bowcher
1008Octavia MaletJapan2026-04-26King, Christopher A Esq NEW90Ioni Bowcher
1009Jones VocelkaItaly2026-04-12Commercial Press NEGOTIATION80Amy Elsner
1010Ivar PaprockiIndia2026-04-18Truhlar And Truhlar Attys RENEWAL53Onyama Limba
1011Deepesh ChuiBrazil2026-04-13Chemel, James L Cpa RENEWAL45Stephen Shaw
1012Wickens NestleArgentina2026-04-21Feltz Printing Service NEW16Stephen Shaw
1013Ivar PaprockiGermany2026-04-28Buckley Miller Wright NEW21Ioni Bowcher
1014Tony FollerGermany2026-04-23Chapman, Ross E Esq RENEWAL41Amy Elsner
1015Juan WieserCanada2026-04-14Rousseaux, Michael Esq UNQUALIFIED32Xuxue Feng
1016James ButtRussia2026-04-23Morlong Associates NEGOTIATION75Elwin Sharvill
1017Julie StensethRussia2026-04-29Printing Dimensions RENEWAL94Amy Elsner
1018Munro FerenczSpain2026-04-30Benton, John B Jr RENEWAL30Onyama Limba
1019Salvatore StockhamAustralia2026-05-08Dorl, James J Esq UNQUALIFIED7Anna Fali
1020Aditya KuskoAustralia2026-04-23Rousseaux, Michael Esq QUALIFIED59Stephen Shaw
1021Leja CaldareraUnited Kingdom2026-04-14Truhlar And Truhlar Attys NEGOTIATION93Anna Fali
1022Cody SaylorsGermany2026-04-20Truhlar And Truhlar Attys NEW50Amy Elsner
1023Mujtaba NickaBrazil2026-04-17Chemel, James L Cpa RENEWAL90Ivan Magalhaes
1024Francesco ShinkoRussia2026-05-08Feltz Printing Service UNQUALIFIED69Stephen Shaw
1025Aditya KuskoUnited Kingdom2026-04-30Dorl, James J Esq UNQUALIFIED31Elwin Sharvill
1026Alejandro PerinArgentina2026-04-27Feiner Bros PROPOSAL12Bernardo Dominic
1027Chavez BriddickItaly2026-04-14Commercial Press UNQUALIFIED41Xuxue Feng
1028Maisha RulapaughItaly2026-05-06Buckley Miller Wright QUALIFIED29Ioni Bowcher
1029Maria MarrierArgentina2026-05-01Feiner Bros UNQUALIFIED15Anna Fali
1030Aruna FigeroaUnited Kingdom2026-04-19Chapman, Ross E Esq PROPOSAL89Amy Elsner
1031Johnson SergiArgentina2026-05-10Dorl, James J Esq NEGOTIATION66Xuxue Feng
1032Silvio SlusarskiItaly2026-05-11Printing Dimensions NEGOTIATION60Amy Elsner
1033Sinclair WaycottAustralia2026-05-10Rangoni Of Florence PROPOSAL93Ioni Bowcher
1034Faith GillianAustralia2026-04-13Chemel, James L Cpa NEW12Xuxue Feng
1035James ButtSpain2026-05-07Morlong Associates NEW43Anna Fali
1036Octavia MaletArgentina2026-04-29Chapman, Ross E Esq NEW54Ivan Magalhaes
1037Greenwood BologniaIndia2026-04-26Feiner Bros NEGOTIATION44Stephen Shaw
1038Jeanfrancois VenereBrazil2026-05-11Feiner Bros NEGOTIATION79Stephen Shaw
1039Mayumi KolmetzGermany2026-04-12Morlong Associates PROPOSAL44Ivan Magalhaes
1040Murillo MaletItaly2026-04-28Buckley Miller Wright QUALIFIED91Bernardo Dominic
1041Misaki RoysterItaly2026-04-24Feiner Bros NEW31Ivan Magalhaes
1042Kaitlin OstroskyGermany2026-04-14Rousseaux, Michael Esq QUALIFIED30Amy Elsner
1043Wickens NestleRussia2026-05-09Rangoni Of Florence UNQUALIFIED48Elwin Sharvill
1044Rodrigues CampainUnited Kingdom2026-05-02Feltz Printing Service QUALIFIED24Bernardo Dominic
1045Clifford RimFrance2026-05-07Commercial Press QUALIFIED34Asiya Javayant
1046Julie StensethAustralia2026-04-15Benton, John B Jr NEW41Stephen Shaw
1047Mujtaba NickaJapan2026-04-25King, Christopher A Esq NEW55Anna Fali
1048Rodrigues CampainIndia2026-05-05Commercial Press NEW73Xuxue Feng
1049Antonio CaudyItaly2026-05-07Commercial Press PROPOSAL42Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Morrow RutaItalyAmy Elsner UNQUALIFIED
Ivar PaprockiIndiaAnna Fali NEGOTIATION
Darci PoquetteRussiaBernardo Dominic UNQUALIFIED
Rodrigues CampainCanadaOnyama Limba UNQUALIFIED
Adams MorascaJapanAnna Fali QUALIFIED
Misaki RoysterItalyIvan Magalhaes NEW
Jennifer AmigonJapanAsiya Javayant QUALIFIED
Morrow RutaUnited KingdomAsiya Javayant PROPOSAL
Emily WhobreyBrazilAmy Elsner RENEWAL
Costa DilliardGermanyAnna Fali UNQUALIFIED
Munro FerenczJapanAnna Fali NEGOTIATION
Silvio SlusarskiRussiaBernardo Dominic NEW
Ivar PaprockiCanadaAnna Fali NEGOTIATION
Silvio SlusarskiArgentinaElwin Sharvill RENEWAL
Leja CaldareraItalyXuxue Feng PROPOSAL
Darci PoquetteCanadaIoni Bowcher NEW
Faith GillianItalyElwin Sharvill NEGOTIATION
Maisha RulapaughGermanyIoni Bowcher NEGOTIATION
Aika InouyeRussiaIoni Bowcher NEGOTIATION
Ricardo GauchoGermanyStephen Shaw UNQUALIFIED
Salvatore StockhamItalyAsiya Javayant RENEWAL
Izzy GarufiGermanyAsiya Javayant RENEWAL
Faith GillianAustraliaBernardo Dominic NEW
Aditya KuskoArgentinaAsiya Javayant NEGOTIATION
Jeanfrancois VenereUnited KingdomAsiya Javayant RENEWAL
Rodrigues CampainJapanElwin Sharvill UNQUALIFIED
Aruna FigeroaCanadaAmy Elsner NEGOTIATION
Smith GlickBrazilAsiya Javayant PROPOSAL
Juan WieserFranceBernardo Dominic UNQUALIFIED
Maria MarrierIndiaBernardo Dominic PROPOSAL
Izzy GarufiRussiaIvan Magalhaes NEGOTIATION
Francesco ShinkoFranceAsiya Javayant QUALIFIED
Johnson SergiJapanIvan Magalhaes UNQUALIFIED
Stacey MacleadItalyAsiya Javayant NEGOTIATION
Jones VocelkaAustraliaAsiya Javayant NEGOTIATION
Octavia MaletAustraliaAsiya Javayant NEGOTIATION
Adams MorascaFranceElwin Sharvill NEW
Francesco ShinkoArgentinaAnna Fali NEW
Ricardo GauchoUnited KingdomElwin Sharvill QUALIFIED
Munro FerenczSpainStephen Shaw UNQUALIFIED
Nicolas IturbideArgentinaAsiya Javayant NEW
Rodrigues CampainUnited KingdomStephen Shaw QUALIFIED
Ashley DoeIndiaAnna Fali UNQUALIFIED
Tony FollerIndiaElwin Sharvill NEW
Clifford RimCanadaOnyama Limba RENEWAL
Ivar PaprockiJapanAsiya Javayant NEW
Murillo MaletSpainIoni Bowcher RENEWAL
Deepesh ChuiIndiaAmy Elsner QUALIFIED
Emily WhobreyRussiaAmy Elsner NEGOTIATION
Maria MarrierIndiaAmy Elsner UNQUALIFIED
Frozen Columns
Name
Rodrigues Campain
Clifford Rim
Antonio Caudy
Alejandro Perin
Arvin Albares
Octavia Malet
Sinclair Waycott
Julie Stenseth
Silvio Slusarski
Faith Gillian
Julie Stenseth
Sinclair Waycott
Wickens Nestle
Silvio Slusarski
Deepesh Chui
Ivar Paprocki
David Darakjy
Claire Tollner
James Butt
Cody Saylors
Arvin Albares
Arvin Albares
Morrow Ruta
Salvatore Stockham
Misaki Royster
Leja Caldarera
Murillo Malet
Munro Ferencz
Adams Morasca
Juan Wieser
Ricardo Gaucho
Leon Oldroyd
Aika Inouye
Munro Ferencz
Octavia Malet
Emily Whobrey
Nicolas Iturbide
Silvio Slusarski
Rodrigues Campain
Maisha Rulapaugh
Costa Dilliard
Sinclair Waycott
Stacey Maclead
James Butt
Isabel Bowley
Juan Wieser
Wickens Nestle
Johnson Sergi
Aruna Figeroa
Stacey Maclead
IdCountryDate
1000United Kingdom2026-05-08
1001United Kingdom2026-05-04
1002Brazil2026-04-24
1003Italy2026-04-19
1004India2026-04-20
1005France2026-04-19
1006Germany2026-05-03
1007Spain2026-04-21
1008Spain2026-04-24
1009Australia2026-04-21
1010Italy2026-05-06
1011India2026-04-21
1012Italy2026-04-24
1013Brazil2026-05-09
1014Spain2026-05-04
1015Australia2026-05-09
1016Russia2026-05-07
1017Brazil2026-04-23
1018Australia2026-05-03
1019Brazil2026-05-01
1020Brazil2026-04-19
1021Australia2026-04-23
1022Japan2026-05-02
1023India2026-04-12
1024Brazil2026-04-21
1025Italy2026-05-02
1026Canada2026-05-03
1027Spain2026-04-14
1028Germany2026-05-10
1029Australia2026-04-28
1030France2026-04-26
1031Japan2026-05-01
1032Russia2026-04-26
1033United Kingdom2026-04-16
1034Brazil2026-04-17
1035Brazil2026-05-08
1036France2026-04-16
1037Canada2026-04-16
1038Australia2026-04-24
1039India2026-05-04
1040Australia2026-04-15
1041Argentina2026-04-18
1042Japan2026-04-15
1043Russia2026-04-17
1044Russia2026-04-12
1045Russia2026-04-16
1046Russia2026-05-10
1047Spain2026-05-03
1048Germany2026-05-05
1049Italy2026-05-03

On-Demand Data

NameIdCountryDate
Claire Tollner1000Japan2026-05-01
Mayumi Kolmetz1001Argentina2026-04-21
James Butt1002Japan2026-04-30
Antonio Caudy1003Spain2026-05-10
Misaki Royster1004France2026-05-07
Aika Inouye1005Japan2026-04-16
Jones Vocelka1006Spain2026-04-26
Greenwood Bolognia1007United Kingdom2026-04-12
Mujtaba Nicka1008France2026-05-01
Jeanfrancois Venere1009United Kingdom2026-05-05
Kaitlin Ostrosky1010France2026-04-15
Rodrigues Campain1011Australia2026-04-23
Leon Oldroyd1012Spain2026-05-10
Munro Ferencz1013Brazil2026-04-26
Jones Vocelka1014Australia2026-04-13
Kadeem Flosi1015Italy2026-05-04
Mujtaba Nicka1016Argentina2026-04-12
Clifford Rim1017Italy2026-05-06
Chavez Briddick1018Brazil2026-04-28
Kadeem Flosi1019Italy2026-04-30
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Deepesh ChuiGermanyOnyama Limba QUALIFIED
Ivar PaprockiJapanAmy Elsner PROPOSAL
Jones VocelkaItalyAnna Fali UNQUALIFIED
Cody SaylorsIndiaElwin Sharvill NEW
Munro FerenczFranceBernardo Dominic UNQUALIFIED
David DarakjyRussiaOnyama Limba RENEWAL
Alejandro PerinCanadaElwin Sharvill QUALIFIED
Leja CaldareraGermanyElwin Sharvill NEGOTIATION
Alejandro PerinRussiaOnyama Limba NEGOTIATION
Aruna FigeroaUnited KingdomElwin Sharvill NEGOTIATION
Maria MarrierCanadaElwin Sharvill PROPOSAL
Maria MarrierRussiaIoni Bowcher RENEWAL
Jones VocelkaBrazilXuxue Feng UNQUALIFIED
Silvio SlusarskiItalyAmy Elsner NEW
Jefferson SchemmerCanadaBernardo Dominic NEW
David DarakjyCanadaXuxue Feng RENEWAL
Greenwood BologniaRussiaStephen Shaw NEW
Cody SaylorsBrazilAnna Fali QUALIFIED
Jefferson SchemmerSpainIvan Magalhaes NEW
Rodrigues CampainFranceBernardo Dominic UNQUALIFIED
Johnson SergiRussiaXuxue Feng NEGOTIATION
Munro FerenczUnited KingdomOnyama Limba NEGOTIATION
Kaitlin OstroskyRussiaIvan Magalhaes QUALIFIED
Ivar PaprockiArgentinaStephen Shaw UNQUALIFIED
Stacey MacleadFranceElwin Sharvill QUALIFIED
Sinclair WaycottFranceElwin Sharvill PROPOSAL
Antonio CaudySpainElwin Sharvill QUALIFIED
Nicolas IturbideIndiaOnyama Limba PROPOSAL
Mujtaba NickaBrazilStephen Shaw UNQUALIFIED
Stacey MacleadUnited KingdomElwin Sharvill NEW
Arvin AlbaresItalyOnyama Limba NEGOTIATION
Jefferson SchemmerRussiaBernardo Dominic QUALIFIED
Kaitlin OstroskyRussiaAnna Fali RENEWAL
Costa DilliardAustraliaOnyama Limba PROPOSAL
Greenwood BologniaJapanXuxue Feng RENEWAL
Mujtaba NickaSpainElwin Sharvill RENEWAL
Adams MorascaAustraliaAnna Fali NEW
Mujtaba NickaItalyBernardo Dominic NEW
James ButtArgentinaBernardo Dominic RENEWAL
Julie StensethArgentinaAsiya Javayant 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>