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 UNQUALIFIED
Jennifer AmigonRussiaAmy Elsner RENEWAL
Darci PoquetteFranceAsiya Javayant RENEWAL
James ButtUnited KingdomIoni Bowcher NEGOTIATION
Greenwood BologniaGermanyAnna Fali NEW
Murillo MaletUnited KingdomIoni Bowcher UNQUALIFIED
Stacey MacleadItalyBernardo Dominic RENEWAL
Adams MorascaRussiaIvan Magalhaes NEGOTIATION
Aruna FigeroaUnited KingdomElwin Sharvill RENEWAL
Jefferson SchemmerArgentinaAnna Fali NEW
Claire TollnerFranceBernardo Dominic RENEWAL
Ashley DoeCanadaBernardo Dominic NEW
Leja CaldareraSpainAsiya Javayant RENEWAL
Octavia MaletUnited KingdomAmy Elsner NEGOTIATION
Costa DilliardSpainAmy Elsner NEW
Greenwood BologniaUnited KingdomIvan Magalhaes QUALIFIED
Claire TollnerArgentinaIoni Bowcher NEGOTIATION
Darci PoquetteAustraliaIvan Magalhaes NEGOTIATION
Maisha RulapaughItalyXuxue Feng QUALIFIED
Kaitlin OstroskyRussiaIvan Magalhaes NEGOTIATION
Smith GlickArgentinaAnna Fali NEW
Francesco ShinkoSpainBernardo Dominic UNQUALIFIED
Claire TollnerBrazilXuxue Feng PROPOSAL
Aruna FigeroaAustraliaOnyama Limba NEW
Mayumi KolmetzItalyIvan Magalhaes NEGOTIATION
Salvatore StockhamCanadaXuxue Feng UNQUALIFIED
Aika InouyeJapanBernardo Dominic NEGOTIATION
Munro FerenczArgentinaBernardo Dominic QUALIFIED
Emily WhobreyUnited KingdomStephen Shaw RENEWAL
Wickens NestleBrazilAsiya Javayant UNQUALIFIED
Jeanfrancois VenereFranceAnna Fali NEGOTIATION
Antonio CaudyCanadaIvan Magalhaes UNQUALIFIED
David DarakjyJapanIoni Bowcher PROPOSAL
Aruna FigeroaCanadaXuxue Feng NEW
Chavez BriddickItalyAnna Fali QUALIFIED
Jeanfrancois VenereBrazilAmy Elsner PROPOSAL
Rodrigues CampainRussiaXuxue Feng NEW
Rodrigues CampainArgentinaBernardo Dominic UNQUALIFIED
Kaitlin OstroskyArgentinaAnna Fali RENEWAL
Jennifer AmigonSpainBernardo Dominic NEGOTIATION
Aruna FigeroaRussiaAsiya Javayant NEGOTIATION
Wickens NestleJapanAnna Fali RENEWAL
Leon OldroydCanadaBernardo Dominic RENEWAL
Mayumi KolmetzFranceAsiya Javayant UNQUALIFIED
Murillo MaletCanadaIvan Magalhaes RENEWAL
Ashley DoeCanadaIvan Magalhaes PROPOSAL
Jeanfrancois VenereIndiaAmy Elsner RENEWAL
Ivar PaprockiFranceAmy Elsner NEGOTIATION
Nicolas IturbideJapanOnyama Limba NEGOTIATION
Jones VocelkaFranceStephen Shaw PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Adams MorascaFranceBernardo Dominic UNQUALIFIED
Costa DilliardArgentinaIoni Bowcher PROPOSAL
Ricardo GauchoGermanyIvan Magalhaes NEW
Greenwood BologniaUnited KingdomIoni Bowcher PROPOSAL
Juan WieserGermanyStephen Shaw PROPOSAL
Claire TollnerAustraliaAnna Fali RENEWAL
Octavia MaletIndiaOnyama Limba PROPOSAL
Deepesh ChuiGermanyAsiya Javayant UNQUALIFIED
Francesco ShinkoBrazilAnna Fali NEW
Jones VocelkaAustraliaIvan Magalhaes NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Sinclair WaycottCanada2025-08-19King, Christopher A Esq UNQUALIFIED79Anna Fali
1001Nicolas IturbideJapan2025-08-12Commercial Press UNQUALIFIED7Anna Fali
1002Ricardo GauchoIndia2025-08-16Buckley Miller Wright QUALIFIED50Xuxue Feng
1003Munro FerenczBrazil2025-09-03Dorl, James J Esq NEGOTIATION43Elwin Sharvill
1004Ricardo GauchoAustralia2025-08-25Commercial Press NEW4Xuxue Feng
1005David DarakjyFrance2025-08-28Benton, John B Jr NEW65Bernardo Dominic
1006Kaitlin OstroskySpain2025-08-18Printing Dimensions NEW51Elwin Sharvill
1007Salvatore StockhamArgentina2025-08-31Rousseaux, Michael Esq NEGOTIATION17Asiya Javayant
1008Stacey MacleadRussia2025-08-28Morlong Associates PROPOSAL85Bernardo Dominic
1009Sinclair WaycottSpain2025-08-06Rangoni Of Florence QUALIFIED87Ivan Magalhaes
1010Nicolas IturbideCanada2025-08-23Chapman, Ross E Esq RENEWAL14Stephen Shaw
1011Julie StensethUnited Kingdom2025-08-16Feltz Printing Service PROPOSAL92Stephen Shaw
1012Aruna FigeroaUnited Kingdom2025-08-12Morlong Associates NEW98Ioni Bowcher
1013Nicolas IturbideItaly2025-09-01King, Christopher A Esq NEGOTIATION68Asiya Javayant
1014Salvatore StockhamFrance2025-08-27Truhlar And Truhlar Attys QUALIFIED27Anna Fali
1015Alejandro PerinRussia2025-08-15Dorl, James J Esq NEGOTIATION16Onyama Limba
1016Jennifer AmigonGermany2025-08-18Chanay, Jeffrey A Esq NEW54Amy Elsner
1017Kadeem FlosiRussia2025-08-22Printing Dimensions UNQUALIFIED91Asiya Javayant
1018Chavez BriddickArgentina2025-08-05Rousseaux, Michael Esq QUALIFIED30Elwin Sharvill
1019Stacey MacleadBrazil2025-08-18Morlong Associates RENEWAL0Bernardo Dominic
1020Julie StensethJapan2025-08-18Chanay, Jeffrey A Esq PROPOSAL31Ivan Magalhaes
1021Johnson SergiRussia2025-08-11Feiner Bros NEGOTIATION99Bernardo Dominic
1022Clifford RimUnited Kingdom2025-08-21Morlong Associates PROPOSAL59Bernardo Dominic
1023Murillo MaletAustralia2025-08-24Feltz Printing Service UNQUALIFIED13Asiya Javayant
1024Murillo MaletGermany2025-08-24Buckley Miller Wright NEW33Ivan Magalhaes
1025Leja CaldareraBrazil2025-08-24Commercial Press QUALIFIED25Xuxue Feng
1026Mujtaba NickaGermany2025-09-03Commercial Press PROPOSAL46Stephen Shaw
1027James ButtArgentina2025-08-06Rousseaux, Michael Esq NEGOTIATION6Onyama Limba
1028Jones VocelkaArgentina2025-08-13Rangoni Of Florence NEW57Bernardo Dominic
1029Kaitlin OstroskyItaly2025-08-23Chapman, Ross E Esq NEW71Asiya Javayant
1030Munro FerenczGermany2025-08-28Buckley Miller Wright UNQUALIFIED20Asiya Javayant
1031Cody SaylorsItaly2025-09-02Feiner Bros NEW30Stephen Shaw
1032Jones VocelkaCanada2025-08-27Feltz Printing Service UNQUALIFIED71Anna Fali
1033Juan WieserArgentina2025-08-20Commercial Press RENEWAL40Xuxue Feng
1034Smith GlickFrance2025-08-10Commercial Press RENEWAL54Stephen Shaw
1035Aditya KuskoItaly2025-08-14Benton, John B Jr NEW5Ioni Bowcher
1036Mayumi KolmetzAustralia2025-08-14Printing Dimensions NEW88Amy Elsner
1037Adams MorascaFrance2025-08-22Morlong Associates NEGOTIATION50Ioni Bowcher
1038Clifford RimBrazil2025-08-29Commercial Press NEGOTIATION70Amy Elsner
1039Costa DilliardBrazil2025-08-26Rangoni Of Florence QUALIFIED31Xuxue Feng
1040Clifford RimItaly2025-08-28King, Christopher A Esq UNQUALIFIED82Stephen Shaw
1041Claire TollnerFrance2025-08-24Feiner Bros PROPOSAL74Stephen Shaw
1042Rodrigues CampainCanada2025-08-11Printing Dimensions NEGOTIATION45Anna Fali
1043Ricardo GauchoArgentina2025-08-16Rousseaux, Michael Esq QUALIFIED3Xuxue Feng
1044Murillo MaletUnited Kingdom2025-08-29Truhlar And Truhlar Attys RENEWAL32Ivan Magalhaes
1045David DarakjyUnited Kingdom2025-08-14Morlong Associates UNQUALIFIED76Asiya Javayant
1046Jefferson SchemmerBrazil2025-08-11Benton, John B Jr NEGOTIATION69Anna Fali
1047David DarakjyGermany2025-08-09Printing Dimensions NEGOTIATION52Bernardo Dominic
1048Munro FerenczIndia2025-08-14King, Christopher A Esq NEGOTIATION90Elwin Sharvill
1049Leja CaldareraIndia2025-08-15Rangoni Of Florence UNQUALIFIED64Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Aruna FigeroaSpainXuxue Feng RENEWAL
Deepesh ChuiCanadaAsiya Javayant PROPOSAL
Octavia MaletSpainIvan Magalhaes RENEWAL
Aika InouyeIndiaXuxue Feng UNQUALIFIED
Wickens NestleCanadaIoni Bowcher NEGOTIATION
Kaitlin OstroskyAustraliaAsiya Javayant QUALIFIED
Johnson SergiArgentinaIvan Magalhaes NEW
Antonio CaudyFranceIoni Bowcher NEW
Aditya KuskoIndiaIvan Magalhaes RENEWAL
Munro FerenczArgentinaAmy Elsner UNQUALIFIED
Aika InouyeBrazilElwin Sharvill NEGOTIATION
Alejandro PerinFranceAnna Fali PROPOSAL
Stacey MacleadJapanAnna Fali RENEWAL
Kaitlin OstroskyBrazilAsiya Javayant NEW
Jones VocelkaIndiaStephen Shaw NEGOTIATION
Jeanfrancois VenereJapanBernardo Dominic UNQUALIFIED
Darci PoquetteAustraliaStephen Shaw UNQUALIFIED
Adams MorascaIndiaBernardo Dominic RENEWAL
Clifford RimUnited KingdomIvan Magalhaes NEGOTIATION
Greenwood BologniaGermanyBernardo Dominic RENEWAL
Morrow RutaCanadaAsiya Javayant RENEWAL
Ashley DoeCanadaXuxue Feng QUALIFIED
Claire TollnerRussiaIvan Magalhaes NEW
Darci PoquetteCanadaIoni Bowcher RENEWAL
Murillo MaletBrazilXuxue Feng QUALIFIED
Jennifer AmigonCanadaStephen Shaw RENEWAL
Mayumi KolmetzBrazilOnyama Limba PROPOSAL
Isabel BowleyAustraliaAsiya Javayant NEW
Emily WhobreyUnited KingdomElwin Sharvill QUALIFIED
Clifford RimGermanyXuxue Feng QUALIFIED
Ashley DoeIndiaAmy Elsner UNQUALIFIED
Salvatore StockhamArgentinaAmy Elsner UNQUALIFIED
Izzy GarufiUnited KingdomOnyama Limba QUALIFIED
Jennifer AmigonFranceStephen Shaw UNQUALIFIED
Deepesh ChuiCanadaAmy Elsner UNQUALIFIED
Claire TollnerItalyAsiya Javayant UNQUALIFIED
Rodrigues CampainUnited KingdomXuxue Feng RENEWAL
Juan WieserIndiaBernardo Dominic PROPOSAL
Sinclair WaycottBrazilElwin Sharvill RENEWAL
Claire TollnerRussiaAmy Elsner UNQUALIFIED
Maria MarrierBrazilAmy Elsner PROPOSAL
Octavia MaletFranceStephen Shaw RENEWAL
Jeanfrancois VenereRussiaElwin Sharvill RENEWAL
Cody SaylorsItalyElwin Sharvill UNQUALIFIED
Kadeem FlosiRussiaBernardo Dominic QUALIFIED
Claire TollnerGermanyIoni Bowcher RENEWAL
Faith GillianUnited KingdomAmy Elsner RENEWAL
Rodrigues CampainUnited KingdomAnna Fali RENEWAL
Jeanfrancois VenereArgentinaAmy Elsner PROPOSAL
Johnson SergiCanadaAnna Fali UNQUALIFIED
Frozen Columns
Name
Salvatore Stockham
Alejandro Perin
Darci Poquette
Stacey Maclead
Costa Dilliard
Costa Dilliard
Leon Oldroyd
Tony Foller
Aditya Kusko
Munro Ferencz
Jefferson Schemmer
Munro Ferencz
Rodrigues Campain
Ricardo Gaucho
Julie Stenseth
Costa Dilliard
Adams Morasca
Jennifer Amigon
Greenwood Bolognia
Juan Wieser
Cody Saylors
Clifford Rim
Chavez Briddick
Clifford Rim
Smith Glick
Antonio Caudy
Ivar Paprocki
Maria Marrier
Cody Saylors
Smith Glick
Isabel Bowley
Clifford Rim
Silvio Slusarski
Johnson Sergi
Aditya Kusko
Smith Glick
Francesco Shinko
Leon Oldroyd
Kadeem Flosi
Silvio Slusarski
Isabel Bowley
Isabel Bowley
Misaki Royster
Greenwood Bolognia
Jennifer Amigon
Isabel Bowley
Isabel Bowley
Octavia Malet
Stacey Maclead
Francesco Shinko
IdCountryDate
1000United Kingdom2025-08-12
1001Germany2025-08-15
1002Russia2025-08-29
1003Australia2025-08-12
1004Russia2025-08-10
1005United Kingdom2025-08-06
1006Germany2025-08-13
1007Argentina2025-08-24
1008United Kingdom2025-08-27
1009Germany2025-08-27
1010India2025-08-27
1011India2025-08-29
1012Spain2025-08-22
1013Brazil2025-08-11
1014Russia2025-08-31
1015Russia2025-08-26
1016Russia2025-08-19
1017Japan2025-08-17
1018Japan2025-09-01
1019Argentina2025-08-19
1020Spain2025-08-05
1021United Kingdom2025-08-31
1022Japan2025-08-31
1023Spain2025-08-16
1024India2025-08-19
1025Canada2025-08-06
1026Spain2025-08-20
1027France2025-08-10
1028France2025-08-24
1029United Kingdom2025-08-11
1030Argentina2025-08-14
1031Australia2025-08-28
1032Argentina2025-08-21
1033Argentina2025-08-18
1034Italy2025-09-01
1035Japan2025-08-15
1036Canada2025-08-22
1037Canada2025-08-18
1038Canada2025-08-26
1039Russia2025-08-27
1040India2025-08-07
1041Russia2025-08-12
1042France2025-08-22
1043United Kingdom2025-08-28
1044France2025-08-07
1045Brazil2025-08-06
1046Canada2025-08-16
1047Australia2025-09-03
1048Spain2025-08-25
1049Russia2025-08-31

On-Demand Data

NameIdCountryDate
Misaki Royster1000Russia2025-08-05
Mujtaba Nicka1001Australia2025-08-05
Stacey Maclead1002United Kingdom2025-08-26
Misaki Royster1003Australia2025-08-31
Kadeem Flosi1004Brazil2025-08-17
Wickens Nestle1005Australia2025-08-30
Greenwood Bolognia1006Japan2025-08-17
Chavez Briddick1007Spain2025-08-29
Mujtaba Nicka1008India2025-08-25
Costa Dilliard1009France2025-08-16
Ricardo Gaucho1010United Kingdom2025-08-25
Johnson Sergi1011Italy2025-09-01
Claire Tollner1012Brazil2025-08-13
Cody Saylors1013Brazil2025-08-19
Jeanfrancois Venere1014Japan2025-08-27
Juan Wieser1015Russia2025-08-11
Darci Poquette1016Argentina2025-08-05
Silvio Slusarski1017Australia2025-08-20
Wickens Nestle1018Germany2025-08-18
Costa Dilliard1019Germany2025-08-21
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Juan WieserCanadaAmy Elsner PROPOSAL
Arvin AlbaresItalyAnna Fali UNQUALIFIED
Mujtaba NickaArgentinaIoni Bowcher QUALIFIED
Darci PoquetteAustraliaIoni Bowcher RENEWAL
Francesco ShinkoGermanyOnyama Limba QUALIFIED
Murillo MaletSpainIvan Magalhaes QUALIFIED
Silvio SlusarskiCanadaAmy Elsner UNQUALIFIED
Francesco ShinkoItalyAnna Fali RENEWAL
Adams MorascaAustraliaAsiya Javayant RENEWAL
Octavia MaletItalyStephen Shaw RENEWAL
Stacey MacleadArgentinaOnyama Limba QUALIFIED
Greenwood BologniaGermanyAsiya Javayant UNQUALIFIED
Darci PoquetteGermanyAsiya Javayant RENEWAL
Ivar PaprockiGermanyElwin Sharvill PROPOSAL
Wickens NestleUnited KingdomAmy Elsner QUALIFIED
James ButtSpainAsiya Javayant NEW
Stacey MacleadAustraliaBernardo Dominic QUALIFIED
Aditya KuskoIndiaElwin Sharvill UNQUALIFIED
Maisha RulapaughRussiaIoni Bowcher NEGOTIATION
Alejandro PerinSpainAnna Fali NEW
Isabel BowleyGermanyElwin Sharvill PROPOSAL
Tony FollerBrazilBernardo Dominic RENEWAL
Mujtaba NickaUnited KingdomOnyama Limba RENEWAL
Ricardo GauchoItalyOnyama Limba NEW
Jefferson SchemmerGermanyIvan Magalhaes PROPOSAL
Isabel BowleyJapanIoni Bowcher NEGOTIATION
Jefferson SchemmerIndiaOnyama Limba NEGOTIATION
Munro FerenczAustraliaAnna Fali PROPOSAL
Costa DilliardItalyAsiya Javayant RENEWAL
Kaitlin OstroskyItalyXuxue Feng NEW
Leon OldroydBrazilAsiya Javayant NEGOTIATION
Stacey MacleadJapanElwin Sharvill NEGOTIATION
Johnson SergiFranceIvan Magalhaes UNQUALIFIED
Octavia MaletUnited KingdomIoni Bowcher NEW
Chavez BriddickArgentinaAnna Fali UNQUALIFIED
Salvatore StockhamAustraliaIoni Bowcher NEW
Salvatore StockhamRussiaAnna Fali NEW
Aika InouyeJapanIvan Magalhaes NEW
Juan WieserUnited KingdomAsiya Javayant PROPOSAL
Nicolas IturbideUnited KingdomIvan Magalhaes 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>