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
Faith GillianGermanyBernardo Dominic QUALIFIED
Emily WhobreyItalyBernardo Dominic NEW
Rodrigues CampainUnited KingdomStephen Shaw PROPOSAL
Silvio SlusarskiGermanyBernardo Dominic UNQUALIFIED
David DarakjyIndiaAmy Elsner NEGOTIATION
Adams MorascaBrazilIvan Magalhaes PROPOSAL
Maisha RulapaughAustraliaElwin Sharvill UNQUALIFIED
Silvio SlusarskiGermanyOnyama Limba PROPOSAL
Isabel BowleyItalyIoni Bowcher NEGOTIATION
David DarakjyArgentinaXuxue Feng QUALIFIED
Johnson SergiCanadaOnyama Limba NEW
Murillo MaletArgentinaBernardo Dominic RENEWAL
Francesco ShinkoUnited KingdomElwin Sharvill NEW
Rodrigues CampainFranceAmy Elsner QUALIFIED
Arvin AlbaresCanadaAnna Fali PROPOSAL
Darci PoquetteFranceIvan Magalhaes QUALIFIED
Ricardo GauchoGermanyStephen Shaw NEW
Emily WhobreyUnited KingdomAnna Fali RENEWAL
Chavez BriddickIndiaAsiya Javayant NEGOTIATION
Julie StensethArgentinaXuxue Feng PROPOSAL
Claire TollnerSpainOnyama Limba RENEWAL
Stacey MacleadUnited KingdomAmy Elsner QUALIFIED
Rodrigues CampainUnited KingdomElwin Sharvill RENEWAL
Emily WhobreyBrazilXuxue Feng UNQUALIFIED
Aruna FigeroaAustraliaStephen Shaw QUALIFIED
Deepesh ChuiSpainAmy Elsner RENEWAL
Maisha RulapaughUnited KingdomAnna Fali NEGOTIATION
Antonio CaudyAustraliaXuxue Feng QUALIFIED
Mayumi KolmetzJapanAnna Fali QUALIFIED
Rodrigues CampainSpainAnna Fali NEW
Leon OldroydCanadaXuxue Feng RENEWAL
Jefferson SchemmerArgentinaXuxue Feng NEGOTIATION
Kadeem FlosiFranceIvan Magalhaes NEGOTIATION
Kaitlin OstroskyItalyIvan Magalhaes PROPOSAL
Antonio CaudySpainStephen Shaw NEGOTIATION
Rodrigues CampainJapanAnna Fali UNQUALIFIED
Costa DilliardArgentinaIvan Magalhaes UNQUALIFIED
Jefferson SchemmerCanadaElwin Sharvill NEW
Leja CaldareraItalyElwin Sharvill QUALIFIED
Sinclair WaycottUnited KingdomOnyama Limba PROPOSAL
Wickens NestleAustraliaStephen Shaw PROPOSAL
Aika InouyeSpainAmy Elsner NEW
Aruna FigeroaItalyIoni Bowcher NEGOTIATION
Kaitlin OstroskyFranceBernardo Dominic UNQUALIFIED
Stacey MacleadBrazilElwin Sharvill NEGOTIATION
Francesco ShinkoCanadaAnna Fali UNQUALIFIED
Nicolas IturbideItalyAnna Fali NEW
Leon OldroydGermanyXuxue Feng UNQUALIFIED
Darci PoquetteGermanyXuxue Feng NEW
Jones VocelkaBrazilOnyama Limba NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Juan WieserArgentinaAnna Fali UNQUALIFIED
Alejandro PerinGermanyAnna Fali RENEWAL
Faith GillianRussiaElwin Sharvill PROPOSAL
Octavia MaletJapanAsiya Javayant NEW
Tony FollerAustraliaIoni Bowcher NEW
Kadeem FlosiAustraliaOnyama Limba NEGOTIATION
Aruna FigeroaRussiaAsiya Javayant QUALIFIED
Izzy GarufiUnited KingdomStephen Shaw QUALIFIED
Francesco ShinkoRussiaBernardo Dominic NEGOTIATION
Morrow RutaIndiaAmy Elsner NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Kadeem FlosiSpain2025-08-01Rousseaux, Michael Esq NEW54Xuxue Feng
1001Morrow RutaIndia2025-08-08Benton, John B Jr NEW32Ioni Bowcher
1002Jefferson SchemmerCanada2025-07-21Feiner Bros QUALIFIED97Anna Fali
1003Francesco ShinkoCanada2025-07-27Feltz Printing Service NEW69Bernardo Dominic
1004Maisha RulapaughIndia2025-07-21Rousseaux, Michael Esq NEW87Stephen Shaw
1005Clifford RimSpain2025-07-18Buckley Miller Wright RENEWAL16Amy Elsner
1006Julie StensethSpain2025-08-01Chemel, James L Cpa UNQUALIFIED27Amy Elsner
1007Aditya KuskoAustralia2025-08-06Chemel, James L Cpa NEW83Bernardo Dominic
1008Juan WieserSpain2025-07-22Morlong Associates NEW17Amy Elsner
1009Faith GillianFrance2025-07-18King, Christopher A Esq NEGOTIATION90Amy Elsner
1010Leon OldroydIndia2025-07-22Printing Dimensions UNQUALIFIED45Stephen Shaw
1011Antonio CaudyRussia2025-07-24Chapman, Ross E Esq PROPOSAL60Anna Fali
1012Salvatore StockhamArgentina2025-08-10Dorl, James J Esq RENEWAL72Anna Fali
1013Nicolas IturbideArgentina2025-08-05Commercial Press NEGOTIATION47Xuxue Feng
1014Chavez BriddickFrance2025-07-25Morlong Associates UNQUALIFIED14Anna Fali
1015Deepesh ChuiRussia2025-07-24Dorl, James J Esq RENEWAL43Ivan Magalhaes
1016Misaki RoysterGermany2025-07-19Rousseaux, Michael Esq UNQUALIFIED97Amy Elsner
1017Leon OldroydJapan2025-07-21King, Christopher A Esq NEW30Ioni Bowcher
1018Antonio CaudyItaly2025-08-08Rangoni Of Florence PROPOSAL33Stephen Shaw
1019Francesco ShinkoJapan2025-08-11Feltz Printing Service PROPOSAL78Elwin Sharvill
1020Silvio SlusarskiCanada2025-07-22Chanay, Jeffrey A Esq PROPOSAL72Asiya Javayant
1021Jeanfrancois VenereBrazil2025-07-14Dorl, James J Esq NEW83Onyama Limba
1022Cody SaylorsCanada2025-07-16Dorl, James J Esq NEGOTIATION17Onyama Limba
1023Izzy GarufiArgentina2025-07-20Truhlar And Truhlar Attys QUALIFIED89Ioni Bowcher
1024Francesco ShinkoItaly2025-07-17Truhlar And Truhlar Attys RENEWAL99Onyama Limba
1025Silvio SlusarskiAustralia2025-08-02Dorl, James J Esq QUALIFIED26Bernardo Dominic
1026Faith GillianArgentina2025-07-27Rangoni Of Florence UNQUALIFIED9Ioni Bowcher
1027Morrow RutaSpain2025-07-13Feiner Bros UNQUALIFIED2Asiya Javayant
1028David DarakjyIndia2025-07-15Buckley Miller Wright UNQUALIFIED93Xuxue Feng
1029Smith GlickRussia2025-07-24Printing Dimensions UNQUALIFIED51Elwin Sharvill
1030Mayumi KolmetzUnited Kingdom2025-08-09Rousseaux, Michael Esq PROPOSAL38Ivan Magalhaes
1031Ricardo GauchoUnited Kingdom2025-07-30Morlong Associates RENEWAL18Bernardo Dominic
1032Arvin AlbaresSpain2025-07-24Dorl, James J Esq RENEWAL87Xuxue Feng
1033Greenwood BologniaGermany2025-07-21Rangoni Of Florence RENEWAL41Ioni Bowcher
1034Kaitlin OstroskyRussia2025-07-28Commercial Press NEGOTIATION21Xuxue Feng
1035Silvio SlusarskiCanada2025-07-25Buckley Miller Wright RENEWAL2Anna Fali
1036Aruna FigeroaBrazil2025-07-17Rangoni Of Florence QUALIFIED46Anna Fali
1037Munro FerenczFrance2025-07-16Dorl, James J Esq UNQUALIFIED41Anna Fali
1038Costa DilliardCanada2025-08-08King, Christopher A Esq NEW90Ioni Bowcher
1039Greenwood BologniaUnited Kingdom2025-07-19Chapman, Ross E Esq PROPOSAL61Elwin Sharvill
1040Emily WhobreyBrazil2025-07-31Chemel, James L Cpa PROPOSAL31Onyama Limba
1041Silvio SlusarskiIndia2025-07-16Chemel, James L Cpa QUALIFIED49Stephen Shaw
1042Murillo MaletFrance2025-07-15King, Christopher A Esq NEGOTIATION28Xuxue Feng
1043Kaitlin OstroskyCanada2025-07-29Chanay, Jeffrey A Esq RENEWAL41Asiya Javayant
1044Costa DilliardCanada2025-07-23Chemel, James L Cpa NEW6Ioni Bowcher
1045Jeanfrancois VenereCanada2025-07-26Rousseaux, Michael Esq NEGOTIATION66Onyama Limba
1046Salvatore StockhamIndia2025-07-13Chemel, James L Cpa NEGOTIATION25Asiya Javayant
1047Ivar PaprockiUnited Kingdom2025-08-03Dorl, James J Esq RENEWAL50Amy Elsner
1048Smith GlickItaly2025-07-17Commercial Press UNQUALIFIED14Onyama Limba
1049Sinclair WaycottRussia2025-07-29Buckley Miller Wright PROPOSAL74Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Aika InouyeBrazilAsiya Javayant NEW
Munro FerenczRussiaXuxue Feng RENEWAL
Leja CaldareraUnited KingdomIvan Magalhaes PROPOSAL
Arvin AlbaresGermanyAnna Fali PROPOSAL
Alejandro PerinBrazilStephen Shaw UNQUALIFIED
Faith GillianBrazilIoni Bowcher NEGOTIATION
Wickens NestleRussiaAsiya Javayant NEW
Kadeem FlosiGermanyOnyama Limba UNQUALIFIED
Jefferson SchemmerBrazilAmy Elsner UNQUALIFIED
Octavia MaletBrazilAsiya Javayant NEGOTIATION
Julie StensethArgentinaAnna Fali QUALIFIED
Murillo MaletIndiaElwin Sharvill RENEWAL
Mujtaba NickaFranceStephen Shaw NEW
Salvatore StockhamIndiaElwin Sharvill NEW
Antonio CaudyItalyElwin Sharvill QUALIFIED
Francesco ShinkoIndiaIvan Magalhaes NEGOTIATION
Octavia MaletArgentinaIvan Magalhaes PROPOSAL
Stacey MacleadSpainXuxue Feng UNQUALIFIED
Emily WhobreyRussiaXuxue Feng RENEWAL
Emily WhobreyAustraliaAmy Elsner NEGOTIATION
Greenwood BologniaArgentinaBernardo Dominic NEW
Kaitlin OstroskyBrazilBernardo Dominic RENEWAL
Kadeem FlosiGermanyAsiya Javayant UNQUALIFIED
Wickens NestleAustraliaAsiya Javayant UNQUALIFIED
Clifford RimSpainBernardo Dominic UNQUALIFIED
Leja CaldareraSpainBernardo Dominic UNQUALIFIED
David DarakjyFranceIoni Bowcher PROPOSAL
Chavez BriddickArgentinaBernardo Dominic UNQUALIFIED
Alejandro PerinJapanOnyama Limba RENEWAL
Antonio CaudyJapanXuxue Feng UNQUALIFIED
Francesco ShinkoUnited KingdomOnyama Limba NEW
Maisha RulapaughItalyAmy Elsner RENEWAL
Aika InouyeSpainIoni Bowcher RENEWAL
Misaki RoysterCanadaXuxue Feng NEGOTIATION
Jones VocelkaItalyIvan Magalhaes UNQUALIFIED
Maisha RulapaughFranceStephen Shaw PROPOSAL
Juan WieserIndiaAsiya Javayant UNQUALIFIED
James ButtBrazilBernardo Dominic NEGOTIATION
Julie StensethJapanBernardo Dominic NEW
Jones VocelkaAustraliaAnna Fali NEGOTIATION
Salvatore StockhamArgentinaAnna Fali PROPOSAL
Maisha RulapaughIndiaAnna Fali PROPOSAL
Maria MarrierAustraliaOnyama Limba NEW
Jeanfrancois VenereItalyOnyama Limba UNQUALIFIED
Ricardo GauchoCanadaAsiya Javayant NEW
Jennifer AmigonJapanXuxue Feng PROPOSAL
Francesco ShinkoRussiaStephen Shaw NEW
Claire TollnerItalyBernardo Dominic RENEWAL
Deepesh ChuiUnited KingdomIvan Magalhaes PROPOSAL
Johnson SergiItalyAnna Fali RENEWAL
Frozen Columns
Name
Chavez Briddick
Kadeem Flosi
Ivar Paprocki
Jefferson Schemmer
Greenwood Bolognia
Jefferson Schemmer
Ashley Doe
Stacey Maclead
Antonio Caudy
Kadeem Flosi
Rodrigues Campain
Mayumi Kolmetz
Aditya Kusko
Stacey Maclead
Jefferson Schemmer
Cody Saylors
Chavez Briddick
Jones Vocelka
Cody Saylors
Misaki Royster
Mujtaba Nicka
Rodrigues Campain
Munro Ferencz
Izzy Garufi
Ivar Paprocki
Cody Saylors
Julie Stenseth
Salvatore Stockham
Cody Saylors
Silvio Slusarski
Mayumi Kolmetz
Maria Marrier
Kaitlin Ostrosky
Misaki Royster
Jones Vocelka
Mujtaba Nicka
Ivar Paprocki
Ricardo Gaucho
Faith Gillian
Ivar Paprocki
Salvatore Stockham
Maisha Rulapaugh
Stacey Maclead
Cody Saylors
Wickens Nestle
Alejandro Perin
Alejandro Perin
Aruna Figeroa
Aditya Kusko
Aruna Figeroa
IdCountryDate
1000France2025-07-20
1001United Kingdom2025-08-05
1002Canada2025-08-05
1003Brazil2025-07-16
1004France2025-07-20
1005Germany2025-07-13
1006Canada2025-08-03
1007India2025-08-01
1008United Kingdom2025-07-23
1009Australia2025-07-20
1010Italy2025-07-17
1011India2025-07-24
1012Japan2025-07-31
1013Canada2025-08-02
1014Australia2025-07-29
1015Italy2025-08-02
1016Russia2025-08-01
1017India2025-07-24
1018Russia2025-07-24
1019France2025-07-27
1020India2025-08-06
1021Japan2025-08-02
1022Canada2025-07-27
1023Brazil2025-07-13
1024Australia2025-07-20
1025Italy2025-07-27
1026Brazil2025-07-29
1027Italy2025-08-01
1028Italy2025-07-28
1029Japan2025-07-25
1030Germany2025-07-30
1031France2025-07-21
1032United Kingdom2025-07-22
1033India2025-07-20
1034Japan2025-07-21
1035India2025-08-05
1036Australia2025-07-20
1037Australia2025-08-06
1038United Kingdom2025-07-13
1039Canada2025-07-15
1040France2025-07-29
1041Brazil2025-07-27
1042France2025-08-07
1043Italy2025-07-23
1044Germany2025-08-06
1045Brazil2025-07-24
1046Argentina2025-08-08
1047Canada2025-07-15
1048Argentina2025-07-31
1049Japan2025-07-26

On-Demand Data

NameIdCountryDate
Jones Vocelka1000United Kingdom2025-08-02
Jones Vocelka1001India2025-07-26
Leja Caldarera1002Japan2025-07-18
Greenwood Bolognia1003Italy2025-07-18
Ivar Paprocki1004India2025-07-13
Salvatore Stockham1005Germany2025-08-08
Silvio Slusarski1006United Kingdom2025-07-15
Kadeem Flosi1007Italy2025-07-16
Johnson Sergi1008United Kingdom2025-07-24
Isabel Bowley1009United Kingdom2025-07-18
Misaki Royster1010Italy2025-08-08
Jefferson Schemmer1011Argentina2025-07-16
Aditya Kusko1012Russia2025-07-14
Tony Foller1013France2025-08-04
Antonio Caudy1014Argentina2025-08-02
Izzy Garufi1015Italy2025-07-17
Julie Stenseth1016Brazil2025-07-30
Emily Whobrey1017Russia2025-07-31
Claire Tollner1018Germany2025-08-11
Alejandro Perin1019Japan2025-07-14
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Nicolas IturbideRussiaIoni Bowcher RENEWAL
Mayumi KolmetzAustraliaIvan Magalhaes QUALIFIED
Nicolas IturbideIndiaElwin Sharvill RENEWAL
Mayumi KolmetzCanadaAmy Elsner UNQUALIFIED
Leja CaldareraAustraliaAnna Fali RENEWAL
Aruna FigeroaFranceOnyama Limba RENEWAL
Smith GlickIndiaIvan Magalhaes NEW
Greenwood BologniaItalyOnyama Limba UNQUALIFIED
Francesco ShinkoJapanAmy Elsner PROPOSAL
Faith GillianAustraliaIvan Magalhaes UNQUALIFIED
Costa DilliardAustraliaIvan Magalhaes UNQUALIFIED
Aika InouyeIndiaElwin Sharvill UNQUALIFIED
Aika InouyeFranceElwin Sharvill QUALIFIED
Jeanfrancois VenereAustraliaBernardo Dominic NEW
Wickens NestleAustraliaAnna Fali UNQUALIFIED
Maria MarrierFranceAsiya Javayant RENEWAL
Clifford RimBrazilIvan Magalhaes NEW
Mujtaba NickaAustraliaAmy Elsner NEGOTIATION
Stacey MacleadJapanElwin Sharvill NEGOTIATION
Aika InouyeUnited KingdomOnyama Limba NEGOTIATION
Cody SaylorsItalyAmy Elsner UNQUALIFIED
Misaki RoysterRussiaAsiya Javayant NEGOTIATION
Isabel BowleyJapanXuxue Feng UNQUALIFIED
Maisha RulapaughJapanStephen Shaw RENEWAL
Mayumi KolmetzCanadaIvan Magalhaes NEW
Ivar PaprockiJapanElwin Sharvill PROPOSAL
Jennifer AmigonIndiaOnyama Limba NEGOTIATION
Claire TollnerUnited KingdomIoni Bowcher NEGOTIATION
Darci PoquetteSpainElwin Sharvill RENEWAL
Jones VocelkaItalyAmy Elsner NEW
Julie StensethArgentinaAnna Fali NEW
Alejandro PerinFranceAmy Elsner RENEWAL
Antonio CaudyRussiaStephen Shaw QUALIFIED
Francesco ShinkoSpainOnyama Limba QUALIFIED
Cody SaylorsGermanyAsiya Javayant PROPOSAL
Kaitlin OstroskyGermanyAnna Fali QUALIFIED
Ricardo GauchoBrazilElwin Sharvill QUALIFIED
Aditya KuskoIndiaOnyama Limba NEW
Jennifer AmigonItalyAsiya Javayant PROPOSAL
James ButtGermanyIoni Bowcher 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>