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
Claire TollnerBrazilIvan Magalhaes PROPOSAL
Aruna FigeroaUnited KingdomAsiya Javayant NEW
Octavia MaletJapanOnyama Limba QUALIFIED
Isabel BowleyArgentinaAsiya Javayant UNQUALIFIED
Francesco ShinkoItalyElwin Sharvill NEW
Munro FerenczBrazilXuxue Feng NEW
Ivar PaprockiItalyBernardo Dominic UNQUALIFIED
Emily WhobreyCanadaAmy Elsner RENEWAL
Salvatore StockhamFranceBernardo Dominic RENEWAL
Clifford RimBrazilIoni Bowcher PROPOSAL
Sinclair WaycottIndiaAnna Fali UNQUALIFIED
Sinclair WaycottItalyIoni Bowcher NEGOTIATION
Izzy GarufiJapanElwin Sharvill UNQUALIFIED
Nicolas IturbideFranceBernardo Dominic NEW
Adams MorascaItalyStephen Shaw NEGOTIATION
Greenwood BologniaSpainElwin Sharvill NEGOTIATION
Arvin AlbaresFranceAmy Elsner QUALIFIED
Munro FerenczRussiaIoni Bowcher NEGOTIATION
Julie StensethIndiaOnyama Limba UNQUALIFIED
Ashley DoeBrazilAmy Elsner PROPOSAL
Misaki RoysterUnited KingdomOnyama Limba QUALIFIED
Maria MarrierJapanIoni Bowcher UNQUALIFIED
David DarakjyBrazilOnyama Limba RENEWAL
Silvio SlusarskiArgentinaStephen Shaw QUALIFIED
Aditya KuskoArgentinaAmy Elsner PROPOSAL
Kadeem FlosiArgentinaStephen Shaw RENEWAL
Ricardo GauchoFranceAsiya Javayant NEGOTIATION
Antonio CaudyAustraliaIoni Bowcher QUALIFIED
Wickens NestleUnited KingdomBernardo Dominic PROPOSAL
Emily WhobreyIndiaElwin Sharvill NEGOTIATION
Emily WhobreyBrazilBernardo Dominic UNQUALIFIED
Mujtaba NickaGermanyStephen Shaw NEGOTIATION
Kaitlin OstroskyJapanAmy Elsner RENEWAL
Nicolas IturbideCanadaBernardo Dominic NEGOTIATION
Deepesh ChuiSpainOnyama Limba NEGOTIATION
Maisha RulapaughJapanStephen Shaw QUALIFIED
Emily WhobreyAustraliaStephen Shaw NEW
Kaitlin OstroskyUnited KingdomStephen Shaw NEW
Jones VocelkaUnited KingdomIoni Bowcher NEW
Adams MorascaItalyBernardo Dominic UNQUALIFIED
Jennifer AmigonGermanyAmy Elsner QUALIFIED
Kaitlin OstroskyJapanAmy Elsner RENEWAL
Ricardo GauchoBrazilAmy Elsner NEW
Aditya KuskoUnited KingdomXuxue Feng RENEWAL
Leja CaldareraCanadaAmy Elsner NEGOTIATION
Nicolas IturbideFranceOnyama Limba RENEWAL
Mujtaba NickaBrazilOnyama Limba PROPOSAL
Kadeem FlosiGermanyStephen Shaw NEGOTIATION
Maisha RulapaughArgentinaOnyama Limba QUALIFIED
Costa DilliardBrazilStephen Shaw NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Leon OldroydGermanyXuxue Feng RENEWAL
Maisha RulapaughSpainXuxue Feng NEW
Leon OldroydUnited KingdomIvan Magalhaes UNQUALIFIED
David DarakjyUnited KingdomStephen Shaw NEGOTIATION
Morrow RutaRussiaAnna Fali QUALIFIED
Antonio CaudyItalyElwin Sharvill PROPOSAL
Maisha RulapaughJapanElwin Sharvill RENEWAL
Arvin AlbaresBrazilXuxue Feng RENEWAL
Isabel BowleyItalyAsiya Javayant UNQUALIFIED
Rodrigues CampainSpainAmy Elsner UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Antonio CaudyUnited Kingdom2026-05-29Buckley Miller Wright RENEWAL49Xuxue Feng
1001James ButtGermany2026-05-26Dorl, James J Esq UNQUALIFIED5Asiya Javayant
1002Aruna FigeroaAustralia2026-05-12Rangoni Of Florence QUALIFIED46Anna Fali
1003Munro FerenczGermany2026-05-15Buckley Miller Wright NEW5Asiya Javayant
1004Aruna FigeroaArgentina2026-05-21Rangoni Of Florence RENEWAL92Elwin Sharvill
1005Kadeem FlosiJapan2026-05-29Benton, John B Jr QUALIFIED63Asiya Javayant
1006James ButtIndia2026-05-30Morlong Associates UNQUALIFIED16Bernardo Dominic
1007Salvatore StockhamBrazil2026-05-26Buckley Miller Wright UNQUALIFIED75Ioni Bowcher
1008Jeanfrancois VenereUnited Kingdom2026-06-01Chanay, Jeffrey A Esq RENEWAL95Amy Elsner
1009Nicolas IturbideFrance2026-05-29King, Christopher A Esq UNQUALIFIED46Anna Fali
1010Sinclair WaycottItaly2026-05-26Chemel, James L Cpa PROPOSAL17Asiya Javayant
1011Cody SaylorsGermany2026-05-11King, Christopher A Esq NEW5Stephen Shaw
1012Cody SaylorsRussia2026-05-15Buckley Miller Wright PROPOSAL21Xuxue Feng
1013Adams MorascaAustralia2026-05-28Chemel, James L Cpa QUALIFIED56Asiya Javayant
1014Jones VocelkaCanada2026-05-11Feiner Bros QUALIFIED9Asiya Javayant
1015Darci PoquetteFrance2026-05-22Buckley Miller Wright RENEWAL57Bernardo Dominic
1016Kadeem FlosiCanada2026-06-03Rangoni Of Florence PROPOSAL32Onyama Limba
1017Rodrigues CampainRussia2026-06-06Truhlar And Truhlar Attys QUALIFIED84Asiya Javayant
1018Jefferson SchemmerFrance2026-05-09Rousseaux, Michael Esq QUALIFIED19Ivan Magalhaes
1019Leon OldroydCanada2026-05-22Truhlar And Truhlar Attys PROPOSAL18Bernardo Dominic
1020Sinclair WaycottIndia2026-05-27Rousseaux, Michael Esq QUALIFIED51Elwin Sharvill
1021Leon OldroydAustralia2026-05-08King, Christopher A Esq NEGOTIATION38Elwin Sharvill
1022Johnson SergiFrance2026-05-15Buckley Miller Wright PROPOSAL63Stephen Shaw
1023Johnson SergiBrazil2026-05-09Morlong Associates NEW18Anna Fali
1024Emily WhobreyAustralia2026-05-21Chanay, Jeffrey A Esq NEGOTIATION72Elwin Sharvill
1025Aditya KuskoItaly2026-05-26Buckley Miller Wright RENEWAL11Onyama Limba
1026Ivar PaprockiIndia2026-05-13Chanay, Jeffrey A Esq NEW31Amy Elsner
1027Misaki RoysterItaly2026-05-22Dorl, James J Esq UNQUALIFIED57Ioni Bowcher
1028Silvio SlusarskiUnited Kingdom2026-05-16Dorl, James J Esq UNQUALIFIED14Ivan Magalhaes
1029Jefferson SchemmerAustralia2026-05-08King, Christopher A Esq UNQUALIFIED36Bernardo Dominic
1030Jones VocelkaArgentina2026-05-15Buckley Miller Wright NEGOTIATION74Asiya Javayant
1031Mayumi KolmetzFrance2026-05-11Chanay, Jeffrey A Esq NEGOTIATION38Amy Elsner
1032Isabel BowleyBrazil2026-05-13Commercial Press NEGOTIATION86Ivan Magalhaes
1033Salvatore StockhamCanada2026-06-02Feiner Bros NEGOTIATION20Ioni Bowcher
1034Ricardo GauchoItaly2026-05-09Benton, John B Jr NEW42Onyama Limba
1035Smith GlickJapan2026-05-11Truhlar And Truhlar Attys NEGOTIATION87Onyama Limba
1036Julie StensethJapan2026-05-24Printing Dimensions RENEWAL71Bernardo Dominic
1037Chavez BriddickIndia2026-06-04Printing Dimensions NEGOTIATION70Anna Fali
1038Isabel BowleyIndia2026-05-28Chapman, Ross E Esq UNQUALIFIED91Elwin Sharvill
1039Tony FollerAustralia2026-05-14Dorl, James J Esq RENEWAL24Onyama Limba
1040Aditya KuskoIndia2026-05-23Rangoni Of Florence PROPOSAL83Ivan Magalhaes
1041Greenwood BologniaItaly2026-06-01Rousseaux, Michael Esq UNQUALIFIED87Asiya Javayant
1042Leon OldroydItaly2026-05-27Truhlar And Truhlar Attys NEW22Onyama Limba
1043Misaki RoysterFrance2026-05-11Rangoni Of Florence PROPOSAL87Onyama Limba
1044Smith GlickUnited Kingdom2026-05-20Feltz Printing Service UNQUALIFIED17Bernardo Dominic
1045Ricardo GauchoFrance2026-05-24Feltz Printing Service QUALIFIED99Stephen Shaw
1046Tony FollerUnited Kingdom2026-05-09Chapman, Ross E Esq QUALIFIED45Amy Elsner
1047Kadeem FlosiBrazil2026-05-13Buckley Miller Wright QUALIFIED31Ioni Bowcher
1048Juan WieserUnited Kingdom2026-05-25Morlong Associates NEW31Onyama Limba
1049Aditya KuskoCanada2026-05-25Rousseaux, Michael Esq NEGOTIATION84Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Jones VocelkaItalyElwin Sharvill QUALIFIED
Ivar PaprockiRussiaAnna Fali RENEWAL
Tony FollerIndiaAnna Fali NEGOTIATION
Izzy GarufiItalyAsiya Javayant QUALIFIED
Johnson SergiIndiaIvan Magalhaes QUALIFIED
Francesco ShinkoFranceBernardo Dominic RENEWAL
Faith GillianFranceStephen Shaw NEW
Leon OldroydBrazilStephen Shaw NEGOTIATION
Smith GlickGermanyIoni Bowcher NEW
Jefferson SchemmerSpainElwin Sharvill UNQUALIFIED
Costa DilliardGermanyElwin Sharvill PROPOSAL
Smith GlickGermanyIoni Bowcher UNQUALIFIED
Kadeem FlosiIndiaBernardo Dominic QUALIFIED
David DarakjyAustraliaXuxue Feng NEW
Isabel BowleyItalyElwin Sharvill NEW
Smith GlickUnited KingdomElwin Sharvill NEGOTIATION
Ivar PaprockiGermanyBernardo Dominic RENEWAL
Silvio SlusarskiGermanyBernardo Dominic NEGOTIATION
Clifford RimAustraliaAsiya Javayant PROPOSAL
Izzy GarufiUnited KingdomAmy Elsner NEGOTIATION
Wickens NestleJapanStephen Shaw NEW
Jefferson SchemmerJapanBernardo Dominic PROPOSAL
Maisha RulapaughItalyAsiya Javayant NEW
Claire TollnerAustraliaIoni Bowcher UNQUALIFIED
Kadeem FlosiUnited KingdomElwin Sharvill RENEWAL
Darci PoquetteFranceXuxue Feng NEGOTIATION
Kadeem FlosiIndiaStephen Shaw NEW
Ivar PaprockiFranceIvan Magalhaes NEW
Mayumi KolmetzSpainElwin Sharvill PROPOSAL
Ricardo GauchoArgentinaElwin Sharvill PROPOSAL
Ricardo GauchoBrazilIoni Bowcher RENEWAL
Antonio CaudyRussiaIoni Bowcher UNQUALIFIED
Stacey MacleadFranceAnna Fali NEW
Cody SaylorsBrazilAmy Elsner QUALIFIED
Johnson SergiIndiaAsiya Javayant PROPOSAL
Greenwood BologniaGermanyElwin Sharvill NEW
Julie StensethUnited KingdomBernardo Dominic RENEWAL
Nicolas IturbideAustraliaAmy Elsner NEW
Johnson SergiFranceAmy Elsner NEW
Kaitlin OstroskyArgentinaElwin Sharvill NEGOTIATION
Ivar PaprockiGermanyIoni Bowcher PROPOSAL
Maisha RulapaughSpainIoni Bowcher PROPOSAL
Ashley DoeAustraliaXuxue Feng PROPOSAL
Jones VocelkaJapanXuxue Feng QUALIFIED
Jeanfrancois VenereUnited KingdomElwin Sharvill RENEWAL
Morrow RutaFranceElwin Sharvill NEGOTIATION
Isabel BowleyGermanyElwin Sharvill NEW
Julie StensethBrazilOnyama Limba NEW
Adams MorascaUnited KingdomOnyama Limba QUALIFIED
Aruna FigeroaRussiaOnyama Limba RENEWAL
Frozen Columns
Name
Jennifer Amigon
Octavia Malet
Arvin Albares
Munro Ferencz
Chavez Briddick
Ivar Paprocki
Arvin Albares
Arvin Albares
Smith Glick
Izzy Garufi
Mayumi Kolmetz
Murillo Malet
Clifford Rim
Tony Foller
Deepesh Chui
Aika Inouye
Ricardo Gaucho
Stacey Maclead
Silvio Slusarski
Octavia Malet
Izzy Garufi
Maisha Rulapaugh
Costa Dilliard
Claire Tollner
Julie Stenseth
Arvin Albares
Julie Stenseth
Jones Vocelka
Leon Oldroyd
Nicolas Iturbide
James Butt
Antonio Caudy
Julie Stenseth
David Darakjy
Aruna Figeroa
Salvatore Stockham
Clifford Rim
Octavia Malet
Julie Stenseth
Octavia Malet
Salvatore Stockham
Sinclair Waycott
Ivar Paprocki
Aruna Figeroa
Chavez Briddick
Johnson Sergi
Stacey Maclead
Mujtaba Nicka
Aika Inouye
Chavez Briddick
IdCountryDate
1000United Kingdom2026-06-06
1001Australia2026-05-20
1002Spain2026-05-09
1003Canada2026-05-19
1004Germany2026-05-15
1005India2026-05-25
1006United Kingdom2026-05-20
1007United Kingdom2026-05-25
1008Argentina2026-05-17
1009Germany2026-06-06
1010United Kingdom2026-05-11
1011Japan2026-05-27
1012France2026-05-20
1013Japan2026-06-06
1014Italy2026-05-15
1015Argentina2026-05-22
1016Brazil2026-05-25
1017India2026-05-28
1018Spain2026-05-11
1019Brazil2026-05-18
1020Canada2026-05-24
1021France2026-06-05
1022Australia2026-05-29
1023Italy2026-05-13
1024Canada2026-05-28
1025Canada2026-05-10
1026Germany2026-05-15
1027Canada2026-05-12
1028Russia2026-05-27
1029France2026-05-18
1030France2026-06-02
1031France2026-05-13
1032United Kingdom2026-05-31
1033Russia2026-05-25
1034Spain2026-06-06
1035Germany2026-05-29
1036Germany2026-05-09
1037Germany2026-05-10
1038Argentina2026-05-15
1039Australia2026-06-04
1040Italy2026-05-29
1041Brazil2026-05-12
1042France2026-05-19
1043Italy2026-05-12
1044Italy2026-05-30
1045Japan2026-05-08
1046Spain2026-05-24
1047France2026-05-25
1048Argentina2026-05-10
1049Germany2026-05-19

On-Demand Data

NameIdCountryDate
Leja Caldarera1000Italy2026-06-03
Nicolas Iturbide1001Germany2026-05-08
Julie Stenseth1002Spain2026-06-05
Stacey Maclead1003Russia2026-05-11
Claire Tollner1004Canada2026-05-20
Chavez Briddick1005Argentina2026-05-25
Smith Glick1006Argentina2026-05-31
Misaki Royster1007Japan2026-05-14
Stacey Maclead1008Russia2026-05-15
Stacey Maclead1009India2026-05-10
Costa Dilliard1010Germany2026-05-16
Leja Caldarera1011Canada2026-06-01
Emily Whobrey1012India2026-05-22
Izzy Garufi1013Italy2026-05-21
Salvatore Stockham1014Russia2026-05-28
Johnson Sergi1015Argentina2026-05-25
Ashley Doe1016United Kingdom2026-06-03
Leja Caldarera1017Brazil2026-05-11
Kaitlin Ostrosky1018Germany2026-05-30
Octavia Malet1019Germany2026-06-05
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jefferson SchemmerCanadaAsiya Javayant UNQUALIFIED
Arvin AlbaresBrazilElwin Sharvill NEGOTIATION
Claire TollnerItalyXuxue Feng QUALIFIED
Darci PoquetteItalyStephen Shaw UNQUALIFIED
Ricardo GauchoUnited KingdomElwin Sharvill NEW
Aditya KuskoSpainStephen Shaw PROPOSAL
Aditya KuskoUnited KingdomOnyama Limba NEW
Smith GlickItalyAnna Fali UNQUALIFIED
Kaitlin OstroskyCanadaAsiya Javayant NEGOTIATION
Antonio CaudyAustraliaAnna Fali PROPOSAL
James ButtIndiaBernardo Dominic QUALIFIED
Mujtaba NickaBrazilBernardo Dominic PROPOSAL
Murillo MaletJapanStephen Shaw NEW
Misaki RoysterItalyAmy Elsner PROPOSAL
Murillo MaletRussiaElwin Sharvill RENEWAL
Jeanfrancois VenereFranceBernardo Dominic PROPOSAL
Maria MarrierUnited KingdomStephen Shaw NEGOTIATION
Costa DilliardUnited KingdomAmy Elsner NEGOTIATION
Jeanfrancois VenereSpainOnyama Limba UNQUALIFIED
Jones VocelkaGermanyBernardo Dominic UNQUALIFIED
Ashley DoeRussiaXuxue Feng QUALIFIED
Chavez BriddickArgentinaStephen Shaw RENEWAL
Smith GlickUnited KingdomElwin Sharvill QUALIFIED
Mujtaba NickaBrazilIoni Bowcher PROPOSAL
Kaitlin OstroskyAustraliaStephen Shaw RENEWAL
Claire TollnerItalyXuxue Feng NEW
Chavez BriddickUnited KingdomAmy Elsner NEW
Leon OldroydBrazilAsiya Javayant RENEWAL
Aika InouyeArgentinaAsiya Javayant QUALIFIED
Leon OldroydAustraliaAmy Elsner RENEWAL
Deepesh ChuiFranceAsiya Javayant PROPOSAL
Jeanfrancois VenereJapanAnna Fali QUALIFIED
Claire TollnerCanadaXuxue Feng RENEWAL
Aruna FigeroaIndiaAnna Fali RENEWAL
Greenwood BologniaIndiaAnna Fali RENEWAL
Mayumi KolmetzBrazilElwin Sharvill QUALIFIED
Aika InouyeItalyIvan Magalhaes NEW
Leja CaldareraCanadaIoni Bowcher NEW
Maria MarrierItalyOnyama Limba RENEWAL
Ricardo GauchoRussiaIoni Bowcher QUALIFIED

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