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
Jennifer AmigonSpainElwin Sharvill QUALIFIED
Costa DilliardCanadaXuxue Feng NEW
David DarakjySpainAsiya Javayant QUALIFIED
Clifford RimAustraliaStephen Shaw UNQUALIFIED
Jeanfrancois VenereGermanyAmy Elsner NEGOTIATION
Costa DilliardIndiaAsiya Javayant QUALIFIED
Antonio CaudyUnited KingdomXuxue Feng NEGOTIATION
Leja CaldareraGermanyOnyama Limba UNQUALIFIED
Jefferson SchemmerSpainAmy Elsner NEGOTIATION
Clifford RimItalyElwin Sharvill RENEWAL
Greenwood BologniaSpainIvan Magalhaes QUALIFIED
Ricardo GauchoIndiaAsiya Javayant UNQUALIFIED
Silvio SlusarskiSpainStephen Shaw UNQUALIFIED
Aruna FigeroaSpainXuxue Feng NEW
Ashley DoeJapanAsiya Javayant QUALIFIED
Izzy GarufiIndiaAmy Elsner UNQUALIFIED
Mayumi KolmetzBrazilBernardo Dominic RENEWAL
Izzy GarufiItalyXuxue Feng RENEWAL
Mujtaba NickaRussiaAmy Elsner UNQUALIFIED
Stacey MacleadGermanyAsiya Javayant NEGOTIATION
Alejandro PerinSpainElwin Sharvill NEGOTIATION
Kadeem FlosiFranceElwin Sharvill QUALIFIED
Arvin AlbaresItalyIoni Bowcher NEW
Misaki RoysterGermanyAnna Fali NEW
Ivar PaprockiRussiaElwin Sharvill PROPOSAL
Munro FerenczItalyAsiya Javayant UNQUALIFIED
Smith GlickIndiaBernardo Dominic NEGOTIATION
Deepesh ChuiGermanyBernardo Dominic PROPOSAL
Sinclair WaycottIndiaAmy Elsner NEW
Leon OldroydCanadaBernardo Dominic NEW
Adams MorascaBrazilIoni Bowcher NEGOTIATION
Jeanfrancois VenereUnited KingdomAsiya Javayant NEW
Aruna FigeroaBrazilBernardo Dominic RENEWAL
Salvatore StockhamArgentinaAmy Elsner UNQUALIFIED
Aruna FigeroaItalyAnna Fali NEW
Izzy GarufiFranceXuxue Feng QUALIFIED
Silvio SlusarskiUnited KingdomBernardo Dominic NEW
Emily WhobreyBrazilBernardo Dominic UNQUALIFIED
Izzy GarufiItalyAnna Fali RENEWAL
Leja CaldareraItalyIvan Magalhaes PROPOSAL
Julie StensethArgentinaIvan Magalhaes QUALIFIED
Alejandro PerinUnited KingdomOnyama Limba NEW
Izzy GarufiItalyOnyama Limba QUALIFIED
Silvio SlusarskiRussiaOnyama Limba QUALIFIED
Greenwood BologniaFranceXuxue Feng UNQUALIFIED
Mujtaba NickaSpainBernardo Dominic QUALIFIED
Silvio SlusarskiBrazilAmy Elsner UNQUALIFIED
Izzy GarufiItalyBernardo Dominic RENEWAL
Chavez BriddickArgentinaBernardo Dominic PROPOSAL
Wickens NestleItalyIoni Bowcher PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Maisha RulapaughItalyAmy Elsner PROPOSAL
Cody SaylorsUnited KingdomAsiya Javayant RENEWAL
Francesco ShinkoCanadaStephen Shaw PROPOSAL
Faith GillianJapanBernardo Dominic NEGOTIATION
Misaki RoysterCanadaBernardo Dominic UNQUALIFIED
Mujtaba NickaSpainIoni Bowcher NEW
Tony FollerFranceXuxue Feng PROPOSAL
Sinclair WaycottIndiaElwin Sharvill RENEWAL
Isabel BowleyCanadaElwin Sharvill RENEWAL
Octavia MaletItalyAnna Fali NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Octavia MaletCanada2025-10-23Morlong Associates RENEWAL91Onyama Limba
1001Murillo MaletUnited Kingdom2025-10-16Printing Dimensions UNQUALIFIED47Xuxue Feng
1002Kadeem FlosiCanada2025-10-06Chanay, Jeffrey A Esq RENEWAL36Bernardo Dominic
1003Wickens NestleSpain2025-10-18Dorl, James J Esq NEW74Xuxue Feng
1004Clifford RimCanada2025-10-21King, Christopher A Esq UNQUALIFIED73Bernardo Dominic
1005Johnson SergiGermany2025-10-28Chemel, James L Cpa NEW52Bernardo Dominic
1006Wickens NestleUnited Kingdom2025-11-02Chanay, Jeffrey A Esq RENEWAL63Elwin Sharvill
1007Munro FerenczArgentina2025-10-09Feiner Bros NEGOTIATION84Xuxue Feng
1008Chavez BriddickCanada2025-10-24Printing Dimensions PROPOSAL43Asiya Javayant
1009Aruna FigeroaArgentina2025-10-28Chemel, James L Cpa PROPOSAL57Ivan Magalhaes
1010Octavia MaletUnited Kingdom2025-10-08Benton, John B Jr UNQUALIFIED38Anna Fali
1011Smith GlickFrance2025-10-13Chemel, James L Cpa QUALIFIED78Bernardo Dominic
1012Mujtaba NickaUnited Kingdom2025-10-20Truhlar And Truhlar Attys QUALIFIED80Ivan Magalhaes
1013Wickens NestleCanada2025-10-17Dorl, James J Esq PROPOSAL30Asiya Javayant
1014Faith GillianArgentina2025-10-19King, Christopher A Esq NEW63Anna Fali
1015Jefferson SchemmerBrazil2025-10-29Buckley Miller Wright PROPOSAL72Bernardo Dominic
1016Leja CaldareraUnited Kingdom2025-10-18Buckley Miller Wright RENEWAL86Stephen Shaw
1017Chavez BriddickRussia2025-10-17King, Christopher A Esq NEGOTIATION50Onyama Limba
1018Misaki RoysterGermany2025-10-19Morlong Associates NEW18Onyama Limba
1019Rodrigues CampainArgentina2025-10-12Rangoni Of Florence PROPOSAL13Ivan Magalhaes
1020Ivar PaprockiJapan2025-10-29Chanay, Jeffrey A Esq UNQUALIFIED73Amy Elsner
1021Deepesh ChuiSpain2025-10-09Rousseaux, Michael Esq NEGOTIATION84Asiya Javayant
1022Ashley DoeArgentina2025-10-30Chapman, Ross E Esq NEW38Ivan Magalhaes
1023Leja CaldareraItaly2025-10-28Morlong Associates UNQUALIFIED14Stephen Shaw
1024Costa DilliardUnited Kingdom2025-10-23Chemel, James L Cpa UNQUALIFIED9Asiya Javayant
1025Salvatore StockhamCanada2025-10-28Rousseaux, Michael Esq UNQUALIFIED91Xuxue Feng
1026Murillo MaletIndia2025-10-28Buckley Miller Wright NEW9Anna Fali
1027Nicolas IturbideUnited Kingdom2025-10-06Chanay, Jeffrey A Esq QUALIFIED14Stephen Shaw
1028Munro FerenczCanada2025-10-31Feltz Printing Service NEW59Asiya Javayant
1029Clifford RimJapan2025-10-29Dorl, James J Esq QUALIFIED45Amy Elsner
1030Julie StensethUnited Kingdom2025-10-11Rousseaux, Michael Esq UNQUALIFIED67Ioni Bowcher
1031Cody SaylorsUnited Kingdom2025-10-30Feltz Printing Service NEGOTIATION5Ioni Bowcher
1032Darci PoquetteArgentina2025-10-30Benton, John B Jr NEGOTIATION25Stephen Shaw
1033Kaitlin OstroskyArgentina2025-10-06Rangoni Of Florence NEGOTIATION92Stephen Shaw
1034Jefferson SchemmerAustralia2025-11-01Chanay, Jeffrey A Esq PROPOSAL16Anna Fali
1035Tony FollerRussia2025-10-22Printing Dimensions RENEWAL35Stephen Shaw
1036Emily WhobreySpain2025-10-25Chanay, Jeffrey A Esq NEGOTIATION9Amy Elsner
1037Leja CaldareraRussia2025-10-18Morlong Associates NEW30Asiya Javayant
1038Jones VocelkaSpain2025-10-21Feiner Bros NEGOTIATION10Ioni Bowcher
1039James ButtJapan2025-11-04Buckley Miller Wright UNQUALIFIED47Ivan Magalhaes
1040Tony FollerItaly2025-10-17Chapman, Ross E Esq RENEWAL9Anna Fali
1041Jones VocelkaGermany2025-10-22Truhlar And Truhlar Attys UNQUALIFIED76Onyama Limba
1042Costa DilliardItaly2025-10-30Dorl, James J Esq NEGOTIATION14Bernardo Dominic
1043Munro FerenczCanada2025-10-15Printing Dimensions UNQUALIFIED17Bernardo Dominic
1044Aditya KuskoFrance2025-10-09Commercial Press QUALIFIED90Elwin Sharvill
1045Aruna FigeroaItaly2025-11-01Commercial Press PROPOSAL47Xuxue Feng
1046Munro FerenczItaly2025-10-11Buckley Miller Wright QUALIFIED72Ivan Magalhaes
1047Emily WhobreyBrazil2025-11-03Rangoni Of Florence QUALIFIED88Anna Fali
1048Leon OldroydJapan2025-10-26Commercial Press NEW43Amy Elsner
1049Morrow RutaArgentina2025-10-31Buckley Miller Wright QUALIFIED90Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Smith GlickRussiaStephen Shaw RENEWAL
Johnson SergiItalyAmy Elsner NEGOTIATION
Octavia MaletFranceOnyama Limba QUALIFIED
Isabel BowleyJapanAnna Fali NEW
Izzy GarufiIndiaAnna Fali UNQUALIFIED
Antonio CaudyIndiaBernardo Dominic UNQUALIFIED
Antonio CaudyJapanElwin Sharvill NEW
David DarakjyCanadaIoni Bowcher QUALIFIED
Misaki RoysterGermanyStephen Shaw PROPOSAL
Clifford RimCanadaBernardo Dominic QUALIFIED
Maria MarrierUnited KingdomIvan Magalhaes PROPOSAL
Juan WieserJapanStephen Shaw RENEWAL
Johnson SergiCanadaAmy Elsner NEGOTIATION
Mayumi KolmetzAustraliaAnna Fali UNQUALIFIED
Sinclair WaycottAustraliaAnna Fali RENEWAL
Deepesh ChuiArgentinaOnyama Limba UNQUALIFIED
Antonio CaudyArgentinaIoni Bowcher NEGOTIATION
Izzy GarufiIndiaStephen Shaw PROPOSAL
Leon OldroydUnited KingdomIoni Bowcher RENEWAL
Salvatore StockhamArgentinaXuxue Feng PROPOSAL
Jefferson SchemmerFranceAmy Elsner UNQUALIFIED
Faith GillianFranceIvan Magalhaes PROPOSAL
Mayumi KolmetzUnited KingdomBernardo Dominic NEGOTIATION
Misaki RoysterRussiaXuxue Feng RENEWAL
Francesco ShinkoArgentinaAnna Fali NEW
Morrow RutaBrazilBernardo Dominic NEGOTIATION
Salvatore StockhamCanadaStephen Shaw RENEWAL
Ivar PaprockiIndiaXuxue Feng NEGOTIATION
Aruna FigeroaGermanyXuxue Feng RENEWAL
Claire TollnerRussiaAnna Fali UNQUALIFIED
Costa DilliardJapanOnyama Limba RENEWAL
Leon OldroydCanadaBernardo Dominic QUALIFIED
Johnson SergiSpainOnyama Limba NEW
Rodrigues CampainBrazilAnna Fali QUALIFIED
Maria MarrierJapanBernardo Dominic UNQUALIFIED
Smith GlickItalyXuxue Feng NEGOTIATION
Stacey MacleadUnited KingdomOnyama Limba RENEWAL
Cody SaylorsGermanyBernardo Dominic RENEWAL
Cody SaylorsItalyIvan Magalhaes NEGOTIATION
Munro FerenczIndiaAsiya Javayant QUALIFIED
Darci PoquetteAustraliaBernardo Dominic UNQUALIFIED
Deepesh ChuiUnited KingdomIvan Magalhaes NEW
Jeanfrancois VenereBrazilIoni Bowcher NEW
Ashley DoeBrazilElwin Sharvill QUALIFIED
Izzy GarufiCanadaStephen Shaw NEGOTIATION
Leon OldroydIndiaOnyama Limba RENEWAL
Morrow RutaUnited KingdomStephen Shaw UNQUALIFIED
Arvin AlbaresGermanyElwin Sharvill RENEWAL
Stacey MacleadArgentinaOnyama Limba QUALIFIED
Emily WhobreyAustraliaOnyama Limba UNQUALIFIED
Frozen Columns
Name
Misaki Royster
Arvin Albares
Octavia Malet
Chavez Briddick
Maisha Rulapaugh
Emily Whobrey
Silvio Slusarski
Ashley Doe
Aditya Kusko
Deepesh Chui
Julie Stenseth
Kaitlin Ostrosky
Mujtaba Nicka
Arvin Albares
Octavia Malet
Johnson Sergi
Aruna Figeroa
Julie Stenseth
Antonio Caudy
Emily Whobrey
Cody Saylors
Isabel Bowley
Ivar Paprocki
Greenwood Bolognia
Leon Oldroyd
Chavez Briddick
Aika Inouye
Misaki Royster
Francesco Shinko
Deepesh Chui
Cody Saylors
Costa Dilliard
Rodrigues Campain
Jefferson Schemmer
Stacey Maclead
Juan Wieser
Jefferson Schemmer
Munro Ferencz
Antonio Caudy
Isabel Bowley
David Darakjy
Jefferson Schemmer
Jennifer Amigon
Jeanfrancois Venere
Cody Saylors
Stacey Maclead
Antonio Caudy
Tony Foller
Claire Tollner
Jeanfrancois Venere
IdCountryDate
1000Japan2025-10-31
1001Germany2025-10-09
1002Italy2025-10-14
1003France2025-10-13
1004Italy2025-10-22
1005Japan2025-11-04
1006Canada2025-10-18
1007Argentina2025-10-21
1008Australia2025-10-22
1009Japan2025-10-24
1010United Kingdom2025-11-03
1011India2025-11-02
1012Germany2025-10-13
1013Spain2025-10-12
1014Argentina2025-10-15
1015France2025-10-09
1016India2025-11-04
1017India2025-10-10
1018Argentina2025-11-03
1019Spain2025-10-18
1020Canada2025-11-01
1021Brazil2025-10-22
1022Brazil2025-10-12
1023Argentina2025-10-08
1024Canada2025-10-25
1025Spain2025-10-12
1026United Kingdom2025-10-20
1027Brazil2025-10-22
1028Russia2025-10-16
1029India2025-10-12
1030Japan2025-10-21
1031Argentina2025-11-03
1032Australia2025-10-22
1033Canada2025-10-17
1034Italy2025-11-03
1035Spain2025-10-31
1036France2025-10-14
1037Germany2025-10-21
1038Spain2025-10-06
1039Australia2025-10-30
1040Russia2025-11-02
1041Spain2025-10-22
1042United Kingdom2025-10-07
1043Canada2025-10-14
1044Canada2025-10-06
1045Russia2025-10-20
1046Spain2025-10-28
1047Germany2025-11-01
1048Argentina2025-10-06
1049France2025-11-03

On-Demand Data

NameIdCountryDate
Morrow Ruta1000Germany2025-10-27
Nicolas Iturbide1001Germany2025-10-20
Maisha Rulapaugh1002Germany2025-10-26
Munro Ferencz1003United Kingdom2025-10-21
Maria Marrier1004Italy2025-10-27
Aditya Kusko1005Brazil2025-10-18
Munro Ferencz1006United Kingdom2025-10-28
Jefferson Schemmer1007Brazil2025-10-28
Julie Stenseth1008India2025-10-21
Murillo Malet1009Japan2025-10-20
Aika Inouye1010Russia2025-10-11
Darci Poquette1011France2025-10-25
Antonio Caudy1012Argentina2025-10-17
Ashley Doe1013India2025-10-20
Kaitlin Ostrosky1014Canada2025-10-21
Alejandro Perin1015United Kingdom2025-10-16
Wickens Nestle1016Italy2025-10-26
Octavia Malet1017Japan2025-10-10
Munro Ferencz1018United Kingdom2025-10-14
Stacey Maclead1019United Kingdom2025-10-26
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Munro FerenczGermanyElwin Sharvill NEGOTIATION
Aditya KuskoCanadaAsiya Javayant NEGOTIATION
David DarakjyRussiaBernardo Dominic QUALIFIED
Cody SaylorsFranceElwin Sharvill UNQUALIFIED
Jeanfrancois VenereJapanStephen Shaw UNQUALIFIED
Tony FollerGermanyIoni Bowcher UNQUALIFIED
Octavia MaletIndiaOnyama Limba UNQUALIFIED
Smith GlickGermanyIoni Bowcher PROPOSAL
Aruna FigeroaJapanElwin Sharvill NEGOTIATION
Silvio SlusarskiSpainBernardo Dominic QUALIFIED
Greenwood BologniaFranceElwin Sharvill UNQUALIFIED
Murillo MaletAustraliaAnna Fali PROPOSAL
Greenwood BologniaRussiaIvan Magalhaes NEGOTIATION
Kaitlin OstroskyArgentinaAsiya Javayant NEW
Darci PoquetteUnited KingdomStephen Shaw UNQUALIFIED
Rodrigues CampainCanadaStephen Shaw PROPOSAL
Francesco ShinkoRussiaAnna Fali RENEWAL
Jones VocelkaUnited KingdomXuxue Feng RENEWAL
Johnson SergiUnited KingdomAnna Fali PROPOSAL
Stacey MacleadItalyIvan Magalhaes NEW
Izzy GarufiAustraliaXuxue Feng UNQUALIFIED
Kadeem FlosiRussiaIvan Magalhaes QUALIFIED
Arvin AlbaresBrazilBernardo Dominic NEGOTIATION
Francesco ShinkoFranceIvan Magalhaes QUALIFIED
Tony FollerJapanAmy Elsner NEW
Greenwood BologniaJapanIoni Bowcher QUALIFIED
Aditya KuskoIndiaIvan Magalhaes QUALIFIED
Salvatore StockhamArgentinaIoni Bowcher RENEWAL
Francesco ShinkoCanadaAnna Fali PROPOSAL
Salvatore StockhamCanadaAsiya Javayant NEW
Darci PoquetteCanadaElwin Sharvill NEW
Aika InouyeCanadaAnna Fali NEW
Faith GillianItalyXuxue Feng RENEWAL
Silvio SlusarskiAustraliaAnna Fali UNQUALIFIED
Ricardo GauchoSpainAnna Fali QUALIFIED
Octavia MaletRussiaElwin Sharvill PROPOSAL
Ivar PaprockiGermanyIoni Bowcher NEW
Murillo MaletGermanyOnyama Limba RENEWAL
Isabel BowleyIndiaAnna Fali RENEWAL
Clifford RimFranceOnyama Limba 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>