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
Maria MarrierUnited KingdomXuxue Feng QUALIFIED
Jennifer AmigonArgentinaAsiya Javayant PROPOSAL
Munro FerenczSpainElwin Sharvill NEW
Juan WieserBrazilBernardo Dominic UNQUALIFIED
Jeanfrancois VenereJapanElwin Sharvill UNQUALIFIED
Ashley DoeIndiaAmy Elsner RENEWAL
Nicolas IturbideGermanyXuxue Feng RENEWAL
Aruna FigeroaRussiaAmy Elsner UNQUALIFIED
Smith GlickArgentinaIvan Magalhaes NEGOTIATION
James ButtRussiaStephen Shaw NEGOTIATION
Tony FollerGermanyOnyama Limba NEGOTIATION
Nicolas IturbideArgentinaIvan Magalhaes NEW
Kaitlin OstroskyJapanIvan Magalhaes QUALIFIED
Jeanfrancois VenereGermanyAnna Fali PROPOSAL
Izzy GarufiGermanyIoni Bowcher NEGOTIATION
Leon OldroydCanadaOnyama Limba NEGOTIATION
Rodrigues CampainFranceAmy Elsner NEGOTIATION
Aika InouyeGermanyBernardo Dominic RENEWAL
Faith GillianBrazilAnna Fali RENEWAL
Kadeem FlosiCanadaXuxue Feng NEW
Munro FerenczJapanXuxue Feng PROPOSAL
Wickens NestleRussiaElwin Sharvill NEGOTIATION
Ivar PaprockiFranceAnna Fali NEW
Julie StensethIndiaIvan Magalhaes PROPOSAL
Faith GillianUnited KingdomElwin Sharvill QUALIFIED
Jennifer AmigonGermanyXuxue Feng NEW
Isabel BowleySpainAmy Elsner RENEWAL
James ButtArgentinaIoni Bowcher NEGOTIATION
Juan WieserBrazilElwin Sharvill QUALIFIED
Leja CaldareraSpainElwin Sharvill NEW
Jones VocelkaAustraliaAnna Fali UNQUALIFIED
Murillo MaletSpainIoni Bowcher UNQUALIFIED
Faith GillianAustraliaStephen Shaw QUALIFIED
Mujtaba NickaItalyAsiya Javayant PROPOSAL
Munro FerenczJapanOnyama Limba UNQUALIFIED
Claire TollnerItalyElwin Sharvill QUALIFIED
Stacey MacleadIndiaAmy Elsner QUALIFIED
Costa DilliardFranceElwin Sharvill QUALIFIED
Emily WhobreyIndiaOnyama Limba QUALIFIED
Juan WieserUnited KingdomAmy Elsner QUALIFIED
Cody SaylorsJapanElwin Sharvill NEGOTIATION
Salvatore StockhamUnited KingdomStephen Shaw PROPOSAL
Ricardo GauchoBrazilAmy Elsner NEGOTIATION
Maisha RulapaughArgentinaBernardo Dominic NEW
Isabel BowleyGermanyStephen Shaw PROPOSAL
Munro FerenczIndiaAmy Elsner NEGOTIATION
Alejandro PerinArgentinaStephen Shaw PROPOSAL
Nicolas IturbideCanadaElwin Sharvill QUALIFIED
Tony FollerBrazilStephen Shaw PROPOSAL
Aruna FigeroaFranceOnyama Limba QUALIFIED
Horizontal
NameCountryRepresentativeStatus
James ButtCanadaAmy Elsner NEW
Johnson SergiItalyAnna Fali NEW
Misaki RoysterAustraliaStephen Shaw NEW
Juan WieserRussiaBernardo Dominic UNQUALIFIED
Aruna FigeroaBrazilElwin Sharvill UNQUALIFIED
Kaitlin OstroskyJapanStephen Shaw PROPOSAL
Claire TollnerGermanyAmy Elsner QUALIFIED
Ricardo GauchoFranceStephen Shaw UNQUALIFIED
Deepesh ChuiAustraliaBernardo Dominic NEGOTIATION
Aditya KuskoRussiaIvan Magalhaes PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Chavez BriddickAustralia2025-08-02Chapman, Ross E Esq UNQUALIFIED6Onyama Limba
1001Claire TollnerRussia2025-07-18Feltz Printing Service UNQUALIFIED46Elwin Sharvill
1002Maria MarrierRussia2025-07-15Feltz Printing Service PROPOSAL32Elwin Sharvill
1003Misaki RoysterGermany2025-07-14Commercial Press NEW61Asiya Javayant
1004Costa DilliardAustralia2025-07-11Morlong Associates QUALIFIED7Ioni Bowcher
1005Smith GlickSpain2025-07-17Chapman, Ross E Esq NEW17Asiya Javayant
1006Ashley DoeJapan2025-07-21Buckley Miller Wright QUALIFIED95Ioni Bowcher
1007Clifford RimUnited Kingdom2025-07-20Printing Dimensions UNQUALIFIED1Ioni Bowcher
1008Nicolas IturbideSpain2025-07-08Feltz Printing Service QUALIFIED24Ioni Bowcher
1009Nicolas IturbideJapan2025-07-31Buckley Miller Wright NEGOTIATION92Bernardo Dominic
1010Nicolas IturbideRussia2025-07-30Commercial Press NEGOTIATION9Stephen Shaw
1011Deepesh ChuiIndia2025-07-18Rousseaux, Michael Esq RENEWAL84Ivan Magalhaes
1012Maria MarrierBrazil2025-07-13King, Christopher A Esq NEW85Stephen Shaw
1013Rodrigues CampainItaly2025-07-31Chanay, Jeffrey A Esq UNQUALIFIED92Asiya Javayant
1014Aika InouyeBrazil2025-07-31Truhlar And Truhlar Attys QUALIFIED60Xuxue Feng
1015Julie StensethCanada2025-07-15Printing Dimensions NEW26Bernardo Dominic
1016Adams MorascaSpain2025-07-22Printing Dimensions NEW28Elwin Sharvill
1017Juan WieserUnited Kingdom2025-07-30Chanay, Jeffrey A Esq NEGOTIATION40Xuxue Feng
1018Alejandro PerinBrazil2025-07-11Rangoni Of Florence RENEWAL90Amy Elsner
1019Maisha RulapaughFrance2025-07-22Chanay, Jeffrey A Esq QUALIFIED62Asiya Javayant
1020Munro FerenczGermany2025-07-09Feiner Bros RENEWAL75Amy Elsner
1021Alejandro PerinBrazil2025-08-03Commercial Press PROPOSAL10Anna Fali
1022Alejandro PerinRussia2025-07-09Chemel, James L Cpa RENEWAL62Asiya Javayant
1023Julie StensethSpain2025-07-16Printing Dimensions UNQUALIFIED67Ioni Bowcher
1024Kaitlin OstroskyItaly2025-07-16Benton, John B Jr QUALIFIED85Asiya Javayant
1025Rodrigues CampainJapan2025-07-25Commercial Press UNQUALIFIED97Ivan Magalhaes
1026Morrow RutaAustralia2025-08-01Buckley Miller Wright PROPOSAL69Asiya Javayant
1027Stacey MacleadItaly2025-07-25Feltz Printing Service NEGOTIATION71Onyama Limba
1028Arvin AlbaresAustralia2025-07-28Rangoni Of Florence NEW42Bernardo Dominic
1029Julie StensethIndia2025-07-09Commercial Press NEGOTIATION43Bernardo Dominic
1030Arvin AlbaresItaly2025-07-29Rangoni Of Florence UNQUALIFIED59Bernardo Dominic
1031Nicolas IturbideItaly2025-07-23Feiner Bros PROPOSAL71Ivan Magalhaes
1032Isabel BowleyUnited Kingdom2025-07-13Truhlar And Truhlar Attys NEGOTIATION11Onyama Limba
1033Leja CaldareraCanada2025-08-04Feltz Printing Service NEGOTIATION59Anna Fali
1034Izzy GarufiSpain2025-07-13Benton, John B Jr NEGOTIATION96Anna Fali
1035Antonio CaudyRussia2025-07-24Commercial Press UNQUALIFIED48Bernardo Dominic
1036Claire TollnerBrazil2025-07-16Commercial Press QUALIFIED44Asiya Javayant
1037Ricardo GauchoFrance2025-07-30King, Christopher A Esq QUALIFIED13Bernardo Dominic
1038Jennifer AmigonIndia2025-07-28Feiner Bros UNQUALIFIED69Ioni Bowcher
1039Costa DilliardGermany2025-07-07Dorl, James J Esq RENEWAL43Anna Fali
1040Leon OldroydSpain2025-07-10Chemel, James L Cpa NEGOTIATION35Onyama Limba
1041Munro FerenczBrazil2025-07-23King, Christopher A Esq RENEWAL48Amy Elsner
1042Izzy GarufiCanada2025-08-04Chemel, James L Cpa QUALIFIED74Anna Fali
1043Aruna FigeroaSpain2025-07-12King, Christopher A Esq RENEWAL91Bernardo Dominic
1044Mujtaba NickaArgentina2025-07-12Printing Dimensions QUALIFIED0Amy Elsner
1045Antonio CaudyRussia2025-07-19Benton, John B Jr RENEWAL68Anna Fali
1046Antonio CaudyUnited Kingdom2025-07-25Feiner Bros PROPOSAL60Stephen Shaw
1047Chavez BriddickFrance2025-07-24Chanay, Jeffrey A Esq UNQUALIFIED65Bernardo Dominic
1048Morrow RutaItaly2025-07-08Chanay, Jeffrey A Esq UNQUALIFIED23Xuxue Feng
1049Costa DilliardCanada2025-07-22Morlong Associates QUALIFIED78Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Claire TollnerRussiaXuxue Feng UNQUALIFIED
Misaki RoysterSpainAsiya Javayant NEW
Aditya KuskoAustraliaAmy Elsner QUALIFIED
Mujtaba NickaRussiaOnyama Limba UNQUALIFIED
Mujtaba NickaBrazilAnna Fali NEW
Arvin AlbaresIndiaXuxue Feng RENEWAL
Aruna FigeroaJapanXuxue Feng UNQUALIFIED
Ivar PaprockiArgentinaIoni Bowcher NEW
Jefferson SchemmerFranceElwin Sharvill QUALIFIED
Salvatore StockhamBrazilBernardo Dominic RENEWAL
Salvatore StockhamBrazilXuxue Feng PROPOSAL
Cody SaylorsFranceElwin Sharvill QUALIFIED
Stacey MacleadCanadaAnna Fali NEGOTIATION
Johnson SergiArgentinaBernardo Dominic UNQUALIFIED
Nicolas IturbideJapanAsiya Javayant QUALIFIED
Izzy GarufiFranceAmy Elsner NEGOTIATION
Stacey MacleadSpainXuxue Feng UNQUALIFIED
Morrow RutaCanadaXuxue Feng PROPOSAL
Ivar PaprockiItalyBernardo Dominic NEW
Deepesh ChuiArgentinaXuxue Feng NEGOTIATION
Ivar PaprockiUnited KingdomAsiya Javayant NEW
Chavez BriddickAustraliaBernardo Dominic RENEWAL
David DarakjyIndiaIvan Magalhaes NEW
Salvatore StockhamItalyAsiya Javayant NEGOTIATION
Tony FollerCanadaAnna Fali PROPOSAL
Faith GillianCanadaIvan Magalhaes QUALIFIED
Salvatore StockhamArgentinaBernardo Dominic NEGOTIATION
Ricardo GauchoUnited KingdomIoni Bowcher NEGOTIATION
Munro FerenczGermanyAnna Fali QUALIFIED
Nicolas IturbideGermanyAnna Fali QUALIFIED
Morrow RutaIndiaBernardo Dominic NEGOTIATION
Smith GlickIndiaAnna Fali UNQUALIFIED
Julie StensethItalyAsiya Javayant NEGOTIATION
Costa DilliardBrazilIoni Bowcher QUALIFIED
Mujtaba NickaItalyStephen Shaw UNQUALIFIED
Ricardo GauchoGermanyIvan Magalhaes PROPOSAL
Darci PoquetteBrazilBernardo Dominic QUALIFIED
Sinclair WaycottUnited KingdomAmy Elsner UNQUALIFIED
Murillo MaletAustraliaStephen Shaw QUALIFIED
David DarakjyArgentinaAsiya Javayant PROPOSAL
Ivar PaprockiGermanyIvan Magalhaes UNQUALIFIED
Jones VocelkaBrazilBernardo Dominic NEW
Adams MorascaBrazilIoni Bowcher RENEWAL
Aruna FigeroaAustraliaXuxue Feng UNQUALIFIED
Deepesh ChuiSpainIoni Bowcher UNQUALIFIED
Jeanfrancois VenereBrazilIoni Bowcher NEW
Aruna FigeroaBrazilBernardo Dominic UNQUALIFIED
Tony FollerJapanIvan Magalhaes QUALIFIED
Costa DilliardGermanyAsiya Javayant PROPOSAL
Deepesh ChuiFranceAnna Fali NEW
Frozen Columns
Name
Alejandro Perin
Julie Stenseth
Wickens Nestle
Octavia Malet
Cody Saylors
Murillo Malet
Adams Morasca
Clifford Rim
Aika Inouye
Clifford Rim
Rodrigues Campain
Arvin Albares
Aika Inouye
Darci Poquette
Jennifer Amigon
Jefferson Schemmer
David Darakjy
Tony Foller
Darci Poquette
Adams Morasca
Octavia Malet
Costa Dilliard
Jefferson Schemmer
Jefferson Schemmer
Kaitlin Ostrosky
Mujtaba Nicka
Francesco Shinko
Francesco Shinko
Arvin Albares
Deepesh Chui
Aruna Figeroa
Isabel Bowley
Sinclair Waycott
Arvin Albares
Izzy Garufi
Adams Morasca
Sinclair Waycott
Francesco Shinko
Leon Oldroyd
Morrow Ruta
Antonio Caudy
Octavia Malet
Morrow Ruta
Julie Stenseth
Maria Marrier
Ashley Doe
Morrow Ruta
Leon Oldroyd
Isabel Bowley
Greenwood Bolognia
IdCountryDate
1000Brazil2025-07-30
1001Canada2025-07-09
1002Russia2025-07-08
1003Australia2025-07-16
1004Australia2025-07-30
1005Brazil2025-08-02
1006Germany2025-07-16
1007United Kingdom2025-07-09
1008Argentina2025-07-08
1009Australia2025-07-07
1010India2025-07-22
1011Argentina2025-07-14
1012Japan2025-07-09
1013Russia2025-07-14
1014Australia2025-07-28
1015Spain2025-07-27
1016Japan2025-07-09
1017Italy2025-08-04
1018Germany2025-07-19
1019Brazil2025-07-15
1020India2025-07-07
1021United Kingdom2025-07-23
1022Italy2025-08-02
1023United Kingdom2025-07-11
1024Spain2025-07-17
1025Brazil2025-07-09
1026Japan2025-07-21
1027India2025-07-22
1028Canada2025-07-30
1029Russia2025-08-03
1030Japan2025-07-11
1031Australia2025-07-14
1032Brazil2025-07-27
1033Japan2025-08-04
1034France2025-07-09
1035Russia2025-07-19
1036India2025-07-29
1037United Kingdom2025-07-21
1038Italy2025-07-22
1039France2025-08-04
1040Spain2025-07-29
1041India2025-07-19
1042India2025-07-31
1043India2025-07-17
1044Canada2025-08-01
1045Australia2025-07-19
1046Argentina2025-07-14
1047Germany2025-07-22
1048Australia2025-07-14
1049Brazil2025-07-15

On-Demand Data

NameIdCountryDate
Murillo Malet1000Australia2025-07-20
Misaki Royster1001Argentina2025-08-04
Maisha Rulapaugh1002Canada2025-08-03
Darci Poquette1003France2025-07-12
Morrow Ruta1004France2025-07-12
Juan Wieser1005Australia2025-07-06
Costa Dilliard1006Germany2025-07-17
Munro Ferencz1007France2025-07-27
Alejandro Perin1008Germany2025-07-08
Mujtaba Nicka1009Spain2025-07-08
Rodrigues Campain1010Japan2025-08-03
Ricardo Gaucho1011Japan2025-07-15
Smith Glick1012United Kingdom2025-07-07
Isabel Bowley1013Australia2025-07-12
Leon Oldroyd1014Spain2025-07-24
Isabel Bowley1015Canada2025-07-23
Sinclair Waycott1016Italy2025-07-06
Jeanfrancois Venere1017Japan2025-07-15
Chavez Briddick1018Russia2025-07-24
Ivar Paprocki1019France2025-07-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Antonio CaudySpainOnyama Limba PROPOSAL
Kaitlin OstroskyAustraliaXuxue Feng UNQUALIFIED
Leon OldroydJapanOnyama Limba UNQUALIFIED
Nicolas IturbideArgentinaIoni Bowcher UNQUALIFIED
Arvin AlbaresRussiaElwin Sharvill PROPOSAL
Maria MarrierFranceIoni Bowcher NEW
Jeanfrancois VenereArgentinaElwin Sharvill NEGOTIATION
Mujtaba NickaCanadaXuxue Feng QUALIFIED
Smith GlickCanadaStephen Shaw NEGOTIATION
Mayumi KolmetzIndiaStephen Shaw NEW
Chavez BriddickFranceIvan Magalhaes UNQUALIFIED
Jeanfrancois VenereJapanBernardo Dominic NEW
Deepesh ChuiGermanyBernardo Dominic PROPOSAL
Jennifer AmigonUnited KingdomIvan Magalhaes NEGOTIATION
Isabel BowleyJapanAnna Fali UNQUALIFIED
Leja CaldareraCanadaIvan Magalhaes UNQUALIFIED
Munro FerenczArgentinaIoni Bowcher RENEWAL
Darci PoquetteCanadaAmy Elsner UNQUALIFIED
Ricardo GauchoBrazilAsiya Javayant NEW
Octavia MaletUnited KingdomStephen Shaw QUALIFIED
Nicolas IturbideGermanyOnyama Limba QUALIFIED
Maria MarrierArgentinaIvan Magalhaes NEW
Antonio CaudyCanadaAnna Fali RENEWAL
Deepesh ChuiAustraliaXuxue Feng QUALIFIED
Adams MorascaBrazilAmy Elsner UNQUALIFIED
Julie StensethAustraliaStephen Shaw UNQUALIFIED
Costa DilliardAustraliaStephen Shaw RENEWAL
Rodrigues CampainFranceBernardo Dominic UNQUALIFIED
Darci PoquetteFranceXuxue Feng UNQUALIFIED
Izzy GarufiUnited KingdomOnyama Limba PROPOSAL
Arvin AlbaresUnited KingdomStephen Shaw PROPOSAL
Stacey MacleadRussiaXuxue Feng UNQUALIFIED
David DarakjyCanadaBernardo Dominic PROPOSAL
Nicolas IturbideAustraliaAnna Fali RENEWAL
Smith GlickSpainAsiya Javayant QUALIFIED
Silvio SlusarskiGermanyElwin Sharvill NEGOTIATION
Emily WhobreyItalyIvan Magalhaes NEW
Mayumi KolmetzIndiaElwin Sharvill NEGOTIATION
Antonio CaudyRussiaIoni Bowcher RENEWAL
Aika InouyeJapanIoni Bowcher NEGOTIATION

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