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 RoysterArgentinaOnyama Limba NEGOTIATION
Aruna FigeroaIndiaIvan Magalhaes NEW
Aruna FigeroaArgentinaIvan Magalhaes UNQUALIFIED
James ButtSpainStephen Shaw UNQUALIFIED
James ButtSpainAnna Fali UNQUALIFIED
Mujtaba NickaRussiaIoni Bowcher QUALIFIED
Salvatore StockhamGermanyAmy Elsner RENEWAL
James ButtJapanBernardo Dominic QUALIFIED
Leja CaldareraCanadaAmy Elsner PROPOSAL
Chavez BriddickArgentinaOnyama Limba RENEWAL
Maisha RulapaughCanadaAnna Fali RENEWAL
Murillo MaletGermanyAsiya Javayant NEW
Claire TollnerRussiaAsiya Javayant PROPOSAL
Johnson SergiIndiaElwin Sharvill PROPOSAL
Sinclair WaycottGermanyAsiya Javayant RENEWAL
Kaitlin OstroskyCanadaElwin Sharvill RENEWAL
Francesco ShinkoRussiaOnyama Limba NEGOTIATION
Salvatore StockhamSpainBernardo Dominic UNQUALIFIED
Mayumi KolmetzGermanyBernardo Dominic NEGOTIATION
Nicolas IturbideAustraliaIoni Bowcher UNQUALIFIED
James ButtGermanyOnyama Limba PROPOSAL
Misaki RoysterIndiaAsiya Javayant PROPOSAL
Sinclair WaycottAustraliaAsiya Javayant NEGOTIATION
Morrow RutaSpainIoni Bowcher UNQUALIFIED
Aika InouyeJapanAmy Elsner PROPOSAL
Emily WhobreyAustraliaIvan Magalhaes NEGOTIATION
Julie StensethUnited KingdomOnyama Limba UNQUALIFIED
Ricardo GauchoFranceIvan Magalhaes UNQUALIFIED
Claire TollnerAustraliaBernardo Dominic UNQUALIFIED
Nicolas IturbideBrazilStephen Shaw NEW
Claire TollnerArgentinaBernardo Dominic NEGOTIATION
Kaitlin OstroskyItalyIvan Magalhaes RENEWAL
Morrow RutaItalyStephen Shaw PROPOSAL
Adams MorascaBrazilAmy Elsner RENEWAL
Aditya KuskoCanadaXuxue Feng NEW
Chavez BriddickRussiaAsiya Javayant RENEWAL
Leja CaldareraFranceIoni Bowcher PROPOSAL
Jefferson SchemmerArgentinaAmy Elsner NEW
Octavia MaletJapanStephen Shaw RENEWAL
Nicolas IturbideIndiaXuxue Feng UNQUALIFIED
Jeanfrancois VenereRussiaIoni Bowcher UNQUALIFIED
Emily WhobreyItalyXuxue Feng NEW
Johnson SergiJapanOnyama Limba QUALIFIED
Claire TollnerRussiaStephen Shaw QUALIFIED
Jeanfrancois VenereRussiaElwin Sharvill NEW
Mujtaba NickaIndiaAsiya Javayant RENEWAL
Clifford RimSpainAsiya Javayant RENEWAL
Aika InouyeArgentinaOnyama Limba PROPOSAL
Mayumi KolmetzRussiaElwin Sharvill NEGOTIATION
Tony FollerRussiaAnna Fali NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Chavez BriddickAustraliaXuxue Feng UNQUALIFIED
Greenwood BologniaJapanStephen Shaw NEGOTIATION
Isabel BowleyBrazilIvan Magalhaes RENEWAL
Deepesh ChuiSpainAnna Fali PROPOSAL
Ricardo GauchoBrazilAnna Fali QUALIFIED
Jennifer AmigonCanadaAmy Elsner RENEWAL
Izzy GarufiCanadaXuxue Feng QUALIFIED
Maria MarrierFranceElwin Sharvill NEW
Johnson SergiItalyOnyama Limba PROPOSAL
Salvatore StockhamUnited KingdomAnna Fali NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Alejandro PerinItaly2025-09-02Commercial Press RENEWAL69Xuxue Feng
1001Aditya KuskoCanada2025-08-14Printing Dimensions RENEWAL90Onyama Limba
1002Antonio CaudyJapan2025-08-19Morlong Associates RENEWAL63Anna Fali
1003Juan WieserCanada2025-08-15Chapman, Ross E Esq RENEWAL7Bernardo Dominic
1004Isabel BowleySpain2025-08-15Chanay, Jeffrey A Esq PROPOSAL35Bernardo Dominic
1005Isabel BowleyItaly2025-09-11Chapman, Ross E Esq UNQUALIFIED59Xuxue Feng
1006Silvio SlusarskiJapan2025-08-25Rousseaux, Michael Esq RENEWAL91Stephen Shaw
1007Morrow RutaIndia2025-09-09Rangoni Of Florence QUALIFIED50Elwin Sharvill
1008Francesco ShinkoIndia2025-09-07Morlong Associates NEGOTIATION24Ivan Magalhaes
1009Smith GlickGermany2025-09-08Benton, John B Jr PROPOSAL99Elwin Sharvill
1010Cody SaylorsSpain2025-08-26Chemel, James L Cpa RENEWAL20Xuxue Feng
1011James ButtCanada2025-08-26Chemel, James L Cpa NEW89Amy Elsner
1012Izzy GarufiJapan2025-09-05Chapman, Ross E Esq QUALIFIED90Anna Fali
1013Faith GillianArgentina2025-08-19Commercial Press NEW27Elwin Sharvill
1014Faith GillianCanada2025-09-11Printing Dimensions QUALIFIED5Elwin Sharvill
1015Morrow RutaSpain2025-09-06King, Christopher A Esq UNQUALIFIED2Ivan Magalhaes
1016Wickens NestleUnited Kingdom2025-08-27Chapman, Ross E Esq UNQUALIFIED10Amy Elsner
1017Mayumi KolmetzGermany2025-08-30Chemel, James L Cpa QUALIFIED10Elwin Sharvill
1018Cody SaylorsSpain2025-09-10Rousseaux, Michael Esq PROPOSAL0Elwin Sharvill
1019Leja CaldareraJapan2025-09-05Feiner Bros NEGOTIATION37Elwin Sharvill
1020Faith GillianRussia2025-08-14Morlong Associates UNQUALIFIED13Asiya Javayant
1021Claire TollnerArgentina2025-08-15Chanay, Jeffrey A Esq NEGOTIATION24Bernardo Dominic
1022Darci PoquetteAustralia2025-09-05Printing Dimensions PROPOSAL52Onyama Limba
1023Nicolas IturbideCanada2025-08-28Chanay, Jeffrey A Esq NEGOTIATION41Onyama Limba
1024James ButtCanada2025-08-19Rangoni Of Florence PROPOSAL85Bernardo Dominic
1025Stacey MacleadItaly2025-08-27Dorl, James J Esq NEW72Anna Fali
1026Stacey MacleadCanada2025-09-12Buckley Miller Wright PROPOSAL63Asiya Javayant
1027Claire TollnerAustralia2025-09-10King, Christopher A Esq UNQUALIFIED12Stephen Shaw
1028Maisha RulapaughArgentina2025-09-05Rangoni Of Florence NEGOTIATION43Asiya Javayant
1029Kadeem FlosiSpain2025-09-05Buckley Miller Wright QUALIFIED8Ivan Magalhaes
1030Mujtaba NickaAustralia2025-08-27Morlong Associates UNQUALIFIED57Elwin Sharvill
1031Tony FollerSpain2025-08-16Truhlar And Truhlar Attys PROPOSAL53Asiya Javayant
1032Claire TollnerRussia2025-08-14Morlong Associates RENEWAL11Xuxue Feng
1033Salvatore StockhamBrazil2025-08-23Printing Dimensions QUALIFIED25Amy Elsner
1034David DarakjySpain2025-09-02Rousseaux, Michael Esq UNQUALIFIED36Amy Elsner
1035Tony FollerRussia2025-09-06King, Christopher A Esq NEGOTIATION28Amy Elsner
1036Antonio CaudyRussia2025-08-28Chanay, Jeffrey A Esq QUALIFIED31Asiya Javayant
1037Wickens NestleArgentina2025-08-14Rousseaux, Michael Esq NEGOTIATION40Anna Fali
1038Clifford RimFrance2025-09-07King, Christopher A Esq NEW34Anna Fali
1039Wickens NestleFrance2025-08-31Printing Dimensions UNQUALIFIED58Bernardo Dominic
1040Adams MorascaFrance2025-09-05Feltz Printing Service NEW83Elwin Sharvill
1041Emily WhobreyJapan2025-09-07Rangoni Of Florence NEW69Anna Fali
1042Johnson SergiFrance2025-08-20Commercial Press NEGOTIATION12Xuxue Feng
1043Octavia MaletAustralia2025-08-23Printing Dimensions RENEWAL28Ioni Bowcher
1044Silvio SlusarskiItaly2025-08-30Chapman, Ross E Esq RENEWAL68Amy Elsner
1045Misaki RoysterRussia2025-08-26King, Christopher A Esq NEW3Amy Elsner
1046Wickens NestleIndia2025-08-16Morlong Associates NEGOTIATION3Bernardo Dominic
1047Smith GlickIndia2025-09-01Commercial Press NEGOTIATION57Onyama Limba
1048Mayumi KolmetzFrance2025-09-11Rangoni Of Florence NEW16Stephen Shaw
1049Salvatore StockhamJapan2025-09-09Buckley Miller Wright RENEWAL60Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Clifford RimAustraliaOnyama Limba UNQUALIFIED
Maria MarrierRussiaBernardo Dominic PROPOSAL
Greenwood BologniaArgentinaAnna Fali NEGOTIATION
Tony FollerBrazilIoni Bowcher UNQUALIFIED
Aruna FigeroaCanadaIoni Bowcher NEGOTIATION
Leja CaldareraSpainBernardo Dominic NEW
Ashley DoeAustraliaBernardo Dominic PROPOSAL
Nicolas IturbideRussiaIoni Bowcher NEW
Jeanfrancois VenereArgentinaAmy Elsner PROPOSAL
Kaitlin OstroskyAustraliaBernardo Dominic QUALIFIED
Leja CaldareraSpainAmy Elsner UNQUALIFIED
Jeanfrancois VenereGermanyAsiya Javayant QUALIFIED
Claire TollnerSpainBernardo Dominic NEGOTIATION
Aika InouyeAustraliaBernardo Dominic UNQUALIFIED
Kadeem FlosiGermanyAsiya Javayant UNQUALIFIED
Sinclair WaycottIndiaAmy Elsner RENEWAL
Alejandro PerinItalyAmy Elsner QUALIFIED
Claire TollnerArgentinaAmy Elsner PROPOSAL
Mujtaba NickaUnited KingdomElwin Sharvill NEGOTIATION
Mayumi KolmetzAustraliaElwin Sharvill QUALIFIED
Leja CaldareraRussiaIvan Magalhaes QUALIFIED
Faith GillianJapanBernardo Dominic RENEWAL
Maria MarrierUnited KingdomAnna Fali PROPOSAL
Munro FerenczFranceXuxue Feng NEGOTIATION
Alejandro PerinArgentinaXuxue Feng NEGOTIATION
Alejandro PerinBrazilAnna Fali RENEWAL
Juan WieserArgentinaXuxue Feng PROPOSAL
Aika InouyeCanadaXuxue Feng QUALIFIED
Greenwood BologniaUnited KingdomOnyama Limba NEW
Greenwood BologniaCanadaAmy Elsner UNQUALIFIED
Smith GlickRussiaBernardo Dominic QUALIFIED
Kaitlin OstroskyArgentinaIvan Magalhaes NEW
Adams MorascaUnited KingdomElwin Sharvill NEGOTIATION
Antonio CaudyUnited KingdomIoni Bowcher PROPOSAL
Rodrigues CampainSpainIoni Bowcher NEGOTIATION
Rodrigues CampainItalyStephen Shaw PROPOSAL
Munro FerenczIndiaXuxue Feng PROPOSAL
Aruna FigeroaGermanyIoni Bowcher NEGOTIATION
Jones VocelkaItalyBernardo Dominic RENEWAL
Jefferson SchemmerAustraliaBernardo Dominic NEGOTIATION
Mayumi KolmetzSpainIvan Magalhaes NEW
Alejandro PerinUnited KingdomOnyama Limba QUALIFIED
Silvio SlusarskiIndiaAnna Fali NEGOTIATION
Leja CaldareraRussiaAmy Elsner RENEWAL
Ricardo GauchoItalyAsiya Javayant PROPOSAL
Leja CaldareraIndiaAnna Fali UNQUALIFIED
Munro FerenczAustraliaAmy Elsner NEGOTIATION
Ivar PaprockiBrazilIoni Bowcher NEW
Johnson SergiIndiaAnna Fali UNQUALIFIED
Ashley DoeItalyAsiya Javayant UNQUALIFIED
Frozen Columns
Name
Greenwood Bolognia
Jeanfrancois Venere
Jefferson Schemmer
Silvio Slusarski
Chavez Briddick
Sinclair Waycott
Faith Gillian
Jeanfrancois Venere
Claire Tollner
Rodrigues Campain
Kadeem Flosi
Ricardo Gaucho
Wickens Nestle
Jefferson Schemmer
Emily Whobrey
Ashley Doe
James Butt
Clifford Rim
Jennifer Amigon
Faith Gillian
Maria Marrier
Kadeem Flosi
Jefferson Schemmer
Izzy Garufi
Aika Inouye
Emily Whobrey
Smith Glick
Francesco Shinko
Izzy Garufi
Adams Morasca
Faith Gillian
Rodrigues Campain
James Butt
James Butt
James Butt
Costa Dilliard
Jennifer Amigon
Sinclair Waycott
Deepesh Chui
Leon Oldroyd
Jones Vocelka
Jones Vocelka
Ashley Doe
Darci Poquette
Greenwood Bolognia
Chavez Briddick
Darci Poquette
Morrow Ruta
Greenwood Bolognia
Juan Wieser
IdCountryDate
1000Argentina2025-08-28
1001United Kingdom2025-09-07
1002Australia2025-09-06
1003Canada2025-09-02
1004Germany2025-08-26
1005Australia2025-09-07
1006Argentina2025-08-24
1007Canada2025-08-27
1008France2025-08-16
1009United Kingdom2025-09-01
1010Germany2025-08-31
1011Japan2025-08-18
1012Canada2025-09-04
1013Brazil2025-09-05
1014Spain2025-09-09
1015Argentina2025-09-10
1016Argentina2025-09-08
1017United Kingdom2025-08-18
1018India2025-09-01
1019Australia2025-09-10
1020Canada2025-09-08
1021United Kingdom2025-09-08
1022United Kingdom2025-08-25
1023France2025-08-24
1024Spain2025-09-10
1025Germany2025-09-05
1026Germany2025-09-03
1027Australia2025-08-25
1028Russia2025-09-08
1029Canada2025-09-06
1030Japan2025-08-18
1031India2025-08-20
1032Canada2025-08-18
1033United Kingdom2025-08-22
1034Italy2025-09-05
1035Australia2025-09-06
1036Italy2025-08-29
1037Germany2025-09-11
1038India2025-08-29
1039Argentina2025-08-20
1040Australia2025-09-11
1041India2025-09-07
1042Spain2025-09-08
1043Italy2025-08-17
1044United Kingdom2025-09-02
1045India2025-08-31
1046India2025-08-27
1047United Kingdom2025-08-26
1048India2025-09-04
1049Canada2025-08-19

On-Demand Data

NameIdCountryDate
Maisha Rulapaugh1000Argentina2025-09-11
Misaki Royster1001Russia2025-09-04
Kaitlin Ostrosky1002Australia2025-09-01
Deepesh Chui1003Russia2025-08-29
Leja Caldarera1004Italy2025-08-30
Adams Morasca1005Germany2025-09-10
Julie Stenseth1006Russia2025-09-05
Faith Gillian1007Spain2025-09-06
Kaitlin Ostrosky1008Brazil2025-08-15
Cody Saylors1009Germany2025-08-18
Maria Marrier1010Italy2025-08-16
Claire Tollner1011Italy2025-09-10
Salvatore Stockham1012India2025-08-30
Kaitlin Ostrosky1013Spain2025-08-20
Jeanfrancois Venere1014Canada2025-08-30
Jennifer Amigon1015United Kingdom2025-09-04
Julie Stenseth1016Japan2025-08-24
Emily Whobrey1017Argentina2025-09-10
Morrow Ruta1018Brazil2025-08-23
Maisha Rulapaugh1019United Kingdom2025-08-22
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Isabel BowleyItalyElwin Sharvill PROPOSAL
Clifford RimIndiaIvan Magalhaes QUALIFIED
Aditya KuskoJapanStephen Shaw QUALIFIED
Jones VocelkaArgentinaIoni Bowcher UNQUALIFIED
Nicolas IturbideUnited KingdomIoni Bowcher RENEWAL
Greenwood BologniaBrazilAsiya Javayant RENEWAL
Antonio CaudyCanadaAmy Elsner UNQUALIFIED
Greenwood BologniaItalyAmy Elsner QUALIFIED
Deepesh ChuiGermanyBernardo Dominic RENEWAL
Arvin AlbaresItalyBernardo Dominic PROPOSAL
Adams MorascaAustraliaXuxue Feng NEGOTIATION
Chavez BriddickItalyIoni Bowcher UNQUALIFIED
Julie StensethGermanyAsiya Javayant UNQUALIFIED
Alejandro PerinArgentinaBernardo Dominic QUALIFIED
Juan WieserRussiaIvan Magalhaes PROPOSAL
Aruna FigeroaFranceBernardo Dominic NEW
Tony FollerArgentinaIvan Magalhaes NEW
Tony FollerCanadaXuxue Feng UNQUALIFIED
Silvio SlusarskiArgentinaStephen Shaw NEW
Ivar PaprockiItalyIoni Bowcher NEW
Johnson SergiFranceBernardo Dominic QUALIFIED
Johnson SergiJapanStephen Shaw UNQUALIFIED
Juan WieserCanadaElwin Sharvill UNQUALIFIED
Octavia MaletSpainXuxue Feng NEW
David DarakjyCanadaElwin Sharvill UNQUALIFIED
David DarakjyFranceStephen Shaw PROPOSAL
Johnson SergiAustraliaElwin Sharvill NEGOTIATION
David DarakjyBrazilElwin Sharvill NEGOTIATION
Izzy GarufiCanadaAsiya Javayant NEGOTIATION
Ricardo GauchoSpainIoni Bowcher NEGOTIATION
Maria MarrierAustraliaElwin Sharvill QUALIFIED
Rodrigues CampainCanadaXuxue Feng RENEWAL
Maria MarrierBrazilXuxue Feng RENEWAL
Francesco ShinkoJapanBernardo Dominic PROPOSAL
Morrow RutaAustraliaOnyama Limba RENEWAL
Cody SaylorsCanadaBernardo Dominic RENEWAL
Costa DilliardIndiaElwin Sharvill RENEWAL
James ButtJapanBernardo Dominic NEW
Leon OldroydGermanyBernardo Dominic RENEWAL
Costa DilliardArgentinaBernardo 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>