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
Sinclair WaycottFranceElwin Sharvill UNQUALIFIED
Emily WhobreyUnited KingdomAsiya Javayant QUALIFIED
Ashley DoeItalyAsiya Javayant PROPOSAL
Cody SaylorsFranceOnyama Limba NEGOTIATION
Clifford RimCanadaAsiya Javayant NEW
Jeanfrancois VenereBrazilStephen Shaw NEW
Izzy GarufiSpainBernardo Dominic NEW
Nicolas IturbideArgentinaAnna Fali QUALIFIED
Faith GillianArgentinaOnyama Limba NEW
Julie StensethIndiaAsiya Javayant QUALIFIED
Jennifer AmigonItalyIvan Magalhaes UNQUALIFIED
Maria MarrierJapanAnna Fali QUALIFIED
Isabel BowleyArgentinaIoni Bowcher QUALIFIED
Chavez BriddickGermanyAnna Fali UNQUALIFIED
Claire TollnerAustraliaElwin Sharvill UNQUALIFIED
Morrow RutaRussiaXuxue Feng QUALIFIED
Darci PoquetteAustraliaAmy Elsner NEGOTIATION
Aika InouyeCanadaStephen Shaw NEW
Julie StensethUnited KingdomIvan Magalhaes UNQUALIFIED
Aika InouyeItalyElwin Sharvill UNQUALIFIED
Aika InouyeArgentinaElwin Sharvill NEGOTIATION
Leja CaldareraIndiaAnna Fali RENEWAL
Rodrigues CampainItalyIvan Magalhaes NEGOTIATION
Alejandro PerinBrazilAsiya Javayant QUALIFIED
Stacey MacleadUnited KingdomStephen Shaw PROPOSAL
Aika InouyeRussiaOnyama Limba PROPOSAL
Aika InouyeCanadaAsiya Javayant NEGOTIATION
Deepesh ChuiArgentinaXuxue Feng PROPOSAL
Jennifer AmigonIndiaIvan Magalhaes NEW
Antonio CaudyItalyAsiya Javayant QUALIFIED
Jones VocelkaFranceAsiya Javayant PROPOSAL
Murillo MaletBrazilAnna Fali QUALIFIED
Sinclair WaycottAustraliaBernardo Dominic NEW
Emily WhobreyAustraliaIoni Bowcher RENEWAL
Murillo MaletUnited KingdomStephen Shaw RENEWAL
Salvatore StockhamCanadaAmy Elsner PROPOSAL
Clifford RimGermanyAsiya Javayant NEGOTIATION
Kaitlin OstroskySpainOnyama Limba QUALIFIED
David DarakjyUnited KingdomBernardo Dominic NEGOTIATION
Stacey MacleadIndiaXuxue Feng NEW
Kadeem FlosiSpainXuxue Feng RENEWAL
Arvin AlbaresAustraliaBernardo Dominic PROPOSAL
Isabel BowleySpainAsiya Javayant RENEWAL
Leja CaldareraBrazilBernardo Dominic NEGOTIATION
Izzy GarufiAustraliaAmy Elsner UNQUALIFIED
Jefferson SchemmerItalyStephen Shaw NEGOTIATION
Alejandro PerinAustraliaStephen Shaw NEW
Morrow RutaFranceAnna Fali NEGOTIATION
Mayumi KolmetzJapanIoni Bowcher PROPOSAL
Darci PoquetteItalyStephen Shaw PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Kadeem FlosiGermanyAnna Fali PROPOSAL
Misaki RoysterJapanAmy Elsner QUALIFIED
Rodrigues CampainRussiaOnyama Limba UNQUALIFIED
Mayumi KolmetzAustraliaXuxue Feng QUALIFIED
Jeanfrancois VenereItalyIoni Bowcher NEW
Maisha RulapaughFranceBernardo Dominic NEW
Adams MorascaJapanStephen Shaw NEGOTIATION
Kadeem FlosiUnited KingdomIoni Bowcher RENEWAL
Costa DilliardGermanyStephen Shaw RENEWAL
Johnson SergiItalyXuxue Feng RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Jefferson SchemmerBrazil2026-05-23Truhlar And Truhlar Attys NEW55Xuxue Feng
1001Aruna FigeroaBrazil2026-05-21Dorl, James J Esq RENEWAL12Ivan Magalhaes
1002Leja CaldareraJapan2026-05-22Feltz Printing Service UNQUALIFIED56Asiya Javayant
1003David DarakjyAustralia2026-05-12Feltz Printing Service NEW27Onyama Limba
1004Ivar PaprockiRussia2026-06-04Chemel, James L Cpa UNQUALIFIED7Ioni Bowcher
1005Adams MorascaIndia2026-05-27Chemel, James L Cpa NEGOTIATION34Ioni Bowcher
1006Alejandro PerinFrance2026-05-28Rangoni Of Florence UNQUALIFIED81Amy Elsner
1007David DarakjyCanada2026-06-04Benton, John B Jr UNQUALIFIED29Asiya Javayant
1008Clifford RimIndia2026-05-20Commercial Press QUALIFIED82Anna Fali
1009Jefferson SchemmerSpain2026-05-23Feiner Bros NEGOTIATION36Xuxue Feng
1010Julie StensethArgentina2026-05-14Buckley Miller Wright PROPOSAL5Xuxue Feng
1011David DarakjyCanada2026-05-19King, Christopher A Esq NEW76Onyama Limba
1012Kaitlin OstroskyJapan2026-05-17Dorl, James J Esq RENEWAL94Amy Elsner
1013Nicolas IturbideCanada2026-05-25Feiner Bros RENEWAL62Ivan Magalhaes
1014Maria MarrierRussia2026-06-04Morlong Associates NEW41Ivan Magalhaes
1015Ivar PaprockiRussia2026-05-17Chemel, James L Cpa RENEWAL90Stephen Shaw
1016Claire TollnerItaly2026-05-21Chemel, James L Cpa UNQUALIFIED49Asiya Javayant
1017Jones VocelkaCanada2026-06-04Printing Dimensions NEW98Asiya Javayant
1018Izzy GarufiCanada2026-06-05Printing Dimensions RENEWAL65Asiya Javayant
1019Francesco ShinkoAustralia2026-05-11Rousseaux, Michael Esq UNQUALIFIED83Amy Elsner
1020Izzy GarufiAustralia2026-06-07Dorl, James J Esq NEGOTIATION20Ioni Bowcher
1021Misaki RoysterJapan2026-05-31Feltz Printing Service PROPOSAL48Onyama Limba
1022Clifford RimAustralia2026-05-27Printing Dimensions NEW71Ioni Bowcher
1023Nicolas IturbideArgentina2026-05-28Dorl, James J Esq NEGOTIATION58Anna Fali
1024Maria MarrierFrance2026-06-07King, Christopher A Esq NEGOTIATION25Onyama Limba
1025Kadeem FlosiArgentina2026-06-08Chanay, Jeffrey A Esq QUALIFIED18Anna Fali
1026Clifford RimCanada2026-05-21Feiner Bros PROPOSAL11Ioni Bowcher
1027Greenwood BologniaIndia2026-06-05Feltz Printing Service NEW82Elwin Sharvill
1028David DarakjyItaly2026-06-08Feiner Bros PROPOSAL58Amy Elsner
1029Misaki RoysterUnited Kingdom2026-05-23Morlong Associates UNQUALIFIED25Ivan Magalhaes
1030Maisha RulapaughBrazil2026-05-21Rousseaux, Michael Esq QUALIFIED44Bernardo Dominic
1031Silvio SlusarskiIndia2026-05-12King, Christopher A Esq QUALIFIED44Stephen Shaw
1032Francesco ShinkoArgentina2026-05-15Morlong Associates NEGOTIATION80Elwin Sharvill
1033Julie StensethGermany2026-05-14Buckley Miller Wright PROPOSAL55Stephen Shaw
1034Jeanfrancois VenereItaly2026-05-29King, Christopher A Esq PROPOSAL97Ivan Magalhaes
1035Kaitlin OstroskyBrazil2026-05-25Rangoni Of Florence NEGOTIATION94Elwin Sharvill
1036Mayumi KolmetzGermany2026-05-22Printing Dimensions NEW78Ioni Bowcher
1037Leja CaldareraCanada2026-05-12Commercial Press NEW41Bernardo Dominic
1038Greenwood BologniaUnited Kingdom2026-06-03Dorl, James J Esq UNQUALIFIED29Ioni Bowcher
1039Sinclair WaycottSpain2026-05-23Feltz Printing Service PROPOSAL14Ioni Bowcher
1040Murillo MaletIndia2026-05-12Truhlar And Truhlar Attys NEW29Elwin Sharvill
1041Antonio CaudyItaly2026-05-21Printing Dimensions UNQUALIFIED2Ioni Bowcher
1042Cody SaylorsGermany2026-05-21Rangoni Of Florence PROPOSAL80Amy Elsner
1043Juan WieserCanada2026-05-23Dorl, James J Esq UNQUALIFIED44Elwin Sharvill
1044Greenwood BologniaArgentina2026-05-22Chapman, Ross E Esq NEGOTIATION70Ioni Bowcher
1045Munro FerenczArgentina2026-05-16Chapman, Ross E Esq RENEWAL52Asiya Javayant
1046Stacey MacleadJapan2026-05-23Commercial Press NEW64Asiya Javayant
1047Juan WieserJapan2026-05-13Chanay, Jeffrey A Esq NEW61Asiya Javayant
1048Silvio SlusarskiCanada2026-05-23Feltz Printing Service PROPOSAL3Amy Elsner
1049Tony FollerBrazil2026-06-08Commercial Press NEGOTIATION66Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Silvio SlusarskiJapanAmy Elsner PROPOSAL
Kadeem FlosiJapanXuxue Feng RENEWAL
Leja CaldareraCanadaElwin Sharvill NEGOTIATION
Ricardo GauchoSpainIvan Magalhaes PROPOSAL
Sinclair WaycottIndiaBernardo Dominic NEGOTIATION
Jones VocelkaBrazilAnna Fali NEGOTIATION
Juan WieserRussiaAmy Elsner NEGOTIATION
Cody SaylorsArgentinaElwin Sharvill QUALIFIED
Maisha RulapaughArgentinaXuxue Feng NEW
Octavia MaletBrazilAnna Fali RENEWAL
Jones VocelkaIndiaAmy Elsner NEGOTIATION
Chavez BriddickJapanOnyama Limba NEW
Octavia MaletFranceAsiya Javayant UNQUALIFIED
Octavia MaletArgentinaXuxue Feng NEW
Misaki RoysterRussiaAmy Elsner UNQUALIFIED
Leja CaldareraJapanAnna Fali NEGOTIATION
Smith GlickJapanBernardo Dominic PROPOSAL
David DarakjyGermanyAnna Fali NEW
Maisha RulapaughBrazilAsiya Javayant UNQUALIFIED
James ButtRussiaXuxue Feng PROPOSAL
Cody SaylorsItalyElwin Sharvill QUALIFIED
Misaki RoysterGermanyOnyama Limba RENEWAL
Octavia MaletUnited KingdomStephen Shaw NEW
Leon OldroydItalyElwin Sharvill QUALIFIED
Nicolas IturbideSpainIoni Bowcher PROPOSAL
Murillo MaletRussiaAsiya Javayant QUALIFIED
Faith GillianCanadaIoni Bowcher PROPOSAL
Mayumi KolmetzArgentinaStephen Shaw QUALIFIED
Costa DilliardArgentinaIvan Magalhaes QUALIFIED
Darci PoquetteCanadaAnna Fali UNQUALIFIED
Salvatore StockhamBrazilAsiya Javayant PROPOSAL
Claire TollnerBrazilOnyama Limba PROPOSAL
Emily WhobreyJapanIoni Bowcher UNQUALIFIED
Ricardo GauchoSpainIoni Bowcher QUALIFIED
Aruna FigeroaUnited KingdomIvan Magalhaes NEGOTIATION
Aruna FigeroaJapanXuxue Feng RENEWAL
Arvin AlbaresUnited KingdomIoni Bowcher UNQUALIFIED
Juan WieserArgentinaElwin Sharvill PROPOSAL
Adams MorascaGermanyElwin Sharvill UNQUALIFIED
Johnson SergiIndiaBernardo Dominic RENEWAL
Smith GlickRussiaIoni Bowcher PROPOSAL
Misaki RoysterFranceXuxue Feng UNQUALIFIED
Adams MorascaAustraliaBernardo Dominic PROPOSAL
Misaki RoysterBrazilIvan Magalhaes PROPOSAL
Jefferson SchemmerIndiaXuxue Feng UNQUALIFIED
Juan WieserAustraliaBernardo Dominic QUALIFIED
Salvatore StockhamGermanyXuxue Feng RENEWAL
Ricardo GauchoBrazilAnna Fali NEGOTIATION
Cody SaylorsAustraliaXuxue Feng UNQUALIFIED
Kadeem FlosiIndiaIoni Bowcher QUALIFIED
Frozen Columns
Name
Leja Caldarera
Silvio Slusarski
Jeanfrancois Venere
Arvin Albares
Rodrigues Campain
Sinclair Waycott
Clifford Rim
Leja Caldarera
David Darakjy
Ivar Paprocki
Arvin Albares
Mayumi Kolmetz
Tony Foller
Francesco Shinko
Faith Gillian
Maisha Rulapaugh
Jeanfrancois Venere
Octavia Malet
Nicolas Iturbide
Johnson Sergi
Clifford Rim
Mayumi Kolmetz
Jones Vocelka
Isabel Bowley
Silvio Slusarski
Mujtaba Nicka
Kaitlin Ostrosky
Jennifer Amigon
Morrow Ruta
Mayumi Kolmetz
David Darakjy
Maria Marrier
Sinclair Waycott
Cody Saylors
Francesco Shinko
Kadeem Flosi
Deepesh Chui
James Butt
Maisha Rulapaugh
Juan Wieser
Munro Ferencz
Leja Caldarera
Leon Oldroyd
Rodrigues Campain
Claire Tollner
Alejandro Perin
Rodrigues Campain
Deepesh Chui
Johnson Sergi
Darci Poquette
IdCountryDate
1000United Kingdom2026-05-19
1001United Kingdom2026-05-19
1002Germany2026-06-02
1003France2026-06-07
1004United Kingdom2026-05-15
1005Argentina2026-05-27
1006France2026-06-09
1007Argentina2026-05-17
1008United Kingdom2026-05-24
1009Argentina2026-06-02
1010Japan2026-06-03
1011Australia2026-05-15
1012Russia2026-05-31
1013India2026-05-13
1014Italy2026-05-27
1015India2026-05-20
1016United Kingdom2026-06-01
1017Brazil2026-05-12
1018France2026-05-21
1019United Kingdom2026-06-01
1020Japan2026-05-25
1021India2026-05-22
1022Australia2026-06-09
1023Germany2026-05-29
1024Spain2026-06-04
1025Canada2026-05-22
1026Italy2026-06-07
1027Canada2026-06-03
1028Spain2026-05-17
1029France2026-05-19
1030Canada2026-05-19
1031Japan2026-05-13
1032Italy2026-05-16
1033Spain2026-05-26
1034France2026-05-12
1035Australia2026-05-11
1036Australia2026-05-15
1037Spain2026-05-24
1038Canada2026-05-15
1039Germany2026-05-24
1040Australia2026-05-24
1041Canada2026-05-26
1042United Kingdom2026-06-06
1043Japan2026-05-30
1044Australia2026-05-23
1045United Kingdom2026-05-23
1046Canada2026-05-11
1047Brazil2026-05-13
1048Canada2026-05-25
1049Canada2026-06-01

On-Demand Data

NameIdCountryDate
Ivar Paprocki1000India2026-05-25
Izzy Garufi1001Russia2026-06-02
Misaki Royster1002United Kingdom2026-06-01
Aruna Figeroa1003Japan2026-06-09
Mayumi Kolmetz1004India2026-05-13
Izzy Garufi1005India2026-05-19
Adams Morasca1006Brazil2026-05-27
Ashley Doe1007Russia2026-05-11
Chavez Briddick1008Canada2026-05-21
Nicolas Iturbide1009Australia2026-06-02
Juan Wieser1010Australia2026-05-22
Julie Stenseth1011Brazil2026-05-19
Ricardo Gaucho1012Spain2026-05-24
Jeanfrancois Venere1013Japan2026-06-01
Johnson Sergi1014India2026-05-21
Leja Caldarera1015Russia2026-05-16
Kaitlin Ostrosky1016Italy2026-05-13
Munro Ferencz1017Brazil2026-05-22
Nicolas Iturbide1018Canada2026-05-22
Faith Gillian1019Canada2026-05-12
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Mujtaba NickaCanadaStephen Shaw QUALIFIED
Jones VocelkaUnited KingdomStephen Shaw NEW
Ricardo GauchoJapanElwin Sharvill NEW
Juan WieserBrazilIoni Bowcher UNQUALIFIED
Wickens NestleItalyAmy Elsner QUALIFIED
Claire TollnerArgentinaElwin Sharvill RENEWAL
Alejandro PerinUnited KingdomElwin Sharvill NEGOTIATION
Rodrigues CampainItalyOnyama Limba QUALIFIED
Ivar PaprockiAustraliaAsiya Javayant NEGOTIATION
Misaki RoysterFranceXuxue Feng NEGOTIATION
Sinclair WaycottCanadaStephen Shaw UNQUALIFIED
Francesco ShinkoArgentinaOnyama Limba QUALIFIED
Munro FerenczFranceAnna Fali QUALIFIED
Octavia MaletGermanyOnyama Limba PROPOSAL
Julie StensethJapanAnna Fali UNQUALIFIED
Darci PoquetteBrazilAsiya Javayant PROPOSAL
Smith GlickArgentinaIvan Magalhaes UNQUALIFIED
Salvatore StockhamAustraliaIvan Magalhaes UNQUALIFIED
Maria MarrierSpainElwin Sharvill QUALIFIED
Kaitlin OstroskyItalyElwin Sharvill NEGOTIATION
Leja CaldareraRussiaStephen Shaw QUALIFIED
Tony FollerAustraliaOnyama Limba PROPOSAL
Rodrigues CampainArgentinaAnna Fali NEGOTIATION
Izzy GarufiRussiaStephen Shaw PROPOSAL
Munro FerenczUnited KingdomBernardo Dominic RENEWAL
Maisha RulapaughCanadaElwin Sharvill RENEWAL
Kadeem FlosiSpainBernardo Dominic NEGOTIATION
Costa DilliardJapanBernardo Dominic PROPOSAL
Murillo MaletItalyOnyama Limba NEW
James ButtSpainAnna Fali NEW
Claire TollnerJapanIvan Magalhaes PROPOSAL
Greenwood BologniaSpainAsiya Javayant UNQUALIFIED
Leon OldroydIndiaBernardo Dominic NEGOTIATION
Murillo MaletIndiaBernardo Dominic NEGOTIATION
Munro FerenczItalyAnna Fali RENEWAL
Misaki RoysterCanadaXuxue Feng UNQUALIFIED
David DarakjyBrazilElwin Sharvill PROPOSAL
Costa DilliardItalyXuxue Feng NEW
Nicolas IturbideUnited KingdomBernardo Dominic PROPOSAL
David DarakjyCanadaIoni Bowcher 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>