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
Ivar PaprockiBrazilStephen Shaw NEW
Kadeem FlosiUnited KingdomIvan Magalhaes NEGOTIATION
Sinclair WaycottBrazilStephen Shaw UNQUALIFIED
Emily WhobreyIndiaIoni Bowcher NEW
Smith GlickJapanIoni Bowcher NEW
Wickens NestleRussiaAmy Elsner NEGOTIATION
Aditya KuskoUnited KingdomStephen Shaw QUALIFIED
Aruna FigeroaGermanyStephen Shaw RENEWAL
Murillo MaletAustraliaAnna Fali UNQUALIFIED
Tony FollerAustraliaAnna Fali UNQUALIFIED
Mayumi KolmetzFranceIoni Bowcher NEGOTIATION
Jefferson SchemmerAustraliaElwin Sharvill RENEWAL
Izzy GarufiFranceOnyama Limba NEW
Maria MarrierUnited KingdomXuxue Feng UNQUALIFIED
Rodrigues CampainBrazilAmy Elsner QUALIFIED
Leon OldroydItalyAnna Fali NEW
Maisha RulapaughIndiaAsiya Javayant NEGOTIATION
David DarakjyJapanXuxue Feng PROPOSAL
Greenwood BologniaItalyAsiya Javayant RENEWAL
Silvio SlusarskiAustraliaIvan Magalhaes QUALIFIED
Stacey MacleadFranceElwin Sharvill UNQUALIFIED
Wickens NestleJapanIvan Magalhaes NEGOTIATION
Aruna FigeroaRussiaAnna Fali QUALIFIED
Mujtaba NickaUnited KingdomAmy Elsner NEGOTIATION
Munro FerenczArgentinaAsiya Javayant UNQUALIFIED
Jefferson SchemmerAustraliaAsiya Javayant RENEWAL
Wickens NestleAustraliaElwin Sharvill NEGOTIATION
Morrow RutaAustraliaAnna Fali QUALIFIED
James ButtRussiaStephen Shaw NEW
Chavez BriddickBrazilBernardo Dominic NEW
Misaki RoysterRussiaIoni Bowcher NEW
Isabel BowleyJapanIvan Magalhaes PROPOSAL
Mujtaba NickaArgentinaAnna Fali QUALIFIED
Ashley DoeFranceAsiya Javayant NEW
Aruna FigeroaArgentinaAmy Elsner PROPOSAL
Arvin AlbaresRussiaAsiya Javayant PROPOSAL
Juan WieserItalyAnna Fali NEW
Aruna FigeroaArgentinaIoni Bowcher NEW
Maisha RulapaughBrazilOnyama Limba QUALIFIED
Aditya KuskoFranceAnna Fali UNQUALIFIED
Nicolas IturbideCanadaBernardo Dominic NEW
James ButtUnited KingdomOnyama Limba NEGOTIATION
Antonio CaudyItalyAsiya Javayant PROPOSAL
Antonio CaudyAustraliaElwin Sharvill RENEWAL
Izzy GarufiGermanyOnyama Limba QUALIFIED
Ricardo GauchoJapanElwin Sharvill QUALIFIED
Adams MorascaJapanXuxue Feng PROPOSAL
Jones VocelkaSpainElwin Sharvill NEGOTIATION
James ButtAustraliaIoni Bowcher PROPOSAL
Nicolas IturbideArgentinaAmy Elsner NEW
Horizontal
NameCountryRepresentativeStatus
Jennifer AmigonJapanElwin Sharvill RENEWAL
Sinclair WaycottIndiaIvan Magalhaes NEW
Smith GlickRussiaXuxue Feng UNQUALIFIED
Sinclair WaycottIndiaStephen Shaw NEGOTIATION
Chavez BriddickUnited KingdomIoni Bowcher NEGOTIATION
Rodrigues CampainRussiaBernardo Dominic RENEWAL
Nicolas IturbideJapanAmy Elsner QUALIFIED
Darci PoquetteGermanyIoni Bowcher UNQUALIFIED
Jefferson SchemmerUnited KingdomIvan Magalhaes NEW
Mujtaba NickaGermanyAsiya Javayant QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Maria MarrierIndia2026-06-11Chapman, Ross E Esq RENEWAL5Ioni Bowcher
1001Kaitlin OstroskyIndia2026-06-07King, Christopher A Esq PROPOSAL34Elwin Sharvill
1002Nicolas IturbideRussia2026-05-27Commercial Press PROPOSAL53Bernardo Dominic
1003Darci PoquetteItaly2026-06-01Benton, John B Jr PROPOSAL12Asiya Javayant
1004Maria MarrierGermany2026-05-21Benton, John B Jr PROPOSAL58Elwin Sharvill
1005Mayumi KolmetzBrazil2026-05-19Chemel, James L Cpa NEW20Elwin Sharvill
1006Misaki RoysterRussia2026-06-15Morlong Associates UNQUALIFIED52Anna Fali
1007Maisha RulapaughArgentina2026-05-22Rangoni Of Florence NEGOTIATION41Ioni Bowcher
1008Leon OldroydBrazil2026-06-02Benton, John B Jr QUALIFIED3Anna Fali
1009Rodrigues CampainCanada2026-05-26Buckley Miller Wright QUALIFIED62Asiya Javayant
1010Salvatore StockhamFrance2026-06-10Truhlar And Truhlar Attys UNQUALIFIED50Bernardo Dominic
1011Aruna FigeroaFrance2026-06-06Buckley Miller Wright NEGOTIATION74Anna Fali
1012Costa DilliardSpain2026-05-27Buckley Miller Wright PROPOSAL51Ivan Magalhaes
1013David DarakjySpain2026-06-09King, Christopher A Esq NEGOTIATION55Bernardo Dominic
1014Salvatore StockhamAustralia2026-06-09Feltz Printing Service NEW32Xuxue Feng
1015Ricardo GauchoIndia2026-05-27Printing Dimensions UNQUALIFIED72Ivan Magalhaes
1016Aika InouyeAustralia2026-06-16Truhlar And Truhlar Attys NEW45Ivan Magalhaes
1017Ivar PaprockiCanada2026-05-29Feltz Printing Service QUALIFIED77Stephen Shaw
1018Arvin AlbaresUnited Kingdom2026-06-16Truhlar And Truhlar Attys NEGOTIATION45Asiya Javayant
1019Jones VocelkaGermany2026-06-03Morlong Associates UNQUALIFIED98Elwin Sharvill
1020Octavia MaletGermany2026-06-05Rousseaux, Michael Esq UNQUALIFIED36Ivan Magalhaes
1021Tony FollerBrazil2026-06-17Chanay, Jeffrey A Esq NEW94Ioni Bowcher
1022Salvatore StockhamItaly2026-06-04Chapman, Ross E Esq NEGOTIATION7Bernardo Dominic
1023Claire TollnerGermany2026-06-02King, Christopher A Esq NEGOTIATION52Amy Elsner
1024Jefferson SchemmerJapan2026-05-24Morlong Associates NEGOTIATION41Xuxue Feng
1025Clifford RimBrazil2026-05-24Dorl, James J Esq NEGOTIATION74Bernardo Dominic
1026Mayumi KolmetzArgentina2026-05-27Rousseaux, Michael Esq QUALIFIED12Ioni Bowcher
1027Silvio SlusarskiGermany2026-06-15Chemel, James L Cpa QUALIFIED89Elwin Sharvill
1028Sinclair WaycottArgentina2026-06-07Commercial Press PROPOSAL29Asiya Javayant
1029Aika InouyeBrazil2026-06-14Dorl, James J Esq QUALIFIED69Onyama Limba
1030Morrow RutaRussia2026-06-07Chanay, Jeffrey A Esq QUALIFIED45Stephen Shaw
1031Faith GillianUnited Kingdom2026-05-22Rangoni Of Florence RENEWAL8Anna Fali
1032Munro FerenczUnited Kingdom2026-06-13Truhlar And Truhlar Attys NEW14Elwin Sharvill
1033Adams MorascaUnited Kingdom2026-05-31Printing Dimensions RENEWAL91Anna Fali
1034Misaki RoysterGermany2026-06-10Commercial Press UNQUALIFIED27Asiya Javayant
1035Jones VocelkaItaly2026-05-25Chanay, Jeffrey A Esq RENEWAL12Bernardo Dominic
1036Sinclair WaycottFrance2026-05-30Buckley Miller Wright QUALIFIED47Xuxue Feng
1037Ivar PaprockiJapan2026-06-05Dorl, James J Esq NEW95Xuxue Feng
1038Cody SaylorsItaly2026-06-12Feltz Printing Service UNQUALIFIED32Ivan Magalhaes
1039Aika InouyeBrazil2026-05-27Benton, John B Jr UNQUALIFIED20Amy Elsner
1040Jennifer AmigonCanada2026-05-28Dorl, James J Esq UNQUALIFIED67Anna Fali
1041Alejandro PerinAustralia2026-06-12Benton, John B Jr NEGOTIATION74Ioni Bowcher
1042Clifford RimAustralia2026-06-14Chapman, Ross E Esq NEGOTIATION89Bernardo Dominic
1043Aruna FigeroaFrance2026-05-31Chemel, James L Cpa PROPOSAL8Stephen Shaw
1044Nicolas IturbideCanada2026-05-28Truhlar And Truhlar Attys UNQUALIFIED60Amy Elsner
1045Sinclair WaycottBrazil2026-06-03Buckley Miller Wright NEW38Ivan Magalhaes
1046Rodrigues CampainIndia2026-06-07Feltz Printing Service NEGOTIATION88Xuxue Feng
1047Mujtaba NickaSpain2026-06-10King, Christopher A Esq UNQUALIFIED81Amy Elsner
1048Juan WieserItaly2026-05-24Chanay, Jeffrey A Esq PROPOSAL85Onyama Limba
1049Nicolas IturbideCanada2026-06-03Chapman, Ross E Esq UNQUALIFIED56Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Munro FerenczIndiaAnna Fali PROPOSAL
Jones VocelkaSpainStephen Shaw RENEWAL
Mayumi KolmetzFranceIoni Bowcher UNQUALIFIED
Ricardo GauchoJapanAnna Fali PROPOSAL
Smith GlickSpainAsiya Javayant UNQUALIFIED
Wickens NestleBrazilAsiya Javayant QUALIFIED
Faith GillianBrazilIoni Bowcher NEGOTIATION
Aditya KuskoJapanAmy Elsner PROPOSAL
Greenwood BologniaFranceIoni Bowcher PROPOSAL
Emily WhobreyRussiaXuxue Feng NEGOTIATION
Arvin AlbaresGermanyAsiya Javayant NEW
Deepesh ChuiSpainIoni Bowcher RENEWAL
Maisha RulapaughGermanyAmy Elsner RENEWAL
Chavez BriddickFranceBernardo Dominic NEGOTIATION
Aika InouyeGermanyXuxue Feng PROPOSAL
Aika InouyeRussiaOnyama Limba NEGOTIATION
Deepesh ChuiItalyStephen Shaw NEGOTIATION
Ricardo GauchoAustraliaIvan Magalhaes QUALIFIED
Leja CaldareraItalyElwin Sharvill QUALIFIED
Morrow RutaBrazilAnna Fali UNQUALIFIED
Chavez BriddickCanadaAsiya Javayant NEGOTIATION
Kaitlin OstroskyFranceXuxue Feng PROPOSAL
Juan WieserRussiaAnna Fali QUALIFIED
Izzy GarufiRussiaStephen Shaw NEGOTIATION
Leja CaldareraJapanOnyama Limba NEGOTIATION
Munro FerenczRussiaAmy Elsner QUALIFIED
James ButtAustraliaXuxue Feng NEGOTIATION
Maria MarrierArgentinaBernardo Dominic RENEWAL
James ButtItalyElwin Sharvill UNQUALIFIED
Mayumi KolmetzBrazilXuxue Feng UNQUALIFIED
Isabel BowleyCanadaXuxue Feng QUALIFIED
Greenwood BologniaFranceAmy Elsner QUALIFIED
Maisha RulapaughRussiaIvan Magalhaes PROPOSAL
Jefferson SchemmerBrazilIoni Bowcher QUALIFIED
Faith GillianUnited KingdomElwin Sharvill UNQUALIFIED
Maisha RulapaughJapanAsiya Javayant PROPOSAL
James ButtIndiaOnyama Limba PROPOSAL
Claire TollnerUnited KingdomAnna Fali UNQUALIFIED
Jones VocelkaUnited KingdomBernardo Dominic NEW
Johnson SergiUnited KingdomAnna Fali QUALIFIED
Jefferson SchemmerUnited KingdomOnyama Limba PROPOSAL
Maisha RulapaughUnited KingdomIvan Magalhaes NEGOTIATION
Jennifer AmigonCanadaIoni Bowcher PROPOSAL
Nicolas IturbideUnited KingdomBernardo Dominic RENEWAL
Salvatore StockhamArgentinaIvan Magalhaes NEW
Clifford RimJapanElwin Sharvill RENEWAL
Johnson SergiItalyIoni Bowcher PROPOSAL
Misaki RoysterIndiaElwin Sharvill QUALIFIED
Aika InouyeUnited KingdomOnyama Limba NEGOTIATION
Misaki RoysterFranceAmy Elsner QUALIFIED
Frozen Columns
Name
Greenwood Bolognia
Aruna Figeroa
Maria Marrier
Emily Whobrey
Costa Dilliard
Salvatore Stockham
Misaki Royster
Izzy Garufi
Salvatore Stockham
Rodrigues Campain
Emily Whobrey
Francesco Shinko
Silvio Slusarski
Munro Ferencz
Morrow Ruta
Leja Caldarera
Aditya Kusko
Julie Stenseth
Greenwood Bolognia
Aika Inouye
Jefferson Schemmer
Leon Oldroyd
Jones Vocelka
Costa Dilliard
Rodrigues Campain
Maisha Rulapaugh
Cody Saylors
Claire Tollner
Johnson Sergi
Chavez Briddick
Faith Gillian
Faith Gillian
Sinclair Waycott
Ricardo Gaucho
Greenwood Bolognia
Misaki Royster
Mujtaba Nicka
Munro Ferencz
Costa Dilliard
Arvin Albares
Chavez Briddick
Alejandro Perin
Misaki Royster
Ashley Doe
Murillo Malet
Kadeem Flosi
Ivar Paprocki
Wickens Nestle
Jennifer Amigon
Juan Wieser
IdCountryDate
1000France2026-06-02
1001Italy2026-06-12
1002India2026-06-15
1003Canada2026-05-24
1004Japan2026-06-07
1005Argentina2026-06-04
1006Italy2026-06-07
1007India2026-05-31
1008Germany2026-06-01
1009Australia2026-06-12
1010Spain2026-05-22
1011Spain2026-06-02
1012Australia2026-05-24
1013Japan2026-06-12
1014Australia2026-05-21
1015Japan2026-06-12
1016Germany2026-06-16
1017Brazil2026-06-07
1018Japan2026-06-12
1019Germany2026-06-16
1020India2026-05-22
1021Japan2026-05-31
1022Italy2026-06-10
1023Italy2026-06-16
1024Brazil2026-06-11
1025Germany2026-06-05
1026Brazil2026-06-02
1027Argentina2026-06-06
1028Brazil2026-05-20
1029Russia2026-05-25
1030Australia2026-06-15
1031Argentina2026-05-22
1032Germany2026-05-30
1033Argentina2026-05-30
1034Brazil2026-06-01
1035Brazil2026-06-08
1036India2026-05-22
1037Brazil2026-06-12
1038India2026-06-16
1039Argentina2026-06-04
1040Brazil2026-06-15
1041United Kingdom2026-06-04
1042Canada2026-06-03
1043Germany2026-05-28
1044Brazil2026-06-15
1045Italy2026-06-04
1046Canada2026-06-01
1047Argentina2026-05-25
1048Italy2026-06-11
1049Italy2026-06-06

On-Demand Data

NameIdCountryDate
Jennifer Amigon1000Australia2026-06-11
Mayumi Kolmetz1001France2026-05-27
Aditya Kusko1002Italy2026-06-02
Ricardo Gaucho1003Japan2026-06-17
Aditya Kusko1004Italy2026-06-09
Kaitlin Ostrosky1005Japan2026-06-17
Jennifer Amigon1006Germany2026-05-23
Maisha Rulapaugh1007Italy2026-05-31
Francesco Shinko1008France2026-06-16
Antonio Caudy1009Spain2026-05-30
Aika Inouye1010Argentina2026-05-25
Jones Vocelka1011United Kingdom2026-05-26
Leon Oldroyd1012Italy2026-06-13
Adams Morasca1013Argentina2026-06-08
Ricardo Gaucho1014Argentina2026-06-06
Leja Caldarera1015Italy2026-05-22
Ashley Doe1016India2026-06-12
Aruna Figeroa1017Argentina2026-05-24
Tony Foller1018France2026-06-02
Ashley Doe1019Brazil2026-06-03
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Rodrigues CampainBrazilAnna Fali RENEWAL
Faith GillianIndiaStephen Shaw RENEWAL
Emily WhobreyArgentinaElwin Sharvill RENEWAL
Johnson SergiAustraliaOnyama Limba PROPOSAL
Darci PoquetteUnited KingdomAnna Fali PROPOSAL
David DarakjyBrazilBernardo Dominic NEW
Smith GlickItalyOnyama Limba QUALIFIED
Tony FollerAustraliaAnna Fali QUALIFIED
Cody SaylorsIndiaIoni Bowcher PROPOSAL
Maria MarrierItalyAsiya Javayant NEW
Clifford RimArgentinaIvan Magalhaes UNQUALIFIED
Leon OldroydCanadaIoni Bowcher RENEWAL
Aditya KuskoUnited KingdomXuxue Feng QUALIFIED
Arvin AlbaresFranceAnna Fali RENEWAL
Wickens NestleCanadaElwin Sharvill QUALIFIED
Nicolas IturbideFranceOnyama Limba NEW
Salvatore StockhamGermanyXuxue Feng UNQUALIFIED
Antonio CaudyUnited KingdomAnna Fali RENEWAL
Faith GillianJapanXuxue Feng PROPOSAL
David DarakjyArgentinaStephen Shaw PROPOSAL
Jefferson SchemmerCanadaAnna Fali QUALIFIED
Ashley DoeArgentinaOnyama Limba RENEWAL
Arvin AlbaresBrazilAnna Fali RENEWAL
Mayumi KolmetzRussiaStephen Shaw PROPOSAL
Jeanfrancois VenereUnited KingdomOnyama Limba UNQUALIFIED
Jennifer AmigonAustraliaAnna Fali RENEWAL
Octavia MaletCanadaAnna Fali NEW
Darci PoquetteIndiaBernardo Dominic QUALIFIED
Claire TollnerBrazilIvan Magalhaes PROPOSAL
Smith GlickGermanyBernardo Dominic UNQUALIFIED
Isabel BowleySpainAmy Elsner PROPOSAL
Costa DilliardArgentinaXuxue Feng QUALIFIED
Mujtaba NickaJapanIvan Magalhaes NEGOTIATION
Jeanfrancois VenereGermanyAnna Fali QUALIFIED
Murillo MaletIndiaOnyama Limba NEW
David DarakjyUnited KingdomOnyama Limba NEGOTIATION
Ivar PaprockiJapanAsiya Javayant PROPOSAL
Izzy GarufiUnited KingdomElwin Sharvill UNQUALIFIED
Ivar PaprockiAustraliaOnyama Limba UNQUALIFIED
Smith GlickUnited KingdomIoni Bowcher 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>