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
Clifford RimArgentinaOnyama Limba PROPOSAL
Leja CaldareraRussiaStephen Shaw NEW
Aditya KuskoCanadaAmy Elsner NEGOTIATION
Cody SaylorsItalyXuxue Feng NEW
Jennifer AmigonJapanOnyama Limba RENEWAL
Darci PoquetteArgentinaAmy Elsner NEW
Nicolas IturbideUnited KingdomBernardo Dominic NEW
Izzy GarufiRussiaBernardo Dominic NEGOTIATION
Faith GillianBrazilIvan Magalhaes UNQUALIFIED
Deepesh ChuiItalyOnyama Limba PROPOSAL
Aika InouyeRussiaStephen Shaw NEGOTIATION
Jennifer AmigonUnited KingdomAsiya Javayant UNQUALIFIED
Mayumi KolmetzAustraliaElwin Sharvill UNQUALIFIED
Maria MarrierCanadaOnyama Limba QUALIFIED
Jeanfrancois VenereRussiaIvan Magalhaes QUALIFIED
Sinclair WaycottBrazilIvan Magalhaes QUALIFIED
David DarakjyAustraliaStephen Shaw PROPOSAL
Cody SaylorsUnited KingdomIvan Magalhaes QUALIFIED
Juan WieserCanadaOnyama Limba NEGOTIATION
Octavia MaletItalyIvan Magalhaes RENEWAL
Ashley DoeFranceOnyama Limba NEW
Alejandro PerinItalyAmy Elsner QUALIFIED
Mujtaba NickaArgentinaAmy Elsner RENEWAL
Jeanfrancois VenereRussiaAsiya Javayant QUALIFIED
Wickens NestleFranceStephen Shaw NEGOTIATION
Aika InouyeIndiaIoni Bowcher PROPOSAL
Deepesh ChuiArgentinaOnyama Limba PROPOSAL
Alejandro PerinBrazilElwin Sharvill NEGOTIATION
Salvatore StockhamIndiaAmy Elsner NEW
Ricardo GauchoGermanyIoni Bowcher NEW
James ButtSpainIvan Magalhaes RENEWAL
Wickens NestleFranceBernardo Dominic UNQUALIFIED
Julie StensethCanadaOnyama Limba QUALIFIED
Claire TollnerAustraliaAsiya Javayant RENEWAL
Francesco ShinkoIndiaStephen Shaw PROPOSAL
Isabel BowleyItalyAsiya Javayant QUALIFIED
Jefferson SchemmerFranceElwin Sharvill QUALIFIED
Smith GlickUnited KingdomXuxue Feng RENEWAL
Munro FerenczRussiaOnyama Limba QUALIFIED
Claire TollnerSpainOnyama Limba NEGOTIATION
Jennifer AmigonRussiaOnyama Limba RENEWAL
Alejandro PerinFranceOnyama Limba QUALIFIED
Kaitlin OstroskyJapanIvan Magalhaes NEW
Mujtaba NickaGermanyXuxue Feng NEW
Rodrigues CampainBrazilStephen Shaw QUALIFIED
Mujtaba NickaCanadaXuxue Feng UNQUALIFIED
Jennifer AmigonItalyElwin Sharvill QUALIFIED
Izzy GarufiIndiaXuxue Feng QUALIFIED
Kadeem FlosiIndiaElwin Sharvill NEW
Aruna FigeroaFranceAnna Fali UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
David DarakjyGermanyAsiya Javayant PROPOSAL
Sinclair WaycottCanadaIvan Magalhaes PROPOSAL
Antonio CaudyAustraliaIoni Bowcher QUALIFIED
Faith GillianItalyAnna Fali NEGOTIATION
Izzy GarufiItalyIvan Magalhaes NEW
Jones VocelkaAustraliaBernardo Dominic QUALIFIED
Ricardo GauchoArgentinaIvan Magalhaes NEW
Aika InouyeRussiaOnyama Limba RENEWAL
Faith GillianArgentinaAnna Fali RENEWAL
Ricardo GauchoCanadaAmy Elsner NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Silvio SlusarskiItaly2026-05-29Feiner Bros NEW50Anna Fali
1001Clifford RimCanada2026-05-24Chapman, Ross E Esq UNQUALIFIED46Xuxue Feng
1002Mayumi KolmetzCanada2026-05-09Chemel, James L Cpa UNQUALIFIED65Elwin Sharvill
1003Sinclair WaycottCanada2026-05-24Dorl, James J Esq PROPOSAL56Anna Fali
1004Antonio CaudyIndia2026-05-17Benton, John B Jr NEGOTIATION92Stephen Shaw
1005Emily WhobreySpain2026-05-27Chanay, Jeffrey A Esq NEGOTIATION68Amy Elsner
1006Mayumi KolmetzFrance2026-05-28Dorl, James J Esq PROPOSAL62Asiya Javayant
1007Ricardo GauchoFrance2026-05-24Benton, John B Jr PROPOSAL48Xuxue Feng
1008Ivar PaprockiUnited Kingdom2026-05-25Benton, John B Jr PROPOSAL2Elwin Sharvill
1009Darci PoquetteCanada2026-05-31Rousseaux, Michael Esq QUALIFIED10Anna Fali
1010Leja CaldareraIndia2026-05-28Rousseaux, Michael Esq PROPOSAL1Amy Elsner
1011Cody SaylorsJapan2026-05-18Chapman, Ross E Esq RENEWAL61Ioni Bowcher
1012Silvio SlusarskiAustralia2026-05-20Truhlar And Truhlar Attys QUALIFIED80Bernardo Dominic
1013Cody SaylorsJapan2026-05-21Chapman, Ross E Esq PROPOSAL70Xuxue Feng
1014Mayumi KolmetzAustralia2026-05-11Buckley Miller Wright NEW51Xuxue Feng
1015Maisha RulapaughSpain2026-05-15King, Christopher A Esq PROPOSAL94Onyama Limba
1016Faith GillianArgentina2026-05-15Feltz Printing Service RENEWAL21Xuxue Feng
1017Stacey MacleadCanada2026-05-16Rousseaux, Michael Esq NEW95Ioni Bowcher
1018Deepesh ChuiFrance2026-05-11Feiner Bros NEGOTIATION95Amy Elsner
1019Nicolas IturbideBrazil2026-05-10Truhlar And Truhlar Attys PROPOSAL97Bernardo Dominic
1020Francesco ShinkoRussia2026-05-24Chapman, Ross E Esq UNQUALIFIED25Onyama Limba
1021Greenwood BologniaBrazil2026-05-28Rangoni Of Florence QUALIFIED86Ioni Bowcher
1022Johnson SergiCanada2026-05-30Chanay, Jeffrey A Esq RENEWAL2Anna Fali
1023Deepesh ChuiAustralia2026-05-13Commercial Press NEW10Ioni Bowcher
1024Ivar PaprockiJapan2026-05-29King, Christopher A Esq UNQUALIFIED81Onyama Limba
1025Isabel BowleyJapan2026-05-27Printing Dimensions QUALIFIED91Stephen Shaw
1026Arvin AlbaresBrazil2026-05-19Buckley Miller Wright UNQUALIFIED66Stephen Shaw
1027Costa DilliardRussia2026-06-03Rangoni Of Florence PROPOSAL99Ivan Magalhaes
1028Murillo MaletBrazil2026-05-26Rousseaux, Michael Esq PROPOSAL7Ivan Magalhaes
1029Ivar PaprockiArgentina2026-05-17Truhlar And Truhlar Attys UNQUALIFIED21Anna Fali
1030Silvio SlusarskiIndia2026-05-26Printing Dimensions RENEWAL84Ivan Magalhaes
1031Jefferson SchemmerUnited Kingdom2026-05-07Dorl, James J Esq RENEWAL26Ivan Magalhaes
1032Darci PoquetteAustralia2026-05-17Benton, John B Jr UNQUALIFIED69Ioni Bowcher
1033Kaitlin OstroskyCanada2026-05-05Morlong Associates NEW97Xuxue Feng
1034Wickens NestleBrazil2026-05-08Morlong Associates UNQUALIFIED9Bernardo Dominic
1035Wickens NestleUnited Kingdom2026-05-21Benton, John B Jr RENEWAL44Stephen Shaw
1036Smith GlickSpain2026-05-24Chemel, James L Cpa NEGOTIATION40Bernardo Dominic
1037Jones VocelkaJapan2026-05-30Chapman, Ross E Esq PROPOSAL61Xuxue Feng
1038Munro FerenczCanada2026-05-07Rangoni Of Florence UNQUALIFIED33Onyama Limba
1039Jefferson SchemmerAustralia2026-05-23Chanay, Jeffrey A Esq UNQUALIFIED30Stephen Shaw
1040Claire TollnerBrazil2026-05-06Benton, John B Jr RENEWAL95Xuxue Feng
1041Smith GlickSpain2026-05-26Benton, John B Jr NEGOTIATION38Onyama Limba
1042Izzy GarufiSpain2026-06-03Feltz Printing Service NEW46Ioni Bowcher
1043Emily WhobreyBrazil2026-05-31Chemel, James L Cpa QUALIFIED57Stephen Shaw
1044Leja CaldareraUnited Kingdom2026-05-08Rousseaux, Michael Esq RENEWAL3Stephen Shaw
1045Jeanfrancois VenereGermany2026-05-28Rousseaux, Michael Esq RENEWAL99Ioni Bowcher
1046Juan WieserFrance2026-05-17Feltz Printing Service NEGOTIATION50Asiya Javayant
1047Isabel BowleyAustralia2026-05-16Truhlar And Truhlar Attys UNQUALIFIED0Stephen Shaw
1048Arvin AlbaresAustralia2026-05-15Morlong Associates NEW91Onyama Limba
1049Sinclair WaycottAustralia2026-05-31Truhlar And Truhlar Attys PROPOSAL72Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Jennifer AmigonUnited KingdomIvan Magalhaes NEW
Nicolas IturbideArgentinaIvan Magalhaes PROPOSAL
Greenwood BologniaItalyElwin Sharvill QUALIFIED
Greenwood BologniaFranceOnyama Limba PROPOSAL
Ashley DoeArgentinaElwin Sharvill PROPOSAL
Greenwood BologniaFranceXuxue Feng QUALIFIED
James ButtUnited KingdomXuxue Feng RENEWAL
Aditya KuskoItalyAsiya Javayant QUALIFIED
Jennifer AmigonGermanyXuxue Feng RENEWAL
Maria MarrierAustraliaBernardo Dominic UNQUALIFIED
Salvatore StockhamIndiaXuxue Feng UNQUALIFIED
Rodrigues CampainUnited KingdomXuxue Feng PROPOSAL
Salvatore StockhamUnited KingdomAsiya Javayant RENEWAL
Jennifer AmigonUnited KingdomXuxue Feng NEGOTIATION
Ricardo GauchoUnited KingdomIvan Magalhaes NEW
Chavez BriddickGermanyIvan Magalhaes NEW
James ButtJapanAnna Fali NEGOTIATION
Leon OldroydFranceOnyama Limba NEW
Emily WhobreyBrazilAsiya Javayant UNQUALIFIED
Jeanfrancois VenereIndiaBernardo Dominic NEW
Cody SaylorsGermanyBernardo Dominic NEW
Mayumi KolmetzJapanElwin Sharvill QUALIFIED
Murillo MaletFranceAmy Elsner PROPOSAL
Nicolas IturbideFranceStephen Shaw PROPOSAL
Isabel BowleyBrazilElwin Sharvill NEGOTIATION
Mayumi KolmetzSpainStephen Shaw RENEWAL
Kaitlin OstroskySpainBernardo Dominic RENEWAL
Jefferson SchemmerAustraliaBernardo Dominic NEGOTIATION
Smith GlickGermanyBernardo Dominic NEGOTIATION
Emily WhobreyItalyStephen Shaw PROPOSAL
Octavia MaletFranceAmy Elsner PROPOSAL
Nicolas IturbideCanadaXuxue Feng NEGOTIATION
Smith GlickFranceBernardo Dominic UNQUALIFIED
Julie StensethIndiaAsiya Javayant QUALIFIED
Mujtaba NickaJapanAnna Fali QUALIFIED
Claire TollnerFranceElwin Sharvill NEGOTIATION
Clifford RimJapanIvan Magalhaes RENEWAL
Jefferson SchemmerUnited KingdomBernardo Dominic UNQUALIFIED
Wickens NestleArgentinaIoni Bowcher NEGOTIATION
James ButtCanadaAnna Fali RENEWAL
Francesco ShinkoBrazilElwin Sharvill QUALIFIED
Isabel BowleyIndiaElwin Sharvill PROPOSAL
Cody SaylorsRussiaIvan Magalhaes RENEWAL
Maisha RulapaughItalyIvan Magalhaes NEGOTIATION
Salvatore StockhamBrazilIoni Bowcher UNQUALIFIED
Maisha RulapaughAustraliaIvan Magalhaes RENEWAL
Stacey MacleadSpainStephen Shaw RENEWAL
Sinclair WaycottUnited KingdomIvan Magalhaes NEW
Munro FerenczCanadaAsiya Javayant UNQUALIFIED
Claire TollnerGermanyIoni Bowcher UNQUALIFIED
Frozen Columns
Name
Kaitlin Ostrosky
Deepesh Chui
Kadeem Flosi
Rodrigues Campain
Mujtaba Nicka
Deepesh Chui
Ricardo Gaucho
Juan Wieser
Smith Glick
Sinclair Waycott
Faith Gillian
Nicolas Iturbide
Isabel Bowley
Maria Marrier
Murillo Malet
Silvio Slusarski
Deepesh Chui
Juan Wieser
Aruna Figeroa
Tony Foller
Mujtaba Nicka
Chavez Briddick
Sinclair Waycott
Costa Dilliard
Leon Oldroyd
Ricardo Gaucho
Greenwood Bolognia
Darci Poquette
Alejandro Perin
Jeanfrancois Venere
Kaitlin Ostrosky
Costa Dilliard
Tony Foller
Mujtaba Nicka
Greenwood Bolognia
Tony Foller
Mayumi Kolmetz
Leon Oldroyd
James Butt
Antonio Caudy
Julie Stenseth
Octavia Malet
Francesco Shinko
Arvin Albares
Misaki Royster
Mayumi Kolmetz
Wickens Nestle
Johnson Sergi
Cody Saylors
Maisha Rulapaugh
IdCountryDate
1000Russia2026-05-26
1001Spain2026-05-18
1002Argentina2026-05-22
1003Russia2026-05-16
1004United Kingdom2026-05-23
1005Italy2026-05-31
1006Germany2026-05-16
1007Germany2026-05-24
1008Australia2026-05-20
1009Japan2026-05-22
1010United Kingdom2026-05-24
1011India2026-05-10
1012Italy2026-05-28
1013Germany2026-05-23
1014Italy2026-05-19
1015Spain2026-05-08
1016Spain2026-05-18
1017Argentina2026-05-19
1018Canada2026-05-14
1019Canada2026-06-01
1020Italy2026-05-09
1021Brazil2026-05-05
1022Russia2026-05-27
1023Germany2026-05-10
1024Australia2026-05-22
1025Argentina2026-05-06
1026Russia2026-05-19
1027Brazil2026-05-25
1028Spain2026-05-05
1029Brazil2026-06-01
1030India2026-05-13
1031Japan2026-05-20
1032Australia2026-05-28
1033Italy2026-05-28
1034India2026-05-28
1035Australia2026-05-15
1036Russia2026-05-11
1037Canada2026-05-29
1038Brazil2026-05-05
1039Spain2026-05-22
1040Italy2026-06-02
1041United Kingdom2026-05-26
1042Australia2026-05-24
1043Italy2026-05-29
1044Canada2026-05-24
1045Japan2026-05-18
1046Germany2026-05-07
1047Canada2026-05-20
1048France2026-05-11
1049India2026-05-15

On-Demand Data

NameIdCountryDate
Salvatore Stockham1000Argentina2026-05-18
James Butt1001Germany2026-06-03
Leja Caldarera1002India2026-05-09
James Butt1003Japan2026-05-19
Isabel Bowley1004United Kingdom2026-05-13
Maisha Rulapaugh1005Italy2026-05-24
Salvatore Stockham1006Canada2026-05-16
Francesco Shinko1007Germany2026-05-16
Chavez Briddick1008Italy2026-06-01
Leon Oldroyd1009Italy2026-05-22
Leja Caldarera1010France2026-05-20
Wickens Nestle1011Brazil2026-05-09
Nicolas Iturbide1012Japan2026-05-07
Costa Dilliard1013Japan2026-05-19
Maisha Rulapaugh1014Spain2026-05-28
Ivar Paprocki1015United Kingdom2026-05-17
Isabel Bowley1016Canada2026-05-28
Kadeem Flosi1017Canada2026-05-17
Darci Poquette1018Brazil2026-05-15
Emily Whobrey1019Italy2026-05-22
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Tony FollerCanadaStephen Shaw PROPOSAL
Octavia MaletRussiaAsiya Javayant PROPOSAL
Murillo MaletArgentinaElwin Sharvill NEW
Murillo MaletJapanAsiya Javayant PROPOSAL
Arvin AlbaresIndiaIoni Bowcher UNQUALIFIED
Chavez BriddickCanadaXuxue Feng RENEWAL
Julie StensethCanadaAmy Elsner NEW
Chavez BriddickJapanIvan Magalhaes PROPOSAL
Jones VocelkaUnited KingdomAmy Elsner UNQUALIFIED
Alejandro PerinAustraliaStephen Shaw NEW
Adams MorascaAustraliaElwin Sharvill QUALIFIED
Darci PoquetteArgentinaAsiya Javayant NEW
Arvin AlbaresItalyAsiya Javayant RENEWAL
Morrow RutaItalyOnyama Limba UNQUALIFIED
Faith GillianArgentinaAmy Elsner UNQUALIFIED
Claire TollnerBrazilIvan Magalhaes NEGOTIATION
Isabel BowleyGermanyXuxue Feng NEW
Silvio SlusarskiSpainAnna Fali PROPOSAL
Chavez BriddickBrazilElwin Sharvill QUALIFIED
Johnson SergiJapanOnyama Limba RENEWAL
Tony FollerItalyXuxue Feng QUALIFIED
Francesco ShinkoArgentinaAmy Elsner PROPOSAL
Isabel BowleySpainIvan Magalhaes NEW
Julie StensethFranceAnna Fali QUALIFIED
Mujtaba NickaItalyIvan Magalhaes NEGOTIATION
Aika InouyeBrazilAsiya Javayant QUALIFIED
Johnson SergiArgentinaAnna Fali RENEWAL
David DarakjyArgentinaAsiya Javayant UNQUALIFIED
Arvin AlbaresGermanyStephen Shaw NEW
Octavia MaletIndiaBernardo Dominic QUALIFIED
Maisha RulapaughRussiaAmy Elsner NEGOTIATION
Maria MarrierUnited KingdomElwin Sharvill NEGOTIATION
Salvatore StockhamUnited KingdomAnna Fali NEW
Jeanfrancois VenereIndiaElwin Sharvill QUALIFIED
Leon OldroydGermanyElwin Sharvill PROPOSAL
Claire TollnerFranceAsiya Javayant NEGOTIATION
Rodrigues CampainIndiaBernardo Dominic NEW
Mayumi KolmetzSpainElwin Sharvill NEGOTIATION
Chavez BriddickItalyAmy Elsner NEW
Clifford RimBrazilStephen 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>