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
Jeanfrancois VenereBrazilIvan Magalhaes RENEWAL
Jeanfrancois VenereItalyIvan Magalhaes PROPOSAL
Jefferson SchemmerCanadaElwin Sharvill RENEWAL
Chavez BriddickCanadaAsiya Javayant NEW
Jefferson SchemmerIndiaBernardo Dominic UNQUALIFIED
Francesco ShinkoUnited KingdomIoni Bowcher PROPOSAL
Morrow RutaUnited KingdomOnyama Limba RENEWAL
Octavia MaletItalyStephen Shaw RENEWAL
Wickens NestleUnited KingdomElwin Sharvill RENEWAL
Izzy GarufiJapanElwin Sharvill NEGOTIATION
Chavez BriddickArgentinaStephen Shaw NEW
Salvatore StockhamRussiaStephen Shaw UNQUALIFIED
Ivar PaprockiAustraliaStephen Shaw PROPOSAL
Maisha RulapaughJapanElwin Sharvill QUALIFIED
Rodrigues CampainRussiaAmy Elsner PROPOSAL
Ashley DoeUnited KingdomIoni Bowcher PROPOSAL
Ashley DoeItalyAmy Elsner PROPOSAL
Morrow RutaCanadaBernardo Dominic QUALIFIED
Darci PoquetteIndiaXuxue Feng UNQUALIFIED
Juan WieserSpainIoni Bowcher QUALIFIED
Aruna FigeroaItalyOnyama Limba QUALIFIED
Juan WieserSpainElwin Sharvill NEGOTIATION
Jones VocelkaFranceAmy Elsner PROPOSAL
Stacey MacleadRussiaBernardo Dominic NEW
Ivar PaprockiAustraliaAnna Fali NEGOTIATION
Deepesh ChuiGermanyBernardo Dominic PROPOSAL
Munro FerenczCanadaElwin Sharvill NEGOTIATION
Maria MarrierSpainElwin Sharvill PROPOSAL
Kaitlin OstroskySpainElwin Sharvill RENEWAL
Costa DilliardSpainAmy Elsner PROPOSAL
Sinclair WaycottUnited KingdomElwin Sharvill PROPOSAL
Arvin AlbaresSpainXuxue Feng RENEWAL
Clifford RimBrazilElwin Sharvill UNQUALIFIED
Ivar PaprockiSpainAsiya Javayant NEW
Johnson SergiGermanyXuxue Feng RENEWAL
Adams MorascaGermanyBernardo Dominic NEW
Smith GlickArgentinaIvan Magalhaes NEW
Antonio CaudyIndiaAsiya Javayant PROPOSAL
Maisha RulapaughCanadaBernardo Dominic NEGOTIATION
Faith GillianAustraliaIoni Bowcher NEW
Murillo MaletItalyXuxue Feng NEGOTIATION
Costa DilliardUnited KingdomElwin Sharvill UNQUALIFIED
Aika InouyeArgentinaOnyama Limba UNQUALIFIED
Jones VocelkaArgentinaAsiya Javayant UNQUALIFIED
Stacey MacleadAustraliaBernardo Dominic RENEWAL
Salvatore StockhamUnited KingdomAsiya Javayant RENEWAL
Sinclair WaycottArgentinaIoni Bowcher NEW
Jennifer AmigonSpainAsiya Javayant PROPOSAL
Jennifer AmigonItalyIvan Magalhaes RENEWAL
Kadeem FlosiArgentinaIoni Bowcher RENEWAL
Horizontal
NameCountryRepresentativeStatus
Nicolas IturbideGermanyStephen Shaw UNQUALIFIED
Misaki RoysterAustraliaBernardo Dominic UNQUALIFIED
Maisha RulapaughJapanXuxue Feng RENEWAL
David DarakjyItalyOnyama Limba PROPOSAL
Jefferson SchemmerAustraliaIvan Magalhaes PROPOSAL
Murillo MaletArgentinaAmy Elsner RENEWAL
Deepesh ChuiBrazilXuxue Feng UNQUALIFIED
Juan WieserFranceIoni Bowcher PROPOSAL
Wickens NestleBrazilIvan Magalhaes QUALIFIED
Greenwood BologniaCanadaAmy Elsner NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aditya KuskoBrazil2026-05-24Feiner Bros QUALIFIED59Elwin Sharvill
1001David DarakjyJapan2026-06-10Commercial Press PROPOSAL1Asiya Javayant
1002Mayumi KolmetzBrazil2026-06-12Feiner Bros RENEWAL61Amy Elsner
1003James ButtBrazil2026-06-13King, Christopher A Esq NEW9Bernardo Dominic
1004Murillo MaletItaly2026-05-24Commercial Press NEW37Elwin Sharvill
1005Ashley DoeJapan2026-05-24Truhlar And Truhlar Attys UNQUALIFIED20Xuxue Feng
1006Deepesh ChuiUnited Kingdom2026-06-10Feiner Bros NEGOTIATION71Ioni Bowcher
1007David DarakjyCanada2026-06-11Feltz Printing Service RENEWAL73Amy Elsner
1008James ButtFrance2026-06-08Truhlar And Truhlar Attys NEW77Elwin Sharvill
1009James ButtCanada2026-05-18Feltz Printing Service NEGOTIATION12Elwin Sharvill
1010Faith GillianSpain2026-06-05Rangoni Of Florence UNQUALIFIED97Asiya Javayant
1011Cody SaylorsAustralia2026-06-03Buckley Miller Wright NEGOTIATION4Onyama Limba
1012Deepesh ChuiUnited Kingdom2026-06-15Benton, John B Jr RENEWAL70Ivan Magalhaes
1013Ivar PaprockiFrance2026-05-21Dorl, James J Esq PROPOSAL16Ioni Bowcher
1014Silvio SlusarskiBrazil2026-06-08Truhlar And Truhlar Attys PROPOSAL80Anna Fali
1015Jennifer AmigonBrazil2026-06-13King, Christopher A Esq NEW87Ioni Bowcher
1016Tony FollerFrance2026-05-18Feiner Bros QUALIFIED89Amy Elsner
1017Kadeem FlosiJapan2026-05-20Rousseaux, Michael Esq QUALIFIED12Stephen Shaw
1018Clifford RimCanada2026-06-14Rangoni Of Florence NEW37Ivan Magalhaes
1019Morrow RutaGermany2026-05-29King, Christopher A Esq PROPOSAL50Onyama Limba
1020Salvatore StockhamItaly2026-05-29Truhlar And Truhlar Attys UNQUALIFIED25Ivan Magalhaes
1021Julie StensethSpain2026-06-05Morlong Associates NEW45Ioni Bowcher
1022Murillo MaletItaly2026-06-16Commercial Press NEGOTIATION82Ivan Magalhaes
1023Octavia MaletGermany2026-05-19Feltz Printing Service NEGOTIATION20Xuxue Feng
1024Izzy GarufiItaly2026-06-05Rousseaux, Michael Esq UNQUALIFIED81Onyama Limba
1025Claire TollnerAustralia2026-06-13Benton, John B Jr QUALIFIED19Ivan Magalhaes
1026Izzy GarufiCanada2026-06-16Chapman, Ross E Esq PROPOSAL10Ivan Magalhaes
1027Ricardo GauchoGermany2026-06-10Rousseaux, Michael Esq PROPOSAL79Amy Elsner
1028Munro FerenczItaly2026-05-26Chapman, Ross E Esq QUALIFIED52Anna Fali
1029Greenwood BologniaUnited Kingdom2026-06-08Morlong Associates QUALIFIED69Stephen Shaw
1030Jones VocelkaFrance2026-05-31Feiner Bros NEGOTIATION1Xuxue Feng
1031Wickens NestleArgentina2026-05-31Morlong Associates QUALIFIED83Amy Elsner
1032Ricardo GauchoSpain2026-05-22Buckley Miller Wright RENEWAL50Elwin Sharvill
1033Stacey MacleadArgentina2026-05-28Rousseaux, Michael Esq NEGOTIATION86Amy Elsner
1034Kaitlin OstroskyJapan2026-06-13Rangoni Of Florence UNQUALIFIED61Anna Fali
1035Misaki RoysterJapan2026-05-24Benton, John B Jr PROPOSAL74Ivan Magalhaes
1036Isabel BowleySpain2026-05-30Benton, John B Jr QUALIFIED5Bernardo Dominic
1037Munro FerenczUnited Kingdom2026-06-04Truhlar And Truhlar Attys RENEWAL50Elwin Sharvill
1038James ButtGermany2026-05-24Commercial Press QUALIFIED43Bernardo Dominic
1039Isabel BowleyJapan2026-06-08Commercial Press NEGOTIATION24Asiya Javayant
1040Ivar PaprockiJapan2026-06-07Chapman, Ross E Esq RENEWAL0Onyama Limba
1041Cody SaylorsSpain2026-05-18Chemel, James L Cpa NEGOTIATION89Ivan Magalhaes
1042Mujtaba NickaFrance2026-06-15Rousseaux, Michael Esq QUALIFIED47Ivan Magalhaes
1043Costa DilliardCanada2026-05-30Morlong Associates NEGOTIATION39Bernardo Dominic
1044Salvatore StockhamFrance2026-05-19Feltz Printing Service PROPOSAL12Ivan Magalhaes
1045Nicolas IturbideRussia2026-05-20Benton, John B Jr NEW74Bernardo Dominic
1046Jefferson SchemmerItaly2026-06-14Truhlar And Truhlar Attys NEGOTIATION39Ivan Magalhaes
1047Salvatore StockhamIndia2026-06-07Morlong Associates PROPOSAL47Anna Fali
1048Claire TollnerArgentina2026-06-13Chapman, Ross E Esq RENEWAL19Stephen Shaw
1049Kadeem FlosiArgentina2026-06-16Dorl, James J Esq PROPOSAL8Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Murillo MaletCanadaOnyama Limba NEW
Leja CaldareraCanadaStephen Shaw RENEWAL
David DarakjyItalyOnyama Limba NEW
Deepesh ChuiFranceXuxue Feng UNQUALIFIED
Alejandro PerinFranceBernardo Dominic UNQUALIFIED
Leja CaldareraSpainAsiya Javayant NEGOTIATION
Adams MorascaGermanyXuxue Feng QUALIFIED
Emily WhobreyFranceAmy Elsner NEW
Sinclair WaycottFranceXuxue Feng QUALIFIED
Stacey MacleadUnited KingdomXuxue Feng NEW
Julie StensethJapanOnyama Limba PROPOSAL
Alejandro PerinArgentinaAsiya Javayant PROPOSAL
Maisha RulapaughFranceStephen Shaw NEGOTIATION
Stacey MacleadJapanIvan Magalhaes QUALIFIED
David DarakjyRussiaAsiya Javayant NEGOTIATION
Tony FollerFranceElwin Sharvill RENEWAL
Rodrigues CampainCanadaElwin Sharvill UNQUALIFIED
Jeanfrancois VenereJapanBernardo Dominic NEGOTIATION
Costa DilliardSpainAnna Fali UNQUALIFIED
Leja CaldareraJapanAnna Fali PROPOSAL
Sinclair WaycottJapanOnyama Limba NEGOTIATION
Silvio SlusarskiArgentinaOnyama Limba NEGOTIATION
Maisha RulapaughBrazilIvan Magalhaes NEGOTIATION
Julie StensethCanadaIoni Bowcher NEGOTIATION
Francesco ShinkoAustraliaStephen Shaw QUALIFIED
Jennifer AmigonRussiaOnyama Limba UNQUALIFIED
Jeanfrancois VenereArgentinaAnna Fali NEW
Kadeem FlosiAustraliaOnyama Limba QUALIFIED
Misaki RoysterGermanyIvan Magalhaes PROPOSAL
Murillo MaletRussiaAsiya Javayant RENEWAL
Clifford RimRussiaAmy Elsner PROPOSAL
Ivar PaprockiCanadaIoni Bowcher PROPOSAL
Darci PoquetteAustraliaXuxue Feng NEGOTIATION
Jones VocelkaGermanyAmy Elsner QUALIFIED
Misaki RoysterFranceAmy Elsner UNQUALIFIED
Rodrigues CampainAustraliaBernardo Dominic QUALIFIED
Leja CaldareraGermanyElwin Sharvill UNQUALIFIED
Munro FerenczAustraliaOnyama Limba UNQUALIFIED
Alejandro PerinArgentinaOnyama Limba QUALIFIED
Alejandro PerinCanadaBernardo Dominic RENEWAL
James ButtFranceAmy Elsner NEGOTIATION
Smith GlickFranceBernardo Dominic UNQUALIFIED
Greenwood BologniaSpainStephen Shaw RENEWAL
Alejandro PerinGermanyAmy Elsner QUALIFIED
Darci PoquetteJapanAnna Fali NEW
Silvio SlusarskiItalyIoni Bowcher UNQUALIFIED
Ricardo GauchoBrazilStephen Shaw NEW
Johnson SergiJapanOnyama Limba QUALIFIED
Francesco ShinkoSpainIvan Magalhaes RENEWAL
Alejandro PerinBrazilIvan Magalhaes RENEWAL
Frozen Columns
Name
Claire Tollner
Claire Tollner
David Darakjy
Ricardo Gaucho
Costa Dilliard
Adams Morasca
Octavia Malet
Adams Morasca
Sinclair Waycott
Antonio Caudy
Kadeem Flosi
Julie Stenseth
Octavia Malet
Greenwood Bolognia
Jennifer Amigon
Nicolas Iturbide
Chavez Briddick
Leja Caldarera
Munro Ferencz
Rodrigues Campain
Munro Ferencz
Salvatore Stockham
Munro Ferencz
Jennifer Amigon
Adams Morasca
Izzy Garufi
Leon Oldroyd
Tony Foller
Alejandro Perin
Stacey Maclead
Ivar Paprocki
Aditya Kusko
Kaitlin Ostrosky
Ricardo Gaucho
Silvio Slusarski
Mujtaba Nicka
Ashley Doe
James Butt
Mayumi Kolmetz
Mujtaba Nicka
Darci Poquette
James Butt
Izzy Garufi
Misaki Royster
Ashley Doe
Jeanfrancois Venere
Maria Marrier
Faith Gillian
Jones Vocelka
Maria Marrier
IdCountryDate
1000Spain2026-06-10
1001Brazil2026-06-11
1002Argentina2026-06-16
1003Italy2026-05-30
1004Russia2026-06-04
1005Germany2026-06-15
1006India2026-05-18
1007Brazil2026-06-11
1008Australia2026-06-15
1009Russia2026-05-20
1010Brazil2026-06-10
1011United Kingdom2026-06-15
1012Italy2026-05-21
1013Spain2026-05-27
1014France2026-05-31
1015United Kingdom2026-05-24
1016United Kingdom2026-06-16
1017France2026-06-04
1018United Kingdom2026-06-13
1019Spain2026-06-01
1020France2026-05-18
1021Argentina2026-06-02
1022Spain2026-05-20
1023Germany2026-05-23
1024Japan2026-06-09
1025Germany2026-05-30
1026United Kingdom2026-06-13
1027France2026-06-07
1028Russia2026-06-11
1029Canada2026-06-02
1030Italy2026-05-19
1031United Kingdom2026-05-26
1032France2026-06-15
1033Italy2026-05-31
1034Argentina2026-06-07
1035Japan2026-06-09
1036Italy2026-05-30
1037Japan2026-06-02
1038Japan2026-05-28
1039Brazil2026-06-06
1040Brazil2026-06-06
1041Russia2026-05-19
1042Argentina2026-06-16
1043Japan2026-06-06
1044Brazil2026-05-23
1045France2026-05-29
1046Spain2026-05-22
1047Germany2026-06-02
1048United Kingdom2026-06-11
1049Italy2026-06-08

On-Demand Data

NameIdCountryDate
Kadeem Flosi1000Brazil2026-05-18
Tony Foller1001Brazil2026-06-13
Misaki Royster1002Australia2026-06-04
Julie Stenseth1003Germany2026-05-20
Isabel Bowley1004Argentina2026-05-31
Salvatore Stockham1005Japan2026-05-26
Juan Wieser1006Spain2026-06-06
Octavia Malet1007Canada2026-06-15
Mujtaba Nicka1008Japan2026-05-20
Isabel Bowley1009Australia2026-05-18
Antonio Caudy1010Germany2026-06-11
Kaitlin Ostrosky1011France2026-05-27
Rodrigues Campain1012United Kingdom2026-05-23
Stacey Maclead1013Brazil2026-06-06
Darci Poquette1014Spain2026-06-12
Aditya Kusko1015India2026-05-21
Faith Gillian1016Japan2026-05-23
Leon Oldroyd1017United Kingdom2026-05-23
Jones Vocelka1018United Kingdom2026-06-14
Jefferson Schemmer1019United Kingdom2026-05-27
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Darci PoquetteGermanyAsiya Javayant RENEWAL
Murillo MaletUnited KingdomIoni Bowcher NEW
Octavia MaletRussiaAnna Fali NEW
Mayumi KolmetzUnited KingdomIvan Magalhaes UNQUALIFIED
Mayumi KolmetzBrazilAmy Elsner QUALIFIED
Smith GlickCanadaIvan Magalhaes QUALIFIED
Silvio SlusarskiIndiaAsiya Javayant NEGOTIATION
Mayumi KolmetzSpainOnyama Limba PROPOSAL
Greenwood BologniaFranceOnyama Limba QUALIFIED
Octavia MaletIndiaElwin Sharvill NEGOTIATION
Francesco ShinkoAustraliaElwin Sharvill PROPOSAL
Cody SaylorsSpainIoni Bowcher UNQUALIFIED
Johnson SergiArgentinaAsiya Javayant PROPOSAL
Sinclair WaycottIndiaBernardo Dominic NEW
Nicolas IturbideFranceAsiya Javayant PROPOSAL
Murillo MaletBrazilXuxue Feng NEW
Julie StensethUnited KingdomAsiya Javayant NEGOTIATION
Jeanfrancois VenereSpainBernardo Dominic UNQUALIFIED
Kadeem FlosiCanadaElwin Sharvill NEGOTIATION
Greenwood BologniaAustraliaStephen Shaw NEGOTIATION
Cody SaylorsAustraliaXuxue Feng QUALIFIED
Antonio CaudyFranceBernardo Dominic QUALIFIED
Silvio SlusarskiSpainAsiya Javayant UNQUALIFIED
Stacey MacleadRussiaAsiya Javayant RENEWAL
Claire TollnerBrazilAsiya Javayant RENEWAL
Mujtaba NickaFranceAmy Elsner PROPOSAL
Aditya KuskoRussiaOnyama Limba RENEWAL
Kadeem FlosiSpainIoni Bowcher NEGOTIATION
Maria MarrierArgentinaStephen Shaw QUALIFIED
Costa DilliardRussiaBernardo Dominic UNQUALIFIED
Salvatore StockhamRussiaIvan Magalhaes NEW
Sinclair WaycottBrazilOnyama Limba RENEWAL
Mujtaba NickaRussiaStephen Shaw QUALIFIED
Leja CaldareraItalyIoni Bowcher QUALIFIED
Aika InouyeAustraliaAmy Elsner NEGOTIATION
Aruna FigeroaArgentinaOnyama Limba PROPOSAL
Isabel BowleyArgentinaIvan Magalhaes QUALIFIED
Leja CaldareraAustraliaStephen Shaw PROPOSAL
Silvio SlusarskiGermanyAsiya Javayant UNQUALIFIED
Leja CaldareraJapanXuxue Feng 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>