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
Murillo MaletRussiaElwin Sharvill UNQUALIFIED
Ivar PaprockiIndiaAmy Elsner PROPOSAL
Cody SaylorsRussiaAmy Elsner RENEWAL
Greenwood BologniaGermanyIvan Magalhaes NEW
Julie StensethBrazilStephen Shaw QUALIFIED
Ricardo GauchoAustraliaAnna Fali NEW
Johnson SergiGermanyBernardo Dominic QUALIFIED
Smith GlickBrazilElwin Sharvill PROPOSAL
Clifford RimRussiaIoni Bowcher RENEWAL
Cody SaylorsIndiaOnyama Limba RENEWAL
Julie StensethUnited KingdomAnna Fali NEGOTIATION
Isabel BowleyJapanIoni Bowcher PROPOSAL
Jones VocelkaCanadaXuxue Feng PROPOSAL
Darci PoquetteRussiaXuxue Feng RENEWAL
Antonio CaudyIndiaAsiya Javayant PROPOSAL
Leja CaldareraRussiaAmy Elsner RENEWAL
Kadeem FlosiFranceIvan Magalhaes PROPOSAL
Arvin AlbaresJapanOnyama Limba UNQUALIFIED
Leja CaldareraArgentinaXuxue Feng RENEWAL
Ashley DoeFranceXuxue Feng UNQUALIFIED
Deepesh ChuiAustraliaAsiya Javayant NEW
Adams MorascaGermanyElwin Sharvill UNQUALIFIED
Clifford RimSpainOnyama Limba PROPOSAL
Morrow RutaBrazilIoni Bowcher QUALIFIED
Mujtaba NickaJapanIoni Bowcher UNQUALIFIED
Maria MarrierIndiaStephen Shaw NEGOTIATION
Greenwood BologniaItalyIvan Magalhaes QUALIFIED
Ricardo GauchoIndiaXuxue Feng UNQUALIFIED
Jefferson SchemmerUnited KingdomBernardo Dominic RENEWAL
Costa DilliardJapanIoni Bowcher PROPOSAL
Kadeem FlosiGermanyElwin Sharvill QUALIFIED
Maisha RulapaughGermanyIoni Bowcher UNQUALIFIED
Rodrigues CampainIndiaStephen Shaw QUALIFIED
Stacey MacleadUnited KingdomAmy Elsner NEW
Murillo MaletIndiaOnyama Limba RENEWAL
Morrow RutaUnited KingdomAnna Fali UNQUALIFIED
Antonio CaudyRussiaBernardo Dominic RENEWAL
Wickens NestleUnited KingdomStephen Shaw NEGOTIATION
Ashley DoeJapanAnna Fali QUALIFIED
Aditya KuskoBrazilIoni Bowcher NEGOTIATION
David DarakjyUnited KingdomAnna Fali RENEWAL
Adams MorascaAustraliaBernardo Dominic NEW
Jennifer AmigonItalyIoni Bowcher NEGOTIATION
Claire TollnerItalyBernardo Dominic UNQUALIFIED
Costa DilliardIndiaXuxue Feng UNQUALIFIED
Aruna FigeroaCanadaStephen Shaw QUALIFIED
Misaki RoysterIndiaXuxue Feng NEW
Kadeem FlosiGermanyOnyama Limba RENEWAL
Silvio SlusarskiIndiaStephen Shaw UNQUALIFIED
Claire TollnerAustraliaIvan Magalhaes NEW
Horizontal
NameCountryRepresentativeStatus
Aruna FigeroaArgentinaElwin Sharvill RENEWAL
Isabel BowleyUnited KingdomAnna Fali RENEWAL
Francesco ShinkoRussiaAsiya Javayant PROPOSAL
Mujtaba NickaJapanAsiya Javayant NEW
Jones VocelkaAustraliaAnna Fali UNQUALIFIED
Isabel BowleyArgentinaOnyama Limba QUALIFIED
Maisha RulapaughFranceStephen Shaw RENEWAL
Johnson SergiRussiaStephen Shaw UNQUALIFIED
Kaitlin OstroskyGermanyElwin Sharvill PROPOSAL
Mujtaba NickaCanadaAmy Elsner PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Nicolas IturbideItaly2026-04-26Morlong Associates NEW77Bernardo Dominic
1001Claire TollnerItaly2026-04-25Dorl, James J Esq NEW93Ivan Magalhaes
1002Leon OldroydArgentina2026-05-01Commercial Press RENEWAL97Bernardo Dominic
1003Francesco ShinkoAustralia2026-04-16Chanay, Jeffrey A Esq NEGOTIATION34Ivan Magalhaes
1004James ButtArgentina2026-04-18King, Christopher A Esq QUALIFIED31Ioni Bowcher
1005Wickens NestleRussia2026-04-05Rangoni Of Florence RENEWAL85Anna Fali
1006Tony FollerRussia2026-04-16Morlong Associates NEGOTIATION54Ioni Bowcher
1007Isabel BowleyUnited Kingdom2026-04-25Rangoni Of Florence UNQUALIFIED41Ivan Magalhaes
1008Ricardo GauchoArgentina2026-04-07Morlong Associates UNQUALIFIED48Elwin Sharvill
1009Darci PoquetteUnited Kingdom2026-04-12Buckley Miller Wright UNQUALIFIED33Anna Fali
1010Izzy GarufiFrance2026-04-30Chemel, James L Cpa PROPOSAL61Asiya Javayant
1011Juan WieserFrance2026-04-18Chapman, Ross E Esq NEGOTIATION81Xuxue Feng
1012Wickens NestleIndia2026-05-01Dorl, James J Esq NEW34Ivan Magalhaes
1013Antonio CaudyRussia2026-04-06Commercial Press PROPOSAL97Ioni Bowcher
1014Leon OldroydSpain2026-04-23Feiner Bros NEW3Xuxue Feng
1015Aditya KuskoGermany2026-04-14Truhlar And Truhlar Attys NEGOTIATION57Bernardo Dominic
1016Ricardo GauchoAustralia2026-04-14Rangoni Of Florence PROPOSAL77Xuxue Feng
1017Smith GlickSpain2026-04-10Chanay, Jeffrey A Esq PROPOSAL4Ivan Magalhaes
1018Leon OldroydJapan2026-04-25Truhlar And Truhlar Attys RENEWAL23Ivan Magalhaes
1019Rodrigues CampainJapan2026-04-30King, Christopher A Esq QUALIFIED56Stephen Shaw
1020Stacey MacleadUnited Kingdom2026-05-03Commercial Press PROPOSAL53Amy Elsner
1021Kadeem FlosiSpain2026-04-19Truhlar And Truhlar Attys RENEWAL64Ioni Bowcher
1022Morrow RutaAustralia2026-04-04Buckley Miller Wright QUALIFIED58Stephen Shaw
1023Maisha RulapaughUnited Kingdom2026-04-20Benton, John B Jr RENEWAL62Anna Fali
1024Juan WieserIndia2026-04-15Commercial Press UNQUALIFIED16Amy Elsner
1025Izzy GarufiRussia2026-04-23Feltz Printing Service NEGOTIATION7Asiya Javayant
1026Tony FollerItaly2026-04-22Chemel, James L Cpa PROPOSAL52Ioni Bowcher
1027Greenwood BologniaFrance2026-04-05Feiner Bros QUALIFIED95Anna Fali
1028Adams MorascaBrazil2026-04-26Commercial Press NEGOTIATION83Onyama Limba
1029Greenwood BologniaSpain2026-04-05King, Christopher A Esq PROPOSAL47Xuxue Feng
1030Kadeem FlosiAustralia2026-04-20Dorl, James J Esq PROPOSAL57Onyama Limba
1031Silvio SlusarskiJapan2026-04-21Chapman, Ross E Esq NEGOTIATION14Asiya Javayant
1032Francesco ShinkoCanada2026-04-16Truhlar And Truhlar Attys NEGOTIATION16Ioni Bowcher
1033Munro FerenczRussia2026-04-14Rousseaux, Michael Esq PROPOSAL97Ivan Magalhaes
1034Nicolas IturbideCanada2026-04-27Printing Dimensions QUALIFIED99Anna Fali
1035Antonio CaudyIndia2026-04-22Chemel, James L Cpa QUALIFIED32Stephen Shaw
1036Aruna FigeroaSpain2026-05-02Chanay, Jeffrey A Esq UNQUALIFIED71Ioni Bowcher
1037Leon OldroydJapan2026-05-02Feltz Printing Service QUALIFIED68Xuxue Feng
1038Kaitlin OstroskyRussia2026-04-11Morlong Associates NEGOTIATION97Bernardo Dominic
1039Emily WhobreyJapan2026-04-07Chemel, James L Cpa PROPOSAL90Stephen Shaw
1040Cody SaylorsRussia2026-04-08Rangoni Of Florence NEW76Elwin Sharvill
1041James ButtBrazil2026-05-03Dorl, James J Esq NEGOTIATION19Onyama Limba
1042Deepesh ChuiArgentina2026-04-28Feiner Bros NEGOTIATION50Asiya Javayant
1043Stacey MacleadIndia2026-04-17Printing Dimensions UNQUALIFIED33Stephen Shaw
1044Darci PoquetteItaly2026-04-07Rousseaux, Michael Esq RENEWAL72Asiya Javayant
1045Munro FerenczSpain2026-04-26Morlong Associates PROPOSAL23Ivan Magalhaes
1046Mayumi KolmetzFrance2026-04-11Chanay, Jeffrey A Esq RENEWAL10Ivan Magalhaes
1047Aditya KuskoRussia2026-04-07Commercial Press QUALIFIED76Stephen Shaw
1048Jefferson SchemmerSpain2026-04-12Benton, John B Jr RENEWAL86Stephen Shaw
1049Darci PoquetteFrance2026-04-06Chanay, Jeffrey A Esq NEGOTIATION64Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Julie StensethFranceBernardo Dominic RENEWAL
Jefferson SchemmerSpainXuxue Feng PROPOSAL
Kadeem FlosiItalyStephen Shaw PROPOSAL
Izzy GarufiFranceBernardo Dominic RENEWAL
Rodrigues CampainItalyOnyama Limba PROPOSAL
Adams MorascaBrazilAnna Fali RENEWAL
Smith GlickAustraliaBernardo Dominic PROPOSAL
Deepesh ChuiArgentinaIvan Magalhaes PROPOSAL
Ivar PaprockiCanadaBernardo Dominic RENEWAL
Chavez BriddickAustraliaBernardo Dominic NEW
Leja CaldareraFranceBernardo Dominic NEGOTIATION
Costa DilliardUnited KingdomAsiya Javayant NEGOTIATION
Silvio SlusarskiIndiaIoni Bowcher NEW
Mayumi KolmetzFranceAsiya Javayant RENEWAL
Rodrigues CampainUnited KingdomElwin Sharvill RENEWAL
Munro FerenczJapanElwin Sharvill UNQUALIFIED
Francesco ShinkoSpainIoni Bowcher PROPOSAL
Clifford RimJapanIoni Bowcher NEW
Aika InouyeUnited KingdomAnna Fali NEW
Maria MarrierJapanOnyama Limba QUALIFIED
Sinclair WaycottItalyBernardo Dominic PROPOSAL
Leon OldroydFranceAnna Fali NEGOTIATION
Jones VocelkaArgentinaBernardo Dominic NEGOTIATION
David DarakjyCanadaStephen Shaw NEGOTIATION
Smith GlickUnited KingdomOnyama Limba UNQUALIFIED
Octavia MaletCanadaStephen Shaw NEW
Francesco ShinkoCanadaIoni Bowcher NEW
Deepesh ChuiItalyXuxue Feng PROPOSAL
Leon OldroydFranceOnyama Limba QUALIFIED
Maisha RulapaughRussiaAnna Fali QUALIFIED
Nicolas IturbideBrazilAsiya Javayant UNQUALIFIED
Costa DilliardBrazilIvan Magalhaes UNQUALIFIED
Leja CaldareraCanadaAnna Fali NEGOTIATION
Jones VocelkaUnited KingdomIoni Bowcher NEW
Ricardo GauchoSpainXuxue Feng NEGOTIATION
Nicolas IturbideItalyAmy Elsner NEGOTIATION
Faith GillianFranceBernardo Dominic UNQUALIFIED
Kaitlin OstroskyAustraliaAnna Fali RENEWAL
Salvatore StockhamBrazilXuxue Feng NEGOTIATION
Jones VocelkaSpainOnyama Limba PROPOSAL
Jennifer AmigonJapanOnyama Limba NEGOTIATION
Silvio SlusarskiSpainBernardo Dominic PROPOSAL
Octavia MaletIndiaOnyama Limba UNQUALIFIED
Emily WhobreyCanadaOnyama Limba NEW
Alejandro PerinFranceAnna Fali RENEWAL
Mayumi KolmetzAustraliaAnna Fali QUALIFIED
Ashley DoeIndiaAsiya Javayant NEGOTIATION
Adams MorascaAustraliaAnna Fali NEW
Arvin AlbaresSpainIoni Bowcher PROPOSAL
Cody SaylorsArgentinaElwin Sharvill PROPOSAL
Frozen Columns
Name
Nicolas Iturbide
Salvatore Stockham
Wickens Nestle
James Butt
Ricardo Gaucho
Murillo Malet
Juan Wieser
Stacey Maclead
Claire Tollner
Cody Saylors
Izzy Garufi
Leja Caldarera
Arvin Albares
Maria Marrier
Emily Whobrey
Ivar Paprocki
Francesco Shinko
Izzy Garufi
Octavia Malet
Sinclair Waycott
Ivar Paprocki
Leon Oldroyd
Jones Vocelka
Alejandro Perin
Silvio Slusarski
Aruna Figeroa
Nicolas Iturbide
Faith Gillian
Ashley Doe
Misaki Royster
Juan Wieser
Clifford Rim
James Butt
Salvatore Stockham
Aika Inouye
Octavia Malet
Johnson Sergi
Johnson Sergi
James Butt
Greenwood Bolognia
Maria Marrier
Maria Marrier
Tony Foller
Morrow Ruta
James Butt
Sinclair Waycott
Faith Gillian
Stacey Maclead
Ivar Paprocki
Deepesh Chui
IdCountryDate
1000Russia2026-04-23
1001Brazil2026-04-18
1002Russia2026-04-08
1003Argentina2026-04-04
1004Germany2026-04-06
1005Italy2026-04-19
1006Italy2026-04-12
1007United Kingdom2026-04-21
1008Japan2026-04-17
1009Argentina2026-04-23
1010Canada2026-04-20
1011Argentina2026-04-17
1012Brazil2026-04-13
1013Australia2026-05-02
1014Argentina2026-05-01
1015Germany2026-04-04
1016Brazil2026-04-09
1017Spain2026-04-14
1018Russia2026-05-01
1019Germany2026-04-21
1020Russia2026-04-15
1021Germany2026-05-02
1022Argentina2026-04-04
1023India2026-05-02
1024Italy2026-05-03
1025United Kingdom2026-04-17
1026India2026-04-27
1027Australia2026-04-15
1028Spain2026-04-24
1029India2026-04-14
1030United Kingdom2026-04-24
1031Italy2026-04-12
1032India2026-05-01
1033Spain2026-04-21
1034Germany2026-04-13
1035Brazil2026-04-15
1036Canada2026-04-13
1037Italy2026-04-25
1038Canada2026-04-16
1039France2026-04-28
1040United Kingdom2026-04-29
1041India2026-04-05
1042Australia2026-04-24
1043Russia2026-04-17
1044Brazil2026-04-15
1045Italy2026-04-15
1046Italy2026-04-11
1047Italy2026-04-29
1048Canada2026-04-12
1049Australia2026-04-22

On-Demand Data

NameIdCountryDate
Greenwood Bolognia1000India2026-04-30
Aditya Kusko1001Russia2026-04-26
James Butt1002Germany2026-04-16
Aruna Figeroa1003France2026-04-04
Emily Whobrey1004United Kingdom2026-04-16
Ivar Paprocki1005India2026-04-16
Misaki Royster1006Russia2026-04-08
Silvio Slusarski1007Brazil2026-04-15
Izzy Garufi1008Italy2026-04-22
Chavez Briddick1009India2026-04-19
Adams Morasca1010Italy2026-04-18
Tony Foller1011Spain2026-04-04
Costa Dilliard1012Australia2026-04-26
Stacey Maclead1013Australia2026-04-24
Greenwood Bolognia1014France2026-04-25
Leon Oldroyd1015Germany2026-04-08
Isabel Bowley1016Italy2026-04-27
Francesco Shinko1017Japan2026-04-26
Greenwood Bolognia1018Russia2026-04-16
Izzy Garufi1019Canada2026-04-24
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Leon OldroydUnited KingdomAnna Fali NEGOTIATION
Leja CaldareraIndiaIoni Bowcher UNQUALIFIED
Jefferson SchemmerJapanBernardo Dominic RENEWAL
Maria MarrierItalyStephen Shaw NEGOTIATION
Claire TollnerCanadaStephen Shaw RENEWAL
Ashley DoeSpainBernardo Dominic UNQUALIFIED
Izzy GarufiItalyIvan Magalhaes PROPOSAL
Deepesh ChuiItalyAnna Fali QUALIFIED
Salvatore StockhamJapanAmy Elsner UNQUALIFIED
Maria MarrierArgentinaIoni Bowcher PROPOSAL
Deepesh ChuiJapanAnna Fali NEGOTIATION
Mayumi KolmetzIndiaBernardo Dominic NEW
Faith GillianAustraliaAmy Elsner NEW
Juan WieserArgentinaOnyama Limba NEGOTIATION
Darci PoquetteSpainElwin Sharvill NEW
Clifford RimBrazilAsiya Javayant QUALIFIED
Darci PoquetteUnited KingdomXuxue Feng RENEWAL
Ashley DoeFranceIoni Bowcher PROPOSAL
Kadeem FlosiIndiaOnyama Limba PROPOSAL
Adams MorascaRussiaBernardo Dominic RENEWAL
Aika InouyeArgentinaIvan Magalhaes QUALIFIED
Claire TollnerSpainIoni Bowcher NEW
Jennifer AmigonAustraliaOnyama Limba QUALIFIED
Johnson SergiRussiaXuxue Feng UNQUALIFIED
Francesco ShinkoAustraliaAnna Fali RENEWAL
Greenwood BologniaUnited KingdomAsiya Javayant UNQUALIFIED
Faith GillianCanadaOnyama Limba PROPOSAL
Greenwood BologniaRussiaOnyama Limba QUALIFIED
Munro FerenczIndiaXuxue Feng NEGOTIATION
Julie StensethAustraliaIoni Bowcher QUALIFIED
Greenwood BologniaIndiaOnyama Limba PROPOSAL
Misaki RoysterJapanAmy Elsner PROPOSAL
David DarakjyIndiaAnna Fali RENEWAL
Deepesh ChuiRussiaIvan Magalhaes QUALIFIED
Ricardo GauchoRussiaAmy Elsner PROPOSAL
Mujtaba NickaRussiaBernardo Dominic RENEWAL
Julie StensethCanadaBernardo Dominic RENEWAL
Smith GlickItalyAnna Fali RENEWAL
Johnson SergiFranceAmy Elsner RENEWAL
Isabel BowleyAustraliaIvan Magalhaes 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>