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
Nicolas IturbideBrazilXuxue Feng QUALIFIED
Costa DilliardFranceXuxue Feng UNQUALIFIED
Emily WhobreyGermanyAnna Fali NEW
Faith GillianItalyStephen Shaw UNQUALIFIED
Salvatore StockhamGermanyAnna Fali UNQUALIFIED
Murillo MaletJapanAsiya Javayant NEW
Maria MarrierIndiaStephen Shaw QUALIFIED
Emily WhobreyAustraliaXuxue Feng NEGOTIATION
Mayumi KolmetzAustraliaAnna Fali NEGOTIATION
Johnson SergiArgentinaAmy Elsner RENEWAL
Leon OldroydJapanElwin Sharvill UNQUALIFIED
Munro FerenczRussiaElwin Sharvill NEW
Jones VocelkaArgentinaIvan Magalhaes NEW
Smith GlickSpainIoni Bowcher PROPOSAL
Morrow RutaRussiaOnyama Limba QUALIFIED
Smith GlickSpainBernardo Dominic UNQUALIFIED
Morrow RutaBrazilStephen Shaw RENEWAL
Sinclair WaycottArgentinaXuxue Feng NEW
Kadeem FlosiRussiaIvan Magalhaes PROPOSAL
Kaitlin OstroskyUnited KingdomBernardo Dominic UNQUALIFIED
Faith GillianItalyAsiya Javayant RENEWAL
Cody SaylorsJapanBernardo Dominic RENEWAL
Clifford RimSpainBernardo Dominic NEGOTIATION
Alejandro PerinGermanyBernardo Dominic NEW
Mayumi KolmetzSpainStephen Shaw QUALIFIED
Julie StensethFranceAnna Fali UNQUALIFIED
Sinclair WaycottBrazilOnyama Limba NEGOTIATION
Costa DilliardAustraliaBernardo Dominic PROPOSAL
Aika InouyeIndiaAnna Fali UNQUALIFIED
Munro FerenczAustraliaAmy Elsner PROPOSAL
Rodrigues CampainGermanyAmy Elsner QUALIFIED
Julie StensethFranceBernardo Dominic QUALIFIED
Ivar PaprockiGermanyElwin Sharvill QUALIFIED
Nicolas IturbideArgentinaAnna Fali QUALIFIED
Leon OldroydBrazilIvan Magalhaes UNQUALIFIED
Costa DilliardCanadaAmy Elsner RENEWAL
Alejandro PerinJapanIoni Bowcher NEGOTIATION
Isabel BowleyRussiaAsiya Javayant UNQUALIFIED
Kadeem FlosiJapanXuxue Feng NEGOTIATION
Faith GillianItalyIoni Bowcher NEGOTIATION
Julie StensethRussiaAmy Elsner UNQUALIFIED
Stacey MacleadFranceAmy Elsner NEW
Morrow RutaIndiaElwin Sharvill NEW
Wickens NestleItalyIoni Bowcher NEW
Darci PoquetteFranceIvan Magalhaes NEW
Isabel BowleySpainElwin Sharvill NEGOTIATION
Deepesh ChuiBrazilOnyama Limba NEGOTIATION
Cody SaylorsSpainBernardo Dominic PROPOSAL
Jefferson SchemmerUnited KingdomStephen Shaw NEGOTIATION
Chavez BriddickJapanStephen Shaw RENEWAL
Horizontal
NameCountryRepresentativeStatus
Maisha RulapaughAustraliaOnyama Limba NEW
Darci PoquetteGermanyAnna Fali UNQUALIFIED
Chavez BriddickUnited KingdomStephen Shaw UNQUALIFIED
Deepesh ChuiFranceIoni Bowcher QUALIFIED
Greenwood BologniaIndiaIvan Magalhaes NEW
David DarakjySpainElwin Sharvill NEGOTIATION
Johnson SergiIndiaElwin Sharvill NEGOTIATION
Jefferson SchemmerJapanBernardo Dominic RENEWAL
Faith GillianSpainAmy Elsner UNQUALIFIED
Murillo MaletRussiaBernardo Dominic NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Deepesh ChuiItaly2025-09-29Chemel, James L Cpa UNQUALIFIED60Amy Elsner
1001Ashley DoeAustralia2025-09-22Commercial Press QUALIFIED73Ivan Magalhaes
1002Aika InouyeGermany2025-09-08Feltz Printing Service NEGOTIATION6Anna Fali
1003Clifford RimItaly2025-09-15Rangoni Of Florence UNQUALIFIED56Anna Fali
1004Juan WieserGermany2025-09-28Rangoni Of Florence UNQUALIFIED86Ivan Magalhaes
1005Kaitlin OstroskyUnited Kingdom2025-09-16Buckley Miller Wright NEGOTIATION32Bernardo Dominic
1006Silvio SlusarskiBrazil2025-09-24King, Christopher A Esq PROPOSAL26Onyama Limba
1007Isabel BowleyAustralia2025-09-08Rangoni Of Florence PROPOSAL77Anna Fali
1008Sinclair WaycottFrance2025-09-29Commercial Press NEGOTIATION18Xuxue Feng
1009Murillo MaletGermany2025-09-26King, Christopher A Esq QUALIFIED16Bernardo Dominic
1010Deepesh ChuiBrazil2025-09-06Chemel, James L Cpa NEGOTIATION59Asiya Javayant
1011Mujtaba NickaJapan2025-09-13Benton, John B Jr QUALIFIED44Onyama Limba
1012Darci PoquetteArgentina2025-09-09Benton, John B Jr RENEWAL89Asiya Javayant
1013Maria MarrierUnited Kingdom2025-09-16Chapman, Ross E Esq RENEWAL88Asiya Javayant
1014Costa DilliardFrance2025-09-19Rangoni Of Florence NEGOTIATION89Amy Elsner
1015Leon OldroydUnited Kingdom2025-09-15Dorl, James J Esq RENEWAL41Xuxue Feng
1016Rodrigues CampainArgentina2025-09-18Printing Dimensions NEGOTIATION10Anna Fali
1017Ricardo GauchoSpain2025-09-27Feiner Bros PROPOSAL70Elwin Sharvill
1018Kaitlin OstroskyUnited Kingdom2025-09-15Chapman, Ross E Esq NEGOTIATION44Stephen Shaw
1019Stacey MacleadBrazil2025-09-26Feiner Bros UNQUALIFIED2Ivan Magalhaes
1020Jeanfrancois VenereFrance2025-09-26Chemel, James L Cpa UNQUALIFIED51Ivan Magalhaes
1021Jeanfrancois VenereIndia2025-09-05Benton, John B Jr NEW32Ioni Bowcher
1022Cody SaylorsIndia2025-09-17Chapman, Ross E Esq RENEWAL29Onyama Limba
1023Emily WhobreyJapan2025-09-09Buckley Miller Wright QUALIFIED8Ivan Magalhaes
1024Alejandro PerinCanada2025-09-07Rousseaux, Michael Esq RENEWAL94Asiya Javayant
1025David DarakjyJapan2025-09-25King, Christopher A Esq NEW12Amy Elsner
1026Cody SaylorsGermany2025-09-06Benton, John B Jr PROPOSAL95Ivan Magalhaes
1027Juan WieserGermany2025-09-09Chanay, Jeffrey A Esq UNQUALIFIED43Anna Fali
1028Murillo MaletIndia2025-09-25Feiner Bros RENEWAL40Anna Fali
1029Smith GlickJapan2025-09-03Commercial Press UNQUALIFIED65Elwin Sharvill
1030Adams MorascaGermany2025-09-17Morlong Associates NEW61Elwin Sharvill
1031Francesco ShinkoSpain2025-09-17Buckley Miller Wright UNQUALIFIED14Stephen Shaw
1032Deepesh ChuiCanada2025-09-13Dorl, James J Esq NEW71Elwin Sharvill
1033Maria MarrierFrance2025-09-12Rousseaux, Michael Esq RENEWAL45Bernardo Dominic
1034Leja CaldareraFrance2025-09-29Morlong Associates PROPOSAL62Anna Fali
1035Arvin AlbaresIndia2025-09-04Feltz Printing Service PROPOSAL4Ivan Magalhaes
1036Darci PoquetteArgentina2025-09-21Feiner Bros NEGOTIATION44Amy Elsner
1037Ricardo GauchoArgentina2025-09-22Buckley Miller Wright PROPOSAL93Ivan Magalhaes
1038Johnson SergiItaly2025-09-01Commercial Press NEGOTIATION97Anna Fali
1039Ashley DoeIndia2025-08-31Chanay, Jeffrey A Esq UNQUALIFIED10Stephen Shaw
1040Morrow RutaRussia2025-09-17Morlong Associates NEW81Ioni Bowcher
1041Clifford RimIndia2025-08-31Feltz Printing Service PROPOSAL20Ioni Bowcher
1042Kaitlin OstroskyItaly2025-09-18Chapman, Ross E Esq UNQUALIFIED2Stephen Shaw
1043Jeanfrancois VenereJapan2025-09-22Printing Dimensions PROPOSAL44Onyama Limba
1044Murillo MaletGermany2025-09-19Feiner Bros NEW7Ivan Magalhaes
1045Kadeem FlosiIndia2025-09-07Feltz Printing Service RENEWAL9Anna Fali
1046Emily WhobreyBrazil2025-09-11Chanay, Jeffrey A Esq QUALIFIED40Stephen Shaw
1047Jennifer AmigonGermany2025-09-23Printing Dimensions QUALIFIED64Asiya Javayant
1048Julie StensethIndia2025-09-10Feiner Bros RENEWAL24Xuxue Feng
1049Emily WhobreyItaly2025-09-14Rousseaux, Michael Esq UNQUALIFIED84Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Jennifer AmigonRussiaIvan Magalhaes UNQUALIFIED
Aditya KuskoAustraliaBernardo Dominic UNQUALIFIED
Cody SaylorsAustraliaIvan Magalhaes NEW
Ashley DoeItalyIvan Magalhaes QUALIFIED
James ButtCanadaElwin Sharvill RENEWAL
Juan WieserAustraliaAsiya Javayant UNQUALIFIED
Leon OldroydRussiaAmy Elsner UNQUALIFIED
Kadeem FlosiGermanyXuxue Feng RENEWAL
Darci PoquetteAustraliaBernardo Dominic PROPOSAL
Clifford RimIndiaIoni Bowcher NEGOTIATION
Octavia MaletGermanyOnyama Limba NEW
Adams MorascaAustraliaAsiya Javayant QUALIFIED
Sinclair WaycottRussiaAmy Elsner PROPOSAL
Tony FollerSpainAmy Elsner NEGOTIATION
Rodrigues CampainArgentinaAsiya Javayant UNQUALIFIED
Maria MarrierBrazilAmy Elsner UNQUALIFIED
Greenwood BologniaBrazilAnna Fali NEW
Jones VocelkaRussiaIvan Magalhaes QUALIFIED
James ButtSpainAmy Elsner RENEWAL
Leon OldroydUnited KingdomAsiya Javayant PROPOSAL
Aruna FigeroaArgentinaAmy Elsner QUALIFIED
Darci PoquetteGermanyIoni Bowcher RENEWAL
Murillo MaletBrazilOnyama Limba UNQUALIFIED
David DarakjyAustraliaIvan Magalhaes QUALIFIED
Ivar PaprockiCanadaStephen Shaw NEGOTIATION
Smith GlickGermanyAsiya Javayant RENEWAL
Faith GillianJapanAsiya Javayant RENEWAL
Deepesh ChuiRussiaXuxue Feng UNQUALIFIED
Jones VocelkaGermanyElwin Sharvill NEGOTIATION
Ricardo GauchoArgentinaAmy Elsner UNQUALIFIED
Costa DilliardUnited KingdomXuxue Feng PROPOSAL
Maisha RulapaughBrazilIvan Magalhaes QUALIFIED
Darci PoquetteGermanyIoni Bowcher NEW
Aika InouyeGermanyStephen Shaw RENEWAL
Johnson SergiAustraliaElwin Sharvill RENEWAL
Deepesh ChuiRussiaStephen Shaw RENEWAL
Silvio SlusarskiFranceAmy Elsner UNQUALIFIED
Munro FerenczBrazilAsiya Javayant PROPOSAL
Greenwood BologniaJapanIoni Bowcher UNQUALIFIED
Clifford RimCanadaIvan Magalhaes QUALIFIED
Juan WieserCanadaIvan Magalhaes NEGOTIATION
Greenwood BologniaArgentinaStephen Shaw RENEWAL
Arvin AlbaresBrazilAmy Elsner PROPOSAL
Morrow RutaGermanyIoni Bowcher UNQUALIFIED
Antonio CaudyAustraliaStephen Shaw RENEWAL
Clifford RimSpainElwin Sharvill PROPOSAL
Mayumi KolmetzSpainIvan Magalhaes UNQUALIFIED
Octavia MaletCanadaAsiya Javayant RENEWAL
Jefferson SchemmerIndiaElwin Sharvill UNQUALIFIED
Aika InouyeGermanyIoni Bowcher NEGOTIATION
Frozen Columns
Name
Nicolas Iturbide
Maisha Rulapaugh
Ricardo Gaucho
Adams Morasca
Leja Caldarera
Ricardo Gaucho
Adams Morasca
Jefferson Schemmer
Arvin Albares
Morrow Ruta
Greenwood Bolognia
Mujtaba Nicka
Nicolas Iturbide
Salvatore Stockham
Emily Whobrey
Greenwood Bolognia
Deepesh Chui
Misaki Royster
Adams Morasca
Jeanfrancois Venere
Clifford Rim
Morrow Ruta
Izzy Garufi
James Butt
Francesco Shinko
Kadeem Flosi
Alejandro Perin
Adams Morasca
Ricardo Gaucho
Sinclair Waycott
Deepesh Chui
Kaitlin Ostrosky
Nicolas Iturbide
James Butt
Johnson Sergi
Murillo Malet
Chavez Briddick
Octavia Malet
Cody Saylors
Arvin Albares
Alejandro Perin
Mayumi Kolmetz
Ashley Doe
Claire Tollner
Antonio Caudy
Jones Vocelka
Arvin Albares
Murillo Malet
Darci Poquette
Darci Poquette
IdCountryDate
1000India2025-09-01
1001Argentina2025-09-15
1002France2025-09-27
1003Italy2025-09-13
1004Italy2025-09-06
1005India2025-09-14
1006Japan2025-09-23
1007Germany2025-09-25
1008France2025-09-07
1009Germany2025-09-07
1010United Kingdom2025-09-19
1011Russia2025-09-28
1012Spain2025-09-13
1013Canada2025-09-07
1014United Kingdom2025-09-13
1015Japan2025-09-24
1016Germany2025-09-07
1017Germany2025-09-25
1018Japan2025-09-07
1019Japan2025-09-20
1020Germany2025-09-24
1021Germany2025-09-10
1022Spain2025-09-25
1023Argentina2025-09-18
1024Australia2025-09-18
1025United Kingdom2025-09-16
1026United Kingdom2025-09-19
1027Canada2025-09-05
1028Russia2025-09-13
1029Italy2025-09-09
1030India2025-09-16
1031Australia2025-09-08
1032United Kingdom2025-09-18
1033Argentina2025-09-11
1034Argentina2025-09-19
1035Brazil2025-09-20
1036Argentina2025-09-20
1037Argentina2025-09-02
1038Italy2025-09-27
1039Germany2025-09-27
1040Argentina2025-09-20
1041Italy2025-09-17
1042United Kingdom2025-09-24
1043France2025-09-22
1044Brazil2025-09-25
1045United Kingdom2025-09-09
1046Australia2025-09-22
1047Brazil2025-09-04
1048Italy2025-09-13
1049France2025-09-14

On-Demand Data

NameIdCountryDate
Mayumi Kolmetz1000Australia2025-09-06
Sinclair Waycott1001Italy2025-09-19
Chavez Briddick1002Argentina2025-09-04
Arvin Albares1003Germany2025-09-23
Isabel Bowley1004Australia2025-08-31
Cody Saylors1005Japan2025-09-17
Munro Ferencz1006Argentina2025-09-03
Antonio Caudy1007Russia2025-09-08
David Darakjy1008Argentina2025-09-12
James Butt1009Russia2025-09-22
Juan Wieser1010Australia2025-09-06
Cody Saylors1011France2025-09-04
Deepesh Chui1012Argentina2025-09-09
Mayumi Kolmetz1013Canada2025-09-29
Johnson Sergi1014Italy2025-09-17
Misaki Royster1015Japan2025-09-20
Isabel Bowley1016Argentina2025-09-02
Silvio Slusarski1017Russia2025-09-15
Tony Foller1018Canada2025-09-17
Stacey Maclead1019Argentina2025-09-12
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Sinclair WaycottUnited KingdomOnyama Limba UNQUALIFIED
Silvio SlusarskiJapanAsiya Javayant NEGOTIATION
Costa DilliardItalyAsiya Javayant RENEWAL
Antonio CaudyArgentinaAnna Fali UNQUALIFIED
David DarakjyRussiaAmy Elsner NEGOTIATION
Claire TollnerCanadaIvan Magalhaes NEW
Francesco ShinkoAustraliaIoni Bowcher RENEWAL
Maisha RulapaughRussiaAsiya Javayant NEGOTIATION
Cody SaylorsBrazilAsiya Javayant NEGOTIATION
Adams MorascaAustraliaOnyama Limba UNQUALIFIED
Ashley DoeArgentinaIoni Bowcher UNQUALIFIED
Mujtaba NickaAustraliaAsiya Javayant PROPOSAL
Jennifer AmigonAustraliaAmy Elsner UNQUALIFIED
Isabel BowleyUnited KingdomXuxue Feng NEGOTIATION
Julie StensethItalyXuxue Feng PROPOSAL
Jones VocelkaAustraliaIvan Magalhaes RENEWAL
David DarakjyIndiaAnna Fali UNQUALIFIED
Izzy GarufiAustraliaOnyama Limba RENEWAL
Deepesh ChuiFranceOnyama Limba RENEWAL
Clifford RimArgentinaOnyama Limba QUALIFIED
Mujtaba NickaJapanAnna Fali UNQUALIFIED
Ashley DoeGermanyAsiya Javayant NEW
Aditya KuskoItalyOnyama Limba UNQUALIFIED
Jefferson SchemmerGermanyAsiya Javayant UNQUALIFIED
Alejandro PerinUnited KingdomIvan Magalhaes NEGOTIATION
Clifford RimArgentinaElwin Sharvill PROPOSAL
Claire TollnerJapanStephen Shaw QUALIFIED
Costa DilliardBrazilAnna Fali RENEWAL
Leon OldroydBrazilAnna Fali RENEWAL
Jeanfrancois VenereSpainAmy Elsner QUALIFIED
Maisha RulapaughIndiaAnna Fali UNQUALIFIED
Nicolas IturbideUnited KingdomAmy Elsner PROPOSAL
Leon OldroydItalyOnyama Limba NEW
Kaitlin OstroskyCanadaStephen Shaw QUALIFIED
Smith GlickItalyAnna Fali NEGOTIATION
Chavez BriddickSpainAmy Elsner QUALIFIED
Adams MorascaUnited KingdomOnyama Limba RENEWAL
Jennifer AmigonBrazilXuxue Feng NEGOTIATION
Sinclair WaycottFranceAnna Fali UNQUALIFIED
Izzy GarufiRussiaStephen Shaw 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>