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
Johnson SergiGermanyXuxue Feng NEGOTIATION
Costa DilliardGermanyStephen Shaw UNQUALIFIED
Jennifer AmigonGermanyAmy Elsner NEGOTIATION
Deepesh ChuiAustraliaBernardo Dominic NEW
Emily WhobreyRussiaAnna Fali RENEWAL
Costa DilliardRussiaAmy Elsner RENEWAL
David DarakjyGermanyOnyama Limba RENEWAL
Aika InouyeSpainIoni Bowcher NEGOTIATION
Jennifer AmigonGermanyAnna Fali NEW
Rodrigues CampainGermanyAsiya Javayant PROPOSAL
Darci PoquetteUnited KingdomXuxue Feng PROPOSAL
Wickens NestleBrazilElwin Sharvill NEGOTIATION
Misaki RoysterGermanyIoni Bowcher PROPOSAL
Francesco ShinkoJapanIoni Bowcher RENEWAL
Darci PoquetteIndiaOnyama Limba NEGOTIATION
Julie StensethRussiaIoni Bowcher RENEWAL
Jones VocelkaIndiaAsiya Javayant UNQUALIFIED
Ricardo GauchoUnited KingdomIoni Bowcher UNQUALIFIED
Isabel BowleyJapanIvan Magalhaes NEW
Costa DilliardSpainXuxue Feng PROPOSAL
Alejandro PerinIndiaElwin Sharvill RENEWAL
Mayumi KolmetzFranceIoni Bowcher NEGOTIATION
Mayumi KolmetzCanadaAsiya Javayant PROPOSAL
Munro FerenczItalyAnna Fali UNQUALIFIED
Jones VocelkaAustraliaAmy Elsner RENEWAL
Aika InouyeGermanyBernardo Dominic NEGOTIATION
Darci PoquetteFranceIvan Magalhaes NEW
Maisha RulapaughItalyIoni Bowcher UNQUALIFIED
Antonio CaudyUnited KingdomAmy Elsner NEGOTIATION
James ButtFranceIvan Magalhaes NEGOTIATION
Tony FollerRussiaAmy Elsner PROPOSAL
Murillo MaletAustraliaStephen Shaw QUALIFIED
Antonio CaudyFranceAnna Fali NEGOTIATION
Mayumi KolmetzArgentinaIvan Magalhaes NEGOTIATION
Silvio SlusarskiJapanXuxue Feng PROPOSAL
Francesco ShinkoItalyOnyama Limba NEW
Julie StensethFranceXuxue Feng UNQUALIFIED
Juan WieserFranceBernardo Dominic NEGOTIATION
Deepesh ChuiUnited KingdomStephen Shaw QUALIFIED
Costa DilliardUnited KingdomIvan Magalhaes NEGOTIATION
Smith GlickSpainIoni Bowcher PROPOSAL
Nicolas IturbideUnited KingdomElwin Sharvill RENEWAL
Ricardo GauchoCanadaIoni Bowcher RENEWAL
Adams MorascaRussiaAmy Elsner QUALIFIED
Morrow RutaJapanAmy Elsner NEW
David DarakjyFranceElwin Sharvill QUALIFIED
Deepesh ChuiFranceElwin Sharvill NEGOTIATION
Deepesh ChuiBrazilIvan Magalhaes RENEWAL
Arvin AlbaresAustraliaIoni Bowcher NEGOTIATION
Nicolas IturbideUnited KingdomXuxue Feng PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Ricardo GauchoRussiaElwin Sharvill PROPOSAL
Maisha RulapaughGermanyElwin Sharvill PROPOSAL
Izzy GarufiIndiaStephen Shaw QUALIFIED
Jennifer AmigonJapanElwin Sharvill NEGOTIATION
Julie StensethUnited KingdomBernardo Dominic PROPOSAL
Jefferson SchemmerItalyAnna Fali PROPOSAL
Ashley DoeUnited KingdomElwin Sharvill UNQUALIFIED
Tony FollerItalyAnna Fali RENEWAL
Emily WhobreyJapanIvan Magalhaes UNQUALIFIED
Misaki RoysterRussiaOnyama Limba RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Sinclair WaycottAustralia2026-05-30Printing Dimensions PROPOSAL12Amy Elsner
1001Aika InouyeGermany2026-05-21Chapman, Ross E Esq RENEWAL42Xuxue Feng
1002Johnson SergiArgentina2026-05-16Dorl, James J Esq RENEWAL19Asiya Javayant
1003Sinclair WaycottItaly2026-05-03Truhlar And Truhlar Attys UNQUALIFIED17Amy Elsner
1004Faith GillianSpain2026-05-03Chanay, Jeffrey A Esq QUALIFIED88Amy Elsner
1005Cody SaylorsBrazil2026-05-22Feltz Printing Service RENEWAL38Ioni Bowcher
1006Octavia MaletCanada2026-05-09Printing Dimensions UNQUALIFIED60Xuxue Feng
1007Juan WieserSpain2026-05-12Chemel, James L Cpa RENEWAL50Asiya Javayant
1008David DarakjyFrance2026-05-11Rousseaux, Michael Esq NEGOTIATION53Elwin Sharvill
1009James ButtCanada2026-05-12King, Christopher A Esq UNQUALIFIED8Ioni Bowcher
1010Costa DilliardArgentina2026-05-04Chanay, Jeffrey A Esq NEGOTIATION66Stephen Shaw
1011Faith GillianCanada2026-05-02Feltz Printing Service RENEWAL52Xuxue Feng
1012Nicolas IturbideJapan2026-05-21Benton, John B Jr RENEWAL44Asiya Javayant
1013Tony FollerIndia2026-05-20Printing Dimensions NEW55Asiya Javayant
1014Murillo MaletCanada2026-05-30Morlong Associates RENEWAL40Bernardo Dominic
1015Misaki RoysterJapan2026-05-13Rangoni Of Florence UNQUALIFIED96Xuxue Feng
1016Kadeem FlosiGermany2026-05-29Dorl, James J Esq PROPOSAL68Ioni Bowcher
1017Alejandro PerinItaly2026-05-02Rousseaux, Michael Esq NEGOTIATION26Xuxue Feng
1018Kadeem FlosiBrazil2026-05-08Dorl, James J Esq NEGOTIATION57Elwin Sharvill
1019Maisha RulapaughRussia2026-05-18Commercial Press UNQUALIFIED60Ivan Magalhaes
1020Leon OldroydAustralia2026-05-30Benton, John B Jr QUALIFIED50Onyama Limba
1021Emily WhobreyIndia2026-05-07Truhlar And Truhlar Attys RENEWAL55Amy Elsner
1022Cody SaylorsItaly2026-05-18Benton, John B Jr NEGOTIATION55Onyama Limba
1023Jones VocelkaCanada2026-05-28King, Christopher A Esq NEGOTIATION21Ioni Bowcher
1024Mujtaba NickaFrance2026-05-08Feltz Printing Service QUALIFIED80Elwin Sharvill
1025Kadeem FlosiCanada2026-05-15Chanay, Jeffrey A Esq QUALIFIED87Bernardo Dominic
1026Ricardo GauchoItaly2026-05-28Chanay, Jeffrey A Esq QUALIFIED69Ivan Magalhaes
1027Alejandro PerinJapan2026-05-09Truhlar And Truhlar Attys NEGOTIATION63Xuxue Feng
1028Greenwood BologniaGermany2026-05-05King, Christopher A Esq RENEWAL30Bernardo Dominic
1029Aika InouyeAustralia2026-05-07Chemel, James L Cpa QUALIFIED87Amy Elsner
1030Aditya KuskoItaly2026-05-02Rousseaux, Michael Esq NEW12Stephen Shaw
1031Deepesh ChuiCanada2026-05-31Chapman, Ross E Esq RENEWAL19Anna Fali
1032Julie StensethIndia2026-05-08Feltz Printing Service NEW81Xuxue Feng
1033Ivar PaprockiGermany2026-05-30Rousseaux, Michael Esq PROPOSAL37Ivan Magalhaes
1034Arvin AlbaresRussia2026-05-15Feltz Printing Service UNQUALIFIED79Asiya Javayant
1035Arvin AlbaresUnited Kingdom2026-05-31Morlong Associates NEGOTIATION4Ioni Bowcher
1036Aruna FigeroaRussia2026-05-15Truhlar And Truhlar Attys PROPOSAL46Anna Fali
1037Ivar PaprockiRussia2026-05-19King, Christopher A Esq NEGOTIATION13Onyama Limba
1038Jones VocelkaRussia2026-05-18Buckley Miller Wright QUALIFIED48Anna Fali
1039Jennifer AmigonIndia2026-05-03Chapman, Ross E Esq RENEWAL2Onyama Limba
1040Rodrigues CampainSpain2026-05-05Feiner Bros UNQUALIFIED12Bernardo Dominic
1041Julie StensethBrazil2026-05-05Rangoni Of Florence QUALIFIED88Ivan Magalhaes
1042Adams MorascaSpain2026-05-31Benton, John B Jr RENEWAL16Ioni Bowcher
1043Wickens NestleAustralia2026-05-24Commercial Press UNQUALIFIED91Anna Fali
1044Julie StensethBrazil2026-05-28Buckley Miller Wright NEGOTIATION74Anna Fali
1045Clifford RimUnited Kingdom2026-05-28Chanay, Jeffrey A Esq NEGOTIATION64Bernardo Dominic
1046Smith GlickJapan2026-05-17Chapman, Ross E Esq NEGOTIATION28Anna Fali
1047Nicolas IturbideCanada2026-05-26Chapman, Ross E Esq NEGOTIATION75Stephen Shaw
1048Antonio CaudyCanada2026-05-14Chemel, James L Cpa RENEWAL93Stephen Shaw
1049Faith GillianRussia2026-05-22King, Christopher A Esq NEGOTIATION54Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Tony FollerItalyAnna Fali NEW
Izzy GarufiIndiaIvan Magalhaes RENEWAL
Rodrigues CampainArgentinaBernardo Dominic UNQUALIFIED
Wickens NestleUnited KingdomIoni Bowcher NEW
Ashley DoeCanadaOnyama Limba NEGOTIATION
Morrow RutaCanadaOnyama Limba NEW
Cody SaylorsBrazilAmy Elsner NEGOTIATION
Wickens NestleCanadaElwin Sharvill NEW
Emily WhobreyRussiaBernardo Dominic NEW
Clifford RimCanadaXuxue Feng RENEWAL
Maisha RulapaughCanadaAsiya Javayant PROPOSAL
Cody SaylorsUnited KingdomIoni Bowcher RENEWAL
Cody SaylorsGermanyXuxue Feng NEGOTIATION
Misaki RoysterCanadaAmy Elsner NEGOTIATION
Emily WhobreyJapanElwin Sharvill QUALIFIED
Aruna FigeroaFranceAsiya Javayant NEGOTIATION
Julie StensethCanadaOnyama Limba RENEWAL
Octavia MaletArgentinaElwin Sharvill PROPOSAL
Costa DilliardRussiaIoni Bowcher UNQUALIFIED
Arvin AlbaresFranceAsiya Javayant NEGOTIATION
Mujtaba NickaGermanyXuxue Feng RENEWAL
Kadeem FlosiBrazilIoni Bowcher NEGOTIATION
Maria MarrierJapanBernardo Dominic PROPOSAL
Murillo MaletIndiaOnyama Limba PROPOSAL
Smith GlickGermanyAsiya Javayant RENEWAL
Faith GillianSpainAnna Fali QUALIFIED
Alejandro PerinSpainOnyama Limba QUALIFIED
Isabel BowleyItalyAmy Elsner PROPOSAL
Tony FollerBrazilStephen Shaw UNQUALIFIED
Misaki RoysterCanadaElwin Sharvill NEW
Murillo MaletRussiaXuxue Feng NEGOTIATION
Misaki RoysterSpainOnyama Limba QUALIFIED
Nicolas IturbideRussiaStephen Shaw NEGOTIATION
Maria MarrierGermanyXuxue Feng QUALIFIED
Wickens NestleUnited KingdomAmy Elsner NEGOTIATION
Alejandro PerinFranceAmy Elsner UNQUALIFIED
Francesco ShinkoCanadaXuxue Feng QUALIFIED
Isabel BowleyIndiaStephen Shaw QUALIFIED
Deepesh ChuiJapanIoni Bowcher QUALIFIED
Aika InouyeCanadaElwin Sharvill NEW
James ButtAustraliaBernardo Dominic UNQUALIFIED
Antonio CaudyBrazilBernardo Dominic RENEWAL
James ButtCanadaIvan Magalhaes NEW
Ivar PaprockiIndiaAnna Fali UNQUALIFIED
Julie StensethAustraliaAmy Elsner RENEWAL
Smith GlickSpainAnna Fali UNQUALIFIED
Faith GillianGermanyAmy Elsner QUALIFIED
Izzy GarufiIndiaAnna Fali NEGOTIATION
Stacey MacleadJapanXuxue Feng NEGOTIATION
Morrow RutaAustraliaStephen Shaw UNQUALIFIED
Frozen Columns
Name
Greenwood Bolognia
Cody Saylors
Deepesh Chui
Alejandro Perin
Murillo Malet
Leon Oldroyd
Misaki Royster
Leja Caldarera
David Darakjy
Alejandro Perin
Greenwood Bolognia
Juan Wieser
Stacey Maclead
Claire Tollner
James Butt
Aditya Kusko
Juan Wieser
Maria Marrier
Maria Marrier
Sinclair Waycott
Silvio Slusarski
Ashley Doe
Mujtaba Nicka
Kadeem Flosi
Silvio Slusarski
Maria Marrier
Wickens Nestle
Salvatore Stockham
Jennifer Amigon
Antonio Caudy
Ivar Paprocki
Clifford Rim
Sinclair Waycott
Mayumi Kolmetz
David Darakjy
Mujtaba Nicka
Octavia Malet
Nicolas Iturbide
Salvatore Stockham
Greenwood Bolognia
Mayumi Kolmetz
Ricardo Gaucho
Faith Gillian
Ricardo Gaucho
Jeanfrancois Venere
Greenwood Bolognia
Jones Vocelka
Kadeem Flosi
Jeanfrancois Venere
Cody Saylors
IdCountryDate
1000Brazil2026-05-15
1001Australia2026-05-02
1002Italy2026-05-24
1003Australia2026-05-30
1004Canada2026-05-19
1005United Kingdom2026-05-27
1006Canada2026-05-18
1007India2026-05-08
1008Argentina2026-05-15
1009Brazil2026-05-20
1010India2026-05-07
1011India2026-05-05
1012United Kingdom2026-05-04
1013Argentina2026-05-28
1014Argentina2026-05-26
1015Spain2026-05-08
1016Brazil2026-05-05
1017Canada2026-05-12
1018Germany2026-05-31
1019Japan2026-05-10
1020Russia2026-05-26
1021United Kingdom2026-05-28
1022Russia2026-05-22
1023India2026-05-22
1024Brazil2026-05-23
1025Russia2026-05-30
1026United Kingdom2026-05-29
1027India2026-05-03
1028Canada2026-05-26
1029Japan2026-05-27
1030Canada2026-05-06
1031Germany2026-05-11
1032Spain2026-05-12
1033France2026-05-17
1034Canada2026-05-31
1035Germany2026-05-29
1036Spain2026-05-08
1037Russia2026-05-31
1038Argentina2026-05-14
1039Italy2026-05-06
1040Canada2026-05-25
1041Canada2026-05-28
1042Japan2026-05-24
1043Canada2026-05-11
1044Brazil2026-05-15
1045India2026-05-11
1046Japan2026-05-11
1047Germany2026-05-27
1048Spain2026-05-30
1049Italy2026-05-15

On-Demand Data

NameIdCountryDate
Aruna Figeroa1000Germany2026-05-29
Chavez Briddick1001Argentina2026-05-27
Jeanfrancois Venere1002Russia2026-05-15
Leja Caldarera1003Japan2026-05-20
Cody Saylors1004Italy2026-05-19
Darci Poquette1005Brazil2026-05-10
Kaitlin Ostrosky1006United Kingdom2026-05-12
Jennifer Amigon1007Spain2026-05-21
Clifford Rim1008France2026-05-06
Kadeem Flosi1009United Kingdom2026-05-24
Wickens Nestle1010France2026-05-04
Salvatore Stockham1011Australia2026-05-10
Jennifer Amigon1012Canada2026-05-18
Wickens Nestle1013France2026-05-06
Clifford Rim1014Japan2026-05-04
Juan Wieser1015Canada2026-05-02
Kaitlin Ostrosky1016Spain2026-05-21
Antonio Caudy1017United Kingdom2026-05-20
Sinclair Waycott1018Russia2026-05-28
Izzy Garufi1019Australia2026-05-11
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Smith GlickIndiaElwin Sharvill NEGOTIATION
Aditya KuskoArgentinaOnyama Limba PROPOSAL
James ButtRussiaIoni Bowcher NEW
Leja CaldareraCanadaAmy Elsner PROPOSAL
Claire TollnerItalyOnyama Limba QUALIFIED
Arvin AlbaresGermanyElwin Sharvill NEGOTIATION
Salvatore StockhamSpainStephen Shaw NEGOTIATION
Emily WhobreySpainXuxue Feng PROPOSAL
Mujtaba NickaUnited KingdomIoni Bowcher UNQUALIFIED
Misaki RoysterSpainAsiya Javayant RENEWAL
Wickens NestleSpainIoni Bowcher RENEWAL
Salvatore StockhamAustraliaElwin Sharvill NEGOTIATION
Rodrigues CampainRussiaIvan Magalhaes NEGOTIATION
Jennifer AmigonSpainOnyama Limba RENEWAL
Stacey MacleadCanadaAsiya Javayant UNQUALIFIED
Aruna FigeroaArgentinaStephen Shaw UNQUALIFIED
David DarakjyFranceIvan Magalhaes QUALIFIED
Emily WhobreyFranceElwin Sharvill QUALIFIED
Mujtaba NickaFranceAnna Fali RENEWAL
Mujtaba NickaBrazilIoni Bowcher NEGOTIATION
Nicolas IturbideItalyIoni Bowcher RENEWAL
Aika InouyeUnited KingdomIvan Magalhaes QUALIFIED
Maisha RulapaughJapanIoni Bowcher NEW
Mayumi KolmetzCanadaAmy Elsner QUALIFIED
Jefferson SchemmerIndiaXuxue Feng PROPOSAL
Ricardo GauchoBrazilIoni Bowcher NEGOTIATION
Jennifer AmigonFranceElwin Sharvill RENEWAL
Aditya KuskoCanadaElwin Sharvill NEW
James ButtArgentinaOnyama Limba RENEWAL
Maisha RulapaughIndiaElwin Sharvill NEW
Aika InouyeAustraliaElwin Sharvill PROPOSAL
Ashley DoeFranceAsiya Javayant RENEWAL
Tony FollerCanadaElwin Sharvill QUALIFIED
Sinclair WaycottGermanyAmy Elsner NEGOTIATION
Aika InouyeGermanyXuxue Feng PROPOSAL
Aditya KuskoCanadaXuxue Feng UNQUALIFIED
Adams MorascaSpainAnna Fali PROPOSAL
Clifford RimFranceAnna Fali UNQUALIFIED
Greenwood BologniaRussiaElwin Sharvill NEW
Jeanfrancois VenereRussiaStephen Shaw 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>