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
James ButtCanadaXuxue Feng RENEWAL
Murillo MaletCanadaIoni Bowcher QUALIFIED
Morrow RutaJapanIoni Bowcher PROPOSAL
Murillo MaletSpainElwin Sharvill UNQUALIFIED
Jefferson SchemmerGermanyAnna Fali PROPOSAL
Silvio SlusarskiCanadaXuxue Feng NEW
Claire TollnerFranceAmy Elsner PROPOSAL
David DarakjySpainOnyama Limba NEW
Octavia MaletAustraliaAmy Elsner UNQUALIFIED
Aika InouyeSpainAsiya Javayant QUALIFIED
Deepesh ChuiRussiaIoni Bowcher NEGOTIATION
Maisha RulapaughArgentinaStephen Shaw QUALIFIED
Jeanfrancois VenereIndiaElwin Sharvill PROPOSAL
Octavia MaletGermanyXuxue Feng UNQUALIFIED
Kaitlin OstroskyBrazilIoni Bowcher QUALIFIED
Deepesh ChuiSpainOnyama Limba QUALIFIED
Jennifer AmigonIndiaXuxue Feng UNQUALIFIED
Mujtaba NickaItalyIoni Bowcher NEW
Johnson SergiGermanyStephen Shaw PROPOSAL
Johnson SergiAustraliaAsiya Javayant RENEWAL
Silvio SlusarskiGermanyStephen Shaw RENEWAL
Jones VocelkaAustraliaIvan Magalhaes UNQUALIFIED
Greenwood BologniaAustraliaBernardo Dominic PROPOSAL
Nicolas IturbideBrazilElwin Sharvill UNQUALIFIED
Smith GlickIndiaIvan Magalhaes UNQUALIFIED
Kadeem FlosiSpainElwin Sharvill PROPOSAL
Cody SaylorsArgentinaAnna Fali UNQUALIFIED
Kadeem FlosiFranceStephen Shaw NEW
Tony FollerGermanyStephen Shaw RENEWAL
Claire TollnerGermanyElwin Sharvill PROPOSAL
Francesco ShinkoItalyAmy Elsner PROPOSAL
Leon OldroydRussiaIvan Magalhaes NEGOTIATION
Chavez BriddickAustraliaIvan Magalhaes NEGOTIATION
Salvatore StockhamAustraliaStephen Shaw NEGOTIATION
Morrow RutaBrazilAsiya Javayant PROPOSAL
Kadeem FlosiArgentinaIoni Bowcher QUALIFIED
Johnson SergiGermanyIvan Magalhaes NEGOTIATION
Isabel BowleyArgentinaIoni Bowcher PROPOSAL
David DarakjyArgentinaAsiya Javayant UNQUALIFIED
Cody SaylorsFranceAmy Elsner RENEWAL
Wickens NestleArgentinaIvan Magalhaes PROPOSAL
Greenwood BologniaJapanAnna Fali UNQUALIFIED
Deepesh ChuiItalyAnna Fali PROPOSAL
Mayumi KolmetzJapanBernardo Dominic NEGOTIATION
James ButtRussiaAsiya Javayant RENEWAL
Aditya KuskoGermanyStephen Shaw PROPOSAL
Jones VocelkaCanadaOnyama Limba UNQUALIFIED
Mayumi KolmetzCanadaElwin Sharvill PROPOSAL
Jefferson SchemmerJapanOnyama Limba UNQUALIFIED
Murillo MaletAustraliaAmy Elsner QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Arvin AlbaresArgentinaAmy Elsner PROPOSAL
Sinclair WaycottItalyAnna Fali PROPOSAL
Johnson SergiAustraliaAsiya Javayant NEGOTIATION
Clifford RimAustraliaIoni Bowcher PROPOSAL
Arvin AlbaresBrazilAsiya Javayant RENEWAL
Smith GlickArgentinaAmy Elsner NEW
Aditya KuskoGermanyElwin Sharvill RENEWAL
Jennifer AmigonArgentinaAmy Elsner NEGOTIATION
Kaitlin OstroskyUnited KingdomIvan Magalhaes UNQUALIFIED
Tony FollerFranceIoni Bowcher QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Munro FerenczCanada2026-04-16Buckley Miller Wright UNQUALIFIED73Stephen Shaw
1001Clifford RimCanada2026-04-04Printing Dimensions NEGOTIATION16Onyama Limba
1002Johnson SergiFrance2026-04-21Chapman, Ross E Esq NEW42Ivan Magalhaes
1003Faith GillianArgentina2026-04-05Buckley Miller Wright RENEWAL89Amy Elsner
1004Jennifer AmigonFrance2026-03-30Rousseaux, Michael Esq PROPOSAL6Anna Fali
1005Cody SaylorsRussia2026-04-12Feltz Printing Service NEW71Ioni Bowcher
1006Salvatore StockhamItaly2026-03-23Commercial Press UNQUALIFIED37Asiya Javayant
1007Stacey MacleadCanada2026-03-24Feltz Printing Service UNQUALIFIED87Asiya Javayant
1008Johnson SergiJapan2026-04-10Morlong Associates PROPOSAL99Amy Elsner
1009Clifford RimIndia2026-04-20Benton, John B Jr QUALIFIED88Ivan Magalhaes
1010Wickens NestleRussia2026-04-17Chapman, Ross E Esq QUALIFIED0Asiya Javayant
1011Francesco ShinkoSpain2026-04-20Dorl, James J Esq NEGOTIATION26Stephen Shaw
1012Izzy GarufiCanada2026-04-08Truhlar And Truhlar Attys NEW0Amy Elsner
1013Salvatore StockhamArgentina2026-04-09Rousseaux, Michael Esq NEGOTIATION96Stephen Shaw
1014Chavez BriddickFrance2026-04-05Benton, John B Jr UNQUALIFIED90Ioni Bowcher
1015Sinclair WaycottGermany2026-03-31Feiner Bros NEW10Elwin Sharvill
1016Cody SaylorsArgentina2026-03-29King, Christopher A Esq NEW46Stephen Shaw
1017Claire TollnerAustralia2026-04-06Chapman, Ross E Esq NEGOTIATION2Bernardo Dominic
1018Francesco ShinkoSpain2026-04-06Chemel, James L Cpa NEGOTIATION0Onyama Limba
1019Maisha RulapaughGermany2026-04-19Feiner Bros QUALIFIED30Anna Fali
1020Claire TollnerItaly2026-04-08Chanay, Jeffrey A Esq NEW19Stephen Shaw
1021Rodrigues CampainUnited Kingdom2026-03-26King, Christopher A Esq RENEWAL60Elwin Sharvill
1022Isabel BowleyJapan2026-04-09King, Christopher A Esq QUALIFIED36Elwin Sharvill
1023Jefferson SchemmerIndia2026-04-16Buckley Miller Wright RENEWAL60Xuxue Feng
1024Leja CaldareraCanada2026-04-04Feiner Bros NEGOTIATION44Stephen Shaw
1025Emily WhobreyArgentina2026-04-02Chanay, Jeffrey A Esq PROPOSAL58Anna Fali
1026Misaki RoysterFrance2026-04-04Feltz Printing Service UNQUALIFIED79Asiya Javayant
1027Jeanfrancois VenereFrance2026-04-02Chanay, Jeffrey A Esq QUALIFIED91Amy Elsner
1028Faith GillianArgentina2026-04-09Chanay, Jeffrey A Esq NEW95Ioni Bowcher
1029Wickens NestleIndia2026-04-03Chemel, James L Cpa QUALIFIED84Amy Elsner
1030Kaitlin OstroskyIndia2026-04-02Chanay, Jeffrey A Esq QUALIFIED51Bernardo Dominic
1031Arvin AlbaresArgentina2026-04-04Rangoni Of Florence UNQUALIFIED81Elwin Sharvill
1032Wickens NestleCanada2026-04-11Chanay, Jeffrey A Esq NEGOTIATION45Onyama Limba
1033Misaki RoysterRussia2026-03-25Benton, John B Jr NEW94Anna Fali
1034Stacey MacleadAustralia2026-04-16Rangoni Of Florence NEW68Ioni Bowcher
1035Maisha RulapaughRussia2026-03-27Benton, John B Jr NEGOTIATION93Stephen Shaw
1036Tony FollerSpain2026-04-03Chemel, James L Cpa QUALIFIED16Ioni Bowcher
1037Ricardo GauchoRussia2026-04-04Commercial Press PROPOSAL56Elwin Sharvill
1038Clifford RimIndia2026-04-19Dorl, James J Esq PROPOSAL92Amy Elsner
1039Aditya KuskoAustralia2026-03-28Benton, John B Jr RENEWAL6Ivan Magalhaes
1040Adams MorascaArgentina2026-04-12Printing Dimensions UNQUALIFIED40Elwin Sharvill
1041Ashley DoeFrance2026-04-13Rousseaux, Michael Esq NEW20Anna Fali
1042Ricardo GauchoGermany2026-04-14Rangoni Of Florence QUALIFIED6Ioni Bowcher
1043Juan WieserCanada2026-04-17Feiner Bros NEW32Anna Fali
1044Aditya KuskoArgentina2026-04-21Dorl, James J Esq NEGOTIATION35Anna Fali
1045Smith GlickAustralia2026-04-01Chemel, James L Cpa NEW72Amy Elsner
1046Claire TollnerUnited Kingdom2026-04-21Buckley Miller Wright QUALIFIED0Ioni Bowcher
1047Aika InouyeUnited Kingdom2026-03-31Benton, John B Jr UNQUALIFIED11Xuxue Feng
1048Morrow RutaItaly2026-04-03Rangoni Of Florence UNQUALIFIED56Onyama Limba
1049Kadeem FlosiSpain2026-04-15Morlong Associates NEW0Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Rodrigues CampainBrazilAmy Elsner QUALIFIED
Mayumi KolmetzSpainAmy Elsner UNQUALIFIED
Kadeem FlosiUnited KingdomStephen Shaw RENEWAL
Jeanfrancois VenereAustraliaBernardo Dominic PROPOSAL
Francesco ShinkoFranceAnna Fali RENEWAL
Jones VocelkaIndiaXuxue Feng NEW
Ivar PaprockiUnited KingdomElwin Sharvill QUALIFIED
Kadeem FlosiJapanIvan Magalhaes UNQUALIFIED
James ButtAustraliaIoni Bowcher QUALIFIED
Jeanfrancois VenereUnited KingdomBernardo Dominic PROPOSAL
Faith GillianUnited KingdomXuxue Feng PROPOSAL
Francesco ShinkoAustraliaXuxue Feng NEW
Izzy GarufiGermanyElwin Sharvill QUALIFIED
Kadeem FlosiJapanIvan Magalhaes RENEWAL
Tony FollerArgentinaAmy Elsner NEW
Jennifer AmigonJapanAsiya Javayant NEW
Izzy GarufiArgentinaIvan Magalhaes RENEWAL
Arvin AlbaresIndiaIvan Magalhaes NEGOTIATION
Juan WieserArgentinaOnyama Limba PROPOSAL
Rodrigues CampainAustraliaAnna Fali NEGOTIATION
Adams MorascaArgentinaBernardo Dominic PROPOSAL
Clifford RimItalyBernardo Dominic QUALIFIED
David DarakjyArgentinaIvan Magalhaes RENEWAL
Darci PoquetteRussiaAmy Elsner UNQUALIFIED
Ashley DoeFranceBernardo Dominic RENEWAL
Wickens NestleIndiaBernardo Dominic UNQUALIFIED
Silvio SlusarskiGermanyBernardo Dominic NEGOTIATION
Maisha RulapaughGermanyIvan Magalhaes PROPOSAL
James ButtCanadaAsiya Javayant NEW
Cody SaylorsAustraliaAmy Elsner UNQUALIFIED
Aruna FigeroaAustraliaIoni Bowcher RENEWAL
Mujtaba NickaRussiaIvan Magalhaes RENEWAL
Smith GlickUnited KingdomXuxue Feng PROPOSAL
Faith GillianUnited KingdomIoni Bowcher PROPOSAL
Nicolas IturbideUnited KingdomOnyama Limba UNQUALIFIED
Wickens NestleRussiaBernardo Dominic NEW
Mujtaba NickaBrazilAsiya Javayant NEW
Clifford RimBrazilAmy Elsner QUALIFIED
Izzy GarufiArgentinaStephen Shaw NEGOTIATION
Arvin AlbaresFranceStephen Shaw NEW
Izzy GarufiArgentinaIvan Magalhaes RENEWAL
Clifford RimFranceStephen Shaw PROPOSAL
Isabel BowleyJapanStephen Shaw UNQUALIFIED
Munro FerenczBrazilStephen Shaw NEGOTIATION
Salvatore StockhamUnited KingdomAsiya Javayant PROPOSAL
David DarakjyItalyStephen Shaw NEGOTIATION
Mujtaba NickaCanadaXuxue Feng NEGOTIATION
Isabel BowleyFranceIoni Bowcher QUALIFIED
Johnson SergiArgentinaAsiya Javayant NEGOTIATION
Antonio CaudyJapanBernardo Dominic QUALIFIED
Frozen Columns
Name
Maisha Rulapaugh
Silvio Slusarski
Alejandro Perin
Ashley Doe
Greenwood Bolognia
Johnson Sergi
Johnson Sergi
Faith Gillian
Salvatore Stockham
Nicolas Iturbide
Ashley Doe
Tony Foller
Morrow Ruta
Arvin Albares
Leja Caldarera
David Darakjy
Antonio Caudy
Faith Gillian
Maisha Rulapaugh
Arvin Albares
Misaki Royster
Kaitlin Ostrosky
Cody Saylors
Arvin Albares
Costa Dilliard
Francesco Shinko
Jennifer Amigon
Cody Saylors
Kadeem Flosi
Mujtaba Nicka
Faith Gillian
Deepesh Chui
Morrow Ruta
James Butt
Mayumi Kolmetz
David Darakjy
Morrow Ruta
Emily Whobrey
Jeanfrancois Venere
Darci Poquette
Smith Glick
Ashley Doe
Sinclair Waycott
Greenwood Bolognia
Leon Oldroyd
Adams Morasca
Darci Poquette
Nicolas Iturbide
Stacey Maclead
Mujtaba Nicka
IdCountryDate
1000France2026-03-25
1001Spain2026-03-25
1002Spain2026-03-26
1003Canada2026-03-25
1004Italy2026-04-11
1005Australia2026-04-16
1006Italy2026-03-26
1007Australia2026-03-29
1008United Kingdom2026-03-30
1009Germany2026-04-11
1010Australia2026-03-26
1011Spain2026-04-16
1012Japan2026-03-31
1013Japan2026-04-19
1014India2026-04-01
1015Brazil2026-04-21
1016France2026-04-03
1017Germany2026-03-24
1018Canada2026-04-05
1019United Kingdom2026-04-10
1020Australia2026-04-02
1021Argentina2026-04-18
1022Brazil2026-04-16
1023Russia2026-03-24
1024Spain2026-04-15
1025Japan2026-03-27
1026India2026-04-17
1027Argentina2026-03-28
1028Italy2026-04-06
1029Argentina2026-04-20
1030Argentina2026-04-18
1031Japan2026-04-10
1032United Kingdom2026-04-03
1033Germany2026-04-19
1034Germany2026-04-21
1035Russia2026-04-01
1036Italy2026-04-21
1037Russia2026-04-17
1038Brazil2026-04-02
1039Canada2026-03-26
1040Argentina2026-03-26
1041Russia2026-03-23
1042Germany2026-04-02
1043Japan2026-04-19
1044Brazil2026-03-30
1045Italy2026-04-01
1046United Kingdom2026-03-29
1047Argentina2026-03-24
1048Canada2026-04-15
1049United Kingdom2026-04-16

On-Demand Data

NameIdCountryDate
Kadeem Flosi1000Japan2026-04-01
Leon Oldroyd1001France2026-04-13
Alejandro Perin1002Australia2026-04-18
Clifford Rim1003India2026-03-30
Murillo Malet1004India2026-03-26
Stacey Maclead1005Germany2026-04-17
David Darakjy1006Australia2026-04-18
Isabel Bowley1007Canada2026-04-20
Misaki Royster1008India2026-04-19
Kadeem Flosi1009Italy2026-04-08
Salvatore Stockham1010France2026-04-15
Juan Wieser1011Argentina2026-03-25
Isabel Bowley1012Canada2026-04-14
Isabel Bowley1013India2026-04-06
David Darakjy1014Australia2026-03-27
Aruna Figeroa1015Spain2026-03-28
Julie Stenseth1016Australia2026-03-27
Morrow Ruta1017Japan2026-04-03
Nicolas Iturbide1018Italy2026-03-24
Jefferson Schemmer1019Russia2026-03-29
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Darci PoquetteItalyAnna Fali UNQUALIFIED
Leja CaldareraCanadaAmy Elsner UNQUALIFIED
Adams MorascaGermanyElwin Sharvill QUALIFIED
Chavez BriddickFranceXuxue Feng NEGOTIATION
Isabel BowleyJapanStephen Shaw NEW
Aika InouyeGermanyXuxue Feng NEGOTIATION
Maria MarrierAustraliaIvan Magalhaes RENEWAL
James ButtUnited KingdomStephen Shaw PROPOSAL
Misaki RoysterUnited KingdomIoni Bowcher RENEWAL
Stacey MacleadCanadaAmy Elsner UNQUALIFIED
Alejandro PerinGermanyBernardo Dominic NEGOTIATION
Maisha RulapaughRussiaBernardo Dominic NEW
Jeanfrancois VenereUnited KingdomElwin Sharvill NEGOTIATION
Morrow RutaSpainXuxue Feng QUALIFIED
Wickens NestleArgentinaAnna Fali UNQUALIFIED
Kaitlin OstroskyRussiaIvan Magalhaes PROPOSAL
Julie StensethItalyIoni Bowcher QUALIFIED
Johnson SergiArgentinaIoni Bowcher RENEWAL
Kadeem FlosiRussiaXuxue Feng RENEWAL
Isabel BowleyGermanyOnyama Limba NEGOTIATION
Sinclair WaycottCanadaBernardo Dominic QUALIFIED
Maria MarrierSpainAsiya Javayant QUALIFIED
Aruna FigeroaBrazilAsiya Javayant NEW
Munro FerenczSpainBernardo Dominic RENEWAL
Ashley DoeCanadaStephen Shaw UNQUALIFIED
Silvio SlusarskiCanadaIoni Bowcher NEGOTIATION
Tony FollerArgentinaIoni Bowcher NEW
Jefferson SchemmerAustraliaElwin Sharvill PROPOSAL
Alejandro PerinJapanAnna Fali UNQUALIFIED
Jennifer AmigonRussiaAsiya Javayant NEGOTIATION
Leon OldroydAustraliaXuxue Feng NEW
Alejandro PerinArgentinaBernardo Dominic NEGOTIATION
Sinclair WaycottCanadaAmy Elsner RENEWAL
Kadeem FlosiItalyBernardo Dominic RENEWAL
Ricardo GauchoSpainIoni Bowcher NEGOTIATION
David DarakjyIndiaElwin Sharvill PROPOSAL
Silvio SlusarskiAustraliaAmy Elsner NEGOTIATION
Isabel BowleyFranceAmy Elsner RENEWAL
Maria MarrierFranceAmy Elsner QUALIFIED
David DarakjyBrazilAmy Elsner RENEWAL

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