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
Rodrigues CampainGermanyStephen Shaw NEGOTIATION
Ashley DoeUnited KingdomIvan Magalhaes PROPOSAL
Leja CaldareraItalyAnna Fali PROPOSAL
Chavez BriddickArgentinaIvan Magalhaes NEW
Jennifer AmigonItalyAmy Elsner RENEWAL
Greenwood BologniaCanadaAsiya Javayant UNQUALIFIED
Deepesh ChuiJapanStephen Shaw NEW
Leja CaldareraAustraliaIvan Magalhaes RENEWAL
Mujtaba NickaSpainOnyama Limba RENEWAL
Aika InouyeUnited KingdomBernardo Dominic NEGOTIATION
Izzy GarufiItalyAmy Elsner NEGOTIATION
Emily WhobreyRussiaIvan Magalhaes QUALIFIED
Darci PoquetteAustraliaStephen Shaw QUALIFIED
Clifford RimBrazilIvan Magalhaes NEW
Faith GillianGermanyIvan Magalhaes NEGOTIATION
Adams MorascaUnited KingdomAmy Elsner RENEWAL
Nicolas IturbideFranceXuxue Feng PROPOSAL
Deepesh ChuiGermanyAmy Elsner UNQUALIFIED
Clifford RimSpainAnna Fali QUALIFIED
Nicolas IturbideJapanXuxue Feng RENEWAL
Greenwood BologniaFranceIvan Magalhaes NEW
Ivar PaprockiFranceAmy Elsner QUALIFIED
Alejandro PerinAustraliaIvan Magalhaes RENEWAL
Claire TollnerCanadaBernardo Dominic NEW
Morrow RutaBrazilOnyama Limba PROPOSAL
Wickens NestleCanadaIoni Bowcher QUALIFIED
Sinclair WaycottBrazilIoni Bowcher NEGOTIATION
Stacey MacleadCanadaAsiya Javayant QUALIFIED
Silvio SlusarskiBrazilAsiya Javayant PROPOSAL
Kadeem FlosiRussiaXuxue Feng NEW
Jennifer AmigonJapanAnna Fali PROPOSAL
Emily WhobreyJapanIvan Magalhaes NEW
James ButtCanadaIoni Bowcher UNQUALIFIED
Clifford RimAustraliaOnyama Limba RENEWAL
Chavez BriddickArgentinaAmy Elsner RENEWAL
Francesco ShinkoJapanAnna Fali NEGOTIATION
Morrow RutaItalyStephen Shaw NEW
Sinclair WaycottCanadaAsiya Javayant RENEWAL
Wickens NestleAustraliaAnna Fali UNQUALIFIED
Maria MarrierIndiaIvan Magalhaes QUALIFIED
Kaitlin OstroskyItalyElwin Sharvill UNQUALIFIED
Leja CaldareraArgentinaOnyama Limba UNQUALIFIED
Silvio SlusarskiItalyXuxue Feng NEW
Sinclair WaycottFranceIvan Magalhaes RENEWAL
Izzy GarufiJapanBernardo Dominic RENEWAL
Francesco ShinkoBrazilElwin Sharvill PROPOSAL
Jefferson SchemmerIndiaAmy Elsner PROPOSAL
Costa DilliardAustraliaAsiya Javayant NEW
Misaki RoysterBrazilAmy Elsner RENEWAL
Rodrigues CampainFranceOnyama Limba NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Morrow RutaJapanXuxue Feng UNQUALIFIED
Mujtaba NickaFranceIoni Bowcher QUALIFIED
Greenwood BologniaItalyAsiya Javayant RENEWAL
Izzy GarufiIndiaXuxue Feng QUALIFIED
Tony FollerRussiaStephen Shaw UNQUALIFIED
Aditya KuskoItalyAnna Fali NEGOTIATION
Salvatore StockhamBrazilAmy Elsner PROPOSAL
Antonio CaudyItalyAsiya Javayant UNQUALIFIED
Octavia MaletJapanXuxue Feng PROPOSAL
Jeanfrancois VenereBrazilAsiya Javayant NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Cody SaylorsItaly2026-05-31Rangoni Of Florence PROPOSAL59Asiya Javayant
1001Wickens NestleItaly2026-06-07Chemel, James L Cpa NEGOTIATION89Bernardo Dominic
1002Wickens NestleArgentina2026-05-25Morlong Associates NEW22Elwin Sharvill
1003Isabel BowleyIndia2026-06-09Feiner Bros NEW97Stephen Shaw
1004Smith GlickUnited Kingdom2026-05-22Dorl, James J Esq PROPOSAL61Asiya Javayant
1005Antonio CaudyJapan2026-05-31Rousseaux, Michael Esq UNQUALIFIED40Xuxue Feng
1006Leja CaldareraAustralia2026-06-06Feltz Printing Service PROPOSAL1Anna Fali
1007Maria MarrierAustralia2026-06-09Dorl, James J Esq QUALIFIED24Asiya Javayant
1008Jones VocelkaItaly2026-06-04Feltz Printing Service RENEWAL5Ioni Bowcher
1009Clifford RimIndia2026-06-02Rangoni Of Florence NEW32Amy Elsner
1010Claire TollnerFrance2026-06-02Rangoni Of Florence NEGOTIATION41Amy Elsner
1011Faith GillianArgentina2026-05-28Truhlar And Truhlar Attys NEGOTIATION10Bernardo Dominic
1012Adams MorascaSpain2026-05-29Truhlar And Truhlar Attys NEGOTIATION39Asiya Javayant
1013Juan WieserFrance2026-05-30Truhlar And Truhlar Attys UNQUALIFIED4Bernardo Dominic
1014Morrow RutaItaly2026-06-03Chapman, Ross E Esq NEGOTIATION66Amy Elsner
1015Murillo MaletJapan2026-05-25Dorl, James J Esq NEGOTIATION89Bernardo Dominic
1016Isabel BowleyUnited Kingdom2026-06-07Feltz Printing Service UNQUALIFIED24Xuxue Feng
1017Jennifer AmigonFrance2026-05-16Feiner Bros NEGOTIATION18Stephen Shaw
1018Sinclair WaycottArgentina2026-05-31Morlong Associates NEW0Asiya Javayant
1019Aika InouyeJapan2026-05-28Printing Dimensions PROPOSAL52Amy Elsner
1020Tony FollerGermany2026-05-15King, Christopher A Esq NEW81Amy Elsner
1021Morrow RutaArgentina2026-05-20Feiner Bros QUALIFIED64Amy Elsner
1022Silvio SlusarskiGermany2026-06-07King, Christopher A Esq QUALIFIED73Elwin Sharvill
1023Salvatore StockhamIndia2026-06-08Chanay, Jeffrey A Esq RENEWAL53Onyama Limba
1024Octavia MaletFrance2026-05-11Feiner Bros PROPOSAL55Onyama Limba
1025Darci PoquetteArgentina2026-05-22Truhlar And Truhlar Attys NEGOTIATION70Asiya Javayant
1026Maria MarrierSpain2026-05-18Chanay, Jeffrey A Esq QUALIFIED31Bernardo Dominic
1027Deepesh ChuiBrazil2026-06-07Rangoni Of Florence NEW98Xuxue Feng
1028Mujtaba NickaBrazil2026-05-11Feltz Printing Service QUALIFIED17Ioni Bowcher
1029Greenwood BologniaFrance2026-05-30Chemel, James L Cpa QUALIFIED34Bernardo Dominic
1030Kaitlin OstroskyJapan2026-05-18Commercial Press PROPOSAL79Amy Elsner
1031Aika InouyeUnited Kingdom2026-05-31Rangoni Of Florence QUALIFIED29Amy Elsner
1032Ashley DoeAustralia2026-06-08Feltz Printing Service RENEWAL24Stephen Shaw
1033Stacey MacleadGermany2026-05-20Chanay, Jeffrey A Esq NEGOTIATION54Ioni Bowcher
1034Alejandro PerinRussia2026-05-14Feltz Printing Service QUALIFIED99Anna Fali
1035Claire TollnerFrance2026-05-25Printing Dimensions NEGOTIATION35Anna Fali
1036Mayumi KolmetzItaly2026-06-04Feiner Bros QUALIFIED19Onyama Limba
1037James ButtBrazil2026-05-15Chanay, Jeffrey A Esq NEGOTIATION90Stephen Shaw
1038Greenwood BologniaItaly2026-05-14Morlong Associates NEGOTIATION22Ioni Bowcher
1039Smith GlickAustralia2026-06-07Dorl, James J Esq PROPOSAL54Xuxue Feng
1040Darci PoquetteUnited Kingdom2026-06-07Commercial Press PROPOSAL61Amy Elsner
1041Faith GillianBrazil2026-06-01Truhlar And Truhlar Attys QUALIFIED39Bernardo Dominic
1042David DarakjyArgentina2026-05-23Chanay, Jeffrey A Esq PROPOSAL3Ivan Magalhaes
1043Morrow RutaIndia2026-05-27Chanay, Jeffrey A Esq RENEWAL38Stephen Shaw
1044Sinclair WaycottIndia2026-06-02Commercial Press UNQUALIFIED55Ivan Magalhaes
1045Leja CaldareraRussia2026-05-30Buckley Miller Wright NEGOTIATION98Stephen Shaw
1046Silvio SlusarskiFrance2026-05-21Rousseaux, Michael Esq UNQUALIFIED23Elwin Sharvill
1047Deepesh ChuiSpain2026-06-04Truhlar And Truhlar Attys PROPOSAL87Elwin Sharvill
1048David DarakjyArgentina2026-05-14Morlong Associates PROPOSAL63Onyama Limba
1049Munro FerenczSpain2026-05-17Chanay, Jeffrey A Esq UNQUALIFIED20Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Ivar PaprockiUnited KingdomXuxue Feng RENEWAL
James ButtItalyXuxue Feng UNQUALIFIED
Munro FerenczGermanyBernardo Dominic PROPOSAL
Claire TollnerArgentinaXuxue Feng NEGOTIATION
Deepesh ChuiFranceAnna Fali QUALIFIED
Greenwood BologniaArgentinaAmy Elsner PROPOSAL
Wickens NestleJapanAsiya Javayant NEGOTIATION
Emily WhobreyGermanyOnyama Limba QUALIFIED
Maria MarrierItalyElwin Sharvill NEGOTIATION
Izzy GarufiJapanStephen Shaw RENEWAL
Deepesh ChuiJapanXuxue Feng UNQUALIFIED
Claire TollnerFranceAnna Fali QUALIFIED
Ivar PaprockiRussiaAmy Elsner UNQUALIFIED
Maisha RulapaughBrazilAsiya Javayant QUALIFIED
Julie StensethRussiaBernardo Dominic PROPOSAL
Wickens NestleUnited KingdomAsiya Javayant PROPOSAL
Izzy GarufiBrazilXuxue Feng PROPOSAL
Mayumi KolmetzArgentinaStephen Shaw QUALIFIED
David DarakjyGermanyAnna Fali UNQUALIFIED
Sinclair WaycottBrazilStephen Shaw PROPOSAL
Greenwood BologniaArgentinaAsiya Javayant UNQUALIFIED
Leja CaldareraFranceIoni Bowcher RENEWAL
Ricardo GauchoRussiaOnyama Limba NEGOTIATION
Salvatore StockhamCanadaOnyama Limba NEGOTIATION
Aditya KuskoRussiaStephen Shaw PROPOSAL
Stacey MacleadJapanXuxue Feng UNQUALIFIED
Ricardo GauchoSpainAnna Fali NEW
Jones VocelkaBrazilXuxue Feng NEW
Emily WhobreyCanadaIvan Magalhaes NEGOTIATION
Kadeem FlosiGermanyAmy Elsner NEGOTIATION
Claire TollnerBrazilAsiya Javayant NEGOTIATION
Johnson SergiJapanIoni Bowcher NEGOTIATION
Leon OldroydIndiaIvan Magalhaes UNQUALIFIED
Maria MarrierIndiaElwin Sharvill RENEWAL
Silvio SlusarskiSpainStephen Shaw UNQUALIFIED
Costa DilliardBrazilAnna Fali NEGOTIATION
Tony FollerAustraliaAnna Fali UNQUALIFIED
Mujtaba NickaItalyXuxue Feng RENEWAL
Tony FollerJapanXuxue Feng RENEWAL
Mayumi KolmetzIndiaElwin Sharvill UNQUALIFIED
Kadeem FlosiBrazilAnna Fali RENEWAL
Ivar PaprockiJapanIvan Magalhaes UNQUALIFIED
Stacey MacleadJapanIvan Magalhaes PROPOSAL
Kaitlin OstroskyRussiaElwin Sharvill NEW
David DarakjyCanadaIoni Bowcher NEW
Ashley DoeSpainIoni Bowcher PROPOSAL
Ricardo GauchoGermanyBernardo Dominic RENEWAL
Arvin AlbaresJapanAmy Elsner NEW
Wickens NestleUnited KingdomAsiya Javayant QUALIFIED
Jones VocelkaAustraliaAmy Elsner UNQUALIFIED
Frozen Columns
Name
Chavez Briddick
Stacey Maclead
Rodrigues Campain
Kaitlin Ostrosky
Ricardo Gaucho
Octavia Malet
David Darakjy
Morrow Ruta
Deepesh Chui
Misaki Royster
Chavez Briddick
Munro Ferencz
Cody Saylors
Wickens Nestle
Deepesh Chui
Octavia Malet
Sinclair Waycott
Greenwood Bolognia
Rodrigues Campain
Wickens Nestle
Johnson Sergi
Morrow Ruta
Maisha Rulapaugh
Alejandro Perin
Jeanfrancois Venere
Greenwood Bolognia
Silvio Slusarski
Maria Marrier
Jeanfrancois Venere
Greenwood Bolognia
Emily Whobrey
Leon Oldroyd
Aika Inouye
Ivar Paprocki
Arvin Albares
Adams Morasca
Chavez Briddick
Maria Marrier
Kadeem Flosi
Rodrigues Campain
Nicolas Iturbide
Darci Poquette
Cody Saylors
Greenwood Bolognia
Ashley Doe
Sinclair Waycott
Munro Ferencz
Leon Oldroyd
Alejandro Perin
Jones Vocelka
IdCountryDate
1000Argentina2026-05-15
1001India2026-05-29
1002United Kingdom2026-05-25
1003India2026-05-11
1004United Kingdom2026-05-15
1005Italy2026-05-27
1006Canada2026-05-12
1007Russia2026-05-28
1008Australia2026-06-06
1009France2026-06-04
1010India2026-05-23
1011Australia2026-05-22
1012Spain2026-05-12
1013Canada2026-06-09
1014Italy2026-05-15
1015Japan2026-05-11
1016Spain2026-06-03
1017Argentina2026-05-30
1018Japan2026-05-28
1019Argentina2026-05-26
1020Italy2026-06-09
1021United Kingdom2026-05-23
1022Argentina2026-05-13
1023Japan2026-05-15
1024Canada2026-05-24
1025India2026-06-06
1026Japan2026-05-20
1027France2026-05-12
1028Japan2026-05-12
1029Italy2026-05-21
1030Russia2026-05-28
1031Australia2026-06-07
1032Germany2026-06-08
1033India2026-05-17
1034Japan2026-06-01
1035Japan2026-05-12
1036Russia2026-05-31
1037Canada2026-06-05
1038Italy2026-05-25
1039Canada2026-06-03
1040United Kingdom2026-05-29
1041Spain2026-05-18
1042Japan2026-05-25
1043Canada2026-06-01
1044Germany2026-06-08
1045Brazil2026-06-07
1046Germany2026-05-26
1047Russia2026-05-22
1048France2026-06-04
1049Argentina2026-05-29

On-Demand Data

NameIdCountryDate
Aruna Figeroa1000Japan2026-06-06
Isabel Bowley1001Spain2026-05-23
Jennifer Amigon1002Argentina2026-05-26
Adams Morasca1003Italy2026-05-26
Emily Whobrey1004Spain2026-05-22
Antonio Caudy1005India2026-06-03
Faith Gillian1006France2026-06-02
Mayumi Kolmetz1007Italy2026-06-06
Leja Caldarera1008Italy2026-06-05
Tony Foller1009Australia2026-06-03
Jones Vocelka1010Russia2026-06-07
Julie Stenseth1011India2026-05-29
Aditya Kusko1012India2026-06-06
Maria Marrier1013Spain2026-05-11
Maisha Rulapaugh1014Brazil2026-05-19
Smith Glick1015Japan2026-06-09
Ricardo Gaucho1016Australia2026-05-18
Wickens Nestle1017Australia2026-05-20
Leon Oldroyd1018Germany2026-06-05
Aruna Figeroa1019Germany2026-05-15
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Clifford RimBrazilStephen Shaw RENEWAL
Stacey MacleadJapanElwin Sharvill NEGOTIATION
Mayumi KolmetzArgentinaAnna Fali NEW
Alejandro PerinAustraliaElwin Sharvill RENEWAL
Silvio SlusarskiCanadaAsiya Javayant UNQUALIFIED
Jennifer AmigonJapanIoni Bowcher UNQUALIFIED
Tony FollerJapanXuxue Feng RENEWAL
Stacey MacleadItalyAmy Elsner QUALIFIED
Claire TollnerGermanyOnyama Limba QUALIFIED
Leon OldroydIndiaStephen Shaw NEGOTIATION
Johnson SergiIndiaIoni Bowcher PROPOSAL
Aika InouyeJapanBernardo Dominic NEW
Leja CaldareraArgentinaAmy Elsner NEW
Clifford RimBrazilAsiya Javayant RENEWAL
Mayumi KolmetzArgentinaIoni Bowcher PROPOSAL
Kaitlin OstroskyArgentinaElwin Sharvill NEGOTIATION
Adams MorascaAustraliaOnyama Limba NEGOTIATION
Tony FollerArgentinaOnyama Limba NEW
Mujtaba NickaSpainElwin Sharvill NEW
Murillo MaletItalyXuxue Feng UNQUALIFIED
Francesco ShinkoIndiaIoni Bowcher NEGOTIATION
Tony FollerBrazilXuxue Feng UNQUALIFIED
Maisha RulapaughUnited KingdomXuxue Feng QUALIFIED
Julie StensethCanadaXuxue Feng UNQUALIFIED
Ivar PaprockiJapanAmy Elsner UNQUALIFIED
Francesco ShinkoUnited KingdomAmy Elsner PROPOSAL
Maria MarrierItalyStephen Shaw PROPOSAL
Kaitlin OstroskyAustraliaBernardo Dominic UNQUALIFIED
Kadeem FlosiAustraliaOnyama Limba NEW
Misaki RoysterCanadaBernardo Dominic NEW
Misaki RoysterCanadaXuxue Feng NEW
Misaki RoysterIndiaXuxue Feng PROPOSAL
Wickens NestleGermanyXuxue Feng PROPOSAL
Salvatore StockhamSpainAnna Fali UNQUALIFIED
Faith GillianAustraliaStephen Shaw NEW
Darci PoquetteGermanyXuxue Feng PROPOSAL
Jones VocelkaArgentinaAsiya Javayant NEGOTIATION
Julie StensethJapanAnna Fali PROPOSAL
Tony FollerGermanyElwin Sharvill NEW
Claire TollnerUnited KingdomAnna Fali RENEWAL

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