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
Leja CaldareraGermanyAsiya Javayant QUALIFIED
Arvin AlbaresCanadaAmy Elsner RENEWAL
James ButtGermanyElwin Sharvill RENEWAL
Juan WieserSpainElwin Sharvill NEW
Costa DilliardSpainXuxue Feng NEW
Nicolas IturbideIndiaOnyama Limba NEW
Deepesh ChuiBrazilAmy Elsner UNQUALIFIED
Ivar PaprockiGermanyAmy Elsner NEW
Deepesh ChuiFranceElwin Sharvill PROPOSAL
Misaki RoysterCanadaBernardo Dominic RENEWAL
Salvatore StockhamIndiaIoni Bowcher PROPOSAL
Tony FollerJapanStephen Shaw RENEWAL
Adams MorascaIndiaAnna Fali NEGOTIATION
Sinclair WaycottBrazilElwin Sharvill QUALIFIED
Silvio SlusarskiJapanXuxue Feng PROPOSAL
Aruna FigeroaIndiaElwin Sharvill PROPOSAL
Murillo MaletSpainAsiya Javayant NEW
David DarakjyCanadaOnyama Limba NEGOTIATION
Johnson SergiCanadaBernardo Dominic NEW
Mujtaba NickaIndiaBernardo Dominic RENEWAL
Johnson SergiJapanBernardo Dominic RENEWAL
Francesco ShinkoBrazilIoni Bowcher RENEWAL
Jennifer AmigonUnited KingdomAmy Elsner NEW
Jennifer AmigonRussiaStephen Shaw NEW
Kaitlin OstroskyJapanStephen Shaw NEGOTIATION
Chavez BriddickFranceBernardo Dominic QUALIFIED
Cody SaylorsRussiaOnyama Limba RENEWAL
Silvio SlusarskiCanadaElwin Sharvill NEW
Murillo MaletSpainOnyama Limba QUALIFIED
Aruna FigeroaCanadaStephen Shaw NEGOTIATION
Ivar PaprockiItalyAsiya Javayant NEW
Deepesh ChuiBrazilBernardo Dominic UNQUALIFIED
Ashley DoeAustraliaElwin Sharvill NEW
Rodrigues CampainCanadaStephen Shaw UNQUALIFIED
Faith GillianUnited KingdomIvan Magalhaes UNQUALIFIED
Leja CaldareraAustraliaAnna Fali UNQUALIFIED
Nicolas IturbideIndiaAmy Elsner NEW
David DarakjyBrazilAmy Elsner PROPOSAL
Misaki RoysterArgentinaStephen Shaw RENEWAL
Octavia MaletCanadaElwin Sharvill QUALIFIED
Emily WhobreyAustraliaXuxue Feng PROPOSAL
Misaki RoysterGermanyIvan Magalhaes NEGOTIATION
Aditya KuskoRussiaElwin Sharvill UNQUALIFIED
Misaki RoysterItalyIoni Bowcher PROPOSAL
Costa DilliardCanadaXuxue Feng QUALIFIED
Clifford RimCanadaStephen Shaw RENEWAL
Juan WieserGermanyIoni Bowcher QUALIFIED
Arvin AlbaresItalyIvan Magalhaes NEW
Kadeem FlosiItalyXuxue Feng QUALIFIED
Francesco ShinkoArgentinaIvan Magalhaes UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Octavia MaletUnited KingdomAmy Elsner RENEWAL
David DarakjyFranceOnyama Limba NEGOTIATION
Juan WieserSpainIvan Magalhaes QUALIFIED
Stacey MacleadRussiaAnna Fali PROPOSAL
Ivar PaprockiAustraliaStephen Shaw UNQUALIFIED
James ButtGermanyAnna Fali RENEWAL
Francesco ShinkoRussiaXuxue Feng NEW
Clifford RimRussiaXuxue Feng UNQUALIFIED
Aruna FigeroaSpainAmy Elsner QUALIFIED
Mayumi KolmetzArgentinaStephen Shaw NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Stacey MacleadSpain2025-10-13Chemel, James L Cpa RENEWAL40Amy Elsner
1001Clifford RimJapan2025-10-07King, Christopher A Esq RENEWAL71Amy Elsner
1002Clifford RimAustralia2025-09-21Feltz Printing Service QUALIFIED26Amy Elsner
1003Faith GillianAustralia2025-10-09Rousseaux, Michael Esq PROPOSAL95Onyama Limba
1004Smith GlickFrance2025-09-23Truhlar And Truhlar Attys PROPOSAL97Amy Elsner
1005Clifford RimUnited Kingdom2025-09-30Printing Dimensions NEW86Onyama Limba
1006Clifford RimGermany2025-10-12Chemel, James L Cpa UNQUALIFIED83Asiya Javayant
1007Ivar PaprockiUnited Kingdom2025-10-12Printing Dimensions QUALIFIED56Anna Fali
1008Kadeem FlosiCanada2025-10-18Chapman, Ross E Esq UNQUALIFIED89Anna Fali
1009Aditya KuskoFrance2025-10-04Printing Dimensions NEW28Stephen Shaw
1010Wickens NestleRussia2025-09-26Truhlar And Truhlar Attys UNQUALIFIED13Elwin Sharvill
1011Maisha RulapaughUnited Kingdom2025-10-10Dorl, James J Esq RENEWAL12Stephen Shaw
1012Silvio SlusarskiAustralia2025-10-01Printing Dimensions UNQUALIFIED89Onyama Limba
1013Sinclair WaycottGermany2025-10-10Rousseaux, Michael Esq QUALIFIED39Asiya Javayant
1014Stacey MacleadArgentina2025-10-09Chapman, Ross E Esq NEGOTIATION96Amy Elsner
1015Cody SaylorsArgentina2025-10-11Rangoni Of Florence NEGOTIATION43Stephen Shaw
1016Isabel BowleyFrance2025-09-20Benton, John B Jr UNQUALIFIED67Onyama Limba
1017Alejandro PerinArgentina2025-09-21Buckley Miller Wright UNQUALIFIED84Onyama Limba
1018Isabel BowleyIndia2025-09-20Chemel, James L Cpa RENEWAL60Ivan Magalhaes
1019Murillo MaletArgentina2025-09-27Buckley Miller Wright NEW95Stephen Shaw
1020Nicolas IturbideJapan2025-10-17Rousseaux, Michael Esq NEGOTIATION54Stephen Shaw
1021Adams MorascaGermany2025-10-17Chapman, Ross E Esq UNQUALIFIED78Ioni Bowcher
1022Aditya KuskoItaly2025-10-04Rousseaux, Michael Esq NEGOTIATION41Ioni Bowcher
1023Claire TollnerFrance2025-09-29Chapman, Ross E Esq PROPOSAL97Amy Elsner
1024Jefferson SchemmerJapan2025-09-28Morlong Associates QUALIFIED25Asiya Javayant
1025James ButtBrazil2025-10-13Benton, John B Jr NEW29Xuxue Feng
1026Jefferson SchemmerAustralia2025-10-04Benton, John B Jr QUALIFIED77Stephen Shaw
1027Mujtaba NickaAustralia2025-10-07King, Christopher A Esq UNQUALIFIED82Anna Fali
1028Kadeem FlosiGermany2025-09-20Dorl, James J Esq PROPOSAL47Xuxue Feng
1029Alejandro PerinAustralia2025-10-17Feltz Printing Service NEGOTIATION74Stephen Shaw
1030Johnson SergiCanada2025-09-25Dorl, James J Esq RENEWAL45Stephen Shaw
1031Clifford RimRussia2025-09-24Chapman, Ross E Esq RENEWAL91Ioni Bowcher
1032Clifford RimArgentina2025-09-20Buckley Miller Wright RENEWAL45Xuxue Feng
1033Misaki RoysterBrazil2025-10-13Chapman, Ross E Esq RENEWAL3Elwin Sharvill
1034Isabel BowleyIndia2025-09-23Rousseaux, Michael Esq UNQUALIFIED16Amy Elsner
1035Mayumi KolmetzFrance2025-10-17Commercial Press QUALIFIED43Xuxue Feng
1036Ricardo GauchoFrance2025-09-20Benton, John B Jr UNQUALIFIED35Ivan Magalhaes
1037Jennifer AmigonArgentina2025-10-03Commercial Press UNQUALIFIED57Anna Fali
1038Adams MorascaArgentina2025-10-07Commercial Press RENEWAL37Ivan Magalhaes
1039Clifford RimSpain2025-10-02Buckley Miller Wright NEGOTIATION74Bernardo Dominic
1040Antonio CaudyUnited Kingdom2025-10-05Chapman, Ross E Esq UNQUALIFIED80Elwin Sharvill
1041Jennifer AmigonGermany2025-10-09Truhlar And Truhlar Attys RENEWAL55Anna Fali
1042Francesco ShinkoBrazil2025-09-22Morlong Associates QUALIFIED50Stephen Shaw
1043Deepesh ChuiBrazil2025-10-09Rousseaux, Michael Esq QUALIFIED17Anna Fali
1044Jennifer AmigonUnited Kingdom2025-10-08Chanay, Jeffrey A Esq NEW75Elwin Sharvill
1045Aika InouyeUnited Kingdom2025-10-07Truhlar And Truhlar Attys PROPOSAL61Ioni Bowcher
1046Francesco ShinkoFrance2025-09-20Feltz Printing Service NEGOTIATION59Amy Elsner
1047Johnson SergiUnited Kingdom2025-09-21Feiner Bros NEW56Ioni Bowcher
1048Greenwood BologniaItaly2025-09-27Feltz Printing Service NEGOTIATION91Bernardo Dominic
1049David DarakjyAustralia2025-10-04Chapman, Ross E Esq NEW91Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Ricardo GauchoArgentinaAmy Elsner NEGOTIATION
Adams MorascaFranceBernardo Dominic QUALIFIED
Sinclair WaycottCanadaAnna Fali NEW
Isabel BowleyJapanBernardo Dominic UNQUALIFIED
Jeanfrancois VenereArgentinaIoni Bowcher NEW
Jeanfrancois VenereRussiaOnyama Limba NEW
Jones VocelkaCanadaXuxue Feng PROPOSAL
Nicolas IturbideJapanBernardo Dominic NEGOTIATION
Chavez BriddickItalyIoni Bowcher PROPOSAL
Chavez BriddickJapanIvan Magalhaes QUALIFIED
Jones VocelkaGermanyAmy Elsner NEW
Darci PoquetteSpainElwin Sharvill PROPOSAL
Isabel BowleyIndiaAsiya Javayant QUALIFIED
Izzy GarufiFranceIvan Magalhaes RENEWAL
Julie StensethIndiaXuxue Feng UNQUALIFIED
Emily WhobreySpainElwin Sharvill QUALIFIED
Clifford RimAustraliaXuxue Feng UNQUALIFIED
Nicolas IturbideItalyOnyama Limba NEW
Munro FerenczRussiaBernardo Dominic QUALIFIED
David DarakjyGermanyAmy Elsner UNQUALIFIED
Maisha RulapaughArgentinaAsiya Javayant PROPOSAL
Leon OldroydBrazilXuxue Feng PROPOSAL
David DarakjyJapanStephen Shaw QUALIFIED
Izzy GarufiJapanAsiya Javayant RENEWAL
Tony FollerAustraliaAmy Elsner QUALIFIED
Cody SaylorsAustraliaElwin Sharvill NEGOTIATION
Clifford RimFranceElwin Sharvill NEW
Ashley DoeArgentinaOnyama Limba PROPOSAL
Jones VocelkaRussiaStephen Shaw QUALIFIED
Stacey MacleadRussiaXuxue Feng RENEWAL
Kadeem FlosiBrazilStephen Shaw RENEWAL
Leon OldroydFranceAsiya Javayant NEGOTIATION
Aditya KuskoSpainStephen Shaw PROPOSAL
Faith GillianGermanyBernardo Dominic PROPOSAL
Wickens NestleSpainOnyama Limba RENEWAL
Octavia MaletJapanAmy Elsner UNQUALIFIED
Johnson SergiSpainBernardo Dominic RENEWAL
Leja CaldareraSpainElwin Sharvill PROPOSAL
Clifford RimItalyStephen Shaw QUALIFIED
Aditya KuskoItalyXuxue Feng UNQUALIFIED
Arvin AlbaresItalyIvan Magalhaes QUALIFIED
Adams MorascaRussiaAnna Fali QUALIFIED
Faith GillianGermanyStephen Shaw RENEWAL
Izzy GarufiArgentinaAsiya Javayant RENEWAL
Aika InouyeBrazilBernardo Dominic RENEWAL
Tony FollerJapanIoni Bowcher UNQUALIFIED
Leon OldroydItalyOnyama Limba QUALIFIED
Greenwood BologniaCanadaOnyama Limba UNQUALIFIED
Darci PoquetteArgentinaOnyama Limba QUALIFIED
Nicolas IturbideCanadaBernardo Dominic NEW
Frozen Columns
Name
Chavez Briddick
Adams Morasca
Julie Stenseth
Jones Vocelka
Nicolas Iturbide
Jennifer Amigon
Greenwood Bolognia
Emily Whobrey
Mayumi Kolmetz
Silvio Slusarski
Darci Poquette
Julie Stenseth
Nicolas Iturbide
Tony Foller
Jeanfrancois Venere
Claire Tollner
Stacey Maclead
Arvin Albares
Octavia Malet
Aika Inouye
Jefferson Schemmer
Ivar Paprocki
Jones Vocelka
Arvin Albares
Alejandro Perin
David Darakjy
David Darakjy
Aruna Figeroa
Antonio Caudy
Antonio Caudy
Chavez Briddick
Clifford Rim
Chavez Briddick
Octavia Malet
Ashley Doe
Darci Poquette
David Darakjy
Deepesh Chui
Emily Whobrey
Alejandro Perin
Emily Whobrey
Nicolas Iturbide
Octavia Malet
Salvatore Stockham
Sinclair Waycott
Faith Gillian
Jefferson Schemmer
Leja Caldarera
Emily Whobrey
Mayumi Kolmetz
IdCountryDate
1000Italy2025-10-05
1001Russia2025-10-09
1002Argentina2025-10-04
1003Germany2025-10-17
1004Japan2025-10-17
1005Italy2025-10-16
1006United Kingdom2025-09-20
1007India2025-10-13
1008France2025-10-15
1009United Kingdom2025-10-18
1010Spain2025-09-23
1011Germany2025-10-10
1012Italy2025-10-13
1013Japan2025-10-17
1014Germany2025-10-12
1015Germany2025-10-08
1016Brazil2025-10-04
1017France2025-10-10
1018India2025-09-22
1019United Kingdom2025-09-22
1020Germany2025-09-24
1021Canada2025-10-13
1022United Kingdom2025-10-02
1023Italy2025-09-21
1024Russia2025-10-03
1025Spain2025-09-24
1026Germany2025-10-16
1027United Kingdom2025-10-16
1028India2025-10-02
1029Italy2025-10-01
1030Germany2025-09-20
1031Spain2025-09-27
1032Brazil2025-10-02
1033Canada2025-09-24
1034Germany2025-10-03
1035Spain2025-09-30
1036France2025-10-16
1037Italy2025-10-06
1038Russia2025-10-05
1039France2025-09-21
1040Russia2025-10-02
1041Australia2025-10-16
1042Canada2025-10-12
1043United Kingdom2025-10-01
1044Japan2025-10-01
1045Canada2025-09-26
1046Canada2025-10-17
1047Argentina2025-10-19
1048United Kingdom2025-10-04
1049Spain2025-10-07

On-Demand Data

NameIdCountryDate
Rodrigues Campain1000Germany2025-10-10
Isabel Bowley1001Australia2025-09-26
Emily Whobrey1002France2025-10-19
Jefferson Schemmer1003Japan2025-09-20
Maria Marrier1004Russia2025-10-04
Mayumi Kolmetz1005United Kingdom2025-10-02
Leon Oldroyd1006Russia2025-10-02
Jefferson Schemmer1007Argentina2025-10-13
Arvin Albares1008Argentina2025-10-13
Emily Whobrey1009Germany2025-09-21
Cody Saylors1010Germany2025-09-25
Maisha Rulapaugh1011Russia2025-10-10
Clifford Rim1012Italy2025-10-14
Jeanfrancois Venere1013Italy2025-10-05
Claire Tollner1014Canada2025-10-01
Munro Ferencz1015India2025-10-18
Jefferson Schemmer1016India2025-09-27
Johnson Sergi1017Italy2025-10-05
Kaitlin Ostrosky1018Japan2025-10-19
Julie Stenseth1019Canada2025-09-22
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Alejandro PerinArgentinaIvan Magalhaes QUALIFIED
Wickens NestleGermanyAnna Fali NEGOTIATION
Claire TollnerAustraliaElwin Sharvill RENEWAL
Juan WieserUnited KingdomAnna Fali NEW
Kaitlin OstroskyItalyAmy Elsner NEGOTIATION
Leja CaldareraJapanBernardo Dominic UNQUALIFIED
Salvatore StockhamIndiaIoni Bowcher PROPOSAL
Aika InouyeAustraliaOnyama Limba RENEWAL
Izzy GarufiIndiaBernardo Dominic RENEWAL
Deepesh ChuiRussiaAnna Fali RENEWAL
Isabel BowleyIndiaAnna Fali RENEWAL
Faith GillianCanadaBernardo Dominic NEGOTIATION
Munro FerenczGermanyElwin Sharvill QUALIFIED
Faith GillianIndiaStephen Shaw RENEWAL
Ashley DoeCanadaElwin Sharvill NEW
Leja CaldareraFranceStephen Shaw PROPOSAL
Leja CaldareraJapanAsiya Javayant PROPOSAL
James ButtItalyIoni Bowcher QUALIFIED
Alejandro PerinBrazilAsiya Javayant RENEWAL
Antonio CaudyBrazilAsiya Javayant NEGOTIATION
David DarakjyIndiaIvan Magalhaes UNQUALIFIED
Munro FerenczGermanyStephen Shaw RENEWAL
Silvio SlusarskiJapanIvan Magalhaes PROPOSAL
Mayumi KolmetzGermanyAmy Elsner PROPOSAL
Costa DilliardItalyIoni Bowcher NEGOTIATION
Antonio CaudyJapanOnyama Limba NEW
Stacey MacleadCanadaAsiya Javayant NEW
Mayumi KolmetzIndiaElwin Sharvill PROPOSAL
Rodrigues CampainIndiaBernardo Dominic UNQUALIFIED
Arvin AlbaresGermanyAmy Elsner NEW
Johnson SergiBrazilStephen Shaw PROPOSAL
Maria MarrierJapanOnyama Limba PROPOSAL
Isabel BowleyArgentinaXuxue Feng PROPOSAL
Silvio SlusarskiRussiaIvan Magalhaes RENEWAL
Izzy GarufiJapanStephen Shaw NEW
Isabel BowleyIndiaElwin Sharvill PROPOSAL
Mujtaba NickaSpainAsiya Javayant NEW
James ButtAustraliaAmy Elsner PROPOSAL
Claire TollnerItalyBernardo Dominic NEGOTIATION
Greenwood BologniaFranceIvan Magalhaes 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>