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 SaylorsSpainAsiya Javayant NEW
Antonio CaudyGermanyXuxue Feng QUALIFIED
Jefferson SchemmerBrazilXuxue Feng UNQUALIFIED
Julie StensethFranceOnyama Limba PROPOSAL
Mayumi KolmetzGermanyElwin Sharvill RENEWAL
Aditya KuskoIndiaXuxue Feng PROPOSAL
Salvatore StockhamJapanAmy Elsner PROPOSAL
Greenwood BologniaJapanIvan Magalhaes PROPOSAL
Cody SaylorsArgentinaAmy Elsner NEGOTIATION
Jennifer AmigonJapanAsiya Javayant NEGOTIATION
Ivar PaprockiJapanXuxue Feng RENEWAL
Deepesh ChuiSpainIoni Bowcher RENEWAL
Octavia MaletBrazilAnna Fali NEW
Rodrigues CampainAustraliaElwin Sharvill NEW
Jennifer AmigonIndiaAsiya Javayant UNQUALIFIED
Sinclair WaycottBrazilAsiya Javayant UNQUALIFIED
Jones VocelkaIndiaIoni Bowcher NEW
Cody SaylorsUnited KingdomXuxue Feng NEW
Costa DilliardCanadaIvan Magalhaes PROPOSAL
Murillo MaletSpainAnna Fali RENEWAL
Ivar PaprockiUnited KingdomStephen Shaw NEW
Maria MarrierAustraliaBernardo Dominic NEGOTIATION
Arvin AlbaresCanadaIvan Magalhaes UNQUALIFIED
Cody SaylorsFranceElwin Sharvill PROPOSAL
Wickens NestleRussiaAnna Fali RENEWAL
James ButtAustraliaXuxue Feng RENEWAL
Tony FollerSpainAnna Fali UNQUALIFIED
Mayumi KolmetzArgentinaIvan Magalhaes QUALIFIED
Aruna FigeroaJapanAmy Elsner NEGOTIATION
Ricardo GauchoAustraliaIvan Magalhaes QUALIFIED
Izzy GarufiIndiaAsiya Javayant NEW
Claire TollnerArgentinaIvan Magalhaes NEW
Sinclair WaycottBrazilElwin Sharvill QUALIFIED
Cody SaylorsJapanOnyama Limba QUALIFIED
Greenwood BologniaCanadaAsiya Javayant RENEWAL
Leja CaldareraItalyBernardo Dominic NEW
Alejandro PerinCanadaAsiya Javayant NEGOTIATION
Maria MarrierSpainAmy Elsner RENEWAL
Leja CaldareraRussiaAnna Fali PROPOSAL
Jefferson SchemmerUnited KingdomAnna Fali UNQUALIFIED
Alejandro PerinJapanIvan Magalhaes QUALIFIED
Leon OldroydBrazilAsiya Javayant NEGOTIATION
Emily WhobreyAustraliaBernardo Dominic RENEWAL
Misaki RoysterUnited KingdomStephen Shaw NEW
Darci PoquetteRussiaIoni Bowcher NEGOTIATION
Misaki RoysterAustraliaOnyama Limba RENEWAL
Greenwood BologniaItalyIvan Magalhaes PROPOSAL
Izzy GarufiCanadaElwin Sharvill NEGOTIATION
Costa DilliardBrazilOnyama Limba NEGOTIATION
Mujtaba NickaRussiaElwin Sharvill NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Sinclair WaycottCanadaStephen Shaw QUALIFIED
Jefferson SchemmerIndiaIoni Bowcher NEW
Nicolas IturbideBrazilIoni Bowcher UNQUALIFIED
Jefferson SchemmerIndiaStephen Shaw RENEWAL
Isabel BowleyCanadaAmy Elsner PROPOSAL
Aruna FigeroaRussiaElwin Sharvill QUALIFIED
Nicolas IturbideItalyIoni Bowcher RENEWAL
Claire TollnerAustraliaAsiya Javayant PROPOSAL
Jeanfrancois VenereGermanyBernardo Dominic RENEWAL
Jennifer AmigonUnited KingdomIvan Magalhaes RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Juan WieserFrance2025-10-30Printing Dimensions PROPOSAL90Stephen Shaw
1001Cody SaylorsIndia2025-10-09Rangoni Of Florence RENEWAL32Amy Elsner
1002Munro FerenczAustralia2025-10-18Truhlar And Truhlar Attys QUALIFIED89Anna Fali
1003Isabel BowleyArgentina2025-10-23Rousseaux, Michael Esq UNQUALIFIED86Bernardo Dominic
1004Mujtaba NickaSpain2025-10-31Dorl, James J Esq NEGOTIATION29Amy Elsner
1005Misaki RoysterJapan2025-10-15Chapman, Ross E Esq QUALIFIED51Xuxue Feng
1006Mayumi KolmetzItaly2025-11-02Chemel, James L Cpa NEGOTIATION37Asiya Javayant
1007Jennifer AmigonSpain2025-10-17Morlong Associates NEGOTIATION19Ivan Magalhaes
1008Smith GlickCanada2025-10-19Printing Dimensions RENEWAL47Ivan Magalhaes
1009Jennifer AmigonArgentina2025-10-28Chapman, Ross E Esq PROPOSAL7Xuxue Feng
1010James ButtItaly2025-10-26Truhlar And Truhlar Attys PROPOSAL97Amy Elsner
1011Antonio CaudyIndia2025-10-11Feltz Printing Service RENEWAL23Stephen Shaw
1012Tony FollerFrance2025-10-15Truhlar And Truhlar Attys NEGOTIATION57Asiya Javayant
1013Aruna FigeroaIndia2025-10-27Rangoni Of Florence PROPOSAL15Bernardo Dominic
1014Claire TollnerItaly2025-10-30Benton, John B Jr QUALIFIED78Anna Fali
1015Ivar PaprockiJapan2025-10-15Rangoni Of Florence UNQUALIFIED39Amy Elsner
1016Leja CaldareraCanada2025-10-28Feiner Bros NEGOTIATION79Elwin Sharvill
1017Nicolas IturbideGermany2025-10-13Truhlar And Truhlar Attys NEGOTIATION59Anna Fali
1018Murillo MaletGermany2025-10-20Buckley Miller Wright RENEWAL45Stephen Shaw
1019Morrow RutaUnited Kingdom2025-10-20Feltz Printing Service RENEWAL60Xuxue Feng
1020Mayumi KolmetzSpain2025-10-22Printing Dimensions RENEWAL71Ioni Bowcher
1021Chavez BriddickUnited Kingdom2025-10-20Chanay, Jeffrey A Esq PROPOSAL44Ioni Bowcher
1022Aruna FigeroaCanada2025-10-23Commercial Press UNQUALIFIED59Asiya Javayant
1023Francesco ShinkoItaly2025-10-27Rousseaux, Michael Esq NEGOTIATION51Bernardo Dominic
1024Leon OldroydRussia2025-10-19Feltz Printing Service NEGOTIATION97Onyama Limba
1025James ButtFrance2025-10-26Benton, John B Jr UNQUALIFIED13Amy Elsner
1026Greenwood BologniaJapan2025-10-06King, Christopher A Esq NEGOTIATION7Ivan Magalhaes
1027Mayumi KolmetzSpain2025-10-20Benton, John B Jr RENEWAL53Elwin Sharvill
1028Jennifer AmigonCanada2025-10-04Feltz Printing Service QUALIFIED42Asiya Javayant
1029Johnson SergiGermany2025-10-05Dorl, James J Esq NEGOTIATION63Ioni Bowcher
1030Salvatore StockhamIndia2025-10-15Dorl, James J Esq PROPOSAL40Amy Elsner
1031Munro FerenczCanada2025-10-30Morlong Associates NEGOTIATION3Bernardo Dominic
1032Leja CaldareraIndia2025-10-10King, Christopher A Esq NEGOTIATION73Onyama Limba
1033Tony FollerFrance2025-10-31Rangoni Of Florence QUALIFIED78Stephen Shaw
1034Morrow RutaJapan2025-10-23Chemel, James L Cpa QUALIFIED88Xuxue Feng
1035Kaitlin OstroskyFrance2025-10-10Rangoni Of Florence RENEWAL59Anna Fali
1036Costa DilliardArgentina2025-10-07Chanay, Jeffrey A Esq PROPOSAL76Amy Elsner
1037Greenwood BologniaSpain2025-10-06Buckley Miller Wright RENEWAL45Xuxue Feng
1038Kaitlin OstroskyBrazil2025-11-02Dorl, James J Esq UNQUALIFIED11Amy Elsner
1039Ashley DoeBrazil2025-10-19Rousseaux, Michael Esq RENEWAL92Bernardo Dominic
1040Faith GillianRussia2025-10-17Buckley Miller Wright QUALIFIED83Amy Elsner
1041Jefferson SchemmerItaly2025-10-15Rousseaux, Michael Esq UNQUALIFIED13Onyama Limba
1042Maisha RulapaughSpain2025-10-11Chapman, Ross E Esq UNQUALIFIED52Anna Fali
1043Jeanfrancois VenereBrazil2025-10-11Feiner Bros NEGOTIATION41Ivan Magalhaes
1044Misaki RoysterFrance2025-10-29Chanay, Jeffrey A Esq PROPOSAL39Anna Fali
1045Leja CaldareraArgentina2025-11-01Chanay, Jeffrey A Esq PROPOSAL12Xuxue Feng
1046Wickens NestleBrazil2025-10-09Benton, John B Jr PROPOSAL8Anna Fali
1047Cody SaylorsArgentina2025-10-24Chemel, James L Cpa NEGOTIATION24Xuxue Feng
1048Jeanfrancois VenereJapan2025-10-26Chanay, Jeffrey A Esq RENEWAL77Xuxue Feng
1049Johnson SergiBrazil2025-10-23Feiner Bros NEW36Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Ivar PaprockiIndiaBernardo Dominic PROPOSAL
Francesco ShinkoJapanStephen Shaw UNQUALIFIED
James ButtFranceStephen Shaw QUALIFIED
Julie StensethRussiaXuxue Feng UNQUALIFIED
Greenwood BologniaFranceElwin Sharvill RENEWAL
Adams MorascaUnited KingdomOnyama Limba NEGOTIATION
Antonio CaudyCanadaOnyama Limba PROPOSAL
Deepesh ChuiSpainBernardo Dominic RENEWAL
Costa DilliardUnited KingdomAnna Fali QUALIFIED
Murillo MaletBrazilOnyama Limba UNQUALIFIED
Ivar PaprockiBrazilIvan Magalhaes PROPOSAL
Nicolas IturbideIndiaIoni Bowcher NEW
Chavez BriddickJapanAsiya Javayant NEW
Francesco ShinkoBrazilOnyama Limba RENEWAL
Kaitlin OstroskyArgentinaOnyama Limba UNQUALIFIED
David DarakjyBrazilIvan Magalhaes RENEWAL
Ashley DoeRussiaBernardo Dominic QUALIFIED
Ashley DoeBrazilAsiya Javayant NEW
Stacey MacleadCanadaXuxue Feng NEGOTIATION
Leja CaldareraCanadaAsiya Javayant UNQUALIFIED
Chavez BriddickGermanyXuxue Feng NEW
Rodrigues CampainItalyOnyama Limba QUALIFIED
Kadeem FlosiCanadaAnna Fali RENEWAL
Aditya KuskoArgentinaOnyama Limba QUALIFIED
Nicolas IturbideCanadaIoni Bowcher PROPOSAL
Mujtaba NickaAustraliaStephen Shaw NEGOTIATION
Ricardo GauchoSpainOnyama Limba UNQUALIFIED
Sinclair WaycottCanadaIoni Bowcher UNQUALIFIED
Chavez BriddickFranceStephen Shaw NEW
Claire TollnerAustraliaElwin Sharvill QUALIFIED
Claire TollnerArgentinaOnyama Limba PROPOSAL
Nicolas IturbideItalyAmy Elsner NEW
Maisha RulapaughGermanyAnna Fali NEGOTIATION
Juan WieserRussiaAnna Fali RENEWAL
Kadeem FlosiCanadaStephen Shaw QUALIFIED
Ivar PaprockiCanadaIvan Magalhaes UNQUALIFIED
Jeanfrancois VenereUnited KingdomOnyama Limba RENEWAL
Aika InouyeArgentinaElwin Sharvill PROPOSAL
Jones VocelkaUnited KingdomBernardo Dominic RENEWAL
Ivar PaprockiArgentinaElwin Sharvill RENEWAL
Francesco ShinkoFranceXuxue Feng QUALIFIED
Adams MorascaUnited KingdomXuxue Feng QUALIFIED
Stacey MacleadRussiaBernardo Dominic NEW
Murillo MaletFranceAnna Fali NEW
Leon OldroydArgentinaStephen Shaw RENEWAL
Jefferson SchemmerSpainAnna Fali NEW
Arvin AlbaresArgentinaIvan Magalhaes UNQUALIFIED
Izzy GarufiUnited KingdomXuxue Feng QUALIFIED
Aika InouyeItalyAnna Fali UNQUALIFIED
Cody SaylorsUnited KingdomXuxue Feng PROPOSAL
Frozen Columns
Name
Costa Dilliard
Mujtaba Nicka
Francesco Shinko
Costa Dilliard
Cody Saylors
Misaki Royster
Salvatore Stockham
Smith Glick
Francesco Shinko
Costa Dilliard
Munro Ferencz
Ashley Doe
Maria Marrier
Emily Whobrey
Johnson Sergi
Jennifer Amigon
Aditya Kusko
Arvin Albares
Johnson Sergi
Jeanfrancois Venere
Adams Morasca
Jefferson Schemmer
Smith Glick
Rodrigues Campain
Ricardo Gaucho
Aika Inouye
Emily Whobrey
Emily Whobrey
Arvin Albares
Faith Gillian
Morrow Ruta
Johnson Sergi
Octavia Malet
Isabel Bowley
Kaitlin Ostrosky
Jefferson Schemmer
Francesco Shinko
Darci Poquette
Ivar Paprocki
Munro Ferencz
Rodrigues Campain
Alejandro Perin
Claire Tollner
Julie Stenseth
Johnson Sergi
Aika Inouye
Faith Gillian
Ricardo Gaucho
Cody Saylors
Salvatore Stockham
IdCountryDate
1000Japan2025-10-17
1001France2025-10-09
1002Brazil2025-10-24
1003Russia2025-10-11
1004France2025-10-20
1005India2025-10-04
1006Russia2025-10-23
1007Canada2025-10-05
1008Spain2025-10-24
1009Italy2025-10-09
1010Spain2025-10-20
1011France2025-10-10
1012Canada2025-10-17
1013India2025-10-05
1014Canada2025-10-14
1015Italy2025-10-05
1016Italy2025-10-16
1017Spain2025-10-12
1018Spain2025-10-19
1019France2025-10-16
1020Italy2025-10-15
1021Italy2025-10-28
1022United Kingdom2025-10-15
1023Australia2025-10-22
1024Germany2025-10-11
1025Argentina2025-10-06
1026Japan2025-10-23
1027Brazil2025-10-04
1028France2025-10-29
1029United Kingdom2025-10-09
1030Canada2025-10-06
1031Canada2025-10-25
1032Spain2025-10-20
1033Spain2025-10-15
1034Australia2025-10-17
1035Japan2025-11-01
1036France2025-10-13
1037Argentina2025-10-14
1038Australia2025-10-12
1039Japan2025-10-30
1040Canada2025-10-09
1041Russia2025-10-29
1042United Kingdom2025-10-15
1043Italy2025-10-30
1044Japan2025-10-08
1045Italy2025-10-21
1046United Kingdom2025-10-29
1047Italy2025-10-30
1048Canada2025-10-17
1049Argentina2025-10-17

On-Demand Data

NameIdCountryDate
Morrow Ruta1000Brazil2025-10-26
James Butt1001Japan2025-10-06
Julie Stenseth1002Spain2025-10-19
Johnson Sergi1003India2025-10-10
Chavez Briddick1004Argentina2025-10-09
Mayumi Kolmetz1005India2025-10-12
Leja Caldarera1006Canada2025-10-15
Jefferson Schemmer1007Russia2025-10-23
Ashley Doe1008France2025-10-08
Munro Ferencz1009Canada2025-10-30
Johnson Sergi1010Argentina2025-10-22
Greenwood Bolognia1011Russia2025-10-18
Maria Marrier1012Brazil2025-10-18
Jeanfrancois Venere1013Canada2025-10-21
Nicolas Iturbide1014Russia2025-10-08
Greenwood Bolognia1015Brazil2025-10-29
Greenwood Bolognia1016France2025-10-07
Kaitlin Ostrosky1017United Kingdom2025-10-21
Faith Gillian1018France2025-10-13
Murillo Malet1019France2025-10-16
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
David DarakjyJapanStephen Shaw UNQUALIFIED
Kadeem FlosiAustraliaStephen Shaw RENEWAL
Mayumi KolmetzIndiaIoni Bowcher PROPOSAL
Misaki RoysterItalyAsiya Javayant UNQUALIFIED
Alejandro PerinRussiaAmy Elsner UNQUALIFIED
Julie StensethIndiaOnyama Limba RENEWAL
Jeanfrancois VenereIndiaOnyama Limba UNQUALIFIED
Cody SaylorsFranceElwin Sharvill PROPOSAL
Kaitlin OstroskyJapanAmy Elsner RENEWAL
Misaki RoysterSpainElwin Sharvill NEW
Kadeem FlosiJapanXuxue Feng QUALIFIED
Aika InouyeGermanyAnna Fali QUALIFIED
Clifford RimUnited KingdomAmy Elsner UNQUALIFIED
Cody SaylorsUnited KingdomOnyama Limba UNQUALIFIED
Chavez BriddickJapanOnyama Limba NEW
Leon OldroydItalyAsiya Javayant NEW
Stacey MacleadAustraliaAsiya Javayant UNQUALIFIED
Antonio CaudyAustraliaXuxue Feng PROPOSAL
Juan WieserIndiaElwin Sharvill UNQUALIFIED
Leon OldroydBrazilBernardo Dominic QUALIFIED
Johnson SergiUnited KingdomBernardo Dominic PROPOSAL
Munro FerenczCanadaAmy Elsner NEGOTIATION
James ButtArgentinaIoni Bowcher NEGOTIATION
Misaki RoysterSpainStephen Shaw NEGOTIATION
Clifford RimGermanyBernardo Dominic QUALIFIED
Maria MarrierCanadaAsiya Javayant NEGOTIATION
Tony FollerSpainStephen Shaw RENEWAL
Salvatore StockhamArgentinaStephen Shaw PROPOSAL
Wickens NestleIndiaBernardo Dominic RENEWAL
Leja CaldareraAustraliaAnna Fali QUALIFIED
Misaki RoysterJapanIvan Magalhaes NEGOTIATION
Antonio CaudyGermanyXuxue Feng NEW
Clifford RimSpainIoni Bowcher RENEWAL
Sinclair WaycottArgentinaAsiya Javayant QUALIFIED
Rodrigues CampainArgentinaIvan Magalhaes NEW
Ivar PaprockiSpainXuxue Feng RENEWAL
Mujtaba NickaAustraliaAmy Elsner QUALIFIED
Chavez BriddickCanadaAmy Elsner QUALIFIED
Clifford RimAustraliaIoni Bowcher NEW
Alejandro PerinFranceIoni Bowcher RENEWAL

<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>