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
Silvio SlusarskiJapanStephen Shaw NEGOTIATION
Rodrigues CampainArgentinaBernardo Dominic NEGOTIATION
Murillo MaletSpainXuxue Feng UNQUALIFIED
Kadeem FlosiUnited KingdomBernardo Dominic QUALIFIED
Leon OldroydJapanAsiya Javayant UNQUALIFIED
Arvin AlbaresRussiaIoni Bowcher NEW
Leon OldroydSpainElwin Sharvill NEGOTIATION
Stacey MacleadItalyIoni Bowcher NEW
Wickens NestleIndiaIvan Magalhaes NEGOTIATION
Tony FollerSpainAsiya Javayant UNQUALIFIED
Mujtaba NickaRussiaAmy Elsner PROPOSAL
Clifford RimGermanyXuxue Feng UNQUALIFIED
Jennifer AmigonGermanyAsiya Javayant NEW
Rodrigues CampainSpainAsiya Javayant PROPOSAL
Ricardo GauchoRussiaAsiya Javayant NEGOTIATION
Morrow RutaItalyIvan Magalhaes QUALIFIED
Rodrigues CampainUnited KingdomBernardo Dominic QUALIFIED
Smith GlickJapanBernardo Dominic PROPOSAL
Cody SaylorsIndiaAmy Elsner UNQUALIFIED
Misaki RoysterFranceIoni Bowcher PROPOSAL
Cody SaylorsIndiaAmy Elsner NEGOTIATION
Clifford RimGermanyIoni Bowcher RENEWAL
Deepesh ChuiJapanAsiya Javayant PROPOSAL
Arvin AlbaresFranceAnna Fali UNQUALIFIED
Leon OldroydArgentinaXuxue Feng NEGOTIATION
Smith GlickIndiaAmy Elsner RENEWAL
Faith GillianItalyElwin Sharvill NEGOTIATION
Misaki RoysterRussiaAnna Fali NEW
Costa DilliardRussiaAsiya Javayant NEGOTIATION
Adams MorascaBrazilAmy Elsner PROPOSAL
Costa DilliardGermanyAmy Elsner NEGOTIATION
Costa DilliardBrazilXuxue Feng NEW
Antonio CaudyGermanyAsiya Javayant NEW
Faith GillianFranceAsiya Javayant QUALIFIED
Costa DilliardAustraliaOnyama Limba QUALIFIED
Faith GillianSpainBernardo Dominic NEGOTIATION
Alejandro PerinJapanXuxue Feng UNQUALIFIED
Maria MarrierCanadaStephen Shaw NEGOTIATION
Arvin AlbaresRussiaXuxue Feng QUALIFIED
Smith GlickUnited KingdomStephen Shaw QUALIFIED
Claire TollnerIndiaOnyama Limba RENEWAL
Johnson SergiBrazilStephen Shaw NEW
Alejandro PerinBrazilAmy Elsner NEGOTIATION
Morrow RutaUnited KingdomIoni Bowcher NEGOTIATION
Emily WhobreyItalyAnna Fali PROPOSAL
Claire TollnerRussiaAnna Fali NEGOTIATION
Sinclair WaycottSpainIvan Magalhaes RENEWAL
Misaki RoysterJapanElwin Sharvill QUALIFIED
Smith GlickSpainIoni Bowcher PROPOSAL
Jones VocelkaAustraliaAnna Fali RENEWAL
Horizontal
NameCountryRepresentativeStatus
Maisha RulapaughCanadaElwin Sharvill RENEWAL
Alejandro PerinUnited KingdomOnyama Limba UNQUALIFIED
Antonio CaudyJapanStephen Shaw NEGOTIATION
Misaki RoysterItalyOnyama Limba PROPOSAL
Maisha RulapaughJapanAmy Elsner NEGOTIATION
Greenwood BologniaFranceAmy Elsner NEGOTIATION
Ashley DoeFranceIvan Magalhaes UNQUALIFIED
Mayumi KolmetzAustraliaAnna Fali QUALIFIED
Clifford RimGermanyAsiya Javayant QUALIFIED
Maisha RulapaughBrazilIoni Bowcher UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aruna FigeroaRussia2026-05-15Truhlar And Truhlar Attys RENEWAL40Bernardo Dominic
1001Clifford RimSpain2026-05-14King, Christopher A Esq UNQUALIFIED67Elwin Sharvill
1002Maria MarrierFrance2026-05-12Chapman, Ross E Esq PROPOSAL94Xuxue Feng
1003Silvio SlusarskiBrazil2026-06-03Rousseaux, Michael Esq UNQUALIFIED7Anna Fali
1004Murillo MaletGermany2026-05-20Rousseaux, Michael Esq NEW26Asiya Javayant
1005Julie StensethAustralia2026-05-27Chanay, Jeffrey A Esq PROPOSAL56Stephen Shaw
1006Juan WieserAustralia2026-05-31King, Christopher A Esq UNQUALIFIED91Elwin Sharvill
1007Mujtaba NickaRussia2026-06-02Truhlar And Truhlar Attys NEGOTIATION30Amy Elsner
1008Costa DilliardItaly2026-06-04Buckley Miller Wright NEW54Bernardo Dominic
1009Jones VocelkaJapan2026-05-10Feltz Printing Service PROPOSAL13Stephen Shaw
1010Ivar PaprockiSpain2026-06-06Morlong Associates NEGOTIATION1Xuxue Feng
1011Jennifer AmigonArgentina2026-06-05Morlong Associates QUALIFIED55Ioni Bowcher
1012Maisha RulapaughIndia2026-06-04Printing Dimensions QUALIFIED33Asiya Javayant
1013Nicolas IturbideIndia2026-05-30Buckley Miller Wright NEGOTIATION62Anna Fali
1014Leon OldroydGermany2026-05-28King, Christopher A Esq UNQUALIFIED79Amy Elsner
1015Cody SaylorsArgentina2026-05-20King, Christopher A Esq PROPOSAL14Amy Elsner
1016Aditya KuskoBrazil2026-05-26Rangoni Of Florence RENEWAL45Elwin Sharvill
1017Kaitlin OstroskyArgentina2026-05-15Dorl, James J Esq PROPOSAL86Asiya Javayant
1018Ivar PaprockiRussia2026-06-01Commercial Press RENEWAL90Bernardo Dominic
1019Stacey MacleadAustralia2026-06-05Feltz Printing Service QUALIFIED84Onyama Limba
1020Rodrigues CampainBrazil2026-05-10Commercial Press NEGOTIATION62Ivan Magalhaes
1021Mayumi KolmetzSpain2026-05-15Chanay, Jeffrey A Esq NEGOTIATION42Ivan Magalhaes
1022Jeanfrancois VenereGermany2026-05-09Feiner Bros NEGOTIATION4Elwin Sharvill
1023Misaki RoysterJapan2026-05-30Feltz Printing Service UNQUALIFIED23Ivan Magalhaes
1024Jefferson SchemmerAustralia2026-05-24Printing Dimensions NEW17Ivan Magalhaes
1025Antonio CaudyItaly2026-05-14Chapman, Ross E Esq NEGOTIATION38Xuxue Feng
1026Wickens NestleGermany2026-06-01Chanay, Jeffrey A Esq QUALIFIED74Ivan Magalhaes
1027Adams MorascaRussia2026-05-19Rangoni Of Florence NEW45Onyama Limba
1028Alejandro PerinIndia2026-05-13Truhlar And Truhlar Attys RENEWAL31Elwin Sharvill
1029Murillo MaletUnited Kingdom2026-05-18Benton, John B Jr NEW55Elwin Sharvill
1030Greenwood BologniaSpain2026-05-29Truhlar And Truhlar Attys UNQUALIFIED84Elwin Sharvill
1031Jennifer AmigonBrazil2026-05-13Commercial Press NEGOTIATION94Anna Fali
1032Sinclair WaycottJapan2026-05-16Commercial Press NEGOTIATION16Onyama Limba
1033Faith GillianUnited Kingdom2026-05-16Chanay, Jeffrey A Esq NEGOTIATION89Anna Fali
1034Smith GlickUnited Kingdom2026-05-20Feiner Bros PROPOSAL72Amy Elsner
1035Murillo MaletItaly2026-05-24Rousseaux, Michael Esq PROPOSAL46Amy Elsner
1036Jefferson SchemmerJapan2026-06-05Chapman, Ross E Esq RENEWAL54Bernardo Dominic
1037Silvio SlusarskiBrazil2026-05-26Rangoni Of Florence PROPOSAL61Xuxue Feng
1038Ivar PaprockiUnited Kingdom2026-06-04Chanay, Jeffrey A Esq NEGOTIATION20Ivan Magalhaes
1039Antonio CaudyJapan2026-05-21Chemel, James L Cpa RENEWAL27Bernardo Dominic
1040Emily WhobreyUnited Kingdom2026-05-29Commercial Press NEGOTIATION85Anna Fali
1041Mujtaba NickaArgentina2026-05-18Printing Dimensions NEGOTIATION95Elwin Sharvill
1042Isabel BowleyJapan2026-06-05Chapman, Ross E Esq NEGOTIATION89Bernardo Dominic
1043Wickens NestleArgentina2026-05-13Feiner Bros RENEWAL31Xuxue Feng
1044Sinclair WaycottUnited Kingdom2026-05-28Feiner Bros UNQUALIFIED11Xuxue Feng
1045Jeanfrancois VenereUnited Kingdom2026-05-21Commercial Press NEGOTIATION75Ioni Bowcher
1046Sinclair WaycottUnited Kingdom2026-05-14Printing Dimensions RENEWAL92Onyama Limba
1047Murillo MaletRussia2026-06-03Truhlar And Truhlar Attys QUALIFIED94Ivan Magalhaes
1048Silvio SlusarskiCanada2026-05-20Benton, John B Jr PROPOSAL84Ivan Magalhaes
1049Tony FollerItaly2026-05-29Rangoni Of Florence UNQUALIFIED23Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Kaitlin OstroskyFranceStephen Shaw PROPOSAL
Claire TollnerFranceBernardo Dominic RENEWAL
Mayumi KolmetzGermanyXuxue Feng NEGOTIATION
Aruna FigeroaArgentinaAmy Elsner RENEWAL
Silvio SlusarskiCanadaIvan Magalhaes UNQUALIFIED
Izzy GarufiAustraliaAnna Fali NEGOTIATION
Alejandro PerinIndiaIvan Magalhaes PROPOSAL
Maria MarrierRussiaIoni Bowcher NEGOTIATION
Francesco ShinkoCanadaElwin Sharvill NEGOTIATION
Wickens NestleCanadaStephen Shaw RENEWAL
Costa DilliardAustraliaAmy Elsner QUALIFIED
Kadeem FlosiItalyIvan Magalhaes QUALIFIED
David DarakjyIndiaIvan Magalhaes NEW
Nicolas IturbideBrazilOnyama Limba NEGOTIATION
Isabel BowleyGermanyIoni Bowcher UNQUALIFIED
Isabel BowleyRussiaBernardo Dominic NEW
Deepesh ChuiItalyBernardo Dominic PROPOSAL
Leja CaldareraIndiaStephen Shaw RENEWAL
Darci PoquetteUnited KingdomAnna Fali NEGOTIATION
Alejandro PerinJapanXuxue Feng QUALIFIED
Mujtaba NickaGermanyIvan Magalhaes NEW
Francesco ShinkoJapanAmy Elsner PROPOSAL
David DarakjyGermanyIvan Magalhaes RENEWAL
Leon OldroydUnited KingdomIoni Bowcher QUALIFIED
Ashley DoeItalyBernardo Dominic NEW
Nicolas IturbideItalyAmy Elsner RENEWAL
Wickens NestleUnited KingdomAnna Fali RENEWAL
Darci PoquetteUnited KingdomBernardo Dominic NEGOTIATION
Kaitlin OstroskyItalyAmy Elsner RENEWAL
Clifford RimCanadaStephen Shaw UNQUALIFIED
Rodrigues CampainItalyBernardo Dominic PROPOSAL
Kadeem FlosiItalyBernardo Dominic UNQUALIFIED
Antonio CaudyUnited KingdomAnna Fali PROPOSAL
Murillo MaletCanadaIvan Magalhaes PROPOSAL
Arvin AlbaresCanadaXuxue Feng NEGOTIATION
Salvatore StockhamJapanOnyama Limba NEGOTIATION
Mayumi KolmetzRussiaAmy Elsner RENEWAL
Aditya KuskoAustraliaAmy Elsner QUALIFIED
Izzy GarufiUnited KingdomAnna Fali NEW
Maria MarrierFranceIvan Magalhaes PROPOSAL
Julie StensethArgentinaIvan Magalhaes PROPOSAL
Arvin AlbaresSpainStephen Shaw QUALIFIED
Kaitlin OstroskyItalyOnyama Limba RENEWAL
Alejandro PerinRussiaIoni Bowcher PROPOSAL
Wickens NestleBrazilStephen Shaw NEW
Cody SaylorsGermanyBernardo Dominic QUALIFIED
Wickens NestleGermanyXuxue Feng QUALIFIED
Leja CaldareraArgentinaBernardo Dominic PROPOSAL
Nicolas IturbideIndiaStephen Shaw RENEWAL
Adams MorascaArgentinaIoni Bowcher NEGOTIATION
Frozen Columns
Name
Cody Saylors
Tony Foller
Adams Morasca
Kadeem Flosi
Chavez Briddick
Mayumi Kolmetz
Adams Morasca
Misaki Royster
Cody Saylors
David Darakjy
Sinclair Waycott
Murillo Malet
Smith Glick
Mujtaba Nicka
Smith Glick
Jennifer Amigon
Faith Gillian
Isabel Bowley
Julie Stenseth
Johnson Sergi
Arvin Albares
Jennifer Amigon
Deepesh Chui
Misaki Royster
Aika Inouye
Octavia Malet
Chavez Briddick
Sinclair Waycott
Stacey Maclead
Julie Stenseth
Deepesh Chui
Antonio Caudy
Salvatore Stockham
Aika Inouye
Nicolas Iturbide
Julie Stenseth
Mujtaba Nicka
Kadeem Flosi
Faith Gillian
Kaitlin Ostrosky
Rodrigues Campain
Aika Inouye
Francesco Shinko
Jeanfrancois Venere
Mayumi Kolmetz
Claire Tollner
Jeanfrancois Venere
Sinclair Waycott
Deepesh Chui
Costa Dilliard
IdCountryDate
1000Australia2026-05-25
1001Japan2026-05-24
1002Spain2026-05-24
1003Argentina2026-05-18
1004Italy2026-06-05
1005Japan2026-05-12
1006Australia2026-05-12
1007Germany2026-05-16
1008France2026-06-06
1009Italy2026-05-15
1010Russia2026-05-30
1011Argentina2026-05-27
1012Argentina2026-05-21
1013India2026-05-26
1014Italy2026-06-05
1015Russia2026-06-05
1016France2026-05-13
1017India2026-05-30
1018Germany2026-05-09
1019Russia2026-06-01
1020India2026-05-15
1021Australia2026-06-01
1022Australia2026-05-15
1023Australia2026-06-06
1024United Kingdom2026-05-27
1025Brazil2026-05-23
1026United Kingdom2026-05-17
1027Argentina2026-05-22
1028United Kingdom2026-05-29
1029Canada2026-05-15
1030France2026-05-23
1031Japan2026-05-18
1032France2026-05-19
1033Australia2026-05-26
1034Germany2026-05-16
1035Russia2026-05-22
1036India2026-05-17
1037Canada2026-05-12
1038India2026-05-08
1039Russia2026-05-17
1040Italy2026-05-10
1041India2026-05-21
1042Australia2026-05-13
1043Japan2026-05-20
1044Argentina2026-05-22
1045Germany2026-05-11
1046India2026-05-18
1047Argentina2026-06-05
1048United Kingdom2026-05-17
1049Canada2026-05-09

On-Demand Data

NameIdCountryDate
Jones Vocelka1000Russia2026-06-03
Misaki Royster1001Australia2026-05-28
Maria Marrier1002United Kingdom2026-05-23
Morrow Ruta1003Japan2026-05-18
Tony Foller1004Russia2026-05-16
Arvin Albares1005United Kingdom2026-05-31
Aika Inouye1006Canada2026-05-13
Arvin Albares1007Australia2026-06-04
Nicolas Iturbide1008Spain2026-05-16
Aditya Kusko1009Russia2026-05-13
Ashley Doe1010Brazil2026-06-01
Nicolas Iturbide1011United Kingdom2026-06-02
Clifford Rim1012Brazil2026-05-25
Jeanfrancois Venere1013United Kingdom2026-05-14
Ashley Doe1014Argentina2026-06-04
Jones Vocelka1015Russia2026-05-19
Maisha Rulapaugh1016United Kingdom2026-05-31
Antonio Caudy1017Japan2026-05-12
Jefferson Schemmer1018India2026-05-14
Maisha Rulapaugh1019Japan2026-05-27
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Isabel BowleyJapanElwin Sharvill RENEWAL
Clifford RimRussiaAmy Elsner RENEWAL
Nicolas IturbideCanadaAsiya Javayant NEW
Deepesh ChuiGermanyOnyama Limba UNQUALIFIED
Aika InouyeArgentinaOnyama Limba NEGOTIATION
Ashley DoeSpainIoni Bowcher UNQUALIFIED
Antonio CaudyItalyOnyama Limba QUALIFIED
Jeanfrancois VenereUnited KingdomIoni Bowcher PROPOSAL
Munro FerenczRussiaIvan Magalhaes QUALIFIED
Morrow RutaArgentinaIoni Bowcher NEGOTIATION
Maisha RulapaughGermanyIvan Magalhaes NEW
Mayumi KolmetzSpainXuxue Feng PROPOSAL
David DarakjyUnited KingdomAmy Elsner PROPOSAL
Alejandro PerinFranceBernardo Dominic RENEWAL
Johnson SergiJapanXuxue Feng NEW
Ivar PaprockiGermanyIoni Bowcher NEGOTIATION
Darci PoquetteAustraliaAnna Fali PROPOSAL
Greenwood BologniaAustraliaXuxue Feng UNQUALIFIED
Deepesh ChuiArgentinaAmy Elsner RENEWAL
Stacey MacleadRussiaIoni Bowcher RENEWAL
Julie StensethJapanXuxue Feng NEW
Clifford RimRussiaIvan Magalhaes UNQUALIFIED
Mayumi KolmetzItalyAsiya Javayant PROPOSAL
Ashley DoeFranceIvan Magalhaes NEW
Alejandro PerinBrazilElwin Sharvill RENEWAL
Stacey MacleadUnited KingdomIoni Bowcher NEGOTIATION
Rodrigues CampainItalyAmy Elsner NEW
Johnson SergiFranceAnna Fali PROPOSAL
Isabel BowleyBrazilAsiya Javayant RENEWAL
Silvio SlusarskiJapanAsiya Javayant UNQUALIFIED
Deepesh ChuiCanadaElwin Sharvill RENEWAL
Kaitlin OstroskyItalyBernardo Dominic RENEWAL
David DarakjyAustraliaBernardo Dominic RENEWAL
Nicolas IturbideBrazilAnna Fali RENEWAL
Greenwood BologniaJapanAsiya Javayant NEGOTIATION
James ButtJapanStephen Shaw UNQUALIFIED
Salvatore StockhamAustraliaIvan Magalhaes QUALIFIED
Rodrigues CampainFranceIvan Magalhaes QUALIFIED
Mayumi KolmetzCanadaBernardo Dominic QUALIFIED
Kaitlin OstroskySpainAnna Fali PROPOSAL

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