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
Rodrigues CampainArgentinaElwin Sharvill PROPOSAL
Octavia MaletArgentinaIvan Magalhaes NEGOTIATION
Kadeem FlosiItalyIvan Magalhaes PROPOSAL
Ricardo GauchoBrazilAnna Fali NEW
Aditya KuskoJapanAsiya Javayant NEGOTIATION
Aika InouyeItalyXuxue Feng QUALIFIED
Maisha RulapaughIndiaXuxue Feng UNQUALIFIED
Aruna FigeroaCanadaIoni Bowcher NEGOTIATION
Jones VocelkaItalyStephen Shaw NEW
Jones VocelkaIndiaAsiya Javayant NEGOTIATION
Darci PoquetteRussiaAmy Elsner UNQUALIFIED
Costa DilliardArgentinaOnyama Limba RENEWAL
Morrow RutaRussiaAmy Elsner NEGOTIATION
Darci PoquetteCanadaStephen Shaw RENEWAL
Misaki RoysterUnited KingdomAnna Fali UNQUALIFIED
Isabel BowleyGermanyIoni Bowcher RENEWAL
Kadeem FlosiUnited KingdomIoni Bowcher NEGOTIATION
Smith GlickFranceIvan Magalhaes PROPOSAL
Jeanfrancois VenereBrazilAnna Fali PROPOSAL
Sinclair WaycottGermanyAsiya Javayant NEW
Ivar PaprockiRussiaIoni Bowcher NEW
Emily WhobreySpainStephen Shaw NEW
Jefferson SchemmerGermanyXuxue Feng RENEWAL
Jeanfrancois VenereGermanyAsiya Javayant NEW
Sinclair WaycottGermanyAmy Elsner NEGOTIATION
Jefferson SchemmerGermanyBernardo Dominic NEGOTIATION
Munro FerenczJapanElwin Sharvill QUALIFIED
Kadeem FlosiCanadaIoni Bowcher PROPOSAL
Mayumi KolmetzSpainAnna Fali RENEWAL
Morrow RutaCanadaIvan Magalhaes RENEWAL
Silvio SlusarskiArgentinaStephen Shaw QUALIFIED
Maria MarrierUnited KingdomStephen Shaw NEGOTIATION
Julie StensethGermanyElwin Sharvill RENEWAL
Silvio SlusarskiCanadaStephen Shaw PROPOSAL
Juan WieserJapanAsiya Javayant NEW
Julie StensethBrazilXuxue Feng PROPOSAL
Chavez BriddickRussiaAnna Fali RENEWAL
Murillo MaletItalyXuxue Feng UNQUALIFIED
Nicolas IturbideGermanyIoni Bowcher RENEWAL
Darci PoquetteAustraliaAsiya Javayant PROPOSAL
Aika InouyeIndiaAmy Elsner NEGOTIATION
Leon OldroydCanadaElwin Sharvill QUALIFIED
Morrow RutaRussiaElwin Sharvill NEW
Leon OldroydUnited KingdomAsiya Javayant QUALIFIED
Sinclair WaycottItalyBernardo Dominic QUALIFIED
Aika InouyeJapanXuxue Feng UNQUALIFIED
Murillo MaletAustraliaElwin Sharvill PROPOSAL
Ricardo GauchoItalyXuxue Feng RENEWAL
Mujtaba NickaAustraliaXuxue Feng PROPOSAL
Emily WhobreyUnited KingdomAmy Elsner NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Aruna FigeroaCanadaOnyama Limba PROPOSAL
Jeanfrancois VenereArgentinaAsiya Javayant NEGOTIATION
Jennifer AmigonItalyIvan Magalhaes NEGOTIATION
Stacey MacleadAustraliaIoni Bowcher NEGOTIATION
Smith GlickSpainIvan Magalhaes NEW
Chavez BriddickBrazilStephen Shaw NEW
Maria MarrierAustraliaIoni Bowcher UNQUALIFIED
Deepesh ChuiSpainAsiya Javayant PROPOSAL
Wickens NestleBrazilStephen Shaw QUALIFIED
David DarakjyUnited KingdomOnyama Limba NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Octavia MaletArgentina2026-05-13Chapman, Ross E Esq UNQUALIFIED23Anna Fali
1001Jeanfrancois VenereRussia2026-06-01Feltz Printing Service NEW56Ioni Bowcher
1002Jefferson SchemmerFrance2026-06-01Morlong Associates UNQUALIFIED84Asiya Javayant
1003Ricardo GauchoArgentina2026-05-16Chapman, Ross E Esq UNQUALIFIED93Asiya Javayant
1004Murillo MaletAustralia2026-05-21Benton, John B Jr NEW26Xuxue Feng
1005Tony FollerIndia2026-05-11Chanay, Jeffrey A Esq UNQUALIFIED11Bernardo Dominic
1006Stacey MacleadUnited Kingdom2026-05-18Rousseaux, Michael Esq QUALIFIED60Stephen Shaw
1007Smith GlickSpain2026-05-09Chapman, Ross E Esq NEGOTIATION27Ivan Magalhaes
1008Aditya KuskoJapan2026-05-16Chanay, Jeffrey A Esq NEW54Anna Fali
1009Juan WieserAustralia2026-05-05Chapman, Ross E Esq RENEWAL50Anna Fali
1010Ivar PaprockiUnited Kingdom2026-05-15Dorl, James J Esq RENEWAL17Xuxue Feng
1011Greenwood BologniaAustralia2026-05-20Buckley Miller Wright NEW95Ioni Bowcher
1012James ButtBrazil2026-05-15Feiner Bros NEGOTIATION97Anna Fali
1013Aditya KuskoUnited Kingdom2026-05-12Benton, John B Jr NEGOTIATION79Ivan Magalhaes
1014Emily WhobreyRussia2026-05-14Benton, John B Jr NEW64Bernardo Dominic
1015Aditya KuskoGermany2026-05-05Truhlar And Truhlar Attys RENEWAL44Amy Elsner
1016Maria MarrierFrance2026-05-22Feltz Printing Service RENEWAL49Elwin Sharvill
1017Munro FerenczCanada2026-05-15Feltz Printing Service UNQUALIFIED63Xuxue Feng
1018Leja CaldareraArgentina2026-05-09Commercial Press NEGOTIATION39Xuxue Feng
1019Claire TollnerBrazil2026-05-20Dorl, James J Esq QUALIFIED30Bernardo Dominic
1020Arvin AlbaresArgentina2026-05-13Printing Dimensions PROPOSAL18Onyama Limba
1021Maria MarrierFrance2026-05-17Chanay, Jeffrey A Esq RENEWAL22Amy Elsner
1022Kaitlin OstroskyRussia2026-05-19Dorl, James J Esq PROPOSAL82Anna Fali
1023Stacey MacleadJapan2026-05-22Rousseaux, Michael Esq PROPOSAL83Asiya Javayant
1024Ivar PaprockiItaly2026-05-10Feiner Bros QUALIFIED5Ivan Magalhaes
1025Darci PoquetteFrance2026-05-19Buckley Miller Wright RENEWAL2Onyama Limba
1026Kaitlin OstroskyFrance2026-05-06Dorl, James J Esq NEW37Ivan Magalhaes
1027Kaitlin OstroskyUnited Kingdom2026-05-22Benton, John B Jr NEW11Stephen Shaw
1028Costa DilliardCanada2026-05-25Chemel, James L Cpa PROPOSAL55Bernardo Dominic
1029Adams MorascaAustralia2026-06-02Rangoni Of Florence RENEWAL59Amy Elsner
1030Murillo MaletBrazil2026-05-16Chemel, James L Cpa UNQUALIFIED44Onyama Limba
1031Jones VocelkaSpain2026-05-10King, Christopher A Esq RENEWAL24Amy Elsner
1032Kaitlin OstroskyAustralia2026-05-08Morlong Associates NEGOTIATION81Xuxue Feng
1033Arvin AlbaresCanada2026-05-08Truhlar And Truhlar Attys NEGOTIATION89Asiya Javayant
1034Julie StensethGermany2026-05-07Commercial Press NEGOTIATION58Bernardo Dominic
1035Jefferson SchemmerIndia2026-05-20Chanay, Jeffrey A Esq UNQUALIFIED8Xuxue Feng
1036Jefferson SchemmerArgentina2026-05-19Morlong Associates QUALIFIED55Xuxue Feng
1037Smith GlickCanada2026-05-17Feltz Printing Service RENEWAL18Bernardo Dominic
1038David DarakjyRussia2026-05-18King, Christopher A Esq UNQUALIFIED7Ioni Bowcher
1039Munro FerenczAustralia2026-05-10Chapman, Ross E Esq NEGOTIATION37Ivan Magalhaes
1040Francesco ShinkoIndia2026-05-18Buckley Miller Wright RENEWAL23Bernardo Dominic
1041Morrow RutaFrance2026-05-08Benton, John B Jr UNQUALIFIED11Bernardo Dominic
1042Deepesh ChuiSpain2026-05-31Feiner Bros RENEWAL98Xuxue Feng
1043Mujtaba NickaArgentina2026-05-27Chanay, Jeffrey A Esq NEW20Elwin Sharvill
1044Julie StensethCanada2026-05-16Truhlar And Truhlar Attys QUALIFIED78Xuxue Feng
1045Francesco ShinkoRussia2026-05-31Chemel, James L Cpa PROPOSAL48Asiya Javayant
1046Cody SaylorsCanada2026-05-09Chanay, Jeffrey A Esq UNQUALIFIED39Onyama Limba
1047Emily WhobreySpain2026-05-08Morlong Associates RENEWAL1Ioni Bowcher
1048Stacey MacleadAustralia2026-05-07Chapman, Ross E Esq QUALIFIED72Amy Elsner
1049Kaitlin OstroskyBrazil2026-05-09Buckley Miller Wright QUALIFIED91Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Greenwood BologniaItalyAnna Fali QUALIFIED
Isabel BowleyFranceIoni Bowcher RENEWAL
Kaitlin OstroskyIndiaIvan Magalhaes PROPOSAL
Cody SaylorsCanadaStephen Shaw UNQUALIFIED
Leja CaldareraRussiaElwin Sharvill QUALIFIED
Johnson SergiFranceAnna Fali QUALIFIED
Misaki RoysterSpainAnna Fali RENEWAL
Sinclair WaycottRussiaXuxue Feng NEW
Munro FerenczGermanyAnna Fali PROPOSAL
Emily WhobreyUnited KingdomOnyama Limba UNQUALIFIED
Juan WieserSpainIvan Magalhaes RENEWAL
Francesco ShinkoItalyIvan Magalhaes NEGOTIATION
Smith GlickItalyElwin Sharvill NEW
Claire TollnerGermanyElwin Sharvill UNQUALIFIED
David DarakjySpainAnna Fali NEW
Jones VocelkaIndiaAnna Fali NEW
Aruna FigeroaGermanyIoni Bowcher UNQUALIFIED
Stacey MacleadRussiaIvan Magalhaes NEW
Johnson SergiItalyAnna Fali NEW
Johnson SergiIndiaBernardo Dominic QUALIFIED
Ivar PaprockiSpainElwin Sharvill PROPOSAL
Octavia MaletBrazilStephen Shaw QUALIFIED
Leja CaldareraGermanyIvan Magalhaes NEW
Darci PoquetteFranceStephen Shaw PROPOSAL
Aditya KuskoBrazilOnyama Limba NEW
Cody SaylorsAustraliaIvan Magalhaes NEW
Costa DilliardGermanyXuxue Feng RENEWAL
Julie StensethFranceAnna Fali NEW
Jennifer AmigonAustraliaAmy Elsner UNQUALIFIED
Maria MarrierJapanIoni Bowcher RENEWAL
Chavez BriddickBrazilAnna Fali QUALIFIED
Kadeem FlosiJapanIvan Magalhaes UNQUALIFIED
Francesco ShinkoCanadaOnyama Limba NEW
Munro FerenczUnited KingdomStephen Shaw UNQUALIFIED
Octavia MaletItalyStephen Shaw RENEWAL
Mayumi KolmetzIndiaOnyama Limba NEGOTIATION
Kaitlin OstroskyRussiaIoni Bowcher PROPOSAL
Emily WhobreyAustraliaElwin Sharvill NEW
Wickens NestleRussiaIvan Magalhaes NEW
Silvio SlusarskiUnited KingdomIvan Magalhaes NEW
Salvatore StockhamArgentinaElwin Sharvill RENEWAL
Mayumi KolmetzGermanyXuxue Feng NEW
Rodrigues CampainGermanyIvan Magalhaes NEGOTIATION
Kaitlin OstroskyJapanAnna Fali QUALIFIED
Juan WieserItalyBernardo Dominic QUALIFIED
Kaitlin OstroskyRussiaOnyama Limba PROPOSAL
Nicolas IturbideGermanyIvan Magalhaes QUALIFIED
Jeanfrancois VenereArgentinaAmy Elsner QUALIFIED
Aika InouyeItalyAsiya Javayant NEGOTIATION
Munro FerenczIndiaElwin Sharvill NEW
Frozen Columns
Name
Chavez Briddick
Aika Inouye
Deepesh Chui
Deepesh Chui
Mayumi Kolmetz
Munro Ferencz
James Butt
Jones Vocelka
Nicolas Iturbide
Aruna Figeroa
Kadeem Flosi
Francesco Shinko
Stacey Maclead
Kaitlin Ostrosky
Francesco Shinko
Murillo Malet
Leja Caldarera
Jeanfrancois Venere
Munro Ferencz
Mayumi Kolmetz
Murillo Malet
Claire Tollner
Rodrigues Campain
Smith Glick
Julie Stenseth
Julie Stenseth
Maisha Rulapaugh
Nicolas Iturbide
Adams Morasca
Costa Dilliard
Aruna Figeroa
Ivar Paprocki
Misaki Royster
Mujtaba Nicka
Smith Glick
Darci Poquette
Greenwood Bolognia
Francesco Shinko
Rodrigues Campain
Munro Ferencz
James Butt
Aditya Kusko
Izzy Garufi
Sinclair Waycott
Leja Caldarera
Aruna Figeroa
Juan Wieser
Ashley Doe
Cody Saylors
Chavez Briddick
IdCountryDate
1000Japan2026-06-02
1001Argentina2026-05-15
1002Japan2026-05-21
1003Argentina2026-06-02
1004Germany2026-05-21
1005Spain2026-05-18
1006Brazil2026-06-02
1007Spain2026-05-22
1008Italy2026-05-22
1009United Kingdom2026-05-08
1010United Kingdom2026-05-29
1011India2026-05-07
1012France2026-05-18
1013Canada2026-05-13
1014Australia2026-05-17
1015United Kingdom2026-05-30
1016Argentina2026-05-27
1017Spain2026-05-27
1018Germany2026-05-25
1019France2026-05-23
1020India2026-06-02
1021Brazil2026-05-26
1022Russia2026-05-20
1023Germany2026-05-25
1024Russia2026-05-17
1025Canada2026-05-19
1026Brazil2026-05-24
1027Germany2026-05-14
1028Brazil2026-05-19
1029France2026-06-01
1030France2026-05-11
1031Spain2026-05-24
1032Brazil2026-05-29
1033Russia2026-05-30
1034Brazil2026-05-14
1035Italy2026-05-12
1036Australia2026-05-20
1037Japan2026-05-30
1038United Kingdom2026-05-20
1039Argentina2026-05-12
1040United Kingdom2026-05-23
1041India2026-05-23
1042Brazil2026-05-12
1043Spain2026-06-02
1044Canada2026-05-10
1045Italy2026-06-01
1046France2026-05-28
1047France2026-05-25
1048Russia2026-05-13
1049Germany2026-05-09

On-Demand Data

NameIdCountryDate
Emily Whobrey1000United Kingdom2026-05-04
Aruna Figeroa1001Australia2026-05-31
Leja Caldarera1002Spain2026-05-27
Kaitlin Ostrosky1003India2026-05-22
Juan Wieser1004United Kingdom2026-05-28
Costa Dilliard1005France2026-05-29
Emily Whobrey1006Japan2026-05-23
Mayumi Kolmetz1007Germany2026-05-15
Salvatore Stockham1008Spain2026-05-08
Morrow Ruta1009Germany2026-05-14
Antonio Caudy1010Italy2026-05-09
Greenwood Bolognia1011India2026-05-18
Chavez Briddick1012France2026-05-26
Claire Tollner1013France2026-05-15
Leon Oldroyd1014Argentina2026-05-05
Alejandro Perin1015France2026-05-31
Sinclair Waycott1016Canada2026-05-21
Greenwood Bolognia1017Japan2026-05-26
Silvio Slusarski1018Japan2026-05-22
Greenwood Bolognia1019Italy2026-05-30
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aruna FigeroaArgentinaAnna Fali QUALIFIED
Salvatore StockhamItalyElwin Sharvill NEW
Murillo MaletBrazilElwin Sharvill PROPOSAL
Izzy GarufiRussiaOnyama Limba QUALIFIED
Julie StensethRussiaAmy Elsner NEW
Faith GillianArgentinaAmy Elsner QUALIFIED
Mayumi KolmetzCanadaAnna Fali RENEWAL
Jeanfrancois VenereIndiaStephen Shaw NEW
Rodrigues CampainGermanyBernardo Dominic NEGOTIATION
Claire TollnerGermanyBernardo Dominic QUALIFIED
Murillo MaletRussiaAnna Fali NEGOTIATION
Faith GillianRussiaOnyama Limba NEGOTIATION
Leon OldroydCanadaIoni Bowcher NEW
Arvin AlbaresGermanyElwin Sharvill NEGOTIATION
Adams MorascaAustraliaOnyama Limba NEGOTIATION
Darci PoquetteIndiaBernardo Dominic NEW
Darci PoquetteCanadaAsiya Javayant QUALIFIED
Juan WieserFranceAmy Elsner NEW
Jeanfrancois VenereFranceStephen Shaw PROPOSAL
Kadeem FlosiGermanyOnyama Limba NEGOTIATION
Aika InouyeFranceElwin Sharvill RENEWAL
Leon OldroydCanadaAsiya Javayant QUALIFIED
Maisha RulapaughItalyElwin Sharvill RENEWAL
Izzy GarufiRussiaAnna Fali NEW
Alejandro PerinBrazilStephen Shaw UNQUALIFIED
Jeanfrancois VenereAustraliaOnyama Limba PROPOSAL
Isabel BowleyItalyIoni Bowcher PROPOSAL
Wickens NestleItalyIoni Bowcher NEW
Emily WhobreyUnited KingdomStephen Shaw PROPOSAL
Mujtaba NickaArgentinaOnyama Limba NEGOTIATION
Aika InouyeUnited KingdomStephen Shaw QUALIFIED
Juan WieserJapanXuxue Feng RENEWAL
Isabel BowleyBrazilAmy Elsner QUALIFIED
James ButtGermanyElwin Sharvill QUALIFIED
Aika InouyeRussiaXuxue Feng NEW
Antonio CaudyRussiaIvan Magalhaes PROPOSAL
Antonio CaudyRussiaIvan Magalhaes QUALIFIED
Clifford RimBrazilBernardo Dominic NEW
Julie StensethCanadaAsiya Javayant PROPOSAL
Julie StensethSpainAnna Fali 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>