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
Jeanfrancois VenereItalyIoni Bowcher NEW
Octavia MaletRussiaOnyama Limba QUALIFIED
Tony FollerBrazilOnyama Limba RENEWAL
Darci PoquetteCanadaXuxue Feng NEGOTIATION
Morrow RutaRussiaStephen Shaw NEGOTIATION
Emily WhobreyItalyOnyama Limba RENEWAL
Clifford RimArgentinaElwin Sharvill NEW
Greenwood BologniaCanadaXuxue Feng NEW
Juan WieserSpainOnyama Limba UNQUALIFIED
Nicolas IturbideItalyElwin Sharvill QUALIFIED
Rodrigues CampainSpainXuxue Feng UNQUALIFIED
Morrow RutaUnited KingdomIvan Magalhaes UNQUALIFIED
Kadeem FlosiAustraliaIoni Bowcher NEW
David DarakjyBrazilIvan Magalhaes NEGOTIATION
Deepesh ChuiRussiaIoni Bowcher QUALIFIED
Morrow RutaAustraliaOnyama Limba NEW
Julie StensethGermanyElwin Sharvill NEW
Greenwood BologniaBrazilAsiya Javayant UNQUALIFIED
Leon OldroydIndiaStephen Shaw UNQUALIFIED
Costa DilliardItalyOnyama Limba UNQUALIFIED
Costa DilliardUnited KingdomXuxue Feng QUALIFIED
Mayumi KolmetzArgentinaAmy Elsner PROPOSAL
Munro FerenczJapanIvan Magalhaes QUALIFIED
Isabel BowleySpainStephen Shaw NEW
Tony FollerIndiaAnna Fali PROPOSAL
Arvin AlbaresJapanAnna Fali PROPOSAL
Johnson SergiAustraliaBernardo Dominic PROPOSAL
Mayumi KolmetzRussiaElwin Sharvill NEGOTIATION
Cody SaylorsIndiaIoni Bowcher NEW
Misaki RoysterArgentinaIvan Magalhaes PROPOSAL
Morrow RutaFranceIvan Magalhaes NEW
Ivar PaprockiAustraliaAsiya Javayant NEGOTIATION
Silvio SlusarskiItalyIvan Magalhaes QUALIFIED
Jeanfrancois VenereGermanyXuxue Feng QUALIFIED
Leja CaldareraGermanyIoni Bowcher QUALIFIED
Francesco ShinkoSpainOnyama Limba UNQUALIFIED
David DarakjyCanadaAmy Elsner NEW
James ButtCanadaBernardo Dominic NEGOTIATION
Aditya KuskoBrazilAmy Elsner PROPOSAL
Stacey MacleadCanadaAsiya Javayant PROPOSAL
Juan WieserBrazilBernardo Dominic PROPOSAL
Murillo MaletSpainAsiya Javayant UNQUALIFIED
Aika InouyeFranceElwin Sharvill NEW
Jennifer AmigonJapanElwin Sharvill NEW
Johnson SergiCanadaIvan Magalhaes UNQUALIFIED
Aruna FigeroaItalyIvan Magalhaes PROPOSAL
Morrow RutaArgentinaIvan Magalhaes NEW
Jones VocelkaSpainIoni Bowcher NEW
Isabel BowleyGermanyBernardo Dominic RENEWAL
Faith GillianUnited KingdomElwin Sharvill QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Ricardo GauchoGermanyBernardo Dominic NEW
Jefferson SchemmerRussiaElwin Sharvill UNQUALIFIED
Sinclair WaycottBrazilIvan Magalhaes PROPOSAL
Jennifer AmigonItalyBernardo Dominic NEGOTIATION
Costa DilliardIndiaElwin Sharvill NEW
Misaki RoysterFranceAmy Elsner NEGOTIATION
Silvio SlusarskiIndiaOnyama Limba QUALIFIED
Leon OldroydUnited KingdomXuxue Feng NEW
Octavia MaletSpainAmy Elsner QUALIFIED
Emily WhobreyCanadaBernardo Dominic NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Izzy GarufiAustralia2026-04-29Chapman, Ross E Esq RENEWAL59Anna Fali
1001Johnson SergiAustralia2026-04-24Truhlar And Truhlar Attys QUALIFIED82Xuxue Feng
1002Emily WhobreyUnited Kingdom2026-05-04Benton, John B Jr NEGOTIATION95Bernardo Dominic
1003Silvio SlusarskiGermany2026-05-02Feiner Bros PROPOSAL96Onyama Limba
1004Aruna FigeroaFrance2026-05-08Buckley Miller Wright UNQUALIFIED52Asiya Javayant
1005Deepesh ChuiCanada2026-05-03Rangoni Of Florence PROPOSAL16Xuxue Feng
1006Emily WhobreyAustralia2026-05-01Printing Dimensions NEGOTIATION43Elwin Sharvill
1007Juan WieserAustralia2026-05-09King, Christopher A Esq NEGOTIATION42Xuxue Feng
1008Mujtaba NickaSpain2026-05-11Morlong Associates NEGOTIATION71Onyama Limba
1009Jennifer AmigonArgentina2026-05-06Chanay, Jeffrey A Esq RENEWAL60Stephen Shaw
1010Misaki RoysterUnited Kingdom2026-05-14Rousseaux, Michael Esq UNQUALIFIED34Bernardo Dominic
1011Greenwood BologniaFrance2026-05-17Buckley Miller Wright NEW90Ioni Bowcher
1012Francesco ShinkoGermany2026-04-29Commercial Press NEW83Elwin Sharvill
1013Murillo MaletArgentina2026-05-09Chemel, James L Cpa RENEWAL20Onyama Limba
1014Silvio SlusarskiAustralia2026-04-28Benton, John B Jr QUALIFIED87Onyama Limba
1015Rodrigues CampainCanada2026-05-14Printing Dimensions NEW5Amy Elsner
1016Ashley DoeArgentina2026-05-06Chapman, Ross E Esq RENEWAL34Xuxue Feng
1017Deepesh ChuiJapan2026-05-15Printing Dimensions NEGOTIATION18Ivan Magalhaes
1018Izzy GarufiAustralia2026-05-02Dorl, James J Esq QUALIFIED62Onyama Limba
1019Munro FerenczBrazil2026-05-14Rousseaux, Michael Esq NEGOTIATION53Amy Elsner
1020Munro FerenczSpain2026-05-10Morlong Associates UNQUALIFIED97Anna Fali
1021Izzy GarufiRussia2026-05-15Buckley Miller Wright RENEWAL63Stephen Shaw
1022Stacey MacleadGermany2026-05-22Chapman, Ross E Esq NEGOTIATION61Bernardo Dominic
1023Jones VocelkaCanada2026-05-22Dorl, James J Esq UNQUALIFIED61Onyama Limba
1024Ashley DoeItaly2026-05-11Chemel, James L Cpa UNQUALIFIED65Ioni Bowcher
1025Adams MorascaFrance2026-05-10Buckley Miller Wright UNQUALIFIED68Ivan Magalhaes
1026Antonio CaudyUnited Kingdom2026-04-27Rousseaux, Michael Esq RENEWAL28Asiya Javayant
1027Jefferson SchemmerAustralia2026-05-04Morlong Associates NEW55Stephen Shaw
1028Smith GlickUnited Kingdom2026-05-08Chanay, Jeffrey A Esq NEGOTIATION74Elwin Sharvill
1029Munro FerenczSpain2026-04-30Rangoni Of Florence RENEWAL78Amy Elsner
1030Clifford RimCanada2026-05-01Chapman, Ross E Esq PROPOSAL27Bernardo Dominic
1031Munro FerenczUnited Kingdom2026-05-16Printing Dimensions RENEWAL18Elwin Sharvill
1032Silvio SlusarskiRussia2026-04-25Chemel, James L Cpa RENEWAL25Onyama Limba
1033Mujtaba NickaItaly2026-05-11Rousseaux, Michael Esq NEW67Anna Fali
1034Salvatore StockhamCanada2026-05-20Chemel, James L Cpa UNQUALIFIED83Amy Elsner
1035Aditya KuskoIndia2026-04-26Chanay, Jeffrey A Esq NEGOTIATION3Bernardo Dominic
1036Cody SaylorsCanada2026-05-08Feiner Bros PROPOSAL75Xuxue Feng
1037Maisha RulapaughIndia2026-04-30Printing Dimensions PROPOSAL88Ivan Magalhaes
1038Maria MarrierJapan2026-05-21Printing Dimensions NEW87Ivan Magalhaes
1039Aditya KuskoAustralia2026-05-08Buckley Miller Wright QUALIFIED97Anna Fali
1040Greenwood BologniaArgentina2026-05-18Feltz Printing Service PROPOSAL73Asiya Javayant
1041Maria MarrierUnited Kingdom2026-05-14Morlong Associates NEGOTIATION75Asiya Javayant
1042Jefferson SchemmerCanada2026-05-20Chemel, James L Cpa PROPOSAL14Asiya Javayant
1043Jefferson SchemmerJapan2026-04-25Rangoni Of Florence QUALIFIED75Xuxue Feng
1044Ricardo GauchoItaly2026-05-01Dorl, James J Esq UNQUALIFIED87Xuxue Feng
1045Ashley DoeUnited Kingdom2026-05-21Feltz Printing Service RENEWAL66Asiya Javayant
1046Silvio SlusarskiBrazil2026-05-08Rangoni Of Florence RENEWAL3Asiya Javayant
1047Murillo MaletItaly2026-05-16Dorl, James J Esq UNQUALIFIED46Anna Fali
1048Aruna FigeroaBrazil2026-05-22Chapman, Ross E Esq RENEWAL49Onyama Limba
1049Smith GlickArgentina2026-04-24Feiner Bros RENEWAL93Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Aika InouyeIndiaXuxue Feng RENEWAL
Arvin AlbaresArgentinaAnna Fali NEW
Clifford RimIndiaBernardo Dominic RENEWAL
Alejandro PerinIndiaElwin Sharvill RENEWAL
Johnson SergiItalyXuxue Feng NEGOTIATION
Murillo MaletSpainAnna Fali NEW
Arvin AlbaresGermanyAmy Elsner UNQUALIFIED
Tony FollerUnited KingdomAsiya Javayant UNQUALIFIED
Wickens NestleCanadaAsiya Javayant QUALIFIED
Arvin AlbaresSpainElwin Sharvill NEGOTIATION
Mayumi KolmetzGermanyAsiya Javayant NEGOTIATION
Kadeem FlosiAustraliaAnna Fali QUALIFIED
Ashley DoeBrazilElwin Sharvill QUALIFIED
Adams MorascaFranceAnna Fali NEGOTIATION
Aika InouyeItalyAnna Fali NEW
Francesco ShinkoCanadaStephen Shaw NEW
Emily WhobreyItalyIvan Magalhaes QUALIFIED
Alejandro PerinFranceOnyama Limba PROPOSAL
Morrow RutaJapanXuxue Feng NEW
Rodrigues CampainCanadaStephen Shaw PROPOSAL
Smith GlickIndiaElwin Sharvill QUALIFIED
Emily WhobreyArgentinaAmy Elsner PROPOSAL
Aika InouyeGermanyIoni Bowcher RENEWAL
Rodrigues CampainItalyElwin Sharvill NEW
Kadeem FlosiUnited KingdomAsiya Javayant PROPOSAL
Rodrigues CampainFranceIvan Magalhaes NEW
Stacey MacleadRussiaIvan Magalhaes QUALIFIED
Murillo MaletCanadaElwin Sharvill QUALIFIED
Ivar PaprockiJapanXuxue Feng UNQUALIFIED
Aika InouyeAustraliaIoni Bowcher NEW
David DarakjyRussiaElwin Sharvill RENEWAL
Cody SaylorsCanadaAsiya Javayant NEW
James ButtItalyStephen Shaw PROPOSAL
Leja CaldareraFranceBernardo Dominic UNQUALIFIED
Chavez BriddickAustraliaIvan Magalhaes QUALIFIED
Cody SaylorsRussiaAmy Elsner NEW
James ButtJapanIvan Magalhaes PROPOSAL
James ButtArgentinaOnyama Limba RENEWAL
Sinclair WaycottSpainAmy Elsner RENEWAL
Leja CaldareraBrazilIoni Bowcher NEW
Mujtaba NickaCanadaIoni Bowcher UNQUALIFIED
Stacey MacleadUnited KingdomElwin Sharvill QUALIFIED
Adams MorascaSpainIvan Magalhaes UNQUALIFIED
Salvatore StockhamIndiaStephen Shaw UNQUALIFIED
Deepesh ChuiItalyAnna Fali RENEWAL
Leja CaldareraRussiaOnyama Limba UNQUALIFIED
Chavez BriddickBrazilElwin Sharvill UNQUALIFIED
Mujtaba NickaIndiaXuxue Feng QUALIFIED
Izzy GarufiAustraliaIvan Magalhaes PROPOSAL
Aruna FigeroaArgentinaIvan Magalhaes NEW
Frozen Columns
Name
Wickens Nestle
Mujtaba Nicka
Jefferson Schemmer
Misaki Royster
Alejandro Perin
Chavez Briddick
Antonio Caudy
Emily Whobrey
Nicolas Iturbide
Tony Foller
Rodrigues Campain
Leon Oldroyd
Aruna Figeroa
Leja Caldarera
Sinclair Waycott
Greenwood Bolognia
Julie Stenseth
Ashley Doe
Aruna Figeroa
Greenwood Bolognia
Costa Dilliard
Munro Ferencz
Greenwood Bolognia
Alejandro Perin
Aika Inouye
Greenwood Bolognia
Aruna Figeroa
Morrow Ruta
Leon Oldroyd
David Darakjy
Maria Marrier
Aruna Figeroa
Silvio Slusarski
Octavia Malet
Chavez Briddick
Francesco Shinko
Ashley Doe
Ashley Doe
Mayumi Kolmetz
Ashley Doe
Leja Caldarera
Julie Stenseth
Octavia Malet
Izzy Garufi
Claire Tollner
James Butt
James Butt
Chavez Briddick
Izzy Garufi
Misaki Royster
IdCountryDate
1000France2026-05-01
1001Canada2026-04-30
1002India2026-05-01
1003Germany2026-05-21
1004Spain2026-04-24
1005Argentina2026-05-16
1006Spain2026-05-22
1007Italy2026-04-28
1008Australia2026-05-23
1009Japan2026-05-06
1010Brazil2026-05-14
1011United Kingdom2026-05-22
1012Brazil2026-05-14
1013Russia2026-05-13
1014Spain2026-05-11
1015United Kingdom2026-05-05
1016Russia2026-05-10
1017Argentina2026-05-15
1018Australia2026-05-20
1019France2026-05-03
1020India2026-05-07
1021France2026-04-27
1022Canada2026-04-28
1023Russia2026-04-24
1024Spain2026-05-05
1025Italy2026-05-05
1026Argentina2026-05-18
1027Japan2026-04-30
1028Russia2026-04-26
1029Argentina2026-05-17
1030Japan2026-05-06
1031Australia2026-05-06
1032Argentina2026-04-27
1033Japan2026-05-22
1034Brazil2026-04-26
1035Italy2026-05-04
1036Russia2026-05-11
1037Australia2026-05-20
1038Australia2026-05-22
1039Russia2026-05-19
1040France2026-04-29
1041Germany2026-04-24
1042Canada2026-05-21
1043India2026-04-29
1044Canada2026-04-28
1045Argentina2026-05-14
1046Japan2026-05-23
1047Argentina2026-05-21
1048Spain2026-05-18
1049Japan2026-05-13

On-Demand Data

NameIdCountryDate
James Butt1000Argentina2026-05-10
Izzy Garufi1001Argentina2026-04-28
Jones Vocelka1002Italy2026-04-30
Maisha Rulapaugh1003France2026-04-25
Francesco Shinko1004France2026-05-10
Alejandro Perin1005Germany2026-04-27
Morrow Ruta1006Spain2026-05-06
Misaki Royster1007Brazil2026-05-02
Costa Dilliard1008France2026-04-25
Jeanfrancois Venere1009Canada2026-05-04
Stacey Maclead1010Argentina2026-05-08
Tony Foller1011France2026-04-25
Jeanfrancois Venere1012France2026-05-17
Jefferson Schemmer1013Canada2026-05-12
Leon Oldroyd1014Argentina2026-05-08
Johnson Sergi1015Argentina2026-05-18
Sinclair Waycott1016India2026-05-09
Sinclair Waycott1017France2026-05-05
Izzy Garufi1018United Kingdom2026-04-25
Misaki Royster1019Italy2026-05-02
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Nicolas IturbideSpainXuxue Feng NEW
Misaki RoysterSpainStephen Shaw RENEWAL
Jefferson SchemmerJapanAsiya Javayant NEGOTIATION
Izzy GarufiRussiaIvan Magalhaes PROPOSAL
Jones VocelkaBrazilXuxue Feng UNQUALIFIED
Kadeem FlosiUnited KingdomAmy Elsner RENEWAL
Aruna FigeroaRussiaStephen Shaw PROPOSAL
Maria MarrierJapanAmy Elsner PROPOSAL
Faith GillianCanadaStephen Shaw NEGOTIATION
James ButtIndiaIvan Magalhaes RENEWAL
Tony FollerRussiaOnyama Limba NEGOTIATION
Sinclair WaycottAustraliaStephen Shaw NEW
Juan WieserCanadaOnyama Limba NEW
Emily WhobreyItalyXuxue Feng RENEWAL
Emily WhobreyAustraliaOnyama Limba UNQUALIFIED
Clifford RimRussiaOnyama Limba PROPOSAL
James ButtBrazilXuxue Feng QUALIFIED
Salvatore StockhamArgentinaAsiya Javayant QUALIFIED
Jefferson SchemmerArgentinaBernardo Dominic QUALIFIED
Tony FollerUnited KingdomElwin Sharvill UNQUALIFIED
Kadeem FlosiItalyAsiya Javayant UNQUALIFIED
Morrow RutaIndiaElwin Sharvill QUALIFIED
Isabel BowleyJapanBernardo Dominic UNQUALIFIED
Morrow RutaIndiaOnyama Limba QUALIFIED
Aika InouyeSpainAmy Elsner UNQUALIFIED
Jennifer AmigonBrazilAmy Elsner UNQUALIFIED
Ricardo GauchoUnited KingdomXuxue Feng UNQUALIFIED
Tony FollerSpainAnna Fali UNQUALIFIED
Mujtaba NickaArgentinaOnyama Limba QUALIFIED
Deepesh ChuiIndiaIoni Bowcher QUALIFIED
Cody SaylorsRussiaIvan Magalhaes NEW
Mayumi KolmetzItalyAnna Fali RENEWAL
Jones VocelkaItalyAsiya Javayant NEGOTIATION
Darci PoquetteBrazilStephen Shaw RENEWAL
Faith GillianFranceStephen Shaw PROPOSAL
Antonio CaudyRussiaElwin Sharvill QUALIFIED
Clifford RimItalyAnna Fali RENEWAL
Izzy GarufiItalyAnna Fali RENEWAL
Chavez BriddickFranceStephen Shaw UNQUALIFIED
Silvio SlusarskiItalyIoni Bowcher QUALIFIED

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