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
Jefferson SchemmerJapanAmy Elsner QUALIFIED
Mujtaba NickaSpainAsiya Javayant PROPOSAL
Rodrigues CampainRussiaBernardo Dominic UNQUALIFIED
Ivar PaprockiSpainIvan Magalhaes NEGOTIATION
Aika InouyeItalyElwin Sharvill RENEWAL
Salvatore StockhamJapanAmy Elsner PROPOSAL
Isabel BowleyAustraliaAnna Fali QUALIFIED
Jefferson SchemmerArgentinaXuxue Feng UNQUALIFIED
Aditya KuskoCanadaOnyama Limba QUALIFIED
Julie StensethSpainAnna Fali QUALIFIED
David DarakjyGermanyElwin Sharvill NEGOTIATION
Tony FollerArgentinaAsiya Javayant PROPOSAL
Mujtaba NickaSpainIvan Magalhaes NEGOTIATION
Ashley DoeFranceIoni Bowcher NEW
Stacey MacleadGermanyAmy Elsner UNQUALIFIED
Salvatore StockhamArgentinaIvan Magalhaes QUALIFIED
Salvatore StockhamCanadaAsiya Javayant PROPOSAL
Misaki RoysterIndiaAmy Elsner UNQUALIFIED
David DarakjyGermanyAnna Fali RENEWAL
Aruna FigeroaJapanAnna Fali NEW
Aruna FigeroaRussiaElwin Sharvill UNQUALIFIED
Deepesh ChuiAustraliaAnna Fali UNQUALIFIED
Cody SaylorsAustraliaIvan Magalhaes RENEWAL
Clifford RimIndiaBernardo Dominic RENEWAL
James ButtArgentinaStephen Shaw UNQUALIFIED
Faith GillianUnited KingdomStephen Shaw NEGOTIATION
Ashley DoeSpainElwin Sharvill UNQUALIFIED
Smith GlickItalyXuxue Feng PROPOSAL
Leja CaldareraAustraliaAsiya Javayant QUALIFIED
Darci PoquetteIndiaIvan Magalhaes QUALIFIED
Arvin AlbaresFranceIvan Magalhaes UNQUALIFIED
Kadeem FlosiGermanyElwin Sharvill PROPOSAL
Smith GlickSpainElwin Sharvill UNQUALIFIED
Cody SaylorsJapanOnyama Limba UNQUALIFIED
Deepesh ChuiFranceBernardo Dominic UNQUALIFIED
Munro FerenczIndiaAsiya Javayant UNQUALIFIED
David DarakjyIndiaAmy Elsner PROPOSAL
Leja CaldareraSpainXuxue Feng RENEWAL
Julie StensethFranceXuxue Feng NEGOTIATION
Kadeem FlosiGermanyIvan Magalhaes RENEWAL
Leon OldroydGermanyAnna Fali RENEWAL
Nicolas IturbideBrazilAnna Fali NEGOTIATION
Adams MorascaFranceAmy Elsner QUALIFIED
Darci PoquetteBrazilIoni Bowcher UNQUALIFIED
Wickens NestleBrazilElwin Sharvill PROPOSAL
Clifford RimArgentinaAmy Elsner RENEWAL
Stacey MacleadBrazilIvan Magalhaes NEW
Smith GlickJapanOnyama Limba RENEWAL
Salvatore StockhamFranceAsiya Javayant UNQUALIFIED
Silvio SlusarskiIndiaElwin Sharvill PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Kaitlin OstroskyUnited KingdomOnyama Limba QUALIFIED
Jennifer AmigonRussiaIvan Magalhaes NEGOTIATION
Jones VocelkaArgentinaStephen Shaw QUALIFIED
Claire TollnerItalyAnna Fali RENEWAL
Aruna FigeroaIndiaIoni Bowcher PROPOSAL
Morrow RutaFranceAmy Elsner PROPOSAL
James ButtBrazilAnna Fali NEGOTIATION
Tony FollerJapanAnna Fali PROPOSAL
Kadeem FlosiBrazilAmy Elsner RENEWAL
Octavia MaletCanadaXuxue Feng NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Rodrigues CampainGermany2026-05-16Chemel, James L Cpa UNQUALIFIED93Ioni Bowcher
1001Wickens NestleCanada2026-05-29Dorl, James J Esq NEGOTIATION18Ivan Magalhaes
1002Jefferson SchemmerItaly2026-05-15Chapman, Ross E Esq NEGOTIATION66Ioni Bowcher
1003Arvin AlbaresBrazil2026-06-05Printing Dimensions UNQUALIFIED38Ioni Bowcher
1004Salvatore StockhamCanada2026-06-04Feiner Bros NEGOTIATION26Anna Fali
1005Nicolas IturbideArgentina2026-06-07Benton, John B Jr NEW18Elwin Sharvill
1006Darci PoquetteJapan2026-05-14Chapman, Ross E Esq PROPOSAL28Amy Elsner
1007Salvatore StockhamBrazil2026-05-13Rousseaux, Michael Esq NEW88Anna Fali
1008Smith GlickIndia2026-05-20Feiner Bros NEGOTIATION14Bernardo Dominic
1009Munro FerenczJapan2026-05-26Buckley Miller Wright UNQUALIFIED64Elwin Sharvill
1010Francesco ShinkoArgentina2026-06-06Benton, John B Jr NEW57Asiya Javayant
1011Emily WhobreyIndia2026-05-30Rangoni Of Florence RENEWAL42Ioni Bowcher
1012Jennifer AmigonIndia2026-05-29Feiner Bros RENEWAL94Amy Elsner
1013Mujtaba NickaSpain2026-05-20Chanay, Jeffrey A Esq QUALIFIED67Ioni Bowcher
1014Arvin AlbaresUnited Kingdom2026-05-22Feiner Bros PROPOSAL28Onyama Limba
1015Antonio CaudyFrance2026-05-24Morlong Associates NEGOTIATION92Ioni Bowcher
1016Leja CaldareraAustralia2026-05-23Rousseaux, Michael Esq UNQUALIFIED4Bernardo Dominic
1017Octavia MaletJapan2026-05-18Dorl, James J Esq PROPOSAL98Stephen Shaw
1018Rodrigues CampainRussia2026-06-05Morlong Associates QUALIFIED70Elwin Sharvill
1019Aruna FigeroaArgentina2026-05-19Truhlar And Truhlar Attys RENEWAL87Ioni Bowcher
1020David DarakjyIndia2026-05-29Truhlar And Truhlar Attys NEW3Elwin Sharvill
1021Jones VocelkaGermany2026-05-18Feltz Printing Service QUALIFIED30Xuxue Feng
1022Wickens NestleIndia2026-05-19Buckley Miller Wright QUALIFIED34Ioni Bowcher
1023Adams MorascaUnited Kingdom2026-05-26Rousseaux, Michael Esq NEGOTIATION74Elwin Sharvill
1024David DarakjyUnited Kingdom2026-05-14Chapman, Ross E Esq NEGOTIATION60Ioni Bowcher
1025Smith GlickBrazil2026-05-18Benton, John B Jr RENEWAL77Amy Elsner
1026Ivar PaprockiItaly2026-05-31Commercial Press NEGOTIATION80Ioni Bowcher
1027Leja CaldareraFrance2026-05-22Buckley Miller Wright QUALIFIED78Xuxue Feng
1028Clifford RimIndia2026-05-29Feltz Printing Service NEGOTIATION74Bernardo Dominic
1029Aruna FigeroaUnited Kingdom2026-05-22Morlong Associates NEW52Asiya Javayant
1030Jennifer AmigonAustralia2026-06-07Chanay, Jeffrey A Esq NEGOTIATION4Anna Fali
1031Ricardo GauchoAustralia2026-05-12Feltz Printing Service QUALIFIED56Ioni Bowcher
1032Jefferson SchemmerUnited Kingdom2026-05-12Morlong Associates PROPOSAL93Asiya Javayant
1033Sinclair WaycottJapan2026-05-11Truhlar And Truhlar Attys NEW41Stephen Shaw
1034Adams MorascaGermany2026-05-28Buckley Miller Wright PROPOSAL79Anna Fali
1035Salvatore StockhamAustralia2026-05-09Chanay, Jeffrey A Esq UNQUALIFIED55Anna Fali
1036Mujtaba NickaGermany2026-05-24Dorl, James J Esq UNQUALIFIED47Asiya Javayant
1037Octavia MaletBrazil2026-05-13Dorl, James J Esq PROPOSAL32Xuxue Feng
1038Cody SaylorsRussia2026-05-18Chemel, James L Cpa NEW60Stephen Shaw
1039Claire TollnerUnited Kingdom2026-05-27Chemel, James L Cpa QUALIFIED11Elwin Sharvill
1040Darci PoquetteRussia2026-05-19Dorl, James J Esq RENEWAL20Stephen Shaw
1041Aika InouyeGermany2026-05-30Chapman, Ross E Esq NEW62Onyama Limba
1042Isabel BowleySpain2026-05-09Benton, John B Jr PROPOSAL36Onyama Limba
1043Salvatore StockhamRussia2026-05-31Morlong Associates RENEWAL69Onyama Limba
1044Clifford RimUnited Kingdom2026-05-17Buckley Miller Wright PROPOSAL10Bernardo Dominic
1045Aditya KuskoIndia2026-05-10Printing Dimensions RENEWAL97Ivan Magalhaes
1046Munro FerenczCanada2026-05-27Morlong Associates NEGOTIATION32Stephen Shaw
1047Maisha RulapaughRussia2026-05-12Dorl, James J Esq UNQUALIFIED97Xuxue Feng
1048Deepesh ChuiUnited Kingdom2026-06-06Truhlar And Truhlar Attys UNQUALIFIED76Elwin Sharvill
1049Cody SaylorsRussia2026-05-16Morlong Associates QUALIFIED15Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Octavia MaletSpainAmy Elsner RENEWAL
Nicolas IturbideIndiaBernardo Dominic PROPOSAL
Ashley DoeUnited KingdomIoni Bowcher QUALIFIED
Emily WhobreyRussiaAmy Elsner RENEWAL
Kaitlin OstroskyIndiaAmy Elsner PROPOSAL
Ricardo GauchoBrazilAmy Elsner PROPOSAL
Adams MorascaBrazilIvan Magalhaes NEW
Izzy GarufiBrazilAnna Fali QUALIFIED
Octavia MaletItalyAsiya Javayant NEGOTIATION
Leja CaldareraAustraliaXuxue Feng NEGOTIATION
Stacey MacleadSpainOnyama Limba UNQUALIFIED
Ashley DoeFranceAsiya Javayant QUALIFIED
Leon OldroydSpainStephen Shaw NEW
Cody SaylorsCanadaIoni Bowcher QUALIFIED
Tony FollerBrazilIvan Magalhaes UNQUALIFIED
Francesco ShinkoArgentinaStephen Shaw RENEWAL
David DarakjyRussiaElwin Sharvill UNQUALIFIED
Alejandro PerinSpainAsiya Javayant UNQUALIFIED
Leon OldroydJapanElwin Sharvill UNQUALIFIED
Darci PoquetteUnited KingdomElwin Sharvill UNQUALIFIED
Costa DilliardGermanyAsiya Javayant QUALIFIED
Morrow RutaBrazilAsiya Javayant NEGOTIATION
Mujtaba NickaFranceIvan Magalhaes RENEWAL
Francesco ShinkoArgentinaIvan Magalhaes NEW
David DarakjyIndiaBernardo Dominic NEW
Mayumi KolmetzIndiaAsiya Javayant PROPOSAL
Smith GlickGermanyOnyama Limba RENEWAL
Juan WieserArgentinaAnna Fali UNQUALIFIED
Wickens NestleJapanAnna Fali UNQUALIFIED
Octavia MaletGermanyXuxue Feng PROPOSAL
Aditya KuskoGermanyXuxue Feng PROPOSAL
David DarakjyBrazilBernardo Dominic NEGOTIATION
Jefferson SchemmerAustraliaXuxue Feng RENEWAL
Chavez BriddickSpainXuxue Feng QUALIFIED
Clifford RimFranceXuxue Feng UNQUALIFIED
Jones VocelkaCanadaXuxue Feng NEGOTIATION
Julie StensethUnited KingdomXuxue Feng RENEWAL
Misaki RoysterUnited KingdomAmy Elsner QUALIFIED
Jefferson SchemmerBrazilAnna Fali NEGOTIATION
Salvatore StockhamIndiaAnna Fali PROPOSAL
Wickens NestleBrazilElwin Sharvill NEW
Deepesh ChuiUnited KingdomXuxue Feng RENEWAL
David DarakjyIndiaOnyama Limba NEW
Maria MarrierJapanAnna Fali NEGOTIATION
Johnson SergiArgentinaIvan Magalhaes NEW
Emily WhobreyItalyOnyama Limba NEW
Julie StensethBrazilAnna Fali NEGOTIATION
Faith GillianIndiaStephen Shaw RENEWAL
Mayumi KolmetzSpainIvan Magalhaes RENEWAL
Emily WhobreyJapanIoni Bowcher RENEWAL
Frozen Columns
Name
Faith Gillian
Kadeem Flosi
Ivar Paprocki
Misaki Royster
Ashley Doe
Kaitlin Ostrosky
Francesco Shinko
Ashley Doe
Ricardo Gaucho
Darci Poquette
Munro Ferencz
Salvatore Stockham
Cody Saylors
Greenwood Bolognia
Cody Saylors
Jones Vocelka
Francesco Shinko
Alejandro Perin
Jefferson Schemmer
Isabel Bowley
Johnson Sergi
Munro Ferencz
Cody Saylors
Mayumi Kolmetz
Ashley Doe
Kadeem Flosi
Mujtaba Nicka
Sinclair Waycott
Leja Caldarera
Misaki Royster
Juan Wieser
Stacey Maclead
Jeanfrancois Venere
Francesco Shinko
Nicolas Iturbide
Kadeem Flosi
Jennifer Amigon
Darci Poquette
Mujtaba Nicka
Emily Whobrey
Maisha Rulapaugh
Faith Gillian
Chavez Briddick
Ashley Doe
Smith Glick
Emily Whobrey
Salvatore Stockham
Juan Wieser
Jefferson Schemmer
James Butt
IdCountryDate
1000Russia2026-05-13
1001Argentina2026-05-30
1002Germany2026-06-02
1003Germany2026-05-24
1004Italy2026-05-17
1005Spain2026-05-21
1006India2026-05-31
1007Brazil2026-05-31
1008Brazil2026-05-10
1009Japan2026-05-23
1010India2026-05-14
1011Brazil2026-05-22
1012Japan2026-05-26
1013United Kingdom2026-06-07
1014Australia2026-05-16
1015Italy2026-05-24
1016India2026-06-03
1017Canada2026-05-22
1018India2026-06-03
1019Canada2026-05-16
1020Japan2026-05-16
1021Russia2026-05-12
1022Brazil2026-05-14
1023Brazil2026-05-22
1024Australia2026-05-23
1025Russia2026-05-25
1026Italy2026-05-23
1027Germany2026-05-23
1028Russia2026-05-09
1029Canada2026-06-06
1030Spain2026-05-11
1031Germany2026-05-18
1032Argentina2026-05-14
1033India2026-05-31
1034Spain2026-05-27
1035Japan2026-06-02
1036Brazil2026-05-14
1037France2026-05-23
1038France2026-05-11
1039Brazil2026-05-24
1040Spain2026-05-29
1041Argentina2026-06-02
1042Australia2026-06-04
1043Russia2026-05-12
1044Brazil2026-06-04
1045Italy2026-05-12
1046Argentina2026-05-14
1047Spain2026-05-14
1048Argentina2026-05-22
1049Japan2026-05-24

On-Demand Data

NameIdCountryDate
Costa Dilliard1000Canada2026-06-01
Jones Vocelka1001Argentina2026-05-29
Darci Poquette1002Australia2026-05-17
Jennifer Amigon1003United Kingdom2026-06-02
Rodrigues Campain1004Argentina2026-05-13
Ricardo Gaucho1005Germany2026-05-14
Alejandro Perin1006Australia2026-06-07
Leon Oldroyd1007Brazil2026-06-07
Aditya Kusko1008Brazil2026-05-12
Octavia Malet1009Spain2026-05-29
Silvio Slusarski1010France2026-05-15
Alejandro Perin1011Russia2026-05-23
Stacey Maclead1012Argentina2026-05-17
Costa Dilliard1013Canada2026-05-19
Nicolas Iturbide1014Argentina2026-05-17
Kaitlin Ostrosky1015France2026-05-18
Aruna Figeroa1016Brazil2026-05-24
Juan Wieser1017Russia2026-05-17
Murillo Malet1018Germany2026-05-25
Jeanfrancois Venere1019Australia2026-05-18
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Claire TollnerGermanyBernardo Dominic NEGOTIATION
Cody SaylorsIndiaIoni Bowcher RENEWAL
Maisha RulapaughGermanyAsiya Javayant NEW
Costa DilliardUnited KingdomElwin Sharvill PROPOSAL
David DarakjyRussiaElwin Sharvill NEW
Ashley DoeUnited KingdomAsiya Javayant NEW
Jefferson SchemmerGermanyOnyama Limba PROPOSAL
Sinclair WaycottIndiaAnna Fali RENEWAL
Juan WieserGermanyOnyama Limba UNQUALIFIED
James ButtArgentinaAnna Fali NEGOTIATION
Arvin AlbaresBrazilAnna Fali QUALIFIED
Jefferson SchemmerFranceAnna Fali UNQUALIFIED
Kaitlin OstroskyJapanStephen Shaw QUALIFIED
James ButtBrazilIvan Magalhaes RENEWAL
Greenwood BologniaRussiaIoni Bowcher NEGOTIATION
Sinclair WaycottSpainElwin Sharvill RENEWAL
Ivar PaprockiJapanAmy Elsner QUALIFIED
Julie StensethBrazilElwin Sharvill RENEWAL
Alejandro PerinSpainIoni Bowcher UNQUALIFIED
Greenwood BologniaAustraliaElwin Sharvill NEW
James ButtAustraliaElwin Sharvill QUALIFIED
Ivar PaprockiCanadaAsiya Javayant RENEWAL
Arvin AlbaresArgentinaAsiya Javayant QUALIFIED
Claire TollnerUnited KingdomBernardo Dominic NEW
Rodrigues CampainUnited KingdomAsiya Javayant RENEWAL
Leja CaldareraFranceIvan Magalhaes NEGOTIATION
David DarakjyAustraliaAmy Elsner NEW
David DarakjyIndiaIoni Bowcher RENEWAL
Kaitlin OstroskyArgentinaAsiya Javayant NEGOTIATION
Faith GillianCanadaBernardo Dominic NEW
Morrow RutaUnited KingdomBernardo Dominic RENEWAL
Julie StensethItalyStephen Shaw UNQUALIFIED
Emily WhobreyItalyAnna Fali QUALIFIED
Jones VocelkaJapanOnyama Limba QUALIFIED
Misaki RoysterRussiaIvan Magalhaes UNQUALIFIED
Nicolas IturbideUnited KingdomOnyama Limba QUALIFIED
Aruna FigeroaSpainElwin Sharvill QUALIFIED
Juan WieserRussiaAsiya Javayant UNQUALIFIED
Salvatore StockhamFranceIoni Bowcher NEW
Claire TollnerBrazilIoni Bowcher 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>