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 WaycottIndiaIoni Bowcher RENEWAL
Maria MarrierCanadaBernardo Dominic UNQUALIFIED
Jones VocelkaArgentinaAsiya Javayant QUALIFIED
Maisha RulapaughItalyStephen Shaw PROPOSAL
Arvin AlbaresItalyAnna Fali RENEWAL
Wickens NestleRussiaIoni Bowcher NEGOTIATION
Maria MarrierFranceAsiya Javayant NEGOTIATION
Arvin AlbaresAustraliaIvan Magalhaes QUALIFIED
Aditya KuskoJapanXuxue Feng NEW
Kadeem FlosiRussiaOnyama Limba PROPOSAL
Francesco ShinkoAustraliaBernardo Dominic RENEWAL
Cody SaylorsGermanyXuxue Feng QUALIFIED
Alejandro PerinCanadaAnna Fali QUALIFIED
Ricardo GauchoBrazilAnna Fali NEW
Faith GillianCanadaIvan Magalhaes PROPOSAL
Deepesh ChuiIndiaAsiya Javayant PROPOSAL
Darci PoquetteIndiaStephen Shaw PROPOSAL
Salvatore StockhamUnited KingdomAmy Elsner UNQUALIFIED
Murillo MaletRussiaIoni Bowcher NEGOTIATION
David DarakjyJapanOnyama Limba NEW
Mujtaba NickaArgentinaOnyama Limba RENEWAL
Nicolas IturbideFranceStephen Shaw NEW
Juan WieserBrazilAmy Elsner RENEWAL
Johnson SergiSpainXuxue Feng NEGOTIATION
Ivar PaprockiUnited KingdomXuxue Feng NEW
David DarakjyFranceIvan Magalhaes RENEWAL
Greenwood BologniaUnited KingdomAnna Fali PROPOSAL
Mayumi KolmetzArgentinaElwin Sharvill PROPOSAL
Arvin AlbaresJapanAnna Fali UNQUALIFIED
Jeanfrancois VenereIndiaStephen Shaw RENEWAL
Mayumi KolmetzArgentinaAnna Fali UNQUALIFIED
Claire TollnerAustraliaBernardo Dominic RENEWAL
Arvin AlbaresJapanAmy Elsner UNQUALIFIED
Maisha RulapaughCanadaStephen Shaw UNQUALIFIED
Sinclair WaycottRussiaElwin Sharvill RENEWAL
Mujtaba NickaRussiaAnna Fali PROPOSAL
Jeanfrancois VenereAustraliaAnna Fali UNQUALIFIED
Tony FollerItalyAnna Fali NEGOTIATION
Jones VocelkaRussiaAsiya Javayant RENEWAL
Claire TollnerGermanyStephen Shaw QUALIFIED
Antonio CaudyRussiaStephen Shaw NEW
Kaitlin OstroskyGermanyElwin Sharvill RENEWAL
Mujtaba NickaRussiaIvan Magalhaes NEGOTIATION
Deepesh ChuiArgentinaAnna Fali QUALIFIED
Mujtaba NickaItalyAsiya Javayant QUALIFIED
Jeanfrancois VenereSpainAmy Elsner RENEWAL
Ashley DoeGermanyAsiya Javayant RENEWAL
Darci PoquetteFranceIvan Magalhaes PROPOSAL
Mujtaba NickaFranceIoni Bowcher NEGOTIATION
Ashley DoeCanadaXuxue Feng NEW
Horizontal
NameCountryRepresentativeStatus
Kadeem FlosiUnited KingdomAsiya Javayant NEGOTIATION
Misaki RoysterGermanyStephen Shaw RENEWAL
Nicolas IturbideGermanyIvan Magalhaes QUALIFIED
Greenwood BologniaFranceAsiya Javayant PROPOSAL
Antonio CaudyUnited KingdomElwin Sharvill PROPOSAL
Rodrigues CampainAustraliaXuxue Feng QUALIFIED
Aditya KuskoCanadaStephen Shaw UNQUALIFIED
Arvin AlbaresItalyAsiya Javayant RENEWAL
Salvatore StockhamJapanElwin Sharvill NEGOTIATION
David DarakjyItalyStephen Shaw PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Isabel BowleyItaly2025-09-24Rousseaux, Michael Esq PROPOSAL34Xuxue Feng
1001David DarakjyArgentina2025-10-12Morlong Associates RENEWAL51Asiya Javayant
1002Juan WieserSpain2025-09-30Rangoni Of Florence PROPOSAL52Elwin Sharvill
1003Munro FerenczJapan2025-10-10Printing Dimensions UNQUALIFIED84Xuxue Feng
1004Darci PoquetteSpain2025-09-19Morlong Associates QUALIFIED77Ioni Bowcher
1005Kadeem FlosiIndia2025-10-13Commercial Press RENEWAL25Asiya Javayant
1006Misaki RoysterItaly2025-10-09Chemel, James L Cpa RENEWAL3Anna Fali
1007Chavez BriddickUnited Kingdom2025-10-06Feiner Bros QUALIFIED66Ioni Bowcher
1008Antonio CaudyItaly2025-10-17King, Christopher A Esq UNQUALIFIED76Asiya Javayant
1009Isabel BowleyFrance2025-09-20Morlong Associates UNQUALIFIED99Stephen Shaw
1010Deepesh ChuiRussia2025-10-10Feltz Printing Service UNQUALIFIED69Stephen Shaw
1011Ivar PaprockiItaly2025-10-17Feiner Bros NEW75Ioni Bowcher
1012Stacey MacleadItaly2025-09-24Dorl, James J Esq NEW50Ioni Bowcher
1013Kadeem FlosiArgentina2025-09-21Truhlar And Truhlar Attys QUALIFIED5Anna Fali
1014Aruna FigeroaFrance2025-09-29Feiner Bros UNQUALIFIED34Onyama Limba
1015Emily WhobreyIndia2025-10-14Morlong Associates NEW98Elwin Sharvill
1016Deepesh ChuiIndia2025-10-10Buckley Miller Wright NEW74Xuxue Feng
1017Ivar PaprockiIndia2025-09-21Rangoni Of Florence UNQUALIFIED50Asiya Javayant
1018Ashley DoeArgentina2025-10-10Chapman, Ross E Esq QUALIFIED34Amy Elsner
1019Octavia MaletUnited Kingdom2025-10-08Commercial Press RENEWAL4Onyama Limba
1020Morrow RutaBrazil2025-10-03Morlong Associates UNQUALIFIED60Asiya Javayant
1021Smith GlickItaly2025-09-26Rangoni Of Florence PROPOSAL91Xuxue Feng
1022Cody SaylorsCanada2025-10-18Truhlar And Truhlar Attys QUALIFIED66Asiya Javayant
1023Jones VocelkaGermany2025-09-29Chanay, Jeffrey A Esq NEGOTIATION59Asiya Javayant
1024Jones VocelkaIndia2025-09-27Commercial Press NEW24Onyama Limba
1025Chavez BriddickIndia2025-09-30Printing Dimensions QUALIFIED67Anna Fali
1026Kadeem FlosiAustralia2025-10-06Chemel, James L Cpa RENEWAL42Ivan Magalhaes
1027Johnson SergiArgentina2025-09-27Dorl, James J Esq NEW53Ivan Magalhaes
1028Munro FerenczAustralia2025-09-28Printing Dimensions NEW1Stephen Shaw
1029Salvatore StockhamGermany2025-10-05Dorl, James J Esq UNQUALIFIED62Ioni Bowcher
1030Salvatore StockhamJapan2025-09-24Feltz Printing Service NEGOTIATION0Xuxue Feng
1031Francesco ShinkoFrance2025-10-11Chapman, Ross E Esq NEW7Asiya Javayant
1032Deepesh ChuiCanada2025-09-21Feiner Bros RENEWAL67Bernardo Dominic
1033Deepesh ChuiFrance2025-10-15Printing Dimensions UNQUALIFIED59Ivan Magalhaes
1034Smith GlickIndia2025-10-17Benton, John B Jr RENEWAL5Anna Fali
1035Mayumi KolmetzRussia2025-10-06Feltz Printing Service UNQUALIFIED17Bernardo Dominic
1036Johnson SergiSpain2025-10-05Feltz Printing Service NEGOTIATION70Bernardo Dominic
1037Clifford RimIndia2025-09-23Rousseaux, Michael Esq UNQUALIFIED51Asiya Javayant
1038Leon OldroydBrazil2025-10-06Rangoni Of Florence QUALIFIED33Elwin Sharvill
1039Rodrigues CampainAustralia2025-10-12Chemel, James L Cpa QUALIFIED32Stephen Shaw
1040Aruna FigeroaUnited Kingdom2025-10-03Feltz Printing Service PROPOSAL10Stephen Shaw
1041Adams MorascaJapan2025-10-09Rousseaux, Michael Esq QUALIFIED12Xuxue Feng
1042Munro FerenczArgentina2025-09-25Feltz Printing Service NEW67Elwin Sharvill
1043Clifford RimArgentina2025-10-15Benton, John B Jr RENEWAL53Ioni Bowcher
1044Maisha RulapaughUnited Kingdom2025-10-15Benton, John B Jr RENEWAL53Amy Elsner
1045Sinclair WaycottGermany2025-10-18Feiner Bros RENEWAL24Amy Elsner
1046Kadeem FlosiJapan2025-09-21Chemel, James L Cpa NEW20Bernardo Dominic
1047Julie StensethSpain2025-10-10Feltz Printing Service QUALIFIED3Ivan Magalhaes
1048Kaitlin OstroskyAustralia2025-09-30Chanay, Jeffrey A Esq QUALIFIED84Asiya Javayant
1049Cody SaylorsJapan2025-09-20Buckley Miller Wright UNQUALIFIED98Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Izzy GarufiJapanAnna Fali PROPOSAL
Emily WhobreyAustraliaElwin Sharvill QUALIFIED
Adams MorascaAustraliaAsiya Javayant RENEWAL
Emily WhobreyGermanyElwin Sharvill UNQUALIFIED
Maria MarrierRussiaStephen Shaw PROPOSAL
Murillo MaletSpainIoni Bowcher UNQUALIFIED
Nicolas IturbideArgentinaElwin Sharvill RENEWAL
Alejandro PerinSpainAmy Elsner NEW
Ivar PaprockiJapanAnna Fali NEW
Juan WieserAustraliaOnyama Limba QUALIFIED
Claire TollnerGermanyStephen Shaw PROPOSAL
Misaki RoysterRussiaIvan Magalhaes NEW
Antonio CaudyItalyOnyama Limba UNQUALIFIED
Alejandro PerinGermanyOnyama Limba UNQUALIFIED
Ashley DoeGermanyXuxue Feng RENEWAL
Jefferson SchemmerCanadaStephen Shaw QUALIFIED
Clifford RimGermanyStephen Shaw RENEWAL
Julie StensethSpainOnyama Limba PROPOSAL
Maria MarrierCanadaOnyama Limba QUALIFIED
Aruna FigeroaUnited KingdomBernardo Dominic UNQUALIFIED
Wickens NestleFranceIoni Bowcher NEW
Aditya KuskoIndiaIoni Bowcher UNQUALIFIED
Murillo MaletJapanIoni Bowcher RENEWAL
Stacey MacleadUnited KingdomAsiya Javayant PROPOSAL
Kadeem FlosiCanadaXuxue Feng NEW
Jennifer AmigonCanadaIvan Magalhaes RENEWAL
Johnson SergiUnited KingdomBernardo Dominic UNQUALIFIED
Leon OldroydIndiaIoni Bowcher NEGOTIATION
Morrow RutaGermanyBernardo Dominic NEGOTIATION
Claire TollnerBrazilAnna Fali PROPOSAL
Alejandro PerinRussiaAnna Fali RENEWAL
Francesco ShinkoJapanBernardo Dominic PROPOSAL
Antonio CaudySpainElwin Sharvill QUALIFIED
Claire TollnerRussiaElwin Sharvill RENEWAL
Greenwood BologniaJapanStephen Shaw NEW
Isabel BowleyBrazilAnna Fali UNQUALIFIED
Chavez BriddickIndiaElwin Sharvill UNQUALIFIED
Juan WieserCanadaIvan Magalhaes PROPOSAL
Aika InouyeRussiaOnyama Limba PROPOSAL
Claire TollnerAustraliaOnyama Limba QUALIFIED
Izzy GarufiArgentinaXuxue Feng UNQUALIFIED
Rodrigues CampainCanadaElwin Sharvill NEW
Morrow RutaFranceIvan Magalhaes NEW
James ButtIndiaIvan Magalhaes PROPOSAL
David DarakjySpainIoni Bowcher RENEWAL
Clifford RimUnited KingdomElwin Sharvill NEW
Jefferson SchemmerUnited KingdomIvan Magalhaes QUALIFIED
Mujtaba NickaBrazilIoni Bowcher RENEWAL
Arvin AlbaresIndiaElwin Sharvill PROPOSAL
Izzy GarufiSpainIvan Magalhaes PROPOSAL
Frozen Columns
Name
Stacey Maclead
Murillo Malet
Costa Dilliard
Murillo Malet
Aruna Figeroa
Adams Morasca
Juan Wieser
Silvio Slusarski
Salvatore Stockham
Francesco Shinko
Ricardo Gaucho
Chavez Briddick
David Darakjy
Murillo Malet
Mayumi Kolmetz
Kaitlin Ostrosky
Mujtaba Nicka
Smith Glick
James Butt
Mujtaba Nicka
Tony Foller
Murillo Malet
Isabel Bowley
Mayumi Kolmetz
Adams Morasca
Silvio Slusarski
Francesco Shinko
Salvatore Stockham
Mayumi Kolmetz
Salvatore Stockham
Maisha Rulapaugh
Greenwood Bolognia
Leja Caldarera
Jones Vocelka
Wickens Nestle
James Butt
Aditya Kusko
Jefferson Schemmer
Misaki Royster
Emily Whobrey
Salvatore Stockham
Emily Whobrey
Misaki Royster
Silvio Slusarski
Isabel Bowley
Kaitlin Ostrosky
Kaitlin Ostrosky
Maria Marrier
David Darakjy
Deepesh Chui
IdCountryDate
1000Russia2025-10-17
1001Spain2025-09-22
1002Italy2025-09-22
1003Spain2025-10-17
1004Australia2025-10-04
1005Russia2025-09-23
1006India2025-10-03
1007United Kingdom2025-09-22
1008India2025-10-15
1009United Kingdom2025-10-12
1010Japan2025-09-30
1011United Kingdom2025-09-21
1012Australia2025-09-28
1013Italy2025-09-24
1014Germany2025-09-30
1015Australia2025-10-15
1016Russia2025-10-05
1017Australia2025-10-18
1018United Kingdom2025-10-02
1019Australia2025-10-02
1020Australia2025-10-04
1021France2025-10-06
1022France2025-09-22
1023Italy2025-10-15
1024Brazil2025-10-06
1025Australia2025-10-18
1026Spain2025-10-18
1027United Kingdom2025-09-22
1028United Kingdom2025-09-26
1029Australia2025-10-17
1030Australia2025-10-17
1031Australia2025-09-25
1032Italy2025-10-06
1033Spain2025-10-11
1034Italy2025-09-21
1035Argentina2025-10-05
1036India2025-09-23
1037Australia2025-09-29
1038Canada2025-09-28
1039Spain2025-10-12
1040Brazil2025-10-01
1041Spain2025-10-17
1042Argentina2025-10-10
1043France2025-09-23
1044Russia2025-10-15
1045Italy2025-10-05
1046Australia2025-10-06
1047Canada2025-10-12
1048Australia2025-09-28
1049Spain2025-10-05

On-Demand Data

NameIdCountryDate
Johnson Sergi1000Spain2025-10-17
Faith Gillian1001France2025-09-24
Maria Marrier1002United Kingdom2025-10-13
Deepesh Chui1003Russia2025-10-03
Nicolas Iturbide1004Australia2025-09-22
Ivar Paprocki1005Japan2025-09-29
Ivar Paprocki1006Japan2025-10-16
Misaki Royster1007Australia2025-10-11
Greenwood Bolognia1008Argentina2025-09-30
James Butt1009Australia2025-10-07
Aruna Figeroa1010Japan2025-10-12
Mayumi Kolmetz1011France2025-10-13
Julie Stenseth1012Germany2025-10-01
Aditya Kusko1013Germany2025-10-06
Leon Oldroyd1014France2025-09-30
Kadeem Flosi1015Argentina2025-09-20
Smith Glick1016Australia2025-10-12
Izzy Garufi1017Japan2025-09-27
Claire Tollner1018India2025-10-01
Maria Marrier1019Japan2025-10-13
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Deepesh ChuiItalyAnna Fali PROPOSAL
Misaki RoysterIndiaIoni Bowcher PROPOSAL
Aika InouyeCanadaAnna Fali PROPOSAL
Francesco ShinkoIndiaStephen Shaw RENEWAL
Kaitlin OstroskyBrazilXuxue Feng RENEWAL
Aditya KuskoItalyAnna Fali QUALIFIED
Tony FollerIndiaElwin Sharvill NEGOTIATION
Leon OldroydBrazilAmy Elsner PROPOSAL
Murillo MaletIndiaIvan Magalhaes NEW
Morrow RutaArgentinaIvan Magalhaes RENEWAL
Munro FerenczFranceAnna Fali NEW
Mujtaba NickaBrazilBernardo Dominic RENEWAL
Greenwood BologniaIndiaIoni Bowcher NEW
Ricardo GauchoCanadaAnna Fali PROPOSAL
Nicolas IturbideIndiaIoni Bowcher UNQUALIFIED
Murillo MaletIndiaOnyama Limba NEGOTIATION
Mujtaba NickaArgentinaAmy Elsner NEGOTIATION
Rodrigues CampainSpainAmy Elsner UNQUALIFIED
Aruna FigeroaRussiaAmy Elsner PROPOSAL
Murillo MaletJapanAmy Elsner NEW
Rodrigues CampainAustraliaAmy Elsner PROPOSAL
Smith GlickFranceAmy Elsner UNQUALIFIED
Leja CaldareraArgentinaBernardo Dominic PROPOSAL
Maisha RulapaughUnited KingdomAmy Elsner QUALIFIED
Costa DilliardSpainAnna Fali NEGOTIATION
David DarakjyFranceXuxue Feng QUALIFIED
Clifford RimAustraliaAnna Fali UNQUALIFIED
Ashley DoeIndiaXuxue Feng RENEWAL
Alejandro PerinBrazilIoni Bowcher NEW
Juan WieserCanadaIvan Magalhaes RENEWAL
Jeanfrancois VenereFranceStephen Shaw UNQUALIFIED
Wickens NestleCanadaIvan Magalhaes RENEWAL
Rodrigues CampainItalyIvan Magalhaes NEW
Jeanfrancois VenereSpainIoni Bowcher NEGOTIATION
Emily WhobreyJapanOnyama Limba NEW
Aika InouyeFranceIvan Magalhaes NEW
Leja CaldareraAustraliaAnna Fali NEGOTIATION
Antonio CaudyJapanElwin Sharvill RENEWAL
James ButtGermanyXuxue Feng NEW
Deepesh ChuiAustraliaAmy Elsner 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>