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
Ashley DoeItalyStephen Shaw PROPOSAL
Ricardo GauchoJapanAnna Fali UNQUALIFIED
Mayumi KolmetzGermanyAmy Elsner NEGOTIATION
Costa DilliardRussiaOnyama Limba PROPOSAL
Maisha RulapaughBrazilAnna Fali RENEWAL
Morrow RutaJapanIvan Magalhaes UNQUALIFIED
Isabel BowleyFranceAsiya Javayant NEGOTIATION
Kaitlin OstroskyFranceElwin Sharvill PROPOSAL
Alejandro PerinSpainStephen Shaw NEW
Deepesh ChuiIndiaAnna Fali QUALIFIED
Ashley DoeItalyIvan Magalhaes QUALIFIED
Mayumi KolmetzBrazilXuxue Feng PROPOSAL
Salvatore StockhamItalyElwin Sharvill RENEWAL
Julie StensethAustraliaIvan Magalhaes RENEWAL
Ivar PaprockiSpainXuxue Feng NEW
Ricardo GauchoGermanyAsiya Javayant RENEWAL
Stacey MacleadJapanBernardo Dominic NEW
Smith GlickUnited KingdomBernardo Dominic RENEWAL
Faith GillianGermanyAsiya Javayant UNQUALIFIED
Maisha RulapaughGermanyAsiya Javayant UNQUALIFIED
Murillo MaletIndiaAsiya Javayant UNQUALIFIED
Arvin AlbaresArgentinaElwin Sharvill NEGOTIATION
Wickens NestleFranceAsiya Javayant RENEWAL
Rodrigues CampainItalyXuxue Feng UNQUALIFIED
Aditya KuskoAustraliaAmy Elsner QUALIFIED
Leja CaldareraIndiaAnna Fali NEW
James ButtCanadaElwin Sharvill QUALIFIED
Deepesh ChuiCanadaStephen Shaw UNQUALIFIED
Ashley DoeGermanyXuxue Feng QUALIFIED
Kaitlin OstroskyUnited KingdomAmy Elsner NEGOTIATION
Faith GillianBrazilOnyama Limba PROPOSAL
Jeanfrancois VenereItalyBernardo Dominic QUALIFIED
Smith GlickSpainIvan Magalhaes NEGOTIATION
Kadeem FlosiCanadaAmy Elsner NEGOTIATION
Costa DilliardIndiaAsiya Javayant NEW
Juan WieserSpainAsiya Javayant NEGOTIATION
Costa DilliardSpainElwin Sharvill RENEWAL
Silvio SlusarskiSpainBernardo Dominic NEW
Tony FollerUnited KingdomElwin Sharvill UNQUALIFIED
Leja CaldareraJapanOnyama Limba UNQUALIFIED
Jennifer AmigonSpainElwin Sharvill UNQUALIFIED
Cody SaylorsSpainBernardo Dominic NEGOTIATION
Johnson SergiArgentinaElwin Sharvill UNQUALIFIED
Ivar PaprockiFranceStephen Shaw RENEWAL
Cody SaylorsItalyAsiya Javayant NEW
Rodrigues CampainSpainOnyama Limba PROPOSAL
James ButtBrazilStephen Shaw UNQUALIFIED
Chavez BriddickBrazilAsiya Javayant RENEWAL
Julie StensethGermanyAsiya Javayant QUALIFIED
Octavia MaletGermanyOnyama Limba PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Costa DilliardArgentinaOnyama Limba NEW
Octavia MaletCanadaOnyama Limba QUALIFIED
Cody SaylorsGermanyAmy Elsner PROPOSAL
Greenwood BologniaUnited KingdomStephen Shaw QUALIFIED
Stacey MacleadCanadaBernardo Dominic RENEWAL
Jeanfrancois VenereRussiaElwin Sharvill RENEWAL
Maisha RulapaughRussiaStephen Shaw RENEWAL
Mujtaba NickaBrazilAmy Elsner PROPOSAL
Chavez BriddickRussiaBernardo Dominic PROPOSAL
David DarakjyFranceElwin Sharvill QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Tony FollerBrazil2026-04-19Chapman, Ross E Esq RENEWAL28Anna Fali
1001Jennifer AmigonIndia2026-04-29Chemel, James L Cpa NEGOTIATION98Elwin Sharvill
1002Leja CaldareraUnited Kingdom2026-04-16King, Christopher A Esq RENEWAL50Elwin Sharvill
1003Morrow RutaFrance2026-04-26Chanay, Jeffrey A Esq QUALIFIED52Amy Elsner
1004Ivar PaprockiBrazil2026-04-18Commercial Press UNQUALIFIED73Xuxue Feng
1005Nicolas IturbideUnited Kingdom2026-05-05Rousseaux, Michael Esq NEGOTIATION88Ioni Bowcher
1006Adams MorascaIndia2026-05-06Morlong Associates RENEWAL92Ivan Magalhaes
1007Antonio CaudyGermany2026-04-17King, Christopher A Esq NEW26Amy Elsner
1008Costa DilliardCanada2026-04-24King, Christopher A Esq QUALIFIED12Anna Fali
1009Nicolas IturbideIndia2026-04-30Chemel, James L Cpa NEGOTIATION28Stephen Shaw
1010Chavez BriddickFrance2026-04-21Truhlar And Truhlar Attys NEGOTIATION93Xuxue Feng
1011Octavia MaletGermany2026-04-28Chapman, Ross E Esq NEGOTIATION3Asiya Javayant
1012Arvin AlbaresFrance2026-05-08Rangoni Of Florence RENEWAL93Anna Fali
1013Jennifer AmigonBrazil2026-05-10Benton, John B Jr QUALIFIED23Bernardo Dominic
1014Leon OldroydItaly2026-04-26Buckley Miller Wright NEGOTIATION57Ioni Bowcher
1015Jefferson SchemmerSpain2026-05-01Dorl, James J Esq QUALIFIED4Elwin Sharvill
1016Greenwood BologniaItaly2026-05-06Printing Dimensions UNQUALIFIED4Xuxue Feng
1017Francesco ShinkoCanada2026-04-29Chapman, Ross E Esq QUALIFIED62Elwin Sharvill
1018Rodrigues CampainCanada2026-04-24Feiner Bros NEW89Anna Fali
1019Tony FollerJapan2026-04-28Buckley Miller Wright QUALIFIED15Ivan Magalhaes
1020Kadeem FlosiJapan2026-04-28Chapman, Ross E Esq RENEWAL39Bernardo Dominic
1021Munro FerenczGermany2026-05-01Chanay, Jeffrey A Esq NEGOTIATION41Anna Fali
1022Jefferson SchemmerIndia2026-04-24Rousseaux, Michael Esq NEW20Anna Fali
1023Darci PoquetteIndia2026-04-19King, Christopher A Esq NEW78Xuxue Feng
1024Juan WieserGermany2026-04-23Printing Dimensions NEW38Bernardo Dominic
1025Aditya KuskoItaly2026-04-25Feltz Printing Service NEW87Elwin Sharvill
1026Misaki RoysterIndia2026-04-25Rousseaux, Michael Esq QUALIFIED21Ioni Bowcher
1027Alejandro PerinBrazil2026-04-25King, Christopher A Esq RENEWAL3Asiya Javayant
1028Wickens NestleSpain2026-05-13Rangoni Of Florence RENEWAL72Elwin Sharvill
1029Izzy GarufiSpain2026-05-15Printing Dimensions UNQUALIFIED58Ioni Bowcher
1030Alejandro PerinUnited Kingdom2026-04-16King, Christopher A Esq UNQUALIFIED93Xuxue Feng
1031Stacey MacleadSpain2026-04-17Printing Dimensions UNQUALIFIED60Bernardo Dominic
1032Adams MorascaGermany2026-04-17Truhlar And Truhlar Attys PROPOSAL81Xuxue Feng
1033Julie StensethItaly2026-05-06Rousseaux, Michael Esq NEGOTIATION33Onyama Limba
1034Alejandro PerinBrazil2026-04-30King, Christopher A Esq UNQUALIFIED34Xuxue Feng
1035Wickens NestleFrance2026-05-01Truhlar And Truhlar Attys NEGOTIATION8Asiya Javayant
1036Smith GlickIndia2026-04-27Rousseaux, Michael Esq NEGOTIATION37Asiya Javayant
1037Claire TollnerSpain2026-05-11Printing Dimensions RENEWAL36Ioni Bowcher
1038David DarakjyGermany2026-05-02Printing Dimensions NEGOTIATION44Asiya Javayant
1039Francesco ShinkoSpain2026-05-02Buckley Miller Wright PROPOSAL79Ivan Magalhaes
1040Nicolas IturbideAustralia2026-05-08Chapman, Ross E Esq UNQUALIFIED20Bernardo Dominic
1041Kadeem FlosiItaly2026-04-19Feltz Printing Service QUALIFIED38Stephen Shaw
1042Mayumi KolmetzAustralia2026-04-17Rangoni Of Florence PROPOSAL24Ioni Bowcher
1043Rodrigues CampainGermany2026-05-14Rangoni Of Florence RENEWAL90Onyama Limba
1044Deepesh ChuiAustralia2026-05-13Benton, John B Jr NEW59Bernardo Dominic
1045Octavia MaletGermany2026-05-10Buckley Miller Wright QUALIFIED21Bernardo Dominic
1046Jennifer AmigonArgentina2026-04-19Morlong Associates QUALIFIED69Onyama Limba
1047Greenwood BologniaCanada2026-05-03Morlong Associates RENEWAL40Ioni Bowcher
1048Maria MarrierCanada2026-04-20Chapman, Ross E Esq QUALIFIED80Xuxue Feng
1049Rodrigues CampainSpain2026-04-20Chapman, Ross E Esq NEW15Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Jennifer AmigonGermanyAmy Elsner PROPOSAL
Tony FollerUnited KingdomAmy Elsner PROPOSAL
Claire TollnerCanadaStephen Shaw NEW
Kadeem FlosiItalyAsiya Javayant NEW
Julie StensethArgentinaAmy Elsner RENEWAL
Mujtaba NickaGermanyBernardo Dominic UNQUALIFIED
Deepesh ChuiFranceOnyama Limba QUALIFIED
Isabel BowleyRussiaAsiya Javayant QUALIFIED
Arvin AlbaresSpainIvan Magalhaes NEGOTIATION
Ricardo GauchoArgentinaXuxue Feng PROPOSAL
Claire TollnerJapanXuxue Feng NEGOTIATION
Murillo MaletCanadaBernardo Dominic NEW
James ButtBrazilAnna Fali QUALIFIED
Costa DilliardBrazilAmy Elsner RENEWAL
Aika InouyeFranceBernardo Dominic UNQUALIFIED
Wickens NestleIndiaBernardo Dominic QUALIFIED
Morrow RutaIndiaXuxue Feng QUALIFIED
Salvatore StockhamSpainElwin Sharvill NEW
Mujtaba NickaRussiaAsiya Javayant QUALIFIED
Tony FollerAustraliaBernardo Dominic RENEWAL
Claire TollnerFranceAnna Fali RENEWAL
Juan WieserArgentinaIoni Bowcher RENEWAL
Cody SaylorsArgentinaIoni Bowcher PROPOSAL
Maisha RulapaughUnited KingdomBernardo Dominic PROPOSAL
Wickens NestleUnited KingdomElwin Sharvill NEGOTIATION
Faith GillianBrazilAnna Fali NEGOTIATION
Leja CaldareraJapanAmy Elsner NEW
Johnson SergiItalyElwin Sharvill PROPOSAL
Izzy GarufiGermanyOnyama Limba NEGOTIATION
Mujtaba NickaIndiaXuxue Feng NEGOTIATION
Aditya KuskoArgentinaOnyama Limba NEW
Adams MorascaIndiaBernardo Dominic NEGOTIATION
Rodrigues CampainGermanyBernardo Dominic RENEWAL
Munro FerenczSpainAmy Elsner NEW
Clifford RimRussiaXuxue Feng UNQUALIFIED
Maria MarrierUnited KingdomIvan Magalhaes NEGOTIATION
Sinclair WaycottIndiaStephen Shaw NEW
David DarakjyRussiaElwin Sharvill RENEWAL
Darci PoquetteJapanAmy Elsner QUALIFIED
Tony FollerIndiaAsiya Javayant PROPOSAL
Salvatore StockhamFranceElwin Sharvill RENEWAL
Chavez BriddickRussiaStephen Shaw RENEWAL
Aditya KuskoGermanyAsiya Javayant UNQUALIFIED
Mayumi KolmetzArgentinaBernardo Dominic UNQUALIFIED
Murillo MaletSpainAnna Fali QUALIFIED
Johnson SergiAustraliaIvan Magalhaes NEW
Francesco ShinkoItalyAnna Fali PROPOSAL
Ricardo GauchoArgentinaElwin Sharvill UNQUALIFIED
Smith GlickRussiaElwin Sharvill UNQUALIFIED
Tony FollerItalyStephen Shaw PROPOSAL
Frozen Columns
Name
Rodrigues Campain
Misaki Royster
Misaki Royster
Misaki Royster
Clifford Rim
Salvatore Stockham
Johnson Sergi
Morrow Ruta
James Butt
Johnson Sergi
Nicolas Iturbide
Smith Glick
Smith Glick
Johnson Sergi
Munro Ferencz
Ricardo Gaucho
Arvin Albares
Leja Caldarera
Nicolas Iturbide
Tony Foller
Claire Tollner
Julie Stenseth
Morrow Ruta
Kadeem Flosi
Sinclair Waycott
Jones Vocelka
Sinclair Waycott
Rodrigues Campain
Clifford Rim
Mujtaba Nicka
Leja Caldarera
Mujtaba Nicka
Izzy Garufi
Nicolas Iturbide
Salvatore Stockham
David Darakjy
Nicolas Iturbide
Morrow Ruta
Kaitlin Ostrosky
Darci Poquette
Maisha Rulapaugh
Mayumi Kolmetz
Murillo Malet
Nicolas Iturbide
Misaki Royster
Kadeem Flosi
Julie Stenseth
Adams Morasca
Maisha Rulapaugh
Stacey Maclead
IdCountryDate
1000Brazil2026-05-03
1001Australia2026-04-29
1002Japan2026-05-01
1003Italy2026-04-27
1004United Kingdom2026-05-02
1005Australia2026-05-11
1006Russia2026-05-11
1007Italy2026-05-10
1008Brazil2026-04-26
1009Germany2026-04-23
1010Argentina2026-04-21
1011Argentina2026-04-28
1012Spain2026-04-20
1013Australia2026-05-07
1014Russia2026-05-04
1015Canada2026-05-05
1016United Kingdom2026-05-12
1017Germany2026-04-23
1018United Kingdom2026-04-29
1019India2026-04-25
1020Italy2026-05-06
1021Brazil2026-04-23
1022France2026-04-22
1023United Kingdom2026-05-07
1024Australia2026-05-15
1025Canada2026-05-02
1026Argentina2026-04-20
1027Japan2026-05-01
1028Brazil2026-05-13
1029France2026-04-30
1030Japan2026-04-27
1031Spain2026-05-06
1032France2026-04-21
1033Germany2026-05-03
1034Australia2026-05-08
1035Germany2026-05-05
1036Russia2026-05-09
1037France2026-05-08
1038France2026-05-12
1039India2026-04-25
1040Argentina2026-04-26
1041Argentina2026-05-08
1042Argentina2026-04-30
1043United Kingdom2026-05-03
1044France2026-05-07
1045Brazil2026-04-20
1046Australia2026-05-09
1047Canada2026-04-17
1048Brazil2026-05-05
1049France2026-04-16

On-Demand Data

NameIdCountryDate
Alejandro Perin1000Italy2026-04-21
Murillo Malet1001Canada2026-04-24
Jeanfrancois Venere1002Spain2026-05-14
Murillo Malet1003Brazil2026-04-29
Mujtaba Nicka1004Spain2026-05-06
Deepesh Chui1005Argentina2026-05-01
Octavia Malet1006Japan2026-04-20
Julie Stenseth1007France2026-05-12
Cody Saylors1008United Kingdom2026-04-19
Faith Gillian1009Canada2026-04-20
Ashley Doe1010Argentina2026-04-22
Faith Gillian1011India2026-04-17
Maria Marrier1012Italy2026-05-15
Chavez Briddick1013Germany2026-04-17
Julie Stenseth1014Japan2026-04-24
Claire Tollner1015Japan2026-04-29
Isabel Bowley1016Australia2026-04-17
Salvatore Stockham1017France2026-05-01
Tony Foller1018India2026-05-15
Greenwood Bolognia1019France2026-05-13
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Stacey MacleadGermanyElwin Sharvill PROPOSAL
Mujtaba NickaFranceIvan Magalhaes PROPOSAL
Costa DilliardSpainXuxue Feng RENEWAL
Mujtaba NickaCanadaStephen Shaw PROPOSAL
Jeanfrancois VenereCanadaIvan Magalhaes QUALIFIED
Juan WieserBrazilXuxue Feng NEGOTIATION
Nicolas IturbideJapanBernardo Dominic UNQUALIFIED
Jones VocelkaArgentinaIoni Bowcher RENEWAL
Smith GlickRussiaAsiya Javayant QUALIFIED
Maria MarrierArgentinaAsiya Javayant PROPOSAL
Costa DilliardRussiaIoni Bowcher QUALIFIED
Julie StensethArgentinaElwin Sharvill QUALIFIED
Alejandro PerinGermanyElwin Sharvill UNQUALIFIED
Alejandro PerinUnited KingdomAsiya Javayant NEW
Izzy GarufiFranceAmy Elsner NEW
Leon OldroydBrazilOnyama Limba UNQUALIFIED
Faith GillianUnited KingdomAmy Elsner UNQUALIFIED
Ivar PaprockiCanadaIvan Magalhaes NEW
Tony FollerIndiaXuxue Feng NEW
Aruna FigeroaBrazilOnyama Limba PROPOSAL
Isabel BowleyUnited KingdomBernardo Dominic NEGOTIATION
Juan WieserItalyAsiya Javayant QUALIFIED
Misaki RoysterCanadaIvan Magalhaes QUALIFIED
Aruna FigeroaGermanyXuxue Feng QUALIFIED
Maisha RulapaughGermanyElwin Sharvill NEGOTIATION
Jefferson SchemmerSpainIvan Magalhaes RENEWAL
Mayumi KolmetzUnited KingdomAnna Fali PROPOSAL
Costa DilliardRussiaStephen Shaw PROPOSAL
Darci PoquetteRussiaAnna Fali RENEWAL
Johnson SergiFranceOnyama Limba QUALIFIED
Rodrigues CampainGermanyAnna Fali RENEWAL
Jefferson SchemmerSpainXuxue Feng QUALIFIED
Emily WhobreyRussiaIvan Magalhaes PROPOSAL
Kaitlin OstroskyCanadaBernardo Dominic NEW
Juan WieserItalyIvan Magalhaes UNQUALIFIED
Emily WhobreySpainAmy Elsner NEGOTIATION
Tony FollerRussiaAnna Fali QUALIFIED
Adams MorascaFranceOnyama Limba RENEWAL
Antonio CaudyIndiaBernardo Dominic RENEWAL
Cody SaylorsCanadaXuxue 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>