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
Aditya KuskoGermanyOnyama Limba UNQUALIFIED
Silvio SlusarskiGermanyStephen Shaw QUALIFIED
Leja CaldareraJapanAsiya Javayant UNQUALIFIED
Stacey MacleadAustraliaAnna Fali QUALIFIED
Ashley DoeIndiaIvan Magalhaes RENEWAL
Maria MarrierItalyElwin Sharvill QUALIFIED
Deepesh ChuiAustraliaElwin Sharvill RENEWAL
Ivar PaprockiItalyIvan Magalhaes QUALIFIED
Aruna FigeroaItalyElwin Sharvill QUALIFIED
Jennifer AmigonBrazilXuxue Feng RENEWAL
Leon OldroydItalyAmy Elsner NEGOTIATION
Antonio CaudyJapanXuxue Feng RENEWAL
David DarakjyIndiaBernardo Dominic RENEWAL
Julie StensethGermanyXuxue Feng NEW
Aditya KuskoGermanyIoni Bowcher NEW
Salvatore StockhamIndiaStephen Shaw QUALIFIED
Maisha RulapaughJapanBernardo Dominic QUALIFIED
Maisha RulapaughAustraliaStephen Shaw UNQUALIFIED
Maisha RulapaughCanadaAnna Fali NEGOTIATION
Maria MarrierGermanyOnyama Limba PROPOSAL
Adams MorascaUnited KingdomIoni Bowcher UNQUALIFIED
Emily WhobreyJapanAnna Fali RENEWAL
Alejandro PerinCanadaXuxue Feng RENEWAL
Morrow RutaCanadaElwin Sharvill QUALIFIED
Mayumi KolmetzRussiaElwin Sharvill QUALIFIED
Cody SaylorsFranceOnyama Limba RENEWAL
Greenwood BologniaUnited KingdomStephen Shaw QUALIFIED
Aruna FigeroaUnited KingdomXuxue Feng NEW
Greenwood BologniaBrazilAmy Elsner QUALIFIED
Francesco ShinkoBrazilIvan Magalhaes QUALIFIED
Rodrigues CampainCanadaIvan Magalhaes RENEWAL
Antonio CaudyItalyAnna Fali QUALIFIED
Claire TollnerBrazilBernardo Dominic NEW
Mujtaba NickaJapanElwin Sharvill NEW
Aika InouyeAustraliaAnna Fali PROPOSAL
Ivar PaprockiArgentinaBernardo Dominic UNQUALIFIED
Chavez BriddickBrazilAmy Elsner NEGOTIATION
Misaki RoysterBrazilAsiya Javayant UNQUALIFIED
Jeanfrancois VenereArgentinaElwin Sharvill QUALIFIED
Misaki RoysterFranceElwin Sharvill PROPOSAL
Darci PoquetteFranceOnyama Limba UNQUALIFIED
Francesco ShinkoFranceAmy Elsner UNQUALIFIED
Alejandro PerinGermanyStephen Shaw NEGOTIATION
Emily WhobreyArgentinaAnna Fali UNQUALIFIED
Morrow RutaItalyAnna Fali PROPOSAL
Wickens NestleArgentinaIoni Bowcher NEGOTIATION
Faith GillianJapanIvan Magalhaes PROPOSAL
Octavia MaletIndiaAmy Elsner NEW
Murillo MaletJapanOnyama Limba QUALIFIED
Juan WieserJapanBernardo Dominic QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Maisha RulapaughArgentinaAnna Fali NEGOTIATION
Maisha RulapaughJapanOnyama Limba UNQUALIFIED
Greenwood BologniaGermanyElwin Sharvill RENEWAL
Clifford RimFranceAnna Fali RENEWAL
Misaki RoysterCanadaXuxue Feng NEW
Arvin AlbaresCanadaBernardo Dominic QUALIFIED
Smith GlickRussiaStephen Shaw PROPOSAL
Wickens NestleIndiaAsiya Javayant RENEWAL
Nicolas IturbideArgentinaIoni Bowcher NEGOTIATION
Johnson SergiCanadaIoni Bowcher UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Costa DilliardRussia2026-06-18Chapman, Ross E Esq NEW20Xuxue Feng
1001Morrow RutaIndia2026-05-22Morlong Associates RENEWAL37Ioni Bowcher
1002Leon OldroydCanada2026-06-17Feltz Printing Service PROPOSAL3Ivan Magalhaes
1003Deepesh ChuiUnited Kingdom2026-06-10Chapman, Ross E Esq RENEWAL56Elwin Sharvill
1004Ivar PaprockiSpain2026-05-29Rousseaux, Michael Esq NEW95Amy Elsner
1005Silvio SlusarskiArgentina2026-05-27Rousseaux, Michael Esq NEW21Elwin Sharvill
1006Morrow RutaUnited Kingdom2026-06-04Truhlar And Truhlar Attys UNQUALIFIED87Asiya Javayant
1007Arvin AlbaresJapan2026-05-30Morlong Associates QUALIFIED97Ivan Magalhaes
1008Costa DilliardBrazil2026-06-12Commercial Press NEW72Stephen Shaw
1009Adams MorascaAustralia2026-05-29Commercial Press UNQUALIFIED50Amy Elsner
1010Smith GlickGermany2026-06-06Rousseaux, Michael Esq UNQUALIFIED9Onyama Limba
1011Nicolas IturbideIndia2026-06-15Chapman, Ross E Esq UNQUALIFIED52Anna Fali
1012Alejandro PerinBrazil2026-05-25Feltz Printing Service QUALIFIED48Asiya Javayant
1013Izzy GarufiJapan2026-06-08Chanay, Jeffrey A Esq NEW58Bernardo Dominic
1014Munro FerenczAustralia2026-06-03Commercial Press UNQUALIFIED0Ivan Magalhaes
1015Mayumi KolmetzUnited Kingdom2026-06-08Feltz Printing Service NEGOTIATION69Stephen Shaw
1016Kaitlin OstroskyItaly2026-05-27Benton, John B Jr PROPOSAL17Xuxue Feng
1017Octavia MaletGermany2026-05-29Feltz Printing Service RENEWAL85Stephen Shaw
1018Jefferson SchemmerIndia2026-05-22Benton, John B Jr NEW44Anna Fali
1019Kaitlin OstroskyItaly2026-06-12Buckley Miller Wright NEGOTIATION3Bernardo Dominic
1020Deepesh ChuiArgentina2026-06-14Chemel, James L Cpa RENEWAL23Stephen Shaw
1021Faith GillianJapan2026-06-08Printing Dimensions UNQUALIFIED97Ioni Bowcher
1022Aditya KuskoFrance2026-06-17Morlong Associates QUALIFIED96Stephen Shaw
1023Maria MarrierCanada2026-06-16Chemel, James L Cpa NEW89Bernardo Dominic
1024Kadeem FlosiArgentina2026-05-25Chapman, Ross E Esq RENEWAL71Stephen Shaw
1025Claire TollnerUnited Kingdom2026-05-24Printing Dimensions NEGOTIATION67Elwin Sharvill
1026Jennifer AmigonIndia2026-06-07Rangoni Of Florence NEW87Onyama Limba
1027Mayumi KolmetzSpain2026-06-15Chanay, Jeffrey A Esq NEGOTIATION69Xuxue Feng
1028Munro FerenczCanada2026-05-26Benton, John B Jr NEGOTIATION63Anna Fali
1029Kaitlin OstroskyArgentina2026-05-24Benton, John B Jr QUALIFIED61Ivan Magalhaes
1030Octavia MaletIndia2026-06-01Chanay, Jeffrey A Esq QUALIFIED72Asiya Javayant
1031Wickens NestleItaly2026-06-05Buckley Miller Wright NEW37Xuxue Feng
1032Darci PoquetteRussia2026-06-10Feltz Printing Service QUALIFIED97Elwin Sharvill
1033Chavez BriddickArgentina2026-06-05Rangoni Of Florence RENEWAL81Elwin Sharvill
1034Ashley DoeFrance2026-06-12Rousseaux, Michael Esq NEW37Bernardo Dominic
1035Wickens NestleSpain2026-05-23Rousseaux, Michael Esq RENEWAL32Stephen Shaw
1036Maisha RulapaughRussia2026-05-30Buckley Miller Wright NEGOTIATION6Xuxue Feng
1037Kaitlin OstroskyAustralia2026-06-08Chemel, James L Cpa NEGOTIATION8Asiya Javayant
1038Maisha RulapaughItaly2026-05-24Rangoni Of Florence NEGOTIATION92Stephen Shaw
1039Costa DilliardBrazil2026-06-02Commercial Press UNQUALIFIED96Amy Elsner
1040Octavia MaletJapan2026-06-02King, Christopher A Esq NEGOTIATION37Amy Elsner
1041Johnson SergiItaly2026-05-27Truhlar And Truhlar Attys RENEWAL23Xuxue Feng
1042Alejandro PerinBrazil2026-05-24Feltz Printing Service QUALIFIED90Onyama Limba
1043Leon OldroydFrance2026-05-20Chemel, James L Cpa NEW97Onyama Limba
1044Maria MarrierBrazil2026-05-24Morlong Associates PROPOSAL65Asiya Javayant
1045Jones VocelkaIndia2026-06-14Feltz Printing Service RENEWAL63Elwin Sharvill
1046Aika InouyeJapan2026-06-13Rangoni Of Florence RENEWAL39Bernardo Dominic
1047Kadeem FlosiArgentina2026-06-14Feiner Bros QUALIFIED37Stephen Shaw
1048Ricardo GauchoAustralia2026-05-25Buckley Miller Wright PROPOSAL99Asiya Javayant
1049Ivar PaprockiIndia2026-05-25Commercial Press QUALIFIED45Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Arvin AlbaresItalyIvan Magalhaes QUALIFIED
Mujtaba NickaRussiaOnyama Limba RENEWAL
Adams MorascaGermanyAsiya Javayant UNQUALIFIED
Morrow RutaBrazilIvan Magalhaes QUALIFIED
Aika InouyeRussiaBernardo Dominic QUALIFIED
Rodrigues CampainAustraliaIoni Bowcher PROPOSAL
Johnson SergiFranceAmy Elsner QUALIFIED
Nicolas IturbideFranceBernardo Dominic NEW
Jeanfrancois VenereFranceStephen Shaw RENEWAL
Emily WhobreyIndiaXuxue Feng PROPOSAL
Stacey MacleadSpainAnna Fali PROPOSAL
Jeanfrancois VenereIndiaAnna Fali PROPOSAL
Jefferson SchemmerRussiaStephen Shaw NEGOTIATION
Julie StensethAustraliaOnyama Limba QUALIFIED
Aruna FigeroaRussiaBernardo Dominic NEW
Misaki RoysterIndiaIvan Magalhaes UNQUALIFIED
Wickens NestleAustraliaXuxue Feng QUALIFIED
Costa DilliardBrazilIoni Bowcher PROPOSAL
Arvin AlbaresAustraliaOnyama Limba PROPOSAL
Ivar PaprockiUnited KingdomBernardo Dominic QUALIFIED
Aika InouyeAustraliaAsiya Javayant QUALIFIED
Sinclair WaycottCanadaAsiya Javayant RENEWAL
Deepesh ChuiAustraliaStephen Shaw NEW
Ricardo GauchoIndiaXuxue Feng RENEWAL
Sinclair WaycottItalyOnyama Limba QUALIFIED
Octavia MaletGermanyAnna Fali NEW
Deepesh ChuiArgentinaAsiya Javayant NEW
Aruna FigeroaFranceOnyama Limba QUALIFIED
David DarakjyArgentinaAnna Fali QUALIFIED
Ivar PaprockiJapanAsiya Javayant UNQUALIFIED
Aruna FigeroaFranceAsiya Javayant NEGOTIATION
Johnson SergiJapanStephen Shaw UNQUALIFIED
Sinclair WaycottCanadaAnna Fali UNQUALIFIED
Costa DilliardRussiaStephen Shaw PROPOSAL
Leon OldroydCanadaBernardo Dominic NEW
Aruna FigeroaItalyXuxue Feng NEW
Wickens NestleIndiaOnyama Limba NEGOTIATION
Nicolas IturbideGermanyXuxue Feng PROPOSAL
Arvin AlbaresCanadaAsiya Javayant NEGOTIATION
Sinclair WaycottUnited KingdomAsiya Javayant PROPOSAL
Tony FollerFranceAmy Elsner NEW
Johnson SergiCanadaStephen Shaw NEW
Octavia MaletCanadaBernardo Dominic UNQUALIFIED
David DarakjyRussiaAsiya Javayant UNQUALIFIED
Octavia MaletItalyAnna Fali PROPOSAL
Jones VocelkaSpainAnna Fali NEGOTIATION
Chavez BriddickFranceStephen Shaw PROPOSAL
Chavez BriddickIndiaIvan Magalhaes NEGOTIATION
Darci PoquetteItalyIoni Bowcher QUALIFIED
Greenwood BologniaSpainBernardo Dominic RENEWAL
Frozen Columns
Name
Clifford Rim
Stacey Maclead
Mayumi Kolmetz
Chavez Briddick
Wickens Nestle
Alejandro Perin
Ashley Doe
Mujtaba Nicka
Leja Caldarera
Kadeem Flosi
Stacey Maclead
Murillo Malet
Claire Tollner
Cody Saylors
Francesco Shinko
Antonio Caudy
Aruna Figeroa
Smith Glick
Chavez Briddick
Sinclair Waycott
Juan Wieser
Deepesh Chui
Ricardo Gaucho
Darci Poquette
Munro Ferencz
Aditya Kusko
Silvio Slusarski
Rodrigues Campain
Juan Wieser
Leon Oldroyd
Francesco Shinko
Ricardo Gaucho
Leja Caldarera
Arvin Albares
Salvatore Stockham
Mayumi Kolmetz
Johnson Sergi
Jefferson Schemmer
Misaki Royster
Deepesh Chui
Claire Tollner
Cody Saylors
Maria Marrier
Ricardo Gaucho
Isabel Bowley
Ricardo Gaucho
Alejandro Perin
Kadeem Flosi
Jeanfrancois Venere
Ashley Doe
IdCountryDate
1000Germany2026-06-12
1001United Kingdom2026-06-12
1002Spain2026-06-18
1003Russia2026-06-01
1004United Kingdom2026-05-20
1005India2026-06-09
1006Spain2026-06-03
1007Spain2026-05-31
1008Brazil2026-06-09
1009Italy2026-06-09
1010Russia2026-06-11
1011Canada2026-06-12
1012Spain2026-05-24
1013Argentina2026-06-17
1014India2026-06-16
1015India2026-05-29
1016India2026-05-24
1017Japan2026-05-30
1018India2026-06-12
1019India2026-06-09
1020India2026-05-21
1021Australia2026-05-20
1022France2026-06-10
1023Brazil2026-06-06
1024Japan2026-05-29
1025Spain2026-05-31
1026Australia2026-06-05
1027Brazil2026-05-27
1028Italy2026-05-27
1029Japan2026-05-22
1030United Kingdom2026-05-25
1031Brazil2026-05-30
1032Italy2026-06-15
1033United Kingdom2026-05-31
1034Italy2026-06-02
1035Australia2026-06-06
1036Germany2026-06-04
1037Japan2026-06-16
1038Italy2026-06-12
1039Japan2026-06-18
1040Canada2026-05-27
1041Argentina2026-06-18
1042Germany2026-05-24
1043Italy2026-05-30
1044Canada2026-05-20
1045Australia2026-06-16
1046Russia2026-06-03
1047Canada2026-05-26
1048Argentina2026-05-26
1049India2026-05-28

On-Demand Data

NameIdCountryDate
Aruna Figeroa1000Germany2026-05-25
Antonio Caudy1001France2026-06-11
Sinclair Waycott1002Canada2026-05-31
Munro Ferencz1003France2026-05-24
Smith Glick1004Italy2026-06-02
Aruna Figeroa1005Russia2026-05-22
Silvio Slusarski1006Italy2026-06-08
Rodrigues Campain1007Germany2026-06-05
Greenwood Bolognia1008India2026-06-04
Jeanfrancois Venere1009Italy2026-06-18
Adams Morasca1010Italy2026-06-09
Munro Ferencz1011Australia2026-05-23
Izzy Garufi1012Japan2026-06-01
Julie Stenseth1013Brazil2026-05-21
Ivar Paprocki1014Russia2026-06-08
Murillo Malet1015Japan2026-05-26
Arvin Albares1016India2026-06-16
Munro Ferencz1017France2026-06-05
Maria Marrier1018France2026-05-27
Isabel Bowley1019Australia2026-05-23
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Kaitlin OstroskyIndiaIvan Magalhaes UNQUALIFIED
Rodrigues CampainArgentinaXuxue Feng QUALIFIED
Aditya KuskoIndiaIvan Magalhaes QUALIFIED
Kadeem FlosiIndiaXuxue Feng QUALIFIED
Greenwood BologniaArgentinaIoni Bowcher NEW
Cody SaylorsUnited KingdomIoni Bowcher RENEWAL
Julie StensethGermanyAnna Fali RENEWAL
Jefferson SchemmerGermanyAnna Fali UNQUALIFIED
Misaki RoysterUnited KingdomElwin Sharvill QUALIFIED
Izzy GarufiGermanyAmy Elsner QUALIFIED
Ashley DoeAustraliaStephen Shaw NEGOTIATION
Aruna FigeroaCanadaIoni Bowcher NEW
David DarakjyUnited KingdomIoni Bowcher PROPOSAL
James ButtGermanyAmy Elsner NEW
Ashley DoeFranceElwin Sharvill NEW
Aruna FigeroaSpainIvan Magalhaes RENEWAL
Misaki RoysterGermanyAsiya Javayant PROPOSAL
Kaitlin OstroskyFranceOnyama Limba NEW
Silvio SlusarskiFranceAnna Fali PROPOSAL
Jefferson SchemmerJapanStephen Shaw PROPOSAL
Juan WieserRussiaAmy Elsner NEW
Costa DilliardAustraliaOnyama Limba PROPOSAL
Isabel BowleyBrazilIvan Magalhaes RENEWAL
Jones VocelkaBrazilIoni Bowcher QUALIFIED
Mayumi KolmetzRussiaBernardo Dominic QUALIFIED
Alejandro PerinBrazilStephen Shaw NEGOTIATION
Alejandro PerinIndiaElwin Sharvill RENEWAL
Julie StensethCanadaAsiya Javayant QUALIFIED
Arvin AlbaresRussiaStephen Shaw PROPOSAL
Julie StensethUnited KingdomXuxue Feng NEW
Costa DilliardCanadaBernardo Dominic QUALIFIED
Morrow RutaCanadaXuxue Feng RENEWAL
Stacey MacleadItalyAmy Elsner PROPOSAL
Cody SaylorsJapanAsiya Javayant UNQUALIFIED
Alejandro PerinJapanIoni Bowcher RENEWAL
Arvin AlbaresRussiaAsiya Javayant NEGOTIATION
Adams MorascaUnited KingdomIvan Magalhaes PROPOSAL
Smith GlickCanadaIoni Bowcher NEGOTIATION
Salvatore StockhamGermanyOnyama Limba RENEWAL
Octavia MaletGermanyIoni Bowcher 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>