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
Izzy GarufiFranceAnna Fali NEGOTIATION
Maria MarrierCanadaAsiya Javayant RENEWAL
Claire TollnerCanadaStephen Shaw PROPOSAL
Isabel BowleySpainAmy Elsner PROPOSAL
David DarakjyUnited KingdomXuxue Feng RENEWAL
Morrow RutaArgentinaIvan Magalhaes PROPOSAL
Ricardo GauchoFranceAmy Elsner UNQUALIFIED
Salvatore StockhamCanadaBernardo Dominic PROPOSAL
Claire TollnerBrazilAsiya Javayant UNQUALIFIED
Alejandro PerinGermanyIoni Bowcher UNQUALIFIED
Kadeem FlosiItalyStephen Shaw QUALIFIED
Kaitlin OstroskyGermanyAnna Fali PROPOSAL
Leon OldroydItalyStephen Shaw PROPOSAL
Jones VocelkaItalyElwin Sharvill RENEWAL
Jennifer AmigonGermanyOnyama Limba PROPOSAL
Salvatore StockhamSpainAmy Elsner RENEWAL
Sinclair WaycottFranceStephen Shaw NEGOTIATION
Maria MarrierGermanyBernardo Dominic NEGOTIATION
Jones VocelkaBrazilIoni Bowcher RENEWAL
Faith GillianSpainElwin Sharvill QUALIFIED
Maisha RulapaughCanadaStephen Shaw NEGOTIATION
Ashley DoeGermanyIoni Bowcher UNQUALIFIED
Isabel BowleyItalyIvan Magalhaes UNQUALIFIED
Smith GlickIndiaAmy Elsner RENEWAL
Johnson SergiBrazilIvan Magalhaes PROPOSAL
Juan WieserBrazilStephen Shaw PROPOSAL
Cody SaylorsFranceOnyama Limba NEGOTIATION
Costa DilliardRussiaElwin Sharvill QUALIFIED
Maisha RulapaughArgentinaIoni Bowcher PROPOSAL
Arvin AlbaresGermanyElwin Sharvill RENEWAL
Maisha RulapaughSpainXuxue Feng NEGOTIATION
Rodrigues CampainJapanAmy Elsner NEGOTIATION
Aika InouyeItalyAsiya Javayant NEW
Tony FollerItalyElwin Sharvill NEGOTIATION
Johnson SergiUnited KingdomAnna Fali QUALIFIED
Ashley DoeBrazilOnyama Limba PROPOSAL
Jennifer AmigonCanadaBernardo Dominic RENEWAL
Jennifer AmigonArgentinaStephen Shaw NEW
James ButtArgentinaAnna Fali RENEWAL
Kadeem FlosiFranceOnyama Limba UNQUALIFIED
Aika InouyeSpainAnna Fali NEGOTIATION
Misaki RoysterArgentinaBernardo Dominic QUALIFIED
Cody SaylorsAustraliaOnyama Limba RENEWAL
Morrow RutaJapanXuxue Feng NEW
Johnson SergiFranceIvan Magalhaes NEW
Mujtaba NickaCanadaBernardo Dominic NEW
Smith GlickArgentinaXuxue Feng NEGOTIATION
Antonio CaudyIndiaStephen Shaw NEGOTIATION
Claire TollnerArgentinaAnna Fali RENEWAL
Jennifer AmigonUnited KingdomStephen Shaw NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Faith GillianGermanyStephen Shaw PROPOSAL
Kadeem FlosiItalyAmy Elsner UNQUALIFIED
Leon OldroydUnited KingdomOnyama Limba RENEWAL
Claire TollnerItalyIvan Magalhaes NEGOTIATION
Jefferson SchemmerCanadaStephen Shaw UNQUALIFIED
Morrow RutaFranceOnyama Limba QUALIFIED
Darci PoquetteBrazilAsiya Javayant QUALIFIED
Antonio CaudyGermanyXuxue Feng NEGOTIATION
Deepesh ChuiRussiaAsiya Javayant NEW
Wickens NestleIndiaIoni Bowcher PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Leja CaldareraCanada2025-07-05Rousseaux, Michael Esq PROPOSAL13Xuxue Feng
1001Clifford RimUnited Kingdom2025-07-21Chapman, Ross E Esq RENEWAL74Ioni Bowcher
1002James ButtUnited Kingdom2025-07-10Commercial Press UNQUALIFIED23Elwin Sharvill
1003Leja CaldareraIndia2025-07-19Feltz Printing Service RENEWAL17Elwin Sharvill
1004Chavez BriddickItaly2025-07-19Truhlar And Truhlar Attys PROPOSAL12Amy Elsner
1005Deepesh ChuiAustralia2025-07-26Truhlar And Truhlar Attys NEW67Bernardo Dominic
1006James ButtItaly2025-08-02Truhlar And Truhlar Attys QUALIFIED78Xuxue Feng
1007Claire TollnerSpain2025-07-05Dorl, James J Esq UNQUALIFIED23Ivan Magalhaes
1008Jennifer AmigonGermany2025-08-03Feltz Printing Service RENEWAL54Bernardo Dominic
1009Jennifer AmigonGermany2025-07-13Chapman, Ross E Esq PROPOSAL69Bernardo Dominic
1010Octavia MaletUnited Kingdom2025-07-14Feiner Bros NEW27Ioni Bowcher
1011Chavez BriddickSpain2025-07-10Chapman, Ross E Esq NEGOTIATION97Anna Fali
1012Tony FollerJapan2025-07-20Benton, John B Jr UNQUALIFIED22Xuxue Feng
1013Arvin AlbaresSpain2025-07-17Morlong Associates NEW13Ivan Magalhaes
1014Costa DilliardItaly2025-07-19Printing Dimensions PROPOSAL44Onyama Limba
1015Munro FerenczIndia2025-07-21Chapman, Ross E Esq QUALIFIED29Elwin Sharvill
1016Ashley DoeItaly2025-07-30Rousseaux, Michael Esq RENEWAL69Xuxue Feng
1017Maisha RulapaughIndia2025-07-23Commercial Press NEW95Xuxue Feng
1018Nicolas IturbideJapan2025-07-09Chanay, Jeffrey A Esq PROPOSAL10Bernardo Dominic
1019Aika InouyeItaly2025-08-01Chapman, Ross E Esq NEW91Ioni Bowcher
1020Deepesh ChuiAustralia2025-08-01Chanay, Jeffrey A Esq NEW67Elwin Sharvill
1021Deepesh ChuiUnited Kingdom2025-08-01Printing Dimensions UNQUALIFIED1Onyama Limba
1022Alejandro PerinItaly2025-07-19Morlong Associates PROPOSAL39Ioni Bowcher
1023Kadeem FlosiAustralia2025-07-26Truhlar And Truhlar Attys NEW79Amy Elsner
1024Jeanfrancois VenereBrazil2025-07-24Feltz Printing Service NEW77Onyama Limba
1025Mayumi KolmetzAustralia2025-07-27Feltz Printing Service UNQUALIFIED38Stephen Shaw
1026Johnson SergiIndia2025-08-01Benton, John B Jr NEW6Onyama Limba
1027Tony FollerRussia2025-07-28Feltz Printing Service RENEWAL68Bernardo Dominic
1028Maisha RulapaughRussia2025-08-03Buckley Miller Wright QUALIFIED92Elwin Sharvill
1029Wickens NestleRussia2025-08-03Chapman, Ross E Esq NEGOTIATION77Anna Fali
1030Adams MorascaRussia2025-07-28Printing Dimensions RENEWAL85Anna Fali
1031Chavez BriddickItaly2025-07-10King, Christopher A Esq RENEWAL23Ivan Magalhaes
1032Misaki RoysterCanada2025-08-02Benton, John B Jr QUALIFIED9Xuxue Feng
1033Juan WieserItaly2025-08-01Buckley Miller Wright PROPOSAL20Bernardo Dominic
1034Misaki RoysterSpain2025-07-09Rangoni Of Florence NEGOTIATION51Anna Fali
1035Juan WieserIndia2025-07-20Feltz Printing Service PROPOSAL52Anna Fali
1036Deepesh ChuiBrazil2025-07-14Buckley Miller Wright PROPOSAL93Anna Fali
1037Izzy GarufiAustralia2025-07-21Commercial Press NEGOTIATION66Onyama Limba
1038Alejandro PerinFrance2025-07-18Printing Dimensions UNQUALIFIED90Stephen Shaw
1039Salvatore StockhamArgentina2025-07-30Chemel, James L Cpa RENEWAL58Xuxue Feng
1040Munro FerenczAustralia2025-07-05Buckley Miller Wright UNQUALIFIED25Elwin Sharvill
1041Leja CaldareraSpain2025-07-17Rangoni Of Florence NEW48Xuxue Feng
1042Mayumi KolmetzGermany2025-07-19Printing Dimensions QUALIFIED58Amy Elsner
1043Leon OldroydRussia2025-07-22Rangoni Of Florence RENEWAL8Stephen Shaw
1044Johnson SergiSpain2025-07-21Feltz Printing Service QUALIFIED58Amy Elsner
1045Clifford RimArgentina2025-07-28Rangoni Of Florence PROPOSAL37Ivan Magalhaes
1046Wickens NestleCanada2025-07-06King, Christopher A Esq NEGOTIATION45Elwin Sharvill
1047Stacey MacleadRussia2025-07-31Chemel, James L Cpa UNQUALIFIED72Stephen Shaw
1048Salvatore StockhamBrazil2025-07-31Chemel, James L Cpa NEGOTIATION69Ioni Bowcher
1049Cody SaylorsSpain2025-07-29Feiner Bros RENEWAL96Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Antonio CaudyCanadaAnna Fali NEW
Maisha RulapaughIndiaXuxue Feng UNQUALIFIED
Johnson SergiJapanXuxue Feng NEW
Mujtaba NickaGermanyIoni Bowcher NEGOTIATION
Julie StensethAustraliaStephen Shaw NEW
Murillo MaletRussiaElwin Sharvill QUALIFIED
Costa DilliardIndiaIoni Bowcher UNQUALIFIED
Leja CaldareraIndiaAnna Fali QUALIFIED
Izzy GarufiGermanyOnyama Limba QUALIFIED
Jefferson SchemmerIndiaStephen Shaw NEGOTIATION
Rodrigues CampainBrazilAnna Fali RENEWAL
Clifford RimRussiaAmy Elsner UNQUALIFIED
Jennifer AmigonIndiaStephen Shaw QUALIFIED
Izzy GarufiGermanyXuxue Feng QUALIFIED
Sinclair WaycottJapanAnna Fali NEW
Juan WieserRussiaAsiya Javayant NEW
Sinclair WaycottIndiaElwin Sharvill UNQUALIFIED
Julie StensethAustraliaAnna Fali QUALIFIED
Jeanfrancois VenereFranceOnyama Limba UNQUALIFIED
Stacey MacleadRussiaOnyama Limba NEGOTIATION
Jennifer AmigonArgentinaAnna Fali NEW
Johnson SergiAustraliaXuxue Feng NEGOTIATION
Jones VocelkaRussiaAnna Fali PROPOSAL
Nicolas IturbideBrazilStephen Shaw PROPOSAL
Jennifer AmigonFranceElwin Sharvill NEW
Deepesh ChuiUnited KingdomStephen Shaw UNQUALIFIED
Ricardo GauchoCanadaOnyama Limba RENEWAL
Claire TollnerCanadaAmy Elsner RENEWAL
Octavia MaletFranceIoni Bowcher NEGOTIATION
Aruna FigeroaItalyAsiya Javayant PROPOSAL
Jennifer AmigonIndiaXuxue Feng RENEWAL
Costa DilliardItalyBernardo Dominic UNQUALIFIED
Smith GlickAustraliaAmy Elsner UNQUALIFIED
Nicolas IturbideIndiaAmy Elsner PROPOSAL
Octavia MaletItalyIoni Bowcher QUALIFIED
Wickens NestleAustraliaAsiya Javayant PROPOSAL
Smith GlickFranceElwin Sharvill UNQUALIFIED
Maisha RulapaughJapanElwin Sharvill NEW
Isabel BowleyIndiaAnna Fali PROPOSAL
Johnson SergiArgentinaIvan Magalhaes QUALIFIED
Aruna FigeroaIndiaOnyama Limba RENEWAL
Clifford RimUnited KingdomAnna Fali PROPOSAL
Johnson SergiGermanyStephen Shaw RENEWAL
Ricardo GauchoItalyXuxue Feng NEW
Izzy GarufiItalyOnyama Limba UNQUALIFIED
Jeanfrancois VenereFranceAnna Fali NEW
Johnson SergiBrazilBernardo Dominic QUALIFIED
Wickens NestleCanadaAnna Fali NEW
Ashley DoeIndiaXuxue Feng NEW
Greenwood BologniaRussiaStephen Shaw NEGOTIATION
Frozen Columns
Name
Sinclair Waycott
Maria Marrier
Jefferson Schemmer
Nicolas Iturbide
Deepesh Chui
Antonio Caudy
Arvin Albares
Cody Saylors
Murillo Malet
Smith Glick
David Darakjy
Ricardo Gaucho
Stacey Maclead
Darci Poquette
Salvatore Stockham
Octavia Malet
Costa Dilliard
Kaitlin Ostrosky
Tony Foller
Costa Dilliard
Julie Stenseth
Faith Gillian
Jones Vocelka
Juan Wieser
Aruna Figeroa
Leon Oldroyd
Emily Whobrey
Ricardo Gaucho
Costa Dilliard
Francesco Shinko
Adams Morasca
Maisha Rulapaugh
Johnson Sergi
Silvio Slusarski
Johnson Sergi
Deepesh Chui
Aika Inouye
Aruna Figeroa
Aruna Figeroa
Aditya Kusko
Jones Vocelka
Maisha Rulapaugh
Clifford Rim
Aditya Kusko
Morrow Ruta
Salvatore Stockham
Nicolas Iturbide
Arvin Albares
Maisha Rulapaugh
Francesco Shinko
IdCountryDate
1000Russia2025-07-31
1001Russia2025-07-22
1002United Kingdom2025-07-17
1003Brazil2025-07-10
1004Russia2025-08-03
1005Australia2025-07-07
1006Argentina2025-07-16
1007Brazil2025-07-08
1008Russia2025-07-27
1009Germany2025-07-22
1010United Kingdom2025-07-07
1011India2025-07-13
1012Italy2025-07-28
1013Italy2025-07-20
1014Spain2025-07-14
1015Argentina2025-08-01
1016Japan2025-07-25
1017Russia2025-07-07
1018France2025-07-14
1019Canada2025-07-21
1020Japan2025-07-08
1021Argentina2025-07-11
1022Australia2025-08-02
1023Japan2025-08-02
1024Australia2025-07-20
1025Canada2025-07-14
1026Brazil2025-07-19
1027Canada2025-07-06
1028Brazil2025-07-29
1029Russia2025-08-02
1030Argentina2025-07-11
1031Brazil2025-07-18
1032Canada2025-07-26
1033Brazil2025-07-06
1034Russia2025-07-25
1035Canada2025-07-10
1036Japan2025-07-16
1037United Kingdom2025-07-17
1038Italy2025-07-29
1039India2025-07-25
1040Italy2025-07-16
1041France2025-07-26
1042Brazil2025-07-23
1043Canada2025-07-13
1044Italy2025-07-31
1045Brazil2025-08-02
1046Russia2025-07-05
1047Australia2025-08-03
1048United Kingdom2025-07-15
1049Russia2025-07-20

On-Demand Data

NameIdCountryDate
Costa Dilliard1000Argentina2025-07-17
Silvio Slusarski1001Spain2025-07-08
Costa Dilliard1002Russia2025-07-08
David Darakjy1003Brazil2025-07-24
Mayumi Kolmetz1004Italy2025-07-22
Nicolas Iturbide1005Argentina2025-07-30
Adams Morasca1006France2025-07-18
Ricardo Gaucho1007Spain2025-07-13
Aruna Figeroa1008Spain2025-07-24
Juan Wieser1009Spain2025-07-29
Maisha Rulapaugh1010Germany2025-07-06
Clifford Rim1011Canada2025-07-12
Morrow Ruta1012United Kingdom2025-07-20
Silvio Slusarski1013Germany2025-07-28
Alejandro Perin1014Brazil2025-07-21
Silvio Slusarski1015Australia2025-07-27
Greenwood Bolognia1016Spain2025-07-12
Morrow Ruta1017Brazil2025-07-11
Claire Tollner1018Argentina2025-07-20
Maria Marrier1019Canada2025-07-08
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jeanfrancois VenereGermanyAmy Elsner RENEWAL
Wickens NestleCanadaIoni Bowcher RENEWAL
Maria MarrierRussiaStephen Shaw NEGOTIATION
Adams MorascaItalyBernardo Dominic PROPOSAL
Greenwood BologniaArgentinaXuxue Feng NEW
Leja CaldareraArgentinaBernardo Dominic PROPOSAL
Jeanfrancois VenereSpainElwin Sharvill RENEWAL
Ashley DoeIndiaIoni Bowcher PROPOSAL
Jeanfrancois VenereSpainAmy Elsner RENEWAL
Isabel BowleyArgentinaStephen Shaw NEGOTIATION
Ashley DoeArgentinaAnna Fali UNQUALIFIED
Aditya KuskoItalyIvan Magalhaes QUALIFIED
Smith GlickJapanElwin Sharvill NEW
Maria MarrierArgentinaIoni Bowcher QUALIFIED
Aika InouyeFranceAmy Elsner NEGOTIATION
Jefferson SchemmerIndiaStephen Shaw NEGOTIATION
Maisha RulapaughBrazilAnna Fali NEW
Maisha RulapaughSpainIvan Magalhaes NEW
Kaitlin OstroskyItalyStephen Shaw NEGOTIATION
Munro FerenczGermanyAmy Elsner RENEWAL
Silvio SlusarskiAustraliaIvan Magalhaes RENEWAL
Mujtaba NickaFranceElwin Sharvill QUALIFIED
Emily WhobreyAustraliaBernardo Dominic UNQUALIFIED
Isabel BowleyAustraliaStephen Shaw UNQUALIFIED
Claire TollnerSpainAmy Elsner PROPOSAL
Kaitlin OstroskyAustraliaAmy Elsner PROPOSAL
Ivar PaprockiAustraliaOnyama Limba NEGOTIATION
Misaki RoysterSpainAnna Fali NEGOTIATION
Jones VocelkaJapanIvan Magalhaes NEW
Kadeem FlosiCanadaAsiya Javayant NEGOTIATION
Salvatore StockhamSpainOnyama Limba RENEWAL
Claire TollnerRussiaAmy Elsner QUALIFIED
Wickens NestleSpainAmy Elsner NEGOTIATION
Clifford RimSpainAsiya Javayant RENEWAL
Kaitlin OstroskyRussiaAnna Fali UNQUALIFIED
Ivar PaprockiJapanIvan Magalhaes QUALIFIED
Juan WieserAustraliaAmy Elsner NEGOTIATION
Ivar PaprockiBrazilIvan Magalhaes QUALIFIED
Misaki RoysterUnited KingdomStephen Shaw QUALIFIED
Maisha RulapaughUnited KingdomElwin Sharvill 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>