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
Deepesh ChuiCanadaIvan Magalhaes PROPOSAL
Mujtaba NickaAustraliaIoni Bowcher NEW
Ivar PaprockiGermanyAnna Fali UNQUALIFIED
Misaki RoysterBrazilXuxue Feng RENEWAL
Ashley DoeJapanStephen Shaw NEW
Francesco ShinkoJapanOnyama Limba QUALIFIED
Jones VocelkaUnited KingdomXuxue Feng NEW
Emily WhobreyJapanStephen Shaw RENEWAL
Misaki RoysterRussiaStephen Shaw NEGOTIATION
Julie StensethRussiaIvan Magalhaes UNQUALIFIED
Isabel BowleySpainStephen Shaw UNQUALIFIED
Greenwood BologniaSpainAsiya Javayant NEW
Jones VocelkaFranceIoni Bowcher NEW
Isabel BowleyUnited KingdomAsiya Javayant UNQUALIFIED
Izzy GarufiSpainIvan Magalhaes NEW
Julie StensethUnited KingdomAmy Elsner QUALIFIED
Faith GillianItalyAsiya Javayant RENEWAL
Mayumi KolmetzRussiaIoni Bowcher NEGOTIATION
Kadeem FlosiBrazilXuxue Feng NEW
Maria MarrierBrazilXuxue Feng NEW
Adams MorascaRussiaIoni Bowcher UNQUALIFIED
Nicolas IturbideUnited KingdomAmy Elsner RENEWAL
Maria MarrierJapanAsiya Javayant NEGOTIATION
Juan WieserGermanyXuxue Feng NEW
Mujtaba NickaIndiaBernardo Dominic NEW
Jefferson SchemmerArgentinaStephen Shaw UNQUALIFIED
Silvio SlusarskiCanadaElwin Sharvill QUALIFIED
Misaki RoysterSpainXuxue Feng NEW
Isabel BowleyAustraliaIvan Magalhaes NEGOTIATION
Johnson SergiBrazilAnna Fali NEW
Isabel BowleyArgentinaStephen Shaw NEW
Mayumi KolmetzArgentinaAsiya Javayant QUALIFIED
Jeanfrancois VenereAustraliaAmy Elsner RENEWAL
Darci PoquetteItalyElwin Sharvill QUALIFIED
Maria MarrierSpainBernardo Dominic NEW
Faith GillianItalyIoni Bowcher RENEWAL
Chavez BriddickAustraliaAnna Fali NEW
Arvin AlbaresGermanyAnna Fali NEW
Mayumi KolmetzRussiaIoni Bowcher QUALIFIED
Emily WhobreyCanadaElwin Sharvill NEGOTIATION
Alejandro PerinJapanAnna Fali UNQUALIFIED
Kadeem FlosiCanadaOnyama Limba RENEWAL
Mujtaba NickaGermanyIoni Bowcher NEW
Francesco ShinkoGermanyOnyama Limba NEGOTIATION
Jefferson SchemmerGermanyIoni Bowcher RENEWAL
James ButtSpainAmy Elsner QUALIFIED
Claire TollnerRussiaXuxue Feng NEGOTIATION
Emily WhobreySpainIoni Bowcher QUALIFIED
Munro FerenczItalyAsiya Javayant QUALIFIED
Silvio SlusarskiFranceOnyama Limba RENEWAL
Horizontal
NameCountryRepresentativeStatus
Smith GlickAustraliaElwin Sharvill NEW
Morrow RutaArgentinaIoni Bowcher NEW
Octavia MaletItalyAmy Elsner RENEWAL
Silvio SlusarskiRussiaAsiya Javayant NEGOTIATION
Kadeem FlosiFranceAmy Elsner QUALIFIED
Clifford RimSpainIoni Bowcher RENEWAL
Juan WieserArgentinaStephen Shaw NEGOTIATION
Mujtaba NickaBrazilIvan Magalhaes QUALIFIED
Julie StensethIndiaElwin Sharvill UNQUALIFIED
Aruna FigeroaSpainStephen Shaw NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Maria MarrierCanada2026-05-23Chapman, Ross E Esq UNQUALIFIED76Onyama Limba
1001Stacey MacleadArgentina2026-05-31King, Christopher A Esq QUALIFIED27Anna Fali
1002Darci PoquetteSpain2026-06-01Printing Dimensions QUALIFIED13Amy Elsner
1003Aika InouyeJapan2026-05-12Chapman, Ross E Esq QUALIFIED40Asiya Javayant
1004Costa DilliardIndia2026-06-03Morlong Associates RENEWAL24Elwin Sharvill
1005Adams MorascaSpain2026-06-05Printing Dimensions RENEWAL40Anna Fali
1006Sinclair WaycottSpain2026-05-16Morlong Associates QUALIFIED54Elwin Sharvill
1007Faith GillianSpain2026-05-15King, Christopher A Esq PROPOSAL4Asiya Javayant
1008Francesco ShinkoArgentina2026-05-15Feltz Printing Service NEGOTIATION99Stephen Shaw
1009Aika InouyeSpain2026-05-12Rousseaux, Michael Esq PROPOSAL1Ivan Magalhaes
1010Leja CaldareraAustralia2026-05-19Rousseaux, Michael Esq UNQUALIFIED66Ivan Magalhaes
1011Silvio SlusarskiGermany2026-05-25Feltz Printing Service RENEWAL33Asiya Javayant
1012Izzy GarufiFrance2026-06-07Dorl, James J Esq UNQUALIFIED84Bernardo Dominic
1013Johnson SergiUnited Kingdom2026-05-15Chapman, Ross E Esq QUALIFIED51Anna Fali
1014Rodrigues CampainCanada2026-05-28Truhlar And Truhlar Attys RENEWAL57Amy Elsner
1015Juan WieserBrazil2026-05-29Morlong Associates NEGOTIATION61Stephen Shaw
1016Stacey MacleadGermany2026-05-20Printing Dimensions PROPOSAL96Bernardo Dominic
1017Cody SaylorsBrazil2026-05-19Truhlar And Truhlar Attys NEW58Elwin Sharvill
1018James ButtCanada2026-05-16Rousseaux, Michael Esq UNQUALIFIED48Asiya Javayant
1019Greenwood BologniaSpain2026-05-15Buckley Miller Wright NEW16Asiya Javayant
1020Izzy GarufiIndia2026-05-30King, Christopher A Esq RENEWAL97Asiya Javayant
1021David DarakjySpain2026-06-06Buckley Miller Wright NEW2Ioni Bowcher
1022Nicolas IturbideJapan2026-05-25Buckley Miller Wright QUALIFIED38Asiya Javayant
1023Maisha RulapaughCanada2026-05-29Truhlar And Truhlar Attys PROPOSAL23Amy Elsner
1024Emily WhobreyFrance2026-05-12Feltz Printing Service NEW2Onyama Limba
1025Jefferson SchemmerItaly2026-05-24Chapman, Ross E Esq NEW63Onyama Limba
1026Mujtaba NickaGermany2026-05-28Chanay, Jeffrey A Esq RENEWAL56Asiya Javayant
1027Leja CaldareraRussia2026-05-22Benton, John B Jr QUALIFIED17Stephen Shaw
1028Jennifer AmigonGermany2026-05-29Morlong Associates NEW58Elwin Sharvill
1029Mayumi KolmetzIndia2026-05-27King, Christopher A Esq PROPOSAL24Amy Elsner
1030Ivar PaprockiCanada2026-05-28Buckley Miller Wright UNQUALIFIED43Onyama Limba
1031Arvin AlbaresFrance2026-05-21Chapman, Ross E Esq RENEWAL33Amy Elsner
1032David DarakjyJapan2026-05-27Buckley Miller Wright QUALIFIED31Elwin Sharvill
1033Wickens NestleBrazil2026-05-28Printing Dimensions RENEWAL82Elwin Sharvill
1034Adams MorascaArgentina2026-05-29Chanay, Jeffrey A Esq UNQUALIFIED47Xuxue Feng
1035Kaitlin OstroskyIndia2026-05-27Truhlar And Truhlar Attys NEGOTIATION49Amy Elsner
1036Jennifer AmigonRussia2026-05-24Chanay, Jeffrey A Esq QUALIFIED38Ioni Bowcher
1037Emily WhobreyJapan2026-05-27Feiner Bros PROPOSAL77Ioni Bowcher
1038Jones VocelkaBrazil2026-06-03Chanay, Jeffrey A Esq PROPOSAL95Xuxue Feng
1039Mayumi KolmetzItaly2026-05-17Buckley Miller Wright NEGOTIATION81Anna Fali
1040Nicolas IturbideUnited Kingdom2026-05-17Buckley Miller Wright RENEWAL54Ivan Magalhaes
1041Claire TollnerCanada2026-05-29Rousseaux, Michael Esq PROPOSAL51Ivan Magalhaes
1042Ricardo GauchoIndia2026-05-25Rangoni Of Florence NEW87Ivan Magalhaes
1043Arvin AlbaresIndia2026-05-09Benton, John B Jr QUALIFIED27Ioni Bowcher
1044Cody SaylorsSpain2026-05-18Chanay, Jeffrey A Esq NEGOTIATION34Amy Elsner
1045Cody SaylorsCanada2026-06-07Chanay, Jeffrey A Esq NEW31Asiya Javayant
1046Sinclair WaycottFrance2026-05-14Commercial Press PROPOSAL3Onyama Limba
1047Mayumi KolmetzAustralia2026-06-01Rangoni Of Florence UNQUALIFIED22Anna Fali
1048Ricardo GauchoAustralia2026-06-04Chapman, Ross E Esq NEGOTIATION94Ioni Bowcher
1049Leon OldroydUnited Kingdom2026-05-29Printing Dimensions NEW32Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Salvatore StockhamAustraliaBernardo Dominic PROPOSAL
Wickens NestleRussiaAmy Elsner PROPOSAL
Octavia MaletAustraliaOnyama Limba UNQUALIFIED
Nicolas IturbideAustraliaStephen Shaw PROPOSAL
Mayumi KolmetzRussiaIvan Magalhaes QUALIFIED
Deepesh ChuiBrazilAnna Fali PROPOSAL
Ricardo GauchoUnited KingdomIvan Magalhaes PROPOSAL
Wickens NestleCanadaElwin Sharvill RENEWAL
Greenwood BologniaSpainAsiya Javayant UNQUALIFIED
Greenwood BologniaGermanyAmy Elsner QUALIFIED
Cody SaylorsItalyOnyama Limba NEGOTIATION
James ButtRussiaIvan Magalhaes PROPOSAL
Nicolas IturbideAustraliaBernardo Dominic QUALIFIED
Aika InouyeItalyXuxue Feng QUALIFIED
Antonio CaudyArgentinaBernardo Dominic PROPOSAL
Silvio SlusarskiGermanyOnyama Limba QUALIFIED
Tony FollerArgentinaBernardo Dominic QUALIFIED
Kaitlin OstroskyArgentinaIvan Magalhaes RENEWAL
Arvin AlbaresRussiaXuxue Feng UNQUALIFIED
Francesco ShinkoFranceAsiya Javayant NEGOTIATION
Jennifer AmigonSpainBernardo Dominic NEGOTIATION
Darci PoquetteIndiaXuxue Feng RENEWAL
Rodrigues CampainItalyXuxue Feng UNQUALIFIED
Smith GlickArgentinaBernardo Dominic UNQUALIFIED
Arvin AlbaresJapanElwin Sharvill QUALIFIED
Cody SaylorsBrazilBernardo Dominic NEGOTIATION
David DarakjyGermanyStephen Shaw NEGOTIATION
Rodrigues CampainFranceStephen Shaw UNQUALIFIED
Rodrigues CampainFranceBernardo Dominic UNQUALIFIED
Kaitlin OstroskyUnited KingdomStephen Shaw PROPOSAL
Ivar PaprockiBrazilIoni Bowcher QUALIFIED
Faith GillianBrazilStephen Shaw NEW
Claire TollnerBrazilXuxue Feng QUALIFIED
Misaki RoysterJapanIvan Magalhaes PROPOSAL
Jefferson SchemmerAustraliaOnyama Limba UNQUALIFIED
Adams MorascaArgentinaIvan Magalhaes QUALIFIED
Rodrigues CampainFranceAnna Fali UNQUALIFIED
Alejandro PerinUnited KingdomOnyama Limba UNQUALIFIED
Antonio CaudyUnited KingdomStephen Shaw NEGOTIATION
Jennifer AmigonGermanyOnyama Limba NEGOTIATION
Ricardo GauchoFranceElwin Sharvill NEGOTIATION
Francesco ShinkoRussiaAnna Fali NEGOTIATION
Jefferson SchemmerUnited KingdomOnyama Limba QUALIFIED
Francesco ShinkoArgentinaStephen Shaw QUALIFIED
Kaitlin OstroskyGermanyIvan Magalhaes NEW
Johnson SergiUnited KingdomOnyama Limba QUALIFIED
Smith GlickBrazilAmy Elsner NEW
Jennifer AmigonAustraliaStephen Shaw QUALIFIED
Tony FollerAustraliaIoni Bowcher UNQUALIFIED
Kadeem FlosiAustraliaOnyama Limba PROPOSAL
Frozen Columns
Name
Maria Marrier
Aruna Figeroa
Isabel Bowley
Juan Wieser
Ivar Paprocki
Jeanfrancois Venere
Mujtaba Nicka
Costa Dilliard
Jennifer Amigon
Murillo Malet
Johnson Sergi
Maisha Rulapaugh
Mayumi Kolmetz
Ashley Doe
Jeanfrancois Venere
Izzy Garufi
Octavia Malet
Antonio Caudy
Arvin Albares
Alejandro Perin
Smith Glick
Jeanfrancois Venere
Johnson Sergi
Misaki Royster
Mayumi Kolmetz
Claire Tollner
Wickens Nestle
Ricardo Gaucho
Darci Poquette
Sinclair Waycott
Tony Foller
Mayumi Kolmetz
Cody Saylors
Faith Gillian
Jeanfrancois Venere
Chavez Briddick
Jones Vocelka
Maria Marrier
Jefferson Schemmer
Misaki Royster
Antonio Caudy
Rodrigues Campain
Leja Caldarera
Jones Vocelka
Jeanfrancois Venere
Nicolas Iturbide
Jones Vocelka
Ricardo Gaucho
Francesco Shinko
Silvio Slusarski
IdCountryDate
1000Russia2026-06-04
1001Japan2026-05-12
1002India2026-05-24
1003Italy2026-05-13
1004India2026-06-04
1005Japan2026-05-27
1006Argentina2026-05-28
1007Russia2026-05-29
1008Japan2026-06-02
1009Argentina2026-05-24
1010Italy2026-05-18
1011Russia2026-05-20
1012United Kingdom2026-05-23
1013Italy2026-05-27
1014Argentina2026-05-18
1015Italy2026-05-25
1016Argentina2026-05-09
1017United Kingdom2026-05-14
1018France2026-05-10
1019Spain2026-05-15
1020Australia2026-05-26
1021India2026-06-07
1022France2026-06-07
1023Japan2026-05-26
1024Canada2026-05-21
1025Australia2026-05-28
1026Italy2026-05-22
1027Italy2026-05-19
1028France2026-05-09
1029Russia2026-05-26
1030Japan2026-05-12
1031Canada2026-06-02
1032Australia2026-05-22
1033United Kingdom2026-05-15
1034France2026-05-24
1035Brazil2026-05-26
1036Australia2026-05-21
1037Italy2026-05-22
1038Australia2026-05-11
1039Germany2026-05-27
1040India2026-05-18
1041India2026-05-28
1042Germany2026-05-09
1043France2026-05-23
1044United Kingdom2026-05-15
1045Brazil2026-05-31
1046Australia2026-05-13
1047Australia2026-05-27
1048Argentina2026-05-12
1049India2026-06-02

On-Demand Data

NameIdCountryDate
Misaki Royster1000United Kingdom2026-05-10
Maisha Rulapaugh1001United Kingdom2026-05-19
Jefferson Schemmer1002United Kingdom2026-05-24
Juan Wieser1003Canada2026-05-21
Ricardo Gaucho1004Italy2026-05-20
Nicolas Iturbide1005India2026-05-28
Juan Wieser1006Argentina2026-05-30
Mujtaba Nicka1007Argentina2026-06-07
Kadeem Flosi1008Argentina2026-05-11
Octavia Malet1009Spain2026-05-13
Aruna Figeroa1010India2026-05-29
Kadeem Flosi1011United Kingdom2026-05-23
Aruna Figeroa1012Japan2026-06-06
Salvatore Stockham1013Russia2026-05-23
Adams Morasca1014Canada2026-05-10
Morrow Ruta1015Russia2026-05-14
Aika Inouye1016United Kingdom2026-05-31
Julie Stenseth1017Italy2026-05-24
Aika Inouye1018Brazil2026-05-25
Mayumi Kolmetz1019India2026-06-07
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Munro FerenczAustraliaAnna Fali PROPOSAL
Nicolas IturbideAustraliaAnna Fali QUALIFIED
Kadeem FlosiGermanyIvan Magalhaes RENEWAL
Chavez BriddickUnited KingdomOnyama Limba NEW
Misaki RoysterCanadaElwin Sharvill PROPOSAL
Isabel BowleyFranceOnyama Limba RENEWAL
Leja CaldareraCanadaBernardo Dominic RENEWAL
Murillo MaletCanadaStephen Shaw NEGOTIATION
Ashley DoeItalyIvan Magalhaes RENEWAL
David DarakjyAustraliaAmy Elsner UNQUALIFIED
Francesco ShinkoAustraliaOnyama Limba PROPOSAL
Jefferson SchemmerSpainAnna Fali QUALIFIED
Mujtaba NickaSpainOnyama Limba PROPOSAL
Aika InouyeSpainOnyama Limba UNQUALIFIED
Nicolas IturbideCanadaIvan Magalhaes NEW
Stacey MacleadIndiaIoni Bowcher RENEWAL
Leja CaldareraIndiaBernardo Dominic RENEWAL
Izzy GarufiFranceOnyama Limba UNQUALIFIED
Cody SaylorsGermanyBernardo Dominic PROPOSAL
Maisha RulapaughCanadaXuxue Feng NEW
Aika InouyeCanadaStephen Shaw NEW
Kaitlin OstroskyUnited KingdomOnyama Limba NEGOTIATION
Kaitlin OstroskyJapanAsiya Javayant RENEWAL
Leja CaldareraAustraliaIoni Bowcher PROPOSAL
Greenwood BologniaBrazilOnyama Limba UNQUALIFIED
Aruna FigeroaFranceAsiya Javayant PROPOSAL
Nicolas IturbideUnited KingdomStephen Shaw UNQUALIFIED
Sinclair WaycottFranceIvan Magalhaes NEGOTIATION
Aditya KuskoFranceBernardo Dominic QUALIFIED
Clifford RimRussiaOnyama Limba NEGOTIATION
Silvio SlusarskiUnited KingdomOnyama Limba QUALIFIED
Aika InouyeCanadaBernardo Dominic RENEWAL
Alejandro PerinBrazilIoni Bowcher QUALIFIED
Wickens NestleSpainOnyama Limba NEGOTIATION
Jennifer AmigonAustraliaXuxue Feng NEGOTIATION
Sinclair WaycottIndiaIoni Bowcher QUALIFIED
Costa DilliardIndiaIvan Magalhaes NEW
David DarakjyRussiaIvan Magalhaes QUALIFIED
Kadeem FlosiArgentinaIoni Bowcher NEW
Johnson SergiUnited KingdomIvan Magalhaes QUALIFIED

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