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
Johnson SergiSpainXuxue Feng RENEWAL
Juan WieserCanadaXuxue Feng NEGOTIATION
James ButtFranceOnyama Limba RENEWAL
Tony FollerFranceIoni Bowcher UNQUALIFIED
Emily WhobreyCanadaBernardo Dominic RENEWAL
Wickens NestleBrazilElwin Sharvill UNQUALIFIED
Mayumi KolmetzFranceAnna Fali PROPOSAL
Morrow RutaJapanOnyama Limba NEGOTIATION
Maria MarrierCanadaIvan Magalhaes NEGOTIATION
Sinclair WaycottGermanyAnna Fali PROPOSAL
Emily WhobreyArgentinaAmy Elsner RENEWAL
Chavez BriddickItalyIoni Bowcher RENEWAL
Arvin AlbaresBrazilIvan Magalhaes UNQUALIFIED
Smith GlickJapanXuxue Feng QUALIFIED
Kadeem FlosiCanadaIoni Bowcher RENEWAL
Maria MarrierUnited KingdomStephen Shaw QUALIFIED
Izzy GarufiIndiaOnyama Limba PROPOSAL
Mayumi KolmetzFranceXuxue Feng RENEWAL
James ButtGermanyIoni Bowcher RENEWAL
Chavez BriddickSpainXuxue Feng QUALIFIED
Leja CaldareraUnited KingdomAmy Elsner PROPOSAL
Antonio CaudySpainIvan Magalhaes NEGOTIATION
Greenwood BologniaRussiaOnyama Limba RENEWAL
Aruna FigeroaItalyElwin Sharvill PROPOSAL
Arvin AlbaresCanadaAnna Fali QUALIFIED
Jones VocelkaGermanyElwin Sharvill UNQUALIFIED
Francesco ShinkoGermanyAsiya Javayant RENEWAL
Sinclair WaycottArgentinaIoni Bowcher NEW
Alejandro PerinUnited KingdomIvan Magalhaes NEGOTIATION
Maisha RulapaughBrazilStephen Shaw RENEWAL
Deepesh ChuiBrazilIvan Magalhaes RENEWAL
Maria MarrierRussiaStephen Shaw UNQUALIFIED
Ricardo GauchoAustraliaElwin Sharvill NEW
Johnson SergiJapanXuxue Feng PROPOSAL
Isabel BowleyArgentinaAnna Fali UNQUALIFIED
Leon OldroydArgentinaXuxue Feng UNQUALIFIED
Morrow RutaAustraliaXuxue Feng NEGOTIATION
Claire TollnerSpainStephen Shaw QUALIFIED
Murillo MaletArgentinaXuxue Feng RENEWAL
Johnson SergiIndiaXuxue Feng UNQUALIFIED
Chavez BriddickCanadaIoni Bowcher NEGOTIATION
Stacey MacleadIndiaIoni Bowcher PROPOSAL
Izzy GarufiItalyOnyama Limba NEW
Faith GillianArgentinaAsiya Javayant NEGOTIATION
Aditya KuskoRussiaStephen Shaw RENEWAL
Ivar PaprockiJapanAnna Fali RENEWAL
Jennifer AmigonItalyElwin Sharvill PROPOSAL
Faith GillianFranceStephen Shaw NEW
Johnson SergiSpainIvan Magalhaes UNQUALIFIED
Isabel BowleySpainStephen Shaw NEW
Horizontal
NameCountryRepresentativeStatus
Adams MorascaIndiaAmy Elsner UNQUALIFIED
Isabel BowleyJapanIoni Bowcher UNQUALIFIED
Aika InouyeRussiaAmy Elsner NEW
Stacey MacleadFranceXuxue Feng NEGOTIATION
Smith GlickUnited KingdomXuxue Feng NEGOTIATION
Jeanfrancois VenereArgentinaStephen Shaw QUALIFIED
David DarakjyItalyStephen Shaw QUALIFIED
Kadeem FlosiUnited KingdomStephen Shaw NEW
Ivar PaprockiUnited KingdomBernardo Dominic QUALIFIED
Izzy GarufiItalyStephen Shaw QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Izzy GarufiRussia2026-04-18Printing Dimensions PROPOSAL3Onyama Limba
1001Greenwood BologniaSpain2026-04-12Morlong Associates NEW8Elwin Sharvill
1002Claire TollnerSpain2026-04-30Buckley Miller Wright QUALIFIED58Xuxue Feng
1003Arvin AlbaresUnited Kingdom2026-04-08Morlong Associates UNQUALIFIED95Bernardo Dominic
1004Kaitlin OstroskyItaly2026-04-12Feltz Printing Service RENEWAL32Elwin Sharvill
1005Julie StensethRussia2026-04-24Benton, John B Jr RENEWAL52Onyama Limba
1006Maria MarrierArgentina2026-04-05King, Christopher A Esq NEGOTIATION11Elwin Sharvill
1007Costa DilliardUnited Kingdom2026-04-15Morlong Associates NEGOTIATION57Ivan Magalhaes
1008Murillo MaletIndia2026-04-22King, Christopher A Esq UNQUALIFIED68Ioni Bowcher
1009Rodrigues CampainFrance2026-04-18Buckley Miller Wright NEW72Amy Elsner
1010Morrow RutaJapan2026-04-12Feltz Printing Service UNQUALIFIED80Bernardo Dominic
1011Izzy GarufiIndia2026-05-01Feiner Bros NEGOTIATION86Stephen Shaw
1012Juan WieserSpain2026-04-22Rousseaux, Michael Esq NEGOTIATION7Amy Elsner
1013Aruna FigeroaGermany2026-04-29Chapman, Ross E Esq QUALIFIED11Anna Fali
1014Wickens NestleArgentina2026-04-15Truhlar And Truhlar Attys NEW2Ivan Magalhaes
1015Nicolas IturbideItaly2026-04-07Printing Dimensions UNQUALIFIED18Xuxue Feng
1016Ashley DoeBrazil2026-04-28Printing Dimensions NEGOTIATION47Xuxue Feng
1017Izzy GarufiRussia2026-04-11Buckley Miller Wright NEGOTIATION72Ivan Magalhaes
1018Isabel BowleySpain2026-05-01Feltz Printing Service RENEWAL82Xuxue Feng
1019Stacey MacleadSpain2026-04-30Printing Dimensions UNQUALIFIED9Elwin Sharvill
1020James ButtArgentina2026-04-27Feiner Bros UNQUALIFIED93Bernardo Dominic
1021Claire TollnerJapan2026-04-18King, Christopher A Esq NEW73Stephen Shaw
1022Clifford RimArgentina2026-04-20Truhlar And Truhlar Attys UNQUALIFIED83Ivan Magalhaes
1023Maria MarrierArgentina2026-04-28Benton, John B Jr RENEWAL24Stephen Shaw
1024Leon OldroydArgentina2026-04-12Feiner Bros PROPOSAL82Onyama Limba
1025James ButtArgentina2026-04-07Morlong Associates RENEWAL32Ioni Bowcher
1026Costa DilliardGermany2026-04-06Truhlar And Truhlar Attys RENEWAL20Bernardo Dominic
1027Stacey MacleadJapan2026-04-21Buckley Miller Wright QUALIFIED56Amy Elsner
1028Cody SaylorsIndia2026-04-17King, Christopher A Esq QUALIFIED42Onyama Limba
1029Isabel BowleyItaly2026-04-09Buckley Miller Wright RENEWAL99Stephen Shaw
1030Maisha RulapaughBrazil2026-04-24Chemel, James L Cpa PROPOSAL50Xuxue Feng
1031Maisha RulapaughItaly2026-04-24Feltz Printing Service QUALIFIED78Ioni Bowcher
1032Ivar PaprockiSpain2026-04-11Feltz Printing Service NEW53Ioni Bowcher
1033Mayumi KolmetzGermany2026-04-28Rousseaux, Michael Esq UNQUALIFIED93Asiya Javayant
1034Izzy GarufiIndia2026-04-22Dorl, James J Esq QUALIFIED91Stephen Shaw
1035Maria MarrierFrance2026-04-30Feiner Bros UNQUALIFIED95Elwin Sharvill
1036Morrow RutaCanada2026-04-07Feltz Printing Service NEW13Asiya Javayant
1037Octavia MaletRussia2026-04-22Buckley Miller Wright NEGOTIATION42Anna Fali
1038Julie StensethArgentina2026-04-25Buckley Miller Wright PROPOSAL72Anna Fali
1039Arvin AlbaresAustralia2026-04-23Truhlar And Truhlar Attys NEGOTIATION77Stephen Shaw
1040Jefferson SchemmerUnited Kingdom2026-04-26Dorl, James J Esq PROPOSAL27Ioni Bowcher
1041Darci PoquetteCanada2026-04-08Commercial Press PROPOSAL52Onyama Limba
1042Aika InouyeGermany2026-04-29Chanay, Jeffrey A Esq NEW88Stephen Shaw
1043Clifford RimGermany2026-04-16Commercial Press QUALIFIED62Bernardo Dominic
1044Darci PoquetteRussia2026-04-16Morlong Associates RENEWAL29Bernardo Dominic
1045Alejandro PerinRussia2026-04-11Feiner Bros QUALIFIED69Elwin Sharvill
1046Rodrigues CampainArgentina2026-04-13Feltz Printing Service QUALIFIED76Amy Elsner
1047Morrow RutaRussia2026-04-22Buckley Miller Wright NEW93Amy Elsner
1048Aditya KuskoRussia2026-04-14Rousseaux, Michael Esq UNQUALIFIED19Elwin Sharvill
1049Antonio CaudyAustralia2026-04-04Chapman, Ross E Esq PROPOSAL45Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Julie StensethItalyIoni Bowcher RENEWAL
Salvatore StockhamAustraliaBernardo Dominic NEW
Emily WhobreySpainElwin Sharvill UNQUALIFIED
Salvatore StockhamBrazilStephen Shaw QUALIFIED
Jeanfrancois VenereArgentinaAsiya Javayant PROPOSAL
Maisha RulapaughItalyXuxue Feng PROPOSAL
David DarakjyArgentinaBernardo Dominic PROPOSAL
Silvio SlusarskiUnited KingdomElwin Sharvill UNQUALIFIED
James ButtCanadaElwin Sharvill RENEWAL
Tony FollerArgentinaBernardo Dominic UNQUALIFIED
Darci PoquetteAustraliaBernardo Dominic RENEWAL
Leon OldroydAustraliaXuxue Feng UNQUALIFIED
Sinclair WaycottGermanyAmy Elsner NEW
Maisha RulapaughAustraliaAnna Fali QUALIFIED
Chavez BriddickSpainStephen Shaw NEGOTIATION
Julie StensethJapanIoni Bowcher QUALIFIED
Mujtaba NickaSpainIoni Bowcher RENEWAL
Jefferson SchemmerRussiaIvan Magalhaes NEW
Darci PoquetteGermanyIvan Magalhaes QUALIFIED
Chavez BriddickGermanyIvan Magalhaes UNQUALIFIED
Faith GillianItalyAmy Elsner RENEWAL
Arvin AlbaresAustraliaStephen Shaw QUALIFIED
James ButtIndiaOnyama Limba RENEWAL
Aruna FigeroaItalyAmy Elsner NEGOTIATION
Mayumi KolmetzFranceIvan Magalhaes NEGOTIATION
Octavia MaletJapanAnna Fali NEGOTIATION
Munro FerenczRussiaAnna Fali UNQUALIFIED
Leon OldroydGermanyIoni Bowcher PROPOSAL
Silvio SlusarskiArgentinaElwin Sharvill QUALIFIED
Smith GlickSpainAsiya Javayant NEGOTIATION
Maria MarrierGermanyOnyama Limba NEGOTIATION
Arvin AlbaresAustraliaOnyama Limba QUALIFIED
Mujtaba NickaJapanAmy Elsner NEGOTIATION
David DarakjyJapanStephen Shaw PROPOSAL
Kaitlin OstroskyGermanyBernardo Dominic PROPOSAL
Izzy GarufiGermanyXuxue Feng UNQUALIFIED
Francesco ShinkoBrazilAnna Fali RENEWAL
Octavia MaletCanadaAsiya Javayant NEGOTIATION
Johnson SergiUnited KingdomAnna Fali NEGOTIATION
Smith GlickSpainAnna Fali UNQUALIFIED
Jefferson SchemmerCanadaIoni Bowcher NEW
Morrow RutaJapanElwin Sharvill NEW
Wickens NestleUnited KingdomAmy Elsner UNQUALIFIED
James ButtJapanAmy Elsner PROPOSAL
Clifford RimGermanyAmy Elsner QUALIFIED
Munro FerenczAustraliaIvan Magalhaes QUALIFIED
Aruna FigeroaCanadaXuxue Feng NEGOTIATION
Rodrigues CampainGermanyStephen Shaw QUALIFIED
Jefferson SchemmerArgentinaBernardo Dominic UNQUALIFIED
Antonio CaudyItalyXuxue Feng RENEWAL
Frozen Columns
Name
Morrow Ruta
Ivar Paprocki
Silvio Slusarski
Jeanfrancois Venere
Morrow Ruta
Jennifer Amigon
Morrow Ruta
Aruna Figeroa
Jefferson Schemmer
Ricardo Gaucho
Aika Inouye
Ashley Doe
Alejandro Perin
Octavia Malet
Leja Caldarera
Ashley Doe
Ashley Doe
Nicolas Iturbide
Ivar Paprocki
Leon Oldroyd
Aditya Kusko
Maisha Rulapaugh
Antonio Caudy
Wickens Nestle
Adams Morasca
Leon Oldroyd
Antonio Caudy
Ricardo Gaucho
Jefferson Schemmer
Leja Caldarera
Adams Morasca
Costa Dilliard
Maria Marrier
Aruna Figeroa
Jeanfrancois Venere
Misaki Royster
Deepesh Chui
Leon Oldroyd
Greenwood Bolognia
Adams Morasca
Alejandro Perin
Greenwood Bolognia
Emily Whobrey
Sinclair Waycott
Aditya Kusko
Claire Tollner
Munro Ferencz
Juan Wieser
Arvin Albares
Leja Caldarera
IdCountryDate
1000Italy2026-05-01
1001India2026-04-11
1002Russia2026-04-15
1003Japan2026-04-04
1004Japan2026-04-21
1005Canada2026-04-05
1006Spain2026-04-25
1007France2026-04-21
1008Germany2026-04-08
1009Canada2026-04-18
1010Japan2026-04-26
1011Canada2026-05-02
1012Canada2026-04-23
1013Spain2026-04-30
1014Spain2026-04-17
1015Canada2026-04-17
1016Australia2026-04-22
1017Brazil2026-04-23
1018Spain2026-04-06
1019India2026-04-28
1020Brazil2026-05-01
1021Germany2026-04-06
1022Germany2026-04-21
1023Argentina2026-04-16
1024Russia2026-04-27
1025Italy2026-04-20
1026Germany2026-05-01
1027Argentina2026-04-21
1028Spain2026-04-15
1029Germany2026-04-08
1030United Kingdom2026-04-14
1031United Kingdom2026-04-26
1032India2026-04-14
1033Japan2026-04-26
1034United Kingdom2026-04-17
1035Germany2026-04-23
1036India2026-04-04
1037France2026-04-20
1038India2026-04-15
1039Australia2026-04-27
1040Canada2026-04-15
1041United Kingdom2026-04-18
1042India2026-04-10
1043Germany2026-04-29
1044Brazil2026-04-03
1045Germany2026-04-22
1046Japan2026-04-15
1047Canada2026-04-18
1048Germany2026-04-22
1049India2026-04-12

On-Demand Data

NameIdCountryDate
Jeanfrancois Venere1000United Kingdom2026-04-10
Leon Oldroyd1001Japan2026-04-18
Maria Marrier1002India2026-04-30
Tony Foller1003Argentina2026-04-26
Octavia Malet1004United Kingdom2026-04-13
Aditya Kusko1005Canada2026-04-04
Aruna Figeroa1006Russia2026-04-13
Antonio Caudy1007Germany2026-04-10
Francesco Shinko1008Russia2026-04-23
Kadeem Flosi1009Russia2026-04-15
Aika Inouye1010Canada2026-04-14
Darci Poquette1011Australia2026-04-30
Izzy Garufi1012Australia2026-04-11
Jennifer Amigon1013Canada2026-04-19
Mayumi Kolmetz1014Spain2026-04-27
Morrow Ruta1015Italy2026-04-22
Murillo Malet1016Russia2026-04-20
Smith Glick1017Canada2026-04-03
Maria Marrier1018Argentina2026-04-08
Kadeem Flosi1019Canada2026-04-14
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Stacey MacleadRussiaOnyama Limba UNQUALIFIED
Morrow RutaIndiaIvan Magalhaes NEW
Costa DilliardUnited KingdomOnyama Limba NEGOTIATION
Emily WhobreyAustraliaOnyama Limba RENEWAL
Jones VocelkaArgentinaStephen Shaw RENEWAL
Stacey MacleadIndiaIoni Bowcher PROPOSAL
Misaki RoysterFranceAsiya Javayant PROPOSAL
Jeanfrancois VenereSpainAmy Elsner NEW
Munro FerenczItalyStephen Shaw QUALIFIED
Aruna FigeroaJapanAmy Elsner PROPOSAL
Izzy GarufiArgentinaIoni Bowcher RENEWAL
Emily WhobreyRussiaXuxue Feng UNQUALIFIED
Faith GillianJapanAmy Elsner QUALIFIED
Jennifer AmigonGermanyBernardo Dominic QUALIFIED
Deepesh ChuiArgentinaAnna Fali QUALIFIED
Adams MorascaFranceOnyama Limba PROPOSAL
Cody SaylorsFranceBernardo Dominic NEW
Nicolas IturbideArgentinaAnna Fali UNQUALIFIED
Chavez BriddickBrazilXuxue Feng PROPOSAL
Rodrigues CampainCanadaElwin Sharvill QUALIFIED
Aditya KuskoBrazilBernardo Dominic RENEWAL
Leja CaldareraCanadaOnyama Limba NEGOTIATION
Kaitlin OstroskyJapanIoni Bowcher PROPOSAL
Arvin AlbaresIndiaElwin Sharvill NEGOTIATION
Salvatore StockhamUnited KingdomElwin Sharvill RENEWAL
David DarakjyAustraliaStephen Shaw RENEWAL
Ashley DoeRussiaElwin Sharvill NEW
Emily WhobreyArgentinaIvan Magalhaes NEGOTIATION
Wickens NestleArgentinaAmy Elsner PROPOSAL
Alejandro PerinJapanOnyama Limba NEW
Aruna FigeroaArgentinaStephen Shaw UNQUALIFIED
David DarakjyJapanBernardo Dominic NEW
Aruna FigeroaBrazilBernardo Dominic RENEWAL
Mayumi KolmetzArgentinaElwin Sharvill UNQUALIFIED
Mayumi KolmetzRussiaAsiya Javayant NEGOTIATION
Smith GlickGermanyOnyama Limba RENEWAL
Jeanfrancois VenereItalyAsiya Javayant NEW
Faith GillianCanadaAsiya Javayant NEW
Antonio CaudyBrazilXuxue Feng PROPOSAL
Mujtaba NickaCanadaAsiya Javayant RENEWAL

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