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
Cody SaylorsBrazilOnyama Limba RENEWAL
Misaki RoysterItalyXuxue Feng NEW
Francesco ShinkoAustraliaElwin Sharvill NEW
Jones VocelkaItalyIvan Magalhaes UNQUALIFIED
Smith GlickJapanAsiya Javayant PROPOSAL
Stacey MacleadItalyStephen Shaw NEGOTIATION
Kaitlin OstroskyIndiaAmy Elsner QUALIFIED
Faith GillianSpainIvan Magalhaes PROPOSAL
Wickens NestleIndiaIoni Bowcher PROPOSAL
Mayumi KolmetzJapanBernardo Dominic UNQUALIFIED
Jefferson SchemmerUnited KingdomAnna Fali UNQUALIFIED
Juan WieserItalyIvan Magalhaes NEGOTIATION
Murillo MaletIndiaIoni Bowcher PROPOSAL
Greenwood BologniaItalyBernardo Dominic PROPOSAL
Francesco ShinkoIndiaAmy Elsner RENEWAL
Murillo MaletSpainIvan Magalhaes NEW
Kadeem FlosiArgentinaXuxue Feng RENEWAL
Juan WieserFranceOnyama Limba PROPOSAL
Izzy GarufiArgentinaXuxue Feng RENEWAL
Mujtaba NickaCanadaStephen Shaw RENEWAL
Juan WieserRussiaAmy Elsner UNQUALIFIED
Francesco ShinkoFranceBernardo Dominic QUALIFIED
Misaki RoysterBrazilAmy Elsner NEGOTIATION
Chavez BriddickFranceIvan Magalhaes PROPOSAL
Costa DilliardGermanyOnyama Limba RENEWAL
Francesco ShinkoAustraliaElwin Sharvill PROPOSAL
Sinclair WaycottJapanAmy Elsner NEW
David DarakjyUnited KingdomAnna Fali NEGOTIATION
Juan WieserArgentinaBernardo Dominic NEGOTIATION
Ashley DoeRussiaAsiya Javayant RENEWAL
Alejandro PerinFranceOnyama Limba QUALIFIED
Aditya KuskoRussiaBernardo Dominic RENEWAL
Munro FerenczRussiaAsiya Javayant UNQUALIFIED
Tony FollerArgentinaAmy Elsner UNQUALIFIED
James ButtJapanAmy Elsner PROPOSAL
Jeanfrancois VenereUnited KingdomIvan Magalhaes NEGOTIATION
Isabel BowleyJapanStephen Shaw UNQUALIFIED
Silvio SlusarskiRussiaXuxue Feng UNQUALIFIED
Sinclair WaycottFranceOnyama Limba QUALIFIED
Ashley DoeItalyBernardo Dominic UNQUALIFIED
Emily WhobreyJapanOnyama Limba RENEWAL
Isabel BowleySpainIoni Bowcher NEGOTIATION
Murillo MaletItalyIoni Bowcher NEW
Munro FerenczBrazilIoni Bowcher RENEWAL
Costa DilliardRussiaIvan Magalhaes UNQUALIFIED
Morrow RutaCanadaStephen Shaw PROPOSAL
Jefferson SchemmerArgentinaBernardo Dominic NEW
Munro FerenczJapanAsiya Javayant RENEWAL
Adams MorascaUnited KingdomXuxue Feng NEW
Aika InouyeCanadaXuxue Feng NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Wickens NestleRussiaIvan Magalhaes NEGOTIATION
Stacey MacleadUnited KingdomXuxue Feng QUALIFIED
James ButtRussiaXuxue Feng PROPOSAL
Deepesh ChuiUnited KingdomIoni Bowcher PROPOSAL
Leja CaldareraJapanStephen Shaw PROPOSAL
Clifford RimItalyIoni Bowcher UNQUALIFIED
Maria MarrierCanadaBernardo Dominic NEGOTIATION
Ashley DoeRussiaAsiya Javayant QUALIFIED
Cody SaylorsJapanXuxue Feng UNQUALIFIED
Deepesh ChuiIndiaStephen Shaw NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Mayumi KolmetzBrazil2026-06-07Feltz Printing Service NEW84Anna Fali
1001Misaki RoysterGermany2026-06-01Chanay, Jeffrey A Esq NEGOTIATION79Ivan Magalhaes
1002Maria MarrierBrazil2026-05-21Chemel, James L Cpa UNQUALIFIED61Ioni Bowcher
1003Jeanfrancois VenereArgentina2026-06-02Morlong Associates NEW82Bernardo Dominic
1004Alejandro PerinRussia2026-05-22Rousseaux, Michael Esq RENEWAL13Stephen Shaw
1005Claire TollnerSpain2026-05-28Feltz Printing Service NEW81Ivan Magalhaes
1006Octavia MaletCanada2026-05-26Dorl, James J Esq RENEWAL49Elwin Sharvill
1007James ButtIndia2026-05-27Buckley Miller Wright PROPOSAL11Amy Elsner
1008Stacey MacleadJapan2026-05-15Truhlar And Truhlar Attys RENEWAL36Ioni Bowcher
1009Jones VocelkaAustralia2026-05-26Chanay, Jeffrey A Esq NEGOTIATION75Xuxue Feng
1010Jeanfrancois VenereCanada2026-06-13Rangoni Of Florence NEW95Ioni Bowcher
1011Costa DilliardFrance2026-06-04Buckley Miller Wright NEW93Ioni Bowcher
1012Morrow RutaArgentina2026-06-09Truhlar And Truhlar Attys NEGOTIATION31Xuxue Feng
1013Cody SaylorsFrance2026-05-23Chapman, Ross E Esq PROPOSAL17Amy Elsner
1014Julie StensethJapan2026-05-21Rangoni Of Florence QUALIFIED55Elwin Sharvill
1015Wickens NestleCanada2026-06-09Morlong Associates QUALIFIED96Onyama Limba
1016Aditya KuskoJapan2026-05-17Benton, John B Jr NEW31Anna Fali
1017Clifford RimAustralia2026-05-17Feiner Bros NEW77Anna Fali
1018Greenwood BologniaUnited Kingdom2026-05-19Benton, John B Jr NEGOTIATION22Bernardo Dominic
1019Faith GillianIndia2026-06-02Dorl, James J Esq PROPOSAL0Stephen Shaw
1020Kadeem FlosiBrazil2026-05-27Truhlar And Truhlar Attys PROPOSAL70Anna Fali
1021Salvatore StockhamJapan2026-05-24Morlong Associates RENEWAL55Ioni Bowcher
1022Francesco ShinkoBrazil2026-05-19King, Christopher A Esq NEW49Onyama Limba
1023Costa DilliardRussia2026-05-26Chapman, Ross E Esq NEW54Ioni Bowcher
1024Darci PoquetteCanada2026-05-25Dorl, James J Esq QUALIFIED53Asiya Javayant
1025Kadeem FlosiBrazil2026-05-31Benton, John B Jr PROPOSAL0Asiya Javayant
1026Nicolas IturbideSpain2026-05-28Truhlar And Truhlar Attys NEGOTIATION54Onyama Limba
1027Johnson SergiCanada2026-05-26Chemel, James L Cpa QUALIFIED23Elwin Sharvill
1028Costa DilliardGermany2026-05-24Chemel, James L Cpa NEGOTIATION21Amy Elsner
1029Juan WieserAustralia2026-05-21Benton, John B Jr PROPOSAL28Ioni Bowcher
1030Rodrigues CampainSpain2026-05-31Benton, John B Jr NEW87Xuxue Feng
1031Emily WhobreyRussia2026-05-26Commercial Press NEW14Ioni Bowcher
1032Greenwood BologniaIndia2026-06-02Chapman, Ross E Esq UNQUALIFIED95Xuxue Feng
1033Maria MarrierJapan2026-06-13Chemel, James L Cpa PROPOSAL79Bernardo Dominic
1034Clifford RimUnited Kingdom2026-06-12Chemel, James L Cpa PROPOSAL62Asiya Javayant
1035Mujtaba NickaUnited Kingdom2026-05-21Feiner Bros NEGOTIATION70Onyama Limba
1036Nicolas IturbideSpain2026-06-08Buckley Miller Wright RENEWAL91Ivan Magalhaes
1037Munro FerenczUnited Kingdom2026-05-24Rangoni Of Florence RENEWAL83Anna Fali
1038Silvio SlusarskiAustralia2026-06-12Feltz Printing Service RENEWAL57Bernardo Dominic
1039Ivar PaprockiGermany2026-06-06King, Christopher A Esq RENEWAL57Amy Elsner
1040Maisha RulapaughArgentina2026-05-28Printing Dimensions UNQUALIFIED49Anna Fali
1041Rodrigues CampainItaly2026-06-05Rousseaux, Michael Esq QUALIFIED53Asiya Javayant
1042Darci PoquetteBrazil2026-05-15Truhlar And Truhlar Attys PROPOSAL97Stephen Shaw
1043Costa DilliardGermany2026-05-30Chapman, Ross E Esq NEGOTIATION84Ioni Bowcher
1044Emily WhobreySpain2026-05-28Rangoni Of Florence UNQUALIFIED52Onyama Limba
1045Tony FollerCanada2026-05-27Rangoni Of Florence UNQUALIFIED75Xuxue Feng
1046Isabel BowleyCanada2026-05-23Rousseaux, Michael Esq RENEWAL86Asiya Javayant
1047Ivar PaprockiUnited Kingdom2026-05-27King, Christopher A Esq RENEWAL30Anna Fali
1048Jones VocelkaRussia2026-05-28King, Christopher A Esq NEW15Ivan Magalhaes
1049Mujtaba NickaItaly2026-06-06Feiner Bros NEW24Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Adams MorascaCanadaIvan Magalhaes NEW
Jeanfrancois VenereRussiaIvan Magalhaes UNQUALIFIED
Wickens NestleRussiaIvan Magalhaes NEGOTIATION
Kadeem FlosiArgentinaIvan Magalhaes NEGOTIATION
Francesco ShinkoFranceIoni Bowcher NEW
Misaki RoysterRussiaAsiya Javayant PROPOSAL
Ricardo GauchoUnited KingdomStephen Shaw QUALIFIED
Claire TollnerBrazilIoni Bowcher NEW
Emily WhobreyAustraliaAnna Fali UNQUALIFIED
Deepesh ChuiBrazilIoni Bowcher NEGOTIATION
Kadeem FlosiArgentinaStephen Shaw UNQUALIFIED
Deepesh ChuiGermanyXuxue Feng NEW
Leja CaldareraItalyIoni Bowcher RENEWAL
Greenwood BologniaFranceIoni Bowcher PROPOSAL
Misaki RoysterCanadaAnna Fali QUALIFIED
Jeanfrancois VenereItalyIoni Bowcher RENEWAL
Mujtaba NickaGermanyOnyama Limba PROPOSAL
Octavia MaletCanadaAsiya Javayant QUALIFIED
Ivar PaprockiJapanBernardo Dominic RENEWAL
Costa DilliardJapanBernardo Dominic NEGOTIATION
Munro FerenczUnited KingdomAsiya Javayant PROPOSAL
Aruna FigeroaIndiaXuxue Feng RENEWAL
Munro FerenczUnited KingdomElwin Sharvill RENEWAL
Francesco ShinkoJapanAsiya Javayant NEW
Isabel BowleyBrazilElwin Sharvill NEW
Leon OldroydJapanElwin Sharvill UNQUALIFIED
Adams MorascaBrazilStephen Shaw NEGOTIATION
Aditya KuskoRussiaAsiya Javayant UNQUALIFIED
Francesco ShinkoJapanOnyama Limba RENEWAL
Chavez BriddickIndiaStephen Shaw UNQUALIFIED
Faith GillianIndiaAsiya Javayant RENEWAL
Leja CaldareraUnited KingdomXuxue Feng RENEWAL
Aditya KuskoArgentinaXuxue Feng UNQUALIFIED
Leon OldroydCanadaAnna Fali UNQUALIFIED
Claire TollnerUnited KingdomIvan Magalhaes NEGOTIATION
Leon OldroydRussiaAnna Fali UNQUALIFIED
Arvin AlbaresUnited KingdomXuxue Feng NEGOTIATION
Isabel BowleyAustraliaAnna Fali UNQUALIFIED
Aditya KuskoFranceOnyama Limba QUALIFIED
Mujtaba NickaUnited KingdomOnyama Limba NEW
Tony FollerItalyElwin Sharvill NEW
Murillo MaletGermanyElwin Sharvill RENEWAL
Tony FollerAustraliaStephen Shaw RENEWAL
Adams MorascaSpainAmy Elsner NEGOTIATION
Sinclair WaycottBrazilAmy Elsner NEGOTIATION
Francesco ShinkoFranceAmy Elsner UNQUALIFIED
Faith GillianJapanAnna Fali NEW
Aika InouyeBrazilXuxue Feng NEGOTIATION
Aditya KuskoJapanAnna Fali RENEWAL
Leon OldroydGermanyAsiya Javayant NEGOTIATION
Frozen Columns
Name
Aditya Kusko
Kaitlin Ostrosky
Morrow Ruta
Rodrigues Campain
Ivar Paprocki
Leon Oldroyd
Silvio Slusarski
Maria Marrier
Stacey Maclead
Jeanfrancois Venere
Smith Glick
Silvio Slusarski
Maisha Rulapaugh
Rodrigues Campain
Aditya Kusko
Kaitlin Ostrosky
Mayumi Kolmetz
Darci Poquette
Darci Poquette
Emily Whobrey
Octavia Malet
Isabel Bowley
Jefferson Schemmer
Jennifer Amigon
Aika Inouye
Francesco Shinko
Clifford Rim
Aika Inouye
Misaki Royster
Ricardo Gaucho
Jeanfrancois Venere
Chavez Briddick
Stacey Maclead
Maisha Rulapaugh
Izzy Garufi
Darci Poquette
Darci Poquette
Julie Stenseth
Clifford Rim
Kaitlin Ostrosky
Nicolas Iturbide
Ivar Paprocki
Chavez Briddick
Aruna Figeroa
Morrow Ruta
Jeanfrancois Venere
James Butt
Stacey Maclead
David Darakjy
Ricardo Gaucho
IdCountryDate
1000India2026-06-11
1001Russia2026-05-29
1002France2026-05-21
1003Italy2026-05-30
1004Germany2026-06-04
1005Australia2026-05-29
1006Japan2026-05-24
1007Japan2026-05-21
1008Spain2026-05-15
1009Argentina2026-06-03
1010France2026-06-01
1011Italy2026-05-30
1012Brazil2026-06-09
1013Russia2026-05-15
1014France2026-05-21
1015Germany2026-05-16
1016France2026-06-05
1017Canada2026-05-19
1018India2026-05-24
1019United Kingdom2026-05-23
1020Canada2026-06-10
1021United Kingdom2026-06-03
1022United Kingdom2026-05-16
1023France2026-06-09
1024Argentina2026-05-23
1025Argentina2026-05-18
1026Spain2026-06-12
1027Spain2026-06-10
1028Japan2026-06-13
1029Argentina2026-06-07
1030United Kingdom2026-06-05
1031Japan2026-05-29
1032Spain2026-05-21
1033Japan2026-06-09
1034India2026-06-02
1035India2026-05-21
1036Brazil2026-06-09
1037Argentina2026-06-09
1038Australia2026-05-23
1039Australia2026-06-01
1040United Kingdom2026-05-24
1041Canada2026-05-30
1042Russia2026-05-20
1043Germany2026-06-02
1044Brazil2026-06-10
1045United Kingdom2026-06-09
1046India2026-05-23
1047India2026-05-26
1048Russia2026-05-25
1049United Kingdom2026-06-04

On-Demand Data

NameIdCountryDate
Isabel Bowley1000France2026-05-27
Wickens Nestle1001Russia2026-06-06
Maisha Rulapaugh1002India2026-05-18
James Butt1003Argentina2026-06-09
Izzy Garufi1004United Kingdom2026-05-15
Mujtaba Nicka1005Australia2026-05-21
Tony Foller1006Italy2026-06-07
Kadeem Flosi1007India2026-05-18
Aika Inouye1008Germany2026-05-27
Misaki Royster1009France2026-06-03
Izzy Garufi1010Argentina2026-06-04
Isabel Bowley1011Argentina2026-05-19
Smith Glick1012India2026-05-17
Jennifer Amigon1013Canada2026-05-30
Izzy Garufi1014Australia2026-05-28
Nicolas Iturbide1015Australia2026-06-12
Izzy Garufi1016Russia2026-05-24
Aruna Figeroa1017Japan2026-06-10
James Butt1018Argentina2026-06-10
Sinclair Waycott1019Russia2026-06-13
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aika InouyeAustraliaOnyama Limba RENEWAL
Costa DilliardBrazilAnna Fali NEGOTIATION
Deepesh ChuiCanadaAsiya Javayant NEGOTIATION
Maria MarrierSpainIoni Bowcher QUALIFIED
Claire TollnerBrazilXuxue Feng UNQUALIFIED
Francesco ShinkoAustraliaElwin Sharvill QUALIFIED
Jones VocelkaRussiaAsiya Javayant PROPOSAL
Greenwood BologniaRussiaBernardo Dominic QUALIFIED
Claire TollnerSpainElwin Sharvill QUALIFIED
Nicolas IturbideRussiaBernardo Dominic RENEWAL
Leon OldroydSpainStephen Shaw UNQUALIFIED
Darci PoquetteIndiaAsiya Javayant RENEWAL
Jefferson SchemmerUnited KingdomIoni Bowcher NEGOTIATION
Maisha RulapaughSpainAsiya Javayant QUALIFIED
Ashley DoeGermanyAnna Fali RENEWAL
Leon OldroydIndiaElwin Sharvill QUALIFIED
Arvin AlbaresItalyOnyama Limba RENEWAL
Kaitlin OstroskyBrazilAmy Elsner RENEWAL
Darci PoquetteGermanyIoni Bowcher UNQUALIFIED
Julie StensethUnited KingdomElwin Sharvill NEGOTIATION
Maisha RulapaughArgentinaElwin Sharvill NEW
Antonio CaudySpainBernardo Dominic PROPOSAL
Claire TollnerCanadaAnna Fali UNQUALIFIED
Claire TollnerJapanIvan Magalhaes UNQUALIFIED
Ashley DoeCanadaAsiya Javayant RENEWAL
Mayumi KolmetzJapanAsiya Javayant RENEWAL
Darci PoquetteSpainAnna Fali UNQUALIFIED
Jefferson SchemmerBrazilStephen Shaw UNQUALIFIED
Nicolas IturbideRussiaElwin Sharvill UNQUALIFIED
Wickens NestleFranceIvan Magalhaes PROPOSAL
Isabel BowleyItalyIvan Magalhaes NEW
Cody SaylorsJapanAnna Fali NEGOTIATION
Emily WhobreyFranceIvan Magalhaes RENEWAL
Juan WieserJapanElwin Sharvill UNQUALIFIED
Smith GlickArgentinaAmy Elsner NEGOTIATION
Kadeem FlosiItalyXuxue Feng RENEWAL
Mujtaba NickaAustraliaOnyama Limba NEW
Deepesh ChuiSpainAnna Fali RENEWAL
Aika InouyeFranceAsiya Javayant PROPOSAL
Faith GillianJapanXuxue Feng 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>