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
Aruna FigeroaCanadaIvan Magalhaes PROPOSAL
Arvin AlbaresAustraliaAnna Fali NEW
Wickens NestleSpainAnna Fali QUALIFIED
Ricardo GauchoAustraliaXuxue Feng RENEWAL
Tony FollerGermanyAnna Fali NEW
Greenwood BologniaFranceAmy Elsner QUALIFIED
Nicolas IturbideGermanyElwin Sharvill PROPOSAL
Mujtaba NickaGermanyAmy Elsner PROPOSAL
Maisha RulapaughRussiaAmy Elsner NEW
Ivar PaprockiSpainElwin Sharvill PROPOSAL
Costa DilliardArgentinaElwin Sharvill PROPOSAL
Salvatore StockhamFranceIvan Magalhaes QUALIFIED
Darci PoquetteUnited KingdomAmy Elsner PROPOSAL
Darci PoquetteJapanIvan Magalhaes QUALIFIED
Mayumi KolmetzAustraliaElwin Sharvill UNQUALIFIED
Kadeem FlosiAustraliaStephen Shaw NEGOTIATION
Smith GlickSpainIoni Bowcher PROPOSAL
Adams MorascaCanadaAmy Elsner UNQUALIFIED
Mujtaba NickaRussiaXuxue Feng UNQUALIFIED
Morrow RutaAustraliaStephen Shaw RENEWAL
Sinclair WaycottArgentinaStephen Shaw PROPOSAL
Darci PoquetteFranceAnna Fali PROPOSAL
Antonio CaudyUnited KingdomXuxue Feng PROPOSAL
Ivar PaprockiBrazilOnyama Limba RENEWAL
Kaitlin OstroskyItalyAnna Fali UNQUALIFIED
Juan WieserArgentinaAsiya Javayant NEGOTIATION
Kaitlin OstroskyArgentinaElwin Sharvill RENEWAL
Misaki RoysterUnited KingdomElwin Sharvill QUALIFIED
Alejandro PerinItalyIoni Bowcher QUALIFIED
Morrow RutaBrazilBernardo Dominic RENEWAL
Wickens NestleIndiaOnyama Limba UNQUALIFIED
Deepesh ChuiSpainXuxue Feng NEGOTIATION
Morrow RutaFranceIoni Bowcher PROPOSAL
Stacey MacleadGermanyElwin Sharvill PROPOSAL
Rodrigues CampainArgentinaAmy Elsner RENEWAL
Emily WhobreyGermanyStephen Shaw RENEWAL
Greenwood BologniaIndiaXuxue Feng RENEWAL
Darci PoquetteGermanyOnyama Limba NEGOTIATION
Jefferson SchemmerJapanXuxue Feng QUALIFIED
Mayumi KolmetzItalyAmy Elsner PROPOSAL
Sinclair WaycottItalyBernardo Dominic NEW
Jefferson SchemmerJapanAnna Fali UNQUALIFIED
Mujtaba NickaJapanAnna Fali PROPOSAL
Salvatore StockhamBrazilAnna Fali NEGOTIATION
Izzy GarufiCanadaAmy Elsner RENEWAL
Smith GlickFranceIvan Magalhaes RENEWAL
Leon OldroydIndiaXuxue Feng NEGOTIATION
James ButtCanadaIvan Magalhaes NEW
Ricardo GauchoCanadaIoni Bowcher UNQUALIFIED
Ivar PaprockiFranceIvan Magalhaes PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Jones VocelkaAustraliaIvan Magalhaes UNQUALIFIED
Salvatore StockhamGermanyOnyama Limba RENEWAL
Morrow RutaGermanyElwin Sharvill RENEWAL
Nicolas IturbideAustraliaBernardo Dominic QUALIFIED
Francesco ShinkoFranceIoni Bowcher RENEWAL
Ricardo GauchoSpainBernardo Dominic NEW
Leon OldroydItalyIoni Bowcher NEGOTIATION
Greenwood BologniaAustraliaElwin Sharvill NEGOTIATION
Johnson SergiAustraliaBernardo Dominic RENEWAL
Jefferson SchemmerCanadaOnyama Limba RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Ashley DoeGermany2026-05-11Chemel, James L Cpa UNQUALIFIED51Xuxue Feng
1001Juan WieserIndia2026-05-26Commercial Press UNQUALIFIED38Onyama Limba
1002Greenwood BologniaAustralia2026-05-26Printing Dimensions NEW28Xuxue Feng
1003Mujtaba NickaRussia2026-05-17Rangoni Of Florence RENEWAL15Ivan Magalhaes
1004Jeanfrancois VenereAustralia2026-05-20Buckley Miller Wright PROPOSAL40Onyama Limba
1005Silvio SlusarskiItaly2026-04-30Chanay, Jeffrey A Esq QUALIFIED73Amy Elsner
1006Emily WhobreyGermany2026-05-22Chapman, Ross E Esq RENEWAL47Bernardo Dominic
1007Aruna FigeroaFrance2026-05-21King, Christopher A Esq RENEWAL33Ioni Bowcher
1008Sinclair WaycottUnited Kingdom2026-05-26Dorl, James J Esq NEW89Amy Elsner
1009Deepesh ChuiItaly2026-05-23Buckley Miller Wright NEW40Bernardo Dominic
1010David DarakjyBrazil2026-05-18Feiner Bros RENEWAL29Xuxue Feng
1011Mayumi KolmetzSpain2026-05-24Printing Dimensions UNQUALIFIED47Bernardo Dominic
1012Claire TollnerGermany2026-05-15Printing Dimensions NEW88Ioni Bowcher
1013Johnson SergiCanada2026-05-11Chanay, Jeffrey A Esq RENEWAL62Anna Fali
1014Darci PoquetteIndia2026-05-19Feiner Bros NEW47Asiya Javayant
1015Wickens NestleUnited Kingdom2026-05-14King, Christopher A Esq QUALIFIED58Stephen Shaw
1016Isabel BowleyJapan2026-05-01King, Christopher A Esq RENEWAL16Asiya Javayant
1017James ButtIndia2026-05-23King, Christopher A Esq NEW86Ivan Magalhaes
1018Deepesh ChuiFrance2026-05-20Benton, John B Jr NEGOTIATION27Ioni Bowcher
1019Morrow RutaFrance2026-05-22King, Christopher A Esq UNQUALIFIED42Ivan Magalhaes
1020Jeanfrancois VenereIndia2026-05-13Rousseaux, Michael Esq PROPOSAL13Amy Elsner
1021Juan WieserRussia2026-05-20Morlong Associates NEGOTIATION39Elwin Sharvill
1022Emily WhobreyBrazil2026-05-22Rousseaux, Michael Esq RENEWAL41Elwin Sharvill
1023Claire TollnerRussia2026-05-26King, Christopher A Esq QUALIFIED80Stephen Shaw
1024Greenwood BologniaSpain2026-05-16Commercial Press NEW36Stephen Shaw
1025Isabel BowleyFrance2026-04-28Buckley Miller Wright NEGOTIATION67Onyama Limba
1026Salvatore StockhamIndia2026-05-10Chanay, Jeffrey A Esq RENEWAL65Asiya Javayant
1027Leon OldroydRussia2026-05-02Dorl, James J Esq NEW53Onyama Limba
1028Costa DilliardArgentina2026-05-05Chemel, James L Cpa RENEWAL68Anna Fali
1029Nicolas IturbideSpain2026-05-19Chapman, Ross E Esq UNQUALIFIED71Ioni Bowcher
1030Morrow RutaBrazil2026-05-24Rangoni Of Florence NEW76Ivan Magalhaes
1031Aditya KuskoSpain2026-05-06Truhlar And Truhlar Attys PROPOSAL63Onyama Limba
1032Emily WhobreyFrance2026-05-16Feltz Printing Service PROPOSAL57Amy Elsner
1033Octavia MaletAustralia2026-05-04Rousseaux, Michael Esq QUALIFIED60Xuxue Feng
1034Murillo MaletUnited Kingdom2026-05-07Morlong Associates PROPOSAL65Elwin Sharvill
1035Adams MorascaIndia2026-05-11Morlong Associates UNQUALIFIED59Ivan Magalhaes
1036Octavia MaletItaly2026-05-24Printing Dimensions PROPOSAL88Amy Elsner
1037Stacey MacleadArgentina2026-04-29King, Christopher A Esq QUALIFIED67Xuxue Feng
1038Maria MarrierAustralia2026-05-06Rousseaux, Michael Esq NEW30Ivan Magalhaes
1039Greenwood BologniaSpain2026-04-30Chemel, James L Cpa RENEWAL13Asiya Javayant
1040Cody SaylorsJapan2026-05-25Chapman, Ross E Esq NEW48Stephen Shaw
1041Smith GlickUnited Kingdom2026-05-17Commercial Press QUALIFIED49Amy Elsner
1042Isabel BowleyRussia2026-05-20Chapman, Ross E Esq PROPOSAL74Stephen Shaw
1043Deepesh ChuiItaly2026-05-19Chemel, James L Cpa UNQUALIFIED51Elwin Sharvill
1044Kadeem FlosiBrazil2026-05-21Truhlar And Truhlar Attys RENEWAL37Bernardo Dominic
1045Greenwood BologniaIndia2026-05-10Printing Dimensions QUALIFIED3Xuxue Feng
1046Leon OldroydUnited Kingdom2026-05-04Chanay, Jeffrey A Esq QUALIFIED52Stephen Shaw
1047Stacey MacleadFrance2026-05-08Printing Dimensions NEW9Xuxue Feng
1048Claire TollnerFrance2026-05-12Chanay, Jeffrey A Esq QUALIFIED97Onyama Limba
1049Antonio CaudyArgentina2026-05-15Chanay, Jeffrey A Esq PROPOSAL40Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Mujtaba NickaAustraliaElwin Sharvill RENEWAL
Mujtaba NickaSpainXuxue Feng PROPOSAL
Mayumi KolmetzJapanIvan Magalhaes PROPOSAL
Rodrigues CampainCanadaAsiya Javayant NEGOTIATION
Johnson SergiItalyIvan Magalhaes UNQUALIFIED
Kaitlin OstroskyAustraliaAnna Fali NEGOTIATION
Mujtaba NickaSpainAsiya Javayant NEGOTIATION
Mujtaba NickaArgentinaIoni Bowcher UNQUALIFIED
Greenwood BologniaGermanyStephen Shaw RENEWAL
Ashley DoeArgentinaIoni Bowcher UNQUALIFIED
Smith GlickItalyBernardo Dominic PROPOSAL
Maisha RulapaughCanadaAmy Elsner NEW
Salvatore StockhamItalyXuxue Feng QUALIFIED
Cody SaylorsAustraliaAsiya Javayant NEW
Cody SaylorsRussiaAsiya Javayant RENEWAL
Leja CaldareraBrazilOnyama Limba QUALIFIED
Aruna FigeroaGermanyElwin Sharvill UNQUALIFIED
Nicolas IturbideRussiaBernardo Dominic RENEWAL
Kadeem FlosiUnited KingdomAnna Fali PROPOSAL
Deepesh ChuiRussiaElwin Sharvill QUALIFIED
Octavia MaletBrazilStephen Shaw RENEWAL
Isabel BowleySpainBernardo Dominic NEW
Salvatore StockhamSpainElwin Sharvill NEW
Nicolas IturbideSpainBernardo Dominic QUALIFIED
Wickens NestleFranceXuxue Feng NEGOTIATION
Cody SaylorsGermanyIoni Bowcher PROPOSAL
Aditya KuskoFranceAmy Elsner QUALIFIED
Clifford RimArgentinaIvan Magalhaes UNQUALIFIED
Kaitlin OstroskyRussiaStephen Shaw RENEWAL
Leon OldroydItalyXuxue Feng PROPOSAL
Arvin AlbaresItalyElwin Sharvill RENEWAL
Aditya KuskoFranceBernardo Dominic UNQUALIFIED
James ButtJapanIvan Magalhaes RENEWAL
Arvin AlbaresAustraliaAnna Fali RENEWAL
Ashley DoeIndiaIoni Bowcher NEW
Emily WhobreyUnited KingdomElwin Sharvill RENEWAL
Salvatore StockhamFranceBernardo Dominic NEW
Cody SaylorsArgentinaOnyama Limba NEGOTIATION
Jefferson SchemmerCanadaOnyama Limba QUALIFIED
Maria MarrierItalyIoni Bowcher NEW
Jeanfrancois VenereFranceAnna Fali NEW
Emily WhobreyJapanAmy Elsner NEGOTIATION
Izzy GarufiItalyAnna Fali NEW
Juan WieserIndiaXuxue Feng RENEWAL
Antonio CaudyBrazilIoni Bowcher NEGOTIATION
Ivar PaprockiSpainStephen Shaw RENEWAL
Francesco ShinkoAustraliaAnna Fali NEW
Smith GlickCanadaXuxue Feng NEW
Wickens NestleArgentinaStephen Shaw QUALIFIED
Stacey MacleadBrazilElwin Sharvill RENEWAL
Frozen Columns
Name
Ashley Doe
Sinclair Waycott
Aruna Figeroa
Deepesh Chui
Chavez Briddick
Ashley Doe
Cody Saylors
Stacey Maclead
Sinclair Waycott
Nicolas Iturbide
Alejandro Perin
Nicolas Iturbide
Munro Ferencz
Leja Caldarera
Chavez Briddick
Ashley Doe
Darci Poquette
Maria Marrier
Leon Oldroyd
Aruna Figeroa
Smith Glick
Kadeem Flosi
Stacey Maclead
Adams Morasca
Misaki Royster
Claire Tollner
Emily Whobrey
Silvio Slusarski
Francesco Shinko
Ricardo Gaucho
Stacey Maclead
Morrow Ruta
Maria Marrier
Aika Inouye
Leon Oldroyd
Silvio Slusarski
Leon Oldroyd
Jennifer Amigon
Misaki Royster
Greenwood Bolognia
Antonio Caudy
Ashley Doe
Rodrigues Campain
Kaitlin Ostrosky
Stacey Maclead
Maisha Rulapaugh
Morrow Ruta
Izzy Garufi
Ricardo Gaucho
Aditya Kusko
IdCountryDate
1000United Kingdom2026-04-30
1001Japan2026-05-03
1002Spain2026-04-30
1003Spain2026-05-23
1004Japan2026-05-08
1005Brazil2026-05-24
1006Spain2026-05-24
1007France2026-05-15
1008Australia2026-05-05
1009Japan2026-05-11
1010Italy2026-05-14
1011Argentina2026-05-22
1012France2026-05-06
1013Italy2026-04-27
1014Spain2026-05-12
1015Spain2026-05-11
1016Australia2026-04-29
1017Brazil2026-05-22
1018Brazil2026-05-21
1019Germany2026-05-24
1020Argentina2026-05-07
1021Spain2026-05-16
1022Australia2026-04-30
1023Spain2026-04-27
1024Japan2026-05-05
1025Italy2026-05-22
1026India2026-05-15
1027Russia2026-05-11
1028United Kingdom2026-04-29
1029India2026-05-04
1030Canada2026-05-07
1031Russia2026-05-18
1032India2026-05-19
1033Germany2026-05-10
1034Spain2026-05-13
1035Spain2026-05-17
1036United Kingdom2026-05-18
1037United Kingdom2026-05-06
1038France2026-05-14
1039Italy2026-05-05
1040United Kingdom2026-05-01
1041United Kingdom2026-05-08
1042Spain2026-05-05
1043Argentina2026-05-08
1044France2026-05-13
1045Spain2026-05-18
1046Spain2026-05-14
1047Spain2026-05-06
1048Russia2026-05-03
1049India2026-05-11

On-Demand Data

NameIdCountryDate
Arvin Albares1000France2026-04-30
Francesco Shinko1001Argentina2026-05-13
Rodrigues Campain1002Russia2026-05-15
Leon Oldroyd1003Canada2026-05-18
Mayumi Kolmetz1004Brazil2026-05-22
Greenwood Bolognia1005Spain2026-05-26
Munro Ferencz1006Argentina2026-05-25
Stacey Maclead1007Spain2026-05-02
Jones Vocelka1008Canada2026-05-07
Alejandro Perin1009Australia2026-04-28
James Butt1010Spain2026-05-01
Misaki Royster1011Japan2026-05-20
Greenwood Bolognia1012Brazil2026-05-22
Maisha Rulapaugh1013Brazil2026-05-20
Maria Marrier1014Germany2026-05-03
Greenwood Bolognia1015Australia2026-04-28
Emily Whobrey1016Argentina2026-05-26
Isabel Bowley1017India2026-05-18
Adams Morasca1018Spain2026-05-07
Francesco Shinko1019India2026-04-29
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Alejandro PerinBrazilIoni Bowcher RENEWAL
Adams MorascaRussiaAnna Fali NEW
Adams MorascaCanadaAsiya Javayant NEGOTIATION
Claire TollnerGermanyAsiya Javayant RENEWAL
Ashley DoeCanadaXuxue Feng PROPOSAL
Juan WieserGermanyAmy Elsner NEGOTIATION
Aruna FigeroaBrazilAsiya Javayant PROPOSAL
Clifford RimBrazilAnna Fali UNQUALIFIED
Greenwood BologniaAustraliaStephen Shaw NEGOTIATION
James ButtBrazilAnna Fali NEGOTIATION
Stacey MacleadRussiaIvan Magalhaes QUALIFIED
Smith GlickRussiaElwin Sharvill UNQUALIFIED
Deepesh ChuiRussiaAnna Fali NEW
Leja CaldareraUnited KingdomAnna Fali UNQUALIFIED
Sinclair WaycottFranceOnyama Limba RENEWAL
Maria MarrierIndiaIoni Bowcher UNQUALIFIED
Aditya KuskoFranceIvan Magalhaes UNQUALIFIED
Maisha RulapaughCanadaAnna Fali QUALIFIED
Johnson SergiJapanOnyama Limba NEGOTIATION
Jefferson SchemmerCanadaAsiya Javayant RENEWAL
Izzy GarufiGermanyIvan Magalhaes RENEWAL
Leon OldroydFranceAnna Fali PROPOSAL
Faith GillianFranceStephen Shaw RENEWAL
Izzy GarufiAustraliaXuxue Feng RENEWAL
Ashley DoeJapanIvan Magalhaes UNQUALIFIED
Ashley DoeArgentinaOnyama Limba UNQUALIFIED
Ricardo GauchoGermanyOnyama Limba NEGOTIATION
Johnson SergiArgentinaOnyama Limba NEGOTIATION
Clifford RimBrazilOnyama Limba NEGOTIATION
Jefferson SchemmerBrazilOnyama Limba UNQUALIFIED
Munro FerenczCanadaBernardo Dominic UNQUALIFIED
Julie StensethUnited KingdomIvan Magalhaes RENEWAL
Aditya KuskoItalyXuxue Feng NEW
Aditya KuskoUnited KingdomStephen Shaw QUALIFIED
Clifford RimBrazilStephen Shaw UNQUALIFIED
Francesco ShinkoArgentinaElwin Sharvill RENEWAL
Francesco ShinkoRussiaElwin Sharvill NEGOTIATION
Ricardo GauchoRussiaBernardo Dominic RENEWAL
Cody SaylorsSpainXuxue Feng RENEWAL
Izzy GarufiJapanAsiya Javayant 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>