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
Jennifer AmigonArgentinaAnna Fali PROPOSAL
Izzy GarufiItalyAnna Fali NEGOTIATION
Aruna FigeroaBrazilStephen Shaw PROPOSAL
Mayumi KolmetzArgentinaXuxue Feng NEW
Murillo MaletItalyAmy Elsner NEW
Isabel BowleyItalyElwin Sharvill NEGOTIATION
Aika InouyeRussiaBernardo Dominic UNQUALIFIED
Adams MorascaItalyOnyama Limba UNQUALIFIED
Munro FerenczRussiaXuxue Feng NEW
Salvatore StockhamJapanBernardo Dominic NEW
Darci PoquetteAustraliaBernardo Dominic PROPOSAL
Isabel BowleyRussiaElwin Sharvill NEW
Emily WhobreyCanadaAmy Elsner UNQUALIFIED
Jefferson SchemmerFranceIvan Magalhaes UNQUALIFIED
Chavez BriddickArgentinaElwin Sharvill NEGOTIATION
Misaki RoysterAustraliaOnyama Limba NEGOTIATION
Darci PoquetteCanadaElwin Sharvill RENEWAL
Claire TollnerIndiaIoni Bowcher NEW
Leja CaldareraAustraliaAnna Fali NEGOTIATION
Maria MarrierRussiaAsiya Javayant UNQUALIFIED
Aditya KuskoSpainIvan Magalhaes PROPOSAL
Nicolas IturbideCanadaAmy Elsner PROPOSAL
Mujtaba NickaBrazilAnna Fali RENEWAL
Juan WieserArgentinaBernardo Dominic PROPOSAL
Darci PoquetteSpainStephen Shaw NEW
Stacey MacleadItalyIvan Magalhaes NEW
Juan WieserAustraliaIvan Magalhaes NEGOTIATION
Munro FerenczRussiaIvan Magalhaes NEW
David DarakjyIndiaAmy Elsner QUALIFIED
Salvatore StockhamAustraliaIoni Bowcher RENEWAL
James ButtAustraliaXuxue Feng NEW
David DarakjyFranceIoni Bowcher PROPOSAL
Aika InouyeUnited KingdomBernardo Dominic QUALIFIED
Stacey MacleadSpainAmy Elsner RENEWAL
Morrow RutaBrazilOnyama Limba NEW
Tony FollerBrazilBernardo Dominic NEW
Juan WieserIndiaOnyama Limba NEW
Claire TollnerIndiaAmy Elsner UNQUALIFIED
Ricardo GauchoCanadaOnyama Limba NEGOTIATION
Nicolas IturbideUnited KingdomStephen Shaw NEW
Sinclair WaycottUnited KingdomAsiya Javayant NEW
Francesco ShinkoItalyElwin Sharvill RENEWAL
Salvatore StockhamUnited KingdomAnna Fali UNQUALIFIED
Morrow RutaItalyIvan Magalhaes PROPOSAL
Juan WieserItalyIoni Bowcher NEW
Faith GillianRussiaXuxue Feng UNQUALIFIED
Juan WieserUnited KingdomXuxue Feng NEGOTIATION
Murillo MaletRussiaAnna Fali NEW
James ButtCanadaAmy Elsner RENEWAL
Silvio SlusarskiArgentinaIvan Magalhaes NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Tony FollerCanadaXuxue Feng NEGOTIATION
Misaki RoysterIndiaAnna Fali QUALIFIED
Clifford RimIndiaOnyama Limba NEW
Greenwood BologniaIndiaIoni Bowcher RENEWAL
Chavez BriddickBrazilXuxue Feng NEGOTIATION
Cody SaylorsJapanIoni Bowcher RENEWAL
Francesco ShinkoItalyStephen Shaw QUALIFIED
Wickens NestleRussiaIvan Magalhaes QUALIFIED
Jeanfrancois VenereRussiaStephen Shaw UNQUALIFIED
Faith GillianUnited KingdomBernardo Dominic UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Mujtaba NickaFrance2026-05-16Morlong Associates UNQUALIFIED96Elwin Sharvill
1001Francesco ShinkoFrance2026-06-01Chanay, Jeffrey A Esq NEGOTIATION85Elwin Sharvill
1002Costa DilliardItaly2026-05-13Printing Dimensions QUALIFIED84Elwin Sharvill
1003Leon OldroydRussia2026-05-12King, Christopher A Esq PROPOSAL90Amy Elsner
1004Mujtaba NickaFrance2026-05-13Chanay, Jeffrey A Esq NEW19Onyama Limba
1005Costa DilliardSpain2026-05-16Chanay, Jeffrey A Esq QUALIFIED84Stephen Shaw
1006Francesco ShinkoFrance2026-05-09Buckley Miller Wright QUALIFIED6Bernardo Dominic
1007Kaitlin OstroskyGermany2026-06-05Dorl, James J Esq QUALIFIED90Anna Fali
1008Leja CaldareraJapan2026-06-01Dorl, James J Esq QUALIFIED94Amy Elsner
1009Jennifer AmigonFrance2026-05-15King, Christopher A Esq NEW92Asiya Javayant
1010Arvin AlbaresCanada2026-05-25Feltz Printing Service PROPOSAL96Ivan Magalhaes
1011Mujtaba NickaUnited Kingdom2026-05-09Buckley Miller Wright UNQUALIFIED66Ivan Magalhaes
1012Rodrigues CampainUnited Kingdom2026-05-15Feltz Printing Service QUALIFIED99Ioni Bowcher
1013Maisha RulapaughBrazil2026-05-28Printing Dimensions PROPOSAL89Asiya Javayant
1014Arvin AlbaresAustralia2026-05-26Benton, John B Jr UNQUALIFIED0Elwin Sharvill
1015Misaki RoysterItaly2026-05-09Rangoni Of Florence QUALIFIED64Ioni Bowcher
1016Mayumi KolmetzIndia2026-05-21Rousseaux, Michael Esq PROPOSAL36Ivan Magalhaes
1017Darci PoquetteSpain2026-05-11Rangoni Of Florence NEGOTIATION44Ioni Bowcher
1018Maria MarrierUnited Kingdom2026-05-21Morlong Associates RENEWAL85Asiya Javayant
1019Morrow RutaFrance2026-06-05Buckley Miller Wright NEGOTIATION1Amy Elsner
1020Faith GillianJapan2026-05-25Commercial Press NEW49Asiya Javayant
1021Murillo MaletRussia2026-05-31Chemel, James L Cpa RENEWAL14Anna Fali
1022Jeanfrancois VenereFrance2026-05-31Buckley Miller Wright QUALIFIED60Ioni Bowcher
1023Rodrigues CampainFrance2026-06-03Dorl, James J Esq QUALIFIED20Onyama Limba
1024Nicolas IturbideArgentina2026-05-15Chapman, Ross E Esq PROPOSAL95Onyama Limba
1025Wickens NestleJapan2026-05-18Chemel, James L Cpa NEGOTIATION66Ivan Magalhaes
1026Rodrigues CampainFrance2026-05-24Rangoni Of Florence RENEWAL25Xuxue Feng
1027Adams MorascaSpain2026-05-09Dorl, James J Esq QUALIFIED53Asiya Javayant
1028Tony FollerUnited Kingdom2026-06-01Rousseaux, Michael Esq QUALIFIED2Asiya Javayant
1029Arvin AlbaresBrazil2026-05-10King, Christopher A Esq NEW58Amy Elsner
1030Deepesh ChuiRussia2026-06-01Buckley Miller Wright RENEWAL62Amy Elsner
1031Darci PoquetteFrance2026-05-11Chapman, Ross E Esq NEW58Anna Fali
1032Emily WhobreyGermany2026-05-30Chanay, Jeffrey A Esq RENEWAL72Anna Fali
1033Mujtaba NickaAustralia2026-05-13Chapman, Ross E Esq NEGOTIATION69Bernardo Dominic
1034Antonio CaudyUnited Kingdom2026-05-13Chemel, James L Cpa NEGOTIATION49Anna Fali
1035Jefferson SchemmerUnited Kingdom2026-05-12King, Christopher A Esq NEGOTIATION94Elwin Sharvill
1036Nicolas IturbideUnited Kingdom2026-05-11Printing Dimensions UNQUALIFIED84Elwin Sharvill
1037Costa DilliardArgentina2026-05-12Chapman, Ross E Esq QUALIFIED94Stephen Shaw
1038Jefferson SchemmerIndia2026-05-30Rangoni Of Florence UNQUALIFIED63Asiya Javayant
1039Darci PoquetteJapan2026-05-22Chanay, Jeffrey A Esq NEW92Onyama Limba
1040Murillo MaletJapan2026-06-07Printing Dimensions UNQUALIFIED87Ioni Bowcher
1041Julie StensethArgentina2026-06-07Chemel, James L Cpa RENEWAL80Anna Fali
1042Munro FerenczAustralia2026-05-17Benton, John B Jr RENEWAL49Ioni Bowcher
1043Alejandro PerinCanada2026-05-29King, Christopher A Esq QUALIFIED61Anna Fali
1044Kaitlin OstroskyCanada2026-05-30Buckley Miller Wright QUALIFIED47Xuxue Feng
1045Murillo MaletBrazil2026-06-05Chemel, James L Cpa UNQUALIFIED45Xuxue Feng
1046Mayumi KolmetzGermany2026-06-02Chemel, James L Cpa NEW93Bernardo Dominic
1047David DarakjyCanada2026-05-26Benton, John B Jr UNQUALIFIED61Xuxue Feng
1048Faith GillianArgentina2026-05-10Benton, John B Jr NEW27Stephen Shaw
1049Darci PoquetteItaly2026-05-10Printing Dimensions UNQUALIFIED55Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Arvin AlbaresJapanAnna Fali PROPOSAL
Greenwood BologniaSpainAsiya Javayant NEW
Maria MarrierJapanElwin Sharvill NEW
Jennifer AmigonUnited KingdomIoni Bowcher QUALIFIED
Juan WieserBrazilAmy Elsner PROPOSAL
Francesco ShinkoCanadaOnyama Limba UNQUALIFIED
Clifford RimGermanyStephen Shaw RENEWAL
Misaki RoysterArgentinaAsiya Javayant NEGOTIATION
Mayumi KolmetzBrazilAsiya Javayant NEW
Mayumi KolmetzFranceIoni Bowcher PROPOSAL
Alejandro PerinBrazilStephen Shaw NEGOTIATION
Jennifer AmigonCanadaXuxue Feng RENEWAL
Cody SaylorsUnited KingdomAsiya Javayant QUALIFIED
Misaki RoysterFranceStephen Shaw PROPOSAL
Jennifer AmigonUnited KingdomOnyama Limba UNQUALIFIED
Adams MorascaAustraliaBernardo Dominic QUALIFIED
Johnson SergiIndiaAsiya Javayant NEGOTIATION
Octavia MaletGermanyOnyama Limba QUALIFIED
Antonio CaudyFranceIoni Bowcher PROPOSAL
Mujtaba NickaIndiaIoni Bowcher NEGOTIATION
Francesco ShinkoArgentinaElwin Sharvill UNQUALIFIED
Cody SaylorsIndiaStephen Shaw RENEWAL
Ivar PaprockiCanadaStephen Shaw NEW
Cody SaylorsIndiaOnyama Limba NEGOTIATION
Silvio SlusarskiAustraliaAnna Fali NEW
James ButtFranceElwin Sharvill NEW
Deepesh ChuiItalyIvan Magalhaes NEGOTIATION
Wickens NestleJapanElwin Sharvill NEW
Mayumi KolmetzGermanyIvan Magalhaes NEGOTIATION
Tony FollerGermanyXuxue Feng NEW
Kadeem FlosiJapanIvan Magalhaes PROPOSAL
Deepesh ChuiItalyIoni Bowcher NEW
Darci PoquetteCanadaAsiya Javayant NEGOTIATION
Ashley DoeRussiaAnna Fali RENEWAL
Jefferson SchemmerArgentinaIoni Bowcher QUALIFIED
David DarakjyJapanElwin Sharvill NEGOTIATION
Wickens NestleIndiaXuxue Feng NEGOTIATION
Stacey MacleadRussiaOnyama Limba UNQUALIFIED
Greenwood BologniaFranceOnyama Limba QUALIFIED
Faith GillianAustraliaAsiya Javayant NEGOTIATION
Ricardo GauchoAustraliaStephen Shaw NEW
Jefferson SchemmerIndiaIvan Magalhaes UNQUALIFIED
Isabel BowleyIndiaOnyama Limba RENEWAL
Faith GillianGermanyStephen Shaw QUALIFIED
Octavia MaletCanadaBernardo Dominic UNQUALIFIED
Tony FollerGermanyIvan Magalhaes RENEWAL
Munro FerenczFranceIoni Bowcher PROPOSAL
Misaki RoysterFranceAsiya Javayant UNQUALIFIED
Morrow RutaUnited KingdomAnna Fali QUALIFIED
Misaki RoysterCanadaElwin Sharvill NEW
Frozen Columns
Name
Jefferson Schemmer
Aditya Kusko
Jennifer Amigon
Sinclair Waycott
Munro Ferencz
Mayumi Kolmetz
Adams Morasca
Adams Morasca
Sinclair Waycott
Alejandro Perin
Greenwood Bolognia
Darci Poquette
Costa Dilliard
James Butt
Chavez Briddick
Maisha Rulapaugh
David Darakjy
Clifford Rim
Cody Saylors
Izzy Garufi
Kadeem Flosi
Claire Tollner
Aika Inouye
Salvatore Stockham
Faith Gillian
Jefferson Schemmer
Smith Glick
Kadeem Flosi
Maisha Rulapaugh
Silvio Slusarski
Izzy Garufi
Mayumi Kolmetz
Mujtaba Nicka
Emily Whobrey
Munro Ferencz
Morrow Ruta
Salvatore Stockham
Arvin Albares
Alejandro Perin
Claire Tollner
Adams Morasca
Deepesh Chui
Alejandro Perin
Sinclair Waycott
Clifford Rim
Aruna Figeroa
Adams Morasca
Juan Wieser
Cody Saylors
Aika Inouye
IdCountryDate
1000Spain2026-05-14
1001United Kingdom2026-05-25
1002Canada2026-05-25
1003France2026-06-07
1004Japan2026-06-01
1005Germany2026-05-29
1006Brazil2026-05-31
1007Australia2026-05-25
1008United Kingdom2026-05-11
1009Japan2026-06-03
1010Germany2026-05-12
1011Spain2026-06-02
1012Argentina2026-05-15
1013Russia2026-06-05
1014Russia2026-05-09
1015Germany2026-06-02
1016Australia2026-05-17
1017Australia2026-05-14
1018India2026-05-24
1019Brazil2026-05-16
1020United Kingdom2026-05-14
1021Italy2026-06-06
1022Brazil2026-05-12
1023Argentina2026-06-02
1024France2026-05-27
1025Argentina2026-05-27
1026Spain2026-05-31
1027India2026-05-18
1028Russia2026-05-15
1029Brazil2026-05-20
1030Italy2026-05-27
1031India2026-05-16
1032United Kingdom2026-05-19
1033Spain2026-06-01
1034Spain2026-05-13
1035Canada2026-06-04
1036Russia2026-05-16
1037Canada2026-05-29
1038Canada2026-06-01
1039Germany2026-05-09
1040Italy2026-05-09
1041Brazil2026-05-26
1042Italy2026-05-09
1043Japan2026-06-04
1044Canada2026-05-10
1045Japan2026-05-29
1046United Kingdom2026-05-11
1047United Kingdom2026-06-02
1048India2026-05-25
1049Russia2026-05-27

On-Demand Data

NameIdCountryDate
Mujtaba Nicka1000Brazil2026-05-13
David Darakjy1001Italy2026-05-14
Murillo Malet1002United Kingdom2026-05-25
Isabel Bowley1003Japan2026-05-31
Deepesh Chui1004Argentina2026-05-13
Claire Tollner1005India2026-05-12
Jefferson Schemmer1006Japan2026-05-20
Chavez Briddick1007Brazil2026-06-04
Ashley Doe1008Russia2026-05-18
Francesco Shinko1009India2026-05-12
Jennifer Amigon1010Germany2026-05-09
Kaitlin Ostrosky1011United Kingdom2026-06-07
Darci Poquette1012Brazil2026-06-06
Faith Gillian1013Brazil2026-05-12
Wickens Nestle1014Brazil2026-05-11
Misaki Royster1015United Kingdom2026-06-03
Cody Saylors1016India2026-05-27
Jennifer Amigon1017Argentina2026-05-11
Maria Marrier1018United Kingdom2026-05-23
Murillo Malet1019India2026-05-27
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jefferson SchemmerSpainBernardo Dominic PROPOSAL
Isabel BowleyCanadaXuxue Feng PROPOSAL
Izzy GarufiSpainIoni Bowcher UNQUALIFIED
Johnson SergiAustraliaAsiya Javayant UNQUALIFIED
Claire TollnerSpainXuxue Feng PROPOSAL
Smith GlickArgentinaIvan Magalhaes UNQUALIFIED
Izzy GarufiCanadaAmy Elsner PROPOSAL
Aditya KuskoCanadaIvan Magalhaes RENEWAL
Faith GillianJapanStephen Shaw NEW
Sinclair WaycottBrazilOnyama Limba NEGOTIATION
Jeanfrancois VenereIndiaAsiya Javayant RENEWAL
Jeanfrancois VenereCanadaElwin Sharvill NEGOTIATION
Antonio CaudyItalyAnna Fali PROPOSAL
Greenwood BologniaItalyIoni Bowcher NEW
James ButtSpainAnna Fali UNQUALIFIED
Tony FollerCanadaAmy Elsner UNQUALIFIED
Julie StensethAustraliaElwin Sharvill QUALIFIED
Adams MorascaUnited KingdomAnna Fali NEW
Nicolas IturbideBrazilOnyama Limba QUALIFIED
Leon OldroydFranceAmy Elsner RENEWAL
Ashley DoeFranceStephen Shaw PROPOSAL
Clifford RimAustraliaIoni Bowcher UNQUALIFIED
Alejandro PerinAustraliaXuxue Feng NEW
Ashley DoeAustraliaElwin Sharvill NEGOTIATION
Emily WhobreyAustraliaStephen Shaw PROPOSAL
Deepesh ChuiAustraliaIoni Bowcher NEW
Kaitlin OstroskyFranceAmy Elsner NEGOTIATION
Smith GlickAustraliaIoni Bowcher RENEWAL
Murillo MaletSpainIvan Magalhaes QUALIFIED
Aruna FigeroaItalyElwin Sharvill NEW
Jefferson SchemmerArgentinaAmy Elsner QUALIFIED
Maria MarrierFranceAmy Elsner QUALIFIED
Faith GillianJapanAsiya Javayant NEGOTIATION
Faith GillianIndiaOnyama Limba QUALIFIED
Costa DilliardGermanyStephen Shaw NEW
Jefferson SchemmerItalyOnyama Limba RENEWAL
Octavia MaletFranceXuxue Feng QUALIFIED
Antonio CaudyBrazilBernardo Dominic PROPOSAL
Julie StensethUnited KingdomAnna Fali PROPOSAL
Ashley DoeItalyXuxue Feng 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>