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
Darci PoquetteBrazilAsiya Javayant NEW
Antonio CaudyFranceBernardo Dominic RENEWAL
Leon OldroydRussiaAmy Elsner QUALIFIED
Ricardo GauchoJapanAsiya Javayant RENEWAL
Adams MorascaAustraliaIoni Bowcher NEGOTIATION
Clifford RimItalyIoni Bowcher NEW
Nicolas IturbideRussiaStephen Shaw PROPOSAL
Cody SaylorsItalyBernardo Dominic QUALIFIED
Aruna FigeroaIndiaIvan Magalhaes NEW
Smith GlickUnited KingdomAmy Elsner PROPOSAL
Jefferson SchemmerAustraliaAsiya Javayant PROPOSAL
Ashley DoeItalyBernardo Dominic RENEWAL
Jones VocelkaBrazilXuxue Feng NEW
Wickens NestleItalyXuxue Feng QUALIFIED
Ricardo GauchoItalyBernardo Dominic NEGOTIATION
Salvatore StockhamUnited KingdomOnyama Limba PROPOSAL
Costa DilliardAustraliaStephen Shaw UNQUALIFIED
Maisha RulapaughIndiaIoni Bowcher QUALIFIED
Leja CaldareraItalyXuxue Feng RENEWAL
Maisha RulapaughFranceAmy Elsner RENEWAL
James ButtItalyElwin Sharvill NEGOTIATION
Leon OldroydIndiaBernardo Dominic QUALIFIED
Jones VocelkaArgentinaAnna Fali PROPOSAL
Greenwood BologniaAustraliaElwin Sharvill QUALIFIED
Mujtaba NickaJapanIvan Magalhaes UNQUALIFIED
Antonio CaudyFranceAnna Fali PROPOSAL
Adams MorascaGermanyOnyama Limba PROPOSAL
Adams MorascaUnited KingdomOnyama Limba UNQUALIFIED
Octavia MaletIndiaBernardo Dominic RENEWAL
Munro FerenczItalyAnna Fali NEW
Cody SaylorsIndiaXuxue Feng NEW
Murillo MaletUnited KingdomIvan Magalhaes RENEWAL
Julie StensethCanadaXuxue Feng NEGOTIATION
Leon OldroydRussiaElwin Sharvill UNQUALIFIED
Aruna FigeroaAustraliaAsiya Javayant UNQUALIFIED
Jennifer AmigonFranceAnna Fali NEGOTIATION
Isabel BowleySpainElwin Sharvill UNQUALIFIED
Rodrigues CampainIndiaElwin Sharvill UNQUALIFIED
Aruna FigeroaIndiaIvan Magalhaes UNQUALIFIED
Isabel BowleyRussiaAnna Fali UNQUALIFIED
Nicolas IturbideRussiaOnyama Limba NEGOTIATION
Maisha RulapaughAustraliaStephen Shaw RENEWAL
Mujtaba NickaArgentinaOnyama Limba NEGOTIATION
Deepesh ChuiAustraliaAmy Elsner QUALIFIED
Mujtaba NickaFranceAmy Elsner UNQUALIFIED
Deepesh ChuiFranceIvan Magalhaes RENEWAL
Alejandro PerinUnited KingdomIvan Magalhaes RENEWAL
Antonio CaudyAustraliaStephen Shaw RENEWAL
James ButtIndiaOnyama Limba NEGOTIATION
Leja CaldareraGermanyStephen Shaw NEW
Horizontal
NameCountryRepresentativeStatus
Chavez BriddickIndiaBernardo Dominic RENEWAL
Wickens NestleIndiaAsiya Javayant NEW
Cody SaylorsIndiaIvan Magalhaes UNQUALIFIED
Mujtaba NickaIndiaBernardo Dominic PROPOSAL
Antonio CaudyJapanElwin Sharvill NEW
Octavia MaletSpainAnna Fali UNQUALIFIED
Ivar PaprockiJapanAnna Fali NEW
Silvio SlusarskiFranceAnna Fali UNQUALIFIED
Greenwood BologniaGermanyAnna Fali NEGOTIATION
Aika InouyeIndiaAsiya Javayant QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Morrow RutaSpain2026-06-01Chanay, Jeffrey A Esq NEW74Ioni Bowcher
1001Murillo MaletItaly2026-05-19Rangoni Of Florence QUALIFIED79Anna Fali
1002Munro FerenczJapan2026-05-29Rousseaux, Michael Esq UNQUALIFIED66Xuxue Feng
1003Jeanfrancois VenereSpain2026-05-17Chapman, Ross E Esq UNQUALIFIED30Amy Elsner
1004David DarakjySpain2026-05-11Printing Dimensions NEW31Anna Fali
1005Mujtaba NickaUnited Kingdom2026-06-01King, Christopher A Esq RENEWAL29Elwin Sharvill
1006Deepesh ChuiSpain2026-05-30Morlong Associates NEGOTIATION47Bernardo Dominic
1007Nicolas IturbideIndia2026-05-23Chapman, Ross E Esq NEW66Stephen Shaw
1008Francesco ShinkoUnited Kingdom2026-05-10Rousseaux, Michael Esq PROPOSAL66Amy Elsner
1009Wickens NestleCanada2026-05-26Feiner Bros RENEWAL52Amy Elsner
1010Julie StensethSpain2026-05-14Morlong Associates NEW47Bernardo Dominic
1011Juan WieserArgentina2026-06-01Rangoni Of Florence NEW94Xuxue Feng
1012Claire TollnerJapan2026-05-13Chanay, Jeffrey A Esq NEGOTIATION90Onyama Limba
1013Salvatore StockhamCanada2026-06-01Morlong Associates NEW49Ivan Magalhaes
1014Maria MarrierSpain2026-05-09Chapman, Ross E Esq NEGOTIATION65Amy Elsner
1015Isabel BowleyGermany2026-05-23Rousseaux, Michael Esq NEGOTIATION70Onyama Limba
1016Emily WhobreySpain2026-05-20Morlong Associates RENEWAL88Elwin Sharvill
1017Antonio CaudyCanada2026-05-26Chapman, Ross E Esq RENEWAL73Ivan Magalhaes
1018Leon OldroydRussia2026-05-07Rousseaux, Michael Esq NEW95Amy Elsner
1019Julie StensethArgentina2026-05-07Printing Dimensions QUALIFIED74Amy Elsner
1020Morrow RutaFrance2026-05-18Rangoni Of Florence NEW0Xuxue Feng
1021Sinclair WaycottFrance2026-05-23King, Christopher A Esq NEW87Bernardo Dominic
1022Maria MarrierItaly2026-05-15Truhlar And Truhlar Attys RENEWAL38Asiya Javayant
1023Ashley DoeSpain2026-05-21Feiner Bros QUALIFIED0Stephen Shaw
1024Cody SaylorsFrance2026-05-23Buckley Miller Wright RENEWAL62Asiya Javayant
1025Sinclair WaycottRussia2026-05-20Printing Dimensions PROPOSAL23Ivan Magalhaes
1026James ButtIndia2026-05-12Dorl, James J Esq QUALIFIED80Onyama Limba
1027Stacey MacleadFrance2026-05-06Printing Dimensions PROPOSAL37Stephen Shaw
1028Aruna FigeroaAustralia2026-05-05Truhlar And Truhlar Attys QUALIFIED65Xuxue Feng
1029Stacey MacleadItaly2026-05-29Truhlar And Truhlar Attys UNQUALIFIED8Ivan Magalhaes
1030James ButtUnited Kingdom2026-05-18Truhlar And Truhlar Attys NEGOTIATION80Asiya Javayant
1031Nicolas IturbideCanada2026-05-16Truhlar And Truhlar Attys RENEWAL28Asiya Javayant
1032Smith GlickItaly2026-05-06Truhlar And Truhlar Attys PROPOSAL95Stephen Shaw
1033Isabel BowleySpain2026-05-28Chemel, James L Cpa RENEWAL18Ivan Magalhaes
1034Antonio CaudyCanada2026-05-24Chapman, Ross E Esq RENEWAL12Ivan Magalhaes
1035Rodrigues CampainBrazil2026-05-26Benton, John B Jr RENEWAL80Asiya Javayant
1036Wickens NestleBrazil2026-05-21Rousseaux, Michael Esq RENEWAL58Stephen Shaw
1037Juan WieserRussia2026-05-11Benton, John B Jr UNQUALIFIED16Ivan Magalhaes
1038Rodrigues CampainBrazil2026-05-21Printing Dimensions NEGOTIATION24Stephen Shaw
1039Sinclair WaycottArgentina2026-05-25Feltz Printing Service NEW95Anna Fali
1040Smith GlickItaly2026-05-17Morlong Associates RENEWAL12Onyama Limba
1041Costa DilliardUnited Kingdom2026-05-15Chanay, Jeffrey A Esq QUALIFIED90Ioni Bowcher
1042Arvin AlbaresJapan2026-05-09Feltz Printing Service NEW89Ioni Bowcher
1043Jefferson SchemmerRussia2026-05-18Morlong Associates NEGOTIATION65Anna Fali
1044Deepesh ChuiArgentina2026-05-27Printing Dimensions RENEWAL54Ioni Bowcher
1045Faith GillianIndia2026-06-03Chemel, James L Cpa NEGOTIATION73Amy Elsner
1046Costa DilliardUnited Kingdom2026-05-23Feiner Bros NEGOTIATION25Amy Elsner
1047Antonio CaudyFrance2026-05-29Buckley Miller Wright QUALIFIED23Onyama Limba
1048Kaitlin OstroskyItaly2026-05-14Printing Dimensions RENEWAL41Xuxue Feng
1049Julie StensethItaly2026-05-25Rousseaux, Michael Esq RENEWAL11Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Emily WhobreyArgentinaIvan Magalhaes PROPOSAL
Cody SaylorsJapanIvan Magalhaes NEGOTIATION
Leja CaldareraArgentinaAnna Fali UNQUALIFIED
Tony FollerItalyAmy Elsner NEW
Ivar PaprockiCanadaElwin Sharvill RENEWAL
Mayumi KolmetzUnited KingdomElwin Sharvill PROPOSAL
Nicolas IturbideRussiaStephen Shaw QUALIFIED
Leja CaldareraArgentinaIoni Bowcher NEGOTIATION
Tony FollerAustraliaBernardo Dominic RENEWAL
Emily WhobreyFranceIoni Bowcher RENEWAL
Julie StensethCanadaIvan Magalhaes NEGOTIATION
James ButtItalyOnyama Limba QUALIFIED
Faith GillianGermanyIvan Magalhaes UNQUALIFIED
James ButtRussiaIoni Bowcher QUALIFIED
Salvatore StockhamIndiaElwin Sharvill RENEWAL
Costa DilliardBrazilStephen Shaw NEW
Adams MorascaCanadaIvan Magalhaes QUALIFIED
Aika InouyeRussiaIvan Magalhaes RENEWAL
Jennifer AmigonSpainOnyama Limba NEGOTIATION
Maria MarrierItalyIoni Bowcher UNQUALIFIED
Silvio SlusarskiIndiaStephen Shaw RENEWAL
Adams MorascaCanadaIoni Bowcher UNQUALIFIED
Juan WieserArgentinaBernardo Dominic NEW
Salvatore StockhamGermanyAsiya Javayant UNQUALIFIED
Kaitlin OstroskyGermanyOnyama Limba RENEWAL
Leja CaldareraBrazilAmy Elsner RENEWAL
Costa DilliardAustraliaOnyama Limba NEGOTIATION
Clifford RimJapanIvan Magalhaes UNQUALIFIED
Jones VocelkaCanadaAnna Fali NEW
Leon OldroydRussiaAsiya Javayant UNQUALIFIED
Costa DilliardArgentinaIvan Magalhaes PROPOSAL
Arvin AlbaresRussiaAnna Fali QUALIFIED
Greenwood BologniaJapanBernardo Dominic NEW
Mujtaba NickaCanadaAnna Fali PROPOSAL
Alejandro PerinUnited KingdomStephen Shaw UNQUALIFIED
Tony FollerUnited KingdomAsiya Javayant UNQUALIFIED
Claire TollnerUnited KingdomAnna Fali NEGOTIATION
Ivar PaprockiArgentinaElwin Sharvill UNQUALIFIED
Munro FerenczSpainElwin Sharvill RENEWAL
Ivar PaprockiItalyIvan Magalhaes NEW
Antonio CaudyAustraliaOnyama Limba UNQUALIFIED
Aika InouyeIndiaAsiya Javayant RENEWAL
Aruna FigeroaSpainAsiya Javayant NEGOTIATION
Leja CaldareraIndiaBernardo Dominic UNQUALIFIED
Maria MarrierSpainAnna Fali RENEWAL
Julie StensethSpainStephen Shaw NEGOTIATION
Claire TollnerRussiaAmy Elsner NEGOTIATION
Jefferson SchemmerJapanBernardo Dominic PROPOSAL
Wickens NestleCanadaOnyama Limba UNQUALIFIED
Misaki RoysterIndiaIoni Bowcher RENEWAL
Frozen Columns
Name
Nicolas Iturbide
Kaitlin Ostrosky
Antonio Caudy
Francesco Shinko
Octavia Malet
Rodrigues Campain
Misaki Royster
Francesco Shinko
Faith Gillian
Wickens Nestle
Ivar Paprocki
Rodrigues Campain
Silvio Slusarski
Darci Poquette
Misaki Royster
Julie Stenseth
Deepesh Chui
Nicolas Iturbide
Adams Morasca
Murillo Malet
Leja Caldarera
Ivar Paprocki
Misaki Royster
Munro Ferencz
Claire Tollner
Munro Ferencz
Alejandro Perin
Ashley Doe
David Darakjy
Maisha Rulapaugh
Francesco Shinko
Kadeem Flosi
Clifford Rim
Mujtaba Nicka
Johnson Sergi
Octavia Malet
Emily Whobrey
Jefferson Schemmer
Jefferson Schemmer
Jeanfrancois Venere
Silvio Slusarski
Murillo Malet
Alejandro Perin
Jeanfrancois Venere
Emily Whobrey
Maisha Rulapaugh
Maisha Rulapaugh
Leja Caldarera
Leja Caldarera
Ivar Paprocki
IdCountryDate
1000Russia2026-06-03
1001Japan2026-05-10
1002Australia2026-05-14
1003Italy2026-05-30
1004France2026-05-15
1005United Kingdom2026-05-12
1006Australia2026-05-17
1007Brazil2026-05-19
1008Russia2026-05-14
1009France2026-05-30
1010India2026-05-27
1011Brazil2026-05-07
1012Germany2026-05-20
1013Italy2026-05-19
1014Italy2026-05-08
1015France2026-05-06
1016United Kingdom2026-06-03
1017Russia2026-06-02
1018Russia2026-05-22
1019Russia2026-05-17
1020Brazil2026-05-14
1021Australia2026-05-12
1022Canada2026-05-23
1023Argentina2026-05-18
1024Canada2026-05-16
1025Canada2026-05-18
1026United Kingdom2026-05-24
1027Japan2026-06-01
1028United Kingdom2026-05-11
1029Italy2026-05-25
1030Germany2026-05-20
1031France2026-05-30
1032Argentina2026-05-12
1033Italy2026-05-24
1034Canada2026-05-27
1035Argentina2026-05-23
1036Argentina2026-05-17
1037Italy2026-05-06
1038Germany2026-05-20
1039Germany2026-05-25
1040Japan2026-05-17
1041Germany2026-05-30
1042Brazil2026-05-31
1043Germany2026-06-01
1044Spain2026-05-07
1045Russia2026-05-23
1046United Kingdom2026-05-25
1047United Kingdom2026-05-06
1048India2026-05-25
1049France2026-05-30

On-Demand Data

NameIdCountryDate
Aditya Kusko1000Italy2026-05-26
Maria Marrier1001France2026-05-31
Salvatore Stockham1002France2026-05-24
Julie Stenseth1003Canada2026-05-16
Arvin Albares1004Australia2026-05-09
Izzy Garufi1005Australia2026-06-03
Sinclair Waycott1006Australia2026-05-17
Alejandro Perin1007Spain2026-05-17
Izzy Garufi1008Italy2026-05-12
Mayumi Kolmetz1009Germany2026-06-03
Stacey Maclead1010Japan2026-05-31
Nicolas Iturbide1011United Kingdom2026-05-25
Chavez Briddick1012Canada2026-05-05
Kadeem Flosi1013Canada2026-05-23
Leja Caldarera1014Brazil2026-05-09
Francesco Shinko1015Spain2026-05-17
Jefferson Schemmer1016Argentina2026-05-13
Jennifer Amigon1017Italy2026-06-02
Deepesh Chui1018Germany2026-05-15
Adams Morasca1019Italy2026-05-09
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Nicolas IturbideSpainXuxue Feng UNQUALIFIED
Mayumi KolmetzUnited KingdomOnyama Limba UNQUALIFIED
Sinclair WaycottGermanyAnna Fali NEW
Salvatore StockhamArgentinaOnyama Limba PROPOSAL
Rodrigues CampainBrazilIoni Bowcher UNQUALIFIED
Aruna FigeroaIndiaAsiya Javayant NEW
Emily WhobreyRussiaAmy Elsner RENEWAL
Juan WieserUnited KingdomAsiya Javayant UNQUALIFIED
Kaitlin OstroskyRussiaAsiya Javayant QUALIFIED
Aika InouyeIndiaAsiya Javayant RENEWAL
Arvin AlbaresUnited KingdomIvan Magalhaes PROPOSAL
Morrow RutaSpainIvan Magalhaes PROPOSAL
Juan WieserIndiaXuxue Feng UNQUALIFIED
Deepesh ChuiAustraliaBernardo Dominic RENEWAL
Alejandro PerinItalyXuxue Feng NEGOTIATION
Jefferson SchemmerCanadaIoni Bowcher UNQUALIFIED
Izzy GarufiUnited KingdomIvan Magalhaes QUALIFIED
Arvin AlbaresBrazilXuxue Feng UNQUALIFIED
Ivar PaprockiItalyAnna Fali NEW
Murillo MaletCanadaAmy Elsner NEGOTIATION
Juan WieserUnited KingdomStephen Shaw PROPOSAL
Cody SaylorsSpainAmy Elsner UNQUALIFIED
Aditya KuskoGermanyXuxue Feng RENEWAL
Nicolas IturbideItalyAnna Fali UNQUALIFIED
Deepesh ChuiArgentinaAmy Elsner QUALIFIED
Isabel BowleyGermanyAsiya Javayant QUALIFIED
Kadeem FlosiIndiaElwin Sharvill QUALIFIED
Darci PoquetteIndiaOnyama Limba NEGOTIATION
Wickens NestleBrazilStephen Shaw RENEWAL
Emily WhobreyRussiaXuxue Feng PROPOSAL
Greenwood BologniaAustraliaAnna Fali NEW
Aditya KuskoFranceIvan Magalhaes RENEWAL
Leon OldroydIndiaStephen Shaw NEGOTIATION
Isabel BowleyAustraliaAmy Elsner NEW
Jeanfrancois VenereFranceBernardo Dominic NEGOTIATION
Misaki RoysterArgentinaIoni Bowcher PROPOSAL
Munro FerenczFranceIoni Bowcher PROPOSAL
Adams MorascaAustraliaElwin Sharvill PROPOSAL
Alejandro PerinGermanyStephen Shaw NEGOTIATION
Isabel BowleySpainOnyama Limba 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>