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
Clifford RimCanadaAsiya Javayant NEW
Aika InouyeIndiaElwin Sharvill RENEWAL
Silvio SlusarskiItalyBernardo Dominic NEW
Aditya KuskoBrazilIoni Bowcher UNQUALIFIED
Ricardo GauchoGermanyBernardo Dominic PROPOSAL
Kadeem FlosiGermanyAsiya Javayant RENEWAL
Kaitlin OstroskyArgentinaAmy Elsner UNQUALIFIED
Tony FollerBrazilStephen Shaw NEGOTIATION
Darci PoquetteBrazilXuxue Feng NEGOTIATION
Smith GlickRussiaAnna Fali NEW
Murillo MaletJapanIoni Bowcher QUALIFIED
Aika InouyeUnited KingdomAnna Fali NEW
Chavez BriddickSpainXuxue Feng RENEWAL
Ashley DoeItalyElwin Sharvill PROPOSAL
Clifford RimCanadaAsiya Javayant NEGOTIATION
Octavia MaletAustraliaAnna Fali NEGOTIATION
Jefferson SchemmerArgentinaIoni Bowcher PROPOSAL
Wickens NestleItalyIoni Bowcher NEW
Silvio SlusarskiCanadaElwin Sharvill UNQUALIFIED
Greenwood BologniaUnited KingdomXuxue Feng NEW
Francesco ShinkoBrazilAsiya Javayant PROPOSAL
Maisha RulapaughJapanAmy Elsner PROPOSAL
Nicolas IturbideItalyStephen Shaw NEW
Tony FollerCanadaOnyama Limba NEGOTIATION
Aika InouyeAustraliaIoni Bowcher RENEWAL
Chavez BriddickCanadaIvan Magalhaes NEGOTIATION
Antonio CaudyUnited KingdomOnyama Limba QUALIFIED
Jefferson SchemmerIndiaIvan Magalhaes QUALIFIED
Francesco ShinkoJapanAmy Elsner QUALIFIED
Isabel BowleyJapanBernardo Dominic QUALIFIED
Darci PoquetteBrazilElwin Sharvill UNQUALIFIED
Darci PoquetteRussiaIoni Bowcher PROPOSAL
Ashley DoeFranceOnyama Limba UNQUALIFIED
Maria MarrierCanadaAnna Fali RENEWAL
Nicolas IturbideIndiaAnna Fali RENEWAL
Arvin AlbaresBrazilStephen Shaw NEW
Rodrigues CampainUnited KingdomAsiya Javayant NEGOTIATION
Octavia MaletIndiaElwin Sharvill PROPOSAL
Tony FollerBrazilStephen Shaw NEGOTIATION
Greenwood BologniaSpainElwin Sharvill RENEWAL
Misaki RoysterCanadaXuxue Feng NEW
Aruna FigeroaFranceAmy Elsner NEW
Antonio CaudyUnited KingdomIoni Bowcher RENEWAL
Isabel BowleyAustraliaAsiya Javayant UNQUALIFIED
Tony FollerBrazilElwin Sharvill UNQUALIFIED
Jones VocelkaCanadaIvan Magalhaes RENEWAL
Faith GillianIndiaAsiya Javayant RENEWAL
Smith GlickUnited KingdomAsiya Javayant NEGOTIATION
Tony FollerFranceAnna Fali NEW
Stacey MacleadGermanyAmy Elsner UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Kadeem FlosiIndiaAnna Fali UNQUALIFIED
Maria MarrierBrazilAmy Elsner PROPOSAL
Stacey MacleadIndiaOnyama Limba RENEWAL
Maria MarrierCanadaBernardo Dominic UNQUALIFIED
Jeanfrancois VenereFranceAmy Elsner NEGOTIATION
Ashley DoeIndiaStephen Shaw QUALIFIED
Adams MorascaArgentinaAsiya Javayant NEGOTIATION
Cody SaylorsUnited KingdomIoni Bowcher NEGOTIATION
Sinclair WaycottCanadaBernardo Dominic RENEWAL
Arvin AlbaresFranceOnyama Limba UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Ricardo GauchoAustralia2026-03-31Dorl, James J Esq NEW32Onyama Limba
1001Claire TollnerRussia2026-04-23Morlong Associates NEW37Stephen Shaw
1002Silvio SlusarskiFrance2026-04-11Rousseaux, Michael Esq RENEWAL91Onyama Limba
1003Kaitlin OstroskyUnited Kingdom2026-04-25Rousseaux, Michael Esq UNQUALIFIED41Amy Elsner
1004Julie StensethGermany2026-04-09Morlong Associates UNQUALIFIED53Stephen Shaw
1005Jefferson SchemmerIndia2026-04-01Dorl, James J Esq RENEWAL78Onyama Limba
1006Cody SaylorsUnited Kingdom2026-04-04Rangoni Of Florence RENEWAL65Onyama Limba
1007Aruna FigeroaBrazil2026-03-31Chemel, James L Cpa QUALIFIED31Onyama Limba
1008Faith GillianItaly2026-04-11Chapman, Ross E Esq UNQUALIFIED4Xuxue Feng
1009Julie StensethBrazil2026-04-22Truhlar And Truhlar Attys NEGOTIATION59Elwin Sharvill
1010Aruna FigeroaBrazil2026-04-13Morlong Associates UNQUALIFIED16Xuxue Feng
1011Salvatore StockhamCanada2026-03-29Truhlar And Truhlar Attys PROPOSAL32Amy Elsner
1012David DarakjyRussia2026-04-14Chanay, Jeffrey A Esq UNQUALIFIED97Stephen Shaw
1013Aruna FigeroaGermany2026-04-13Dorl, James J Esq PROPOSAL2Xuxue Feng
1014Misaki RoysterSpain2026-04-18King, Christopher A Esq PROPOSAL70Anna Fali
1015Rodrigues CampainSpain2026-04-13Printing Dimensions RENEWAL87Ivan Magalhaes
1016Costa DilliardItaly2026-04-21Feiner Bros QUALIFIED5Anna Fali
1017Claire TollnerUnited Kingdom2026-04-25Morlong Associates RENEWAL46Xuxue Feng
1018Jefferson SchemmerRussia2026-04-19Dorl, James J Esq UNQUALIFIED54Asiya Javayant
1019James ButtFrance2026-04-27Feltz Printing Service RENEWAL31Ioni Bowcher
1020Maria MarrierUnited Kingdom2026-04-15Chanay, Jeffrey A Esq PROPOSAL47Onyama Limba
1021Jefferson SchemmerCanada2026-04-16Benton, John B Jr NEGOTIATION64Elwin Sharvill
1022James ButtIndia2026-03-29Feltz Printing Service NEW74Onyama Limba
1023Costa DilliardUnited Kingdom2026-04-19Chapman, Ross E Esq RENEWAL12Ioni Bowcher
1024Julie StensethJapan2026-04-07Dorl, James J Esq NEGOTIATION15Xuxue Feng
1025Maria MarrierRussia2026-04-18Rousseaux, Michael Esq UNQUALIFIED7Ivan Magalhaes
1026Juan WieserGermany2026-04-19Printing Dimensions UNQUALIFIED72Elwin Sharvill
1027Aika InouyeFrance2026-04-25Rousseaux, Michael Esq PROPOSAL81Anna Fali
1028Cody SaylorsBrazil2026-04-17Feiner Bros UNQUALIFIED72Bernardo Dominic
1029Alejandro PerinArgentina2026-04-21Printing Dimensions NEGOTIATION27Ivan Magalhaes
1030Sinclair WaycottSpain2026-04-02Chemel, James L Cpa PROPOSAL68Elwin Sharvill
1031Leja CaldareraFrance2026-04-07Rangoni Of Florence PROPOSAL41Asiya Javayant
1032Greenwood BologniaGermany2026-03-29Benton, John B Jr QUALIFIED3Onyama Limba
1033Juan WieserArgentina2026-04-01Dorl, James J Esq PROPOSAL8Amy Elsner
1034Smith GlickUnited Kingdom2026-03-30Chanay, Jeffrey A Esq PROPOSAL61Asiya Javayant
1035Chavez BriddickJapan2026-04-09Truhlar And Truhlar Attys PROPOSAL53Asiya Javayant
1036Mayumi KolmetzAustralia2026-04-14Commercial Press PROPOSAL27Stephen Shaw
1037Costa DilliardGermany2026-04-20Truhlar And Truhlar Attys NEGOTIATION41Xuxue Feng
1038Antonio CaudyUnited Kingdom2026-04-10Feltz Printing Service NEW60Elwin Sharvill
1039Wickens NestleArgentina2026-04-10Chemel, James L Cpa RENEWAL26Ioni Bowcher
1040Antonio CaudyJapan2026-04-08Dorl, James J Esq NEW83Stephen Shaw
1041Clifford RimSpain2026-04-02King, Christopher A Esq RENEWAL99Anna Fali
1042Francesco ShinkoBrazil2026-04-05Rousseaux, Michael Esq NEGOTIATION53Ivan Magalhaes
1043Rodrigues CampainItaly2026-04-12Morlong Associates NEGOTIATION68Elwin Sharvill
1044Wickens NestleRussia2026-04-14Feltz Printing Service PROPOSAL51Asiya Javayant
1045Greenwood BologniaBrazil2026-04-02Feltz Printing Service PROPOSAL54Anna Fali
1046Julie StensethAustralia2026-04-22Benton, John B Jr QUALIFIED3Ioni Bowcher
1047Smith GlickJapan2026-04-04Feltz Printing Service PROPOSAL18Xuxue Feng
1048Alejandro PerinRussia2026-04-18Feltz Printing Service QUALIFIED3Xuxue Feng
1049Jefferson SchemmerRussia2026-04-05Dorl, James J Esq UNQUALIFIED14Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Jeanfrancois VenereFranceIoni Bowcher NEGOTIATION
Darci PoquetteAustraliaBernardo Dominic QUALIFIED
Aruna FigeroaFranceOnyama Limba PROPOSAL
Morrow RutaSpainElwin Sharvill NEW
Chavez BriddickAustraliaBernardo Dominic NEW
Misaki RoysterFranceOnyama Limba RENEWAL
Ashley DoeItalyXuxue Feng NEGOTIATION
Wickens NestleSpainAmy Elsner RENEWAL
Chavez BriddickGermanyAnna Fali PROPOSAL
Alejandro PerinBrazilIvan Magalhaes QUALIFIED
Stacey MacleadArgentinaAnna Fali QUALIFIED
Ricardo GauchoUnited KingdomOnyama Limba RENEWAL
Ivar PaprockiIndiaXuxue Feng PROPOSAL
Morrow RutaIndiaElwin Sharvill RENEWAL
Clifford RimRussiaAsiya Javayant PROPOSAL
Darci PoquetteCanadaAmy Elsner PROPOSAL
Alejandro PerinItalyIvan Magalhaes UNQUALIFIED
Kadeem FlosiAustraliaElwin Sharvill NEW
Mayumi KolmetzIndiaAsiya Javayant NEW
Ashley DoeItalyIoni Bowcher RENEWAL
Maria MarrierFranceElwin Sharvill RENEWAL
Ashley DoeIndiaElwin Sharvill NEW
Silvio SlusarskiAustraliaStephen Shaw NEGOTIATION
Leon OldroydRussiaAnna Fali QUALIFIED
Mujtaba NickaGermanyAmy Elsner RENEWAL
Faith GillianCanadaBernardo Dominic RENEWAL
Stacey MacleadGermanyAmy Elsner RENEWAL
Deepesh ChuiSpainAsiya Javayant UNQUALIFIED
Rodrigues CampainJapanAmy Elsner PROPOSAL
Chavez BriddickFranceAnna Fali QUALIFIED
Misaki RoysterIndiaStephen Shaw NEW
Morrow RutaFranceXuxue Feng NEGOTIATION
Wickens NestleAustraliaIvan Magalhaes NEW
Juan WieserIndiaAnna Fali RENEWAL
Tony FollerCanadaStephen Shaw NEW
Adams MorascaBrazilAsiya Javayant RENEWAL
Maria MarrierCanadaElwin Sharvill RENEWAL
Morrow RutaAustraliaAmy Elsner NEW
Kadeem FlosiCanadaAnna Fali PROPOSAL
Juan WieserUnited KingdomAnna Fali RENEWAL
Clifford RimItalyElwin Sharvill UNQUALIFIED
Jefferson SchemmerFranceAnna Fali UNQUALIFIED
Jones VocelkaSpainAsiya Javayant QUALIFIED
Claire TollnerUnited KingdomOnyama Limba NEW
Rodrigues CampainCanadaAnna Fali QUALIFIED
Mayumi KolmetzGermanyIoni Bowcher UNQUALIFIED
Maria MarrierFranceElwin Sharvill NEW
Julie StensethUnited KingdomAmy Elsner UNQUALIFIED
Clifford RimIndiaAsiya Javayant NEGOTIATION
Alejandro PerinRussiaStephen Shaw UNQUALIFIED
Frozen Columns
Name
Jeanfrancois Venere
Munro Ferencz
Maisha Rulapaugh
Juan Wieser
Izzy Garufi
Deepesh Chui
Tony Foller
Nicolas Iturbide
Greenwood Bolognia
Jeanfrancois Venere
Isabel Bowley
Claire Tollner
Adams Morasca
Aika Inouye
Leja Caldarera
Salvatore Stockham
Munro Ferencz
Munro Ferencz
Antonio Caudy
Clifford Rim
Aika Inouye
Tony Foller
Cody Saylors
Wickens Nestle
Johnson Sergi
Aditya Kusko
Emily Whobrey
Leon Oldroyd
Maria Marrier
Aditya Kusko
Aika Inouye
Misaki Royster
Darci Poquette
Aruna Figeroa
Juan Wieser
Silvio Slusarski
James Butt
Isabel Bowley
Mayumi Kolmetz
Faith Gillian
Izzy Garufi
Salvatore Stockham
Clifford Rim
Johnson Sergi
Chavez Briddick
Maisha Rulapaugh
Kadeem Flosi
Leja Caldarera
Arvin Albares
Maisha Rulapaugh
IdCountryDate
1000Brazil2026-04-24
1001Spain2026-04-16
1002France2026-04-15
1003Australia2026-04-17
1004United Kingdom2026-04-25
1005Brazil2026-04-19
1006Spain2026-04-10
1007Canada2026-03-30
1008Canada2026-04-05
1009France2026-04-15
1010Italy2026-04-01
1011Canada2026-04-16
1012Canada2026-04-12
1013Russia2026-04-16
1014Japan2026-04-19
1015Germany2026-04-20
1016Spain2026-04-27
1017United Kingdom2026-04-27
1018Italy2026-04-22
1019Russia2026-04-05
1020Germany2026-04-25
1021Germany2026-04-13
1022India2026-04-24
1023Russia2026-04-04
1024Brazil2026-04-24
1025Germany2026-04-20
1026Argentina2026-04-24
1027India2026-04-05
1028Argentina2026-03-31
1029France2026-03-29
1030Canada2026-04-10
1031Spain2026-04-04
1032Germany2026-04-23
1033Japan2026-04-25
1034United Kingdom2026-04-02
1035Italy2026-03-30
1036Spain2026-04-17
1037Australia2026-03-30
1038Australia2026-04-22
1039United Kingdom2026-04-26
1040Argentina2026-04-17
1041Germany2026-04-16
1042Germany2026-04-22
1043Australia2026-04-21
1044Argentina2026-03-31
1045Australia2026-04-12
1046Australia2026-04-15
1047United Kingdom2026-04-19
1048United Kingdom2026-03-30
1049Germany2026-04-13

On-Demand Data

NameIdCountryDate
Maisha Rulapaugh1000Argentina2026-04-17
Sinclair Waycott1001France2026-04-16
Stacey Maclead1002Argentina2026-04-01
Smith Glick1003India2026-04-12
Chavez Briddick1004Germany2026-04-06
Arvin Albares1005India2026-04-22
Juan Wieser1006Germany2026-04-26
Izzy Garufi1007India2026-04-02
Salvatore Stockham1008France2026-03-29
Kaitlin Ostrosky1009India2026-04-18
Faith Gillian1010Russia2026-04-04
Jones Vocelka1011Brazil2026-04-03
Kaitlin Ostrosky1012France2026-04-08
Julie Stenseth1013India2026-04-19
Wickens Nestle1014Argentina2026-04-26
Ricardo Gaucho1015Italy2026-04-06
Deepesh Chui1016Brazil2026-04-24
Juan Wieser1017Brazil2026-04-09
Octavia Malet1018Russia2026-03-31
Nicolas Iturbide1019United Kingdom2026-04-24
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Emily WhobreyArgentinaAmy Elsner QUALIFIED
Arvin AlbaresIndiaAsiya Javayant NEGOTIATION
Tony FollerRussiaBernardo Dominic RENEWAL
Darci PoquetteGermanyAnna Fali UNQUALIFIED
Jeanfrancois VenereJapanAmy Elsner PROPOSAL
Mujtaba NickaItalyStephen Shaw QUALIFIED
Juan WieserArgentinaStephen Shaw QUALIFIED
Jefferson SchemmerUnited KingdomIvan Magalhaes PROPOSAL
Francesco ShinkoFranceIvan Magalhaes RENEWAL
Octavia MaletJapanBernardo Dominic QUALIFIED
Murillo MaletItalyStephen Shaw PROPOSAL
Arvin AlbaresJapanAnna Fali PROPOSAL
Izzy GarufiSpainElwin Sharvill NEGOTIATION
Ashley DoeArgentinaOnyama Limba PROPOSAL
Maisha RulapaughUnited KingdomAsiya Javayant NEGOTIATION
Aika InouyeGermanyAsiya Javayant NEW
Deepesh ChuiJapanOnyama Limba PROPOSAL
Sinclair WaycottGermanyIoni Bowcher RENEWAL
James ButtItalyBernardo Dominic QUALIFIED
Ricardo GauchoFranceAmy Elsner NEW
Munro FerenczCanadaIvan Magalhaes PROPOSAL
Silvio SlusarskiItalyOnyama Limba UNQUALIFIED
Jones VocelkaItalyElwin Sharvill NEW
Jennifer AmigonJapanAsiya Javayant RENEWAL
Aditya KuskoAustraliaAnna Fali NEW
Ricardo GauchoGermanyAmy Elsner PROPOSAL
Maria MarrierBrazilOnyama Limba QUALIFIED
Adams MorascaJapanXuxue Feng NEGOTIATION
Salvatore StockhamSpainBernardo Dominic NEGOTIATION
Izzy GarufiFranceAmy Elsner NEGOTIATION
Kaitlin OstroskyGermanyXuxue Feng PROPOSAL
Arvin AlbaresItalyAmy Elsner NEGOTIATION
Stacey MacleadBrazilBernardo Dominic NEW
Izzy GarufiBrazilIoni Bowcher UNQUALIFIED
Nicolas IturbideItalyIvan Magalhaes UNQUALIFIED
David DarakjyCanadaAsiya Javayant UNQUALIFIED
Ashley DoeIndiaAnna Fali UNQUALIFIED
Mayumi KolmetzBrazilXuxue Feng UNQUALIFIED
Alejandro PerinJapanAnna Fali UNQUALIFIED
Kaitlin OstroskyFranceAnna Fali 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>