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
Arvin AlbaresJapanIoni Bowcher RENEWAL
Aika InouyeGermanyAnna Fali UNQUALIFIED
Rodrigues CampainAustraliaBernardo Dominic NEGOTIATION
Ricardo GauchoGermanyAmy Elsner PROPOSAL
Kadeem FlosiArgentinaAnna Fali PROPOSAL
Smith GlickArgentinaAsiya Javayant NEGOTIATION
David DarakjyIndiaXuxue Feng PROPOSAL
David DarakjyItalyOnyama Limba NEW
Chavez BriddickBrazilAsiya Javayant NEW
Wickens NestleUnited KingdomElwin Sharvill RENEWAL
Johnson SergiAustraliaIoni Bowcher RENEWAL
Stacey MacleadCanadaAmy Elsner NEW
Jones VocelkaUnited KingdomOnyama Limba QUALIFIED
Isabel BowleyGermanyAnna Fali NEGOTIATION
Ashley DoeIndiaIvan Magalhaes QUALIFIED
Emily WhobreyUnited KingdomAsiya Javayant RENEWAL
Leon OldroydItalyIoni Bowcher NEW
Leja CaldareraRussiaOnyama Limba RENEWAL
Wickens NestleIndiaXuxue Feng NEW
Maria MarrierUnited KingdomIoni Bowcher UNQUALIFIED
Johnson SergiCanadaIoni Bowcher PROPOSAL
Jefferson SchemmerFranceIoni Bowcher NEGOTIATION
Darci PoquetteArgentinaStephen Shaw NEGOTIATION
Cody SaylorsGermanyOnyama Limba QUALIFIED
Greenwood BologniaBrazilBernardo Dominic QUALIFIED
Cody SaylorsRussiaAmy Elsner UNQUALIFIED
Silvio SlusarskiItalyAsiya Javayant PROPOSAL
Murillo MaletAustraliaOnyama Limba PROPOSAL
Cody SaylorsSpainBernardo Dominic NEW
Kaitlin OstroskyItalyAnna Fali QUALIFIED
Isabel BowleyGermanyXuxue Feng UNQUALIFIED
Murillo MaletGermanyStephen Shaw UNQUALIFIED
Murillo MaletSpainBernardo Dominic PROPOSAL
Claire TollnerCanadaBernardo Dominic UNQUALIFIED
Tony FollerJapanIvan Magalhaes RENEWAL
Jefferson SchemmerArgentinaOnyama Limba RENEWAL
Isabel BowleyBrazilAnna Fali NEW
Julie StensethJapanElwin Sharvill UNQUALIFIED
David DarakjyIndiaIoni Bowcher NEGOTIATION
Emily WhobreyIndiaOnyama Limba UNQUALIFIED
Rodrigues CampainJapanAsiya Javayant NEGOTIATION
Aika InouyeIndiaIoni Bowcher RENEWAL
Francesco ShinkoAustraliaXuxue Feng RENEWAL
Leon OldroydCanadaElwin Sharvill PROPOSAL
Julie StensethBrazilStephen Shaw UNQUALIFIED
Izzy GarufiIndiaIoni Bowcher NEW
Murillo MaletJapanOnyama Limba PROPOSAL
Clifford RimUnited KingdomStephen Shaw RENEWAL
Mujtaba NickaArgentinaIoni Bowcher UNQUALIFIED
Emily WhobreyUnited KingdomBernardo Dominic PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Octavia MaletAustraliaBernardo Dominic QUALIFIED
Aika InouyeItalyIoni Bowcher RENEWAL
Isabel BowleyArgentinaElwin Sharvill RENEWAL
Faith GillianRussiaStephen Shaw UNQUALIFIED
Misaki RoysterSpainBernardo Dominic QUALIFIED
Francesco ShinkoSpainStephen Shaw RENEWAL
Antonio CaudyGermanyAmy Elsner UNQUALIFIED
Salvatore StockhamBrazilIoni Bowcher NEGOTIATION
Sinclair WaycottArgentinaXuxue Feng PROPOSAL
Leon OldroydBrazilBernardo Dominic RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Rodrigues CampainCanada2026-05-20Commercial Press RENEWAL26Elwin Sharvill
1001Maria MarrierCanada2026-05-26Chapman, Ross E Esq NEGOTIATION16Stephen Shaw
1002Julie StensethSpain2026-06-04Morlong Associates RENEWAL4Stephen Shaw
1003Aditya KuskoArgentina2026-05-24Commercial Press NEW23Bernardo Dominic
1004Murillo MaletCanada2026-05-27Printing Dimensions NEGOTIATION21Amy Elsner
1005Greenwood BologniaArgentina2026-05-17King, Christopher A Esq RENEWAL86Bernardo Dominic
1006Silvio SlusarskiUnited Kingdom2026-05-19Truhlar And Truhlar Attys PROPOSAL19Elwin Sharvill
1007Kaitlin OstroskyUnited Kingdom2026-05-16Chemel, James L Cpa PROPOSAL24Ioni Bowcher
1008Tony FollerItaly2026-06-03Rangoni Of Florence QUALIFIED50Bernardo Dominic
1009Morrow RutaAustralia2026-06-08King, Christopher A Esq PROPOSAL3Xuxue Feng
1010James ButtAustralia2026-05-23Chanay, Jeffrey A Esq RENEWAL7Stephen Shaw
1011David DarakjyCanada2026-05-19King, Christopher A Esq PROPOSAL2Ivan Magalhaes
1012Silvio SlusarskiRussia2026-06-11Truhlar And Truhlar Attys NEW90Ivan Magalhaes
1013Ashley DoeIndia2026-06-07Truhlar And Truhlar Attys QUALIFIED39Bernardo Dominic
1014Salvatore StockhamCanada2026-06-03Chemel, James L Cpa UNQUALIFIED47Onyama Limba
1015Julie StensethItaly2026-06-12Feiner Bros PROPOSAL17Ioni Bowcher
1016Munro FerenczUnited Kingdom2026-05-31Truhlar And Truhlar Attys UNQUALIFIED47Stephen Shaw
1017Morrow RutaFrance2026-05-16Dorl, James J Esq NEGOTIATION11Xuxue Feng
1018Costa DilliardJapan2026-05-22Dorl, James J Esq NEW49Ivan Magalhaes
1019James ButtUnited Kingdom2026-06-08Chapman, Ross E Esq NEGOTIATION74Elwin Sharvill
1020Leja CaldareraBrazil2026-05-18Morlong Associates RENEWAL61Elwin Sharvill
1021Greenwood BologniaIndia2026-06-13Feiner Bros UNQUALIFIED74Xuxue Feng
1022Wickens NestleCanada2026-06-04Commercial Press QUALIFIED52Ivan Magalhaes
1023Aika InouyeJapan2026-05-24Rousseaux, Michael Esq UNQUALIFIED71Onyama Limba
1024Stacey MacleadArgentina2026-05-28Printing Dimensions RENEWAL32Stephen Shaw
1025Darci PoquetteSpain2026-06-02Chapman, Ross E Esq QUALIFIED56Amy Elsner
1026Jennifer AmigonBrazil2026-05-17Feiner Bros NEW9Amy Elsner
1027Smith GlickArgentina2026-06-13Truhlar And Truhlar Attys NEW40Ioni Bowcher
1028Arvin AlbaresGermany2026-06-05Benton, John B Jr QUALIFIED6Bernardo Dominic
1029Aika InouyeJapan2026-05-22Feiner Bros NEGOTIATION92Elwin Sharvill
1030Deepesh ChuiAustralia2026-05-23Benton, John B Jr QUALIFIED54Ioni Bowcher
1031Jeanfrancois VenereAustralia2026-06-13Rousseaux, Michael Esq NEW62Elwin Sharvill
1032Ivar PaprockiArgentina2026-05-15Dorl, James J Esq QUALIFIED78Anna Fali
1033Misaki RoysterRussia2026-05-26King, Christopher A Esq RENEWAL76Anna Fali
1034Misaki RoysterIndia2026-06-04Printing Dimensions NEW24Amy Elsner
1035Nicolas IturbideUnited Kingdom2026-05-17Buckley Miller Wright QUALIFIED46Xuxue Feng
1036Maisha RulapaughBrazil2026-06-07King, Christopher A Esq RENEWAL14Elwin Sharvill
1037Isabel BowleySpain2026-06-10King, Christopher A Esq QUALIFIED58Stephen Shaw
1038Mayumi KolmetzGermany2026-05-24Morlong Associates NEGOTIATION9Stephen Shaw
1039Nicolas IturbideFrance2026-06-05Dorl, James J Esq NEW25Anna Fali
1040James ButtUnited Kingdom2026-05-17Rangoni Of Florence RENEWAL64Anna Fali
1041Aditya KuskoArgentina2026-05-24Rousseaux, Michael Esq UNQUALIFIED29Stephen Shaw
1042Mayumi KolmetzBrazil2026-06-08Feltz Printing Service NEW69Xuxue Feng
1043Maisha RulapaughArgentina2026-06-02Chanay, Jeffrey A Esq QUALIFIED57Elwin Sharvill
1044Claire TollnerUnited Kingdom2026-05-18Feiner Bros NEGOTIATION17Onyama Limba
1045Antonio CaudyBrazil2026-05-29King, Christopher A Esq RENEWAL33Elwin Sharvill
1046Juan WieserFrance2026-06-10Benton, John B Jr QUALIFIED32Amy Elsner
1047Darci PoquetteIndia2026-06-09Feiner Bros RENEWAL60Bernardo Dominic
1048Aditya KuskoJapan2026-06-01Buckley Miller Wright QUALIFIED10Onyama Limba
1049Aditya KuskoUnited Kingdom2026-06-02Chanay, Jeffrey A Esq UNQUALIFIED41Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Wickens NestleJapanAsiya Javayant NEGOTIATION
Tony FollerUnited KingdomIoni Bowcher UNQUALIFIED
Emily WhobreyBrazilIoni Bowcher UNQUALIFIED
Murillo MaletRussiaIvan Magalhaes QUALIFIED
Maisha RulapaughBrazilAmy Elsner UNQUALIFIED
Ashley DoeFranceAmy Elsner NEW
Wickens NestleFranceOnyama Limba QUALIFIED
Aditya KuskoBrazilXuxue Feng QUALIFIED
Izzy GarufiRussiaXuxue Feng NEGOTIATION
Misaki RoysterIndiaOnyama Limba NEGOTIATION
Silvio SlusarskiIndiaAmy Elsner NEGOTIATION
Cody SaylorsSpainOnyama Limba NEW
Nicolas IturbideArgentinaStephen Shaw UNQUALIFIED
Cody SaylorsIndiaStephen Shaw QUALIFIED
Morrow RutaItalyElwin Sharvill NEW
David DarakjyArgentinaIoni Bowcher NEW
Misaki RoysterFranceAsiya Javayant QUALIFIED
Francesco ShinkoIndiaOnyama Limba UNQUALIFIED
Darci PoquetteAustraliaElwin Sharvill PROPOSAL
Costa DilliardBrazilAmy Elsner NEGOTIATION
Mujtaba NickaArgentinaAmy Elsner NEGOTIATION
Isabel BowleyJapanIvan Magalhaes NEW
Stacey MacleadUnited KingdomAnna Fali UNQUALIFIED
Aika InouyeItalyIoni Bowcher NEW
Cody SaylorsArgentinaAmy Elsner NEGOTIATION
Leja CaldareraBrazilOnyama Limba RENEWAL
Salvatore StockhamRussiaXuxue Feng QUALIFIED
Costa DilliardGermanyOnyama Limba NEGOTIATION
Ricardo GauchoFranceStephen Shaw NEW
Arvin AlbaresSpainIoni Bowcher UNQUALIFIED
Nicolas IturbideBrazilIvan Magalhaes QUALIFIED
Salvatore StockhamCanadaOnyama Limba NEGOTIATION
Jefferson SchemmerUnited KingdomBernardo Dominic NEW
Deepesh ChuiBrazilAnna Fali NEGOTIATION
Faith GillianIndiaBernardo Dominic PROPOSAL
Ricardo GauchoSpainXuxue Feng RENEWAL
Smith GlickGermanyIvan Magalhaes QUALIFIED
Ivar PaprockiGermanyBernardo Dominic PROPOSAL
Antonio CaudySpainAsiya Javayant RENEWAL
Maria MarrierIndiaOnyama Limba NEW
David DarakjyCanadaElwin Sharvill PROPOSAL
Smith GlickArgentinaBernardo Dominic UNQUALIFIED
Morrow RutaBrazilBernardo Dominic NEW
Adams MorascaArgentinaOnyama Limba UNQUALIFIED
Greenwood BologniaAustraliaIoni Bowcher NEW
Nicolas IturbideCanadaBernardo Dominic NEW
Isabel BowleyBrazilElwin Sharvill NEGOTIATION
Murillo MaletBrazilBernardo Dominic PROPOSAL
Izzy GarufiCanadaStephen Shaw NEW
Julie StensethRussiaIvan Magalhaes PROPOSAL
Frozen Columns
Name
Aditya Kusko
Claire Tollner
Darci Poquette
Sinclair Waycott
Mayumi Kolmetz
Kadeem Flosi
Mayumi Kolmetz
Tony Foller
Ashley Doe
Jefferson Schemmer
Aditya Kusko
Isabel Bowley
Aruna Figeroa
Sinclair Waycott
Ashley Doe
Francesco Shinko
Maria Marrier
Jefferson Schemmer
Ivar Paprocki
Tony Foller
Smith Glick
Salvatore Stockham
Juan Wieser
Chavez Briddick
Smith Glick
Johnson Sergi
Maria Marrier
Juan Wieser
Maisha Rulapaugh
Izzy Garufi
Izzy Garufi
Arvin Albares
Costa Dilliard
Jefferson Schemmer
Mujtaba Nicka
Mayumi Kolmetz
Greenwood Bolognia
Kadeem Flosi
Jefferson Schemmer
Sinclair Waycott
Nicolas Iturbide
Aika Inouye
Wickens Nestle
Kaitlin Ostrosky
Maisha Rulapaugh
Jennifer Amigon
Jeanfrancois Venere
Smith Glick
Isabel Bowley
Antonio Caudy
IdCountryDate
1000Japan2026-06-04
1001Russia2026-06-08
1002Argentina2026-05-28
1003Canada2026-06-08
1004Italy2026-05-29
1005Argentina2026-06-13
1006Brazil2026-06-01
1007Russia2026-06-07
1008India2026-06-06
1009Italy2026-05-25
1010India2026-06-05
1011Spain2026-06-08
1012India2026-05-26
1013Argentina2026-06-09
1014France2026-06-11
1015France2026-06-04
1016France2026-06-03
1017Japan2026-06-03
1018Germany2026-05-20
1019Russia2026-05-22
1020Spain2026-05-23
1021Spain2026-05-17
1022Japan2026-05-29
1023Japan2026-06-06
1024Australia2026-06-12
1025Japan2026-05-21
1026Argentina2026-05-16
1027Canada2026-05-29
1028Germany2026-05-20
1029Germany2026-05-30
1030France2026-05-20
1031Japan2026-05-31
1032Germany2026-06-13
1033Australia2026-06-02
1034Japan2026-05-17
1035Spain2026-06-11
1036Germany2026-05-23
1037Russia2026-05-17
1038Italy2026-06-07
1039Spain2026-06-03
1040Germany2026-05-15
1041Germany2026-06-04
1042India2026-05-22
1043Brazil2026-05-16
1044Japan2026-05-24
1045India2026-06-11
1046Spain2026-05-25
1047Argentina2026-05-19
1048Canada2026-06-08
1049Russia2026-05-19

On-Demand Data

NameIdCountryDate
Isabel Bowley1000Canada2026-05-27
Misaki Royster1001Russia2026-05-23
Izzy Garufi1002France2026-05-17
Ashley Doe1003Italy2026-06-06
Silvio Slusarski1004United Kingdom2026-05-24
Chavez Briddick1005Japan2026-05-24
Smith Glick1006Brazil2026-05-16
Emily Whobrey1007United Kingdom2026-05-26
Kaitlin Ostrosky1008France2026-05-31
Munro Ferencz1009United Kingdom2026-05-16
Ricardo Gaucho1010Canada2026-05-16
Darci Poquette1011France2026-05-27
Nicolas Iturbide1012Italy2026-05-29
Costa Dilliard1013India2026-05-29
Mayumi Kolmetz1014Brazil2026-06-12
Isabel Bowley1015France2026-05-15
Emily Whobrey1016Russia2026-05-17
Octavia Malet1017India2026-06-04
Munro Ferencz1018Canada2026-05-30
Greenwood Bolognia1019Japan2026-05-23
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Deepesh ChuiArgentinaXuxue Feng PROPOSAL
Leja CaldareraArgentinaStephen Shaw QUALIFIED
Aditya KuskoSpainBernardo Dominic NEW
Smith GlickGermanyElwin Sharvill RENEWAL
Clifford RimJapanIvan Magalhaes PROPOSAL
Smith GlickRussiaAnna Fali QUALIFIED
Aika InouyeIndiaElwin Sharvill NEW
Maisha RulapaughBrazilStephen Shaw QUALIFIED
Stacey MacleadSpainElwin Sharvill RENEWAL
Chavez BriddickArgentinaXuxue Feng UNQUALIFIED
Silvio SlusarskiRussiaStephen Shaw NEGOTIATION
Kaitlin OstroskyArgentinaAmy Elsner PROPOSAL
Cody SaylorsBrazilIvan Magalhaes QUALIFIED
Chavez BriddickGermanyXuxue Feng NEGOTIATION
Claire TollnerUnited KingdomAnna Fali QUALIFIED
Costa DilliardGermanyStephen Shaw PROPOSAL
Darci PoquetteAustraliaAnna Fali NEGOTIATION
Rodrigues CampainRussiaOnyama Limba RENEWAL
Adams MorascaSpainAsiya Javayant UNQUALIFIED
Kadeem FlosiCanadaIvan Magalhaes RENEWAL
Juan WieserSpainXuxue Feng RENEWAL
Munro FerenczAustraliaIvan Magalhaes PROPOSAL
Ivar PaprockiGermanyBernardo Dominic UNQUALIFIED
Antonio CaudyGermanyXuxue Feng QUALIFIED
Maisha RulapaughFranceOnyama Limba NEW
Leja CaldareraJapanXuxue Feng RENEWAL
Smith GlickSpainIoni Bowcher QUALIFIED
Emily WhobreyRussiaElwin Sharvill NEGOTIATION
Nicolas IturbideBrazilAsiya Javayant RENEWAL
Deepesh ChuiIndiaOnyama Limba UNQUALIFIED
Julie StensethUnited KingdomElwin Sharvill QUALIFIED
Leja CaldareraArgentinaXuxue Feng RENEWAL
Ricardo GauchoFranceStephen Shaw RENEWAL
Mayumi KolmetzAustraliaIvan Magalhaes NEGOTIATION
Salvatore StockhamItalyStephen Shaw NEGOTIATION
Misaki RoysterIndiaBernardo Dominic PROPOSAL
Maria MarrierJapanAsiya Javayant RENEWAL
Claire TollnerBrazilElwin Sharvill NEGOTIATION
Johnson SergiItalyElwin Sharvill QUALIFIED
Antonio CaudySpainAmy Elsner 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>