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
Costa DilliardItalyAmy Elsner RENEWAL
Johnson SergiItalyStephen Shaw QUALIFIED
Mujtaba NickaFranceOnyama Limba NEGOTIATION
Nicolas IturbideItalyOnyama Limba NEW
Isabel BowleySpainBernardo Dominic QUALIFIED
Darci PoquetteCanadaOnyama Limba QUALIFIED
Greenwood BologniaSpainXuxue Feng NEW
Mujtaba NickaGermanyIoni Bowcher RENEWAL
Ricardo GauchoIndiaAnna Fali UNQUALIFIED
Rodrigues CampainAustraliaAnna Fali NEGOTIATION
Juan WieserIndiaStephen Shaw UNQUALIFIED
Maisha RulapaughBrazilElwin Sharvill RENEWAL
Murillo MaletCanadaBernardo Dominic QUALIFIED
Greenwood BologniaUnited KingdomAnna Fali UNQUALIFIED
Clifford RimFranceStephen Shaw PROPOSAL
James ButtIndiaElwin Sharvill PROPOSAL
Kaitlin OstroskyBrazilIoni Bowcher PROPOSAL
Costa DilliardCanadaAnna Fali PROPOSAL
Sinclair WaycottAustraliaStephen Shaw RENEWAL
Cody SaylorsArgentinaElwin Sharvill RENEWAL
Kadeem FlosiArgentinaOnyama Limba NEGOTIATION
Kaitlin OstroskyItalyAmy Elsner PROPOSAL
Maisha RulapaughRussiaStephen Shaw RENEWAL
Stacey MacleadUnited KingdomStephen Shaw NEGOTIATION
Rodrigues CampainUnited KingdomOnyama Limba RENEWAL
Smith GlickUnited KingdomIvan Magalhaes PROPOSAL
Emily WhobreyArgentinaElwin Sharvill PROPOSAL
Ivar PaprockiItalyBernardo Dominic UNQUALIFIED
Alejandro PerinJapanXuxue Feng UNQUALIFIED
Aika InouyeUnited KingdomOnyama Limba NEW
Antonio CaudyBrazilAnna Fali UNQUALIFIED
Francesco ShinkoJapanOnyama Limba UNQUALIFIED
David DarakjyBrazilXuxue Feng NEW
Octavia MaletUnited KingdomOnyama Limba RENEWAL
Leon OldroydIndiaIoni Bowcher PROPOSAL
Antonio CaudyJapanElwin Sharvill RENEWAL
Julie StensethJapanXuxue Feng NEW
Ivar PaprockiRussiaStephen Shaw QUALIFIED
Jeanfrancois VenereFranceElwin Sharvill QUALIFIED
Ricardo GauchoBrazilStephen Shaw UNQUALIFIED
Leja CaldareraRussiaAsiya Javayant QUALIFIED
Alejandro PerinSpainAmy Elsner PROPOSAL
James ButtSpainAnna Fali RENEWAL
Clifford RimAustraliaIvan Magalhaes NEW
Nicolas IturbideAustraliaIoni Bowcher RENEWAL
Deepesh ChuiArgentinaXuxue Feng NEW
Ivar PaprockiCanadaIoni Bowcher PROPOSAL
Adams MorascaBrazilBernardo Dominic UNQUALIFIED
David DarakjyArgentinaBernardo Dominic UNQUALIFIED
Kadeem FlosiUnited KingdomAmy Elsner NEW
Horizontal
NameCountryRepresentativeStatus
Ricardo GauchoGermanyOnyama Limba RENEWAL
Misaki RoysterJapanElwin Sharvill RENEWAL
Maria MarrierBrazilIvan Magalhaes NEW
Aditya KuskoItalyOnyama Limba RENEWAL
Mujtaba NickaUnited KingdomAnna Fali RENEWAL
Aditya KuskoArgentinaAnna Fali UNQUALIFIED
Deepesh ChuiJapanStephen Shaw UNQUALIFIED
Morrow RutaUnited KingdomAmy Elsner NEW
Kaitlin OstroskyBrazilIoni Bowcher NEGOTIATION
Costa DilliardIndiaIvan Magalhaes UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Ashley DoeBrazil2025-07-09King, Christopher A Esq UNQUALIFIED48Onyama Limba
1001Aika InouyeItaly2025-07-22Feltz Printing Service RENEWAL46Ivan Magalhaes
1002Silvio SlusarskiSpain2025-07-07Printing Dimensions UNQUALIFIED94Asiya Javayant
1003Izzy GarufiRussia2025-07-28King, Christopher A Esq UNQUALIFIED10Ioni Bowcher
1004Greenwood BologniaCanada2025-07-30Benton, John B Jr RENEWAL86Anna Fali
1005Johnson SergiJapan2025-07-26Printing Dimensions RENEWAL52Bernardo Dominic
1006Smith GlickItaly2025-07-10Chanay, Jeffrey A Esq NEW92Stephen Shaw
1007Misaki RoysterArgentina2025-07-13Printing Dimensions UNQUALIFIED37Anna Fali
1008David DarakjyArgentina2025-07-18Chanay, Jeffrey A Esq NEGOTIATION21Amy Elsner
1009Kaitlin OstroskyUnited Kingdom2025-07-14King, Christopher A Esq NEW96Bernardo Dominic
1010Clifford RimJapan2025-07-14Rousseaux, Michael Esq UNQUALIFIED7Anna Fali
1011Morrow RutaArgentina2025-08-03King, Christopher A Esq RENEWAL37Stephen Shaw
1012Adams MorascaUnited Kingdom2025-08-02Truhlar And Truhlar Attys QUALIFIED57Onyama Limba
1013Johnson SergiFrance2025-07-21Chanay, Jeffrey A Esq UNQUALIFIED57Amy Elsner
1014Ricardo GauchoJapan2025-07-07Feltz Printing Service PROPOSAL88Ioni Bowcher
1015Faith GillianJapan2025-07-17Buckley Miller Wright RENEWAL67Xuxue Feng
1016Chavez BriddickRussia2025-07-07Chemel, James L Cpa UNQUALIFIED43Ioni Bowcher
1017Mujtaba NickaRussia2025-08-01Rangoni Of Florence PROPOSAL79Stephen Shaw
1018Aruna FigeroaUnited Kingdom2025-07-22Morlong Associates PROPOSAL36Elwin Sharvill
1019Francesco ShinkoArgentina2025-07-30Rangoni Of Florence UNQUALIFIED12Anna Fali
1020Salvatore StockhamIndia2025-07-19Printing Dimensions UNQUALIFIED9Amy Elsner
1021David DarakjyArgentina2025-07-10Truhlar And Truhlar Attys PROPOSAL56Ivan Magalhaes
1022Mayumi KolmetzFrance2025-07-27Buckley Miller Wright NEGOTIATION15Amy Elsner
1023Leon OldroydUnited Kingdom2025-07-28Feltz Printing Service RENEWAL21Ioni Bowcher
1024Jeanfrancois VenereSpain2025-08-01Truhlar And Truhlar Attys NEW29Ivan Magalhaes
1025Tony FollerUnited Kingdom2025-07-20Rangoni Of Florence UNQUALIFIED35Amy Elsner
1026Munro FerenczFrance2025-07-14Morlong Associates NEGOTIATION7Stephen Shaw
1027Izzy GarufiJapan2025-07-20Rousseaux, Michael Esq RENEWAL16Xuxue Feng
1028Rodrigues CampainBrazil2025-07-18Morlong Associates NEGOTIATION46Anna Fali
1029Maisha RulapaughSpain2025-07-19Feiner Bros QUALIFIED51Amy Elsner
1030Jones VocelkaCanada2025-07-25Morlong Associates QUALIFIED6Stephen Shaw
1031Munro FerenczRussia2025-07-17Benton, John B Jr RENEWAL55Asiya Javayant
1032Octavia MaletIndia2025-07-20Feiner Bros PROPOSAL13Ivan Magalhaes
1033Wickens NestleJapan2025-07-27Dorl, James J Esq NEW33Amy Elsner
1034Morrow RutaItaly2025-07-30Buckley Miller Wright NEW7Asiya Javayant
1035Aika InouyeItaly2025-07-31Rousseaux, Michael Esq UNQUALIFIED23Elwin Sharvill
1036Silvio SlusarskiAustralia2025-07-28Chapman, Ross E Esq NEGOTIATION26Onyama Limba
1037Julie StensethItaly2025-08-01King, Christopher A Esq PROPOSAL79Anna Fali
1038Jefferson SchemmerArgentina2025-07-28Printing Dimensions RENEWAL83Xuxue Feng
1039Rodrigues CampainUnited Kingdom2025-08-02Chapman, Ross E Esq PROPOSAL85Onyama Limba
1040Aika InouyeUnited Kingdom2025-07-28Chanay, Jeffrey A Esq PROPOSAL19Asiya Javayant
1041David DarakjyArgentina2025-07-08Chemel, James L Cpa UNQUALIFIED30Stephen Shaw
1042Sinclair WaycottAustralia2025-07-07Rousseaux, Michael Esq PROPOSAL95Ivan Magalhaes
1043Aditya KuskoArgentina2025-07-13Commercial Press UNQUALIFIED68Ioni Bowcher
1044Chavez BriddickIndia2025-07-12King, Christopher A Esq UNQUALIFIED5Elwin Sharvill
1045Wickens NestleSpain2025-07-21Chanay, Jeffrey A Esq QUALIFIED57Ioni Bowcher
1046David DarakjyArgentina2025-07-23Chapman, Ross E Esq QUALIFIED96Asiya Javayant
1047Munro FerenczArgentina2025-07-07Truhlar And Truhlar Attys PROPOSAL21Xuxue Feng
1048Wickens NestleBrazil2025-07-21Benton, John B Jr UNQUALIFIED92Xuxue Feng
1049Johnson SergiItaly2025-07-11King, Christopher A Esq UNQUALIFIED66Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Julie StensethFranceBernardo Dominic QUALIFIED
Jeanfrancois VenereAustraliaXuxue Feng NEW
Maria MarrierFranceElwin Sharvill UNQUALIFIED
Deepesh ChuiFranceAnna Fali NEW
Stacey MacleadGermanyAmy Elsner PROPOSAL
Maria MarrierIndiaElwin Sharvill UNQUALIFIED
Misaki RoysterArgentinaIvan Magalhaes NEGOTIATION
Clifford RimIndiaIoni Bowcher UNQUALIFIED
Leon OldroydSpainXuxue Feng UNQUALIFIED
Aditya KuskoAustraliaAsiya Javayant UNQUALIFIED
Tony FollerAustraliaXuxue Feng PROPOSAL
Costa DilliardRussiaAmy Elsner NEW
Nicolas IturbideAustraliaAmy Elsner QUALIFIED
Jones VocelkaJapanStephen Shaw NEW
Jennifer AmigonRussiaStephen Shaw RENEWAL
Deepesh ChuiGermanyIoni Bowcher PROPOSAL
Isabel BowleyAustraliaStephen Shaw RENEWAL
Sinclair WaycottArgentinaStephen Shaw QUALIFIED
Salvatore StockhamFranceAnna Fali NEGOTIATION
Faith GillianAustraliaOnyama Limba NEW
David DarakjySpainElwin Sharvill NEW
Jeanfrancois VenereArgentinaAsiya Javayant PROPOSAL
Ivar PaprockiGermanyOnyama Limba UNQUALIFIED
Darci PoquetteCanadaAsiya Javayant PROPOSAL
Misaki RoysterSpainXuxue Feng PROPOSAL
Greenwood BologniaCanadaAnna Fali UNQUALIFIED
Ricardo GauchoIndiaAsiya Javayant NEGOTIATION
Antonio CaudyIndiaAmy Elsner NEW
Morrow RutaAustraliaXuxue Feng NEW
Aruna FigeroaAustraliaXuxue Feng PROPOSAL
Misaki RoysterItalyOnyama Limba NEW
Greenwood BologniaJapanBernardo Dominic RENEWAL
Munro FerenczJapanAnna Fali UNQUALIFIED
Munro FerenczGermanyAmy Elsner NEW
Juan WieserGermanyElwin Sharvill NEW
Jeanfrancois VenereCanadaElwin Sharvill QUALIFIED
David DarakjyCanadaAsiya Javayant UNQUALIFIED
Sinclair WaycottRussiaAmy Elsner UNQUALIFIED
Smith GlickItalyAmy Elsner NEW
Aruna FigeroaAustraliaIvan Magalhaes PROPOSAL
Mayumi KolmetzAustraliaAsiya Javayant PROPOSAL
Wickens NestleIndiaStephen Shaw UNQUALIFIED
Octavia MaletGermanyElwin Sharvill NEGOTIATION
Octavia MaletItalyAnna Fali PROPOSAL
Mujtaba NickaRussiaIoni Bowcher RENEWAL
Isabel BowleyArgentinaIvan Magalhaes PROPOSAL
Emily WhobreyCanadaXuxue Feng PROPOSAL
Kaitlin OstroskyRussiaAsiya Javayant RENEWAL
Isabel BowleyArgentinaBernardo Dominic RENEWAL
Ricardo GauchoSpainIvan Magalhaes RENEWAL
Frozen Columns
Name
Kadeem Flosi
Murillo Malet
Jeanfrancois Venere
Tony Foller
Johnson Sergi
Izzy Garufi
Greenwood Bolognia
Francesco Shinko
Smith Glick
Emily Whobrey
David Darakjy
Jones Vocelka
Claire Tollner
Izzy Garufi
Greenwood Bolognia
Aika Inouye
Alejandro Perin
Deepesh Chui
Mayumi Kolmetz
Antonio Caudy
Alejandro Perin
Aika Inouye
Kaitlin Ostrosky
Juan Wieser
Kadeem Flosi
Deepesh Chui
Salvatore Stockham
Aika Inouye
Ricardo Gaucho
Ivar Paprocki
Johnson Sergi
Wickens Nestle
Leon Oldroyd
Morrow Ruta
Ivar Paprocki
Kaitlin Ostrosky
Maisha Rulapaugh
Maisha Rulapaugh
Salvatore Stockham
Leon Oldroyd
Maisha Rulapaugh
Leon Oldroyd
Aika Inouye
Nicolas Iturbide
Silvio Slusarski
Murillo Malet
Emily Whobrey
Adams Morasca
Nicolas Iturbide
Sinclair Waycott
IdCountryDate
1000Canada2025-07-29
1001Australia2025-07-22
1002Brazil2025-07-10
1003Australia2025-07-31
1004Germany2025-07-14
1005Brazil2025-07-23
1006Russia2025-07-29
1007Brazil2025-07-17
1008Germany2025-07-26
1009Germany2025-07-26
1010Germany2025-07-09
1011Argentina2025-07-08
1012India2025-08-01
1013Spain2025-08-03
1014India2025-07-09
1015Spain2025-07-06
1016Australia2025-07-24
1017Australia2025-08-03
1018Germany2025-07-17
1019Brazil2025-07-13
1020Brazil2025-07-20
1021Spain2025-07-09
1022India2025-07-19
1023Spain2025-07-21
1024France2025-07-06
1025Germany2025-07-06
1026Australia2025-07-17
1027Brazil2025-07-26
1028Brazil2025-07-08
1029Italy2025-08-04
1030Germany2025-07-19
1031Australia2025-07-19
1032Canada2025-07-20
1033Germany2025-07-31
1034Australia2025-07-23
1035Australia2025-07-30
1036Australia2025-08-01
1037Italy2025-07-11
1038India2025-07-13
1039India2025-08-02
1040Australia2025-08-03
1041Spain2025-07-29
1042Germany2025-07-26
1043Argentina2025-07-30
1044Brazil2025-07-17
1045Australia2025-07-27
1046Australia2025-07-09
1047Canada2025-07-08
1048Brazil2025-08-01
1049Canada2025-07-26

On-Demand Data

NameIdCountryDate
Stacey Maclead1000Japan2025-07-09
Rodrigues Campain1001United Kingdom2025-07-24
Costa Dilliard1002India2025-07-21
Deepesh Chui1003Australia2025-07-17
Leon Oldroyd1004Germany2025-07-26
Claire Tollner1005Spain2025-07-10
Chavez Briddick1006India2025-07-09
Maria Marrier1007India2025-07-18
Izzy Garufi1008Italy2025-07-15
Costa Dilliard1009Germany2025-07-11
Stacey Maclead1010Japan2025-07-12
Arvin Albares1011Japan2025-07-16
Greenwood Bolognia1012Russia2025-07-31
Faith Gillian1013United Kingdom2025-08-04
Costa Dilliard1014Australia2025-07-27
Tony Foller1015Brazil2025-07-23
Jennifer Amigon1016Germany2025-08-01
Nicolas Iturbide1017Italy2025-07-27
Jefferson Schemmer1018France2025-07-09
Munro Ferencz1019France2025-08-04
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
David DarakjyRussiaStephen Shaw PROPOSAL
Clifford RimJapanAmy Elsner NEGOTIATION
Emily WhobreyUnited KingdomStephen Shaw PROPOSAL
Maisha RulapaughJapanIvan Magalhaes NEGOTIATION
Wickens NestleGermanyAmy Elsner PROPOSAL
Julie StensethAustraliaElwin Sharvill UNQUALIFIED
Claire TollnerCanadaBernardo Dominic RENEWAL
Aika InouyeUnited KingdomAnna Fali UNQUALIFIED
Claire TollnerItalyXuxue Feng NEW
Greenwood BologniaJapanAsiya Javayant NEGOTIATION
Isabel BowleyAustraliaElwin Sharvill UNQUALIFIED
Cody SaylorsFranceXuxue Feng NEW
Tony FollerUnited KingdomBernardo Dominic NEW
Kaitlin OstroskyIndiaIvan Magalhaes UNQUALIFIED
Morrow RutaGermanyAmy Elsner NEGOTIATION
James ButtUnited KingdomAnna Fali NEGOTIATION
Darci PoquetteUnited KingdomAsiya Javayant NEW
Antonio CaudyArgentinaOnyama Limba PROPOSAL
Arvin AlbaresFranceIoni Bowcher NEGOTIATION
Izzy GarufiJapanIvan Magalhaes UNQUALIFIED
Johnson SergiGermanyIoni Bowcher UNQUALIFIED
Antonio CaudyGermanyBernardo Dominic NEW
Claire TollnerFranceOnyama Limba RENEWAL
Emily WhobreyAustraliaXuxue Feng NEGOTIATION
Alejandro PerinIndiaOnyama Limba NEGOTIATION
Munro FerenczJapanAsiya Javayant NEGOTIATION
Tony FollerItalyBernardo Dominic NEW
Isabel BowleySpainOnyama Limba UNQUALIFIED
Silvio SlusarskiItalyIvan Magalhaes QUALIFIED
Johnson SergiCanadaIoni Bowcher RENEWAL
Mayumi KolmetzRussiaAsiya Javayant NEGOTIATION
Kadeem FlosiItalyAsiya Javayant NEW
Aditya KuskoBrazilBernardo Dominic UNQUALIFIED
Deepesh ChuiArgentinaAmy Elsner QUALIFIED
Julie StensethIndiaElwin Sharvill QUALIFIED
Faith GillianItalyBernardo Dominic NEW
Octavia MaletRussiaXuxue Feng NEW
Ashley DoeJapanBernardo Dominic RENEWAL
Isabel BowleyUnited KingdomAsiya Javayant NEW
Leon OldroydIndiaElwin Sharvill 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>