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
Leon OldroydItalyStephen Shaw UNQUALIFIED
Misaki RoysterArgentinaAnna Fali QUALIFIED
Morrow RutaFranceElwin Sharvill PROPOSAL
Francesco ShinkoBrazilOnyama Limba QUALIFIED
Nicolas IturbideFranceIvan Magalhaes RENEWAL
Mujtaba NickaCanadaAsiya Javayant UNQUALIFIED
Smith GlickJapanElwin Sharvill NEW
Clifford RimRussiaStephen Shaw UNQUALIFIED
Aika InouyeSpainIvan Magalhaes UNQUALIFIED
Murillo MaletSpainIvan Magalhaes PROPOSAL
Nicolas IturbideIndiaOnyama Limba NEW
Sinclair WaycottRussiaElwin Sharvill QUALIFIED
Greenwood BologniaSpainAnna Fali NEW
Misaki RoysterCanadaXuxue Feng RENEWAL
Ashley DoeFranceStephen Shaw QUALIFIED
Jennifer AmigonGermanyOnyama Limba NEW
Deepesh ChuiJapanXuxue Feng NEGOTIATION
Aika InouyeRussiaAsiya Javayant RENEWAL
Greenwood BologniaGermanyIvan Magalhaes PROPOSAL
Mayumi KolmetzJapanStephen Shaw PROPOSAL
Julie StensethFranceStephen Shaw QUALIFIED
Munro FerenczIndiaBernardo Dominic QUALIFIED
Darci PoquetteRussiaIvan Magalhaes UNQUALIFIED
Julie StensethIndiaIvan Magalhaes PROPOSAL
Kaitlin OstroskyItalyAmy Elsner RENEWAL
Mujtaba NickaIndiaAmy Elsner PROPOSAL
Julie StensethJapanAsiya Javayant RENEWAL
Wickens NestleIndiaIoni Bowcher NEGOTIATION
Maisha RulapaughGermanyAmy Elsner UNQUALIFIED
Alejandro PerinCanadaIoni Bowcher UNQUALIFIED
Aika InouyeRussiaBernardo Dominic NEW
Costa DilliardArgentinaStephen Shaw NEW
Ashley DoeGermanyAnna Fali RENEWAL
Murillo MaletFranceOnyama Limba RENEWAL
Isabel BowleyRussiaAsiya Javayant PROPOSAL
Octavia MaletSpainIoni Bowcher NEGOTIATION
Deepesh ChuiRussiaAnna Fali UNQUALIFIED
Jefferson SchemmerItalyAsiya Javayant UNQUALIFIED
Munro FerenczRussiaAsiya Javayant RENEWAL
Octavia MaletUnited KingdomStephen Shaw NEW
James ButtJapanXuxue Feng PROPOSAL
Aditya KuskoBrazilIvan Magalhaes NEW
Claire TollnerFranceElwin Sharvill QUALIFIED
Emily WhobreyItalyIvan Magalhaes NEW
Arvin AlbaresFranceAsiya Javayant NEW
Tony FollerAustraliaIoni Bowcher NEGOTIATION
Mayumi KolmetzBrazilBernardo Dominic QUALIFIED
Leja CaldareraIndiaIvan Magalhaes PROPOSAL
Kaitlin OstroskyArgentinaBernardo Dominic UNQUALIFIED
Ivar PaprockiFranceXuxue Feng RENEWAL
Horizontal
NameCountryRepresentativeStatus
Greenwood BologniaFranceElwin Sharvill QUALIFIED
Aditya KuskoGermanyBernardo Dominic NEW
Jennifer AmigonUnited KingdomOnyama Limba RENEWAL
Izzy GarufiArgentinaStephen Shaw UNQUALIFIED
Misaki RoysterCanadaAmy Elsner UNQUALIFIED
Jones VocelkaAustraliaAmy Elsner NEGOTIATION
Ashley DoeSpainXuxue Feng RENEWAL
Antonio CaudyIndiaIvan Magalhaes PROPOSAL
Jones VocelkaRussiaIvan Magalhaes PROPOSAL
Maria MarrierRussiaElwin Sharvill QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Greenwood BologniaAustralia2026-04-11Truhlar And Truhlar Attys UNQUALIFIED68Anna Fali
1001Claire TollnerCanada2026-04-29Dorl, James J Esq QUALIFIED68Asiya Javayant
1002Leon OldroydFrance2026-04-15Morlong Associates UNQUALIFIED73Onyama Limba
1003Morrow RutaItaly2026-04-19Rangoni Of Florence UNQUALIFIED24Anna Fali
1004Emily WhobreyGermany2026-04-02Feltz Printing Service NEW99Bernardo Dominic
1005Tony FollerSpain2026-04-19Dorl, James J Esq NEGOTIATION82Onyama Limba
1006Tony FollerRussia2026-04-24Feiner Bros UNQUALIFIED14Ioni Bowcher
1007Isabel BowleyJapan2026-04-29Buckley Miller Wright NEGOTIATION11Onyama Limba
1008Misaki RoysterRussia2026-04-27Buckley Miller Wright NEGOTIATION42Anna Fali
1009Sinclair WaycottUnited Kingdom2026-04-02Buckley Miller Wright PROPOSAL92Ivan Magalhaes
1010Aditya KuskoIndia2026-04-19Rousseaux, Michael Esq PROPOSAL56Xuxue Feng
1011Ivar PaprockiItaly2026-04-15Benton, John B Jr NEW31Ivan Magalhaes
1012Morrow RutaJapan2026-04-09Chanay, Jeffrey A Esq NEGOTIATION45Ivan Magalhaes
1013Aruna FigeroaAustralia2026-04-19Chapman, Ross E Esq QUALIFIED3Bernardo Dominic
1014Murillo MaletGermany2026-04-18Morlong Associates UNQUALIFIED70Onyama Limba
1015Jefferson SchemmerFrance2026-04-26Dorl, James J Esq NEW58Amy Elsner
1016Silvio SlusarskiIndia2026-04-09Rangoni Of Florence UNQUALIFIED5Stephen Shaw
1017Cody SaylorsBrazil2026-04-03Chemel, James L Cpa QUALIFIED72Elwin Sharvill
1018Ashley DoeFrance2026-04-10Dorl, James J Esq NEW1Ioni Bowcher
1019Octavia MaletIndia2026-04-05Feltz Printing Service QUALIFIED79Ivan Magalhaes
1020Silvio SlusarskiBrazil2026-04-17Printing Dimensions NEGOTIATION43Bernardo Dominic
1021Ricardo GauchoGermany2026-04-09Morlong Associates UNQUALIFIED10Ivan Magalhaes
1022Misaki RoysterItaly2026-04-22Truhlar And Truhlar Attys NEGOTIATION6Ioni Bowcher
1023Costa DilliardUnited Kingdom2026-04-12King, Christopher A Esq NEGOTIATION89Onyama Limba
1024Chavez BriddickUnited Kingdom2026-04-05Chapman, Ross E Esq QUALIFIED73Amy Elsner
1025Leon OldroydGermany2026-04-22Truhlar And Truhlar Attys NEGOTIATION15Elwin Sharvill
1026Aditya KuskoUnited Kingdom2026-04-07Dorl, James J Esq NEGOTIATION56Stephen Shaw
1027Leja CaldareraCanada2026-04-04Benton, John B Jr RENEWAL81Ioni Bowcher
1028Deepesh ChuiBrazil2026-04-18Feltz Printing Service PROPOSAL11Xuxue Feng
1029Francesco ShinkoIndia2026-04-10Rousseaux, Michael Esq NEGOTIATION10Stephen Shaw
1030David DarakjyCanada2026-04-24Chemel, James L Cpa UNQUALIFIED79Elwin Sharvill
1031Jefferson SchemmerItaly2026-04-17Rangoni Of Florence QUALIFIED43Amy Elsner
1032Wickens NestleIndia2026-04-07Feltz Printing Service QUALIFIED66Asiya Javayant
1033Greenwood BologniaArgentina2026-04-28Feltz Printing Service NEGOTIATION6Ivan Magalhaes
1034Claire TollnerJapan2026-04-12Rousseaux, Michael Esq RENEWAL16Bernardo Dominic
1035Aditya KuskoFrance2026-04-07Commercial Press NEW51Stephen Shaw
1036Leja CaldareraJapan2026-04-28Feiner Bros QUALIFIED0Ivan Magalhaes
1037Darci PoquetteGermany2026-04-17Benton, John B Jr NEW90Amy Elsner
1038Leja CaldareraItaly2026-04-07Morlong Associates NEGOTIATION32Elwin Sharvill
1039Salvatore StockhamBrazil2026-04-18Chemel, James L Cpa UNQUALIFIED22Anna Fali
1040Jeanfrancois VenereBrazil2026-04-20Rousseaux, Michael Esq QUALIFIED75Amy Elsner
1041Jefferson SchemmerCanada2026-04-14Rangoni Of Florence QUALIFIED69Onyama Limba
1042Smith GlickAustralia2026-04-27Feltz Printing Service NEGOTIATION42Stephen Shaw
1043Faith GillianBrazil2026-04-22Commercial Press QUALIFIED52Anna Fali
1044Munro FerenczBrazil2026-04-29Commercial Press UNQUALIFIED65Ivan Magalhaes
1045Aditya KuskoIndia2026-04-26Dorl, James J Esq PROPOSAL94Elwin Sharvill
1046Octavia MaletRussia2026-04-22Commercial Press NEGOTIATION52Stephen Shaw
1047Emily WhobreyIndia2026-04-22Buckley Miller Wright RENEWAL67Stephen Shaw
1048Murillo MaletSpain2026-04-13King, Christopher A Esq RENEWAL45Bernardo Dominic
1049Leja CaldareraAustralia2026-04-20Dorl, James J Esq NEGOTIATION39Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Mayumi KolmetzSpainOnyama Limba UNQUALIFIED
Emily WhobreyFranceElwin Sharvill RENEWAL
Isabel BowleyCanadaAsiya Javayant UNQUALIFIED
Sinclair WaycottGermanyOnyama Limba QUALIFIED
Nicolas IturbideUnited KingdomStephen Shaw NEW
Stacey MacleadCanadaStephen Shaw NEGOTIATION
Mujtaba NickaFranceBernardo Dominic UNQUALIFIED
Misaki RoysterUnited KingdomBernardo Dominic RENEWAL
Nicolas IturbideFranceOnyama Limba PROPOSAL
Wickens NestleItalyBernardo Dominic NEW
Kaitlin OstroskyRussiaAmy Elsner UNQUALIFIED
Adams MorascaCanadaElwin Sharvill PROPOSAL
Aika InouyeItalyIvan Magalhaes NEW
Darci PoquetteGermanyIoni Bowcher NEW
Smith GlickRussiaAnna Fali PROPOSAL
Clifford RimFranceElwin Sharvill PROPOSAL
Johnson SergiArgentinaIoni Bowcher NEGOTIATION
Kadeem FlosiJapanAsiya Javayant PROPOSAL
Clifford RimCanadaElwin Sharvill UNQUALIFIED
Ivar PaprockiSpainXuxue Feng QUALIFIED
Leon OldroydUnited KingdomIvan Magalhaes NEGOTIATION
Chavez BriddickBrazilBernardo Dominic RENEWAL
Morrow RutaSpainXuxue Feng NEGOTIATION
Deepesh ChuiGermanyOnyama Limba QUALIFIED
Claire TollnerGermanyAnna Fali NEGOTIATION
Deepesh ChuiArgentinaStephen Shaw RENEWAL
Misaki RoysterArgentinaXuxue Feng QUALIFIED
Mujtaba NickaCanadaElwin Sharvill QUALIFIED
Kaitlin OstroskyRussiaAmy Elsner NEW
Jennifer AmigonCanadaAnna Fali NEGOTIATION
Ricardo GauchoJapanOnyama Limba NEGOTIATION
Ricardo GauchoAustraliaElwin Sharvill QUALIFIED
Wickens NestleSpainElwin Sharvill RENEWAL
David DarakjyJapanIvan Magalhaes QUALIFIED
Chavez BriddickBrazilOnyama Limba PROPOSAL
Silvio SlusarskiJapanBernardo Dominic NEGOTIATION
Salvatore StockhamGermanyXuxue Feng RENEWAL
Jefferson SchemmerIndiaAsiya Javayant QUALIFIED
Nicolas IturbideBrazilAmy Elsner PROPOSAL
Leon OldroydJapanXuxue Feng QUALIFIED
Jones VocelkaUnited KingdomBernardo Dominic NEGOTIATION
Maisha RulapaughSpainAnna Fali NEGOTIATION
Smith GlickGermanyOnyama Limba UNQUALIFIED
Greenwood BologniaIndiaOnyama Limba RENEWAL
Maria MarrierGermanyStephen Shaw RENEWAL
Julie StensethUnited KingdomOnyama Limba RENEWAL
Maria MarrierCanadaAnna Fali NEGOTIATION
Deepesh ChuiBrazilOnyama Limba UNQUALIFIED
Ashley DoeItalyIvan Magalhaes NEW
Emily WhobreyJapanIvan Magalhaes QUALIFIED
Frozen Columns
Name
Silvio Slusarski
Mujtaba Nicka
Claire Tollner
Faith Gillian
Aruna Figeroa
Chavez Briddick
Julie Stenseth
Alejandro Perin
Stacey Maclead
Maisha Rulapaugh
Maria Marrier
Mujtaba Nicka
Maisha Rulapaugh
Izzy Garufi
Maria Marrier
Chavez Briddick
Jennifer Amigon
Alejandro Perin
Faith Gillian
Kadeem Flosi
Isabel Bowley
Morrow Ruta
Misaki Royster
Emily Whobrey
Leja Caldarera
Leja Caldarera
Claire Tollner
Munro Ferencz
Costa Dilliard
Adams Morasca
David Darakjy
David Darakjy
Ivar Paprocki
Octavia Malet
Kaitlin Ostrosky
Silvio Slusarski
Rodrigues Campain
Silvio Slusarski
Aruna Figeroa
Ricardo Gaucho
Claire Tollner
Antonio Caudy
Mujtaba Nicka
Isabel Bowley
Costa Dilliard
Clifford Rim
Ricardo Gaucho
Silvio Slusarski
David Darakjy
Silvio Slusarski
IdCountryDate
1000Australia2026-04-09
1001Australia2026-04-09
1002Canada2026-04-05
1003Japan2026-04-10
1004Germany2026-04-08
1005Australia2026-04-22
1006Russia2026-04-25
1007Australia2026-04-09
1008Spain2026-04-04
1009France2026-04-19
1010Spain2026-04-20
1011Argentina2026-05-01
1012Australia2026-04-10
1013Australia2026-04-03
1014France2026-04-20
1015Italy2026-04-28
1016France2026-04-14
1017Australia2026-04-13
1018United Kingdom2026-04-23
1019France2026-04-14
1020Argentina2026-04-15
1021Spain2026-04-12
1022Japan2026-04-21
1023Spain2026-04-08
1024France2026-04-29
1025Italy2026-04-15
1026Canada2026-04-07
1027India2026-04-12
1028Spain2026-04-07
1029Russia2026-04-24
1030India2026-04-25
1031United Kingdom2026-04-10
1032United Kingdom2026-04-25
1033Russia2026-04-21
1034India2026-04-02
1035Italy2026-04-19
1036Canada2026-04-05
1037Russia2026-04-18
1038United Kingdom2026-04-24
1039Russia2026-04-16
1040Argentina2026-04-15
1041Japan2026-04-20
1042France2026-05-01
1043Canada2026-04-28
1044Australia2026-04-09
1045Argentina2026-05-01
1046India2026-04-12
1047India2026-04-14
1048United Kingdom2026-04-23
1049Brazil2026-04-19

On-Demand Data

NameIdCountryDate
Ivar Paprocki1000Spain2026-04-13
Emily Whobrey1001Canada2026-04-11
Johnson Sergi1002Argentina2026-04-27
Kaitlin Ostrosky1003Argentina2026-04-03
Stacey Maclead1004Germany2026-04-28
Stacey Maclead1005Australia2026-04-04
Clifford Rim1006Germany2026-04-16
Juan Wieser1007Germany2026-04-25
Munro Ferencz1008Brazil2026-04-11
Julie Stenseth1009Germany2026-04-02
Mayumi Kolmetz1010Canada2026-04-13
Julie Stenseth1011United Kingdom2026-04-19
Smith Glick1012Argentina2026-04-17
Alejandro Perin1013Russia2026-04-12
Kadeem Flosi1014Australia2026-04-18
Kaitlin Ostrosky1015Brazil2026-04-19
Stacey Maclead1016Australia2026-04-25
Murillo Malet1017Brazil2026-04-29
Alejandro Perin1018Canada2026-04-10
Cody Saylors1019United Kingdom2026-04-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Cody SaylorsItalyAmy Elsner NEGOTIATION
Emily WhobreyItalyBernardo Dominic NEW
Jones VocelkaCanadaBernardo Dominic UNQUALIFIED
Cody SaylorsAustraliaIvan Magalhaes RENEWAL
Faith GillianRussiaIoni Bowcher RENEWAL
Jefferson SchemmerJapanIvan Magalhaes RENEWAL
Arvin AlbaresBrazilBernardo Dominic NEW
Wickens NestleRussiaStephen Shaw PROPOSAL
Francesco ShinkoAustraliaIoni Bowcher NEGOTIATION
Izzy GarufiIndiaAnna Fali RENEWAL
Cody SaylorsGermanyIvan Magalhaes QUALIFIED
Jefferson SchemmerIndiaIvan Magalhaes RENEWAL
Aruna FigeroaAustraliaStephen Shaw NEW
Leja CaldareraUnited KingdomAsiya Javayant NEW
Clifford RimGermanyElwin Sharvill NEGOTIATION
Cody SaylorsFranceIoni Bowcher NEW
Maria MarrierCanadaIoni Bowcher QUALIFIED
Aika InouyeArgentinaElwin Sharvill UNQUALIFIED
Julie StensethIndiaAsiya Javayant NEW
Salvatore StockhamAustraliaElwin Sharvill NEW
Jeanfrancois VenereBrazilStephen Shaw NEW
Emily WhobreyIndiaIvan Magalhaes PROPOSAL
Aika InouyeItalyElwin Sharvill RENEWAL
Jennifer AmigonUnited KingdomIoni Bowcher NEGOTIATION
Salvatore StockhamJapanStephen Shaw PROPOSAL
Jennifer AmigonBrazilXuxue Feng QUALIFIED
Costa DilliardBrazilStephen Shaw RENEWAL
Clifford RimIndiaStephen Shaw UNQUALIFIED
Morrow RutaArgentinaOnyama Limba NEW
Salvatore StockhamRussiaIoni Bowcher UNQUALIFIED
Morrow RutaIndiaAnna Fali NEW
Nicolas IturbideRussiaIvan Magalhaes RENEWAL
Julie StensethFranceBernardo Dominic NEW
Salvatore StockhamJapanOnyama Limba NEGOTIATION
Kadeem FlosiSpainBernardo Dominic UNQUALIFIED
Faith GillianUnited KingdomElwin Sharvill UNQUALIFIED
James ButtCanadaStephen Shaw PROPOSAL
Mayumi KolmetzSpainIvan Magalhaes PROPOSAL
Munro FerenczUnited KingdomOnyama Limba UNQUALIFIED
Jones VocelkaSpainXuxue Feng 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>