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
Ashley DoeAustraliaAnna Fali NEGOTIATION
Francesco ShinkoSpainOnyama Limba QUALIFIED
Aruna FigeroaItalyIoni Bowcher RENEWAL
Claire TollnerUnited KingdomIvan Magalhaes NEGOTIATION
Johnson SergiRussiaIoni Bowcher QUALIFIED
Silvio SlusarskiSpainXuxue Feng UNQUALIFIED
Mujtaba NickaJapanStephen Shaw NEW
Alejandro PerinJapanIvan Magalhaes QUALIFIED
Aika InouyeItalyAsiya Javayant PROPOSAL
Smith GlickArgentinaAmy Elsner RENEWAL
Kaitlin OstroskySpainStephen Shaw NEGOTIATION
Aditya KuskoBrazilAmy Elsner NEGOTIATION
Misaki RoysterFranceOnyama Limba NEGOTIATION
Silvio SlusarskiArgentinaAmy Elsner NEW
Stacey MacleadAustraliaAsiya Javayant PROPOSAL
Costa DilliardItalyIvan Magalhaes PROPOSAL
Clifford RimRussiaOnyama Limba PROPOSAL
Greenwood BologniaArgentinaIvan Magalhaes NEGOTIATION
Johnson SergiBrazilElwin Sharvill PROPOSAL
Maisha RulapaughBrazilAnna Fali NEGOTIATION
Izzy GarufiCanadaOnyama Limba UNQUALIFIED
Maria MarrierCanadaElwin Sharvill NEW
Kaitlin OstroskyUnited KingdomBernardo Dominic RENEWAL
Misaki RoysterArgentinaAnna Fali QUALIFIED
Arvin AlbaresJapanAsiya Javayant RENEWAL
Greenwood BologniaSpainElwin Sharvill QUALIFIED
Emily WhobreyUnited KingdomAsiya Javayant NEGOTIATION
Julie StensethUnited KingdomXuxue Feng UNQUALIFIED
Misaki RoysterUnited KingdomAsiya Javayant UNQUALIFIED
Ivar PaprockiUnited KingdomOnyama Limba UNQUALIFIED
Clifford RimIndiaOnyama Limba UNQUALIFIED
Aika InouyeAustraliaIoni Bowcher PROPOSAL
Aruna FigeroaCanadaBernardo Dominic UNQUALIFIED
Smith GlickArgentinaOnyama Limba RENEWAL
Jeanfrancois VenereCanadaBernardo Dominic QUALIFIED
Rodrigues CampainCanadaAmy Elsner PROPOSAL
Maisha RulapaughItalyIoni Bowcher UNQUALIFIED
Maisha RulapaughItalyIoni Bowcher NEW
Rodrigues CampainBrazilAnna Fali RENEWAL
Kadeem FlosiRussiaAnna Fali PROPOSAL
Cody SaylorsJapanAsiya Javayant UNQUALIFIED
Claire TollnerBrazilAmy Elsner RENEWAL
Mayumi KolmetzFranceOnyama Limba NEW
Mujtaba NickaSpainAsiya Javayant RENEWAL
Morrow RutaRussiaBernardo Dominic UNQUALIFIED
Adams MorascaItalyBernardo Dominic RENEWAL
Leja CaldareraFranceIvan Magalhaes NEGOTIATION
Deepesh ChuiUnited KingdomAsiya Javayant NEW
Clifford RimArgentinaStephen Shaw RENEWAL
Jefferson SchemmerItalyElwin Sharvill QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Ivar PaprockiGermanyAsiya Javayant PROPOSAL
Julie StensethJapanStephen Shaw PROPOSAL
Darci PoquetteArgentinaBernardo Dominic PROPOSAL
Misaki RoysterItalyAmy Elsner QUALIFIED
David DarakjyGermanyIvan Magalhaes NEW
David DarakjyIndiaAnna Fali RENEWAL
Adams MorascaFranceIoni Bowcher NEW
Faith GillianUnited KingdomAmy Elsner NEGOTIATION
Salvatore StockhamBrazilIoni Bowcher NEGOTIATION
Ivar PaprockiJapanStephen Shaw UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aditya KuskoFrance2026-04-22Chapman, Ross E Esq UNQUALIFIED55Bernardo Dominic
1001Maria MarrierUnited Kingdom2026-04-17Chemel, James L Cpa QUALIFIED16Elwin Sharvill
1002Murillo MaletItaly2026-04-27Chemel, James L Cpa PROPOSAL51Asiya Javayant
1003Mujtaba NickaCanada2026-04-19Chanay, Jeffrey A Esq NEGOTIATION98Amy Elsner
1004Nicolas IturbideUnited Kingdom2026-04-29Printing Dimensions RENEWAL48Xuxue Feng
1005Clifford RimArgentina2026-04-14Truhlar And Truhlar Attys RENEWAL10Bernardo Dominic
1006Julie StensethAustralia2026-05-04Benton, John B Jr PROPOSAL97Amy Elsner
1007Isabel BowleyCanada2026-04-12Buckley Miller Wright NEW1Elwin Sharvill
1008Stacey MacleadCanada2026-04-23Printing Dimensions QUALIFIED28Ioni Bowcher
1009Mayumi KolmetzItaly2026-04-19Commercial Press UNQUALIFIED69Elwin Sharvill
1010Kaitlin OstroskyBrazil2026-04-25Chemel, James L Cpa NEW12Onyama Limba
1011Aruna FigeroaIndia2026-04-11Printing Dimensions PROPOSAL86Elwin Sharvill
1012Stacey MacleadSpain2026-04-26Chemel, James L Cpa UNQUALIFIED32Xuxue Feng
1013Johnson SergiBrazil2026-04-23Rousseaux, Michael Esq QUALIFIED1Xuxue Feng
1014Kaitlin OstroskyJapan2026-04-19Feiner Bros NEW41Ioni Bowcher
1015Ricardo GauchoUnited Kingdom2026-05-01Truhlar And Truhlar Attys NEGOTIATION39Bernardo Dominic
1016Aruna FigeroaCanada2026-05-01Rousseaux, Michael Esq PROPOSAL66Anna Fali
1017Stacey MacleadUnited Kingdom2026-04-23Chanay, Jeffrey A Esq NEW51Ivan Magalhaes
1018Sinclair WaycottArgentina2026-04-10Rangoni Of Florence UNQUALIFIED96Elwin Sharvill
1019Silvio SlusarskiSpain2026-05-09Commercial Press QUALIFIED61Ivan Magalhaes
1020Juan WieserFrance2026-05-08Truhlar And Truhlar Attys QUALIFIED68Amy Elsner
1021James ButtFrance2026-05-06Chapman, Ross E Esq NEGOTIATION31Xuxue Feng
1022Jeanfrancois VenereIndia2026-04-17Chapman, Ross E Esq UNQUALIFIED46Asiya Javayant
1023Mayumi KolmetzCanada2026-04-13Feiner Bros PROPOSAL57Elwin Sharvill
1024Munro FerenczGermany2026-04-11Benton, John B Jr NEGOTIATION21Bernardo Dominic
1025Mayumi KolmetzGermany2026-04-13Printing Dimensions NEGOTIATION33Xuxue Feng
1026Misaki RoysterBrazil2026-04-29Chemel, James L Cpa NEGOTIATION2Ivan Magalhaes
1027Maria MarrierFrance2026-05-08Rousseaux, Michael Esq RENEWAL50Bernardo Dominic
1028Aika InouyeIndia2026-05-05Rangoni Of Florence UNQUALIFIED31Bernardo Dominic
1029Faith GillianIndia2026-05-09Chapman, Ross E Esq RENEWAL10Asiya Javayant
1030Wickens NestleIndia2026-05-09Feiner Bros RENEWAL89Stephen Shaw
1031Julie StensethArgentina2026-04-15Commercial Press PROPOSAL33Amy Elsner
1032Salvatore StockhamUnited Kingdom2026-04-28King, Christopher A Esq QUALIFIED43Onyama Limba
1033Ivar PaprockiUnited Kingdom2026-04-11King, Christopher A Esq NEW53Bernardo Dominic
1034Adams MorascaIndia2026-04-10Benton, John B Jr RENEWAL79Stephen Shaw
1035Jones VocelkaBrazil2026-05-09King, Christopher A Esq UNQUALIFIED80Stephen Shaw
1036Silvio SlusarskiJapan2026-05-02Feiner Bros RENEWAL65Stephen Shaw
1037Mujtaba NickaGermany2026-04-29Rangoni Of Florence NEW45Asiya Javayant
1038Antonio CaudyItaly2026-05-01Feiner Bros QUALIFIED34Ivan Magalhaes
1039Jones VocelkaJapan2026-04-18Feltz Printing Service UNQUALIFIED43Ivan Magalhaes
1040Julie StensethGermany2026-04-16Benton, John B Jr NEGOTIATION63Anna Fali
1041Aika InouyeIndia2026-04-16Rangoni Of Florence UNQUALIFIED81Amy Elsner
1042Jones VocelkaBrazil2026-04-23Dorl, James J Esq PROPOSAL26Bernardo Dominic
1043Aruna FigeroaSpain2026-04-19Rangoni Of Florence RENEWAL13Anna Fali
1044Deepesh ChuiSpain2026-04-11Printing Dimensions QUALIFIED50Anna Fali
1045Alejandro PerinArgentina2026-04-25Rangoni Of Florence NEGOTIATION28Ioni Bowcher
1046Faith GillianBrazil2026-05-07Dorl, James J Esq PROPOSAL49Xuxue Feng
1047Darci PoquetteAustralia2026-04-23Buckley Miller Wright RENEWAL49Xuxue Feng
1048Octavia MaletUnited Kingdom2026-04-23Benton, John B Jr PROPOSAL61Xuxue Feng
1049Jeanfrancois VenereGermany2026-04-21Feltz Printing Service QUALIFIED46Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Aditya KuskoBrazilIoni Bowcher NEW
Jeanfrancois VenereIndiaBernardo Dominic PROPOSAL
Juan WieserGermanyIoni Bowcher NEGOTIATION
Clifford RimJapanStephen Shaw PROPOSAL
Kadeem FlosiJapanAsiya Javayant QUALIFIED
Jones VocelkaGermanyIvan Magalhaes QUALIFIED
Izzy GarufiCanadaElwin Sharvill RENEWAL
Jeanfrancois VenereItalyAmy Elsner QUALIFIED
Silvio SlusarskiAustraliaAnna Fali PROPOSAL
Jeanfrancois VenereRussiaIoni Bowcher NEW
Greenwood BologniaJapanXuxue Feng NEGOTIATION
Morrow RutaFranceOnyama Limba UNQUALIFIED
David DarakjyUnited KingdomIvan Magalhaes RENEWAL
Octavia MaletItalyElwin Sharvill NEGOTIATION
Wickens NestleArgentinaAmy Elsner UNQUALIFIED
Julie StensethArgentinaIvan Magalhaes RENEWAL
Cody SaylorsGermanyOnyama Limba PROPOSAL
Greenwood BologniaBrazilIoni Bowcher PROPOSAL
Sinclair WaycottRussiaAmy Elsner QUALIFIED
Aruna FigeroaFranceOnyama Limba QUALIFIED
Clifford RimUnited KingdomOnyama Limba RENEWAL
Aruna FigeroaGermanyIvan Magalhaes QUALIFIED
Isabel BowleyJapanIoni Bowcher NEW
Isabel BowleyCanadaIoni Bowcher QUALIFIED
Faith GillianIndiaIoni Bowcher NEGOTIATION
Maisha RulapaughSpainOnyama Limba QUALIFIED
Kadeem FlosiArgentinaXuxue Feng NEGOTIATION
Wickens NestleRussiaOnyama Limba NEW
Tony FollerUnited KingdomAmy Elsner RENEWAL
Nicolas IturbideItalyAnna Fali QUALIFIED
Wickens NestleArgentinaIvan Magalhaes QUALIFIED
Jeanfrancois VenereSpainIvan Magalhaes PROPOSAL
James ButtRussiaIoni Bowcher RENEWAL
Nicolas IturbideRussiaAsiya Javayant PROPOSAL
Aditya KuskoJapanAsiya Javayant PROPOSAL
Mujtaba NickaBrazilIoni Bowcher UNQUALIFIED
Johnson SergiAustraliaElwin Sharvill NEW
Mujtaba NickaUnited KingdomAmy Elsner UNQUALIFIED
Antonio CaudyBrazilAsiya Javayant NEW
Julie StensethSpainAmy Elsner QUALIFIED
Jones VocelkaGermanyIvan Magalhaes RENEWAL
Jones VocelkaFranceOnyama Limba QUALIFIED
Alejandro PerinRussiaOnyama Limba NEGOTIATION
Cody SaylorsUnited KingdomIvan Magalhaes QUALIFIED
Mayumi KolmetzAustraliaAnna Fali QUALIFIED
Jones VocelkaUnited KingdomOnyama Limba QUALIFIED
Chavez BriddickUnited KingdomOnyama Limba RENEWAL
Silvio SlusarskiUnited KingdomAsiya Javayant NEGOTIATION
Salvatore StockhamItalyAsiya Javayant NEW
Deepesh ChuiRussiaOnyama Limba QUALIFIED
Frozen Columns
Name
Claire Tollner
Cody Saylors
Munro Ferencz
Morrow Ruta
Claire Tollner
Jefferson Schemmer
Leja Caldarera
Arvin Albares
Emily Whobrey
Johnson Sergi
Aika Inouye
Rodrigues Campain
Johnson Sergi
Deepesh Chui
Kadeem Flosi
Darci Poquette
Julie Stenseth
Salvatore Stockham
Faith Gillian
Murillo Malet
Antonio Caudy
Kaitlin Ostrosky
David Darakjy
Wickens Nestle
Mayumi Kolmetz
Clifford Rim
Jefferson Schemmer
Octavia Malet
Octavia Malet
Antonio Caudy
Jennifer Amigon
Tony Foller
Misaki Royster
Murillo Malet
Octavia Malet
Tony Foller
Rodrigues Campain
Ivar Paprocki
Jefferson Schemmer
Maria Marrier
Julie Stenseth
Ivar Paprocki
Juan Wieser
Emily Whobrey
Julie Stenseth
Kadeem Flosi
Antonio Caudy
Mayumi Kolmetz
Ivar Paprocki
Misaki Royster
IdCountryDate
1000Canada2026-05-07
1001Brazil2026-04-26
1002Russia2026-04-15
1003Spain2026-04-10
1004Argentina2026-04-15
1005Canada2026-04-22
1006United Kingdom2026-04-28
1007Argentina2026-04-26
1008Japan2026-05-08
1009Italy2026-05-02
1010Brazil2026-04-22
1011France2026-04-10
1012Russia2026-04-18
1013Japan2026-04-30
1014Canada2026-04-11
1015Italy2026-05-06
1016France2026-04-19
1017United Kingdom2026-05-03
1018India2026-05-07
1019Spain2026-04-15
1020India2026-04-10
1021Russia2026-05-07
1022Italy2026-05-01
1023Italy2026-05-09
1024Argentina2026-04-14
1025Spain2026-04-21
1026Canada2026-04-15
1027Spain2026-05-08
1028Spain2026-04-12
1029United Kingdom2026-04-19
1030Australia2026-05-07
1031Canada2026-04-28
1032Italy2026-04-15
1033Brazil2026-04-18
1034Canada2026-04-24
1035Canada2026-04-19
1036United Kingdom2026-04-28
1037France2026-04-19
1038Spain2026-04-30
1039Spain2026-04-16
1040Germany2026-05-01
1041France2026-04-25
1042Australia2026-04-26
1043Germany2026-04-28
1044Brazil2026-05-08
1045Australia2026-05-04
1046Canada2026-05-08
1047India2026-04-29
1048Australia2026-05-09
1049Canada2026-04-13

On-Demand Data

NameIdCountryDate
Silvio Slusarski1000Canada2026-05-02
Octavia Malet1001Australia2026-04-10
Ivar Paprocki1002Canada2026-04-14
Clifford Rim1003Argentina2026-05-05
Murillo Malet1004Spain2026-04-28
Juan Wieser1005Russia2026-04-13
Munro Ferencz1006Italy2026-04-11
Leja Caldarera1007France2026-04-30
Costa Dilliard1008Argentina2026-05-04
Mujtaba Nicka1009Germany2026-05-09
Chavez Briddick1010Brazil2026-04-21
James Butt1011Italy2026-04-13
Adams Morasca1012Russia2026-04-30
Ashley Doe1013United Kingdom2026-04-14
Murillo Malet1014Japan2026-04-28
Leon Oldroyd1015Spain2026-05-04
Costa Dilliard1016France2026-05-08
Tony Foller1017Australia2026-04-27
Greenwood Bolognia1018Argentina2026-04-13
Octavia Malet1019Canada2026-05-05
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Adams MorascaSpainIoni Bowcher PROPOSAL
Tony FollerFranceAnna Fali QUALIFIED
Antonio CaudyJapanAnna Fali NEW
Ricardo GauchoItalyXuxue Feng UNQUALIFIED
Wickens NestleJapanIvan Magalhaes NEGOTIATION
Costa DilliardAustraliaOnyama Limba NEW
Jeanfrancois VenereItalyElwin Sharvill NEW
Jefferson SchemmerCanadaOnyama Limba NEGOTIATION
David DarakjyFranceXuxue Feng UNQUALIFIED
Ivar PaprockiBrazilAmy Elsner UNQUALIFIED
Clifford RimUnited KingdomAsiya Javayant NEW
Leon OldroydGermanyAmy Elsner NEGOTIATION
Alejandro PerinJapanIoni Bowcher NEGOTIATION
Clifford RimFranceIoni Bowcher NEW
Greenwood BologniaIndiaXuxue Feng NEGOTIATION
Antonio CaudyCanadaIvan Magalhaes PROPOSAL
Adams MorascaArgentinaIvan Magalhaes NEW
Emily WhobreyArgentinaIvan Magalhaes UNQUALIFIED
Francesco ShinkoRussiaElwin Sharvill NEW
Mujtaba NickaJapanStephen Shaw PROPOSAL
Ivar PaprockiRussiaOnyama Limba UNQUALIFIED
Leon OldroydArgentinaAsiya Javayant UNQUALIFIED
Munro FerenczAustraliaIoni Bowcher NEW
Wickens NestleFranceAnna Fali NEGOTIATION
Jefferson SchemmerGermanyStephen Shaw NEGOTIATION
Juan WieserArgentinaOnyama Limba QUALIFIED
Salvatore StockhamGermanyIoni Bowcher PROPOSAL
Juan WieserCanadaStephen Shaw NEW
Izzy GarufiCanadaAmy Elsner PROPOSAL
Maisha RulapaughSpainAsiya Javayant UNQUALIFIED
Jeanfrancois VenereAustraliaElwin Sharvill PROPOSAL
Arvin AlbaresItalyAmy Elsner NEW
Maisha RulapaughFranceAsiya Javayant QUALIFIED
Arvin AlbaresIndiaBernardo Dominic PROPOSAL
David DarakjySpainAmy Elsner RENEWAL
Rodrigues CampainJapanXuxue Feng PROPOSAL
Alejandro PerinFranceIoni Bowcher UNQUALIFIED
Rodrigues CampainRussiaAnna Fali PROPOSAL
Cody SaylorsGermanyOnyama Limba NEW
Nicolas IturbideGermanyStephen Shaw 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>