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
Jones VocelkaGermanyOnyama Limba QUALIFIED
Maria MarrierFranceIvan Magalhaes RENEWAL
Misaki RoysterItalyOnyama Limba NEGOTIATION
Aruna FigeroaArgentinaIvan Magalhaes UNQUALIFIED
Octavia MaletCanadaOnyama Limba QUALIFIED
Smith GlickAustraliaBernardo Dominic QUALIFIED
Kaitlin OstroskyRussiaElwin Sharvill PROPOSAL
Antonio CaudyItalyStephen Shaw QUALIFIED
Salvatore StockhamFranceIvan Magalhaes PROPOSAL
Antonio CaudyGermanyBernardo Dominic PROPOSAL
Kaitlin OstroskyItalyIoni Bowcher RENEWAL
Kadeem FlosiAustraliaIoni Bowcher QUALIFIED
Silvio SlusarskiArgentinaElwin Sharvill RENEWAL
Darci PoquetteJapanAnna Fali RENEWAL
Emily WhobreyFranceElwin Sharvill UNQUALIFIED
Izzy GarufiGermanyBernardo Dominic NEGOTIATION
Julie StensethAustraliaAsiya Javayant UNQUALIFIED
Chavez BriddickGermanyOnyama Limba UNQUALIFIED
Mujtaba NickaUnited KingdomIoni Bowcher PROPOSAL
Clifford RimSpainBernardo Dominic NEGOTIATION
Jefferson SchemmerRussiaIvan Magalhaes RENEWAL
Juan WieserIndiaAsiya Javayant NEGOTIATION
Munro FerenczFranceAnna Fali UNQUALIFIED
Johnson SergiGermanyElwin Sharvill UNQUALIFIED
Smith GlickArgentinaAsiya Javayant PROPOSAL
James ButtArgentinaAmy Elsner UNQUALIFIED
Aditya KuskoBrazilStephen Shaw QUALIFIED
Rodrigues CampainArgentinaOnyama Limba NEGOTIATION
Greenwood BologniaBrazilBernardo Dominic NEGOTIATION
Julie StensethUnited KingdomAnna Fali QUALIFIED
Aditya KuskoRussiaIoni Bowcher NEW
Aruna FigeroaSpainAnna Fali QUALIFIED
Costa DilliardUnited KingdomXuxue Feng NEGOTIATION
Jeanfrancois VenereBrazilStephen Shaw UNQUALIFIED
Adams MorascaSpainElwin Sharvill PROPOSAL
Rodrigues CampainArgentinaElwin Sharvill NEW
Leja CaldareraArgentinaIoni Bowcher QUALIFIED
Wickens NestleItalyXuxue Feng NEGOTIATION
Francesco ShinkoBrazilAmy Elsner NEGOTIATION
Sinclair WaycottFranceOnyama Limba UNQUALIFIED
Maria MarrierJapanBernardo Dominic QUALIFIED
Morrow RutaCanadaStephen Shaw NEW
Stacey MacleadArgentinaStephen Shaw NEGOTIATION
Leja CaldareraUnited KingdomAmy Elsner NEGOTIATION
Faith GillianSpainIvan Magalhaes UNQUALIFIED
Izzy GarufiUnited KingdomAmy Elsner NEW
Nicolas IturbideSpainElwin Sharvill NEGOTIATION
Francesco ShinkoBrazilBernardo Dominic UNQUALIFIED
Darci PoquetteBrazilAmy Elsner QUALIFIED
Aika InouyeFranceIvan Magalhaes RENEWAL
Horizontal
NameCountryRepresentativeStatus
Jennifer AmigonBrazilIoni Bowcher NEW
Deepesh ChuiArgentinaAmy Elsner QUALIFIED
Aruna FigeroaItalyOnyama Limba RENEWAL
Costa DilliardArgentinaOnyama Limba NEW
Faith GillianArgentinaIvan Magalhaes RENEWAL
David DarakjyRussiaElwin Sharvill UNQUALIFIED
Alejandro PerinGermanyAmy Elsner NEGOTIATION
Kaitlin OstroskyFranceOnyama Limba NEW
Maria MarrierArgentinaBernardo Dominic UNQUALIFIED
Ashley DoeGermanyIoni Bowcher NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Izzy GarufiJapan2026-04-25Chapman, Ross E Esq NEGOTIATION66Ivan Magalhaes
1001Faith GillianGermany2026-04-26Morlong Associates NEW10Bernardo Dominic
1002Sinclair WaycottAustralia2026-04-21Buckley Miller Wright PROPOSAL11Ivan Magalhaes
1003Octavia MaletGermany2026-04-24Chanay, Jeffrey A Esq QUALIFIED22Elwin Sharvill
1004Salvatore StockhamFrance2026-03-29Commercial Press RENEWAL76Asiya Javayant
1005Salvatore StockhamItaly2026-04-14Buckley Miller Wright RENEWAL45Elwin Sharvill
1006Julie StensethIndia2026-04-23King, Christopher A Esq PROPOSAL27Anna Fali
1007Ivar PaprockiIndia2026-04-17Rangoni Of Florence UNQUALIFIED29Xuxue Feng
1008Mayumi KolmetzJapan2026-04-12Printing Dimensions RENEWAL37Elwin Sharvill
1009Tony FollerCanada2026-04-20Dorl, James J Esq UNQUALIFIED29Ioni Bowcher
1010Leon OldroydRussia2026-04-09Chanay, Jeffrey A Esq RENEWAL11Elwin Sharvill
1011Aika InouyeBrazil2026-04-21Rousseaux, Michael Esq UNQUALIFIED5Onyama Limba
1012Costa DilliardItaly2026-04-23Feiner Bros NEW83Stephen Shaw
1013Mayumi KolmetzJapan2026-04-10Commercial Press PROPOSAL94Ioni Bowcher
1014Stacey MacleadArgentina2026-04-15Benton, John B Jr PROPOSAL54Onyama Limba
1015Kadeem FlosiUnited Kingdom2026-04-05King, Christopher A Esq QUALIFIED5Onyama Limba
1016Claire TollnerBrazil2026-04-25Chemel, James L Cpa RENEWAL47Ioni Bowcher
1017Jennifer AmigonJapan2026-04-02Chemel, James L Cpa QUALIFIED26Ivan Magalhaes
1018Leja CaldareraFrance2026-04-14Feiner Bros PROPOSAL5Ioni Bowcher
1019Johnson SergiCanada2026-03-29Morlong Associates QUALIFIED14Ioni Bowcher
1020Murillo MaletGermany2026-04-14King, Christopher A Esq PROPOSAL16Xuxue Feng
1021Aika InouyeSpain2026-04-15Rangoni Of Florence PROPOSAL95Elwin Sharvill
1022Leon OldroydItaly2026-04-20Rangoni Of Florence NEGOTIATION36Ivan Magalhaes
1023Jones VocelkaItaly2026-04-10King, Christopher A Esq PROPOSAL5Xuxue Feng
1024Leja CaldareraJapan2026-04-22Dorl, James J Esq NEW72Onyama Limba
1025Adams MorascaJapan2026-04-17Chemel, James L Cpa NEW90Ioni Bowcher
1026Tony FollerRussia2026-04-17Commercial Press NEW45Anna Fali
1027Ricardo GauchoRussia2026-04-15Dorl, James J Esq PROPOSAL31Amy Elsner
1028Kaitlin OstroskyGermany2026-04-26Chanay, Jeffrey A Esq NEGOTIATION17Amy Elsner
1029Francesco ShinkoAustralia2026-04-01King, Christopher A Esq UNQUALIFIED15Ivan Magalhaes
1030Octavia MaletCanada2026-04-18Rousseaux, Michael Esq NEW78Stephen Shaw
1031Aruna FigeroaArgentina2026-04-23Rousseaux, Michael Esq QUALIFIED73Anna Fali
1032Mujtaba NickaRussia2026-04-19Feltz Printing Service RENEWAL21Bernardo Dominic
1033Misaki RoysterFrance2026-04-10Chapman, Ross E Esq UNQUALIFIED40Stephen Shaw
1034Maria MarrierAustralia2026-04-13King, Christopher A Esq NEGOTIATION20Ivan Magalhaes
1035Jefferson SchemmerUnited Kingdom2026-04-24Buckley Miller Wright RENEWAL97Ivan Magalhaes
1036Jeanfrancois VenereIndia2026-04-19Chanay, Jeffrey A Esq RENEWAL99Elwin Sharvill
1037Johnson SergiSpain2026-04-25Chemel, James L Cpa NEGOTIATION12Elwin Sharvill
1038James ButtFrance2026-04-13Truhlar And Truhlar Attys QUALIFIED2Elwin Sharvill
1039Stacey MacleadItaly2026-04-25Feltz Printing Service NEW67Bernardo Dominic
1040Antonio CaudyBrazil2026-04-08Benton, John B Jr NEGOTIATION50Stephen Shaw
1041Darci PoquetteSpain2026-04-14Truhlar And Truhlar Attys NEW79Amy Elsner
1042Leja CaldareraArgentina2026-04-12Buckley Miller Wright QUALIFIED55Bernardo Dominic
1043Mayumi KolmetzItaly2026-04-10Feltz Printing Service PROPOSAL61Amy Elsner
1044Clifford RimGermany2026-04-15Rousseaux, Michael Esq NEW45Anna Fali
1045Munro FerenczIndia2026-04-14Rangoni Of Florence NEGOTIATION42Elwin Sharvill
1046Nicolas IturbideGermany2026-04-05Printing Dimensions RENEWAL83Bernardo Dominic
1047James ButtRussia2026-04-18King, Christopher A Esq NEW91Onyama Limba
1048Isabel BowleyGermany2026-04-10Morlong Associates QUALIFIED41Xuxue Feng
1049Smith GlickUnited Kingdom2026-04-22Benton, John B Jr NEW18Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Mayumi KolmetzCanadaElwin Sharvill PROPOSAL
Sinclair WaycottItalyBernardo Dominic QUALIFIED
Isabel BowleyUnited KingdomBernardo Dominic UNQUALIFIED
Aditya KuskoBrazilAmy Elsner QUALIFIED
Misaki RoysterIndiaElwin Sharvill PROPOSAL
Stacey MacleadFranceXuxue Feng QUALIFIED
Clifford RimAustraliaAmy Elsner NEW
Darci PoquetteItalyElwin Sharvill QUALIFIED
Maria MarrierSpainAsiya Javayant NEW
Juan WieserRussiaAmy Elsner NEGOTIATION
Antonio CaudyAustraliaAmy Elsner UNQUALIFIED
Faith GillianAustraliaBernardo Dominic PROPOSAL
Clifford RimIndiaElwin Sharvill NEGOTIATION
Maria MarrierUnited KingdomXuxue Feng RENEWAL
Misaki RoysterItalyStephen Shaw NEW
Darci PoquetteRussiaBernardo Dominic NEW
Nicolas IturbideAustraliaXuxue Feng QUALIFIED
Ricardo GauchoCanadaAmy Elsner RENEWAL
Aika InouyeBrazilAmy Elsner QUALIFIED
Jeanfrancois VenereUnited KingdomAsiya Javayant PROPOSAL
Chavez BriddickBrazilXuxue Feng QUALIFIED
James ButtFranceOnyama Limba NEGOTIATION
Murillo MaletAustraliaIvan Magalhaes PROPOSAL
Darci PoquetteCanadaIoni Bowcher PROPOSAL
Chavez BriddickUnited KingdomXuxue Feng NEW
Cody SaylorsFranceIvan Magalhaes NEGOTIATION
David DarakjyRussiaAnna Fali PROPOSAL
Ivar PaprockiJapanXuxue Feng UNQUALIFIED
Rodrigues CampainJapanOnyama Limba NEW
Claire TollnerItalyAsiya Javayant UNQUALIFIED
Morrow RutaArgentinaOnyama Limba UNQUALIFIED
Stacey MacleadBrazilIvan Magalhaes PROPOSAL
Munro FerenczIndiaIoni Bowcher RENEWAL
Kadeem FlosiIndiaElwin Sharvill QUALIFIED
James ButtRussiaStephen Shaw RENEWAL
Antonio CaudyArgentinaStephen Shaw NEW
Greenwood BologniaIndiaStephen Shaw RENEWAL
Chavez BriddickGermanyAnna Fali PROPOSAL
Adams MorascaIndiaIvan Magalhaes PROPOSAL
James ButtUnited KingdomAsiya Javayant RENEWAL
Wickens NestleFranceStephen Shaw NEGOTIATION
Isabel BowleyCanadaAsiya Javayant PROPOSAL
Johnson SergiItalyAnna Fali RENEWAL
Murillo MaletUnited KingdomXuxue Feng NEW
Faith GillianUnited KingdomAnna Fali RENEWAL
Clifford RimItalyOnyama Limba QUALIFIED
Juan WieserRussiaXuxue Feng UNQUALIFIED
Claire TollnerFranceElwin Sharvill NEGOTIATION
Rodrigues CampainUnited KingdomElwin Sharvill NEGOTIATION
Maisha RulapaughFranceOnyama Limba RENEWAL
Frozen Columns
Name
Aruna Figeroa
Leja Caldarera
Cody Saylors
Mayumi Kolmetz
Greenwood Bolognia
James Butt
Darci Poquette
James Butt
Morrow Ruta
Greenwood Bolognia
Clifford Rim
Ricardo Gaucho
Deepesh Chui
Tony Foller
Maria Marrier
David Darakjy
Rodrigues Campain
Ivar Paprocki
Sinclair Waycott
Claire Tollner
Julie Stenseth
Faith Gillian
Darci Poquette
Chavez Briddick
Chavez Briddick
James Butt
Jefferson Schemmer
Silvio Slusarski
Jennifer Amigon
James Butt
Darci Poquette
Julie Stenseth
Costa Dilliard
Cody Saylors
Deepesh Chui
Adams Morasca
Wickens Nestle
Wickens Nestle
Jennifer Amigon
Stacey Maclead
Leja Caldarera
Ashley Doe
Alejandro Perin
Munro Ferencz
Chavez Briddick
Faith Gillian
Alejandro Perin
Mayumi Kolmetz
James Butt
Ashley Doe
IdCountryDate
1000Canada2026-04-03
1001France2026-04-01
1002France2026-04-14
1003Argentina2026-04-10
1004Brazil2026-04-13
1005Canada2026-04-20
1006Japan2026-03-29
1007Argentina2026-04-08
1008India2026-04-07
1009Germany2026-04-25
1010Japan2026-04-01
1011Japan2026-04-15
1012Japan2026-04-23
1013United Kingdom2026-04-04
1014Australia2026-04-27
1015Italy2026-04-20
1016Spain2026-04-25
1017Australia2026-04-17
1018France2026-04-11
1019Australia2026-04-18
1020Brazil2026-04-11
1021Australia2026-04-21
1022Russia2026-04-03
1023Japan2026-04-19
1024Brazil2026-04-15
1025United Kingdom2026-04-09
1026France2026-03-29
1027India2026-04-14
1028Argentina2026-04-19
1029Germany2026-04-01
1030Germany2026-04-11
1031Japan2026-04-07
1032France2026-04-05
1033Canada2026-04-25
1034Japan2026-04-05
1035United Kingdom2026-04-11
1036United Kingdom2026-04-19
1037India2026-04-22
1038Spain2026-04-21
1039Spain2026-03-31
1040Russia2026-04-10
1041Spain2026-04-16
1042Spain2026-04-15
1043Germany2026-04-16
1044Australia2026-04-06
1045United Kingdom2026-04-24
1046Spain2026-04-12
1047Argentina2026-03-31
1048Argentina2026-04-16
1049India2026-03-30

On-Demand Data

NameIdCountryDate
Rodrigues Campain1000Brazil2026-04-25
Ricardo Gaucho1001India2026-04-14
Deepesh Chui1002Argentina2026-04-23
Izzy Garufi1003France2026-04-24
Clifford Rim1004Canada2026-04-15
Jones Vocelka1005United Kingdom2026-04-26
Tony Foller1006France2026-04-05
Murillo Malet1007France2026-04-20
Smith Glick1008Spain2026-04-04
Murillo Malet1009India2026-04-05
Rodrigues Campain1010Italy2026-04-24
Claire Tollner1011Argentina2026-04-15
David Darakjy1012Italy2026-04-06
Adams Morasca1013Brazil2026-04-17
Antonio Caudy1014Spain2026-04-19
Isabel Bowley1015France2026-04-26
Deepesh Chui1016Argentina2026-03-30
Jeanfrancois Venere1017Argentina2026-04-13
Ricardo Gaucho1018Brazil2026-04-17
Salvatore Stockham1019Italy2026-04-18
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Clifford RimFranceAnna Fali NEGOTIATION
Adams MorascaIndiaAnna Fali PROPOSAL
Ivar PaprockiIndiaAnna Fali NEGOTIATION
Jeanfrancois VenereGermanyOnyama Limba NEW
Aditya KuskoGermanyAnna Fali RENEWAL
Julie StensethUnited KingdomBernardo Dominic PROPOSAL
Aruna FigeroaCanadaIvan Magalhaes PROPOSAL
Munro FerenczSpainXuxue Feng NEW
Johnson SergiFranceStephen Shaw QUALIFIED
Stacey MacleadRussiaIoni Bowcher PROPOSAL
Francesco ShinkoGermanyAnna Fali NEGOTIATION
Costa DilliardRussiaBernardo Dominic RENEWAL
Faith GillianFranceIoni Bowcher UNQUALIFIED
Misaki RoysterBrazilAnna Fali RENEWAL
Ashley DoeArgentinaBernardo Dominic PROPOSAL
Leon OldroydCanadaXuxue Feng UNQUALIFIED
David DarakjyJapanAmy Elsner UNQUALIFIED
Emily WhobreyUnited KingdomXuxue Feng UNQUALIFIED
Cody SaylorsSpainIoni Bowcher RENEWAL
Jennifer AmigonAustraliaIvan Magalhaes UNQUALIFIED
Julie StensethSpainElwin Sharvill QUALIFIED
Smith GlickArgentinaIvan Magalhaes UNQUALIFIED
Antonio CaudyGermanyOnyama Limba NEW
Misaki RoysterRussiaAmy Elsner NEW
Adams MorascaAustraliaIoni Bowcher UNQUALIFIED
Stacey MacleadFranceAmy Elsner QUALIFIED
Munro FerenczUnited KingdomIoni Bowcher UNQUALIFIED
Jefferson SchemmerArgentinaStephen Shaw PROPOSAL
Costa DilliardRussiaAmy Elsner UNQUALIFIED
Adams MorascaUnited KingdomStephen Shaw UNQUALIFIED
Emily WhobreyItalyIoni Bowcher UNQUALIFIED
Greenwood BologniaIndiaAsiya Javayant RENEWAL
Maisha RulapaughBrazilBernardo Dominic NEGOTIATION
Misaki RoysterArgentinaOnyama Limba RENEWAL
Julie StensethBrazilAnna Fali UNQUALIFIED
Mayumi KolmetzGermanyIvan Magalhaes RENEWAL
Maisha RulapaughAustraliaBernardo Dominic NEGOTIATION
Claire TollnerUnited KingdomOnyama Limba QUALIFIED
Salvatore StockhamUnited KingdomBernardo Dominic NEGOTIATION
Clifford RimGermanyIoni 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>