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
Alejandro PerinFranceElwin Sharvill PROPOSAL
Chavez BriddickAustraliaAsiya Javayant NEGOTIATION
Octavia MaletAustraliaOnyama Limba QUALIFIED
Maisha RulapaughJapanBernardo Dominic UNQUALIFIED
Maria MarrierBrazilAnna Fali PROPOSAL
Faith GillianGermanyElwin Sharvill UNQUALIFIED
Aika InouyeFranceElwin Sharvill QUALIFIED
Morrow RutaGermanyXuxue Feng PROPOSAL
Chavez BriddickArgentinaAsiya Javayant RENEWAL
Deepesh ChuiSpainOnyama Limba UNQUALIFIED
Jones VocelkaItalyAmy Elsner UNQUALIFIED
Octavia MaletItalyAnna Fali RENEWAL
Mujtaba NickaArgentinaXuxue Feng PROPOSAL
Misaki RoysterUnited KingdomBernardo Dominic PROPOSAL
Misaki RoysterIndiaAsiya Javayant QUALIFIED
Claire TollnerSpainOnyama Limba UNQUALIFIED
Greenwood BologniaBrazilAnna Fali UNQUALIFIED
James ButtRussiaStephen Shaw RENEWAL
Claire TollnerCanadaAnna Fali RENEWAL
Arvin AlbaresUnited KingdomAsiya Javayant UNQUALIFIED
Izzy GarufiFranceAmy Elsner PROPOSAL
Octavia MaletUnited KingdomBernardo Dominic PROPOSAL
Darci PoquetteArgentinaIvan Magalhaes RENEWAL
Antonio CaudyArgentinaBernardo Dominic NEGOTIATION
Juan WieserRussiaAnna Fali UNQUALIFIED
Jones VocelkaRussiaIvan Magalhaes NEGOTIATION
Aika InouyeRussiaXuxue Feng RENEWAL
Smith GlickCanadaIoni Bowcher RENEWAL
Antonio CaudyCanadaAmy Elsner PROPOSAL
Sinclair WaycottRussiaXuxue Feng PROPOSAL
Deepesh ChuiJapanBernardo Dominic UNQUALIFIED
Ricardo GauchoItalyBernardo Dominic QUALIFIED
Murillo MaletIndiaBernardo Dominic QUALIFIED
Morrow RutaCanadaElwin Sharvill NEGOTIATION
Claire TollnerGermanyBernardo Dominic PROPOSAL
Julie StensethItalyStephen Shaw PROPOSAL
Costa DilliardItalyIoni Bowcher NEW
Antonio CaudyBrazilXuxue Feng RENEWAL
Sinclair WaycottArgentinaIvan Magalhaes RENEWAL
Wickens NestleBrazilIoni Bowcher PROPOSAL
Julie StensethRussiaIoni Bowcher PROPOSAL
Juan WieserJapanIoni Bowcher NEW
Isabel BowleyGermanyOnyama Limba NEGOTIATION
Nicolas IturbideArgentinaElwin Sharvill RENEWAL
Ashley DoeCanadaXuxue Feng UNQUALIFIED
Izzy GarufiAustraliaStephen Shaw NEGOTIATION
Ricardo GauchoFranceBernardo Dominic UNQUALIFIED
Izzy GarufiIndiaElwin Sharvill RENEWAL
Morrow RutaUnited KingdomStephen Shaw RENEWAL
Alejandro PerinIndiaAnna Fali NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Jeanfrancois VenereCanadaAmy Elsner RENEWAL
Wickens NestleCanadaAnna Fali RENEWAL
James ButtGermanyOnyama Limba NEW
Kaitlin OstroskyUnited KingdomStephen Shaw PROPOSAL
Jeanfrancois VenereItalyXuxue Feng PROPOSAL
Jeanfrancois VenereUnited KingdomAsiya Javayant RENEWAL
Alejandro PerinBrazilIvan Magalhaes NEW
Jones VocelkaGermanyXuxue Feng UNQUALIFIED
Smith GlickAustraliaOnyama Limba NEGOTIATION
Costa DilliardCanadaIvan Magalhaes NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Ivar PaprockiBrazil2026-05-31Printing Dimensions RENEWAL94Ivan Magalhaes
1001Greenwood BologniaJapan2026-05-30Benton, John B Jr NEW29Amy Elsner
1002Claire TollnerUnited Kingdom2026-05-22Morlong Associates UNQUALIFIED41Elwin Sharvill
1003Mayumi KolmetzIndia2026-05-20Benton, John B Jr NEGOTIATION2Elwin Sharvill
1004Antonio CaudyFrance2026-06-03Rousseaux, Michael Esq NEW3Asiya Javayant
1005Arvin AlbaresJapan2026-05-20Feiner Bros RENEWAL55Stephen Shaw
1006Francesco ShinkoAustralia2026-06-05Truhlar And Truhlar Attys NEW79Ioni Bowcher
1007Claire TollnerCanada2026-05-27Benton, John B Jr QUALIFIED53Ivan Magalhaes
1008Aruna FigeroaItaly2026-06-12Chemel, James L Cpa NEGOTIATION86Xuxue Feng
1009Wickens NestleRussia2026-06-08Rangoni Of Florence NEW27Asiya Javayant
1010Alejandro PerinJapan2026-05-19Morlong Associates NEGOTIATION46Stephen Shaw
1011Mujtaba NickaRussia2026-05-15Chemel, James L Cpa NEW16Xuxue Feng
1012Claire TollnerItaly2026-05-20Rangoni Of Florence PROPOSAL40Xuxue Feng
1013Misaki RoysterBrazil2026-05-16King, Christopher A Esq QUALIFIED99Asiya Javayant
1014Jennifer AmigonUnited Kingdom2026-06-07Printing Dimensions PROPOSAL64Stephen Shaw
1015Antonio CaudyFrance2026-05-22Chanay, Jeffrey A Esq NEW5Ivan Magalhaes
1016Darci PoquetteJapan2026-06-09Dorl, James J Esq NEW74Elwin Sharvill
1017Antonio CaudyUnited Kingdom2026-05-28Feltz Printing Service NEGOTIATION20Ioni Bowcher
1018Costa DilliardCanada2026-05-15Printing Dimensions UNQUALIFIED54Bernardo Dominic
1019Jefferson SchemmerIndia2026-06-05Chanay, Jeffrey A Esq RENEWAL40Asiya Javayant
1020Chavez BriddickIndia2026-06-09Rangoni Of Florence UNQUALIFIED91Bernardo Dominic
1021Clifford RimBrazil2026-05-22Rousseaux, Michael Esq NEW64Amy Elsner
1022Morrow RutaBrazil2026-05-26Chemel, James L Cpa NEGOTIATION30Xuxue Feng
1023James ButtGermany2026-06-05Chemel, James L Cpa RENEWAL3Asiya Javayant
1024Stacey MacleadRussia2026-05-26Chanay, Jeffrey A Esq PROPOSAL12Onyama Limba
1025Francesco ShinkoUnited Kingdom2026-05-28Chanay, Jeffrey A Esq QUALIFIED26Amy Elsner
1026Mujtaba NickaSpain2026-05-29Dorl, James J Esq NEGOTIATION19Stephen Shaw
1027Maisha RulapaughItaly2026-05-27Chanay, Jeffrey A Esq UNQUALIFIED8Asiya Javayant
1028Antonio CaudyUnited Kingdom2026-05-20Truhlar And Truhlar Attys UNQUALIFIED60Ivan Magalhaes
1029Octavia MaletArgentina2026-05-25Morlong Associates NEGOTIATION16Ivan Magalhaes
1030Aruna FigeroaCanada2026-05-23Morlong Associates PROPOSAL55Ivan Magalhaes
1031Arvin AlbaresRussia2026-05-26Feiner Bros NEGOTIATION78Anna Fali
1032Smith GlickCanada2026-06-03Commercial Press QUALIFIED24Onyama Limba
1033Leon OldroydBrazil2026-06-02Rangoni Of Florence NEGOTIATION80Bernardo Dominic
1034Murillo MaletGermany2026-05-28Dorl, James J Esq NEGOTIATION7Bernardo Dominic
1035Costa DilliardCanada2026-06-12Commercial Press UNQUALIFIED58Asiya Javayant
1036Antonio CaudyGermany2026-05-24Chemel, James L Cpa RENEWAL0Asiya Javayant
1037Munro FerenczJapan2026-06-05Morlong Associates UNQUALIFIED72Stephen Shaw
1038Aika InouyeSpain2026-05-29King, Christopher A Esq UNQUALIFIED98Stephen Shaw
1039Isabel BowleyUnited Kingdom2026-05-21Morlong Associates NEGOTIATION92Ivan Magalhaes
1040Julie StensethCanada2026-05-15Chemel, James L Cpa PROPOSAL43Elwin Sharvill
1041Greenwood BologniaItaly2026-06-10Buckley Miller Wright PROPOSAL31Ioni Bowcher
1042Izzy GarufiUnited Kingdom2026-06-04Chemel, James L Cpa RENEWAL22Asiya Javayant
1043Costa DilliardAustralia2026-05-27Commercial Press QUALIFIED66Bernardo Dominic
1044Munro FerenczRussia2026-05-16Buckley Miller Wright QUALIFIED40Ioni Bowcher
1045Emily WhobreyUnited Kingdom2026-05-31Feiner Bros PROPOSAL63Xuxue Feng
1046Jennifer AmigonJapan2026-06-01Feltz Printing Service PROPOSAL35Xuxue Feng
1047Kaitlin OstroskyCanada2026-06-04Rangoni Of Florence UNQUALIFIED13Stephen Shaw
1048Salvatore StockhamSpain2026-06-07Chapman, Ross E Esq NEW28Ioni Bowcher
1049Ivar PaprockiBrazil2026-05-19Benton, John B Jr UNQUALIFIED50Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Greenwood BologniaCanadaBernardo Dominic NEW
Wickens NestleRussiaIvan Magalhaes UNQUALIFIED
Cody SaylorsIndiaIoni Bowcher NEGOTIATION
Leja CaldareraUnited KingdomAmy Elsner UNQUALIFIED
Chavez BriddickIndiaXuxue Feng NEW
Jennifer AmigonArgentinaIoni Bowcher UNQUALIFIED
Adams MorascaSpainXuxue Feng NEW
Maisha RulapaughGermanyElwin Sharvill NEGOTIATION
Kadeem FlosiBrazilXuxue Feng RENEWAL
Mayumi KolmetzIndiaXuxue Feng PROPOSAL
Chavez BriddickArgentinaElwin Sharvill PROPOSAL
Morrow RutaUnited KingdomAnna Fali NEW
Julie StensethUnited KingdomAmy Elsner NEW
Aruna FigeroaItalyIoni Bowcher QUALIFIED
Morrow RutaGermanyElwin Sharvill PROPOSAL
Salvatore StockhamIndiaIvan Magalhaes RENEWAL
Mayumi KolmetzIndiaStephen Shaw RENEWAL
Jeanfrancois VenereUnited KingdomIoni Bowcher QUALIFIED
Aditya KuskoBrazilAmy Elsner PROPOSAL
Munro FerenczJapanXuxue Feng PROPOSAL
Cody SaylorsBrazilOnyama Limba NEGOTIATION
Johnson SergiArgentinaAsiya Javayant NEGOTIATION
Juan WieserJapanAmy Elsner QUALIFIED
Kaitlin OstroskyItalyAmy Elsner NEW
Munro FerenczIndiaOnyama Limba PROPOSAL
Leon OldroydItalyOnyama Limba RENEWAL
Maisha RulapaughBrazilIoni Bowcher NEW
Ricardo GauchoSpainBernardo Dominic QUALIFIED
Isabel BowleyCanadaAnna Fali NEGOTIATION
Faith GillianSpainAmy Elsner QUALIFIED
Octavia MaletFranceAmy Elsner QUALIFIED
Cody SaylorsSpainAmy Elsner NEGOTIATION
Aditya KuskoJapanBernardo Dominic UNQUALIFIED
Jennifer AmigonCanadaOnyama Limba UNQUALIFIED
Clifford RimArgentinaAnna Fali NEW
Stacey MacleadItalyIvan Magalhaes NEW
Leon OldroydCanadaIvan Magalhaes PROPOSAL
Jennifer AmigonArgentinaBernardo Dominic QUALIFIED
Smith GlickGermanyOnyama Limba UNQUALIFIED
Aditya KuskoRussiaXuxue Feng PROPOSAL
Mujtaba NickaIndiaXuxue Feng NEGOTIATION
Arvin AlbaresRussiaElwin Sharvill NEGOTIATION
Costa DilliardIndiaStephen Shaw NEGOTIATION
Chavez BriddickCanadaElwin Sharvill NEGOTIATION
Francesco ShinkoUnited KingdomXuxue Feng PROPOSAL
Nicolas IturbideAustraliaAmy Elsner NEW
James ButtItalyAmy Elsner NEW
Jeanfrancois VenereGermanyOnyama Limba RENEWAL
Isabel BowleyFranceOnyama Limba RENEWAL
James ButtBrazilOnyama Limba NEGOTIATION
Frozen Columns
Name
Isabel Bowley
Izzy Garufi
Deepesh Chui
Emily Whobrey
Juan Wieser
Darci Poquette
Aika Inouye
David Darakjy
Murillo Malet
Emily Whobrey
Johnson Sergi
Wickens Nestle
Kaitlin Ostrosky
Leon Oldroyd
Tony Foller
Ricardo Gaucho
Stacey Maclead
Octavia Malet
Rodrigues Campain
Morrow Ruta
Kadeem Flosi
Julie Stenseth
James Butt
Costa Dilliard
Nicolas Iturbide
Morrow Ruta
Murillo Malet
Jeanfrancois Venere
Leja Caldarera
Clifford Rim
Leon Oldroyd
Jefferson Schemmer
Tony Foller
Maisha Rulapaugh
Claire Tollner
Munro Ferencz
Leja Caldarera
Misaki Royster
Maria Marrier
Ivar Paprocki
Aika Inouye
Costa Dilliard
Claire Tollner
Adams Morasca
Aruna Figeroa
Aditya Kusko
Chavez Briddick
Jeanfrancois Venere
Stacey Maclead
Munro Ferencz
IdCountryDate
1000Russia2026-06-04
1001Argentina2026-06-05
1002Italy2026-05-27
1003Argentina2026-05-22
1004France2026-05-25
1005Italy2026-06-08
1006Germany2026-05-21
1007United Kingdom2026-05-29
1008France2026-05-26
1009India2026-06-03
1010United Kingdom2026-05-22
1011United Kingdom2026-06-09
1012Italy2026-05-15
1013Argentina2026-05-30
1014Italy2026-05-17
1015Russia2026-05-27
1016United Kingdom2026-06-13
1017Italy2026-05-18
1018Canada2026-06-12
1019Germany2026-05-19
1020Germany2026-06-08
1021Australia2026-06-11
1022Canada2026-05-26
1023Japan2026-06-13
1024Brazil2026-05-19
1025India2026-05-30
1026Italy2026-05-22
1027United Kingdom2026-05-25
1028Germany2026-06-03
1029India2026-06-09
1030France2026-05-27
1031Spain2026-05-16
1032Russia2026-05-20
1033Italy2026-05-23
1034Canada2026-06-13
1035United Kingdom2026-05-30
1036Russia2026-06-10
1037Argentina2026-05-23
1038Germany2026-06-02
1039Argentina2026-06-12
1040Argentina2026-06-06
1041Argentina2026-06-05
1042Germany2026-06-06
1043Spain2026-05-22
1044Argentina2026-06-02
1045Russia2026-05-22
1046Japan2026-06-05
1047India2026-05-17
1048Italy2026-06-13
1049Russia2026-05-16

On-Demand Data

NameIdCountryDate
Juan Wieser1000Brazil2026-05-19
Morrow Ruta1001Canada2026-06-01
Murillo Malet1002India2026-06-01
Smith Glick1003Brazil2026-05-30
Adams Morasca1004India2026-06-07
Isabel Bowley1005Germany2026-06-13
Juan Wieser1006United Kingdom2026-05-25
Octavia Malet1007France2026-06-12
Julie Stenseth1008Australia2026-05-16
Jefferson Schemmer1009Canada2026-05-23
Ashley Doe1010Japan2026-06-05
Jennifer Amigon1011Brazil2026-05-29
Jeanfrancois Venere1012Brazil2026-05-26
Deepesh Chui1013Brazil2026-05-15
Kadeem Flosi1014Russia2026-06-07
Francesco Shinko1015United Kingdom2026-06-03
Mayumi Kolmetz1016India2026-05-23
Jennifer Amigon1017India2026-06-11
Aika Inouye1018Italy2026-05-17
Julie Stenseth1019Argentina2026-05-23
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Ivar PaprockiFranceIoni Bowcher RENEWAL
Jones VocelkaJapanXuxue Feng NEGOTIATION
Stacey MacleadUnited KingdomAmy Elsner PROPOSAL
Kadeem FlosiArgentinaXuxue Feng UNQUALIFIED
Ashley DoeUnited KingdomIoni Bowcher NEGOTIATION
Munro FerenczFranceIvan Magalhaes QUALIFIED
David DarakjyFranceXuxue Feng NEW
Jefferson SchemmerGermanyAsiya Javayant RENEWAL
Arvin AlbaresRussiaOnyama Limba PROPOSAL
Octavia MaletSpainIvan Magalhaes UNQUALIFIED
James ButtArgentinaStephen Shaw RENEWAL
Claire TollnerJapanElwin Sharvill NEW
David DarakjyArgentinaStephen Shaw NEW
Mayumi KolmetzCanadaAnna Fali QUALIFIED
Claire TollnerJapanIvan Magalhaes NEGOTIATION
Darci PoquetteItalyIvan Magalhaes RENEWAL
James ButtGermanyStephen Shaw RENEWAL
Ricardo GauchoJapanAnna Fali QUALIFIED
Jefferson SchemmerBrazilIvan Magalhaes QUALIFIED
Ivar PaprockiArgentinaAmy Elsner NEW
Darci PoquetteItalyAmy Elsner NEGOTIATION
Munro FerenczRussiaAsiya Javayant QUALIFIED
Ashley DoeGermanyElwin Sharvill PROPOSAL
Leon OldroydGermanyAnna Fali PROPOSAL
Leon OldroydItalyElwin Sharvill UNQUALIFIED
Leja CaldareraIndiaAmy Elsner NEW
James ButtItalyAmy Elsner NEGOTIATION
Leon OldroydJapanBernardo Dominic NEGOTIATION
Leja CaldareraIndiaXuxue Feng NEW
Ricardo GauchoIndiaIoni Bowcher PROPOSAL
Aditya KuskoSpainIvan Magalhaes UNQUALIFIED
Johnson SergiFranceOnyama Limba PROPOSAL
Faith GillianSpainOnyama Limba PROPOSAL
Chavez BriddickBrazilAnna Fali NEW
Silvio SlusarskiRussiaIvan Magalhaes NEGOTIATION
James ButtCanadaAnna Fali NEGOTIATION
Aditya KuskoItalyElwin Sharvill RENEWAL
Morrow RutaUnited KingdomIvan Magalhaes NEW
Kaitlin OstroskyRussiaBernardo Dominic NEW
Alejandro PerinGermanyOnyama Limba NEW

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