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 SergiUnited KingdomXuxue Feng NEW
Stacey MacleadIndiaStephen Shaw RENEWAL
Chavez BriddickSpainIoni Bowcher QUALIFIED
Munro FerenczGermanyIoni Bowcher PROPOSAL
Jones VocelkaSpainIoni Bowcher NEW
Cody SaylorsFranceBernardo Dominic RENEWAL
Ivar PaprockiArgentinaAnna Fali RENEWAL
Cody SaylorsCanadaIvan Magalhaes UNQUALIFIED
Francesco ShinkoArgentinaIoni Bowcher RENEWAL
Greenwood BologniaJapanStephen Shaw UNQUALIFIED
Costa DilliardFranceStephen Shaw NEGOTIATION
Isabel BowleyFranceElwin Sharvill NEW
Claire TollnerArgentinaElwin Sharvill UNQUALIFIED
Mujtaba NickaSpainElwin Sharvill NEGOTIATION
David DarakjyFranceIoni Bowcher RENEWAL
Aika InouyeUnited KingdomIvan Magalhaes NEGOTIATION
Jennifer AmigonGermanyElwin Sharvill NEW
Salvatore StockhamIndiaOnyama Limba UNQUALIFIED
Julie StensethCanadaIoni Bowcher RENEWAL
Munro FerenczFranceStephen Shaw UNQUALIFIED
Tony FollerAustraliaElwin Sharvill NEGOTIATION
Emily WhobreyIndiaOnyama Limba QUALIFIED
Mayumi KolmetzSpainIvan Magalhaes NEW
Aditya KuskoCanadaAmy Elsner PROPOSAL
Octavia MaletJapanXuxue Feng UNQUALIFIED
Nicolas IturbideArgentinaAsiya Javayant NEGOTIATION
Kaitlin OstroskyFranceAnna Fali QUALIFIED
Maria MarrierRussiaIoni Bowcher UNQUALIFIED
Izzy GarufiGermanyStephen Shaw NEGOTIATION
Silvio SlusarskiBrazilIvan Magalhaes UNQUALIFIED
Jones VocelkaRussiaElwin Sharvill UNQUALIFIED
Emily WhobreyAustraliaElwin Sharvill PROPOSAL
Mujtaba NickaJapanOnyama Limba QUALIFIED
Stacey MacleadUnited KingdomXuxue Feng PROPOSAL
Isabel BowleyGermanyXuxue Feng NEGOTIATION
Claire TollnerFranceBernardo Dominic RENEWAL
Maisha RulapaughAustraliaStephen Shaw PROPOSAL
David DarakjyJapanAsiya Javayant NEW
Faith GillianIndiaAnna Fali NEW
Chavez BriddickItalyStephen Shaw QUALIFIED
Kadeem FlosiBrazilBernardo Dominic NEW
Morrow RutaIndiaBernardo Dominic QUALIFIED
Jefferson SchemmerItalyStephen Shaw QUALIFIED
Mujtaba NickaGermanyAmy Elsner QUALIFIED
Aruna FigeroaIndiaElwin Sharvill PROPOSAL
Kaitlin OstroskyItalyAsiya Javayant QUALIFIED
Izzy GarufiUnited KingdomAmy Elsner QUALIFIED
Faith GillianUnited KingdomStephen Shaw PROPOSAL
Rodrigues CampainIndiaXuxue Feng PROPOSAL
Ricardo GauchoItalyIoni Bowcher QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Munro FerenczArgentinaBernardo Dominic RENEWAL
Emily WhobreyCanadaStephen Shaw NEW
Julie StensethBrazilIvan Magalhaes NEGOTIATION
Aruna FigeroaGermanyIoni Bowcher NEW
Silvio SlusarskiGermanyElwin Sharvill QUALIFIED
Maria MarrierIndiaIvan Magalhaes RENEWAL
Arvin AlbaresSpainAsiya Javayant NEGOTIATION
Jones VocelkaRussiaOnyama Limba QUALIFIED
Deepesh ChuiUnited KingdomXuxue Feng PROPOSAL
Salvatore StockhamSpainIvan Magalhaes UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Munro FerenczRussia2026-05-01Chanay, Jeffrey A Esq PROPOSAL34Onyama Limba
1001Darci PoquetteArgentina2026-05-14Chanay, Jeffrey A Esq NEW40Amy Elsner
1002Sinclair WaycottGermany2026-05-17Commercial Press PROPOSAL22Asiya Javayant
1003Ashley DoeItaly2026-05-25Rangoni Of Florence PROPOSAL34Bernardo Dominic
1004Misaki RoysterCanada2026-05-12Dorl, James J Esq RENEWAL94Amy Elsner
1005Adams MorascaGermany2026-05-06Rousseaux, Michael Esq PROPOSAL28Ioni Bowcher
1006Claire TollnerItaly2026-05-07Printing Dimensions PROPOSAL97Ivan Magalhaes
1007Izzy GarufiUnited Kingdom2026-04-29Morlong Associates NEW20Xuxue Feng
1008Emily WhobreyUnited Kingdom2026-05-17Dorl, James J Esq QUALIFIED66Onyama Limba
1009Costa DilliardItaly2026-05-16Rangoni Of Florence NEW59Bernardo Dominic
1010Aika InouyeCanada2026-05-13Benton, John B Jr PROPOSAL29Ioni Bowcher
1011Alejandro PerinFrance2026-05-21Chemel, James L Cpa UNQUALIFIED69Ioni Bowcher
1012Darci PoquetteJapan2026-05-02Buckley Miller Wright NEGOTIATION10Xuxue Feng
1013Murillo MaletRussia2026-05-13Feiner Bros NEW84Bernardo Dominic
1014Smith GlickAustralia2026-05-26Feltz Printing Service NEGOTIATION52Elwin Sharvill
1015Isabel BowleyCanada2026-05-03Dorl, James J Esq UNQUALIFIED34Elwin Sharvill
1016Mayumi KolmetzUnited Kingdom2026-05-06Printing Dimensions UNQUALIFIED40Elwin Sharvill
1017Clifford RimGermany2026-04-29Morlong Associates NEGOTIATION65Elwin Sharvill
1018Jefferson SchemmerSpain2026-05-25Truhlar And Truhlar Attys NEGOTIATION25Asiya Javayant
1019Clifford RimIndia2026-04-29Buckley Miller Wright PROPOSAL26Asiya Javayant
1020Maisha RulapaughGermany2026-05-23Benton, John B Jr QUALIFIED94Onyama Limba
1021Chavez BriddickJapan2026-05-14Benton, John B Jr PROPOSAL30Ioni Bowcher
1022Johnson SergiItaly2026-05-02Rangoni Of Florence UNQUALIFIED33Asiya Javayant
1023Mayumi KolmetzUnited Kingdom2026-05-13Chemel, James L Cpa QUALIFIED59Xuxue Feng
1024Sinclair WaycottItaly2026-05-23King, Christopher A Esq QUALIFIED7Bernardo Dominic
1025Leja CaldareraSpain2026-05-23Morlong Associates PROPOSAL68Stephen Shaw
1026Aruna FigeroaFrance2026-05-22Morlong Associates PROPOSAL0Ioni Bowcher
1027Smith GlickSpain2026-05-17Chapman, Ross E Esq RENEWAL79Xuxue Feng
1028Izzy GarufiArgentina2026-05-26Benton, John B Jr PROPOSAL72Stephen Shaw
1029Leon OldroydBrazil2026-04-30Chapman, Ross E Esq NEGOTIATION58Asiya Javayant
1030Jennifer AmigonUnited Kingdom2026-05-24Dorl, James J Esq QUALIFIED66Anna Fali
1031Octavia MaletAustralia2026-05-26Buckley Miller Wright PROPOSAL81Anna Fali
1032Clifford RimGermany2026-05-12Morlong Associates PROPOSAL58Bernardo Dominic
1033Rodrigues CampainBrazil2026-04-29Chapman, Ross E Esq QUALIFIED80Asiya Javayant
1034Chavez BriddickArgentina2026-05-22Rangoni Of Florence RENEWAL14Ivan Magalhaes
1035Kaitlin OstroskyCanada2026-05-14Buckley Miller Wright PROPOSAL91Bernardo Dominic
1036Munro FerenczBrazil2026-05-18Feltz Printing Service RENEWAL57Stephen Shaw
1037Clifford RimRussia2026-05-16Chanay, Jeffrey A Esq PROPOSAL10Xuxue Feng
1038Cody SaylorsItaly2026-05-11Commercial Press UNQUALIFIED73Onyama Limba
1039Smith GlickArgentina2026-05-06Rangoni Of Florence RENEWAL88Anna Fali
1040Jennifer AmigonSpain2026-05-08King, Christopher A Esq UNQUALIFIED39Amy Elsner
1041Isabel BowleyIndia2026-05-11Chapman, Ross E Esq PROPOSAL53Elwin Sharvill
1042Munro FerenczAustralia2026-05-10Printing Dimensions NEGOTIATION26Anna Fali
1043Chavez BriddickCanada2026-05-24Commercial Press RENEWAL78Amy Elsner
1044Arvin AlbaresAustralia2026-05-08Printing Dimensions UNQUALIFIED4Amy Elsner
1045Jennifer AmigonJapan2026-04-30Printing Dimensions QUALIFIED72Elwin Sharvill
1046Murillo MaletUnited Kingdom2026-04-29Benton, John B Jr PROPOSAL23Xuxue Feng
1047Chavez BriddickRussia2026-05-15Truhlar And Truhlar Attys NEW84Onyama Limba
1048Octavia MaletJapan2026-04-27Chanay, Jeffrey A Esq PROPOSAL94Bernardo Dominic
1049Morrow RutaGermany2026-05-07Benton, John B Jr RENEWAL87Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Jeanfrancois VenereAustraliaOnyama Limba RENEWAL
Emily WhobreyBrazilAmy Elsner RENEWAL
Adams MorascaIndiaXuxue Feng QUALIFIED
Murillo MaletGermanyIvan Magalhaes NEW
Wickens NestleArgentinaAsiya Javayant PROPOSAL
Nicolas IturbideItalyIoni Bowcher NEGOTIATION
Leja CaldareraSpainStephen Shaw RENEWAL
Silvio SlusarskiItalyStephen Shaw NEGOTIATION
Morrow RutaFranceStephen Shaw PROPOSAL
Kaitlin OstroskyJapanAsiya Javayant UNQUALIFIED
Murillo MaletAustraliaIoni Bowcher NEGOTIATION
Leon OldroydSpainAsiya Javayant NEW
Jefferson SchemmerIndiaIoni Bowcher NEW
Aruna FigeroaJapanAmy Elsner RENEWAL
Julie StensethGermanyElwin Sharvill RENEWAL
Mayumi KolmetzBrazilStephen Shaw RENEWAL
Misaki RoysterJapanAsiya Javayant QUALIFIED
Smith GlickAustraliaStephen Shaw NEW
Julie StensethJapanIvan Magalhaes NEGOTIATION
Kadeem FlosiJapanBernardo Dominic UNQUALIFIED
Antonio CaudyArgentinaElwin Sharvill NEW
Munro FerenczGermanyAmy Elsner RENEWAL
Jones VocelkaRussiaOnyama Limba NEGOTIATION
Aruna FigeroaCanadaIvan Magalhaes NEW
Faith GillianBrazilAnna Fali UNQUALIFIED
Octavia MaletCanadaOnyama Limba NEW
Claire TollnerRussiaBernardo Dominic PROPOSAL
Emily WhobreyFranceOnyama Limba PROPOSAL
Cody SaylorsUnited KingdomXuxue Feng PROPOSAL
Tony FollerGermanyAnna Fali NEGOTIATION
Juan WieserJapanAmy Elsner PROPOSAL
Darci PoquetteRussiaIoni Bowcher NEW
Nicolas IturbideArgentinaBernardo Dominic QUALIFIED
Leon OldroydFranceXuxue Feng RENEWAL
Wickens NestleIndiaIoni Bowcher NEW
Aditya KuskoRussiaAmy Elsner PROPOSAL
Costa DilliardUnited KingdomBernardo Dominic NEGOTIATION
Nicolas IturbideItalyXuxue Feng QUALIFIED
Arvin AlbaresArgentinaIoni Bowcher RENEWAL
Aditya KuskoItalyAmy Elsner RENEWAL
Emily WhobreyFranceIvan Magalhaes NEGOTIATION
Kadeem FlosiRussiaStephen Shaw NEGOTIATION
Salvatore StockhamIndiaBernardo Dominic NEGOTIATION
Isabel BowleyIndiaXuxue Feng RENEWAL
Sinclair WaycottAustraliaStephen Shaw UNQUALIFIED
Leja CaldareraCanadaOnyama Limba NEGOTIATION
Chavez BriddickIndiaXuxue Feng UNQUALIFIED
Aruna FigeroaGermanyAsiya Javayant PROPOSAL
Cody SaylorsIndiaElwin Sharvill QUALIFIED
Jeanfrancois VenereJapanIvan Magalhaes PROPOSAL
Frozen Columns
Name
Kaitlin Ostrosky
Francesco Shinko
Jeanfrancois Venere
Nicolas Iturbide
Deepesh Chui
Misaki Royster
Leja Caldarera
Jefferson Schemmer
Greenwood Bolognia
Stacey Maclead
Misaki Royster
Darci Poquette
Jennifer Amigon
Clifford Rim
David Darakjy
Maria Marrier
Rodrigues Campain
Smith Glick
Rodrigues Campain
Salvatore Stockham
Aditya Kusko
Adams Morasca
Murillo Malet
Faith Gillian
Greenwood Bolognia
Wickens Nestle
Aditya Kusko
Johnson Sergi
Silvio Slusarski
Sinclair Waycott
David Darakjy
Johnson Sergi
Jefferson Schemmer
Alejandro Perin
Emily Whobrey
Clifford Rim
Maria Marrier
Isabel Bowley
Izzy Garufi
Kaitlin Ostrosky
David Darakjy
Mayumi Kolmetz
Ricardo Gaucho
Maisha Rulapaugh
Tony Foller
Aika Inouye
Silvio Slusarski
Salvatore Stockham
Ashley Doe
Cody Saylors
IdCountryDate
1000Japan2026-05-02
1001Japan2026-05-04
1002Japan2026-05-14
1003Argentina2026-05-15
1004Russia2026-05-20
1005France2026-05-19
1006Australia2026-05-03
1007France2026-05-01
1008Russia2026-05-13
1009Japan2026-05-14
1010United Kingdom2026-05-16
1011Spain2026-05-06
1012Germany2026-05-11
1013Japan2026-05-08
1014Spain2026-05-10
1015Germany2026-05-04
1016Brazil2026-05-25
1017Japan2026-05-25
1018Japan2026-04-30
1019Russia2026-04-28
1020Italy2026-05-09
1021Argentina2026-05-24
1022Brazil2026-05-16
1023Japan2026-05-26
1024United Kingdom2026-05-13
1025Russia2026-05-10
1026Russia2026-05-13
1027Canada2026-05-26
1028Canada2026-05-23
1029Japan2026-05-12
1030Canada2026-05-20
1031Argentina2026-05-18
1032Russia2026-05-06
1033Italy2026-05-06
1034Russia2026-05-08
1035Australia2026-05-21
1036Russia2026-05-25
1037Russia2026-04-30
1038United Kingdom2026-05-13
1039France2026-05-10
1040France2026-05-07
1041Spain2026-05-20
1042Italy2026-05-04
1043United Kingdom2026-04-28
1044Russia2026-05-13
1045Canada2026-05-11
1046United Kingdom2026-05-19
1047United Kingdom2026-04-28
1048United Kingdom2026-05-21
1049France2026-05-20

On-Demand Data

NameIdCountryDate
David Darakjy1000Brazil2026-04-27
Johnson Sergi1001United Kingdom2026-05-24
Smith Glick1002Brazil2026-05-26
Salvatore Stockham1003India2026-05-21
Jennifer Amigon1004United Kingdom2026-05-25
James Butt1005Canada2026-05-01
Clifford Rim1006India2026-05-03
Silvio Slusarski1007India2026-04-30
Ashley Doe1008Australia2026-05-16
Chavez Briddick1009Brazil2026-05-13
Aruna Figeroa1010Australia2026-05-12
Izzy Garufi1011Canada2026-04-29
Alejandro Perin1012Russia2026-05-25
Ashley Doe1013Canada2026-05-14
Aika Inouye1014Australia2026-05-04
Ivar Paprocki1015India2026-05-26
Juan Wieser1016France2026-05-06
Isabel Bowley1017Spain2026-05-03
Darci Poquette1018Japan2026-05-24
Clifford Rim1019United Kingdom2026-05-09
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Arvin AlbaresItalyAnna Fali QUALIFIED
Clifford RimCanadaStephen Shaw QUALIFIED
Aruna FigeroaItalyAmy Elsner NEW
Johnson SergiFranceOnyama Limba PROPOSAL
Isabel BowleyFranceIvan Magalhaes RENEWAL
Wickens NestleFranceXuxue Feng NEW
Jennifer AmigonCanadaXuxue Feng PROPOSAL
Ivar PaprockiSpainElwin Sharvill RENEWAL
Smith GlickAustraliaAmy Elsner NEW
Misaki RoysterSpainXuxue Feng NEW
Nicolas IturbideCanadaAmy Elsner NEGOTIATION
Alejandro PerinArgentinaAnna Fali QUALIFIED
Leja CaldareraSpainBernardo Dominic RENEWAL
David DarakjyRussiaOnyama Limba UNQUALIFIED
Costa DilliardUnited KingdomAnna Fali UNQUALIFIED
Maisha RulapaughArgentinaIoni Bowcher NEW
Silvio SlusarskiJapanAnna Fali RENEWAL
Adams MorascaGermanyAnna Fali RENEWAL
Johnson SergiSpainAnna Fali QUALIFIED
Johnson SergiIndiaIvan Magalhaes RENEWAL
Francesco ShinkoCanadaAnna Fali QUALIFIED
Misaki RoysterSpainBernardo Dominic QUALIFIED
Morrow RutaCanadaBernardo Dominic QUALIFIED
Ricardo GauchoRussiaElwin Sharvill UNQUALIFIED
Julie StensethFranceAsiya Javayant RENEWAL
Nicolas IturbideUnited KingdomIoni Bowcher NEW
Mayumi KolmetzGermanyAmy Elsner QUALIFIED
Clifford RimUnited KingdomBernardo Dominic NEGOTIATION
Emily WhobreyIndiaXuxue Feng PROPOSAL
Arvin AlbaresJapanStephen Shaw NEW
Leon OldroydUnited KingdomIvan Magalhaes UNQUALIFIED
Jones VocelkaRussiaElwin Sharvill NEW
Juan WieserGermanyXuxue Feng NEGOTIATION
Greenwood BologniaJapanIvan Magalhaes RENEWAL
Leja CaldareraRussiaOnyama Limba QUALIFIED
Alejandro PerinCanadaOnyama Limba QUALIFIED
Leja CaldareraBrazilXuxue Feng QUALIFIED
Aruna FigeroaGermanyBernardo Dominic RENEWAL
Stacey MacleadGermanyAmy Elsner PROPOSAL
Leja CaldareraGermanyBernardo Dominic UNQUALIFIED

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