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
Aruna FigeroaBrazilOnyama Limba NEW
Munro FerenczBrazilIvan Magalhaes PROPOSAL
Isabel BowleyBrazilIoni Bowcher QUALIFIED
Juan WieserBrazilAnna Fali QUALIFIED
Nicolas IturbideJapanAnna Fali NEW
Greenwood BologniaArgentinaAsiya Javayant UNQUALIFIED
Izzy GarufiUnited KingdomBernardo Dominic UNQUALIFIED
Jones VocelkaRussiaElwin Sharvill NEW
Mayumi KolmetzItalyAnna Fali QUALIFIED
Jennifer AmigonBrazilXuxue Feng QUALIFIED
Nicolas IturbideJapanOnyama Limba QUALIFIED
Sinclair WaycottUnited KingdomOnyama Limba PROPOSAL
Francesco ShinkoArgentinaAmy Elsner RENEWAL
Clifford RimIndiaBernardo Dominic RENEWAL
Munro FerenczBrazilIoni Bowcher RENEWAL
Aika InouyeCanadaElwin Sharvill UNQUALIFIED
Alejandro PerinBrazilAnna Fali UNQUALIFIED
Juan WieserFranceAmy Elsner PROPOSAL
Darci PoquetteRussiaAnna Fali NEW
Munro FerenczCanadaAsiya Javayant PROPOSAL
Julie StensethGermanyElwin Sharvill NEGOTIATION
Smith GlickCanadaIoni Bowcher PROPOSAL
Stacey MacleadCanadaAmy Elsner PROPOSAL
Deepesh ChuiUnited KingdomAnna Fali PROPOSAL
Arvin AlbaresBrazilElwin Sharvill QUALIFIED
Jones VocelkaItalyStephen Shaw UNQUALIFIED
Murillo MaletFranceAsiya Javayant QUALIFIED
Kadeem FlosiAustraliaXuxue Feng NEGOTIATION
Murillo MaletSpainStephen Shaw NEGOTIATION
Octavia MaletAustraliaElwin Sharvill PROPOSAL
Silvio SlusarskiJapanStephen Shaw RENEWAL
Smith GlickRussiaXuxue Feng NEW
Silvio SlusarskiItalyOnyama Limba UNQUALIFIED
Antonio CaudyJapanOnyama Limba PROPOSAL
Leon OldroydFranceXuxue Feng UNQUALIFIED
Salvatore StockhamFranceAsiya Javayant NEW
Kadeem FlosiRussiaXuxue Feng QUALIFIED
Faith GillianJapanAmy Elsner NEGOTIATION
Aruna FigeroaFranceElwin Sharvill RENEWAL
Octavia MaletFranceAsiya Javayant RENEWAL
Jennifer AmigonRussiaStephen Shaw UNQUALIFIED
Ivar PaprockiSpainXuxue Feng NEW
Antonio CaudyBrazilIvan Magalhaes QUALIFIED
Morrow RutaGermanyElwin Sharvill QUALIFIED
James ButtRussiaAmy Elsner RENEWAL
Costa DilliardItalyAsiya Javayant RENEWAL
Izzy GarufiFranceBernardo Dominic RENEWAL
Francesco ShinkoUnited KingdomOnyama Limba RENEWAL
Costa DilliardAustraliaAsiya Javayant PROPOSAL
Emily WhobreyAustraliaBernardo Dominic RENEWAL
Horizontal
NameCountryRepresentativeStatus
Jennifer AmigonRussiaAmy Elsner PROPOSAL
Greenwood BologniaJapanBernardo Dominic RENEWAL
Jeanfrancois VenereArgentinaIvan Magalhaes QUALIFIED
Aditya KuskoItalyOnyama Limba QUALIFIED
Aditya KuskoSpainBernardo Dominic RENEWAL
Kaitlin OstroskyRussiaIoni Bowcher NEW
Alejandro PerinItalyStephen Shaw PROPOSAL
Munro FerenczUnited KingdomIoni Bowcher PROPOSAL
Faith GillianRussiaBernardo Dominic RENEWAL
Alejandro PerinBrazilElwin Sharvill UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Deepesh ChuiJapan2025-07-16Chapman, Ross E Esq NEGOTIATION65Asiya Javayant
1001James ButtGermany2025-08-06Buckley Miller Wright NEGOTIATION7Asiya Javayant
1002Mayumi KolmetzGermany2025-08-01Benton, John B Jr RENEWAL32Xuxue Feng
1003Leon OldroydCanada2025-07-31Benton, John B Jr PROPOSAL45Elwin Sharvill
1004Antonio CaudyUnited Kingdom2025-07-27Dorl, James J Esq RENEWAL32Bernardo Dominic
1005Kadeem FlosiUnited Kingdom2025-08-04Truhlar And Truhlar Attys RENEWAL17Onyama Limba
1006Isabel BowleySpain2025-07-19Chanay, Jeffrey A Esq UNQUALIFIED89Onyama Limba
1007Clifford RimSpain2025-08-13Morlong Associates NEW26Asiya Javayant
1008Octavia MaletItaly2025-07-22Benton, John B Jr UNQUALIFIED62Stephen Shaw
1009Izzy GarufiArgentina2025-08-10Benton, John B Jr UNQUALIFIED40Asiya Javayant
1010Mayumi KolmetzAustralia2025-07-18Truhlar And Truhlar Attys QUALIFIED74Xuxue Feng
1011Ivar PaprockiArgentina2025-07-25Dorl, James J Esq NEGOTIATION36Ioni Bowcher
1012Faith GillianRussia2025-07-17Morlong Associates NEW55Ivan Magalhaes
1013Mayumi KolmetzSpain2025-08-09Chapman, Ross E Esq NEW20Xuxue Feng
1014Julie StensethSpain2025-07-22Chanay, Jeffrey A Esq RENEWAL28Xuxue Feng
1015Morrow RutaArgentina2025-08-05Chanay, Jeffrey A Esq NEW47Stephen Shaw
1016Emily WhobreyRussia2025-07-31Morlong Associates QUALIFIED61Ivan Magalhaes
1017Aruna FigeroaSpain2025-07-26Printing Dimensions UNQUALIFIED54Anna Fali
1018Kadeem FlosiUnited Kingdom2025-07-15Printing Dimensions PROPOSAL42Asiya Javayant
1019Darci PoquetteArgentina2025-07-20Commercial Press UNQUALIFIED6Ivan Magalhaes
1020Sinclair WaycottSpain2025-08-04Chemel, James L Cpa QUALIFIED81Anna Fali
1021Francesco ShinkoItaly2025-08-11Printing Dimensions NEW79Xuxue Feng
1022Munro FerenczSpain2025-08-02Rangoni Of Florence RENEWAL55Xuxue Feng
1023Kaitlin OstroskyIndia2025-07-18Feltz Printing Service UNQUALIFIED92Amy Elsner
1024Morrow RutaRussia2025-07-23King, Christopher A Esq NEGOTIATION74Xuxue Feng
1025Aika InouyeBrazil2025-08-03Rousseaux, Michael Esq NEW57Amy Elsner
1026Johnson SergiBrazil2025-07-27Dorl, James J Esq UNQUALIFIED24Xuxue Feng
1027Mayumi KolmetzGermany2025-07-27King, Christopher A Esq RENEWAL64Xuxue Feng
1028Adams MorascaFrance2025-07-23Feiner Bros PROPOSAL65Onyama Limba
1029James ButtArgentina2025-08-05Morlong Associates NEW6Asiya Javayant
1030Aruna FigeroaUnited Kingdom2025-08-13Printing Dimensions QUALIFIED91Bernardo Dominic
1031Clifford RimIndia2025-07-18Chapman, Ross E Esq RENEWAL56Onyama Limba
1032Kadeem FlosiIndia2025-07-24Commercial Press UNQUALIFIED82Onyama Limba
1033Deepesh ChuiCanada2025-07-20Rangoni Of Florence QUALIFIED89Onyama Limba
1034Smith GlickItaly2025-08-09Morlong Associates NEW36Bernardo Dominic
1035Leon OldroydUnited Kingdom2025-08-11Morlong Associates RENEWAL90Onyama Limba
1036Misaki RoysterBrazil2025-07-24Truhlar And Truhlar Attys NEW25Bernardo Dominic
1037Emily WhobreyRussia2025-08-02Rangoni Of Florence NEW52Onyama Limba
1038Maisha RulapaughCanada2025-08-07Chemel, James L Cpa RENEWAL9Ivan Magalhaes
1039Costa DilliardRussia2025-08-10Commercial Press UNQUALIFIED21Ivan Magalhaes
1040Francesco ShinkoItaly2025-07-17Printing Dimensions RENEWAL38Ioni Bowcher
1041Isabel BowleyBrazil2025-07-20Chapman, Ross E Esq QUALIFIED70Xuxue Feng
1042Antonio CaudyAustralia2025-07-25Benton, John B Jr UNQUALIFIED40Ivan Magalhaes
1043Smith GlickFrance2025-08-04Feiner Bros UNQUALIFIED7Stephen Shaw
1044Julie StensethCanada2025-08-03Feltz Printing Service QUALIFIED28Stephen Shaw
1045James ButtGermany2025-08-10Dorl, James J Esq NEGOTIATION85Anna Fali
1046Leon OldroydAustralia2025-07-16Rousseaux, Michael Esq UNQUALIFIED52Ioni Bowcher
1047Silvio SlusarskiIndia2025-07-19Buckley Miller Wright RENEWAL41Stephen Shaw
1048Stacey MacleadIndia2025-08-11Truhlar And Truhlar Attys NEW31Elwin Sharvill
1049Juan WieserItaly2025-07-30Buckley Miller Wright UNQUALIFIED42Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Nicolas IturbideIndiaOnyama Limba NEGOTIATION
Antonio CaudyGermanyBernardo Dominic NEGOTIATION
Izzy GarufiItalyAnna Fali NEW
Silvio SlusarskiAustraliaOnyama Limba PROPOSAL
Emily WhobreyIndiaIoni Bowcher NEGOTIATION
Octavia MaletItalyElwin Sharvill PROPOSAL
Smith GlickCanadaAnna Fali RENEWAL
Smith GlickIndiaIoni Bowcher UNQUALIFIED
Maisha RulapaughAustraliaAmy Elsner PROPOSAL
Jennifer AmigonBrazilBernardo Dominic NEW
Chavez BriddickRussiaAnna Fali UNQUALIFIED
Aruna FigeroaJapanAsiya Javayant QUALIFIED
Johnson SergiSpainAnna Fali NEW
Ashley DoeArgentinaBernardo Dominic NEW
Juan WieserUnited KingdomOnyama Limba QUALIFIED
Morrow RutaItalyIoni Bowcher NEGOTIATION
Smith GlickCanadaBernardo Dominic NEW
Maisha RulapaughUnited KingdomAsiya Javayant NEW
Darci PoquetteItalyIoni Bowcher PROPOSAL
Ashley DoeUnited KingdomIoni Bowcher NEW
Munro FerenczArgentinaElwin Sharvill RENEWAL
Johnson SergiCanadaBernardo Dominic UNQUALIFIED
Salvatore StockhamBrazilBernardo Dominic NEW
Nicolas IturbideUnited KingdomStephen Shaw NEGOTIATION
Aditya KuskoBrazilIvan Magalhaes RENEWAL
David DarakjyRussiaBernardo Dominic NEW
Kadeem FlosiCanadaXuxue Feng RENEWAL
Izzy GarufiGermanyOnyama Limba NEGOTIATION
Cody SaylorsRussiaElwin Sharvill NEW
Ivar PaprockiSpainBernardo Dominic QUALIFIED
Morrow RutaJapanIvan Magalhaes PROPOSAL
Misaki RoysterCanadaBernardo Dominic QUALIFIED
Smith GlickIndiaAmy Elsner NEW
Greenwood BologniaCanadaAnna Fali QUALIFIED
Kadeem FlosiUnited KingdomAmy Elsner RENEWAL
Clifford RimArgentinaAsiya Javayant PROPOSAL
Cody SaylorsUnited KingdomAnna Fali UNQUALIFIED
Mayumi KolmetzJapanXuxue Feng PROPOSAL
Rodrigues CampainJapanElwin Sharvill NEW
Aika InouyeRussiaOnyama Limba QUALIFIED
Aditya KuskoCanadaOnyama Limba PROPOSAL
Izzy GarufiUnited KingdomAnna Fali QUALIFIED
Jennifer AmigonUnited KingdomElwin Sharvill QUALIFIED
Francesco ShinkoUnited KingdomAmy Elsner QUALIFIED
Clifford RimGermanyAmy Elsner PROPOSAL
Jones VocelkaRussiaElwin Sharvill PROPOSAL
Mayumi KolmetzAustraliaIvan Magalhaes PROPOSAL
Ricardo GauchoIndiaAmy Elsner PROPOSAL
Silvio SlusarskiCanadaOnyama Limba NEW
Costa DilliardSpainOnyama Limba RENEWAL
Frozen Columns
Name
Morrow Ruta
Adams Morasca
Kadeem Flosi
Kadeem Flosi
Juan Wieser
Silvio Slusarski
Arvin Albares
Izzy Garufi
Johnson Sergi
Octavia Malet
Maria Marrier
Alejandro Perin
Isabel Bowley
Costa Dilliard
David Darakjy
David Darakjy
Wickens Nestle
Isabel Bowley
Greenwood Bolognia
Maisha Rulapaugh
Mujtaba Nicka
Aditya Kusko
Darci Poquette
Greenwood Bolognia
James Butt
Nicolas Iturbide
Ivar Paprocki
Octavia Malet
Nicolas Iturbide
Darci Poquette
Kadeem Flosi
Stacey Maclead
Juan Wieser
Munro Ferencz
Emily Whobrey
Kaitlin Ostrosky
Jennifer Amigon
Kadeem Flosi
Darci Poquette
Ivar Paprocki
Aika Inouye
Adams Morasca
Jefferson Schemmer
Mujtaba Nicka
Izzy Garufi
Ricardo Gaucho
Morrow Ruta
Misaki Royster
Leja Caldarera
Sinclair Waycott
IdCountryDate
1000Japan2025-08-02
1001Germany2025-07-27
1002Brazil2025-07-21
1003Argentina2025-08-09
1004India2025-08-01
1005Italy2025-08-08
1006United Kingdom2025-08-01
1007United Kingdom2025-08-04
1008Spain2025-08-13
1009France2025-08-09
1010Italy2025-08-01
1011France2025-07-27
1012Germany2025-07-18
1013Argentina2025-07-24
1014Germany2025-07-23
1015Germany2025-07-24
1016Italy2025-07-23
1017Brazil2025-07-26
1018Japan2025-07-26
1019Argentina2025-08-05
1020France2025-07-31
1021Italy2025-07-19
1022Canada2025-07-19
1023Spain2025-07-23
1024Germany2025-07-18
1025Japan2025-08-09
1026France2025-07-26
1027Japan2025-08-01
1028Australia2025-07-28
1029Australia2025-07-25
1030Germany2025-07-26
1031Japan2025-08-04
1032France2025-07-27
1033Germany2025-08-12
1034India2025-08-12
1035Brazil2025-07-26
1036Argentina2025-07-25
1037Canada2025-08-13
1038Brazil2025-08-01
1039Germany2025-07-15
1040France2025-07-28
1041Argentina2025-08-02
1042Russia2025-08-01
1043Japan2025-07-28
1044Spain2025-07-22
1045Canada2025-07-30
1046Italy2025-07-27
1047Argentina2025-07-25
1048Australia2025-08-11
1049United Kingdom2025-07-25

On-Demand Data

NameIdCountryDate
Maria Marrier1000France2025-07-23
Jefferson Schemmer1001France2025-07-19
Tony Foller1002Japan2025-08-09
Tony Foller1003Spain2025-07-26
Aruna Figeroa1004India2025-07-22
Izzy Garufi1005Japan2025-07-24
Mujtaba Nicka1006United Kingdom2025-08-02
Ivar Paprocki1007Russia2025-08-05
Mujtaba Nicka1008France2025-08-02
Arvin Albares1009Argentina2025-07-16
Emily Whobrey1010Argentina2025-07-30
Faith Gillian1011India2025-07-15
Adams Morasca1012Russia2025-07-20
Francesco Shinko1013Canada2025-08-08
Wickens Nestle1014Italy2025-07-28
Chavez Briddick1015United Kingdom2025-08-11
Julie Stenseth1016India2025-07-22
Salvatore Stockham1017Japan2025-08-06
Wickens Nestle1018Canada2025-07-16
Octavia Malet1019Germany2025-07-30
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Ivar PaprockiIndiaStephen Shaw QUALIFIED
Costa DilliardItalyAmy Elsner NEW
Antonio CaudyFranceBernardo Dominic UNQUALIFIED
Julie StensethUnited KingdomBernardo Dominic RENEWAL
Mujtaba NickaUnited KingdomAmy Elsner PROPOSAL
Wickens NestleGermanyAmy Elsner NEW
Deepesh ChuiJapanStephen Shaw QUALIFIED
Mayumi KolmetzGermanyBernardo Dominic QUALIFIED
Aruna FigeroaAustraliaOnyama Limba RENEWAL
Leon OldroydJapanAsiya Javayant QUALIFIED
Leja CaldareraIndiaBernardo Dominic NEW
Morrow RutaItalyOnyama Limba UNQUALIFIED
Aditya KuskoAustraliaAmy Elsner RENEWAL
Octavia MaletSpainOnyama Limba RENEWAL
Octavia MaletAustraliaOnyama Limba RENEWAL
Darci PoquetteJapanStephen Shaw NEW
Arvin AlbaresUnited KingdomAsiya Javayant NEW
Morrow RutaBrazilAmy Elsner PROPOSAL
Maisha RulapaughBrazilElwin Sharvill UNQUALIFIED
Maisha RulapaughBrazilIvan Magalhaes UNQUALIFIED
Antonio CaudyRussiaStephen Shaw PROPOSAL
Morrow RutaArgentinaIvan Magalhaes QUALIFIED
Jones VocelkaAustraliaAsiya Javayant NEW
Emily WhobreyIndiaIoni Bowcher NEGOTIATION
Maria MarrierRussiaStephen Shaw UNQUALIFIED
Morrow RutaCanadaAsiya Javayant QUALIFIED
Salvatore StockhamRussiaAsiya Javayant QUALIFIED
Claire TollnerUnited KingdomIoni Bowcher RENEWAL
Costa DilliardRussiaBernardo Dominic RENEWAL
Johnson SergiSpainOnyama Limba PROPOSAL
Jeanfrancois VenereFranceIoni Bowcher RENEWAL
Kaitlin OstroskyAustraliaStephen Shaw PROPOSAL
Francesco ShinkoCanadaElwin Sharvill PROPOSAL
Faith GillianSpainXuxue Feng UNQUALIFIED
Greenwood BologniaCanadaAmy Elsner NEGOTIATION
James ButtIndiaElwin Sharvill RENEWAL
Mayumi KolmetzIndiaAsiya Javayant NEGOTIATION
Ivar PaprockiCanadaAnna Fali NEGOTIATION
Mayumi KolmetzItalyElwin Sharvill NEGOTIATION
Wickens NestleIndiaOnyama Limba 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>