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
Tony FollerSpainAnna Fali RENEWAL
Deepesh ChuiAustraliaIoni Bowcher NEGOTIATION
Greenwood BologniaArgentinaXuxue Feng PROPOSAL
David DarakjyJapanAsiya Javayant RENEWAL
Adams MorascaArgentinaXuxue Feng QUALIFIED
Maisha RulapaughFranceStephen Shaw RENEWAL
Juan WieserBrazilStephen Shaw UNQUALIFIED
Tony FollerItalyIoni Bowcher NEGOTIATION
James ButtGermanyIoni Bowcher RENEWAL
Faith GillianUnited KingdomOnyama Limba UNQUALIFIED
Munro FerenczSpainAnna Fali NEW
Morrow RutaArgentinaIoni Bowcher NEGOTIATION
Wickens NestleItalyAsiya Javayant PROPOSAL
Faith GillianSpainElwin Sharvill UNQUALIFIED
Ricardo GauchoSpainBernardo Dominic RENEWAL
Wickens NestleUnited KingdomStephen Shaw UNQUALIFIED
Faith GillianFranceXuxue Feng QUALIFIED
Jeanfrancois VenereUnited KingdomIoni Bowcher QUALIFIED
Rodrigues CampainIndiaAmy Elsner QUALIFIED
Mayumi KolmetzItalyStephen Shaw NEW
Leja CaldareraSpainIoni Bowcher PROPOSAL
Aika InouyeItalyIoni Bowcher NEGOTIATION
Misaki RoysterRussiaXuxue Feng NEW
Maria MarrierItalyOnyama Limba NEW
Smith GlickSpainBernardo Dominic UNQUALIFIED
Juan WieserAustraliaAmy Elsner UNQUALIFIED
Antonio CaudyRussiaAmy Elsner NEW
Chavez BriddickIndiaXuxue Feng PROPOSAL
Kaitlin OstroskyArgentinaStephen Shaw NEW
Smith GlickIndiaIoni Bowcher QUALIFIED
Silvio SlusarskiBrazilAmy Elsner QUALIFIED
Rodrigues CampainAustraliaAnna Fali PROPOSAL
Morrow RutaUnited KingdomAnna Fali RENEWAL
Tony FollerUnited KingdomStephen Shaw NEW
Kadeem FlosiItalyIvan Magalhaes UNQUALIFIED
Stacey MacleadArgentinaAnna Fali PROPOSAL
Jennifer AmigonBrazilIvan Magalhaes NEW
Cody SaylorsArgentinaStephen Shaw PROPOSAL
Darci PoquetteCanadaStephen Shaw RENEWAL
Silvio SlusarskiSpainAmy Elsner UNQUALIFIED
Isabel BowleyItalyOnyama Limba UNQUALIFIED
Francesco ShinkoUnited KingdomElwin Sharvill UNQUALIFIED
Kadeem FlosiFranceAsiya Javayant PROPOSAL
Johnson SergiJapanAmy Elsner PROPOSAL
Costa DilliardBrazilXuxue Feng UNQUALIFIED
Isabel BowleyAustraliaStephen Shaw UNQUALIFIED
Izzy GarufiSpainAnna Fali NEGOTIATION
Deepesh ChuiBrazilAsiya Javayant UNQUALIFIED
Rodrigues CampainFranceAnna Fali QUALIFIED
Alejandro PerinJapanIoni Bowcher NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Johnson SergiArgentinaStephen Shaw PROPOSAL
Morrow RutaArgentinaAnna Fali UNQUALIFIED
Izzy GarufiFranceAsiya Javayant NEW
Aruna FigeroaIndiaAmy Elsner QUALIFIED
Arvin AlbaresSpainAsiya Javayant UNQUALIFIED
Tony FollerJapanBernardo Dominic QUALIFIED
Smith GlickItalyAsiya Javayant UNQUALIFIED
Arvin AlbaresAustraliaIoni Bowcher PROPOSAL
Stacey MacleadIndiaAnna Fali NEGOTIATION
Kaitlin OstroskyGermanyStephen Shaw PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Claire TollnerSpain2026-05-21Feiner Bros UNQUALIFIED49Onyama Limba
1001Isabel BowleyBrazil2026-05-22Printing Dimensions QUALIFIED68Onyama Limba
1002Adams MorascaGermany2026-05-22Dorl, James J Esq NEGOTIATION16Bernardo Dominic
1003Francesco ShinkoCanada2026-05-04Feltz Printing Service NEW19Elwin Sharvill
1004Smith GlickAustralia2026-05-04Chemel, James L Cpa RENEWAL12Stephen Shaw
1005Isabel BowleyFrance2026-04-29Chemel, James L Cpa UNQUALIFIED62Asiya Javayant
1006Maria MarrierUnited Kingdom2026-05-18Rangoni Of Florence NEGOTIATION96Asiya Javayant
1007Misaki RoysterIndia2026-05-02Truhlar And Truhlar Attys UNQUALIFIED70Ioni Bowcher
1008Morrow RutaGermany2026-05-04Truhlar And Truhlar Attys UNQUALIFIED42Xuxue Feng
1009Aruna FigeroaArgentina2026-05-21Rousseaux, Michael Esq UNQUALIFIED27Xuxue Feng
1010Costa DilliardJapan2026-04-28Truhlar And Truhlar Attys QUALIFIED26Xuxue Feng
1011Jeanfrancois VenereUnited Kingdom2026-05-25Rangoni Of Florence NEGOTIATION3Onyama Limba
1012Aditya KuskoGermany2026-04-28Buckley Miller Wright RENEWAL22Xuxue Feng
1013Juan WieserRussia2026-04-27Printing Dimensions UNQUALIFIED73Ioni Bowcher
1014Tony FollerJapan2026-05-15Benton, John B Jr NEW4Onyama Limba
1015Rodrigues CampainCanada2026-05-17Truhlar And Truhlar Attys NEGOTIATION3Asiya Javayant
1016Clifford RimSpain2026-05-09Chapman, Ross E Esq RENEWAL69Anna Fali
1017Murillo MaletFrance2026-05-15Feiner Bros PROPOSAL0Stephen Shaw
1018Aruna FigeroaArgentina2026-05-20Commercial Press NEGOTIATION15Amy Elsner
1019Nicolas IturbideJapan2026-05-08Benton, John B Jr UNQUALIFIED10Asiya Javayant
1020Greenwood BologniaCanada2026-05-08Rousseaux, Michael Esq PROPOSAL87Stephen Shaw
1021Rodrigues CampainRussia2026-05-12King, Christopher A Esq QUALIFIED45Elwin Sharvill
1022Tony FollerGermany2026-05-25Feltz Printing Service RENEWAL81Elwin Sharvill
1023Antonio CaudyIndia2026-05-02Truhlar And Truhlar Attys PROPOSAL18Ioni Bowcher
1024Kadeem FlosiBrazil2026-04-26Printing Dimensions QUALIFIED73Xuxue Feng
1025Octavia MaletArgentina2026-05-17Feltz Printing Service QUALIFIED57Ivan Magalhaes
1026Chavez BriddickIndia2026-05-19King, Christopher A Esq RENEWAL43Anna Fali
1027Jones VocelkaAustralia2026-04-26Rangoni Of Florence QUALIFIED84Stephen Shaw
1028Ashley DoeUnited Kingdom2026-05-04Chemel, James L Cpa RENEWAL79Asiya Javayant
1029Maisha RulapaughArgentina2026-05-09King, Christopher A Esq PROPOSAL37Xuxue Feng
1030Munro FerenczUnited Kingdom2026-04-28Feiner Bros RENEWAL83Ioni Bowcher
1031Maria MarrierSpain2026-05-24Dorl, James J Esq PROPOSAL44Amy Elsner
1032Chavez BriddickIndia2026-05-24Feltz Printing Service UNQUALIFIED10Asiya Javayant
1033Octavia MaletGermany2026-05-05Rousseaux, Michael Esq QUALIFIED16Bernardo Dominic
1034Maria MarrierCanada2026-05-21Chemel, James L Cpa NEGOTIATION11Amy Elsner
1035Aika InouyeIndia2026-05-20Chanay, Jeffrey A Esq QUALIFIED26Ivan Magalhaes
1036Emily WhobreySpain2026-04-28Buckley Miller Wright NEW64Elwin Sharvill
1037Salvatore StockhamAustralia2026-05-04Feltz Printing Service UNQUALIFIED14Amy Elsner
1038Darci PoquetteRussia2026-05-22Morlong Associates NEW46Elwin Sharvill
1039Claire TollnerIndia2026-05-10Chemel, James L Cpa QUALIFIED42Onyama Limba
1040Faith GillianFrance2026-05-02Buckley Miller Wright PROPOSAL26Elwin Sharvill
1041Emily WhobreyJapan2026-05-04Morlong Associates QUALIFIED38Amy Elsner
1042Arvin AlbaresUnited Kingdom2026-04-30Chemel, James L Cpa NEW53Ivan Magalhaes
1043Jefferson SchemmerJapan2026-05-02Benton, John B Jr PROPOSAL36Ivan Magalhaes
1044Leja CaldareraFrance2026-05-11Commercial Press RENEWAL46Xuxue Feng
1045Isabel BowleyJapan2026-05-02Commercial Press NEW70Amy Elsner
1046Deepesh ChuiCanada2026-05-03Feltz Printing Service NEGOTIATION12Stephen Shaw
1047Aditya KuskoFrance2026-05-15Morlong Associates NEGOTIATION21Amy Elsner
1048Leon OldroydFrance2026-05-13Truhlar And Truhlar Attys QUALIFIED84Amy Elsner
1049Emily WhobreyIndia2026-05-20Rousseaux, Michael Esq QUALIFIED24Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Johnson SergiCanadaIoni Bowcher UNQUALIFIED
Clifford RimJapanElwin Sharvill QUALIFIED
Izzy GarufiGermanyIvan Magalhaes UNQUALIFIED
Stacey MacleadGermanyIoni Bowcher RENEWAL
Costa DilliardUnited KingdomElwin Sharvill PROPOSAL
Julie StensethCanadaOnyama Limba RENEWAL
Jennifer AmigonUnited KingdomAnna Fali PROPOSAL
Munro FerenczIndiaAmy Elsner NEGOTIATION
Arvin AlbaresUnited KingdomAsiya Javayant RENEWAL
Johnson SergiCanadaAnna Fali UNQUALIFIED
Arvin AlbaresSpainIvan Magalhaes UNQUALIFIED
Leja CaldareraFranceAmy Elsner UNQUALIFIED
Aika InouyeUnited KingdomOnyama Limba QUALIFIED
Costa DilliardAustraliaIvan Magalhaes QUALIFIED
Maria MarrierItalyXuxue Feng NEGOTIATION
Adams MorascaRussiaOnyama Limba NEW
Jefferson SchemmerFranceOnyama Limba QUALIFIED
Deepesh ChuiCanadaIoni Bowcher NEW
Arvin AlbaresFranceElwin Sharvill NEGOTIATION
Maria MarrierCanadaBernardo Dominic RENEWAL
Cody SaylorsCanadaAmy Elsner NEW
Faith GillianGermanyStephen Shaw UNQUALIFIED
Faith GillianCanadaOnyama Limba NEW
Faith GillianRussiaOnyama Limba NEGOTIATION
Rodrigues CampainArgentinaAnna Fali RENEWAL
Greenwood BologniaUnited KingdomAsiya Javayant RENEWAL
Mujtaba NickaArgentinaAnna Fali PROPOSAL
Stacey MacleadItalyStephen Shaw QUALIFIED
Julie StensethIndiaStephen Shaw RENEWAL
Faith GillianFranceAsiya Javayant PROPOSAL
Clifford RimSpainAmy Elsner PROPOSAL
Jefferson SchemmerFranceAmy Elsner NEGOTIATION
Misaki RoysterCanadaXuxue Feng NEGOTIATION
Izzy GarufiCanadaBernardo Dominic NEGOTIATION
Wickens NestleArgentinaBernardo Dominic NEW
Smith GlickFranceElwin Sharvill RENEWAL
Maisha RulapaughSpainBernardo Dominic QUALIFIED
Octavia MaletBrazilOnyama Limba PROPOSAL
Darci PoquetteRussiaBernardo Dominic PROPOSAL
Morrow RutaArgentinaElwin Sharvill NEGOTIATION
Alejandro PerinGermanyXuxue Feng QUALIFIED
Tony FollerSpainAsiya Javayant NEGOTIATION
Izzy GarufiFranceXuxue Feng QUALIFIED
Antonio CaudyJapanElwin Sharvill QUALIFIED
Aika InouyeCanadaElwin Sharvill RENEWAL
Isabel BowleyBrazilBernardo Dominic QUALIFIED
Claire TollnerSpainAmy Elsner QUALIFIED
Smith GlickRussiaAnna Fali PROPOSAL
Ricardo GauchoUnited KingdomIvan Magalhaes NEGOTIATION
Clifford RimUnited KingdomAsiya Javayant QUALIFIED
Frozen Columns
Name
Darci Poquette
Ivar Paprocki
Deepesh Chui
Murillo Malet
Tony Foller
Julie Stenseth
Aruna Figeroa
Salvatore Stockham
Chavez Briddick
Stacey Maclead
Mayumi Kolmetz
Emily Whobrey
Jones Vocelka
Nicolas Iturbide
Juan Wieser
Cody Saylors
Stacey Maclead
Arvin Albares
Aruna Figeroa
Aruna Figeroa
Julie Stenseth
Sinclair Waycott
Kaitlin Ostrosky
Silvio Slusarski
Emily Whobrey
Claire Tollner
Jennifer Amigon
Jennifer Amigon
Greenwood Bolognia
Chavez Briddick
Stacey Maclead
Juan Wieser
Aika Inouye
Isabel Bowley
Munro Ferencz
Ashley Doe
Smith Glick
Leja Caldarera
Silvio Slusarski
Ashley Doe
Julie Stenseth
Costa Dilliard
Smith Glick
Aika Inouye
Francesco Shinko
Chavez Briddick
Morrow Ruta
Misaki Royster
Wickens Nestle
Sinclair Waycott
IdCountryDate
1000Canada2026-04-27
1001Brazil2026-04-28
1002Japan2026-05-19
1003United Kingdom2026-05-21
1004India2026-04-26
1005Japan2026-04-27
1006Japan2026-04-30
1007Spain2026-05-13
1008Germany2026-05-07
1009Russia2026-05-21
1010Russia2026-05-11
1011Australia2026-05-04
1012Germany2026-05-11
1013Spain2026-05-01
1014France2026-05-19
1015Italy2026-05-15
1016Canada2026-05-24
1017Brazil2026-05-24
1018France2026-05-16
1019Russia2026-04-30
1020Germany2026-05-10
1021Russia2026-04-27
1022Australia2026-05-05
1023Spain2026-05-25
1024France2026-05-23
1025United Kingdom2026-05-16
1026Japan2026-05-03
1027United Kingdom2026-05-09
1028Japan2026-04-30
1029Japan2026-05-14
1030Germany2026-05-04
1031India2026-05-07
1032Brazil2026-05-19
1033United Kingdom2026-05-24
1034Spain2026-04-28
1035Canada2026-04-28
1036Australia2026-04-29
1037Germany2026-05-19
1038Italy2026-05-19
1039Australia2026-05-03
1040Australia2026-05-19
1041Brazil2026-05-09
1042India2026-05-03
1043Germany2026-05-20
1044Canada2026-05-10
1045Italy2026-05-20
1046Germany2026-05-11
1047Japan2026-05-23
1048Canada2026-05-14
1049Australia2026-05-22

On-Demand Data

NameIdCountryDate
Adams Morasca1000United Kingdom2026-05-24
Stacey Maclead1001Japan2026-05-21
Mujtaba Nicka1002Canada2026-05-10
Nicolas Iturbide1003Germany2026-05-07
Tony Foller1004Russia2026-05-08
Costa Dilliard1005India2026-05-10
Ricardo Gaucho1006Russia2026-05-01
Silvio Slusarski1007France2026-05-11
Wickens Nestle1008India2026-04-30
Aika Inouye1009Russia2026-05-22
Alejandro Perin1010Italy2026-05-12
James Butt1011United Kingdom2026-05-22
Mujtaba Nicka1012Australia2026-05-08
Francesco Shinko1013India2026-05-03
Kaitlin Ostrosky1014Japan2026-05-16
Jones Vocelka1015India2026-05-14
Leon Oldroyd1016Canada2026-05-08
Adams Morasca1017Russia2026-05-06
Aditya Kusko1018Australia2026-05-07
Tony Foller1019Brazil2026-05-12
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aruna FigeroaArgentinaBernardo Dominic PROPOSAL
Mayumi KolmetzIndiaXuxue Feng QUALIFIED
Murillo MaletAustraliaBernardo Dominic RENEWAL
Juan WieserBrazilXuxue Feng UNQUALIFIED
Silvio SlusarskiIndiaBernardo Dominic QUALIFIED
Ricardo GauchoBrazilIoni Bowcher RENEWAL
Cody SaylorsCanadaIvan Magalhaes PROPOSAL
Maisha RulapaughIndiaIvan Magalhaes NEW
Deepesh ChuiSpainIoni Bowcher PROPOSAL
Clifford RimIndiaElwin Sharvill NEW
Juan WieserSpainAsiya Javayant NEW
Maria MarrierSpainOnyama Limba UNQUALIFIED
Salvatore StockhamItalyIoni Bowcher NEW
Sinclair WaycottFranceAsiya Javayant QUALIFIED
Jeanfrancois VenereItalyOnyama Limba QUALIFIED
Adams MorascaRussiaIvan Magalhaes RENEWAL
Rodrigues CampainAustraliaAnna Fali NEW
Silvio SlusarskiRussiaAsiya Javayant RENEWAL
Silvio SlusarskiIndiaIvan Magalhaes NEW
Deepesh ChuiFranceElwin Sharvill PROPOSAL
Faith GillianUnited KingdomAmy Elsner UNQUALIFIED
Mayumi KolmetzArgentinaAnna Fali UNQUALIFIED
Greenwood BologniaFranceXuxue Feng QUALIFIED
Jefferson SchemmerItalyElwin Sharvill RENEWAL
Leja CaldareraSpainIvan Magalhaes NEW
Mayumi KolmetzJapanIoni Bowcher PROPOSAL
Jennifer AmigonBrazilIoni Bowcher NEW
Kaitlin OstroskyRussiaStephen Shaw NEW
Alejandro PerinRussiaOnyama Limba UNQUALIFIED
Munro FerenczAustraliaIoni Bowcher RENEWAL
Kaitlin OstroskySpainAnna Fali QUALIFIED
Jennifer AmigonCanadaOnyama Limba QUALIFIED
Mujtaba NickaArgentinaOnyama Limba NEGOTIATION
Mayumi KolmetzUnited KingdomIvan Magalhaes UNQUALIFIED
Cody SaylorsArgentinaXuxue Feng NEGOTIATION
Alejandro PerinItalyAsiya Javayant RENEWAL
Kaitlin OstroskySpainOnyama Limba NEW
Silvio SlusarskiSpainIvan Magalhaes QUALIFIED
Claire TollnerUnited KingdomOnyama Limba QUALIFIED
Salvatore StockhamBrazilOnyama Limba 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>