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
Rodrigues CampainRussiaIvan Magalhaes RENEWAL
Jefferson SchemmerBrazilBernardo Dominic RENEWAL
Ricardo GauchoAustraliaXuxue Feng NEGOTIATION
Rodrigues CampainAustraliaXuxue Feng PROPOSAL
Johnson SergiJapanOnyama Limba NEGOTIATION
Ricardo GauchoSpainIvan Magalhaes UNQUALIFIED
Juan WieserIndiaIoni Bowcher UNQUALIFIED
Jones VocelkaGermanyXuxue Feng NEGOTIATION
Francesco ShinkoBrazilBernardo Dominic NEW
Stacey MacleadCanadaOnyama Limba PROPOSAL
Emily WhobreyFranceOnyama Limba PROPOSAL
Jennifer AmigonCanadaElwin Sharvill QUALIFIED
Maria MarrierCanadaOnyama Limba QUALIFIED
Salvatore StockhamAustraliaXuxue Feng NEGOTIATION
Maisha RulapaughRussiaElwin Sharvill NEW
Salvatore StockhamJapanAsiya Javayant RENEWAL
Francesco ShinkoUnited KingdomAmy Elsner NEW
Tony FollerAustraliaBernardo Dominic PROPOSAL
Aika InouyeBrazilOnyama Limba NEGOTIATION
Ashley DoeItalyXuxue Feng QUALIFIED
Munro FerenczSpainAsiya Javayant QUALIFIED
Aruna FigeroaGermanyAnna Fali QUALIFIED
Rodrigues CampainFranceIoni Bowcher NEGOTIATION
James ButtJapanIvan Magalhaes RENEWAL
Maisha RulapaughBrazilIvan Magalhaes NEGOTIATION
Francesco ShinkoCanadaBernardo Dominic UNQUALIFIED
Aruna FigeroaRussiaOnyama Limba NEGOTIATION
Murillo MaletSpainAsiya Javayant NEGOTIATION
Isabel BowleyIndiaXuxue Feng UNQUALIFIED
Tony FollerRussiaAsiya Javayant NEGOTIATION
Juan WieserIndiaIoni Bowcher NEGOTIATION
Octavia MaletArgentinaAnna Fali QUALIFIED
Ricardo GauchoIndiaAsiya Javayant PROPOSAL
Emily WhobreyAustraliaAnna Fali NEW
Munro FerenczItalyXuxue Feng UNQUALIFIED
Isabel BowleyGermanyOnyama Limba RENEWAL
David DarakjyCanadaBernardo Dominic NEGOTIATION
Jefferson SchemmerFranceAmy Elsner QUALIFIED
Julie StensethCanadaOnyama Limba UNQUALIFIED
Johnson SergiGermanyOnyama Limba PROPOSAL
James ButtRussiaOnyama Limba QUALIFIED
Ivar PaprockiArgentinaAmy Elsner QUALIFIED
Deepesh ChuiCanadaAnna Fali PROPOSAL
Rodrigues CampainItalyAmy Elsner QUALIFIED
Aika InouyeIndiaIvan Magalhaes RENEWAL
Emily WhobreyBrazilBernardo Dominic RENEWAL
Darci PoquetteIndiaAsiya Javayant UNQUALIFIED
David DarakjyArgentinaXuxue Feng RENEWAL
Arvin AlbaresIndiaXuxue Feng NEGOTIATION
Antonio CaudyUnited KingdomIvan Magalhaes NEW
Horizontal
NameCountryRepresentativeStatus
Chavez BriddickUnited KingdomXuxue Feng NEW
Alejandro PerinIndiaAsiya Javayant RENEWAL
Claire TollnerUnited KingdomAnna Fali NEW
Isabel BowleyGermanyIoni Bowcher PROPOSAL
Silvio SlusarskiGermanyXuxue Feng PROPOSAL
Misaki RoysterGermanyOnyama Limba NEW
Stacey MacleadRussiaIvan Magalhaes PROPOSAL
Antonio CaudyJapanElwin Sharvill RENEWAL
Alejandro PerinCanadaAnna Fali UNQUALIFIED
Cody SaylorsAustraliaElwin Sharvill UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Juan WieserJapan2026-04-08Chanay, Jeffrey A Esq UNQUALIFIED10Asiya Javayant
1001Octavia MaletUnited Kingdom2026-05-02Buckley Miller Wright QUALIFIED96Ivan Magalhaes
1002Jeanfrancois VenereSpain2026-04-18Chemel, James L Cpa NEGOTIATION88Ioni Bowcher
1003Faith GillianJapan2026-04-28Chapman, Ross E Esq NEW32Ivan Magalhaes
1004Emily WhobreyCanada2026-04-05Chapman, Ross E Esq UNQUALIFIED78Anna Fali
1005Costa DilliardIndia2026-04-20Rousseaux, Michael Esq QUALIFIED82Onyama Limba
1006Ashley DoeArgentina2026-04-23Benton, John B Jr QUALIFIED34Xuxue Feng
1007Emily WhobreyAustralia2026-04-23Printing Dimensions UNQUALIFIED91Anna Fali
1008Chavez BriddickRussia2026-04-09Rousseaux, Michael Esq UNQUALIFIED2Ivan Magalhaes
1009Jeanfrancois VenereCanada2026-04-29Feltz Printing Service UNQUALIFIED64Bernardo Dominic
1010Aika InouyeIndia2026-04-19Commercial Press NEW95Stephen Shaw
1011Wickens NestleItaly2026-04-21Feltz Printing Service QUALIFIED41Onyama Limba
1012Kadeem FlosiItaly2026-04-08Printing Dimensions NEW27Elwin Sharvill
1013Claire TollnerGermany2026-04-30Chemel, James L Cpa NEGOTIATION60Onyama Limba
1014Clifford RimBrazil2026-04-28Feltz Printing Service UNQUALIFIED91Anna Fali
1015Antonio CaudyFrance2026-04-15Buckley Miller Wright UNQUALIFIED73Bernardo Dominic
1016Leja CaldareraAustralia2026-04-19Dorl, James J Esq NEGOTIATION77Onyama Limba
1017Smith GlickSpain2026-05-01King, Christopher A Esq NEW40Onyama Limba
1018Greenwood BologniaItaly2026-04-18Buckley Miller Wright NEW78Ivan Magalhaes
1019Aruna FigeroaIndia2026-05-01Printing Dimensions QUALIFIED49Onyama Limba
1020Chavez BriddickArgentina2026-04-17Commercial Press UNQUALIFIED78Amy Elsner
1021Alejandro PerinSpain2026-04-20Feltz Printing Service PROPOSAL2Bernardo Dominic
1022Antonio CaudySpain2026-04-27Chapman, Ross E Esq RENEWAL57Stephen Shaw
1023Ashley DoeIndia2026-04-13Buckley Miller Wright UNQUALIFIED22Ivan Magalhaes
1024Ashley DoeItaly2026-04-07King, Christopher A Esq UNQUALIFIED57Ivan Magalhaes
1025Costa DilliardIndia2026-04-19Feltz Printing Service UNQUALIFIED64Stephen Shaw
1026Salvatore StockhamGermany2026-05-01Rangoni Of Florence NEGOTIATION50Elwin Sharvill
1027Aditya KuskoIndia2026-04-29Rangoni Of Florence PROPOSAL49Amy Elsner
1028Isabel BowleyAustralia2026-04-14Feiner Bros NEW56Elwin Sharvill
1029Antonio CaudyIndia2026-04-19Dorl, James J Esq RENEWAL51Ioni Bowcher
1030Ricardo GauchoBrazil2026-04-24Feltz Printing Service RENEWAL16Asiya Javayant
1031Ivar PaprockiAustralia2026-04-18Feiner Bros PROPOSAL61Stephen Shaw
1032Ricardo GauchoIndia2026-04-08Commercial Press NEW80Elwin Sharvill
1033Aruna FigeroaArgentina2026-04-18Benton, John B Jr UNQUALIFIED74Ivan Magalhaes
1034Tony FollerIndia2026-04-06Feltz Printing Service NEGOTIATION64Stephen Shaw
1035Mujtaba NickaRussia2026-04-18Printing Dimensions PROPOSAL74Anna Fali
1036Rodrigues CampainIndia2026-04-21Truhlar And Truhlar Attys PROPOSAL19Ioni Bowcher
1037Clifford RimGermany2026-05-01Chemel, James L Cpa QUALIFIED83Elwin Sharvill
1038Leon OldroydAustralia2026-04-20Printing Dimensions QUALIFIED11Stephen Shaw
1039Salvatore StockhamJapan2026-04-07Feiner Bros RENEWAL41Elwin Sharvill
1040James ButtRussia2026-04-26Chapman, Ross E Esq PROPOSAL57Xuxue Feng
1041Aruna FigeroaCanada2026-05-02Chemel, James L Cpa NEW57Elwin Sharvill
1042Aika InouyeJapan2026-04-15King, Christopher A Esq UNQUALIFIED74Onyama Limba
1043Chavez BriddickRussia2026-04-25Feiner Bros UNQUALIFIED95Onyama Limba
1044Arvin AlbaresArgentina2026-04-15Chemel, James L Cpa UNQUALIFIED52Elwin Sharvill
1045Faith GillianRussia2026-04-13Rangoni Of Florence PROPOSAL85Elwin Sharvill
1046Aruna FigeroaCanada2026-04-27Chemel, James L Cpa QUALIFIED45Elwin Sharvill
1047Smith GlickIndia2026-04-25Feltz Printing Service QUALIFIED47Ivan Magalhaes
1048Claire TollnerCanada2026-04-25Feiner Bros UNQUALIFIED96Elwin Sharvill
1049Maisha RulapaughFrance2026-04-24Chemel, James L Cpa PROPOSAL17Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Nicolas IturbideFranceXuxue Feng UNQUALIFIED
Leja CaldareraUnited KingdomStephen Shaw UNQUALIFIED
Tony FollerItalyAnna Fali NEW
Murillo MaletFranceXuxue Feng NEGOTIATION
Isabel BowleyJapanAsiya Javayant QUALIFIED
Morrow RutaGermanyAnna Fali PROPOSAL
Antonio CaudyCanadaBernardo Dominic UNQUALIFIED
Claire TollnerGermanyElwin Sharvill PROPOSAL
Juan WieserUnited KingdomAsiya Javayant QUALIFIED
Emily WhobreyArgentinaElwin Sharvill QUALIFIED
Faith GillianArgentinaAmy Elsner RENEWAL
Cody SaylorsBrazilXuxue Feng NEGOTIATION
James ButtUnited KingdomStephen Shaw UNQUALIFIED
James ButtArgentinaBernardo Dominic NEGOTIATION
Octavia MaletUnited KingdomAsiya Javayant RENEWAL
Claire TollnerRussiaOnyama Limba UNQUALIFIED
Cody SaylorsItalyAmy Elsner NEGOTIATION
Leja CaldareraSpainAmy Elsner PROPOSAL
Alejandro PerinSpainAmy Elsner RENEWAL
Jennifer AmigonItalyXuxue Feng NEGOTIATION
James ButtFranceStephen Shaw UNQUALIFIED
James ButtIndiaIoni Bowcher PROPOSAL
Adams MorascaJapanAmy Elsner NEGOTIATION
Smith GlickJapanOnyama Limba RENEWAL
Jefferson SchemmerJapanIoni Bowcher RENEWAL
Murillo MaletAustraliaXuxue Feng PROPOSAL
Morrow RutaIndiaIoni Bowcher RENEWAL
Misaki RoysterGermanyIoni Bowcher NEW
Francesco ShinkoSpainBernardo Dominic QUALIFIED
Stacey MacleadFranceIvan Magalhaes NEGOTIATION
Alejandro PerinArgentinaElwin Sharvill RENEWAL
Ivar PaprockiArgentinaAsiya Javayant NEW
Alejandro PerinFranceOnyama Limba UNQUALIFIED
Darci PoquetteSpainIvan Magalhaes QUALIFIED
Darci PoquetteAustraliaAmy Elsner NEW
Adams MorascaItalyAmy Elsner PROPOSAL
Stacey MacleadRussiaAnna Fali RENEWAL
Jeanfrancois VenereItalyIvan Magalhaes PROPOSAL
David DarakjyFranceStephen Shaw QUALIFIED
Munro FerenczItalyBernardo Dominic UNQUALIFIED
Morrow RutaRussiaStephen Shaw NEW
Nicolas IturbideGermanyBernardo Dominic NEGOTIATION
Sinclair WaycottIndiaXuxue Feng RENEWAL
Mujtaba NickaAustraliaAmy Elsner UNQUALIFIED
Francesco ShinkoRussiaStephen Shaw RENEWAL
Francesco ShinkoBrazilAmy Elsner RENEWAL
David DarakjyArgentinaBernardo Dominic PROPOSAL
Octavia MaletCanadaAnna Fali PROPOSAL
Jones VocelkaIndiaIvan Magalhaes NEW
Francesco ShinkoBrazilStephen Shaw UNQUALIFIED
Frozen Columns
Name
Emily Whobrey
Jefferson Schemmer
Alejandro Perin
Jefferson Schemmer
Arvin Albares
Tony Foller
Jennifer Amigon
Chavez Briddick
Tony Foller
Nicolas Iturbide
Greenwood Bolognia
Ivar Paprocki
Sinclair Waycott
Alejandro Perin
David Darakjy
Morrow Ruta
Aika Inouye
Jennifer Amigon
Aika Inouye
Murillo Malet
Nicolas Iturbide
Aika Inouye
Cody Saylors
Misaki Royster
Deepesh Chui
Johnson Sergi
Chavez Briddick
Costa Dilliard
Kaitlin Ostrosky
Ashley Doe
Claire Tollner
Isabel Bowley
Kaitlin Ostrosky
Greenwood Bolognia
Darci Poquette
Emily Whobrey
Leja Caldarera
Claire Tollner
Leon Oldroyd
Clifford Rim
Tony Foller
Cody Saylors
Darci Poquette
Munro Ferencz
Julie Stenseth
Jeanfrancois Venere
Octavia Malet
Darci Poquette
Arvin Albares
Julie Stenseth
IdCountryDate
1000Russia2026-04-29
1001Italy2026-04-16
1002Italy2026-04-24
1003Germany2026-04-12
1004Italy2026-05-03
1005United Kingdom2026-05-02
1006United Kingdom2026-04-24
1007Germany2026-04-25
1008India2026-05-02
1009Brazil2026-04-23
1010Argentina2026-04-22
1011Italy2026-04-28
1012Argentina2026-04-08
1013Russia2026-04-22
1014India2026-04-29
1015United Kingdom2026-04-24
1016Italy2026-04-13
1017Spain2026-04-13
1018Italy2026-04-21
1019Brazil2026-04-25
1020Russia2026-04-22
1021Australia2026-04-11
1022Spain2026-04-11
1023India2026-04-27
1024United Kingdom2026-04-14
1025Germany2026-04-05
1026Russia2026-05-02
1027India2026-04-23
1028Japan2026-04-18
1029India2026-04-13
1030Spain2026-04-04
1031Canada2026-04-15
1032Spain2026-04-12
1033Japan2026-04-09
1034Italy2026-04-09
1035Australia2026-05-02
1036Australia2026-04-11
1037United Kingdom2026-04-23
1038United Kingdom2026-04-30
1039Brazil2026-05-03
1040France2026-04-15
1041India2026-04-24
1042Brazil2026-04-06
1043Canada2026-04-10
1044Australia2026-04-11
1045United Kingdom2026-04-19
1046Germany2026-04-21
1047United Kingdom2026-04-18
1048Spain2026-04-22
1049United Kingdom2026-04-30

On-Demand Data

NameIdCountryDate
Deepesh Chui1000Argentina2026-04-25
Munro Ferencz1001Germany2026-04-19
Costa Dilliard1002Spain2026-04-04
Rodrigues Campain1003India2026-04-21
Aditya Kusko1004Australia2026-04-18
Jennifer Amigon1005Australia2026-04-23
Sinclair Waycott1006Spain2026-04-23
Jones Vocelka1007Russia2026-04-12
David Darakjy1008India2026-04-21
Aika Inouye1009Germany2026-04-22
Stacey Maclead1010France2026-04-21
Cody Saylors1011Canada2026-04-17
Chavez Briddick1012United Kingdom2026-04-14
Isabel Bowley1013Italy2026-05-03
Darci Poquette1014Canada2026-04-19
Adams Morasca1015India2026-04-27
Antonio Caudy1016Italy2026-04-06
Mayumi Kolmetz1017United Kingdom2026-05-02
Mayumi Kolmetz1018Argentina2026-04-24
Juan Wieser1019Australia2026-05-02
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Leon OldroydUnited KingdomStephen Shaw NEGOTIATION
Izzy GarufiUnited KingdomStephen Shaw QUALIFIED
Jones VocelkaAustraliaAmy Elsner NEW
Kadeem FlosiRussiaIvan Magalhaes NEW
Johnson SergiRussiaIoni Bowcher NEGOTIATION
Emily WhobreyIndiaAmy Elsner NEGOTIATION
James ButtGermanyAmy Elsner RENEWAL
Ashley DoeFranceIvan Magalhaes QUALIFIED
Cody SaylorsFranceAnna Fali NEGOTIATION
Darci PoquetteItalyXuxue Feng PROPOSAL
Mayumi KolmetzBrazilStephen Shaw PROPOSAL
Mujtaba NickaJapanIoni Bowcher PROPOSAL
Faith GillianIndiaAsiya Javayant NEGOTIATION
Johnson SergiIndiaIvan Magalhaes NEGOTIATION
Isabel BowleyUnited KingdomIoni Bowcher NEW
Greenwood BologniaCanadaIoni Bowcher PROPOSAL
Arvin AlbaresSpainElwin Sharvill UNQUALIFIED
Emily WhobreyFranceStephen Shaw QUALIFIED
Ivar PaprockiIndiaOnyama Limba NEW
Clifford RimIndiaIvan Magalhaes RENEWAL
Emily WhobreyRussiaXuxue Feng NEGOTIATION
Julie StensethBrazilAnna Fali QUALIFIED
Isabel BowleyUnited KingdomBernardo Dominic PROPOSAL
Tony FollerJapanBernardo Dominic NEGOTIATION
Rodrigues CampainCanadaXuxue Feng NEW
Cody SaylorsUnited KingdomBernardo Dominic NEGOTIATION
Francesco ShinkoIndiaAmy Elsner NEGOTIATION
Kaitlin OstroskyGermanyAmy Elsner NEGOTIATION
Aruna FigeroaJapanOnyama Limba PROPOSAL
Aika InouyeBrazilIvan Magalhaes RENEWAL
Murillo MaletFranceStephen Shaw RENEWAL
Arvin AlbaresJapanOnyama Limba NEGOTIATION
Clifford RimIndiaIvan Magalhaes NEW
Julie StensethItalyIvan Magalhaes NEGOTIATION
Kaitlin OstroskyIndiaStephen Shaw PROPOSAL
Jeanfrancois VenereJapanBernardo Dominic RENEWAL
Izzy GarufiUnited KingdomElwin Sharvill QUALIFIED
Greenwood BologniaItalyAsiya Javayant PROPOSAL
Ricardo GauchoGermanyElwin Sharvill QUALIFIED
Mayumi KolmetzFranceBernardo Dominic NEW

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