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
Claire TollnerSpainAnna Fali NEW
Jefferson SchemmerSpainAmy Elsner UNQUALIFIED
Jones VocelkaIndiaXuxue Feng PROPOSAL
Jones VocelkaItalyIvan Magalhaes NEGOTIATION
Kaitlin OstroskyAustraliaIoni Bowcher NEGOTIATION
Antonio CaudyGermanyIoni Bowcher NEW
Julie StensethUnited KingdomStephen Shaw QUALIFIED
Sinclair WaycottItalyAnna Fali UNQUALIFIED
Aruna FigeroaFranceAmy Elsner NEGOTIATION
Francesco ShinkoJapanAnna Fali NEW
Johnson SergiGermanyAnna Fali UNQUALIFIED
Greenwood BologniaFranceOnyama Limba PROPOSAL
Izzy GarufiFranceBernardo Dominic NEW
Mujtaba NickaArgentinaXuxue Feng NEW
Mujtaba NickaJapanElwin Sharvill NEGOTIATION
Ashley DoeAustraliaStephen Shaw UNQUALIFIED
Costa DilliardFranceBernardo Dominic PROPOSAL
Jones VocelkaItalyAnna Fali NEGOTIATION
Arvin AlbaresJapanAmy Elsner RENEWAL
Octavia MaletItalyAsiya Javayant UNQUALIFIED
Tony FollerArgentinaStephen Shaw PROPOSAL
Murillo MaletArgentinaXuxue Feng RENEWAL
Misaki RoysterIndiaAmy Elsner UNQUALIFIED
Arvin AlbaresCanadaAmy Elsner QUALIFIED
Morrow RutaJapanXuxue Feng QUALIFIED
James ButtAustraliaElwin Sharvill NEW
Jennifer AmigonJapanBernardo Dominic NEW
Maisha RulapaughItalyOnyama Limba NEGOTIATION
Faith GillianFranceIoni Bowcher NEGOTIATION
Leon OldroydGermanyIoni Bowcher PROPOSAL
Jones VocelkaItalyAnna Fali QUALIFIED
Aditya KuskoFranceAsiya Javayant QUALIFIED
Greenwood BologniaArgentinaAnna Fali UNQUALIFIED
Isabel BowleyFranceAsiya Javayant RENEWAL
Octavia MaletBrazilAsiya Javayant PROPOSAL
Claire TollnerUnited KingdomAsiya Javayant QUALIFIED
Kaitlin OstroskyIndiaAmy Elsner UNQUALIFIED
Aruna FigeroaBrazilBernardo Dominic NEGOTIATION
Jennifer AmigonAustraliaBernardo Dominic NEGOTIATION
Munro FerenczCanadaAnna Fali NEGOTIATION
Misaki RoysterJapanIvan Magalhaes RENEWAL
Misaki RoysterArgentinaStephen Shaw NEGOTIATION
Murillo MaletIndiaIoni Bowcher PROPOSAL
Juan WieserAustraliaAnna Fali NEW
Wickens NestleAustraliaAsiya Javayant RENEWAL
Wickens NestleSpainElwin Sharvill PROPOSAL
Jefferson SchemmerRussiaBernardo Dominic QUALIFIED
Costa DilliardAustraliaXuxue Feng NEW
Chavez BriddickIndiaBernardo Dominic NEGOTIATION
Salvatore StockhamCanadaAmy Elsner QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Cody SaylorsSpainElwin Sharvill NEW
Kadeem FlosiGermanyAnna Fali RENEWAL
David DarakjySpainAnna Fali PROPOSAL
Morrow RutaCanadaAsiya Javayant UNQUALIFIED
Clifford RimAustraliaAnna Fali UNQUALIFIED
Jeanfrancois VenereBrazilAsiya Javayant NEW
Faith GillianJapanStephen Shaw PROPOSAL
Chavez BriddickRussiaXuxue Feng NEW
Munro FerenczGermanyIoni Bowcher RENEWAL
Adams MorascaItalyOnyama Limba RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Maisha RulapaughRussia2026-05-15King, Christopher A Esq PROPOSAL38Ioni Bowcher
1001Mujtaba NickaSpain2026-05-20Morlong Associates NEGOTIATION51Stephen Shaw
1002Cody SaylorsCanada2026-05-07Chemel, James L Cpa QUALIFIED99Ivan Magalhaes
1003Jefferson SchemmerIndia2026-05-21Feiner Bros NEGOTIATION82Amy Elsner
1004Cody SaylorsCanada2026-05-13Truhlar And Truhlar Attys RENEWAL48Stephen Shaw
1005Ivar PaprockiSpain2026-05-19Rangoni Of Florence RENEWAL83Bernardo Dominic
1006Aditya KuskoIndia2026-05-11Benton, John B Jr PROPOSAL51Stephen Shaw
1007Aditya KuskoUnited Kingdom2026-04-25Feltz Printing Service UNQUALIFIED33Onyama Limba
1008Chavez BriddickArgentina2026-05-14Truhlar And Truhlar Attys UNQUALIFIED74Amy Elsner
1009Adams MorascaJapan2026-04-27Feiner Bros NEW11Onyama Limba
1010Wickens NestleAustralia2026-05-09Truhlar And Truhlar Attys NEW0Anna Fali
1011Octavia MaletCanada2026-04-28Chanay, Jeffrey A Esq QUALIFIED11Ioni Bowcher
1012Emily WhobreyCanada2026-04-27Printing Dimensions UNQUALIFIED75Ivan Magalhaes
1013Ashley DoeCanada2026-05-12Dorl, James J Esq PROPOSAL70Amy Elsner
1014Misaki RoysterSpain2026-05-21Rousseaux, Michael Esq NEW75Bernardo Dominic
1015Clifford RimGermany2026-05-09King, Christopher A Esq PROPOSAL71Elwin Sharvill
1016Claire TollnerAustralia2026-05-20Truhlar And Truhlar Attys RENEWAL36Amy Elsner
1017James ButtArgentina2026-05-05Printing Dimensions UNQUALIFIED40Ivan Magalhaes
1018Aika InouyeRussia2026-04-25Feiner Bros RENEWAL88Ioni Bowcher
1019Faith GillianUnited Kingdom2026-04-25Chanay, Jeffrey A Esq QUALIFIED42Xuxue Feng
1020David DarakjyUnited Kingdom2026-05-14Chapman, Ross E Esq RENEWAL10Anna Fali
1021David DarakjyFrance2026-05-06Commercial Press NEGOTIATION55Anna Fali
1022Leja CaldareraCanada2026-05-13Dorl, James J Esq NEW57Asiya Javayant
1023Jones VocelkaAustralia2026-05-19Rangoni Of Florence NEW42Amy Elsner
1024Stacey MacleadItaly2026-05-20Printing Dimensions PROPOSAL8Anna Fali
1025Leja CaldareraSpain2026-05-19Dorl, James J Esq RENEWAL6Stephen Shaw
1026Francesco ShinkoItaly2026-04-29Morlong Associates UNQUALIFIED85Stephen Shaw
1027Costa DilliardAustralia2026-05-05Commercial Press NEGOTIATION14Amy Elsner
1028Darci PoquetteItaly2026-05-21Morlong Associates NEW24Ivan Magalhaes
1029Arvin AlbaresFrance2026-05-22Rangoni Of Florence NEW11Elwin Sharvill
1030Chavez BriddickGermany2026-04-27Morlong Associates RENEWAL26Asiya Javayant
1031Silvio SlusarskiSpain2026-05-19Morlong Associates RENEWAL15Onyama Limba
1032David DarakjyJapan2026-05-15Chapman, Ross E Esq NEW64Stephen Shaw
1033Munro FerenczItaly2026-05-22Chemel, James L Cpa RENEWAL11Xuxue Feng
1034Morrow RutaCanada2026-04-29King, Christopher A Esq QUALIFIED22Onyama Limba
1035Emily WhobreyBrazil2026-05-12Benton, John B Jr NEGOTIATION11Ioni Bowcher
1036Faith GillianIndia2026-04-25King, Christopher A Esq NEGOTIATION11Elwin Sharvill
1037Aruna FigeroaIndia2026-05-16Morlong Associates NEGOTIATION32Onyama Limba
1038Clifford RimArgentina2026-05-09Chanay, Jeffrey A Esq NEGOTIATION62Ioni Bowcher
1039Morrow RutaJapan2026-05-12Printing Dimensions RENEWAL6Stephen Shaw
1040Leja CaldareraFrance2026-04-29Benton, John B Jr NEGOTIATION29Elwin Sharvill
1041Wickens NestleGermany2026-05-14Morlong Associates PROPOSAL18Onyama Limba
1042Alejandro PerinArgentina2026-05-15Rangoni Of Florence RENEWAL42Asiya Javayant
1043Adams MorascaIndia2026-05-07Morlong Associates UNQUALIFIED18Onyama Limba
1044Jones VocelkaCanada2026-05-24Feltz Printing Service UNQUALIFIED71Amy Elsner
1045Aika InouyeItaly2026-05-19Rangoni Of Florence NEGOTIATION88Amy Elsner
1046Jennifer AmigonIndia2026-04-28Rangoni Of Florence NEW4Anna Fali
1047Jefferson SchemmerItaly2026-05-14Feiner Bros NEGOTIATION11Amy Elsner
1048Kaitlin OstroskyBrazil2026-04-25Feltz Printing Service PROPOSAL46Stephen Shaw
1049Wickens NestleGermany2026-05-24Feltz Printing Service RENEWAL61Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Jones VocelkaSpainXuxue Feng RENEWAL
Misaki RoysterJapanAnna Fali UNQUALIFIED
Munro FerenczBrazilIoni Bowcher NEGOTIATION
Leon OldroydCanadaAnna Fali UNQUALIFIED
Jennifer AmigonBrazilBernardo Dominic UNQUALIFIED
Tony FollerUnited KingdomIvan Magalhaes RENEWAL
Deepesh ChuiRussiaOnyama Limba UNQUALIFIED
Claire TollnerJapanIvan Magalhaes UNQUALIFIED
Greenwood BologniaUnited KingdomAsiya Javayant NEGOTIATION
Chavez BriddickAustraliaAsiya Javayant PROPOSAL
Leon OldroydSpainAsiya Javayant RENEWAL
Jennifer AmigonCanadaIoni Bowcher RENEWAL
Stacey MacleadFranceIvan Magalhaes RENEWAL
Tony FollerRussiaAmy Elsner QUALIFIED
Cody SaylorsIndiaBernardo Dominic PROPOSAL
Darci PoquetteBrazilOnyama Limba UNQUALIFIED
Julie StensethSpainOnyama Limba RENEWAL
Cody SaylorsArgentinaBernardo Dominic PROPOSAL
Ivar PaprockiAustraliaAmy Elsner QUALIFIED
Izzy GarufiCanadaIvan Magalhaes RENEWAL
Maisha RulapaughBrazilElwin Sharvill PROPOSAL
Smith GlickArgentinaStephen Shaw UNQUALIFIED
Arvin AlbaresGermanyBernardo Dominic UNQUALIFIED
Leon OldroydSpainAsiya Javayant QUALIFIED
Aruna FigeroaItalyAnna Fali RENEWAL
Cody SaylorsJapanIvan Magalhaes QUALIFIED
Jeanfrancois VenereArgentinaBernardo Dominic PROPOSAL
Rodrigues CampainIndiaAmy Elsner NEW
Smith GlickJapanAnna Fali NEW
Rodrigues CampainBrazilAmy Elsner PROPOSAL
James ButtRussiaStephen Shaw QUALIFIED
Deepesh ChuiFranceStephen Shaw NEGOTIATION
Aditya KuskoBrazilBernardo Dominic PROPOSAL
Morrow RutaItalyIvan Magalhaes UNQUALIFIED
Darci PoquetteFranceIvan Magalhaes UNQUALIFIED
Murillo MaletUnited KingdomStephen Shaw QUALIFIED
Izzy GarufiArgentinaIvan Magalhaes UNQUALIFIED
Jefferson SchemmerUnited KingdomAmy Elsner QUALIFIED
Cody SaylorsSpainXuxue Feng QUALIFIED
Maria MarrierSpainOnyama Limba UNQUALIFIED
Maisha RulapaughBrazilAnna Fali NEW
Aruna FigeroaJapanStephen Shaw PROPOSAL
Ashley DoeGermanyStephen Shaw UNQUALIFIED
Emily WhobreyUnited KingdomStephen Shaw UNQUALIFIED
Arvin AlbaresFranceAmy Elsner QUALIFIED
Jones VocelkaIndiaAsiya Javayant UNQUALIFIED
Antonio CaudyIndiaXuxue Feng UNQUALIFIED
James ButtSpainAsiya Javayant QUALIFIED
Arvin AlbaresUnited KingdomAnna Fali UNQUALIFIED
Costa DilliardSpainElwin Sharvill NEGOTIATION
Frozen Columns
Name
Jefferson Schemmer
Arvin Albares
Smith Glick
Nicolas Iturbide
Arvin Albares
Stacey Maclead
Clifford Rim
Ashley Doe
Aika Inouye
Aika Inouye
Tony Foller
Izzy Garufi
Deepesh Chui
Greenwood Bolognia
Costa Dilliard
Salvatore Stockham
Aruna Figeroa
Kaitlin Ostrosky
Johnson Sergi
Alejandro Perin
Jeanfrancois Venere
Alejandro Perin
Morrow Ruta
Tony Foller
Aditya Kusko
Costa Dilliard
Octavia Malet
Chavez Briddick
Chavez Briddick
Juan Wieser
Misaki Royster
Octavia Malet
Greenwood Bolognia
Mayumi Kolmetz
Faith Gillian
Cody Saylors
Ashley Doe
James Butt
Alejandro Perin
Chavez Briddick
Mayumi Kolmetz
Aruna Figeroa
Morrow Ruta
David Darakjy
Munro Ferencz
Jones Vocelka
Mayumi Kolmetz
Octavia Malet
Maisha Rulapaugh
Chavez Briddick
IdCountryDate
1000Brazil2026-05-03
1001Germany2026-04-29
1002France2026-05-03
1003United Kingdom2026-04-25
1004Argentina2026-05-10
1005Japan2026-05-03
1006Russia2026-05-09
1007Canada2026-05-11
1008India2026-05-04
1009Canada2026-05-09
1010Japan2026-04-25
1011Australia2026-05-11
1012Spain2026-04-25
1013Germany2026-05-03
1014Canada2026-05-11
1015Brazil2026-05-09
1016Russia2026-05-08
1017Brazil2026-05-11
1018France2026-05-20
1019Russia2026-05-08
1020France2026-05-08
1021Canada2026-05-14
1022Brazil2026-04-26
1023Brazil2026-05-13
1024United Kingdom2026-05-15
1025Germany2026-05-20
1026Australia2026-05-05
1027Japan2026-05-05
1028Spain2026-05-22
1029Brazil2026-05-04
1030Italy2026-05-08
1031Australia2026-05-11
1032India2026-05-20
1033Brazil2026-05-15
1034United Kingdom2026-04-25
1035Canada2026-05-23
1036United Kingdom2026-05-13
1037France2026-05-14
1038Brazil2026-05-24
1039Russia2026-05-23
1040Spain2026-05-18
1041Spain2026-04-28
1042Germany2026-05-06
1043United Kingdom2026-04-27
1044Germany2026-05-14
1045Canada2026-04-25
1046Canada2026-05-01
1047Italy2026-05-02
1048Australia2026-04-27
1049Russia2026-05-11

On-Demand Data

NameIdCountryDate
Julie Stenseth1000France2026-05-13
Jennifer Amigon1001India2026-05-09
Clifford Rim1002France2026-05-14
Wickens Nestle1003Argentina2026-05-02
Nicolas Iturbide1004Japan2026-04-25
Aditya Kusko1005Italy2026-05-14
Kaitlin Ostrosky1006Germany2026-05-19
Sinclair Waycott1007Japan2026-05-03
Johnson Sergi1008Australia2026-05-04
Stacey Maclead1009France2026-05-08
Rodrigues Campain1010Australia2026-05-02
David Darakjy1011Argentina2026-05-18
Kadeem Flosi1012Spain2026-05-19
Juan Wieser1013Brazil2026-05-13
Aditya Kusko1014Canada2026-05-09
Sinclair Waycott1015Australia2026-05-13
Chavez Briddick1016Germany2026-04-26
Francesco Shinko1017India2026-05-10
Maisha Rulapaugh1018Brazil2026-05-14
Maisha Rulapaugh1019India2026-05-15
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Silvio SlusarskiIndiaIoni Bowcher UNQUALIFIED
Ashley DoeBrazilIoni Bowcher NEGOTIATION
Arvin AlbaresCanadaElwin Sharvill PROPOSAL
Aruna FigeroaUnited KingdomXuxue Feng PROPOSAL
Adams MorascaUnited KingdomXuxue Feng PROPOSAL
Aditya KuskoJapanAnna Fali NEGOTIATION
Wickens NestleJapanElwin Sharvill UNQUALIFIED
Chavez BriddickIndiaAnna Fali RENEWAL
Maisha RulapaughRussiaAmy Elsner PROPOSAL
Tony FollerGermanyIoni Bowcher NEW
Julie StensethRussiaIoni Bowcher UNQUALIFIED
Izzy GarufiUnited KingdomIvan Magalhaes RENEWAL
Nicolas IturbideIndiaOnyama Limba QUALIFIED
Jefferson SchemmerUnited KingdomOnyama Limba PROPOSAL
Kadeem FlosiRussiaElwin Sharvill RENEWAL
Rodrigues CampainIndiaAmy Elsner QUALIFIED
Wickens NestleCanadaAmy Elsner RENEWAL
Morrow RutaCanadaStephen Shaw NEGOTIATION
Maria MarrierUnited KingdomAnna Fali NEGOTIATION
Jennifer AmigonCanadaXuxue Feng PROPOSAL
Jennifer AmigonSpainIoni Bowcher NEW
Greenwood BologniaFranceXuxue Feng NEGOTIATION
Claire TollnerItalyAsiya Javayant PROPOSAL
Ashley DoeSpainIvan Magalhaes QUALIFIED
Emily WhobreyAustraliaStephen Shaw NEW
Claire TollnerUnited KingdomAsiya Javayant UNQUALIFIED
Jones VocelkaUnited KingdomBernardo Dominic RENEWAL
Wickens NestleCanadaIoni Bowcher NEW
Juan WieserGermanyOnyama Limba PROPOSAL
Izzy GarufiAustraliaOnyama Limba PROPOSAL
Sinclair WaycottCanadaElwin Sharvill NEGOTIATION
Greenwood BologniaItalyBernardo Dominic QUALIFIED
Jones VocelkaRussiaAnna Fali PROPOSAL
Munro FerenczCanadaAnna Fali QUALIFIED
Maria MarrierSpainIvan Magalhaes NEW
Sinclair WaycottGermanyOnyama Limba RENEWAL
James ButtBrazilAsiya Javayant NEGOTIATION
Jeanfrancois VenereCanadaAmy Elsner UNQUALIFIED
Chavez BriddickCanadaIvan Magalhaes PROPOSAL
Leon OldroydRussiaStephen Shaw UNQUALIFIED

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