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
Cody SaylorsFranceStephen Shaw NEGOTIATION
Jones VocelkaAustraliaIvan Magalhaes RENEWAL
Emily WhobreyIndiaIoni Bowcher NEW
Arvin AlbaresBrazilBernardo Dominic NEW
Leja CaldareraFranceElwin Sharvill RENEWAL
James ButtItalyAsiya Javayant UNQUALIFIED
Costa DilliardRussiaIvan Magalhaes PROPOSAL
Stacey MacleadIndiaOnyama Limba RENEWAL
Isabel BowleyAustraliaElwin Sharvill PROPOSAL
Johnson SergiIndiaElwin Sharvill RENEWAL
Leja CaldareraIndiaIvan Magalhaes NEGOTIATION
Murillo MaletCanadaXuxue Feng PROPOSAL
Greenwood BologniaIndiaBernardo Dominic UNQUALIFIED
Juan WieserItalyElwin Sharvill UNQUALIFIED
Wickens NestleFranceAsiya Javayant NEGOTIATION
Julie StensethIndiaXuxue Feng RENEWAL
Jennifer AmigonJapanElwin Sharvill RENEWAL
Silvio SlusarskiCanadaBernardo Dominic RENEWAL
Johnson SergiIndiaAmy Elsner NEGOTIATION
Smith GlickIndiaAnna Fali QUALIFIED
Nicolas IturbideFranceElwin Sharvill QUALIFIED
Cody SaylorsFranceAmy Elsner QUALIFIED
Arvin AlbaresBrazilAmy Elsner UNQUALIFIED
Aruna FigeroaBrazilXuxue Feng NEGOTIATION
Darci PoquetteSpainAnna Fali NEW
Alejandro PerinCanadaIoni Bowcher PROPOSAL
Johnson SergiRussiaXuxue Feng PROPOSAL
Tony FollerItalyAnna Fali NEGOTIATION
Leja CaldareraGermanyIoni Bowcher UNQUALIFIED
Jefferson SchemmerFranceIvan Magalhaes UNQUALIFIED
Izzy GarufiRussiaIvan Magalhaes NEW
Alejandro PerinAustraliaIvan Magalhaes QUALIFIED
Clifford RimIndiaXuxue Feng UNQUALIFIED
Arvin AlbaresSpainElwin Sharvill NEW
Jefferson SchemmerArgentinaStephen Shaw RENEWAL
Emily WhobreyFranceAnna Fali QUALIFIED
Izzy GarufiSpainOnyama Limba UNQUALIFIED
Rodrigues CampainAustraliaIoni Bowcher PROPOSAL
Adams MorascaRussiaAnna Fali RENEWAL
Mujtaba NickaGermanyElwin Sharvill NEW
Deepesh ChuiJapanAmy Elsner UNQUALIFIED
Izzy GarufiJapanXuxue Feng QUALIFIED
Chavez BriddickRussiaStephen Shaw NEW
Izzy GarufiCanadaElwin Sharvill RENEWAL
Maria MarrierItalyOnyama Limba UNQUALIFIED
Johnson SergiItalyAnna Fali PROPOSAL
Darci PoquetteBrazilOnyama Limba PROPOSAL
Aika InouyeUnited KingdomAmy Elsner NEGOTIATION
Jeanfrancois VenereAustraliaIoni Bowcher QUALIFIED
Silvio SlusarskiUnited KingdomAmy Elsner NEW
Horizontal
NameCountryRepresentativeStatus
Adams MorascaRussiaElwin Sharvill NEGOTIATION
James ButtBrazilElwin Sharvill UNQUALIFIED
Jeanfrancois VenereAustraliaStephen Shaw NEGOTIATION
Faith GillianArgentinaAnna Fali QUALIFIED
Mayumi KolmetzJapanXuxue Feng QUALIFIED
Juan WieserIndiaElwin Sharvill QUALIFIED
Wickens NestleUnited KingdomIoni Bowcher UNQUALIFIED
Mujtaba NickaCanadaIvan Magalhaes NEGOTIATION
Arvin AlbaresGermanyBernardo Dominic UNQUALIFIED
Darci PoquetteUnited KingdomAsiya Javayant UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Chavez BriddickItaly2026-05-30Feltz Printing Service PROPOSAL22Anna Fali
1001Aruna FigeroaRussia2026-06-11Commercial Press NEGOTIATION73Ivan Magalhaes
1002Kadeem FlosiItaly2026-06-10King, Christopher A Esq QUALIFIED6Stephen Shaw
1003Sinclair WaycottAustralia2026-06-02Benton, John B Jr RENEWAL98Onyama Limba
1004Kadeem FlosiUnited Kingdom2026-06-01Morlong Associates PROPOSAL0Ivan Magalhaes
1005Emily WhobreyArgentina2026-06-17Chanay, Jeffrey A Esq NEW89Ivan Magalhaes
1006Cody SaylorsUnited Kingdom2026-05-30Rangoni Of Florence QUALIFIED23Xuxue Feng
1007Ashley DoeCanada2026-05-28Rangoni Of Florence NEW83Asiya Javayant
1008Claire TollnerAustralia2026-06-18Dorl, James J Esq QUALIFIED17Anna Fali
1009Adams MorascaArgentina2026-05-26Rangoni Of Florence RENEWAL8Asiya Javayant
1010Johnson SergiJapan2026-06-04Morlong Associates QUALIFIED53Amy Elsner
1011Clifford RimSpain2026-06-05Chanay, Jeffrey A Esq NEGOTIATION65Amy Elsner
1012Antonio CaudyArgentina2026-05-23Rangoni Of Florence QUALIFIED12Ioni Bowcher
1013Ricardo GauchoItaly2026-06-06Commercial Press PROPOSAL63Bernardo Dominic
1014David DarakjyArgentina2026-06-18Printing Dimensions NEGOTIATION44Bernardo Dominic
1015Alejandro PerinGermany2026-06-03Chemel, James L Cpa PROPOSAL6Ioni Bowcher
1016Alejandro PerinIndia2026-05-31Buckley Miller Wright UNQUALIFIED2Amy Elsner
1017Misaki RoysterFrance2026-06-12Morlong Associates NEW48Elwin Sharvill
1018Leon OldroydJapan2026-06-03Truhlar And Truhlar Attys NEW4Amy Elsner
1019Kadeem FlosiJapan2026-06-07Commercial Press NEW92Ivan Magalhaes
1020Greenwood BologniaFrance2026-06-20Benton, John B Jr RENEWAL62Ivan Magalhaes
1021Alejandro PerinUnited Kingdom2026-06-11Printing Dimensions NEGOTIATION4Anna Fali
1022Cody SaylorsUnited Kingdom2026-06-08Feiner Bros PROPOSAL11Stephen Shaw
1023Francesco ShinkoCanada2026-05-26Dorl, James J Esq PROPOSAL78Ioni Bowcher
1024Sinclair WaycottJapan2026-05-23Feiner Bros RENEWAL60Elwin Sharvill
1025Claire TollnerFrance2026-05-27Feiner Bros RENEWAL5Ioni Bowcher
1026Aditya KuskoRussia2026-06-16Chanay, Jeffrey A Esq NEW97Bernardo Dominic
1027Silvio SlusarskiBrazil2026-06-05Benton, John B Jr NEGOTIATION32Xuxue Feng
1028Wickens NestleArgentina2026-06-01Benton, John B Jr PROPOSAL18Onyama Limba
1029Wickens NestleFrance2026-06-15Commercial Press UNQUALIFIED92Stephen Shaw
1030Stacey MacleadCanada2026-06-05Feltz Printing Service RENEWAL28Bernardo Dominic
1031David DarakjyArgentina2026-05-31Chapman, Ross E Esq NEW49Onyama Limba
1032Julie StensethCanada2026-06-12King, Christopher A Esq PROPOSAL98Stephen Shaw
1033Johnson SergiIndia2026-06-05Buckley Miller Wright PROPOSAL67Amy Elsner
1034Ashley DoeArgentina2026-06-11Rousseaux, Michael Esq QUALIFIED8Elwin Sharvill
1035Wickens NestleSpain2026-05-29Chapman, Ross E Esq QUALIFIED39Stephen Shaw
1036Francesco ShinkoGermany2026-06-03Rangoni Of Florence NEGOTIATION10Elwin Sharvill
1037Murillo MaletArgentina2026-06-11Chemel, James L Cpa PROPOSAL70Ivan Magalhaes
1038Costa DilliardIndia2026-06-02King, Christopher A Esq NEW27Asiya Javayant
1039Cody SaylorsGermany2026-06-08Dorl, James J Esq PROPOSAL4Onyama Limba
1040Costa DilliardFrance2026-05-25Dorl, James J Esq NEGOTIATION60Stephen Shaw
1041Ivar PaprockiAustralia2026-06-13Feltz Printing Service RENEWAL60Onyama Limba
1042Greenwood BologniaAustralia2026-06-15Chapman, Ross E Esq UNQUALIFIED33Bernardo Dominic
1043Nicolas IturbideCanada2026-06-09Chapman, Ross E Esq NEGOTIATION81Onyama Limba
1044Arvin AlbaresSpain2026-06-05King, Christopher A Esq PROPOSAL67Ivan Magalhaes
1045Leon OldroydSpain2026-06-05Commercial Press QUALIFIED99Ioni Bowcher
1046Cody SaylorsArgentina2026-05-28Benton, John B Jr PROPOSAL47Ivan Magalhaes
1047Silvio SlusarskiAustralia2026-06-09Chanay, Jeffrey A Esq NEW52Bernardo Dominic
1048Antonio CaudyBrazil2026-05-27Benton, John B Jr PROPOSAL85Stephen Shaw
1049Stacey MacleadBrazil2026-06-20Morlong Associates NEW87Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Antonio CaudyRussiaAnna Fali PROPOSAL
Aditya KuskoArgentinaIoni Bowcher PROPOSAL
Izzy GarufiCanadaOnyama Limba RENEWAL
Arvin AlbaresGermanyAsiya Javayant UNQUALIFIED
Mujtaba NickaJapanBernardo Dominic NEW
Clifford RimIndiaStephen Shaw NEW
Cody SaylorsArgentinaIoni Bowcher RENEWAL
Murillo MaletSpainAnna Fali NEGOTIATION
Misaki RoysterUnited KingdomXuxue Feng NEW
Mujtaba NickaRussiaXuxue Feng PROPOSAL
Rodrigues CampainSpainIoni Bowcher RENEWAL
Tony FollerRussiaAnna Fali UNQUALIFIED
Wickens NestleSpainXuxue Feng NEGOTIATION
Ivar PaprockiFranceIoni Bowcher NEW
Darci PoquetteUnited KingdomXuxue Feng UNQUALIFIED
Ricardo GauchoFranceStephen Shaw NEGOTIATION
Leon OldroydUnited KingdomElwin Sharvill NEW
Jeanfrancois VenereIndiaXuxue Feng PROPOSAL
Octavia MaletArgentinaBernardo Dominic PROPOSAL
Kaitlin OstroskyRussiaAsiya Javayant QUALIFIED
James ButtBrazilElwin Sharvill QUALIFIED
Chavez BriddickArgentinaOnyama Limba PROPOSAL
Ricardo GauchoJapanAmy Elsner RENEWAL
Mujtaba NickaGermanyElwin Sharvill PROPOSAL
Jefferson SchemmerJapanAsiya Javayant PROPOSAL
Izzy GarufiIndiaXuxue Feng NEW
Misaki RoysterIndiaAmy Elsner NEW
Cody SaylorsUnited KingdomXuxue Feng QUALIFIED
Munro FerenczItalyOnyama Limba NEW
Adams MorascaUnited KingdomOnyama Limba PROPOSAL
James ButtRussiaAnna Fali UNQUALIFIED
Salvatore StockhamItalyIvan Magalhaes RENEWAL
Tony FollerUnited KingdomXuxue Feng RENEWAL
Kaitlin OstroskyAustraliaAsiya Javayant NEGOTIATION
Rodrigues CampainUnited KingdomIoni Bowcher NEW
Rodrigues CampainSpainStephen Shaw PROPOSAL
Arvin AlbaresIndiaAsiya Javayant PROPOSAL
Murillo MaletRussiaAsiya Javayant RENEWAL
Kaitlin OstroskyJapanAsiya Javayant NEGOTIATION
Murillo MaletArgentinaBernardo Dominic PROPOSAL
Morrow RutaUnited KingdomIvan Magalhaes PROPOSAL
Kaitlin OstroskyGermanyBernardo Dominic UNQUALIFIED
Juan WieserGermanyIoni Bowcher PROPOSAL
Sinclair WaycottCanadaAnna Fali NEW
James ButtIndiaStephen Shaw NEW
Izzy GarufiItalyXuxue Feng PROPOSAL
Adams MorascaFranceElwin Sharvill PROPOSAL
Salvatore StockhamAustraliaStephen Shaw NEW
Wickens NestleArgentinaElwin Sharvill QUALIFIED
Ricardo GauchoGermanyAmy Elsner UNQUALIFIED
Frozen Columns
Name
Stacey Maclead
Jennifer Amigon
Octavia Malet
Stacey Maclead
Rodrigues Campain
Arvin Albares
Kadeem Flosi
Leja Caldarera
Munro Ferencz
Morrow Ruta
Munro Ferencz
Deepesh Chui
Mayumi Kolmetz
David Darakjy
Antonio Caudy
Jefferson Schemmer
Adams Morasca
Juan Wieser
Greenwood Bolognia
Sinclair Waycott
Emily Whobrey
Jennifer Amigon
Greenwood Bolognia
Smith Glick
Faith Gillian
Clifford Rim
Silvio Slusarski
Rodrigues Campain
Aditya Kusko
Jeanfrancois Venere
Wickens Nestle
Ricardo Gaucho
Juan Wieser
Leja Caldarera
Sinclair Waycott
Emily Whobrey
Johnson Sergi
Mujtaba Nicka
Izzy Garufi
Adams Morasca
Aditya Kusko
Ivar Paprocki
Silvio Slusarski
Octavia Malet
Greenwood Bolognia
Juan Wieser
Antonio Caudy
Emily Whobrey
James Butt
Adams Morasca
IdCountryDate
1000Spain2026-05-31
1001United Kingdom2026-06-15
1002Japan2026-06-11
1003Japan2026-06-08
1004France2026-05-28
1005United Kingdom2026-06-03
1006India2026-06-12
1007Japan2026-06-19
1008Japan2026-06-10
1009India2026-05-29
1010Australia2026-06-04
1011Argentina2026-05-25
1012Australia2026-06-12
1013Germany2026-06-20
1014India2026-05-26
1015Germany2026-06-04
1016Australia2026-05-28
1017Canada2026-05-22
1018Germany2026-05-25
1019United Kingdom2026-05-29
1020Brazil2026-05-25
1021Russia2026-06-11
1022Argentina2026-06-18
1023Australia2026-06-03
1024Russia2026-06-19
1025Canada2026-06-08
1026France2026-06-06
1027United Kingdom2026-06-16
1028France2026-06-13
1029Italy2026-06-14
1030Italy2026-05-26
1031Russia2026-06-12
1032France2026-06-10
1033India2026-06-04
1034Australia2026-06-13
1035Japan2026-06-02
1036Canada2026-06-12
1037Canada2026-06-06
1038Japan2026-06-12
1039India2026-06-19
1040Brazil2026-06-11
1041Japan2026-06-09
1042France2026-05-30
1043Italy2026-05-22
1044Brazil2026-06-19
1045Russia2026-06-14
1046Brazil2026-06-06
1047Japan2026-05-22
1048Russia2026-06-06
1049Spain2026-06-01

On-Demand Data

NameIdCountryDate
Ashley Doe1000France2026-06-13
David Darakjy1001Australia2026-06-18
Emily Whobrey1002India2026-06-19
Sinclair Waycott1003United Kingdom2026-06-17
Jones Vocelka1004Australia2026-06-02
Isabel Bowley1005Australia2026-06-09
Rodrigues Campain1006Japan2026-05-29
Johnson Sergi1007Argentina2026-05-26
Tony Foller1008Brazil2026-06-18
Aditya Kusko1009India2026-06-12
Kaitlin Ostrosky1010Australia2026-06-08
Arvin Albares1011United Kingdom2026-06-04
Maria Marrier1012United Kingdom2026-06-08
Ashley Doe1013Canada2026-06-03
Leon Oldroyd1014United Kingdom2026-05-29
Aruna Figeroa1015United Kingdom2026-05-31
Arvin Albares1016Italy2026-05-27
Mayumi Kolmetz1017Germany2026-06-03
James Butt1018Italy2026-06-04
Clifford Rim1019Spain2026-06-12
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jeanfrancois VenereAustraliaXuxue Feng NEGOTIATION
Alejandro PerinAustraliaBernardo Dominic QUALIFIED
Faith GillianJapanOnyama Limba UNQUALIFIED
Julie StensethIndiaIoni Bowcher NEGOTIATION
Claire TollnerSpainStephen Shaw NEGOTIATION
Emily WhobreyCanadaOnyama Limba RENEWAL
Mayumi KolmetzCanadaXuxue Feng RENEWAL
Rodrigues CampainFranceStephen Shaw QUALIFIED
Mayumi KolmetzRussiaAmy Elsner NEW
Octavia MaletCanadaAmy Elsner NEW
Leon OldroydItalyAmy Elsner QUALIFIED
James ButtAustraliaElwin Sharvill RENEWAL
Isabel BowleyJapanOnyama Limba QUALIFIED
Antonio CaudyItalyAnna Fali QUALIFIED
Salvatore StockhamUnited KingdomIoni Bowcher NEW
Kaitlin OstroskyUnited KingdomOnyama Limba NEGOTIATION
Leon OldroydAustraliaOnyama Limba UNQUALIFIED
Clifford RimRussiaAmy Elsner PROPOSAL
Silvio SlusarskiArgentinaIvan Magalhaes UNQUALIFIED
Aditya KuskoUnited KingdomIoni Bowcher NEW
Isabel BowleyJapanStephen Shaw PROPOSAL
Clifford RimAustraliaStephen Shaw RENEWAL
Greenwood BologniaRussiaBernardo Dominic RENEWAL
Arvin AlbaresUnited KingdomIvan Magalhaes QUALIFIED
Chavez BriddickRussiaBernardo Dominic QUALIFIED
Smith GlickRussiaAsiya Javayant NEGOTIATION
Maisha RulapaughFranceStephen Shaw QUALIFIED
Emily WhobreyBrazilAnna Fali UNQUALIFIED
Deepesh ChuiFranceAsiya Javayant PROPOSAL
Costa DilliardBrazilAsiya Javayant QUALIFIED
Costa DilliardRussiaElwin Sharvill QUALIFIED
Wickens NestleCanadaElwin Sharvill RENEWAL
Aika InouyeUnited KingdomOnyama Limba UNQUALIFIED
Rodrigues CampainIndiaAmy Elsner NEGOTIATION
Tony FollerUnited KingdomAmy Elsner QUALIFIED
Mujtaba NickaSpainOnyama Limba NEGOTIATION
Rodrigues CampainItalyIvan Magalhaes NEGOTIATION
Izzy GarufiArgentinaXuxue Feng NEGOTIATION
Mayumi KolmetzAustraliaAnna Fali UNQUALIFIED
Misaki RoysterIndiaIoni Bowcher QUALIFIED

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