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 SlusarskiRussiaXuxue Feng QUALIFIED
Kaitlin OstroskyItalyBernardo Dominic NEGOTIATION
Misaki RoysterBrazilAnna Fali UNQUALIFIED
Kaitlin OstroskyRussiaIvan Magalhaes RENEWAL
James ButtCanadaBernardo Dominic NEGOTIATION
Mayumi KolmetzCanadaIoni Bowcher NEW
Stacey MacleadItalyStephen Shaw NEGOTIATION
Ivar PaprockiBrazilAmy Elsner NEGOTIATION
David DarakjyGermanyIoni Bowcher RENEWAL
Aika InouyeAustraliaIoni Bowcher RENEWAL
Adams MorascaJapanAsiya Javayant PROPOSAL
Mujtaba NickaIndiaIoni Bowcher PROPOSAL
Chavez BriddickArgentinaXuxue Feng UNQUALIFIED
Mayumi KolmetzJapanOnyama Limba QUALIFIED
Tony FollerFranceXuxue Feng NEW
Nicolas IturbideAustraliaIoni Bowcher QUALIFIED
David DarakjyGermanyBernardo Dominic UNQUALIFIED
Morrow RutaAustraliaOnyama Limba RENEWAL
Misaki RoysterGermanyAnna Fali PROPOSAL
Ricardo GauchoAustraliaAnna Fali NEW
Deepesh ChuiItalyAnna Fali QUALIFIED
Silvio SlusarskiGermanyBernardo Dominic UNQUALIFIED
Cody SaylorsFranceBernardo Dominic RENEWAL
Arvin AlbaresGermanyOnyama Limba QUALIFIED
Aditya KuskoAustraliaAsiya Javayant NEW
Tony FollerAustraliaAmy Elsner NEW
Deepesh ChuiUnited KingdomAnna Fali PROPOSAL
Emily WhobreyArgentinaStephen Shaw NEW
Greenwood BologniaItalyIvan Magalhaes RENEWAL
Smith GlickBrazilElwin Sharvill PROPOSAL
Tony FollerFranceOnyama Limba NEW
Francesco ShinkoAustraliaAmy Elsner QUALIFIED
James ButtArgentinaXuxue Feng NEGOTIATION
David DarakjyItalyAmy Elsner UNQUALIFIED
Kaitlin OstroskyUnited KingdomElwin Sharvill NEGOTIATION
Mayumi KolmetzJapanStephen Shaw NEGOTIATION
Nicolas IturbideItalyElwin Sharvill NEGOTIATION
Mayumi KolmetzItalyIoni Bowcher NEW
Isabel BowleyRussiaOnyama Limba RENEWAL
Adams MorascaArgentinaStephen Shaw NEW
Ricardo GauchoJapanElwin Sharvill NEW
Wickens NestleBrazilIvan Magalhaes QUALIFIED
Isabel BowleyJapanIvan Magalhaes NEW
Misaki RoysterSpainStephen Shaw UNQUALIFIED
Murillo MaletSpainIoni Bowcher PROPOSAL
Emily WhobreyRussiaStephen Shaw QUALIFIED
Darci PoquetteAustraliaAnna Fali NEGOTIATION
Stacey MacleadUnited KingdomIoni Bowcher RENEWAL
Greenwood BologniaSpainOnyama Limba NEGOTIATION
Mujtaba NickaAustraliaAsiya Javayant NEW
Horizontal
NameCountryRepresentativeStatus
Faith GillianCanadaXuxue Feng PROPOSAL
Jefferson SchemmerItalyElwin Sharvill NEW
Leon OldroydIndiaElwin Sharvill NEW
Munro FerenczJapanIvan Magalhaes UNQUALIFIED
Faith GillianBrazilIvan Magalhaes UNQUALIFIED
Octavia MaletAustraliaBernardo Dominic RENEWAL
Tony FollerArgentinaElwin Sharvill UNQUALIFIED
Leon OldroydCanadaAmy Elsner NEGOTIATION
Leja CaldareraIndiaIvan Magalhaes NEGOTIATION
Claire TollnerCanadaAsiya Javayant QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Faith GillianBrazil2026-06-07Buckley Miller Wright NEGOTIATION1Anna Fali
1001Ivar PaprockiGermany2026-06-02Dorl, James J Esq QUALIFIED32Elwin Sharvill
1002Greenwood BologniaFrance2026-05-18Printing Dimensions PROPOSAL50Ivan Magalhaes
1003Chavez BriddickCanada2026-05-10Printing Dimensions RENEWAL11Anna Fali
1004Morrow RutaSpain2026-06-04Chapman, Ross E Esq QUALIFIED79Bernardo Dominic
1005Isabel BowleyJapan2026-06-01Chanay, Jeffrey A Esq RENEWAL23Ioni Bowcher
1006Claire TollnerIndia2026-06-04Buckley Miller Wright NEW71Amy Elsner
1007Silvio SlusarskiSpain2026-06-01Feltz Printing Service NEGOTIATION50Bernardo Dominic
1008Morrow RutaRussia2026-05-31Commercial Press PROPOSAL80Bernardo Dominic
1009Darci PoquetteItaly2026-05-12Truhlar And Truhlar Attys NEW99Ivan Magalhaes
1010Deepesh ChuiSpain2026-05-18Commercial Press UNQUALIFIED77Onyama Limba
1011Ricardo GauchoCanada2026-05-10Dorl, James J Esq NEGOTIATION92Ioni Bowcher
1012Wickens NestleItaly2026-05-14Rangoni Of Florence NEGOTIATION3Onyama Limba
1013Maisha RulapaughGermany2026-05-10Rangoni Of Florence PROPOSAL75Stephen Shaw
1014Ivar PaprockiIndia2026-05-23Benton, John B Jr NEGOTIATION21Ivan Magalhaes
1015Munro FerenczItaly2026-05-31Buckley Miller Wright QUALIFIED82Stephen Shaw
1016Antonio CaudyGermany2026-06-05Commercial Press UNQUALIFIED23Asiya Javayant
1017James ButtItaly2026-06-06Commercial Press RENEWAL10Bernardo Dominic
1018Mayumi KolmetzRussia2026-05-12Chanay, Jeffrey A Esq PROPOSAL33Amy Elsner
1019Arvin AlbaresAustralia2026-05-28Truhlar And Truhlar Attys PROPOSAL98Asiya Javayant
1020Nicolas IturbideSpain2026-05-18Benton, John B Jr UNQUALIFIED26Asiya Javayant
1021Cody SaylorsGermany2026-05-25Truhlar And Truhlar Attys QUALIFIED89Xuxue Feng
1022Kadeem FlosiArgentina2026-05-12Rousseaux, Michael Esq PROPOSAL36Stephen Shaw
1023Tony FollerFrance2026-05-15Chanay, Jeffrey A Esq NEW87Xuxue Feng
1024Jeanfrancois VenereArgentina2026-05-14Benton, John B Jr PROPOSAL4Amy Elsner
1025Johnson SergiRussia2026-05-21Chapman, Ross E Esq PROPOSAL38Stephen Shaw
1026Faith GillianArgentina2026-06-03Benton, John B Jr NEW35Anna Fali
1027Nicolas IturbideCanada2026-05-13Printing Dimensions UNQUALIFIED62Ioni Bowcher
1028Mujtaba NickaSpain2026-05-28Feiner Bros NEGOTIATION22Asiya Javayant
1029Nicolas IturbideUnited Kingdom2026-05-18Dorl, James J Esq UNQUALIFIED73Ivan Magalhaes
1030Isabel BowleyCanada2026-05-31Commercial Press RENEWAL86Anna Fali
1031Jefferson SchemmerJapan2026-05-16Morlong Associates PROPOSAL37Ioni Bowcher
1032Emily WhobreyArgentina2026-06-07Rangoni Of Florence PROPOSAL14Amy Elsner
1033Izzy GarufiBrazil2026-05-12King, Christopher A Esq NEW80Stephen Shaw
1034Arvin AlbaresAustralia2026-05-26Chanay, Jeffrey A Esq NEGOTIATION17Asiya Javayant
1035Faith GillianSpain2026-05-25Buckley Miller Wright NEGOTIATION91Stephen Shaw
1036Murillo MaletFrance2026-05-10Rangoni Of Florence NEGOTIATION83Asiya Javayant
1037Salvatore StockhamBrazil2026-05-22Dorl, James J Esq QUALIFIED28Amy Elsner
1038James ButtRussia2026-05-30Chanay, Jeffrey A Esq PROPOSAL42Onyama Limba
1039Chavez BriddickFrance2026-05-20Benton, John B Jr UNQUALIFIED57Anna Fali
1040Jefferson SchemmerArgentina2026-05-22Buckley Miller Wright UNQUALIFIED2Stephen Shaw
1041Greenwood BologniaFrance2026-05-22Feiner Bros QUALIFIED65Elwin Sharvill
1042Sinclair WaycottCanada2026-05-14Dorl, James J Esq RENEWAL67Elwin Sharvill
1043Ricardo GauchoUnited Kingdom2026-05-15Truhlar And Truhlar Attys UNQUALIFIED82Ioni Bowcher
1044Jennifer AmigonCanada2026-05-20Benton, John B Jr UNQUALIFIED31Ioni Bowcher
1045David DarakjyJapan2026-05-24Rangoni Of Florence QUALIFIED20Amy Elsner
1046Deepesh ChuiRussia2026-06-07Printing Dimensions NEW45Asiya Javayant
1047Darci PoquetteArgentina2026-06-01Chanay, Jeffrey A Esq NEW64Bernardo Dominic
1048Ricardo GauchoArgentina2026-05-25Truhlar And Truhlar Attys QUALIFIED39Xuxue Feng
1049Octavia MaletUnited Kingdom2026-05-29Printing Dimensions RENEWAL10Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Izzy GarufiArgentinaOnyama Limba QUALIFIED
Octavia MaletCanadaIoni Bowcher NEGOTIATION
Silvio SlusarskiArgentinaAnna Fali QUALIFIED
Clifford RimAustraliaAsiya Javayant NEGOTIATION
David DarakjyAustraliaAmy Elsner NEGOTIATION
Smith GlickCanadaIvan Magalhaes PROPOSAL
Arvin AlbaresAustraliaIoni Bowcher UNQUALIFIED
Francesco ShinkoFranceAnna Fali PROPOSAL
Jeanfrancois VenereAustraliaBernardo Dominic RENEWAL
Ashley DoeUnited KingdomElwin Sharvill UNQUALIFIED
Aruna FigeroaAustraliaAsiya Javayant NEGOTIATION
Munro FerenczCanadaIoni Bowcher PROPOSAL
Aditya KuskoBrazilOnyama Limba RENEWAL
Claire TollnerGermanyBernardo Dominic NEW
Arvin AlbaresGermanyAnna Fali UNQUALIFIED
Jennifer AmigonAustraliaAsiya Javayant PROPOSAL
Tony FollerJapanElwin Sharvill NEW
Kadeem FlosiSpainBernardo Dominic NEGOTIATION
Johnson SergiArgentinaElwin Sharvill PROPOSAL
Julie StensethAustraliaBernardo Dominic NEGOTIATION
Sinclair WaycottItalyXuxue Feng QUALIFIED
Darci PoquetteRussiaXuxue Feng NEW
David DarakjyGermanyElwin Sharvill PROPOSAL
Johnson SergiItalyAmy Elsner RENEWAL
Aruna FigeroaSpainOnyama Limba NEW
Darci PoquetteUnited KingdomIvan Magalhaes UNQUALIFIED
Maria MarrierBrazilIvan Magalhaes PROPOSAL
Claire TollnerUnited KingdomIoni Bowcher QUALIFIED
Sinclair WaycottFranceAnna Fali QUALIFIED
Emily WhobreyCanadaIoni Bowcher NEW
Darci PoquetteAustraliaAmy Elsner QUALIFIED
Jones VocelkaAustraliaBernardo Dominic RENEWAL
Aika InouyeArgentinaOnyama Limba RENEWAL
Murillo MaletRussiaXuxue Feng RENEWAL
James ButtSpainXuxue Feng NEW
Morrow RutaAustraliaElwin Sharvill PROPOSAL
Silvio SlusarskiArgentinaAnna Fali PROPOSAL
Aruna FigeroaUnited KingdomStephen Shaw UNQUALIFIED
Jones VocelkaCanadaOnyama Limba UNQUALIFIED
Aruna FigeroaBrazilAmy Elsner RENEWAL
Darci PoquetteGermanyBernardo Dominic RENEWAL
Mujtaba NickaArgentinaAmy Elsner NEGOTIATION
Leja CaldareraItalyAsiya Javayant UNQUALIFIED
Misaki RoysterSpainAnna Fali PROPOSAL
Mayumi KolmetzBrazilBernardo Dominic RENEWAL
Ashley DoeCanadaAnna Fali QUALIFIED
Sinclair WaycottBrazilIoni Bowcher NEGOTIATION
Faith GillianJapanOnyama Limba NEW
Darci PoquetteItalyOnyama Limba QUALIFIED
Chavez BriddickArgentinaIoni Bowcher QUALIFIED
Frozen Columns
Name
Sinclair Waycott
Maria Marrier
Alejandro Perin
Mujtaba Nicka
Deepesh Chui
Jeanfrancois Venere
Aika Inouye
Deepesh Chui
Aditya Kusko
Ricardo Gaucho
Munro Ferencz
Mayumi Kolmetz
Aditya Kusko
Francesco Shinko
Faith Gillian
Tony Foller
Costa Dilliard
Jones Vocelka
Francesco Shinko
Alejandro Perin
Octavia Malet
David Darakjy
Nicolas Iturbide
Isabel Bowley
Johnson Sergi
James Butt
Stacey Maclead
Francesco Shinko
Clifford Rim
Faith Gillian
Claire Tollner
Ivar Paprocki
Silvio Slusarski
Alejandro Perin
Octavia Malet
Maria Marrier
Ashley Doe
David Darakjy
Morrow Ruta
Antonio Caudy
Greenwood Bolognia
Aruna Figeroa
Costa Dilliard
David Darakjy
Leon Oldroyd
Morrow Ruta
Jones Vocelka
Leon Oldroyd
Cody Saylors
Emily Whobrey
IdCountryDate
1000Germany2026-05-24
1001Italy2026-05-29
1002Germany2026-05-23
1003India2026-05-24
1004United Kingdom2026-05-12
1005Australia2026-05-15
1006Italy2026-05-24
1007Italy2026-05-19
1008India2026-05-30
1009France2026-05-11
1010United Kingdom2026-05-29
1011Australia2026-05-09
1012Germany2026-05-17
1013Argentina2026-05-30
1014United Kingdom2026-05-25
1015Japan2026-05-26
1016Australia2026-05-20
1017Canada2026-06-06
1018United Kingdom2026-05-30
1019Russia2026-05-27
1020Russia2026-05-14
1021Russia2026-05-28
1022Germany2026-05-09
1023Canada2026-05-11
1024India2026-06-03
1025France2026-05-28
1026India2026-05-27
1027France2026-05-23
1028United Kingdom2026-05-24
1029Brazil2026-05-21
1030India2026-05-26
1031Australia2026-05-22
1032United Kingdom2026-05-31
1033Canada2026-05-12
1034Australia2026-05-20
1035Brazil2026-05-23
1036Italy2026-05-12
1037Argentina2026-05-27
1038Russia2026-05-09
1039Russia2026-06-04
1040Australia2026-05-31
1041France2026-06-02
1042India2026-05-31
1043Italy2026-05-22
1044United Kingdom2026-05-23
1045Brazil2026-06-02
1046United Kingdom2026-05-26
1047Russia2026-05-26
1048Brazil2026-05-25
1049India2026-05-17

On-Demand Data

NameIdCountryDate
Sinclair Waycott1000Italy2026-06-06
Adams Morasca1001Russia2026-05-22
Mayumi Kolmetz1002Argentina2026-06-01
Jefferson Schemmer1003Germany2026-05-29
Silvio Slusarski1004France2026-05-27
Mayumi Kolmetz1005Brazil2026-05-09
Sinclair Waycott1006Australia2026-06-01
Claire Tollner1007Spain2026-05-20
Aditya Kusko1008Argentina2026-06-03
Wickens Nestle1009Germany2026-06-04
Deepesh Chui1010Spain2026-06-05
James Butt1011Argentina2026-06-05
Faith Gillian1012Australia2026-05-12
Jennifer Amigon1013Spain2026-06-06
Adams Morasca1014Spain2026-06-04
Kaitlin Ostrosky1015Brazil2026-05-15
Morrow Ruta1016Canada2026-06-03
Maisha Rulapaugh1017Spain2026-05-23
Rodrigues Campain1018Spain2026-05-16
Izzy Garufi1019Spain2026-05-28
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Stacey MacleadUnited KingdomAnna Fali QUALIFIED
Munro FerenczIndiaAsiya Javayant QUALIFIED
Smith GlickAustraliaStephen Shaw UNQUALIFIED
Deepesh ChuiJapanAnna Fali PROPOSAL
Izzy GarufiGermanyIoni Bowcher QUALIFIED
Chavez BriddickIndiaAsiya Javayant UNQUALIFIED
Octavia MaletGermanyIoni Bowcher NEGOTIATION
Leon OldroydSpainElwin Sharvill PROPOSAL
Costa DilliardSpainIoni Bowcher QUALIFIED
Morrow RutaFranceIoni Bowcher QUALIFIED
Mayumi KolmetzGermanyStephen Shaw UNQUALIFIED
Adams MorascaItalyAmy Elsner NEW
Aruna FigeroaUnited KingdomStephen Shaw PROPOSAL
Rodrigues CampainFranceAmy Elsner PROPOSAL
Ivar PaprockiJapanElwin Sharvill NEGOTIATION
Antonio CaudyRussiaAmy Elsner RENEWAL
Salvatore StockhamBrazilElwin Sharvill NEW
Jeanfrancois VenereRussiaBernardo Dominic NEW
Munro FerenczAustraliaAnna Fali PROPOSAL
Aika InouyeBrazilAnna Fali NEGOTIATION
Jefferson SchemmerGermanyXuxue Feng UNQUALIFIED
Nicolas IturbideBrazilBernardo Dominic PROPOSAL
Misaki RoysterUnited KingdomIoni Bowcher NEGOTIATION
Alejandro PerinSpainStephen Shaw QUALIFIED
Deepesh ChuiUnited KingdomXuxue Feng NEGOTIATION
Sinclair WaycottBrazilOnyama Limba RENEWAL
Leon OldroydArgentinaAsiya Javayant QUALIFIED
Stacey MacleadIndiaAsiya Javayant UNQUALIFIED
Munro FerenczRussiaStephen Shaw QUALIFIED
David DarakjyArgentinaXuxue Feng PROPOSAL
Salvatore StockhamUnited KingdomIvan Magalhaes NEW
Leon OldroydGermanyBernardo Dominic QUALIFIED
Aika InouyeRussiaIoni Bowcher QUALIFIED
Faith GillianBrazilOnyama Limba QUALIFIED
Salvatore StockhamUnited KingdomStephen Shaw NEGOTIATION
Deepesh ChuiJapanIoni Bowcher NEW
Kaitlin OstroskyBrazilBernardo Dominic QUALIFIED
Silvio SlusarskiCanadaAnna Fali RENEWAL
Leja CaldareraJapanIoni Bowcher NEGOTIATION
Jefferson SchemmerJapanAnna Fali RENEWAL

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