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
Morrow RutaSpainBernardo Dominic UNQUALIFIED
Francesco ShinkoArgentinaAsiya Javayant RENEWAL
Kadeem FlosiFranceBernardo Dominic RENEWAL
Maria MarrierIndiaAsiya Javayant NEGOTIATION
Leon OldroydItalyIvan Magalhaes UNQUALIFIED
Leon OldroydGermanyIvan Magalhaes QUALIFIED
Jeanfrancois VenereArgentinaElwin Sharvill NEW
Jefferson SchemmerBrazilIoni Bowcher UNQUALIFIED
Jones VocelkaCanadaIvan Magalhaes UNQUALIFIED
Jefferson SchemmerItalyAmy Elsner QUALIFIED
Misaki RoysterCanadaAsiya Javayant PROPOSAL
Costa DilliardRussiaIoni Bowcher NEW
Leon OldroydUnited KingdomAmy Elsner RENEWAL
Deepesh ChuiIndiaXuxue Feng RENEWAL
Izzy GarufiGermanyAnna Fali UNQUALIFIED
Adams MorascaRussiaElwin Sharvill QUALIFIED
Julie StensethUnited KingdomAsiya Javayant PROPOSAL
Sinclair WaycottItalyElwin Sharvill NEW
Clifford RimIndiaAnna Fali UNQUALIFIED
Kaitlin OstroskyGermanyOnyama Limba PROPOSAL
Mayumi KolmetzRussiaAnna Fali QUALIFIED
Aika InouyeFranceAnna Fali NEGOTIATION
Greenwood BologniaUnited KingdomOnyama Limba NEW
Ivar PaprockiSpainAsiya Javayant PROPOSAL
Misaki RoysterIndiaIvan Magalhaes UNQUALIFIED
Misaki RoysterArgentinaIvan Magalhaes NEW
James ButtSpainIoni Bowcher QUALIFIED
Isabel BowleyUnited KingdomAmy Elsner QUALIFIED
Francesco ShinkoItalyElwin Sharvill PROPOSAL
Francesco ShinkoUnited KingdomAsiya Javayant UNQUALIFIED
Alejandro PerinAustraliaOnyama Limba NEW
Sinclair WaycottSpainXuxue Feng UNQUALIFIED
Cody SaylorsAustraliaIvan Magalhaes PROPOSAL
Ricardo GauchoUnited KingdomAmy Elsner RENEWAL
Emily WhobreyArgentinaBernardo Dominic QUALIFIED
Aditya KuskoUnited KingdomAsiya Javayant NEGOTIATION
Jefferson SchemmerIndiaBernardo Dominic PROPOSAL
Darci PoquetteFranceAsiya Javayant NEGOTIATION
Smith GlickUnited KingdomAsiya Javayant UNQUALIFIED
Claire TollnerRussiaBernardo Dominic NEW
Deepesh ChuiAustraliaBernardo Dominic RENEWAL
Francesco ShinkoAustraliaElwin Sharvill QUALIFIED
David DarakjyArgentinaXuxue Feng QUALIFIED
Faith GillianCanadaBernardo Dominic QUALIFIED
Costa DilliardRussiaStephen Shaw PROPOSAL
Isabel BowleyItalyAmy Elsner UNQUALIFIED
Ivar PaprockiUnited KingdomIvan Magalhaes PROPOSAL
Maria MarrierGermanyIvan Magalhaes NEW
Ivar PaprockiArgentinaElwin Sharvill RENEWAL
Aruna FigeroaSpainBernardo Dominic QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Murillo MaletRussiaIvan Magalhaes PROPOSAL
Sinclair WaycottGermanyStephen Shaw UNQUALIFIED
Murillo MaletCanadaIoni Bowcher QUALIFIED
Izzy GarufiUnited KingdomAsiya Javayant RENEWAL
Munro FerenczUnited KingdomOnyama Limba NEW
Aditya KuskoSpainOnyama Limba UNQUALIFIED
Emily WhobreyRussiaBernardo Dominic RENEWAL
Clifford RimBrazilStephen Shaw RENEWAL
Kadeem FlosiItalyAmy Elsner PROPOSAL
Ricardo GauchoIndiaIvan Magalhaes QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Rodrigues CampainItaly2025-10-03Commercial Press UNQUALIFIED17Bernardo Dominic
1001Nicolas IturbideGermany2025-09-14Rousseaux, Michael Esq UNQUALIFIED56Anna Fali
1002Cody SaylorsItaly2025-09-09Chapman, Ross E Esq UNQUALIFIED43Amy Elsner
1003Isabel BowleyJapan2025-10-04Buckley Miller Wright RENEWAL45Amy Elsner
1004Leon OldroydFrance2025-09-29Chapman, Ross E Esq NEGOTIATION99Ivan Magalhaes
1005Kadeem FlosiUnited Kingdom2025-09-06Morlong Associates PROPOSAL49Ivan Magalhaes
1006Octavia MaletGermany2025-09-30Truhlar And Truhlar Attys PROPOSAL14Stephen Shaw
1007Leon OldroydFrance2025-09-23Printing Dimensions NEGOTIATION92Xuxue Feng
1008Jennifer AmigonArgentina2025-09-21Chemel, James L Cpa RENEWAL0Anna Fali
1009Jones VocelkaIndia2025-10-04Printing Dimensions NEW88Anna Fali
1010Deepesh ChuiCanada2025-09-26Dorl, James J Esq RENEWAL10Asiya Javayant
1011Ivar PaprockiCanada2025-09-09Chapman, Ross E Esq NEW91Anna Fali
1012David DarakjyGermany2025-09-17Chemel, James L Cpa NEW63Ioni Bowcher
1013Chavez BriddickCanada2025-09-13Commercial Press NEGOTIATION45Amy Elsner
1014Silvio SlusarskiFrance2025-09-26Feiner Bros PROPOSAL97Ioni Bowcher
1015Maisha RulapaughRussia2025-09-14Printing Dimensions NEGOTIATION93Onyama Limba
1016Arvin AlbaresRussia2025-09-28Morlong Associates NEW71Anna Fali
1017Aditya KuskoItaly2025-09-18Chanay, Jeffrey A Esq PROPOSAL14Xuxue Feng
1018Arvin AlbaresAustralia2025-09-26Printing Dimensions PROPOSAL90Ivan Magalhaes
1019Deepesh ChuiIndia2025-09-21Chemel, James L Cpa NEGOTIATION98Onyama Limba
1020Greenwood BologniaBrazil2025-09-06Chemel, James L Cpa NEGOTIATION30Anna Fali
1021Faith GillianJapan2025-09-05Chemel, James L Cpa QUALIFIED71Xuxue Feng
1022Cody SaylorsCanada2025-10-03King, Christopher A Esq NEW35Ivan Magalhaes
1023James ButtJapan2025-09-29Morlong Associates PROPOSAL82Ivan Magalhaes
1024Rodrigues CampainAustralia2025-09-12Commercial Press QUALIFIED54Asiya Javayant
1025Cody SaylorsFrance2025-09-10Chapman, Ross E Esq UNQUALIFIED33Amy Elsner
1026Faith GillianAustralia2025-09-30Feltz Printing Service QUALIFIED4Asiya Javayant
1027Johnson SergiSpain2025-09-07Dorl, James J Esq QUALIFIED59Onyama Limba
1028Jennifer AmigonRussia2025-09-19Truhlar And Truhlar Attys UNQUALIFIED36Ivan Magalhaes
1029Munro FerenczGermany2025-09-14Feiner Bros UNQUALIFIED39Ivan Magalhaes
1030Francesco ShinkoRussia2025-09-06Dorl, James J Esq NEGOTIATION77Ivan Magalhaes
1031Tony FollerGermany2025-09-20Rangoni Of Florence RENEWAL2Amy Elsner
1032Jefferson SchemmerItaly2025-09-13Buckley Miller Wright PROPOSAL67Stephen Shaw
1033Izzy GarufiGermany2025-10-02King, Christopher A Esq NEW15Stephen Shaw
1034Munro FerenczArgentina2025-09-27Rousseaux, Michael Esq UNQUALIFIED80Anna Fali
1035Morrow RutaRussia2025-09-23Morlong Associates QUALIFIED3Elwin Sharvill
1036Chavez BriddickItaly2025-10-02Commercial Press NEW13Elwin Sharvill
1037Jeanfrancois VenereBrazil2025-09-15Commercial Press NEGOTIATION58Ivan Magalhaes
1038Isabel BowleyRussia2025-09-22Morlong Associates QUALIFIED50Asiya Javayant
1039Faith GillianJapan2025-09-18Buckley Miller Wright RENEWAL70Anna Fali
1040Alejandro PerinFrance2025-09-18King, Christopher A Esq RENEWAL93Asiya Javayant
1041Jeanfrancois VenereAustralia2025-10-03Commercial Press RENEWAL2Onyama Limba
1042Arvin AlbaresBrazil2025-09-14King, Christopher A Esq UNQUALIFIED9Elwin Sharvill
1043David DarakjySpain2025-09-19King, Christopher A Esq RENEWAL13Elwin Sharvill
1044Morrow RutaCanada2025-09-28Chemel, James L Cpa RENEWAL76Bernardo Dominic
1045Leon OldroydAustralia2025-10-01Feltz Printing Service PROPOSAL42Asiya Javayant
1046Clifford RimRussia2025-09-11Commercial Press PROPOSAL57Xuxue Feng
1047Johnson SergiRussia2025-09-30Truhlar And Truhlar Attys NEGOTIATION25Onyama Limba
1048Aika InouyeBrazil2025-09-13Dorl, James J Esq QUALIFIED60Stephen Shaw
1049Cody SaylorsGermany2025-10-02Chemel, James L Cpa UNQUALIFIED53Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Wickens NestleGermanyXuxue Feng RENEWAL
Maisha RulapaughFranceIvan Magalhaes RENEWAL
James ButtGermanyAmy Elsner NEGOTIATION
David DarakjyBrazilElwin Sharvill NEGOTIATION
Sinclair WaycottIndiaIvan Magalhaes RENEWAL
Kadeem FlosiSpainAsiya Javayant UNQUALIFIED
Smith GlickGermanyAsiya Javayant UNQUALIFIED
Jefferson SchemmerIndiaBernardo Dominic NEW
Rodrigues CampainUnited KingdomElwin Sharvill NEGOTIATION
Misaki RoysterGermanyIvan Magalhaes PROPOSAL
Ashley DoeFranceAsiya Javayant NEGOTIATION
Arvin AlbaresRussiaAmy Elsner RENEWAL
Johnson SergiArgentinaElwin Sharvill NEW
Nicolas IturbideItalyStephen Shaw QUALIFIED
Salvatore StockhamJapanAsiya Javayant RENEWAL
Julie StensethGermanyAnna Fali QUALIFIED
Smith GlickCanadaStephen Shaw QUALIFIED
Leja CaldareraUnited KingdomOnyama Limba RENEWAL
Maria MarrierRussiaAmy Elsner NEW
Aruna FigeroaCanadaBernardo Dominic QUALIFIED
Sinclair WaycottSpainStephen Shaw RENEWAL
Maisha RulapaughJapanIoni Bowcher RENEWAL
Chavez BriddickGermanyAnna Fali PROPOSAL
Smith GlickRussiaStephen Shaw QUALIFIED
Mayumi KolmetzCanadaAmy Elsner NEGOTIATION
Leon OldroydBrazilElwin Sharvill NEW
Stacey MacleadArgentinaStephen Shaw RENEWAL
Francesco ShinkoRussiaXuxue Feng QUALIFIED
Aditya KuskoIndiaBernardo Dominic RENEWAL
Jennifer AmigonJapanIoni Bowcher PROPOSAL
Aika InouyeCanadaBernardo Dominic UNQUALIFIED
Deepesh ChuiSpainBernardo Dominic NEGOTIATION
Jeanfrancois VenereCanadaStephen Shaw NEW
Izzy GarufiArgentinaIoni Bowcher UNQUALIFIED
Mujtaba NickaGermanyXuxue Feng NEGOTIATION
James ButtIndiaIvan Magalhaes NEW
Jeanfrancois VenereFranceOnyama Limba PROPOSAL
Ashley DoeCanadaIvan Magalhaes NEW
Darci PoquetteFranceElwin Sharvill NEGOTIATION
Johnson SergiUnited KingdomXuxue Feng UNQUALIFIED
Julie StensethFranceXuxue Feng NEGOTIATION
Silvio SlusarskiFranceElwin Sharvill NEW
Tony FollerCanadaIoni Bowcher NEW
Stacey MacleadUnited KingdomBernardo Dominic NEW
Chavez BriddickSpainAsiya Javayant UNQUALIFIED
Ricardo GauchoIndiaOnyama Limba NEW
Juan WieserGermanyElwin Sharvill UNQUALIFIED
James ButtJapanBernardo Dominic RENEWAL
Wickens NestleSpainBernardo Dominic UNQUALIFIED
Wickens NestleFranceAmy Elsner UNQUALIFIED
Frozen Columns
Name
Ivar Paprocki
Isabel Bowley
Sinclair Waycott
Jeanfrancois Venere
David Darakjy
Nicolas Iturbide
Munro Ferencz
Mayumi Kolmetz
Izzy Garufi
Jennifer Amigon
Smith Glick
Sinclair Waycott
David Darakjy
Clifford Rim
Munro Ferencz
Aditya Kusko
Ashley Doe
Kaitlin Ostrosky
Francesco Shinko
Ashley Doe
Leon Oldroyd
Kaitlin Ostrosky
Izzy Garufi
Deepesh Chui
Isabel Bowley
Ashley Doe
Ivar Paprocki
Deepesh Chui
Alejandro Perin
Tony Foller
Arvin Albares
Jones Vocelka
Nicolas Iturbide
Ricardo Gaucho
Nicolas Iturbide
Silvio Slusarski
Mujtaba Nicka
Alejandro Perin
Rodrigues Campain
Kaitlin Ostrosky
Juan Wieser
Ricardo Gaucho
Kadeem Flosi
Leon Oldroyd
Johnson Sergi
Chavez Briddick
Wickens Nestle
Isabel Bowley
Salvatore Stockham
Misaki Royster
IdCountryDate
1000Germany2025-10-02
1001Australia2025-09-21
1002Germany2025-09-05
1003Japan2025-09-27
1004Brazil2025-09-11
1005Australia2025-09-24
1006Germany2025-09-13
1007Japan2025-09-18
1008Argentina2025-09-19
1009France2025-09-19
1010India2025-09-23
1011Brazil2025-09-09
1012Brazil2025-09-20
1013France2025-09-23
1014France2025-09-22
1015Spain2025-09-27
1016Spain2025-09-09
1017Germany2025-09-11
1018Germany2025-09-09
1019United Kingdom2025-09-25
1020Spain2025-09-17
1021Canada2025-09-07
1022Spain2025-09-15
1023Russia2025-09-25
1024Germany2025-09-06
1025Australia2025-09-09
1026Brazil2025-10-01
1027Canada2025-10-02
1028France2025-10-04
1029India2025-10-04
1030Australia2025-09-06
1031India2025-09-12
1032Russia2025-09-28
1033Italy2025-09-17
1034United Kingdom2025-09-12
1035Argentina2025-09-25
1036France2025-10-03
1037Russia2025-09-05
1038Russia2025-09-27
1039Canada2025-09-11
1040Germany2025-09-16
1041Argentina2025-09-28
1042Argentina2025-09-07
1043Argentina2025-10-02
1044United Kingdom2025-09-27
1045United Kingdom2025-09-28
1046Germany2025-10-04
1047Germany2025-10-03
1048United Kingdom2025-10-04
1049Spain2025-09-18

On-Demand Data

NameIdCountryDate
Mujtaba Nicka1000France2025-09-20
Deepesh Chui1001Russia2025-09-29
Mujtaba Nicka1002France2025-09-10
Deepesh Chui1003United Kingdom2025-09-20
Tony Foller1004United Kingdom2025-10-01
Maria Marrier1005Japan2025-10-02
Chavez Briddick1006Japan2025-10-02
Francesco Shinko1007Italy2025-09-29
Sinclair Waycott1008Germany2025-09-19
Greenwood Bolognia1009France2025-09-15
Greenwood Bolognia1010Germany2025-10-03
Jennifer Amigon1011France2025-09-29
Deepesh Chui1012Germany2025-09-27
Silvio Slusarski1013Australia2025-09-11
Antonio Caudy1014United Kingdom2025-09-24
Smith Glick1015Australia2025-09-23
Claire Tollner1016United Kingdom2025-09-22
Leja Caldarera1017France2025-09-24
Sinclair Waycott1018India2025-10-02
Jefferson Schemmer1019Italy2025-09-26
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Munro FerenczFranceIvan Magalhaes PROPOSAL
Jefferson SchemmerJapanOnyama Limba NEW
Nicolas IturbideUnited KingdomAnna Fali PROPOSAL
Arvin AlbaresGermanyStephen Shaw PROPOSAL
Mujtaba NickaBrazilOnyama Limba PROPOSAL
Ashley DoeFranceElwin Sharvill NEGOTIATION
Nicolas IturbideFranceIoni Bowcher PROPOSAL
Munro FerenczArgentinaIoni Bowcher PROPOSAL
Jones VocelkaUnited KingdomXuxue Feng NEW
Alejandro PerinCanadaAmy Elsner QUALIFIED
Kaitlin OstroskyIndiaAnna Fali NEW
Stacey MacleadArgentinaBernardo Dominic UNQUALIFIED
Leja CaldareraAustraliaBernardo Dominic UNQUALIFIED
Julie StensethRussiaXuxue Feng RENEWAL
Kaitlin OstroskyAustraliaAsiya Javayant NEW
Johnson SergiIndiaAmy Elsner NEGOTIATION
Adams MorascaUnited KingdomAnna Fali NEW
Greenwood BologniaCanadaElwin Sharvill QUALIFIED
Maisha RulapaughFranceXuxue Feng UNQUALIFIED
Salvatore StockhamSpainIoni Bowcher RENEWAL
Juan WieserBrazilAmy Elsner NEW
Nicolas IturbideBrazilAsiya Javayant PROPOSAL
James ButtFranceIvan Magalhaes UNQUALIFIED
David DarakjyArgentinaBernardo Dominic RENEWAL
Alejandro PerinSpainElwin Sharvill UNQUALIFIED
Jennifer AmigonRussiaStephen Shaw QUALIFIED
Jones VocelkaGermanyIoni Bowcher NEW
Kaitlin OstroskyCanadaOnyama Limba RENEWAL
Kadeem FlosiJapanOnyama Limba NEGOTIATION
Wickens NestleCanadaIoni Bowcher RENEWAL
Deepesh ChuiGermanyBernardo Dominic NEGOTIATION
Jeanfrancois VenereGermanyAnna Fali QUALIFIED
Kaitlin OstroskyFranceAmy Elsner NEGOTIATION
Smith GlickBrazilAsiya Javayant NEGOTIATION
Morrow RutaItalyOnyama Limba NEGOTIATION
Antonio CaudySpainIoni Bowcher PROPOSAL
Clifford RimRussiaOnyama Limba NEW
Salvatore StockhamSpainStephen Shaw NEW
Greenwood BologniaArgentinaIvan Magalhaes RENEWAL
Salvatore StockhamSpainElwin Sharvill 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>