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
Arvin AlbaresRussiaXuxue Feng UNQUALIFIED
Leja CaldareraGermanyAnna Fali NEGOTIATION
Chavez BriddickIndiaIvan Magalhaes QUALIFIED
Claire TollnerSpainElwin Sharvill QUALIFIED
Jones VocelkaGermanyAnna Fali NEGOTIATION
Tony FollerJapanXuxue Feng PROPOSAL
Octavia MaletRussiaIoni Bowcher RENEWAL
Claire TollnerJapanOnyama Limba QUALIFIED
Clifford RimRussiaIvan Magalhaes NEW
Francesco ShinkoUnited KingdomAmy Elsner QUALIFIED
Munro FerenczIndiaElwin Sharvill NEGOTIATION
Chavez BriddickJapanAmy Elsner PROPOSAL
Kaitlin OstroskySpainAnna Fali QUALIFIED
David DarakjyAustraliaIvan Magalhaes UNQUALIFIED
Alejandro PerinCanadaElwin Sharvill NEW
Cody SaylorsUnited KingdomIoni Bowcher NEW
Claire TollnerSpainIvan Magalhaes QUALIFIED
Clifford RimGermanyOnyama Limba PROPOSAL
Jeanfrancois VenereItalyAsiya Javayant NEW
Ricardo GauchoSpainAmy Elsner NEW
Jennifer AmigonFranceAmy Elsner UNQUALIFIED
Ricardo GauchoFranceBernardo Dominic NEGOTIATION
Maria MarrierUnited KingdomAsiya Javayant UNQUALIFIED
James ButtSpainAnna Fali PROPOSAL
Jennifer AmigonRussiaAmy Elsner UNQUALIFIED
Francesco ShinkoArgentinaOnyama Limba UNQUALIFIED
Munro FerenczArgentinaIvan Magalhaes NEW
Sinclair WaycottJapanIvan Magalhaes QUALIFIED
Mayumi KolmetzIndiaAnna Fali UNQUALIFIED
Sinclair WaycottCanadaAmy Elsner QUALIFIED
Adams MorascaUnited KingdomStephen Shaw PROPOSAL
Silvio SlusarskiCanadaIvan Magalhaes PROPOSAL
Francesco ShinkoGermanyOnyama Limba PROPOSAL
Alejandro PerinFranceBernardo Dominic RENEWAL
Aruna FigeroaAustraliaElwin Sharvill QUALIFIED
Stacey MacleadAustraliaAsiya Javayant NEW
Maria MarrierFranceAmy Elsner RENEWAL
Nicolas IturbideIndiaStephen Shaw PROPOSAL
James ButtRussiaBernardo Dominic NEW
Wickens NestleItalyBernardo Dominic NEGOTIATION
Johnson SergiArgentinaIvan Magalhaes NEW
Julie StensethUnited KingdomOnyama Limba UNQUALIFIED
Maria MarrierSpainBernardo Dominic NEW
Silvio SlusarskiRussiaIoni Bowcher RENEWAL
Munro FerenczJapanXuxue Feng NEGOTIATION
Morrow RutaGermanyXuxue Feng QUALIFIED
Adams MorascaIndiaXuxue Feng UNQUALIFIED
Ivar PaprockiAustraliaOnyama Limba UNQUALIFIED
Silvio SlusarskiGermanyAsiya Javayant QUALIFIED
Misaki RoysterArgentinaOnyama Limba PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Costa DilliardCanadaElwin Sharvill NEW
Mayumi KolmetzItalyAsiya Javayant QUALIFIED
Emily WhobreyRussiaAsiya Javayant UNQUALIFIED
Johnson SergiBrazilStephen Shaw NEW
Faith GillianBrazilOnyama Limba QUALIFIED
Misaki RoysterAustraliaIvan Magalhaes UNQUALIFIED
Mayumi KolmetzRussiaOnyama Limba NEGOTIATION
Jennifer AmigonAustraliaIvan Magalhaes NEW
David DarakjyArgentinaElwin Sharvill UNQUALIFIED
Silvio SlusarskiBrazilXuxue Feng PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Misaki RoysterArgentina2025-10-15Chapman, Ross E Esq NEGOTIATION24Onyama Limba
1001Deepesh ChuiSpain2025-10-21Benton, John B Jr UNQUALIFIED50Ioni Bowcher
1002Darci PoquetteSpain2025-10-29Dorl, James J Esq QUALIFIED4Elwin Sharvill
1003Emily WhobreyUnited Kingdom2025-10-16Printing Dimensions RENEWAL40Bernardo Dominic
1004Tony FollerCanada2025-10-27Rangoni Of Florence NEW49Stephen Shaw
1005Aditya KuskoJapan2025-10-07Morlong Associates UNQUALIFIED31Onyama Limba
1006Deepesh ChuiJapan2025-10-15Benton, John B Jr RENEWAL76Asiya Javayant
1007Julie StensethUnited Kingdom2025-10-21Commercial Press NEGOTIATION13Ivan Magalhaes
1008Rodrigues CampainGermany2025-10-09King, Christopher A Esq RENEWAL3Ioni Bowcher
1009Kaitlin OstroskyArgentina2025-10-28Morlong Associates QUALIFIED90Anna Fali
1010Faith GillianAustralia2025-10-14Benton, John B Jr QUALIFIED74Xuxue Feng
1011Maria MarrierIndia2025-10-13Dorl, James J Esq NEW82Stephen Shaw
1012Jeanfrancois VenereRussia2025-10-18Benton, John B Jr NEGOTIATION40Amy Elsner
1013Octavia MaletRussia2025-10-25Buckley Miller Wright UNQUALIFIED59Ivan Magalhaes
1014Darci PoquetteAustralia2025-10-22Morlong Associates NEW49Stephen Shaw
1015Aruna FigeroaSpain2025-10-14Dorl, James J Esq NEGOTIATION3Stephen Shaw
1016Darci PoquetteJapan2025-10-24Rousseaux, Michael Esq NEW49Xuxue Feng
1017Kaitlin OstroskyFrance2025-10-12King, Christopher A Esq NEW39Stephen Shaw
1018Salvatore StockhamRussia2025-10-24Feltz Printing Service RENEWAL50Anna Fali
1019Adams MorascaSpain2025-10-05Rangoni Of Florence UNQUALIFIED16Asiya Javayant
1020Silvio SlusarskiItaly2025-10-29Chapman, Ross E Esq UNQUALIFIED16Stephen Shaw
1021Aruna FigeroaCanada2025-10-04Rangoni Of Florence NEGOTIATION65Elwin Sharvill
1022David DarakjyRussia2025-10-04Rousseaux, Michael Esq NEW3Elwin Sharvill
1023Darci PoquetteItaly2025-10-03Dorl, James J Esq QUALIFIED14Asiya Javayant
1024Jennifer AmigonSpain2025-10-13Chanay, Jeffrey A Esq PROPOSAL52Onyama Limba
1025Misaki RoysterSpain2025-10-27Chemel, James L Cpa NEGOTIATION17Ioni Bowcher
1026Darci PoquetteIndia2025-10-12Chapman, Ross E Esq NEGOTIATION63Xuxue Feng
1027Rodrigues CampainGermany2025-10-30Chanay, Jeffrey A Esq NEW59Asiya Javayant
1028Francesco ShinkoGermany2025-10-16Morlong Associates UNQUALIFIED90Stephen Shaw
1029Adams MorascaBrazil2025-10-19Dorl, James J Esq NEW1Elwin Sharvill
1030Leon OldroydAustralia2025-10-05Chanay, Jeffrey A Esq NEGOTIATION69Asiya Javayant
1031James ButtRussia2025-10-14Chemel, James L Cpa UNQUALIFIED76Stephen Shaw
1032Ashley DoeUnited Kingdom2025-10-08Rousseaux, Michael Esq NEGOTIATION76Asiya Javayant
1033Deepesh ChuiArgentina2025-10-19King, Christopher A Esq NEGOTIATION31Bernardo Dominic
1034Francesco ShinkoIndia2025-10-25Chemel, James L Cpa NEGOTIATION48Stephen Shaw
1035Maria MarrierItaly2025-10-02Commercial Press PROPOSAL74Asiya Javayant
1036Kaitlin OstroskyArgentina2025-10-08Morlong Associates PROPOSAL21Amy Elsner
1037Jones VocelkaGermany2025-10-19Feiner Bros RENEWAL57Ivan Magalhaes
1038Morrow RutaSpain2025-10-25Feltz Printing Service NEW14Onyama Limba
1039Deepesh ChuiJapan2025-10-27Dorl, James J Esq NEGOTIATION24Asiya Javayant
1040Jones VocelkaAustralia2025-10-12Commercial Press PROPOSAL72Anna Fali
1041Jennifer AmigonItaly2025-10-02Chemel, James L Cpa UNQUALIFIED2Bernardo Dominic
1042Aditya KuskoIndia2025-10-25Truhlar And Truhlar Attys NEGOTIATION22Elwin Sharvill
1043Alejandro PerinRussia2025-10-30Dorl, James J Esq NEW44Stephen Shaw
1044Kaitlin OstroskyGermany2025-10-12Buckley Miller Wright RENEWAL63Ioni Bowcher
1045Alejandro PerinIndia2025-10-10Feltz Printing Service RENEWAL79Anna Fali
1046Maisha RulapaughGermany2025-10-27Benton, John B Jr RENEWAL37Anna Fali
1047Maisha RulapaughUnited Kingdom2025-10-02Morlong Associates RENEWAL41Bernardo Dominic
1048Juan WieserGermany2025-10-29Rousseaux, Michael Esq NEGOTIATION44Onyama Limba
1049Alejandro PerinRussia2025-10-08Feiner Bros NEW8Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Aditya KuskoCanadaStephen Shaw UNQUALIFIED
Jones VocelkaArgentinaStephen Shaw NEGOTIATION
Misaki RoysterGermanyIoni Bowcher NEW
Greenwood BologniaAustraliaOnyama Limba PROPOSAL
Jefferson SchemmerGermanyIvan Magalhaes NEGOTIATION
Rodrigues CampainFranceElwin Sharvill PROPOSAL
Greenwood BologniaBrazilIvan Magalhaes QUALIFIED
Salvatore StockhamSpainIoni Bowcher RENEWAL
Deepesh ChuiGermanyIvan Magalhaes QUALIFIED
Antonio CaudySpainElwin Sharvill UNQUALIFIED
Ricardo GauchoRussiaBernardo Dominic RENEWAL
Claire TollnerAustraliaStephen Shaw PROPOSAL
Salvatore StockhamRussiaElwin Sharvill QUALIFIED
Misaki RoysterArgentinaStephen Shaw RENEWAL
Silvio SlusarskiAustraliaIvan Magalhaes PROPOSAL
Adams MorascaSpainAsiya Javayant NEGOTIATION
Juan WieserArgentinaBernardo Dominic NEGOTIATION
Stacey MacleadGermanyAmy Elsner QUALIFIED
Salvatore StockhamRussiaXuxue Feng NEGOTIATION
Mayumi KolmetzItalyIoni Bowcher NEW
Murillo MaletAustraliaBernardo Dominic PROPOSAL
Izzy GarufiUnited KingdomStephen Shaw NEW
Costa DilliardItalyAsiya Javayant QUALIFIED
Maisha RulapaughBrazilStephen Shaw RENEWAL
Julie StensethRussiaBernardo Dominic NEGOTIATION
Greenwood BologniaIndiaAnna Fali RENEWAL
Aika InouyeRussiaElwin Sharvill RENEWAL
Aditya KuskoItalyAnna Fali PROPOSAL
Antonio CaudyCanadaAnna Fali RENEWAL
Morrow RutaRussiaAsiya Javayant NEGOTIATION
Misaki RoysterUnited KingdomIoni Bowcher UNQUALIFIED
Aruna FigeroaAustraliaOnyama Limba UNQUALIFIED
Costa DilliardJapanXuxue Feng QUALIFIED
Silvio SlusarskiBrazilIoni Bowcher RENEWAL
David DarakjyGermanyOnyama Limba UNQUALIFIED
Aruna FigeroaRussiaAmy Elsner NEGOTIATION
Maisha RulapaughArgentinaAsiya Javayant NEW
James ButtUnited KingdomAmy Elsner UNQUALIFIED
Faith GillianCanadaOnyama Limba QUALIFIED
Emily WhobreyFranceIoni Bowcher QUALIFIED
Munro FerenczArgentinaStephen Shaw NEGOTIATION
Claire TollnerJapanBernardo Dominic PROPOSAL
Julie StensethRussiaStephen Shaw PROPOSAL
Mayumi KolmetzFranceAmy Elsner UNQUALIFIED
Sinclair WaycottUnited KingdomAmy Elsner NEGOTIATION
Jeanfrancois VenereSpainAnna Fali RENEWAL
Nicolas IturbideBrazilXuxue Feng NEW
Jennifer AmigonSpainXuxue Feng NEW
Jones VocelkaBrazilStephen Shaw NEW
Munro FerenczFranceIvan Magalhaes RENEWAL
Frozen Columns
Name
Silvio Slusarski
Francesco Shinko
Salvatore Stockham
Faith Gillian
Jeanfrancois Venere
Aika Inouye
Kaitlin Ostrosky
Adams Morasca
Johnson Sergi
Julie Stenseth
Jeanfrancois Venere
Francesco Shinko
Clifford Rim
Jennifer Amigon
Ivar Paprocki
Murillo Malet
Leon Oldroyd
James Butt
Smith Glick
David Darakjy
Nicolas Iturbide
Smith Glick
Wickens Nestle
Izzy Garufi
Greenwood Bolognia
Morrow Ruta
Kaitlin Ostrosky
Francesco Shinko
Rodrigues Campain
Jefferson Schemmer
Maria Marrier
Octavia Malet
Ivar Paprocki
Johnson Sergi
Isabel Bowley
Misaki Royster
Smith Glick
Clifford Rim
Salvatore Stockham
Murillo Malet
Aditya Kusko
Faith Gillian
Nicolas Iturbide
Leon Oldroyd
Sinclair Waycott
Murillo Malet
Kadeem Flosi
Leja Caldarera
Leja Caldarera
Arvin Albares
IdCountryDate
1000Germany2025-10-05
1001Germany2025-10-22
1002Italy2025-10-26
1003Argentina2025-10-26
1004France2025-10-19
1005Argentina2025-10-30
1006Canada2025-10-13
1007Australia2025-10-28
1008India2025-10-30
1009India2025-10-20
1010India2025-10-31
1011Russia2025-10-21
1012Germany2025-10-04
1013Germany2025-10-18
1014Brazil2025-10-18
1015Canada2025-10-24
1016Spain2025-10-21
1017Canada2025-10-27
1018Brazil2025-10-20
1019Canada2025-10-16
1020India2025-10-19
1021Japan2025-10-22
1022United Kingdom2025-10-12
1023Canada2025-10-20
1024Japan2025-10-31
1025Canada2025-10-05
1026Australia2025-10-28
1027United Kingdom2025-10-22
1028Japan2025-10-22
1029France2025-10-29
1030Argentina2025-10-15
1031Germany2025-10-27
1032India2025-10-03
1033United Kingdom2025-10-24
1034Russia2025-10-02
1035Italy2025-10-26
1036Brazil2025-10-21
1037Australia2025-10-23
1038Italy2025-10-25
1039Spain2025-10-02
1040United Kingdom2025-10-14
1041India2025-10-02
1042Argentina2025-10-02
1043France2025-10-13
1044Spain2025-10-06
1045France2025-10-04
1046Australia2025-10-19
1047Italy2025-10-20
1048Spain2025-10-03
1049Argentina2025-10-09

On-Demand Data

NameIdCountryDate
Arvin Albares1000Russia2025-10-11
Maria Marrier1001Argentina2025-10-31
Johnson Sergi1002Russia2025-10-17
Salvatore Stockham1003Russia2025-10-15
Arvin Albares1004Germany2025-10-15
Morrow Ruta1005Germany2025-10-05
Murillo Malet1006Brazil2025-10-16
Kaitlin Ostrosky1007Brazil2025-10-25
Nicolas Iturbide1008Canada2025-10-20
Leja Caldarera1009Spain2025-10-26
Mujtaba Nicka1010Spain2025-10-21
Ivar Paprocki1011Italy2025-10-18
Emily Whobrey1012United Kingdom2025-10-02
Antonio Caudy1013Russia2025-10-11
Aruna Figeroa1014Italy2025-10-16
Munro Ferencz1015United Kingdom2025-10-24
Ivar Paprocki1016United Kingdom2025-10-16
Ivar Paprocki1017United Kingdom2025-10-29
Murillo Malet1018Argentina2025-10-06
Darci Poquette1019Canada2025-10-19
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Greenwood BologniaItalyAmy Elsner NEGOTIATION
Johnson SergiRussiaAsiya Javayant NEW
Chavez BriddickJapanXuxue Feng UNQUALIFIED
Maisha RulapaughAustraliaBernardo Dominic RENEWAL
Johnson SergiItalyXuxue Feng RENEWAL
Octavia MaletGermanyIoni Bowcher QUALIFIED
Jennifer AmigonArgentinaBernardo Dominic NEW
Mayumi KolmetzCanadaAsiya Javayant QUALIFIED
Munro FerenczRussiaBernardo Dominic RENEWAL
Salvatore StockhamIndiaXuxue Feng NEW
Claire TollnerArgentinaAnna Fali NEW
David DarakjyItalyStephen Shaw QUALIFIED
Wickens NestleAustraliaIvan Magalhaes QUALIFIED
Octavia MaletBrazilStephen Shaw QUALIFIED
Aditya KuskoJapanAmy Elsner PROPOSAL
Clifford RimArgentinaBernardo Dominic UNQUALIFIED
Tony FollerAustraliaStephen Shaw NEW
Greenwood BologniaJapanIvan Magalhaes UNQUALIFIED
Chavez BriddickItalyAnna Fali PROPOSAL
Costa DilliardArgentinaElwin Sharvill RENEWAL
Leon OldroydBrazilAsiya Javayant NEW
Misaki RoysterFranceOnyama Limba QUALIFIED
Emily WhobreyRussiaXuxue Feng UNQUALIFIED
Johnson SergiBrazilAmy Elsner QUALIFIED
Chavez BriddickAustraliaIvan Magalhaes PROPOSAL
Mayumi KolmetzSpainXuxue Feng NEGOTIATION
Julie StensethGermanyIvan Magalhaes NEW
Ashley DoeAustraliaIvan Magalhaes PROPOSAL
Morrow RutaCanadaAmy Elsner QUALIFIED
Aruna FigeroaJapanStephen Shaw NEGOTIATION
Smith GlickCanadaAmy Elsner NEW
Darci PoquetteRussiaXuxue Feng NEGOTIATION
Mayumi KolmetzFranceAmy Elsner NEW
Nicolas IturbideRussiaAnna Fali NEGOTIATION
Aika InouyeItalyBernardo Dominic NEW
Wickens NestleJapanAsiya Javayant QUALIFIED
Cody SaylorsBrazilAmy Elsner NEW
Morrow RutaBrazilIvan Magalhaes NEW
Izzy GarufiFranceIvan Magalhaes PROPOSAL
Munro FerenczSpainAsiya Javayant 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>