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
Maisha RulapaughArgentinaIoni Bowcher NEW
Mujtaba NickaRussiaStephen Shaw RENEWAL
Kadeem FlosiJapanAsiya Javayant QUALIFIED
Aditya KuskoUnited KingdomIvan Magalhaes NEW
Silvio SlusarskiIndiaStephen Shaw QUALIFIED
Morrow RutaRussiaIoni Bowcher NEW
Tony FollerArgentinaElwin Sharvill PROPOSAL
Jefferson SchemmerGermanyAnna Fali RENEWAL
Octavia MaletUnited KingdomOnyama Limba RENEWAL
Aruna FigeroaSpainIoni Bowcher UNQUALIFIED
Kadeem FlosiFranceElwin Sharvill NEGOTIATION
Chavez BriddickUnited KingdomXuxue Feng UNQUALIFIED
Stacey MacleadFranceXuxue Feng UNQUALIFIED
Jones VocelkaJapanAsiya Javayant QUALIFIED
Aruna FigeroaCanadaAnna Fali PROPOSAL
Maria MarrierJapanIoni Bowcher NEGOTIATION
Cody SaylorsArgentinaIvan Magalhaes QUALIFIED
Claire TollnerFranceStephen Shaw RENEWAL
Sinclair WaycottCanadaAmy Elsner QUALIFIED
Octavia MaletAustraliaBernardo Dominic QUALIFIED
Smith GlickArgentinaBernardo Dominic RENEWAL
Izzy GarufiGermanyIoni Bowcher NEGOTIATION
Darci PoquetteUnited KingdomElwin Sharvill PROPOSAL
Juan WieserSpainStephen Shaw PROPOSAL
Aika InouyeItalyBernardo Dominic RENEWAL
Aruna FigeroaCanadaAsiya Javayant PROPOSAL
Johnson SergiItalyStephen Shaw NEGOTIATION
Chavez BriddickAustraliaIvan Magalhaes QUALIFIED
Ivar PaprockiSpainAnna Fali PROPOSAL
Adams MorascaJapanElwin Sharvill RENEWAL
Murillo MaletIndiaIoni Bowcher UNQUALIFIED
Ashley DoeAustraliaOnyama Limba RENEWAL
Johnson SergiArgentinaElwin Sharvill QUALIFIED
Stacey MacleadItalyAmy Elsner QUALIFIED
Jefferson SchemmerGermanyBernardo Dominic UNQUALIFIED
Izzy GarufiRussiaIvan Magalhaes NEGOTIATION
Cody SaylorsBrazilStephen Shaw UNQUALIFIED
Aditya KuskoRussiaBernardo Dominic QUALIFIED
Antonio CaudyJapanStephen Shaw PROPOSAL
Isabel BowleyFranceXuxue Feng NEW
Clifford RimSpainElwin Sharvill UNQUALIFIED
Kadeem FlosiIndiaAsiya Javayant UNQUALIFIED
Costa DilliardGermanyOnyama Limba NEW
Alejandro PerinCanadaAsiya Javayant RENEWAL
Maria MarrierUnited KingdomAnna Fali NEGOTIATION
Jefferson SchemmerFranceXuxue Feng QUALIFIED
Rodrigues CampainUnited KingdomAnna Fali PROPOSAL
Murillo MaletJapanAsiya Javayant RENEWAL
Stacey MacleadUnited KingdomAnna Fali QUALIFIED
Ricardo GauchoFranceIoni Bowcher QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Juan WieserSpainAmy Elsner NEGOTIATION
Faith GillianSpainIvan Magalhaes NEGOTIATION
Clifford RimCanadaAmy Elsner NEW
Francesco ShinkoGermanyElwin Sharvill PROPOSAL
Munro FerenczArgentinaOnyama Limba UNQUALIFIED
Sinclair WaycottIndiaElwin Sharvill NEGOTIATION
Murillo MaletArgentinaAnna Fali NEW
Jefferson SchemmerIndiaXuxue Feng NEGOTIATION
Darci PoquetteCanadaIoni Bowcher PROPOSAL
Ivar PaprockiBrazilAnna Fali NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Nicolas IturbideGermany2026-06-20Feiner Bros PROPOSAL62Xuxue Feng
1001Aruna FigeroaFrance2026-06-20Commercial Press QUALIFIED79Onyama Limba
1002Izzy GarufiUnited Kingdom2026-06-11Rangoni Of Florence QUALIFIED80Elwin Sharvill
1003Munro FerenczIndia2026-05-28Chanay, Jeffrey A Esq QUALIFIED94Amy Elsner
1004Maria MarrierUnited Kingdom2026-05-23Commercial Press NEW64Xuxue Feng
1005Aditya KuskoJapan2026-06-11Morlong Associates UNQUALIFIED11Ivan Magalhaes
1006Ivar PaprockiGermany2026-06-15Dorl, James J Esq NEW10Anna Fali
1007Ivar PaprockiSpain2026-06-11Truhlar And Truhlar Attys QUALIFIED62Anna Fali
1008Izzy GarufiGermany2026-06-14Benton, John B Jr RENEWAL58Xuxue Feng
1009Leon OldroydBrazil2026-06-19Rousseaux, Michael Esq NEGOTIATION17Onyama Limba
1010Mujtaba NickaAustralia2026-06-10Buckley Miller Wright NEW20Elwin Sharvill
1011Stacey MacleadArgentina2026-06-21Morlong Associates RENEWAL20Xuxue Feng
1012Aruna FigeroaItaly2026-05-25Chanay, Jeffrey A Esq PROPOSAL96Amy Elsner
1013Adams MorascaJapan2026-06-07Chanay, Jeffrey A Esq RENEWAL36Bernardo Dominic
1014Aruna FigeroaFrance2026-06-01Printing Dimensions UNQUALIFIED47Ivan Magalhaes
1015Stacey MacleadBrazil2026-06-21Chapman, Ross E Esq QUALIFIED7Stephen Shaw
1016Francesco ShinkoCanada2026-06-11Chanay, Jeffrey A Esq RENEWAL88Onyama Limba
1017Claire TollnerRussia2026-06-19Chapman, Ross E Esq PROPOSAL31Ivan Magalhaes
1018Leja CaldareraJapan2026-06-19Buckley Miller Wright PROPOSAL77Amy Elsner
1019Silvio SlusarskiArgentina2026-06-01Printing Dimensions QUALIFIED26Elwin Sharvill
1020Claire TollnerRussia2026-06-01Rangoni Of Florence RENEWAL85Xuxue Feng
1021Kaitlin OstroskyRussia2026-06-16Feltz Printing Service PROPOSAL76Anna Fali
1022Misaki RoysterRussia2026-06-21Feiner Bros QUALIFIED81Onyama Limba
1023Darci PoquetteJapan2026-06-17Truhlar And Truhlar Attys PROPOSAL98Bernardo Dominic
1024Murillo MaletBrazil2026-06-07Rangoni Of Florence NEGOTIATION68Asiya Javayant
1025Darci PoquetteBrazil2026-06-03Feltz Printing Service NEW99Onyama Limba
1026Arvin AlbaresAustralia2026-06-19Feiner Bros RENEWAL11Stephen Shaw
1027Johnson SergiJapan2026-05-26Chapman, Ross E Esq RENEWAL35Elwin Sharvill
1028Smith GlickRussia2026-06-13Truhlar And Truhlar Attys NEW1Bernardo Dominic
1029Juan WieserBrazil2026-06-09Commercial Press QUALIFIED21Asiya Javayant
1030Arvin AlbaresIndia2026-05-23Chanay, Jeffrey A Esq NEW53Xuxue Feng
1031Faith GillianCanada2026-05-28Benton, John B Jr UNQUALIFIED80Elwin Sharvill
1032Antonio CaudyRussia2026-06-15Rousseaux, Michael Esq RENEWAL69Ioni Bowcher
1033Morrow RutaUnited Kingdom2026-05-29Morlong Associates UNQUALIFIED94Ioni Bowcher
1034Clifford RimItaly2026-06-19King, Christopher A Esq NEW19Asiya Javayant
1035Nicolas IturbideFrance2026-06-08Chanay, Jeffrey A Esq NEGOTIATION72Asiya Javayant
1036Ashley DoeRussia2026-06-04Truhlar And Truhlar Attys NEW92Onyama Limba
1037Mayumi KolmetzGermany2026-06-11Truhlar And Truhlar Attys QUALIFIED85Onyama Limba
1038Tony FollerItaly2026-06-20Benton, John B Jr NEGOTIATION98Ioni Bowcher
1039Murillo MaletCanada2026-06-13Feltz Printing Service UNQUALIFIED14Stephen Shaw
1040Kaitlin OstroskyFrance2026-06-20Benton, John B Jr QUALIFIED92Xuxue Feng
1041Aditya KuskoCanada2026-06-08Truhlar And Truhlar Attys NEW45Elwin Sharvill
1042Rodrigues CampainGermany2026-05-30Dorl, James J Esq RENEWAL84Asiya Javayant
1043James ButtRussia2026-06-05Rousseaux, Michael Esq RENEWAL52Asiya Javayant
1044Julie StensethCanada2026-06-01Truhlar And Truhlar Attys NEW59Bernardo Dominic
1045Silvio SlusarskiSpain2026-06-21Chanay, Jeffrey A Esq NEW43Bernardo Dominic
1046Kadeem FlosiItaly2026-06-10Rousseaux, Michael Esq NEGOTIATION15Onyama Limba
1047Munro FerenczAustralia2026-06-01Printing Dimensions NEGOTIATION49Onyama Limba
1048Claire TollnerJapan2026-06-08King, Christopher A Esq NEGOTIATION37Ioni Bowcher
1049Jefferson SchemmerSpain2026-06-16Rangoni Of Florence PROPOSAL61Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Costa DilliardIndiaXuxue Feng NEGOTIATION
Mujtaba NickaJapanXuxue Feng RENEWAL
Jeanfrancois VenereArgentinaBernardo Dominic NEGOTIATION
Misaki RoysterRussiaElwin Sharvill QUALIFIED
Darci PoquetteUnited KingdomAsiya Javayant QUALIFIED
Darci PoquetteUnited KingdomXuxue Feng NEGOTIATION
Morrow RutaFranceAmy Elsner QUALIFIED
Alejandro PerinBrazilStephen Shaw RENEWAL
Mujtaba NickaUnited KingdomAnna Fali UNQUALIFIED
Octavia MaletItalyStephen Shaw PROPOSAL
Greenwood BologniaBrazilXuxue Feng NEGOTIATION
Nicolas IturbideGermanyOnyama Limba RENEWAL
Jones VocelkaRussiaBernardo Dominic RENEWAL
Alejandro PerinGermanyBernardo Dominic PROPOSAL
Kaitlin OstroskyFranceOnyama Limba NEW
Faith GillianArgentinaElwin Sharvill UNQUALIFIED
Kaitlin OstroskyUnited KingdomAnna Fali NEGOTIATION
Claire TollnerCanadaAsiya Javayant UNQUALIFIED
Jefferson SchemmerGermanyIoni Bowcher UNQUALIFIED
Izzy GarufiBrazilAmy Elsner RENEWAL
Mujtaba NickaJapanStephen Shaw UNQUALIFIED
David DarakjyRussiaBernardo Dominic NEGOTIATION
Mayumi KolmetzUnited KingdomIoni Bowcher QUALIFIED
Ashley DoeJapanBernardo Dominic UNQUALIFIED
Murillo MaletRussiaAnna Fali UNQUALIFIED
Mujtaba NickaArgentinaIvan Magalhaes QUALIFIED
Izzy GarufiRussiaIoni Bowcher RENEWAL
Clifford RimBrazilIvan Magalhaes UNQUALIFIED
Juan WieserBrazilBernardo Dominic NEGOTIATION
Morrow RutaItalyXuxue Feng NEGOTIATION
Isabel BowleyUnited KingdomBernardo Dominic NEW
Alejandro PerinItalyIvan Magalhaes NEGOTIATION
Johnson SergiItalyAnna Fali NEW
Munro FerenczGermanyAmy Elsner NEGOTIATION
Darci PoquetteCanadaBernardo Dominic QUALIFIED
Nicolas IturbideBrazilOnyama Limba NEW
Clifford RimAustraliaAmy Elsner NEW
Juan WieserCanadaOnyama Limba NEGOTIATION
Wickens NestleRussiaIoni Bowcher RENEWAL
Kaitlin OstroskyRussiaIoni Bowcher QUALIFIED
Darci PoquetteSpainOnyama Limba NEGOTIATION
Chavez BriddickBrazilIvan Magalhaes PROPOSAL
Darci PoquetteRussiaIoni Bowcher UNQUALIFIED
Arvin AlbaresSpainXuxue Feng QUALIFIED
Arvin AlbaresBrazilAnna Fali NEGOTIATION
Chavez BriddickArgentinaIoni Bowcher QUALIFIED
Greenwood BologniaJapanAnna Fali RENEWAL
Leja CaldareraJapanAnna Fali PROPOSAL
Julie StensethArgentinaElwin Sharvill NEGOTIATION
Jennifer AmigonAustraliaOnyama Limba UNQUALIFIED
Frozen Columns
Name
Tony Foller
Stacey Maclead
Francesco Shinko
Jefferson Schemmer
Arvin Albares
Adams Morasca
Jefferson Schemmer
Murillo Malet
Alejandro Perin
Cody Saylors
Greenwood Bolognia
Costa Dilliard
Ricardo Gaucho
Julie Stenseth
Silvio Slusarski
Isabel Bowley
Maisha Rulapaugh
Arvin Albares
Smith Glick
Sinclair Waycott
Murillo Malet
Claire Tollner
Mayumi Kolmetz
Francesco Shinko
Murillo Malet
Johnson Sergi
Julie Stenseth
Francesco Shinko
Claire Tollner
Antonio Caudy
Izzy Garufi
Francesco Shinko
Tony Foller
Johnson Sergi
Claire Tollner
Arvin Albares
Darci Poquette
Ricardo Gaucho
Aruna Figeroa
Deepesh Chui
Juan Wieser
Isabel Bowley
Juan Wieser
Clifford Rim
James Butt
Jeanfrancois Venere
Ashley Doe
Mayumi Kolmetz
Leon Oldroyd
Stacey Maclead
IdCountryDate
1000Italy2026-06-17
1001Spain2026-05-25
1002Germany2026-06-17
1003United Kingdom2026-05-27
1004Canada2026-06-18
1005Japan2026-06-14
1006Brazil2026-06-08
1007Japan2026-06-02
1008Argentina2026-06-14
1009France2026-05-27
1010Argentina2026-06-10
1011Brazil2026-06-20
1012France2026-05-24
1013Russia2026-06-08
1014Argentina2026-05-29
1015Spain2026-06-05
1016Italy2026-06-03
1017Germany2026-06-21
1018Brazil2026-05-24
1019Australia2026-06-04
1020Italy2026-06-06
1021Germany2026-06-21
1022Germany2026-06-15
1023Germany2026-06-02
1024India2026-06-17
1025Australia2026-05-23
1026Australia2026-06-04
1027Spain2026-06-21
1028United Kingdom2026-06-17
1029Canada2026-06-14
1030Germany2026-05-28
1031Canada2026-06-17
1032Germany2026-05-26
1033Russia2026-05-29
1034Russia2026-05-25
1035Spain2026-06-14
1036Canada2026-06-21
1037Germany2026-06-21
1038Spain2026-05-24
1039Spain2026-05-26
1040Germany2026-06-12
1041Argentina2026-06-14
1042France2026-06-10
1043United Kingdom2026-06-06
1044Japan2026-06-11
1045Argentina2026-06-05
1046India2026-05-31
1047Russia2026-05-31
1048Brazil2026-06-11
1049India2026-06-09

On-Demand Data

NameIdCountryDate
Aika Inouye1000Spain2026-06-12
Leja Caldarera1001Brazil2026-06-01
Leon Oldroyd1002Russia2026-06-05
Stacey Maclead1003Australia2026-06-06
Greenwood Bolognia1004Germany2026-05-29
Wickens Nestle1005India2026-05-27
Mujtaba Nicka1006Italy2026-06-18
Antonio Caudy1007United Kingdom2026-06-06
Johnson Sergi1008France2026-06-15
Adams Morasca1009India2026-06-15
Murillo Malet1010Japan2026-05-25
Munro Ferencz1011Brazil2026-06-04
Jones Vocelka1012Spain2026-06-06
Jennifer Amigon1013France2026-06-09
Leon Oldroyd1014Italy2026-06-05
Darci Poquette1015Japan2026-05-24
Deepesh Chui1016India2026-06-09
Darci Poquette1017United Kingdom2026-05-29
Juan Wieser1018Spain2026-06-07
Darci Poquette1019India2026-05-26
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Antonio CaudyArgentinaXuxue Feng PROPOSAL
Kaitlin OstroskyItalyOnyama Limba QUALIFIED
Munro FerenczSpainAnna Fali QUALIFIED
Juan WieserJapanXuxue Feng UNQUALIFIED
Isabel BowleyCanadaIvan Magalhaes NEGOTIATION
Costa DilliardFranceIoni Bowcher NEW
Stacey MacleadJapanStephen Shaw PROPOSAL
Aruna FigeroaCanadaOnyama Limba QUALIFIED
Faith GillianJapanElwin Sharvill PROPOSAL
Izzy GarufiArgentinaBernardo Dominic PROPOSAL
Silvio SlusarskiItalyXuxue Feng NEGOTIATION
Arvin AlbaresJapanAnna Fali QUALIFIED
Salvatore StockhamArgentinaElwin Sharvill NEW
Darci PoquetteUnited KingdomAnna Fali PROPOSAL
Costa DilliardJapanBernardo Dominic UNQUALIFIED
Kadeem FlosiAustraliaBernardo Dominic UNQUALIFIED
Silvio SlusarskiGermanyStephen Shaw NEGOTIATION
Sinclair WaycottAustraliaAnna Fali PROPOSAL
Nicolas IturbideCanadaIoni Bowcher NEGOTIATION
Chavez BriddickArgentinaAsiya Javayant UNQUALIFIED
Smith GlickCanadaBernardo Dominic UNQUALIFIED
Claire TollnerUnited KingdomAnna Fali RENEWAL
Ashley DoeArgentinaBernardo Dominic RENEWAL
Faith GillianArgentinaAmy Elsner UNQUALIFIED
Wickens NestleRussiaStephen Shaw NEW
Maisha RulapaughJapanOnyama Limba UNQUALIFIED
Sinclair WaycottArgentinaIvan Magalhaes RENEWAL
Smith GlickArgentinaXuxue Feng QUALIFIED
Jefferson SchemmerFranceXuxue Feng QUALIFIED
Maisha RulapaughCanadaXuxue Feng PROPOSAL
Murillo MaletRussiaIoni Bowcher UNQUALIFIED
Murillo MaletGermanyAnna Fali PROPOSAL
Francesco ShinkoArgentinaOnyama Limba RENEWAL
Tony FollerUnited KingdomAsiya Javayant NEGOTIATION
Julie StensethAustraliaAsiya Javayant QUALIFIED
Jones VocelkaRussiaAmy Elsner NEW
Kadeem FlosiIndiaAnna Fali NEW
Maisha RulapaughGermanyOnyama Limba PROPOSAL
Adams MorascaGermanyElwin Sharvill PROPOSAL
Faith GillianGermanyElwin Sharvill PROPOSAL

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