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
Francesco ShinkoFranceIvan Magalhaes UNQUALIFIED
Ivar PaprockiItalyIoni Bowcher QUALIFIED
Adams MorascaItalyAmy Elsner RENEWAL
Leon OldroydRussiaElwin Sharvill UNQUALIFIED
Aditya KuskoSpainBernardo Dominic RENEWAL
Julie StensethBrazilAsiya Javayant UNQUALIFIED
Octavia MaletItalyIvan Magalhaes PROPOSAL
Jones VocelkaItalyElwin Sharvill NEW
Tony FollerUnited KingdomIoni Bowcher RENEWAL
Johnson SergiIndiaBernardo Dominic NEGOTIATION
Salvatore StockhamUnited KingdomStephen Shaw RENEWAL
Ivar PaprockiUnited KingdomIvan Magalhaes PROPOSAL
Deepesh ChuiFranceAnna Fali PROPOSAL
Julie StensethArgentinaElwin Sharvill QUALIFIED
Jennifer AmigonArgentinaOnyama Limba QUALIFIED
Adams MorascaSpainIvan Magalhaes PROPOSAL
Greenwood BologniaCanadaOnyama Limba UNQUALIFIED
Nicolas IturbideItalyElwin Sharvill UNQUALIFIED
Mayumi KolmetzAustraliaElwin Sharvill UNQUALIFIED
Tony FollerCanadaXuxue Feng NEGOTIATION
Tony FollerSpainOnyama Limba RENEWAL
Leja CaldareraBrazilOnyama Limba PROPOSAL
Jones VocelkaUnited KingdomAmy Elsner UNQUALIFIED
Clifford RimGermanyOnyama Limba PROPOSAL
Leon OldroydRussiaIoni Bowcher NEW
Ashley DoeRussiaAmy Elsner RENEWAL
Costa DilliardArgentinaOnyama Limba RENEWAL
Stacey MacleadFranceAnna Fali NEGOTIATION
Mayumi KolmetzItalyBernardo Dominic NEGOTIATION
Misaki RoysterRussiaOnyama Limba NEW
Wickens NestleJapanIvan Magalhaes PROPOSAL
David DarakjySpainBernardo Dominic NEGOTIATION
Leon OldroydJapanBernardo Dominic QUALIFIED
Ashley DoeIndiaAsiya Javayant QUALIFIED
James ButtSpainXuxue Feng UNQUALIFIED
Jennifer AmigonRussiaXuxue Feng RENEWAL
Juan WieserGermanyAmy Elsner PROPOSAL
Tony FollerItalyAmy Elsner QUALIFIED
Leja CaldareraCanadaAnna Fali NEW
Chavez BriddickUnited KingdomAnna Fali RENEWAL
Maisha RulapaughArgentinaElwin Sharvill UNQUALIFIED
Antonio CaudyRussiaAsiya Javayant QUALIFIED
Julie StensethJapanStephen Shaw QUALIFIED
Smith GlickBrazilBernardo Dominic NEGOTIATION
Stacey MacleadItalyAmy Elsner RENEWAL
Morrow RutaItalyStephen Shaw QUALIFIED
Misaki RoysterIndiaElwin Sharvill NEGOTIATION
Kaitlin OstroskyCanadaAnna Fali UNQUALIFIED
Aruna FigeroaItalyBernardo Dominic NEGOTIATION
Tony FollerUnited KingdomStephen Shaw QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Ricardo GauchoFranceAmy Elsner PROPOSAL
Chavez BriddickArgentinaBernardo Dominic UNQUALIFIED
Jennifer AmigonArgentinaStephen Shaw RENEWAL
Isabel BowleyIndiaAnna Fali NEW
Clifford RimFranceAnna Fali UNQUALIFIED
Jeanfrancois VenereRussiaAmy Elsner QUALIFIED
Clifford RimArgentinaIvan Magalhaes RENEWAL
Cody SaylorsJapanAmy Elsner PROPOSAL
David DarakjySpainStephen Shaw RENEWAL
Smith GlickGermanyIoni Bowcher NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Smith GlickJapan2025-07-24Feiner Bros NEW16Xuxue Feng
1001Stacey MacleadFrance2025-07-23King, Christopher A Esq UNQUALIFIED94Elwin Sharvill
1002Jefferson SchemmerRussia2025-07-18Chapman, Ross E Esq UNQUALIFIED16Amy Elsner
1003Jeanfrancois VenereAustralia2025-07-28Chapman, Ross E Esq PROPOSAL56Asiya Javayant
1004Ricardo GauchoGermany2025-07-20Rangoni Of Florence UNQUALIFIED42Amy Elsner
1005Aditya KuskoAustralia2025-07-19Feiner Bros NEW60Ioni Bowcher
1006Aruna FigeroaArgentina2025-07-16Chemel, James L Cpa NEGOTIATION16Stephen Shaw
1007Silvio SlusarskiItaly2025-08-06Feltz Printing Service PROPOSAL79Xuxue Feng
1008Munro FerenczBrazil2025-07-29Printing Dimensions NEGOTIATION36Bernardo Dominic
1009Rodrigues CampainBrazil2025-07-22Rangoni Of Florence QUALIFIED77Onyama Limba
1010Ashley DoeIndia2025-07-27Commercial Press UNQUALIFIED93Ioni Bowcher
1011Mayumi KolmetzRussia2025-08-08Commercial Press PROPOSAL94Ioni Bowcher
1012David DarakjyBrazil2025-07-22Printing Dimensions RENEWAL80Ivan Magalhaes
1013Aditya KuskoArgentina2025-08-06Commercial Press RENEWAL31Elwin Sharvill
1014Jennifer AmigonItaly2025-08-09Commercial Press PROPOSAL28Ioni Bowcher
1015Costa DilliardCanada2025-07-29Morlong Associates RENEWAL95Ivan Magalhaes
1016Octavia MaletAustralia2025-08-04Truhlar And Truhlar Attys RENEWAL88Ivan Magalhaes
1017Maria MarrierItaly2025-07-26Rangoni Of Florence RENEWAL60Ivan Magalhaes
1018Jennifer AmigonBrazil2025-07-20Feiner Bros RENEWAL79Ioni Bowcher
1019Salvatore StockhamJapan2025-07-28Rangoni Of Florence PROPOSAL75Onyama Limba
1020Deepesh ChuiIndia2025-07-19Printing Dimensions QUALIFIED66Ioni Bowcher
1021Ivar PaprockiFrance2025-07-16Truhlar And Truhlar Attys RENEWAL86Elwin Sharvill
1022Ricardo GauchoIndia2025-07-18Buckley Miller Wright RENEWAL69Elwin Sharvill
1023Mujtaba NickaIndia2025-07-17King, Christopher A Esq PROPOSAL59Ivan Magalhaes
1024Salvatore StockhamAustralia2025-08-10Chemel, James L Cpa NEW38Stephen Shaw
1025Salvatore StockhamUnited Kingdom2025-07-27Feiner Bros UNQUALIFIED35Stephen Shaw
1026Claire TollnerRussia2025-08-10Rousseaux, Michael Esq RENEWAL44Asiya Javayant
1027Francesco ShinkoRussia2025-08-02Chapman, Ross E Esq UNQUALIFIED15Anna Fali
1028Antonio CaudyBrazil2025-07-29Chemel, James L Cpa PROPOSAL11Ivan Magalhaes
1029Emily WhobreyJapan2025-07-31Rousseaux, Michael Esq NEW38Elwin Sharvill
1030Jefferson SchemmerIndia2025-08-10Chapman, Ross E Esq RENEWAL88Xuxue Feng
1031Cody SaylorsIndia2025-07-21Feltz Printing Service NEW0Stephen Shaw
1032Kadeem FlosiRussia2025-07-27King, Christopher A Esq RENEWAL49Onyama Limba
1033Leon OldroydJapan2025-07-30Chapman, Ross E Esq UNQUALIFIED59Xuxue Feng
1034David DarakjyUnited Kingdom2025-07-21Dorl, James J Esq PROPOSAL67Asiya Javayant
1035James ButtGermany2025-08-04Chemel, James L Cpa UNQUALIFIED17Asiya Javayant
1036Silvio SlusarskiAustralia2025-07-18Buckley Miller Wright NEGOTIATION97Onyama Limba
1037Chavez BriddickIndia2025-07-15Buckley Miller Wright NEGOTIATION31Ioni Bowcher
1038Deepesh ChuiRussia2025-07-24Benton, John B Jr NEGOTIATION71Elwin Sharvill
1039Kaitlin OstroskyAustralia2025-07-28Printing Dimensions UNQUALIFIED76Elwin Sharvill
1040Adams MorascaArgentina2025-07-17Feltz Printing Service NEGOTIATION9Onyama Limba
1041Jones VocelkaSpain2025-08-10Chanay, Jeffrey A Esq PROPOSAL3Ioni Bowcher
1042Silvio SlusarskiAustralia2025-07-24Commercial Press PROPOSAL67Anna Fali
1043Isabel BowleyRussia2025-08-08Chemel, James L Cpa RENEWAL51Ioni Bowcher
1044Johnson SergiRussia2025-07-31Truhlar And Truhlar Attys PROPOSAL50Ivan Magalhaes
1045Munro FerenczBrazil2025-07-29Benton, John B Jr UNQUALIFIED11Onyama Limba
1046Clifford RimItaly2025-08-03Rousseaux, Michael Esq NEW98Ioni Bowcher
1047Alejandro PerinArgentina2025-07-18Truhlar And Truhlar Attys NEW36Amy Elsner
1048Jefferson SchemmerFrance2025-07-23Chanay, Jeffrey A Esq PROPOSAL81Xuxue Feng
1049Stacey MacleadItaly2025-08-03Rousseaux, Michael Esq NEW0Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Stacey MacleadAustraliaIvan Magalhaes NEGOTIATION
Smith GlickGermanyIoni Bowcher NEGOTIATION
David DarakjySpainBernardo Dominic NEGOTIATION
Alejandro PerinBrazilXuxue Feng NEGOTIATION
Deepesh ChuiRussiaOnyama Limba NEW
Arvin AlbaresFranceOnyama Limba QUALIFIED
Ivar PaprockiItalyBernardo Dominic UNQUALIFIED
Jefferson SchemmerArgentinaXuxue Feng RENEWAL
Smith GlickUnited KingdomOnyama Limba NEW
Maisha RulapaughBrazilAnna Fali QUALIFIED
Murillo MaletUnited KingdomElwin Sharvill RENEWAL
Mayumi KolmetzJapanStephen Shaw NEGOTIATION
Jones VocelkaJapanIvan Magalhaes NEW
Maria MarrierUnited KingdomOnyama Limba RENEWAL
Leja CaldareraSpainIoni Bowcher UNQUALIFIED
Silvio SlusarskiCanadaXuxue Feng RENEWAL
Arvin AlbaresArgentinaStephen Shaw PROPOSAL
Claire TollnerUnited KingdomAsiya Javayant RENEWAL
Maisha RulapaughJapanAnna Fali PROPOSAL
Mayumi KolmetzAustraliaXuxue Feng QUALIFIED
Misaki RoysterArgentinaOnyama Limba NEGOTIATION
Francesco ShinkoBrazilIvan Magalhaes NEGOTIATION
Cody SaylorsGermanyOnyama Limba RENEWAL
Mujtaba NickaBrazilOnyama Limba NEW
Antonio CaudyItalyXuxue Feng QUALIFIED
Kaitlin OstroskyIndiaElwin Sharvill NEW
Faith GillianJapanIoni Bowcher QUALIFIED
Claire TollnerUnited KingdomStephen Shaw NEW
Leja CaldareraItalyAmy Elsner QUALIFIED
Darci PoquetteArgentinaAsiya Javayant NEW
Deepesh ChuiBrazilAsiya Javayant RENEWAL
Darci PoquetteAustraliaOnyama Limba UNQUALIFIED
Arvin AlbaresSpainElwin Sharvill PROPOSAL
Jennifer AmigonUnited KingdomIvan Magalhaes PROPOSAL
Nicolas IturbideUnited KingdomAmy Elsner NEW
Aika InouyeSpainAnna Fali PROPOSAL
Sinclair WaycottAustraliaAmy Elsner NEGOTIATION
Leja CaldareraJapanIoni Bowcher RENEWAL
Tony FollerArgentinaElwin Sharvill RENEWAL
Francesco ShinkoUnited KingdomBernardo Dominic NEW
Izzy GarufiBrazilElwin Sharvill PROPOSAL
Misaki RoysterBrazilOnyama Limba NEGOTIATION
James ButtRussiaElwin Sharvill NEGOTIATION
Aika InouyeJapanOnyama Limba RENEWAL
Jeanfrancois VenereGermanyXuxue Feng UNQUALIFIED
Isabel BowleyCanadaXuxue Feng RENEWAL
Misaki RoysterAustraliaXuxue Feng PROPOSAL
Deepesh ChuiBrazilAsiya Javayant QUALIFIED
Octavia MaletCanadaAmy Elsner NEW
Clifford RimIndiaAmy Elsner NEGOTIATION
Frozen Columns
Name
Aika Inouye
Greenwood Bolognia
Misaki Royster
Murillo Malet
Antonio Caudy
Isabel Bowley
Aditya Kusko
Maisha Rulapaugh
Ashley Doe
Salvatore Stockham
Chavez Briddick
Alejandro Perin
Deepesh Chui
Stacey Maclead
Kaitlin Ostrosky
Salvatore Stockham
Ricardo Gaucho
Smith Glick
Claire Tollner
Nicolas Iturbide
David Darakjy
Morrow Ruta
Johnson Sergi
Antonio Caudy
Juan Wieser
Stacey Maclead
Misaki Royster
Jones Vocelka
Adams Morasca
Adams Morasca
Maria Marrier
Clifford Rim
Silvio Slusarski
Leja Caldarera
Maria Marrier
Stacey Maclead
Julie Stenseth
Julie Stenseth
Chavez Briddick
Kadeem Flosi
Claire Tollner
Clifford Rim
Antonio Caudy
Salvatore Stockham
Smith Glick
Munro Ferencz
Izzy Garufi
Tony Foller
Rodrigues Campain
Octavia Malet
IdCountryDate
1000Spain2025-07-15
1001Japan2025-07-12
1002Germany2025-07-14
1003France2025-08-07
1004Canada2025-08-05
1005Spain2025-08-03
1006Germany2025-08-06
1007Italy2025-07-21
1008United Kingdom2025-08-03
1009Brazil2025-07-12
1010Spain2025-07-28
1011Brazil2025-07-22
1012Japan2025-08-01
1013India2025-07-14
1014Italy2025-08-08
1015Spain2025-07-12
1016India2025-07-26
1017Spain2025-08-08
1018France2025-07-13
1019Japan2025-08-07
1020India2025-08-01
1021Italy2025-08-10
1022Germany2025-08-08
1023France2025-08-08
1024Spain2025-07-13
1025Australia2025-08-10
1026Spain2025-07-20
1027Russia2025-08-08
1028Brazil2025-07-14
1029Russia2025-08-10
1030Japan2025-08-03
1031Japan2025-07-13
1032India2025-08-07
1033France2025-07-18
1034Brazil2025-08-02
1035Russia2025-07-19
1036Italy2025-08-06
1037United Kingdom2025-07-19
1038France2025-08-03
1039Italy2025-08-08
1040Germany2025-07-14
1041India2025-08-08
1042Germany2025-08-02
1043Canada2025-07-22
1044Australia2025-07-31
1045Argentina2025-08-10
1046Argentina2025-07-12
1047Brazil2025-07-27
1048Japan2025-07-14
1049United Kingdom2025-07-21

On-Demand Data

NameIdCountryDate
Murillo Malet1000United Kingdom2025-07-15
Stacey Maclead1001Japan2025-08-08
Emily Whobrey1002Italy2025-07-20
Leon Oldroyd1003Brazil2025-07-22
Mayumi Kolmetz1004Japan2025-07-19
Ashley Doe1005India2025-08-07
Costa Dilliard1006France2025-07-24
Kadeem Flosi1007France2025-07-21
Deepesh Chui1008France2025-08-01
Francesco Shinko1009France2025-08-02
Leja Caldarera1010Argentina2025-08-07
Nicolas Iturbide1011Brazil2025-07-16
Ashley Doe1012India2025-08-03
Antonio Caudy1013United Kingdom2025-07-28
Silvio Slusarski1014Italy2025-07-29
Misaki Royster1015Canada2025-07-17
Jennifer Amigon1016United Kingdom2025-08-08
Ivar Paprocki1017Brazil2025-07-28
Aruna Figeroa1018Argentina2025-08-02
Tony Foller1019Canada2025-08-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Morrow RutaCanadaAmy Elsner RENEWAL
Izzy GarufiArgentinaXuxue Feng NEW
David DarakjyJapanElwin Sharvill RENEWAL
Jennifer AmigonCanadaOnyama Limba PROPOSAL
Adams MorascaBrazilIoni Bowcher QUALIFIED
Aika InouyeUnited KingdomXuxue Feng UNQUALIFIED
Munro FerenczUnited KingdomIoni Bowcher QUALIFIED
Leon OldroydGermanyXuxue Feng NEGOTIATION
Stacey MacleadRussiaBernardo Dominic RENEWAL
Jeanfrancois VenereJapanBernardo Dominic NEGOTIATION
Arvin AlbaresArgentinaAmy Elsner QUALIFIED
Maisha RulapaughGermanyIoni Bowcher UNQUALIFIED
Nicolas IturbideSpainBernardo Dominic QUALIFIED
Leja CaldareraRussiaBernardo Dominic RENEWAL
Mayumi KolmetzAustraliaOnyama Limba RENEWAL
David DarakjyArgentinaAnna Fali RENEWAL
Darci PoquetteUnited KingdomStephen Shaw RENEWAL
Nicolas IturbideCanadaXuxue Feng NEGOTIATION
Darci PoquetteJapanXuxue Feng NEW
Faith GillianBrazilOnyama Limba UNQUALIFIED
Francesco ShinkoIndiaAmy Elsner NEW
Cody SaylorsIndiaIoni Bowcher UNQUALIFIED
Julie StensethIndiaStephen Shaw NEGOTIATION
Julie StensethRussiaElwin Sharvill PROPOSAL
Aruna FigeroaGermanyAmy Elsner NEGOTIATION
Adams MorascaRussiaXuxue Feng RENEWAL
Costa DilliardArgentinaBernardo Dominic NEW
Chavez BriddickAustraliaAmy Elsner PROPOSAL
Leon OldroydGermanyXuxue Feng QUALIFIED
Faith GillianUnited KingdomXuxue Feng UNQUALIFIED
Clifford RimCanadaAsiya Javayant NEW
Rodrigues CampainJapanXuxue Feng NEW
Claire TollnerJapanXuxue Feng PROPOSAL
Julie StensethUnited KingdomBernardo Dominic RENEWAL
Costa DilliardCanadaAmy Elsner PROPOSAL
Juan WieserIndiaIvan Magalhaes NEGOTIATION
Johnson SergiArgentinaIoni Bowcher QUALIFIED
Murillo MaletSpainXuxue Feng PROPOSAL
Tony FollerArgentinaAnna Fali PROPOSAL
Murillo MaletArgentinaOnyama Limba 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>