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
Francesco ShinkoSpainAnna Fali NEW
Costa DilliardIndiaElwin Sharvill UNQUALIFIED
Leja CaldareraIndiaBernardo Dominic NEW
Murillo MaletCanadaAnna Fali QUALIFIED
Tony FollerUnited KingdomAnna Fali QUALIFIED
Jones VocelkaJapanOnyama Limba QUALIFIED
James ButtArgentinaOnyama Limba NEGOTIATION
Julie StensethJapanBernardo Dominic NEGOTIATION
Sinclair WaycottGermanyOnyama Limba UNQUALIFIED
Morrow RutaUnited KingdomAmy Elsner UNQUALIFIED
Johnson SergiItalyBernardo Dominic PROPOSAL
Leja CaldareraAustraliaStephen Shaw NEGOTIATION
Jeanfrancois VenereArgentinaAmy Elsner PROPOSAL
Johnson SergiArgentinaXuxue Feng NEW
Maria MarrierRussiaIvan Magalhaes QUALIFIED
Clifford RimUnited KingdomAsiya Javayant RENEWAL
Maria MarrierItalyBernardo Dominic UNQUALIFIED
Jones VocelkaUnited KingdomAnna Fali UNQUALIFIED
Costa DilliardIndiaBernardo Dominic NEGOTIATION
Faith GillianRussiaElwin Sharvill NEW
Cody SaylorsItalyBernardo Dominic NEGOTIATION
Arvin AlbaresSpainStephen Shaw NEW
Sinclair WaycottArgentinaIvan Magalhaes NEGOTIATION
Antonio CaudyCanadaIvan Magalhaes NEGOTIATION
James ButtFranceAmy Elsner NEGOTIATION
Sinclair WaycottArgentinaBernardo Dominic UNQUALIFIED
Murillo MaletSpainElwin Sharvill NEGOTIATION
Cody SaylorsSpainElwin Sharvill QUALIFIED
Clifford RimAustraliaAsiya Javayant RENEWAL
Johnson SergiFranceOnyama Limba PROPOSAL
Stacey MacleadUnited KingdomAmy Elsner NEGOTIATION
Munro FerenczIndiaAsiya Javayant NEW
Munro FerenczItalyBernardo Dominic NEGOTIATION
Emily WhobreyGermanyOnyama Limba RENEWAL
Aditya KuskoIndiaIvan Magalhaes QUALIFIED
Jennifer AmigonIndiaIvan Magalhaes NEGOTIATION
Darci PoquetteFranceIoni Bowcher RENEWAL
Maria MarrierArgentinaIoni Bowcher UNQUALIFIED
Salvatore StockhamCanadaElwin Sharvill NEW
Clifford RimRussiaAsiya Javayant UNQUALIFIED
Isabel BowleySpainElwin Sharvill QUALIFIED
Jones VocelkaFranceOnyama Limba RENEWAL
Octavia MaletGermanyStephen Shaw PROPOSAL
Aditya KuskoUnited KingdomAmy Elsner RENEWAL
Smith GlickSpainAmy Elsner NEW
Chavez BriddickFranceIvan Magalhaes NEW
Claire TollnerItalyAsiya Javayant NEW
David DarakjyItalyIvan Magalhaes QUALIFIED
Salvatore StockhamUnited KingdomAmy Elsner RENEWAL
Cody SaylorsCanadaXuxue Feng PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Nicolas IturbideRussiaIoni Bowcher PROPOSAL
Jennifer AmigonIndiaOnyama Limba PROPOSAL
Chavez BriddickArgentinaElwin Sharvill UNQUALIFIED
Aditya KuskoFranceElwin Sharvill UNQUALIFIED
Costa DilliardSpainIoni Bowcher NEGOTIATION
Greenwood BologniaAustraliaIoni Bowcher NEGOTIATION
Silvio SlusarskiBrazilOnyama Limba PROPOSAL
Ivar PaprockiSpainIvan Magalhaes UNQUALIFIED
Ashley DoeUnited KingdomAnna Fali UNQUALIFIED
Juan WieserItalyElwin Sharvill UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aruna FigeroaAustralia2026-05-10Buckley Miller Wright QUALIFIED73Xuxue Feng
1001Aika InouyeItaly2026-05-15Dorl, James J Esq UNQUALIFIED91Amy Elsner
1002Jeanfrancois VenereArgentina2026-06-04Printing Dimensions NEGOTIATION36Ivan Magalhaes
1003Sinclair WaycottArgentina2026-06-04Chanay, Jeffrey A Esq NEW99Bernardo Dominic
1004Johnson SergiAustralia2026-05-28Rangoni Of Florence NEGOTIATION28Ivan Magalhaes
1005Arvin AlbaresRussia2026-05-10Morlong Associates PROPOSAL48Xuxue Feng
1006Smith GlickUnited Kingdom2026-05-21King, Christopher A Esq QUALIFIED93Amy Elsner
1007Adams MorascaBrazil2026-06-07King, Christopher A Esq QUALIFIED88Bernardo Dominic
1008Ivar PaprockiGermany2026-06-08Morlong Associates NEW78Asiya Javayant
1009Leon OldroydSpain2026-06-02Chanay, Jeffrey A Esq QUALIFIED45Xuxue Feng
1010Clifford RimUnited Kingdom2026-05-17Morlong Associates PROPOSAL37Amy Elsner
1011Silvio SlusarskiAustralia2026-05-18King, Christopher A Esq RENEWAL91Asiya Javayant
1012Sinclair WaycottUnited Kingdom2026-05-24Dorl, James J Esq UNQUALIFIED69Stephen Shaw
1013David DarakjyBrazil2026-05-31Dorl, James J Esq NEW25Asiya Javayant
1014Costa DilliardSpain2026-05-27Rousseaux, Michael Esq NEW57Anna Fali
1015Aika InouyeRussia2026-05-13Buckley Miller Wright UNQUALIFIED28Ioni Bowcher
1016Ivar PaprockiFrance2026-05-28Chemel, James L Cpa UNQUALIFIED69Ioni Bowcher
1017Sinclair WaycottUnited Kingdom2026-05-23Feiner Bros NEW45Stephen Shaw
1018Munro FerenczSpain2026-05-10Benton, John B Jr UNQUALIFIED96Ioni Bowcher
1019Darci PoquetteItaly2026-05-29King, Christopher A Esq UNQUALIFIED86Onyama Limba
1020Salvatore StockhamBrazil2026-05-14Printing Dimensions NEGOTIATION90Anna Fali
1021Aditya KuskoIndia2026-05-14Feiner Bros UNQUALIFIED31Onyama Limba
1022Ivar PaprockiGermany2026-06-08Feltz Printing Service NEGOTIATION53Onyama Limba
1023Alejandro PerinBrazil2026-05-10King, Christopher A Esq QUALIFIED7Elwin Sharvill
1024Salvatore StockhamIndia2026-05-13Truhlar And Truhlar Attys NEW87Onyama Limba
1025Darci PoquetteFrance2026-05-18Feltz Printing Service NEGOTIATION56Amy Elsner
1026Mujtaba NickaRussia2026-05-18Buckley Miller Wright QUALIFIED50Amy Elsner
1027Mujtaba NickaAustralia2026-05-29Dorl, James J Esq NEW32Bernardo Dominic
1028Smith GlickRussia2026-06-05Chapman, Ross E Esq PROPOSAL59Elwin Sharvill
1029Misaki RoysterArgentina2026-05-27Rangoni Of Florence RENEWAL60Xuxue Feng
1030Alejandro PerinGermany2026-05-15King, Christopher A Esq QUALIFIED82Ioni Bowcher
1031Ivar PaprockiJapan2026-06-02Dorl, James J Esq PROPOSAL11Anna Fali
1032Leja CaldareraBrazil2026-05-30King, Christopher A Esq PROPOSAL61Anna Fali
1033Arvin AlbaresArgentina2026-05-11Chemel, James L Cpa UNQUALIFIED99Asiya Javayant
1034Maisha RulapaughJapan2026-05-14King, Christopher A Esq QUALIFIED54Stephen Shaw
1035Claire TollnerRussia2026-05-24Feiner Bros NEW90Ivan Magalhaes
1036Alejandro PerinUnited Kingdom2026-05-25Dorl, James J Esq QUALIFIED50Ivan Magalhaes
1037Leja CaldareraAustralia2026-05-28Morlong Associates PROPOSAL77Onyama Limba
1038Johnson SergiJapan2026-05-14Feltz Printing Service QUALIFIED76Bernardo Dominic
1039Costa DilliardAustralia2026-06-02Morlong Associates UNQUALIFIED95Xuxue Feng
1040Kaitlin OstroskyCanada2026-06-05Truhlar And Truhlar Attys NEW51Ivan Magalhaes
1041Sinclair WaycottIndia2026-06-06Chemel, James L Cpa PROPOSAL55Stephen Shaw
1042Aditya KuskoAustralia2026-05-19Chemel, James L Cpa NEGOTIATION85Stephen Shaw
1043Aika InouyeCanada2026-05-30Truhlar And Truhlar Attys UNQUALIFIED39Amy Elsner
1044Aruna FigeroaArgentina2026-05-31Buckley Miller Wright NEW43Bernardo Dominic
1045Maisha RulapaughSpain2026-05-14Rousseaux, Michael Esq QUALIFIED17Xuxue Feng
1046Aruna FigeroaUnited Kingdom2026-05-12Chapman, Ross E Esq QUALIFIED38Asiya Javayant
1047Francesco ShinkoArgentina2026-05-13King, Christopher A Esq PROPOSAL33Elwin Sharvill
1048Aditya KuskoCanada2026-05-10Feltz Printing Service NEGOTIATION81Ivan Magalhaes
1049James ButtIndia2026-05-12Dorl, James J Esq NEGOTIATION13Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Adams MorascaCanadaStephen Shaw NEGOTIATION
Cody SaylorsGermanyAsiya Javayant PROPOSAL
Mujtaba NickaFranceAsiya Javayant UNQUALIFIED
Salvatore StockhamGermanyOnyama Limba QUALIFIED
Sinclair WaycottArgentinaAmy Elsner NEW
Morrow RutaFranceAmy Elsner PROPOSAL
Jefferson SchemmerFranceStephen Shaw QUALIFIED
Izzy GarufiGermanyAnna Fali UNQUALIFIED
Leja CaldareraJapanStephen Shaw RENEWAL
Costa DilliardIndiaElwin Sharvill NEW
Julie StensethItalyBernardo Dominic UNQUALIFIED
Kaitlin OstroskyAustraliaAsiya Javayant QUALIFIED
Johnson SergiSpainOnyama Limba NEW
Faith GillianFranceStephen Shaw RENEWAL
Salvatore StockhamGermanyOnyama Limba QUALIFIED
Ivar PaprockiGermanyXuxue Feng UNQUALIFIED
Wickens NestleBrazilElwin Sharvill UNQUALIFIED
Kaitlin OstroskyArgentinaIoni Bowcher QUALIFIED
Stacey MacleadJapanOnyama Limba UNQUALIFIED
Kadeem FlosiJapanAmy Elsner NEGOTIATION
Mujtaba NickaCanadaIoni Bowcher NEGOTIATION
Aditya KuskoCanadaElwin Sharvill NEGOTIATION
Nicolas IturbideGermanyStephen Shaw UNQUALIFIED
Maria MarrierAustraliaIoni Bowcher PROPOSAL
Aruna FigeroaGermanyBernardo Dominic PROPOSAL
Salvatore StockhamCanadaElwin Sharvill NEGOTIATION
Juan WieserIndiaStephen Shaw PROPOSAL
Aruna FigeroaIndiaOnyama Limba NEGOTIATION
Maria MarrierRussiaOnyama Limba NEW
Deepesh ChuiSpainOnyama Limba UNQUALIFIED
Mujtaba NickaSpainAsiya Javayant RENEWAL
Isabel BowleyJapanXuxue Feng PROPOSAL
Deepesh ChuiIndiaIoni Bowcher UNQUALIFIED
Aruna FigeroaArgentinaElwin Sharvill QUALIFIED
Salvatore StockhamFranceElwin Sharvill UNQUALIFIED
Nicolas IturbideJapanBernardo Dominic NEW
Ivar PaprockiUnited KingdomXuxue Feng NEW
Silvio SlusarskiCanadaStephen Shaw NEW
Arvin AlbaresRussiaStephen Shaw NEGOTIATION
Adams MorascaIndiaIoni Bowcher QUALIFIED
Sinclair WaycottFranceAsiya Javayant NEW
Juan WieserJapanOnyama Limba PROPOSAL
Misaki RoysterFranceIoni Bowcher NEW
Wickens NestleBrazilElwin Sharvill NEGOTIATION
Nicolas IturbideSpainAsiya Javayant NEW
Costa DilliardBrazilOnyama Limba UNQUALIFIED
Stacey MacleadJapanAmy Elsner NEW
Chavez BriddickUnited KingdomXuxue Feng QUALIFIED
Cody SaylorsItalyAmy Elsner QUALIFIED
Aika InouyeJapanAmy Elsner NEW
Frozen Columns
Name
David Darakjy
Silvio Slusarski
Deepesh Chui
Ashley Doe
Francesco Shinko
Morrow Ruta
Johnson Sergi
Isabel Bowley
Deepesh Chui
Francesco Shinko
Jeanfrancois Venere
Darci Poquette
Tony Foller
Tony Foller
Claire Tollner
Emily Whobrey
Julie Stenseth
Wickens Nestle
Smith Glick
Cody Saylors
Aruna Figeroa
Adams Morasca
Ricardo Gaucho
Alejandro Perin
Jeanfrancois Venere
Clifford Rim
Izzy Garufi
Arvin Albares
Rodrigues Campain
Tony Foller
Darci Poquette
Ricardo Gaucho
Wickens Nestle
Octavia Malet
Greenwood Bolognia
Silvio Slusarski
Jeanfrancois Venere
Smith Glick
Jefferson Schemmer
Jennifer Amigon
Sinclair Waycott
Emily Whobrey
Clifford Rim
Sinclair Waycott
Nicolas Iturbide
Leon Oldroyd
Darci Poquette
Ricardo Gaucho
Emily Whobrey
Jones Vocelka
IdCountryDate
1000Argentina2026-05-29
1001Italy2026-05-11
1002France2026-06-01
1003Spain2026-06-03
1004India2026-05-17
1005Italy2026-05-28
1006Italy2026-05-21
1007Japan2026-05-14
1008United Kingdom2026-05-11
1009Brazil2026-06-04
1010India2026-05-11
1011United Kingdom2026-05-22
1012Spain2026-05-18
1013Canada2026-05-29
1014Russia2026-05-13
1015Japan2026-05-15
1016Russia2026-05-21
1017Spain2026-05-14
1018Japan2026-05-10
1019Spain2026-06-08
1020Japan2026-06-08
1021Italy2026-05-12
1022Germany2026-05-19
1023Italy2026-05-18
1024France2026-05-21
1025Russia2026-05-16
1026India2026-06-03
1027Canada2026-06-03
1028India2026-05-30
1029Italy2026-05-23
1030India2026-05-30
1031Germany2026-05-31
1032Australia2026-06-05
1033Brazil2026-06-03
1034Argentina2026-05-16
1035Argentina2026-05-14
1036Australia2026-05-19
1037Brazil2026-05-10
1038Brazil2026-06-02
1039Russia2026-05-26
1040Japan2026-06-03
1041Australia2026-05-12
1042Italy2026-06-08
1043Russia2026-05-18
1044Italy2026-05-15
1045Japan2026-05-21
1046Italy2026-06-01
1047Brazil2026-05-13
1048Spain2026-05-30
1049France2026-06-04

On-Demand Data

NameIdCountryDate
Aruna Figeroa1000United Kingdom2026-05-31
Rodrigues Campain1001Italy2026-05-25
Smith Glick1002France2026-05-21
Antonio Caudy1003Canada2026-06-08
Mayumi Kolmetz1004Spain2026-06-06
Cody Saylors1005Australia2026-05-26
Emily Whobrey1006Japan2026-06-07
Izzy Garufi1007France2026-05-23
Aika Inouye1008Germany2026-05-19
Ricardo Gaucho1009Japan2026-05-15
Cody Saylors1010United Kingdom2026-06-08
Ashley Doe1011Spain2026-06-03
Deepesh Chui1012United Kingdom2026-05-10
Mujtaba Nicka1013Japan2026-06-06
Alejandro Perin1014Germany2026-05-21
Maria Marrier1015United Kingdom2026-05-30
Johnson Sergi1016Canada2026-05-21
Antonio Caudy1017Brazil2026-05-22
Misaki Royster1018Japan2026-05-29
David Darakjy1019India2026-06-03
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
James ButtGermanyBernardo Dominic NEGOTIATION
Nicolas IturbideUnited KingdomBernardo Dominic PROPOSAL
Silvio SlusarskiAustraliaAmy Elsner UNQUALIFIED
Clifford RimAustraliaStephen Shaw NEGOTIATION
Wickens NestleFranceBernardo Dominic NEW
Jennifer AmigonIndiaIvan Magalhaes UNQUALIFIED
Aditya KuskoRussiaXuxue Feng RENEWAL
Salvatore StockhamSpainIoni Bowcher RENEWAL
Kaitlin OstroskyCanadaAmy Elsner NEGOTIATION
Greenwood BologniaCanadaIvan Magalhaes RENEWAL
David DarakjyRussiaBernardo Dominic QUALIFIED
Deepesh ChuiJapanAsiya Javayant UNQUALIFIED
Maria MarrierAustraliaIvan Magalhaes QUALIFIED
Darci PoquetteJapanIoni Bowcher NEGOTIATION
Costa DilliardUnited KingdomStephen Shaw PROPOSAL
Greenwood BologniaCanadaOnyama Limba PROPOSAL
Ashley DoeJapanAmy Elsner NEGOTIATION
Chavez BriddickUnited KingdomBernardo Dominic QUALIFIED
Aika InouyeGermanyOnyama Limba NEW
Jennifer AmigonAustraliaStephen Shaw NEW
Aditya KuskoBrazilBernardo Dominic PROPOSAL
Misaki RoysterFranceElwin Sharvill UNQUALIFIED
Maria MarrierSpainElwin Sharvill QUALIFIED
Aika InouyeBrazilBernardo Dominic NEW
Arvin AlbaresAustraliaAnna Fali NEGOTIATION
Claire TollnerBrazilElwin Sharvill NEW
Kadeem FlosiJapanXuxue Feng NEW
Adams MorascaUnited KingdomBernardo Dominic UNQUALIFIED
Aditya KuskoAustraliaAmy Elsner NEW
Jones VocelkaGermanyIoni Bowcher PROPOSAL
Nicolas IturbideRussiaAmy Elsner QUALIFIED
Aditya KuskoSpainBernardo Dominic PROPOSAL
Leon OldroydAustraliaAmy Elsner QUALIFIED
Kadeem FlosiIndiaBernardo Dominic UNQUALIFIED
Greenwood BologniaSpainAsiya Javayant PROPOSAL
Ashley DoeBrazilBernardo Dominic NEW
Chavez BriddickRussiaAnna Fali NEGOTIATION
Isabel BowleySpainOnyama Limba RENEWAL
Maisha RulapaughAustraliaOnyama Limba UNQUALIFIED
Nicolas IturbideBrazilBernardo Dominic PROPOSAL

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