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
Julie StensethRussiaXuxue Feng RENEWAL
Salvatore StockhamJapanXuxue Feng PROPOSAL
Ivar PaprockiFranceElwin Sharvill NEGOTIATION
Emily WhobreyAustraliaAmy Elsner UNQUALIFIED
Tony FollerArgentinaXuxue Feng UNQUALIFIED
Nicolas IturbideArgentinaIvan Magalhaes QUALIFIED
Emily WhobreyBrazilElwin Sharvill QUALIFIED
Alejandro PerinUnited KingdomAnna Fali RENEWAL
Kaitlin OstroskyAustraliaAsiya Javayant PROPOSAL
Murillo MaletFranceAnna Fali NEGOTIATION
Emily WhobreyAustraliaOnyama Limba UNQUALIFIED
Munro FerenczCanadaXuxue Feng NEGOTIATION
David DarakjyAustraliaBernardo Dominic RENEWAL
Johnson SergiFranceOnyama Limba NEGOTIATION
Jones VocelkaRussiaOnyama Limba QUALIFIED
Darci PoquetteGermanyAnna Fali RENEWAL
Alejandro PerinJapanIoni Bowcher QUALIFIED
Aika InouyeUnited KingdomBernardo Dominic QUALIFIED
Ivar PaprockiSpainOnyama Limba NEW
Costa DilliardGermanyAsiya Javayant NEW
Kadeem FlosiFranceAsiya Javayant NEGOTIATION
Murillo MaletSpainIvan Magalhaes PROPOSAL
Wickens NestleJapanBernardo Dominic UNQUALIFIED
Leja CaldareraArgentinaAnna Fali PROPOSAL
Adams MorascaArgentinaAnna Fali NEGOTIATION
Maisha RulapaughCanadaIoni Bowcher NEW
Arvin AlbaresSpainAmy Elsner RENEWAL
Nicolas IturbideUnited KingdomAmy Elsner UNQUALIFIED
Rodrigues CampainJapanIvan Magalhaes UNQUALIFIED
Claire TollnerFranceIvan Magalhaes RENEWAL
Kaitlin OstroskyItalyOnyama Limba PROPOSAL
Ricardo GauchoSpainIvan Magalhaes PROPOSAL
Smith GlickCanadaAmy Elsner UNQUALIFIED
Ricardo GauchoGermanyOnyama Limba UNQUALIFIED
Jennifer AmigonItalyXuxue Feng UNQUALIFIED
Darci PoquetteRussiaAsiya Javayant PROPOSAL
David DarakjyRussiaAmy Elsner QUALIFIED
Jeanfrancois VenereSpainOnyama Limba NEW
Leja CaldareraJapanXuxue Feng QUALIFIED
Salvatore StockhamGermanyAnna Fali QUALIFIED
David DarakjyAustraliaAmy Elsner UNQUALIFIED
Aruna FigeroaFranceAsiya Javayant PROPOSAL
Julie StensethSpainElwin Sharvill PROPOSAL
Emily WhobreyIndiaAnna Fali NEGOTIATION
Costa DilliardRussiaAsiya Javayant PROPOSAL
Morrow RutaIndiaStephen Shaw RENEWAL
Faith GillianBrazilBernardo Dominic NEW
Jefferson SchemmerJapanAsiya Javayant NEW
Ashley DoeItalyIvan Magalhaes NEGOTIATION
Smith GlickCanadaElwin Sharvill NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Kadeem FlosiCanadaIoni Bowcher PROPOSAL
Ivar PaprockiRussiaIoni Bowcher QUALIFIED
Kadeem FlosiBrazilAsiya Javayant PROPOSAL
Jeanfrancois VenereCanadaAnna Fali UNQUALIFIED
Leja CaldareraUnited KingdomStephen Shaw NEW
Aditya KuskoCanadaIoni Bowcher NEW
Silvio SlusarskiItalyOnyama Limba NEGOTIATION
Silvio SlusarskiBrazilAnna Fali QUALIFIED
Deepesh ChuiIndiaAmy Elsner RENEWAL
Johnson SergiRussiaAsiya Javayant QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Maisha RulapaughItaly2026-03-31Commercial Press NEGOTIATION14Bernardo Dominic
1001Mujtaba NickaArgentina2026-04-13Feiner Bros UNQUALIFIED69Amy Elsner
1002Jefferson SchemmerBrazil2026-04-05Morlong Associates UNQUALIFIED25Onyama Limba
1003Rodrigues CampainIndia2026-04-15Chapman, Ross E Esq NEGOTIATION27Xuxue Feng
1004Faith GillianArgentina2026-04-14Rousseaux, Michael Esq RENEWAL70Elwin Sharvill
1005Faith GillianIndia2026-04-24King, Christopher A Esq NEGOTIATION67Amy Elsner
1006Aditya KuskoFrance2026-04-07Feiner Bros RENEWAL3Ioni Bowcher
1007Deepesh ChuiCanada2026-04-09Dorl, James J Esq NEGOTIATION91Onyama Limba
1008Leon OldroydAustralia2026-04-17Morlong Associates NEGOTIATION31Bernardo Dominic
1009Aditya KuskoJapan2026-04-13Buckley Miller Wright NEW84Xuxue Feng
1010Smith GlickAustralia2026-04-21Chapman, Ross E Esq NEGOTIATION9Amy Elsner
1011Ricardo GauchoCanada2026-04-03Feiner Bros RENEWAL25Xuxue Feng
1012Nicolas IturbideRussia2026-04-18Feltz Printing Service QUALIFIED92Bernardo Dominic
1013Wickens NestleSpain2026-04-25Feiner Bros NEGOTIATION92Amy Elsner
1014Chavez BriddickAustralia2026-04-02Printing Dimensions RENEWAL88Onyama Limba
1015Nicolas IturbideSpain2026-04-14King, Christopher A Esq NEGOTIATION51Amy Elsner
1016Salvatore StockhamJapan2026-03-31Feiner Bros UNQUALIFIED44Ioni Bowcher
1017Claire TollnerAustralia2026-04-24Rousseaux, Michael Esq RENEWAL93Elwin Sharvill
1018Misaki RoysterGermany2026-04-09Rangoni Of Florence QUALIFIED42Stephen Shaw
1019Faith GillianFrance2026-03-31Morlong Associates NEGOTIATION76Onyama Limba
1020Jones VocelkaArgentina2026-04-06Rousseaux, Michael Esq QUALIFIED94Bernardo Dominic
1021Munro FerenczArgentina2026-04-04Dorl, James J Esq QUALIFIED2Anna Fali
1022Wickens NestleCanada2026-03-31Rangoni Of Florence NEW49Elwin Sharvill
1023Jefferson SchemmerAustralia2026-04-08Chanay, Jeffrey A Esq NEW57Stephen Shaw
1024Jennifer AmigonUnited Kingdom2026-04-12Dorl, James J Esq NEGOTIATION23Ioni Bowcher
1025Stacey MacleadJapan2026-04-03Truhlar And Truhlar Attys RENEWAL75Anna Fali
1026Juan WieserSpain2026-04-23Dorl, James J Esq PROPOSAL58Ioni Bowcher
1027Adams MorascaBrazil2026-04-11Feiner Bros NEGOTIATION81Ioni Bowcher
1028Jefferson SchemmerBrazil2026-04-11Morlong Associates NEW51Stephen Shaw
1029Murillo MaletItaly2026-04-13Commercial Press NEGOTIATION29Ivan Magalhaes
1030Aika InouyeIndia2026-04-20Morlong Associates PROPOSAL7Onyama Limba
1031Emily WhobreyRussia2026-04-02Rousseaux, Michael Esq QUALIFIED85Anna Fali
1032Silvio SlusarskiGermany2026-04-16Truhlar And Truhlar Attys UNQUALIFIED52Amy Elsner
1033Antonio CaudyAustralia2026-04-03Dorl, James J Esq RENEWAL83Asiya Javayant
1034Kadeem FlosiCanada2026-04-18Chanay, Jeffrey A Esq NEW87Xuxue Feng
1035Ashley DoeIndia2026-04-19Feiner Bros RENEWAL18Stephen Shaw
1036Costa DilliardBrazil2026-04-11Feltz Printing Service PROPOSAL65Elwin Sharvill
1037Aruna FigeroaBrazil2026-04-18King, Christopher A Esq PROPOSAL85Asiya Javayant
1038Mayumi KolmetzRussia2026-04-18Printing Dimensions UNQUALIFIED20Asiya Javayant
1039Cody SaylorsUnited Kingdom2026-04-13Morlong Associates PROPOSAL67Elwin Sharvill
1040Juan WieserCanada2026-04-23Feltz Printing Service NEW27Ivan Magalhaes
1041Silvio SlusarskiRussia2026-04-09King, Christopher A Esq UNQUALIFIED47Anna Fali
1042Silvio SlusarskiIndia2026-04-07Chanay, Jeffrey A Esq NEGOTIATION80Stephen Shaw
1043Cody SaylorsRussia2026-04-22Rousseaux, Michael Esq RENEWAL59Stephen Shaw
1044Octavia MaletIndia2026-04-11Printing Dimensions NEGOTIATION61Onyama Limba
1045Julie StensethUnited Kingdom2026-04-25Chanay, Jeffrey A Esq NEGOTIATION81Elwin Sharvill
1046Nicolas IturbideUnited Kingdom2026-03-31Rousseaux, Michael Esq PROPOSAL96Xuxue Feng
1047Kadeem FlosiJapan2026-04-08Rangoni Of Florence PROPOSAL41Xuxue Feng
1048Emily WhobreyGermany2026-04-09Morlong Associates QUALIFIED78Ioni Bowcher
1049Silvio SlusarskiFrance2026-04-25Chapman, Ross E Esq NEGOTIATION97Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Greenwood BologniaSpainIoni Bowcher NEGOTIATION
Tony FollerRussiaOnyama Limba NEW
Arvin AlbaresGermanyElwin Sharvill UNQUALIFIED
Tony FollerCanadaIoni Bowcher UNQUALIFIED
Jones VocelkaJapanIvan Magalhaes RENEWAL
Mujtaba NickaItalyOnyama Limba NEGOTIATION
Tony FollerCanadaIoni Bowcher UNQUALIFIED
James ButtAustraliaAmy Elsner PROPOSAL
Isabel BowleyBrazilAnna Fali RENEWAL
Mayumi KolmetzRussiaAmy Elsner UNQUALIFIED
Arvin AlbaresRussiaOnyama Limba QUALIFIED
Misaki RoysterUnited KingdomBernardo Dominic UNQUALIFIED
Ashley DoeBrazilStephen Shaw RENEWAL
Izzy GarufiBrazilOnyama Limba RENEWAL
Silvio SlusarskiItalyAnna Fali QUALIFIED
Silvio SlusarskiGermanyOnyama Limba QUALIFIED
Maisha RulapaughSpainAnna Fali RENEWAL
Mayumi KolmetzArgentinaBernardo Dominic PROPOSAL
Kadeem FlosiItalyOnyama Limba PROPOSAL
Izzy GarufiItalyAnna Fali QUALIFIED
Arvin AlbaresJapanXuxue Feng PROPOSAL
Smith GlickCanadaOnyama Limba UNQUALIFIED
Sinclair WaycottFranceBernardo Dominic QUALIFIED
Morrow RutaAustraliaBernardo Dominic PROPOSAL
Johnson SergiItalyElwin Sharvill UNQUALIFIED
Emily WhobreyArgentinaAmy Elsner RENEWAL
Claire TollnerSpainElwin Sharvill PROPOSAL
Ricardo GauchoGermanyIoni Bowcher PROPOSAL
Mujtaba NickaRussiaXuxue Feng NEW
Faith GillianBrazilOnyama Limba RENEWAL
Nicolas IturbideFranceOnyama Limba PROPOSAL
Ivar PaprockiJapanIvan Magalhaes RENEWAL
Stacey MacleadItalyStephen Shaw NEGOTIATION
Clifford RimArgentinaAmy Elsner NEW
Salvatore StockhamArgentinaAnna Fali RENEWAL
Jones VocelkaGermanyIoni Bowcher RENEWAL
Costa DilliardItalyIoni Bowcher PROPOSAL
Ivar PaprockiFranceOnyama Limba QUALIFIED
Jennifer AmigonJapanElwin Sharvill QUALIFIED
Leon OldroydUnited KingdomElwin Sharvill RENEWAL
Ivar PaprockiJapanStephen Shaw QUALIFIED
Costa DilliardAustraliaIoni Bowcher UNQUALIFIED
Clifford RimJapanIvan Magalhaes RENEWAL
Kadeem FlosiItalyIoni Bowcher RENEWAL
Aditya KuskoJapanXuxue Feng RENEWAL
Francesco ShinkoGermanyStephen Shaw PROPOSAL
Wickens NestleSpainBernardo Dominic UNQUALIFIED
Wickens NestleArgentinaOnyama Limba RENEWAL
Wickens NestleFranceIoni Bowcher PROPOSAL
Cody SaylorsSpainIoni Bowcher NEW
Frozen Columns
Name
Jefferson Schemmer
Nicolas Iturbide
Murillo Malet
Murillo Malet
Salvatore Stockham
Misaki Royster
Jennifer Amigon
Antonio Caudy
Rodrigues Campain
Arvin Albares
Kadeem Flosi
Aika Inouye
Izzy Garufi
Murillo Malet
Aika Inouye
Antonio Caudy
Izzy Garufi
Adams Morasca
Darci Poquette
Murillo Malet
Wickens Nestle
Cody Saylors
Clifford Rim
Darci Poquette
James Butt
Juan Wieser
Costa Dilliard
James Butt
Darci Poquette
Claire Tollner
Leon Oldroyd
Clifford Rim
Kadeem Flosi
Ricardo Gaucho
Arvin Albares
Octavia Malet
Leon Oldroyd
Adams Morasca
David Darakjy
James Butt
Misaki Royster
Wickens Nestle
Chavez Briddick
Aditya Kusko
Kadeem Flosi
Arvin Albares
Salvatore Stockham
Aika Inouye
Nicolas Iturbide
Jefferson Schemmer
IdCountryDate
1000Russia2026-04-05
1001Argentina2026-04-21
1002Russia2026-04-25
1003Brazil2026-04-16
1004Germany2026-04-04
1005Japan2026-04-16
1006France2026-04-13
1007Australia2026-03-29
1008Italy2026-04-02
1009Argentina2026-04-08
1010Italy2026-04-25
1011Japan2026-04-16
1012Australia2026-04-04
1013Germany2026-04-23
1014Russia2026-03-28
1015Spain2026-03-27
1016Brazil2026-04-13
1017Australia2026-03-27
1018United Kingdom2026-04-10
1019Australia2026-04-16
1020Argentina2026-04-13
1021India2026-04-16
1022Germany2026-04-05
1023Italy2026-03-28
1024Argentina2026-04-15
1025Italy2026-04-22
1026Russia2026-04-17
1027France2026-04-09
1028Argentina2026-04-18
1029Argentina2026-03-28
1030Spain2026-04-02
1031Italy2026-04-02
1032Australia2026-04-11
1033Spain2026-04-03
1034Italy2026-04-19
1035United Kingdom2026-04-15
1036Germany2026-04-11
1037India2026-04-21
1038Australia2026-04-23
1039Australia2026-04-15
1040Spain2026-04-23
1041Argentina2026-04-18
1042Russia2026-04-25
1043Australia2026-04-07
1044Brazil2026-04-01
1045Germany2026-04-11
1046Canada2026-04-17
1047United Kingdom2026-03-29
1048Japan2026-04-17
1049Italy2026-04-23

On-Demand Data

NameIdCountryDate
Claire Tollner1000United Kingdom2026-04-25
Rodrigues Campain1001Spain2026-04-24
Julie Stenseth1002Japan2026-04-12
Adams Morasca1003Australia2026-04-06
Jeanfrancois Venere1004India2026-04-22
Arvin Albares1005India2026-04-20
Darci Poquette1006Spain2026-04-25
Aruna Figeroa1007Australia2026-03-28
Arvin Albares1008Germany2026-03-30
Aika Inouye1009Russia2026-03-31
Antonio Caudy1010Russia2026-04-05
Silvio Slusarski1011Argentina2026-04-20
Claire Tollner1012Spain2026-04-15
Rodrigues Campain1013Brazil2026-04-16
Aika Inouye1014France2026-04-01
Jones Vocelka1015United Kingdom2026-04-02
David Darakjy1016United Kingdom2026-04-04
Aika Inouye1017Germany2026-04-11
Julie Stenseth1018United Kingdom2026-04-07
Ricardo Gaucho1019Spain2026-04-04
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aika InouyeBrazilBernardo Dominic NEGOTIATION
Jennifer AmigonFranceOnyama Limba UNQUALIFIED
Maria MarrierBrazilAmy Elsner NEGOTIATION
Cody SaylorsGermanyIvan Magalhaes QUALIFIED
Alejandro PerinSpainElwin Sharvill QUALIFIED
Jones VocelkaSpainIvan Magalhaes UNQUALIFIED
Julie StensethUnited KingdomAnna Fali NEGOTIATION
Stacey MacleadGermanyAnna Fali NEW
Juan WieserArgentinaElwin Sharvill QUALIFIED
Morrow RutaSpainAsiya Javayant NEGOTIATION
Aruna FigeroaAustraliaStephen Shaw NEGOTIATION
Cody SaylorsJapanXuxue Feng PROPOSAL
Isabel BowleyAustraliaAnna Fali NEGOTIATION
Aditya KuskoIndiaAsiya Javayant NEW
Maisha RulapaughFranceIoni Bowcher RENEWAL
Arvin AlbaresSpainAnna Fali QUALIFIED
Maisha RulapaughRussiaElwin Sharvill NEW
Jefferson SchemmerCanadaOnyama Limba PROPOSAL
Deepesh ChuiCanadaAmy Elsner UNQUALIFIED
Jefferson SchemmerAustraliaAmy Elsner RENEWAL
Greenwood BologniaCanadaAsiya Javayant QUALIFIED
Juan WieserRussiaBernardo Dominic RENEWAL
Ashley DoeCanadaAsiya Javayant QUALIFIED
Darci PoquetteAustraliaElwin Sharvill NEGOTIATION
Wickens NestleGermanyOnyama Limba NEW
Faith GillianBrazilStephen Shaw NEGOTIATION
Aika InouyeSpainOnyama Limba QUALIFIED
Nicolas IturbideItalyOnyama Limba NEW
Rodrigues CampainRussiaBernardo Dominic RENEWAL
Jefferson SchemmerAustraliaElwin Sharvill UNQUALIFIED
Antonio CaudySpainAmy Elsner NEGOTIATION
Kaitlin OstroskyUnited KingdomAsiya Javayant NEW
Ricardo GauchoIndiaElwin Sharvill PROPOSAL
Isabel BowleyItalyXuxue Feng QUALIFIED
Wickens NestleItalyIvan Magalhaes NEGOTIATION
Juan WieserBrazilBernardo Dominic NEW
Tony FollerAustraliaAmy Elsner NEW
Arvin AlbaresSpainAsiya Javayant PROPOSAL
Costa DilliardSpainAmy Elsner RENEWAL
Jennifer AmigonUnited KingdomElwin Sharvill 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>