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
Misaki RoysterJapanAnna Fali NEGOTIATION
Deepesh ChuiIndiaOnyama Limba NEGOTIATION
Clifford RimFranceElwin Sharvill RENEWAL
Munro FerenczBrazilElwin Sharvill PROPOSAL
Adams MorascaJapanAmy Elsner UNQUALIFIED
Stacey MacleadGermanyXuxue Feng NEW
Jones VocelkaIndiaIoni Bowcher NEW
Darci PoquetteJapanElwin Sharvill PROPOSAL
Isabel BowleyUnited KingdomBernardo Dominic UNQUALIFIED
Maria MarrierFranceOnyama Limba PROPOSAL
Maria MarrierJapanAmy Elsner NEW
Antonio CaudySpainElwin Sharvill PROPOSAL
Murillo MaletArgentinaIoni Bowcher RENEWAL
Izzy GarufiFranceIoni Bowcher NEGOTIATION
Jefferson SchemmerAustraliaAmy Elsner QUALIFIED
Leja CaldareraItalyIoni Bowcher QUALIFIED
Misaki RoysterAustraliaIvan Magalhaes PROPOSAL
Arvin AlbaresBrazilElwin Sharvill PROPOSAL
Murillo MaletJapanAmy Elsner RENEWAL
Ricardo GauchoSpainIoni Bowcher UNQUALIFIED
Ricardo GauchoSpainIvan Magalhaes RENEWAL
Antonio CaudyJapanIoni Bowcher QUALIFIED
Maisha RulapaughBrazilBernardo Dominic PROPOSAL
Mujtaba NickaGermanyIvan Magalhaes NEW
Ashley DoeFranceAsiya Javayant NEW
Aditya KuskoIndiaOnyama Limba NEW
Aika InouyeBrazilAmy Elsner QUALIFIED
Deepesh ChuiJapanIvan Magalhaes NEW
James ButtFranceIvan Magalhaes QUALIFIED
Jeanfrancois VenereCanadaOnyama Limba NEGOTIATION
Darci PoquetteCanadaAsiya Javayant QUALIFIED
Faith GillianIndiaAmy Elsner RENEWAL
Jones VocelkaIndiaXuxue Feng UNQUALIFIED
Alejandro PerinSpainOnyama Limba NEGOTIATION
James ButtBrazilAnna Fali PROPOSAL
Mujtaba NickaJapanElwin Sharvill NEW
James ButtArgentinaAmy Elsner PROPOSAL
Smith GlickAustraliaElwin Sharvill PROPOSAL
Kaitlin OstroskyGermanyOnyama Limba NEGOTIATION
Clifford RimArgentinaAnna Fali RENEWAL
Costa DilliardSpainElwin Sharvill RENEWAL
Mayumi KolmetzArgentinaOnyama Limba UNQUALIFIED
Juan WieserIndiaElwin Sharvill PROPOSAL
Ivar PaprockiIndiaElwin Sharvill PROPOSAL
Mujtaba NickaIndiaBernardo Dominic RENEWAL
Jeanfrancois VenereIndiaElwin Sharvill PROPOSAL
Jefferson SchemmerCanadaElwin Sharvill PROPOSAL
Jennifer AmigonAustraliaAnna Fali QUALIFIED
Johnson SergiIndiaElwin Sharvill NEW
Mayumi KolmetzUnited KingdomStephen Shaw NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Aditya KuskoArgentinaOnyama Limba RENEWAL
Murillo MaletArgentinaElwin Sharvill RENEWAL
Leon OldroydItalyIvan Magalhaes RENEWAL
Arvin AlbaresBrazilBernardo Dominic NEGOTIATION
Johnson SergiBrazilXuxue Feng QUALIFIED
Maria MarrierCanadaOnyama Limba QUALIFIED
Munro FerenczCanadaIvan Magalhaes NEW
Johnson SergiBrazilAmy Elsner NEW
Mujtaba NickaCanadaXuxue Feng QUALIFIED
Morrow RutaArgentinaIoni Bowcher QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Ivar PaprockiGermany2025-08-14Rousseaux, Michael Esq RENEWAL63Xuxue Feng
1001Aditya KuskoSpain2025-07-17Feiner Bros NEGOTIATION6Xuxue Feng
1002Murillo MaletItaly2025-08-06Rangoni Of Florence PROPOSAL92Elwin Sharvill
1003Tony FollerCanada2025-08-09Rousseaux, Michael Esq UNQUALIFIED28Asiya Javayant
1004Aruna FigeroaCanada2025-07-20Chanay, Jeffrey A Esq UNQUALIFIED88Asiya Javayant
1005Juan WieserGermany2025-08-01King, Christopher A Esq QUALIFIED29Ivan Magalhaes
1006Faith GillianUnited Kingdom2025-08-14Feltz Printing Service NEW47Ivan Magalhaes
1007Silvio SlusarskiAustralia2025-08-13Rousseaux, Michael Esq RENEWAL79Amy Elsner
1008Aditya KuskoArgentina2025-08-10Chapman, Ross E Esq NEGOTIATION58Ioni Bowcher
1009Jennifer AmigonGermany2025-08-08Rousseaux, Michael Esq UNQUALIFIED93Ioni Bowcher
1010Murillo MaletRussia2025-07-19Benton, John B Jr NEW24Anna Fali
1011Izzy GarufiGermany2025-07-26Printing Dimensions NEGOTIATION27Anna Fali
1012Emily WhobreyGermany2025-07-18King, Christopher A Esq UNQUALIFIED73Stephen Shaw
1013Leon OldroydIndia2025-08-15Rangoni Of Florence PROPOSAL46Ioni Bowcher
1014Johnson SergiSpain2025-07-22Morlong Associates UNQUALIFIED25Ivan Magalhaes
1015Aika InouyeSpain2025-07-30Commercial Press PROPOSAL55Xuxue Feng
1016Wickens NestleFrance2025-07-24Feiner Bros NEW61Xuxue Feng
1017Emily WhobreyAustralia2025-08-05Benton, John B Jr NEW74Anna Fali
1018Morrow RutaAustralia2025-07-23Dorl, James J Esq RENEWAL17Asiya Javayant
1019Julie StensethAustralia2025-07-25Chapman, Ross E Esq UNQUALIFIED39Ioni Bowcher
1020Murillo MaletFrance2025-08-08Chanay, Jeffrey A Esq QUALIFIED9Amy Elsner
1021Kaitlin OstroskyUnited Kingdom2025-08-08Buckley Miller Wright UNQUALIFIED51Stephen Shaw
1022Claire TollnerArgentina2025-07-29Printing Dimensions UNQUALIFIED89Anna Fali
1023Mayumi KolmetzUnited Kingdom2025-08-14Feltz Printing Service NEGOTIATION12Bernardo Dominic
1024Misaki RoysterSpain2025-07-26Benton, John B Jr UNQUALIFIED89Ioni Bowcher
1025Maisha RulapaughJapan2025-08-09Dorl, James J Esq QUALIFIED7Xuxue Feng
1026Silvio SlusarskiItaly2025-08-10Chanay, Jeffrey A Esq PROPOSAL88Ivan Magalhaes
1027Kaitlin OstroskyIndia2025-07-24Morlong Associates NEW53Elwin Sharvill
1028Deepesh ChuiCanada2025-08-01Benton, John B Jr RENEWAL6Stephen Shaw
1029Antonio CaudyCanada2025-07-23Chemel, James L Cpa NEGOTIATION59Stephen Shaw
1030Mayumi KolmetzUnited Kingdom2025-08-05Chanay, Jeffrey A Esq UNQUALIFIED84Amy Elsner
1031Wickens NestleArgentina2025-08-08Commercial Press UNQUALIFIED2Stephen Shaw
1032Julie StensethBrazil2025-07-22Truhlar And Truhlar Attys PROPOSAL54Onyama Limba
1033Sinclair WaycottRussia2025-08-04Benton, John B Jr NEW69Ioni Bowcher
1034James ButtIndia2025-07-17Buckley Miller Wright UNQUALIFIED55Asiya Javayant
1035Murillo MaletGermany2025-08-11Benton, John B Jr NEGOTIATION87Ioni Bowcher
1036Misaki RoysterUnited Kingdom2025-07-22Chemel, James L Cpa NEW31Bernardo Dominic
1037Faith GillianGermany2025-07-26Morlong Associates RENEWAL93Xuxue Feng
1038Mayumi KolmetzArgentina2025-07-24Chemel, James L Cpa PROPOSAL34Asiya Javayant
1039Morrow RutaUnited Kingdom2025-08-03Truhlar And Truhlar Attys NEGOTIATION67Amy Elsner
1040Kaitlin OstroskyJapan2025-08-09Morlong Associates NEW93Ioni Bowcher
1041Wickens NestleJapan2025-07-18Rousseaux, Michael Esq NEGOTIATION87Asiya Javayant
1042Leon OldroydIndia2025-07-28Chanay, Jeffrey A Esq UNQUALIFIED57Elwin Sharvill
1043Mujtaba NickaFrance2025-07-28Chanay, Jeffrey A Esq UNQUALIFIED98Elwin Sharvill
1044Arvin AlbaresBrazil2025-07-19Benton, John B Jr PROPOSAL84Stephen Shaw
1045Wickens NestleBrazil2025-08-02Printing Dimensions PROPOSAL96Asiya Javayant
1046Antonio CaudyUnited Kingdom2025-07-30Commercial Press QUALIFIED17Xuxue Feng
1047Costa DilliardItaly2025-07-31Rousseaux, Michael Esq UNQUALIFIED49Ivan Magalhaes
1048Juan WieserArgentina2025-07-18Rangoni Of Florence QUALIFIED93Asiya Javayant
1049Sinclair WaycottBrazil2025-08-05Chemel, James L Cpa NEGOTIATION1Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Murillo MaletFranceBernardo Dominic NEGOTIATION
Jefferson SchemmerBrazilAmy Elsner NEGOTIATION
Mayumi KolmetzGermanyAmy Elsner NEW
Ashley DoeIndiaAsiya Javayant UNQUALIFIED
Jones VocelkaGermanyAsiya Javayant RENEWAL
Ricardo GauchoItalyOnyama Limba RENEWAL
Julie StensethAustraliaIoni Bowcher PROPOSAL
Munro FerenczCanadaIvan Magalhaes NEW
Izzy GarufiSpainElwin Sharvill NEW
Ashley DoeUnited KingdomIoni Bowcher RENEWAL
David DarakjyFranceAmy Elsner NEW
Salvatore StockhamCanadaElwin Sharvill NEW
Francesco ShinkoAustraliaXuxue Feng RENEWAL
Claire TollnerItalyAsiya Javayant NEGOTIATION
Jeanfrancois VenereUnited KingdomAmy Elsner PROPOSAL
Silvio SlusarskiRussiaBernardo Dominic NEW
Octavia MaletGermanyAnna Fali NEGOTIATION
Greenwood BologniaBrazilAnna Fali UNQUALIFIED
Mayumi KolmetzBrazilIvan Magalhaes PROPOSAL
Rodrigues CampainArgentinaAnna Fali RENEWAL
Octavia MaletUnited KingdomXuxue Feng QUALIFIED
Wickens NestleIndiaElwin Sharvill QUALIFIED
Maria MarrierUnited KingdomBernardo Dominic PROPOSAL
Jones VocelkaUnited KingdomBernardo Dominic NEW
Jones VocelkaAustraliaAsiya Javayant UNQUALIFIED
Ivar PaprockiUnited KingdomIoni Bowcher QUALIFIED
Isabel BowleyFranceOnyama Limba RENEWAL
Johnson SergiItalyXuxue Feng RENEWAL
Ashley DoeArgentinaBernardo Dominic RENEWAL
Maria MarrierSpainIoni Bowcher NEW
Isabel BowleyJapanAmy Elsner QUALIFIED
Greenwood BologniaRussiaBernardo Dominic NEGOTIATION
David DarakjyAustraliaElwin Sharvill RENEWAL
Leon OldroydFranceAnna Fali UNQUALIFIED
Ashley DoeFranceElwin Sharvill RENEWAL
Arvin AlbaresGermanyOnyama Limba NEW
Morrow RutaSpainElwin Sharvill RENEWAL
Emily WhobreyFranceBernardo Dominic NEGOTIATION
Ricardo GauchoGermanyElwin Sharvill NEW
Mayumi KolmetzAustraliaIoni Bowcher NEGOTIATION
Nicolas IturbideBrazilBernardo Dominic QUALIFIED
Johnson SergiFranceIvan Magalhaes PROPOSAL
Jefferson SchemmerGermanyOnyama Limba QUALIFIED
Jeanfrancois VenereGermanyStephen Shaw NEW
Juan WieserArgentinaElwin Sharvill NEGOTIATION
Jeanfrancois VenereIndiaIoni Bowcher QUALIFIED
Murillo MaletArgentinaIoni Bowcher PROPOSAL
Kaitlin OstroskyFranceIvan Magalhaes NEGOTIATION
Octavia MaletCanadaBernardo Dominic UNQUALIFIED
Jeanfrancois VenereCanadaElwin Sharvill RENEWAL
Frozen Columns
Name
Maria Marrier
James Butt
Cody Saylors
Jeanfrancois Venere
Munro Ferencz
Aditya Kusko
Aika Inouye
Octavia Malet
Greenwood Bolognia
Ashley Doe
Cody Saylors
Misaki Royster
Wickens Nestle
Alejandro Perin
Maria Marrier
James Butt
Francesco Shinko
Salvatore Stockham
Adams Morasca
Sinclair Waycott
Ivar Paprocki
Greenwood Bolognia
Antonio Caudy
Salvatore Stockham
Adams Morasca
Chavez Briddick
Morrow Ruta
Alejandro Perin
Antonio Caudy
Tony Foller
Morrow Ruta
James Butt
Clifford Rim
Salvatore Stockham
Mujtaba Nicka
Emily Whobrey
Leja Caldarera
Jeanfrancois Venere
Octavia Malet
James Butt
Nicolas Iturbide
Jefferson Schemmer
Octavia Malet
Murillo Malet
Faith Gillian
Julie Stenseth
Mayumi Kolmetz
Sinclair Waycott
Misaki Royster
Tony Foller
IdCountryDate
1000Brazil2025-08-09
1001Spain2025-07-24
1002United Kingdom2025-08-11
1003India2025-08-11
1004Brazil2025-08-08
1005Australia2025-08-07
1006Italy2025-08-05
1007France2025-07-23
1008Italy2025-07-22
1009Russia2025-08-15
1010United Kingdom2025-08-02
1011India2025-08-01
1012Argentina2025-08-10
1013France2025-08-02
1014Canada2025-08-14
1015Spain2025-08-06
1016Italy2025-07-29
1017India2025-08-11
1018India2025-07-23
1019Canada2025-08-13
1020France2025-08-03
1021United Kingdom2025-08-03
1022Russia2025-08-11
1023India2025-08-09
1024France2025-07-25
1025Spain2025-08-02
1026Russia2025-07-22
1027United Kingdom2025-08-11
1028Russia2025-07-21
1029Italy2025-07-18
1030United Kingdom2025-08-01
1031United Kingdom2025-08-05
1032France2025-07-28
1033Australia2025-07-26
1034Russia2025-08-05
1035Spain2025-07-22
1036India2025-08-03
1037Argentina2025-08-14
1038France2025-07-24
1039Germany2025-08-07
1040India2025-07-30
1041Canada2025-08-03
1042United Kingdom2025-08-06
1043France2025-08-10
1044Argentina2025-07-19
1045France2025-08-13
1046Japan2025-08-13
1047Australia2025-08-03
1048Italy2025-07-25
1049Italy2025-08-04

On-Demand Data

NameIdCountryDate
Mayumi Kolmetz1000Germany2025-07-25
Darci Poquette1001Argentina2025-07-27
Misaki Royster1002Australia2025-07-29
James Butt1003Canada2025-07-17
Ivar Paprocki1004Italy2025-08-05
Octavia Malet1005Australia2025-07-26
Darci Poquette1006Italy2025-08-13
Julie Stenseth1007United Kingdom2025-07-21
Ricardo Gaucho1008Italy2025-08-12
Morrow Ruta1009India2025-07-29
Aika Inouye1010Canada2025-07-21
Jones Vocelka1011Australia2025-08-12
Maria Marrier1012France2025-08-02
Izzy Garufi1013Spain2025-07-22
Silvio Slusarski1014Russia2025-07-27
Aika Inouye1015United Kingdom2025-08-01
Isabel Bowley1016Russia2025-07-31
James Butt1017Russia2025-07-29
Nicolas Iturbide1018Italy2025-08-10
Faith Gillian1019Italy2025-07-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Chavez BriddickUnited KingdomStephen Shaw QUALIFIED
Isabel BowleyArgentinaAnna Fali NEW
Juan WieserSpainBernardo Dominic NEGOTIATION
James ButtFranceXuxue Feng PROPOSAL
Antonio CaudyAustraliaStephen Shaw PROPOSAL
Clifford RimSpainOnyama Limba NEW
Tony FollerRussiaXuxue Feng PROPOSAL
Sinclair WaycottItalyIvan Magalhaes PROPOSAL
Johnson SergiFranceIvan Magalhaes UNQUALIFIED
Emily WhobreyItalyElwin Sharvill RENEWAL
Clifford RimFranceOnyama Limba NEW
Darci PoquetteUnited KingdomElwin Sharvill NEW
Jefferson SchemmerUnited KingdomAnna Fali NEGOTIATION
Murillo MaletJapanAsiya Javayant NEGOTIATION
Adams MorascaJapanElwin Sharvill RENEWAL
Morrow RutaGermanyIoni Bowcher PROPOSAL
Jones VocelkaItalyIvan Magalhaes NEGOTIATION
Adams MorascaCanadaElwin Sharvill PROPOSAL
Ivar PaprockiBrazilXuxue Feng PROPOSAL
Jones VocelkaItalyOnyama Limba UNQUALIFIED
Wickens NestleCanadaElwin Sharvill NEW
Cody SaylorsUnited KingdomElwin Sharvill NEGOTIATION
Leja CaldareraFranceAmy Elsner RENEWAL
Johnson SergiCanadaAmy Elsner PROPOSAL
Wickens NestleJapanIvan Magalhaes NEW
Aruna FigeroaBrazilIoni Bowcher RENEWAL
Kadeem FlosiSpainIvan Magalhaes QUALIFIED
Faith GillianFranceOnyama Limba QUALIFIED
Julie StensethArgentinaStephen Shaw UNQUALIFIED
Antonio CaudyAustraliaAsiya Javayant PROPOSAL
Isabel BowleyCanadaAmy Elsner UNQUALIFIED
Alejandro PerinIndiaAsiya Javayant PROPOSAL
Mujtaba NickaArgentinaBernardo Dominic PROPOSAL
Arvin AlbaresBrazilOnyama Limba UNQUALIFIED
Octavia MaletJapanIvan Magalhaes UNQUALIFIED
Johnson SergiSpainAnna Fali PROPOSAL
Arvin AlbaresBrazilBernardo Dominic UNQUALIFIED
Leja CaldareraBrazilStephen Shaw PROPOSAL
Kaitlin OstroskyRussiaElwin Sharvill UNQUALIFIED
Alejandro PerinItalyXuxue Feng NEGOTIATION

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