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
Emily WhobreyAustraliaAmy Elsner NEGOTIATION
Murillo MaletUnited KingdomStephen Shaw NEW
Kadeem FlosiIndiaOnyama Limba RENEWAL
Juan WieserJapanAsiya Javayant RENEWAL
Chavez BriddickItalyIvan Magalhaes QUALIFIED
Leja CaldareraAustraliaIvan Magalhaes QUALIFIED
Leon OldroydArgentinaOnyama Limba NEW
Izzy GarufiGermanyBernardo Dominic NEGOTIATION
Morrow RutaCanadaIvan Magalhaes PROPOSAL
Ricardo GauchoSpainOnyama Limba QUALIFIED
Izzy GarufiGermanyOnyama Limba NEGOTIATION
Kadeem FlosiSpainIoni Bowcher QUALIFIED
Silvio SlusarskiBrazilOnyama Limba PROPOSAL
Mayumi KolmetzGermanyXuxue Feng PROPOSAL
Kaitlin OstroskyGermanyBernardo Dominic QUALIFIED
Misaki RoysterSpainAmy Elsner RENEWAL
Izzy GarufiGermanyAmy Elsner UNQUALIFIED
Leon OldroydUnited KingdomStephen Shaw QUALIFIED
Tony FollerJapanBernardo Dominic PROPOSAL
Wickens NestleBrazilIvan Magalhaes NEGOTIATION
Nicolas IturbideJapanAmy Elsner NEGOTIATION
Isabel BowleyUnited KingdomAsiya Javayant PROPOSAL
Silvio SlusarskiCanadaAmy Elsner PROPOSAL
Ricardo GauchoUnited KingdomElwin Sharvill UNQUALIFIED
David DarakjySpainIvan Magalhaes RENEWAL
Costa DilliardRussiaStephen Shaw RENEWAL
David DarakjyJapanXuxue Feng NEW
Ivar PaprockiUnited KingdomXuxue Feng NEGOTIATION
Darci PoquetteFranceIoni Bowcher RENEWAL
Aika InouyeItalyAmy Elsner RENEWAL
Aika InouyeRussiaStephen Shaw NEW
Maisha RulapaughAustraliaElwin Sharvill RENEWAL
Arvin AlbaresItalyIoni Bowcher QUALIFIED
Kadeem FlosiUnited KingdomElwin Sharvill PROPOSAL
Darci PoquetteGermanyElwin Sharvill NEW
Octavia MaletItalyAsiya Javayant QUALIFIED
Francesco ShinkoSpainIvan Magalhaes RENEWAL
Julie StensethUnited KingdomAnna Fali NEGOTIATION
Morrow RutaBrazilAmy Elsner NEW
Silvio SlusarskiFranceOnyama Limba QUALIFIED
Stacey MacleadBrazilAnna Fali RENEWAL
Jones VocelkaCanadaBernardo Dominic NEGOTIATION
Ivar PaprockiFranceAmy Elsner PROPOSAL
Mayumi KolmetzIndiaIoni Bowcher QUALIFIED
Smith GlickAustraliaAmy Elsner RENEWAL
Wickens NestleArgentinaIoni Bowcher RENEWAL
Leon OldroydBrazilElwin Sharvill PROPOSAL
Ricardo GauchoIndiaXuxue Feng NEW
Alejandro PerinGermanyIvan Magalhaes NEGOTIATION
Salvatore StockhamIndiaIvan Magalhaes QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Arvin AlbaresFranceAsiya Javayant QUALIFIED
Munro FerenczRussiaAmy Elsner NEGOTIATION
Jeanfrancois VenereAustraliaIoni Bowcher NEGOTIATION
Jefferson SchemmerSpainAnna Fali NEGOTIATION
Jefferson SchemmerFranceAnna Fali UNQUALIFIED
Deepesh ChuiGermanyAnna Fali UNQUALIFIED
Chavez BriddickRussiaAsiya Javayant RENEWAL
Morrow RutaCanadaXuxue Feng QUALIFIED
Morrow RutaJapanStephen Shaw QUALIFIED
Jefferson SchemmerArgentinaIoni Bowcher NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Arvin AlbaresItaly2025-10-17Dorl, James J Esq QUALIFIED64Ioni Bowcher
1001Adams MorascaArgentina2025-10-17Rangoni Of Florence PROPOSAL61Ioni Bowcher
1002Jennifer AmigonSpain2025-10-10Printing Dimensions QUALIFIED31Asiya Javayant
1003Deepesh ChuiAustralia2025-10-14Chanay, Jeffrey A Esq NEGOTIATION13Bernardo Dominic
1004Jennifer AmigonGermany2025-10-20Printing Dimensions NEGOTIATION31Anna Fali
1005Leja CaldareraUnited Kingdom2025-10-15King, Christopher A Esq RENEWAL73Onyama Limba
1006Salvatore StockhamFrance2025-10-27Feltz Printing Service RENEWAL61Asiya Javayant
1007Maria MarrierFrance2025-10-31Morlong Associates RENEWAL77Elwin Sharvill
1008Clifford RimIndia2025-10-15Chapman, Ross E Esq QUALIFIED60Xuxue Feng
1009Juan WieserBrazil2025-10-21Truhlar And Truhlar Attys NEGOTIATION67Stephen Shaw
1010Kaitlin OstroskyCanada2025-11-03Chanay, Jeffrey A Esq QUALIFIED52Asiya Javayant
1011Isabel BowleyCanada2025-10-13Buckley Miller Wright RENEWAL8Anna Fali
1012Morrow RutaUnited Kingdom2025-10-29Dorl, James J Esq RENEWAL1Onyama Limba
1013Ashley DoeIndia2025-10-15Morlong Associates NEW7Amy Elsner
1014Nicolas IturbideGermany2025-10-15Chapman, Ross E Esq UNQUALIFIED63Ioni Bowcher
1015Octavia MaletCanada2025-10-12Feltz Printing Service QUALIFIED74Anna Fali
1016Maria MarrierSpain2025-10-22King, Christopher A Esq RENEWAL45Amy Elsner
1017Juan WieserSpain2025-10-29Printing Dimensions NEGOTIATION41Asiya Javayant
1018Adams MorascaItaly2025-10-27Rousseaux, Michael Esq NEW86Bernardo Dominic
1019Maisha RulapaughItaly2025-10-21Commercial Press NEGOTIATION25Elwin Sharvill
1020Clifford RimIndia2025-10-22Dorl, James J Esq PROPOSAL27Amy Elsner
1021Maria MarrierGermany2025-10-05Benton, John B Jr NEW48Stephen Shaw
1022Clifford RimGermany2025-10-09Morlong Associates RENEWAL86Asiya Javayant
1023Juan WieserUnited Kingdom2025-10-12Commercial Press NEGOTIATION13Xuxue Feng
1024Mujtaba NickaRussia2025-10-25Printing Dimensions PROPOSAL87Elwin Sharvill
1025Kaitlin OstroskyIndia2025-10-08Commercial Press QUALIFIED43Bernardo Dominic
1026Silvio SlusarskiItaly2025-10-18Chanay, Jeffrey A Esq NEW98Anna Fali
1027Arvin AlbaresJapan2025-10-23Chanay, Jeffrey A Esq PROPOSAL52Stephen Shaw
1028Munro FerenczFrance2025-10-06Chemel, James L Cpa NEGOTIATION43Xuxue Feng
1029Mayumi KolmetzIndia2025-10-28King, Christopher A Esq PROPOSAL84Amy Elsner
1030Clifford RimRussia2025-10-05Rangoni Of Florence UNQUALIFIED44Xuxue Feng
1031David DarakjyItaly2025-10-21Chapman, Ross E Esq PROPOSAL71Ioni Bowcher
1032Julie StensethCanada2025-10-19Benton, John B Jr PROPOSAL74Stephen Shaw
1033Smith GlickJapan2025-10-29Benton, John B Jr NEGOTIATION31Onyama Limba
1034Morrow RutaBrazil2025-10-24Rousseaux, Michael Esq UNQUALIFIED89Elwin Sharvill
1035Tony FollerSpain2025-10-21Rousseaux, Michael Esq NEW94Elwin Sharvill
1036Chavez BriddickUnited Kingdom2025-10-12Truhlar And Truhlar Attys PROPOSAL5Asiya Javayant
1037James ButtBrazil2025-10-05Chemel, James L Cpa PROPOSAL60Amy Elsner
1038Johnson SergiIndia2025-10-29Rousseaux, Michael Esq RENEWAL45Onyama Limba
1039Francesco ShinkoFrance2025-10-06Feltz Printing Service NEGOTIATION92Elwin Sharvill
1040Jones VocelkaItaly2025-11-02Feltz Printing Service QUALIFIED29Bernardo Dominic
1041Darci PoquetteBrazil2025-10-23Truhlar And Truhlar Attys NEGOTIATION20Asiya Javayant
1042Deepesh ChuiItaly2025-11-01Feiner Bros PROPOSAL14Anna Fali
1043Nicolas IturbideJapan2025-10-23King, Christopher A Esq NEGOTIATION27Ioni Bowcher
1044Ricardo GauchoGermany2025-10-20Chemel, James L Cpa NEW9Xuxue Feng
1045Nicolas IturbideAustralia2025-10-30Truhlar And Truhlar Attys PROPOSAL13Stephen Shaw
1046Clifford RimAustralia2025-10-06Chanay, Jeffrey A Esq NEGOTIATION70Ivan Magalhaes
1047Stacey MacleadAustralia2025-10-27Benton, John B Jr RENEWAL87Asiya Javayant
1048Jones VocelkaFrance2025-10-26King, Christopher A Esq RENEWAL72Elwin Sharvill
1049Morrow RutaRussia2025-10-13Dorl, James J Esq UNQUALIFIED20Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Adams MorascaIndiaAsiya Javayant UNQUALIFIED
Jefferson SchemmerItalyAnna Fali UNQUALIFIED
Mujtaba NickaJapanAsiya Javayant UNQUALIFIED
Izzy GarufiArgentinaIoni Bowcher NEW
Sinclair WaycottUnited KingdomBernardo Dominic UNQUALIFIED
Jennifer AmigonCanadaIvan Magalhaes NEGOTIATION
Jones VocelkaItalyAsiya Javayant PROPOSAL
Misaki RoysterBrazilIvan Magalhaes QUALIFIED
Cody SaylorsCanadaAmy Elsner RENEWAL
Darci PoquetteRussiaOnyama Limba PROPOSAL
Aditya KuskoJapanIvan Magalhaes RENEWAL
David DarakjyIndiaXuxue Feng NEGOTIATION
Aruna FigeroaBrazilOnyama Limba PROPOSAL
Aruna FigeroaUnited KingdomAmy Elsner NEGOTIATION
Darci PoquetteRussiaIvan Magalhaes QUALIFIED
Aika InouyeFranceIvan Magalhaes UNQUALIFIED
Julie StensethCanadaAmy Elsner PROPOSAL
Claire TollnerItalyAmy Elsner RENEWAL
Ivar PaprockiSpainXuxue Feng PROPOSAL
Morrow RutaJapanXuxue Feng NEGOTIATION
Leja CaldareraSpainAnna Fali UNQUALIFIED
Isabel BowleyUnited KingdomBernardo Dominic NEGOTIATION
Emily WhobreyBrazilOnyama Limba RENEWAL
Ricardo GauchoGermanyXuxue Feng PROPOSAL
Wickens NestleFranceAmy Elsner NEW
Costa DilliardAustraliaBernardo Dominic QUALIFIED
Silvio SlusarskiArgentinaAmy Elsner NEW
Kaitlin OstroskyFranceXuxue Feng PROPOSAL
Ashley DoeIndiaAsiya Javayant RENEWAL
Clifford RimAustraliaAmy Elsner NEGOTIATION
Leon OldroydRussiaIvan Magalhaes UNQUALIFIED
Kaitlin OstroskyGermanyAmy Elsner QUALIFIED
Leon OldroydUnited KingdomBernardo Dominic NEGOTIATION
Maisha RulapaughUnited KingdomAsiya Javayant PROPOSAL
Darci PoquetteItalyAsiya Javayant RENEWAL
Wickens NestleGermanyAmy Elsner NEW
Smith GlickFranceAsiya Javayant QUALIFIED
Juan WieserUnited KingdomAsiya Javayant PROPOSAL
Faith GillianGermanyAnna Fali RENEWAL
Jennifer AmigonSpainBernardo Dominic QUALIFIED
Clifford RimSpainAsiya Javayant PROPOSAL
Leja CaldareraUnited KingdomIoni Bowcher RENEWAL
James ButtSpainIoni Bowcher QUALIFIED
Leon OldroydBrazilIoni Bowcher UNQUALIFIED
Adams MorascaBrazilStephen Shaw PROPOSAL
Stacey MacleadItalyStephen Shaw QUALIFIED
Izzy GarufiJapanIvan Magalhaes NEW
Johnson SergiArgentinaIvan Magalhaes NEW
Kaitlin OstroskyCanadaAnna Fali NEW
Tony FollerCanadaElwin Sharvill NEGOTIATION
Frozen Columns
Name
Deepesh Chui
Octavia Malet
Stacey Maclead
Nicolas Iturbide
Cody Saylors
Misaki Royster
Stacey Maclead
Silvio Slusarski
Octavia Malet
Stacey Maclead
Clifford Rim
Munro Ferencz
Misaki Royster
Octavia Malet
Antonio Caudy
Adams Morasca
Julie Stenseth
Isabel Bowley
Cody Saylors
David Darakjy
Jones Vocelka
Claire Tollner
Francesco Shinko
Clifford Rim
Misaki Royster
Faith Gillian
Salvatore Stockham
Mujtaba Nicka
Antonio Caudy
Misaki Royster
Francesco Shinko
Smith Glick
Cody Saylors
Maria Marrier
David Darakjy
Leja Caldarera
Johnson Sergi
Rodrigues Campain
Leja Caldarera
Juan Wieser
Darci Poquette
Jeanfrancois Venere
Juan Wieser
Kaitlin Ostrosky
Johnson Sergi
Juan Wieser
Jeanfrancois Venere
Emily Whobrey
Rodrigues Campain
Costa Dilliard
IdCountryDate
1000Brazil2025-10-12
1001Brazil2025-10-12
1002Russia2025-10-30
1003India2025-10-11
1004Argentina2025-10-25
1005Brazil2025-10-09
1006Germany2025-10-26
1007Australia2025-11-03
1008Japan2025-10-19
1009Italy2025-10-25
1010India2025-11-03
1011Australia2025-10-11
1012Russia2025-10-30
1013Germany2025-11-03
1014France2025-10-26
1015Canada2025-11-01
1016India2025-10-05
1017Italy2025-11-01
1018Germany2025-10-16
1019Argentina2025-10-08
1020Canada2025-10-22
1021Canada2025-10-12
1022Italy2025-10-21
1023India2025-11-03
1024Russia2025-11-01
1025Russia2025-10-11
1026Germany2025-10-30
1027Germany2025-10-26
1028Germany2025-10-29
1029United Kingdom2025-11-01
1030Argentina2025-10-28
1031France2025-10-22
1032Canada2025-10-18
1033Brazil2025-10-10
1034Brazil2025-10-18
1035France2025-10-29
1036United Kingdom2025-10-30
1037India2025-10-27
1038Germany2025-10-20
1039Russia2025-10-12
1040Russia2025-10-25
1041Australia2025-10-15
1042Germany2025-10-28
1043Germany2025-10-18
1044Spain2025-10-21
1045Japan2025-10-22
1046India2025-10-16
1047France2025-10-27
1048India2025-10-11
1049Italy2025-10-06

On-Demand Data

NameIdCountryDate
Greenwood Bolognia1000Spain2025-10-05
Izzy Garufi1001Argentina2025-10-24
Mayumi Kolmetz1002Japan2025-11-02
Costa Dilliard1003Brazil2025-10-05
Octavia Malet1004Brazil2025-10-15
Tony Foller1005Brazil2025-10-15
Adams Morasca1006Canada2025-10-11
Ricardo Gaucho1007Australia2025-10-06
Antonio Caudy1008Canada2025-10-26
Isabel Bowley1009Canada2025-10-27
Francesco Shinko1010Argentina2025-10-14
Antonio Caudy1011Italy2025-10-11
Rodrigues Campain1012Australia2025-10-13
Claire Tollner1013Brazil2025-10-30
Rodrigues Campain1014Canada2025-10-31
Morrow Ruta1015Russia2025-10-20
Ashley Doe1016Italy2025-10-22
Kaitlin Ostrosky1017Italy2025-10-06
Adams Morasca1018India2025-10-17
Rodrigues Campain1019Russia2025-10-21
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aika InouyeItalyIoni Bowcher PROPOSAL
Darci PoquetteSpainOnyama Limba RENEWAL
Leon OldroydRussiaIvan Magalhaes NEGOTIATION
Sinclair WaycottAustraliaAsiya Javayant UNQUALIFIED
Smith GlickArgentinaStephen Shaw NEW
Julie StensethAustraliaStephen Shaw UNQUALIFIED
Nicolas IturbideGermanyElwin Sharvill NEW
Cody SaylorsSpainIvan Magalhaes PROPOSAL
Emily WhobreyIndiaBernardo Dominic QUALIFIED
Isabel BowleyUnited KingdomBernardo Dominic QUALIFIED
Smith GlickUnited KingdomIvan Magalhaes NEW
Leja CaldareraUnited KingdomIoni Bowcher NEW
Kaitlin OstroskyCanadaIvan Magalhaes QUALIFIED
Silvio SlusarskiIndiaOnyama Limba UNQUALIFIED
Morrow RutaItalyXuxue Feng QUALIFIED
Silvio SlusarskiArgentinaAnna Fali NEW
Faith GillianJapanIvan Magalhaes PROPOSAL
Izzy GarufiJapanAsiya Javayant NEGOTIATION
Jeanfrancois VenereGermanyXuxue Feng NEW
Stacey MacleadIndiaStephen Shaw QUALIFIED
Isabel BowleyIndiaIoni Bowcher NEGOTIATION
Maisha RulapaughSpainAmy Elsner PROPOSAL
Smith GlickSpainAnna Fali NEGOTIATION
Ivar PaprockiItalyBernardo Dominic RENEWAL
Jefferson SchemmerGermanyIvan Magalhaes NEW
Aruna FigeroaJapanXuxue Feng PROPOSAL
Johnson SergiUnited KingdomStephen Shaw RENEWAL
Maria MarrierItalyOnyama Limba UNQUALIFIED
Adams MorascaArgentinaOnyama Limba NEGOTIATION
Sinclair WaycottIndiaBernardo Dominic UNQUALIFIED
Maria MarrierItalyBernardo Dominic PROPOSAL
Maisha RulapaughBrazilAmy Elsner UNQUALIFIED
Chavez BriddickFranceIvan Magalhaes PROPOSAL
Jennifer AmigonCanadaBernardo Dominic NEW
Smith GlickSpainElwin Sharvill RENEWAL
Aruna FigeroaSpainIvan Magalhaes NEGOTIATION
Ricardo GauchoJapanOnyama Limba QUALIFIED
Stacey MacleadArgentinaOnyama Limba UNQUALIFIED
Aruna FigeroaFranceBernardo Dominic UNQUALIFIED
Munro FerenczUnited KingdomBernardo Dominic 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>