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
Mayumi KolmetzCanadaXuxue Feng RENEWAL
David DarakjyIndiaXuxue Feng NEW
Munro FerenczAustraliaStephen Shaw PROPOSAL
Kadeem FlosiUnited KingdomIoni Bowcher QUALIFIED
Mujtaba NickaGermanyBernardo Dominic QUALIFIED
Maria MarrierUnited KingdomXuxue Feng UNQUALIFIED
Emily WhobreyRussiaXuxue Feng PROPOSAL
Mujtaba NickaFranceIvan Magalhaes PROPOSAL
Octavia MaletCanadaOnyama Limba NEGOTIATION
Smith GlickAustraliaIoni Bowcher QUALIFIED
Leon OldroydSpainAnna Fali UNQUALIFIED
Wickens NestleCanadaAnna Fali NEGOTIATION
Misaki RoysterGermanyIoni Bowcher NEW
Aditya KuskoCanadaAmy Elsner RENEWAL
Aruna FigeroaItalyBernardo Dominic PROPOSAL
Munro FerenczIndiaXuxue Feng UNQUALIFIED
Kadeem FlosiSpainBernardo Dominic PROPOSAL
Octavia MaletRussiaIoni Bowcher NEGOTIATION
Ricardo GauchoGermanyIvan Magalhaes QUALIFIED
Darci PoquetteGermanyAmy Elsner RENEWAL
Tony FollerUnited KingdomIvan Magalhaes UNQUALIFIED
Aditya KuskoFranceStephen Shaw PROPOSAL
Leon OldroydArgentinaAnna Fali NEGOTIATION
David DarakjyRussiaAmy Elsner NEGOTIATION
Smith GlickSpainOnyama Limba QUALIFIED
Julie StensethItalyIvan Magalhaes RENEWAL
Cody SaylorsRussiaIoni Bowcher RENEWAL
Clifford RimItalyElwin Sharvill RENEWAL
Johnson SergiArgentinaOnyama Limba NEW
Silvio SlusarskiGermanyElwin Sharvill QUALIFIED
Smith GlickArgentinaIvan Magalhaes NEW
Misaki RoysterAustraliaXuxue Feng PROPOSAL
Kadeem FlosiSpainAmy Elsner UNQUALIFIED
Johnson SergiBrazilAsiya Javayant UNQUALIFIED
Jeanfrancois VenereSpainAsiya Javayant RENEWAL
Emily WhobreyAustraliaAmy Elsner PROPOSAL
Francesco ShinkoJapanAnna Fali NEW
Leon OldroydIndiaBernardo Dominic UNQUALIFIED
Chavez BriddickItalyBernardo Dominic RENEWAL
Ashley DoeCanadaBernardo Dominic PROPOSAL
Murillo MaletArgentinaAnna Fali RENEWAL
Munro FerenczJapanIoni Bowcher UNQUALIFIED
Chavez BriddickSpainStephen Shaw NEW
Rodrigues CampainGermanyIoni Bowcher UNQUALIFIED
Faith GillianCanadaAmy Elsner PROPOSAL
Murillo MaletBrazilStephen Shaw QUALIFIED
Kaitlin OstroskyGermanyXuxue Feng RENEWAL
Aditya KuskoAustraliaAnna Fali PROPOSAL
Maria MarrierBrazilAmy Elsner PROPOSAL
Ivar PaprockiRussiaXuxue Feng PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Ashley DoeSpainStephen Shaw RENEWAL
Morrow RutaItalyAmy Elsner NEW
Rodrigues CampainBrazilAmy Elsner RENEWAL
Leja CaldareraCanadaStephen Shaw UNQUALIFIED
Chavez BriddickItalyIoni Bowcher RENEWAL
James ButtBrazilOnyama Limba NEGOTIATION
Sinclair WaycottCanadaElwin Sharvill PROPOSAL
Rodrigues CampainCanadaElwin Sharvill PROPOSAL
Rodrigues CampainBrazilOnyama Limba QUALIFIED
Sinclair WaycottFranceOnyama Limba PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Ivar PaprockiItaly2026-03-30Feltz Printing Service NEW43Anna Fali
1001Munro FerenczGermany2026-04-02Chanay, Jeffrey A Esq PROPOSAL88Onyama Limba
1002James ButtItaly2026-04-21Benton, John B Jr RENEWAL67Bernardo Dominic
1003Aditya KuskoIndia2026-04-18Chanay, Jeffrey A Esq RENEWAL41Ioni Bowcher
1004Adams MorascaArgentina2026-03-29Truhlar And Truhlar Attys NEGOTIATION56Anna Fali
1005Tony FollerUnited Kingdom2026-03-26Morlong Associates QUALIFIED51Ivan Magalhaes
1006Kaitlin OstroskyFrance2026-04-17Benton, John B Jr PROPOSAL79Anna Fali
1007Stacey MacleadUnited Kingdom2026-03-27Rangoni Of Florence PROPOSAL89Asiya Javayant
1008Tony FollerItaly2026-04-19Feltz Printing Service NEGOTIATION50Anna Fali
1009Jefferson SchemmerItaly2026-03-31Printing Dimensions NEW67Onyama Limba
1010Deepesh ChuiRussia2026-04-20Chanay, Jeffrey A Esq NEW72Bernardo Dominic
1011Clifford RimRussia2026-04-04Rangoni Of Florence UNQUALIFIED42Amy Elsner
1012Sinclair WaycottIndia2026-04-10Feiner Bros RENEWAL86Elwin Sharvill
1013Murillo MaletJapan2026-04-22Chanay, Jeffrey A Esq QUALIFIED24Ioni Bowcher
1014David DarakjyArgentina2026-04-05Chanay, Jeffrey A Esq NEW90Stephen Shaw
1015Tony FollerItaly2026-03-30Commercial Press PROPOSAL6Anna Fali
1016Maisha RulapaughGermany2026-03-30Morlong Associates NEGOTIATION67Ioni Bowcher
1017Ashley DoeItaly2026-03-28Morlong Associates RENEWAL26Onyama Limba
1018Costa DilliardItaly2026-04-12Rangoni Of Florence NEGOTIATION25Stephen Shaw
1019Ricardo GauchoGermany2026-04-22Printing Dimensions RENEWAL40Onyama Limba
1020Silvio SlusarskiFrance2026-04-10Benton, John B Jr PROPOSAL0Asiya Javayant
1021Mayumi KolmetzBrazil2026-04-07Truhlar And Truhlar Attys NEGOTIATION68Ivan Magalhaes
1022Jeanfrancois VenereIndia2026-04-07Chemel, James L Cpa UNQUALIFIED73Bernardo Dominic
1023Ricardo GauchoItaly2026-04-21Printing Dimensions NEGOTIATION46Elwin Sharvill
1024David DarakjyFrance2026-04-20Benton, John B Jr QUALIFIED61Elwin Sharvill
1025Silvio SlusarskiAustralia2026-03-30Buckley Miller Wright NEGOTIATION58Anna Fali
1026Munro FerenczSpain2026-04-08Benton, John B Jr NEW88Xuxue Feng
1027Salvatore StockhamSpain2026-04-03Chanay, Jeffrey A Esq QUALIFIED99Xuxue Feng
1028Jeanfrancois VenereAustralia2026-04-13Chemel, James L Cpa QUALIFIED3Xuxue Feng
1029Morrow RutaGermany2026-04-14Truhlar And Truhlar Attys PROPOSAL62Onyama Limba
1030Antonio CaudyJapan2026-03-26Dorl, James J Esq RENEWAL79Asiya Javayant
1031Antonio CaudyFrance2026-04-21Rangoni Of Florence NEW14Onyama Limba
1032Kadeem FlosiIndia2026-04-18Rangoni Of Florence NEW51Asiya Javayant
1033Munro FerenczArgentina2026-04-17Rangoni Of Florence NEW5Onyama Limba
1034James ButtArgentina2026-03-25Feltz Printing Service NEGOTIATION21Ivan Magalhaes
1035Claire TollnerSpain2026-03-25Buckley Miller Wright QUALIFIED24Ivan Magalhaes
1036Izzy GarufiFrance2026-03-27Morlong Associates NEGOTIATION81Elwin Sharvill
1037Cody SaylorsIndia2026-04-02Rousseaux, Michael Esq UNQUALIFIED57Bernardo Dominic
1038Tony FollerSpain2026-03-26Chapman, Ross E Esq NEGOTIATION44Xuxue Feng
1039Maisha RulapaughJapan2026-04-20King, Christopher A Esq NEGOTIATION53Ioni Bowcher
1040Clifford RimCanada2026-04-10King, Christopher A Esq QUALIFIED26Bernardo Dominic
1041Ashley DoeGermany2026-04-01Printing Dimensions RENEWAL62Xuxue Feng
1042Octavia MaletFrance2026-04-20Feltz Printing Service QUALIFIED66Onyama Limba
1043James ButtRussia2026-04-16King, Christopher A Esq RENEWAL95Anna Fali
1044Jefferson SchemmerFrance2026-04-11Benton, John B Jr RENEWAL21Ivan Magalhaes
1045Aditya KuskoBrazil2026-04-19Feiner Bros NEW51Anna Fali
1046Salvatore StockhamGermany2026-03-25Commercial Press NEGOTIATION49Elwin Sharvill
1047Sinclair WaycottSpain2026-04-19Benton, John B Jr UNQUALIFIED9Bernardo Dominic
1048David DarakjyIndia2026-04-09Benton, John B Jr QUALIFIED74Stephen Shaw
1049Clifford RimArgentina2026-04-23Rousseaux, Michael Esq PROPOSAL84Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Francesco ShinkoGermanyAnna Fali PROPOSAL
Juan WieserUnited KingdomOnyama Limba NEW
Aika InouyeAustraliaAsiya Javayant NEGOTIATION
Ashley DoeAustraliaIvan Magalhaes UNQUALIFIED
James ButtBrazilAmy Elsner RENEWAL
Cody SaylorsItalyXuxue Feng NEGOTIATION
Octavia MaletUnited KingdomBernardo Dominic NEW
Jefferson SchemmerRussiaIvan Magalhaes UNQUALIFIED
Clifford RimIndiaOnyama Limba PROPOSAL
Aruna FigeroaFranceOnyama Limba UNQUALIFIED
Adams MorascaJapanAsiya Javayant NEW
Sinclair WaycottAustraliaAsiya Javayant PROPOSAL
Kadeem FlosiAustraliaAmy Elsner RENEWAL
Alejandro PerinFranceXuxue Feng QUALIFIED
Mayumi KolmetzCanadaStephen Shaw NEGOTIATION
Maisha RulapaughUnited KingdomBernardo Dominic UNQUALIFIED
Mujtaba NickaBrazilAnna Fali UNQUALIFIED
Silvio SlusarskiAustraliaStephen Shaw NEGOTIATION
Munro FerenczRussiaBernardo Dominic PROPOSAL
Greenwood BologniaIndiaStephen Shaw UNQUALIFIED
Kadeem FlosiJapanAmy Elsner NEW
Ricardo GauchoBrazilStephen Shaw NEW
Tony FollerSpainIoni Bowcher RENEWAL
Julie StensethJapanOnyama Limba PROPOSAL
Maisha RulapaughArgentinaOnyama Limba UNQUALIFIED
Isabel BowleyCanadaStephen Shaw QUALIFIED
Kaitlin OstroskyJapanBernardo Dominic QUALIFIED
Julie StensethFranceAnna Fali QUALIFIED
Munro FerenczRussiaOnyama Limba RENEWAL
Ivar PaprockiUnited KingdomStephen Shaw QUALIFIED
Arvin AlbaresRussiaAnna Fali NEGOTIATION
Mujtaba NickaFranceIvan Magalhaes NEGOTIATION
Francesco ShinkoBrazilStephen Shaw RENEWAL
Greenwood BologniaIndiaBernardo Dominic NEGOTIATION
Jones VocelkaUnited KingdomStephen Shaw QUALIFIED
Antonio CaudyUnited KingdomStephen Shaw UNQUALIFIED
Nicolas IturbideUnited KingdomBernardo Dominic QUALIFIED
Leja CaldareraBrazilStephen Shaw NEW
Deepesh ChuiRussiaIvan Magalhaes RENEWAL
Munro FerenczItalyIoni Bowcher QUALIFIED
Silvio SlusarskiIndiaAnna Fali QUALIFIED
Murillo MaletJapanIvan Magalhaes RENEWAL
Arvin AlbaresRussiaElwin Sharvill UNQUALIFIED
Aika InouyeCanadaAsiya Javayant RENEWAL
Adams MorascaRussiaOnyama Limba PROPOSAL
Morrow RutaSpainAsiya Javayant NEGOTIATION
Octavia MaletRussiaAnna Fali NEW
Johnson SergiUnited KingdomOnyama Limba QUALIFIED
Maria MarrierItalyAmy Elsner RENEWAL
Sinclair WaycottAustraliaAsiya Javayant NEGOTIATION
Frozen Columns
Name
Cody Saylors
Faith Gillian
Rodrigues Campain
Octavia Malet
Silvio Slusarski
Juan Wieser
Greenwood Bolognia
Stacey Maclead
Faith Gillian
Ricardo Gaucho
Ashley Doe
Misaki Royster
Juan Wieser
Francesco Shinko
Murillo Malet
Julie Stenseth
Emily Whobrey
Deepesh Chui
Jones Vocelka
Ashley Doe
Antonio Caudy
Arvin Albares
Cody Saylors
Ashley Doe
Munro Ferencz
Emily Whobrey
Mayumi Kolmetz
Izzy Garufi
Emily Whobrey
Juan Wieser
Ricardo Gaucho
Francesco Shinko
Izzy Garufi
Kaitlin Ostrosky
Octavia Malet
Claire Tollner
Cody Saylors
Clifford Rim
Murillo Malet
Kaitlin Ostrosky
Smith Glick
Izzy Garufi
Tony Foller
David Darakjy
Faith Gillian
Aika Inouye
Izzy Garufi
Jennifer Amigon
Misaki Royster
Antonio Caudy
IdCountryDate
1000Brazil2026-04-14
1001Australia2026-04-07
1002Brazil2026-04-14
1003Spain2026-03-27
1004Italy2026-04-05
1005Argentina2026-04-21
1006Australia2026-04-10
1007France2026-04-12
1008Argentina2026-04-11
1009Italy2026-04-21
1010Argentina2026-04-15
1011Argentina2026-03-31
1012Argentina2026-04-23
1013Argentina2026-04-07
1014India2026-04-05
1015Russia2026-04-05
1016Brazil2026-04-23
1017India2026-03-31
1018France2026-04-03
1019France2026-03-29
1020Italy2026-04-13
1021Australia2026-04-19
1022Japan2026-04-06
1023Spain2026-04-20
1024Russia2026-04-20
1025Russia2026-03-31
1026France2026-04-17
1027France2026-04-08
1028Canada2026-04-03
1029Italy2026-04-18
1030France2026-04-07
1031Russia2026-04-20
1032Argentina2026-04-04
1033United Kingdom2026-04-07
1034Russia2026-04-21
1035Australia2026-03-28
1036Germany2026-03-31
1037Germany2026-03-29
1038Spain2026-04-21
1039United Kingdom2026-04-17
1040Russia2026-03-31
1041Russia2026-04-02
1042Germany2026-03-25
1043Brazil2026-03-29
1044Australia2026-04-23
1045United Kingdom2026-04-04
1046Russia2026-04-05
1047Italy2026-04-09
1048Argentina2026-03-25
1049Japan2026-04-07

On-Demand Data

NameIdCountryDate
Mayumi Kolmetz1000Japan2026-04-15
Greenwood Bolognia1001Brazil2026-03-31
Murillo Malet1002Russia2026-03-27
Ivar Paprocki1003United Kingdom2026-04-10
Greenwood Bolognia1004United Kingdom2026-04-11
Claire Tollner1005Japan2026-04-21
Morrow Ruta1006Argentina2026-04-15
Jennifer Amigon1007Japan2026-03-31
Nicolas Iturbide1008India2026-04-07
Cody Saylors1009Argentina2026-04-23
Maisha Rulapaugh1010Japan2026-04-16
Wickens Nestle1011Italy2026-04-05
Jones Vocelka1012Russia2026-04-02
Julie Stenseth1013Japan2026-04-23
Smith Glick1014India2026-04-07
Tony Foller1015Australia2026-04-13
Jones Vocelka1016France2026-03-31
Kaitlin Ostrosky1017United Kingdom2026-04-21
Jefferson Schemmer1018Brazil2026-04-03
Kaitlin Ostrosky1019United Kingdom2026-04-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Leja CaldareraCanadaElwin Sharvill PROPOSAL
Salvatore StockhamGermanyStephen Shaw PROPOSAL
Stacey MacleadItalyAsiya Javayant PROPOSAL
Johnson SergiGermanyIvan Magalhaes PROPOSAL
Salvatore StockhamItalyIoni Bowcher UNQUALIFIED
Salvatore StockhamItalyAsiya Javayant NEW
Ashley DoeArgentinaAnna Fali PROPOSAL
Ricardo GauchoBrazilIoni Bowcher RENEWAL
Ashley DoeBrazilOnyama Limba NEW
Faith GillianBrazilOnyama Limba NEW
Chavez BriddickIndiaXuxue Feng RENEWAL
Wickens NestleItalyAnna Fali UNQUALIFIED
Maisha RulapaughCanadaOnyama Limba NEW
Jeanfrancois VenereSpainAsiya Javayant UNQUALIFIED
Chavez BriddickItalyStephen Shaw UNQUALIFIED
Aika InouyeBrazilIvan Magalhaes UNQUALIFIED
Morrow RutaJapanXuxue Feng RENEWAL
Stacey MacleadJapanStephen Shaw QUALIFIED
Maisha RulapaughArgentinaStephen Shaw NEGOTIATION
Clifford RimItalyBernardo Dominic RENEWAL
Darci PoquetteRussiaAsiya Javayant RENEWAL
Aditya KuskoGermanyAsiya Javayant RENEWAL
Ricardo GauchoAustraliaElwin Sharvill NEGOTIATION
Jennifer AmigonArgentinaStephen Shaw QUALIFIED
Stacey MacleadCanadaStephen Shaw UNQUALIFIED
Darci PoquetteSpainOnyama Limba PROPOSAL
Darci PoquetteItalyStephen Shaw NEW
Emily WhobreyBrazilAmy Elsner NEW
Morrow RutaGermanyAnna Fali RENEWAL
Wickens NestleArgentinaIoni Bowcher NEW
Mujtaba NickaAustraliaAmy Elsner UNQUALIFIED
Morrow RutaIndiaAmy Elsner NEGOTIATION
Jefferson SchemmerRussiaXuxue Feng PROPOSAL
Antonio CaudyItalyAsiya Javayant RENEWAL
Chavez BriddickFranceElwin Sharvill NEW
Greenwood BologniaUnited KingdomElwin Sharvill UNQUALIFIED
Jefferson SchemmerBrazilXuxue Feng NEGOTIATION
Antonio CaudyCanadaAnna Fali UNQUALIFIED
Mujtaba NickaFranceAmy Elsner RENEWAL
Wickens NestleCanadaOnyama Limba NEGOTIATION

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