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 PoquetteBrazilXuxue Feng RENEWAL
Aika InouyeBrazilBernardo Dominic RENEWAL
Chavez BriddickCanadaOnyama Limba NEW
Mayumi KolmetzUnited KingdomIvan Magalhaes UNQUALIFIED
Silvio SlusarskiGermanyBernardo Dominic NEGOTIATION
Clifford RimItalyStephen Shaw RENEWAL
Aika InouyeIndiaXuxue Feng RENEWAL
David DarakjyIndiaElwin Sharvill UNQUALIFIED
Tony FollerUnited KingdomAsiya Javayant NEW
Jennifer AmigonArgentinaAnna Fali NEGOTIATION
Mujtaba NickaCanadaOnyama Limba NEW
Cody SaylorsUnited KingdomOnyama Limba NEGOTIATION
Emily WhobreyItalyXuxue Feng RENEWAL
Sinclair WaycottJapanIvan Magalhaes PROPOSAL
Greenwood BologniaIndiaElwin Sharvill PROPOSAL
Julie StensethJapanAsiya Javayant PROPOSAL
Chavez BriddickUnited KingdomOnyama Limba UNQUALIFIED
Rodrigues CampainCanadaStephen Shaw UNQUALIFIED
Leon OldroydCanadaAmy Elsner QUALIFIED
Darci PoquetteArgentinaBernardo Dominic QUALIFIED
Emily WhobreyIndiaBernardo Dominic QUALIFIED
Leja CaldareraArgentinaAsiya Javayant NEGOTIATION
Misaki RoysterJapanIvan Magalhaes NEGOTIATION
Tony FollerSpainAmy Elsner RENEWAL
Nicolas IturbideFranceBernardo Dominic NEGOTIATION
Juan WieserUnited KingdomIoni Bowcher UNQUALIFIED
Aruna FigeroaBrazilAmy Elsner NEGOTIATION
Chavez BriddickSpainXuxue Feng NEGOTIATION
Rodrigues CampainIndiaIoni Bowcher PROPOSAL
Greenwood BologniaAustraliaIoni Bowcher RENEWAL
Smith GlickSpainOnyama Limba UNQUALIFIED
Misaki RoysterFranceIvan Magalhaes QUALIFIED
Francesco ShinkoBrazilBernardo Dominic RENEWAL
Adams MorascaRussiaAmy Elsner RENEWAL
Cody SaylorsBrazilIvan Magalhaes RENEWAL
Ricardo GauchoGermanyElwin Sharvill QUALIFIED
David DarakjyBrazilAnna Fali QUALIFIED
David DarakjyRussiaElwin Sharvill UNQUALIFIED
Jones VocelkaRussiaXuxue Feng NEGOTIATION
Clifford RimAustraliaAsiya Javayant PROPOSAL
Leon OldroydSpainOnyama Limba QUALIFIED
Jennifer AmigonItalyBernardo Dominic RENEWAL
Clifford RimIndiaOnyama Limba UNQUALIFIED
Ivar PaprockiBrazilIvan Magalhaes NEW
Misaki RoysterCanadaStephen Shaw NEGOTIATION
Faith GillianGermanyIoni Bowcher QUALIFIED
Kaitlin OstroskyIndiaIoni Bowcher NEW
Leja CaldareraAustraliaElwin Sharvill PROPOSAL
Francesco ShinkoUnited KingdomIvan Magalhaes PROPOSAL
Francesco ShinkoSpainOnyama Limba NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Kadeem FlosiIndiaOnyama Limba NEGOTIATION
Francesco ShinkoCanadaElwin Sharvill PROPOSAL
Costa DilliardIndiaStephen Shaw UNQUALIFIED
Aika InouyeIndiaOnyama Limba RENEWAL
Smith GlickCanadaIvan Magalhaes RENEWAL
Costa DilliardFranceAsiya Javayant UNQUALIFIED
Jeanfrancois VenereJapanXuxue Feng UNQUALIFIED
Aditya KuskoArgentinaIvan Magalhaes RENEWAL
Stacey MacleadRussiaElwin Sharvill RENEWAL
Mayumi KolmetzAustraliaBernardo Dominic RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000David DarakjyItaly2026-05-14Chapman, Ross E Esq NEGOTIATION38Stephen Shaw
1001Wickens NestleBrazil2026-06-04Chanay, Jeffrey A Esq NEGOTIATION9Asiya Javayant
1002Arvin AlbaresItaly2026-05-30Commercial Press NEGOTIATION46Onyama Limba
1003Mayumi KolmetzItaly2026-05-21Buckley Miller Wright RENEWAL57Bernardo Dominic
1004Chavez BriddickUnited Kingdom2026-05-16Buckley Miller Wright QUALIFIED83Asiya Javayant
1005Wickens NestleFrance2026-05-23Rangoni Of Florence QUALIFIED3Amy Elsner
1006Faith GillianCanada2026-05-12Morlong Associates PROPOSAL45Onyama Limba
1007Kadeem FlosiSpain2026-05-15Morlong Associates NEGOTIATION88Anna Fali
1008Ricardo GauchoAustralia2026-06-04Commercial Press NEGOTIATION42Stephen Shaw
1009Nicolas IturbideSpain2026-05-11Feiner Bros RENEWAL12Ivan Magalhaes
1010Claire TollnerRussia2026-05-25Morlong Associates NEW86Onyama Limba
1011Izzy GarufiIndia2026-06-04Printing Dimensions UNQUALIFIED95Asiya Javayant
1012Cody SaylorsSpain2026-05-24Morlong Associates PROPOSAL31Elwin Sharvill
1013Misaki RoysterIndia2026-05-24King, Christopher A Esq PROPOSAL86Ivan Magalhaes
1014James ButtFrance2026-06-03Chanay, Jeffrey A Esq QUALIFIED56Anna Fali
1015Ricardo GauchoItaly2026-05-31Feltz Printing Service NEGOTIATION11Elwin Sharvill
1016Ivar PaprockiIndia2026-05-11Chanay, Jeffrey A Esq RENEWAL18Amy Elsner
1017Aruna FigeroaItaly2026-05-31Rousseaux, Michael Esq RENEWAL57Ivan Magalhaes
1018Octavia MaletItaly2026-05-18King, Christopher A Esq RENEWAL34Amy Elsner
1019Jefferson SchemmerGermany2026-05-21Buckley Miller Wright RENEWAL42Xuxue Feng
1020Morrow RutaFrance2026-05-23Printing Dimensions UNQUALIFIED73Elwin Sharvill
1021Silvio SlusarskiSpain2026-05-27Chemel, James L Cpa NEGOTIATION24Onyama Limba
1022Ivar PaprockiArgentina2026-05-11Chapman, Ross E Esq NEGOTIATION17Elwin Sharvill
1023Mujtaba NickaArgentina2026-05-29Printing Dimensions QUALIFIED80Ivan Magalhaes
1024Izzy GarufiIndia2026-05-20Dorl, James J Esq NEGOTIATION67Onyama Limba
1025Silvio SlusarskiRussia2026-05-14Feiner Bros PROPOSAL43Asiya Javayant
1026Smith GlickUnited Kingdom2026-06-07King, Christopher A Esq RENEWAL52Anna Fali
1027Kadeem FlosiSpain2026-05-18Chemel, James L Cpa NEGOTIATION45Anna Fali
1028Antonio CaudyAustralia2026-05-31Chemel, James L Cpa RENEWAL60Ivan Magalhaes
1029Jefferson SchemmerAustralia2026-05-10Feltz Printing Service NEW19Onyama Limba
1030Misaki RoysterIndia2026-05-16Rangoni Of Florence NEGOTIATION41Ivan Magalhaes
1031Ivar PaprockiItaly2026-05-25Feltz Printing Service NEGOTIATION40Amy Elsner
1032Smith GlickGermany2026-05-09Feltz Printing Service QUALIFIED52Anna Fali
1033Smith GlickIndia2026-06-01Feiner Bros PROPOSAL89Anna Fali
1034Misaki RoysterItaly2026-05-11Printing Dimensions QUALIFIED37Elwin Sharvill
1035Silvio SlusarskiIndia2026-05-26Chanay, Jeffrey A Esq NEW87Xuxue Feng
1036Jeanfrancois VenereRussia2026-05-31Truhlar And Truhlar Attys QUALIFIED52Bernardo Dominic
1037Jeanfrancois VenereUnited Kingdom2026-06-05Chapman, Ross E Esq NEW77Onyama Limba
1038Cody SaylorsIndia2026-05-24Rangoni Of Florence PROPOSAL64Ivan Magalhaes
1039Juan WieserUnited Kingdom2026-05-13Benton, John B Jr RENEWAL75Onyama Limba
1040Emily WhobreyIndia2026-05-26Chemel, James L Cpa NEGOTIATION68Onyama Limba
1041Misaki RoysterBrazil2026-05-13Commercial Press PROPOSAL84Amy Elsner
1042Ivar PaprockiBrazil2026-06-04Rangoni Of Florence QUALIFIED17Bernardo Dominic
1043Julie StensethBrazil2026-05-23Morlong Associates NEGOTIATION4Stephen Shaw
1044Francesco ShinkoFrance2026-05-24Chapman, Ross E Esq UNQUALIFIED6Bernardo Dominic
1045Clifford RimGermany2026-05-10Commercial Press QUALIFIED3Bernardo Dominic
1046James ButtSpain2026-05-12Feltz Printing Service QUALIFIED48Xuxue Feng
1047Cody SaylorsUnited Kingdom2026-05-12Chanay, Jeffrey A Esq RENEWAL12Elwin Sharvill
1048Jeanfrancois VenereJapan2026-05-17Printing Dimensions RENEWAL6Asiya Javayant
1049Faith GillianItaly2026-06-07Rangoni Of Florence PROPOSAL83Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Ricardo GauchoAustraliaAmy Elsner PROPOSAL
Izzy GarufiGermanyOnyama Limba NEW
Morrow RutaIndiaStephen Shaw PROPOSAL
Leon OldroydRussiaAmy Elsner NEGOTIATION
Arvin AlbaresGermanyAmy Elsner RENEWAL
Aditya KuskoUnited KingdomXuxue Feng QUALIFIED
Jennifer AmigonSpainElwin Sharvill QUALIFIED
Clifford RimJapanOnyama Limba QUALIFIED
Stacey MacleadGermanyAsiya Javayant RENEWAL
Aika InouyeJapanXuxue Feng RENEWAL
Munro FerenczArgentinaIvan Magalhaes QUALIFIED
Mayumi KolmetzArgentinaAmy Elsner NEW
Salvatore StockhamSpainIoni Bowcher RENEWAL
Isabel BowleyAustraliaElwin Sharvill PROPOSAL
Greenwood BologniaCanadaOnyama Limba NEGOTIATION
Munro FerenczUnited KingdomIvan Magalhaes UNQUALIFIED
Octavia MaletJapanStephen Shaw PROPOSAL
Rodrigues CampainJapanAnna Fali UNQUALIFIED
Leon OldroydSpainOnyama Limba RENEWAL
Aika InouyeJapanAsiya Javayant RENEWAL
Mujtaba NickaJapanElwin Sharvill QUALIFIED
Salvatore StockhamJapanElwin Sharvill NEW
Deepesh ChuiCanadaOnyama Limba UNQUALIFIED
Kaitlin OstroskySpainIvan Magalhaes NEW
David DarakjyRussiaIvan Magalhaes NEGOTIATION
Greenwood BologniaGermanyAsiya Javayant UNQUALIFIED
Claire TollnerIndiaStephen Shaw RENEWAL
Emily WhobreyItalyBernardo Dominic UNQUALIFIED
Maria MarrierRussiaAsiya Javayant NEW
Greenwood BologniaCanadaIvan Magalhaes QUALIFIED
Aika InouyeSpainStephen Shaw QUALIFIED
Arvin AlbaresIndiaAsiya Javayant NEGOTIATION
Mujtaba NickaAustraliaAmy Elsner NEW
Maisha RulapaughArgentinaAsiya Javayant RENEWAL
Mayumi KolmetzRussiaBernardo Dominic UNQUALIFIED
Jennifer AmigonRussiaElwin Sharvill QUALIFIED
Johnson SergiJapanAmy Elsner NEW
David DarakjyJapanAnna Fali RENEWAL
Alejandro PerinItalyXuxue Feng QUALIFIED
Ivar PaprockiGermanyElwin Sharvill NEGOTIATION
Adams MorascaGermanyBernardo Dominic NEW
Alejandro PerinArgentinaXuxue Feng QUALIFIED
James ButtJapanAnna Fali NEW
Izzy GarufiBrazilAmy Elsner NEGOTIATION
Jeanfrancois VenereJapanIoni Bowcher NEGOTIATION
Ivar PaprockiCanadaBernardo Dominic NEGOTIATION
Antonio CaudyArgentinaElwin Sharvill RENEWAL
Kadeem FlosiGermanyAmy Elsner RENEWAL
Smith GlickJapanAsiya Javayant NEGOTIATION
Francesco ShinkoIndiaStephen Shaw UNQUALIFIED
Frozen Columns
Name
Sinclair Waycott
Claire Tollner
Deepesh Chui
Jennifer Amigon
Francesco Shinko
James Butt
Costa Dilliard
Cody Saylors
James Butt
Kaitlin Ostrosky
Tony Foller
Johnson Sergi
Faith Gillian
Costa Dilliard
Antonio Caudy
Jeanfrancois Venere
Jennifer Amigon
Chavez Briddick
Wickens Nestle
Maria Marrier
Aditya Kusko
Smith Glick
Kadeem Flosi
Aika Inouye
Alejandro Perin
Arvin Albares
Rodrigues Campain
Octavia Malet
Octavia Malet
Jones Vocelka
Nicolas Iturbide
Aditya Kusko
Misaki Royster
Jeanfrancois Venere
Isabel Bowley
Arvin Albares
Juan Wieser
Rodrigues Campain
Juan Wieser
Nicolas Iturbide
Tony Foller
Jeanfrancois Venere
Greenwood Bolognia
Antonio Caudy
Clifford Rim
Jennifer Amigon
Aika Inouye
Stacey Maclead
Costa Dilliard
James Butt
IdCountryDate
1000Brazil2026-05-31
1001Australia2026-05-24
1002France2026-06-02
1003Germany2026-06-02
1004India2026-05-23
1005Japan2026-06-06
1006Argentina2026-05-28
1007Brazil2026-05-10
1008India2026-05-25
1009Canada2026-05-15
1010Canada2026-05-19
1011Japan2026-06-02
1012India2026-05-23
1013Russia2026-06-04
1014Italy2026-05-16
1015Brazil2026-05-27
1016Brazil2026-05-12
1017Australia2026-05-11
1018Italy2026-05-24
1019Australia2026-05-24
1020Argentina2026-05-15
1021Brazil2026-05-09
1022Argentina2026-06-03
1023Spain2026-05-20
1024Spain2026-05-16
1025Japan2026-05-28
1026Argentina2026-05-15
1027Germany2026-05-15
1028Spain2026-05-31
1029France2026-05-31
1030Spain2026-05-09
1031Japan2026-05-10
1032Brazil2026-05-23
1033Australia2026-05-17
1034Germany2026-05-31
1035Australia2026-05-25
1036Russia2026-05-09
1037Japan2026-05-22
1038Spain2026-05-19
1039Spain2026-05-27
1040Brazil2026-05-31
1041India2026-05-12
1042Spain2026-05-28
1043Japan2026-05-20
1044France2026-05-09
1045United Kingdom2026-05-22
1046India2026-05-18
1047Australia2026-05-17
1048Germany2026-06-02
1049Italy2026-05-21

On-Demand Data

NameIdCountryDate
Arvin Albares1000Russia2026-05-26
Kadeem Flosi1001France2026-05-10
Greenwood Bolognia1002Australia2026-06-03
Octavia Malet1003India2026-05-26
Clifford Rim1004Japan2026-05-23
Costa Dilliard1005Brazil2026-05-21
Jefferson Schemmer1006Russia2026-05-21
Cody Saylors1007United Kingdom2026-05-28
Aditya Kusko1008Brazil2026-06-04
Aruna Figeroa1009United Kingdom2026-06-06
Isabel Bowley1010Japan2026-05-22
David Darakjy1011Italy2026-05-17
Aruna Figeroa1012India2026-06-03
Nicolas Iturbide1013Argentina2026-05-16
Jennifer Amigon1014Australia2026-05-26
Jennifer Amigon1015Italy2026-06-03
Mayumi Kolmetz1016India2026-05-20
Tony Foller1017Australia2026-05-11
Silvio Slusarski1018United Kingdom2026-05-12
Nicolas Iturbide1019Japan2026-06-07
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Kadeem FlosiFranceIoni Bowcher NEW
Salvatore StockhamGermanyElwin Sharvill QUALIFIED
Ashley DoeIndiaAmy Elsner UNQUALIFIED
Darci PoquetteIndiaAnna Fali NEW
Claire TollnerItalyIvan Magalhaes PROPOSAL
Faith GillianItalyIoni Bowcher NEGOTIATION
Mujtaba NickaRussiaOnyama Limba PROPOSAL
Jefferson SchemmerGermanyIvan Magalhaes PROPOSAL
Francesco ShinkoBrazilXuxue Feng UNQUALIFIED
Johnson SergiIndiaAsiya Javayant NEGOTIATION
Kaitlin OstroskyGermanyXuxue Feng NEGOTIATION
Sinclair WaycottBrazilAnna Fali UNQUALIFIED
Clifford RimBrazilElwin Sharvill UNQUALIFIED
Mujtaba NickaAustraliaElwin Sharvill UNQUALIFIED
Johnson SergiFranceXuxue Feng RENEWAL
Misaki RoysterCanadaAnna Fali NEGOTIATION
Greenwood BologniaUnited KingdomOnyama Limba QUALIFIED
Izzy GarufiAustraliaOnyama Limba NEW
Leon OldroydRussiaOnyama Limba QUALIFIED
Octavia MaletIndiaIoni Bowcher UNQUALIFIED
Maria MarrierItalyStephen Shaw PROPOSAL
Maria MarrierAustraliaBernardo Dominic NEGOTIATION
Stacey MacleadSpainAsiya Javayant NEW
Mujtaba NickaRussiaIoni Bowcher RENEWAL
David DarakjyRussiaStephen Shaw UNQUALIFIED
Aditya KuskoGermanyElwin Sharvill QUALIFIED
Jennifer AmigonRussiaAnna Fali PROPOSAL
Salvatore StockhamArgentinaAsiya Javayant RENEWAL
Ashley DoeItalyIvan Magalhaes NEGOTIATION
Maria MarrierIndiaBernardo Dominic UNQUALIFIED
Faith GillianGermanyAnna Fali NEGOTIATION
Claire TollnerJapanAmy Elsner QUALIFIED
Aditya KuskoIndiaXuxue Feng NEGOTIATION
Nicolas IturbideUnited KingdomElwin Sharvill NEW
Izzy GarufiUnited KingdomXuxue Feng QUALIFIED
Antonio CaudyRussiaXuxue Feng NEGOTIATION
Ashley DoeSpainIoni Bowcher NEGOTIATION
Adams MorascaArgentinaXuxue Feng QUALIFIED
Jeanfrancois VenereJapanBernardo Dominic NEW
Darci PoquetteBrazilIoni 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>