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
Sinclair WaycottCanadaAsiya Javayant PROPOSAL
David DarakjySpainXuxue Feng NEW
Sinclair WaycottJapanAsiya Javayant NEGOTIATION
David DarakjySpainIvan Magalhaes NEW
Sinclair WaycottArgentinaIvan Magalhaes NEW
Emily WhobreyGermanyIoni Bowcher QUALIFIED
Misaki RoysterJapanIoni Bowcher NEW
Maria MarrierAustraliaAsiya Javayant RENEWAL
Jeanfrancois VenereSpainOnyama Limba NEGOTIATION
Emily WhobreyIndiaIvan Magalhaes PROPOSAL
Munro FerenczIndiaElwin Sharvill NEW
Greenwood BologniaSpainStephen Shaw QUALIFIED
Leja CaldareraAustraliaIoni Bowcher NEGOTIATION
Izzy GarufiRussiaElwin Sharvill NEW
Mujtaba NickaRussiaIoni Bowcher NEW
Maria MarrierUnited KingdomElwin Sharvill PROPOSAL
Darci PoquetteBrazilOnyama Limba RENEWAL
Murillo MaletFranceAnna Fali UNQUALIFIED
Maria MarrierUnited KingdomAmy Elsner UNQUALIFIED
Salvatore StockhamGermanyAsiya Javayant NEW
Costa DilliardGermanyStephen Shaw NEGOTIATION
Tony FollerSpainXuxue Feng QUALIFIED
Adams MorascaItalyAsiya Javayant UNQUALIFIED
Tony FollerItalyStephen Shaw UNQUALIFIED
Misaki RoysterIndiaAsiya Javayant UNQUALIFIED
Mujtaba NickaAustraliaXuxue Feng QUALIFIED
Maria MarrierUnited KingdomAnna Fali RENEWAL
Jones VocelkaGermanyElwin Sharvill NEW
Ashley DoeIndiaIoni Bowcher RENEWAL
Smith GlickJapanBernardo Dominic PROPOSAL
Mujtaba NickaBrazilAsiya Javayant QUALIFIED
Ricardo GauchoIndiaOnyama Limba PROPOSAL
Jennifer AmigonIndiaAsiya Javayant RENEWAL
Johnson SergiSpainElwin Sharvill QUALIFIED
Deepesh ChuiJapanStephen Shaw QUALIFIED
Cody SaylorsUnited KingdomElwin Sharvill NEW
David DarakjyFranceBernardo Dominic QUALIFIED
Leja CaldareraGermanyXuxue Feng RENEWAL
Emily WhobreySpainOnyama Limba RENEWAL
Ivar PaprockiBrazilIvan Magalhaes NEGOTIATION
Leja CaldareraJapanIvan Magalhaes QUALIFIED
Aika InouyeIndiaIvan Magalhaes UNQUALIFIED
Wickens NestleRussiaAsiya Javayant NEGOTIATION
Greenwood BologniaFranceBernardo Dominic UNQUALIFIED
Silvio SlusarskiJapanOnyama Limba NEW
Jones VocelkaSpainAsiya Javayant NEW
Costa DilliardUnited KingdomXuxue Feng NEW
James ButtRussiaXuxue Feng UNQUALIFIED
Wickens NestleUnited KingdomAnna Fali QUALIFIED
Misaki RoysterGermanyIvan Magalhaes UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Misaki RoysterJapanIvan Magalhaes RENEWAL
Chavez BriddickArgentinaIoni Bowcher QUALIFIED
Mujtaba NickaAustraliaAsiya Javayant PROPOSAL
Alejandro PerinCanadaAnna Fali PROPOSAL
Ricardo GauchoGermanyAmy Elsner QUALIFIED
Julie StensethBrazilBernardo Dominic PROPOSAL
Mujtaba NickaCanadaOnyama Limba QUALIFIED
Ashley DoeBrazilStephen Shaw NEW
Mujtaba NickaCanadaStephen Shaw PROPOSAL
Leon OldroydJapanBernardo Dominic NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Stacey MacleadGermany2026-04-16Morlong Associates QUALIFIED8Asiya Javayant
1001Misaki RoysterJapan2026-04-27Dorl, James J Esq PROPOSAL69Amy Elsner
1002Leon OldroydBrazil2026-04-06Chanay, Jeffrey A Esq UNQUALIFIED7Xuxue Feng
1003Julie StensethSpain2026-04-23Rousseaux, Michael Esq QUALIFIED17Bernardo Dominic
1004Maisha RulapaughIndia2026-04-08Feltz Printing Service RENEWAL95Anna Fali
1005Wickens NestleGermany2026-04-13Chemel, James L Cpa PROPOSAL35Anna Fali
1006Claire TollnerJapan2026-04-08Morlong Associates NEW72Xuxue Feng
1007Tony FollerAustralia2026-04-03Printing Dimensions RENEWAL21Anna Fali
1008Aruna FigeroaCanada2026-04-12Commercial Press PROPOSAL43Bernardo Dominic
1009Smith GlickJapan2026-04-08King, Christopher A Esq NEW40Bernardo Dominic
1010Cody SaylorsFrance2026-04-14King, Christopher A Esq NEGOTIATION65Ivan Magalhaes
1011Leon OldroydArgentina2026-04-27Chapman, Ross E Esq QUALIFIED40Ivan Magalhaes
1012Smith GlickRussia2026-04-21Chemel, James L Cpa QUALIFIED95Anna Fali
1013Smith GlickItaly2026-04-04King, Christopher A Esq NEW11Onyama Limba
1014Smith GlickItaly2026-04-23Morlong Associates UNQUALIFIED93Xuxue Feng
1015Chavez BriddickJapan2026-03-29Truhlar And Truhlar Attys RENEWAL42Anna Fali
1016Juan WieserJapan2026-04-14Benton, John B Jr NEGOTIATION48Onyama Limba
1017Clifford RimSpain2026-04-09Rangoni Of Florence PROPOSAL16Ioni Bowcher
1018Nicolas IturbideSpain2026-03-30Chapman, Ross E Esq PROPOSAL99Xuxue Feng
1019Morrow RutaFrance2026-04-01Rangoni Of Florence RENEWAL30Xuxue Feng
1020Ricardo GauchoFrance2026-03-31Chapman, Ross E Esq UNQUALIFIED20Stephen Shaw
1021Jefferson SchemmerCanada2026-03-30Dorl, James J Esq QUALIFIED83Stephen Shaw
1022Jennifer AmigonAustralia2026-04-01Commercial Press UNQUALIFIED77Asiya Javayant
1023Arvin AlbaresBrazil2026-04-27Chemel, James L Cpa PROPOSAL47Ivan Magalhaes
1024Chavez BriddickBrazil2026-04-24Morlong Associates QUALIFIED15Xuxue Feng
1025Aruna FigeroaItaly2026-04-04Chapman, Ross E Esq QUALIFIED47Bernardo Dominic
1026Johnson SergiIndia2026-04-15Chemel, James L Cpa NEW91Xuxue Feng
1027Mayumi KolmetzItaly2026-04-09Feltz Printing Service RENEWAL8Onyama Limba
1028Kaitlin OstroskyArgentina2026-04-04Rousseaux, Michael Esq QUALIFIED25Amy Elsner
1029Isabel BowleyBrazil2026-04-11Buckley Miller Wright PROPOSAL20Onyama Limba
1030Aditya KuskoItaly2026-04-08Rangoni Of Florence RENEWAL14Asiya Javayant
1031Isabel BowleyArgentina2026-04-27Rousseaux, Michael Esq UNQUALIFIED1Asiya Javayant
1032Wickens NestleCanada2026-04-12Dorl, James J Esq NEW98Ioni Bowcher
1033Jefferson SchemmerJapan2026-04-24Rousseaux, Michael Esq RENEWAL61Xuxue Feng
1034Cody SaylorsSpain2026-04-26Commercial Press NEGOTIATION81Stephen Shaw
1035Leja CaldareraAustralia2026-04-02Commercial Press PROPOSAL4Amy Elsner
1036Kaitlin OstroskyCanada2026-04-18Chanay, Jeffrey A Esq QUALIFIED43Onyama Limba
1037Jefferson SchemmerAustralia2026-04-27Chemel, James L Cpa NEW79Stephen Shaw
1038Leja CaldareraAustralia2026-04-25Rousseaux, Michael Esq PROPOSAL0Stephen Shaw
1039Arvin AlbaresIndia2026-04-27Commercial Press NEW9Onyama Limba
1040Misaki RoysterJapan2026-04-20Buckley Miller Wright UNQUALIFIED44Onyama Limba
1041Arvin AlbaresUnited Kingdom2026-04-13Rousseaux, Michael Esq NEGOTIATION38Stephen Shaw
1042Morrow RutaBrazil2026-04-24Benton, John B Jr NEGOTIATION67Ioni Bowcher
1043Ivar PaprockiItaly2026-04-04Chanay, Jeffrey A Esq UNQUALIFIED8Bernardo Dominic
1044Francesco ShinkoCanada2026-03-30Rousseaux, Michael Esq RENEWAL79Bernardo Dominic
1045Wickens NestleBrazil2026-03-30Truhlar And Truhlar Attys PROPOSAL80Amy Elsner
1046Maria MarrierSpain2026-04-09Feltz Printing Service UNQUALIFIED5Asiya Javayant
1047Deepesh ChuiItaly2026-04-02Morlong Associates UNQUALIFIED31Xuxue Feng
1048Cody SaylorsArgentina2026-04-15Benton, John B Jr NEW20Onyama Limba
1049David DarakjyCanada2026-04-18Feiner Bros RENEWAL19Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Adams MorascaRussiaIoni Bowcher PROPOSAL
Adams MorascaGermanyIoni Bowcher UNQUALIFIED
Julie StensethCanadaAsiya Javayant QUALIFIED
Maria MarrierIndiaAsiya Javayant QUALIFIED
Leon OldroydUnited KingdomIoni Bowcher NEGOTIATION
Izzy GarufiGermanyXuxue Feng QUALIFIED
Leon OldroydCanadaIoni Bowcher NEGOTIATION
Sinclair WaycottIndiaXuxue Feng RENEWAL
Smith GlickBrazilAsiya Javayant PROPOSAL
Adams MorascaFranceElwin Sharvill QUALIFIED
Mayumi KolmetzItalyAmy Elsner NEW
Nicolas IturbideSpainAsiya Javayant PROPOSAL
Ricardo GauchoCanadaOnyama Limba NEGOTIATION
Mujtaba NickaBrazilStephen Shaw UNQUALIFIED
Clifford RimRussiaAnna Fali RENEWAL
David DarakjySpainAsiya Javayant QUALIFIED
Francesco ShinkoIndiaElwin Sharvill QUALIFIED
Johnson SergiIndiaOnyama Limba NEGOTIATION
Salvatore StockhamGermanyIoni Bowcher NEGOTIATION
Arvin AlbaresFranceXuxue Feng NEGOTIATION
Greenwood BologniaSpainBernardo Dominic UNQUALIFIED
Misaki RoysterIndiaAnna Fali RENEWAL
Stacey MacleadJapanElwin Sharvill RENEWAL
Leja CaldareraItalyBernardo Dominic UNQUALIFIED
Leon OldroydAustraliaAmy Elsner NEW
Isabel BowleyFranceStephen Shaw UNQUALIFIED
Juan WieserRussiaAsiya Javayant NEGOTIATION
Salvatore StockhamArgentinaAsiya Javayant NEGOTIATION
Rodrigues CampainRussiaAnna Fali PROPOSAL
Munro FerenczJapanAnna Fali NEW
Jones VocelkaItalyIvan Magalhaes UNQUALIFIED
Jones VocelkaBrazilIvan Magalhaes UNQUALIFIED
Silvio SlusarskiBrazilAsiya Javayant UNQUALIFIED
Francesco ShinkoSpainAsiya Javayant UNQUALIFIED
Jefferson SchemmerCanadaXuxue Feng NEW
Emily WhobreyIndiaIoni Bowcher QUALIFIED
Jennifer AmigonUnited KingdomIoni Bowcher PROPOSAL
Rodrigues CampainJapanAmy Elsner NEW
Kaitlin OstroskyAustraliaXuxue Feng PROPOSAL
Juan WieserItalyIoni Bowcher PROPOSAL
Cody SaylorsFranceOnyama Limba QUALIFIED
Juan WieserBrazilStephen Shaw NEW
David DarakjyUnited KingdomIoni Bowcher UNQUALIFIED
Juan WieserSpainAnna Fali NEW
Rodrigues CampainAustraliaAnna Fali UNQUALIFIED
Claire TollnerJapanAsiya Javayant UNQUALIFIED
Jones VocelkaBrazilAsiya Javayant NEW
Jeanfrancois VenereAustraliaXuxue Feng NEW
Aditya KuskoCanadaAmy Elsner PROPOSAL
Jones VocelkaSpainElwin Sharvill RENEWAL
Frozen Columns
Name
Faith Gillian
Murillo Malet
Octavia Malet
Isabel Bowley
Maria Marrier
Costa Dilliard
Clifford Rim
Adams Morasca
Chavez Briddick
Leon Oldroyd
Ivar Paprocki
Aruna Figeroa
Cody Saylors
Chavez Briddick
Aika Inouye
Isabel Bowley
Silvio Slusarski
Ashley Doe
Deepesh Chui
Alejandro Perin
Adams Morasca
Jeanfrancois Venere
Chavez Briddick
David Darakjy
James Butt
Adams Morasca
Ivar Paprocki
Darci Poquette
Claire Tollner
Claire Tollner
Salvatore Stockham
Leja Caldarera
Jones Vocelka
Darci Poquette
Julie Stenseth
Darci Poquette
Jeanfrancois Venere
Nicolas Iturbide
Jefferson Schemmer
Aruna Figeroa
Arvin Albares
Costa Dilliard
Octavia Malet
Deepesh Chui
Aruna Figeroa
Tony Foller
Francesco Shinko
Salvatore Stockham
Rodrigues Campain
Greenwood Bolognia
IdCountryDate
1000France2026-04-15
1001Italy2026-04-24
1002Canada2026-03-31
1003United Kingdom2026-04-03
1004Italy2026-04-11
1005Brazil2026-03-29
1006Japan2026-04-17
1007Germany2026-04-04
1008Italy2026-03-31
1009Australia2026-04-27
1010Italy2026-04-10
1011Australia2026-04-16
1012India2026-04-15
1013Argentina2026-04-25
1014United Kingdom2026-03-31
1015Germany2026-04-08
1016Australia2026-04-10
1017Australia2026-04-11
1018Germany2026-04-16
1019Brazil2026-04-06
1020France2026-04-13
1021Italy2026-04-18
1022United Kingdom2026-04-07
1023Italy2026-04-20
1024Spain2026-04-25
1025United Kingdom2026-04-07
1026Argentina2026-04-13
1027Argentina2026-04-23
1028Russia2026-04-15
1029France2026-04-12
1030Germany2026-04-01
1031France2026-04-16
1032Italy2026-04-20
1033United Kingdom2026-04-13
1034India2026-04-02
1035United Kingdom2026-04-15
1036Russia2026-04-08
1037Italy2026-04-10
1038Brazil2026-04-07
1039United Kingdom2026-04-20
1040France2026-04-21
1041France2026-04-27
1042Germany2026-04-09
1043Brazil2026-04-03
1044Argentina2026-04-01
1045United Kingdom2026-04-13
1046Australia2026-03-31
1047France2026-04-25
1048India2026-04-12
1049India2026-04-14

On-Demand Data

NameIdCountryDate
Costa Dilliard1000Australia2026-04-13
Sinclair Waycott1001Brazil2026-04-17
Ashley Doe1002Spain2026-04-17
Greenwood Bolognia1003Argentina2026-03-29
Silvio Slusarski1004Canada2026-03-31
Clifford Rim1005Germany2026-04-12
Greenwood Bolognia1006India2026-04-14
Silvio Slusarski1007Canada2026-04-20
Mujtaba Nicka1008Russia2026-04-19
Chavez Briddick1009Germany2026-04-01
Cody Saylors1010Brazil2026-04-07
Rodrigues Campain1011Italy2026-04-12
Chavez Briddick1012Argentina2026-04-22
Ricardo Gaucho1013India2026-04-03
Kadeem Flosi1014Argentina2026-04-26
Ivar Paprocki1015Spain2026-04-26
Ashley Doe1016United Kingdom2026-03-31
Octavia Malet1017Japan2026-04-22
Sinclair Waycott1018Russia2026-04-03
Aditya Kusko1019Italy2026-04-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jefferson SchemmerCanadaOnyama Limba UNQUALIFIED
Arvin AlbaresFranceBernardo Dominic PROPOSAL
Julie StensethUnited KingdomBernardo Dominic PROPOSAL
Arvin AlbaresAustraliaIoni Bowcher NEW
Ashley DoeUnited KingdomBernardo Dominic PROPOSAL
Deepesh ChuiJapanAsiya Javayant QUALIFIED
Munro FerenczRussiaStephen Shaw UNQUALIFIED
Costa DilliardArgentinaAnna Fali NEW
Aika InouyeIndiaElwin Sharvill NEW
Smith GlickFranceXuxue Feng NEGOTIATION
Jennifer AmigonBrazilIoni Bowcher PROPOSAL
Aditya KuskoBrazilOnyama Limba UNQUALIFIED
Greenwood BologniaCanadaIoni Bowcher UNQUALIFIED
Emily WhobreyIndiaAmy Elsner PROPOSAL
Smith GlickRussiaIvan Magalhaes NEGOTIATION
Sinclair WaycottIndiaAsiya Javayant UNQUALIFIED
Cody SaylorsItalyAnna Fali UNQUALIFIED
Tony FollerFranceBernardo Dominic QUALIFIED
Misaki RoysterGermanyOnyama Limba NEGOTIATION
Misaki RoysterSpainIoni Bowcher NEW
David DarakjyFranceIvan Magalhaes NEGOTIATION
Jefferson SchemmerIndiaAsiya Javayant RENEWAL
Deepesh ChuiRussiaAmy Elsner RENEWAL
Clifford RimBrazilIvan Magalhaes NEW
Smith GlickArgentinaBernardo Dominic UNQUALIFIED
Julie StensethBrazilIoni Bowcher NEW
Clifford RimUnited KingdomIvan Magalhaes UNQUALIFIED
Greenwood BologniaCanadaElwin Sharvill NEW
Chavez BriddickRussiaElwin Sharvill QUALIFIED
Silvio SlusarskiIndiaBernardo Dominic NEGOTIATION
Arvin AlbaresJapanStephen Shaw PROPOSAL
Claire TollnerRussiaIvan Magalhaes NEGOTIATION
Deepesh ChuiRussiaIvan Magalhaes NEGOTIATION
Munro FerenczIndiaOnyama Limba PROPOSAL
Jefferson SchemmerItalyAsiya Javayant PROPOSAL
Maria MarrierFranceElwin Sharvill RENEWAL
Rodrigues CampainAustraliaStephen Shaw UNQUALIFIED
Misaki RoysterUnited KingdomIoni Bowcher PROPOSAL
Nicolas IturbideIndiaBernardo Dominic NEGOTIATION
Greenwood BologniaFranceStephen Shaw 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>