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
Costa DilliardCanadaIvan Magalhaes PROPOSAL
Costa DilliardFranceIoni Bowcher UNQUALIFIED
Aditya KuskoRussiaXuxue Feng QUALIFIED
David DarakjyCanadaIoni Bowcher RENEWAL
Sinclair WaycottBrazilBernardo Dominic RENEWAL
Sinclair WaycottRussiaIoni Bowcher NEW
Misaki RoysterRussiaStephen Shaw PROPOSAL
Maria MarrierFranceStephen Shaw PROPOSAL
Izzy GarufiRussiaBernardo Dominic NEW
Kaitlin OstroskyRussiaIoni Bowcher QUALIFIED
Silvio SlusarskiArgentinaStephen Shaw QUALIFIED
Octavia MaletArgentinaAsiya Javayant NEGOTIATION
Arvin AlbaresArgentinaStephen Shaw UNQUALIFIED
Arvin AlbaresFranceStephen Shaw RENEWAL
Johnson SergiBrazilOnyama Limba NEGOTIATION
Smith GlickArgentinaIvan Magalhaes RENEWAL
Leon OldroydBrazilIvan Magalhaes NEGOTIATION
Leon OldroydUnited KingdomOnyama Limba NEW
Francesco ShinkoArgentinaAmy Elsner NEGOTIATION
Ricardo GauchoArgentinaBernardo Dominic UNQUALIFIED
Leon OldroydItalyAsiya Javayant QUALIFIED
Munro FerenczRussiaIvan Magalhaes RENEWAL
Morrow RutaRussiaStephen Shaw PROPOSAL
Jeanfrancois VenereItalyOnyama Limba UNQUALIFIED
Aika InouyeUnited KingdomXuxue Feng PROPOSAL
Antonio CaudyAustraliaAnna Fali UNQUALIFIED
Aditya KuskoItalyAmy Elsner QUALIFIED
Kadeem FlosiJapanIvan Magalhaes QUALIFIED
Jeanfrancois VenereItalyIvan Magalhaes NEW
Misaki RoysterBrazilAnna Fali QUALIFIED
Izzy GarufiArgentinaStephen Shaw NEW
Octavia MaletArgentinaAnna Fali NEW
Clifford RimAustraliaXuxue Feng NEW
Isabel BowleySpainIoni Bowcher UNQUALIFIED
Smith GlickArgentinaElwin Sharvill NEW
Chavez BriddickSpainIvan Magalhaes QUALIFIED
Salvatore StockhamAustraliaAmy Elsner UNQUALIFIED
Alejandro PerinArgentinaXuxue Feng QUALIFIED
Deepesh ChuiGermanyXuxue Feng NEW
Kadeem FlosiBrazilIoni Bowcher PROPOSAL
David DarakjyGermanyStephen Shaw NEW
Cody SaylorsAustraliaIoni Bowcher RENEWAL
Munro FerenczAustraliaAsiya Javayant PROPOSAL
Ivar PaprockiGermanyAsiya Javayant QUALIFIED
Maisha RulapaughJapanStephen Shaw PROPOSAL
Cody SaylorsItalyElwin Sharvill RENEWAL
Adams MorascaGermanyElwin Sharvill NEGOTIATION
Ivar PaprockiIndiaAnna Fali RENEWAL
Kadeem FlosiUnited KingdomBernardo Dominic NEGOTIATION
Julie StensethRussiaAsiya Javayant QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Leon OldroydArgentinaAmy Elsner PROPOSAL
Isabel BowleyCanadaAmy Elsner QUALIFIED
Leon OldroydItalyIoni Bowcher NEGOTIATION
Maria MarrierRussiaAsiya Javayant NEGOTIATION
Smith GlickBrazilXuxue Feng NEGOTIATION
Murillo MaletCanadaOnyama Limba PROPOSAL
Johnson SergiFranceIoni Bowcher UNQUALIFIED
Mayumi KolmetzItalyIoni Bowcher PROPOSAL
Darci PoquetteItalyOnyama Limba RENEWAL
Costa DilliardBrazilAsiya Javayant NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Faith GillianCanada2025-09-23Feiner Bros NEW34Xuxue Feng
1001Julie StensethFrance2025-09-04Chapman, Ross E Esq QUALIFIED54Anna Fali
1002Silvio SlusarskiJapan2025-09-30King, Christopher A Esq QUALIFIED81Amy Elsner
1003Johnson SergiGermany2025-09-04Chemel, James L Cpa RENEWAL22Onyama Limba
1004Jones VocelkaFrance2025-09-25Morlong Associates QUALIFIED52Stephen Shaw
1005Smith GlickJapan2025-09-09Buckley Miller Wright QUALIFIED25Xuxue Feng
1006Adams MorascaRussia2025-09-28Dorl, James J Esq UNQUALIFIED13Asiya Javayant
1007Aika InouyeRussia2025-09-27Dorl, James J Esq RENEWAL95Anna Fali
1008Costa DilliardGermany2025-09-29Truhlar And Truhlar Attys QUALIFIED66Stephen Shaw
1009David DarakjyFrance2025-09-24Rousseaux, Michael Esq NEGOTIATION10Elwin Sharvill
1010Ricardo GauchoRussia2025-09-29Feltz Printing Service PROPOSAL29Ioni Bowcher
1011Francesco ShinkoArgentina2025-09-21Feiner Bros UNQUALIFIED80Asiya Javayant
1012Salvatore StockhamArgentina2025-09-26Commercial Press QUALIFIED80Anna Fali
1013Aruna FigeroaBrazil2025-09-04Rousseaux, Michael Esq PROPOSAL90Amy Elsner
1014James ButtFrance2025-09-12Benton, John B Jr NEW69Ioni Bowcher
1015Darci PoquetteFrance2025-09-19Feltz Printing Service RENEWAL61Amy Elsner
1016Mujtaba NickaFrance2025-09-04Commercial Press NEW43Elwin Sharvill
1017Aditya KuskoItaly2025-09-09King, Christopher A Esq NEW91Bernardo Dominic
1018Mayumi KolmetzCanada2025-09-22Truhlar And Truhlar Attys NEW9Stephen Shaw
1019James ButtItaly2025-09-15Commercial Press UNQUALIFIED40Xuxue Feng
1020Wickens NestleJapan2025-09-21Feltz Printing Service QUALIFIED1Anna Fali
1021Jefferson SchemmerGermany2025-09-23Chanay, Jeffrey A Esq UNQUALIFIED40Ioni Bowcher
1022Munro FerenczItaly2025-09-25Benton, John B Jr UNQUALIFIED45Asiya Javayant
1023Morrow RutaItaly2025-09-29Buckley Miller Wright QUALIFIED55Elwin Sharvill
1024Tony FollerCanada2025-09-04Feltz Printing Service UNQUALIFIED84Amy Elsner
1025Aika InouyeAustralia2025-10-03Chemel, James L Cpa UNQUALIFIED95Stephen Shaw
1026Alejandro PerinUnited Kingdom2025-09-05King, Christopher A Esq NEGOTIATION3Ioni Bowcher
1027Nicolas IturbideArgentina2025-09-05Truhlar And Truhlar Attys NEW12Asiya Javayant
1028Chavez BriddickCanada2025-09-28Rangoni Of Florence QUALIFIED82Bernardo Dominic
1029Juan WieserItaly2025-09-11Chapman, Ross E Esq RENEWAL95Stephen Shaw
1030Isabel BowleyFrance2025-09-25Printing Dimensions PROPOSAL75Ivan Magalhaes
1031Ashley DoeFrance2025-09-12Feltz Printing Service PROPOSAL46Stephen Shaw
1032Nicolas IturbideArgentina2025-10-03Buckley Miller Wright NEW4Stephen Shaw
1033Izzy GarufiRussia2025-09-13Chapman, Ross E Esq PROPOSAL43Bernardo Dominic
1034Julie StensethAustralia2025-09-28Buckley Miller Wright NEW26Xuxue Feng
1035Aditya KuskoRussia2025-09-25Printing Dimensions UNQUALIFIED34Stephen Shaw
1036Claire TollnerGermany2025-09-21Buckley Miller Wright QUALIFIED9Bernardo Dominic
1037Leja CaldareraAustralia2025-09-16Rangoni Of Florence UNQUALIFIED36Amy Elsner
1038David DarakjyCanada2025-09-10Benton, John B Jr QUALIFIED82Bernardo Dominic
1039Isabel BowleyCanada2025-09-07Chapman, Ross E Esq QUALIFIED28Xuxue Feng
1040Ivar PaprockiUnited Kingdom2025-09-07Rousseaux, Michael Esq QUALIFIED98Elwin Sharvill
1041Wickens NestleRussia2025-09-21Morlong Associates NEGOTIATION6Elwin Sharvill
1042Ricardo GauchoUnited Kingdom2025-09-07Rousseaux, Michael Esq RENEWAL2Onyama Limba
1043Silvio SlusarskiFrance2025-09-25Dorl, James J Esq PROPOSAL8Xuxue Feng
1044Jefferson SchemmerJapan2025-09-29Printing Dimensions UNQUALIFIED43Onyama Limba
1045Murillo MaletGermany2025-09-15Rangoni Of Florence NEGOTIATION30Bernardo Dominic
1046James ButtItaly2025-09-04Rangoni Of Florence PROPOSAL96Ivan Magalhaes
1047Johnson SergiUnited Kingdom2025-09-05Buckley Miller Wright RENEWAL10Ivan Magalhaes
1048Stacey MacleadGermany2025-09-30Truhlar And Truhlar Attys NEGOTIATION30Onyama Limba
1049Morrow RutaArgentina2025-09-09Dorl, James J Esq NEW0Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Mayumi KolmetzAustraliaIvan Magalhaes NEW
Clifford RimIndiaAmy Elsner RENEWAL
Johnson SergiIndiaIvan Magalhaes QUALIFIED
Aruna FigeroaGermanyElwin Sharvill NEW
Stacey MacleadAustraliaXuxue Feng NEGOTIATION
Smith GlickAustraliaIvan Magalhaes UNQUALIFIED
Salvatore StockhamItalyAmy Elsner RENEWAL
Sinclair WaycottCanadaAnna Fali RENEWAL
Julie StensethArgentinaStephen Shaw QUALIFIED
Sinclair WaycottRussiaStephen Shaw PROPOSAL
Wickens NestleBrazilOnyama Limba QUALIFIED
Aruna FigeroaUnited KingdomAmy Elsner NEGOTIATION
Munro FerenczIndiaAmy Elsner NEGOTIATION
Stacey MacleadArgentinaXuxue Feng PROPOSAL
Johnson SergiBrazilStephen Shaw NEGOTIATION
Sinclair WaycottRussiaIoni Bowcher QUALIFIED
Greenwood BologniaUnited KingdomElwin Sharvill NEW
Darci PoquetteItalyAsiya Javayant NEGOTIATION
Munro FerenczUnited KingdomBernardo Dominic QUALIFIED
Ricardo GauchoRussiaBernardo Dominic QUALIFIED
Murillo MaletJapanXuxue Feng PROPOSAL
Kadeem FlosiUnited KingdomIoni Bowcher NEGOTIATION
Tony FollerJapanXuxue Feng NEW
Jennifer AmigonFranceStephen Shaw UNQUALIFIED
Francesco ShinkoJapanXuxue Feng NEW
Salvatore StockhamUnited KingdomIvan Magalhaes NEW
Salvatore StockhamGermanyAnna Fali QUALIFIED
Rodrigues CampainBrazilAsiya Javayant NEGOTIATION
Tony FollerUnited KingdomOnyama Limba RENEWAL
Jeanfrancois VenereJapanIvan Magalhaes UNQUALIFIED
David DarakjyJapanIoni Bowcher UNQUALIFIED
Murillo MaletUnited KingdomAmy Elsner NEGOTIATION
Rodrigues CampainFranceStephen Shaw QUALIFIED
Johnson SergiUnited KingdomXuxue Feng UNQUALIFIED
Deepesh ChuiUnited KingdomAmy Elsner QUALIFIED
Clifford RimFranceStephen Shaw NEW
Aika InouyeFranceXuxue Feng QUALIFIED
Tony FollerBrazilIvan Magalhaes PROPOSAL
Jefferson SchemmerJapanElwin Sharvill UNQUALIFIED
Misaki RoysterAustraliaAmy Elsner RENEWAL
Silvio SlusarskiCanadaAmy Elsner NEW
Ashley DoeArgentinaOnyama Limba QUALIFIED
Faith GillianUnited KingdomAnna Fali RENEWAL
Emily WhobreyArgentinaAnna Fali UNQUALIFIED
Deepesh ChuiSpainAsiya Javayant NEGOTIATION
Costa DilliardIndiaAsiya Javayant NEGOTIATION
Izzy GarufiIndiaStephen Shaw QUALIFIED
Wickens NestleRussiaAsiya Javayant NEW
Francesco ShinkoRussiaElwin Sharvill QUALIFIED
Isabel BowleyAustraliaElwin Sharvill NEGOTIATION
Frozen Columns
Name
Costa Dilliard
Claire Tollner
Stacey Maclead
Misaki Royster
Deepesh Chui
Maisha Rulapaugh
Adams Morasca
Sinclair Waycott
Isabel Bowley
Ricardo Gaucho
Leja Caldarera
Kadeem Flosi
Jones Vocelka
Francesco Shinko
Claire Tollner
Jennifer Amigon
Octavia Malet
Emily Whobrey
Francesco Shinko
Emily Whobrey
Isabel Bowley
Wickens Nestle
Deepesh Chui
David Darakjy
Jeanfrancois Venere
Leon Oldroyd
Wickens Nestle
Silvio Slusarski
Faith Gillian
Aditya Kusko
Cody Saylors
Murillo Malet
Clifford Rim
Alejandro Perin
Maisha Rulapaugh
Sinclair Waycott
Leon Oldroyd
Kaitlin Ostrosky
Jennifer Amigon
Greenwood Bolognia
Juan Wieser
Jeanfrancois Venere
Murillo Malet
Jefferson Schemmer
Octavia Malet
Smith Glick
Claire Tollner
Adams Morasca
Maisha Rulapaugh
Ricardo Gaucho
IdCountryDate
1000Canada2025-09-29
1001India2025-09-07
1002Australia2025-09-23
1003India2025-09-16
1004Japan2025-10-01
1005France2025-09-15
1006Argentina2025-09-27
1007United Kingdom2025-09-23
1008France2025-09-15
1009Japan2025-09-06
1010France2025-09-23
1011Germany2025-09-15
1012Japan2025-09-26
1013Italy2025-09-30
1014United Kingdom2025-09-18
1015Japan2025-09-24
1016Japan2025-09-25
1017Argentina2025-09-29
1018United Kingdom2025-09-25
1019Argentina2025-09-20
1020Russia2025-09-11
1021Italy2025-09-06
1022Brazil2025-09-29
1023Spain2025-09-19
1024Canada2025-09-21
1025Italy2025-09-06
1026Canada2025-09-05
1027Germany2025-09-16
1028Spain2025-09-30
1029Brazil2025-09-15
1030Canada2025-09-23
1031Italy2025-09-09
1032Argentina2025-09-04
1033Spain2025-09-18
1034Australia2025-09-08
1035Canada2025-09-24
1036Brazil2025-09-14
1037Germany2025-09-30
1038Japan2025-09-10
1039United Kingdom2025-09-19
1040Spain2025-10-03
1041Japan2025-09-17
1042Germany2025-09-20
1043United Kingdom2025-10-02
1044Brazil2025-09-17
1045Germany2025-09-23
1046Brazil2025-09-13
1047Brazil2025-09-23
1048Italy2025-09-06
1049Germany2025-09-09

On-Demand Data

NameIdCountryDate
Nicolas Iturbide1000India2025-09-13
Jones Vocelka1001India2025-09-14
Aika Inouye1002Spain2025-09-15
Wickens Nestle1003Russia2025-09-14
Sinclair Waycott1004Australia2025-09-28
Jeanfrancois Venere1005Argentina2025-09-07
Mujtaba Nicka1006United Kingdom2025-09-10
Deepesh Chui1007Australia2025-09-16
Julie Stenseth1008Canada2025-09-15
Salvatore Stockham1009Russia2025-09-12
Jones Vocelka1010Argentina2025-10-03
Costa Dilliard1011United Kingdom2025-09-19
Isabel Bowley1012Russia2025-09-24
Johnson Sergi1013Russia2025-09-08
Jeanfrancois Venere1014Italy2025-09-15
Jeanfrancois Venere1015Brazil2025-09-09
Alejandro Perin1016Canada2025-09-10
Faith Gillian1017Canada2025-09-23
Rodrigues Campain1018United Kingdom2025-09-04
Ashley Doe1019France2025-09-13
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aditya KuskoAustraliaIoni Bowcher RENEWAL
Isabel BowleyGermanyBernardo Dominic NEW
Jennifer AmigonArgentinaXuxue Feng RENEWAL
Ivar PaprockiItalyOnyama Limba RENEWAL
Chavez BriddickItalyIvan Magalhaes RENEWAL
Aika InouyeAustraliaXuxue Feng NEW
Leja CaldareraFranceAnna Fali UNQUALIFIED
Tony FollerItalyStephen Shaw UNQUALIFIED
Izzy GarufiCanadaElwin Sharvill PROPOSAL
Wickens NestleUnited KingdomXuxue Feng NEGOTIATION
Rodrigues CampainAustraliaElwin Sharvill NEGOTIATION
Clifford RimCanadaAmy Elsner PROPOSAL
Leon OldroydSpainIvan Magalhaes PROPOSAL
Leja CaldareraRussiaStephen Shaw UNQUALIFIED
Leon OldroydAustraliaAmy Elsner UNQUALIFIED
Costa DilliardArgentinaAmy Elsner UNQUALIFIED
Francesco ShinkoJapanAnna Fali NEW
Claire TollnerFranceElwin Sharvill QUALIFIED
Leja CaldareraAustraliaIvan Magalhaes QUALIFIED
Greenwood BologniaUnited KingdomOnyama Limba UNQUALIFIED
Francesco ShinkoGermanyXuxue Feng PROPOSAL
Kaitlin OstroskyFranceAnna Fali QUALIFIED
Jones VocelkaIndiaAmy Elsner RENEWAL
Misaki RoysterGermanyBernardo Dominic PROPOSAL
Murillo MaletIndiaOnyama Limba RENEWAL
Stacey MacleadArgentinaXuxue Feng QUALIFIED
Adams MorascaUnited KingdomElwin Sharvill NEW
Ashley DoeItalyAsiya Javayant NEW
Deepesh ChuiAustraliaIvan Magalhaes NEGOTIATION
Isabel BowleyAustraliaXuxue Feng NEW
Costa DilliardCanadaIvan Magalhaes NEW
Wickens NestleGermanyBernardo Dominic PROPOSAL
Kaitlin OstroskyUnited KingdomAnna Fali PROPOSAL
Francesco ShinkoFranceAnna Fali NEGOTIATION
Mujtaba NickaFranceBernardo Dominic NEW
Tony FollerIndiaStephen Shaw NEW
Arvin AlbaresUnited KingdomIvan Magalhaes UNQUALIFIED
Ashley DoeAustraliaStephen Shaw PROPOSAL
Alejandro PerinItalyAsiya Javayant NEGOTIATION
Morrow RutaJapanOnyama 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>