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
Aika InouyeItalyElwin Sharvill QUALIFIED
Francesco ShinkoFranceAsiya Javayant RENEWAL
Nicolas IturbideUnited KingdomStephen Shaw PROPOSAL
Chavez BriddickRussiaStephen Shaw NEGOTIATION
James ButtGermanyElwin Sharvill UNQUALIFIED
Izzy GarufiUnited KingdomIvan Magalhaes RENEWAL
David DarakjyIndiaXuxue Feng PROPOSAL
Mayumi KolmetzItalyOnyama Limba NEW
Kadeem FlosiSpainAsiya Javayant QUALIFIED
Mayumi KolmetzBrazilOnyama Limba QUALIFIED
Octavia MaletIndiaXuxue Feng PROPOSAL
Juan WieserCanadaXuxue Feng QUALIFIED
Aika InouyeBrazilStephen Shaw NEW
Kaitlin OstroskyJapanXuxue Feng UNQUALIFIED
Kaitlin OstroskyArgentinaOnyama Limba UNQUALIFIED
Murillo MaletBrazilAnna Fali NEW
Maisha RulapaughFranceIvan Magalhaes NEW
Claire TollnerAustraliaAnna Fali UNQUALIFIED
Costa DilliardRussiaXuxue Feng QUALIFIED
Kaitlin OstroskyJapanStephen Shaw RENEWAL
Jones VocelkaCanadaStephen Shaw NEW
Izzy GarufiRussiaIoni Bowcher NEGOTIATION
Maisha RulapaughGermanyAnna Fali RENEWAL
Clifford RimUnited KingdomIoni Bowcher NEW
Aika InouyeUnited KingdomAnna Fali UNQUALIFIED
Alejandro PerinUnited KingdomOnyama Limba PROPOSAL
Claire TollnerCanadaAnna Fali NEW
Greenwood BologniaGermanyXuxue Feng QUALIFIED
Morrow RutaJapanStephen Shaw UNQUALIFIED
Mujtaba NickaItalyOnyama Limba PROPOSAL
Misaki RoysterAustraliaElwin Sharvill QUALIFIED
Jeanfrancois VenereArgentinaIoni Bowcher NEGOTIATION
Misaki RoysterItalyStephen Shaw QUALIFIED
Faith GillianRussiaElwin Sharvill QUALIFIED
Johnson SergiFranceIoni Bowcher NEW
Mujtaba NickaJapanStephen Shaw RENEWAL
Claire TollnerUnited KingdomAsiya Javayant NEGOTIATION
Kadeem FlosiRussiaXuxue Feng QUALIFIED
Sinclair WaycottItalyIvan Magalhaes NEGOTIATION
Jeanfrancois VenereSpainAsiya Javayant QUALIFIED
Darci PoquetteCanadaBernardo Dominic UNQUALIFIED
Izzy GarufiBrazilAnna Fali NEGOTIATION
Maria MarrierCanadaAmy Elsner QUALIFIED
Jennifer AmigonItalyBernardo Dominic UNQUALIFIED
Mujtaba NickaUnited KingdomOnyama Limba NEGOTIATION
Silvio SlusarskiGermanyIvan Magalhaes RENEWAL
Faith GillianJapanIvan Magalhaes NEW
Alejandro PerinFranceIvan Magalhaes NEGOTIATION
David DarakjyItalyBernardo Dominic QUALIFIED
Jones VocelkaItalyOnyama Limba RENEWAL
Horizontal
NameCountryRepresentativeStatus
James ButtRussiaBernardo Dominic NEW
Jennifer AmigonCanadaIoni Bowcher NEGOTIATION
Jones VocelkaJapanStephen Shaw QUALIFIED
Morrow RutaUnited KingdomStephen Shaw NEW
Claire TollnerGermanyAsiya Javayant PROPOSAL
Tony FollerBrazilBernardo Dominic NEW
Sinclair WaycottJapanXuxue Feng QUALIFIED
Aditya KuskoJapanIvan Magalhaes UNQUALIFIED
Claire TollnerArgentinaIvan Magalhaes RENEWAL
Munro FerenczGermanyAnna Fali PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Smith GlickSpain2026-05-02Chemel, James L Cpa PROPOSAL44Asiya Javayant
1001Ricardo GauchoIndia2026-05-03Morlong Associates PROPOSAL35Anna Fali
1002Faith GillianBrazil2026-04-15Benton, John B Jr UNQUALIFIED90Amy Elsner
1003Munro FerenczSpain2026-05-02King, Christopher A Esq NEGOTIATION75Stephen Shaw
1004David DarakjyAustralia2026-04-25Buckley Miller Wright PROPOSAL0Anna Fali
1005Murillo MaletArgentina2026-05-03Buckley Miller Wright UNQUALIFIED49Stephen Shaw
1006Isabel BowleyUnited Kingdom2026-04-23Chemel, James L Cpa RENEWAL44Onyama Limba
1007Julie StensethAustralia2026-05-08Printing Dimensions RENEWAL82Stephen Shaw
1008Chavez BriddickUnited Kingdom2026-04-24Feiner Bros NEGOTIATION24Ioni Bowcher
1009Jeanfrancois VenereGermany2026-05-03Feiner Bros UNQUALIFIED36Bernardo Dominic
1010Aditya KuskoJapan2026-04-25Rousseaux, Michael Esq NEGOTIATION22Onyama Limba
1011Cody SaylorsFrance2026-04-15Buckley Miller Wright QUALIFIED3Amy Elsner
1012Misaki RoysterSpain2026-05-03Buckley Miller Wright NEW71Onyama Limba
1013Misaki RoysterRussia2026-05-09Printing Dimensions PROPOSAL81Xuxue Feng
1014Izzy GarufiUnited Kingdom2026-05-05Feltz Printing Service PROPOSAL94Asiya Javayant
1015Jones VocelkaBrazil2026-04-29Chapman, Ross E Esq NEW86Onyama Limba
1016Aika InouyeRussia2026-05-04Buckley Miller Wright RENEWAL53Ivan Magalhaes
1017Leja CaldareraUnited Kingdom2026-05-08Buckley Miller Wright QUALIFIED78Xuxue Feng
1018Chavez BriddickCanada2026-05-04Truhlar And Truhlar Attys NEGOTIATION3Asiya Javayant
1019Rodrigues CampainCanada2026-04-28Printing Dimensions UNQUALIFIED51Amy Elsner
1020Mayumi KolmetzCanada2026-04-19Rangoni Of Florence PROPOSAL84Onyama Limba
1021Jeanfrancois VenereGermany2026-05-05Feltz Printing Service NEW95Asiya Javayant
1022Munro FerenczFrance2026-04-16Morlong Associates RENEWAL80Ioni Bowcher
1023Tony FollerItaly2026-04-19Buckley Miller Wright NEGOTIATION49Asiya Javayant
1024Murillo MaletArgentina2026-04-11Commercial Press NEW32Amy Elsner
1025Cody SaylorsIndia2026-04-27Buckley Miller Wright NEGOTIATION37Xuxue Feng
1026Arvin AlbaresJapan2026-04-27Buckley Miller Wright NEW30Stephen Shaw
1027Jones VocelkaUnited Kingdom2026-05-03Buckley Miller Wright QUALIFIED21Ivan Magalhaes
1028Wickens NestleItaly2026-05-03Chapman, Ross E Esq QUALIFIED16Bernardo Dominic
1029Morrow RutaItaly2026-04-30Chanay, Jeffrey A Esq RENEWAL50Xuxue Feng
1030Claire TollnerItaly2026-04-22Benton, John B Jr NEGOTIATION92Ivan Magalhaes
1031Stacey MacleadBrazil2026-04-25Buckley Miller Wright UNQUALIFIED44Anna Fali
1032Leon OldroydIndia2026-04-27Feiner Bros QUALIFIED43Bernardo Dominic
1033Leja CaldareraRussia2026-05-09Chanay, Jeffrey A Esq UNQUALIFIED88Amy Elsner
1034Darci PoquetteFrance2026-04-17Truhlar And Truhlar Attys NEW50Xuxue Feng
1035Aika InouyeCanada2026-05-01Buckley Miller Wright QUALIFIED85Stephen Shaw
1036David DarakjySpain2026-05-07Truhlar And Truhlar Attys NEW88Elwin Sharvill
1037Izzy GarufiRussia2026-04-14Truhlar And Truhlar Attys QUALIFIED22Stephen Shaw
1038Smith GlickSpain2026-04-13Chanay, Jeffrey A Esq QUALIFIED49Ivan Magalhaes
1039Stacey MacleadUnited Kingdom2026-04-25Chemel, James L Cpa QUALIFIED35Bernardo Dominic
1040Jennifer AmigonAustralia2026-04-24Feiner Bros PROPOSAL35Ioni Bowcher
1041Salvatore StockhamCanada2026-04-12Chemel, James L Cpa UNQUALIFIED42Asiya Javayant
1042Izzy GarufiGermany2026-04-28Feltz Printing Service UNQUALIFIED37Bernardo Dominic
1043Jeanfrancois VenereIndia2026-05-08Feiner Bros PROPOSAL34Ioni Bowcher
1044Johnson SergiIndia2026-04-20Feiner Bros NEGOTIATION72Elwin Sharvill
1045Maisha RulapaughUnited Kingdom2026-04-14Benton, John B Jr NEGOTIATION99Elwin Sharvill
1046Costa DilliardGermany2026-05-09Buckley Miller Wright PROPOSAL76Xuxue Feng
1047Francesco ShinkoSpain2026-04-13Feltz Printing Service QUALIFIED0Stephen Shaw
1048Claire TollnerAustralia2026-05-04King, Christopher A Esq PROPOSAL86Anna Fali
1049David DarakjyFrance2026-05-01Feltz Printing Service NEGOTIATION84Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Ashley DoeItalyBernardo Dominic PROPOSAL
Octavia MaletUnited KingdomStephen Shaw RENEWAL
Stacey MacleadArgentinaIvan Magalhaes RENEWAL
Francesco ShinkoArgentinaXuxue Feng NEGOTIATION
Emily WhobreyJapanStephen Shaw RENEWAL
Isabel BowleyUnited KingdomAmy Elsner NEGOTIATION
Emily WhobreyItalyAnna Fali NEW
Alejandro PerinArgentinaStephen Shaw PROPOSAL
Jeanfrancois VenereSpainXuxue Feng NEGOTIATION
Morrow RutaRussiaElwin Sharvill QUALIFIED
Darci PoquetteFranceElwin Sharvill NEW
Wickens NestleJapanElwin Sharvill PROPOSAL
Greenwood BologniaCanadaBernardo Dominic NEGOTIATION
Aika InouyeFranceBernardo Dominic PROPOSAL
Silvio SlusarskiUnited KingdomStephen Shaw RENEWAL
Greenwood BologniaJapanIvan Magalhaes UNQUALIFIED
Adams MorascaGermanyOnyama Limba NEGOTIATION
Maria MarrierItalyAnna Fali NEGOTIATION
David DarakjyFranceAnna Fali RENEWAL
Jeanfrancois VenereUnited KingdomIvan Magalhaes RENEWAL
Kadeem FlosiSpainIvan Magalhaes PROPOSAL
Ashley DoeJapanIvan Magalhaes PROPOSAL
Jefferson SchemmerCanadaAmy Elsner PROPOSAL
Darci PoquetteJapanAnna Fali NEGOTIATION
Leja CaldareraIndiaAmy Elsner RENEWAL
Munro FerenczSpainXuxue Feng RENEWAL
Wickens NestleJapanOnyama Limba NEGOTIATION
Smith GlickAustraliaStephen Shaw NEGOTIATION
Kaitlin OstroskyUnited KingdomElwin Sharvill NEGOTIATION
Kaitlin OstroskySpainIoni Bowcher NEW
Munro FerenczIndiaIoni Bowcher PROPOSAL
Maria MarrierAustraliaAmy Elsner UNQUALIFIED
Clifford RimBrazilIoni Bowcher UNQUALIFIED
Antonio CaudyArgentinaOnyama Limba PROPOSAL
Salvatore StockhamFranceAmy Elsner NEW
Izzy GarufiIndiaOnyama Limba RENEWAL
Claire TollnerAustraliaAnna Fali UNQUALIFIED
Claire TollnerGermanyAsiya Javayant NEW
Jeanfrancois VenereCanadaBernardo Dominic RENEWAL
James ButtArgentinaOnyama Limba UNQUALIFIED
Clifford RimAustraliaAsiya Javayant UNQUALIFIED
Francesco ShinkoItalyIvan Magalhaes NEGOTIATION
Aditya KuskoSpainStephen Shaw NEGOTIATION
Deepesh ChuiArgentinaAsiya Javayant QUALIFIED
Tony FollerGermanyElwin Sharvill QUALIFIED
Rodrigues CampainItalyAmy Elsner PROPOSAL
Antonio CaudyAustraliaXuxue Feng UNQUALIFIED
Maisha RulapaughCanadaBernardo Dominic NEGOTIATION
Rodrigues CampainAustraliaAnna Fali NEW
Claire TollnerIndiaAmy Elsner UNQUALIFIED
Frozen Columns
Name
Wickens Nestle
Greenwood Bolognia
Alejandro Perin
Sinclair Waycott
Emily Whobrey
Murillo Malet
Aditya Kusko
Jeanfrancois Venere
Izzy Garufi
Alejandro Perin
James Butt
Emily Whobrey
Ashley Doe
Greenwood Bolognia
Munro Ferencz
Arvin Albares
Aditya Kusko
Deepesh Chui
Murillo Malet
Jeanfrancois Venere
Octavia Malet
Francesco Shinko
Claire Tollner
Jeanfrancois Venere
Francesco Shinko
Smith Glick
James Butt
Munro Ferencz
Smith Glick
Francesco Shinko
Emily Whobrey
Rodrigues Campain
Greenwood Bolognia
Cody Saylors
Alejandro Perin
Silvio Slusarski
Chavez Briddick
Mayumi Kolmetz
Arvin Albares
Antonio Caudy
Octavia Malet
Greenwood Bolognia
James Butt
Smith Glick
Maisha Rulapaugh
Francesco Shinko
Emily Whobrey
Jefferson Schemmer
Kadeem Flosi
Johnson Sergi
IdCountryDate
1000Australia2026-04-29
1001Germany2026-05-03
1002Australia2026-05-04
1003France2026-04-15
1004Spain2026-04-30
1005Argentina2026-04-17
1006France2026-04-27
1007Russia2026-04-15
1008Australia2026-05-10
1009Japan2026-05-06
1010United Kingdom2026-05-10
1011Canada2026-04-18
1012Brazil2026-05-07
1013Russia2026-04-27
1014Spain2026-04-14
1015Spain2026-05-05
1016United Kingdom2026-05-10
1017Australia2026-04-30
1018Spain2026-05-01
1019Japan2026-05-07
1020Italy2026-05-03
1021Spain2026-05-03
1022Italy2026-04-17
1023United Kingdom2026-05-07
1024Canada2026-05-05
1025Italy2026-05-07
1026Australia2026-04-26
1027Germany2026-05-03
1028Russia2026-05-01
1029Australia2026-04-27
1030Russia2026-05-01
1031Japan2026-04-19
1032Brazil2026-04-20
1033India2026-04-16
1034Australia2026-05-07
1035United Kingdom2026-04-28
1036Australia2026-04-23
1037Australia2026-04-19
1038United Kingdom2026-05-05
1039Japan2026-04-17
1040France2026-04-25
1041Italy2026-04-14
1042Italy2026-04-26
1043Argentina2026-04-28
1044Canada2026-05-03
1045Argentina2026-04-22
1046United Kingdom2026-04-13
1047Canada2026-05-07
1048Brazil2026-05-04
1049Australia2026-05-02

On-Demand Data

NameIdCountryDate
Kaitlin Ostrosky1000Japan2026-04-19
Rodrigues Campain1001Argentina2026-04-27
Octavia Malet1002Spain2026-05-10
Mayumi Kolmetz1003Australia2026-04-13
Smith Glick1004Italy2026-05-03
Adams Morasca1005Brazil2026-04-28
James Butt1006United Kingdom2026-04-15
Emily Whobrey1007Australia2026-04-30
Wickens Nestle1008Spain2026-05-08
Francesco Shinko1009Argentina2026-05-10
Jefferson Schemmer1010Russia2026-04-11
Morrow Ruta1011Germany2026-04-27
Kadeem Flosi1012Argentina2026-04-27
Stacey Maclead1013Canada2026-04-24
Mayumi Kolmetz1014Japan2026-04-12
Ricardo Gaucho1015Brazil2026-05-03
Ivar Paprocki1016India2026-05-01
Rodrigues Campain1017India2026-04-30
Jeanfrancois Venere1018Brazil2026-04-27
Arvin Albares1019India2026-05-04
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Murillo MaletIndiaElwin Sharvill NEGOTIATION
Misaki RoysterUnited KingdomXuxue Feng QUALIFIED
Claire TollnerUnited KingdomBernardo Dominic NEGOTIATION
Antonio CaudyArgentinaOnyama Limba UNQUALIFIED
Claire TollnerGermanyBernardo Dominic RENEWAL
Adams MorascaGermanyXuxue Feng RENEWAL
Leja CaldareraSpainBernardo Dominic NEGOTIATION
Emily WhobreyUnited KingdomXuxue Feng NEW
Munro FerenczCanadaIoni Bowcher QUALIFIED
Antonio CaudyJapanAsiya Javayant RENEWAL
Misaki RoysterCanadaXuxue Feng QUALIFIED
Munro FerenczAustraliaAmy Elsner QUALIFIED
Ricardo GauchoSpainStephen Shaw QUALIFIED
Kadeem FlosiJapanElwin Sharvill QUALIFIED
Salvatore StockhamArgentinaElwin Sharvill UNQUALIFIED
Deepesh ChuiFranceStephen Shaw RENEWAL
Smith GlickBrazilStephen Shaw QUALIFIED
Octavia MaletIndiaStephen Shaw RENEWAL
Ashley DoeUnited KingdomAmy Elsner UNQUALIFIED
Kadeem FlosiFranceOnyama Limba NEGOTIATION
Claire TollnerArgentinaXuxue Feng NEGOTIATION
Darci PoquetteArgentinaStephen Shaw NEW
Aruna FigeroaFranceOnyama Limba NEW
Wickens NestleAustraliaXuxue Feng NEW
Aruna FigeroaSpainAnna Fali NEW
Aditya KuskoArgentinaIvan Magalhaes QUALIFIED
Clifford RimFranceAmy Elsner NEGOTIATION
Chavez BriddickIndiaIvan Magalhaes RENEWAL
Julie StensethRussiaAsiya Javayant PROPOSAL
Nicolas IturbideArgentinaAmy Elsner RENEWAL
Julie StensethIndiaElwin Sharvill PROPOSAL
Ashley DoeAustraliaAmy Elsner PROPOSAL
Darci PoquetteCanadaStephen Shaw NEW
Antonio CaudyItalyXuxue Feng QUALIFIED
Arvin AlbaresArgentinaElwin Sharvill NEW
Greenwood BologniaRussiaBernardo Dominic NEGOTIATION
Sinclair WaycottGermanyAsiya Javayant RENEWAL
Darci PoquetteIndiaXuxue Feng UNQUALIFIED
Jennifer AmigonItalyXuxue Feng NEGOTIATION
Francesco ShinkoJapanAsiya Javayant UNQUALIFIED

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