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
Darci PoquetteJapanStephen Shaw NEGOTIATION
David DarakjyAustraliaBernardo Dominic NEGOTIATION
Kadeem FlosiArgentinaAmy Elsner PROPOSAL
Adams MorascaCanadaStephen Shaw UNQUALIFIED
Stacey MacleadJapanStephen Shaw QUALIFIED
Cody SaylorsItalyStephen Shaw NEGOTIATION
Sinclair WaycottIndiaBernardo Dominic QUALIFIED
Nicolas IturbideIndiaElwin Sharvill QUALIFIED
Jones VocelkaItalyElwin Sharvill QUALIFIED
Jefferson SchemmerBrazilAsiya Javayant RENEWAL
Greenwood BologniaItalyOnyama Limba UNQUALIFIED
Ashley DoeArgentinaOnyama Limba PROPOSAL
Cody SaylorsSpainIvan Magalhaes UNQUALIFIED
Morrow RutaJapanBernardo Dominic UNQUALIFIED
Tony FollerItalyIoni Bowcher NEW
Salvatore StockhamRussiaStephen Shaw NEGOTIATION
Jones VocelkaItalyStephen Shaw NEW
Maria MarrierUnited KingdomOnyama Limba NEGOTIATION
Emily WhobreyJapanIvan Magalhaes QUALIFIED
Claire TollnerGermanyOnyama Limba UNQUALIFIED
Clifford RimUnited KingdomAsiya Javayant UNQUALIFIED
Deepesh ChuiArgentinaOnyama Limba QUALIFIED
Isabel BowleyArgentinaXuxue Feng RENEWAL
Mayumi KolmetzArgentinaStephen Shaw NEW
Clifford RimSpainIoni Bowcher UNQUALIFIED
Leon OldroydCanadaIoni Bowcher NEGOTIATION
Chavez BriddickJapanStephen Shaw PROPOSAL
Tony FollerBrazilAnna Fali NEGOTIATION
Darci PoquetteIndiaAmy Elsner PROPOSAL
Mujtaba NickaUnited KingdomAmy Elsner RENEWAL
Murillo MaletBrazilAmy Elsner UNQUALIFIED
Munro FerenczIndiaOnyama Limba RENEWAL
Aditya KuskoIndiaXuxue Feng NEGOTIATION
Munro FerenczGermanyStephen Shaw RENEWAL
Tony FollerFranceIvan Magalhaes NEW
Aruna FigeroaArgentinaAmy Elsner NEGOTIATION
Isabel BowleySpainAnna Fali NEGOTIATION
Sinclair WaycottCanadaIvan Magalhaes QUALIFIED
Ivar PaprockiFranceOnyama Limba UNQUALIFIED
Aditya KuskoIndiaElwin Sharvill UNQUALIFIED
Silvio SlusarskiAustraliaAmy Elsner NEW
Jefferson SchemmerArgentinaStephen Shaw PROPOSAL
Morrow RutaCanadaAsiya Javayant QUALIFIED
Leja CaldareraJapanAsiya Javayant UNQUALIFIED
Claire TollnerCanadaIoni Bowcher RENEWAL
Silvio SlusarskiCanadaXuxue Feng QUALIFIED
Stacey MacleadArgentinaOnyama Limba NEW
Mujtaba NickaRussiaAmy Elsner RENEWAL
Julie StensethCanadaIoni Bowcher RENEWAL
Mayumi KolmetzJapanIvan Magalhaes PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Darci PoquetteBrazilXuxue Feng RENEWAL
Aika InouyeBrazilAnna Fali NEW
James ButtCanadaIvan Magalhaes PROPOSAL
Octavia MaletGermanyOnyama Limba QUALIFIED
Isabel BowleyIndiaStephen Shaw RENEWAL
Rodrigues CampainIndiaXuxue Feng PROPOSAL
Morrow RutaJapanBernardo Dominic NEW
Deepesh ChuiBrazilAsiya Javayant PROPOSAL
Misaki RoysterItalyIoni Bowcher NEGOTIATION
Izzy GarufiIndiaAsiya Javayant NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Munro FerenczRussia2026-05-30Dorl, James J Esq UNQUALIFIED38Anna Fali
1001Rodrigues CampainAustralia2026-05-29Chapman, Ross E Esq NEGOTIATION5Elwin Sharvill
1002Jeanfrancois VenereGermany2026-05-23Dorl, James J Esq PROPOSAL42Anna Fali
1003Deepesh ChuiIndia2026-05-16Dorl, James J Esq NEW91Amy Elsner
1004Juan WieserCanada2026-05-12Feiner Bros UNQUALIFIED26Onyama Limba
1005Clifford RimAustralia2026-05-19Chemel, James L Cpa NEGOTIATION67Elwin Sharvill
1006Rodrigues CampainCanada2026-06-04Feiner Bros NEGOTIATION7Elwin Sharvill
1007Leon OldroydCanada2026-05-10Chemel, James L Cpa NEW40Bernardo Dominic
1008Arvin AlbaresArgentina2026-05-11King, Christopher A Esq RENEWAL79Ioni Bowcher
1009Darci PoquetteBrazil2026-05-26Benton, John B Jr NEW47Ivan Magalhaes
1010Ivar PaprockiJapan2026-06-01Dorl, James J Esq QUALIFIED5Onyama Limba
1011Leja CaldareraIndia2026-05-28Feiner Bros QUALIFIED69Amy Elsner
1012Stacey MacleadAustralia2026-05-19King, Christopher A Esq RENEWAL40Amy Elsner
1013Kaitlin OstroskyBrazil2026-05-24Truhlar And Truhlar Attys PROPOSAL63Bernardo Dominic
1014Ashley DoeAustralia2026-05-09Morlong Associates PROPOSAL15Asiya Javayant
1015Antonio CaudyBrazil2026-05-21Rousseaux, Michael Esq UNQUALIFIED5Amy Elsner
1016Nicolas IturbideRussia2026-05-11Truhlar And Truhlar Attys PROPOSAL95Xuxue Feng
1017Smith GlickJapan2026-05-30Feiner Bros RENEWAL86Ivan Magalhaes
1018Murillo MaletBrazil2026-05-31Buckley Miller Wright QUALIFIED6Anna Fali
1019Chavez BriddickAustralia2026-05-21Rangoni Of Florence RENEWAL38Stephen Shaw
1020Jefferson SchemmerAustralia2026-05-20Rangoni Of Florence QUALIFIED75Bernardo Dominic
1021Sinclair WaycottJapan2026-05-16Chanay, Jeffrey A Esq PROPOSAL55Onyama Limba
1022Ivar PaprockiItaly2026-05-31Dorl, James J Esq RENEWAL65Ioni Bowcher
1023Juan WieserIndia2026-05-27Rangoni Of Florence NEGOTIATION88Bernardo Dominic
1024Juan WieserUnited Kingdom2026-05-31Printing Dimensions QUALIFIED12Stephen Shaw
1025Tony FollerItaly2026-06-01Commercial Press QUALIFIED11Elwin Sharvill
1026Tony FollerAustralia2026-05-07Morlong Associates NEW88Elwin Sharvill
1027Kadeem FlosiArgentina2026-05-28Dorl, James J Esq QUALIFIED67Ivan Magalhaes
1028Faith GillianRussia2026-06-01Chapman, Ross E Esq NEW71Xuxue Feng
1029Cody SaylorsBrazil2026-05-24Chemel, James L Cpa PROPOSAL64Stephen Shaw
1030David DarakjyRussia2026-05-14Feltz Printing Service QUALIFIED27Asiya Javayant
1031Clifford RimSpain2026-05-19Dorl, James J Esq NEGOTIATION39Bernardo Dominic
1032Aruna FigeroaItaly2026-05-27Buckley Miller Wright PROPOSAL55Amy Elsner
1033Ivar PaprockiSpain2026-05-19Chemel, James L Cpa NEGOTIATION33Onyama Limba
1034Maria MarrierUnited Kingdom2026-05-06Dorl, James J Esq UNQUALIFIED58Ioni Bowcher
1035Aika InouyeCanada2026-05-22Chapman, Ross E Esq QUALIFIED64Ivan Magalhaes
1036Jennifer AmigonJapan2026-05-11Buckley Miller Wright QUALIFIED51Onyama Limba
1037Isabel BowleyRussia2026-05-14Commercial Press UNQUALIFIED83Stephen Shaw
1038Aruna FigeroaUnited Kingdom2026-05-21Printing Dimensions NEW16Anna Fali
1039Jefferson SchemmerIndia2026-05-08Chemel, James L Cpa RENEWAL39Asiya Javayant
1040Misaki RoysterGermany2026-05-20Rousseaux, Michael Esq NEW61Onyama Limba
1041Jefferson SchemmerArgentina2026-06-02Printing Dimensions RENEWAL58Amy Elsner
1042Cody SaylorsArgentina2026-05-23Morlong Associates UNQUALIFIED81Elwin Sharvill
1043Antonio CaudyFrance2026-05-22Rangoni Of Florence NEGOTIATION85Anna Fali
1044Maisha RulapaughCanada2026-05-14Commercial Press UNQUALIFIED35Bernardo Dominic
1045Jefferson SchemmerGermany2026-06-02Morlong Associates UNQUALIFIED43Asiya Javayant
1046Silvio SlusarskiUnited Kingdom2026-05-07Chapman, Ross E Esq RENEWAL71Stephen Shaw
1047Greenwood BologniaIndia2026-05-23Feiner Bros NEGOTIATION97Ivan Magalhaes
1048Jennifer AmigonSpain2026-06-04Feltz Printing Service QUALIFIED19Ioni Bowcher
1049Chavez BriddickUnited Kingdom2026-05-23Chemel, James L Cpa PROPOSAL20Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Silvio SlusarskiSpainAmy Elsner UNQUALIFIED
Mujtaba NickaIndiaXuxue Feng PROPOSAL
Izzy GarufiSpainIvan Magalhaes PROPOSAL
Francesco ShinkoIndiaIoni Bowcher NEGOTIATION
Ashley DoeSpainIvan Magalhaes QUALIFIED
Aruna FigeroaItalyXuxue Feng UNQUALIFIED
Mujtaba NickaGermanyXuxue Feng UNQUALIFIED
Ivar PaprockiFranceIoni Bowcher UNQUALIFIED
Jennifer AmigonRussiaXuxue Feng UNQUALIFIED
Jennifer AmigonGermanyIoni Bowcher QUALIFIED
Silvio SlusarskiArgentinaAsiya Javayant NEW
Greenwood BologniaAustraliaAnna Fali UNQUALIFIED
Francesco ShinkoItalyAsiya Javayant RENEWAL
Johnson SergiJapanElwin Sharvill NEW
Morrow RutaGermanyStephen Shaw PROPOSAL
Maisha RulapaughItalyStephen Shaw NEW
Cody SaylorsBrazilXuxue Feng NEW
Francesco ShinkoJapanAmy Elsner NEW
Misaki RoysterSpainElwin Sharvill PROPOSAL
Arvin AlbaresBrazilBernardo Dominic UNQUALIFIED
Stacey MacleadJapanIvan Magalhaes NEW
Francesco ShinkoSpainAsiya Javayant UNQUALIFIED
Isabel BowleySpainStephen Shaw PROPOSAL
Jeanfrancois VenereFranceStephen Shaw NEW
Misaki RoysterItalyXuxue Feng QUALIFIED
Rodrigues CampainArgentinaOnyama Limba NEGOTIATION
Ricardo GauchoAustraliaBernardo Dominic UNQUALIFIED
Leja CaldareraSpainIvan Magalhaes RENEWAL
Smith GlickBrazilOnyama Limba NEW
Aruna FigeroaUnited KingdomXuxue Feng PROPOSAL
Octavia MaletUnited KingdomElwin Sharvill PROPOSAL
Murillo MaletUnited KingdomAnna Fali PROPOSAL
Smith GlickRussiaIvan Magalhaes NEW
Ricardo GauchoJapanAnna Fali NEW
Sinclair WaycottCanadaAnna Fali NEW
Mujtaba NickaItalyElwin Sharvill RENEWAL
Izzy GarufiCanadaOnyama Limba PROPOSAL
Aika InouyeBrazilIoni Bowcher QUALIFIED
Deepesh ChuiAustraliaAsiya Javayant RENEWAL
Tony FollerGermanyAsiya Javayant NEW
Chavez BriddickJapanIvan Magalhaes PROPOSAL
Arvin AlbaresCanadaAmy Elsner PROPOSAL
Misaki RoysterSpainIvan Magalhaes UNQUALIFIED
Johnson SergiUnited KingdomStephen Shaw UNQUALIFIED
Greenwood BologniaBrazilIoni Bowcher NEGOTIATION
Isabel BowleyBrazilOnyama Limba PROPOSAL
Costa DilliardItalyAnna Fali QUALIFIED
Juan WieserIndiaXuxue Feng PROPOSAL
Kaitlin OstroskyJapanBernardo Dominic QUALIFIED
Wickens NestleFranceAsiya Javayant QUALIFIED
Frozen Columns
Name
Octavia Malet
Aruna Figeroa
David Darakjy
Jones Vocelka
Antonio Caudy
Octavia Malet
James Butt
Isabel Bowley
Faith Gillian
Arvin Albares
Jennifer Amigon
Munro Ferencz
Emily Whobrey
Kaitlin Ostrosky
David Darakjy
Sinclair Waycott
Smith Glick
Kaitlin Ostrosky
Julie Stenseth
Aditya Kusko
Mayumi Kolmetz
Sinclair Waycott
Stacey Maclead
Emily Whobrey
Mujtaba Nicka
Julie Stenseth
Chavez Briddick
Darci Poquette
Arvin Albares
Isabel Bowley
Izzy Garufi
Adams Morasca
Kaitlin Ostrosky
Emily Whobrey
Chavez Briddick
Mayumi Kolmetz
Costa Dilliard
James Butt
Cody Saylors
Aruna Figeroa
Adams Morasca
Maisha Rulapaugh
Jeanfrancois Venere
Mayumi Kolmetz
Greenwood Bolognia
Ashley Doe
Jefferson Schemmer
Kadeem Flosi
Smith Glick
James Butt
IdCountryDate
1000Germany2026-05-21
1001Argentina2026-06-01
1002Australia2026-05-12
1003France2026-05-09
1004Canada2026-05-20
1005Russia2026-05-24
1006Brazil2026-05-17
1007Germany2026-05-08
1008Russia2026-05-28
1009Canada2026-06-03
1010Brazil2026-05-18
1011Australia2026-05-22
1012Argentina2026-05-25
1013Russia2026-05-11
1014Canada2026-05-10
1015Russia2026-06-01
1016Argentina2026-05-19
1017Russia2026-05-26
1018Argentina2026-06-02
1019Argentina2026-05-16
1020France2026-05-20
1021Germany2026-05-10
1022Italy2026-05-31
1023Canada2026-05-30
1024Argentina2026-05-09
1025United Kingdom2026-05-10
1026Brazil2026-05-24
1027Japan2026-05-23
1028France2026-05-31
1029Germany2026-05-10
1030United Kingdom2026-06-01
1031Japan2026-05-19
1032Japan2026-05-30
1033Russia2026-05-17
1034United Kingdom2026-05-25
1035Italy2026-05-16
1036Canada2026-05-26
1037Australia2026-06-03
1038Russia2026-05-23
1039Italy2026-05-16
1040India2026-05-28
1041Argentina2026-05-17
1042Canada2026-05-12
1043India2026-05-30
1044France2026-05-28
1045France2026-06-02
1046Japan2026-05-18
1047United Kingdom2026-05-14
1048India2026-05-10
1049India2026-06-04

On-Demand Data

NameIdCountryDate
Jones Vocelka1000Australia2026-05-31
Ricardo Gaucho1001Canada2026-05-09
Maria Marrier1002Spain2026-05-07
Aika Inouye1003Argentina2026-05-17
Salvatore Stockham1004Spain2026-05-18
Jeanfrancois Venere1005Australia2026-05-12
Aditya Kusko1006Germany2026-05-09
Ashley Doe1007Canada2026-05-11
Jones Vocelka1008Japan2026-05-31
Cody Saylors1009Japan2026-05-22
Munro Ferencz1010Germany2026-05-07
Maria Marrier1011Russia2026-05-22
Clifford Rim1012France2026-05-24
Munro Ferencz1013France2026-06-01
Tony Foller1014Argentina2026-05-12
Juan Wieser1015Brazil2026-05-08
Mayumi Kolmetz1016France2026-05-08
Arvin Albares1017Spain2026-05-10
Mujtaba Nicka1018Japan2026-05-09
Kadeem Flosi1019Australia2026-06-02
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Sinclair WaycottJapanAnna Fali NEW
David DarakjyGermanyStephen Shaw RENEWAL
Jones VocelkaSpainElwin Sharvill PROPOSAL
Octavia MaletRussiaXuxue Feng PROPOSAL
Chavez BriddickJapanXuxue Feng RENEWAL
Kadeem FlosiGermanyIoni Bowcher QUALIFIED
Cody SaylorsAustraliaBernardo Dominic UNQUALIFIED
Clifford RimRussiaXuxue Feng UNQUALIFIED
Aditya KuskoJapanAsiya Javayant RENEWAL
Leja CaldareraUnited KingdomStephen Shaw NEGOTIATION
Claire TollnerFranceAsiya Javayant QUALIFIED
Arvin AlbaresCanadaStephen Shaw RENEWAL
Ricardo GauchoRussiaIoni Bowcher QUALIFIED
Antonio CaudyFranceStephen Shaw PROPOSAL
Ashley DoeAustraliaAnna Fali QUALIFIED
Izzy GarufiCanadaAnna Fali NEW
Leja CaldareraItalyOnyama Limba NEW
Tony FollerRussiaAsiya Javayant RENEWAL
Aruna FigeroaArgentinaBernardo Dominic QUALIFIED
Alejandro PerinRussiaBernardo Dominic UNQUALIFIED
Cody SaylorsAustraliaBernardo Dominic PROPOSAL
Greenwood BologniaUnited KingdomStephen Shaw NEW
Murillo MaletJapanXuxue Feng QUALIFIED
Stacey MacleadIndiaElwin Sharvill UNQUALIFIED
Faith GillianJapanIoni Bowcher UNQUALIFIED
Jefferson SchemmerSpainAmy Elsner NEGOTIATION
Isabel BowleyCanadaIvan Magalhaes QUALIFIED
Stacey MacleadUnited KingdomAmy Elsner QUALIFIED
Misaki RoysterUnited KingdomAnna Fali RENEWAL
Faith GillianGermanyElwin Sharvill NEGOTIATION
Arvin AlbaresRussiaXuxue Feng NEW
Jefferson SchemmerJapanAmy Elsner RENEWAL
Nicolas IturbideItalyElwin Sharvill NEGOTIATION
Aika InouyeCanadaAsiya Javayant NEGOTIATION
Rodrigues CampainUnited KingdomXuxue Feng NEW
Ricardo GauchoRussiaElwin Sharvill QUALIFIED
Isabel BowleyUnited KingdomIvan Magalhaes RENEWAL
Salvatore StockhamSpainIvan Magalhaes QUALIFIED
Johnson SergiIndiaStephen Shaw NEGOTIATION
Salvatore StockhamCanadaIoni Bowcher 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>