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
Maria MarrierBrazilOnyama Limba NEW
Misaki RoysterArgentinaOnyama Limba NEW
James ButtCanadaAsiya Javayant PROPOSAL
Emily WhobreyJapanAnna Fali NEGOTIATION
Clifford RimCanadaElwin Sharvill UNQUALIFIED
Stacey MacleadRussiaIoni Bowcher NEW
Cody SaylorsUnited KingdomIoni Bowcher RENEWAL
Nicolas IturbideRussiaStephen Shaw RENEWAL
Maria MarrierFranceElwin Sharvill NEW
Clifford RimAustraliaElwin Sharvill NEW
Maisha RulapaughArgentinaXuxue Feng RENEWAL
Izzy GarufiAustraliaOnyama Limba NEGOTIATION
Stacey MacleadSpainElwin Sharvill NEW
Kaitlin OstroskyItalyIoni Bowcher RENEWAL
Chavez BriddickCanadaAsiya Javayant PROPOSAL
Salvatore StockhamItalyStephen Shaw NEGOTIATION
Cody SaylorsCanadaElwin Sharvill PROPOSAL
Faith GillianCanadaIoni Bowcher UNQUALIFIED
Aruna FigeroaRussiaOnyama Limba NEW
Munro FerenczUnited KingdomElwin Sharvill NEW
Deepesh ChuiBrazilStephen Shaw RENEWAL
Francesco ShinkoFranceAnna Fali RENEWAL
Munro FerenczCanadaStephen Shaw NEGOTIATION
David DarakjyUnited KingdomIvan Magalhaes NEGOTIATION
Jeanfrancois VenereCanadaOnyama Limba NEGOTIATION
James ButtRussiaAsiya Javayant UNQUALIFIED
Adams MorascaUnited KingdomAsiya Javayant UNQUALIFIED
Isabel BowleyGermanyOnyama Limba RENEWAL
Izzy GarufiFranceIoni Bowcher UNQUALIFIED
Nicolas IturbideGermanyXuxue Feng RENEWAL
Cody SaylorsUnited KingdomIvan Magalhaes UNQUALIFIED
Clifford RimArgentinaBernardo Dominic UNQUALIFIED
Costa DilliardUnited KingdomIvan Magalhaes PROPOSAL
Isabel BowleyUnited KingdomStephen Shaw NEW
Clifford RimIndiaIoni Bowcher NEGOTIATION
Jones VocelkaAustraliaXuxue Feng PROPOSAL
Aruna FigeroaGermanyXuxue Feng NEW
Deepesh ChuiArgentinaBernardo Dominic RENEWAL
Darci PoquetteRussiaXuxue Feng NEW
Ivar PaprockiSpainBernardo Dominic UNQUALIFIED
Leja CaldareraArgentinaAsiya Javayant RENEWAL
Aruna FigeroaJapanXuxue Feng UNQUALIFIED
Silvio SlusarskiSpainIvan Magalhaes NEGOTIATION
Emily WhobreyGermanyBernardo Dominic UNQUALIFIED
Kadeem FlosiRussiaBernardo Dominic PROPOSAL
Antonio CaudyFranceBernardo Dominic NEW
Francesco ShinkoArgentinaBernardo Dominic PROPOSAL
Mujtaba NickaAustraliaAmy Elsner PROPOSAL
Jefferson SchemmerRussiaAsiya Javayant PROPOSAL
Isabel BowleyAustraliaXuxue Feng RENEWAL
Horizontal
NameCountryRepresentativeStatus
Francesco ShinkoJapanBernardo Dominic NEGOTIATION
James ButtGermanyAmy Elsner RENEWAL
Adams MorascaFranceBernardo Dominic NEW
Leja CaldareraUnited KingdomOnyama Limba PROPOSAL
Julie StensethCanadaIvan Magalhaes UNQUALIFIED
Greenwood BologniaCanadaAnna Fali NEGOTIATION
Johnson SergiSpainAnna Fali NEGOTIATION
Munro FerenczRussiaIoni Bowcher RENEWAL
Chavez BriddickItalyXuxue Feng UNQUALIFIED
Silvio SlusarskiArgentinaOnyama Limba NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aditya KuskoAustralia2026-04-01Feltz Printing Service PROPOSAL19Stephen Shaw
1001Jefferson SchemmerSpain2026-04-20Truhlar And Truhlar Attys PROPOSAL54Amy Elsner
1002Juan WieserIndia2026-04-16Buckley Miller Wright RENEWAL65Asiya Javayant
1003Nicolas IturbideItaly2026-04-02Feiner Bros NEGOTIATION25Asiya Javayant
1004Jennifer AmigonSpain2026-04-18Chapman, Ross E Esq RENEWAL49Onyama Limba
1005Claire TollnerBrazil2026-04-08Buckley Miller Wright NEW15Anna Fali
1006Misaki RoysterUnited Kingdom2026-03-27Rousseaux, Michael Esq UNQUALIFIED46Amy Elsner
1007Maisha RulapaughGermany2026-04-03Chemel, James L Cpa PROPOSAL80Asiya Javayant
1008Juan WieserAustralia2026-04-05Printing Dimensions UNQUALIFIED90Xuxue Feng
1009Smith GlickIndia2026-04-20Buckley Miller Wright QUALIFIED91Bernardo Dominic
1010Costa DilliardItaly2026-03-30Printing Dimensions NEW98Onyama Limba
1011James ButtBrazil2026-03-31Rangoni Of Florence UNQUALIFIED15Ivan Magalhaes
1012Cody SaylorsBrazil2026-04-12Buckley Miller Wright NEW16Stephen Shaw
1013Clifford RimGermany2026-04-11Feltz Printing Service NEW48Elwin Sharvill
1014Greenwood BologniaIndia2026-04-13Truhlar And Truhlar Attys RENEWAL95Xuxue Feng
1015Leon OldroydGermany2026-04-05Printing Dimensions UNQUALIFIED97Amy Elsner
1016Ricardo GauchoRussia2026-03-28Dorl, James J Esq NEGOTIATION98Elwin Sharvill
1017Johnson SergiRussia2026-03-23King, Christopher A Esq NEGOTIATION80Elwin Sharvill
1018David DarakjyGermany2026-04-12Truhlar And Truhlar Attys PROPOSAL56Asiya Javayant
1019Ricardo GauchoIndia2026-04-08Buckley Miller Wright NEW74Bernardo Dominic
1020David DarakjyJapan2026-04-16Truhlar And Truhlar Attys RENEWAL26Amy Elsner
1021Emily WhobreyArgentina2026-04-04Rangoni Of Florence NEGOTIATION5Ioni Bowcher
1022Kadeem FlosiBrazil2026-04-20Feltz Printing Service QUALIFIED43Xuxue Feng
1023James ButtIndia2026-04-14Buckley Miller Wright RENEWAL98Ioni Bowcher
1024Maisha RulapaughArgentina2026-04-14Benton, John B Jr QUALIFIED48Bernardo Dominic
1025Mayumi KolmetzAustralia2026-04-08Commercial Press QUALIFIED79Asiya Javayant
1026Stacey MacleadAustralia2026-04-11Rangoni Of Florence QUALIFIED80Amy Elsner
1027Smith GlickUnited Kingdom2026-04-04Chemel, James L Cpa UNQUALIFIED17Amy Elsner
1028Morrow RutaCanada2026-03-24Morlong Associates PROPOSAL64Ivan Magalhaes
1029Leja CaldareraRussia2026-03-23Feiner Bros UNQUALIFIED16Asiya Javayant
1030Isabel BowleyJapan2026-04-14Rousseaux, Michael Esq NEW42Onyama Limba
1031Cody SaylorsGermany2026-04-14Printing Dimensions NEGOTIATION78Onyama Limba
1032Jeanfrancois VenereAustralia2026-03-26Rangoni Of Florence QUALIFIED33Elwin Sharvill
1033Francesco ShinkoArgentina2026-04-12Chanay, Jeffrey A Esq RENEWAL32Anna Fali
1034Costa DilliardCanada2026-04-16Feltz Printing Service RENEWAL85Amy Elsner
1035Chavez BriddickIndia2026-04-07Chemel, James L Cpa PROPOSAL58Ivan Magalhaes
1036Jefferson SchemmerCanada2026-04-08Chapman, Ross E Esq QUALIFIED95Onyama Limba
1037Octavia MaletBrazil2026-04-16Chanay, Jeffrey A Esq UNQUALIFIED28Elwin Sharvill
1038Munro FerenczBrazil2026-04-20Chapman, Ross E Esq NEW13Onyama Limba
1039Arvin AlbaresGermany2026-03-31Morlong Associates NEW15Asiya Javayant
1040Julie StensethGermany2026-03-31Rousseaux, Michael Esq QUALIFIED14Xuxue Feng
1041Johnson SergiBrazil2026-04-08Buckley Miller Wright RENEWAL49Asiya Javayant
1042Francesco ShinkoBrazil2026-03-27Morlong Associates RENEWAL47Ivan Magalhaes
1043Tony FollerUnited Kingdom2026-04-14Benton, John B Jr NEGOTIATION82Stephen Shaw
1044Aika InouyeGermany2026-04-15Rangoni Of Florence UNQUALIFIED64Elwin Sharvill
1045Izzy GarufiArgentina2026-03-31Benton, John B Jr NEGOTIATION37Asiya Javayant
1046Stacey MacleadItaly2026-04-16Benton, John B Jr QUALIFIED22Xuxue Feng
1047Johnson SergiSpain2026-03-28Benton, John B Jr QUALIFIED1Bernardo Dominic
1048Alejandro PerinArgentina2026-04-11Rousseaux, Michael Esq QUALIFIED88Onyama Limba
1049James ButtGermany2026-03-30Buckley Miller Wright QUALIFIED31Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Murillo MaletJapanStephen Shaw QUALIFIED
Aditya KuskoArgentinaAnna Fali QUALIFIED
James ButtArgentinaAnna Fali PROPOSAL
Antonio CaudyFranceAnna Fali RENEWAL
Misaki RoysterBrazilIoni Bowcher NEW
Ivar PaprockiRussiaElwin Sharvill QUALIFIED
Maria MarrierUnited KingdomOnyama Limba QUALIFIED
Maria MarrierGermanyOnyama Limba NEGOTIATION
Antonio CaudyArgentinaBernardo Dominic QUALIFIED
Rodrigues CampainAustraliaElwin Sharvill QUALIFIED
Kaitlin OstroskyCanadaOnyama Limba UNQUALIFIED
Ricardo GauchoCanadaStephen Shaw QUALIFIED
Francesco ShinkoBrazilStephen Shaw RENEWAL
Chavez BriddickBrazilAsiya Javayant RENEWAL
Kaitlin OstroskyItalyOnyama Limba UNQUALIFIED
Tony FollerRussiaAsiya Javayant NEGOTIATION
Morrow RutaAustraliaOnyama Limba NEGOTIATION
Cody SaylorsCanadaOnyama Limba UNQUALIFIED
Antonio CaudyAustraliaXuxue Feng QUALIFIED
Silvio SlusarskiArgentinaAmy Elsner PROPOSAL
Isabel BowleyArgentinaXuxue Feng PROPOSAL
Clifford RimIndiaIvan Magalhaes NEW
Antonio CaudyBrazilStephen Shaw QUALIFIED
Julie StensethUnited KingdomOnyama Limba UNQUALIFIED
Aditya KuskoIndiaAmy Elsner NEGOTIATION
James ButtUnited KingdomIoni Bowcher NEW
Tony FollerJapanAnna Fali NEGOTIATION
Alejandro PerinArgentinaAmy Elsner RENEWAL
Emily WhobreyArgentinaIoni Bowcher NEW
Jones VocelkaGermanyStephen Shaw QUALIFIED
Mayumi KolmetzRussiaAmy Elsner UNQUALIFIED
David DarakjyItalyBernardo Dominic PROPOSAL
Greenwood BologniaCanadaAsiya Javayant NEGOTIATION
David DarakjyGermanyIvan Magalhaes NEGOTIATION
Maria MarrierSpainIvan Magalhaes QUALIFIED
Leon OldroydFranceOnyama Limba RENEWAL
Ivar PaprockiIndiaElwin Sharvill RENEWAL
Costa DilliardIndiaElwin Sharvill RENEWAL
Aika InouyeJapanOnyama Limba QUALIFIED
Stacey MacleadUnited KingdomIvan Magalhaes RENEWAL
Sinclair WaycottIndiaAmy Elsner PROPOSAL
Octavia MaletJapanAmy Elsner NEGOTIATION
Kadeem FlosiAustraliaAnna Fali RENEWAL
Rodrigues CampainUnited KingdomElwin Sharvill QUALIFIED
Munro FerenczArgentinaAmy Elsner NEW
Jefferson SchemmerRussiaIvan Magalhaes UNQUALIFIED
Kadeem FlosiSpainAsiya Javayant RENEWAL
Chavez BriddickUnited KingdomIvan Magalhaes QUALIFIED
Morrow RutaBrazilElwin Sharvill NEW
Juan WieserItalyAsiya Javayant RENEWAL
Frozen Columns
Name
Jennifer Amigon
Morrow Ruta
Kadeem Flosi
Nicolas Iturbide
Munro Ferencz
James Butt
Izzy Garufi
Misaki Royster
Deepesh Chui
Darci Poquette
Adams Morasca
James Butt
James Butt
Greenwood Bolognia
Faith Gillian
Jennifer Amigon
Ivar Paprocki
Faith Gillian
Julie Stenseth
Alejandro Perin
David Darakjy
Ivar Paprocki
Cody Saylors
Stacey Maclead
Arvin Albares
Aruna Figeroa
Wickens Nestle
Misaki Royster
Deepesh Chui
Jeanfrancois Venere
Sinclair Waycott
Aruna Figeroa
Francesco Shinko
Morrow Ruta
Sinclair Waycott
Aditya Kusko
Kadeem Flosi
Chavez Briddick
Greenwood Bolognia
Darci Poquette
Ashley Doe
Costa Dilliard
Clifford Rim
Julie Stenseth
Jennifer Amigon
Emily Whobrey
Faith Gillian
Francesco Shinko
Clifford Rim
Ricardo Gaucho
IdCountryDate
1000Italy2026-04-02
1001Spain2026-04-07
1002Japan2026-03-24
1003United Kingdom2026-03-31
1004France2026-03-26
1005Italy2026-04-15
1006Italy2026-04-20
1007Canada2026-03-29
1008Brazil2026-03-31
1009India2026-04-08
1010Brazil2026-04-01
1011Argentina2026-04-06
1012Japan2026-04-06
1013India2026-04-21
1014Australia2026-04-06
1015Argentina2026-04-13
1016Japan2026-03-30
1017Canada2026-04-17
1018India2026-04-06
1019Canada2026-04-21
1020Spain2026-04-10
1021France2026-03-23
1022United Kingdom2026-04-13
1023France2026-04-21
1024Russia2026-03-26
1025Spain2026-04-02
1026Spain2026-04-15
1027United Kingdom2026-04-04
1028Germany2026-03-23
1029Germany2026-04-10
1030France2026-04-13
1031Italy2026-03-31
1032Canada2026-04-04
1033Spain2026-03-30
1034Argentina2026-04-06
1035Italy2026-04-14
1036India2026-04-04
1037Italy2026-04-11
1038Spain2026-03-27
1039United Kingdom2026-04-06
1040Australia2026-04-15
1041Argentina2026-04-06
1042Canada2026-04-13
1043Germany2026-04-05
1044Canada2026-04-19
1045Germany2026-03-23
1046India2026-04-04
1047Argentina2026-03-25
1048Canada2026-04-10
1049Germany2026-03-25

On-Demand Data

NameIdCountryDate
Jennifer Amigon1000Spain2026-04-18
Leja Caldarera1001Argentina2026-04-02
Rodrigues Campain1002Brazil2026-04-21
James Butt1003Argentina2026-04-13
Isabel Bowley1004Germany2026-04-14
Tony Foller1005India2026-04-07
Ashley Doe1006Japan2026-03-29
Salvatore Stockham1007India2026-04-08
Aika Inouye1008Russia2026-03-27
Izzy Garufi1009Italy2026-04-01
Maisha Rulapaugh1010India2026-04-11
Julie Stenseth1011Japan2026-04-03
Johnson Sergi1012Canada2026-04-06
Alejandro Perin1013Spain2026-03-25
James Butt1014Japan2026-04-20
Izzy Garufi1015Japan2026-04-10
Isabel Bowley1016Argentina2026-04-20
Cody Saylors1017India2026-03-26
Francesco Shinko1018India2026-04-02
Cody Saylors1019Canada2026-03-27
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Greenwood BologniaCanadaAmy Elsner QUALIFIED
Jennifer AmigonFranceBernardo Dominic NEGOTIATION
Juan WieserRussiaOnyama Limba PROPOSAL
Johnson SergiRussiaBernardo Dominic UNQUALIFIED
Kaitlin OstroskyBrazilOnyama Limba RENEWAL
Aditya KuskoUnited KingdomElwin Sharvill NEGOTIATION
Julie StensethArgentinaXuxue Feng RENEWAL
Kaitlin OstroskyFranceAsiya Javayant RENEWAL
Cody SaylorsFranceAmy Elsner UNQUALIFIED
Kaitlin OstroskyFranceIvan Magalhaes RENEWAL
Silvio SlusarskiBrazilElwin Sharvill NEW
Johnson SergiAustraliaIoni Bowcher NEGOTIATION
Clifford RimAustraliaIoni Bowcher PROPOSAL
Alejandro PerinBrazilElwin Sharvill NEW
Rodrigues CampainUnited KingdomXuxue Feng PROPOSAL
Adams MorascaFranceXuxue Feng NEGOTIATION
Deepesh ChuiCanadaAmy Elsner NEGOTIATION
Smith GlickGermanyAnna Fali NEGOTIATION
Kadeem FlosiJapanAsiya Javayant NEGOTIATION
Munro FerenczCanadaAmy Elsner NEGOTIATION
Rodrigues CampainIndiaAsiya Javayant QUALIFIED
Smith GlickCanadaIvan Magalhaes NEW
Salvatore StockhamJapanXuxue Feng PROPOSAL
Izzy GarufiSpainIvan Magalhaes NEW
Adams MorascaUnited KingdomBernardo Dominic QUALIFIED
Cody SaylorsAustraliaBernardo Dominic RENEWAL
Munro FerenczAustraliaIoni Bowcher NEGOTIATION
Morrow RutaGermanyAnna Fali NEW
Nicolas IturbideUnited KingdomIoni Bowcher PROPOSAL
Silvio SlusarskiBrazilAsiya Javayant RENEWAL
David DarakjyFranceStephen Shaw UNQUALIFIED
Darci PoquetteSpainAsiya Javayant NEGOTIATION
Mayumi KolmetzCanadaStephen Shaw QUALIFIED
Aditya KuskoIndiaElwin Sharvill PROPOSAL
Maria MarrierFranceOnyama Limba NEW
Salvatore StockhamSpainStephen Shaw NEGOTIATION
Sinclair WaycottJapanAsiya Javayant PROPOSAL
Ashley DoeFranceAnna Fali NEGOTIATION
Izzy GarufiItalyAnna Fali PROPOSAL
Chavez BriddickArgentinaOnyama Limba 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>