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
Mayumi KolmetzSpainIoni Bowcher PROPOSAL
Tony FollerRussiaAnna Fali NEW
Morrow RutaGermanyAsiya Javayant PROPOSAL
Cody SaylorsJapanAmy Elsner UNQUALIFIED
Claire TollnerGermanyBernardo Dominic PROPOSAL
Smith GlickUnited KingdomOnyama Limba NEGOTIATION
Tony FollerJapanBernardo Dominic UNQUALIFIED
Jones VocelkaItalyIoni Bowcher NEW
Jones VocelkaItalyAmy Elsner RENEWAL
Claire TollnerItalyBernardo Dominic NEW
Misaki RoysterFranceElwin Sharvill NEW
Jeanfrancois VenereUnited KingdomStephen Shaw NEW
Darci PoquetteGermanyStephen Shaw NEGOTIATION
Sinclair WaycottItalyStephen Shaw RENEWAL
Octavia MaletBrazilIvan Magalhaes NEW
Francesco ShinkoUnited KingdomXuxue Feng NEGOTIATION
Johnson SergiUnited KingdomStephen Shaw NEGOTIATION
Faith GillianItalyAmy Elsner PROPOSAL
Jennifer AmigonRussiaIoni Bowcher NEW
Mujtaba NickaBrazilAmy Elsner UNQUALIFIED
Claire TollnerArgentinaElwin Sharvill RENEWAL
David DarakjyBrazilAnna Fali NEW
Kaitlin OstroskyAustraliaIoni Bowcher PROPOSAL
Maria MarrierUnited KingdomBernardo Dominic PROPOSAL
Clifford RimSpainElwin Sharvill UNQUALIFIED
Jeanfrancois VenereUnited KingdomXuxue Feng NEW
Ivar PaprockiArgentinaStephen Shaw QUALIFIED
Jennifer AmigonIndiaIoni Bowcher PROPOSAL
Aika InouyeAustraliaAmy Elsner NEW
Morrow RutaAustraliaAsiya Javayant QUALIFIED
Antonio CaudyCanadaOnyama Limba NEW
Mujtaba NickaRussiaStephen Shaw QUALIFIED
Nicolas IturbideRussiaElwin Sharvill PROPOSAL
Adams MorascaSpainAsiya Javayant UNQUALIFIED
Ashley DoeRussiaAmy Elsner QUALIFIED
Izzy GarufiAustraliaIoni Bowcher RENEWAL
Juan WieserIndiaAnna Fali NEW
Isabel BowleyAustraliaXuxue Feng NEGOTIATION
Salvatore StockhamArgentinaAnna Fali UNQUALIFIED
Aruna FigeroaFranceIvan Magalhaes RENEWAL
Greenwood BologniaCanadaAsiya Javayant UNQUALIFIED
Morrow RutaJapanStephen Shaw UNQUALIFIED
Mayumi KolmetzAustraliaStephen Shaw QUALIFIED
Nicolas IturbideIndiaBernardo Dominic PROPOSAL
Silvio SlusarskiBrazilXuxue Feng NEGOTIATION
Johnson SergiItalyIoni Bowcher UNQUALIFIED
Tony FollerCanadaXuxue Feng PROPOSAL
Leja CaldareraCanadaIoni Bowcher UNQUALIFIED
Ivar PaprockiJapanAnna Fali RENEWAL
Murillo MaletSpainAsiya Javayant NEW
Horizontal
NameCountryRepresentativeStatus
Mayumi KolmetzGermanyBernardo Dominic PROPOSAL
Stacey MacleadIndiaXuxue Feng UNQUALIFIED
Adams MorascaUnited KingdomStephen Shaw QUALIFIED
Mayumi KolmetzItalyElwin Sharvill UNQUALIFIED
Jeanfrancois VenereJapanAnna Fali NEGOTIATION
Arvin AlbaresIndiaAnna Fali PROPOSAL
Murillo MaletBrazilAnna Fali UNQUALIFIED
Maisha RulapaughArgentinaAnna Fali PROPOSAL
Sinclair WaycottItalyIoni Bowcher PROPOSAL
Juan WieserFranceIoni Bowcher RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000David DarakjyGermany2026-05-23Printing Dimensions UNQUALIFIED54Bernardo Dominic
1001Isabel BowleyArgentina2026-06-07Truhlar And Truhlar Attys QUALIFIED56Amy Elsner
1002Francesco ShinkoItaly2026-05-17Chemel, James L Cpa RENEWAL30Elwin Sharvill
1003James ButtIndia2026-06-06Truhlar And Truhlar Attys QUALIFIED85Onyama Limba
1004Jefferson SchemmerArgentina2026-05-21Printing Dimensions PROPOSAL40Bernardo Dominic
1005Emily WhobreyRussia2026-05-16Rousseaux, Michael Esq PROPOSAL96Asiya Javayant
1006Ivar PaprockiIndia2026-06-07Chapman, Ross E Esq NEGOTIATION33Stephen Shaw
1007Salvatore StockhamSpain2026-05-15Rousseaux, Michael Esq QUALIFIED78Amy Elsner
1008Cody SaylorsRussia2026-06-07Buckley Miller Wright UNQUALIFIED39Amy Elsner
1009Mayumi KolmetzSpain2026-06-03Feiner Bros NEW6Asiya Javayant
1010Clifford RimFrance2026-05-15Chapman, Ross E Esq PROPOSAL36Stephen Shaw
1011Nicolas IturbideIndia2026-06-02Feiner Bros NEW95Stephen Shaw
1012Mayumi KolmetzAustralia2026-05-30Rangoni Of Florence UNQUALIFIED0Bernardo Dominic
1013Silvio SlusarskiJapan2026-05-17Chanay, Jeffrey A Esq RENEWAL74Amy Elsner
1014Jennifer AmigonFrance2026-05-15Feiner Bros NEW18Onyama Limba
1015Greenwood BologniaArgentina2026-06-04Buckley Miller Wright QUALIFIED62Amy Elsner
1016Kaitlin OstroskyArgentina2026-06-02Printing Dimensions UNQUALIFIED22Anna Fali
1017Ricardo GauchoSpain2026-05-24Commercial Press RENEWAL59Stephen Shaw
1018Rodrigues CampainUnited Kingdom2026-05-16Chapman, Ross E Esq NEGOTIATION99Anna Fali
1019Costa DilliardCanada2026-06-11Feltz Printing Service RENEWAL37Stephen Shaw
1020Ashley DoeJapan2026-05-23Feltz Printing Service NEGOTIATION42Xuxue Feng
1021Costa DilliardFrance2026-06-08Chanay, Jeffrey A Esq NEW14Amy Elsner
1022Leon OldroydBrazil2026-05-18Truhlar And Truhlar Attys RENEWAL39Onyama Limba
1023Smith GlickSpain2026-05-23Feltz Printing Service NEW42Bernardo Dominic
1024James ButtJapan2026-05-25Chapman, Ross E Esq PROPOSAL2Anna Fali
1025Kaitlin OstroskyCanada2026-06-02Morlong Associates RENEWAL90Xuxue Feng
1026Isabel BowleyRussia2026-06-01Printing Dimensions QUALIFIED44Stephen Shaw
1027Emily WhobreyRussia2026-06-04Chapman, Ross E Esq RENEWAL69Asiya Javayant
1028Izzy GarufiIndia2026-06-04Chanay, Jeffrey A Esq UNQUALIFIED3Anna Fali
1029Emily WhobreyGermany2026-05-24Truhlar And Truhlar Attys NEW26Asiya Javayant
1030Faith GillianItaly2026-06-03Feiner Bros NEGOTIATION51Ivan Magalhaes
1031Cody SaylorsFrance2026-06-05Commercial Press RENEWAL54Ivan Magalhaes
1032Izzy GarufiSpain2026-05-21Feltz Printing Service UNQUALIFIED76Xuxue Feng
1033Tony FollerArgentina2026-05-24Benton, John B Jr UNQUALIFIED28Ioni Bowcher
1034Morrow RutaArgentina2026-05-23Printing Dimensions PROPOSAL3Ivan Magalhaes
1035Antonio CaudyFrance2026-06-10Truhlar And Truhlar Attys NEGOTIATION72Ioni Bowcher
1036Francesco ShinkoRussia2026-05-30Feiner Bros RENEWAL21Stephen Shaw
1037Stacey MacleadRussia2026-05-15Benton, John B Jr RENEWAL92Asiya Javayant
1038Francesco ShinkoCanada2026-06-02Dorl, James J Esq RENEWAL73Amy Elsner
1039Mujtaba NickaItaly2026-05-25Feiner Bros PROPOSAL57Ioni Bowcher
1040Faith GillianItaly2026-05-25Commercial Press QUALIFIED54Asiya Javayant
1041Rodrigues CampainCanada2026-05-24Feltz Printing Service PROPOSAL40Ioni Bowcher
1042Juan WieserAustralia2026-05-28Feiner Bros UNQUALIFIED51Ivan Magalhaes
1043Faith GillianArgentina2026-06-02Commercial Press RENEWAL16Bernardo Dominic
1044Chavez BriddickGermany2026-05-25King, Christopher A Esq PROPOSAL65Bernardo Dominic
1045Aika InouyeUnited Kingdom2026-06-11Rangoni Of Florence UNQUALIFIED80Ivan Magalhaes
1046James ButtGermany2026-05-30Chemel, James L Cpa QUALIFIED78Onyama Limba
1047Arvin AlbaresFrance2026-05-23King, Christopher A Esq UNQUALIFIED71Amy Elsner
1048Jennifer AmigonArgentina2026-06-01Rousseaux, Michael Esq RENEWAL52Stephen Shaw
1049Nicolas IturbideFrance2026-06-01King, Christopher A Esq NEGOTIATION63Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Emily WhobreyCanadaAmy Elsner NEW
Juan WieserFranceIvan Magalhaes NEGOTIATION
Kaitlin OstroskyItalyXuxue Feng QUALIFIED
Jeanfrancois VenereBrazilAnna Fali QUALIFIED
Antonio CaudyIndiaIvan Magalhaes NEGOTIATION
Antonio CaudyGermanyAsiya Javayant PROPOSAL
Kadeem FlosiRussiaElwin Sharvill RENEWAL
Leon OldroydIndiaAsiya Javayant UNQUALIFIED
David DarakjyItalyOnyama Limba NEW
Munro FerenczBrazilAsiya Javayant NEGOTIATION
Emily WhobreyRussiaBernardo Dominic NEW
Ricardo GauchoRussiaIvan Magalhaes NEGOTIATION
Mayumi KolmetzRussiaBernardo Dominic NEGOTIATION
Smith GlickJapanAmy Elsner QUALIFIED
Rodrigues CampainArgentinaAsiya Javayant UNQUALIFIED
Clifford RimGermanyAmy Elsner RENEWAL
Mayumi KolmetzSpainXuxue Feng RENEWAL
Costa DilliardArgentinaXuxue Feng NEW
Costa DilliardItalyStephen Shaw PROPOSAL
Jennifer AmigonArgentinaXuxue Feng UNQUALIFIED
Smith GlickAustraliaAsiya Javayant PROPOSAL
Rodrigues CampainItalyIvan Magalhaes PROPOSAL
Misaki RoysterJapanXuxue Feng UNQUALIFIED
Mujtaba NickaUnited KingdomStephen Shaw NEGOTIATION
Aditya KuskoCanadaBernardo Dominic UNQUALIFIED
Aruna FigeroaFranceAnna Fali UNQUALIFIED
Ivar PaprockiCanadaXuxue Feng UNQUALIFIED
Ricardo GauchoGermanyIvan Magalhaes RENEWAL
Costa DilliardRussiaOnyama Limba RENEWAL
Darci PoquetteItalyAnna Fali RENEWAL
Antonio CaudyArgentinaXuxue Feng NEGOTIATION
Jeanfrancois VenereBrazilAnna Fali NEGOTIATION
Johnson SergiIndiaIoni Bowcher PROPOSAL
Arvin AlbaresJapanOnyama Limba NEW
Smith GlickRussiaIoni Bowcher QUALIFIED
Leon OldroydBrazilStephen Shaw NEGOTIATION
Costa DilliardFranceAmy Elsner RENEWAL
Misaki RoysterFranceOnyama Limba NEW
Clifford RimRussiaAsiya Javayant QUALIFIED
Costa DilliardGermanyAnna Fali NEW
Stacey MacleadArgentinaBernardo Dominic NEGOTIATION
Smith GlickSpainOnyama Limba RENEWAL
Sinclair WaycottJapanAmy Elsner PROPOSAL
Arvin AlbaresIndiaAnna Fali UNQUALIFIED
Adams MorascaFranceIvan Magalhaes UNQUALIFIED
Maisha RulapaughUnited KingdomAmy Elsner PROPOSAL
Greenwood BologniaSpainIoni Bowcher PROPOSAL
Maisha RulapaughItalyAmy Elsner NEGOTIATION
Costa DilliardGermanyBernardo Dominic PROPOSAL
Chavez BriddickRussiaIvan Magalhaes NEW
Frozen Columns
Name
Leja Caldarera
Juan Wieser
Rodrigues Campain
Antonio Caudy
Claire Tollner
Leon Oldroyd
Chavez Briddick
Jennifer Amigon
Chavez Briddick
Claire Tollner
Nicolas Iturbide
Darci Poquette
Juan Wieser
Morrow Ruta
Maisha Rulapaugh
Misaki Royster
Johnson Sergi
Deepesh Chui
Jennifer Amigon
Octavia Malet
Deepesh Chui
Francesco Shinko
Leja Caldarera
Kaitlin Ostrosky
James Butt
Kaitlin Ostrosky
Costa Dilliard
Tony Foller
Nicolas Iturbide
Leja Caldarera
Silvio Slusarski
Francesco Shinko
Murillo Malet
Maisha Rulapaugh
Nicolas Iturbide
Clifford Rim
Faith Gillian
Leon Oldroyd
Ashley Doe
Chavez Briddick
Maria Marrier
Johnson Sergi
Kadeem Flosi
Mayumi Kolmetz
Kadeem Flosi
Munro Ferencz
Claire Tollner
Kaitlin Ostrosky
Silvio Slusarski
Rodrigues Campain
IdCountryDate
1000Spain2026-05-29
1001Italy2026-05-20
1002Canada2026-05-20
1003Germany2026-05-27
1004United Kingdom2026-06-07
1005Russia2026-06-04
1006India2026-05-22
1007Brazil2026-05-29
1008United Kingdom2026-05-20
1009Russia2026-05-22
1010Spain2026-05-18
1011Russia2026-06-09
1012France2026-05-23
1013Russia2026-05-17
1014India2026-05-23
1015India2026-05-17
1016India2026-05-27
1017Spain2026-05-29
1018Brazil2026-06-06
1019Brazil2026-05-19
1020Australia2026-05-15
1021Australia2026-05-28
1022Spain2026-05-27
1023Canada2026-06-08
1024Spain2026-05-25
1025Germany2026-05-22
1026Italy2026-05-16
1027Italy2026-06-02
1028Australia2026-06-08
1029Italy2026-06-09
1030Canada2026-06-08
1031Argentina2026-05-15
1032United Kingdom2026-05-29
1033Spain2026-06-10
1034Canada2026-05-18
1035Australia2026-05-17
1036Canada2026-06-12
1037Canada2026-06-11
1038Brazil2026-05-29
1039Russia2026-05-25
1040Germany2026-05-29
1041Argentina2026-05-17
1042Argentina2026-06-04
1043Russia2026-05-20
1044Australia2026-06-04
1045Spain2026-05-14
1046Australia2026-05-28
1047Italy2026-06-12
1048Argentina2026-06-12
1049Canada2026-05-18

On-Demand Data

NameIdCountryDate
Deepesh Chui1000Argentina2026-06-07
Deepesh Chui1001Germany2026-06-02
Leja Caldarera1002Japan2026-05-22
Kadeem Flosi1003Spain2026-05-27
Kadeem Flosi1004France2026-05-17
Octavia Malet1005Canada2026-05-26
Claire Tollner1006United Kingdom2026-06-02
Chavez Briddick1007Canada2026-06-01
Chavez Briddick1008Australia2026-05-31
Jones Vocelka1009Russia2026-06-01
Maisha Rulapaugh1010Argentina2026-06-10
Johnson Sergi1011Australia2026-05-26
Kadeem Flosi1012Australia2026-05-16
Arvin Albares1013Germany2026-05-23
Mujtaba Nicka1014Germany2026-05-18
James Butt1015France2026-06-12
Mujtaba Nicka1016Japan2026-06-05
Leja Caldarera1017Russia2026-05-28
Murillo Malet1018Italy2026-05-22
Morrow Ruta1019France2026-06-02
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Morrow RutaAustraliaOnyama Limba NEGOTIATION
Claire TollnerRussiaAnna Fali UNQUALIFIED
Aditya KuskoBrazilOnyama Limba PROPOSAL
Morrow RutaRussiaStephen Shaw NEW
Aditya KuskoAustraliaOnyama Limba NEGOTIATION
Adams MorascaGermanyAsiya Javayant UNQUALIFIED
Deepesh ChuiUnited KingdomElwin Sharvill PROPOSAL
Isabel BowleyAustraliaAsiya Javayant NEW
Wickens NestleCanadaAsiya Javayant PROPOSAL
Izzy GarufiArgentinaStephen Shaw PROPOSAL
Wickens NestleCanadaElwin Sharvill UNQUALIFIED
Ashley DoeBrazilAmy Elsner QUALIFIED
Stacey MacleadJapanBernardo Dominic RENEWAL
Ivar PaprockiArgentinaElwin Sharvill NEGOTIATION
Maisha RulapaughGermanyStephen Shaw NEW
Octavia MaletSpainAmy Elsner RENEWAL
Jones VocelkaJapanIoni Bowcher NEW
Jones VocelkaUnited KingdomIoni Bowcher PROPOSAL
Morrow RutaAustraliaAmy Elsner NEW
James ButtJapanAsiya Javayant NEGOTIATION
Morrow RutaJapanAmy Elsner UNQUALIFIED
Jefferson SchemmerJapanIvan Magalhaes NEGOTIATION
Cody SaylorsUnited KingdomIvan Magalhaes PROPOSAL
Darci PoquetteJapanOnyama Limba RENEWAL
Kadeem FlosiIndiaIvan Magalhaes PROPOSAL
Greenwood BologniaJapanXuxue Feng PROPOSAL
Claire TollnerAustraliaElwin Sharvill RENEWAL
Murillo MaletRussiaXuxue Feng PROPOSAL
Adams MorascaSpainOnyama Limba PROPOSAL
Darci PoquetteCanadaAnna Fali NEGOTIATION
Julie StensethArgentinaXuxue Feng QUALIFIED
Maisha RulapaughGermanyElwin Sharvill UNQUALIFIED
Wickens NestleGermanyAnna Fali QUALIFIED
Isabel BowleyRussiaAmy Elsner UNQUALIFIED
Johnson SergiBrazilXuxue Feng QUALIFIED
Faith GillianSpainOnyama Limba NEGOTIATION
Antonio CaudyCanadaStephen Shaw RENEWAL
Cody SaylorsCanadaAsiya Javayant NEW
Chavez BriddickRussiaBernardo Dominic NEW
Francesco ShinkoArgentinaAmy Elsner PROPOSAL

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