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
Ricardo GauchoGermanyXuxue Feng QUALIFIED
Munro FerenczRussiaAmy Elsner PROPOSAL
Aika InouyeGermanyElwin Sharvill UNQUALIFIED
Kadeem FlosiIndiaOnyama Limba NEGOTIATION
Mujtaba NickaUnited KingdomAmy Elsner UNQUALIFIED
Maisha RulapaughArgentinaAmy Elsner NEW
Aruna FigeroaSpainAsiya Javayant NEGOTIATION
Octavia MaletBrazilAsiya Javayant QUALIFIED
Kaitlin OstroskyCanadaAsiya Javayant PROPOSAL
Stacey MacleadJapanElwin Sharvill UNQUALIFIED
Mayumi KolmetzAustraliaAsiya Javayant NEGOTIATION
Cody SaylorsSpainBernardo Dominic PROPOSAL
Sinclair WaycottSpainAnna Fali UNQUALIFIED
Sinclair WaycottArgentinaIoni Bowcher PROPOSAL
Antonio CaudyBrazilAnna Fali PROPOSAL
Leon OldroydUnited KingdomStephen Shaw NEGOTIATION
Juan WieserBrazilOnyama Limba UNQUALIFIED
Jefferson SchemmerAustraliaIoni Bowcher NEW
Murillo MaletGermanyStephen Shaw QUALIFIED
Greenwood BologniaIndiaIoni Bowcher PROPOSAL
Morrow RutaRussiaBernardo Dominic NEW
Aika InouyeItalyIoni Bowcher PROPOSAL
Faith GillianFranceAmy Elsner PROPOSAL
Arvin AlbaresArgentinaBernardo Dominic PROPOSAL
Stacey MacleadSpainStephen Shaw UNQUALIFIED
Mayumi KolmetzJapanBernardo Dominic NEGOTIATION
Izzy GarufiAustraliaAsiya Javayant NEGOTIATION
Kaitlin OstroskyFranceIoni Bowcher QUALIFIED
Misaki RoysterSpainElwin Sharvill UNQUALIFIED
Chavez BriddickJapanIvan Magalhaes QUALIFIED
Aika InouyeItalyStephen Shaw RENEWAL
Stacey MacleadJapanElwin Sharvill NEGOTIATION
Chavez BriddickSpainAmy Elsner NEW
Ricardo GauchoAustraliaAmy Elsner UNQUALIFIED
Antonio CaudyArgentinaOnyama Limba NEGOTIATION
Sinclair WaycottIndiaXuxue Feng RENEWAL
Arvin AlbaresBrazilIvan Magalhaes NEGOTIATION
Morrow RutaBrazilAmy Elsner NEW
Kaitlin OstroskyRussiaElwin Sharvill PROPOSAL
Jefferson SchemmerUnited KingdomElwin Sharvill NEGOTIATION
Antonio CaudyJapanXuxue Feng NEGOTIATION
Stacey MacleadBrazilAsiya Javayant UNQUALIFIED
Kaitlin OstroskyArgentinaStephen Shaw UNQUALIFIED
Arvin AlbaresAustraliaIoni Bowcher NEW
Munro FerenczIndiaAnna Fali QUALIFIED
Ricardo GauchoIndiaAmy Elsner PROPOSAL
Francesco ShinkoUnited KingdomOnyama Limba PROPOSAL
Julie StensethCanadaAnna Fali NEW
Mayumi KolmetzArgentinaOnyama Limba PROPOSAL
Izzy GarufiCanadaBernardo Dominic UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Julie StensethIndiaAmy Elsner UNQUALIFIED
Deepesh ChuiAustraliaElwin Sharvill NEGOTIATION
Jones VocelkaUnited KingdomIvan Magalhaes RENEWAL
Emily WhobreyJapanAsiya Javayant NEW
Leja CaldareraItalyAmy Elsner PROPOSAL
Cody SaylorsAustraliaOnyama Limba NEW
Ashley DoeSpainStephen Shaw RENEWAL
Emily WhobreyRussiaAnna Fali UNQUALIFIED
Adams MorascaJapanStephen Shaw UNQUALIFIED
Julie StensethSpainStephen Shaw RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Chavez BriddickRussia2025-08-10Feltz Printing Service RENEWAL29Elwin Sharvill
1001Claire TollnerArgentina2025-08-08Printing Dimensions QUALIFIED90Elwin Sharvill
1002Munro FerenczUnited Kingdom2025-07-23Chemel, James L Cpa NEGOTIATION45Anna Fali
1003Misaki RoysterArgentina2025-08-18Chapman, Ross E Esq RENEWAL21Stephen Shaw
1004Salvatore StockhamCanada2025-07-23Rousseaux, Michael Esq NEW59Asiya Javayant
1005Johnson SergiUnited Kingdom2025-07-29Dorl, James J Esq RENEWAL69Xuxue Feng
1006Isabel BowleyArgentina2025-08-03Printing Dimensions NEGOTIATION43Elwin Sharvill
1007Izzy GarufiUnited Kingdom2025-08-06Rousseaux, Michael Esq NEGOTIATION63Xuxue Feng
1008Ivar PaprockiItaly2025-08-05Rousseaux, Michael Esq QUALIFIED91Bernardo Dominic
1009Kaitlin OstroskySpain2025-08-03Feltz Printing Service QUALIFIED94Ioni Bowcher
1010Silvio SlusarskiCanada2025-08-09Truhlar And Truhlar Attys UNQUALIFIED37Stephen Shaw
1011Chavez BriddickIndia2025-08-08Feltz Printing Service NEW64Stephen Shaw
1012Salvatore StockhamCanada2025-07-22Printing Dimensions NEGOTIATION47Ioni Bowcher
1013Ivar PaprockiAustralia2025-07-28Chemel, James L Cpa NEGOTIATION76Elwin Sharvill
1014Izzy GarufiUnited Kingdom2025-07-24Feltz Printing Service RENEWAL0Elwin Sharvill
1015Kaitlin OstroskySpain2025-08-13Feltz Printing Service QUALIFIED56Anna Fali
1016Smith GlickRussia2025-08-16Chapman, Ross E Esq RENEWAL1Bernardo Dominic
1017Deepesh ChuiSpain2025-08-08Benton, John B Jr PROPOSAL99Ioni Bowcher
1018Maisha RulapaughFrance2025-08-09Chanay, Jeffrey A Esq NEGOTIATION90Onyama Limba
1019Costa DilliardItaly2025-08-01Chanay, Jeffrey A Esq RENEWAL48Onyama Limba
1020Mayumi KolmetzItaly2025-08-16Rousseaux, Michael Esq PROPOSAL96Stephen Shaw
1021Tony FollerCanada2025-08-15King, Christopher A Esq PROPOSAL68Ivan Magalhaes
1022Misaki RoysterSpain2025-08-10Benton, John B Jr UNQUALIFIED86Asiya Javayant
1023David DarakjyBrazil2025-08-13Printing Dimensions UNQUALIFIED12Anna Fali
1024James ButtFrance2025-08-08Rangoni Of Florence NEW82Asiya Javayant
1025Izzy GarufiRussia2025-08-08Truhlar And Truhlar Attys UNQUALIFIED74Anna Fali
1026Johnson SergiArgentina2025-08-02Feiner Bros UNQUALIFIED19Anna Fali
1027Salvatore StockhamArgentina2025-08-01Chemel, James L Cpa RENEWAL92Elwin Sharvill
1028Clifford RimSpain2025-08-06Chanay, Jeffrey A Esq QUALIFIED85Bernardo Dominic
1029Darci PoquetteFrance2025-08-08Commercial Press UNQUALIFIED60Onyama Limba
1030Aditya KuskoUnited Kingdom2025-08-08King, Christopher A Esq QUALIFIED40Onyama Limba
1031Juan WieserIndia2025-08-04Commercial Press NEW61Xuxue Feng
1032Aditya KuskoRussia2025-08-03Chemel, James L Cpa QUALIFIED59Elwin Sharvill
1033Octavia MaletCanada2025-08-01Dorl, James J Esq NEGOTIATION9Ioni Bowcher
1034Leon OldroydCanada2025-08-03Feiner Bros PROPOSAL3Ivan Magalhaes
1035Arvin AlbaresItaly2025-08-09Benton, John B Jr QUALIFIED12Amy Elsner
1036Ashley DoeArgentina2025-08-01Dorl, James J Esq NEW7Xuxue Feng
1037James ButtArgentina2025-07-22Rangoni Of Florence QUALIFIED92Ivan Magalhaes
1038Salvatore StockhamIndia2025-08-03Commercial Press NEGOTIATION49Stephen Shaw
1039Deepesh ChuiRussia2025-08-04Rousseaux, Michael Esq NEW62Stephen Shaw
1040Faith GillianGermany2025-08-18Chanay, Jeffrey A Esq NEW92Anna Fali
1041Maisha RulapaughFrance2025-08-12Benton, John B Jr RENEWAL98Bernardo Dominic
1042Maisha RulapaughGermany2025-08-17Printing Dimensions RENEWAL8Ivan Magalhaes
1043Leja CaldareraAustralia2025-08-11Chapman, Ross E Esq NEGOTIATION69Elwin Sharvill
1044Ashley DoeSpain2025-08-17Morlong Associates QUALIFIED97Xuxue Feng
1045Alejandro PerinIndia2025-07-26Chanay, Jeffrey A Esq QUALIFIED26Amy Elsner
1046Maisha RulapaughSpain2025-07-31Rangoni Of Florence NEW45Bernardo Dominic
1047Emily WhobreyIndia2025-07-25Chemel, James L Cpa QUALIFIED37Onyama Limba
1048Ivar PaprockiItaly2025-08-17Feltz Printing Service UNQUALIFIED79Ivan Magalhaes
1049Antonio CaudyArgentina2025-08-10Rangoni Of Florence QUALIFIED15Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Chavez BriddickGermanyStephen Shaw NEW
Isabel BowleyIndiaAsiya Javayant NEGOTIATION
Aditya KuskoBrazilXuxue Feng UNQUALIFIED
Morrow RutaRussiaAnna Fali PROPOSAL
Stacey MacleadItalyBernardo Dominic UNQUALIFIED
Maisha RulapaughBrazilBernardo Dominic NEW
Nicolas IturbideRussiaXuxue Feng UNQUALIFIED
Greenwood BologniaFranceAsiya Javayant NEGOTIATION
Claire TollnerUnited KingdomIoni Bowcher NEW
Darci PoquetteFranceIoni Bowcher UNQUALIFIED
Jones VocelkaGermanyBernardo Dominic NEGOTIATION
Maria MarrierIndiaIvan Magalhaes UNQUALIFIED
Sinclair WaycottJapanAsiya Javayant NEW
Darci PoquetteJapanAmy Elsner RENEWAL
Maisha RulapaughUnited KingdomAnna Fali NEGOTIATION
Cody SaylorsAustraliaOnyama Limba RENEWAL
Maria MarrierJapanIoni Bowcher RENEWAL
Kadeem FlosiItalyAmy Elsner QUALIFIED
Kaitlin OstroskyRussiaStephen Shaw UNQUALIFIED
Tony FollerRussiaBernardo Dominic NEW
Kaitlin OstroskyBrazilAmy Elsner QUALIFIED
Claire TollnerRussiaStephen Shaw NEGOTIATION
Maisha RulapaughCanadaOnyama Limba RENEWAL
James ButtCanadaElwin Sharvill RENEWAL
Ricardo GauchoGermanyElwin Sharvill UNQUALIFIED
Sinclair WaycottCanadaAsiya Javayant PROPOSAL
Arvin AlbaresUnited KingdomBernardo Dominic NEW
Jones VocelkaBrazilOnyama Limba PROPOSAL
Deepesh ChuiJapanBernardo Dominic RENEWAL
Ashley DoeCanadaAnna Fali NEW
Aruna FigeroaItalyAnna Fali RENEWAL
Aruna FigeroaCanadaOnyama Limba QUALIFIED
Francesco ShinkoFranceBernardo Dominic NEW
Izzy GarufiArgentinaIvan Magalhaes UNQUALIFIED
Murillo MaletSpainOnyama Limba UNQUALIFIED
Jennifer AmigonArgentinaAnna Fali UNQUALIFIED
Aika InouyeUnited KingdomIvan Magalhaes UNQUALIFIED
Maisha RulapaughSpainAnna Fali UNQUALIFIED
Leja CaldareraGermanyOnyama Limba NEGOTIATION
Misaki RoysterJapanOnyama Limba QUALIFIED
Johnson SergiUnited KingdomAnna Fali NEW
Morrow RutaGermanyXuxue Feng NEGOTIATION
Francesco ShinkoUnited KingdomElwin Sharvill NEW
Deepesh ChuiFranceBernardo Dominic NEW
Misaki RoysterAustraliaBernardo Dominic UNQUALIFIED
Cody SaylorsBrazilIvan Magalhaes RENEWAL
Leja CaldareraItalyElwin Sharvill NEW
Chavez BriddickRussiaElwin Sharvill NEW
Leja CaldareraSpainXuxue Feng NEGOTIATION
Alejandro PerinGermanyIoni Bowcher PROPOSAL
Frozen Columns
Name
Silvio Slusarski
Greenwood Bolognia
Faith Gillian
Ricardo Gaucho
Aruna Figeroa
Silvio Slusarski
Munro Ferencz
Mayumi Kolmetz
Kaitlin Ostrosky
Stacey Maclead
Mujtaba Nicka
Izzy Garufi
Arvin Albares
Claire Tollner
Munro Ferencz
Ivar Paprocki
Leon Oldroyd
Antonio Caudy
Aruna Figeroa
Stacey Maclead
Wickens Nestle
Kaitlin Ostrosky
Leon Oldroyd
Adams Morasca
Jones Vocelka
Adams Morasca
Ashley Doe
Mujtaba Nicka
James Butt
Ricardo Gaucho
Claire Tollner
Ricardo Gaucho
Aika Inouye
Clifford Rim
Salvatore Stockham
Ricardo Gaucho
Ashley Doe
Sinclair Waycott
Arvin Albares
Ricardo Gaucho
Arvin Albares
Octavia Malet
Salvatore Stockham
Isabel Bowley
Rodrigues Campain
Faith Gillian
Tony Foller
Rodrigues Campain
Octavia Malet
Misaki Royster
IdCountryDate
1000Canada2025-08-11
1001Brazil2025-08-09
1002Spain2025-07-24
1003India2025-08-13
1004Australia2025-07-31
1005Canada2025-08-17
1006Canada2025-07-30
1007Brazil2025-07-20
1008India2025-07-29
1009Australia2025-07-26
1010Canada2025-07-22
1011Canada2025-07-28
1012Russia2025-07-24
1013United Kingdom2025-07-28
1014United Kingdom2025-08-04
1015Canada2025-08-18
1016Germany2025-07-20
1017Australia2025-08-17
1018India2025-08-12
1019Russia2025-08-07
1020India2025-08-03
1021Japan2025-08-13
1022Russia2025-08-17
1023Australia2025-08-15
1024Spain2025-07-20
1025Italy2025-08-05
1026Italy2025-07-27
1027Australia2025-08-04
1028Spain2025-08-09
1029Spain2025-07-25
1030Australia2025-08-04
1031Japan2025-07-29
1032United Kingdom2025-07-30
1033Italy2025-07-22
1034United Kingdom2025-08-12
1035Spain2025-07-31
1036Canada2025-08-02
1037Italy2025-07-20
1038United Kingdom2025-08-09
1039Argentina2025-07-22
1040Canada2025-08-13
1041Italy2025-07-27
1042Spain2025-08-11
1043India2025-07-27
1044Spain2025-08-03
1045Argentina2025-08-06
1046France2025-08-01
1047France2025-08-08
1048France2025-08-06
1049Russia2025-08-12

On-Demand Data

NameIdCountryDate
Jefferson Schemmer1000Brazil2025-07-31
Leon Oldroyd1001Germany2025-07-26
Kaitlin Ostrosky1002France2025-08-15
David Darakjy1003Italy2025-07-29
Julie Stenseth1004Argentina2025-08-10
Nicolas Iturbide1005Italy2025-07-26
Jeanfrancois Venere1006Italy2025-07-26
Sinclair Waycott1007Canada2025-07-26
Ivar Paprocki1008Australia2025-07-26
Claire Tollner1009India2025-07-26
Leon Oldroyd1010Germany2025-08-02
Adams Morasca1011Germany2025-07-27
Stacey Maclead1012Japan2025-07-27
Arvin Albares1013United Kingdom2025-07-30
Julie Stenseth1014Spain2025-07-20
Juan Wieser1015Australia2025-07-29
Mujtaba Nicka1016Canada2025-07-23
Jefferson Schemmer1017United Kingdom2025-08-10
Chavez Briddick1018Japan2025-08-02
Julie Stenseth1019Italy2025-07-29
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Julie StensethSpainAmy Elsner NEW
Juan WieserArgentinaIvan Magalhaes UNQUALIFIED
Izzy GarufiArgentinaElwin Sharvill NEGOTIATION
Deepesh ChuiSpainIoni Bowcher NEGOTIATION
Costa DilliardFranceAmy Elsner UNQUALIFIED
Arvin AlbaresAustraliaIoni Bowcher NEW
Tony FollerArgentinaXuxue Feng RENEWAL
Faith GillianJapanElwin Sharvill PROPOSAL
Ivar PaprockiGermanyOnyama Limba PROPOSAL
Francesco ShinkoFranceIoni Bowcher NEGOTIATION
Nicolas IturbideGermanyElwin Sharvill QUALIFIED
Silvio SlusarskiGermanyStephen Shaw RENEWAL
Mujtaba NickaSpainStephen Shaw RENEWAL
Silvio SlusarskiAustraliaAmy Elsner RENEWAL
Isabel BowleyJapanIoni Bowcher RENEWAL
Claire TollnerGermanyAsiya Javayant NEW
Jennifer AmigonAustraliaElwin Sharvill PROPOSAL
Faith GillianArgentinaIvan Magalhaes PROPOSAL
Izzy GarufiGermanyXuxue Feng UNQUALIFIED
Murillo MaletJapanXuxue Feng UNQUALIFIED
Maria MarrierFranceIvan Magalhaes NEGOTIATION
Adams MorascaGermanyIvan Magalhaes UNQUALIFIED
Adams MorascaUnited KingdomAsiya Javayant RENEWAL
Mujtaba NickaIndiaAnna Fali RENEWAL
Aruna FigeroaAustraliaBernardo Dominic NEW
Morrow RutaArgentinaBernardo Dominic UNQUALIFIED
Smith GlickBrazilAsiya Javayant NEW
Darci PoquetteRussiaStephen Shaw QUALIFIED
Nicolas IturbideArgentinaAsiya Javayant NEW
Johnson SergiBrazilAsiya Javayant PROPOSAL
Kaitlin OstroskyArgentinaAmy Elsner UNQUALIFIED
Francesco ShinkoFranceXuxue Feng NEW
David DarakjyIndiaIvan Magalhaes PROPOSAL
Stacey MacleadRussiaAnna Fali RENEWAL
Chavez BriddickGermanyElwin Sharvill RENEWAL
Clifford RimCanadaAnna Fali NEGOTIATION
Claire TollnerSpainStephen Shaw PROPOSAL
Silvio SlusarskiJapanStephen Shaw UNQUALIFIED
Mayumi KolmetzItalyStephen Shaw NEW
Stacey MacleadUnited KingdomIvan Magalhaes 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>