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
Ivar PaprockiBrazilAsiya Javayant PROPOSAL
Murillo MaletRussiaAnna Fali PROPOSAL
Salvatore StockhamUnited KingdomAmy Elsner QUALIFIED
Octavia MaletBrazilStephen Shaw QUALIFIED
Munro FerenczJapanBernardo Dominic PROPOSAL
Murillo MaletFranceStephen Shaw RENEWAL
Cody SaylorsCanadaAmy Elsner NEW
Emily WhobreyItalyIoni Bowcher NEGOTIATION
Sinclair WaycottIndiaAmy Elsner NEW
Octavia MaletGermanyXuxue Feng PROPOSAL
Ashley DoeUnited KingdomBernardo Dominic QUALIFIED
Kadeem FlosiBrazilOnyama Limba RENEWAL
Isabel BowleyUnited KingdomElwin Sharvill QUALIFIED
Cody SaylorsGermanyElwin Sharvill RENEWAL
Deepesh ChuiUnited KingdomAnna Fali NEW
Smith GlickFranceAmy Elsner NEW
Mujtaba NickaSpainAnna Fali UNQUALIFIED
Jones VocelkaCanadaStephen Shaw QUALIFIED
Antonio CaudyCanadaBernardo Dominic RENEWAL
Misaki RoysterItalyStephen Shaw NEW
Misaki RoysterItalyIoni Bowcher PROPOSAL
Tony FollerArgentinaAnna Fali UNQUALIFIED
Johnson SergiSpainElwin Sharvill QUALIFIED
Smith GlickArgentinaOnyama Limba UNQUALIFIED
Francesco ShinkoCanadaAsiya Javayant NEW
Greenwood BologniaItalyAsiya Javayant NEGOTIATION
Silvio SlusarskiFranceXuxue Feng NEW
Kadeem FlosiBrazilAmy Elsner NEW
Costa DilliardIndiaIoni Bowcher RENEWAL
Costa DilliardAustraliaAmy Elsner NEW
Aditya KuskoItalyIoni Bowcher QUALIFIED
Alejandro PerinSpainIvan Magalhaes UNQUALIFIED
Costa DilliardCanadaAsiya Javayant PROPOSAL
Deepesh ChuiItalyElwin Sharvill NEGOTIATION
Kaitlin OstroskyRussiaAmy Elsner UNQUALIFIED
Deepesh ChuiFranceAsiya Javayant QUALIFIED
Arvin AlbaresArgentinaElwin Sharvill RENEWAL
Aruna FigeroaIndiaIvan Magalhaes RENEWAL
Morrow RutaSpainElwin Sharvill RENEWAL
Misaki RoysterIndiaIoni Bowcher NEGOTIATION
Munro FerenczCanadaIoni Bowcher UNQUALIFIED
Wickens NestleSpainXuxue Feng UNQUALIFIED
Ricardo GauchoIndiaStephen Shaw RENEWAL
Murillo MaletArgentinaAsiya Javayant NEGOTIATION
Wickens NestleRussiaIvan Magalhaes NEW
Julie StensethUnited KingdomStephen Shaw UNQUALIFIED
Julie StensethBrazilAnna Fali NEGOTIATION
Isabel BowleyItalyAnna Fali NEGOTIATION
Mujtaba NickaFranceOnyama Limba RENEWAL
Smith GlickSpainOnyama Limba NEW
Horizontal
NameCountryRepresentativeStatus
Jones VocelkaAustraliaIoni Bowcher UNQUALIFIED
Emily WhobreyGermanyAsiya Javayant RENEWAL
Costa DilliardRussiaAmy Elsner PROPOSAL
Adams MorascaBrazilIoni Bowcher RENEWAL
Aika InouyeJapanAnna Fali NEW
Mayumi KolmetzIndiaElwin Sharvill NEW
Smith GlickFranceIvan Magalhaes UNQUALIFIED
Kaitlin OstroskyIndiaAnna Fali PROPOSAL
Aditya KuskoFranceIoni Bowcher RENEWAL
Wickens NestleUnited KingdomXuxue Feng RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aika InouyeJapan2026-05-23Chapman, Ross E Esq RENEWAL29Asiya Javayant
1001Ricardo GauchoJapan2026-05-05Printing Dimensions RENEWAL0Bernardo Dominic
1002Alejandro PerinRussia2026-05-21Morlong Associates NEGOTIATION18Anna Fali
1003Faith GillianRussia2026-05-05Rangoni Of Florence NEW0Amy Elsner
1004Arvin AlbaresRussia2026-04-30Benton, John B Jr NEGOTIATION54Ivan Magalhaes
1005Ricardo GauchoCanada2026-05-20Printing Dimensions UNQUALIFIED48Anna Fali
1006Alejandro PerinUnited Kingdom2026-05-05Chapman, Ross E Esq NEW27Amy Elsner
1007Costa DilliardIndia2026-05-03King, Christopher A Esq NEGOTIATION5Ioni Bowcher
1008Izzy GarufiGermany2026-05-02Feltz Printing Service PROPOSAL94Elwin Sharvill
1009Juan WieserJapan2026-05-20Chanay, Jeffrey A Esq UNQUALIFIED4Bernardo Dominic
1010Smith GlickJapan2026-04-27Dorl, James J Esq RENEWAL84Asiya Javayant
1011Aruna FigeroaGermany2026-05-22Benton, John B Jr PROPOSAL11Amy Elsner
1012Wickens NestleFrance2026-05-23Feltz Printing Service UNQUALIFIED20Onyama Limba
1013Julie StensethUnited Kingdom2026-05-11Buckley Miller Wright RENEWAL75Asiya Javayant
1014Jones VocelkaFrance2026-05-12Chemel, James L Cpa NEGOTIATION5Anna Fali
1015Octavia MaletIndia2026-05-21Feltz Printing Service NEGOTIATION78Anna Fali
1016Aditya KuskoCanada2026-05-06Truhlar And Truhlar Attys PROPOSAL44Xuxue Feng
1017Jeanfrancois VenereGermany2026-05-18Rousseaux, Michael Esq PROPOSAL7Anna Fali
1018Rodrigues CampainSpain2026-05-13Dorl, James J Esq NEW81Stephen Shaw
1019Aruna FigeroaFrance2026-05-17Rangoni Of Florence RENEWAL75Amy Elsner
1020Octavia MaletIndia2026-05-14Printing Dimensions PROPOSAL54Stephen Shaw
1021Nicolas IturbideItaly2026-05-16Rousseaux, Michael Esq NEGOTIATION20Ioni Bowcher
1022Faith GillianIndia2026-05-21Chanay, Jeffrey A Esq NEW59Onyama Limba
1023James ButtArgentina2026-05-04Rousseaux, Michael Esq UNQUALIFIED50Anna Fali
1024Maria MarrierFrance2026-05-22Rangoni Of Florence NEW44Anna Fali
1025Emily WhobreyArgentina2026-05-02Chemel, James L Cpa NEGOTIATION54Amy Elsner
1026Sinclair WaycottSpain2026-04-29Commercial Press QUALIFIED41Asiya Javayant
1027Jefferson SchemmerSpain2026-05-25Chapman, Ross E Esq PROPOSAL25Xuxue Feng
1028Mujtaba NickaSpain2026-05-06Rangoni Of Florence UNQUALIFIED88Amy Elsner
1029Cody SaylorsJapan2026-05-10Commercial Press RENEWAL45Anna Fali
1030Mujtaba NickaJapan2026-05-21King, Christopher A Esq NEGOTIATION46Ioni Bowcher
1031Antonio CaudyItaly2026-05-04Chanay, Jeffrey A Esq RENEWAL9Onyama Limba
1032Munro FerenczGermany2026-05-19Commercial Press QUALIFIED71Ivan Magalhaes
1033Murillo MaletUnited Kingdom2026-05-24Rangoni Of Florence UNQUALIFIED56Onyama Limba
1034Silvio SlusarskiSpain2026-05-16Chemel, James L Cpa PROPOSAL79Asiya Javayant
1035Mujtaba NickaItaly2026-05-06Benton, John B Jr PROPOSAL45Elwin Sharvill
1036Silvio SlusarskiAustralia2026-05-09Truhlar And Truhlar Attys NEGOTIATION92Asiya Javayant
1037Mujtaba NickaArgentina2026-05-09Morlong Associates QUALIFIED17Elwin Sharvill
1038Murillo MaletBrazil2026-05-06Printing Dimensions RENEWAL48Ioni Bowcher
1039Francesco ShinkoGermany2026-05-04Chanay, Jeffrey A Esq UNQUALIFIED40Bernardo Dominic
1040Emily WhobreyIndia2026-04-28Chapman, Ross E Esq RENEWAL85Asiya Javayant
1041Mayumi KolmetzUnited Kingdom2026-05-14Printing Dimensions UNQUALIFIED41Ioni Bowcher
1042Kaitlin OstroskyGermany2026-05-24Benton, John B Jr RENEWAL82Anna Fali
1043Maisha RulapaughGermany2026-05-03Printing Dimensions NEGOTIATION79Bernardo Dominic
1044Morrow RutaAustralia2026-04-27Chapman, Ross E Esq UNQUALIFIED45Amy Elsner
1045Arvin AlbaresAustralia2026-05-26Morlong Associates UNQUALIFIED14Elwin Sharvill
1046Jones VocelkaCanada2026-05-02Truhlar And Truhlar Attys QUALIFIED90Amy Elsner
1047Darci PoquetteArgentina2026-05-20Rangoni Of Florence PROPOSAL53Bernardo Dominic
1048Cody SaylorsUnited Kingdom2026-05-06Buckley Miller Wright UNQUALIFIED43Xuxue Feng
1049Aika InouyeItaly2026-05-22Feltz Printing Service NEGOTIATION4Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Mayumi KolmetzAustraliaStephen Shaw NEW
Chavez BriddickAustraliaIvan Magalhaes QUALIFIED
Johnson SergiJapanOnyama Limba NEW
Tony FollerIndiaOnyama Limba QUALIFIED
Aika InouyeBrazilStephen Shaw UNQUALIFIED
Octavia MaletIndiaAnna Fali UNQUALIFIED
Darci PoquetteItalyAsiya Javayant NEW
Kadeem FlosiUnited KingdomXuxue Feng NEGOTIATION
Cody SaylorsIndiaBernardo Dominic QUALIFIED
Mujtaba NickaUnited KingdomIvan Magalhaes RENEWAL
Francesco ShinkoArgentinaOnyama Limba RENEWAL
Darci PoquetteRussiaAsiya Javayant PROPOSAL
Julie StensethSpainElwin Sharvill QUALIFIED
Mujtaba NickaCanadaElwin Sharvill PROPOSAL
Greenwood BologniaUnited KingdomAmy Elsner PROPOSAL
Ivar PaprockiCanadaBernardo Dominic NEGOTIATION
Juan WieserArgentinaStephen Shaw UNQUALIFIED
Salvatore StockhamGermanyXuxue Feng NEW
Darci PoquetteUnited KingdomBernardo Dominic UNQUALIFIED
Kaitlin OstroskyJapanIvan Magalhaes NEW
Leon OldroydAustraliaAnna Fali RENEWAL
Cody SaylorsUnited KingdomAmy Elsner NEW
Ashley DoeFranceAsiya Javayant NEW
Greenwood BologniaJapanBernardo Dominic UNQUALIFIED
Arvin AlbaresItalyAnna Fali NEW
Aika InouyeGermanyXuxue Feng NEGOTIATION
Octavia MaletCanadaAsiya Javayant NEW
Alejandro PerinRussiaOnyama Limba NEGOTIATION
Jennifer AmigonArgentinaBernardo Dominic RENEWAL
Adams MorascaItalyIoni Bowcher RENEWAL
Silvio SlusarskiJapanIoni Bowcher QUALIFIED
Francesco ShinkoJapanIvan Magalhaes NEW
Chavez BriddickSpainOnyama Limba NEGOTIATION
Jeanfrancois VenereUnited KingdomAnna Fali NEGOTIATION
Smith GlickArgentinaIoni Bowcher NEW
Jennifer AmigonFranceXuxue Feng NEGOTIATION
James ButtFranceXuxue Feng PROPOSAL
Isabel BowleyArgentinaElwin Sharvill NEGOTIATION
Francesco ShinkoUnited KingdomAmy Elsner PROPOSAL
Julie StensethSpainElwin Sharvill RENEWAL
Sinclair WaycottGermanyIoni Bowcher NEW
Mujtaba NickaBrazilAmy Elsner PROPOSAL
Johnson SergiGermanyAmy Elsner NEW
Greenwood BologniaSpainAnna Fali UNQUALIFIED
Jefferson SchemmerAustraliaOnyama Limba QUALIFIED
Salvatore StockhamJapanAnna Fali PROPOSAL
Aruna FigeroaCanadaXuxue Feng RENEWAL
Stacey MacleadBrazilOnyama Limba PROPOSAL
Juan WieserRussiaOnyama Limba UNQUALIFIED
Izzy GarufiItalyBernardo Dominic RENEWAL
Frozen Columns
Name
Clifford Rim
Leja Caldarera
Salvatore Stockham
Aruna Figeroa
Darci Poquette
Aditya Kusko
Misaki Royster
Ricardo Gaucho
Jeanfrancois Venere
Jeanfrancois Venere
Ivar Paprocki
Wickens Nestle
Alejandro Perin
Juan Wieser
Silvio Slusarski
Jones Vocelka
Antonio Caudy
Leja Caldarera
Leja Caldarera
Wickens Nestle
Jeanfrancois Venere
Mujtaba Nicka
Emily Whobrey
Mayumi Kolmetz
Clifford Rim
Ivar Paprocki
Cody Saylors
Morrow Ruta
Antonio Caudy
Julie Stenseth
Claire Tollner
Leon Oldroyd
Morrow Ruta
Francesco Shinko
Murillo Malet
Stacey Maclead
Leon Oldroyd
Murillo Malet
Mayumi Kolmetz
Aditya Kusko
Claire Tollner
Francesco Shinko
Faith Gillian
Sinclair Waycott
Aditya Kusko
Salvatore Stockham
Maria Marrier
Silvio Slusarski
Maria Marrier
Deepesh Chui
IdCountryDate
1000United Kingdom2026-05-26
1001Russia2026-05-20
1002France2026-04-30
1003India2026-05-24
1004Italy2026-04-28
1005Germany2026-05-06
1006France2026-05-12
1007Argentina2026-05-07
1008Argentina2026-04-30
1009Russia2026-05-19
1010Italy2026-05-17
1011Germany2026-05-14
1012Germany2026-05-25
1013Germany2026-05-15
1014Canada2026-05-05
1015Spain2026-05-02
1016Germany2026-05-10
1017Brazil2026-05-25
1018Japan2026-05-20
1019United Kingdom2026-05-26
1020India2026-05-09
1021France2026-05-01
1022Russia2026-05-06
1023Russia2026-05-07
1024Canada2026-05-07
1025France2026-05-08
1026United Kingdom2026-05-03
1027India2026-05-05
1028Italy2026-05-20
1029Germany2026-05-03
1030Argentina2026-04-27
1031Germany2026-05-08
1032Argentina2026-05-12
1033Argentina2026-05-24
1034Japan2026-05-03
1035United Kingdom2026-05-07
1036Canada2026-05-25
1037Russia2026-05-02
1038Canada2026-05-19
1039Italy2026-05-04
1040Russia2026-05-04
1041Italy2026-05-22
1042United Kingdom2026-05-14
1043Canada2026-05-03
1044Spain2026-05-06
1045United Kingdom2026-05-24
1046Australia2026-05-11
1047Spain2026-05-23
1048Italy2026-04-27
1049France2026-05-06

On-Demand Data

NameIdCountryDate
James Butt1000India2026-05-07
Kadeem Flosi1001France2026-04-28
Stacey Maclead1002Canada2026-05-12
Emily Whobrey1003Germany2026-05-06
Salvatore Stockham1004Russia2026-05-02
Smith Glick1005Italy2026-05-07
Leon Oldroyd1006Brazil2026-05-13
Nicolas Iturbide1007Russia2026-05-20
Murillo Malet1008Brazil2026-05-24
Jennifer Amigon1009Spain2026-05-09
Ivar Paprocki1010Brazil2026-05-17
Sinclair Waycott1011Australia2026-05-21
Costa Dilliard1012Italy2026-05-18
Izzy Garufi1013India2026-05-09
Jefferson Schemmer1014Italy2026-05-20
David Darakjy1015Argentina2026-05-26
Costa Dilliard1016Japan2026-05-05
Silvio Slusarski1017Russia2026-05-20
Kadeem Flosi1018India2026-05-12
Faith Gillian1019Japan2026-05-13
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Deepesh ChuiRussiaOnyama Limba UNQUALIFIED
Murillo MaletGermanyIoni Bowcher UNQUALIFIED
Adams MorascaUnited KingdomAsiya Javayant NEGOTIATION
Antonio CaudyFranceXuxue Feng RENEWAL
Jennifer AmigonRussiaElwin Sharvill NEGOTIATION
Aruna FigeroaFranceOnyama Limba QUALIFIED
Sinclair WaycottUnited KingdomOnyama Limba PROPOSAL
Jefferson SchemmerArgentinaBernardo Dominic UNQUALIFIED
Deepesh ChuiSpainElwin Sharvill UNQUALIFIED
Aditya KuskoSpainAsiya Javayant PROPOSAL
Silvio SlusarskiCanadaIoni Bowcher NEGOTIATION
Aditya KuskoUnited KingdomOnyama Limba RENEWAL
Alejandro PerinFranceAnna Fali UNQUALIFIED
Adams MorascaCanadaIvan Magalhaes QUALIFIED
Munro FerenczIndiaStephen Shaw NEGOTIATION
Kadeem FlosiArgentinaElwin Sharvill RENEWAL
Antonio CaudyBrazilXuxue Feng QUALIFIED
Jefferson SchemmerAustraliaOnyama Limba QUALIFIED
David DarakjyGermanyOnyama Limba RENEWAL
Munro FerenczIndiaStephen Shaw NEW
Sinclair WaycottGermanyAnna Fali QUALIFIED
Silvio SlusarskiSpainAmy Elsner NEW
Wickens NestleCanadaAsiya Javayant QUALIFIED
Darci PoquetteIndiaIoni Bowcher QUALIFIED
Francesco ShinkoAustraliaElwin Sharvill UNQUALIFIED
Claire TollnerArgentinaIvan Magalhaes UNQUALIFIED
Deepesh ChuiRussiaIoni Bowcher QUALIFIED
Aruna FigeroaFranceOnyama Limba UNQUALIFIED
Cody SaylorsRussiaAsiya Javayant UNQUALIFIED
Clifford RimItalyAsiya Javayant NEGOTIATION
Misaki RoysterIndiaAsiya Javayant QUALIFIED
Darci PoquetteItalyElwin Sharvill QUALIFIED
Octavia MaletArgentinaIvan Magalhaes NEW
Aika InouyeUnited KingdomBernardo Dominic UNQUALIFIED
Jennifer AmigonIndiaElwin Sharvill UNQUALIFIED
Leja CaldareraJapanElwin Sharvill RENEWAL
Leon OldroydBrazilAsiya Javayant RENEWAL
Alejandro PerinCanadaElwin Sharvill UNQUALIFIED
Jones VocelkaItalyElwin Sharvill PROPOSAL
Antonio CaudyItalyOnyama 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>