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
Aika InouyeJapanAnna Fali PROPOSAL
Morrow RutaFranceAsiya Javayant PROPOSAL
Smith GlickCanadaStephen Shaw RENEWAL
Isabel BowleyIndiaBernardo Dominic QUALIFIED
Sinclair WaycottFranceAnna Fali RENEWAL
Aika InouyeAustraliaStephen Shaw PROPOSAL
James ButtFranceStephen Shaw QUALIFIED
Alejandro PerinItalyStephen Shaw NEGOTIATION
James ButtAustraliaAmy Elsner NEW
Salvatore StockhamSpainAsiya Javayant RENEWAL
Alejandro PerinGermanyIoni Bowcher NEGOTIATION
Juan WieserBrazilOnyama Limba QUALIFIED
Johnson SergiIndiaXuxue Feng UNQUALIFIED
Mayumi KolmetzArgentinaElwin Sharvill UNQUALIFIED
Juan WieserRussiaOnyama Limba PROPOSAL
Juan WieserRussiaAsiya Javayant RENEWAL
Morrow RutaFranceIvan Magalhaes QUALIFIED
Morrow RutaUnited KingdomAnna Fali RENEWAL
Ricardo GauchoJapanIoni Bowcher RENEWAL
Stacey MacleadBrazilAmy Elsner PROPOSAL
Ivar PaprockiGermanyAsiya Javayant NEW
Alejandro PerinUnited KingdomElwin Sharvill PROPOSAL
Ricardo GauchoAustraliaAsiya Javayant NEGOTIATION
Wickens NestleIndiaBernardo Dominic PROPOSAL
Arvin AlbaresFranceAmy Elsner NEGOTIATION
Cody SaylorsRussiaIvan Magalhaes UNQUALIFIED
David DarakjyGermanyAsiya Javayant NEGOTIATION
Stacey MacleadSpainXuxue Feng RENEWAL
Rodrigues CampainBrazilElwin Sharvill UNQUALIFIED
James ButtIndiaXuxue Feng PROPOSAL
Cody SaylorsBrazilIvan Magalhaes PROPOSAL
Juan WieserSpainAsiya Javayant UNQUALIFIED
Kaitlin OstroskyJapanBernardo Dominic UNQUALIFIED
Stacey MacleadJapanIvan Magalhaes NEGOTIATION
Isabel BowleyFranceIvan Magalhaes NEGOTIATION
Faith GillianSpainOnyama Limba RENEWAL
Greenwood BologniaJapanStephen Shaw PROPOSAL
Maria MarrierFranceElwin Sharvill UNQUALIFIED
Octavia MaletItalyStephen Shaw NEGOTIATION
Darci PoquetteFranceElwin Sharvill UNQUALIFIED
Kaitlin OstroskySpainOnyama Limba RENEWAL
Rodrigues CampainRussiaIoni Bowcher PROPOSAL
Cody SaylorsIndiaAnna Fali NEW
Greenwood BologniaFranceOnyama Limba NEW
Isabel BowleyUnited KingdomIoni Bowcher PROPOSAL
Francesco ShinkoIndiaOnyama Limba QUALIFIED
Ashley DoeJapanBernardo Dominic UNQUALIFIED
Smith GlickIndiaAmy Elsner UNQUALIFIED
Mujtaba NickaRussiaElwin Sharvill QUALIFIED
James ButtRussiaStephen Shaw QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Cody SaylorsSpainOnyama Limba PROPOSAL
Deepesh ChuiAustraliaOnyama Limba UNQUALIFIED
Murillo MaletIndiaAnna Fali PROPOSAL
Isabel BowleyIndiaAmy Elsner PROPOSAL
Sinclair WaycottArgentinaAsiya Javayant QUALIFIED
Juan WieserIndiaElwin Sharvill NEW
Jennifer AmigonBrazilElwin Sharvill NEGOTIATION
Silvio SlusarskiUnited KingdomIvan Magalhaes QUALIFIED
Wickens NestleGermanyElwin Sharvill NEW
Ivar PaprockiSpainBernardo Dominic QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aditya KuskoIndia2025-10-04Dorl, James J Esq UNQUALIFIED4Asiya Javayant
1001Ashley DoeUnited Kingdom2025-10-13Feltz Printing Service NEW32Bernardo Dominic
1002Deepesh ChuiJapan2025-09-22Dorl, James J Esq NEW56Elwin Sharvill
1003Mayumi KolmetzCanada2025-10-07Dorl, James J Esq RENEWAL45Xuxue Feng
1004Misaki RoysterSpain2025-10-04Chanay, Jeffrey A Esq UNQUALIFIED37Ivan Magalhaes
1005Mujtaba NickaSpain2025-10-16Feiner Bros UNQUALIFIED88Elwin Sharvill
1006Tony FollerJapan2025-09-29Chanay, Jeffrey A Esq UNQUALIFIED81Anna Fali
1007Aruna FigeroaFrance2025-10-05Feiner Bros NEGOTIATION76Ioni Bowcher
1008Faith GillianItaly2025-09-28Buckley Miller Wright UNQUALIFIED45Onyama Limba
1009Francesco ShinkoGermany2025-09-27Benton, John B Jr RENEWAL52Onyama Limba
1010Julie StensethUnited Kingdom2025-10-02Morlong Associates PROPOSAL7Amy Elsner
1011Maria MarrierUnited Kingdom2025-09-30Dorl, James J Esq NEW26Ivan Magalhaes
1012Arvin AlbaresAustralia2025-10-18King, Christopher A Esq UNQUALIFIED97Asiya Javayant
1013Aruna FigeroaFrance2025-09-27Chapman, Ross E Esq NEW66Amy Elsner
1014Johnson SergiIndia2025-09-30Benton, John B Jr RENEWAL29Xuxue Feng
1015Costa DilliardCanada2025-09-23Morlong Associates RENEWAL30Amy Elsner
1016Izzy GarufiGermany2025-09-30Dorl, James J Esq UNQUALIFIED5Ioni Bowcher
1017Julie StensethSpain2025-10-06Benton, John B Jr NEGOTIATION15Anna Fali
1018Isabel BowleyItaly2025-10-13Morlong Associates NEGOTIATION33Bernardo Dominic
1019Sinclair WaycottGermany2025-10-07Feiner Bros QUALIFIED12Amy Elsner
1020Salvatore StockhamSpain2025-10-03Feltz Printing Service PROPOSAL55Bernardo Dominic
1021Izzy GarufiUnited Kingdom2025-10-16Chanay, Jeffrey A Esq UNQUALIFIED55Bernardo Dominic
1022Aditya KuskoCanada2025-10-07Truhlar And Truhlar Attys PROPOSAL59Xuxue Feng
1023Alejandro PerinFrance2025-10-10Commercial Press QUALIFIED71Bernardo Dominic
1024Alejandro PerinJapan2025-10-17Benton, John B Jr UNQUALIFIED22Xuxue Feng
1025Smith GlickIndia2025-09-27Rangoni Of Florence RENEWAL92Onyama Limba
1026Leja CaldareraCanada2025-10-18Feltz Printing Service PROPOSAL4Asiya Javayant
1027Morrow RutaItaly2025-09-24Chanay, Jeffrey A Esq PROPOSAL14Bernardo Dominic
1028Ricardo GauchoCanada2025-10-10Chanay, Jeffrey A Esq RENEWAL39Xuxue Feng
1029Misaki RoysterItaly2025-10-19Chanay, Jeffrey A Esq QUALIFIED99Bernardo Dominic
1030Claire TollnerBrazil2025-09-22Benton, John B Jr RENEWAL2Asiya Javayant
1031Alejandro PerinItaly2025-10-21Rangoni Of Florence PROPOSAL68Bernardo Dominic
1032Aruna FigeroaBrazil2025-10-06Truhlar And Truhlar Attys UNQUALIFIED40Onyama Limba
1033Aruna FigeroaCanada2025-10-20Feltz Printing Service UNQUALIFIED44Anna Fali
1034Johnson SergiArgentina2025-10-02Morlong Associates RENEWAL61Amy Elsner
1035Isabel BowleyFrance2025-10-10Rousseaux, Michael Esq NEW98Asiya Javayant
1036Arvin AlbaresArgentina2025-10-16Rousseaux, Michael Esq UNQUALIFIED4Amy Elsner
1037Aditya KuskoUnited Kingdom2025-10-20Morlong Associates PROPOSAL18Asiya Javayant
1038Jefferson SchemmerUnited Kingdom2025-10-19Chemel, James L Cpa PROPOSAL95Ivan Magalhaes
1039Nicolas IturbideGermany2025-10-15Rangoni Of Florence NEW93Xuxue Feng
1040Kaitlin OstroskyAustralia2025-10-03Rousseaux, Michael Esq PROPOSAL4Amy Elsner
1041Aika InouyeUnited Kingdom2025-10-11Printing Dimensions UNQUALIFIED73Onyama Limba
1042Nicolas IturbideBrazil2025-10-04King, Christopher A Esq NEW16Onyama Limba
1043Aditya KuskoBrazil2025-10-09Chanay, Jeffrey A Esq QUALIFIED75Amy Elsner
1044Cody SaylorsUnited Kingdom2025-10-04Dorl, James J Esq NEW48Anna Fali
1045James ButtFrance2025-10-04Commercial Press PROPOSAL85Anna Fali
1046Deepesh ChuiCanada2025-10-09Chemel, James L Cpa UNQUALIFIED39Amy Elsner
1047Cody SaylorsAustralia2025-10-11Commercial Press PROPOSAL39Ioni Bowcher
1048Tony FollerUnited Kingdom2025-10-12Benton, John B Jr NEW10Ioni Bowcher
1049Sinclair WaycottAustralia2025-10-11Benton, John B Jr NEGOTIATION5Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Mayumi KolmetzJapanOnyama Limba NEW
Cody SaylorsJapanIoni Bowcher RENEWAL
Mayumi KolmetzRussiaBernardo Dominic NEW
Munro FerenczIndiaOnyama Limba UNQUALIFIED
Adams MorascaGermanyStephen Shaw NEW
Leja CaldareraUnited KingdomXuxue Feng UNQUALIFIED
David DarakjyCanadaElwin Sharvill NEW
Stacey MacleadIndiaIvan Magalhaes RENEWAL
Greenwood BologniaAustraliaAmy Elsner NEW
Kaitlin OstroskyRussiaOnyama Limba NEGOTIATION
Johnson SergiCanadaIoni Bowcher NEGOTIATION
Salvatore StockhamJapanAnna Fali RENEWAL
Deepesh ChuiUnited KingdomBernardo Dominic PROPOSAL
Kaitlin OstroskyFranceBernardo Dominic RENEWAL
Isabel BowleySpainStephen Shaw RENEWAL
Mujtaba NickaJapanElwin Sharvill PROPOSAL
Isabel BowleyBrazilOnyama Limba RENEWAL
Mujtaba NickaGermanyIoni Bowcher NEGOTIATION
Aika InouyeFranceBernardo Dominic NEGOTIATION
Leja CaldareraUnited KingdomAmy Elsner UNQUALIFIED
Octavia MaletSpainIvan Magalhaes QUALIFIED
Tony FollerIndiaElwin Sharvill NEGOTIATION
Emily WhobreyGermanyAsiya Javayant RENEWAL
Smith GlickItalyIvan Magalhaes UNQUALIFIED
Aruna FigeroaUnited KingdomOnyama Limba QUALIFIED
Murillo MaletIndiaElwin Sharvill RENEWAL
Munro FerenczUnited KingdomAmy Elsner QUALIFIED
Jones VocelkaAustraliaStephen Shaw NEW
Jeanfrancois VenereFranceAnna Fali RENEWAL
Octavia MaletUnited KingdomAsiya Javayant QUALIFIED
Maria MarrierItalyBernardo Dominic NEGOTIATION
Alejandro PerinJapanAsiya Javayant QUALIFIED
Sinclair WaycottRussiaAmy Elsner UNQUALIFIED
Jefferson SchemmerGermanyIvan Magalhaes QUALIFIED
Johnson SergiJapanAmy Elsner NEW
Munro FerenczGermanyXuxue Feng NEGOTIATION
Stacey MacleadSpainAmy Elsner NEGOTIATION
Antonio CaudySpainIoni Bowcher QUALIFIED
David DarakjyFranceBernardo Dominic QUALIFIED
Alejandro PerinRussiaAsiya Javayant QUALIFIED
Sinclair WaycottCanadaXuxue Feng NEW
Izzy GarufiCanadaStephen Shaw RENEWAL
Ivar PaprockiItalyOnyama Limba PROPOSAL
Murillo MaletBrazilAnna Fali UNQUALIFIED
Adams MorascaAustraliaOnyama Limba RENEWAL
James ButtItalyElwin Sharvill RENEWAL
Jennifer AmigonAustraliaBernardo Dominic QUALIFIED
Ivar PaprockiUnited KingdomStephen Shaw NEW
Francesco ShinkoJapanAnna Fali QUALIFIED
Clifford RimCanadaStephen Shaw NEGOTIATION
Frozen Columns
Name
Costa Dilliard
Wickens Nestle
Aika Inouye
Stacey Maclead
Jones Vocelka
Emily Whobrey
Arvin Albares
Murillo Malet
Antonio Caudy
Costa Dilliard
Aditya Kusko
Izzy Garufi
Morrow Ruta
Maisha Rulapaugh
Mayumi Kolmetz
Antonio Caudy
Ashley Doe
Kaitlin Ostrosky
Deepesh Chui
Adams Morasca
Ricardo Gaucho
Misaki Royster
Isabel Bowley
Mujtaba Nicka
Alejandro Perin
Aditya Kusko
Isabel Bowley
Claire Tollner
Ivar Paprocki
David Darakjy
Chavez Briddick
Alejandro Perin
Ricardo Gaucho
Jones Vocelka
Nicolas Iturbide
Cody Saylors
Misaki Royster
Aditya Kusko
Munro Ferencz
James Butt
Ivar Paprocki
Octavia Malet
Juan Wieser
Sinclair Waycott
Francesco Shinko
Aruna Figeroa
Alejandro Perin
Clifford Rim
Tony Foller
Ashley Doe
IdCountryDate
1000Spain2025-09-28
1001Spain2025-09-30
1002Russia2025-09-26
1003Canada2025-10-07
1004Canada2025-09-26
1005Australia2025-10-16
1006Canada2025-10-01
1007France2025-09-24
1008United Kingdom2025-10-11
1009Italy2025-10-19
1010United Kingdom2025-09-29
1011Spain2025-10-07
1012United Kingdom2025-10-21
1013Italy2025-09-30
1014Spain2025-10-01
1015France2025-10-13
1016Canada2025-09-25
1017Germany2025-10-05
1018France2025-10-19
1019United Kingdom2025-09-22
1020Japan2025-10-15
1021Australia2025-10-02
1022Canada2025-10-13
1023Russia2025-10-17
1024Italy2025-09-28
1025France2025-10-17
1026Argentina2025-10-12
1027Russia2025-09-24
1028Japan2025-09-23
1029India2025-09-24
1030Russia2025-10-05
1031Russia2025-10-19
1032Canada2025-10-02
1033Spain2025-10-03
1034United Kingdom2025-10-16
1035Argentina2025-09-26
1036Spain2025-09-26
1037India2025-10-11
1038France2025-09-23
1039Russia2025-09-29
1040India2025-10-17
1041Japan2025-10-20
1042Canada2025-10-15
1043Germany2025-10-03
1044United Kingdom2025-09-26
1045Argentina2025-09-23
1046Italy2025-10-17
1047Argentina2025-10-09
1048Brazil2025-10-21
1049Italy2025-10-05

On-Demand Data

NameIdCountryDate
Cody Saylors1000Germany2025-10-16
Leon Oldroyd1001Spain2025-10-02
Claire Tollner1002Japan2025-10-16
Jones Vocelka1003Russia2025-10-07
Kaitlin Ostrosky1004Spain2025-10-17
Izzy Garufi1005Canada2025-10-11
Munro Ferencz1006Spain2025-10-06
Costa Dilliard1007Japan2025-10-17
Smith Glick1008Germany2025-10-14
Alejandro Perin1009France2025-10-09
Greenwood Bolognia1010United Kingdom2025-10-03
Cody Saylors1011Italy2025-10-08
Maria Marrier1012India2025-10-02
Francesco Shinko1013France2025-10-20
Aika Inouye1014Japan2025-10-03
Salvatore Stockham1015United Kingdom2025-10-08
Julie Stenseth1016Argentina2025-10-19
Leja Caldarera1017Germany2025-09-24
Ricardo Gaucho1018Russia2025-10-05
Jefferson Schemmer1019Canada2025-10-12
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jennifer AmigonSpainElwin Sharvill RENEWAL
Clifford RimArgentinaOnyama Limba PROPOSAL
Costa DilliardGermanyAmy Elsner UNQUALIFIED
Adams MorascaArgentinaAmy Elsner UNQUALIFIED
Tony FollerSpainAmy Elsner NEGOTIATION
Cody SaylorsRussiaIoni Bowcher NEGOTIATION
Cody SaylorsUnited KingdomStephen Shaw PROPOSAL
Alejandro PerinJapanIoni Bowcher PROPOSAL
Francesco ShinkoGermanyElwin Sharvill RENEWAL
Octavia MaletUnited KingdomStephen Shaw PROPOSAL
James ButtCanadaAsiya Javayant QUALIFIED
Wickens NestleAustraliaElwin Sharvill NEW
Ivar PaprockiSpainAsiya Javayant UNQUALIFIED
Clifford RimArgentinaElwin Sharvill UNQUALIFIED
Wickens NestleBrazilIvan Magalhaes UNQUALIFIED
Maria MarrierGermanyXuxue Feng NEW
Sinclair WaycottArgentinaIoni Bowcher PROPOSAL
Stacey MacleadSpainElwin Sharvill UNQUALIFIED
Claire TollnerArgentinaIoni Bowcher RENEWAL
Kaitlin OstroskySpainAnna Fali PROPOSAL
Cody SaylorsCanadaStephen Shaw UNQUALIFIED
Deepesh ChuiRussiaXuxue Feng PROPOSAL
Claire TollnerSpainBernardo Dominic PROPOSAL
Chavez BriddickSpainXuxue Feng QUALIFIED
Aika InouyeSpainOnyama Limba NEW
Smith GlickGermanyStephen Shaw UNQUALIFIED
Tony FollerUnited KingdomElwin Sharvill RENEWAL
Nicolas IturbideCanadaOnyama Limba NEW
Isabel BowleyIndiaStephen Shaw RENEWAL
Rodrigues CampainAustraliaAnna Fali PROPOSAL
Maisha RulapaughIndiaAsiya Javayant UNQUALIFIED
Clifford RimBrazilIvan Magalhaes RENEWAL
Antonio CaudyRussiaAmy Elsner UNQUALIFIED
Jefferson SchemmerRussiaStephen Shaw QUALIFIED
Rodrigues CampainIndiaStephen Shaw NEW
Costa DilliardBrazilXuxue Feng UNQUALIFIED
Stacey MacleadIndiaElwin Sharvill NEW
Nicolas IturbideCanadaBernardo Dominic PROPOSAL
Emily WhobreyAustraliaOnyama Limba PROPOSAL
James ButtIndiaBernardo Dominic 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>