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
Aditya KuskoFranceAsiya Javayant RENEWAL
Juan WieserGermanyOnyama Limba PROPOSAL
Francesco ShinkoJapanStephen Shaw PROPOSAL
Cody SaylorsJapanOnyama Limba NEW
Faith GillianItalyAsiya Javayant PROPOSAL
Aika InouyeCanadaAnna Fali UNQUALIFIED
Aditya KuskoGermanyIoni Bowcher UNQUALIFIED
Johnson SergiJapanAsiya Javayant NEGOTIATION
Mujtaba NickaFranceIoni Bowcher NEGOTIATION
Jones VocelkaJapanAmy Elsner QUALIFIED
Emily WhobreyAustraliaAmy Elsner NEGOTIATION
Jefferson SchemmerIndiaIoni Bowcher PROPOSAL
Deepesh ChuiFranceAnna Fali QUALIFIED
Clifford RimGermanyStephen Shaw UNQUALIFIED
Ricardo GauchoArgentinaElwin Sharvill RENEWAL
Costa DilliardGermanyIoni Bowcher PROPOSAL
Darci PoquetteGermanyIvan Magalhaes PROPOSAL
Deepesh ChuiItalyStephen Shaw NEW
Costa DilliardArgentinaXuxue Feng PROPOSAL
Smith GlickArgentinaIvan Magalhaes RENEWAL
Claire TollnerArgentinaAsiya Javayant PROPOSAL
Jennifer AmigonArgentinaBernardo Dominic PROPOSAL
Greenwood BologniaFranceAnna Fali RENEWAL
Jones VocelkaRussiaIoni Bowcher QUALIFIED
Darci PoquetteUnited KingdomAmy Elsner UNQUALIFIED
Faith GillianGermanyXuxue Feng PROPOSAL
Juan WieserFranceStephen Shaw NEGOTIATION
Isabel BowleyGermanyAmy Elsner UNQUALIFIED
Ricardo GauchoItalyAmy Elsner NEGOTIATION
Morrow RutaUnited KingdomAnna Fali RENEWAL
Tony FollerCanadaAnna Fali NEGOTIATION
Antonio CaudyAustraliaIoni Bowcher QUALIFIED
Julie StensethRussiaBernardo Dominic UNQUALIFIED
Wickens NestleFranceOnyama Limba PROPOSAL
Smith GlickJapanIoni Bowcher NEW
Julie StensethArgentinaIvan Magalhaes NEGOTIATION
Aika InouyeArgentinaOnyama Limba RENEWAL
Sinclair WaycottUnited KingdomAnna Fali PROPOSAL
Ricardo GauchoRussiaElwin Sharvill UNQUALIFIED
Kaitlin OstroskyArgentinaIvan Magalhaes NEW
Antonio CaudyBrazilAsiya Javayant NEW
Deepesh ChuiBrazilIoni Bowcher QUALIFIED
James ButtRussiaAsiya Javayant NEGOTIATION
Morrow RutaBrazilAmy Elsner PROPOSAL
Ivar PaprockiFranceElwin Sharvill UNQUALIFIED
Aditya KuskoSpainElwin Sharvill NEW
Kaitlin OstroskyItalyAsiya Javayant PROPOSAL
Kadeem FlosiSpainOnyama Limba NEGOTIATION
Costa DilliardItalyAsiya Javayant PROPOSAL
Isabel BowleyCanadaXuxue Feng UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Arvin AlbaresIndiaIoni Bowcher RENEWAL
Aruna FigeroaJapanAsiya Javayant NEGOTIATION
Clifford RimArgentinaAsiya Javayant QUALIFIED
Julie StensethIndiaAmy Elsner QUALIFIED
Aruna FigeroaGermanyAsiya Javayant QUALIFIED
Juan WieserBrazilXuxue Feng NEGOTIATION
Wickens NestleJapanElwin Sharvill QUALIFIED
Alejandro PerinCanadaBernardo Dominic UNQUALIFIED
Mayumi KolmetzAustraliaStephen Shaw UNQUALIFIED
Leja CaldareraRussiaXuxue Feng PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Rodrigues CampainUnited Kingdom2026-04-22Chemel, James L Cpa RENEWAL63Ivan Magalhaes
1001Salvatore StockhamFrance2026-04-01Rousseaux, Michael Esq PROPOSAL25Onyama Limba
1002Ashley DoeRussia2026-04-07Commercial Press UNQUALIFIED5Xuxue Feng
1003Emily WhobreyUnited Kingdom2026-04-04Buckley Miller Wright RENEWAL15Amy Elsner
1004James ButtIndia2026-04-15Rousseaux, Michael Esq PROPOSAL14Onyama Limba
1005Ricardo GauchoJapan2026-03-28Buckley Miller Wright PROPOSAL34Xuxue Feng
1006Arvin AlbaresItaly2026-03-30Buckley Miller Wright RENEWAL38Amy Elsner
1007Silvio SlusarskiUnited Kingdom2026-04-14Buckley Miller Wright NEW72Amy Elsner
1008Darci PoquetteSpain2026-04-06Chanay, Jeffrey A Esq RENEWAL38Bernardo Dominic
1009Rodrigues CampainSpain2026-04-10Printing Dimensions NEGOTIATION75Elwin Sharvill
1010Julie StensethGermany2026-04-24Buckley Miller Wright NEW67Amy Elsner
1011Leja CaldareraArgentina2026-04-04Commercial Press QUALIFIED35Anna Fali
1012Adams MorascaArgentina2026-04-18Benton, John B Jr NEGOTIATION31Xuxue Feng
1013Stacey MacleadFrance2026-04-05Dorl, James J Esq NEW94Ivan Magalhaes
1014Silvio SlusarskiSpain2026-04-01Printing Dimensions PROPOSAL29Amy Elsner
1015Cody SaylorsJapan2026-04-21Commercial Press NEGOTIATION80Onyama Limba
1016Cody SaylorsIndia2026-04-22Dorl, James J Esq NEW77Bernardo Dominic
1017Clifford RimAustralia2026-04-18Morlong Associates PROPOSAL10Ivan Magalhaes
1018Smith GlickItaly2026-04-24Feiner Bros RENEWAL76Ivan Magalhaes
1019Izzy GarufiSpain2026-04-18Buckley Miller Wright PROPOSAL62Ivan Magalhaes
1020Kaitlin OstroskyRussia2026-04-20Dorl, James J Esq UNQUALIFIED24Elwin Sharvill
1021Ivar PaprockiBrazil2026-04-06Chemel, James L Cpa NEW81Onyama Limba
1022Izzy GarufiUnited Kingdom2026-03-31Rousseaux, Michael Esq PROPOSAL51Stephen Shaw
1023Antonio CaudyFrance2026-04-18Feiner Bros PROPOSAL10Ivan Magalhaes
1024Stacey MacleadArgentina2026-04-16Rangoni Of Florence RENEWAL15Amy Elsner
1025Chavez BriddickJapan2026-04-04Chapman, Ross E Esq RENEWAL94Stephen Shaw
1026Cody SaylorsAustralia2026-04-12Benton, John B Jr NEGOTIATION51Anna Fali
1027Kadeem FlosiUnited Kingdom2026-04-09Rousseaux, Michael Esq UNQUALIFIED82Anna Fali
1028Costa DilliardItaly2026-04-02Feltz Printing Service NEW82Elwin Sharvill
1029Jeanfrancois VenereCanada2026-04-20Rangoni Of Florence NEW42Ioni Bowcher
1030James ButtArgentina2026-04-26Printing Dimensions RENEWAL98Xuxue Feng
1031Izzy GarufiCanada2026-04-15Feiner Bros NEW87Asiya Javayant
1032Murillo MaletCanada2026-04-09Rangoni Of Florence PROPOSAL39Stephen Shaw
1033Ivar PaprockiArgentina2026-04-01Commercial Press QUALIFIED83Elwin Sharvill
1034Arvin AlbaresFrance2026-04-06Chemel, James L Cpa PROPOSAL72Asiya Javayant
1035Emily WhobreyIndia2026-04-18Feltz Printing Service PROPOSAL66Bernardo Dominic
1036Ricardo GauchoSpain2026-04-19Morlong Associates NEGOTIATION75Xuxue Feng
1037Rodrigues CampainGermany2026-04-21Benton, John B Jr QUALIFIED67Amy Elsner
1038Francesco ShinkoFrance2026-03-28King, Christopher A Esq UNQUALIFIED72Ivan Magalhaes
1039Rodrigues CampainItaly2026-04-18Rangoni Of Florence NEW55Asiya Javayant
1040Deepesh ChuiCanada2026-04-13Printing Dimensions QUALIFIED59Ivan Magalhaes
1041Misaki RoysterIndia2026-04-07Rousseaux, Michael Esq QUALIFIED27Stephen Shaw
1042James ButtJapan2026-04-01Dorl, James J Esq NEW35Asiya Javayant
1043Rodrigues CampainArgentina2026-04-14King, Christopher A Esq QUALIFIED4Amy Elsner
1044Ivar PaprockiAustralia2026-04-15Dorl, James J Esq PROPOSAL31Stephen Shaw
1045Darci PoquetteJapan2026-04-12Feiner Bros NEGOTIATION99Stephen Shaw
1046Darci PoquetteCanada2026-04-13Truhlar And Truhlar Attys RENEWAL50Stephen Shaw
1047Aruna FigeroaFrance2026-04-12Chanay, Jeffrey A Esq UNQUALIFIED85Xuxue Feng
1048Misaki RoysterItaly2026-04-01Commercial Press NEW19Anna Fali
1049Maisha RulapaughIndia2026-04-26Feltz Printing Service QUALIFIED57Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Julie StensethUnited KingdomIoni Bowcher UNQUALIFIED
Francesco ShinkoGermanyAsiya Javayant PROPOSAL
Chavez BriddickJapanAmy Elsner QUALIFIED
Antonio CaudyCanadaIvan Magalhaes RENEWAL
Misaki RoysterJapanBernardo Dominic NEGOTIATION
Ricardo GauchoFranceOnyama Limba UNQUALIFIED
Deepesh ChuiAustraliaBernardo Dominic UNQUALIFIED
Smith GlickIndiaXuxue Feng NEW
Faith GillianJapanBernardo Dominic NEGOTIATION
Octavia MaletSpainIvan Magalhaes NEGOTIATION
Smith GlickIndiaStephen Shaw QUALIFIED
Juan WieserGermanyOnyama Limba PROPOSAL
Smith GlickAustraliaBernardo Dominic NEGOTIATION
Clifford RimRussiaAnna Fali RENEWAL
Aruna FigeroaRussiaXuxue Feng NEGOTIATION
Ivar PaprockiFranceBernardo Dominic QUALIFIED
Maria MarrierUnited KingdomIvan Magalhaes PROPOSAL
David DarakjyAustraliaIvan Magalhaes RENEWAL
Johnson SergiIndiaIoni Bowcher UNQUALIFIED
Greenwood BologniaItalyXuxue Feng PROPOSAL
Jefferson SchemmerItalyAsiya Javayant QUALIFIED
Kaitlin OstroskyItalyBernardo Dominic RENEWAL
Maisha RulapaughBrazilStephen Shaw QUALIFIED
Aditya KuskoAustraliaAnna Fali UNQUALIFIED
Aika InouyeArgentinaAmy Elsner RENEWAL
Tony FollerJapanAsiya Javayant PROPOSAL
Ashley DoeItalyAsiya Javayant NEW
Wickens NestleJapanIvan Magalhaes NEW
Ricardo GauchoSpainOnyama Limba PROPOSAL
David DarakjyGermanyAsiya Javayant PROPOSAL
Jones VocelkaSpainOnyama Limba NEGOTIATION
Arvin AlbaresCanadaIvan Magalhaes UNQUALIFIED
Jeanfrancois VenereJapanAnna Fali QUALIFIED
Mayumi KolmetzIndiaAnna Fali PROPOSAL
Cody SaylorsIndiaStephen Shaw NEW
Mujtaba NickaSpainBernardo Dominic PROPOSAL
Julie StensethFranceIvan Magalhaes UNQUALIFIED
Greenwood BologniaBrazilOnyama Limba QUALIFIED
Octavia MaletUnited KingdomAsiya Javayant NEGOTIATION
Aika InouyeFranceXuxue Feng RENEWAL
Juan WieserIndiaAmy Elsner NEGOTIATION
Juan WieserBrazilStephen Shaw UNQUALIFIED
Francesco ShinkoArgentinaStephen Shaw QUALIFIED
Silvio SlusarskiArgentinaElwin Sharvill UNQUALIFIED
Jefferson SchemmerAustraliaXuxue Feng PROPOSAL
Stacey MacleadJapanOnyama Limba QUALIFIED
Ivar PaprockiBrazilXuxue Feng QUALIFIED
Francesco ShinkoBrazilAsiya Javayant QUALIFIED
Darci PoquetteBrazilAmy Elsner NEGOTIATION
Kadeem FlosiItalyAsiya Javayant PROPOSAL
Frozen Columns
Name
Stacey Maclead
Emily Whobrey
Jeanfrancois Venere
Arvin Albares
Murillo Malet
Kaitlin Ostrosky
Julie Stenseth
Deepesh Chui
Jefferson Schemmer
Aditya Kusko
Julie Stenseth
Ivar Paprocki
Maria Marrier
Darci Poquette
Jennifer Amigon
Ashley Doe
Munro Ferencz
Maisha Rulapaugh
Tony Foller
Rodrigues Campain
Juan Wieser
Nicolas Iturbide
Wickens Nestle
Rodrigues Campain
Kaitlin Ostrosky
Aika Inouye
Mayumi Kolmetz
Morrow Ruta
Leon Oldroyd
Francesco Shinko
Misaki Royster
Costa Dilliard
Costa Dilliard
Jefferson Schemmer
Nicolas Iturbide
Claire Tollner
Murillo Malet
Antonio Caudy
Stacey Maclead
James Butt
Ricardo Gaucho
Adams Morasca
Leja Caldarera
Alejandro Perin
Rodrigues Campain
Misaki Royster
David Darakjy
Morrow Ruta
Isabel Bowley
Jones Vocelka
IdCountryDate
1000India2026-04-13
1001Canada2026-03-29
1002Japan2026-03-28
1003Argentina2026-03-28
1004Russia2026-04-15
1005Japan2026-04-02
1006India2026-04-02
1007Canada2026-04-20
1008Italy2026-04-16
1009Germany2026-04-25
1010Canada2026-04-24
1011Germany2026-04-15
1012Argentina2026-04-23
1013Russia2026-04-17
1014India2026-04-13
1015India2026-03-29
1016Brazil2026-04-24
1017Australia2026-04-23
1018Italy2026-03-31
1019Japan2026-04-01
1020Japan2026-04-15
1021Japan2026-04-01
1022Canada2026-04-05
1023Germany2026-04-25
1024Argentina2026-04-08
1025Russia2026-04-17
1026Spain2026-04-26
1027Russia2026-04-25
1028France2026-04-19
1029Brazil2026-04-08
1030Germany2026-04-14
1031Russia2026-04-25
1032Italy2026-03-31
1033Germany2026-04-20
1034Canada2026-04-08
1035India2026-04-18
1036Japan2026-03-29
1037India2026-04-09
1038Australia2026-04-23
1039Spain2026-04-10
1040Italy2026-04-05
1041Australia2026-03-30
1042United Kingdom2026-04-26
1043United Kingdom2026-04-23
1044United Kingdom2026-04-22
1045Spain2026-03-30
1046Argentina2026-03-29
1047Canada2026-03-28
1048United Kingdom2026-03-29
1049Italy2026-03-30

On-Demand Data

NameIdCountryDate
Leon Oldroyd1000Italy2026-04-03
Morrow Ruta1001Russia2026-04-11
Antonio Caudy1002Argentina2026-03-31
Octavia Malet1003Russia2026-04-09
Wickens Nestle1004Argentina2026-04-04
Johnson Sergi1005Canada2026-04-08
Izzy Garufi1006Germany2026-04-23
Antonio Caudy1007Brazil2026-03-30
Aika Inouye1008France2026-04-23
Nicolas Iturbide1009Brazil2026-04-11
Kadeem Flosi1010Canada2026-04-25
Izzy Garufi1011Australia2026-04-19
Isabel Bowley1012Canada2026-04-08
Claire Tollner1013Australia2026-04-13
Nicolas Iturbide1014Brazil2026-04-08
Antonio Caudy1015Spain2026-03-31
Kaitlin Ostrosky1016Russia2026-04-16
Wickens Nestle1017Argentina2026-04-04
Isabel Bowley1018Russia2026-04-20
Chavez Briddick1019United Kingdom2026-04-21
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Ivar PaprockiRussiaAsiya Javayant QUALIFIED
Francesco ShinkoJapanElwin Sharvill PROPOSAL
Leja CaldareraCanadaOnyama Limba NEW
Salvatore StockhamSpainOnyama Limba PROPOSAL
Jennifer AmigonArgentinaAsiya Javayant RENEWAL
Morrow RutaIndiaIvan Magalhaes NEGOTIATION
Deepesh ChuiIndiaIvan Magalhaes PROPOSAL
Claire TollnerAustraliaElwin Sharvill RENEWAL
Wickens NestleAustraliaAmy Elsner RENEWAL
Munro FerenczSpainAmy Elsner PROPOSAL
Aika InouyeGermanyIoni Bowcher RENEWAL
Antonio CaudyArgentinaOnyama Limba NEGOTIATION
Salvatore StockhamArgentinaAsiya Javayant QUALIFIED
Ashley DoeAustraliaStephen Shaw QUALIFIED
Izzy GarufiIndiaElwin Sharvill QUALIFIED
Leon OldroydUnited KingdomIoni Bowcher PROPOSAL
Jeanfrancois VenereFranceIvan Magalhaes PROPOSAL
Leja CaldareraItalyBernardo Dominic PROPOSAL
Leon OldroydAustraliaAsiya Javayant PROPOSAL
Ashley DoeJapanAsiya Javayant PROPOSAL
Ivar PaprockiAustraliaElwin Sharvill NEW
Morrow RutaAustraliaXuxue Feng PROPOSAL
Cody SaylorsAustraliaElwin Sharvill NEGOTIATION
Misaki RoysterRussiaIvan Magalhaes RENEWAL
Greenwood BologniaUnited KingdomBernardo Dominic UNQUALIFIED
Chavez BriddickIndiaBernardo Dominic RENEWAL
Antonio CaudySpainXuxue Feng QUALIFIED
Maisha RulapaughItalyOnyama Limba PROPOSAL
Francesco ShinkoBrazilAmy Elsner RENEWAL
Julie StensethRussiaAnna Fali UNQUALIFIED
Chavez BriddickGermanyAsiya Javayant NEGOTIATION
Leja CaldareraIndiaAmy Elsner UNQUALIFIED
Emily WhobreyJapanBernardo Dominic NEW
Adams MorascaCanadaIvan Magalhaes QUALIFIED
Aruna FigeroaJapanStephen Shaw QUALIFIED
Stacey MacleadBrazilAmy Elsner QUALIFIED
Costa DilliardIndiaBernardo Dominic UNQUALIFIED
Chavez BriddickRussiaIoni Bowcher UNQUALIFIED
Morrow RutaRussiaElwin Sharvill NEGOTIATION
Misaki RoysterIndiaXuxue Feng 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>