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
Ricardo GauchoRussiaAnna Fali NEW
Isabel BowleyUnited KingdomStephen Shaw NEGOTIATION
Claire TollnerFranceElwin Sharvill RENEWAL
Ashley DoeJapanXuxue Feng RENEWAL
Mujtaba NickaArgentinaBernardo Dominic NEGOTIATION
Isabel BowleySpainIoni Bowcher UNQUALIFIED
Ashley DoeAustraliaAnna Fali UNQUALIFIED
Sinclair WaycottUnited KingdomAmy Elsner PROPOSAL
Mujtaba NickaRussiaIoni Bowcher RENEWAL
Salvatore StockhamBrazilElwin Sharvill UNQUALIFIED
Octavia MaletArgentinaIoni Bowcher RENEWAL
Kaitlin OstroskyRussiaAsiya Javayant UNQUALIFIED
Ricardo GauchoIndiaStephen Shaw NEW
Francesco ShinkoItalyAnna Fali UNQUALIFIED
James ButtFranceStephen Shaw UNQUALIFIED
Julie StensethRussiaAsiya Javayant UNQUALIFIED
Cody SaylorsIndiaElwin Sharvill UNQUALIFIED
Morrow RutaFranceAmy Elsner RENEWAL
Leon OldroydGermanyElwin Sharvill RENEWAL
Aditya KuskoArgentinaElwin Sharvill QUALIFIED
Emily WhobreyIndiaAsiya Javayant PROPOSAL
Adams MorascaItalyBernardo Dominic RENEWAL
Leja CaldareraSpainIvan Magalhaes UNQUALIFIED
Jeanfrancois VenereBrazilBernardo Dominic PROPOSAL
Maisha RulapaughItalyStephen Shaw NEGOTIATION
Chavez BriddickSpainAmy Elsner RENEWAL
Nicolas IturbideIndiaAsiya Javayant QUALIFIED
Wickens NestleItalyIoni Bowcher NEGOTIATION
James ButtJapanElwin Sharvill UNQUALIFIED
Tony FollerArgentinaStephen Shaw NEGOTIATION
Jones VocelkaGermanyOnyama Limba RENEWAL
Jeanfrancois VenereAustraliaAsiya Javayant RENEWAL
Kaitlin OstroskySpainIvan Magalhaes PROPOSAL
Tony FollerJapanBernardo Dominic RENEWAL
Chavez BriddickJapanAnna Fali NEGOTIATION
Izzy GarufiRussiaAsiya Javayant UNQUALIFIED
Munro FerenczUnited KingdomIvan Magalhaes RENEWAL
Aditya KuskoSpainAnna Fali PROPOSAL
Salvatore StockhamGermanyIoni Bowcher RENEWAL
Isabel BowleyGermanyIvan Magalhaes PROPOSAL
Kadeem FlosiFranceStephen Shaw UNQUALIFIED
Leja CaldareraSpainAsiya Javayant NEW
Costa DilliardAustraliaBernardo Dominic NEW
Rodrigues CampainFranceStephen Shaw NEGOTIATION
Wickens NestleRussiaStephen Shaw QUALIFIED
Aruna FigeroaSpainElwin Sharvill RENEWAL
Tony FollerIndiaAnna Fali RENEWAL
Stacey MacleadGermanyAnna Fali PROPOSAL
Jennifer AmigonArgentinaOnyama Limba NEGOTIATION
Johnson SergiSpainElwin Sharvill UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Isabel BowleyFranceBernardo Dominic QUALIFIED
Izzy GarufiAustraliaXuxue Feng NEGOTIATION
Nicolas IturbideBrazilIoni Bowcher PROPOSAL
Smith GlickFranceBernardo Dominic NEW
Silvio SlusarskiFranceAnna Fali PROPOSAL
Greenwood BologniaAustraliaOnyama Limba NEW
Ricardo GauchoJapanElwin Sharvill PROPOSAL
Deepesh ChuiBrazilStephen Shaw UNQUALIFIED
Faith GillianGermanyXuxue Feng NEW
Munro FerenczSpainIoni Bowcher UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Deepesh ChuiArgentina2025-08-12Feltz Printing Service NEGOTIATION1Ivan Magalhaes
1001Alejandro PerinIndia2025-08-05Commercial Press PROPOSAL59Bernardo Dominic
1002Mayumi KolmetzAustralia2025-07-19Feiner Bros QUALIFIED3Xuxue Feng
1003Ivar PaprockiBrazil2025-07-24Morlong Associates PROPOSAL8Onyama Limba
1004Nicolas IturbideAustralia2025-08-04Morlong Associates UNQUALIFIED68Elwin Sharvill
1005Nicolas IturbideIndia2025-08-04Morlong Associates UNQUALIFIED52Amy Elsner
1006Greenwood BologniaRussia2025-07-27Chanay, Jeffrey A Esq NEW23Elwin Sharvill
1007Stacey MacleadBrazil2025-07-29Chemel, James L Cpa PROPOSAL32Ivan Magalhaes
1008Darci PoquetteJapan2025-08-03Feiner Bros NEW57Stephen Shaw
1009Costa DilliardUnited Kingdom2025-08-12Chapman, Ross E Esq QUALIFIED80Xuxue Feng
1010Izzy GarufiBrazil2025-08-07Rousseaux, Michael Esq QUALIFIED73Ivan Magalhaes
1011Chavez BriddickGermany2025-08-14King, Christopher A Esq QUALIFIED13Amy Elsner
1012Morrow RutaUnited Kingdom2025-08-10Truhlar And Truhlar Attys NEW90Anna Fali
1013Arvin AlbaresBrazil2025-07-25Buckley Miller Wright UNQUALIFIED33Elwin Sharvill
1014Francesco ShinkoRussia2025-08-11Chemel, James L Cpa NEW67Stephen Shaw
1015Jones VocelkaAustralia2025-08-04Dorl, James J Esq NEW48Stephen Shaw
1016Costa DilliardBrazil2025-08-14Feltz Printing Service RENEWAL14Elwin Sharvill
1017Chavez BriddickJapan2025-08-11Buckley Miller Wright QUALIFIED29Ioni Bowcher
1018Munro FerenczUnited Kingdom2025-08-14Rousseaux, Michael Esq NEGOTIATION35Anna Fali
1019Emily WhobreyRussia2025-07-24Buckley Miller Wright NEGOTIATION59Onyama Limba
1020Jones VocelkaRussia2025-07-28Rangoni Of Florence NEGOTIATION97Xuxue Feng
1021Deepesh ChuiBrazil2025-07-23Commercial Press NEGOTIATION84Stephen Shaw
1022Izzy GarufiItaly2025-08-11Dorl, James J Esq NEGOTIATION65Amy Elsner
1023Faith GillianGermany2025-08-10Morlong Associates RENEWAL55Amy Elsner
1024Silvio SlusarskiItaly2025-08-11Printing Dimensions QUALIFIED49Ivan Magalhaes
1025Antonio CaudyArgentina2025-08-11Rousseaux, Michael Esq NEGOTIATION74Asiya Javayant
1026Greenwood BologniaGermany2025-08-11Benton, John B Jr UNQUALIFIED26Anna Fali
1027Morrow RutaItaly2025-07-20King, Christopher A Esq NEW51Anna Fali
1028Claire TollnerGermany2025-08-08Benton, John B Jr NEGOTIATION5Ivan Magalhaes
1029David DarakjyGermany2025-08-06Dorl, James J Esq NEGOTIATION4Asiya Javayant
1030Chavez BriddickArgentina2025-07-30Feltz Printing Service UNQUALIFIED73Onyama Limba
1031Ashley DoeRussia2025-07-25Rangoni Of Florence NEW89Elwin Sharvill
1032Murillo MaletRussia2025-08-02Feltz Printing Service NEGOTIATION18Asiya Javayant
1033Juan WieserItaly2025-08-07Chanay, Jeffrey A Esq QUALIFIED82Stephen Shaw
1034Costa DilliardUnited Kingdom2025-07-31Printing Dimensions RENEWAL86Elwin Sharvill
1035Ashley DoeIndia2025-07-21Morlong Associates NEW72Xuxue Feng
1036Stacey MacleadGermany2025-07-20Printing Dimensions QUALIFIED88Amy Elsner
1037Ivar PaprockiBrazil2025-07-18Chapman, Ross E Esq NEGOTIATION91Stephen Shaw
1038Clifford RimItaly2025-07-20Feltz Printing Service RENEWAL86Ivan Magalhaes
1039Isabel BowleyCanada2025-07-27Benton, John B Jr NEGOTIATION51Anna Fali
1040Leja CaldareraUnited Kingdom2025-08-11King, Christopher A Esq NEW92Amy Elsner
1041James ButtAustralia2025-07-31Chemel, James L Cpa PROPOSAL54Ivan Magalhaes
1042Clifford RimUnited Kingdom2025-07-24Dorl, James J Esq QUALIFIED86Elwin Sharvill
1043Emily WhobreyJapan2025-07-23Chapman, Ross E Esq NEGOTIATION21Bernardo Dominic
1044Alejandro PerinFrance2025-07-29Benton, John B Jr PROPOSAL28Stephen Shaw
1045Arvin AlbaresUnited Kingdom2025-07-21Benton, John B Jr PROPOSAL13Stephen Shaw
1046James ButtBrazil2025-07-17King, Christopher A Esq PROPOSAL12Bernardo Dominic
1047Arvin AlbaresSpain2025-08-04Dorl, James J Esq RENEWAL49Bernardo Dominic
1048Cody SaylorsArgentina2025-07-19Truhlar And Truhlar Attys NEW60Elwin Sharvill
1049Antonio CaudyArgentina2025-07-29Benton, John B Jr NEW80Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Emily WhobreyGermanyElwin Sharvill NEGOTIATION
Aika InouyeAustraliaStephen Shaw QUALIFIED
Cody SaylorsUnited KingdomIvan Magalhaes UNQUALIFIED
James ButtSpainElwin Sharvill NEGOTIATION
Munro FerenczGermanyOnyama Limba UNQUALIFIED
Ricardo GauchoCanadaAsiya Javayant UNQUALIFIED
James ButtGermanyBernardo Dominic UNQUALIFIED
Izzy GarufiCanadaAsiya Javayant UNQUALIFIED
Jefferson SchemmerSpainIoni Bowcher UNQUALIFIED
Rodrigues CampainArgentinaXuxue Feng PROPOSAL
Darci PoquetteIndiaAnna Fali NEW
Maria MarrierUnited KingdomAmy Elsner NEW
Johnson SergiArgentinaAsiya Javayant QUALIFIED
Leon OldroydSpainAsiya Javayant UNQUALIFIED
Octavia MaletBrazilOnyama Limba RENEWAL
Octavia MaletFranceAmy Elsner NEW
Mujtaba NickaRussiaAmy Elsner QUALIFIED
Deepesh ChuiBrazilIoni Bowcher NEGOTIATION
Jones VocelkaFranceAnna Fali PROPOSAL
Wickens NestleRussiaIvan Magalhaes RENEWAL
Mayumi KolmetzItalyIoni Bowcher UNQUALIFIED
Adams MorascaBrazilOnyama Limba NEW
Arvin AlbaresFranceStephen Shaw NEGOTIATION
Ashley DoeUnited KingdomElwin Sharvill NEGOTIATION
Sinclair WaycottAustraliaBernardo Dominic QUALIFIED
Costa DilliardBrazilOnyama Limba PROPOSAL
Kaitlin OstroskyUnited KingdomOnyama Limba UNQUALIFIED
Murillo MaletJapanOnyama Limba UNQUALIFIED
Julie StensethJapanAnna Fali QUALIFIED
David DarakjyArgentinaAsiya Javayant NEW
Jennifer AmigonRussiaXuxue Feng NEW
Kadeem FlosiFranceIvan Magalhaes UNQUALIFIED
Alejandro PerinCanadaOnyama Limba NEW
Nicolas IturbideItalyAsiya Javayant NEGOTIATION
Stacey MacleadFranceElwin Sharvill NEGOTIATION
Misaki RoysterBrazilOnyama Limba NEW
Leon OldroydUnited KingdomStephen Shaw NEW
Francesco ShinkoFranceIoni Bowcher NEGOTIATION
Izzy GarufiRussiaIoni Bowcher PROPOSAL
Nicolas IturbideFranceIvan Magalhaes NEGOTIATION
Ashley DoeArgentinaIoni Bowcher UNQUALIFIED
Salvatore StockhamSpainIoni Bowcher PROPOSAL
Tony FollerFranceStephen Shaw RENEWAL
Darci PoquetteRussiaAsiya Javayant NEGOTIATION
Stacey MacleadArgentinaXuxue Feng QUALIFIED
Rodrigues CampainSpainAnna Fali NEGOTIATION
Jefferson SchemmerAustraliaBernardo Dominic RENEWAL
Deepesh ChuiFranceIvan Magalhaes PROPOSAL
Jeanfrancois VenereGermanyElwin Sharvill NEW
David DarakjyJapanOnyama Limba NEW
Frozen Columns
Name
Tony Foller
Maria Marrier
Emily Whobrey
Aditya Kusko
Adams Morasca
Cody Saylors
Rodrigues Campain
Sinclair Waycott
Ashley Doe
Ricardo Gaucho
Murillo Malet
Jennifer Amigon
Mayumi Kolmetz
Leja Caldarera
Aruna Figeroa
Leon Oldroyd
Adams Morasca
Morrow Ruta
Clifford Rim
Munro Ferencz
Kadeem Flosi
Ashley Doe
Emily Whobrey
Costa Dilliard
Jones Vocelka
Aditya Kusko
Jones Vocelka
Tony Foller
Aruna Figeroa
Claire Tollner
Kadeem Flosi
Octavia Malet
Salvatore Stockham
Antonio Caudy
Stacey Maclead
Julie Stenseth
Cody Saylors
Isabel Bowley
Claire Tollner
Juan Wieser
Octavia Malet
Emily Whobrey
Claire Tollner
Emily Whobrey
Mujtaba Nicka
Greenwood Bolognia
Salvatore Stockham
David Darakjy
Alejandro Perin
Sinclair Waycott
IdCountryDate
1000Germany2025-08-09
1001India2025-07-30
1002France2025-08-05
1003Russia2025-08-03
1004Spain2025-08-05
1005India2025-08-01
1006Australia2025-07-28
1007Australia2025-07-24
1008Italy2025-08-11
1009United Kingdom2025-08-13
1010Japan2025-08-05
1011Russia2025-08-14
1012Russia2025-07-26
1013Russia2025-07-29
1014Italy2025-07-30
1015Argentina2025-07-18
1016Russia2025-07-31
1017India2025-07-27
1018Japan2025-07-20
1019Spain2025-08-15
1020Russia2025-08-03
1021Russia2025-08-10
1022Brazil2025-07-29
1023Germany2025-07-21
1024Italy2025-08-02
1025Italy2025-07-22
1026United Kingdom2025-07-18
1027Russia2025-07-22
1028Canada2025-08-08
1029Canada2025-07-23
1030Russia2025-07-22
1031Russia2025-07-24
1032Argentina2025-08-09
1033Italy2025-08-14
1034United Kingdom2025-07-17
1035Canada2025-08-04
1036Argentina2025-08-10
1037Russia2025-08-15
1038France2025-07-28
1039United Kingdom2025-07-21
1040Russia2025-08-14
1041Argentina2025-08-01
1042Italy2025-08-11
1043Germany2025-07-26
1044Russia2025-07-31
1045India2025-07-23
1046Italy2025-08-02
1047France2025-08-04
1048France2025-08-06
1049Australia2025-07-30

On-Demand Data

NameIdCountryDate
David Darakjy1000Spain2025-07-29
Jennifer Amigon1001United Kingdom2025-08-06
Emily Whobrey1002Italy2025-08-13
Tony Foller1003Australia2025-08-06
Antonio Caudy1004India2025-08-04
Smith Glick1005Japan2025-08-15
Deepesh Chui1006United Kingdom2025-08-09
Julie Stenseth1007Brazil2025-07-18
Tony Foller1008Canada2025-07-19
Misaki Royster1009Russia2025-08-05
Maisha Rulapaugh1010Canada2025-08-07
Greenwood Bolognia1011Australia2025-07-30
Faith Gillian1012Spain2025-07-25
Arvin Albares1013United Kingdom2025-08-06
Cody Saylors1014Spain2025-07-20
Faith Gillian1015Australia2025-08-10
Alejandro Perin1016Canada2025-08-12
Morrow Ruta1017France2025-07-17
Aruna Figeroa1018Germany2025-07-31
Claire Tollner1019Spain2025-08-01
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Munro FerenczRussiaBernardo Dominic NEW
David DarakjyAustraliaIvan Magalhaes NEW
Jefferson SchemmerArgentinaBernardo Dominic RENEWAL
Leja CaldareraFranceIvan Magalhaes NEW
Ivar PaprockiGermanyStephen Shaw QUALIFIED
Ivar PaprockiJapanOnyama Limba PROPOSAL
Juan WieserCanadaAmy Elsner QUALIFIED
Faith GillianRussiaXuxue Feng RENEWAL
Ivar PaprockiArgentinaXuxue Feng PROPOSAL
Murillo MaletIndiaOnyama Limba PROPOSAL
Rodrigues CampainFranceAmy Elsner NEGOTIATION
Clifford RimUnited KingdomOnyama Limba RENEWAL
Jennifer AmigonUnited KingdomAnna Fali UNQUALIFIED
Johnson SergiItalyIvan Magalhaes QUALIFIED
Nicolas IturbideSpainAnna Fali NEW
Rodrigues CampainItalyAsiya Javayant RENEWAL
Mujtaba NickaFranceElwin Sharvill PROPOSAL
Maisha RulapaughIndiaIoni Bowcher NEW
Mayumi KolmetzSpainElwin Sharvill QUALIFIED
Chavez BriddickJapanOnyama Limba QUALIFIED
Rodrigues CampainJapanAnna Fali QUALIFIED
Adams MorascaBrazilAsiya Javayant RENEWAL
Jennifer AmigonSpainStephen Shaw PROPOSAL
Alejandro PerinIndiaIoni Bowcher PROPOSAL
David DarakjyItalyXuxue Feng RENEWAL
James ButtCanadaOnyama Limba UNQUALIFIED
Aika InouyeArgentinaIoni Bowcher NEGOTIATION
Nicolas IturbideCanadaAsiya Javayant RENEWAL
Faith GillianAustraliaAnna Fali NEGOTIATION
Morrow RutaRussiaAnna Fali PROPOSAL
Clifford RimCanadaIvan Magalhaes UNQUALIFIED
Ashley DoeUnited KingdomIoni Bowcher UNQUALIFIED
Octavia MaletArgentinaAsiya Javayant UNQUALIFIED
Adams MorascaFranceXuxue Feng NEGOTIATION
Greenwood BologniaIndiaAsiya Javayant NEW
Faith GillianCanadaBernardo Dominic QUALIFIED
Maisha RulapaughBrazilIvan Magalhaes PROPOSAL
Octavia MaletItalyBernardo Dominic NEGOTIATION
Costa DilliardSpainAnna Fali NEW
Arvin AlbaresJapanBernardo Dominic 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>