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
Francesco ShinkoJapanOnyama Limba QUALIFIED
Mujtaba NickaItalyAsiya Javayant QUALIFIED
Kadeem FlosiAustraliaIvan Magalhaes PROPOSAL
David DarakjyAustraliaIvan Magalhaes NEGOTIATION
Jennifer AmigonItalyIoni Bowcher QUALIFIED
Claire TollnerFranceAsiya Javayant UNQUALIFIED
Adams MorascaJapanAnna Fali RENEWAL
Aruna FigeroaFranceXuxue Feng PROPOSAL
Greenwood BologniaIndiaAnna Fali NEW
Stacey MacleadArgentinaAnna Fali PROPOSAL
Darci PoquetteJapanIvan Magalhaes NEGOTIATION
Mayumi KolmetzUnited KingdomElwin Sharvill QUALIFIED
Aika InouyeUnited KingdomIoni Bowcher UNQUALIFIED
Jeanfrancois VenereArgentinaXuxue Feng RENEWAL
Sinclair WaycottFranceXuxue Feng NEGOTIATION
Aika InouyeBrazilAnna Fali NEW
Wickens NestleJapanXuxue Feng RENEWAL
Leon OldroydGermanyIvan Magalhaes NEGOTIATION
Rodrigues CampainAustraliaAmy Elsner NEW
Tony FollerIndiaElwin Sharvill QUALIFIED
Salvatore StockhamGermanyIvan Magalhaes PROPOSAL
Costa DilliardFranceOnyama Limba QUALIFIED
Adams MorascaIndiaStephen Shaw UNQUALIFIED
Maria MarrierBrazilAnna Fali QUALIFIED
Sinclair WaycottIndiaIoni Bowcher UNQUALIFIED
David DarakjyUnited KingdomElwin Sharvill PROPOSAL
Smith GlickRussiaAnna Fali RENEWAL
Tony FollerArgentinaElwin Sharvill PROPOSAL
Silvio SlusarskiCanadaAsiya Javayant NEW
Jefferson SchemmerCanadaIoni Bowcher PROPOSAL
Kadeem FlosiItalyElwin Sharvill RENEWAL
Jones VocelkaRussiaIoni Bowcher PROPOSAL
Maisha RulapaughUnited KingdomAsiya Javayant RENEWAL
Mayumi KolmetzCanadaAmy Elsner NEW
Chavez BriddickArgentinaBernardo Dominic NEGOTIATION
Faith GillianGermanyStephen Shaw QUALIFIED
Mujtaba NickaItalyElwin Sharvill PROPOSAL
Clifford RimFranceBernardo Dominic NEGOTIATION
Emily WhobreyGermanyIoni Bowcher QUALIFIED
Costa DilliardCanadaAmy Elsner PROPOSAL
Maisha RulapaughItalyAnna Fali UNQUALIFIED
Jones VocelkaGermanyIvan Magalhaes RENEWAL
Arvin AlbaresItalyAsiya Javayant NEGOTIATION
James ButtItalyOnyama Limba QUALIFIED
Costa DilliardRussiaAmy Elsner UNQUALIFIED
Chavez BriddickJapanStephen Shaw NEW
Mujtaba NickaCanadaAnna Fali NEGOTIATION
Wickens NestleFranceBernardo Dominic PROPOSAL
Deepesh ChuiUnited KingdomAsiya Javayant PROPOSAL
Johnson SergiUnited KingdomStephen Shaw PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Alejandro PerinUnited KingdomBernardo Dominic QUALIFIED
Jones VocelkaIndiaAsiya Javayant RENEWAL
Aditya KuskoGermanyOnyama Limba PROPOSAL
Johnson SergiCanadaXuxue Feng UNQUALIFIED
Rodrigues CampainUnited KingdomOnyama Limba UNQUALIFIED
Jeanfrancois VenereFranceAnna Fali NEW
Salvatore StockhamSpainAnna Fali UNQUALIFIED
David DarakjyFranceXuxue Feng QUALIFIED
Ivar PaprockiJapanBernardo Dominic NEW
David DarakjyGermanyAmy Elsner UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Ivar PaprockiIndia2026-05-03Truhlar And Truhlar Attys PROPOSAL73Elwin Sharvill
1001Misaki RoysterRussia2026-04-22Chemel, James L Cpa NEGOTIATION85Xuxue Feng
1002Ivar PaprockiArgentina2026-05-05Rangoni Of Florence NEGOTIATION4Ivan Magalhaes
1003David DarakjyRussia2026-05-08Truhlar And Truhlar Attys UNQUALIFIED2Onyama Limba
1004Antonio CaudyIndia2026-05-02Commercial Press PROPOSAL8Ioni Bowcher
1005Aditya KuskoIndia2026-04-11Buckley Miller Wright NEW25Onyama Limba
1006Aditya KuskoAustralia2026-04-15Chapman, Ross E Esq NEW24Amy Elsner
1007Nicolas IturbideFrance2026-05-10Chemel, James L Cpa QUALIFIED92Onyama Limba
1008David DarakjyAustralia2026-04-29Feltz Printing Service NEW71Anna Fali
1009Mayumi KolmetzRussia2026-04-21Printing Dimensions NEW95Bernardo Dominic
1010Murillo MaletIndia2026-04-24Rousseaux, Michael Esq PROPOSAL74Xuxue Feng
1011Smith GlickSpain2026-04-14Chemel, James L Cpa RENEWAL13Amy Elsner
1012Rodrigues CampainRussia2026-05-07Dorl, James J Esq RENEWAL28Onyama Limba
1013Leja CaldareraFrance2026-05-07Commercial Press RENEWAL39Bernardo Dominic
1014Maria MarrierRussia2026-04-30Dorl, James J Esq UNQUALIFIED57Onyama Limba
1015Claire TollnerIndia2026-05-09Chanay, Jeffrey A Esq QUALIFIED80Amy Elsner
1016Jeanfrancois VenereGermany2026-04-19Commercial Press QUALIFIED86Stephen Shaw
1017Arvin AlbaresArgentina2026-04-23Truhlar And Truhlar Attys RENEWAL82Amy Elsner
1018Alejandro PerinIndia2026-05-06Benton, John B Jr RENEWAL54Bernardo Dominic
1019Maria MarrierIndia2026-05-08Printing Dimensions RENEWAL13Elwin Sharvill
1020Murillo MaletUnited Kingdom2026-05-03Chapman, Ross E Esq PROPOSAL92Xuxue Feng
1021Ivar PaprockiRussia2026-04-23Rousseaux, Michael Esq UNQUALIFIED69Asiya Javayant
1022Maisha RulapaughItaly2026-04-27Printing Dimensions NEGOTIATION91Ioni Bowcher
1023Munro FerenczIndia2026-05-08King, Christopher A Esq RENEWAL90Stephen Shaw
1024Rodrigues CampainCanada2026-04-19Chapman, Ross E Esq RENEWAL43Bernardo Dominic
1025Cody SaylorsSpain2026-05-09Feiner Bros UNQUALIFIED66Xuxue Feng
1026Maria MarrierAustralia2026-04-19Rangoni Of Florence UNQUALIFIED68Asiya Javayant
1027Ivar PaprockiAustralia2026-04-23Dorl, James J Esq UNQUALIFIED81Onyama Limba
1028Tony FollerIndia2026-04-27Benton, John B Jr RENEWAL16Xuxue Feng
1029Mayumi KolmetzUnited Kingdom2026-04-15Chanay, Jeffrey A Esq NEGOTIATION25Amy Elsner
1030Alejandro PerinIndia2026-05-07Feltz Printing Service RENEWAL9Anna Fali
1031Darci PoquetteAustralia2026-05-07Dorl, James J Esq RENEWAL80Stephen Shaw
1032David DarakjySpain2026-04-30Printing Dimensions UNQUALIFIED74Asiya Javayant
1033Morrow RutaSpain2026-04-13King, Christopher A Esq NEGOTIATION31Stephen Shaw
1034Darci PoquetteItaly2026-05-09King, Christopher A Esq RENEWAL80Ivan Magalhaes
1035Jeanfrancois VenereArgentina2026-04-17Dorl, James J Esq RENEWAL27Onyama Limba
1036Alejandro PerinBrazil2026-04-16Feltz Printing Service RENEWAL35Ioni Bowcher
1037Deepesh ChuiJapan2026-05-03Feltz Printing Service NEGOTIATION98Ioni Bowcher
1038Silvio SlusarskiIndia2026-04-25Rousseaux, Michael Esq NEGOTIATION92Anna Fali
1039Costa DilliardSpain2026-04-19Rangoni Of Florence RENEWAL1Anna Fali
1040Mayumi KolmetzFrance2026-05-07Buckley Miller Wright RENEWAL11Elwin Sharvill
1041Alejandro PerinBrazil2026-04-14Printing Dimensions QUALIFIED51Onyama Limba
1042Faith GillianBrazil2026-04-18Rousseaux, Michael Esq UNQUALIFIED70Amy Elsner
1043Nicolas IturbideCanada2026-04-21Truhlar And Truhlar Attys RENEWAL9Ivan Magalhaes
1044Arvin AlbaresCanada2026-05-06Chemel, James L Cpa NEGOTIATION87Ivan Magalhaes
1045Clifford RimCanada2026-04-12Feiner Bros NEW51Ioni Bowcher
1046Claire TollnerCanada2026-05-03Morlong Associates NEW60Xuxue Feng
1047Octavia MaletUnited Kingdom2026-04-23King, Christopher A Esq UNQUALIFIED37Elwin Sharvill
1048Faith GillianRussia2026-04-25Printing Dimensions QUALIFIED33Stephen Shaw
1049Antonio CaudyUnited Kingdom2026-04-17King, Christopher A Esq PROPOSAL26Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Munro FerenczArgentinaStephen Shaw RENEWAL
Emily WhobreyBrazilBernardo Dominic QUALIFIED
Johnson SergiAustraliaIoni Bowcher UNQUALIFIED
Ivar PaprockiBrazilXuxue Feng QUALIFIED
Jones VocelkaGermanyXuxue Feng NEGOTIATION
Maria MarrierFranceAnna Fali QUALIFIED
Ashley DoeGermanyOnyama Limba QUALIFIED
Ivar PaprockiGermanyIvan Magalhaes PROPOSAL
Kadeem FlosiJapanOnyama Limba PROPOSAL
Stacey MacleadJapanElwin Sharvill QUALIFIED
Misaki RoysterItalyAmy Elsner NEW
Rodrigues CampainUnited KingdomBernardo Dominic PROPOSAL
James ButtIndiaAnna Fali NEGOTIATION
Rodrigues CampainGermanyOnyama Limba QUALIFIED
Deepesh ChuiIndiaIvan Magalhaes QUALIFIED
Emily WhobreyBrazilBernardo Dominic PROPOSAL
Aruna FigeroaAustraliaAsiya Javayant NEW
Faith GillianBrazilOnyama Limba QUALIFIED
Antonio CaudyJapanXuxue Feng NEGOTIATION
Octavia MaletJapanStephen Shaw NEGOTIATION
Chavez BriddickArgentinaXuxue Feng NEW
Morrow RutaArgentinaBernardo Dominic NEW
Maria MarrierUnited KingdomBernardo Dominic RENEWAL
Leja CaldareraJapanXuxue Feng PROPOSAL
Clifford RimIndiaAnna Fali QUALIFIED
Darci PoquetteJapanAnna Fali QUALIFIED
Francesco ShinkoFranceOnyama Limba PROPOSAL
Cody SaylorsCanadaBernardo Dominic NEW
Greenwood BologniaCanadaAsiya Javayant UNQUALIFIED
Faith GillianFranceAnna Fali PROPOSAL
Morrow RutaItalyXuxue Feng RENEWAL
Julie StensethItalyAnna Fali PROPOSAL
Octavia MaletRussiaOnyama Limba QUALIFIED
Murillo MaletAustraliaXuxue Feng UNQUALIFIED
Tony FollerFranceXuxue Feng UNQUALIFIED
Misaki RoysterUnited KingdomAmy Elsner NEGOTIATION
Faith GillianItalyBernardo Dominic NEGOTIATION
David DarakjyRussiaAsiya Javayant PROPOSAL
Smith GlickFranceStephen Shaw NEGOTIATION
Aditya KuskoJapanXuxue Feng PROPOSAL
Deepesh ChuiItalyAmy Elsner PROPOSAL
Julie StensethFranceStephen Shaw NEGOTIATION
Misaki RoysterRussiaElwin Sharvill QUALIFIED
Munro FerenczSpainIoni Bowcher UNQUALIFIED
Julie StensethGermanyIoni Bowcher PROPOSAL
Alejandro PerinRussiaOnyama Limba QUALIFIED
Adams MorascaJapanStephen Shaw RENEWAL
Cody SaylorsJapanIvan Magalhaes RENEWAL
David DarakjySpainElwin Sharvill PROPOSAL
Morrow RutaItalyAsiya Javayant NEGOTIATION
Frozen Columns
Name
Munro Ferencz
Tony Foller
Munro Ferencz
Aruna Figeroa
Faith Gillian
Chavez Briddick
Jeanfrancois Venere
Deepesh Chui
Adams Morasca
Darci Poquette
Aditya Kusko
Arvin Albares
Ricardo Gaucho
Stacey Maclead
Mujtaba Nicka
Juan Wieser
Aika Inouye
Jefferson Schemmer
Stacey Maclead
Octavia Malet
Mujtaba Nicka
Jennifer Amigon
Arvin Albares
Murillo Malet
Jeanfrancois Venere
Juan Wieser
Sinclair Waycott
Greenwood Bolognia
Ricardo Gaucho
James Butt
Kadeem Flosi
Costa Dilliard
Emily Whobrey
Jones Vocelka
Kadeem Flosi
Leon Oldroyd
Misaki Royster
Aditya Kusko
Isabel Bowley
Alejandro Perin
Wickens Nestle
Ashley Doe
Murillo Malet
Ricardo Gaucho
Mujtaba Nicka
Rodrigues Campain
Ivar Paprocki
Wickens Nestle
Misaki Royster
Ashley Doe
IdCountryDate
1000Australia2026-05-10
1001Australia2026-04-24
1002Canada2026-04-14
1003Canada2026-05-02
1004Australia2026-05-01
1005Spain2026-05-10
1006Canada2026-05-07
1007Japan2026-04-23
1008Spain2026-04-19
1009Spain2026-04-19
1010Brazil2026-05-09
1011France2026-05-02
1012Italy2026-04-13
1013Argentina2026-04-20
1014India2026-04-13
1015Germany2026-04-20
1016Japan2026-05-09
1017Italy2026-05-04
1018Australia2026-04-24
1019Italy2026-04-30
1020Spain2026-04-12
1021Brazil2026-05-06
1022France2026-04-12
1023France2026-04-21
1024Russia2026-04-11
1025Australia2026-05-01
1026Russia2026-05-07
1027Russia2026-05-04
1028United Kingdom2026-04-29
1029Spain2026-04-11
1030United Kingdom2026-04-12
1031Germany2026-04-21
1032Australia2026-04-12
1033India2026-04-23
1034United Kingdom2026-04-15
1035Argentina2026-04-23
1036Brazil2026-04-18
1037India2026-04-27
1038Spain2026-05-04
1039Spain2026-04-28
1040Italy2026-05-02
1041Germany2026-04-17
1042Italy2026-05-09
1043France2026-04-28
1044Russia2026-04-22
1045Japan2026-04-29
1046Australia2026-04-22
1047France2026-04-22
1048Brazil2026-05-09
1049France2026-04-23

On-Demand Data

NameIdCountryDate
Johnson Sergi1000France2026-05-04
Chavez Briddick1001United Kingdom2026-04-17
Sinclair Waycott1002Spain2026-04-13
Aika Inouye1003Japan2026-04-13
Francesco Shinko1004Canada2026-04-21
Morrow Ruta1005Japan2026-05-05
Munro Ferencz1006Italy2026-04-19
James Butt1007Spain2026-04-27
Jones Vocelka1008India2026-05-08
Arvin Albares1009France2026-04-18
Jefferson Schemmer1010India2026-04-22
Arvin Albares1011Germany2026-04-12
Isabel Bowley1012Canada2026-04-26
Cody Saylors1013United Kingdom2026-04-26
Cody Saylors1014Italy2026-04-20
Cody Saylors1015India2026-04-19
Jefferson Schemmer1016Japan2026-04-13
Emily Whobrey1017Australia2026-04-15
Munro Ferencz1018Argentina2026-04-16
Emily Whobrey1019Germany2026-04-22
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Octavia MaletSpainAnna Fali NEW
Ivar PaprockiSpainBernardo Dominic UNQUALIFIED
Ricardo GauchoArgentinaOnyama Limba RENEWAL
Jennifer AmigonArgentinaAnna Fali QUALIFIED
Ricardo GauchoFranceAnna Fali UNQUALIFIED
Kadeem FlosiAustraliaElwin Sharvill NEW
Aditya KuskoGermanyStephen Shaw NEW
Aruna FigeroaBrazilElwin Sharvill NEGOTIATION
Murillo MaletRussiaElwin Sharvill UNQUALIFIED
Jeanfrancois VenereArgentinaIvan Magalhaes RENEWAL
Chavez BriddickJapanAmy Elsner UNQUALIFIED
Clifford RimItalyBernardo Dominic PROPOSAL
Ivar PaprockiGermanyIoni Bowcher QUALIFIED
Maisha RulapaughItalyIvan Magalhaes PROPOSAL
Maisha RulapaughBrazilElwin Sharvill UNQUALIFIED
Darci PoquetteAustraliaIvan Magalhaes NEGOTIATION
Ivar PaprockiRussiaElwin Sharvill UNQUALIFIED
Misaki RoysterIndiaIvan Magalhaes NEGOTIATION
Rodrigues CampainAustraliaBernardo Dominic NEW
Greenwood BologniaBrazilAsiya Javayant QUALIFIED
Misaki RoysterRussiaIvan Magalhaes UNQUALIFIED
Isabel BowleyItalyStephen Shaw UNQUALIFIED
Silvio SlusarskiArgentinaStephen Shaw NEGOTIATION
Jennifer AmigonSpainAsiya Javayant NEW
Adams MorascaItalyOnyama Limba UNQUALIFIED
Jeanfrancois VenereFranceAmy Elsner QUALIFIED
Tony FollerUnited KingdomAsiya Javayant RENEWAL
Mujtaba NickaCanadaAmy Elsner QUALIFIED
Faith GillianItalyOnyama Limba QUALIFIED
Izzy GarufiArgentinaStephen Shaw NEW
Rodrigues CampainFranceAmy Elsner UNQUALIFIED
Rodrigues CampainRussiaXuxue Feng PROPOSAL
Munro FerenczBrazilBernardo Dominic QUALIFIED
Julie StensethGermanyAsiya Javayant UNQUALIFIED
Misaki RoysterUnited KingdomStephen Shaw NEW
Ivar PaprockiArgentinaElwin Sharvill PROPOSAL
Juan WieserArgentinaStephen Shaw NEGOTIATION
Costa DilliardJapanXuxue Feng PROPOSAL
Aika InouyeRussiaAmy Elsner RENEWAL
Kaitlin OstroskyArgentinaElwin Sharvill RENEWAL

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