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
Maisha RulapaughIndiaAsiya Javayant NEGOTIATION
Cody SaylorsSpainAsiya Javayant NEW
Leja CaldareraFranceIvan Magalhaes UNQUALIFIED
Cody SaylorsFranceElwin Sharvill NEGOTIATION
David DarakjyItalyOnyama Limba PROPOSAL
Izzy GarufiSpainAnna Fali UNQUALIFIED
Rodrigues CampainBrazilXuxue Feng RENEWAL
Claire TollnerFranceStephen Shaw QUALIFIED
Jefferson SchemmerCanadaXuxue Feng PROPOSAL
Smith GlickSpainAnna Fali NEGOTIATION
Leon OldroydRussiaStephen Shaw PROPOSAL
Francesco ShinkoAustraliaXuxue Feng PROPOSAL
Julie StensethUnited KingdomAmy Elsner PROPOSAL
Claire TollnerBrazilStephen Shaw UNQUALIFIED
Clifford RimUnited KingdomIvan Magalhaes NEW
Wickens NestleSpainIoni Bowcher NEGOTIATION
Tony FollerRussiaAnna Fali RENEWAL
Tony FollerCanadaAnna Fali NEW
Maria MarrierAustraliaIoni Bowcher NEGOTIATION
Greenwood BologniaCanadaAmy Elsner NEGOTIATION
Kaitlin OstroskyCanadaStephen Shaw QUALIFIED
Alejandro PerinRussiaIoni Bowcher RENEWAL
Darci PoquetteRussiaIoni Bowcher NEW
Costa DilliardUnited KingdomIoni Bowcher PROPOSAL
Munro FerenczGermanyXuxue Feng RENEWAL
Stacey MacleadSpainBernardo Dominic NEGOTIATION
Leon OldroydItalyElwin Sharvill NEW
Tony FollerCanadaElwin Sharvill UNQUALIFIED
Nicolas IturbideIndiaElwin Sharvill RENEWAL
Maria MarrierIndiaElwin Sharvill UNQUALIFIED
Aruna FigeroaArgentinaOnyama Limba NEGOTIATION
Deepesh ChuiCanadaIoni Bowcher UNQUALIFIED
Faith GillianRussiaOnyama Limba NEGOTIATION
Julie StensethUnited KingdomAsiya Javayant QUALIFIED
Maria MarrierRussiaElwin Sharvill QUALIFIED
James ButtBrazilAsiya Javayant NEGOTIATION
Adams MorascaGermanyBernardo Dominic RENEWAL
Ricardo GauchoGermanyAsiya Javayant NEW
Mujtaba NickaSpainBernardo Dominic UNQUALIFIED
Cody SaylorsItalyBernardo Dominic NEGOTIATION
Emily WhobreyUnited KingdomBernardo Dominic NEGOTIATION
Tony FollerCanadaOnyama Limba NEGOTIATION
Ashley DoeJapanAsiya Javayant RENEWAL
Murillo MaletBrazilIoni Bowcher QUALIFIED
David DarakjyBrazilAsiya Javayant RENEWAL
Alejandro PerinArgentinaAnna Fali UNQUALIFIED
Kaitlin OstroskyCanadaIvan Magalhaes RENEWAL
James ButtAustraliaStephen Shaw QUALIFIED
Salvatore StockhamRussiaIoni Bowcher PROPOSAL
Costa DilliardBrazilOnyama Limba PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Alejandro PerinItalyXuxue Feng QUALIFIED
David DarakjyBrazilOnyama Limba PROPOSAL
Leja CaldareraItalyXuxue Feng NEW
Claire TollnerSpainAsiya Javayant UNQUALIFIED
David DarakjyItalyOnyama Limba PROPOSAL
Kadeem FlosiUnited KingdomAnna Fali NEW
Stacey MacleadUnited KingdomAsiya Javayant NEGOTIATION
Juan WieserSpainBernardo Dominic PROPOSAL
David DarakjyBrazilIvan Magalhaes RENEWAL
Kaitlin OstroskyFranceElwin Sharvill PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Antonio CaudyIndia2026-05-26Chanay, Jeffrey A Esq NEGOTIATION46Xuxue Feng
1001Costa DilliardItaly2026-06-05Chanay, Jeffrey A Esq RENEWAL88Elwin Sharvill
1002David DarakjyIndia2026-05-09Feltz Printing Service NEGOTIATION43Ivan Magalhaes
1003Rodrigues CampainFrance2026-06-01Dorl, James J Esq PROPOSAL49Ioni Bowcher
1004Ivar PaprockiItaly2026-05-08King, Christopher A Esq PROPOSAL67Xuxue Feng
1005Johnson SergiJapan2026-05-09King, Christopher A Esq NEW6Ioni Bowcher
1006Clifford RimSpain2026-06-02King, Christopher A Esq QUALIFIED77Bernardo Dominic
1007Salvatore StockhamAustralia2026-05-30Morlong Associates RENEWAL36Bernardo Dominic
1008Jones VocelkaFrance2026-05-14Truhlar And Truhlar Attys NEGOTIATION13Elwin Sharvill
1009Deepesh ChuiArgentina2026-05-28Chanay, Jeffrey A Esq UNQUALIFIED46Ivan Magalhaes
1010Isabel BowleyIndia2026-05-19Morlong Associates RENEWAL74Stephen Shaw
1011Misaki RoysterIndia2026-05-17Chapman, Ross E Esq NEW54Asiya Javayant
1012Jeanfrancois VenereUnited Kingdom2026-06-05Commercial Press RENEWAL35Ivan Magalhaes
1013Isabel BowleyItaly2026-05-08Chapman, Ross E Esq NEGOTIATION4Amy Elsner
1014Munro FerenczCanada2026-05-25Truhlar And Truhlar Attys PROPOSAL44Ivan Magalhaes
1015Murillo MaletCanada2026-05-31Feltz Printing Service QUALIFIED26Bernardo Dominic
1016Maisha RulapaughArgentina2026-06-02Chapman, Ross E Esq QUALIFIED98Amy Elsner
1017James ButtSpain2026-06-02Feltz Printing Service PROPOSAL59Elwin Sharvill
1018Kadeem FlosiJapan2026-06-03Rousseaux, Michael Esq RENEWAL77Elwin Sharvill
1019Aika InouyeArgentina2026-05-20Buckley Miller Wright NEGOTIATION56Asiya Javayant
1020Darci PoquetteSpain2026-05-08Commercial Press QUALIFIED5Onyama Limba
1021Jennifer AmigonJapan2026-05-15Dorl, James J Esq UNQUALIFIED13Ioni Bowcher
1022Isabel BowleyArgentina2026-06-02Rousseaux, Michael Esq QUALIFIED92Elwin Sharvill
1023Antonio CaudyJapan2026-06-02Rangoni Of Florence QUALIFIED92Asiya Javayant
1024Stacey MacleadBrazil2026-05-12Feiner Bros NEW68Bernardo Dominic
1025Jennifer AmigonArgentina2026-05-12Chemel, James L Cpa NEW38Xuxue Feng
1026Aruna FigeroaUnited Kingdom2026-05-14Morlong Associates PROPOSAL32Elwin Sharvill
1027Adams MorascaJapan2026-05-09Truhlar And Truhlar Attys UNQUALIFIED47Onyama Limba
1028Sinclair WaycottAustralia2026-05-09Rangoni Of Florence NEGOTIATION14Elwin Sharvill
1029Ashley DoeIndia2026-05-21Chapman, Ross E Esq PROPOSAL47Elwin Sharvill
1030Murillo MaletJapan2026-05-10Rousseaux, Michael Esq NEGOTIATION94Ivan Magalhaes
1031Antonio CaudyJapan2026-05-17Feltz Printing Service NEGOTIATION36Xuxue Feng
1032Faith GillianSpain2026-06-01Dorl, James J Esq RENEWAL26Stephen Shaw
1033Morrow RutaBrazil2026-05-24Chanay, Jeffrey A Esq QUALIFIED43Ivan Magalhaes
1034Octavia MaletIndia2026-05-31Commercial Press NEGOTIATION81Ivan Magalhaes
1035Alejandro PerinItaly2026-05-19Benton, John B Jr PROPOSAL46Bernardo Dominic
1036David DarakjyJapan2026-05-31Printing Dimensions QUALIFIED43Amy Elsner
1037Chavez BriddickAustralia2026-05-25Truhlar And Truhlar Attys UNQUALIFIED72Bernardo Dominic
1038Isabel BowleyIndia2026-05-11Truhlar And Truhlar Attys NEGOTIATION57Elwin Sharvill
1039Kaitlin OstroskyCanada2026-06-04Feltz Printing Service NEGOTIATION83Xuxue Feng
1040Kadeem FlosiSpain2026-05-24Chemel, James L Cpa PROPOSAL38Xuxue Feng
1041Aditya KuskoGermany2026-05-29Morlong Associates QUALIFIED9Asiya Javayant
1042Ivar PaprockiArgentina2026-06-05Commercial Press RENEWAL53Ivan Magalhaes
1043Deepesh ChuiBrazil2026-05-30Dorl, James J Esq UNQUALIFIED61Asiya Javayant
1044Izzy GarufiGermany2026-05-29Chanay, Jeffrey A Esq PROPOSAL24Onyama Limba
1045Mujtaba NickaItaly2026-05-31Chanay, Jeffrey A Esq UNQUALIFIED93Amy Elsner
1046Deepesh ChuiCanada2026-06-01King, Christopher A Esq QUALIFIED2Asiya Javayant
1047Alejandro PerinUnited Kingdom2026-05-10Rangoni Of Florence NEGOTIATION75Stephen Shaw
1048Misaki RoysterBrazil2026-05-08Feltz Printing Service QUALIFIED28Stephen Shaw
1049Ricardo GauchoGermany2026-06-04Printing Dimensions QUALIFIED77Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Faith GillianJapanElwin Sharvill UNQUALIFIED
Mujtaba NickaUnited KingdomStephen Shaw NEW
Wickens NestleItalyStephen Shaw PROPOSAL
Sinclair WaycottSpainAsiya Javayant RENEWAL
Alejandro PerinCanadaElwin Sharvill PROPOSAL
Misaki RoysterSpainStephen Shaw NEW
Clifford RimCanadaOnyama Limba NEW
Johnson SergiBrazilAnna Fali RENEWAL
Alejandro PerinJapanXuxue Feng PROPOSAL
Julie StensethBrazilAmy Elsner NEGOTIATION
Wickens NestleGermanyIvan Magalhaes PROPOSAL
Sinclair WaycottAustraliaXuxue Feng NEW
Rodrigues CampainBrazilStephen Shaw NEGOTIATION
Sinclair WaycottGermanyXuxue Feng UNQUALIFIED
Cody SaylorsIndiaIvan Magalhaes QUALIFIED
Aditya KuskoSpainIoni Bowcher NEGOTIATION
David DarakjyArgentinaBernardo Dominic UNQUALIFIED
Silvio SlusarskiArgentinaAsiya Javayant NEW
Maria MarrierArgentinaXuxue Feng RENEWAL
Jefferson SchemmerItalyStephen Shaw RENEWAL
Leja CaldareraAustraliaAnna Fali RENEWAL
Izzy GarufiAustraliaElwin Sharvill NEGOTIATION
Faith GillianSpainStephen Shaw NEGOTIATION
James ButtRussiaIoni Bowcher NEGOTIATION
Adams MorascaGermanyIvan Magalhaes UNQUALIFIED
Stacey MacleadUnited KingdomIvan Magalhaes NEGOTIATION
Octavia MaletItalyOnyama Limba UNQUALIFIED
Alejandro PerinCanadaAnna Fali NEW
Tony FollerRussiaAnna Fali NEW
Aditya KuskoItalyStephen Shaw PROPOSAL
Francesco ShinkoSpainIvan Magalhaes PROPOSAL
Cody SaylorsIndiaAnna Fali PROPOSAL
Clifford RimIndiaElwin Sharvill QUALIFIED
Silvio SlusarskiJapanBernardo Dominic QUALIFIED
Izzy GarufiRussiaOnyama Limba PROPOSAL
Jefferson SchemmerRussiaXuxue Feng NEW
Izzy GarufiRussiaIvan Magalhaes PROPOSAL
James ButtCanadaBernardo Dominic NEW
Wickens NestleArgentinaIvan Magalhaes QUALIFIED
Stacey MacleadBrazilXuxue Feng NEW
Munro FerenczBrazilElwin Sharvill UNQUALIFIED
Julie StensethArgentinaAmy Elsner PROPOSAL
Ashley DoeJapanElwin Sharvill RENEWAL
Silvio SlusarskiJapanBernardo Dominic NEGOTIATION
Emily WhobreyArgentinaElwin Sharvill RENEWAL
Nicolas IturbideIndiaBernardo Dominic NEW
Faith GillianRussiaAsiya Javayant RENEWAL
James ButtRussiaAnna Fali UNQUALIFIED
Maisha RulapaughBrazilAnna Fali RENEWAL
Antonio CaudyItalyOnyama Limba PROPOSAL
Frozen Columns
Name
Nicolas Iturbide
Kadeem Flosi
Izzy Garufi
Jeanfrancois Venere
Jones Vocelka
Stacey Maclead
Cody Saylors
Arvin Albares
Tony Foller
Maisha Rulapaugh
Mujtaba Nicka
Jennifer Amigon
Wickens Nestle
Kadeem Flosi
Aika Inouye
Cody Saylors
Ivar Paprocki
Ivar Paprocki
Smith Glick
Ivar Paprocki
Arvin Albares
Kadeem Flosi
Jones Vocelka
Greenwood Bolognia
Jones Vocelka
Ivar Paprocki
Misaki Royster
Adams Morasca
Tony Foller
Ricardo Gaucho
Misaki Royster
Deepesh Chui
Munro Ferencz
Murillo Malet
Tony Foller
Alejandro Perin
Maisha Rulapaugh
Aika Inouye
Maria Marrier
Ricardo Gaucho
Julie Stenseth
Wickens Nestle
Antonio Caudy
Izzy Garufi
Kaitlin Ostrosky
Alejandro Perin
Johnson Sergi
Jeanfrancois Venere
Izzy Garufi
Cody Saylors
IdCountryDate
1000Russia2026-06-04
1001Japan2026-05-26
1002Argentina2026-06-02
1003Canada2026-05-15
1004Japan2026-05-16
1005India2026-06-01
1006Canada2026-05-14
1007Brazil2026-05-31
1008Japan2026-05-31
1009France2026-06-02
1010Argentina2026-05-09
1011Argentina2026-05-18
1012Italy2026-05-19
1013United Kingdom2026-05-25
1014Italy2026-05-18
1015India2026-05-13
1016Russia2026-05-16
1017Canada2026-05-17
1018Argentina2026-05-19
1019Italy2026-05-30
1020France2026-05-26
1021Russia2026-05-15
1022Germany2026-05-17
1023Italy2026-05-23
1024United Kingdom2026-05-09
1025Germany2026-05-19
1026Japan2026-06-02
1027Spain2026-05-08
1028India2026-06-01
1029Argentina2026-06-02
1030Australia2026-06-06
1031France2026-06-03
1032Argentina2026-06-01
1033Australia2026-05-10
1034Argentina2026-06-01
1035India2026-05-08
1036Australia2026-05-13
1037Italy2026-05-22
1038Russia2026-05-12
1039Japan2026-05-17
1040Canada2026-06-04
1041Russia2026-06-01
1042Spain2026-05-17
1043Argentina2026-05-14
1044Germany2026-05-27
1045Australia2026-05-11
1046Spain2026-06-06
1047Italy2026-05-24
1048Canada2026-06-01
1049Brazil2026-05-10

On-Demand Data

NameIdCountryDate
Mayumi Kolmetz1000India2026-05-10
Isabel Bowley1001Brazil2026-05-08
Faith Gillian1002United Kingdom2026-05-12
Greenwood Bolognia1003Australia2026-05-19
Wickens Nestle1004Argentina2026-05-08
Deepesh Chui1005Argentina2026-05-19
Ricardo Gaucho1006United Kingdom2026-05-28
Octavia Malet1007Italy2026-05-12
Ashley Doe1008Argentina2026-05-30
Kaitlin Ostrosky1009Italy2026-05-30
Claire Tollner1010Canada2026-05-23
Wickens Nestle1011Canada2026-05-10
Jones Vocelka1012Spain2026-05-19
Juan Wieser1013Brazil2026-05-09
Antonio Caudy1014Australia2026-06-01
Kadeem Flosi1015Canada2026-05-25
Clifford Rim1016Canada2026-05-08
Leja Caldarera1017Canada2026-05-12
Aruna Figeroa1018Brazil2026-05-22
James Butt1019Japan2026-05-28
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Clifford RimAustraliaAsiya Javayant RENEWAL
Salvatore StockhamArgentinaAsiya Javayant NEW
Mujtaba NickaItalyOnyama Limba QUALIFIED
Silvio SlusarskiFranceIvan Magalhaes UNQUALIFIED
Leja CaldareraUnited KingdomBernardo Dominic NEGOTIATION
Aruna FigeroaItalyBernardo Dominic NEW
Juan WieserFranceAnna Fali PROPOSAL
Leon OldroydSpainElwin Sharvill NEGOTIATION
David DarakjyArgentinaElwin Sharvill UNQUALIFIED
Ricardo GauchoAustraliaElwin Sharvill NEW
Maisha RulapaughArgentinaElwin Sharvill NEGOTIATION
Kadeem FlosiUnited KingdomOnyama Limba UNQUALIFIED
Aruna FigeroaRussiaElwin Sharvill UNQUALIFIED
Isabel BowleyItalyIvan Magalhaes NEGOTIATION
Mujtaba NickaSpainIoni Bowcher PROPOSAL
Stacey MacleadAustraliaXuxue Feng RENEWAL
Francesco ShinkoAustraliaBernardo Dominic NEGOTIATION
Misaki RoysterJapanXuxue Feng NEW
Nicolas IturbideAustraliaIoni Bowcher NEGOTIATION
Rodrigues CampainSpainIvan Magalhaes NEW
Ivar PaprockiGermanyAnna Fali RENEWAL
Nicolas IturbideArgentinaAsiya Javayant UNQUALIFIED
Jefferson SchemmerUnited KingdomIvan Magalhaes PROPOSAL
Arvin AlbaresCanadaXuxue Feng UNQUALIFIED
Morrow RutaJapanBernardo Dominic PROPOSAL
Rodrigues CampainJapanAsiya Javayant NEW
Stacey MacleadBrazilAnna Fali NEW
Misaki RoysterItalyIoni Bowcher NEW
Maisha RulapaughJapanXuxue Feng UNQUALIFIED
Darci PoquetteUnited KingdomOnyama Limba RENEWAL
Francesco ShinkoJapanAmy Elsner PROPOSAL
Kaitlin OstroskyFranceElwin Sharvill NEW
Antonio CaudyGermanyBernardo Dominic RENEWAL
Juan WieserBrazilAsiya Javayant NEGOTIATION
Kaitlin OstroskyGermanyAmy Elsner NEGOTIATION
Izzy GarufiAustraliaOnyama Limba QUALIFIED
Julie StensethCanadaAsiya Javayant NEW
Ivar PaprockiAustraliaStephen Shaw UNQUALIFIED
Jennifer AmigonItalyBernardo Dominic RENEWAL
Tony FollerArgentinaElwin Sharvill NEW

<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>