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
Rodrigues CampainFranceAnna Fali QUALIFIED
Faith GillianSpainAsiya Javayant UNQUALIFIED
Darci PoquetteArgentinaAmy Elsner UNQUALIFIED
Octavia MaletAustraliaAnna Fali NEGOTIATION
Maria MarrierRussiaElwin Sharvill QUALIFIED
Claire TollnerIndiaElwin Sharvill NEGOTIATION
Smith GlickCanadaIoni Bowcher QUALIFIED
Leon OldroydBrazilIoni Bowcher RENEWAL
Kadeem FlosiFranceXuxue Feng NEW
Claire TollnerIndiaXuxue Feng RENEWAL
Morrow RutaRussiaAmy Elsner UNQUALIFIED
Mujtaba NickaBrazilAsiya Javayant QUALIFIED
Munro FerenczGermanyAnna Fali QUALIFIED
Jones VocelkaJapanAmy Elsner QUALIFIED
Wickens NestleJapanAmy Elsner NEGOTIATION
Munro FerenczJapanIvan Magalhaes NEGOTIATION
Sinclair WaycottRussiaAsiya Javayant UNQUALIFIED
Aditya KuskoAustraliaElwin Sharvill NEGOTIATION
Ivar PaprockiRussiaAnna Fali PROPOSAL
Isabel BowleyArgentinaElwin Sharvill NEW
Aika InouyeUnited KingdomAsiya Javayant QUALIFIED
Ashley DoeIndiaIvan Magalhaes RENEWAL
Costa DilliardAustraliaElwin Sharvill PROPOSAL
Izzy GarufiItalyStephen Shaw NEGOTIATION
Nicolas IturbideAustraliaBernardo Dominic RENEWAL
Adams MorascaCanadaElwin Sharvill NEGOTIATION
Ivar PaprockiBrazilOnyama Limba NEGOTIATION
Kadeem FlosiAustraliaIoni Bowcher UNQUALIFIED
Leon OldroydBrazilBernardo Dominic NEGOTIATION
Smith GlickCanadaBernardo Dominic UNQUALIFIED
Isabel BowleyUnited KingdomBernardo Dominic RENEWAL
Tony FollerBrazilXuxue Feng QUALIFIED
Morrow RutaFranceStephen Shaw RENEWAL
Wickens NestleIndiaAmy Elsner PROPOSAL
Costa DilliardItalyXuxue Feng QUALIFIED
Aditya KuskoIndiaBernardo Dominic UNQUALIFIED
Alejandro PerinAustraliaAmy Elsner PROPOSAL
Faith GillianAustraliaXuxue Feng NEW
Johnson SergiSpainStephen Shaw UNQUALIFIED
Murillo MaletItalyAnna Fali RENEWAL
Tony FollerIndiaIvan Magalhaes RENEWAL
Wickens NestleJapanOnyama Limba QUALIFIED
Kadeem FlosiCanadaAnna Fali QUALIFIED
Jefferson SchemmerAustraliaIvan Magalhaes NEGOTIATION
Chavez BriddickFranceElwin Sharvill NEGOTIATION
Maria MarrierAustraliaBernardo Dominic PROPOSAL
Chavez BriddickBrazilIvan Magalhaes QUALIFIED
Francesco ShinkoUnited KingdomBernardo Dominic NEGOTIATION
Isabel BowleyItalyAnna Fali UNQUALIFIED
Ricardo GauchoRussiaXuxue Feng QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Aruna FigeroaArgentinaStephen Shaw NEGOTIATION
Salvatore StockhamIndiaAmy Elsner UNQUALIFIED
Jennifer AmigonGermanyOnyama Limba RENEWAL
Munro FerenczCanadaAnna Fali NEGOTIATION
Kadeem FlosiArgentinaElwin Sharvill QUALIFIED
Aika InouyeGermanyBernardo Dominic NEGOTIATION
Smith GlickRussiaOnyama Limba NEGOTIATION
Misaki RoysterSpainStephen Shaw UNQUALIFIED
Ricardo GauchoCanadaAsiya Javayant NEW
Claire TollnerGermanyAsiya Javayant RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Smith GlickSpain2026-05-13Rangoni Of Florence PROPOSAL91Ioni Bowcher
1001Murillo MaletIndia2026-05-09Truhlar And Truhlar Attys UNQUALIFIED67Ioni Bowcher
1002Antonio CaudyCanada2026-05-22Morlong Associates UNQUALIFIED42Amy Elsner
1003Jefferson SchemmerRussia2026-05-10Chanay, Jeffrey A Esq QUALIFIED49Bernardo Dominic
1004Aditya KuskoCanada2026-06-06Dorl, James J Esq UNQUALIFIED63Ioni Bowcher
1005Alejandro PerinArgentina2026-05-26Morlong Associates NEGOTIATION57Xuxue Feng
1006Morrow RutaUnited Kingdom2026-06-07Printing Dimensions UNQUALIFIED11Xuxue Feng
1007David DarakjySpain2026-05-30Feltz Printing Service UNQUALIFIED9Elwin Sharvill
1008Jeanfrancois VenereJapan2026-05-25Rousseaux, Michael Esq NEW5Bernardo Dominic
1009Antonio CaudyRussia2026-05-21Rangoni Of Florence NEW16Elwin Sharvill
1010Stacey MacleadUnited Kingdom2026-05-21Benton, John B Jr RENEWAL13Amy Elsner
1011Ricardo GauchoGermany2026-05-28Dorl, James J Esq RENEWAL59Ivan Magalhaes
1012Nicolas IturbideBrazil2026-05-09Commercial Press NEW12Ivan Magalhaes
1013Adams MorascaAustralia2026-06-05Chemel, James L Cpa PROPOSAL38Onyama Limba
1014Octavia MaletArgentina2026-06-03Rangoni Of Florence UNQUALIFIED28Xuxue Feng
1015Aruna FigeroaSpain2026-05-13Benton, John B Jr PROPOSAL74Amy Elsner
1016Murillo MaletRussia2026-05-12Chanay, Jeffrey A Esq RENEWAL7Elwin Sharvill
1017Mayumi KolmetzUnited Kingdom2026-05-18Feltz Printing Service RENEWAL28Anna Fali
1018James ButtUnited Kingdom2026-05-22Commercial Press PROPOSAL82Ioni Bowcher
1019Alejandro PerinSpain2026-05-19Printing Dimensions QUALIFIED80Xuxue Feng
1020Jones VocelkaGermany2026-05-18Chapman, Ross E Esq UNQUALIFIED54Ivan Magalhaes
1021Johnson SergiCanada2026-05-22Commercial Press PROPOSAL78Stephen Shaw
1022Octavia MaletArgentina2026-06-03Benton, John B Jr PROPOSAL78Amy Elsner
1023Adams MorascaFrance2026-05-26Feltz Printing Service RENEWAL37Onyama Limba
1024Aika InouyeFrance2026-05-20Chapman, Ross E Esq PROPOSAL82Amy Elsner
1025Aditya KuskoFrance2026-06-01Feiner Bros UNQUALIFIED66Bernardo Dominic
1026Cody SaylorsCanada2026-05-28Feltz Printing Service NEW62Anna Fali
1027Maria MarrierItaly2026-05-12Feiner Bros PROPOSAL70Elwin Sharvill
1028Leon OldroydRussia2026-05-27Chapman, Ross E Esq NEW7Bernardo Dominic
1029Arvin AlbaresAustralia2026-05-21Morlong Associates QUALIFIED63Ioni Bowcher
1030Mujtaba NickaUnited Kingdom2026-05-29Chanay, Jeffrey A Esq QUALIFIED82Onyama Limba
1031Adams MorascaCanada2026-06-01Truhlar And Truhlar Attys QUALIFIED73Asiya Javayant
1032Kadeem FlosiIndia2026-06-04King, Christopher A Esq NEW30Amy Elsner
1033Jeanfrancois VenereUnited Kingdom2026-05-24Benton, John B Jr NEW47Ivan Magalhaes
1034Nicolas IturbideArgentina2026-05-26Dorl, James J Esq PROPOSAL85Amy Elsner
1035Kadeem FlosiArgentina2026-06-07Chemel, James L Cpa NEGOTIATION32Ioni Bowcher
1036Tony FollerFrance2026-05-20Commercial Press NEGOTIATION84Ivan Magalhaes
1037Ricardo GauchoJapan2026-06-06Benton, John B Jr NEGOTIATION71Xuxue Feng
1038Maria MarrierUnited Kingdom2026-05-17Truhlar And Truhlar Attys PROPOSAL94Ioni Bowcher
1039Nicolas IturbideFrance2026-06-07Chapman, Ross E Esq RENEWAL43Amy Elsner
1040Rodrigues CampainRussia2026-06-02Buckley Miller Wright PROPOSAL2Anna Fali
1041Leja CaldareraSpain2026-05-23Benton, John B Jr NEGOTIATION10Onyama Limba
1042Darci PoquetteIndia2026-05-18Commercial Press NEGOTIATION25Bernardo Dominic
1043Morrow RutaItaly2026-05-12Benton, John B Jr NEGOTIATION62Asiya Javayant
1044Julie StensethSpain2026-05-27King, Christopher A Esq NEW90Elwin Sharvill
1045Julie StensethAustralia2026-05-23King, Christopher A Esq NEGOTIATION86Amy Elsner
1046Claire TollnerSpain2026-05-23Chemel, James L Cpa PROPOSAL77Ivan Magalhaes
1047Wickens NestleGermany2026-05-09Benton, John B Jr NEW17Anna Fali
1048Ashley DoeBrazil2026-06-01Chanay, Jeffrey A Esq UNQUALIFIED99Elwin Sharvill
1049Tony FollerJapan2026-06-07Chemel, James L Cpa UNQUALIFIED70Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Cody SaylorsIndiaXuxue Feng PROPOSAL
Wickens NestleGermanyIvan Magalhaes RENEWAL
Misaki RoysterIndiaAsiya Javayant PROPOSAL
Morrow RutaCanadaBernardo Dominic QUALIFIED
Tony FollerGermanyIvan Magalhaes NEW
Arvin AlbaresJapanOnyama Limba UNQUALIFIED
Chavez BriddickJapanIvan Magalhaes PROPOSAL
Adams MorascaAustraliaAsiya Javayant PROPOSAL
Izzy GarufiJapanElwin Sharvill PROPOSAL
Jones VocelkaCanadaElwin Sharvill RENEWAL
Leja CaldareraAustraliaIvan Magalhaes NEW
Jeanfrancois VenereGermanyAsiya Javayant UNQUALIFIED
Stacey MacleadGermanyStephen Shaw UNQUALIFIED
Izzy GarufiGermanyIoni Bowcher NEGOTIATION
James ButtBrazilAnna Fali UNQUALIFIED
Ashley DoeRussiaBernardo Dominic QUALIFIED
Antonio CaudyAustraliaAnna Fali QUALIFIED
Arvin AlbaresArgentinaIoni Bowcher RENEWAL
Ashley DoeIndiaElwin Sharvill RENEWAL
Kadeem FlosiBrazilIvan Magalhaes NEW
Jeanfrancois VenereSpainOnyama Limba QUALIFIED
Sinclair WaycottIndiaAnna Fali NEW
Emily WhobreyBrazilIoni Bowcher PROPOSAL
Antonio CaudyIndiaElwin Sharvill NEGOTIATION
Maisha RulapaughGermanyOnyama Limba NEW
Nicolas IturbideSpainElwin Sharvill RENEWAL
Darci PoquetteIndiaStephen Shaw NEGOTIATION
Costa DilliardSpainBernardo Dominic PROPOSAL
Misaki RoysterRussiaStephen Shaw QUALIFIED
Clifford RimAustraliaOnyama Limba PROPOSAL
Wickens NestleSpainStephen Shaw UNQUALIFIED
Jefferson SchemmerJapanBernardo Dominic PROPOSAL
Isabel BowleyUnited KingdomAnna Fali RENEWAL
Maria MarrierIndiaXuxue Feng NEW
Maria MarrierSpainElwin Sharvill PROPOSAL
Jennifer AmigonAustraliaXuxue Feng PROPOSAL
Adams MorascaSpainXuxue Feng NEGOTIATION
Tony FollerRussiaAsiya Javayant UNQUALIFIED
Julie StensethIndiaStephen Shaw RENEWAL
Murillo MaletItalyStephen Shaw PROPOSAL
Cody SaylorsCanadaElwin Sharvill UNQUALIFIED
Mujtaba NickaFranceOnyama Limba RENEWAL
David DarakjyUnited KingdomIoni Bowcher PROPOSAL
David DarakjyRussiaOnyama Limba NEGOTIATION
Clifford RimSpainAnna Fali NEGOTIATION
Costa DilliardCanadaAsiya Javayant QUALIFIED
Rodrigues CampainUnited KingdomOnyama Limba RENEWAL
Jeanfrancois VenereArgentinaXuxue Feng UNQUALIFIED
Aruna FigeroaRussiaStephen Shaw NEW
Misaki RoysterGermanyBernardo Dominic QUALIFIED
Frozen Columns
Name
Rodrigues Campain
Sinclair Waycott
Antonio Caudy
Arvin Albares
Juan Wieser
Arvin Albares
Leon Oldroyd
Maria Marrier
Kaitlin Ostrosky
Jones Vocelka
Jennifer Amigon
Isabel Bowley
Leja Caldarera
Sinclair Waycott
Tony Foller
Wickens Nestle
Alejandro Perin
Johnson Sergi
Rodrigues Campain
Tony Foller
Morrow Ruta
Sinclair Waycott
Jefferson Schemmer
Kaitlin Ostrosky
Sinclair Waycott
Emily Whobrey
Emily Whobrey
Julie Stenseth
Ricardo Gaucho
Ashley Doe
Leon Oldroyd
Smith Glick
Stacey Maclead
Morrow Ruta
Wickens Nestle
Morrow Ruta
Izzy Garufi
Aika Inouye
Jones Vocelka
Ashley Doe
Greenwood Bolognia
Maisha Rulapaugh
Jones Vocelka
Misaki Royster
Costa Dilliard
Aruna Figeroa
Ashley Doe
Isabel Bowley
Kadeem Flosi
Wickens Nestle
IdCountryDate
1000Brazil2026-06-05
1001Spain2026-06-06
1002Spain2026-05-15
1003United Kingdom2026-05-11
1004Argentina2026-05-24
1005Brazil2026-05-15
1006Italy2026-06-07
1007Germany2026-05-16
1008Argentina2026-05-26
1009United Kingdom2026-05-25
1010India2026-05-30
1011Japan2026-05-26
1012Argentina2026-05-13
1013Japan2026-06-01
1014Argentina2026-05-13
1015France2026-06-01
1016Italy2026-05-15
1017United Kingdom2026-05-27
1018Argentina2026-05-19
1019Argentina2026-05-13
1020Spain2026-05-17
1021Brazil2026-05-17
1022India2026-06-07
1023Argentina2026-05-29
1024Spain2026-05-13
1025India2026-05-10
1026Brazil2026-05-23
1027United Kingdom2026-05-17
1028India2026-05-11
1029India2026-05-12
1030India2026-05-25
1031France2026-05-20
1032France2026-05-23
1033Spain2026-05-31
1034Italy2026-06-07
1035India2026-05-24
1036Argentina2026-06-01
1037Argentina2026-05-11
1038United Kingdom2026-06-03
1039United Kingdom2026-05-21
1040Italy2026-05-29
1041Russia2026-05-10
1042Russia2026-05-19
1043Russia2026-06-03
1044Japan2026-06-04
1045Japan2026-05-22
1046Japan2026-05-14
1047Brazil2026-05-15
1048Brazil2026-05-21
1049Argentina2026-05-11

On-Demand Data

NameIdCountryDate
Misaki Royster1000Australia2026-05-28
Julie Stenseth1001Germany2026-06-04
Leja Caldarera1002Russia2026-05-09
Julie Stenseth1003Germany2026-05-13
Alejandro Perin1004France2026-06-06
Aruna Figeroa1005Italy2026-05-22
Aruna Figeroa1006Japan2026-05-17
Jones Vocelka1007Australia2026-05-27
Misaki Royster1008Canada2026-05-15
Aruna Figeroa1009France2026-05-09
Johnson Sergi1010Germany2026-06-01
Alejandro Perin1011Canada2026-05-15
Mujtaba Nicka1012Australia2026-05-18
Tony Foller1013Brazil2026-05-16
Silvio Slusarski1014Argentina2026-05-15
Arvin Albares1015Argentina2026-05-24
Murillo Malet1016India2026-05-12
Smith Glick1017Canada2026-05-23
Leon Oldroyd1018France2026-05-14
Jefferson Schemmer1019Russia2026-06-02
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Rodrigues CampainFranceOnyama Limba PROPOSAL
Octavia MaletArgentinaAmy Elsner UNQUALIFIED
Octavia MaletAustraliaAmy Elsner NEW
Jones VocelkaJapanBernardo Dominic NEGOTIATION
Arvin AlbaresUnited KingdomIoni Bowcher QUALIFIED
Munro FerenczCanadaBernardo Dominic PROPOSAL
Arvin AlbaresGermanyXuxue Feng UNQUALIFIED
Aika InouyeUnited KingdomIvan Magalhaes UNQUALIFIED
Emily WhobreyJapanAmy Elsner UNQUALIFIED
Darci PoquetteArgentinaBernardo Dominic NEGOTIATION
Juan WieserArgentinaAnna Fali QUALIFIED
Claire TollnerItalyStephen Shaw UNQUALIFIED
Francesco ShinkoJapanXuxue Feng QUALIFIED
Rodrigues CampainUnited KingdomOnyama Limba RENEWAL
Sinclair WaycottUnited KingdomAmy Elsner RENEWAL
Ashley DoeAustraliaAsiya Javayant QUALIFIED
Wickens NestleUnited KingdomAmy Elsner RENEWAL
Deepesh ChuiItalyBernardo Dominic QUALIFIED
Salvatore StockhamFranceXuxue Feng RENEWAL
Alejandro PerinFranceIoni Bowcher PROPOSAL
Isabel BowleyCanadaAsiya Javayant NEW
Stacey MacleadAustraliaOnyama Limba UNQUALIFIED
Arvin AlbaresJapanXuxue Feng PROPOSAL
Murillo MaletItalyIvan Magalhaes QUALIFIED
Jefferson SchemmerBrazilElwin Sharvill NEW
Costa DilliardUnited KingdomBernardo Dominic NEW
Tony FollerUnited KingdomAnna Fali RENEWAL
Maisha RulapaughIndiaXuxue Feng QUALIFIED
Mujtaba NickaIndiaStephen Shaw PROPOSAL
Ricardo GauchoRussiaAmy Elsner QUALIFIED
Johnson SergiAustraliaAsiya Javayant QUALIFIED
Kaitlin OstroskyFranceAnna Fali RENEWAL
Silvio SlusarskiGermanyElwin Sharvill NEGOTIATION
Smith GlickArgentinaIvan Magalhaes QUALIFIED
Alejandro PerinJapanXuxue Feng QUALIFIED
Costa DilliardArgentinaOnyama Limba RENEWAL
Salvatore StockhamJapanAnna Fali NEGOTIATION
Kadeem FlosiFranceAsiya Javayant PROPOSAL
Faith GillianUnited KingdomOnyama Limba UNQUALIFIED
Aruna FigeroaRussiaIvan Magalhaes 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>