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
Arvin AlbaresUnited KingdomIoni Bowcher NEGOTIATION
Adams MorascaRussiaIvan Magalhaes NEW
Jefferson SchemmerFranceOnyama Limba PROPOSAL
Faith GillianIndiaBernardo Dominic PROPOSAL
Darci PoquetteArgentinaElwin Sharvill PROPOSAL
Rodrigues CampainCanadaIoni Bowcher RENEWAL
Morrow RutaUnited KingdomXuxue Feng RENEWAL
Claire TollnerCanadaAnna Fali NEGOTIATION
Aditya KuskoItalyAnna Fali NEW
Costa DilliardBrazilIvan Magalhaes RENEWAL
Munro FerenczItalyElwin Sharvill QUALIFIED
Adams MorascaFranceAnna Fali NEGOTIATION
Misaki RoysterIndiaStephen Shaw PROPOSAL
Johnson SergiCanadaStephen Shaw RENEWAL
Salvatore StockhamSpainElwin Sharvill NEW
Ivar PaprockiItalyAmy Elsner UNQUALIFIED
Mujtaba NickaJapanAnna Fali NEW
Chavez BriddickSpainAmy Elsner QUALIFIED
Mayumi KolmetzArgentinaElwin Sharvill NEW
Mayumi KolmetzArgentinaElwin Sharvill NEW
Octavia MaletCanadaAmy Elsner QUALIFIED
Clifford RimCanadaOnyama Limba NEGOTIATION
Mayumi KolmetzUnited KingdomElwin Sharvill UNQUALIFIED
Claire TollnerRussiaOnyama Limba NEGOTIATION
Rodrigues CampainArgentinaAnna Fali PROPOSAL
Johnson SergiItalyAsiya Javayant NEW
Greenwood BologniaUnited KingdomStephen Shaw NEGOTIATION
Johnson SergiSpainElwin Sharvill UNQUALIFIED
Adams MorascaRussiaAnna Fali QUALIFIED
Clifford RimRussiaAsiya Javayant UNQUALIFIED
Chavez BriddickArgentinaXuxue Feng PROPOSAL
Jones VocelkaFranceIoni Bowcher RENEWAL
Adams MorascaAustraliaOnyama Limba NEGOTIATION
Mayumi KolmetzSpainAmy Elsner QUALIFIED
Misaki RoysterFranceAmy Elsner RENEWAL
Ashley DoeItalyStephen Shaw PROPOSAL
Izzy GarufiRussiaAmy Elsner QUALIFIED
Darci PoquetteArgentinaStephen Shaw UNQUALIFIED
Kadeem FlosiArgentinaIoni Bowcher PROPOSAL
Jennifer AmigonCanadaXuxue Feng UNQUALIFIED
Emily WhobreyRussiaBernardo Dominic UNQUALIFIED
Johnson SergiAustraliaAmy Elsner RENEWAL
Wickens NestleUnited KingdomElwin Sharvill UNQUALIFIED
Leja CaldareraRussiaAmy Elsner QUALIFIED
Cody SaylorsFranceXuxue Feng QUALIFIED
Kaitlin OstroskyArgentinaXuxue Feng UNQUALIFIED
Jennifer AmigonItalyBernardo Dominic PROPOSAL
Jeanfrancois VenereJapanAsiya Javayant RENEWAL
Antonio CaudyRussiaAsiya Javayant RENEWAL
Maisha RulapaughItalyAnna Fali NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Deepesh ChuiIndiaIvan Magalhaes RENEWAL
Silvio SlusarskiIndiaAmy Elsner PROPOSAL
Kadeem FlosiJapanXuxue Feng PROPOSAL
Maria MarrierBrazilAnna Fali NEW
Deepesh ChuiJapanIvan Magalhaes UNQUALIFIED
Murillo MaletSpainXuxue Feng UNQUALIFIED
Chavez BriddickAustraliaStephen Shaw UNQUALIFIED
Jennifer AmigonFranceElwin Sharvill RENEWAL
Jeanfrancois VenereIndiaBernardo Dominic RENEWAL
Jones VocelkaBrazilElwin Sharvill RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Kaitlin OstroskyBrazil2026-04-28Dorl, James J Esq RENEWAL99Anna Fali
1001Juan WieserItaly2026-05-22Chapman, Ross E Esq RENEWAL71Anna Fali
1002Rodrigues CampainCanada2026-05-01Morlong Associates NEW22Asiya Javayant
1003Ricardo GauchoRussia2026-05-07Dorl, James J Esq RENEWAL23Anna Fali
1004Costa DilliardFrance2026-05-07Chanay, Jeffrey A Esq NEW48Ivan Magalhaes
1005Murillo MaletGermany2026-05-06Dorl, James J Esq RENEWAL11Ivan Magalhaes
1006Mujtaba NickaRussia2026-05-17Feltz Printing Service NEGOTIATION31Anna Fali
1007Johnson SergiIndia2026-05-18Feiner Bros NEGOTIATION50Onyama Limba
1008Aika InouyeGermany2026-05-23Chapman, Ross E Esq RENEWAL27Ioni Bowcher
1009Juan WieserUnited Kingdom2026-05-14Printing Dimensions NEGOTIATION92Elwin Sharvill
1010Leon OldroydFrance2026-05-03Truhlar And Truhlar Attys NEGOTIATION77Onyama Limba
1011Misaki RoysterUnited Kingdom2026-05-10Chapman, Ross E Esq QUALIFIED84Ivan Magalhaes
1012Salvatore StockhamJapan2026-05-08Dorl, James J Esq QUALIFIED90Stephen Shaw
1013Maria MarrierIndia2026-05-17Truhlar And Truhlar Attys PROPOSAL45Amy Elsner
1014Greenwood BologniaFrance2026-05-07Feiner Bros QUALIFIED73Anna Fali
1015Francesco ShinkoGermany2026-05-03Commercial Press NEW28Elwin Sharvill
1016Munro FerenczUnited Kingdom2026-05-16Truhlar And Truhlar Attys PROPOSAL21Ioni Bowcher
1017Wickens NestleIndia2026-04-30Feiner Bros UNQUALIFIED29Ivan Magalhaes
1018Leon OldroydUnited Kingdom2026-05-09Printing Dimensions NEGOTIATION71Xuxue Feng
1019Ashley DoeSpain2026-05-06Benton, John B Jr RENEWAL70Onyama Limba
1020Ivar PaprockiRussia2026-05-08Commercial Press UNQUALIFIED83Ivan Magalhaes
1021Aika InouyeCanada2026-04-28Dorl, James J Esq QUALIFIED43Amy Elsner
1022Antonio CaudyIndia2026-05-22Buckley Miller Wright PROPOSAL46Onyama Limba
1023Munro FerenczCanada2026-05-08Morlong Associates PROPOSAL7Ivan Magalhaes
1024Arvin AlbaresFrance2026-05-16Buckley Miller Wright NEGOTIATION91Elwin Sharvill
1025Kadeem FlosiArgentina2026-05-15Printing Dimensions QUALIFIED97Ivan Magalhaes
1026Mujtaba NickaJapan2026-05-23Rousseaux, Michael Esq PROPOSAL37Elwin Sharvill
1027Aika InouyeAustralia2026-05-07Chanay, Jeffrey A Esq NEGOTIATION29Stephen Shaw
1028Ashley DoeGermany2026-05-09Feiner Bros NEW50Bernardo Dominic
1029Leja CaldareraBrazil2026-05-18King, Christopher A Esq PROPOSAL37Ivan Magalhaes
1030Smith GlickFrance2026-05-01Feltz Printing Service RENEWAL93Ivan Magalhaes
1031Leon OldroydCanada2026-05-05Feltz Printing Service NEGOTIATION65Asiya Javayant
1032Costa DilliardGermany2026-05-01Benton, John B Jr RENEWAL76Bernardo Dominic
1033Arvin AlbaresIndia2026-04-26Dorl, James J Esq UNQUALIFIED7Xuxue Feng
1034Juan WieserJapan2026-05-08Buckley Miller Wright PROPOSAL87Elwin Sharvill
1035Tony FollerSpain2026-04-30Dorl, James J Esq QUALIFIED58Ioni Bowcher
1036Jennifer AmigonItaly2026-05-14Printing Dimensions NEGOTIATION89Stephen Shaw
1037Munro FerenczGermany2026-05-06Truhlar And Truhlar Attys NEGOTIATION67Bernardo Dominic
1038Mayumi KolmetzUnited Kingdom2026-05-20Buckley Miller Wright PROPOSAL39Onyama Limba
1039Antonio CaudyUnited Kingdom2026-04-28Feltz Printing Service NEGOTIATION52Stephen Shaw
1040Izzy GarufiArgentina2026-04-25Rangoni Of Florence QUALIFIED85Asiya Javayant
1041Ivar PaprockiSpain2026-05-20Chanay, Jeffrey A Esq NEW66Xuxue Feng
1042Jennifer AmigonGermany2026-05-15Commercial Press UNQUALIFIED98Asiya Javayant
1043Deepesh ChuiCanada2026-05-12Chanay, Jeffrey A Esq UNQUALIFIED12Bernardo Dominic
1044Salvatore StockhamItaly2026-05-16Chemel, James L Cpa RENEWAL22Bernardo Dominic
1045Misaki RoysterIndia2026-05-09Chemel, James L Cpa NEGOTIATION24Stephen Shaw
1046Faith GillianAustralia2026-04-25Chanay, Jeffrey A Esq NEGOTIATION13Ioni Bowcher
1047Aditya KuskoItaly2026-04-29Chapman, Ross E Esq QUALIFIED66Ivan Magalhaes
1048Silvio SlusarskiItaly2026-05-08Benton, John B Jr UNQUALIFIED13Stephen Shaw
1049Jennifer AmigonJapan2026-05-12Feltz Printing Service PROPOSAL48Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Jeanfrancois VenereSpainStephen Shaw NEW
Julie StensethCanadaAmy Elsner NEGOTIATION
Johnson SergiArgentinaAsiya Javayant QUALIFIED
Aika InouyeItalyStephen Shaw QUALIFIED
Maisha RulapaughSpainStephen Shaw PROPOSAL
Leon OldroydJapanAmy Elsner RENEWAL
Ivar PaprockiRussiaStephen Shaw RENEWAL
Kaitlin OstroskyArgentinaXuxue Feng QUALIFIED
Sinclair WaycottAustraliaElwin Sharvill RENEWAL
Clifford RimFranceBernardo Dominic RENEWAL
David DarakjyUnited KingdomStephen Shaw RENEWAL
Leja CaldareraArgentinaIvan Magalhaes RENEWAL
Isabel BowleyGermanyOnyama Limba NEGOTIATION
Leja CaldareraUnited KingdomElwin Sharvill QUALIFIED
Ivar PaprockiRussiaStephen Shaw QUALIFIED
Ricardo GauchoBrazilIoni Bowcher QUALIFIED
Faith GillianSpainOnyama Limba PROPOSAL
Kaitlin OstroskyAustraliaBernardo Dominic RENEWAL
Maria MarrierRussiaAmy Elsner UNQUALIFIED
Rodrigues CampainIndiaIvan Magalhaes RENEWAL
Maisha RulapaughItalyElwin Sharvill PROPOSAL
Mujtaba NickaGermanyStephen Shaw NEW
Jones VocelkaSpainBernardo Dominic UNQUALIFIED
Rodrigues CampainCanadaIoni Bowcher NEGOTIATION
Rodrigues CampainFranceAnna Fali RENEWAL
Kaitlin OstroskyFranceElwin Sharvill NEW
Darci PoquetteAustraliaBernardo Dominic NEGOTIATION
David DarakjyRussiaAnna Fali PROPOSAL
Stacey MacleadJapanIoni Bowcher RENEWAL
Kaitlin OstroskyFranceStephen Shaw NEW
Johnson SergiJapanIoni Bowcher QUALIFIED
Murillo MaletSpainAnna Fali NEW
Alejandro PerinSpainAmy Elsner UNQUALIFIED
Silvio SlusarskiAustraliaElwin Sharvill NEW
Kaitlin OstroskyBrazilAsiya Javayant RENEWAL
Misaki RoysterFranceIoni Bowcher UNQUALIFIED
Faith GillianBrazilElwin Sharvill QUALIFIED
Tony FollerIndiaBernardo Dominic NEGOTIATION
Nicolas IturbideCanadaXuxue Feng RENEWAL
Sinclair WaycottJapanOnyama Limba PROPOSAL
Sinclair WaycottItalyStephen Shaw NEGOTIATION
Izzy GarufiSpainBernardo Dominic UNQUALIFIED
James ButtAustraliaIvan Magalhaes UNQUALIFIED
Claire TollnerIndiaAsiya Javayant PROPOSAL
Juan WieserAustraliaIoni Bowcher PROPOSAL
Leon OldroydItalyBernardo Dominic RENEWAL
Leon OldroydSpainBernardo Dominic NEGOTIATION
Salvatore StockhamUnited KingdomBernardo Dominic UNQUALIFIED
Emily WhobreyBrazilXuxue Feng QUALIFIED
Antonio CaudyItalyBernardo Dominic UNQUALIFIED
Frozen Columns
Name
Cody Saylors
Stacey Maclead
Octavia Malet
Adams Morasca
Maisha Rulapaugh
Sinclair Waycott
Chavez Briddick
Jeanfrancois Venere
Darci Poquette
Emily Whobrey
Alejandro Perin
Antonio Caudy
Ashley Doe
David Darakjy
Jennifer Amigon
Jeanfrancois Venere
Jefferson Schemmer
Stacey Maclead
James Butt
David Darakjy
Tony Foller
Octavia Malet
Sinclair Waycott
Silvio Slusarski
Rodrigues Campain
Murillo Malet
Leon Oldroyd
Aruna Figeroa
Wickens Nestle
Darci Poquette
Cody Saylors
Chavez Briddick
Jefferson Schemmer
Johnson Sergi
Misaki Royster
Ivar Paprocki
Morrow Ruta
Mujtaba Nicka
David Darakjy
Sinclair Waycott
Julie Stenseth
James Butt
David Darakjy
Mayumi Kolmetz
Aruna Figeroa
Jennifer Amigon
Ivar Paprocki
Cody Saylors
Jennifer Amigon
Aika Inouye
IdCountryDate
1000Argentina2026-04-25
1001Japan2026-05-11
1002Germany2026-05-12
1003India2026-05-06
1004Australia2026-04-30
1005Brazil2026-05-05
1006Canada2026-05-23
1007Italy2026-05-14
1008India2026-05-23
1009India2026-04-27
1010Japan2026-04-26
1011Spain2026-05-21
1012Russia2026-04-27
1013Brazil2026-05-09
1014Argentina2026-05-23
1015France2026-05-10
1016France2026-05-06
1017Canada2026-05-20
1018Russia2026-04-25
1019Brazil2026-04-27
1020France2026-05-22
1021Spain2026-05-06
1022Canada2026-05-20
1023Russia2026-05-10
1024Italy2026-05-10
1025Argentina2026-05-06
1026Brazil2026-05-09
1027Brazil2026-05-15
1028Canada2026-05-10
1029Russia2026-05-20
1030Argentina2026-05-07
1031Russia2026-05-09
1032France2026-05-17
1033Canada2026-04-25
1034Australia2026-05-03
1035Canada2026-05-18
1036Italy2026-05-09
1037Italy2026-04-27
1038France2026-05-14
1039Germany2026-05-16
1040Italy2026-05-03
1041Russia2026-05-12
1042Spain2026-04-30
1043Canada2026-05-04
1044Germany2026-04-27
1045Brazil2026-04-26
1046United Kingdom2026-05-12
1047Germany2026-05-05
1048Argentina2026-04-25
1049Canada2026-05-02

On-Demand Data

NameIdCountryDate
Jennifer Amigon1000Japan2026-05-11
Aika Inouye1001Spain2026-04-27
Chavez Briddick1002Spain2026-05-15
Silvio Slusarski1003Brazil2026-05-09
Johnson Sergi1004United Kingdom2026-05-16
Salvatore Stockham1005Brazil2026-05-21
Greenwood Bolognia1006Russia2026-04-27
Jones Vocelka1007Germany2026-05-18
Kaitlin Ostrosky1008Australia2026-05-02
Juan Wieser1009India2026-04-27
Murillo Malet1010France2026-05-05
Adams Morasca1011Spain2026-05-08
Munro Ferencz1012Spain2026-05-14
Jeanfrancois Venere1013United Kingdom2026-05-05
Nicolas Iturbide1014United Kingdom2026-05-20
Clifford Rim1015Australia2026-04-29
Kadeem Flosi1016Russia2026-05-19
Claire Tollner1017India2026-04-30
Murillo Malet1018Russia2026-04-27
James Butt1019Australia2026-04-26
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Rodrigues CampainItalyAnna Fali RENEWAL
Chavez BriddickAustraliaAsiya Javayant QUALIFIED
Nicolas IturbideSpainBernardo Dominic PROPOSAL
Octavia MaletFranceXuxue Feng RENEWAL
Chavez BriddickBrazilAnna Fali NEW
Isabel BowleySpainAsiya Javayant NEW
Leon OldroydFranceXuxue Feng UNQUALIFIED
Francesco ShinkoGermanyAsiya Javayant QUALIFIED
Rodrigues CampainFranceIvan Magalhaes NEW
Aditya KuskoCanadaOnyama Limba RENEWAL
Ivar PaprockiJapanStephen Shaw PROPOSAL
Johnson SergiIndiaOnyama Limba PROPOSAL
Kadeem FlosiUnited KingdomBernardo Dominic RENEWAL
Cody SaylorsRussiaBernardo Dominic NEGOTIATION
Antonio CaudyFranceBernardo Dominic QUALIFIED
Aditya KuskoSpainAnna Fali UNQUALIFIED
Sinclair WaycottUnited KingdomBernardo Dominic QUALIFIED
Maisha RulapaughItalyAsiya Javayant PROPOSAL
Morrow RutaIndiaIvan Magalhaes RENEWAL
Kadeem FlosiItalyAnna Fali NEW
Darci PoquetteGermanyBernardo Dominic PROPOSAL
Ashley DoeGermanyIvan Magalhaes QUALIFIED
Julie StensethIndiaAnna Fali NEW
Smith GlickJapanAnna Fali UNQUALIFIED
Alejandro PerinFranceBernardo Dominic RENEWAL
Arvin AlbaresRussiaAnna Fali QUALIFIED
James ButtFranceAnna Fali UNQUALIFIED
Ricardo GauchoFranceBernardo Dominic NEGOTIATION
Kaitlin OstroskySpainElwin Sharvill UNQUALIFIED
Claire TollnerCanadaElwin Sharvill PROPOSAL
Nicolas IturbideSpainElwin Sharvill NEGOTIATION
Tony FollerArgentinaElwin Sharvill RENEWAL
Julie StensethFranceAnna Fali NEW
Octavia MaletArgentinaAmy Elsner PROPOSAL
Aditya KuskoGermanyAnna Fali QUALIFIED
Stacey MacleadGermanyIvan Magalhaes NEW
Aditya KuskoSpainOnyama Limba NEGOTIATION
Jones VocelkaJapanXuxue Feng NEGOTIATION
Costa DilliardIndiaAmy Elsner NEW
Maria MarrierJapanAmy Elsner NEGOTIATION

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