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
Maria MarrierItalyElwin Sharvill NEW
Claire TollnerFranceAsiya Javayant NEGOTIATION
Adams MorascaFranceIvan Magalhaes QUALIFIED
Smith GlickItalyAsiya Javayant RENEWAL
Maisha RulapaughAustraliaAnna Fali QUALIFIED
Ivar PaprockiBrazilBernardo Dominic QUALIFIED
Cody SaylorsIndiaOnyama Limba NEW
Nicolas IturbideArgentinaElwin Sharvill QUALIFIED
Kaitlin OstroskyUnited KingdomAmy Elsner PROPOSAL
Morrow RutaGermanyAnna Fali UNQUALIFIED
Nicolas IturbideFranceIvan Magalhaes RENEWAL
Stacey MacleadAustraliaOnyama Limba UNQUALIFIED
Aruna FigeroaItalyStephen Shaw NEGOTIATION
Greenwood BologniaArgentinaElwin Sharvill UNQUALIFIED
Mayumi KolmetzItalyAnna Fali PROPOSAL
Arvin AlbaresIndiaXuxue Feng NEGOTIATION
Maria MarrierJapanBernardo Dominic NEGOTIATION
Emily WhobreyGermanyOnyama Limba QUALIFIED
Ricardo GauchoRussiaXuxue Feng UNQUALIFIED
Aika InouyeCanadaIvan Magalhaes UNQUALIFIED
Francesco ShinkoItalyIvan Magalhaes PROPOSAL
Murillo MaletSpainIvan Magalhaes NEGOTIATION
Greenwood BologniaBrazilOnyama Limba RENEWAL
Misaki RoysterArgentinaBernardo Dominic UNQUALIFIED
Costa DilliardGermanyAmy Elsner NEGOTIATION
Octavia MaletItalyIoni Bowcher UNQUALIFIED
Izzy GarufiRussiaAsiya Javayant UNQUALIFIED
Darci PoquetteGermanyAmy Elsner NEGOTIATION
Adams MorascaUnited KingdomAnna Fali QUALIFIED
Ivar PaprockiSpainOnyama Limba QUALIFIED
Tony FollerGermanyBernardo Dominic RENEWAL
Jeanfrancois VenereJapanAmy Elsner NEW
Adams MorascaItalyIvan Magalhaes RENEWAL
Mujtaba NickaJapanIvan Magalhaes PROPOSAL
Smith GlickFranceAsiya Javayant RENEWAL
Cody SaylorsFranceXuxue Feng NEGOTIATION
Maisha RulapaughRussiaIvan Magalhaes UNQUALIFIED
Jeanfrancois VenereArgentinaAmy Elsner UNQUALIFIED
Greenwood BologniaJapanAmy Elsner NEW
Leja CaldareraUnited KingdomOnyama Limba QUALIFIED
Chavez BriddickCanadaStephen Shaw NEW
Izzy GarufiItalyAmy Elsner QUALIFIED
Rodrigues CampainBrazilIoni Bowcher NEGOTIATION
Silvio SlusarskiRussiaAsiya Javayant NEGOTIATION
Kadeem FlosiSpainAmy Elsner PROPOSAL
Sinclair WaycottJapanIoni Bowcher NEW
Leon OldroydItalyBernardo Dominic NEW
Darci PoquetteSpainXuxue Feng PROPOSAL
Clifford RimItalyAsiya Javayant NEW
Aditya KuskoItalyBernardo Dominic PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Costa DilliardFranceAnna Fali NEGOTIATION
Clifford RimGermanyBernardo Dominic UNQUALIFIED
Julie StensethUnited KingdomIvan Magalhaes NEW
Rodrigues CampainFranceAsiya Javayant NEW
Kaitlin OstroskyCanadaStephen Shaw NEGOTIATION
Jennifer AmigonItalyIvan Magalhaes NEW
Cody SaylorsArgentinaXuxue Feng UNQUALIFIED
Jefferson SchemmerIndiaAnna Fali QUALIFIED
Jennifer AmigonJapanStephen Shaw UNQUALIFIED
Mujtaba NickaCanadaStephen Shaw RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aditya KuskoUnited Kingdom2026-04-13Commercial Press NEW24Asiya Javayant
1001Claire TollnerCanada2026-04-28Feltz Printing Service UNQUALIFIED51Ivan Magalhaes
1002Kaitlin OstroskyRussia2026-05-01Chapman, Ross E Esq UNQUALIFIED3Ivan Magalhaes
1003Misaki RoysterGermany2026-04-26Chanay, Jeffrey A Esq NEW81Asiya Javayant
1004Jefferson SchemmerSpain2026-04-14Feltz Printing Service PROPOSAL96Onyama Limba
1005Kaitlin OstroskyJapan2026-04-18King, Christopher A Esq NEGOTIATION35Xuxue Feng
1006Mayumi KolmetzGermany2026-04-09Chapman, Ross E Esq QUALIFIED3Bernardo Dominic
1007Francesco ShinkoCanada2026-04-25Chapman, Ross E Esq RENEWAL61Anna Fali
1008Antonio CaudyIndia2026-04-30Dorl, James J Esq RENEWAL16Bernardo Dominic
1009Misaki RoysterBrazil2026-04-24Feltz Printing Service RENEWAL73Asiya Javayant
1010Kadeem FlosiArgentina2026-05-02Dorl, James J Esq QUALIFIED83Ioni Bowcher
1011David DarakjyFrance2026-04-27Dorl, James J Esq NEGOTIATION69Ivan Magalhaes
1012Costa DilliardAustralia2026-05-02Commercial Press RENEWAL58Ivan Magalhaes
1013Deepesh ChuiGermany2026-04-15Feltz Printing Service PROPOSAL18Asiya Javayant
1014Arvin AlbaresJapan2026-04-26Chanay, Jeffrey A Esq NEW52Anna Fali
1015Rodrigues CampainBrazil2026-04-19Feltz Printing Service RENEWAL86Ioni Bowcher
1016Nicolas IturbideJapan2026-04-12Dorl, James J Esq PROPOSAL27Bernardo Dominic
1017Ivar PaprockiJapan2026-04-28Rousseaux, Michael Esq NEGOTIATION75Amy Elsner
1018Nicolas IturbideSpain2026-04-17Commercial Press QUALIFIED86Ivan Magalhaes
1019Jefferson SchemmerSpain2026-04-29Rangoni Of Florence UNQUALIFIED71Onyama Limba
1020Claire TollnerCanada2026-04-16Morlong Associates UNQUALIFIED21Xuxue Feng
1021Wickens NestleItaly2026-04-15Chemel, James L Cpa PROPOSAL92Anna Fali
1022Greenwood BologniaItaly2026-04-09Buckley Miller Wright NEW25Elwin Sharvill
1023Leja CaldareraCanada2026-04-14Chemel, James L Cpa NEGOTIATION62Ioni Bowcher
1024Leon OldroydRussia2026-04-25Printing Dimensions NEGOTIATION7Elwin Sharvill
1025Misaki RoysterUnited Kingdom2026-05-08Chemel, James L Cpa NEW99Ivan Magalhaes
1026Stacey MacleadArgentina2026-05-01Feiner Bros QUALIFIED82Elwin Sharvill
1027Wickens NestleItaly2026-04-17Printing Dimensions QUALIFIED3Xuxue Feng
1028Aditya KuskoRussia2026-04-14Printing Dimensions NEGOTIATION38Stephen Shaw
1029Emily WhobreyBrazil2026-04-26Commercial Press UNQUALIFIED8Anna Fali
1030Sinclair WaycottCanada2026-04-26Chapman, Ross E Esq PROPOSAL66Asiya Javayant
1031Misaki RoysterJapan2026-04-19Benton, John B Jr QUALIFIED52Stephen Shaw
1032Leja CaldareraArgentina2026-04-24Commercial Press RENEWAL44Ioni Bowcher
1033Kaitlin OstroskyJapan2026-04-22Truhlar And Truhlar Attys NEGOTIATION45Asiya Javayant
1034Mayumi KolmetzIndia2026-04-23Feiner Bros PROPOSAL46Amy Elsner
1035David DarakjyIndia2026-04-16Rousseaux, Michael Esq RENEWAL95Ioni Bowcher
1036Nicolas IturbideGermany2026-04-21Morlong Associates UNQUALIFIED18Amy Elsner
1037Darci PoquetteItaly2026-04-12Benton, John B Jr QUALIFIED51Anna Fali
1038Smith GlickJapan2026-04-26Rangoni Of Florence UNQUALIFIED85Ioni Bowcher
1039Murillo MaletGermany2026-04-19Dorl, James J Esq QUALIFIED67Asiya Javayant
1040Stacey MacleadGermany2026-04-21Dorl, James J Esq NEGOTIATION4Bernardo Dominic
1041Smith GlickSpain2026-05-02Benton, John B Jr PROPOSAL60Onyama Limba
1042Costa DilliardSpain2026-04-27Chanay, Jeffrey A Esq NEGOTIATION30Anna Fali
1043Emily WhobreyAustralia2026-04-23Buckley Miller Wright NEW72Onyama Limba
1044Kaitlin OstroskyGermany2026-04-26Feltz Printing Service PROPOSAL38Xuxue Feng
1045Juan WieserRussia2026-04-22King, Christopher A Esq NEW45Amy Elsner
1046Aditya KuskoRussia2026-04-26Feltz Printing Service UNQUALIFIED25Ivan Magalhaes
1047Ashley DoeIndia2026-04-15Feiner Bros PROPOSAL81Onyama Limba
1048Johnson SergiArgentina2026-05-02Feltz Printing Service RENEWAL16Xuxue Feng
1049Morrow RutaArgentina2026-05-03Printing Dimensions NEGOTIATION89Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Chavez BriddickArgentinaXuxue Feng PROPOSAL
Kadeem FlosiArgentinaAsiya Javayant UNQUALIFIED
Chavez BriddickUnited KingdomBernardo Dominic NEW
Claire TollnerGermanyAmy Elsner RENEWAL
Cody SaylorsRussiaAnna Fali QUALIFIED
Faith GillianIndiaIoni Bowcher RENEWAL
Arvin AlbaresAustraliaIoni Bowcher QUALIFIED
Wickens NestleBrazilXuxue Feng RENEWAL
Darci PoquetteCanadaBernardo Dominic QUALIFIED
Antonio CaudyItalyOnyama Limba PROPOSAL
Deepesh ChuiIndiaXuxue Feng PROPOSAL
Ashley DoeUnited KingdomIoni Bowcher NEW
Juan WieserBrazilAnna Fali NEW
Misaki RoysterArgentinaIoni Bowcher NEGOTIATION
Isabel BowleyCanadaOnyama Limba UNQUALIFIED
Ricardo GauchoFranceOnyama Limba RENEWAL
Antonio CaudyArgentinaIoni Bowcher QUALIFIED
Jeanfrancois VenereSpainAmy Elsner UNQUALIFIED
Alejandro PerinArgentinaIvan Magalhaes PROPOSAL
Costa DilliardAustraliaIvan Magalhaes UNQUALIFIED
Jones VocelkaAustraliaStephen Shaw NEW
Johnson SergiArgentinaStephen Shaw RENEWAL
David DarakjyBrazilStephen Shaw RENEWAL
Mujtaba NickaCanadaAsiya Javayant RENEWAL
Izzy GarufiArgentinaAmy Elsner QUALIFIED
Leon OldroydAustraliaAsiya Javayant UNQUALIFIED
Morrow RutaIndiaOnyama Limba RENEWAL
Antonio CaudyBrazilOnyama Limba NEW
Mayumi KolmetzRussiaOnyama Limba UNQUALIFIED
Octavia MaletFranceXuxue Feng RENEWAL
Clifford RimCanadaIoni Bowcher RENEWAL
Leja CaldareraSpainBernardo Dominic NEW
Clifford RimFranceAnna Fali NEGOTIATION
Adams MorascaJapanElwin Sharvill UNQUALIFIED
Francesco ShinkoRussiaBernardo Dominic RENEWAL
Morrow RutaAustraliaXuxue Feng UNQUALIFIED
Chavez BriddickGermanyAnna Fali UNQUALIFIED
Sinclair WaycottItalyXuxue Feng UNQUALIFIED
Octavia MaletAustraliaOnyama Limba NEGOTIATION
Jefferson SchemmerCanadaAsiya Javayant RENEWAL
Aruna FigeroaAustraliaAmy Elsner NEW
Cody SaylorsBrazilAmy Elsner NEW
Faith GillianGermanyOnyama Limba RENEWAL
Salvatore StockhamJapanIvan Magalhaes UNQUALIFIED
Jones VocelkaIndiaIvan Magalhaes PROPOSAL
Murillo MaletAustraliaAnna Fali NEW
Ivar PaprockiFranceAmy Elsner UNQUALIFIED
David DarakjyItalyIoni Bowcher NEGOTIATION
Ashley DoeArgentinaBernardo Dominic QUALIFIED
Izzy GarufiCanadaOnyama Limba NEW
Frozen Columns
Name
Mayumi Kolmetz
Emily Whobrey
Leja Caldarera
Wickens Nestle
Clifford Rim
James Butt
Clifford Rim
Deepesh Chui
Claire Tollner
Leon Oldroyd
Cody Saylors
Cody Saylors
Alejandro Perin
Chavez Briddick
Cody Saylors
Greenwood Bolognia
Arvin Albares
Jones Vocelka
Rodrigues Campain
Ivar Paprocki
Greenwood Bolognia
Alejandro Perin
Smith Glick
Aditya Kusko
Emily Whobrey
Munro Ferencz
Wickens Nestle
David Darakjy
Salvatore Stockham
Sinclair Waycott
Jefferson Schemmer
Kaitlin Ostrosky
Chavez Briddick
Juan Wieser
Juan Wieser
Aruna Figeroa
James Butt
Ashley Doe
Wickens Nestle
Jefferson Schemmer
Antonio Caudy
Leja Caldarera
Sinclair Waycott
James Butt
Claire Tollner
Mayumi Kolmetz
Arvin Albares
Aika Inouye
Claire Tollner
Rodrigues Campain
IdCountryDate
1000Russia2026-04-18
1001Japan2026-05-07
1002Canada2026-05-08
1003Brazil2026-04-25
1004India2026-04-26
1005Argentina2026-04-26
1006Italy2026-05-03
1007Argentina2026-04-16
1008France2026-04-26
1009Brazil2026-04-09
1010Russia2026-04-29
1011Canada2026-04-18
1012Germany2026-04-19
1013Argentina2026-04-16
1014Italy2026-05-07
1015India2026-05-07
1016Canada2026-04-13
1017Italy2026-05-08
1018Germany2026-04-30
1019France2026-04-19
1020United Kingdom2026-04-30
1021Japan2026-05-04
1022Canada2026-04-28
1023Germany2026-05-07
1024Spain2026-04-29
1025United Kingdom2026-04-14
1026Canada2026-04-28
1027Spain2026-04-12
1028Brazil2026-04-09
1029Japan2026-04-27
1030Italy2026-04-09
1031Germany2026-04-13
1032Russia2026-05-01
1033Japan2026-04-18
1034France2026-05-07
1035Germany2026-04-16
1036United Kingdom2026-05-05
1037Japan2026-05-04
1038Canada2026-04-30
1039Australia2026-04-12
1040Argentina2026-04-21
1041Brazil2026-04-27
1042Brazil2026-04-10
1043Germany2026-04-30
1044Brazil2026-05-02
1045Australia2026-04-10
1046Germany2026-05-07
1047United Kingdom2026-05-08
1048Japan2026-04-20
1049Argentina2026-05-03

On-Demand Data

NameIdCountryDate
Wickens Nestle1000Germany2026-04-20
Francesco Shinko1001Brazil2026-04-22
Adams Morasca1002India2026-04-30
Antonio Caudy1003Spain2026-04-21
Stacey Maclead1004France2026-04-14
Silvio Slusarski1005Brazil2026-04-25
James Butt1006Germany2026-04-16
Murillo Malet1007Italy2026-04-12
Ivar Paprocki1008Spain2026-05-07
Jones Vocelka1009Brazil2026-04-25
Cody Saylors1010Italy2026-04-27
Ashley Doe1011India2026-05-02
Johnson Sergi1012Brazil2026-04-17
Costa Dilliard1013Italy2026-04-25
Jeanfrancois Venere1014Spain2026-04-19
Cody Saylors1015Russia2026-04-17
Darci Poquette1016Italy2026-04-10
Juan Wieser1017Japan2026-04-27
Costa Dilliard1018Spain2026-04-17
Silvio Slusarski1019Argentina2026-05-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Sinclair WaycottAustraliaElwin Sharvill NEGOTIATION
Leja CaldareraUnited KingdomAnna Fali NEGOTIATION
Darci PoquetteGermanyAmy Elsner PROPOSAL
Costa DilliardGermanyXuxue Feng QUALIFIED
Kadeem FlosiJapanOnyama Limba RENEWAL
Salvatore StockhamItalyBernardo Dominic PROPOSAL
Jeanfrancois VenereIndiaXuxue Feng NEGOTIATION
Morrow RutaCanadaStephen Shaw PROPOSAL
Misaki RoysterBrazilElwin Sharvill NEGOTIATION
Nicolas IturbideSpainStephen Shaw NEGOTIATION
Adams MorascaUnited KingdomAnna Fali RENEWAL
Antonio CaudyItalyAnna Fali QUALIFIED
Aruna FigeroaAustraliaStephen Shaw PROPOSAL
Morrow RutaAustraliaBernardo Dominic QUALIFIED
Aruna FigeroaUnited KingdomBernardo Dominic NEGOTIATION
Tony FollerIndiaIvan Magalhaes UNQUALIFIED
Salvatore StockhamAustraliaAnna Fali PROPOSAL
Darci PoquetteIndiaAsiya Javayant QUALIFIED
James ButtAustraliaIoni Bowcher QUALIFIED
Greenwood BologniaCanadaIoni Bowcher RENEWAL
Octavia MaletArgentinaIoni Bowcher UNQUALIFIED
Jennifer AmigonUnited KingdomIvan Magalhaes NEW
Octavia MaletItalyAnna Fali UNQUALIFIED
Adams MorascaRussiaAmy Elsner UNQUALIFIED
Morrow RutaUnited KingdomOnyama Limba PROPOSAL
Rodrigues CampainFranceIvan Magalhaes RENEWAL
Juan WieserItalyOnyama Limba PROPOSAL
Clifford RimItalyAmy Elsner NEW
Isabel BowleyUnited KingdomStephen Shaw UNQUALIFIED
Juan WieserArgentinaXuxue Feng NEW
Kadeem FlosiJapanStephen Shaw QUALIFIED
Jones VocelkaAustraliaAnna Fali UNQUALIFIED
Ivar PaprockiBrazilIvan Magalhaes UNQUALIFIED
Ashley DoeJapanIvan Magalhaes NEGOTIATION
Julie StensethJapanXuxue Feng PROPOSAL
Jennifer AmigonArgentinaBernardo Dominic PROPOSAL
Smith GlickIndiaAnna Fali PROPOSAL
Munro FerenczGermanyOnyama Limba UNQUALIFIED
Adams MorascaCanadaAmy Elsner RENEWAL
Aruna FigeroaFranceAnna Fali PROPOSAL

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