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 PaprockiFranceStephen Shaw NEGOTIATION
Murillo MaletBrazilIoni Bowcher QUALIFIED
Cody SaylorsBrazilAmy Elsner QUALIFIED
Tony FollerJapanAnna Fali NEGOTIATION
Rodrigues CampainArgentinaOnyama Limba QUALIFIED
Tony FollerGermanyIvan Magalhaes QUALIFIED
Francesco ShinkoBrazilOnyama Limba QUALIFIED
Aruna FigeroaSpainStephen Shaw PROPOSAL
Julie StensethAustraliaIvan Magalhaes RENEWAL
Wickens NestleJapanStephen Shaw RENEWAL
Leon OldroydAustraliaOnyama Limba PROPOSAL
Leja CaldareraFranceBernardo Dominic NEGOTIATION
Alejandro PerinArgentinaIoni Bowcher UNQUALIFIED
Stacey MacleadRussiaElwin Sharvill UNQUALIFIED
Aruna FigeroaGermanyXuxue Feng NEGOTIATION
Arvin AlbaresCanadaBernardo Dominic PROPOSAL
Wickens NestleAustraliaAmy Elsner UNQUALIFIED
Isabel BowleyUnited KingdomStephen Shaw UNQUALIFIED
Mayumi KolmetzItalyAsiya Javayant NEGOTIATION
Alejandro PerinArgentinaAsiya Javayant NEW
Morrow RutaCanadaIvan Magalhaes PROPOSAL
Smith GlickCanadaAmy Elsner UNQUALIFIED
Mujtaba NickaCanadaBernardo Dominic RENEWAL
Francesco ShinkoGermanyIvan Magalhaes QUALIFIED
Ashley DoeAustraliaOnyama Limba PROPOSAL
Aditya KuskoAustraliaAnna Fali PROPOSAL
Nicolas IturbideBrazilOnyama Limba NEGOTIATION
Maisha RulapaughBrazilIoni Bowcher UNQUALIFIED
Johnson SergiGermanyOnyama Limba UNQUALIFIED
Jeanfrancois VenereItalyIvan Magalhaes RENEWAL
Chavez BriddickCanadaIoni Bowcher UNQUALIFIED
Munro FerenczUnited KingdomXuxue Feng QUALIFIED
Jefferson SchemmerGermanyBernardo Dominic NEGOTIATION
Darci PoquetteRussiaBernardo Dominic PROPOSAL
Stacey MacleadItalyAmy Elsner PROPOSAL
Deepesh ChuiRussiaOnyama Limba QUALIFIED
Aruna FigeroaBrazilBernardo Dominic UNQUALIFIED
Alejandro PerinUnited KingdomAnna Fali UNQUALIFIED
Adams MorascaUnited KingdomAsiya Javayant NEGOTIATION
Leon OldroydAustraliaXuxue Feng UNQUALIFIED
Claire TollnerArgentinaAsiya Javayant NEGOTIATION
Claire TollnerIndiaAnna Fali QUALIFIED
Julie StensethRussiaBernardo Dominic NEGOTIATION
Isabel BowleySpainElwin Sharvill NEGOTIATION
Nicolas IturbideJapanIoni Bowcher RENEWAL
Silvio SlusarskiGermanyElwin Sharvill UNQUALIFIED
Kaitlin OstroskyArgentinaAsiya Javayant NEGOTIATION
Ricardo GauchoAustraliaStephen Shaw NEW
Chavez BriddickJapanIoni Bowcher PROPOSAL
Isabel BowleySpainIoni Bowcher NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Cody SaylorsIndiaAsiya Javayant QUALIFIED
Johnson SergiJapanOnyama Limba UNQUALIFIED
Darci PoquetteJapanOnyama Limba NEW
Antonio CaudyRussiaOnyama Limba QUALIFIED
Alejandro PerinArgentinaBernardo Dominic RENEWAL
Mayumi KolmetzItalyIoni Bowcher RENEWAL
Ashley DoeFranceStephen Shaw RENEWAL
Clifford RimAustraliaAnna Fali NEW
Aditya KuskoItalyAsiya Javayant UNQUALIFIED
Faith GillianCanadaElwin Sharvill UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Darci PoquetteSpain2026-06-08Printing Dimensions NEW41Amy Elsner
1001Leja CaldareraCanada2026-06-04King, Christopher A Esq QUALIFIED79Ioni Bowcher
1002Jeanfrancois VenereItaly2026-05-29Morlong Associates NEGOTIATION64Ivan Magalhaes
1003Sinclair WaycottItaly2026-06-12Rangoni Of Florence UNQUALIFIED44Asiya Javayant
1004Tony FollerBrazil2026-06-10Feltz Printing Service UNQUALIFIED83Elwin Sharvill
1005Johnson SergiCanada2026-06-10Buckley Miller Wright PROPOSAL66Asiya Javayant
1006Kadeem FlosiRussia2026-05-26Dorl, James J Esq RENEWAL94Elwin Sharvill
1007Murillo MaletUnited Kingdom2026-05-26Feltz Printing Service NEW52Asiya Javayant
1008Sinclair WaycottBrazil2026-06-09Feiner Bros PROPOSAL68Amy Elsner
1009Aditya KuskoIndia2026-06-12Feltz Printing Service RENEWAL69Asiya Javayant
1010Maisha RulapaughIndia2026-06-09Rangoni Of Florence UNQUALIFIED99Ivan Magalhaes
1011James ButtIndia2026-06-11Printing Dimensions PROPOSAL50Xuxue Feng
1012Greenwood BologniaItaly2026-06-02Dorl, James J Esq QUALIFIED58Asiya Javayant
1013Ivar PaprockiArgentina2026-06-12Commercial Press NEGOTIATION81Elwin Sharvill
1014Adams MorascaArgentina2026-06-07Rangoni Of Florence UNQUALIFIED16Ivan Magalhaes
1015Deepesh ChuiGermany2026-06-07Chapman, Ross E Esq NEGOTIATION51Stephen Shaw
1016Johnson SergiJapan2026-05-20Commercial Press UNQUALIFIED54Stephen Shaw
1017Aruna FigeroaGermany2026-05-25Feiner Bros NEW84Xuxue Feng
1018Chavez BriddickJapan2026-06-02Commercial Press RENEWAL53Asiya Javayant
1019Aditya KuskoIndia2026-06-07Commercial Press PROPOSAL16Asiya Javayant
1020Cody SaylorsCanada2026-06-12Chapman, Ross E Esq UNQUALIFIED42Bernardo Dominic
1021Leon OldroydUnited Kingdom2026-05-23Chanay, Jeffrey A Esq UNQUALIFIED96Elwin Sharvill
1022Jennifer AmigonGermany2026-05-19Truhlar And Truhlar Attys NEW83Anna Fali
1023Kadeem FlosiUnited Kingdom2026-06-06Morlong Associates NEW40Asiya Javayant
1024Tony FollerCanada2026-06-08Printing Dimensions NEW61Stephen Shaw
1025Salvatore StockhamCanada2026-06-07Feiner Bros QUALIFIED24Anna Fali
1026Isabel BowleyRussia2026-06-09Dorl, James J Esq NEW22Asiya Javayant
1027Costa DilliardItaly2026-05-22Benton, John B Jr NEGOTIATION26Bernardo Dominic
1028Sinclair WaycottSpain2026-06-12Chapman, Ross E Esq RENEWAL56Asiya Javayant
1029Antonio CaudyIndia2026-05-19Buckley Miller Wright NEW25Ioni Bowcher
1030Mayumi KolmetzJapan2026-06-13King, Christopher A Esq NEW94Onyama Limba
1031James ButtUnited Kingdom2026-05-26Feiner Bros NEW90Stephen Shaw
1032Ivar PaprockiItaly2026-05-27Feltz Printing Service RENEWAL34Asiya Javayant
1033Maisha RulapaughIndia2026-05-28Dorl, James J Esq RENEWAL46Ioni Bowcher
1034Wickens NestleBrazil2026-05-20Chanay, Jeffrey A Esq UNQUALIFIED96Bernardo Dominic
1035Faith GillianBrazil2026-06-03Feiner Bros RENEWAL17Ivan Magalhaes
1036Francesco ShinkoCanada2026-05-22Benton, John B Jr RENEWAL80Onyama Limba
1037Maria MarrierItaly2026-05-20Chanay, Jeffrey A Esq UNQUALIFIED62Ivan Magalhaes
1038Darci PoquetteArgentina2026-05-27Feltz Printing Service QUALIFIED26Onyama Limba
1039Aika InouyeGermany2026-05-17Truhlar And Truhlar Attys QUALIFIED65Onyama Limba
1040Silvio SlusarskiGermany2026-05-20Morlong Associates NEGOTIATION29Onyama Limba
1041Salvatore StockhamUnited Kingdom2026-05-17Dorl, James J Esq RENEWAL14Asiya Javayant
1042Antonio CaudyAustralia2026-06-08Chemel, James L Cpa RENEWAL64Elwin Sharvill
1043Claire TollnerRussia2026-06-05Feiner Bros PROPOSAL38Anna Fali
1044Greenwood BologniaItaly2026-06-06Truhlar And Truhlar Attys PROPOSAL81Ioni Bowcher
1045Aika InouyeFrance2026-05-22Printing Dimensions QUALIFIED21Asiya Javayant
1046Chavez BriddickUnited Kingdom2026-06-04Truhlar And Truhlar Attys NEGOTIATION61Onyama Limba
1047Maria MarrierSpain2026-06-11Chemel, James L Cpa QUALIFIED0Elwin Sharvill
1048Murillo MaletFrance2026-06-06Truhlar And Truhlar Attys UNQUALIFIED45Xuxue Feng
1049Deepesh ChuiArgentina2026-06-12Chapman, Ross E Esq UNQUALIFIED77Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Wickens NestleArgentinaOnyama Limba QUALIFIED
Deepesh ChuiItalyAnna Fali UNQUALIFIED
Costa DilliardRussiaIoni Bowcher QUALIFIED
Deepesh ChuiCanadaBernardo Dominic QUALIFIED
Rodrigues CampainFranceAmy Elsner RENEWAL
Leon OldroydCanadaOnyama Limba QUALIFIED
Aditya KuskoCanadaAsiya Javayant UNQUALIFIED
Jones VocelkaRussiaBernardo Dominic NEGOTIATION
Deepesh ChuiGermanyAmy Elsner RENEWAL
Antonio CaudyRussiaAsiya Javayant NEGOTIATION
Sinclair WaycottIndiaAnna Fali NEW
Jones VocelkaArgentinaXuxue Feng NEGOTIATION
Stacey MacleadJapanAmy Elsner RENEWAL
Munro FerenczRussiaAsiya Javayant PROPOSAL
Greenwood BologniaFranceStephen Shaw UNQUALIFIED
Aika InouyeSpainAnna Fali NEW
Francesco ShinkoArgentinaIvan Magalhaes UNQUALIFIED
Murillo MaletSpainAsiya Javayant NEW
Alejandro PerinItalyAsiya Javayant QUALIFIED
Izzy GarufiFranceStephen Shaw NEGOTIATION
David DarakjyUnited KingdomStephen Shaw PROPOSAL
Leon OldroydArgentinaOnyama Limba NEW
Jeanfrancois VenereUnited KingdomIoni Bowcher NEGOTIATION
Rodrigues CampainGermanyStephen Shaw QUALIFIED
Ashley DoeBrazilAmy Elsner QUALIFIED
Leon OldroydGermanyIoni Bowcher PROPOSAL
Francesco ShinkoBrazilAsiya Javayant PROPOSAL
Clifford RimSpainIoni Bowcher QUALIFIED
Maisha RulapaughFranceIoni Bowcher QUALIFIED
Tony FollerUnited KingdomOnyama Limba UNQUALIFIED
Clifford RimArgentinaOnyama Limba PROPOSAL
Maisha RulapaughIndiaAmy Elsner NEW
Morrow RutaBrazilElwin Sharvill UNQUALIFIED
Sinclair WaycottSpainAmy Elsner NEW
Maisha RulapaughFranceBernardo Dominic NEW
Chavez BriddickIndiaXuxue Feng NEW
Salvatore StockhamBrazilBernardo Dominic NEGOTIATION
Tony FollerBrazilAnna Fali QUALIFIED
Cody SaylorsGermanyIvan Magalhaes NEGOTIATION
Kadeem FlosiIndiaIoni Bowcher UNQUALIFIED
Mayumi KolmetzItalyAmy Elsner RENEWAL
Tony FollerItalyIvan Magalhaes NEGOTIATION
Wickens NestleSpainElwin Sharvill PROPOSAL
Nicolas IturbideAustraliaIvan Magalhaes NEW
Aruna FigeroaBrazilXuxue Feng NEW
Arvin AlbaresRussiaAnna Fali NEW
Kaitlin OstroskyFranceIoni Bowcher RENEWAL
Izzy GarufiSpainElwin Sharvill NEW
Arvin AlbaresJapanXuxue Feng UNQUALIFIED
Adams MorascaArgentinaBernardo Dominic QUALIFIED
Frozen Columns
Name
Isabel Bowley
Darci Poquette
Misaki Royster
Jeanfrancois Venere
Adams Morasca
Ricardo Gaucho
Juan Wieser
Morrow Ruta
Octavia Malet
Tony Foller
Alejandro Perin
Murillo Malet
Emily Whobrey
Darci Poquette
Leja Caldarera
James Butt
Darci Poquette
Clifford Rim
Greenwood Bolognia
Ricardo Gaucho
Murillo Malet
Ashley Doe
Deepesh Chui
Maisha Rulapaugh
Emily Whobrey
Salvatore Stockham
Leja Caldarera
Arvin Albares
Faith Gillian
Misaki Royster
Cody Saylors
Jennifer Amigon
Octavia Malet
Maria Marrier
Greenwood Bolognia
Morrow Ruta
Darci Poquette
Ricardo Gaucho
Leja Caldarera
Faith Gillian
Munro Ferencz
Jones Vocelka
Misaki Royster
Nicolas Iturbide
Francesco Shinko
Julie Stenseth
Costa Dilliard
Ivar Paprocki
Kadeem Flosi
Jeanfrancois Venere
IdCountryDate
1000Argentina2026-05-18
1001Argentina2026-06-09
1002Argentina2026-06-07
1003France2026-05-25
1004Australia2026-06-03
1005Brazil2026-06-11
1006Brazil2026-06-08
1007Russia2026-06-11
1008Russia2026-06-14
1009Russia2026-06-12
1010Spain2026-06-08
1011Spain2026-06-14
1012India2026-06-05
1013France2026-06-13
1014Italy2026-05-22
1015Russia2026-06-08
1016India2026-05-26
1017Japan2026-06-05
1018Canada2026-06-10
1019Russia2026-05-27
1020Brazil2026-06-13
1021Canada2026-05-24
1022Canada2026-05-23
1023Australia2026-05-19
1024Russia2026-06-04
1025Australia2026-05-25
1026Australia2026-06-05
1027Italy2026-05-27
1028Germany2026-06-07
1029Brazil2026-06-08
1030Russia2026-06-06
1031United Kingdom2026-05-27
1032Brazil2026-06-08
1033Brazil2026-05-23
1034Brazil2026-05-20
1035Japan2026-06-08
1036Brazil2026-06-06
1037Brazil2026-06-09
1038Australia2026-06-12
1039Australia2026-06-11
1040United Kingdom2026-06-11
1041Canada2026-06-10
1042Argentina2026-06-03
1043Brazil2026-05-22
1044United Kingdom2026-05-26
1045Spain2026-06-13
1046Argentina2026-05-23
1047Argentina2026-05-24
1048Brazil2026-06-11
1049Russia2026-05-22

On-Demand Data

NameIdCountryDate
David Darakjy1000Australia2026-05-27
Silvio Slusarski1001France2026-06-06
Nicolas Iturbide1002Argentina2026-05-25
Aruna Figeroa1003Australia2026-05-16
Silvio Slusarski1004Brazil2026-05-30
Mayumi Kolmetz1005Russia2026-06-07
Chavez Briddick1006Germany2026-06-01
Aika Inouye1007Australia2026-05-29
Rodrigues Campain1008United Kingdom2026-05-20
Rodrigues Campain1009France2026-06-07
Izzy Garufi1010Italy2026-05-20
Kadeem Flosi1011France2026-06-11
Claire Tollner1012Argentina2026-05-30
Ivar Paprocki1013United Kingdom2026-05-24
Kadeem Flosi1014Italy2026-05-29
Murillo Malet1015Canada2026-05-31
Misaki Royster1016Japan2026-06-09
Darci Poquette1017Spain2026-06-08
Chavez Briddick1018France2026-05-16
Antonio Caudy1019Italy2026-06-08
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Mujtaba NickaJapanAnna Fali PROPOSAL
Clifford RimAustraliaAmy Elsner QUALIFIED
Chavez BriddickSpainIvan Magalhaes QUALIFIED
Faith GillianIndiaIvan Magalhaes NEGOTIATION
Mayumi KolmetzAustraliaXuxue Feng QUALIFIED
Juan WieserIndiaOnyama Limba QUALIFIED
Alejandro PerinItalyStephen Shaw NEGOTIATION
Greenwood BologniaFranceAnna Fali NEGOTIATION
Stacey MacleadAustraliaAnna Fali UNQUALIFIED
Salvatore StockhamItalyBernardo Dominic NEGOTIATION
Faith GillianJapanXuxue Feng NEGOTIATION
Kadeem FlosiGermanyOnyama Limba PROPOSAL
Leon OldroydGermanyIvan Magalhaes QUALIFIED
Leja CaldareraBrazilStephen Shaw NEGOTIATION
Rodrigues CampainUnited KingdomElwin Sharvill RENEWAL
Izzy GarufiFranceAsiya Javayant UNQUALIFIED
Octavia MaletSpainXuxue Feng RENEWAL
David DarakjyFranceAnna Fali QUALIFIED
Antonio CaudyUnited KingdomXuxue Feng UNQUALIFIED
Mayumi KolmetzAustraliaBernardo Dominic NEGOTIATION
Clifford RimRussiaAsiya Javayant NEGOTIATION
Clifford RimJapanBernardo Dominic RENEWAL
Misaki RoysterRussiaOnyama Limba PROPOSAL
Julie StensethRussiaXuxue Feng NEGOTIATION
Maisha RulapaughBrazilBernardo Dominic NEGOTIATION
Juan WieserIndiaAsiya Javayant UNQUALIFIED
Juan WieserBrazilOnyama Limba QUALIFIED
Jones VocelkaUnited KingdomIvan Magalhaes QUALIFIED
Leja CaldareraIndiaOnyama Limba UNQUALIFIED
Ricardo GauchoAustraliaIoni Bowcher QUALIFIED
Izzy GarufiIndiaAnna Fali QUALIFIED
Costa DilliardUnited KingdomXuxue Feng PROPOSAL
Kadeem FlosiFranceBernardo Dominic NEW
Arvin AlbaresGermanyAnna Fali QUALIFIED
David DarakjyGermanyBernardo Dominic NEW
Murillo MaletRussiaAsiya Javayant QUALIFIED
Antonio CaudyRussiaAnna Fali PROPOSAL
Greenwood BologniaSpainElwin Sharvill NEW
Maria MarrierFranceOnyama Limba NEGOTIATION
Wickens NestleUnited KingdomOnyama Limba QUALIFIED

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