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
Mayumi KolmetzFranceStephen Shaw UNQUALIFIED
Julie StensethCanadaStephen Shaw NEGOTIATION
Chavez BriddickAustraliaXuxue Feng NEW
Johnson SergiBrazilBernardo Dominic PROPOSAL
Ashley DoeUnited KingdomBernardo Dominic QUALIFIED
Costa DilliardSpainAnna Fali UNQUALIFIED
Costa DilliardUnited KingdomAmy Elsner UNQUALIFIED
Deepesh ChuiIndiaElwin Sharvill PROPOSAL
Darci PoquetteCanadaStephen Shaw NEGOTIATION
Darci PoquetteGermanyBernardo Dominic UNQUALIFIED
Clifford RimBrazilElwin Sharvill NEGOTIATION
Rodrigues CampainBrazilAmy Elsner NEW
Sinclair WaycottCanadaOnyama Limba RENEWAL
Deepesh ChuiGermanyAmy Elsner NEW
Maria MarrierFranceIvan Magalhaes NEGOTIATION
Ricardo GauchoSpainXuxue Feng UNQUALIFIED
Arvin AlbaresAustraliaElwin Sharvill QUALIFIED
Clifford RimSpainAsiya Javayant UNQUALIFIED
Alejandro PerinFranceXuxue Feng NEGOTIATION
Emily WhobreyFranceStephen Shaw NEW
Nicolas IturbideBrazilStephen Shaw NEGOTIATION
Aditya KuskoAustraliaOnyama Limba QUALIFIED
Emily WhobreyFranceAsiya Javayant NEGOTIATION
Adams MorascaIndiaAsiya Javayant QUALIFIED
Murillo MaletBrazilStephen Shaw NEW
Maria MarrierUnited KingdomIoni Bowcher PROPOSAL
Munro FerenczRussiaAnna Fali PROPOSAL
Kaitlin OstroskyAustraliaStephen Shaw RENEWAL
Tony FollerItalyXuxue Feng NEW
Maisha RulapaughFranceStephen Shaw QUALIFIED
Sinclair WaycottUnited KingdomBernardo Dominic UNQUALIFIED
Smith GlickItalyStephen Shaw QUALIFIED
Mujtaba NickaArgentinaElwin Sharvill NEGOTIATION
Faith GillianIndiaAnna Fali PROPOSAL
Mayumi KolmetzBrazilOnyama Limba NEW
Leja CaldareraArgentinaOnyama Limba NEW
Murillo MaletRussiaOnyama Limba NEGOTIATION
Misaki RoysterFranceXuxue Feng UNQUALIFIED
Kadeem FlosiCanadaAnna Fali PROPOSAL
Octavia MaletCanadaIoni Bowcher UNQUALIFIED
Leja CaldareraSpainAmy Elsner NEGOTIATION
Stacey MacleadArgentinaOnyama Limba QUALIFIED
Salvatore StockhamFranceIoni Bowcher PROPOSAL
Antonio CaudyArgentinaElwin Sharvill NEGOTIATION
Morrow RutaGermanyAmy Elsner UNQUALIFIED
Smith GlickItalyAsiya Javayant QUALIFIED
Leon OldroydRussiaElwin Sharvill UNQUALIFIED
Smith GlickGermanyAmy Elsner UNQUALIFIED
Morrow RutaSpainAnna Fali QUALIFIED
Izzy GarufiFranceAmy Elsner NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Leon OldroydGermanyBernardo Dominic PROPOSAL
Mayumi KolmetzSpainIvan Magalhaes RENEWAL
Salvatore StockhamBrazilStephen Shaw QUALIFIED
Izzy GarufiJapanXuxue Feng QUALIFIED
Aruna FigeroaBrazilAnna Fali PROPOSAL
Costa DilliardGermanyOnyama Limba UNQUALIFIED
Darci PoquetteAustraliaIoni Bowcher PROPOSAL
Ashley DoeSpainElwin Sharvill RENEWAL
Kadeem FlosiSpainAmy Elsner QUALIFIED
Deepesh ChuiIndiaAnna Fali QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Stacey MacleadFrance2026-04-28Rangoni Of Florence QUALIFIED69Anna Fali
1001Rodrigues CampainGermany2026-04-20Chanay, Jeffrey A Esq QUALIFIED61Stephen Shaw
1002Mujtaba NickaSpain2026-04-21Rousseaux, Michael Esq RENEWAL71Ivan Magalhaes
1003Aruna FigeroaCanada2026-04-17Truhlar And Truhlar Attys RENEWAL14Stephen Shaw
1004Alejandro PerinIndia2026-05-05Chanay, Jeffrey A Esq PROPOSAL50Asiya Javayant
1005Misaki RoysterAustralia2026-04-19Dorl, James J Esq UNQUALIFIED55Onyama Limba
1006Ashley DoeJapan2026-04-28Dorl, James J Esq RENEWAL81Anna Fali
1007Jones VocelkaUnited Kingdom2026-04-20Chemel, James L Cpa NEGOTIATION13Onyama Limba
1008Costa DilliardCanada2026-05-10Morlong Associates RENEWAL73Onyama Limba
1009Octavia MaletAustralia2026-05-14Chanay, Jeffrey A Esq QUALIFIED32Onyama Limba
1010Jefferson SchemmerRussia2026-05-01Truhlar And Truhlar Attys RENEWAL35Ivan Magalhaes
1011Francesco ShinkoArgentina2026-04-28Chemel, James L Cpa RENEWAL24Asiya Javayant
1012Costa DilliardIndia2026-04-30Rangoni Of Florence NEGOTIATION87Amy Elsner
1013Kaitlin OstroskyRussia2026-04-25Morlong Associates QUALIFIED34Stephen Shaw
1014Nicolas IturbideSpain2026-04-28Rousseaux, Michael Esq NEW63Amy Elsner
1015Isabel BowleyItaly2026-05-04Benton, John B Jr RENEWAL62Ivan Magalhaes
1016Cody SaylorsRussia2026-05-11King, Christopher A Esq PROPOSAL35Anna Fali
1017Silvio SlusarskiItaly2026-04-19Truhlar And Truhlar Attys NEW91Xuxue Feng
1018Aika InouyeAustralia2026-05-06Morlong Associates PROPOSAL89Onyama Limba
1019Misaki RoysterBrazil2026-04-30Buckley Miller Wright QUALIFIED4Elwin Sharvill
1020Emily WhobreySpain2026-05-07Truhlar And Truhlar Attys RENEWAL73Bernardo Dominic
1021Faith GillianArgentina2026-05-02Feltz Printing Service PROPOSAL76Asiya Javayant
1022Smith GlickJapan2026-05-10King, Christopher A Esq PROPOSAL31Stephen Shaw
1023James ButtRussia2026-04-16Rangoni Of Florence PROPOSAL57Anna Fali
1024James ButtJapan2026-05-03Dorl, James J Esq NEGOTIATION99Stephen Shaw
1025Mujtaba NickaUnited Kingdom2026-04-27Truhlar And Truhlar Attys NEW68Elwin Sharvill
1026Maisha RulapaughIndia2026-05-11Benton, John B Jr PROPOSAL91Amy Elsner
1027Antonio CaudyBrazil2026-04-26Rangoni Of Florence RENEWAL48Ioni Bowcher
1028Maria MarrierRussia2026-05-13Feiner Bros PROPOSAL10Xuxue Feng
1029Ricardo GauchoIndia2026-04-30Printing Dimensions NEGOTIATION35Xuxue Feng
1030Kadeem FlosiAustralia2026-05-05Chapman, Ross E Esq RENEWAL71Asiya Javayant
1031Jefferson SchemmerFrance2026-05-14Feiner Bros NEW11Onyama Limba
1032Ricardo GauchoJapan2026-04-20Feiner Bros PROPOSAL76Ioni Bowcher
1033Darci PoquetteBrazil2026-05-14Rousseaux, Michael Esq PROPOSAL32Anna Fali
1034Tony FollerJapan2026-05-07Printing Dimensions NEW8Bernardo Dominic
1035Aika InouyeSpain2026-05-12Chemel, James L Cpa QUALIFIED80Stephen Shaw
1036Jones VocelkaRussia2026-04-17Feiner Bros PROPOSAL13Ioni Bowcher
1037Jeanfrancois VenereFrance2026-04-21Feltz Printing Service RENEWAL3Asiya Javayant
1038Adams MorascaFrance2026-05-03Benton, John B Jr UNQUALIFIED96Anna Fali
1039Chavez BriddickCanada2026-04-21Buckley Miller Wright UNQUALIFIED2Ivan Magalhaes
1040Maisha RulapaughSpain2026-04-29Benton, John B Jr QUALIFIED72Asiya Javayant
1041Salvatore StockhamIndia2026-05-07Rangoni Of Florence QUALIFIED35Xuxue Feng
1042Octavia MaletIndia2026-05-11Printing Dimensions NEGOTIATION54Ioni Bowcher
1043Misaki RoysterBrazil2026-04-26Commercial Press NEW26Stephen Shaw
1044Chavez BriddickAustralia2026-04-26Feiner Bros PROPOSAL21Ivan Magalhaes
1045Leon OldroydUnited Kingdom2026-05-03Rousseaux, Michael Esq NEW43Stephen Shaw
1046Antonio CaudyIndia2026-04-15Dorl, James J Esq RENEWAL67Ioni Bowcher
1047Julie StensethItaly2026-05-03Chemel, James L Cpa NEW48Ivan Magalhaes
1048Ashley DoeGermany2026-05-09Buckley Miller Wright PROPOSAL60Elwin Sharvill
1049Francesco ShinkoCanada2026-05-10Dorl, James J Esq NEW21Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Arvin AlbaresUnited KingdomAnna Fali NEW
Deepesh ChuiSpainBernardo Dominic QUALIFIED
Stacey MacleadCanadaIoni Bowcher UNQUALIFIED
Munro FerenczFranceStephen Shaw UNQUALIFIED
Sinclair WaycottGermanyStephen Shaw UNQUALIFIED
James ButtFranceXuxue Feng NEGOTIATION
Alejandro PerinFranceIvan Magalhaes NEGOTIATION
Juan WieserAustraliaIvan Magalhaes UNQUALIFIED
Cody SaylorsCanadaXuxue Feng RENEWAL
Izzy GarufiBrazilElwin Sharvill NEW
Kadeem FlosiJapanStephen Shaw NEGOTIATION
David DarakjyRussiaAnna Fali PROPOSAL
Aditya KuskoRussiaOnyama Limba RENEWAL
Maisha RulapaughIndiaStephen Shaw UNQUALIFIED
Claire TollnerAustraliaBernardo Dominic RENEWAL
Leon OldroydIndiaIvan Magalhaes QUALIFIED
Johnson SergiItalyIvan Magalhaes RENEWAL
Jefferson SchemmerAustraliaOnyama Limba NEGOTIATION
Kaitlin OstroskyCanadaElwin Sharvill PROPOSAL
Silvio SlusarskiAustraliaIoni Bowcher NEW
Jefferson SchemmerFranceIoni Bowcher QUALIFIED
Sinclair WaycottSpainOnyama Limba NEW
Maria MarrierItalyIvan Magalhaes PROPOSAL
Ivar PaprockiJapanBernardo Dominic RENEWAL
Adams MorascaArgentinaAsiya Javayant QUALIFIED
Izzy GarufiAustraliaXuxue Feng PROPOSAL
Julie StensethBrazilStephen Shaw NEGOTIATION
Clifford RimIndiaAmy Elsner QUALIFIED
Tony FollerUnited KingdomBernardo Dominic NEW
Leon OldroydFranceIvan Magalhaes PROPOSAL
Morrow RutaArgentinaAnna Fali UNQUALIFIED
Antonio CaudyIndiaAsiya Javayant RENEWAL
Stacey MacleadUnited KingdomAnna Fali QUALIFIED
Costa DilliardRussiaIoni Bowcher UNQUALIFIED
Smith GlickGermanyOnyama Limba UNQUALIFIED
Tony FollerItalyAmy Elsner NEGOTIATION
Chavez BriddickFranceXuxue Feng PROPOSAL
Ashley DoeGermanyIoni Bowcher PROPOSAL
Deepesh ChuiArgentinaStephen Shaw PROPOSAL
Sinclair WaycottRussiaBernardo Dominic NEW
Alejandro PerinGermanyAsiya Javayant PROPOSAL
Silvio SlusarskiGermanyAsiya Javayant NEGOTIATION
Ashley DoeBrazilAnna Fali NEGOTIATION
Mayumi KolmetzCanadaIvan Magalhaes UNQUALIFIED
Jeanfrancois VenereCanadaAmy Elsner QUALIFIED
Adams MorascaSpainIoni Bowcher PROPOSAL
Ricardo GauchoJapanXuxue Feng NEGOTIATION
Nicolas IturbideRussiaStephen Shaw UNQUALIFIED
Maria MarrierItalyElwin Sharvill UNQUALIFIED
Tony FollerIndiaOnyama Limba RENEWAL
Frozen Columns
Name
Claire Tollner
Aruna Figeroa
Cody Saylors
Antonio Caudy
Johnson Sergi
Nicolas Iturbide
Francesco Shinko
Greenwood Bolognia
Maisha Rulapaugh
Maisha Rulapaugh
Faith Gillian
Leon Oldroyd
Smith Glick
Kadeem Flosi
Jeanfrancois Venere
Tony Foller
James Butt
Cody Saylors
Maisha Rulapaugh
Ricardo Gaucho
Salvatore Stockham
Kadeem Flosi
Jones Vocelka
Ivar Paprocki
Sinclair Waycott
Aditya Kusko
Deepesh Chui
James Butt
Ricardo Gaucho
Morrow Ruta
Adams Morasca
Clifford Rim
Ashley Doe
Antonio Caudy
Greenwood Bolognia
Emily Whobrey
Aruna Figeroa
Jones Vocelka
Jefferson Schemmer
Leon Oldroyd
Faith Gillian
Mujtaba Nicka
Nicolas Iturbide
Morrow Ruta
Octavia Malet
Jeanfrancois Venere
Tony Foller
Chavez Briddick
Mujtaba Nicka
Aruna Figeroa
IdCountryDate
1000Germany2026-05-11
1001Australia2026-05-11
1002Japan2026-04-15
1003Argentina2026-05-01
1004Argentina2026-05-12
1005Brazil2026-05-04
1006Japan2026-05-10
1007United Kingdom2026-05-07
1008Germany2026-04-29
1009Australia2026-05-01
1010Brazil2026-04-18
1011Canada2026-05-13
1012India2026-04-25
1013United Kingdom2026-04-20
1014Japan2026-04-19
1015United Kingdom2026-04-23
1016Italy2026-05-03
1017India2026-04-29
1018Japan2026-05-12
1019Spain2026-04-18
1020Argentina2026-05-09
1021United Kingdom2026-05-05
1022Argentina2026-05-07
1023Canada2026-04-19
1024Canada2026-05-02
1025Argentina2026-05-06
1026Canada2026-05-03
1027Argentina2026-04-28
1028India2026-04-23
1029Australia2026-05-06
1030Italy2026-05-01
1031France2026-05-06
1032India2026-04-24
1033Japan2026-04-29
1034Canada2026-04-27
1035France2026-05-14
1036Canada2026-05-10
1037Brazil2026-04-26
1038Canada2026-05-11
1039Italy2026-04-21
1040Russia2026-04-30
1041Germany2026-05-08
1042France2026-05-11
1043Germany2026-04-30
1044Australia2026-05-03
1045Russia2026-04-28
1046United Kingdom2026-05-09
1047Argentina2026-04-15
1048Australia2026-04-23
1049Russia2026-05-07

On-Demand Data

NameIdCountryDate
James Butt1000United Kingdom2026-04-25
Emily Whobrey1001Russia2026-04-15
Costa Dilliard1002Argentina2026-04-30
Kaitlin Ostrosky1003Canada2026-04-16
Misaki Royster1004Russia2026-04-28
Aruna Figeroa1005Argentina2026-05-07
Jennifer Amigon1006Italy2026-04-19
Ricardo Gaucho1007France2026-05-06
Darci Poquette1008India2026-05-07
Cody Saylors1009Spain2026-05-03
Arvin Albares1010Russia2026-04-28
Aika Inouye1011Japan2026-05-08
Morrow Ruta1012Brazil2026-04-21
Smith Glick1013Australia2026-04-27
Maria Marrier1014France2026-04-28
Julie Stenseth1015Spain2026-05-03
Aika Inouye1016France2026-04-23
Jefferson Schemmer1017Russia2026-04-18
Jones Vocelka1018India2026-05-11
Deepesh Chui1019France2026-04-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Maria MarrierUnited KingdomAnna Fali QUALIFIED
Jennifer AmigonRussiaStephen Shaw RENEWAL
Murillo MaletBrazilOnyama Limba QUALIFIED
Misaki RoysterFranceIoni Bowcher RENEWAL
Alejandro PerinRussiaXuxue Feng PROPOSAL
Francesco ShinkoGermanyStephen Shaw QUALIFIED
James ButtRussiaAmy Elsner QUALIFIED
Antonio CaudyJapanAsiya Javayant QUALIFIED
Salvatore StockhamUnited KingdomOnyama Limba PROPOSAL
Octavia MaletBrazilAsiya Javayant NEW
Antonio CaudyBrazilOnyama Limba NEW
Faith GillianRussiaXuxue Feng NEGOTIATION
Chavez BriddickRussiaIoni Bowcher UNQUALIFIED
Salvatore StockhamJapanAnna Fali RENEWAL
Silvio SlusarskiArgentinaAsiya Javayant PROPOSAL
Nicolas IturbideBrazilIoni Bowcher RENEWAL
James ButtAustraliaElwin Sharvill RENEWAL
Cody SaylorsCanadaIoni Bowcher UNQUALIFIED
Maisha RulapaughItalyAmy Elsner NEGOTIATION
Murillo MaletRussiaAnna Fali NEW
Emily WhobreyItalyIoni Bowcher QUALIFIED
Salvatore StockhamAustraliaAmy Elsner RENEWAL
Deepesh ChuiArgentinaAmy Elsner PROPOSAL
Octavia MaletAustraliaXuxue Feng PROPOSAL
Jefferson SchemmerIndiaBernardo Dominic RENEWAL
Arvin AlbaresItalyStephen Shaw UNQUALIFIED
Ivar PaprockiItalyIoni Bowcher NEW
Maisha RulapaughItalyIoni Bowcher QUALIFIED
Ivar PaprockiFranceXuxue Feng RENEWAL
David DarakjySpainElwin Sharvill NEW
Misaki RoysterArgentinaAmy Elsner UNQUALIFIED
Isabel BowleyCanadaXuxue Feng RENEWAL
Mujtaba NickaItalyAsiya Javayant NEGOTIATION
Johnson SergiUnited KingdomAmy Elsner QUALIFIED
Mujtaba NickaFranceIoni Bowcher UNQUALIFIED
Kaitlin OstroskyJapanElwin Sharvill QUALIFIED
Jefferson SchemmerAustraliaAmy Elsner PROPOSAL
Isabel BowleyJapanBernardo Dominic NEGOTIATION
Jefferson SchemmerCanadaIvan Magalhaes NEGOTIATION
Kadeem FlosiRussiaOnyama Limba 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>