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
Tony FollerBrazilBernardo Dominic NEGOTIATION
Smith GlickAustraliaXuxue Feng UNQUALIFIED
Ashley DoeIndiaAmy Elsner QUALIFIED
Costa DilliardIndiaAnna Fali NEW
Antonio CaudyFranceAsiya Javayant RENEWAL
Ricardo GauchoCanadaIvan Magalhaes PROPOSAL
Aruna FigeroaCanadaAsiya Javayant NEGOTIATION
Mujtaba NickaBrazilBernardo Dominic UNQUALIFIED
Izzy GarufiUnited KingdomAmy Elsner QUALIFIED
Antonio CaudyAustraliaIvan Magalhaes RENEWAL
Cody SaylorsSpainXuxue Feng PROPOSAL
Tony FollerRussiaBernardo Dominic PROPOSAL
Darci PoquetteItalyAsiya Javayant PROPOSAL
Ricardo GauchoIndiaIvan Magalhaes UNQUALIFIED
Salvatore StockhamIndiaXuxue Feng NEGOTIATION
Antonio CaudyRussiaAmy Elsner RENEWAL
Misaki RoysterGermanyAsiya Javayant NEGOTIATION
Deepesh ChuiFranceElwin Sharvill RENEWAL
Deepesh ChuiArgentinaBernardo Dominic UNQUALIFIED
Isabel BowleyUnited KingdomAnna Fali UNQUALIFIED
Kaitlin OstroskySpainIvan Magalhaes NEGOTIATION
Octavia MaletFranceAsiya Javayant NEGOTIATION
Antonio CaudyCanadaOnyama Limba NEGOTIATION
Cody SaylorsCanadaBernardo Dominic RENEWAL
Aruna FigeroaIndiaIvan Magalhaes UNQUALIFIED
Julie StensethSpainStephen Shaw NEW
Rodrigues CampainUnited KingdomBernardo Dominic QUALIFIED
Johnson SergiArgentinaOnyama Limba NEGOTIATION
Rodrigues CampainItalyIvan Magalhaes NEGOTIATION
Faith GillianGermanyOnyama Limba QUALIFIED
James ButtJapanAnna Fali UNQUALIFIED
Claire TollnerBrazilElwin Sharvill NEGOTIATION
David DarakjyUnited KingdomBernardo Dominic QUALIFIED
Costa DilliardUnited KingdomStephen Shaw PROPOSAL
Clifford RimUnited KingdomXuxue Feng RENEWAL
Francesco ShinkoGermanyOnyama Limba QUALIFIED
Antonio CaudyGermanyAnna Fali NEGOTIATION
Nicolas IturbideIndiaStephen Shaw UNQUALIFIED
Silvio SlusarskiUnited KingdomIvan Magalhaes UNQUALIFIED
Maria MarrierGermanyIvan Magalhaes NEGOTIATION
Tony FollerItalyIoni Bowcher NEGOTIATION
Chavez BriddickJapanElwin Sharvill PROPOSAL
Clifford RimJapanBernardo Dominic PROPOSAL
Silvio SlusarskiSpainStephen Shaw NEW
Maria MarrierFranceBernardo Dominic NEGOTIATION
Morrow RutaArgentinaAnna Fali NEGOTIATION
Misaki RoysterUnited KingdomOnyama Limba RENEWAL
Deepesh ChuiItalyBernardo Dominic RENEWAL
Deepesh ChuiGermanyIoni Bowcher NEGOTIATION
Jennifer AmigonItalyIoni Bowcher RENEWAL
Horizontal
NameCountryRepresentativeStatus
Ricardo GauchoCanadaIvan Magalhaes RENEWAL
Ashley DoeBrazilIoni Bowcher PROPOSAL
Rodrigues CampainArgentinaAnna Fali RENEWAL
Maria MarrierBrazilAmy Elsner NEGOTIATION
Johnson SergiJapanIvan Magalhaes RENEWAL
Juan WieserSpainIoni Bowcher RENEWAL
Leja CaldareraRussiaOnyama Limba QUALIFIED
Maria MarrierSpainXuxue Feng UNQUALIFIED
Aika InouyeSpainAmy Elsner QUALIFIED
Emily WhobreySpainElwin Sharvill PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Tony FollerCanada2026-05-15Chanay, Jeffrey A Esq PROPOSAL74Onyama Limba
1001Aika InouyeFrance2026-05-13Feiner Bros PROPOSAL6Xuxue Feng
1002Juan WieserJapan2026-04-25Chanay, Jeffrey A Esq UNQUALIFIED36Ioni Bowcher
1003Juan WieserGermany2026-04-22Printing Dimensions QUALIFIED29Ioni Bowcher
1004Jennifer AmigonIndia2026-04-27Truhlar And Truhlar Attys PROPOSAL71Ioni Bowcher
1005Sinclair WaycottSpain2026-05-12Truhlar And Truhlar Attys NEGOTIATION98Xuxue Feng
1006Nicolas IturbideAustralia2026-05-02Chapman, Ross E Esq UNQUALIFIED4Bernardo Dominic
1007Silvio SlusarskiAustralia2026-05-13Dorl, James J Esq PROPOSAL66Bernardo Dominic
1008Sinclair WaycottSpain2026-04-21Truhlar And Truhlar Attys NEGOTIATION72Anna Fali
1009Chavez BriddickAustralia2026-04-19Truhlar And Truhlar Attys NEW38Onyama Limba
1010Kadeem FlosiGermany2026-04-27Benton, John B Jr UNQUALIFIED58Ivan Magalhaes
1011Wickens NestleJapan2026-04-28Feltz Printing Service UNQUALIFIED70Elwin Sharvill
1012Juan WieserAustralia2026-04-22Rousseaux, Michael Esq NEW72Onyama Limba
1013Juan WieserBrazil2026-05-07Feltz Printing Service NEGOTIATION97Stephen Shaw
1014Juan WieserIndia2026-05-14Morlong Associates NEGOTIATION69Asiya Javayant
1015Salvatore StockhamFrance2026-05-03Dorl, James J Esq PROPOSAL4Xuxue Feng
1016Mujtaba NickaItaly2026-04-29Chanay, Jeffrey A Esq NEW93Bernardo Dominic
1017Nicolas IturbideAustralia2026-05-12Benton, John B Jr NEW69Stephen Shaw
1018Morrow RutaCanada2026-05-16Printing Dimensions RENEWAL21Asiya Javayant
1019Aditya KuskoArgentina2026-05-03King, Christopher A Esq NEW13Amy Elsner
1020Isabel BowleyBrazil2026-04-22Commercial Press NEGOTIATION46Anna Fali
1021Maisha RulapaughSpain2026-04-21Printing Dimensions PROPOSAL81Elwin Sharvill
1022Arvin AlbaresUnited Kingdom2026-05-16King, Christopher A Esq QUALIFIED91Bernardo Dominic
1023Mujtaba NickaJapan2026-05-10Benton, John B Jr UNQUALIFIED44Amy Elsner
1024Adams MorascaUnited Kingdom2026-05-09Benton, John B Jr QUALIFIED76Bernardo Dominic
1025Adams MorascaArgentina2026-05-07Benton, John B Jr QUALIFIED36Anna Fali
1026Leon OldroydItaly2026-05-16Rangoni Of Florence NEGOTIATION2Stephen Shaw
1027Izzy GarufiIndia2026-05-14Chemel, James L Cpa NEGOTIATION13Bernardo Dominic
1028Cody SaylorsFrance2026-05-13Dorl, James J Esq QUALIFIED19Bernardo Dominic
1029Adams MorascaJapan2026-05-08Truhlar And Truhlar Attys UNQUALIFIED15Stephen Shaw
1030Tony FollerArgentina2026-04-30King, Christopher A Esq NEGOTIATION27Ivan Magalhaes
1031Antonio CaudyIndia2026-04-18Feiner Bros NEGOTIATION61Onyama Limba
1032Aditya KuskoArgentina2026-05-11Truhlar And Truhlar Attys RENEWAL82Elwin Sharvill
1033Aika InouyeBrazil2026-04-27Buckley Miller Wright NEW2Onyama Limba
1034Ivar PaprockiGermany2026-05-02Chapman, Ross E Esq RENEWAL61Asiya Javayant
1035Tony FollerArgentina2026-04-17Feltz Printing Service NEW51Xuxue Feng
1036Jones VocelkaAustralia2026-05-08King, Christopher A Esq QUALIFIED58Onyama Limba
1037Jeanfrancois VenereItaly2026-05-16Benton, John B Jr UNQUALIFIED11Bernardo Dominic
1038Morrow RutaCanada2026-05-08King, Christopher A Esq RENEWAL86Ivan Magalhaes
1039Chavez BriddickJapan2026-04-23Feiner Bros NEGOTIATION18Amy Elsner
1040Ricardo GauchoSpain2026-04-30Printing Dimensions NEW66Onyama Limba
1041Cody SaylorsItaly2026-04-20Dorl, James J Esq RENEWAL84Anna Fali
1042Darci PoquetteItaly2026-04-19Chemel, James L Cpa QUALIFIED13Ivan Magalhaes
1043Darci PoquetteUnited Kingdom2026-04-30Feiner Bros QUALIFIED12Ivan Magalhaes
1044Deepesh ChuiArgentina2026-05-01Rousseaux, Michael Esq UNQUALIFIED90Ioni Bowcher
1045Darci PoquetteUnited Kingdom2026-04-28Rangoni Of Florence NEGOTIATION83Amy Elsner
1046Leja CaldareraIndia2026-05-03Feltz Printing Service UNQUALIFIED29Amy Elsner
1047Maria MarrierAustralia2026-05-08Truhlar And Truhlar Attys NEW59Ioni Bowcher
1048Isabel BowleySpain2026-04-29Feiner Bros NEGOTIATION37Asiya Javayant
1049Jennifer AmigonArgentina2026-04-27Commercial Press RENEWAL1Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
James ButtFranceStephen Shaw PROPOSAL
Rodrigues CampainIndiaAmy Elsner UNQUALIFIED
Deepesh ChuiArgentinaAmy Elsner QUALIFIED
Murillo MaletBrazilBernardo Dominic UNQUALIFIED
Claire TollnerFranceIoni Bowcher NEGOTIATION
Izzy GarufiRussiaStephen Shaw NEGOTIATION
James ButtGermanyElwin Sharvill PROPOSAL
Maisha RulapaughIndiaAmy Elsner NEW
Izzy GarufiFranceIvan Magalhaes UNQUALIFIED
Kaitlin OstroskySpainAsiya Javayant UNQUALIFIED
Mayumi KolmetzArgentinaBernardo Dominic UNQUALIFIED
Aruna FigeroaUnited KingdomBernardo Dominic RENEWAL
Antonio CaudyAustraliaStephen Shaw PROPOSAL
Aruna FigeroaJapanXuxue Feng NEGOTIATION
Greenwood BologniaArgentinaAmy Elsner QUALIFIED
Francesco ShinkoJapanOnyama Limba PROPOSAL
Darci PoquetteUnited KingdomElwin Sharvill PROPOSAL
Aditya KuskoFranceIoni Bowcher UNQUALIFIED
Octavia MaletArgentinaOnyama Limba UNQUALIFIED
Ashley DoeFranceBernardo Dominic QUALIFIED
Leja CaldareraGermanyIoni Bowcher NEW
Aika InouyeBrazilAsiya Javayant PROPOSAL
James ButtRussiaElwin Sharvill NEW
Emily WhobreyIndiaAsiya Javayant RENEWAL
Chavez BriddickSpainIoni Bowcher RENEWAL
Isabel BowleyUnited KingdomXuxue Feng QUALIFIED
Cody SaylorsFranceElwin Sharvill UNQUALIFIED
Nicolas IturbideRussiaElwin Sharvill NEW
Jeanfrancois VenereJapanIvan Magalhaes RENEWAL
Jeanfrancois VenereItalyOnyama Limba NEW
Aruna FigeroaFranceAmy Elsner RENEWAL
Rodrigues CampainGermanyIoni Bowcher NEGOTIATION
Arvin AlbaresCanadaElwin Sharvill PROPOSAL
Kadeem FlosiGermanyBernardo Dominic UNQUALIFIED
Stacey MacleadGermanyElwin Sharvill NEW
Antonio CaudySpainBernardo Dominic QUALIFIED
Clifford RimCanadaAmy Elsner RENEWAL
Nicolas IturbideSpainIoni Bowcher PROPOSAL
Ashley DoeSpainElwin Sharvill NEW
Wickens NestleItalyOnyama Limba RENEWAL
Juan WieserArgentinaAsiya Javayant UNQUALIFIED
Jennifer AmigonArgentinaAnna Fali NEGOTIATION
Clifford RimAustraliaOnyama Limba UNQUALIFIED
Antonio CaudyItalyStephen Shaw UNQUALIFIED
Isabel BowleyAustraliaXuxue Feng QUALIFIED
Claire TollnerCanadaOnyama Limba UNQUALIFIED
Ivar PaprockiAustraliaElwin Sharvill UNQUALIFIED
Nicolas IturbideCanadaOnyama Limba RENEWAL
Leon OldroydIndiaElwin Sharvill UNQUALIFIED
Kadeem FlosiJapanIoni Bowcher NEW
Frozen Columns
Name
Chavez Briddick
Darci Poquette
Sinclair Waycott
Tony Foller
Jefferson Schemmer
Maria Marrier
Leja Caldarera
Leon Oldroyd
Salvatore Stockham
Isabel Bowley
Francesco Shinko
Jones Vocelka
Aika Inouye
Rodrigues Campain
Sinclair Waycott
Aditya Kusko
Sinclair Waycott
Maria Marrier
Aika Inouye
Clifford Rim
Isabel Bowley
Tony Foller
Aditya Kusko
Ivar Paprocki
Deepesh Chui
Nicolas Iturbide
Clifford Rim
Jones Vocelka
Adams Morasca
Smith Glick
Leon Oldroyd
Juan Wieser
Deepesh Chui
Greenwood Bolognia
Alejandro Perin
Emily Whobrey
Smith Glick
Aika Inouye
Kaitlin Ostrosky
Greenwood Bolognia
David Darakjy
Mujtaba Nicka
Morrow Ruta
Ivar Paprocki
Leja Caldarera
Murillo Malet
Ashley Doe
Darci Poquette
Maria Marrier
Adams Morasca
IdCountryDate
1000France2026-05-10
1001Japan2026-04-19
1002Brazil2026-05-09
1003Brazil2026-04-28
1004Italy2026-04-28
1005Russia2026-05-09
1006France2026-05-01
1007Spain2026-05-16
1008Canada2026-04-22
1009Brazil2026-04-23
1010Italy2026-04-29
1011Brazil2026-05-10
1012Italy2026-05-11
1013Italy2026-05-16
1014Germany2026-04-25
1015United Kingdom2026-05-06
1016Spain2026-04-28
1017United Kingdom2026-04-22
1018Russia2026-04-27
1019Russia2026-04-29
1020Argentina2026-05-06
1021Argentina2026-05-10
1022France2026-05-13
1023Spain2026-04-28
1024Japan2026-05-07
1025France2026-04-21
1026Italy2026-05-13
1027Argentina2026-05-09
1028Argentina2026-04-24
1029Spain2026-04-18
1030France2026-05-08
1031Canada2026-04-27
1032Japan2026-05-16
1033Spain2026-04-29
1034Germany2026-04-25
1035Spain2026-05-07
1036Argentina2026-05-08
1037Germany2026-04-17
1038Russia2026-05-16
1039Russia2026-05-12
1040Japan2026-05-14
1041United Kingdom2026-04-17
1042Australia2026-05-08
1043Italy2026-05-12
1044Canada2026-04-30
1045Argentina2026-04-28
1046India2026-05-14
1047Canada2026-04-19
1048Italy2026-05-11
1049Brazil2026-05-02

On-Demand Data

NameIdCountryDate
Darci Poquette1000Spain2026-04-23
Emily Whobrey1001Japan2026-05-13
Salvatore Stockham1002Russia2026-04-23
Stacey Maclead1003Italy2026-05-01
Greenwood Bolognia1004Spain2026-04-19
Jeanfrancois Venere1005Russia2026-05-05
Stacey Maclead1006Brazil2026-04-26
Antonio Caudy1007Canada2026-04-24
Leja Caldarera1008Australia2026-05-08
Costa Dilliard1009Brazil2026-04-27
Ricardo Gaucho1010Germany2026-04-28
Mujtaba Nicka1011Canada2026-05-07
Cody Saylors1012Japan2026-05-03
Rodrigues Campain1013Italy2026-05-04
Adams Morasca1014Canada2026-04-30
Isabel Bowley1015India2026-05-13
Mayumi Kolmetz1016United Kingdom2026-05-15
Sinclair Waycott1017Italy2026-04-22
Smith Glick1018Germany2026-05-02
Izzy Garufi1019India2026-05-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Nicolas IturbideRussiaXuxue Feng PROPOSAL
Munro FerenczBrazilIvan Magalhaes NEGOTIATION
Chavez BriddickGermanyAsiya Javayant PROPOSAL
Nicolas IturbideItalyAnna Fali UNQUALIFIED
Maria MarrierUnited KingdomIoni Bowcher UNQUALIFIED
Mujtaba NickaFranceBernardo Dominic QUALIFIED
Izzy GarufiIndiaElwin Sharvill RENEWAL
Silvio SlusarskiBrazilXuxue Feng NEW
Jennifer AmigonAustraliaIvan Magalhaes NEGOTIATION
Maria MarrierSpainAmy Elsner UNQUALIFIED
Mayumi KolmetzAustraliaIoni Bowcher PROPOSAL
Misaki RoysterArgentinaIvan Magalhaes QUALIFIED
Johnson SergiGermanyIoni Bowcher RENEWAL
Jones VocelkaArgentinaIoni Bowcher QUALIFIED
Kaitlin OstroskyUnited KingdomOnyama Limba NEGOTIATION
Maria MarrierItalyXuxue Feng QUALIFIED
Leon OldroydUnited KingdomAsiya Javayant RENEWAL
Wickens NestleJapanElwin Sharvill PROPOSAL
Francesco ShinkoIndiaIoni Bowcher QUALIFIED
Smith GlickJapanBernardo Dominic NEGOTIATION
Nicolas IturbideCanadaStephen Shaw NEGOTIATION
Nicolas IturbideArgentinaIvan Magalhaes QUALIFIED
Johnson SergiCanadaStephen Shaw UNQUALIFIED
Cody SaylorsFranceAnna Fali QUALIFIED
Chavez BriddickFranceStephen Shaw NEW
Murillo MaletJapanOnyama Limba NEW
Ricardo GauchoUnited KingdomAnna Fali QUALIFIED
Deepesh ChuiRussiaElwin Sharvill PROPOSAL
Mujtaba NickaIndiaElwin Sharvill UNQUALIFIED
Clifford RimJapanAmy Elsner PROPOSAL
Claire TollnerBrazilElwin Sharvill NEW
Jones VocelkaCanadaBernardo Dominic NEW
Johnson SergiIndiaAsiya Javayant UNQUALIFIED
Isabel BowleyFranceBernardo Dominic QUALIFIED
Leja CaldareraSpainBernardo Dominic PROPOSAL
Costa DilliardAustraliaAmy Elsner PROPOSAL
Francesco ShinkoArgentinaBernardo Dominic UNQUALIFIED
Rodrigues CampainFranceBernardo Dominic UNQUALIFIED
Leja CaldareraSpainAnna Fali NEW
Wickens NestleArgentinaOnyama Limba RENEWAL

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