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
Julie StensethJapanStephen Shaw RENEWAL
Chavez BriddickRussiaIvan Magalhaes RENEWAL
Faith GillianSpainStephen Shaw RENEWAL
Ivar PaprockiAustraliaIvan Magalhaes PROPOSAL
Alejandro PerinSpainIoni Bowcher NEW
Leja CaldareraFranceBernardo Dominic NEGOTIATION
Cody SaylorsSpainIvan Magalhaes NEW
Silvio SlusarskiRussiaAnna Fali QUALIFIED
James ButtCanadaStephen Shaw PROPOSAL
Chavez BriddickUnited KingdomElwin Sharvill RENEWAL
Stacey MacleadJapanIvan Magalhaes PROPOSAL
Salvatore StockhamAustraliaBernardo Dominic PROPOSAL
Darci PoquetteFranceIvan Magalhaes UNQUALIFIED
Leja CaldareraUnited KingdomAmy Elsner QUALIFIED
Misaki RoysterArgentinaAnna Fali RENEWAL
Munro FerenczSpainOnyama Limba PROPOSAL
Darci PoquetteArgentinaIvan Magalhaes RENEWAL
Emily WhobreyGermanyIvan Magalhaes QUALIFIED
Adams MorascaIndiaAsiya Javayant QUALIFIED
Claire TollnerAustraliaIvan Magalhaes RENEWAL
Stacey MacleadFranceXuxue Feng PROPOSAL
Antonio CaudyUnited KingdomAmy Elsner UNQUALIFIED
Ricardo GauchoRussiaBernardo Dominic UNQUALIFIED
Morrow RutaFranceOnyama Limba PROPOSAL
Ashley DoeSpainXuxue Feng NEW
Darci PoquetteCanadaBernardo Dominic UNQUALIFIED
David DarakjySpainAnna Fali NEGOTIATION
Francesco ShinkoItalyAsiya Javayant RENEWAL
Arvin AlbaresIndiaOnyama Limba PROPOSAL
Aditya KuskoRussiaElwin Sharvill NEW
Tony FollerJapanAmy Elsner UNQUALIFIED
Ashley DoeRussiaOnyama Limba RENEWAL
Clifford RimBrazilAsiya Javayant QUALIFIED
Morrow RutaRussiaIvan Magalhaes QUALIFIED
Darci PoquetteUnited KingdomOnyama Limba PROPOSAL
Jennifer AmigonFranceXuxue Feng UNQUALIFIED
Julie StensethJapanStephen Shaw RENEWAL
Julie StensethUnited KingdomBernardo Dominic NEGOTIATION
Misaki RoysterFranceOnyama Limba NEGOTIATION
Murillo MaletCanadaAsiya Javayant NEGOTIATION
Mujtaba NickaSpainAsiya Javayant UNQUALIFIED
Sinclair WaycottBrazilAnna Fali NEW
Leon OldroydArgentinaAmy Elsner NEGOTIATION
Ashley DoeCanadaStephen Shaw QUALIFIED
Juan WieserJapanIoni Bowcher UNQUALIFIED
Maisha RulapaughCanadaStephen Shaw PROPOSAL
Murillo MaletBrazilBernardo Dominic QUALIFIED
Octavia MaletUnited KingdomXuxue Feng UNQUALIFIED
Juan WieserArgentinaIvan Magalhaes RENEWAL
Alejandro PerinSpainIvan Magalhaes NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Jones VocelkaSpainAnna Fali PROPOSAL
Mayumi KolmetzArgentinaXuxue Feng NEGOTIATION
Deepesh ChuiFranceOnyama Limba RENEWAL
Mujtaba NickaJapanOnyama Limba UNQUALIFIED
Jefferson SchemmerIndiaAnna Fali NEGOTIATION
Juan WieserSpainStephen Shaw PROPOSAL
Faith GillianAustraliaIoni Bowcher NEGOTIATION
Stacey MacleadFranceAsiya Javayant NEGOTIATION
Johnson SergiRussiaAsiya Javayant QUALIFIED
Faith GillianArgentinaXuxue Feng PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Tony FollerIndia2026-05-22Chanay, Jeffrey A Esq PROPOSAL96Amy Elsner
1001Greenwood BologniaUnited Kingdom2026-06-02Truhlar And Truhlar Attys UNQUALIFIED45Anna Fali
1002Deepesh ChuiArgentina2026-06-14Printing Dimensions UNQUALIFIED75Xuxue Feng
1003Ricardo GauchoCanada2026-06-11Chemel, James L Cpa NEW83Asiya Javayant
1004Silvio SlusarskiUnited Kingdom2026-05-27Rousseaux, Michael Esq RENEWAL38Anna Fali
1005Jones VocelkaAustralia2026-06-14Truhlar And Truhlar Attys PROPOSAL41Elwin Sharvill
1006Darci PoquetteJapan2026-06-08Printing Dimensions RENEWAL76Asiya Javayant
1007Faith GillianRussia2026-06-14Chanay, Jeffrey A Esq QUALIFIED33Ivan Magalhaes
1008Smith GlickAustralia2026-05-22Commercial Press UNQUALIFIED83Elwin Sharvill
1009Faith GillianGermany2026-06-04Feltz Printing Service UNQUALIFIED96Ivan Magalhaes
1010Jeanfrancois VenereGermany2026-06-12Benton, John B Jr UNQUALIFIED16Onyama Limba
1011David DarakjyCanada2026-06-06Chapman, Ross E Esq UNQUALIFIED23Amy Elsner
1012Kaitlin OstroskyIndia2026-06-03King, Christopher A Esq RENEWAL43Xuxue Feng
1013Cody SaylorsJapan2026-05-30Chemel, James L Cpa QUALIFIED59Amy Elsner
1014Juan WieserAustralia2026-06-14King, Christopher A Esq RENEWAL3Ivan Magalhaes
1015Aika InouyeJapan2026-06-07Rangoni Of Florence NEGOTIATION80Xuxue Feng
1016Juan WieserCanada2026-06-07Chanay, Jeffrey A Esq UNQUALIFIED83Ioni Bowcher
1017Maria MarrierGermany2026-05-25Rousseaux, Michael Esq UNQUALIFIED24Ioni Bowcher
1018Adams MorascaAustralia2026-06-04King, Christopher A Esq PROPOSAL37Asiya Javayant
1019Munro FerenczBrazil2026-05-31Commercial Press RENEWAL91Asiya Javayant
1020Ivar PaprockiUnited Kingdom2026-06-13Morlong Associates NEGOTIATION93Onyama Limba
1021Mujtaba NickaBrazil2026-06-14Chemel, James L Cpa PROPOSAL55Asiya Javayant
1022Johnson SergiItaly2026-06-05Commercial Press RENEWAL11Ioni Bowcher
1023Julie StensethSpain2026-05-27Printing Dimensions PROPOSAL66Elwin Sharvill
1024Mujtaba NickaRussia2026-05-25Feiner Bros NEGOTIATION75Amy Elsner
1025Kadeem FlosiSpain2026-05-26Commercial Press UNQUALIFIED9Bernardo Dominic
1026Ricardo GauchoItaly2026-05-22Rousseaux, Michael Esq QUALIFIED81Bernardo Dominic
1027Juan WieserIndia2026-06-15Morlong Associates QUALIFIED21Ioni Bowcher
1028Leja CaldareraJapan2026-05-28Morlong Associates NEGOTIATION94Elwin Sharvill
1029Aditya KuskoUnited Kingdom2026-05-25Chanay, Jeffrey A Esq QUALIFIED19Stephen Shaw
1030Aika InouyeAustralia2026-06-05Buckley Miller Wright NEW81Bernardo Dominic
1031Munro FerenczUnited Kingdom2026-06-01Benton, John B Jr NEW30Amy Elsner
1032Ivar PaprockiRussia2026-05-23Dorl, James J Esq NEW9Elwin Sharvill
1033Cody SaylorsJapan2026-05-17Commercial Press PROPOSAL49Ioni Bowcher
1034Clifford RimAustralia2026-05-24Feiner Bros NEGOTIATION79Bernardo Dominic
1035Johnson SergiBrazil2026-05-25Buckley Miller Wright RENEWAL28Stephen Shaw
1036David DarakjySpain2026-05-28Printing Dimensions QUALIFIED72Elwin Sharvill
1037Jennifer AmigonItaly2026-06-08King, Christopher A Esq QUALIFIED30Amy Elsner
1038Deepesh ChuiRussia2026-06-14Commercial Press NEW54Ivan Magalhaes
1039Rodrigues CampainIndia2026-06-07Truhlar And Truhlar Attys NEW44Stephen Shaw
1040James ButtRussia2026-06-08Rousseaux, Michael Esq QUALIFIED97Asiya Javayant
1041Aika InouyeItaly2026-05-17Commercial Press UNQUALIFIED36Amy Elsner
1042Smith GlickBrazil2026-06-11Commercial Press PROPOSAL30Elwin Sharvill
1043Nicolas IturbideSpain2026-05-26Benton, John B Jr QUALIFIED69Amy Elsner
1044Arvin AlbaresUnited Kingdom2026-05-23Chapman, Ross E Esq NEW70Bernardo Dominic
1045David DarakjySpain2026-06-07Buckley Miller Wright NEGOTIATION64Ioni Bowcher
1046Arvin AlbaresFrance2026-05-30Truhlar And Truhlar Attys NEGOTIATION78Onyama Limba
1047Aika InouyeCanada2026-05-31Commercial Press PROPOSAL56Onyama Limba
1048Sinclair WaycottAustralia2026-05-27Benton, John B Jr UNQUALIFIED11Anna Fali
1049Chavez BriddickBrazil2026-06-09Printing Dimensions NEW36Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Arvin AlbaresGermanyIvan Magalhaes RENEWAL
Silvio SlusarskiJapanIvan Magalhaes QUALIFIED
Maria MarrierJapanAmy Elsner RENEWAL
Deepesh ChuiCanadaIvan Magalhaes PROPOSAL
Clifford RimRussiaStephen Shaw UNQUALIFIED
Alejandro PerinCanadaXuxue Feng UNQUALIFIED
Wickens NestleRussiaBernardo Dominic UNQUALIFIED
Tony FollerCanadaOnyama Limba RENEWAL
Jeanfrancois VenereUnited KingdomAsiya Javayant NEGOTIATION
Maria MarrierSpainAsiya Javayant NEGOTIATION
Rodrigues CampainArgentinaIoni Bowcher PROPOSAL
Izzy GarufiRussiaOnyama Limba RENEWAL
Murillo MaletItalyIvan Magalhaes NEW
Jennifer AmigonRussiaOnyama Limba QUALIFIED
Tony FollerCanadaIvan Magalhaes NEGOTIATION
Nicolas IturbideGermanyXuxue Feng PROPOSAL
Maisha RulapaughBrazilStephen Shaw QUALIFIED
Maisha RulapaughUnited KingdomBernardo Dominic PROPOSAL
Ashley DoeCanadaIvan Magalhaes PROPOSAL
Ashley DoeArgentinaElwin Sharvill UNQUALIFIED
Silvio SlusarskiIndiaStephen Shaw UNQUALIFIED
Juan WieserArgentinaElwin Sharvill UNQUALIFIED
Sinclair WaycottFranceAmy Elsner UNQUALIFIED
Jefferson SchemmerUnited KingdomIoni Bowcher RENEWAL
Salvatore StockhamCanadaXuxue Feng NEGOTIATION
Darci PoquetteGermanyIvan Magalhaes QUALIFIED
Isabel BowleySpainAsiya Javayant NEW
Ricardo GauchoArgentinaAsiya Javayant UNQUALIFIED
Jones VocelkaJapanIoni Bowcher QUALIFIED
Emily WhobreyJapanElwin Sharvill PROPOSAL
Isabel BowleyBrazilAmy Elsner NEW
Jefferson SchemmerCanadaAnna Fali UNQUALIFIED
Cody SaylorsFranceXuxue Feng NEW
Faith GillianAustraliaXuxue Feng QUALIFIED
Alejandro PerinUnited KingdomBernardo Dominic NEW
Morrow RutaIndiaAnna Fali NEGOTIATION
Jeanfrancois VenereAustraliaAmy Elsner RENEWAL
Smith GlickSpainOnyama Limba PROPOSAL
Morrow RutaAustraliaOnyama Limba NEW
Alejandro PerinBrazilElwin Sharvill UNQUALIFIED
Cody SaylorsItalyBernardo Dominic NEW
Smith GlickUnited KingdomStephen Shaw PROPOSAL
Claire TollnerGermanyElwin Sharvill UNQUALIFIED
Aika InouyeBrazilAnna Fali UNQUALIFIED
Darci PoquetteFranceOnyama Limba QUALIFIED
Ricardo GauchoBrazilIoni Bowcher RENEWAL
Alejandro PerinGermanyXuxue Feng UNQUALIFIED
Silvio SlusarskiGermanyAsiya Javayant NEW
James ButtUnited KingdomIvan Magalhaes RENEWAL
Izzy GarufiItalyXuxue Feng NEW
Frozen Columns
Name
Antonio Caudy
James Butt
Arvin Albares
Ivar Paprocki
Ivar Paprocki
Morrow Ruta
David Darakjy
Aika Inouye
Kaitlin Ostrosky
David Darakjy
Murillo Malet
Antonio Caudy
Izzy Garufi
Jeanfrancois Venere
David Darakjy
Aditya Kusko
Mujtaba Nicka
Antonio Caudy
Murillo Malet
Mayumi Kolmetz
Smith Glick
Mujtaba Nicka
Maria Marrier
Murillo Malet
Juan Wieser
Costa Dilliard
Aditya Kusko
Smith Glick
Greenwood Bolognia
Alejandro Perin
Leon Oldroyd
Rodrigues Campain
Jones Vocelka
Jennifer Amigon
Jefferson Schemmer
Stacey Maclead
Adams Morasca
Kadeem Flosi
Chavez Briddick
Jennifer Amigon
Faith Gillian
Ivar Paprocki
Antonio Caudy
Nicolas Iturbide
Deepesh Chui
Wickens Nestle
Maisha Rulapaugh
Johnson Sergi
Salvatore Stockham
Julie Stenseth
IdCountryDate
1000Canada2026-05-24
1001Canada2026-06-08
1002Argentina2026-06-04
1003Canada2026-06-01
1004India2026-06-08
1005France2026-06-05
1006Italy2026-06-03
1007France2026-05-25
1008India2026-06-12
1009Argentina2026-05-25
1010United Kingdom2026-05-24
1011Italy2026-06-06
1012Argentina2026-05-22
1013United Kingdom2026-06-14
1014Spain2026-05-31
1015Japan2026-06-09
1016Japan2026-05-20
1017United Kingdom2026-05-17
1018Spain2026-06-04
1019Australia2026-05-24
1020United Kingdom2026-06-15
1021Russia2026-05-25
1022Brazil2026-05-29
1023Spain2026-06-01
1024Italy2026-05-18
1025Russia2026-06-06
1026Russia2026-06-14
1027Argentina2026-06-12
1028Canada2026-06-01
1029United Kingdom2026-06-03
1030United Kingdom2026-05-20
1031Argentina2026-05-19
1032Brazil2026-06-02
1033Australia2026-06-02
1034Japan2026-06-13
1035India2026-05-19
1036Brazil2026-06-10
1037Japan2026-06-04
1038Brazil2026-06-04
1039Spain2026-06-15
1040Spain2026-06-03
1041Russia2026-06-01
1042Italy2026-06-05
1043India2026-06-04
1044Japan2026-06-08
1045United Kingdom2026-05-27
1046Australia2026-06-08
1047India2026-06-09
1048Argentina2026-05-22
1049Spain2026-06-10

On-Demand Data

NameIdCountryDate
Francesco Shinko1000Australia2026-06-06
Tony Foller1001Italy2026-06-06
Clifford Rim1002Italy2026-05-23
Aika Inouye1003Argentina2026-06-11
Julie Stenseth1004Brazil2026-06-05
Aika Inouye1005Italy2026-05-25
Claire Tollner1006Germany2026-05-17
Octavia Malet1007United Kingdom2026-05-29
Morrow Ruta1008France2026-05-29
Antonio Caudy1009United Kingdom2026-05-18
Francesco Shinko1010Italy2026-06-06
Aika Inouye1011Canada2026-06-02
Mayumi Kolmetz1012Brazil2026-06-10
Antonio Caudy1013Italy2026-05-21
Munro Ferencz1014India2026-05-17
Julie Stenseth1015Australia2026-05-18
Greenwood Bolognia1016Japan2026-06-03
Ivar Paprocki1017Argentina2026-06-05
Mayumi Kolmetz1018Russia2026-06-14
Izzy Garufi1019France2026-06-11
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Darci PoquetteArgentinaElwin Sharvill UNQUALIFIED
Darci PoquetteFranceElwin Sharvill RENEWAL
Maria MarrierGermanyAnna Fali PROPOSAL
Leja CaldareraBrazilBernardo Dominic RENEWAL
Ivar PaprockiRussiaBernardo Dominic QUALIFIED
Antonio CaudyRussiaAmy Elsner PROPOSAL
Alejandro PerinCanadaIoni Bowcher NEW
Antonio CaudySpainOnyama Limba NEGOTIATION
Isabel BowleyUnited KingdomIoni Bowcher NEGOTIATION
Aruna FigeroaGermanyXuxue Feng NEW
Rodrigues CampainAustraliaXuxue Feng QUALIFIED
Ricardo GauchoCanadaIvan Magalhaes QUALIFIED
Salvatore StockhamCanadaStephen Shaw QUALIFIED
Aditya KuskoItalyAsiya Javayant QUALIFIED
Tony FollerJapanIoni Bowcher PROPOSAL
Maisha RulapaughAustraliaAnna Fali NEW
Mujtaba NickaAustraliaOnyama Limba QUALIFIED
Chavez BriddickUnited KingdomIoni Bowcher QUALIFIED
Faith GillianSpainIvan Magalhaes UNQUALIFIED
Sinclair WaycottJapanAnna Fali UNQUALIFIED
Antonio CaudyUnited KingdomIoni Bowcher PROPOSAL
Salvatore StockhamAustraliaIvan Magalhaes RENEWAL
Jefferson SchemmerItalyAsiya Javayant UNQUALIFIED
David DarakjyUnited KingdomBernardo Dominic NEW
Sinclair WaycottJapanAmy Elsner PROPOSAL
Julie StensethAustraliaOnyama Limba RENEWAL
Murillo MaletJapanBernardo Dominic RENEWAL
Emily WhobreyItalyIvan Magalhaes QUALIFIED
Kadeem FlosiUnited KingdomOnyama Limba UNQUALIFIED
Salvatore StockhamBrazilAnna Fali PROPOSAL
Julie StensethAustraliaOnyama Limba UNQUALIFIED
Francesco ShinkoIndiaIoni Bowcher NEGOTIATION
Darci PoquetteGermanyOnyama Limba NEW
Leon OldroydJapanAsiya Javayant NEW
Jennifer AmigonFranceElwin Sharvill NEGOTIATION
Alejandro PerinCanadaAnna Fali PROPOSAL
Darci PoquetteIndiaIoni Bowcher NEW
Munro FerenczArgentinaElwin Sharvill NEGOTIATION
Misaki RoysterRussiaOnyama Limba NEGOTIATION
Mayumi KolmetzJapanElwin Sharvill 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>