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
Rodrigues CampainFranceAmy Elsner UNQUALIFIED
Claire TollnerAustraliaOnyama Limba UNQUALIFIED
Arvin AlbaresAustraliaElwin Sharvill RENEWAL
Morrow RutaCanadaAmy Elsner PROPOSAL
Octavia MaletCanadaAmy Elsner NEW
Claire TollnerIndiaXuxue Feng NEGOTIATION
Antonio CaudySpainElwin Sharvill PROPOSAL
Julie StensethGermanyStephen Shaw PROPOSAL
Misaki RoysterAustraliaIoni Bowcher UNQUALIFIED
Jennifer AmigonItalyElwin Sharvill RENEWAL
Murillo MaletArgentinaAsiya Javayant RENEWAL
Francesco ShinkoFranceElwin Sharvill QUALIFIED
Salvatore StockhamIndiaElwin Sharvill NEGOTIATION
Greenwood BologniaSpainXuxue Feng PROPOSAL
Maisha RulapaughBrazilBernardo Dominic NEW
Ricardo GauchoIndiaAsiya Javayant PROPOSAL
Kadeem FlosiRussiaStephen Shaw PROPOSAL
Cody SaylorsCanadaIvan Magalhaes QUALIFIED
Chavez BriddickArgentinaAnna Fali NEW
Greenwood BologniaRussiaIvan Magalhaes QUALIFIED
Kadeem FlosiAustraliaAmy Elsner NEGOTIATION
Alejandro PerinArgentinaAmy Elsner RENEWAL
Claire TollnerAustraliaIoni Bowcher NEW
Clifford RimCanadaAmy Elsner UNQUALIFIED
Munro FerenczCanadaBernardo Dominic UNQUALIFIED
Deepesh ChuiBrazilXuxue Feng QUALIFIED
Antonio CaudyUnited KingdomAsiya Javayant RENEWAL
Cody SaylorsBrazilXuxue Feng QUALIFIED
Isabel BowleySpainBernardo Dominic UNQUALIFIED
Faith GillianBrazilStephen Shaw QUALIFIED
Ricardo GauchoFranceStephen Shaw PROPOSAL
Greenwood BologniaArgentinaStephen Shaw UNQUALIFIED
Wickens NestleBrazilElwin Sharvill NEGOTIATION
Aditya KuskoGermanyAsiya Javayant QUALIFIED
Faith GillianIndiaAsiya Javayant PROPOSAL
David DarakjyFranceAsiya Javayant UNQUALIFIED
Maisha RulapaughUnited KingdomAmy Elsner QUALIFIED
Emily WhobreySpainStephen Shaw RENEWAL
Greenwood BologniaFranceAsiya Javayant QUALIFIED
Rodrigues CampainItalyIvan Magalhaes NEGOTIATION
Salvatore StockhamArgentinaOnyama Limba NEW
Ashley DoeItalyAnna Fali NEGOTIATION
Aika InouyeCanadaOnyama Limba RENEWAL
Jeanfrancois VenereRussiaAsiya Javayant PROPOSAL
Rodrigues CampainSpainAsiya Javayant RENEWAL
Stacey MacleadUnited KingdomBernardo Dominic NEGOTIATION
Arvin AlbaresCanadaIvan Magalhaes PROPOSAL
Murillo MaletSpainAmy Elsner QUALIFIED
Izzy GarufiRussiaAsiya Javayant QUALIFIED
Clifford RimIndiaBernardo Dominic RENEWAL
Horizontal
NameCountryRepresentativeStatus
Antonio CaudyRussiaIoni Bowcher PROPOSAL
Darci PoquetteFranceAmy Elsner RENEWAL
Arvin AlbaresItalyIoni Bowcher NEGOTIATION
Juan WieserFranceElwin Sharvill PROPOSAL
Deepesh ChuiSpainXuxue Feng UNQUALIFIED
Alejandro PerinSpainOnyama Limba PROPOSAL
Rodrigues CampainJapanXuxue Feng NEW
Kaitlin OstroskyJapanXuxue Feng NEW
Maisha RulapaughGermanyElwin Sharvill QUALIFIED
Costa DilliardCanadaIoni Bowcher RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Sinclair WaycottSpain2025-09-03Feiner Bros NEGOTIATION47Elwin Sharvill
1001Maisha RulapaughIndia2025-08-26Truhlar And Truhlar Attys QUALIFIED16Ioni Bowcher
1002Ricardo GauchoAustralia2025-09-01Chemel, James L Cpa QUALIFIED83Stephen Shaw
1003Ashley DoeUnited Kingdom2025-08-27Chanay, Jeffrey A Esq NEGOTIATION10Stephen Shaw
1004Kaitlin OstroskyCanada2025-08-19Chapman, Ross E Esq RENEWAL25Bernardo Dominic
1005Julie StensethArgentina2025-08-26Benton, John B Jr PROPOSAL47Onyama Limba
1006Morrow RutaJapan2025-08-21King, Christopher A Esq QUALIFIED31Ivan Magalhaes
1007Octavia MaletIndia2025-08-30Rangoni Of Florence NEGOTIATION9Ivan Magalhaes
1008Ricardo GauchoCanada2025-08-19Chapman, Ross E Esq NEW89Xuxue Feng
1009Cody SaylorsFrance2025-08-21Chemel, James L Cpa RENEWAL26Xuxue Feng
1010Jennifer AmigonItaly2025-09-01Commercial Press NEGOTIATION29Xuxue Feng
1011Maisha RulapaughGermany2025-08-25Feltz Printing Service NEGOTIATION65Xuxue Feng
1012Cody SaylorsRussia2025-08-28Feltz Printing Service NEW49Onyama Limba
1013Ivar PaprockiRussia2025-09-03Feltz Printing Service NEW47Asiya Javayant
1014Maria MarrierAustralia2025-08-16Commercial Press NEW37Stephen Shaw
1015Munro FerenczArgentina2025-08-15Printing Dimensions PROPOSAL29Ioni Bowcher
1016Kaitlin OstroskySpain2025-08-28Printing Dimensions QUALIFIED35Anna Fali
1017Alejandro PerinBrazil2025-09-01Benton, John B Jr RENEWAL95Ioni Bowcher
1018Johnson SergiGermany2025-08-14Commercial Press PROPOSAL36Asiya Javayant
1019Salvatore StockhamIndia2025-08-23Rangoni Of Florence RENEWAL50Elwin Sharvill
1020Alejandro PerinCanada2025-08-14Rousseaux, Michael Esq NEGOTIATION0Ivan Magalhaes
1021Rodrigues CampainJapan2025-08-26Dorl, James J Esq UNQUALIFIED39Ivan Magalhaes
1022Emily WhobreyUnited Kingdom2025-08-28Dorl, James J Esq UNQUALIFIED88Bernardo Dominic
1023Aika InouyeJapan2025-08-31Benton, John B Jr UNQUALIFIED45Anna Fali
1024Darci PoquetteRussia2025-09-05Buckley Miller Wright UNQUALIFIED13Stephen Shaw
1025Claire TollnerItaly2025-08-24Rousseaux, Michael Esq RENEWAL72Asiya Javayant
1026Claire TollnerArgentina2025-09-02Dorl, James J Esq NEGOTIATION39Asiya Javayant
1027Ivar PaprockiJapan2025-08-26Chapman, Ross E Esq RENEWAL41Ioni Bowcher
1028Clifford RimGermany2025-09-01Feltz Printing Service NEGOTIATION29Elwin Sharvill
1029Emily WhobreyJapan2025-08-13Rangoni Of Florence QUALIFIED58Xuxue Feng
1030Costa DilliardGermany2025-08-13Feiner Bros QUALIFIED75Anna Fali
1031Morrow RutaFrance2025-08-14Benton, John B Jr NEGOTIATION76Elwin Sharvill
1032Ashley DoeRussia2025-08-13Chapman, Ross E Esq NEW30Ivan Magalhaes
1033Jennifer AmigonIndia2025-08-25Chanay, Jeffrey A Esq QUALIFIED66Asiya Javayant
1034Faith GillianUnited Kingdom2025-09-04Chemel, James L Cpa RENEWAL39Onyama Limba
1035Misaki RoysterItaly2025-08-25Printing Dimensions NEGOTIATION30Asiya Javayant
1036Faith GillianCanada2025-08-22Chemel, James L Cpa UNQUALIFIED1Xuxue Feng
1037Jones VocelkaCanada2025-08-25Chapman, Ross E Esq NEW78Bernardo Dominic
1038Munro FerenczIndia2025-09-01Rangoni Of Florence NEW13Amy Elsner
1039Morrow RutaJapan2025-08-27Morlong Associates NEW8Ivan Magalhaes
1040Stacey MacleadUnited Kingdom2025-08-31Chanay, Jeffrey A Esq UNQUALIFIED7Stephen Shaw
1041Tony FollerSpain2025-08-16Morlong Associates RENEWAL1Elwin Sharvill
1042Deepesh ChuiIndia2025-08-19Benton, John B Jr UNQUALIFIED74Amy Elsner
1043Cody SaylorsArgentina2025-08-23Truhlar And Truhlar Attys UNQUALIFIED54Ioni Bowcher
1044Costa DilliardIndia2025-08-15Rousseaux, Michael Esq QUALIFIED96Ioni Bowcher
1045Wickens NestleRussia2025-08-15Chanay, Jeffrey A Esq UNQUALIFIED46Bernardo Dominic
1046Adams MorascaFrance2025-08-23Chanay, Jeffrey A Esq NEGOTIATION21Ivan Magalhaes
1047Kaitlin OstroskyIndia2025-08-21Truhlar And Truhlar Attys NEGOTIATION98Elwin Sharvill
1048Murillo MaletUnited Kingdom2025-08-22King, Christopher A Esq PROPOSAL78Ioni Bowcher
1049Alejandro PerinRussia2025-08-24King, Christopher A Esq NEGOTIATION13Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Greenwood BologniaArgentinaAnna Fali QUALIFIED
Jones VocelkaBrazilElwin Sharvill UNQUALIFIED
Costa DilliardBrazilXuxue Feng RENEWAL
Nicolas IturbideItalyAsiya Javayant RENEWAL
Alejandro PerinJapanIvan Magalhaes UNQUALIFIED
Aika InouyeItalyAmy Elsner PROPOSAL
Aditya KuskoArgentinaIoni Bowcher PROPOSAL
Sinclair WaycottSpainStephen Shaw NEW
Aruna FigeroaJapanElwin Sharvill QUALIFIED
Mayumi KolmetzBrazilAnna Fali QUALIFIED
Izzy GarufiUnited KingdomStephen Shaw NEGOTIATION
Ashley DoeArgentinaAsiya Javayant PROPOSAL
Julie StensethAustraliaAmy Elsner PROPOSAL
Antonio CaudyJapanOnyama Limba NEW
Mayumi KolmetzUnited KingdomElwin Sharvill RENEWAL
Jennifer AmigonAustraliaAnna Fali NEW
Ashley DoeCanadaAmy Elsner PROPOSAL
Munro FerenczIndiaAmy Elsner UNQUALIFIED
Greenwood BologniaGermanyAsiya Javayant QUALIFIED
Kaitlin OstroskyArgentinaIoni Bowcher QUALIFIED
Mujtaba NickaUnited KingdomIvan Magalhaes PROPOSAL
David DarakjyAustraliaElwin Sharvill NEGOTIATION
Kadeem FlosiSpainElwin Sharvill NEGOTIATION
Juan WieserRussiaStephen Shaw RENEWAL
Izzy GarufiRussiaIoni Bowcher UNQUALIFIED
Ivar PaprockiGermanyIoni Bowcher PROPOSAL
Deepesh ChuiRussiaElwin Sharvill RENEWAL
Munro FerenczBrazilElwin Sharvill NEGOTIATION
Rodrigues CampainUnited KingdomAmy Elsner NEW
Costa DilliardRussiaAsiya Javayant QUALIFIED
Mayumi KolmetzIndiaIoni Bowcher RENEWAL
James ButtGermanyAnna Fali PROPOSAL
Antonio CaudyRussiaIoni Bowcher NEW
James ButtCanadaBernardo Dominic NEW
Leon OldroydUnited KingdomStephen Shaw PROPOSAL
Ricardo GauchoCanadaIoni Bowcher PROPOSAL
Jefferson SchemmerSpainAnna Fali NEW
Chavez BriddickItalyIvan Magalhaes UNQUALIFIED
Leon OldroydJapanBernardo Dominic QUALIFIED
Jones VocelkaFranceStephen Shaw UNQUALIFIED
Aika InouyeRussiaIvan Magalhaes QUALIFIED
Johnson SergiAustraliaAnna Fali NEW
Wickens NestleIndiaAmy Elsner PROPOSAL
Jeanfrancois VenereAustraliaElwin Sharvill QUALIFIED
Mujtaba NickaJapanOnyama Limba UNQUALIFIED
Mujtaba NickaBrazilAsiya Javayant NEW
Antonio CaudyJapanIvan Magalhaes PROPOSAL
Sinclair WaycottItalyAsiya Javayant UNQUALIFIED
Cody SaylorsAustraliaElwin Sharvill QUALIFIED
Leja CaldareraIndiaOnyama Limba NEW
Frozen Columns
Name
Murillo Malet
Claire Tollner
Clifford Rim
Aruna Figeroa
Leon Oldroyd
Darci Poquette
Murillo Malet
Mayumi Kolmetz
Nicolas Iturbide
Claire Tollner
Arvin Albares
Cody Saylors
Arvin Albares
Clifford Rim
Adams Morasca
Adams Morasca
Mayumi Kolmetz
Emily Whobrey
Johnson Sergi
Jennifer Amigon
Emily Whobrey
Mujtaba Nicka
Jefferson Schemmer
Ashley Doe
Misaki Royster
Aditya Kusko
Nicolas Iturbide
Antonio Caudy
Costa Dilliard
Izzy Garufi
Ivar Paprocki
Nicolas Iturbide
Mujtaba Nicka
Clifford Rim
Wickens Nestle
Ricardo Gaucho
Claire Tollner
Mayumi Kolmetz
Juan Wieser
Octavia Malet
Octavia Malet
Chavez Briddick
Sinclair Waycott
Misaki Royster
Chavez Briddick
Clifford Rim
Julie Stenseth
Kadeem Flosi
Clifford Rim
Greenwood Bolognia
IdCountryDate
1000Australia2025-09-02
1001Brazil2025-08-09
1002France2025-09-04
1003Japan2025-08-19
1004Spain2025-09-01
1005India2025-09-05
1006United Kingdom2025-08-31
1007Canada2025-09-03
1008India2025-08-26
1009Germany2025-08-29
1010Russia2025-08-30
1011United Kingdom2025-08-23
1012India2025-09-03
1013Brazil2025-08-24
1014Brazil2025-08-14
1015Brazil2025-08-16
1016Germany2025-08-08
1017Germany2025-08-18
1018United Kingdom2025-09-02
1019United Kingdom2025-08-26
1020Germany2025-08-24
1021Canada2025-08-27
1022United Kingdom2025-08-20
1023Italy2025-08-18
1024France2025-08-14
1025Canada2025-08-08
1026Japan2025-08-29
1027Germany2025-08-22
1028Germany2025-08-18
1029Germany2025-08-14
1030Australia2025-08-27
1031Italy2025-08-31
1032Spain2025-08-22
1033United Kingdom2025-08-30
1034Japan2025-08-18
1035Argentina2025-09-06
1036Argentina2025-09-06
1037Russia2025-08-10
1038India2025-08-25
1039Brazil2025-08-19
1040France2025-08-13
1041Italy2025-08-20
1042India2025-08-15
1043France2025-09-05
1044Argentina2025-08-21
1045Spain2025-08-21
1046Argentina2025-09-03
1047Japan2025-08-09
1048Italy2025-08-29
1049France2025-09-05

On-Demand Data

NameIdCountryDate
Johnson Sergi1000Japan2025-09-02
Arvin Albares1001Japan2025-08-13
Isabel Bowley1002Australia2025-08-11
Chavez Briddick1003Russia2025-08-29
Adams Morasca1004Spain2025-08-27
Sinclair Waycott1005Canada2025-08-26
Morrow Ruta1006Argentina2025-09-03
Sinclair Waycott1007Italy2025-08-11
Claire Tollner1008Germany2025-08-09
Wickens Nestle1009Russia2025-08-13
Deepesh Chui1010Italy2025-08-21
Francesco Shinko1011France2025-09-02
Alejandro Perin1012Argentina2025-08-25
Darci Poquette1013Argentina2025-08-13
Juan Wieser1014Brazil2025-08-08
Munro Ferencz1015India2025-08-29
Mujtaba Nicka1016Japan2025-08-09
Juan Wieser1017Canada2025-09-02
Jeanfrancois Venere1018Russia2025-09-01
Kadeem Flosi1019India2025-08-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Murillo MaletGermanyXuxue Feng QUALIFIED
Costa DilliardCanadaIoni Bowcher QUALIFIED
Sinclair WaycottJapanAmy Elsner NEGOTIATION
Munro FerenczFranceStephen Shaw RENEWAL
Antonio CaudyCanadaIvan Magalhaes QUALIFIED
Octavia MaletIndiaStephen Shaw UNQUALIFIED
Antonio CaudyUnited KingdomElwin Sharvill NEGOTIATION
Arvin AlbaresUnited KingdomXuxue Feng RENEWAL
Adams MorascaRussiaAmy Elsner NEW
Costa DilliardAustraliaAmy Elsner QUALIFIED
Alejandro PerinItalyIoni Bowcher UNQUALIFIED
Francesco ShinkoUnited KingdomXuxue Feng QUALIFIED
Francesco ShinkoGermanyStephen Shaw NEW
Alejandro PerinAustraliaXuxue Feng NEW
Misaki RoysterSpainIvan Magalhaes NEGOTIATION
Johnson SergiCanadaAmy Elsner RENEWAL
Kadeem FlosiAustraliaAmy Elsner RENEWAL
Julie StensethAustraliaIoni Bowcher QUALIFIED
Francesco ShinkoIndiaOnyama Limba NEGOTIATION
Nicolas IturbideAustraliaAmy Elsner PROPOSAL
Deepesh ChuiRussiaAsiya Javayant NEW
Octavia MaletFranceAmy Elsner NEW
Misaki RoysterFranceAmy Elsner PROPOSAL
Aditya KuskoIndiaStephen Shaw UNQUALIFIED
Munro FerenczAustraliaStephen Shaw NEW
Kaitlin OstroskyUnited KingdomIoni Bowcher NEW
Wickens NestleJapanXuxue Feng PROPOSAL
Isabel BowleyCanadaXuxue Feng NEGOTIATION
Jones VocelkaItalyIoni Bowcher UNQUALIFIED
Sinclair WaycottCanadaStephen Shaw UNQUALIFIED
Clifford RimArgentinaBernardo Dominic QUALIFIED
Leon OldroydGermanyStephen Shaw RENEWAL
Maisha RulapaughAustraliaXuxue Feng RENEWAL
Deepesh ChuiFranceIoni Bowcher RENEWAL
Johnson SergiSpainXuxue Feng UNQUALIFIED
Faith GillianRussiaIvan Magalhaes NEGOTIATION
Smith GlickCanadaAnna Fali PROPOSAL
Kaitlin OstroskyAustraliaAmy Elsner RENEWAL
Julie StensethUnited KingdomElwin Sharvill PROPOSAL
Aditya KuskoSpainBernardo Dominic 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>