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
Sinclair WaycottSpainAmy Elsner QUALIFIED
Claire TollnerItalyBernardo Dominic NEW
Leja CaldareraJapanXuxue Feng NEW
Kadeem FlosiItalyAnna Fali NEW
Smith GlickJapanStephen Shaw NEW
Silvio SlusarskiCanadaIvan Magalhaes PROPOSAL
Claire TollnerFranceOnyama Limba UNQUALIFIED
Johnson SergiCanadaAsiya Javayant RENEWAL
Cody SaylorsCanadaBernardo Dominic NEGOTIATION
Costa DilliardRussiaIvan Magalhaes RENEWAL
Smith GlickIndiaElwin Sharvill RENEWAL
Silvio SlusarskiFranceElwin Sharvill QUALIFIED
Maria MarrierRussiaIvan Magalhaes QUALIFIED
Antonio CaudyItalyAnna Fali NEW
Mayumi KolmetzGermanyAnna Fali UNQUALIFIED
Nicolas IturbideArgentinaAmy Elsner RENEWAL
Munro FerenczCanadaAmy Elsner QUALIFIED
Murillo MaletArgentinaAsiya Javayant UNQUALIFIED
Misaki RoysterAustraliaBernardo Dominic RENEWAL
Faith GillianJapanAmy Elsner NEGOTIATION
Leon OldroydJapanOnyama Limba UNQUALIFIED
Jennifer AmigonGermanyStephen Shaw NEW
Nicolas IturbideFranceBernardo Dominic RENEWAL
Kadeem FlosiIndiaIvan Magalhaes PROPOSAL
Claire TollnerRussiaElwin Sharvill RENEWAL
Arvin AlbaresCanadaElwin Sharvill UNQUALIFIED
Jones VocelkaJapanStephen Shaw PROPOSAL
Murillo MaletIndiaAsiya Javayant NEGOTIATION
Munro FerenczGermanyStephen Shaw NEW
Alejandro PerinCanadaElwin Sharvill NEGOTIATION
Jennifer AmigonGermanyIoni Bowcher NEGOTIATION
Johnson SergiFranceXuxue Feng PROPOSAL
Clifford RimFranceAnna Fali NEW
Ricardo GauchoAustraliaBernardo Dominic PROPOSAL
James ButtBrazilAsiya Javayant PROPOSAL
Alejandro PerinGermanyXuxue Feng QUALIFIED
Arvin AlbaresCanadaXuxue Feng NEGOTIATION
Misaki RoysterRussiaIoni Bowcher UNQUALIFIED
Morrow RutaAustraliaBernardo Dominic QUALIFIED
Ashley DoeCanadaIoni Bowcher QUALIFIED
Kaitlin OstroskyRussiaAsiya Javayant UNQUALIFIED
Kaitlin OstroskyJapanAsiya Javayant NEGOTIATION
Murillo MaletAustraliaXuxue Feng PROPOSAL
Jeanfrancois VenereItalyAmy Elsner NEW
Smith GlickIndiaIoni Bowcher NEGOTIATION
Munro FerenczSpainElwin Sharvill NEW
Jeanfrancois VenereCanadaAmy Elsner UNQUALIFIED
Adams MorascaGermanyIvan Magalhaes NEGOTIATION
Jones VocelkaIndiaElwin Sharvill PROPOSAL
Adams MorascaJapanAmy Elsner NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Ricardo GauchoSpainXuxue Feng QUALIFIED
Wickens NestleJapanOnyama Limba NEGOTIATION
Octavia MaletJapanOnyama Limba UNQUALIFIED
Ricardo GauchoRussiaStephen Shaw RENEWAL
Jeanfrancois VenereFranceIoni Bowcher PROPOSAL
Misaki RoysterFranceAnna Fali UNQUALIFIED
Aruna FigeroaIndiaAmy Elsner PROPOSAL
Deepesh ChuiGermanyIoni Bowcher PROPOSAL
Ricardo GauchoSpainAsiya Javayant RENEWAL
Rodrigues CampainGermanyElwin Sharvill RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Claire TollnerGermany2026-04-13Chapman, Ross E Esq NEW4Anna Fali
1001Munro FerenczUnited Kingdom2026-04-05Chanay, Jeffrey A Esq NEGOTIATION32Ivan Magalhaes
1002Arvin AlbaresRussia2026-04-02Chemel, James L Cpa NEGOTIATION7Anna Fali
1003Deepesh ChuiBrazil2026-04-14Feltz Printing Service NEW83Elwin Sharvill
1004Leon OldroydJapan2026-04-15Rousseaux, Michael Esq RENEWAL21Anna Fali
1005Mayumi KolmetzJapan2026-04-17Dorl, James J Esq QUALIFIED42Anna Fali
1006Aika InouyeGermany2026-04-27Chemel, James L Cpa UNQUALIFIED79Stephen Shaw
1007Octavia MaletFrance2026-04-01Chemel, James L Cpa UNQUALIFIED23Elwin Sharvill
1008Ashley DoeIndia2026-03-31Feiner Bros QUALIFIED50Anna Fali
1009Emily WhobreyBrazil2026-04-22Chemel, James L Cpa NEGOTIATION39Elwin Sharvill
1010Misaki RoysterBrazil2026-04-03Printing Dimensions QUALIFIED53Amy Elsner
1011Aditya KuskoGermany2026-04-14Chemel, James L Cpa UNQUALIFIED27Asiya Javayant
1012Arvin AlbaresSpain2026-04-07Feltz Printing Service QUALIFIED30Bernardo Dominic
1013Jeanfrancois VenereArgentina2026-04-15Chemel, James L Cpa RENEWAL5Anna Fali
1014Misaki RoysterFrance2026-04-23Buckley Miller Wright UNQUALIFIED67Ioni Bowcher
1015Faith GillianUnited Kingdom2026-04-04Chanay, Jeffrey A Esq UNQUALIFIED64Amy Elsner
1016Darci PoquetteIndia2026-04-10Buckley Miller Wright NEW43Bernardo Dominic
1017Aika InouyeFrance2026-04-16Commercial Press QUALIFIED38Ivan Magalhaes
1018Greenwood BologniaFrance2026-04-12King, Christopher A Esq NEW92Xuxue Feng
1019Adams MorascaSpain2026-04-27Printing Dimensions PROPOSAL72Xuxue Feng
1020Mayumi KolmetzAustralia2026-04-26Chemel, James L Cpa PROPOSAL71Ivan Magalhaes
1021Stacey MacleadSpain2026-04-07Buckley Miller Wright UNQUALIFIED24Ioni Bowcher
1022Misaki RoysterBrazil2026-04-05Chanay, Jeffrey A Esq UNQUALIFIED31Elwin Sharvill
1023Tony FollerIndia2026-04-15Buckley Miller Wright NEGOTIATION97Asiya Javayant
1024Murillo MaletArgentina2026-04-20Feltz Printing Service NEGOTIATION53Ioni Bowcher
1025Isabel BowleyAustralia2026-04-08Rangoni Of Florence NEW42Bernardo Dominic
1026Clifford RimBrazil2026-04-25King, Christopher A Esq QUALIFIED84Onyama Limba
1027Smith GlickIndia2026-04-03Commercial Press QUALIFIED45Onyama Limba
1028Isabel BowleyIndia2026-04-14Feltz Printing Service NEW95Amy Elsner
1029Claire TollnerFrance2026-04-19Commercial Press QUALIFIED91Amy Elsner
1030Leon OldroydFrance2026-04-20Morlong Associates NEW67Amy Elsner
1031Murillo MaletCanada2026-04-03Chemel, James L Cpa QUALIFIED92Asiya Javayant
1032Chavez BriddickSpain2026-04-08King, Christopher A Esq NEGOTIATION99Ivan Magalhaes
1033Julie StensethUnited Kingdom2026-03-30Rangoni Of Florence NEGOTIATION87Stephen Shaw
1034Deepesh ChuiArgentina2026-04-12Feltz Printing Service NEW26Elwin Sharvill
1035Silvio SlusarskiJapan2026-04-01King, Christopher A Esq QUALIFIED1Bernardo Dominic
1036Aruna FigeroaItaly2026-04-04Buckley Miller Wright PROPOSAL73Anna Fali
1037Rodrigues CampainSpain2026-04-18Feltz Printing Service UNQUALIFIED5Elwin Sharvill
1038Johnson SergiItaly2026-04-23Feiner Bros QUALIFIED1Bernardo Dominic
1039Deepesh ChuiCanada2026-04-01Morlong Associates NEGOTIATION65Xuxue Feng
1040Sinclair WaycottRussia2026-04-06Morlong Associates NEW67Ivan Magalhaes
1041Ashley DoeIndia2026-04-03Rousseaux, Michael Esq PROPOSAL53Asiya Javayant
1042Smith GlickArgentina2026-04-15Chapman, Ross E Esq PROPOSAL66Asiya Javayant
1043Jeanfrancois VenereRussia2026-03-30Commercial Press PROPOSAL91Stephen Shaw
1044Clifford RimArgentina2026-04-01Chemel, James L Cpa QUALIFIED89Onyama Limba
1045Silvio SlusarskiRussia2026-04-13Feltz Printing Service NEGOTIATION79Bernardo Dominic
1046Jefferson SchemmerBrazil2026-04-01Buckley Miller Wright RENEWAL58Ioni Bowcher
1047James ButtGermany2026-04-13Buckley Miller Wright RENEWAL53Stephen Shaw
1048Mujtaba NickaBrazil2026-04-11Dorl, James J Esq NEGOTIATION74Stephen Shaw
1049Francesco ShinkoRussia2026-04-10Printing Dimensions NEW49Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
James ButtGermanyOnyama Limba RENEWAL
David DarakjyAustraliaAmy Elsner QUALIFIED
Greenwood BologniaUnited KingdomBernardo Dominic PROPOSAL
Octavia MaletRussiaBernardo Dominic PROPOSAL
Greenwood BologniaIndiaAmy Elsner PROPOSAL
Murillo MaletIndiaIvan Magalhaes RENEWAL
Cody SaylorsCanadaStephen Shaw UNQUALIFIED
Nicolas IturbideArgentinaXuxue Feng UNQUALIFIED
Stacey MacleadFranceBernardo Dominic QUALIFIED
Jeanfrancois VenereFranceElwin Sharvill RENEWAL
Maria MarrierCanadaStephen Shaw QUALIFIED
Aika InouyeCanadaElwin Sharvill NEGOTIATION
Aika InouyeUnited KingdomElwin Sharvill NEW
Morrow RutaArgentinaElwin Sharvill PROPOSAL
Salvatore StockhamFranceBernardo Dominic RENEWAL
Smith GlickSpainAnna Fali PROPOSAL
Faith GillianFranceBernardo Dominic RENEWAL
Arvin AlbaresAustraliaXuxue Feng UNQUALIFIED
Smith GlickArgentinaElwin Sharvill NEW
Jennifer AmigonRussiaElwin Sharvill PROPOSAL
Francesco ShinkoSpainBernardo Dominic UNQUALIFIED
Ricardo GauchoSpainStephen Shaw NEW
Cody SaylorsItalyOnyama Limba NEGOTIATION
Alejandro PerinFranceAnna Fali NEW
Julie StensethArgentinaElwin Sharvill NEW
Jennifer AmigonCanadaIoni Bowcher UNQUALIFIED
Aditya KuskoUnited KingdomAnna Fali NEW
Costa DilliardArgentinaIoni Bowcher NEGOTIATION
Smith GlickArgentinaBernardo Dominic RENEWAL
Cody SaylorsBrazilElwin Sharvill PROPOSAL
Francesco ShinkoGermanyIoni Bowcher UNQUALIFIED
Nicolas IturbideItalyAmy Elsner NEGOTIATION
Leon OldroydArgentinaIvan Magalhaes PROPOSAL
Antonio CaudyUnited KingdomElwin Sharvill PROPOSAL
Aditya KuskoAustraliaIoni Bowcher QUALIFIED
Nicolas IturbideJapanAsiya Javayant NEGOTIATION
Aika InouyeRussiaStephen Shaw QUALIFIED
Faith GillianAustraliaBernardo Dominic NEW
Francesco ShinkoSpainIoni Bowcher NEW
Octavia MaletItalyAnna Fali NEGOTIATION
Ricardo GauchoGermanyAmy Elsner NEW
Tony FollerUnited KingdomBernardo Dominic NEW
Octavia MaletJapanAsiya Javayant NEGOTIATION
Misaki RoysterIndiaAsiya Javayant NEW
Mayumi KolmetzGermanyAsiya Javayant PROPOSAL
Izzy GarufiIndiaAnna Fali PROPOSAL
Jeanfrancois VenereBrazilIvan Magalhaes PROPOSAL
Jeanfrancois VenereBrazilElwin Sharvill PROPOSAL
Sinclair WaycottGermanyBernardo Dominic RENEWAL
Alejandro PerinSpainIvan Magalhaes QUALIFIED
Frozen Columns
Name
Ricardo Gaucho
Adams Morasca
Claire Tollner
Aditya Kusko
Misaki Royster
Wickens Nestle
Arvin Albares
Alejandro Perin
Rodrigues Campain
Morrow Ruta
Emily Whobrey
Isabel Bowley
Izzy Garufi
Mayumi Kolmetz
Wickens Nestle
Ivar Paprocki
Leja Caldarera
Maisha Rulapaugh
Aditya Kusko
Claire Tollner
Jeanfrancois Venere
Claire Tollner
Munro Ferencz
Maisha Rulapaugh
Juan Wieser
Aika Inouye
Julie Stenseth
Ricardo Gaucho
Costa Dilliard
Izzy Garufi
Morrow Ruta
Nicolas Iturbide
Adams Morasca
Jennifer Amigon
Nicolas Iturbide
Maisha Rulapaugh
Adams Morasca
Isabel Bowley
Alejandro Perin
Sinclair Waycott
David Darakjy
Clifford Rim
Maria Marrier
Darci Poquette
Jones Vocelka
Leon Oldroyd
Greenwood Bolognia
Juan Wieser
Faith Gillian
Claire Tollner
IdCountryDate
1000Canada2026-04-22
1001Australia2026-04-15
1002United Kingdom2026-04-26
1003Australia2026-04-27
1004Italy2026-04-17
1005Germany2026-03-31
1006Russia2026-04-23
1007Japan2026-04-17
1008Canada2026-04-01
1009United Kingdom2026-04-19
1010India2026-04-26
1011France2026-04-12
1012Argentina2026-04-14
1013Canada2026-04-16
1014Spain2026-04-07
1015Brazil2026-04-01
1016Australia2026-04-13
1017Spain2026-03-31
1018Spain2026-03-31
1019Japan2026-04-05
1020Brazil2026-04-05
1021Argentina2026-04-23
1022Russia2026-04-16
1023Germany2026-04-23
1024Russia2026-04-01
1025Russia2026-04-12
1026India2026-04-09
1027Spain2026-04-08
1028Australia2026-04-05
1029Spain2026-04-20
1030France2026-04-24
1031Germany2026-04-14
1032Germany2026-04-26
1033India2026-04-07
1034Argentina2026-04-19
1035Brazil2026-04-04
1036Argentina2026-04-05
1037Australia2026-04-13
1038Australia2026-03-31
1039Argentina2026-04-16
1040Brazil2026-04-13
1041Italy2026-04-07
1042Italy2026-04-15
1043Italy2026-04-25
1044Russia2026-04-16
1045Russia2026-04-04
1046United Kingdom2026-03-30
1047United Kingdom2026-04-09
1048Italy2026-04-08
1049Australia2026-04-13

On-Demand Data

NameIdCountryDate
Sinclair Waycott1000Canada2026-04-27
Munro Ferencz1001Germany2026-04-12
Murillo Malet1002Italy2026-04-27
Ivar Paprocki1003United Kingdom2026-04-13
Izzy Garufi1004Germany2026-04-07
Smith Glick1005Germany2026-04-17
Leon Oldroyd1006Russia2026-04-26
Munro Ferencz1007India2026-04-19
Jennifer Amigon1008France2026-04-09
Nicolas Iturbide1009India2026-03-30
Salvatore Stockham1010Italy2026-04-17
Octavia Malet1011Italy2026-04-18
Aruna Figeroa1012Russia2026-04-09
Greenwood Bolognia1013Italy2026-04-20
David Darakjy1014Canada2026-04-05
Claire Tollner1015Spain2026-04-08
Emily Whobrey1016France2026-04-07
Cody Saylors1017Argentina2026-03-31
Morrow Ruta1018Russia2026-04-08
Rodrigues Campain1019Japan2026-04-17
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Ricardo GauchoBrazilAmy Elsner PROPOSAL
James ButtSpainAmy Elsner PROPOSAL
Emily WhobreyBrazilAnna Fali NEGOTIATION
Jeanfrancois VenereSpainXuxue Feng PROPOSAL
Izzy GarufiCanadaOnyama Limba NEW
Smith GlickItalyIvan Magalhaes RENEWAL
Ashley DoeIndiaAnna Fali NEW
Salvatore StockhamAustraliaAnna Fali NEGOTIATION
Salvatore StockhamArgentinaStephen Shaw NEW
Silvio SlusarskiAustraliaOnyama Limba PROPOSAL
Tony FollerCanadaAmy Elsner QUALIFIED
Stacey MacleadItalyIvan Magalhaes UNQUALIFIED
Munro FerenczRussiaIvan Magalhaes PROPOSAL
Nicolas IturbideAustraliaAnna Fali UNQUALIFIED
Greenwood BologniaBrazilAnna Fali QUALIFIED
Clifford RimFranceOnyama Limba RENEWAL
Julie StensethGermanyAnna Fali NEGOTIATION
Jeanfrancois VenereArgentinaIvan Magalhaes NEW
Clifford RimBrazilAnna Fali PROPOSAL
Salvatore StockhamAustraliaXuxue Feng NEGOTIATION
Aika InouyeBrazilStephen Shaw NEW
Munro FerenczAustraliaAmy Elsner PROPOSAL
Clifford RimJapanAmy Elsner QUALIFIED
Wickens NestleItalyAmy Elsner RENEWAL
Costa DilliardUnited KingdomIvan Magalhaes PROPOSAL
Jones VocelkaIndiaXuxue Feng PROPOSAL
Julie StensethBrazilIoni Bowcher NEGOTIATION
Nicolas IturbideArgentinaAmy Elsner UNQUALIFIED
Kadeem FlosiUnited KingdomAmy Elsner RENEWAL
Leja CaldareraCanadaOnyama Limba RENEWAL
Wickens NestleBrazilOnyama Limba QUALIFIED
Arvin AlbaresIndiaElwin Sharvill QUALIFIED
Chavez BriddickSpainIvan Magalhaes NEGOTIATION
Aruna FigeroaSpainOnyama Limba NEW
Misaki RoysterItalyXuxue Feng RENEWAL
Smith GlickItalyElwin Sharvill QUALIFIED
Aika InouyeUnited KingdomAsiya Javayant UNQUALIFIED
Julie StensethUnited KingdomElwin Sharvill PROPOSAL
Darci PoquetteSpainOnyama Limba QUALIFIED
Mayumi KolmetzGermanyAsiya Javayant NEGOTIATION

<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>