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
Stacey MacleadSpainXuxue Feng QUALIFIED
Misaki RoysterSpainAsiya Javayant NEW
Greenwood BologniaBrazilAnna Fali NEGOTIATION
Sinclair WaycottRussiaIoni Bowcher RENEWAL
Aika InouyeFranceStephen Shaw NEGOTIATION
Adams MorascaSpainAnna Fali PROPOSAL
Chavez BriddickFranceIvan Magalhaes RENEWAL
Antonio CaudyRussiaXuxue Feng QUALIFIED
David DarakjyUnited KingdomXuxue Feng PROPOSAL
Sinclair WaycottCanadaBernardo Dominic QUALIFIED
Arvin AlbaresBrazilElwin Sharvill RENEWAL
Murillo MaletUnited KingdomStephen Shaw PROPOSAL
Tony FollerItalyStephen Shaw QUALIFIED
Maisha RulapaughUnited KingdomBernardo Dominic RENEWAL
Darci PoquetteItalyStephen Shaw RENEWAL
Kadeem FlosiIndiaStephen Shaw QUALIFIED
Silvio SlusarskiSpainIvan Magalhaes NEGOTIATION
Arvin AlbaresCanadaElwin Sharvill NEGOTIATION
Aika InouyeBrazilIoni Bowcher UNQUALIFIED
Francesco ShinkoFranceAnna Fali QUALIFIED
Faith GillianRussiaIvan Magalhaes RENEWAL
Maria MarrierRussiaAnna Fali NEW
Deepesh ChuiArgentinaBernardo Dominic RENEWAL
Silvio SlusarskiBrazilIoni Bowcher UNQUALIFIED
Antonio CaudyJapanAsiya Javayant NEW
Darci PoquetteCanadaIvan Magalhaes QUALIFIED
Ricardo GauchoAustraliaAnna Fali PROPOSAL
Morrow RutaItalyAsiya Javayant PROPOSAL
James ButtUnited KingdomAmy Elsner RENEWAL
Jones VocelkaGermanyAnna Fali NEW
Murillo MaletGermanyIoni Bowcher NEW
Adams MorascaRussiaAmy Elsner PROPOSAL
Ricardo GauchoAustraliaAnna Fali NEGOTIATION
Deepesh ChuiBrazilOnyama Limba UNQUALIFIED
Alejandro PerinSpainAsiya Javayant NEGOTIATION
Jefferson SchemmerBrazilElwin Sharvill PROPOSAL
Costa DilliardGermanyOnyama Limba UNQUALIFIED
Stacey MacleadItalyElwin Sharvill RENEWAL
Rodrigues CampainIndiaAnna Fali NEW
Rodrigues CampainArgentinaXuxue Feng NEW
Izzy GarufiSpainBernardo Dominic UNQUALIFIED
Leja CaldareraItalyAsiya Javayant UNQUALIFIED
Maria MarrierBrazilIoni Bowcher NEGOTIATION
Antonio CaudyGermanyIoni Bowcher NEGOTIATION
Ricardo GauchoBrazilAsiya Javayant UNQUALIFIED
Silvio SlusarskiFranceIvan Magalhaes NEGOTIATION
Costa DilliardFranceStephen Shaw NEW
Aditya KuskoBrazilXuxue Feng NEGOTIATION
Octavia MaletGermanyIvan Magalhaes RENEWAL
Ricardo GauchoArgentinaElwin Sharvill PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Jones VocelkaArgentinaIvan Magalhaes NEGOTIATION
Deepesh ChuiFranceBernardo Dominic NEW
Tony FollerFranceAnna Fali NEGOTIATION
Jefferson SchemmerArgentinaOnyama Limba PROPOSAL
David DarakjyRussiaElwin Sharvill QUALIFIED
Julie StensethSpainXuxue Feng UNQUALIFIED
David DarakjyRussiaAmy Elsner UNQUALIFIED
Leja CaldareraCanadaAmy Elsner QUALIFIED
Julie StensethBrazilOnyama Limba NEGOTIATION
Greenwood BologniaBrazilAnna Fali PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Maria MarrierBrazil2026-04-01Feiner Bros QUALIFIED78Bernardo Dominic
1001Arvin AlbaresAustralia2026-04-27Feiner Bros UNQUALIFIED77Ioni Bowcher
1002Stacey MacleadArgentina2026-03-31Rousseaux, Michael Esq RENEWAL65Onyama Limba
1003Murillo MaletCanada2026-04-03Morlong Associates UNQUALIFIED63Elwin Sharvill
1004Cody SaylorsJapan2026-04-24King, Christopher A Esq QUALIFIED94Xuxue Feng
1005Misaki RoysterUnited Kingdom2026-04-11Rangoni Of Florence NEGOTIATION89Stephen Shaw
1006Tony FollerIndia2026-04-08Feltz Printing Service NEW61Anna Fali
1007Johnson SergiBrazil2026-04-27Printing Dimensions UNQUALIFIED89Onyama Limba
1008Nicolas IturbideIndia2026-04-12Printing Dimensions UNQUALIFIED27Ioni Bowcher
1009Kaitlin OstroskyItaly2026-04-08Chanay, Jeffrey A Esq RENEWAL87Ivan Magalhaes
1010Leja CaldareraCanada2026-04-09Buckley Miller Wright PROPOSAL94Bernardo Dominic
1011Faith GillianUnited Kingdom2026-04-27Dorl, James J Esq UNQUALIFIED33Asiya Javayant
1012James ButtRussia2026-04-14Buckley Miller Wright QUALIFIED21Asiya Javayant
1013Cody SaylorsItaly2026-04-11Rousseaux, Michael Esq RENEWAL1Elwin Sharvill
1014Antonio CaudyBrazil2026-04-20Truhlar And Truhlar Attys PROPOSAL54Xuxue Feng
1015Mayumi KolmetzJapan2026-04-25Feiner Bros NEW6Amy Elsner
1016Emily WhobreyArgentina2026-04-20Chapman, Ross E Esq RENEWAL19Amy Elsner
1017David DarakjyFrance2026-04-10Chemel, James L Cpa QUALIFIED73Amy Elsner
1018Ricardo GauchoRussia2026-04-25Benton, John B Jr NEW45Stephen Shaw
1019Aika InouyeRussia2026-04-23Feltz Printing Service UNQUALIFIED27Asiya Javayant
1020Adams MorascaAustralia2026-04-26Morlong Associates UNQUALIFIED31Ioni Bowcher
1021Darci PoquetteGermany2026-04-25Dorl, James J Esq UNQUALIFIED39Anna Fali
1022Ivar PaprockiBrazil2026-04-10Chemel, James L Cpa UNQUALIFIED46Onyama Limba
1023Johnson SergiIndia2026-04-07Rousseaux, Michael Esq RENEWAL97Asiya Javayant
1024Munro FerenczArgentina2026-04-22Rousseaux, Michael Esq RENEWAL42Onyama Limba
1025Chavez BriddickIndia2026-04-23King, Christopher A Esq NEGOTIATION81Onyama Limba
1026Izzy GarufiArgentina2026-04-10Chanay, Jeffrey A Esq QUALIFIED94Stephen Shaw
1027Tony FollerGermany2026-04-06Rangoni Of Florence PROPOSAL85Stephen Shaw
1028Alejandro PerinUnited Kingdom2026-04-14Chapman, Ross E Esq UNQUALIFIED59Bernardo Dominic
1029Tony FollerFrance2026-04-29Buckley Miller Wright RENEWAL63Elwin Sharvill
1030Jennifer AmigonRussia2026-04-10Morlong Associates RENEWAL42Ivan Magalhaes
1031James ButtJapan2026-04-19Morlong Associates NEW8Bernardo Dominic
1032Darci PoquetteFrance2026-04-08Feiner Bros UNQUALIFIED21Asiya Javayant
1033Aika InouyeFrance2026-04-07Chapman, Ross E Esq NEGOTIATION90Stephen Shaw
1034Octavia MaletCanada2026-04-28Benton, John B Jr PROPOSAL49Amy Elsner
1035Misaki RoysterItaly2026-04-15Buckley Miller Wright QUALIFIED0Amy Elsner
1036Kadeem FlosiJapan2026-04-26Chanay, Jeffrey A Esq NEGOTIATION54Anna Fali
1037Claire TollnerCanada2026-04-20Benton, John B Jr NEW80Ioni Bowcher
1038Johnson SergiJapan2026-04-02Buckley Miller Wright NEW93Elwin Sharvill
1039Jefferson SchemmerAustralia2026-04-10King, Christopher A Esq RENEWAL16Elwin Sharvill
1040Costa DilliardJapan2026-04-28Chanay, Jeffrey A Esq PROPOSAL17Anna Fali
1041Emily WhobreyIndia2026-04-03Chanay, Jeffrey A Esq NEW62Bernardo Dominic
1042Salvatore StockhamFrance2026-04-26Feiner Bros UNQUALIFIED15Asiya Javayant
1043Clifford RimSpain2026-04-05Chapman, Ross E Esq PROPOSAL85Asiya Javayant
1044Maria MarrierCanada2026-04-27Truhlar And Truhlar Attys RENEWAL7Bernardo Dominic
1045Alejandro PerinGermany2026-04-18Dorl, James J Esq NEW70Amy Elsner
1046Octavia MaletIndia2026-04-14Chapman, Ross E Esq QUALIFIED37Elwin Sharvill
1047Greenwood BologniaBrazil2026-04-22Rousseaux, Michael Esq RENEWAL39Asiya Javayant
1048Mayumi KolmetzSpain2026-04-22Chapman, Ross E Esq PROPOSAL10Bernardo Dominic
1049James ButtCanada2026-04-09Feltz Printing Service NEW14Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Johnson SergiRussiaBernardo Dominic UNQUALIFIED
Alejandro PerinItalyIvan Magalhaes QUALIFIED
Kaitlin OstroskyIndiaXuxue Feng NEW
Misaki RoysterJapanBernardo Dominic NEW
Rodrigues CampainCanadaAsiya Javayant QUALIFIED
Juan WieserJapanStephen Shaw NEGOTIATION
Greenwood BologniaIndiaIvan Magalhaes RENEWAL
Octavia MaletCanadaIvan Magalhaes NEGOTIATION
Johnson SergiFranceOnyama Limba QUALIFIED
Adams MorascaArgentinaAnna Fali PROPOSAL
Jefferson SchemmerAustraliaIvan Magalhaes QUALIFIED
Jennifer AmigonItalyIvan Magalhaes NEW
Misaki RoysterRussiaStephen Shaw RENEWAL
Johnson SergiUnited KingdomAmy Elsner UNQUALIFIED
Jefferson SchemmerUnited KingdomXuxue Feng QUALIFIED
David DarakjyIndiaBernardo Dominic RENEWAL
Kadeem FlosiArgentinaElwin Sharvill UNQUALIFIED
Leja CaldareraUnited KingdomElwin Sharvill UNQUALIFIED
Kadeem FlosiUnited KingdomIoni Bowcher UNQUALIFIED
Greenwood BologniaCanadaOnyama Limba UNQUALIFIED
Tony FollerAustraliaBernardo Dominic NEW
Misaki RoysterCanadaAsiya Javayant PROPOSAL
Mayumi KolmetzGermanyAmy Elsner PROPOSAL
Tony FollerGermanyElwin Sharvill RENEWAL
Juan WieserArgentinaBernardo Dominic PROPOSAL
Aditya KuskoAustraliaIvan Magalhaes NEGOTIATION
Stacey MacleadSpainElwin Sharvill NEW
Jeanfrancois VenereRussiaXuxue Feng PROPOSAL
Jennifer AmigonGermanyAmy Elsner RENEWAL
Aditya KuskoFranceAmy Elsner NEGOTIATION
Smith GlickUnited KingdomOnyama Limba RENEWAL
Chavez BriddickFranceBernardo Dominic PROPOSAL
Faith GillianBrazilElwin Sharvill PROPOSAL
Murillo MaletFranceAmy Elsner QUALIFIED
Deepesh ChuiArgentinaElwin Sharvill UNQUALIFIED
Arvin AlbaresRussiaElwin Sharvill NEW
Ivar PaprockiSpainAsiya Javayant NEGOTIATION
Salvatore StockhamItalyAnna Fali QUALIFIED
Jennifer AmigonCanadaAmy Elsner QUALIFIED
Kadeem FlosiAustraliaAnna Fali RENEWAL
Emily WhobreyRussiaOnyama Limba UNQUALIFIED
Aditya KuskoUnited KingdomAnna Fali UNQUALIFIED
Darci PoquetteSpainAsiya Javayant RENEWAL
Antonio CaudyIndiaXuxue Feng PROPOSAL
Octavia MaletBrazilIoni Bowcher PROPOSAL
Ricardo GauchoUnited KingdomElwin Sharvill NEGOTIATION
Kaitlin OstroskyArgentinaAnna Fali QUALIFIED
Claire TollnerGermanyXuxue Feng RENEWAL
Francesco ShinkoRussiaXuxue Feng NEW
Jefferson SchemmerArgentinaIvan Magalhaes QUALIFIED
Frozen Columns
Name
Francesco Shinko
Antonio Caudy
Rodrigues Campain
Izzy Garufi
Mujtaba Nicka
Maria Marrier
Darci Poquette
Juan Wieser
Tony Foller
Morrow Ruta
Leja Caldarera
Tony Foller
Kadeem Flosi
Nicolas Iturbide
Salvatore Stockham
Cody Saylors
Munro Ferencz
Salvatore Stockham
Juan Wieser
Wickens Nestle
Aruna Figeroa
Leon Oldroyd
Jones Vocelka
Jefferson Schemmer
Ricardo Gaucho
Darci Poquette
Rodrigues Campain
Deepesh Chui
Jennifer Amigon
Wickens Nestle
Greenwood Bolognia
Mayumi Kolmetz
Ivar Paprocki
Aruna Figeroa
Leja Caldarera
Juan Wieser
Kaitlin Ostrosky
Ashley Doe
Emily Whobrey
Izzy Garufi
Chavez Briddick
Stacey Maclead
Jeanfrancois Venere
Mujtaba Nicka
Julie Stenseth
Juan Wieser
Costa Dilliard
Murillo Malet
Izzy Garufi
Rodrigues Campain
IdCountryDate
1000Brazil2026-04-29
1001Australia2026-04-27
1002India2026-04-12
1003United Kingdom2026-04-21
1004Canada2026-04-11
1005Canada2026-04-20
1006Germany2026-04-29
1007Japan2026-04-20
1008Canada2026-03-31
1009Russia2026-04-26
1010Russia2026-04-23
1011Canada2026-04-29
1012Argentina2026-04-03
1013Italy2026-04-20
1014France2026-04-18
1015Germany2026-04-02
1016United Kingdom2026-04-28
1017United Kingdom2026-04-01
1018Argentina2026-04-16
1019Japan2026-04-28
1020Spain2026-04-05
1021Spain2026-04-23
1022Russia2026-04-23
1023Japan2026-04-05
1024Germany2026-04-29
1025Australia2026-04-03
1026Brazil2026-04-23
1027Brazil2026-04-09
1028Spain2026-04-18
1029Argentina2026-04-01
1030Canada2026-04-11
1031India2026-04-26
1032United Kingdom2026-04-15
1033Japan2026-04-08
1034Russia2026-04-23
1035Canada2026-04-09
1036Germany2026-04-24
1037Russia2026-04-14
1038Russia2026-04-15
1039Argentina2026-04-29
1040Spain2026-04-29
1041Russia2026-04-03
1042India2026-04-05
1043Canada2026-04-13
1044Brazil2026-04-29
1045India2026-04-11
1046Argentina2026-04-29
1047Spain2026-04-27
1048United Kingdom2026-04-26
1049France2026-04-28

On-Demand Data

NameIdCountryDate
Clifford Rim1000United Kingdom2026-04-27
Jones Vocelka1001Germany2026-04-18
James Butt1002Canada2026-04-22
Ashley Doe1003Italy2026-04-01
Murillo Malet1004Germany2026-04-25
Silvio Slusarski1005Spain2026-04-28
Arvin Albares1006Canada2026-04-10
James Butt1007Argentina2026-04-11
Jefferson Schemmer1008India2026-04-10
Munro Ferencz1009Australia2026-04-09
Octavia Malet1010Spain2026-04-02
Salvatore Stockham1011Japan2026-04-05
Juan Wieser1012Canada2026-04-11
Murillo Malet1013France2026-04-02
Misaki Royster1014Germany2026-04-23
Stacey Maclead1015United Kingdom2026-04-29
Mayumi Kolmetz1016Australia2026-04-16
Aditya Kusko1017Russia2026-04-10
Ivar Paprocki1018Brazil2026-04-22
Jefferson Schemmer1019Japan2026-04-05
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Smith GlickFranceElwin Sharvill PROPOSAL
Aruna FigeroaRussiaElwin Sharvill RENEWAL
Isabel BowleySpainAnna Fali PROPOSAL
Rodrigues CampainUnited KingdomStephen Shaw QUALIFIED
Silvio SlusarskiCanadaIvan Magalhaes UNQUALIFIED
Mayumi KolmetzGermanyAmy Elsner PROPOSAL
Tony FollerFranceBernardo Dominic UNQUALIFIED
Rodrigues CampainGermanyAsiya Javayant RENEWAL
Isabel BowleyAustraliaAmy Elsner NEW
Sinclair WaycottRussiaAsiya Javayant QUALIFIED
Clifford RimCanadaAsiya Javayant NEW
Jeanfrancois VenereRussiaOnyama Limba NEGOTIATION
Julie StensethArgentinaAmy Elsner NEW
Salvatore StockhamItalyElwin Sharvill PROPOSAL
Ricardo GauchoUnited KingdomStephen Shaw QUALIFIED
Octavia MaletUnited KingdomIoni Bowcher NEGOTIATION
Antonio CaudyItalyAnna Fali QUALIFIED
Clifford RimCanadaIvan Magalhaes PROPOSAL
Jefferson SchemmerGermanyAnna Fali NEW
Greenwood BologniaFranceIoni Bowcher UNQUALIFIED
Cody SaylorsAustraliaElwin Sharvill RENEWAL
Sinclair WaycottFranceElwin Sharvill QUALIFIED
Jones VocelkaItalyIoni Bowcher NEGOTIATION
Kadeem FlosiJapanIvan Magalhaes NEW
Stacey MacleadItalyStephen Shaw NEGOTIATION
Costa DilliardIndiaAmy Elsner NEW
Rodrigues CampainRussiaXuxue Feng NEGOTIATION
Aruna FigeroaArgentinaAsiya Javayant NEGOTIATION
Chavez BriddickGermanyElwin Sharvill NEGOTIATION
Antonio CaudySpainIvan Magalhaes RENEWAL
Jeanfrancois VenereIndiaAnna Fali RENEWAL
Izzy GarufiSpainAnna Fali RENEWAL
Jefferson SchemmerUnited KingdomAnna Fali UNQUALIFIED
Wickens NestleRussiaIoni Bowcher RENEWAL
Mujtaba NickaItalyIvan Magalhaes RENEWAL
Clifford RimGermanyXuxue Feng NEW
Rodrigues CampainGermanyAmy Elsner QUALIFIED
Silvio SlusarskiRussiaIoni Bowcher UNQUALIFIED
Aruna FigeroaBrazilIoni Bowcher UNQUALIFIED
Octavia MaletGermanyOnyama Limba NEW

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