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
Nicolas IturbideRussiaOnyama Limba QUALIFIED
Tony FollerCanadaIoni Bowcher PROPOSAL
James ButtRussiaXuxue Feng UNQUALIFIED
Munro FerenczIndiaOnyama Limba RENEWAL
Emily WhobreyFranceAmy Elsner QUALIFIED
Tony FollerCanadaOnyama Limba PROPOSAL
Cody SaylorsCanadaStephen Shaw QUALIFIED
Munro FerenczArgentinaElwin Sharvill NEW
Leja CaldareraGermanyIoni Bowcher NEGOTIATION
Morrow RutaIndiaIoni Bowcher UNQUALIFIED
Deepesh ChuiIndiaIoni Bowcher RENEWAL
Morrow RutaGermanyXuxue Feng UNQUALIFIED
Juan WieserSpainAsiya Javayant PROPOSAL
Mujtaba NickaItalyIvan Magalhaes QUALIFIED
Salvatore StockhamJapanAsiya Javayant QUALIFIED
Mujtaba NickaArgentinaOnyama Limba RENEWAL
Jeanfrancois VenereGermanyAsiya Javayant PROPOSAL
Juan WieserBrazilAsiya Javayant UNQUALIFIED
James ButtFranceXuxue Feng UNQUALIFIED
Leja CaldareraBrazilAmy Elsner PROPOSAL
Smith GlickJapanStephen Shaw NEGOTIATION
Ashley DoeSpainElwin Sharvill QUALIFIED
David DarakjyBrazilElwin Sharvill UNQUALIFIED
Wickens NestleJapanBernardo Dominic NEW
Aika InouyeIndiaXuxue Feng QUALIFIED
Nicolas IturbideFranceStephen Shaw NEW
Murillo MaletSpainAmy Elsner UNQUALIFIED
Aika InouyeFranceAnna Fali NEGOTIATION
Jennifer AmigonCanadaIoni Bowcher RENEWAL
Kaitlin OstroskyItalyIoni Bowcher QUALIFIED
Izzy GarufiRussiaIvan Magalhaes NEW
Aika InouyeRussiaIvan Magalhaes UNQUALIFIED
Maria MarrierUnited KingdomStephen Shaw UNQUALIFIED
Jefferson SchemmerJapanIvan Magalhaes NEGOTIATION
Tony FollerArgentinaIoni Bowcher QUALIFIED
Izzy GarufiRussiaStephen Shaw NEW
Maria MarrierArgentinaBernardo Dominic UNQUALIFIED
Stacey MacleadAustraliaElwin Sharvill RENEWAL
Faith GillianGermanyOnyama Limba QUALIFIED
Rodrigues CampainFranceAsiya Javayant QUALIFIED
Cody SaylorsUnited KingdomElwin Sharvill NEW
Greenwood BologniaAustraliaElwin Sharvill PROPOSAL
Johnson SergiCanadaOnyama Limba NEGOTIATION
Munro FerenczRussiaOnyama Limba NEGOTIATION
Cody SaylorsBrazilBernardo Dominic RENEWAL
Adams MorascaBrazilElwin Sharvill RENEWAL
Rodrigues CampainIndiaIvan Magalhaes NEW
Wickens NestleCanadaStephen Shaw NEW
Johnson SergiCanadaAsiya Javayant NEGOTIATION
Aditya KuskoBrazilAnna Fali NEW
Horizontal
NameCountryRepresentativeStatus
Aika InouyeItalyAmy Elsner RENEWAL
Smith GlickBrazilOnyama Limba NEW
Ivar PaprockiIndiaStephen Shaw UNQUALIFIED
Adams MorascaItalyIoni Bowcher PROPOSAL
Morrow RutaCanadaElwin Sharvill UNQUALIFIED
Mujtaba NickaIndiaAsiya Javayant QUALIFIED
Chavez BriddickUnited KingdomOnyama Limba NEW
Aika InouyeAustraliaElwin Sharvill QUALIFIED
Maisha RulapaughBrazilBernardo Dominic RENEWAL
Maisha RulapaughIndiaStephen Shaw NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aruna FigeroaArgentina2026-04-11Buckley Miller Wright UNQUALIFIED91Elwin Sharvill
1001Morrow RutaCanada2026-04-09Chapman, Ross E Esq UNQUALIFIED34Ivan Magalhaes
1002Claire TollnerCanada2026-05-01Feiner Bros PROPOSAL27Onyama Limba
1003Aruna FigeroaCanada2026-04-28Rangoni Of Florence RENEWAL5Stephen Shaw
1004Murillo MaletCanada2026-04-21Dorl, James J Esq NEGOTIATION58Stephen Shaw
1005Darci PoquetteItaly2026-04-08Chanay, Jeffrey A Esq PROPOSAL99Asiya Javayant
1006Emily WhobreyAustralia2026-04-18Morlong Associates UNQUALIFIED61Asiya Javayant
1007Mujtaba NickaBrazil2026-04-03Commercial Press NEW14Stephen Shaw
1008Silvio SlusarskiRussia2026-04-10Benton, John B Jr NEW80Xuxue Feng
1009Isabel BowleySpain2026-04-27King, Christopher A Esq PROPOSAL42Ivan Magalhaes
1010Aika InouyeAustralia2026-04-25Truhlar And Truhlar Attys QUALIFIED77Xuxue Feng
1011Jennifer AmigonUnited Kingdom2026-04-17Benton, John B Jr RENEWAL4Stephen Shaw
1012Murillo MaletBrazil2026-04-11Rousseaux, Michael Esq UNQUALIFIED62Xuxue Feng
1013Jennifer AmigonItaly2026-04-18King, Christopher A Esq PROPOSAL89Stephen Shaw
1014Sinclair WaycottBrazil2026-04-11Chanay, Jeffrey A Esq RENEWAL32Anna Fali
1015Aruna FigeroaIndia2026-04-22Printing Dimensions QUALIFIED61Ioni Bowcher
1016Aditya KuskoItaly2026-04-11Buckley Miller Wright RENEWAL85Onyama Limba
1017Jefferson SchemmerItaly2026-04-29Buckley Miller Wright QUALIFIED81Ivan Magalhaes
1018Kaitlin OstroskyIndia2026-04-08Rousseaux, Michael Esq NEGOTIATION25Ioni Bowcher
1019Chavez BriddickFrance2026-04-09Rangoni Of Florence RENEWAL63Amy Elsner
1020Morrow RutaGermany2026-04-27Benton, John B Jr PROPOSAL88Onyama Limba
1021Murillo MaletArgentina2026-04-04Feiner Bros NEW88Ivan Magalhaes
1022David DarakjyAustralia2026-04-28Feiner Bros UNQUALIFIED3Ivan Magalhaes
1023Aditya KuskoItaly2026-04-19Commercial Press PROPOSAL12Onyama Limba
1024Ricardo GauchoBrazil2026-04-03Dorl, James J Esq UNQUALIFIED59Anna Fali
1025Julie StensethGermany2026-04-25Feiner Bros QUALIFIED96Xuxue Feng
1026Aditya KuskoAustralia2026-04-14Rangoni Of Florence PROPOSAL93Amy Elsner
1027Misaki RoysterAustralia2026-04-10Rousseaux, Michael Esq RENEWAL81Anna Fali
1028Ricardo GauchoJapan2026-04-12Rangoni Of Florence RENEWAL77Bernardo Dominic
1029Mayumi KolmetzBrazil2026-04-26Buckley Miller Wright PROPOSAL26Ioni Bowcher
1030Maisha RulapaughRussia2026-04-13Chapman, Ross E Esq QUALIFIED65Bernardo Dominic
1031Leja CaldareraAustralia2026-04-05Feiner Bros PROPOSAL60Asiya Javayant
1032Costa DilliardIndia2026-05-01Dorl, James J Esq NEW5Ioni Bowcher
1033Ivar PaprockiAustralia2026-04-22Rousseaux, Michael Esq PROPOSAL59Ivan Magalhaes
1034Alejandro PerinFrance2026-04-28Truhlar And Truhlar Attys NEGOTIATION68Bernardo Dominic
1035Stacey MacleadAustralia2026-04-15Commercial Press UNQUALIFIED69Amy Elsner
1036Juan WieserUnited Kingdom2026-04-21Chapman, Ross E Esq QUALIFIED93Onyama Limba
1037Deepesh ChuiBrazil2026-04-02Rangoni Of Florence NEGOTIATION97Anna Fali
1038Silvio SlusarskiSpain2026-04-13King, Christopher A Esq PROPOSAL99Elwin Sharvill
1039Emily WhobreyBrazil2026-04-23Feltz Printing Service UNQUALIFIED49Elwin Sharvill
1040Francesco ShinkoBrazil2026-04-30Printing Dimensions UNQUALIFIED25Stephen Shaw
1041Isabel BowleyArgentina2026-04-19Printing Dimensions RENEWAL28Ivan Magalhaes
1042Cody SaylorsSpain2026-04-09Commercial Press NEW19Amy Elsner
1043Maisha RulapaughSpain2026-04-09Rousseaux, Michael Esq UNQUALIFIED45Xuxue Feng
1044Maisha RulapaughItaly2026-04-30Commercial Press PROPOSAL8Bernardo Dominic
1045Kaitlin OstroskyAustralia2026-04-12Chanay, Jeffrey A Esq RENEWAL8Stephen Shaw
1046Francesco ShinkoBrazil2026-04-19Chapman, Ross E Esq PROPOSAL20Anna Fali
1047Maisha RulapaughBrazil2026-04-05Chanay, Jeffrey A Esq NEGOTIATION36Stephen Shaw
1048Mujtaba NickaFrance2026-04-18Chemel, James L Cpa NEW96Onyama Limba
1049Mayumi KolmetzIndia2026-04-30King, Christopher A Esq NEW64Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Maria MarrierSpainAnna Fali NEW
Kadeem FlosiIndiaIvan Magalhaes QUALIFIED
Misaki RoysterCanadaAnna Fali NEW
Aditya KuskoItalyIoni Bowcher PROPOSAL
Kadeem FlosiCanadaAmy Elsner RENEWAL
Octavia MaletArgentinaOnyama Limba NEW
Aika InouyeItalyElwin Sharvill RENEWAL
Emily WhobreyItalyXuxue Feng NEGOTIATION
Leon OldroydArgentinaStephen Shaw UNQUALIFIED
Jeanfrancois VenereItalyStephen Shaw PROPOSAL
Deepesh ChuiBrazilAsiya Javayant RENEWAL
Maria MarrierSpainOnyama Limba RENEWAL
Kaitlin OstroskySpainIvan Magalhaes RENEWAL
Stacey MacleadIndiaAmy Elsner NEGOTIATION
Costa DilliardAustraliaAnna Fali PROPOSAL
Maisha RulapaughSpainAmy Elsner PROPOSAL
Jennifer AmigonGermanyOnyama Limba RENEWAL
Adams MorascaGermanyBernardo Dominic RENEWAL
Maisha RulapaughUnited KingdomOnyama Limba UNQUALIFIED
Wickens NestleIndiaAsiya Javayant NEGOTIATION
Leja CaldareraSpainBernardo Dominic PROPOSAL
Stacey MacleadBrazilIoni Bowcher PROPOSAL
Wickens NestleItalyElwin Sharvill RENEWAL
Murillo MaletFranceIvan Magalhaes RENEWAL
Jefferson SchemmerUnited KingdomIoni Bowcher QUALIFIED
Ashley DoeItalyAnna Fali NEGOTIATION
Cody SaylorsJapanBernardo Dominic RENEWAL
Isabel BowleyIndiaXuxue Feng PROPOSAL
Octavia MaletFranceIoni Bowcher UNQUALIFIED
Clifford RimUnited KingdomBernardo Dominic PROPOSAL
Juan WieserArgentinaAnna Fali UNQUALIFIED
Kadeem FlosiItalyBernardo Dominic UNQUALIFIED
Jennifer AmigonItalyIvan Magalhaes NEW
Isabel BowleyGermanyBernardo Dominic PROPOSAL
Costa DilliardArgentinaAsiya Javayant QUALIFIED
Isabel BowleyJapanBernardo Dominic QUALIFIED
David DarakjyItalyElwin Sharvill PROPOSAL
Cody SaylorsCanadaAmy Elsner NEGOTIATION
Ivar PaprockiIndiaAsiya Javayant NEGOTIATION
Julie StensethCanadaXuxue Feng NEGOTIATION
Leon OldroydBrazilAmy Elsner RENEWAL
Mujtaba NickaAustraliaIoni Bowcher UNQUALIFIED
Claire TollnerFranceXuxue Feng PROPOSAL
Johnson SergiGermanyOnyama Limba PROPOSAL
Cody SaylorsSpainAsiya Javayant PROPOSAL
Mayumi KolmetzFranceStephen Shaw QUALIFIED
Octavia MaletJapanIvan Magalhaes RENEWAL
Stacey MacleadGermanyAmy Elsner QUALIFIED
Jones VocelkaFranceOnyama Limba PROPOSAL
Munro FerenczJapanIvan Magalhaes UNQUALIFIED
Frozen Columns
Name
Isabel Bowley
Chavez Briddick
Deepesh Chui
Antonio Caudy
Deepesh Chui
Arvin Albares
Aika Inouye
Claire Tollner
Francesco Shinko
Greenwood Bolognia
Emily Whobrey
Aditya Kusko
Deepesh Chui
Emily Whobrey
Rodrigues Campain
Arvin Albares
James Butt
Julie Stenseth
David Darakjy
Jeanfrancois Venere
Kadeem Flosi
James Butt
Kaitlin Ostrosky
Izzy Garufi
Aruna Figeroa
Maisha Rulapaugh
Faith Gillian
Mujtaba Nicka
James Butt
Wickens Nestle
Morrow Ruta
Isabel Bowley
Jones Vocelka
Salvatore Stockham
Antonio Caudy
Darci Poquette
Kaitlin Ostrosky
Mujtaba Nicka
Mujtaba Nicka
Jefferson Schemmer
Jefferson Schemmer
Murillo Malet
Murillo Malet
Silvio Slusarski
Octavia Malet
Morrow Ruta
Juan Wieser
Antonio Caudy
Nicolas Iturbide
Mujtaba Nicka
IdCountryDate
1000Japan2026-04-10
1001Australia2026-04-03
1002Spain2026-04-25
1003Canada2026-04-04
1004Australia2026-04-21
1005Brazil2026-04-10
1006Spain2026-04-05
1007Brazil2026-04-03
1008United Kingdom2026-04-27
1009France2026-04-24
1010Spain2026-04-12
1011Russia2026-04-22
1012Brazil2026-04-29
1013Argentina2026-05-01
1014India2026-04-11
1015Italy2026-04-06
1016Russia2026-04-19
1017France2026-04-11
1018France2026-04-04
1019Japan2026-04-22
1020Australia2026-04-23
1021India2026-04-04
1022India2026-04-16
1023Japan2026-04-24
1024Italy2026-04-03
1025Argentina2026-04-11
1026Japan2026-04-27
1027Spain2026-04-22
1028Brazil2026-04-23
1029Germany2026-04-24
1030Argentina2026-04-29
1031Brazil2026-04-12
1032Canada2026-04-27
1033Argentina2026-04-05
1034Brazil2026-04-05
1035Australia2026-04-23
1036United Kingdom2026-04-26
1037Brazil2026-04-12
1038Spain2026-04-25
1039Russia2026-04-09
1040United Kingdom2026-04-03
1041Spain2026-04-26
1042India2026-04-28
1043Brazil2026-04-22
1044Russia2026-04-21
1045Russia2026-04-24
1046India2026-04-10
1047Italy2026-04-24
1048Brazil2026-04-13
1049United Kingdom2026-04-05

On-Demand Data

NameIdCountryDate
Salvatore Stockham1000Russia2026-04-18
Mujtaba Nicka1001Brazil2026-05-01
Sinclair Waycott1002Argentina2026-04-05
Jennifer Amigon1003Canada2026-04-21
Arvin Albares1004Russia2026-04-16
Maisha Rulapaugh1005Japan2026-04-14
Morrow Ruta1006France2026-04-09
David Darakjy1007Australia2026-04-23
Ricardo Gaucho1008Japan2026-04-14
Francesco Shinko1009India2026-04-09
Kadeem Flosi1010Canada2026-04-19
Ivar Paprocki1011Germany2026-04-26
Jennifer Amigon1012France2026-04-26
Tony Foller1013Canada2026-04-07
Kaitlin Ostrosky1014Russia2026-04-04
Faith Gillian1015Japan2026-04-24
Wickens Nestle1016France2026-04-04
Stacey Maclead1017Russia2026-04-05
Maisha Rulapaugh1018Spain2026-04-08
Stacey Maclead1019India2026-04-23
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Murillo MaletIndiaBernardo Dominic NEGOTIATION
Leja CaldareraCanadaOnyama Limba PROPOSAL
Alejandro PerinArgentinaOnyama Limba QUALIFIED
Murillo MaletArgentinaIoni Bowcher NEGOTIATION
Greenwood BologniaRussiaOnyama Limba NEW
Adams MorascaFranceAsiya Javayant RENEWAL
Clifford RimSpainIvan Magalhaes QUALIFIED
Leon OldroydAustraliaElwin Sharvill PROPOSAL
Costa DilliardAustraliaXuxue Feng PROPOSAL
Emily WhobreyFranceIoni Bowcher NEGOTIATION
Octavia MaletUnited KingdomAmy Elsner QUALIFIED
Francesco ShinkoIndiaBernardo Dominic UNQUALIFIED
Munro FerenczBrazilAnna Fali NEW
Julie StensethCanadaStephen Shaw QUALIFIED
Sinclair WaycottIndiaElwin Sharvill PROPOSAL
Aruna FigeroaArgentinaAsiya Javayant NEGOTIATION
Claire TollnerArgentinaAmy Elsner PROPOSAL
Kadeem FlosiSpainBernardo Dominic NEW
James ButtUnited KingdomAmy Elsner UNQUALIFIED
Mayumi KolmetzCanadaStephen Shaw PROPOSAL
Tony FollerRussiaAnna Fali QUALIFIED
Salvatore StockhamUnited KingdomStephen Shaw UNQUALIFIED
Leja CaldareraSpainAmy Elsner PROPOSAL
Julie StensethBrazilIoni Bowcher RENEWAL
Francesco ShinkoBrazilXuxue Feng NEGOTIATION
Greenwood BologniaUnited KingdomXuxue Feng NEW
Mayumi KolmetzFranceAmy Elsner QUALIFIED
Johnson SergiItalyAsiya Javayant RENEWAL
Leja CaldareraJapanAnna Fali NEGOTIATION
Faith GillianRussiaIoni Bowcher UNQUALIFIED
Antonio CaudyItalyStephen Shaw PROPOSAL
Mujtaba NickaArgentinaOnyama Limba RENEWAL
Misaki RoysterSpainAmy Elsner PROPOSAL
Johnson SergiItalyBernardo Dominic UNQUALIFIED
Adams MorascaSpainElwin Sharvill PROPOSAL
Isabel BowleyJapanXuxue Feng NEGOTIATION
Aruna FigeroaJapanAnna Fali NEW
Ricardo GauchoIndiaIoni Bowcher PROPOSAL
Rodrigues CampainJapanIoni Bowcher NEGOTIATION
Mayumi KolmetzUnited KingdomAsiya Javayant 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>