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
Ivar PaprockiSpainElwin Sharvill QUALIFIED
Chavez BriddickJapanAnna Fali NEGOTIATION
Maria MarrierCanadaIvan Magalhaes PROPOSAL
Maria MarrierAustraliaAsiya Javayant QUALIFIED
Arvin AlbaresAustraliaAmy Elsner NEW
Murillo MaletUnited KingdomOnyama Limba PROPOSAL
Ivar PaprockiItalyOnyama Limba RENEWAL
Maisha RulapaughRussiaAnna Fali UNQUALIFIED
Aika InouyeArgentinaAnna Fali PROPOSAL
Mujtaba NickaBrazilOnyama Limba PROPOSAL
Costa DilliardAustraliaElwin Sharvill PROPOSAL
Jennifer AmigonAustraliaStephen Shaw NEGOTIATION
Mujtaba NickaRussiaBernardo Dominic UNQUALIFIED
Francesco ShinkoBrazilElwin Sharvill RENEWAL
Maisha RulapaughItalyIoni Bowcher NEW
Ashley DoeSpainOnyama Limba UNQUALIFIED
Greenwood BologniaFranceIoni Bowcher NEGOTIATION
Silvio SlusarskiCanadaOnyama Limba PROPOSAL
Munro FerenczItalyIvan Magalhaes UNQUALIFIED
Julie StensethGermanyXuxue Feng PROPOSAL
Mujtaba NickaJapanXuxue Feng UNQUALIFIED
Mujtaba NickaRussiaAsiya Javayant QUALIFIED
Johnson SergiGermanyOnyama Limba UNQUALIFIED
David DarakjyRussiaElwin Sharvill UNQUALIFIED
Juan WieserCanadaStephen Shaw NEGOTIATION
Cody SaylorsRussiaAmy Elsner UNQUALIFIED
Cody SaylorsIndiaXuxue Feng RENEWAL
Deepesh ChuiItalyElwin Sharvill NEGOTIATION
Jefferson SchemmerFranceAmy Elsner PROPOSAL
James ButtAustraliaIvan Magalhaes UNQUALIFIED
Kaitlin OstroskySpainAsiya Javayant NEGOTIATION
Wickens NestleJapanBernardo Dominic NEGOTIATION
Costa DilliardArgentinaAnna Fali PROPOSAL
Octavia MaletRussiaAsiya Javayant RENEWAL
Isabel BowleyIndiaAsiya Javayant UNQUALIFIED
Leon OldroydRussiaAmy Elsner NEW
Rodrigues CampainCanadaAmy Elsner NEGOTIATION
Claire TollnerIndiaAnna Fali NEW
James ButtGermanyAnna Fali RENEWAL
Clifford RimGermanyBernardo Dominic RENEWAL
Jones VocelkaRussiaXuxue Feng RENEWAL
Arvin AlbaresGermanyStephen Shaw NEGOTIATION
Murillo MaletAustraliaStephen Shaw NEGOTIATION
Rodrigues CampainJapanBernardo Dominic UNQUALIFIED
Johnson SergiFranceAsiya Javayant PROPOSAL
Jefferson SchemmerJapanIoni Bowcher RENEWAL
Julie StensethRussiaStephen Shaw PROPOSAL
Wickens NestleFranceAmy Elsner PROPOSAL
Rodrigues CampainItalyIoni Bowcher RENEWAL
Salvatore StockhamSpainXuxue Feng QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Clifford RimBrazilBernardo Dominic RENEWAL
Mayumi KolmetzRussiaBernardo Dominic UNQUALIFIED
Kaitlin OstroskyJapanAmy Elsner RENEWAL
James ButtUnited KingdomXuxue Feng QUALIFIED
Aruna FigeroaRussiaAmy Elsner UNQUALIFIED
Leja CaldareraGermanyXuxue Feng PROPOSAL
Jefferson SchemmerGermanyAnna Fali RENEWAL
Clifford RimArgentinaIoni Bowcher UNQUALIFIED
Antonio CaudyAustraliaOnyama Limba QUALIFIED
Smith GlickFranceIoni Bowcher PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Octavia MaletArgentina2025-10-15Feiner Bros RENEWAL14Elwin Sharvill
1001Juan WieserFrance2025-10-24Rousseaux, Michael Esq UNQUALIFIED75Ivan Magalhaes
1002Munro FerenczBrazil2025-11-02Rousseaux, Michael Esq RENEWAL71Ioni Bowcher
1003Silvio SlusarskiUnited Kingdom2025-10-05Chemel, James L Cpa QUALIFIED4Stephen Shaw
1004Clifford RimRussia2025-10-17Printing Dimensions NEGOTIATION20Elwin Sharvill
1005Sinclair WaycottBrazil2025-10-31Morlong Associates NEW47Anna Fali
1006Izzy GarufiItaly2025-10-05Buckley Miller Wright RENEWAL44Anna Fali
1007Smith GlickSpain2025-10-18Feltz Printing Service RENEWAL68Asiya Javayant
1008David DarakjyBrazil2025-10-20Feltz Printing Service QUALIFIED3Elwin Sharvill
1009Morrow RutaBrazil2025-11-03Feiner Bros QUALIFIED77Ioni Bowcher
1010Izzy GarufiCanada2025-10-27Printing Dimensions PROPOSAL73Elwin Sharvill
1011Jones VocelkaBrazil2025-10-27Benton, John B Jr UNQUALIFIED22Elwin Sharvill
1012Darci PoquetteBrazil2025-10-16Dorl, James J Esq RENEWAL11Anna Fali
1013Jeanfrancois VenereAustralia2025-10-15King, Christopher A Esq NEGOTIATION15Anna Fali
1014Jennifer AmigonFrance2025-10-29Chapman, Ross E Esq NEW12Ivan Magalhaes
1015Rodrigues CampainBrazil2025-11-01Buckley Miller Wright NEW33Ioni Bowcher
1016Emily WhobreyCanada2025-10-27Rousseaux, Michael Esq NEW56Onyama Limba
1017Maria MarrierItaly2025-11-03King, Christopher A Esq NEGOTIATION36Elwin Sharvill
1018Aika InouyeUnited Kingdom2025-10-17Commercial Press UNQUALIFIED93Anna Fali
1019Mujtaba NickaJapan2025-10-30Truhlar And Truhlar Attys PROPOSAL84Amy Elsner
1020Morrow RutaItaly2025-10-11Chemel, James L Cpa PROPOSAL93Onyama Limba
1021Julie StensethRussia2025-11-02Rousseaux, Michael Esq UNQUALIFIED46Bernardo Dominic
1022Octavia MaletJapan2025-10-14Commercial Press NEGOTIATION63Bernardo Dominic
1023Aika InouyeUnited Kingdom2025-10-31Morlong Associates RENEWAL30Elwin Sharvill
1024Tony FollerBrazil2025-10-12Chemel, James L Cpa NEGOTIATION91Xuxue Feng
1025Antonio CaudyAustralia2025-10-10Rangoni Of Florence NEGOTIATION71Onyama Limba
1026Salvatore StockhamRussia2025-11-02Rousseaux, Michael Esq NEGOTIATION46Xuxue Feng
1027Nicolas IturbideGermany2025-10-16Chapman, Ross E Esq UNQUALIFIED8Ioni Bowcher
1028Antonio CaudyJapan2025-10-29Truhlar And Truhlar Attys QUALIFIED81Bernardo Dominic
1029Silvio SlusarskiBrazil2025-10-07Chanay, Jeffrey A Esq RENEWAL65Elwin Sharvill
1030Leja CaldareraJapan2025-10-31King, Christopher A Esq QUALIFIED54Ioni Bowcher
1031Jones VocelkaGermany2025-10-15Benton, John B Jr RENEWAL78Xuxue Feng
1032Sinclair WaycottRussia2025-10-21Rousseaux, Michael Esq QUALIFIED92Amy Elsner
1033Alejandro PerinFrance2025-10-12Benton, John B Jr QUALIFIED73Ivan Magalhaes
1034Kadeem FlosiSpain2025-10-09Chanay, Jeffrey A Esq PROPOSAL74Onyama Limba
1035Adams MorascaFrance2025-10-14Rangoni Of Florence QUALIFIED48Elwin Sharvill
1036Maisha RulapaughAustralia2025-10-13Benton, John B Jr NEGOTIATION40Xuxue Feng
1037Ricardo GauchoAustralia2025-10-31Feltz Printing Service NEW65Stephen Shaw
1038Leon OldroydJapan2025-10-23Dorl, James J Esq PROPOSAL0Elwin Sharvill
1039Greenwood BologniaIndia2025-10-25Benton, John B Jr NEGOTIATION99Stephen Shaw
1040Kadeem FlosiBrazil2025-10-09Chemel, James L Cpa RENEWAL87Stephen Shaw
1041Clifford RimFrance2025-10-21Chemel, James L Cpa UNQUALIFIED10Bernardo Dominic
1042Ricardo GauchoIndia2025-10-13Feltz Printing Service RENEWAL42Ioni Bowcher
1043Kaitlin OstroskyCanada2025-10-20Chanay, Jeffrey A Esq NEGOTIATION22Xuxue Feng
1044James ButtBrazil2025-10-23Chemel, James L Cpa NEW51Ioni Bowcher
1045Claire TollnerIndia2025-10-24Rousseaux, Michael Esq NEGOTIATION87Xuxue Feng
1046Aika InouyeRussia2025-10-11Feiner Bros UNQUALIFIED24Stephen Shaw
1047Maisha RulapaughBrazil2025-10-07Rousseaux, Michael Esq NEGOTIATION60Onyama Limba
1048Adams MorascaUnited Kingdom2025-10-24Chemel, James L Cpa UNQUALIFIED84Bernardo Dominic
1049Octavia MaletJapan2025-10-20Commercial Press PROPOSAL63Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Ashley DoeAustraliaElwin Sharvill QUALIFIED
Stacey MacleadFranceXuxue Feng QUALIFIED
Maria MarrierCanadaOnyama Limba UNQUALIFIED
Maria MarrierUnited KingdomBernardo Dominic RENEWAL
Misaki RoysterAustraliaAnna Fali RENEWAL
Mayumi KolmetzRussiaIoni Bowcher RENEWAL
Darci PoquetteGermanyAmy Elsner NEW
Kaitlin OstroskyIndiaStephen Shaw NEGOTIATION
Jeanfrancois VenereIndiaAmy Elsner NEW
Sinclair WaycottIndiaBernardo Dominic RENEWAL
Greenwood BologniaUnited KingdomOnyama Limba PROPOSAL
Costa DilliardSpainIoni Bowcher NEGOTIATION
Nicolas IturbideBrazilOnyama Limba PROPOSAL
Ricardo GauchoRussiaElwin Sharvill RENEWAL
Maria MarrierArgentinaIoni Bowcher RENEWAL
Maria MarrierIndiaElwin Sharvill QUALIFIED
Deepesh ChuiRussiaXuxue Feng NEGOTIATION
Antonio CaudySpainIoni Bowcher NEGOTIATION
Jones VocelkaArgentinaElwin Sharvill PROPOSAL
Mujtaba NickaSpainIvan Magalhaes NEGOTIATION
Octavia MaletArgentinaOnyama Limba NEW
Leja CaldareraSpainStephen Shaw UNQUALIFIED
Rodrigues CampainIndiaElwin Sharvill PROPOSAL
Antonio CaudyCanadaAmy Elsner NEW
Deepesh ChuiArgentinaXuxue Feng PROPOSAL
Arvin AlbaresIndiaStephen Shaw UNQUALIFIED
Alejandro PerinGermanyIvan Magalhaes NEGOTIATION
Stacey MacleadRussiaStephen Shaw PROPOSAL
Aika InouyeUnited KingdomOnyama Limba NEW
Aika InouyeRussiaXuxue Feng RENEWAL
Maisha RulapaughAustraliaAsiya Javayant UNQUALIFIED
Leon OldroydArgentinaIoni Bowcher QUALIFIED
Tony FollerIndiaOnyama Limba NEGOTIATION
Jones VocelkaJapanStephen Shaw NEGOTIATION
Jones VocelkaCanadaElwin Sharvill NEGOTIATION
Aditya KuskoArgentinaElwin Sharvill UNQUALIFIED
Leon OldroydBrazilAnna Fali RENEWAL
Cody SaylorsAustraliaElwin Sharvill QUALIFIED
Jeanfrancois VenereCanadaAsiya Javayant NEW
Clifford RimAustraliaIoni Bowcher UNQUALIFIED
Mujtaba NickaSpainAmy Elsner UNQUALIFIED
Mayumi KolmetzArgentinaBernardo Dominic NEW
Rodrigues CampainUnited KingdomAmy Elsner PROPOSAL
Stacey MacleadArgentinaBernardo Dominic UNQUALIFIED
Murillo MaletUnited KingdomStephen Shaw NEGOTIATION
Aditya KuskoCanadaBernardo Dominic QUALIFIED
Wickens NestleRussiaElwin Sharvill PROPOSAL
Ashley DoeAustraliaOnyama Limba RENEWAL
Murillo MaletIndiaIoni Bowcher NEGOTIATION
Julie StensethBrazilBernardo Dominic UNQUALIFIED
Frozen Columns
Name
Julie Stenseth
Greenwood Bolognia
Izzy Garufi
Ricardo Gaucho
Jeanfrancois Venere
Mujtaba Nicka
Isabel Bowley
Morrow Ruta
Jefferson Schemmer
Nicolas Iturbide
Arvin Albares
Isabel Bowley
Juan Wieser
Smith Glick
Chavez Briddick
Cody Saylors
Nicolas Iturbide
Cody Saylors
Munro Ferencz
Stacey Maclead
Claire Tollner
Morrow Ruta
David Darakjy
Sinclair Waycott
Isabel Bowley
Adams Morasca
Isabel Bowley
Misaki Royster
Juan Wieser
Aika Inouye
James Butt
Stacey Maclead
Ricardo Gaucho
Munro Ferencz
Arvin Albares
Jeanfrancois Venere
Mayumi Kolmetz
Ivar Paprocki
Izzy Garufi
Darci Poquette
Kaitlin Ostrosky
Aruna Figeroa
Antonio Caudy
Maisha Rulapaugh
Stacey Maclead
Jeanfrancois Venere
Alejandro Perin
Salvatore Stockham
Chavez Briddick
Ivar Paprocki
IdCountryDate
1000Canada2025-10-31
1001Brazil2025-10-22
1002Russia2025-10-10
1003Germany2025-10-09
1004Australia2025-11-02
1005India2025-11-02
1006India2025-10-07
1007Russia2025-10-17
1008Italy2025-10-11
1009United Kingdom2025-10-06
1010Canada2025-10-27
1011Brazil2025-10-25
1012Argentina2025-10-14
1013Canada2025-10-16
1014United Kingdom2025-10-13
1015Japan2025-10-17
1016United Kingdom2025-10-26
1017Argentina2025-10-25
1018Canada2025-10-08
1019Australia2025-10-30
1020Australia2025-10-16
1021Spain2025-10-23
1022Canada2025-11-01
1023Japan2025-11-02
1024India2025-10-17
1025France2025-10-10
1026Argentina2025-10-23
1027Italy2025-10-31
1028India2025-10-21
1029Germany2025-11-02
1030France2025-10-22
1031India2025-10-28
1032Japan2025-10-14
1033Japan2025-10-09
1034Spain2025-10-11
1035Germany2025-10-12
1036Italy2025-10-08
1037Russia2025-10-14
1038Italy2025-10-05
1039Italy2025-10-28
1040Canada2025-11-02
1041Spain2025-10-16
1042Canada2025-11-03
1043Australia2025-10-19
1044Argentina2025-10-24
1045Brazil2025-11-01
1046Japan2025-10-24
1047France2025-10-05
1048Spain2025-10-05
1049Japan2025-10-30

On-Demand Data

NameIdCountryDate
Ricardo Gaucho1000Italy2025-10-20
Misaki Royster1001Australia2025-10-05
Misaki Royster1002Australia2025-10-13
Salvatore Stockham1003United Kingdom2025-11-02
Isabel Bowley1004Canada2025-10-23
Nicolas Iturbide1005Russia2025-11-02
Rodrigues Campain1006Spain2025-10-08
Aditya Kusko1007Australia2025-10-17
Juan Wieser1008Russia2025-10-11
Aruna Figeroa1009Russia2025-10-28
Wickens Nestle1010United Kingdom2025-10-16
Clifford Rim1011Russia2025-10-12
Clifford Rim1012Russia2025-10-23
Kaitlin Ostrosky1013Brazil2025-10-25
Alejandro Perin1014Japan2025-10-21
Julie Stenseth1015Canada2025-10-15
Ashley Doe1016Italy2025-10-22
Maisha Rulapaugh1017Japan2025-10-09
Mayumi Kolmetz1018India2025-10-06
Murillo Malet1019Canada2025-10-12
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aika InouyeAustraliaIoni Bowcher RENEWAL
Jefferson SchemmerGermanyAnna Fali NEGOTIATION
Tony FollerGermanyAsiya Javayant NEW
Aditya KuskoJapanStephen Shaw QUALIFIED
Darci PoquetteGermanyAsiya Javayant PROPOSAL
James ButtUnited KingdomOnyama Limba NEW
Wickens NestleArgentinaElwin Sharvill RENEWAL
Maria MarrierCanadaOnyama Limba QUALIFIED
Mujtaba NickaSpainIvan Magalhaes NEGOTIATION
Leon OldroydRussiaAmy Elsner PROPOSAL
Faith GillianGermanyElwin Sharvill NEW
Wickens NestleAustraliaIoni Bowcher PROPOSAL
Greenwood BologniaUnited KingdomOnyama Limba UNQUALIFIED
Johnson SergiAustraliaBernardo Dominic NEW
Aruna FigeroaRussiaOnyama Limba QUALIFIED
Octavia MaletFranceXuxue Feng RENEWAL
Darci PoquetteArgentinaIvan Magalhaes QUALIFIED
Faith GillianIndiaElwin Sharvill NEW
Silvio SlusarskiCanadaBernardo Dominic PROPOSAL
Jefferson SchemmerSpainXuxue Feng QUALIFIED
Aditya KuskoItalyXuxue Feng NEGOTIATION
Alejandro PerinCanadaStephen Shaw QUALIFIED
Jennifer AmigonItalyBernardo Dominic QUALIFIED
Ricardo GauchoJapanElwin Sharvill NEGOTIATION
Sinclair WaycottIndiaStephen Shaw RENEWAL
Jones VocelkaAustraliaElwin Sharvill UNQUALIFIED
Rodrigues CampainItalyOnyama Limba QUALIFIED
Arvin AlbaresAustraliaIvan Magalhaes NEW
Sinclair WaycottBrazilStephen Shaw NEGOTIATION
Cody SaylorsIndiaIvan Magalhaes PROPOSAL
Clifford RimUnited KingdomOnyama Limba PROPOSAL
Jones VocelkaRussiaXuxue Feng QUALIFIED
Stacey MacleadSpainXuxue Feng NEW
Misaki RoysterCanadaIvan Magalhaes QUALIFIED
Munro FerenczArgentinaBernardo Dominic PROPOSAL
Jefferson SchemmerGermanyOnyama Limba UNQUALIFIED
Salvatore StockhamCanadaElwin Sharvill UNQUALIFIED
Deepesh ChuiJapanXuxue Feng UNQUALIFIED
Aditya KuskoItalyIoni Bowcher NEGOTIATION
Maria MarrierRussiaElwin Sharvill 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>