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
Cody SaylorsSpainIvan Magalhaes QUALIFIED
Ricardo GauchoBrazilIvan Magalhaes PROPOSAL
Kaitlin OstroskyRussiaIoni Bowcher UNQUALIFIED
Nicolas IturbideAustraliaXuxue Feng NEW
Emily WhobreyIndiaElwin Sharvill RENEWAL
Jefferson SchemmerCanadaIoni Bowcher RENEWAL
Julie StensethJapanXuxue Feng RENEWAL
Aditya KuskoSpainElwin Sharvill UNQUALIFIED
Alejandro PerinJapanXuxue Feng NEGOTIATION
Sinclair WaycottJapanAmy Elsner RENEWAL
Nicolas IturbideBrazilAsiya Javayant QUALIFIED
Faith GillianFranceXuxue Feng QUALIFIED
Antonio CaudyJapanElwin Sharvill RENEWAL
Leon OldroydItalyOnyama Limba NEW
Faith GillianCanadaAsiya Javayant PROPOSAL
Murillo MaletSpainIvan Magalhaes NEGOTIATION
Jones VocelkaUnited KingdomAmy Elsner UNQUALIFIED
Rodrigues CampainSpainAnna Fali QUALIFIED
Chavez BriddickIndiaAmy Elsner UNQUALIFIED
Smith GlickFranceAmy Elsner RENEWAL
Emily WhobreyFranceStephen Shaw QUALIFIED
Salvatore StockhamArgentinaAsiya Javayant QUALIFIED
Arvin AlbaresAustraliaIvan Magalhaes NEGOTIATION
Silvio SlusarskiItalyAsiya Javayant NEW
Kadeem FlosiFranceStephen Shaw UNQUALIFIED
Ricardo GauchoSpainAmy Elsner NEW
Arvin AlbaresIndiaBernardo Dominic QUALIFIED
Leon OldroydItalyIoni Bowcher NEGOTIATION
Leon OldroydRussiaOnyama Limba UNQUALIFIED
Maria MarrierCanadaXuxue Feng NEGOTIATION
Wickens NestleArgentinaAsiya Javayant NEW
Jones VocelkaJapanXuxue Feng UNQUALIFIED
Morrow RutaRussiaBernardo Dominic QUALIFIED
Jeanfrancois VenereArgentinaStephen Shaw PROPOSAL
Rodrigues CampainJapanElwin Sharvill PROPOSAL
Chavez BriddickIndiaAsiya Javayant NEW
Emily WhobreyItalyXuxue Feng PROPOSAL
Maria MarrierJapanElwin Sharvill QUALIFIED
Alejandro PerinFranceBernardo Dominic UNQUALIFIED
Ivar PaprockiIndiaAsiya Javayant RENEWAL
Maria MarrierBrazilIoni Bowcher RENEWAL
Kadeem FlosiGermanyAmy Elsner RENEWAL
Silvio SlusarskiSpainIoni Bowcher UNQUALIFIED
Aika InouyeAustraliaOnyama Limba RENEWAL
Ivar PaprockiIndiaStephen Shaw NEW
Munro FerenczUnited KingdomIvan Magalhaes NEW
Salvatore StockhamFranceAsiya Javayant NEGOTIATION
Julie StensethBrazilOnyama Limba RENEWAL
Cody SaylorsItalyStephen Shaw PROPOSAL
Izzy GarufiUnited KingdomAnna Fali PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Faith GillianSpainIoni Bowcher QUALIFIED
Julie StensethRussiaOnyama Limba NEW
Munro FerenczJapanStephen Shaw PROPOSAL
Octavia MaletGermanyOnyama Limba RENEWAL
Mujtaba NickaFranceIoni Bowcher QUALIFIED
Clifford RimBrazilIoni Bowcher UNQUALIFIED
Kaitlin OstroskyFranceBernardo Dominic RENEWAL
Rodrigues CampainFranceOnyama Limba QUALIFIED
Jennifer AmigonSpainIoni Bowcher NEW
Antonio CaudySpainAsiya Javayant UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Misaki RoysterIndia2026-05-27Dorl, James J Esq QUALIFIED71Amy Elsner
1001Claire TollnerBrazil2026-05-23Dorl, James J Esq PROPOSAL14Asiya Javayant
1002Deepesh ChuiItaly2026-05-11Morlong Associates UNQUALIFIED48Stephen Shaw
1003David DarakjyJapan2026-05-06Chanay, Jeffrey A Esq PROPOSAL63Ioni Bowcher
1004James ButtRussia2026-05-12Truhlar And Truhlar Attys NEGOTIATION48Onyama Limba
1005Aruna FigeroaGermany2026-05-24Feltz Printing Service NEW9Bernardo Dominic
1006Chavez BriddickItaly2026-05-24Feltz Printing Service QUALIFIED6Ioni Bowcher
1007Kadeem FlosiUnited Kingdom2026-05-15Truhlar And Truhlar Attys QUALIFIED32Xuxue Feng
1008David DarakjyRussia2026-05-24Commercial Press QUALIFIED37Stephen Shaw
1009Stacey MacleadFrance2026-05-07Feltz Printing Service NEW69Ivan Magalhaes
1010Munro FerenczUnited Kingdom2026-05-04Dorl, James J Esq NEGOTIATION1Bernardo Dominic
1011Nicolas IturbideBrazil2026-05-05Chapman, Ross E Esq RENEWAL99Xuxue Feng
1012Cody SaylorsGermany2026-05-17Truhlar And Truhlar Attys PROPOSAL94Elwin Sharvill
1013Sinclair WaycottBrazil2026-05-31Chemel, James L Cpa PROPOSAL19Stephen Shaw
1014Rodrigues CampainBrazil2026-05-15Dorl, James J Esq UNQUALIFIED41Onyama Limba
1015Maisha RulapaughGermany2026-05-10Commercial Press UNQUALIFIED90Amy Elsner
1016Smith GlickFrance2026-05-08Rousseaux, Michael Esq QUALIFIED34Ivan Magalhaes
1017Arvin AlbaresCanada2026-05-08King, Christopher A Esq RENEWAL80Stephen Shaw
1018Juan WieserGermany2026-05-17Benton, John B Jr NEW1Amy Elsner
1019Mujtaba NickaItaly2026-05-16Commercial Press QUALIFIED89Stephen Shaw
1020Ricardo GauchoArgentina2026-05-13King, Christopher A Esq QUALIFIED98Ivan Magalhaes
1021Misaki RoysterIndia2026-05-26Truhlar And Truhlar Attys NEW17Onyama Limba
1022Octavia MaletIndia2026-05-17Dorl, James J Esq PROPOSAL33Amy Elsner
1023Nicolas IturbideSpain2026-05-05Chapman, Ross E Esq UNQUALIFIED13Bernardo Dominic
1024Greenwood BologniaArgentina2026-05-11Commercial Press UNQUALIFIED36Elwin Sharvill
1025Izzy GarufiRussia2026-06-01Benton, John B Jr RENEWAL64Elwin Sharvill
1026Adams MorascaJapan2026-05-27Feltz Printing Service QUALIFIED52Ioni Bowcher
1027Mujtaba NickaItaly2026-05-11Benton, John B Jr PROPOSAL62Amy Elsner
1028Francesco ShinkoFrance2026-05-16King, Christopher A Esq QUALIFIED99Onyama Limba
1029Misaki RoysterBrazil2026-05-25Benton, John B Jr UNQUALIFIED73Stephen Shaw
1030Arvin AlbaresFrance2026-05-04Chemel, James L Cpa NEW42Bernardo Dominic
1031Silvio SlusarskiAustralia2026-05-13Feiner Bros NEW21Xuxue Feng
1032Misaki RoysterCanada2026-05-24Benton, John B Jr UNQUALIFIED62Xuxue Feng
1033Jeanfrancois VenereSpain2026-05-24Feltz Printing Service NEGOTIATION98Xuxue Feng
1034Leon OldroydGermany2026-05-16Commercial Press PROPOSAL92Ivan Magalhaes
1035Emily WhobreyUnited Kingdom2026-05-08Feiner Bros RENEWAL77Stephen Shaw
1036Julie StensethGermany2026-05-14Rangoni Of Florence NEGOTIATION32Elwin Sharvill
1037Juan WieserCanada2026-05-24Chanay, Jeffrey A Esq NEGOTIATION19Onyama Limba
1038Jones VocelkaCanada2026-05-31Feiner Bros NEW56Asiya Javayant
1039Kaitlin OstroskyArgentina2026-05-12Feltz Printing Service UNQUALIFIED99Ivan Magalhaes
1040Kaitlin OstroskyCanada2026-05-07Chemel, James L Cpa NEGOTIATION22Amy Elsner
1041Kaitlin OstroskyUnited Kingdom2026-05-20Chanay, Jeffrey A Esq RENEWAL58Anna Fali
1042Darci PoquetteIndia2026-05-10Feltz Printing Service QUALIFIED74Elwin Sharvill
1043Morrow RutaRussia2026-06-01Benton, John B Jr NEW79Ivan Magalhaes
1044Julie StensethFrance2026-05-23Morlong Associates NEW20Xuxue Feng
1045Ashley DoeAustralia2026-05-31Chemel, James L Cpa NEW47Anna Fali
1046Tony FollerRussia2026-05-13Chapman, Ross E Esq PROPOSAL96Ioni Bowcher
1047Nicolas IturbideRussia2026-06-02Chemel, James L Cpa QUALIFIED62Anna Fali
1048Clifford RimAustralia2026-05-15Benton, John B Jr NEW21Ioni Bowcher
1049Octavia MaletItaly2026-05-05Chapman, Ross E Esq QUALIFIED59Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Morrow RutaIndiaIoni Bowcher PROPOSAL
Johnson SergiBrazilXuxue Feng RENEWAL
Kadeem FlosiUnited KingdomIvan Magalhaes QUALIFIED
David DarakjyGermanyIvan Magalhaes NEW
Silvio SlusarskiGermanyAmy Elsner NEW
Aruna FigeroaItalyIoni Bowcher NEGOTIATION
Sinclair WaycottIndiaXuxue Feng NEGOTIATION
Clifford RimSpainAsiya Javayant NEGOTIATION
Greenwood BologniaUnited KingdomIoni Bowcher RENEWAL
Tony FollerJapanBernardo Dominic QUALIFIED
Juan WieserUnited KingdomElwin Sharvill UNQUALIFIED
Deepesh ChuiUnited KingdomOnyama Limba UNQUALIFIED
Mujtaba NickaItalyIoni Bowcher NEW
Claire TollnerRussiaElwin Sharvill NEW
Chavez BriddickRussiaBernardo Dominic UNQUALIFIED
Izzy GarufiCanadaIvan Magalhaes NEGOTIATION
Ivar PaprockiSpainElwin Sharvill NEGOTIATION
Ashley DoeIndiaAnna Fali NEW
Julie StensethBrazilBernardo Dominic RENEWAL
Tony FollerUnited KingdomIoni Bowcher NEGOTIATION
Tony FollerBrazilIvan Magalhaes PROPOSAL
Murillo MaletSpainStephen Shaw RENEWAL
Jones VocelkaCanadaElwin Sharvill RENEWAL
Sinclair WaycottRussiaElwin Sharvill UNQUALIFIED
Aruna FigeroaRussiaElwin Sharvill RENEWAL
Emily WhobreyFranceOnyama Limba QUALIFIED
Octavia MaletBrazilElwin Sharvill UNQUALIFIED
Wickens NestleCanadaBernardo Dominic QUALIFIED
Faith GillianItalyIvan Magalhaes NEW
Wickens NestleGermanyAnna Fali NEGOTIATION
Claire TollnerGermanyIoni Bowcher RENEWAL
James ButtCanadaAmy Elsner PROPOSAL
Kadeem FlosiArgentinaElwin Sharvill NEW
Leon OldroydIndiaAmy Elsner NEGOTIATION
Darci PoquetteAustraliaAmy Elsner NEGOTIATION
Claire TollnerSpainBernardo Dominic QUALIFIED
Ivar PaprockiCanadaBernardo Dominic NEW
Murillo MaletGermanyElwin Sharvill PROPOSAL
Clifford RimRussiaElwin Sharvill QUALIFIED
Jones VocelkaUnited KingdomXuxue Feng PROPOSAL
Julie StensethIndiaIvan Magalhaes UNQUALIFIED
Silvio SlusarskiSpainXuxue Feng RENEWAL
Isabel BowleyGermanyXuxue Feng UNQUALIFIED
Leja CaldareraJapanBernardo Dominic RENEWAL
Adams MorascaIndiaBernardo Dominic NEW
Aruna FigeroaRussiaElwin Sharvill UNQUALIFIED
Kadeem FlosiCanadaOnyama Limba NEW
Jefferson SchemmerCanadaBernardo Dominic UNQUALIFIED
Adams MorascaIndiaBernardo Dominic NEGOTIATION
Clifford RimAustraliaAnna Fali NEGOTIATION
Frozen Columns
Name
Salvatore Stockham
Isabel Bowley
Salvatore Stockham
Juan Wieser
Deepesh Chui
Aditya Kusko
Salvatore Stockham
Darci Poquette
Misaki Royster
Deepesh Chui
Maisha Rulapaugh
Claire Tollner
Aditya Kusko
Jeanfrancois Venere
Emily Whobrey
Jeanfrancois Venere
Ashley Doe
Rodrigues Campain
Mayumi Kolmetz
Deepesh Chui
Ashley Doe
Emily Whobrey
Izzy Garufi
Kaitlin Ostrosky
Ricardo Gaucho
Aditya Kusko
Ivar Paprocki
Misaki Royster
Cody Saylors
Tony Foller
Aruna Figeroa
Jennifer Amigon
Wickens Nestle
Francesco Shinko
Murillo Malet
Adams Morasca
Octavia Malet
Arvin Albares
Jones Vocelka
Jeanfrancois Venere
Silvio Slusarski
Jeanfrancois Venere
Morrow Ruta
Ivar Paprocki
Morrow Ruta
Murillo Malet
Jeanfrancois Venere
Mayumi Kolmetz
Wickens Nestle
Ivar Paprocki
IdCountryDate
1000Japan2026-05-20
1001India2026-05-07
1002Argentina2026-05-15
1003Argentina2026-05-24
1004Canada2026-05-14
1005Canada2026-05-13
1006Germany2026-06-01
1007Australia2026-05-11
1008Spain2026-05-31
1009India2026-05-29
1010Spain2026-05-16
1011Canada2026-05-15
1012Russia2026-05-13
1013Brazil2026-05-24
1014Germany2026-05-23
1015Spain2026-05-12
1016Brazil2026-05-14
1017France2026-05-22
1018United Kingdom2026-05-04
1019India2026-05-20
1020Germany2026-05-12
1021Japan2026-06-01
1022India2026-05-17
1023France2026-05-19
1024Japan2026-06-02
1025Japan2026-05-16
1026Canada2026-05-20
1027Brazil2026-05-18
1028Russia2026-05-19
1029Japan2026-05-24
1030Spain2026-05-08
1031Spain2026-05-28
1032Argentina2026-05-14
1033Brazil2026-05-27
1034India2026-05-16
1035Spain2026-05-24
1036India2026-05-14
1037Spain2026-05-23
1038Russia2026-05-12
1039Germany2026-05-31
1040France2026-05-07
1041France2026-05-26
1042France2026-06-02
1043Russia2026-05-24
1044Italy2026-05-31
1045Brazil2026-05-04
1046Australia2026-05-28
1047Canada2026-05-09
1048Italy2026-05-19
1049Canada2026-05-06

On-Demand Data

NameIdCountryDate
James Butt1000Japan2026-05-20
Jones Vocelka1001Argentina2026-05-27
Ashley Doe1002Germany2026-06-02
Francesco Shinko1003France2026-05-06
Faith Gillian1004Australia2026-05-16
Faith Gillian1005Germany2026-05-16
Cody Saylors1006Australia2026-05-08
Murillo Malet1007Brazil2026-05-11
Stacey Maclead1008India2026-05-27
Costa Dilliard1009Germany2026-05-20
Arvin Albares1010Italy2026-05-29
Maisha Rulapaugh1011Argentina2026-05-14
Ricardo Gaucho1012Spain2026-05-15
Morrow Ruta1013Brazil2026-05-16
Johnson Sergi1014Germany2026-05-10
Kaitlin Ostrosky1015India2026-05-22
Sinclair Waycott1016Italy2026-05-04
Jeanfrancois Venere1017Spain2026-05-30
Isabel Bowley1018United Kingdom2026-06-01
Wickens Nestle1019United Kingdom2026-05-23
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jeanfrancois VenereCanadaStephen Shaw QUALIFIED
Darci PoquetteItalyOnyama Limba NEW
Murillo MaletFranceStephen Shaw PROPOSAL
Kaitlin OstroskyAustraliaAsiya Javayant UNQUALIFIED
Munro FerenczJapanElwin Sharvill NEW
Kaitlin OstroskySpainAnna Fali RENEWAL
Misaki RoysterBrazilIoni Bowcher UNQUALIFIED
Morrow RutaAustraliaBernardo Dominic NEW
Chavez BriddickItalyAnna Fali NEGOTIATION
Wickens NestleRussiaAmy Elsner PROPOSAL
Jefferson SchemmerJapanBernardo Dominic RENEWAL
Munro FerenczGermanyAnna Fali NEGOTIATION
Leja CaldareraItalyOnyama Limba QUALIFIED
Clifford RimItalyIvan Magalhaes RENEWAL
Stacey MacleadFranceXuxue Feng QUALIFIED
Misaki RoysterBrazilAsiya Javayant RENEWAL
Jones VocelkaBrazilIoni Bowcher UNQUALIFIED
Murillo MaletFranceElwin Sharvill PROPOSAL
Wickens NestleJapanIoni Bowcher PROPOSAL
Mayumi KolmetzBrazilStephen Shaw PROPOSAL
Maisha RulapaughArgentinaAnna Fali NEGOTIATION
Adams MorascaGermanyOnyama Limba UNQUALIFIED
Tony FollerFranceBernardo Dominic NEW
Jennifer AmigonIndiaStephen Shaw NEW
Chavez BriddickBrazilAnna Fali NEW
Francesco ShinkoCanadaXuxue Feng RENEWAL
Juan WieserRussiaAmy Elsner RENEWAL
Greenwood BologniaUnited KingdomAnna Fali PROPOSAL
James ButtArgentinaElwin Sharvill NEW
Izzy GarufiUnited KingdomAsiya Javayant QUALIFIED
Tony FollerCanadaIvan Magalhaes NEGOTIATION
Ashley DoeIndiaAmy Elsner NEGOTIATION
Julie StensethArgentinaOnyama Limba PROPOSAL
Jennifer AmigonAustraliaAsiya Javayant NEGOTIATION
Faith GillianIndiaStephen Shaw NEGOTIATION
Aditya KuskoIndiaIoni Bowcher QUALIFIED
Sinclair WaycottBrazilIvan Magalhaes NEW
Jefferson SchemmerBrazilBernardo Dominic UNQUALIFIED
Tony FollerSpainIvan Magalhaes NEGOTIATION
Arvin AlbaresIndiaAnna Fali 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>