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
Ivar PaprockiUnited KingdomAmy Elsner QUALIFIED
Leja CaldareraCanadaBernardo Dominic UNQUALIFIED
Arvin AlbaresUnited KingdomAnna Fali QUALIFIED
Julie StensethIndiaIoni Bowcher UNQUALIFIED
Mujtaba NickaRussiaXuxue Feng RENEWAL
Sinclair WaycottSpainOnyama Limba PROPOSAL
Francesco ShinkoBrazilElwin Sharvill RENEWAL
Salvatore StockhamJapanElwin Sharvill UNQUALIFIED
Leja CaldareraArgentinaElwin Sharvill NEW
Wickens NestleAustraliaIvan Magalhaes PROPOSAL
Tony FollerIndiaIoni Bowcher RENEWAL
Mayumi KolmetzCanadaXuxue Feng QUALIFIED
Alejandro PerinIndiaElwin Sharvill QUALIFIED
Cody SaylorsAustraliaAsiya Javayant RENEWAL
Maria MarrierArgentinaElwin Sharvill NEW
Octavia MaletGermanyAnna Fali RENEWAL
Jeanfrancois VenereSpainIoni Bowcher PROPOSAL
David DarakjyCanadaIvan Magalhaes NEGOTIATION
Maria MarrierSpainXuxue Feng UNQUALIFIED
Clifford RimCanadaOnyama Limba NEW
Rodrigues CampainIndiaIvan Magalhaes RENEWAL
Arvin AlbaresGermanyAmy Elsner PROPOSAL
Ashley DoeFranceStephen Shaw PROPOSAL
Arvin AlbaresCanadaElwin Sharvill NEGOTIATION
James ButtAustraliaOnyama Limba PROPOSAL
Murillo MaletFranceXuxue Feng RENEWAL
Costa DilliardArgentinaElwin Sharvill RENEWAL
Leon OldroydUnited KingdomOnyama Limba PROPOSAL
Octavia MaletAustraliaXuxue Feng NEW
Alejandro PerinRussiaAsiya Javayant UNQUALIFIED
Aruna FigeroaRussiaAmy Elsner RENEWAL
Ivar PaprockiFranceIvan Magalhaes UNQUALIFIED
Octavia MaletItalyXuxue Feng UNQUALIFIED
Leja CaldareraItalyXuxue Feng QUALIFIED
Arvin AlbaresBrazilIvan Magalhaes RENEWAL
Aruna FigeroaBrazilAnna Fali RENEWAL
Johnson SergiBrazilAsiya Javayant NEGOTIATION
Antonio CaudyGermanyBernardo Dominic NEW
Jones VocelkaFranceIoni Bowcher RENEWAL
Leja CaldareraItalyAnna Fali PROPOSAL
Ivar PaprockiUnited KingdomAsiya Javayant PROPOSAL
Mujtaba NickaIndiaElwin Sharvill PROPOSAL
Juan WieserArgentinaElwin Sharvill NEGOTIATION
Tony FollerBrazilXuxue Feng QUALIFIED
Juan WieserAustraliaXuxue Feng UNQUALIFIED
Misaki RoysterJapanBernardo Dominic RENEWAL
James ButtBrazilIoni Bowcher NEGOTIATION
David DarakjyRussiaStephen Shaw NEGOTIATION
Morrow RutaBrazilXuxue Feng NEGOTIATION
Clifford RimSpainAsiya Javayant NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Jeanfrancois VenereItalyElwin Sharvill RENEWAL
Tony FollerItalyIoni Bowcher QUALIFIED
Munro FerenczUnited KingdomAnna Fali QUALIFIED
Octavia MaletIndiaAmy Elsner PROPOSAL
Aika InouyeBrazilElwin Sharvill NEGOTIATION
Cody SaylorsBrazilOnyama Limba PROPOSAL
Emily WhobreyIndiaIoni Bowcher PROPOSAL
Emily WhobreyGermanyAsiya Javayant NEW
Ashley DoeFranceAsiya Javayant QUALIFIED
Faith GillianItalyIvan Magalhaes PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Jennifer AmigonAustralia2026-06-02Rangoni Of Florence UNQUALIFIED54Ivan Magalhaes
1001Darci PoquetteArgentina2026-05-15Chemel, James L Cpa PROPOSAL97Ivan Magalhaes
1002James ButtItaly2026-05-20Buckley Miller Wright UNQUALIFIED29Asiya Javayant
1003Stacey MacleadIndia2026-05-28Rousseaux, Michael Esq NEW57Elwin Sharvill
1004Leon OldroydAustralia2026-05-17Chemel, James L Cpa RENEWAL20Stephen Shaw
1005Alejandro PerinFrance2026-05-14Dorl, James J Esq UNQUALIFIED55Elwin Sharvill
1006Greenwood BologniaUnited Kingdom2026-05-23Chapman, Ross E Esq RENEWAL26Amy Elsner
1007James ButtAustralia2026-05-17Commercial Press PROPOSAL38Bernardo Dominic
1008Silvio SlusarskiFrance2026-05-31Commercial Press RENEWAL67Stephen Shaw
1009Jennifer AmigonAustralia2026-05-15Printing Dimensions PROPOSAL28Ioni Bowcher
1010Izzy GarufiIndia2026-05-07Dorl, James J Esq QUALIFIED47Bernardo Dominic
1011Leja CaldareraAustralia2026-05-06Chapman, Ross E Esq UNQUALIFIED95Bernardo Dominic
1012Arvin AlbaresJapan2026-05-30Dorl, James J Esq RENEWAL86Anna Fali
1013Arvin AlbaresRussia2026-05-26Morlong Associates RENEWAL17Stephen Shaw
1014Jones VocelkaCanada2026-05-22Rangoni Of Florence QUALIFIED42Stephen Shaw
1015Faith GillianIndia2026-06-03Rousseaux, Michael Esq QUALIFIED79Asiya Javayant
1016Octavia MaletCanada2026-05-21Benton, John B Jr PROPOSAL83Ioni Bowcher
1017Jennifer AmigonItaly2026-05-21Chanay, Jeffrey A Esq RENEWAL61Amy Elsner
1018Johnson SergiUnited Kingdom2026-06-03Chanay, Jeffrey A Esq UNQUALIFIED59Onyama Limba
1019Aruna FigeroaJapan2026-05-17Dorl, James J Esq NEGOTIATION16Stephen Shaw
1020Julie StensethBrazil2026-05-17Chanay, Jeffrey A Esq QUALIFIED63Onyama Limba
1021Aika InouyeJapan2026-06-03Benton, John B Jr NEW75Onyama Limba
1022Darci PoquetteUnited Kingdom2026-05-05Feiner Bros NEGOTIATION44Stephen Shaw
1023Chavez BriddickSpain2026-05-18Buckley Miller Wright NEW76Xuxue Feng
1024Rodrigues CampainRussia2026-05-25Chanay, Jeffrey A Esq NEW74Anna Fali
1025Stacey MacleadRussia2026-05-28Feiner Bros UNQUALIFIED42Elwin Sharvill
1026Rodrigues CampainItaly2026-05-08Chanay, Jeffrey A Esq QUALIFIED55Stephen Shaw
1027Stacey MacleadItaly2026-05-07Truhlar And Truhlar Attys NEW43Xuxue Feng
1028Jefferson SchemmerSpain2026-05-21Buckley Miller Wright NEW37Xuxue Feng
1029Jennifer AmigonArgentina2026-05-10Commercial Press NEGOTIATION54Ivan Magalhaes
1030Jefferson SchemmerJapan2026-06-03Chemel, James L Cpa UNQUALIFIED63Onyama Limba
1031Rodrigues CampainItaly2026-05-09Morlong Associates NEW68Onyama Limba
1032Johnson SergiGermany2026-05-27Dorl, James J Esq NEGOTIATION1Amy Elsner
1033Jefferson SchemmerBrazil2026-05-30Printing Dimensions RENEWAL81Elwin Sharvill
1034Maisha RulapaughGermany2026-05-27Truhlar And Truhlar Attys NEW13Stephen Shaw
1035Clifford RimRussia2026-05-21Dorl, James J Esq NEGOTIATION0Asiya Javayant
1036Nicolas IturbideRussia2026-06-02Chapman, Ross E Esq NEGOTIATION63Bernardo Dominic
1037Tony FollerBrazil2026-05-08Chanay, Jeffrey A Esq UNQUALIFIED24Xuxue Feng
1038Adams MorascaCanada2026-05-27Chapman, Ross E Esq RENEWAL96Xuxue Feng
1039Maisha RulapaughJapan2026-05-20Chapman, Ross E Esq NEW16Ivan Magalhaes
1040James ButtAustralia2026-05-09Morlong Associates NEGOTIATION73Amy Elsner
1041Costa DilliardSpain2026-05-24Printing Dimensions NEGOTIATION2Stephen Shaw
1042Isabel BowleyIndia2026-05-31Buckley Miller Wright NEW2Ioni Bowcher
1043Claire TollnerIndia2026-05-08Buckley Miller Wright PROPOSAL69Amy Elsner
1044Alejandro PerinItaly2026-05-23Chemel, James L Cpa NEW81Onyama Limba
1045Emily WhobreyBrazil2026-05-23Rousseaux, Michael Esq RENEWAL9Anna Fali
1046Ricardo GauchoItaly2026-05-13Printing Dimensions RENEWAL14Ioni Bowcher
1047Aruna FigeroaAustralia2026-05-26Chanay, Jeffrey A Esq RENEWAL49Ioni Bowcher
1048Octavia MaletGermany2026-05-05Printing Dimensions PROPOSAL43Asiya Javayant
1049Aditya KuskoJapan2026-05-15Morlong Associates QUALIFIED54Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Jones VocelkaCanadaIoni Bowcher PROPOSAL
Jennifer AmigonAustraliaOnyama Limba UNQUALIFIED
Silvio SlusarskiCanadaIvan Magalhaes RENEWAL
Julie StensethGermanyAnna Fali QUALIFIED
Johnson SergiFranceIvan Magalhaes UNQUALIFIED
Faith GillianJapanAmy Elsner NEGOTIATION
Sinclair WaycottGermanyAsiya Javayant NEW
Maisha RulapaughBrazilOnyama Limba PROPOSAL
Salvatore StockhamArgentinaXuxue Feng RENEWAL
Ricardo GauchoFranceAsiya Javayant NEGOTIATION
Aditya KuskoUnited KingdomAnna Fali PROPOSAL
Tony FollerCanadaBernardo Dominic PROPOSAL
David DarakjyGermanyElwin Sharvill QUALIFIED
Smith GlickBrazilAsiya Javayant NEW
Greenwood BologniaBrazilIvan Magalhaes RENEWAL
Misaki RoysterRussiaAsiya Javayant UNQUALIFIED
Mayumi KolmetzItalyXuxue Feng QUALIFIED
Stacey MacleadCanadaAnna Fali PROPOSAL
Francesco ShinkoFranceBernardo Dominic NEGOTIATION
Salvatore StockhamRussiaIoni Bowcher NEW
Isabel BowleyUnited KingdomStephen Shaw RENEWAL
Mayumi KolmetzCanadaStephen Shaw RENEWAL
Emily WhobreyItalyAsiya Javayant QUALIFIED
Claire TollnerIndiaStephen Shaw PROPOSAL
Ivar PaprockiCanadaAmy Elsner NEGOTIATION
Leon OldroydAustraliaBernardo Dominic NEGOTIATION
Julie StensethArgentinaIvan Magalhaes PROPOSAL
Stacey MacleadRussiaXuxue Feng NEGOTIATION
Alejandro PerinFranceAsiya Javayant NEGOTIATION
Nicolas IturbideIndiaElwin Sharvill UNQUALIFIED
Aruna FigeroaRussiaIoni Bowcher RENEWAL
Jeanfrancois VenereRussiaBernardo Dominic PROPOSAL
Jones VocelkaGermanyIoni Bowcher PROPOSAL
Claire TollnerUnited KingdomIoni Bowcher PROPOSAL
Darci PoquetteRussiaOnyama Limba QUALIFIED
Octavia MaletJapanIoni Bowcher NEGOTIATION
Francesco ShinkoGermanyAnna Fali NEGOTIATION
Wickens NestleJapanAmy Elsner QUALIFIED
Cody SaylorsFranceAmy Elsner NEW
Jones VocelkaSpainBernardo Dominic QUALIFIED
Claire TollnerItalyAmy Elsner NEW
Adams MorascaItalyElwin Sharvill PROPOSAL
Leja CaldareraFranceAsiya Javayant NEGOTIATION
Jefferson SchemmerAustraliaStephen Shaw NEW
Jefferson SchemmerBrazilElwin Sharvill UNQUALIFIED
Francesco ShinkoBrazilElwin Sharvill RENEWAL
Chavez BriddickAustraliaOnyama Limba NEW
Sinclair WaycottCanadaIvan Magalhaes RENEWAL
Arvin AlbaresSpainOnyama Limba PROPOSAL
Mujtaba NickaIndiaAmy Elsner NEGOTIATION
Frozen Columns
Name
Ivar Paprocki
Morrow Ruta
Julie Stenseth
Alejandro Perin
Aditya Kusko
Cody Saylors
Maisha Rulapaugh
Murillo Malet
Jefferson Schemmer
Adams Morasca
Silvio Slusarski
Deepesh Chui
Nicolas Iturbide
Isabel Bowley
Ashley Doe
Rodrigues Campain
Salvatore Stockham
Jennifer Amigon
James Butt
Costa Dilliard
Aruna Figeroa
Mujtaba Nicka
Alejandro Perin
Aditya Kusko
Antonio Caudy
Nicolas Iturbide
Arvin Albares
Darci Poquette
Antonio Caudy
Chavez Briddick
Chavez Briddick
Deepesh Chui
Aditya Kusko
Mayumi Kolmetz
Mujtaba Nicka
Jennifer Amigon
Alejandro Perin
Clifford Rim
Maisha Rulapaugh
Chavez Briddick
Darci Poquette
David Darakjy
Mayumi Kolmetz
Alejandro Perin
Leon Oldroyd
Salvatore Stockham
Morrow Ruta
Greenwood Bolognia
Greenwood Bolognia
Aditya Kusko
IdCountryDate
1000Argentina2026-05-18
1001Germany2026-05-13
1002Italy2026-05-21
1003France2026-05-13
1004United Kingdom2026-05-12
1005India2026-05-24
1006Italy2026-05-08
1007Spain2026-05-23
1008Japan2026-06-03
1009Australia2026-05-18
1010India2026-05-17
1011Argentina2026-05-28
1012Brazil2026-05-18
1013Canada2026-05-30
1014Canada2026-05-26
1015Russia2026-05-28
1016India2026-05-12
1017India2026-05-11
1018Japan2026-05-26
1019France2026-05-24
1020United Kingdom2026-05-09
1021Brazil2026-05-13
1022Australia2026-05-23
1023Italy2026-06-03
1024Brazil2026-05-18
1025India2026-05-26
1026Argentina2026-05-20
1027Argentina2026-05-18
1028Brazil2026-05-10
1029Japan2026-05-29
1030Brazil2026-05-05
1031Italy2026-05-10
1032Germany2026-05-23
1033Germany2026-05-25
1034Argentina2026-05-22
1035Japan2026-05-09
1036Germany2026-05-22
1037Italy2026-05-25
1038United Kingdom2026-05-26
1039Japan2026-05-27
1040Germany2026-05-22
1041Japan2026-05-17
1042France2026-05-29
1043United Kingdom2026-05-20
1044Australia2026-05-22
1045France2026-05-05
1046Russia2026-05-08
1047United Kingdom2026-05-10
1048Australia2026-05-22
1049Argentina2026-05-23

On-Demand Data

NameIdCountryDate
Octavia Malet1000Australia2026-05-17
David Darakjy1001France2026-05-31
Isabel Bowley1002Canada2026-05-13
Darci Poquette1003Argentina2026-05-30
Antonio Caudy1004Germany2026-06-03
Isabel Bowley1005France2026-05-14
Aika Inouye1006Australia2026-05-17
Sinclair Waycott1007United Kingdom2026-05-21
Johnson Sergi1008Russia2026-05-15
Emily Whobrey1009India2026-05-06
Adams Morasca1010Spain2026-06-02
Greenwood Bolognia1011Spain2026-05-10
Silvio Slusarski1012Germany2026-05-21
Ashley Doe1013United Kingdom2026-05-06
Ivar Paprocki1014Canada2026-05-08
Rodrigues Campain1015Japan2026-05-21
Deepesh Chui1016India2026-05-24
Morrow Ruta1017Russia2026-05-22
Isabel Bowley1018France2026-05-17
Salvatore Stockham1019Brazil2026-05-17
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aditya KuskoCanadaAsiya Javayant NEGOTIATION
Antonio CaudyRussiaIvan Magalhaes NEGOTIATION
Arvin AlbaresSpainIoni Bowcher NEGOTIATION
Jeanfrancois VenereCanadaXuxue Feng NEW
Wickens NestleItalyAnna Fali QUALIFIED
Julie StensethCanadaAnna Fali NEW
Salvatore StockhamBrazilBernardo Dominic NEW
Octavia MaletSpainXuxue Feng QUALIFIED
Misaki RoysterAustraliaElwin Sharvill NEGOTIATION
Aruna FigeroaArgentinaBernardo Dominic RENEWAL
Jeanfrancois VenereGermanyElwin Sharvill NEW
Aika InouyeArgentinaOnyama Limba QUALIFIED
Adams MorascaArgentinaOnyama Limba NEW
Ricardo GauchoUnited KingdomOnyama Limba PROPOSAL
Kaitlin OstroskyIndiaAmy Elsner NEGOTIATION
Maria MarrierAustraliaIvan Magalhaes UNQUALIFIED
Ashley DoeCanadaAnna Fali UNQUALIFIED
Emily WhobreySpainAnna Fali QUALIFIED
Adams MorascaSpainAsiya Javayant NEW
Misaki RoysterSpainStephen Shaw QUALIFIED
Nicolas IturbideFranceIoni Bowcher RENEWAL
Morrow RutaSpainAnna Fali RENEWAL
Julie StensethJapanStephen Shaw QUALIFIED
Smith GlickJapanAmy Elsner NEW
Kaitlin OstroskySpainAnna Fali PROPOSAL
Murillo MaletFranceElwin Sharvill NEW
Alejandro PerinRussiaAsiya Javayant PROPOSAL
Darci PoquetteJapanAnna Fali NEW
Jefferson SchemmerGermanyXuxue Feng PROPOSAL
Cody SaylorsFranceAmy Elsner PROPOSAL
Sinclair WaycottFranceAnna Fali NEGOTIATION
Kadeem FlosiAustraliaAsiya Javayant QUALIFIED
Aika InouyeItalyStephen Shaw UNQUALIFIED
Aika InouyeArgentinaAmy Elsner PROPOSAL
Stacey MacleadJapanOnyama Limba NEGOTIATION
Antonio CaudyAustraliaIoni Bowcher NEGOTIATION
Jennifer AmigonRussiaIvan Magalhaes UNQUALIFIED
Maisha RulapaughFranceIvan Magalhaes NEW
Murillo MaletCanadaIoni Bowcher NEGOTIATION
Johnson SergiIndiaAnna Fali PROPOSAL

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