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
Emily WhobreyCanadaXuxue Feng NEW
Izzy GarufiUnited KingdomBernardo Dominic NEGOTIATION
Maria MarrierCanadaOnyama Limba NEGOTIATION
Cody SaylorsArgentinaAmy Elsner NEGOTIATION
Ashley DoeUnited KingdomAmy Elsner NEGOTIATION
Emily WhobreyCanadaXuxue Feng UNQUALIFIED
Murillo MaletItalyIoni Bowcher RENEWAL
Murillo MaletItalyOnyama Limba RENEWAL
Jeanfrancois VenereArgentinaXuxue Feng RENEWAL
Aruna FigeroaIndiaOnyama Limba PROPOSAL
Nicolas IturbideCanadaAmy Elsner UNQUALIFIED
Emily WhobreySpainIoni Bowcher RENEWAL
Jones VocelkaArgentinaAsiya Javayant NEW
Sinclair WaycottSpainStephen Shaw NEGOTIATION
Maria MarrierFranceAnna Fali QUALIFIED
Silvio SlusarskiGermanyAnna Fali QUALIFIED
Antonio CaudyAustraliaIoni Bowcher UNQUALIFIED
Nicolas IturbideIndiaStephen Shaw UNQUALIFIED
Deepesh ChuiAustraliaOnyama Limba QUALIFIED
Munro FerenczSpainOnyama Limba QUALIFIED
Greenwood BologniaIndiaAnna Fali NEGOTIATION
Cody SaylorsJapanIvan Magalhaes QUALIFIED
Ashley DoeFranceElwin Sharvill QUALIFIED
David DarakjyRussiaElwin Sharvill NEGOTIATION
Clifford RimSpainStephen Shaw NEW
Jones VocelkaBrazilElwin Sharvill PROPOSAL
Kadeem FlosiRussiaAmy Elsner UNQUALIFIED
Jennifer AmigonUnited KingdomAnna Fali PROPOSAL
James ButtCanadaAnna Fali RENEWAL
Jeanfrancois VenereAustraliaIvan Magalhaes NEGOTIATION
Johnson SergiSpainXuxue Feng UNQUALIFIED
David DarakjyFranceIvan Magalhaes NEW
Greenwood BologniaSpainElwin Sharvill NEGOTIATION
Clifford RimArgentinaAsiya Javayant UNQUALIFIED
Julie StensethFranceElwin Sharvill UNQUALIFIED
Arvin AlbaresCanadaElwin Sharvill RENEWAL
James ButtArgentinaAnna Fali PROPOSAL
Maisha RulapaughRussiaAsiya Javayant RENEWAL
Johnson SergiJapanAnna Fali NEGOTIATION
Alejandro PerinFranceElwin Sharvill PROPOSAL
Emily WhobreyUnited KingdomBernardo Dominic UNQUALIFIED
Maisha RulapaughUnited KingdomElwin Sharvill QUALIFIED
Juan WieserRussiaAmy Elsner UNQUALIFIED
Adams MorascaJapanAnna Fali QUALIFIED
Jones VocelkaJapanAmy Elsner NEW
Deepesh ChuiRussiaIvan Magalhaes QUALIFIED
Salvatore StockhamItalyIvan Magalhaes NEGOTIATION
Isabel BowleyGermanyIvan Magalhaes UNQUALIFIED
Greenwood BologniaBrazilAnna Fali QUALIFIED
Rodrigues CampainRussiaIoni Bowcher UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Costa DilliardFranceAnna Fali NEGOTIATION
Leon OldroydBrazilOnyama Limba NEW
Mayumi KolmetzIndiaElwin Sharvill QUALIFIED
Maria MarrierJapanXuxue Feng QUALIFIED
Salvatore StockhamUnited KingdomIvan Magalhaes QUALIFIED
Wickens NestleArgentinaElwin Sharvill NEGOTIATION
Mayumi KolmetzAustraliaAmy Elsner RENEWAL
James ButtAustraliaIvan Magalhaes NEGOTIATION
Jennifer AmigonAustraliaXuxue Feng NEGOTIATION
Leon OldroydSpainXuxue Feng UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Deepesh ChuiSpain2026-05-09Chanay, Jeffrey A Esq QUALIFIED22Xuxue Feng
1001Chavez BriddickRussia2026-05-01King, Christopher A Esq UNQUALIFIED23Bernardo Dominic
1002Mujtaba NickaUnited Kingdom2026-05-02Feltz Printing Service RENEWAL25Amy Elsner
1003Murillo MaletAustralia2026-05-02Printing Dimensions NEW98Xuxue Feng
1004Cody SaylorsIndia2026-04-24Buckley Miller Wright UNQUALIFIED87Amy Elsner
1005Johnson SergiIndia2026-05-21Chemel, James L Cpa QUALIFIED39Amy Elsner
1006Faith GillianFrance2026-05-17Dorl, James J Esq UNQUALIFIED43Xuxue Feng
1007Jennifer AmigonFrance2026-05-17King, Christopher A Esq NEW3Amy Elsner
1008Faith GillianRussia2026-05-06Feltz Printing Service QUALIFIED35Asiya Javayant
1009Izzy GarufiJapan2026-05-09Chemel, James L Cpa RENEWAL98Ioni Bowcher
1010Juan WieserRussia2026-04-29Buckley Miller Wright UNQUALIFIED53Elwin Sharvill
1011Jennifer AmigonCanada2026-05-16Rangoni Of Florence QUALIFIED1Elwin Sharvill
1012Maria MarrierItaly2026-05-01Rousseaux, Michael Esq NEGOTIATION10Stephen Shaw
1013Kaitlin OstroskyArgentina2026-05-06Commercial Press NEW3Bernardo Dominic
1014Munro FerenczItaly2026-05-17Benton, John B Jr NEGOTIATION70Bernardo Dominic
1015Jeanfrancois VenereUnited Kingdom2026-05-09Morlong Associates PROPOSAL19Xuxue Feng
1016Leja CaldareraSpain2026-05-02Feiner Bros PROPOSAL96Onyama Limba
1017Sinclair WaycottSpain2026-05-22Rousseaux, Michael Esq RENEWAL34Onyama Limba
1018Deepesh ChuiGermany2026-05-09Chanay, Jeffrey A Esq QUALIFIED24Ivan Magalhaes
1019Adams MorascaArgentina2026-05-12Feltz Printing Service QUALIFIED46Stephen Shaw
1020Arvin AlbaresUnited Kingdom2026-05-16Truhlar And Truhlar Attys NEW60Ivan Magalhaes
1021Smith GlickGermany2026-05-08Benton, John B Jr RENEWAL86Onyama Limba
1022Maisha RulapaughUnited Kingdom2026-04-26Chemel, James L Cpa RENEWAL73Onyama Limba
1023Smith GlickBrazil2026-05-15Rangoni Of Florence RENEWAL79Onyama Limba
1024Juan WieserGermany2026-05-14Feltz Printing Service NEGOTIATION72Bernardo Dominic
1025Jennifer AmigonItaly2026-05-11Feltz Printing Service NEGOTIATION19Ivan Magalhaes
1026Greenwood BologniaAustralia2026-04-25Dorl, James J Esq QUALIFIED90Elwin Sharvill
1027David DarakjyAustralia2026-05-15Truhlar And Truhlar Attys QUALIFIED45Anna Fali
1028Rodrigues CampainFrance2026-05-21Rousseaux, Michael Esq PROPOSAL67Amy Elsner
1029Cody SaylorsFrance2026-05-14Buckley Miller Wright NEW83Stephen Shaw
1030Maria MarrierArgentina2026-04-24Rousseaux, Michael Esq QUALIFIED78Stephen Shaw
1031Jeanfrancois VenereArgentina2026-04-29Feltz Printing Service PROPOSAL22Onyama Limba
1032Jones VocelkaGermany2026-05-08Rousseaux, Michael Esq RENEWAL74Ivan Magalhaes
1033Darci PoquetteCanada2026-04-27Commercial Press PROPOSAL80Ioni Bowcher
1034Ivar PaprockiBrazil2026-05-03Commercial Press QUALIFIED66Onyama Limba
1035Leon OldroydItaly2026-05-01Chanay, Jeffrey A Esq NEGOTIATION86Asiya Javayant
1036Julie StensethSpain2026-04-28King, Christopher A Esq QUALIFIED78Xuxue Feng
1037Nicolas IturbideBrazil2026-05-02Feiner Bros QUALIFIED26Asiya Javayant
1038Sinclair WaycottIndia2026-05-11King, Christopher A Esq UNQUALIFIED46Xuxue Feng
1039Cody SaylorsFrance2026-05-21Buckley Miller Wright UNQUALIFIED46Asiya Javayant
1040Greenwood BologniaAustralia2026-04-29Buckley Miller Wright UNQUALIFIED72Asiya Javayant
1041Adams MorascaItaly2026-05-09Rangoni Of Florence UNQUALIFIED94Amy Elsner
1042Kaitlin OstroskyJapan2026-05-20Truhlar And Truhlar Attys QUALIFIED59Elwin Sharvill
1043Isabel BowleyBrazil2026-05-02Chemel, James L Cpa NEGOTIATION31Ivan Magalhaes
1044Octavia MaletItaly2026-05-04Feiner Bros PROPOSAL68Amy Elsner
1045Arvin AlbaresCanada2026-05-03Chapman, Ross E Esq NEW22Elwin Sharvill
1046Aika InouyeFrance2026-05-20Commercial Press NEW69Elwin Sharvill
1047Antonio CaudyIndia2026-05-15Commercial Press NEW36Bernardo Dominic
1048Ivar PaprockiAustralia2026-05-18King, Christopher A Esq UNQUALIFIED87Ioni Bowcher
1049Octavia MaletArgentina2026-05-23Commercial Press QUALIFIED82Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Octavia MaletJapanIvan Magalhaes RENEWAL
Nicolas IturbideRussiaOnyama Limba UNQUALIFIED
Aruna FigeroaBrazilIvan Magalhaes NEW
Jeanfrancois VenereRussiaOnyama Limba NEW
Julie StensethRussiaAsiya Javayant NEW
Silvio SlusarskiAustraliaAsiya Javayant PROPOSAL
Mujtaba NickaJapanIvan Magalhaes QUALIFIED
Greenwood BologniaGermanyIvan Magalhaes RENEWAL
Ashley DoeArgentinaStephen Shaw RENEWAL
Antonio CaudyFranceXuxue Feng PROPOSAL
Isabel BowleyGermanyXuxue Feng NEGOTIATION
Jefferson SchemmerRussiaIoni Bowcher PROPOSAL
Aruna FigeroaItalyBernardo Dominic UNQUALIFIED
Kaitlin OstroskyRussiaOnyama Limba NEGOTIATION
Adams MorascaBrazilXuxue Feng PROPOSAL
Izzy GarufiSpainXuxue Feng RENEWAL
Francesco ShinkoSpainAnna Fali QUALIFIED
Ricardo GauchoJapanAnna Fali RENEWAL
Wickens NestleAustraliaOnyama Limba RENEWAL
Jones VocelkaSpainAnna Fali QUALIFIED
Tony FollerIndiaAsiya Javayant RENEWAL
Murillo MaletGermanyIvan Magalhaes RENEWAL
Antonio CaudyJapanXuxue Feng NEGOTIATION
James ButtSpainIvan Magalhaes NEGOTIATION
Leja CaldareraItalyStephen Shaw NEW
Misaki RoysterJapanStephen Shaw RENEWAL
Deepesh ChuiJapanOnyama Limba UNQUALIFIED
Faith GillianUnited KingdomAnna Fali RENEWAL
Leon OldroydFranceElwin Sharvill NEW
Misaki RoysterArgentinaAsiya Javayant UNQUALIFIED
Leja CaldareraSpainOnyama Limba RENEWAL
Jefferson SchemmerFranceIoni Bowcher NEGOTIATION
Nicolas IturbideJapanBernardo Dominic NEGOTIATION
Jones VocelkaCanadaIoni Bowcher NEW
Faith GillianArgentinaAsiya Javayant QUALIFIED
Ashley DoeGermanyIvan Magalhaes NEGOTIATION
Stacey MacleadSpainAmy Elsner QUALIFIED
Faith GillianUnited KingdomOnyama Limba RENEWAL
Isabel BowleyArgentinaAmy Elsner QUALIFIED
Johnson SergiJapanAsiya Javayant NEGOTIATION
Mayumi KolmetzJapanOnyama Limba NEGOTIATION
Costa DilliardJapanXuxue Feng UNQUALIFIED
James ButtCanadaXuxue Feng NEGOTIATION
Adams MorascaAustraliaElwin Sharvill QUALIFIED
Jeanfrancois VenereGermanyAmy Elsner UNQUALIFIED
James ButtArgentinaXuxue Feng QUALIFIED
Jones VocelkaBrazilIoni Bowcher PROPOSAL
Chavez BriddickSpainIvan Magalhaes QUALIFIED
Stacey MacleadBrazilIoni Bowcher QUALIFIED
Darci PoquetteGermanyStephen Shaw QUALIFIED
Frozen Columns
Name
Isabel Bowley
Aika Inouye
Murillo Malet
Johnson Sergi
Ashley Doe
Antonio Caudy
Munro Ferencz
Chavez Briddick
Jones Vocelka
Smith Glick
Antonio Caudy
Faith Gillian
Maria Marrier
Aditya Kusko
Mujtaba Nicka
Chavez Briddick
Claire Tollner
Silvio Slusarski
Alejandro Perin
Aruna Figeroa
Silvio Slusarski
Leon Oldroyd
Mujtaba Nicka
Clifford Rim
Silvio Slusarski
Mujtaba Nicka
Adams Morasca
Faith Gillian
Antonio Caudy
Aika Inouye
Smith Glick
Faith Gillian
Ashley Doe
Ivar Paprocki
Rodrigues Campain
Jefferson Schemmer
Claire Tollner
Aruna Figeroa
Jennifer Amigon
Izzy Garufi
Arvin Albares
Chavez Briddick
Sinclair Waycott
Misaki Royster
Sinclair Waycott
Faith Gillian
Rodrigues Campain
Greenwood Bolognia
Kaitlin Ostrosky
Chavez Briddick
IdCountryDate
1000Argentina2026-05-12
1001India2026-04-28
1002Brazil2026-05-04
1003Spain2026-04-24
1004Canada2026-05-12
1005Brazil2026-05-02
1006Russia2026-05-07
1007Argentina2026-05-13
1008Germany2026-04-25
1009Germany2026-05-06
1010Russia2026-05-17
1011Argentina2026-04-24
1012Russia2026-04-26
1013Argentina2026-05-11
1014Russia2026-05-01
1015United Kingdom2026-05-13
1016Russia2026-05-10
1017Argentina2026-05-01
1018Spain2026-04-29
1019Canada2026-05-13
1020Canada2026-04-29
1021France2026-05-06
1022Spain2026-05-09
1023France2026-05-18
1024Russia2026-05-04
1025Canada2026-05-21
1026Spain2026-05-09
1027United Kingdom2026-05-01
1028Australia2026-05-04
1029Russia2026-04-28
1030Italy2026-05-15
1031France2026-04-29
1032Argentina2026-05-23
1033Germany2026-05-09
1034United Kingdom2026-05-20
1035Spain2026-04-24
1036United Kingdom2026-05-14
1037Canada2026-05-04
1038Spain2026-05-04
1039Russia2026-05-01
1040Russia2026-04-26
1041Australia2026-05-14
1042Japan2026-05-09
1043Russia2026-04-28
1044Russia2026-05-21
1045Argentina2026-05-16
1046Argentina2026-05-12
1047Russia2026-05-20
1048Canada2026-05-19
1049Japan2026-05-18

On-Demand Data

NameIdCountryDate
Leja Caldarera1000Russia2026-04-26
Greenwood Bolognia1001Canada2026-04-24
Chavez Briddick1002Australia2026-05-08
Maisha Rulapaugh1003United Kingdom2026-05-22
Salvatore Stockham1004Germany2026-05-05
Jones Vocelka1005Japan2026-05-07
Faith Gillian1006Spain2026-04-26
Greenwood Bolognia1007Italy2026-05-13
Julie Stenseth1008Spain2026-05-17
Adams Morasca1009Spain2026-05-22
Tony Foller1010Spain2026-05-16
Salvatore Stockham1011Germany2026-04-27
Francesco Shinko1012Spain2026-04-28
Isabel Bowley1013Spain2026-05-20
Ashley Doe1014Italy2026-05-23
Costa Dilliard1015Australia2026-05-04
Jennifer Amigon1016Italy2026-05-18
Adams Morasca1017Russia2026-05-07
Leja Caldarera1018Brazil2026-05-07
Maisha Rulapaugh1019France2026-05-04
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Cody SaylorsSpainAmy Elsner QUALIFIED
Aruna FigeroaCanadaElwin Sharvill NEW
David DarakjyItalyIoni Bowcher NEGOTIATION
Octavia MaletGermanyBernardo Dominic UNQUALIFIED
Izzy GarufiUnited KingdomIvan Magalhaes RENEWAL
Salvatore StockhamUnited KingdomXuxue Feng NEW
Cody SaylorsRussiaXuxue Feng PROPOSAL
Adams MorascaJapanElwin Sharvill UNQUALIFIED
Stacey MacleadCanadaElwin Sharvill NEW
Jones VocelkaFranceAmy Elsner NEW
Smith GlickGermanyIoni Bowcher PROPOSAL
Munro FerenczRussiaAmy Elsner QUALIFIED
Jones VocelkaJapanAnna Fali RENEWAL
Julie StensethUnited KingdomStephen Shaw UNQUALIFIED
Johnson SergiAustraliaAmy Elsner RENEWAL
Ricardo GauchoRussiaOnyama Limba PROPOSAL
Jeanfrancois VenereFranceIvan Magalhaes UNQUALIFIED
Aruna FigeroaItalyXuxue Feng NEW
Maria MarrierItalyAmy Elsner QUALIFIED
Munro FerenczJapanIvan Magalhaes RENEWAL
Aditya KuskoArgentinaXuxue Feng UNQUALIFIED
Cody SaylorsIndiaStephen Shaw RENEWAL
Smith GlickSpainOnyama Limba RENEWAL
Jeanfrancois VenereUnited KingdomIvan Magalhaes QUALIFIED
Ivar PaprockiArgentinaIvan Magalhaes QUALIFIED
Greenwood BologniaItalyXuxue Feng RENEWAL
Maria MarrierFranceAnna Fali UNQUALIFIED
Julie StensethJapanAmy Elsner UNQUALIFIED
Emily WhobreyFranceBernardo Dominic UNQUALIFIED
Kadeem FlosiUnited KingdomIoni Bowcher NEGOTIATION
Nicolas IturbideSpainIoni Bowcher RENEWAL
Leja CaldareraAustraliaAmy Elsner UNQUALIFIED
Izzy GarufiRussiaXuxue Feng NEGOTIATION
Leon OldroydBrazilAmy Elsner QUALIFIED
Adams MorascaRussiaElwin Sharvill UNQUALIFIED
Cody SaylorsUnited KingdomStephen Shaw NEGOTIATION
Maria MarrierFranceAnna Fali NEW
Ivar PaprockiGermanyOnyama Limba RENEWAL
Rodrigues CampainSpainXuxue Feng RENEWAL
Claire TollnerArgentinaStephen Shaw 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>