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
Kadeem FlosiGermanyIvan Magalhaes NEW
Kadeem FlosiItalyOnyama Limba NEGOTIATION
Nicolas IturbideAustraliaIvan Magalhaes RENEWAL
Nicolas IturbideRussiaAnna Fali PROPOSAL
Rodrigues CampainCanadaBernardo Dominic NEGOTIATION
Ricardo GauchoGermanyStephen Shaw QUALIFIED
Alejandro PerinIndiaOnyama Limba NEW
Cody SaylorsUnited KingdomAsiya Javayant NEW
Izzy GarufiIndiaAmy Elsner UNQUALIFIED
Emily WhobreyArgentinaAsiya Javayant QUALIFIED
Stacey MacleadCanadaAmy Elsner QUALIFIED
Deepesh ChuiFranceAmy Elsner RENEWAL
Aika InouyeRussiaAmy Elsner PROPOSAL
Chavez BriddickAustraliaBernardo Dominic NEGOTIATION
Arvin AlbaresBrazilXuxue Feng UNQUALIFIED
Greenwood BologniaSpainIoni Bowcher NEW
Francesco ShinkoSpainIoni Bowcher NEGOTIATION
David DarakjyCanadaAsiya Javayant RENEWAL
Leon OldroydBrazilBernardo Dominic RENEWAL
Aika InouyeSpainIvan Magalhaes UNQUALIFIED
Deepesh ChuiCanadaOnyama Limba NEW
Francesco ShinkoArgentinaAmy Elsner RENEWAL
Aditya KuskoArgentinaBernardo Dominic PROPOSAL
Sinclair WaycottSpainIvan Magalhaes NEGOTIATION
Rodrigues CampainBrazilAmy Elsner PROPOSAL
Costa DilliardCanadaAsiya Javayant UNQUALIFIED
Silvio SlusarskiJapanOnyama Limba UNQUALIFIED
Ashley DoeIndiaElwin Sharvill QUALIFIED
Leja CaldareraBrazilAmy Elsner UNQUALIFIED
Aika InouyeAustraliaOnyama Limba RENEWAL
Tony FollerGermanyXuxue Feng UNQUALIFIED
Arvin AlbaresJapanAsiya Javayant NEW
Wickens NestleBrazilOnyama Limba UNQUALIFIED
Octavia MaletItalyBernardo Dominic RENEWAL
Wickens NestleItalyOnyama Limba QUALIFIED
Jeanfrancois VenereRussiaElwin Sharvill RENEWAL
Leon OldroydArgentinaStephen Shaw PROPOSAL
Kaitlin OstroskyFranceAnna Fali UNQUALIFIED
Francesco ShinkoSpainBernardo Dominic PROPOSAL
Alejandro PerinBrazilOnyama Limba UNQUALIFIED
Faith GillianSpainAnna Fali RENEWAL
Misaki RoysterArgentinaBernardo Dominic NEGOTIATION
Arvin AlbaresSpainElwin Sharvill PROPOSAL
Johnson SergiFranceElwin Sharvill UNQUALIFIED
Ivar PaprockiFranceXuxue Feng QUALIFIED
Tony FollerUnited KingdomAnna Fali QUALIFIED
Mayumi KolmetzRussiaIoni Bowcher NEGOTIATION
Munro FerenczArgentinaElwin Sharvill RENEWAL
Munro FerenczRussiaOnyama Limba PROPOSAL
Misaki RoysterGermanyElwin Sharvill UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Alejandro PerinRussiaIoni Bowcher UNQUALIFIED
Alejandro PerinFranceIoni Bowcher UNQUALIFIED
Jeanfrancois VenereArgentinaBernardo Dominic NEGOTIATION
Silvio SlusarskiCanadaAmy Elsner PROPOSAL
Arvin AlbaresCanadaElwin Sharvill QUALIFIED
Izzy GarufiJapanElwin Sharvill NEGOTIATION
Chavez BriddickAustraliaIoni Bowcher UNQUALIFIED
Maria MarrierFranceIvan Magalhaes RENEWAL
Murillo MaletRussiaOnyama Limba PROPOSAL
Murillo MaletIndiaAnna Fali NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aditya KuskoCanada2026-04-22Chanay, Jeffrey A Esq NEW76Amy Elsner
1001Octavia MaletFrance2026-04-21King, Christopher A Esq UNQUALIFIED98Amy Elsner
1002Aruna FigeroaIndia2026-05-07Commercial Press NEGOTIATION30Onyama Limba
1003Antonio CaudyFrance2026-04-19Commercial Press PROPOSAL59Stephen Shaw
1004Silvio SlusarskiArgentina2026-04-23Morlong Associates PROPOSAL30Stephen Shaw
1005Alejandro PerinUnited Kingdom2026-04-13Chapman, Ross E Esq UNQUALIFIED99Stephen Shaw
1006Munro FerenczRussia2026-05-08Dorl, James J Esq NEW23Amy Elsner
1007Claire TollnerCanada2026-05-05Morlong Associates QUALIFIED94Onyama Limba
1008Clifford RimIndia2026-04-12Dorl, James J Esq UNQUALIFIED54Amy Elsner
1009Ivar PaprockiAustralia2026-04-27Printing Dimensions NEW87Amy Elsner
1010Misaki RoysterIndia2026-04-21Printing Dimensions UNQUALIFIED92Asiya Javayant
1011Ivar PaprockiIndia2026-04-27Chemel, James L Cpa NEGOTIATION59Elwin Sharvill
1012Deepesh ChuiIndia2026-04-25Printing Dimensions PROPOSAL20Bernardo Dominic
1013Kadeem FlosiBrazil2026-05-03Morlong Associates RENEWAL2Anna Fali
1014Ivar PaprockiGermany2026-04-30Chapman, Ross E Esq QUALIFIED24Bernardo Dominic
1015Aruna FigeroaUnited Kingdom2026-05-10Morlong Associates UNQUALIFIED21Anna Fali
1016Emily WhobreyRussia2026-05-04Feltz Printing Service NEGOTIATION22Xuxue Feng
1017Rodrigues CampainCanada2026-05-05Rousseaux, Michael Esq RENEWAL97Anna Fali
1018Smith GlickArgentina2026-05-05Rangoni Of Florence UNQUALIFIED98Elwin Sharvill
1019Jeanfrancois VenereAustralia2026-05-09Chanay, Jeffrey A Esq RENEWAL42Stephen Shaw
1020Jennifer AmigonJapan2026-04-20Feltz Printing Service QUALIFIED12Elwin Sharvill
1021Antonio CaudyCanada2026-04-21Rousseaux, Michael Esq NEW98Amy Elsner
1022Mujtaba NickaBrazil2026-04-22Feltz Printing Service PROPOSAL23Onyama Limba
1023Aika InouyeItaly2026-04-24Rangoni Of Florence QUALIFIED95Anna Fali
1024Antonio CaudyArgentina2026-04-18Rangoni Of Florence RENEWAL52Stephen Shaw
1025Jefferson SchemmerRussia2026-05-11Dorl, James J Esq NEW0Onyama Limba
1026Misaki RoysterAustralia2026-04-29Benton, John B Jr RENEWAL2Bernardo Dominic
1027Emily WhobreyArgentina2026-04-22Dorl, James J Esq QUALIFIED58Asiya Javayant
1028Arvin AlbaresFrance2026-04-15Benton, John B Jr PROPOSAL91Xuxue Feng
1029James ButtCanada2026-04-15King, Christopher A Esq RENEWAL62Elwin Sharvill
1030Claire TollnerItaly2026-05-09King, Christopher A Esq NEGOTIATION48Amy Elsner
1031Ivar PaprockiItaly2026-05-04Printing Dimensions RENEWAL2Elwin Sharvill
1032Jennifer AmigonArgentina2026-04-24Rangoni Of Florence NEW26Bernardo Dominic
1033Juan WieserCanada2026-05-08Morlong Associates RENEWAL21Onyama Limba
1034Aika InouyeAustralia2026-04-27Chemel, James L Cpa QUALIFIED74Bernardo Dominic
1035Leon OldroydCanada2026-04-18Feltz Printing Service NEW79Ioni Bowcher
1036Nicolas IturbideGermany2026-04-23Feiner Bros NEW71Bernardo Dominic
1037Nicolas IturbideIndia2026-04-12Benton, John B Jr PROPOSAL78Onyama Limba
1038Arvin AlbaresAustralia2026-04-20Rousseaux, Michael Esq NEGOTIATION17Anna Fali
1039Silvio SlusarskiBrazil2026-05-06Printing Dimensions QUALIFIED7Asiya Javayant
1040Leon OldroydItaly2026-05-07Rangoni Of Florence NEGOTIATION46Asiya Javayant
1041Aditya KuskoBrazil2026-05-08Rangoni Of Florence UNQUALIFIED32Ivan Magalhaes
1042Leja CaldareraArgentina2026-04-13Chanay, Jeffrey A Esq NEGOTIATION19Bernardo Dominic
1043Ashley DoeIndia2026-04-13King, Christopher A Esq UNQUALIFIED6Anna Fali
1044Jones VocelkaUnited Kingdom2026-04-27Feiner Bros PROPOSAL44Onyama Limba
1045Kadeem FlosiRussia2026-05-08Feiner Bros QUALIFIED6Bernardo Dominic
1046Jefferson SchemmerGermany2026-04-17Morlong Associates NEW44Ivan Magalhaes
1047Maria MarrierBrazil2026-04-13King, Christopher A Esq NEGOTIATION78Elwin Sharvill
1048Smith GlickUnited Kingdom2026-05-10Rousseaux, Michael Esq QUALIFIED26Stephen Shaw
1049Francesco ShinkoIndia2026-04-21Feltz Printing Service RENEWAL89Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
James ButtArgentinaAmy Elsner RENEWAL
James ButtGermanyAsiya Javayant QUALIFIED
Kadeem FlosiUnited KingdomElwin Sharvill UNQUALIFIED
Ashley DoeSpainStephen Shaw NEW
Maisha RulapaughFranceBernardo Dominic QUALIFIED
Wickens NestleFranceOnyama Limba QUALIFIED
Izzy GarufiItalyElwin Sharvill NEW
Rodrigues CampainArgentinaStephen Shaw UNQUALIFIED
Wickens NestleCanadaAnna Fali NEGOTIATION
Kadeem FlosiSpainAsiya Javayant QUALIFIED
Ivar PaprockiRussiaAmy Elsner RENEWAL
Faith GillianIndiaElwin Sharvill PROPOSAL
Juan WieserCanadaXuxue Feng UNQUALIFIED
Antonio CaudyCanadaAmy Elsner QUALIFIED
Octavia MaletBrazilAsiya Javayant UNQUALIFIED
Sinclair WaycottGermanyIvan Magalhaes QUALIFIED
Kadeem FlosiIndiaAnna Fali QUALIFIED
Tony FollerRussiaIvan Magalhaes PROPOSAL
Jones VocelkaCanadaStephen Shaw RENEWAL
James ButtArgentinaStephen Shaw NEW
Jennifer AmigonItalyAnna Fali RENEWAL
Ricardo GauchoGermanyAmy Elsner RENEWAL
Tony FollerBrazilAnna Fali RENEWAL
Aika InouyeIndiaStephen Shaw RENEWAL
Claire TollnerJapanIoni Bowcher RENEWAL
Mayumi KolmetzBrazilStephen Shaw QUALIFIED
Francesco ShinkoJapanAnna Fali QUALIFIED
Misaki RoysterCanadaStephen Shaw RENEWAL
Wickens NestleBrazilBernardo Dominic NEW
Sinclair WaycottSpainIvan Magalhaes PROPOSAL
Faith GillianJapanAnna Fali NEGOTIATION
Jeanfrancois VenereSpainElwin Sharvill QUALIFIED
Alejandro PerinGermanyBernardo Dominic PROPOSAL
Ashley DoeCanadaIoni Bowcher RENEWAL
Octavia MaletSpainOnyama Limba UNQUALIFIED
Silvio SlusarskiArgentinaIvan Magalhaes NEGOTIATION
Kaitlin OstroskyCanadaStephen Shaw QUALIFIED
Faith GillianRussiaBernardo Dominic QUALIFIED
Rodrigues CampainIndiaAmy Elsner RENEWAL
Costa DilliardFranceOnyama Limba RENEWAL
Emily WhobreyJapanAsiya Javayant NEGOTIATION
Emily WhobreyUnited KingdomXuxue Feng UNQUALIFIED
Ricardo GauchoAustraliaOnyama Limba RENEWAL
Salvatore StockhamFranceStephen Shaw PROPOSAL
Emily WhobreyFranceOnyama Limba NEW
Octavia MaletIndiaBernardo Dominic NEGOTIATION
Aditya KuskoJapanStephen Shaw NEW
Greenwood BologniaBrazilIoni Bowcher RENEWAL
Aditya KuskoIndiaAsiya Javayant NEW
Aditya KuskoIndiaStephen Shaw RENEWAL
Frozen Columns
Name
Antonio Caudy
Ivar Paprocki
Deepesh Chui
Kadeem Flosi
Isabel Bowley
Juan Wieser
Greenwood Bolognia
Claire Tollner
Octavia Malet
Darci Poquette
Julie Stenseth
Aika Inouye
Clifford Rim
Kaitlin Ostrosky
Costa Dilliard
Ricardo Gaucho
Juan Wieser
Sinclair Waycott
Wickens Nestle
Ivar Paprocki
Octavia Malet
Maria Marrier
Jennifer Amigon
Ivar Paprocki
Clifford Rim
Stacey Maclead
Jefferson Schemmer
Chavez Briddick
Jefferson Schemmer
Maisha Rulapaugh
Octavia Malet
Ivar Paprocki
Faith Gillian
Mujtaba Nicka
Ivar Paprocki
Murillo Malet
Kaitlin Ostrosky
Julie Stenseth
Juan Wieser
Claire Tollner
Octavia Malet
Misaki Royster
Octavia Malet
Alejandro Perin
Misaki Royster
Rodrigues Campain
Darci Poquette
Rodrigues Campain
Mujtaba Nicka
Jones Vocelka
IdCountryDate
1000Italy2026-04-19
1001Spain2026-04-18
1002United Kingdom2026-05-01
1003Brazil2026-05-10
1004France2026-04-21
1005Russia2026-05-08
1006Australia2026-04-27
1007Canada2026-04-29
1008Argentina2026-05-01
1009France2026-05-01
1010France2026-04-27
1011United Kingdom2026-04-13
1012United Kingdom2026-04-23
1013France2026-04-16
1014Germany2026-04-23
1015Argentina2026-04-26
1016Russia2026-04-19
1017Brazil2026-04-29
1018Argentina2026-05-10
1019Germany2026-05-09
1020Canada2026-05-03
1021Russia2026-04-17
1022United Kingdom2026-04-22
1023Spain2026-05-02
1024Russia2026-05-04
1025Germany2026-05-03
1026Russia2026-04-13
1027Spain2026-05-11
1028Brazil2026-05-04
1029France2026-04-19
1030Spain2026-05-06
1031Russia2026-04-19
1032Italy2026-05-10
1033Argentina2026-04-18
1034Germany2026-05-01
1035Canada2026-04-28
1036Argentina2026-04-25
1037Brazil2026-04-15
1038Italy2026-04-19
1039Australia2026-04-19
1040Spain2026-04-12
1041United Kingdom2026-04-15
1042Canada2026-05-04
1043United Kingdom2026-05-04
1044France2026-05-08
1045Argentina2026-04-20
1046United Kingdom2026-04-15
1047Brazil2026-05-03
1048Brazil2026-04-18
1049Brazil2026-05-05

On-Demand Data

NameIdCountryDate
Aika Inouye1000Canada2026-04-13
Clifford Rim1001France2026-04-14
David Darakjy1002India2026-05-10
Adams Morasca1003Russia2026-05-04
Aditya Kusko1004Australia2026-04-29
Costa Dilliard1005Australia2026-05-06
Claire Tollner1006Canada2026-04-13
Stacey Maclead1007Russia2026-05-02
Johnson Sergi1008Germany2026-04-22
Kadeem Flosi1009Canada2026-04-26
Morrow Ruta1010Australia2026-04-17
Sinclair Waycott1011Australia2026-04-14
Costa Dilliard1012Russia2026-04-13
Aika Inouye1013India2026-05-06
Jennifer Amigon1014Australia2026-05-09
Darci Poquette1015Argentina2026-04-12
Clifford Rim1016United Kingdom2026-04-12
Ricardo Gaucho1017Canada2026-05-04
Maria Marrier1018Italy2026-04-13
Antonio Caudy1019Brazil2026-05-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Greenwood BologniaRussiaOnyama Limba PROPOSAL
Claire TollnerFranceElwin Sharvill NEW
Ashley DoeFranceStephen Shaw QUALIFIED
James ButtGermanyXuxue Feng QUALIFIED
Smith GlickUnited KingdomStephen Shaw NEW
Jeanfrancois VenereJapanOnyama Limba PROPOSAL
Jones VocelkaArgentinaIvan Magalhaes NEW
Antonio CaudySpainOnyama Limba UNQUALIFIED
Munro FerenczItalyOnyama Limba NEW
Ricardo GauchoArgentinaIvan Magalhaes QUALIFIED
Leon OldroydIndiaIoni Bowcher QUALIFIED
Alejandro PerinBrazilBernardo Dominic RENEWAL
Misaki RoysterUnited KingdomElwin Sharvill RENEWAL
Ricardo GauchoBrazilAnna Fali UNQUALIFIED
Darci PoquetteFranceAmy Elsner NEW
Jeanfrancois VenereArgentinaAnna Fali UNQUALIFIED
Leon OldroydBrazilAnna Fali UNQUALIFIED
Munro FerenczArgentinaStephen Shaw NEW
David DarakjyArgentinaXuxue Feng UNQUALIFIED
Ashley DoeSpainStephen Shaw UNQUALIFIED
Leon OldroydItalyAnna Fali QUALIFIED
Aruna FigeroaUnited KingdomStephen Shaw PROPOSAL
Julie StensethArgentinaAsiya Javayant NEGOTIATION
Morrow RutaBrazilStephen Shaw PROPOSAL
Ivar PaprockiItalyXuxue Feng UNQUALIFIED
Kaitlin OstroskyBrazilXuxue Feng PROPOSAL
James ButtUnited KingdomAmy Elsner NEGOTIATION
Octavia MaletAustraliaXuxue Feng RENEWAL
Leja CaldareraGermanyBernardo Dominic NEGOTIATION
Misaki RoysterSpainAmy Elsner QUALIFIED
Morrow RutaRussiaElwin Sharvill NEGOTIATION
Arvin AlbaresGermanyXuxue Feng NEGOTIATION
Emily WhobreyFranceAnna Fali NEGOTIATION
Deepesh ChuiCanadaXuxue Feng NEGOTIATION
Octavia MaletBrazilOnyama Limba PROPOSAL
Misaki RoysterFranceIoni Bowcher QUALIFIED
Sinclair WaycottArgentinaAmy Elsner QUALIFIED
Tony FollerUnited KingdomBernardo Dominic QUALIFIED
Jennifer AmigonSpainXuxue Feng PROPOSAL
Rodrigues CampainJapanXuxue Feng 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>