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
Leja CaldareraCanadaBernardo Dominic RENEWAL
Munro FerenczCanadaXuxue Feng QUALIFIED
Tony FollerArgentinaElwin Sharvill UNQUALIFIED
Darci PoquetteArgentinaIoni Bowcher NEGOTIATION
Mayumi KolmetzGermanyAsiya Javayant PROPOSAL
Misaki RoysterRussiaOnyama Limba NEGOTIATION
Aika InouyeAustraliaAnna Fali NEW
Mujtaba NickaRussiaAsiya Javayant UNQUALIFIED
Octavia MaletRussiaAmy Elsner PROPOSAL
Misaki RoysterSpainElwin Sharvill NEGOTIATION
Munro FerenczRussiaElwin Sharvill NEW
Ivar PaprockiItalyXuxue Feng NEGOTIATION
Jennifer AmigonJapanIvan Magalhaes UNQUALIFIED
Ivar PaprockiArgentinaAmy Elsner PROPOSAL
Isabel BowleySpainStephen Shaw PROPOSAL
Jennifer AmigonJapanElwin Sharvill QUALIFIED
Cody SaylorsRussiaStephen Shaw UNQUALIFIED
Alejandro PerinGermanyAnna Fali PROPOSAL
Arvin AlbaresJapanIoni Bowcher PROPOSAL
Darci PoquetteIndiaIvan Magalhaes PROPOSAL
Leon OldroydAustraliaAsiya Javayant PROPOSAL
Maisha RulapaughCanadaAsiya Javayant UNQUALIFIED
David DarakjySpainAsiya Javayant UNQUALIFIED
Faith GillianSpainIvan Magalhaes NEGOTIATION
Cody SaylorsArgentinaStephen Shaw NEW
Deepesh ChuiGermanyBernardo Dominic RENEWAL
Claire TollnerRussiaXuxue Feng QUALIFIED
Wickens NestleUnited KingdomAmy Elsner NEW
Alejandro PerinSpainBernardo Dominic UNQUALIFIED
Darci PoquetteCanadaIvan Magalhaes UNQUALIFIED
David DarakjyUnited KingdomAsiya Javayant NEGOTIATION
Jefferson SchemmerIndiaStephen Shaw PROPOSAL
Izzy GarufiFranceIvan Magalhaes QUALIFIED
Deepesh ChuiJapanStephen Shaw NEW
Maria MarrierUnited KingdomAmy Elsner NEGOTIATION
Wickens NestleBrazilXuxue Feng UNQUALIFIED
Ashley DoeJapanStephen Shaw NEGOTIATION
Aika InouyeGermanyIoni Bowcher NEGOTIATION
Cody SaylorsRussiaIoni Bowcher NEW
Maisha RulapaughArgentinaStephen Shaw UNQUALIFIED
Aika InouyeItalyBernardo Dominic PROPOSAL
Jefferson SchemmerArgentinaBernardo Dominic QUALIFIED
Jennifer AmigonCanadaAsiya Javayant NEW
Ashley DoeBrazilStephen Shaw NEGOTIATION
Octavia MaletJapanElwin Sharvill NEW
Chavez BriddickArgentinaElwin Sharvill PROPOSAL
Munro FerenczSpainAnna Fali QUALIFIED
Arvin AlbaresFranceAnna Fali PROPOSAL
Salvatore StockhamCanadaAmy Elsner PROPOSAL
Kaitlin OstroskyItalyOnyama Limba QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Cody SaylorsItalyIvan Magalhaes RENEWAL
Sinclair WaycottRussiaElwin Sharvill UNQUALIFIED
Aika InouyeJapanStephen Shaw NEGOTIATION
Johnson SergiFranceElwin Sharvill UNQUALIFIED
Stacey MacleadUnited KingdomAmy Elsner UNQUALIFIED
Julie StensethJapanIoni Bowcher NEW
Faith GillianUnited KingdomStephen Shaw PROPOSAL
Munro FerenczUnited KingdomBernardo Dominic RENEWAL
Jones VocelkaAustraliaAsiya Javayant UNQUALIFIED
Alejandro PerinFranceAmy Elsner QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Munro FerenczBrazil2026-04-13Printing Dimensions PROPOSAL23Stephen Shaw
1001Isabel BowleyIndia2026-04-22Rangoni Of Florence UNQUALIFIED16Ivan Magalhaes
1002Adams MorascaIndia2026-04-05Dorl, James J Esq UNQUALIFIED20Elwin Sharvill
1003Clifford RimFrance2026-03-29King, Christopher A Esq NEGOTIATION1Onyama Limba
1004Misaki RoysterItaly2026-04-12Printing Dimensions QUALIFIED97Stephen Shaw
1005Deepesh ChuiAustralia2026-04-21Printing Dimensions NEGOTIATION66Onyama Limba
1006Costa DilliardCanada2026-04-21Morlong Associates PROPOSAL76Ivan Magalhaes
1007Octavia MaletAustralia2026-04-03Chemel, James L Cpa PROPOSAL40Amy Elsner
1008Wickens NestleIndia2026-03-29Feltz Printing Service PROPOSAL46Bernardo Dominic
1009Octavia MaletArgentina2026-04-19Printing Dimensions NEGOTIATION34Elwin Sharvill
1010Clifford RimCanada2026-04-15Buckley Miller Wright PROPOSAL7Amy Elsner
1011Julie StensethFrance2026-04-11Truhlar And Truhlar Attys UNQUALIFIED7Ivan Magalhaes
1012Francesco ShinkoSpain2026-04-22King, Christopher A Esq RENEWAL30Elwin Sharvill
1013Octavia MaletIndia2026-03-28Chapman, Ross E Esq NEGOTIATION51Stephen Shaw
1014Maisha RulapaughJapan2026-04-23Chapman, Ross E Esq PROPOSAL58Ivan Magalhaes
1015Julie StensethAustralia2026-04-06Printing Dimensions UNQUALIFIED81Asiya Javayant
1016Nicolas IturbideUnited Kingdom2026-04-06Chanay, Jeffrey A Esq NEGOTIATION46Anna Fali
1017Johnson SergiArgentina2026-04-13Rangoni Of Florence PROPOSAL7Amy Elsner
1018Jones VocelkaAustralia2026-04-09Chanay, Jeffrey A Esq UNQUALIFIED91Xuxue Feng
1019Silvio SlusarskiBrazil2026-04-10Commercial Press RENEWAL59Xuxue Feng
1020Aditya KuskoUnited Kingdom2026-04-12Feiner Bros RENEWAL53Ivan Magalhaes
1021Maria MarrierCanada2026-04-05King, Christopher A Esq UNQUALIFIED38Anna Fali
1022Aruna FigeroaJapan2026-04-22King, Christopher A Esq QUALIFIED53Stephen Shaw
1023Misaki RoysterCanada2026-04-18Buckley Miller Wright UNQUALIFIED11Asiya Javayant
1024Wickens NestleArgentina2026-04-16King, Christopher A Esq RENEWAL78Stephen Shaw
1025Octavia MaletRussia2026-04-26Rousseaux, Michael Esq PROPOSAL25Onyama Limba
1026Clifford RimUnited Kingdom2026-04-06Dorl, James J Esq RENEWAL34Xuxue Feng
1027Adams MorascaAustralia2026-04-03Printing Dimensions UNQUALIFIED22Amy Elsner
1028Morrow RutaItaly2026-04-19Dorl, James J Esq PROPOSAL6Bernardo Dominic
1029Costa DilliardBrazil2026-03-31King, Christopher A Esq NEW54Bernardo Dominic
1030Deepesh ChuiCanada2026-04-16Morlong Associates QUALIFIED72Onyama Limba
1031Johnson SergiUnited Kingdom2026-04-09Benton, John B Jr RENEWAL86Amy Elsner
1032James ButtIndia2026-04-05Chemel, James L Cpa NEGOTIATION99Amy Elsner
1033Sinclair WaycottUnited Kingdom2026-04-22Rangoni Of Florence UNQUALIFIED59Elwin Sharvill
1034Octavia MaletArgentina2026-04-18Rangoni Of Florence NEW64Xuxue Feng
1035Aika InouyeFrance2026-04-15Feiner Bros QUALIFIED99Bernardo Dominic
1036Claire TollnerGermany2026-03-31Feltz Printing Service RENEWAL44Amy Elsner
1037Cody SaylorsItaly2026-04-26Chanay, Jeffrey A Esq UNQUALIFIED48Amy Elsner
1038Jennifer AmigonAustralia2026-04-16Benton, John B Jr NEW38Anna Fali
1039Costa DilliardGermany2026-03-28King, Christopher A Esq PROPOSAL10Ivan Magalhaes
1040Wickens NestleItaly2026-04-11Feltz Printing Service PROPOSAL55Asiya Javayant
1041Silvio SlusarskiArgentina2026-04-17Printing Dimensions NEW60Xuxue Feng
1042Francesco ShinkoIndia2026-04-03Commercial Press QUALIFIED85Ivan Magalhaes
1043Rodrigues CampainGermany2026-04-01Chemel, James L Cpa PROPOSAL3Anna Fali
1044David DarakjyBrazil2026-04-25Morlong Associates UNQUALIFIED70Xuxue Feng
1045Salvatore StockhamFrance2026-04-14Chemel, James L Cpa NEGOTIATION81Onyama Limba
1046Leja CaldareraGermany2026-04-11Buckley Miller Wright PROPOSAL68Onyama Limba
1047David DarakjyFrance2026-04-04Morlong Associates NEW97Asiya Javayant
1048Izzy GarufiSpain2026-04-17King, Christopher A Esq PROPOSAL99Stephen Shaw
1049Ashley DoeIndia2026-04-06Benton, John B Jr QUALIFIED56Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Mayumi KolmetzArgentinaXuxue Feng QUALIFIED
Jennifer AmigonBrazilOnyama Limba PROPOSAL
Mayumi KolmetzBrazilBernardo Dominic NEGOTIATION
Leon OldroydItalyOnyama Limba UNQUALIFIED
Maria MarrierArgentinaAsiya Javayant RENEWAL
Claire TollnerAustraliaOnyama Limba NEGOTIATION
Faith GillianUnited KingdomStephen Shaw NEGOTIATION
Tony FollerFranceIvan Magalhaes NEGOTIATION
Chavez BriddickFranceBernardo Dominic QUALIFIED
Jeanfrancois VenereItalyIoni Bowcher NEGOTIATION
Kaitlin OstroskyGermanyXuxue Feng NEW
Mujtaba NickaSpainOnyama Limba NEGOTIATION
Jeanfrancois VenereBrazilAnna Fali UNQUALIFIED
David DarakjyItalyElwin Sharvill UNQUALIFIED
Maria MarrierBrazilStephen Shaw NEW
Salvatore StockhamArgentinaAmy Elsner QUALIFIED
Mujtaba NickaUnited KingdomAmy Elsner UNQUALIFIED
Arvin AlbaresUnited KingdomAsiya Javayant RENEWAL
Cody SaylorsArgentinaOnyama Limba PROPOSAL
Munro FerenczSpainIoni Bowcher UNQUALIFIED
Maria MarrierAustraliaStephen Shaw PROPOSAL
Jeanfrancois VenereJapanAmy Elsner UNQUALIFIED
Adams MorascaUnited KingdomIvan Magalhaes RENEWAL
Smith GlickGermanyXuxue Feng NEW
Tony FollerIndiaIvan Magalhaes NEW
Francesco ShinkoJapanIoni Bowcher UNQUALIFIED
Adams MorascaGermanyAsiya Javayant UNQUALIFIED
Greenwood BologniaUnited KingdomIoni Bowcher RENEWAL
Jennifer AmigonCanadaOnyama Limba UNQUALIFIED
Arvin AlbaresBrazilOnyama Limba PROPOSAL
Kaitlin OstroskySpainAmy Elsner UNQUALIFIED
Jennifer AmigonFranceIvan Magalhaes NEW
Stacey MacleadAustraliaAsiya Javayant NEGOTIATION
Aika InouyeArgentinaStephen Shaw NEGOTIATION
Misaki RoysterSpainAsiya Javayant QUALIFIED
Tony FollerArgentinaElwin Sharvill RENEWAL
Mujtaba NickaArgentinaAsiya Javayant UNQUALIFIED
Aika InouyeGermanyBernardo Dominic PROPOSAL
Deepesh ChuiItalyOnyama Limba UNQUALIFIED
Francesco ShinkoRussiaAnna Fali PROPOSAL
Nicolas IturbideRussiaXuxue Feng RENEWAL
Mayumi KolmetzItalyAnna Fali NEW
Darci PoquetteFranceElwin Sharvill QUALIFIED
Aika InouyeBrazilOnyama Limba PROPOSAL
Deepesh ChuiCanadaIvan Magalhaes NEGOTIATION
Sinclair WaycottBrazilBernardo Dominic UNQUALIFIED
Ashley DoeItalyAsiya Javayant RENEWAL
Mayumi KolmetzArgentinaXuxue Feng RENEWAL
Greenwood BologniaGermanyAnna Fali RENEWAL
Rodrigues CampainAustraliaBernardo Dominic QUALIFIED
Frozen Columns
Name
Ashley Doe
Jefferson Schemmer
Faith Gillian
Francesco Shinko
Chavez Briddick
Sinclair Waycott
Deepesh Chui
Kadeem Flosi
Chavez Briddick
Mujtaba Nicka
Aruna Figeroa
Morrow Ruta
Darci Poquette
Clifford Rim
Chavez Briddick
Jefferson Schemmer
Jones Vocelka
Mujtaba Nicka
Costa Dilliard
Julie Stenseth
James Butt
Stacey Maclead
Morrow Ruta
Kaitlin Ostrosky
Deepesh Chui
Johnson Sergi
Kadeem Flosi
Maisha Rulapaugh
Silvio Slusarski
Leja Caldarera
Stacey Maclead
Leon Oldroyd
Misaki Royster
Kadeem Flosi
Jones Vocelka
Leon Oldroyd
Stacey Maclead
Ashley Doe
Misaki Royster
Arvin Albares
James Butt
Jennifer Amigon
Jones Vocelka
Leja Caldarera
Maisha Rulapaugh
Aditya Kusko
Costa Dilliard
Jeanfrancois Venere
Francesco Shinko
Silvio Slusarski
IdCountryDate
1000France2026-04-18
1001Germany2026-04-09
1002Spain2026-04-11
1003United Kingdom2026-03-30
1004Spain2026-04-20
1005Argentina2026-03-31
1006Russia2026-04-22
1007India2026-04-25
1008Germany2026-04-15
1009Italy2026-04-25
1010France2026-03-29
1011Russia2026-04-07
1012Italy2026-04-03
1013Russia2026-04-07
1014Germany2026-04-11
1015Argentina2026-04-26
1016Spain2026-04-05
1017India2026-04-22
1018India2026-04-20
1019Japan2026-04-17
1020Brazil2026-03-29
1021Spain2026-03-28
1022France2026-04-26
1023Brazil2026-04-20
1024Canada2026-04-21
1025France2026-04-16
1026United Kingdom2026-04-17
1027Italy2026-04-21
1028Australia2026-03-31
1029Italy2026-04-02
1030India2026-04-23
1031Italy2026-03-30
1032Brazil2026-03-29
1033Argentina2026-04-03
1034United Kingdom2026-04-23
1035Russia2026-03-30
1036Australia2026-04-20
1037Germany2026-04-19
1038France2026-04-07
1039Canada2026-04-04
1040Australia2026-04-22
1041Italy2026-04-23
1042Brazil2026-04-22
1043India2026-04-23
1044France2026-04-11
1045United Kingdom2026-04-21
1046United Kingdom2026-04-03
1047Japan2026-04-04
1048Japan2026-04-20
1049Canada2026-04-21

On-Demand Data

NameIdCountryDate
Octavia Malet1000Canada2026-04-07
Ashley Doe1001France2026-04-10
Francesco Shinko1002Canada2026-03-29
Jefferson Schemmer1003Canada2026-04-23
Maisha Rulapaugh1004Italy2026-04-17
Juan Wieser1005Germany2026-04-23
Alejandro Perin1006Italy2026-04-03
Wickens Nestle1007Italy2026-04-07
Stacey Maclead1008Japan2026-04-03
Izzy Garufi1009France2026-04-17
Sinclair Waycott1010Spain2026-04-26
Kadeem Flosi1011Argentina2026-03-29
Leon Oldroyd1012Germany2026-04-02
Mayumi Kolmetz1013France2026-04-08
Alejandro Perin1014India2026-04-14
Greenwood Bolognia1015Italy2026-04-10
Arvin Albares1016Japan2026-04-23
Kaitlin Ostrosky1017Argentina2026-04-10
David Darakjy1018Italy2026-03-30
Izzy Garufi1019Australia2026-03-29
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Leon OldroydAustraliaStephen Shaw NEGOTIATION
Mujtaba NickaSpainOnyama Limba PROPOSAL
Silvio SlusarskiFranceXuxue Feng NEGOTIATION
Isabel BowleyAustraliaAsiya Javayant PROPOSAL
Darci PoquetteGermanyIoni Bowcher PROPOSAL
Clifford RimAustraliaAmy Elsner NEGOTIATION
Ivar PaprockiAustraliaAnna Fali NEW
Murillo MaletAustraliaIoni Bowcher PROPOSAL
Chavez BriddickJapanAnna Fali UNQUALIFIED
Silvio SlusarskiSpainIoni Bowcher RENEWAL
Claire TollnerJapanAsiya Javayant RENEWAL
Aruna FigeroaAustraliaStephen Shaw NEGOTIATION
James ButtCanadaIoni Bowcher PROPOSAL
Jeanfrancois VenereItalyBernardo Dominic NEW
Murillo MaletItalyAmy Elsner QUALIFIED
Clifford RimFranceXuxue Feng RENEWAL
Deepesh ChuiCanadaAsiya Javayant NEW
Ricardo GauchoSpainXuxue Feng UNQUALIFIED
Cody SaylorsGermanyXuxue Feng PROPOSAL
Julie StensethItalyElwin Sharvill NEGOTIATION
Octavia MaletRussiaBernardo Dominic NEGOTIATION
Tony FollerSpainBernardo Dominic PROPOSAL
Clifford RimItalyAmy Elsner NEW
Antonio CaudyCanadaBernardo Dominic QUALIFIED
Kadeem FlosiCanadaStephen Shaw UNQUALIFIED
Leja CaldareraFranceStephen Shaw NEGOTIATION
Alejandro PerinRussiaAnna Fali PROPOSAL
Ricardo GauchoJapanElwin Sharvill NEGOTIATION
Murillo MaletBrazilXuxue Feng PROPOSAL
Isabel BowleyJapanStephen Shaw PROPOSAL
Nicolas IturbideUnited KingdomAsiya Javayant NEW
Chavez BriddickIndiaAnna Fali QUALIFIED
Jones VocelkaGermanyElwin Sharvill RENEWAL
Greenwood BologniaArgentinaElwin Sharvill UNQUALIFIED
Smith GlickBrazilIoni Bowcher NEW
Silvio SlusarskiItalyOnyama Limba PROPOSAL
Wickens NestleAustraliaIoni Bowcher RENEWAL
Adams MorascaSpainXuxue Feng NEGOTIATION
Sinclair WaycottAustraliaAsiya Javayant PROPOSAL
Wickens NestleArgentinaAsiya Javayant 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>