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
Darci PoquetteGermanyAnna Fali NEW
Kadeem FlosiItalyStephen Shaw UNQUALIFIED
Arvin AlbaresBrazilStephen Shaw QUALIFIED
Faith GillianRussiaIvan Magalhaes PROPOSAL
Jones VocelkaIndiaAsiya Javayant NEGOTIATION
Alejandro PerinJapanOnyama Limba UNQUALIFIED
Deepesh ChuiArgentinaElwin Sharvill QUALIFIED
Ivar PaprockiCanadaBernardo Dominic NEGOTIATION
Maria MarrierGermanyElwin Sharvill RENEWAL
Aruna FigeroaIndiaIvan Magalhaes NEW
Jeanfrancois VenereRussiaAmy Elsner PROPOSAL
Aruna FigeroaUnited KingdomXuxue Feng UNQUALIFIED
Julie StensethGermanyAnna Fali PROPOSAL
Maria MarrierIndiaAsiya Javayant RENEWAL
Costa DilliardBrazilXuxue Feng RENEWAL
Ivar PaprockiArgentinaAmy Elsner QUALIFIED
Isabel BowleySpainAnna Fali PROPOSAL
Silvio SlusarskiFranceIoni Bowcher RENEWAL
Kaitlin OstroskySpainIoni Bowcher UNQUALIFIED
Kaitlin OstroskyBrazilStephen Shaw PROPOSAL
Ricardo GauchoItalyIvan Magalhaes NEGOTIATION
Jones VocelkaArgentinaAsiya Javayant PROPOSAL
Octavia MaletFranceIvan Magalhaes PROPOSAL
Cody SaylorsSpainElwin Sharvill NEW
David DarakjyJapanIoni Bowcher PROPOSAL
Costa DilliardGermanyAnna Fali NEGOTIATION
Mayumi KolmetzSpainAmy Elsner NEGOTIATION
Stacey MacleadCanadaStephen Shaw PROPOSAL
Kaitlin OstroskyBrazilBernardo Dominic QUALIFIED
Cody SaylorsAustraliaOnyama Limba RENEWAL
Stacey MacleadFranceStephen Shaw UNQUALIFIED
Nicolas IturbideAustraliaIoni Bowcher PROPOSAL
Clifford RimRussiaXuxue Feng QUALIFIED
Murillo MaletAustraliaAnna Fali NEGOTIATION
Aditya KuskoAustraliaAnna Fali QUALIFIED
Murillo MaletAustraliaIvan Magalhaes NEGOTIATION
Cody SaylorsRussiaIoni Bowcher RENEWAL
Claire TollnerIndiaElwin Sharvill NEW
Jefferson SchemmerUnited KingdomElwin Sharvill QUALIFIED
Munro FerenczItalyStephen Shaw UNQUALIFIED
Misaki RoysterCanadaAsiya Javayant NEGOTIATION
Rodrigues CampainItalyStephen Shaw PROPOSAL
Kaitlin OstroskyUnited KingdomAnna Fali NEGOTIATION
Mujtaba NickaBrazilOnyama Limba QUALIFIED
David DarakjyAustraliaElwin Sharvill RENEWAL
Julie StensethIndiaIvan Magalhaes PROPOSAL
Sinclair WaycottArgentinaIoni Bowcher RENEWAL
Johnson SergiJapanStephen Shaw UNQUALIFIED
Octavia MaletCanadaIoni Bowcher UNQUALIFIED
Maisha RulapaughIndiaBernardo Dominic RENEWAL
Horizontal
NameCountryRepresentativeStatus
Costa DilliardCanadaAmy Elsner QUALIFIED
Alejandro PerinJapanIoni Bowcher NEGOTIATION
Chavez BriddickArgentinaAnna Fali QUALIFIED
Nicolas IturbideItalyXuxue Feng NEGOTIATION
Wickens NestleSpainElwin Sharvill RENEWAL
James ButtCanadaXuxue Feng RENEWAL
Aika InouyeItalyAnna Fali QUALIFIED
Ivar PaprockiArgentinaOnyama Limba RENEWAL
Jefferson SchemmerBrazilXuxue Feng UNQUALIFIED
Murillo MaletJapanAsiya Javayant NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Costa DilliardArgentina2026-05-20Buckley Miller Wright NEGOTIATION4Anna Fali
1001James ButtJapan2026-05-21Truhlar And Truhlar Attys QUALIFIED48Onyama Limba
1002Claire TollnerCanada2026-06-07Commercial Press RENEWAL88Anna Fali
1003Nicolas IturbideItaly2026-05-18Feltz Printing Service NEGOTIATION2Asiya Javayant
1004Leon OldroydAustralia2026-05-21Chanay, Jeffrey A Esq PROPOSAL39Asiya Javayant
1005James ButtSpain2026-05-14Morlong Associates UNQUALIFIED13Ioni Bowcher
1006James ButtJapan2026-05-11Dorl, James J Esq PROPOSAL18Elwin Sharvill
1007David DarakjyIndia2026-05-23King, Christopher A Esq QUALIFIED3Onyama Limba
1008Deepesh ChuiIndia2026-05-12Rangoni Of Florence UNQUALIFIED38Asiya Javayant
1009Jeanfrancois VenereBrazil2026-05-18Rangoni Of Florence NEGOTIATION70Anna Fali
1010Leja CaldareraGermany2026-06-04Commercial Press UNQUALIFIED57Asiya Javayant
1011Jefferson SchemmerSpain2026-05-09Commercial Press RENEWAL82Amy Elsner
1012Jefferson SchemmerSpain2026-05-13Chanay, Jeffrey A Esq UNQUALIFIED69Amy Elsner
1013Rodrigues CampainArgentina2026-05-19Chemel, James L Cpa QUALIFIED39Anna Fali
1014Jennifer AmigonBrazil2026-05-22Commercial Press NEGOTIATION52Elwin Sharvill
1015James ButtIndia2026-06-05Buckley Miller Wright NEW8Asiya Javayant
1016Alejandro PerinJapan2026-06-05Chemel, James L Cpa NEGOTIATION24Elwin Sharvill
1017Wickens NestleItaly2026-05-21Benton, John B Jr NEW75Bernardo Dominic
1018Chavez BriddickRussia2026-05-25Truhlar And Truhlar Attys RENEWAL85Ivan Magalhaes
1019Jefferson SchemmerJapan2026-05-14Benton, John B Jr RENEWAL2Xuxue Feng
1020Greenwood BologniaUnited Kingdom2026-05-24Truhlar And Truhlar Attys RENEWAL25Amy Elsner
1021Salvatore StockhamAustralia2026-05-09Commercial Press NEW5Xuxue Feng
1022Jennifer AmigonArgentina2026-05-16King, Christopher A Esq RENEWAL94Anna Fali
1023Julie StensethJapan2026-05-24Commercial Press NEGOTIATION96Bernardo Dominic
1024Jones VocelkaAustralia2026-05-24Chanay, Jeffrey A Esq NEW0Asiya Javayant
1025Johnson SergiGermany2026-05-17Chanay, Jeffrey A Esq QUALIFIED17Asiya Javayant
1026Smith GlickItaly2026-05-25Rangoni Of Florence RENEWAL78Stephen Shaw
1027Aruna FigeroaUnited Kingdom2026-06-06Feltz Printing Service RENEWAL22Ivan Magalhaes
1028Emily WhobreyArgentina2026-05-15Feiner Bros NEGOTIATION20Stephen Shaw
1029Tony FollerJapan2026-05-14Commercial Press NEGOTIATION51Amy Elsner
1030Adams MorascaCanada2026-06-07King, Christopher A Esq QUALIFIED9Ivan Magalhaes
1031Stacey MacleadGermany2026-05-19Rangoni Of Florence QUALIFIED24Onyama Limba
1032Misaki RoysterUnited Kingdom2026-05-29Truhlar And Truhlar Attys NEGOTIATION42Elwin Sharvill
1033Leon OldroydCanada2026-06-01Commercial Press NEGOTIATION26Stephen Shaw
1034Juan WieserCanada2026-06-01King, Christopher A Esq NEGOTIATION10Bernardo Dominic
1035Aika InouyeJapan2026-05-25Benton, John B Jr PROPOSAL3Onyama Limba
1036James ButtIndia2026-05-16Chemel, James L Cpa NEGOTIATION51Ivan Magalhaes
1037Ivar PaprockiBrazil2026-05-25Dorl, James J Esq UNQUALIFIED66Amy Elsner
1038Ricardo GauchoAustralia2026-05-18Printing Dimensions NEW34Amy Elsner
1039Jefferson SchemmerAustralia2026-06-02Rousseaux, Michael Esq RENEWAL98Ivan Magalhaes
1040Juan WieserAustralia2026-05-22Benton, John B Jr NEGOTIATION53Onyama Limba
1041Sinclair WaycottBrazil2026-06-07Benton, John B Jr UNQUALIFIED34Ivan Magalhaes
1042Misaki RoysterUnited Kingdom2026-05-15Rousseaux, Michael Esq NEW82Bernardo Dominic
1043Deepesh ChuiArgentina2026-05-31Dorl, James J Esq QUALIFIED91Xuxue Feng
1044Arvin AlbaresJapan2026-05-11Benton, John B Jr UNQUALIFIED53Elwin Sharvill
1045Francesco ShinkoFrance2026-06-04Feiner Bros NEW70Ivan Magalhaes
1046Jefferson SchemmerUnited Kingdom2026-05-13Chapman, Ross E Esq NEGOTIATION93Anna Fali
1047Smith GlickCanada2026-05-11Chapman, Ross E Esq RENEWAL87Stephen Shaw
1048Arvin AlbaresIndia2026-05-20Chapman, Ross E Esq UNQUALIFIED80Elwin Sharvill
1049Leon OldroydGermany2026-05-09Feltz Printing Service NEW26Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Kaitlin OstroskyRussiaXuxue Feng NEGOTIATION
Chavez BriddickGermanyStephen Shaw QUALIFIED
Aika InouyeJapanStephen Shaw NEW
Ashley DoeRussiaIvan Magalhaes RENEWAL
Emily WhobreyRussiaAnna Fali QUALIFIED
Deepesh ChuiBrazilBernardo Dominic PROPOSAL
Kadeem FlosiJapanAmy Elsner RENEWAL
Costa DilliardItalyBernardo Dominic NEW
Antonio CaudyArgentinaIvan Magalhaes QUALIFIED
David DarakjyUnited KingdomElwin Sharvill NEGOTIATION
Jones VocelkaRussiaAnna Fali QUALIFIED
Murillo MaletBrazilIoni Bowcher QUALIFIED
Arvin AlbaresArgentinaStephen Shaw UNQUALIFIED
Wickens NestleFranceXuxue Feng NEGOTIATION
Faith GillianFranceElwin Sharvill UNQUALIFIED
Alejandro PerinAustraliaAnna Fali NEW
Costa DilliardUnited KingdomOnyama Limba RENEWAL
Salvatore StockhamFranceAsiya Javayant NEGOTIATION
Emily WhobreyJapanAsiya Javayant NEW
Wickens NestleJapanOnyama Limba QUALIFIED
Costa DilliardUnited KingdomIoni Bowcher PROPOSAL
Antonio CaudyCanadaElwin Sharvill PROPOSAL
Leon OldroydJapanIvan Magalhaes QUALIFIED
Kaitlin OstroskyArgentinaAmy Elsner NEGOTIATION
Deepesh ChuiGermanyAnna Fali NEW
Claire TollnerAustraliaStephen Shaw UNQUALIFIED
Izzy GarufiCanadaStephen Shaw RENEWAL
Mujtaba NickaAustraliaXuxue Feng UNQUALIFIED
Emily WhobreyIndiaBernardo Dominic NEGOTIATION
Tony FollerUnited KingdomElwin Sharvill NEGOTIATION
Smith GlickGermanyAsiya Javayant PROPOSAL
Arvin AlbaresSpainIoni Bowcher UNQUALIFIED
Faith GillianRussiaOnyama Limba QUALIFIED
Ricardo GauchoArgentinaIoni Bowcher UNQUALIFIED
Aruna FigeroaRussiaIvan Magalhaes PROPOSAL
Ashley DoeUnited KingdomAmy Elsner RENEWAL
Silvio SlusarskiSpainAmy Elsner NEW
Claire TollnerUnited KingdomAsiya Javayant UNQUALIFIED
Aika InouyeSpainElwin Sharvill RENEWAL
Julie StensethJapanAmy Elsner QUALIFIED
Morrow RutaCanadaBernardo Dominic PROPOSAL
Ricardo GauchoUnited KingdomXuxue Feng PROPOSAL
Adams MorascaItalyOnyama Limba NEW
Isabel BowleyItalyElwin Sharvill UNQUALIFIED
Alejandro PerinFranceAmy Elsner PROPOSAL
Costa DilliardArgentinaIvan Magalhaes UNQUALIFIED
Leon OldroydBrazilXuxue Feng NEW
Alejandro PerinArgentinaIoni Bowcher PROPOSAL
Maisha RulapaughGermanyAsiya Javayant NEW
Aditya KuskoAustraliaAmy Elsner RENEWAL
Frozen Columns
Name
Darci Poquette
Darci Poquette
Costa Dilliard
Ivar Paprocki
Cody Saylors
Johnson Sergi
Emily Whobrey
Sinclair Waycott
Chavez Briddick
Ivar Paprocki
Adams Morasca
Mayumi Kolmetz
Claire Tollner
Salvatore Stockham
Emily Whobrey
Izzy Garufi
Silvio Slusarski
Francesco Shinko
Kadeem Flosi
Emily Whobrey
Jefferson Schemmer
Tony Foller
Ricardo Gaucho
Aditya Kusko
Emily Whobrey
Salvatore Stockham
Greenwood Bolognia
Alejandro Perin
Arvin Albares
David Darakjy
Clifford Rim
Munro Ferencz
James Butt
Murillo Malet
Darci Poquette
Nicolas Iturbide
Misaki Royster
Silvio Slusarski
David Darakjy
Sinclair Waycott
Antonio Caudy
Morrow Ruta
Jefferson Schemmer
Johnson Sergi
Jefferson Schemmer
Mujtaba Nicka
Octavia Malet
Greenwood Bolognia
Jennifer Amigon
Cody Saylors
IdCountryDate
1000France2026-06-01
1001France2026-05-09
1002Japan2026-06-04
1003France2026-05-19
1004United Kingdom2026-05-17
1005United Kingdom2026-05-14
1006United Kingdom2026-06-05
1007Italy2026-05-22
1008Australia2026-05-25
1009France2026-06-05
1010Russia2026-05-29
1011Russia2026-06-02
1012United Kingdom2026-05-28
1013Russia2026-05-27
1014Spain2026-05-29
1015India2026-05-27
1016Japan2026-06-06
1017Argentina2026-05-24
1018Japan2026-05-28
1019Italy2026-05-31
1020Brazil2026-06-06
1021Canada2026-05-16
1022Argentina2026-05-19
1023Argentina2026-05-16
1024Spain2026-05-28
1025Italy2026-06-03
1026France2026-05-23
1027France2026-05-31
1028Italy2026-05-29
1029Italy2026-05-31
1030Spain2026-05-18
1031India2026-05-19
1032Canada2026-05-19
1033Italy2026-05-14
1034Russia2026-05-16
1035Spain2026-05-09
1036Spain2026-06-06
1037Russia2026-05-09
1038Brazil2026-06-04
1039France2026-05-22
1040India2026-05-31
1041Russia2026-05-26
1042Germany2026-05-30
1043India2026-06-04
1044Brazil2026-05-17
1045Brazil2026-05-22
1046Argentina2026-05-11
1047Russia2026-05-11
1048Argentina2026-05-11
1049Canada2026-06-07

On-Demand Data

NameIdCountryDate
Rodrigues Campain1000Italy2026-05-27
Stacey Maclead1001Russia2026-05-16
Costa Dilliard1002France2026-05-09
Stacey Maclead1003Japan2026-05-18
Adams Morasca1004Russia2026-05-25
Wickens Nestle1005Italy2026-06-05
Munro Ferencz1006Japan2026-05-22
Aika Inouye1007France2026-05-25
Murillo Malet1008Argentina2026-05-17
Aditya Kusko1009France2026-05-22
Johnson Sergi1010United Kingdom2026-05-30
Aika Inouye1011Brazil2026-05-26
Smith Glick1012France2026-06-07
Julie Stenseth1013Argentina2026-05-31
Darci Poquette1014Germany2026-06-04
Ivar Paprocki1015Japan2026-05-13
Emily Whobrey1016Japan2026-06-02
Emily Whobrey1017Argentina2026-05-30
Alejandro Perin1018Australia2026-05-24
Arvin Albares1019United Kingdom2026-05-10
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Adams MorascaBrazilElwin Sharvill QUALIFIED
Isabel BowleyRussiaXuxue Feng PROPOSAL
Misaki RoysterFranceIvan Magalhaes NEGOTIATION
David DarakjyJapanStephen Shaw NEGOTIATION
Silvio SlusarskiBrazilXuxue Feng RENEWAL
Juan WieserGermanyIvan Magalhaes PROPOSAL
Rodrigues CampainSpainBernardo Dominic UNQUALIFIED
Adams MorascaCanadaElwin Sharvill QUALIFIED
Munro FerenczCanadaStephen Shaw UNQUALIFIED
Misaki RoysterItalyIvan Magalhaes RENEWAL
Aditya KuskoJapanAnna Fali NEGOTIATION
Antonio CaudySpainXuxue Feng NEW
Munro FerenczUnited KingdomIvan Magalhaes UNQUALIFIED
Antonio CaudySpainStephen Shaw QUALIFIED
Darci PoquetteGermanyAsiya Javayant NEW
Misaki RoysterArgentinaAsiya Javayant NEGOTIATION
Ivar PaprockiFranceAsiya Javayant QUALIFIED
Maisha RulapaughGermanyStephen Shaw UNQUALIFIED
Darci PoquetteIndiaBernardo Dominic QUALIFIED
Ashley DoeBrazilIvan Magalhaes QUALIFIED
Kaitlin OstroskyUnited KingdomElwin Sharvill RENEWAL
Kadeem FlosiSpainIoni Bowcher PROPOSAL
Faith GillianItalyIoni Bowcher NEW
Tony FollerJapanIoni Bowcher PROPOSAL
David DarakjyFranceAnna Fali PROPOSAL
Mayumi KolmetzArgentinaIvan Magalhaes NEW
Leja CaldareraArgentinaStephen Shaw UNQUALIFIED
Mujtaba NickaUnited KingdomBernardo Dominic NEGOTIATION
Leon OldroydUnited KingdomAnna Fali NEW
Arvin AlbaresItalyAnna Fali NEGOTIATION
Maria MarrierIndiaXuxue Feng NEW
Ricardo GauchoUnited KingdomStephen Shaw PROPOSAL
Wickens NestleItalyOnyama Limba UNQUALIFIED
Ivar PaprockiArgentinaOnyama Limba QUALIFIED
Adams MorascaFranceStephen Shaw QUALIFIED
Chavez BriddickGermanyXuxue Feng UNQUALIFIED
Kadeem FlosiUnited KingdomAmy Elsner PROPOSAL
Morrow RutaBrazilAmy Elsner RENEWAL
Cody SaylorsSpainIoni Bowcher QUALIFIED
Leon OldroydJapanAsiya Javayant 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>