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
Wickens NestleRussiaAmy Elsner NEGOTIATION
Deepesh ChuiSpainIoni Bowcher UNQUALIFIED
Misaki RoysterRussiaElwin Sharvill NEW
Aditya KuskoCanadaXuxue Feng PROPOSAL
Kaitlin OstroskyArgentinaAnna Fali RENEWAL
Kaitlin OstroskyJapanOnyama Limba PROPOSAL
Izzy GarufiBrazilXuxue Feng NEW
Darci PoquetteUnited KingdomXuxue Feng UNQUALIFIED
Juan WieserSpainAmy Elsner RENEWAL
Ricardo GauchoBrazilAmy Elsner PROPOSAL
Aruna FigeroaItalyAnna Fali NEGOTIATION
Jones VocelkaFranceXuxue Feng PROPOSAL
Darci PoquetteBrazilBernardo Dominic NEW
Silvio SlusarskiJapanAnna Fali QUALIFIED
Sinclair WaycottArgentinaAnna Fali RENEWAL
Leja CaldareraCanadaAnna Fali NEW
Darci PoquetteUnited KingdomOnyama Limba QUALIFIED
Adams MorascaItalyAnna Fali PROPOSAL
Arvin AlbaresSpainAnna Fali NEW
Kaitlin OstroskyAustraliaXuxue Feng NEW
Ricardo GauchoBrazilStephen Shaw QUALIFIED
Faith GillianAustraliaAnna Fali PROPOSAL
Ivar PaprockiAustraliaStephen Shaw QUALIFIED
Izzy GarufiArgentinaAsiya Javayant UNQUALIFIED
Munro FerenczArgentinaBernardo Dominic RENEWAL
Kadeem FlosiJapanBernardo Dominic UNQUALIFIED
Clifford RimArgentinaOnyama Limba PROPOSAL
Octavia MaletCanadaBernardo Dominic PROPOSAL
Greenwood BologniaFranceIvan Magalhaes RENEWAL
Adams MorascaUnited KingdomIvan Magalhaes PROPOSAL
Antonio CaudyIndiaXuxue Feng NEGOTIATION
Tony FollerIndiaAsiya Javayant NEW
Alejandro PerinRussiaIvan Magalhaes PROPOSAL
Clifford RimGermanyElwin Sharvill UNQUALIFIED
Nicolas IturbideGermanyAsiya Javayant NEGOTIATION
Mayumi KolmetzUnited KingdomElwin Sharvill UNQUALIFIED
Munro FerenczUnited KingdomAsiya Javayant UNQUALIFIED
Aika InouyeCanadaAsiya Javayant NEGOTIATION
Chavez BriddickJapanAsiya Javayant NEGOTIATION
Octavia MaletUnited KingdomIvan Magalhaes NEGOTIATION
Aruna FigeroaBrazilIvan Magalhaes QUALIFIED
Maria MarrierBrazilIoni Bowcher UNQUALIFIED
Aditya KuskoItalyAmy Elsner UNQUALIFIED
Alejandro PerinItalyStephen Shaw PROPOSAL
Ricardo GauchoBrazilStephen Shaw UNQUALIFIED
Ricardo GauchoBrazilAnna Fali NEW
Kadeem FlosiIndiaAmy Elsner RENEWAL
Darci PoquetteUnited KingdomBernardo Dominic NEGOTIATION
Greenwood BologniaJapanAmy Elsner NEGOTIATION
Maria MarrierItalyIoni Bowcher NEW
Horizontal
NameCountryRepresentativeStatus
Julie StensethFranceIvan Magalhaes NEGOTIATION
Leon OldroydFranceElwin Sharvill QUALIFIED
Aika InouyeRussiaXuxue Feng QUALIFIED
Emily WhobreyItalyStephen Shaw NEW
Kadeem FlosiUnited KingdomBernardo Dominic RENEWAL
Rodrigues CampainBrazilStephen Shaw QUALIFIED
Costa DilliardRussiaOnyama Limba NEW
Faith GillianUnited KingdomElwin Sharvill NEGOTIATION
Alejandro PerinArgentinaAmy Elsner RENEWAL
Mayumi KolmetzIndiaAnna Fali RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Rodrigues CampainSpain2025-09-13Feiner Bros RENEWAL72Anna Fali
1001James ButtCanada2025-09-20Morlong Associates PROPOSAL4Amy Elsner
1002Ashley DoeItaly2025-10-10Chemel, James L Cpa NEW50Amy Elsner
1003Costa DilliardUnited Kingdom2025-10-09King, Christopher A Esq UNQUALIFIED60Ivan Magalhaes
1004Wickens NestleCanada2025-09-12Commercial Press QUALIFIED77Amy Elsner
1005Smith GlickCanada2025-10-04Benton, John B Jr UNQUALIFIED9Ivan Magalhaes
1006Isabel BowleyArgentina2025-09-28Printing Dimensions QUALIFIED6Ivan Magalhaes
1007Mujtaba NickaFrance2025-09-19Chanay, Jeffrey A Esq RENEWAL39Ioni Bowcher
1008Murillo MaletRussia2025-09-22Buckley Miller Wright PROPOSAL15Onyama Limba
1009Salvatore StockhamAustralia2025-09-11Commercial Press QUALIFIED2Amy Elsner
1010Wickens NestleBrazil2025-09-29Printing Dimensions NEGOTIATION46Ivan Magalhaes
1011Kaitlin OstroskyIndia2025-09-30Rangoni Of Florence NEGOTIATION75Elwin Sharvill
1012Chavez BriddickFrance2025-09-25Chapman, Ross E Esq NEGOTIATION27Amy Elsner
1013Munro FerenczUnited Kingdom2025-09-22Chapman, Ross E Esq RENEWAL14Ioni Bowcher
1014Leon OldroydBrazil2025-09-20Buckley Miller Wright RENEWAL85Elwin Sharvill
1015Tony FollerItaly2025-10-05Chemel, James L Cpa NEGOTIATION30Ivan Magalhaes
1016Silvio SlusarskiAustralia2025-09-12Morlong Associates QUALIFIED69Anna Fali
1017Jones VocelkaBrazil2025-09-28Feiner Bros PROPOSAL17Onyama Limba
1018Darci PoquetteUnited Kingdom2025-10-03Chemel, James L Cpa PROPOSAL63Ivan Magalhaes
1019Ashley DoeRussia2025-09-26Rousseaux, Michael Esq NEW48Stephen Shaw
1020Morrow RutaArgentina2025-09-16Chanay, Jeffrey A Esq NEGOTIATION74Elwin Sharvill
1021Juan WieserCanada2025-09-23Chapman, Ross E Esq RENEWAL53Elwin Sharvill
1022Kaitlin OstroskyJapan2025-09-16Buckley Miller Wright QUALIFIED24Ivan Magalhaes
1023Misaki RoysterRussia2025-10-06Printing Dimensions PROPOSAL94Xuxue Feng
1024Wickens NestleArgentina2025-10-05Feltz Printing Service NEW25Asiya Javayant
1025Emily WhobreyBrazil2025-09-19Rangoni Of Florence QUALIFIED95Ivan Magalhaes
1026Isabel BowleyRussia2025-10-07Rousseaux, Michael Esq NEW95Bernardo Dominic
1027Mujtaba NickaFrance2025-10-01Commercial Press PROPOSAL78Amy Elsner
1028Jennifer AmigonBrazil2025-09-30King, Christopher A Esq RENEWAL87Onyama Limba
1029Misaki RoysterJapan2025-09-11Rousseaux, Michael Esq UNQUALIFIED81Elwin Sharvill
1030Julie StensethUnited Kingdom2025-09-15King, Christopher A Esq RENEWAL65Ivan Magalhaes
1031Munro FerenczArgentina2025-09-16Chemel, James L Cpa NEW24Anna Fali
1032Chavez BriddickArgentina2025-10-10Commercial Press RENEWAL57Elwin Sharvill
1033Claire TollnerCanada2025-09-24Chemel, James L Cpa PROPOSAL62Bernardo Dominic
1034Maisha RulapaughSpain2025-09-17Feiner Bros NEGOTIATION8Onyama Limba
1035Jennifer AmigonCanada2025-10-06Benton, John B Jr QUALIFIED22Xuxue Feng
1036Jeanfrancois VenereArgentina2025-10-10King, Christopher A Esq NEW6Ivan Magalhaes
1037Chavez BriddickSpain2025-10-09Rousseaux, Michael Esq UNQUALIFIED87Bernardo Dominic
1038Claire TollnerCanada2025-09-23King, Christopher A Esq RENEWAL24Elwin Sharvill
1039Emily WhobreyGermany2025-10-02Rousseaux, Michael Esq RENEWAL47Elwin Sharvill
1040Darci PoquetteBrazil2025-10-01Feltz Printing Service QUALIFIED64Amy Elsner
1041Clifford RimFrance2025-10-06Dorl, James J Esq NEW33Onyama Limba
1042Tony FollerArgentina2025-10-07Chapman, Ross E Esq QUALIFIED79Xuxue Feng
1043Murillo MaletItaly2025-09-26Chanay, Jeffrey A Esq NEGOTIATION48Asiya Javayant
1044Francesco ShinkoCanada2025-10-04Feiner Bros NEW54Ivan Magalhaes
1045Jones VocelkaIndia2025-09-29Benton, John B Jr QUALIFIED89Ioni Bowcher
1046Sinclair WaycottAustralia2025-10-04Chemel, James L Cpa QUALIFIED23Onyama Limba
1047Francesco ShinkoUnited Kingdom2025-10-10Feiner Bros QUALIFIED66Onyama Limba
1048Adams MorascaAustralia2025-09-17Truhlar And Truhlar Attys RENEWAL19Ioni Bowcher
1049Antonio CaudyFrance2025-09-17Feltz Printing Service RENEWAL99Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Jefferson SchemmerAustraliaIvan Magalhaes PROPOSAL
Leon OldroydItalyOnyama Limba PROPOSAL
Octavia MaletCanadaAsiya Javayant NEGOTIATION
Jones VocelkaArgentinaBernardo Dominic NEW
Mayumi KolmetzSpainBernardo Dominic NEGOTIATION
Emily WhobreyBrazilStephen Shaw RENEWAL
Adams MorascaCanadaIvan Magalhaes PROPOSAL
Alejandro PerinIndiaElwin Sharvill NEW
Jones VocelkaJapanElwin Sharvill UNQUALIFIED
Smith GlickBrazilAmy Elsner NEW
Leon OldroydRussiaAsiya Javayant PROPOSAL
Octavia MaletIndiaAmy Elsner NEW
Kaitlin OstroskyRussiaIvan Magalhaes RENEWAL
Kaitlin OstroskyAustraliaAsiya Javayant RENEWAL
Mayumi KolmetzJapanXuxue Feng RENEWAL
David DarakjyJapanIoni Bowcher PROPOSAL
Silvio SlusarskiSpainAsiya Javayant UNQUALIFIED
Costa DilliardItalyElwin Sharvill NEW
Clifford RimArgentinaStephen Shaw UNQUALIFIED
Chavez BriddickGermanyElwin Sharvill UNQUALIFIED
Cody SaylorsCanadaBernardo Dominic PROPOSAL
Aika InouyeCanadaBernardo Dominic PROPOSAL
Faith GillianGermanyElwin Sharvill PROPOSAL
Kadeem FlosiUnited KingdomOnyama Limba PROPOSAL
Kaitlin OstroskyArgentinaIoni Bowcher QUALIFIED
Aruna FigeroaGermanyIoni Bowcher NEW
Julie StensethRussiaAnna Fali NEGOTIATION
Jeanfrancois VenereAustraliaOnyama Limba UNQUALIFIED
Maria MarrierSpainAnna Fali RENEWAL
Salvatore StockhamSpainIoni Bowcher NEGOTIATION
Jennifer AmigonArgentinaAmy Elsner NEGOTIATION
Costa DilliardGermanyStephen Shaw RENEWAL
Arvin AlbaresIndiaAmy Elsner NEW
Izzy GarufiBrazilIvan Magalhaes NEW
Claire TollnerJapanStephen Shaw RENEWAL
Sinclair WaycottFranceXuxue Feng RENEWAL
David DarakjyCanadaStephen Shaw NEW
Julie StensethBrazilIoni Bowcher QUALIFIED
Adams MorascaGermanyAmy Elsner UNQUALIFIED
Emily WhobreyRussiaIvan Magalhaes PROPOSAL
Sinclair WaycottAustraliaAsiya Javayant UNQUALIFIED
Octavia MaletRussiaXuxue Feng NEW
Adams MorascaGermanyOnyama Limba UNQUALIFIED
Kadeem FlosiAustraliaBernardo Dominic RENEWAL
Juan WieserRussiaElwin Sharvill RENEWAL
Julie StensethRussiaIvan Magalhaes UNQUALIFIED
James ButtItalyStephen Shaw NEW
Julie StensethRussiaOnyama Limba QUALIFIED
Stacey MacleadBrazilAmy Elsner NEW
Arvin AlbaresCanadaIvan Magalhaes NEGOTIATION
Frozen Columns
Name
Octavia Malet
Claire Tollner
Greenwood Bolognia
Sinclair Waycott
Leon Oldroyd
Wickens Nestle
Adams Morasca
Aika Inouye
Juan Wieser
Maisha Rulapaugh
Clifford Rim
Smith Glick
Nicolas Iturbide
Kaitlin Ostrosky
Misaki Royster
Wickens Nestle
Leon Oldroyd
Morrow Ruta
Deepesh Chui
Antonio Caudy
Misaki Royster
Leon Oldroyd
Maria Marrier
Alejandro Perin
Clifford Rim
Kadeem Flosi
Aruna Figeroa
Tony Foller
Claire Tollner
Wickens Nestle
Aruna Figeroa
Darci Poquette
Aditya Kusko
Aika Inouye
Smith Glick
Francesco Shinko
Clifford Rim
Jefferson Schemmer
Nicolas Iturbide
Johnson Sergi
Nicolas Iturbide
Ivar Paprocki
Antonio Caudy
Octavia Malet
Rodrigues Campain
David Darakjy
Alejandro Perin
Kaitlin Ostrosky
Kadeem Flosi
Greenwood Bolognia
IdCountryDate
1000United Kingdom2025-10-10
1001France2025-09-11
1002Brazil2025-09-14
1003Argentina2025-10-03
1004Australia2025-09-18
1005Brazil2025-10-05
1006United Kingdom2025-09-24
1007Japan2025-09-12
1008Canada2025-10-04
1009Italy2025-09-13
1010Australia2025-09-26
1011India2025-09-15
1012Canada2025-09-24
1013Japan2025-09-14
1014Australia2025-10-01
1015Spain2025-09-25
1016United Kingdom2025-09-20
1017Russia2025-10-10
1018Australia2025-09-17
1019Australia2025-10-06
1020India2025-10-03
1021Australia2025-09-29
1022Russia2025-09-11
1023Japan2025-09-18
1024Japan2025-09-24
1025France2025-09-17
1026Canada2025-09-12
1027Germany2025-10-06
1028Spain2025-09-20
1029Brazil2025-10-02
1030Brazil2025-10-10
1031Canada2025-10-09
1032Argentina2025-10-02
1033Canada2025-09-28
1034Canada2025-09-16
1035Canada2025-09-28
1036Germany2025-10-09
1037Italy2025-10-02
1038Russia2025-09-22
1039India2025-09-24
1040Japan2025-10-07
1041Australia2025-09-11
1042Italy2025-10-02
1043France2025-10-07
1044India2025-09-22
1045Australia2025-10-01
1046France2025-09-12
1047Brazil2025-09-15
1048Spain2025-09-24
1049Australia2025-09-23

On-Demand Data

NameIdCountryDate
Francesco Shinko1000Spain2025-09-27
Kaitlin Ostrosky1001Australia2025-09-22
Murillo Malet1002United Kingdom2025-09-15
Sinclair Waycott1003Brazil2025-10-02
Julie Stenseth1004Australia2025-09-29
Rodrigues Campain1005Australia2025-09-13
Greenwood Bolognia1006Spain2025-09-24
Arvin Albares1007Russia2025-09-12
Smith Glick1008Germany2025-10-08
Wickens Nestle1009Canada2025-09-30
Arvin Albares1010Brazil2025-09-26
Maisha Rulapaugh1011Germany2025-09-16
Morrow Ruta1012Italy2025-09-22
Chavez Briddick1013Spain2025-10-09
Jennifer Amigon1014France2025-09-12
Smith Glick1015Brazil2025-09-28
Cody Saylors1016Brazil2025-09-28
Leon Oldroyd1017Japan2025-09-24
Misaki Royster1018Australia2025-10-09
Izzy Garufi1019Germany2025-09-22
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jennifer AmigonArgentinaStephen Shaw RENEWAL
Antonio CaudyItalyOnyama Limba UNQUALIFIED
Jeanfrancois VenereArgentinaAmy Elsner PROPOSAL
Costa DilliardFranceStephen Shaw UNQUALIFIED
Claire TollnerAustraliaIoni Bowcher PROPOSAL
Aruna FigeroaItalyBernardo Dominic UNQUALIFIED
Mujtaba NickaBrazilBernardo Dominic NEGOTIATION
Johnson SergiItalyStephen Shaw RENEWAL
Misaki RoysterIndiaAnna Fali QUALIFIED
Deepesh ChuiIndiaIvan Magalhaes QUALIFIED
Darci PoquetteCanadaXuxue Feng NEGOTIATION
Wickens NestleAustraliaBernardo Dominic RENEWAL
Jennifer AmigonJapanAsiya Javayant RENEWAL
Misaki RoysterCanadaStephen Shaw NEW
Aika InouyeAustraliaAmy Elsner NEGOTIATION
Ivar PaprockiJapanElwin Sharvill NEGOTIATION
Aditya KuskoAustraliaAmy Elsner NEGOTIATION
Aika InouyeSpainAsiya Javayant PROPOSAL
Maria MarrierSpainStephen Shaw UNQUALIFIED
Alejandro PerinBrazilIoni Bowcher UNQUALIFIED
Kadeem FlosiGermanyBernardo Dominic NEGOTIATION
Morrow RutaIndiaIoni Bowcher QUALIFIED
Misaki RoysterSpainOnyama Limba NEGOTIATION
Tony FollerRussiaAnna Fali RENEWAL
Sinclair WaycottIndiaAsiya Javayant QUALIFIED
Aditya KuskoCanadaElwin Sharvill RENEWAL
Octavia MaletAustraliaStephen Shaw RENEWAL
Cody SaylorsGermanyAsiya Javayant QUALIFIED
Maisha RulapaughArgentinaIoni Bowcher UNQUALIFIED
Aditya KuskoItalyIoni Bowcher QUALIFIED
Deepesh ChuiArgentinaIoni Bowcher NEGOTIATION
Tony FollerJapanBernardo Dominic NEGOTIATION
Adams MorascaItalyXuxue Feng NEGOTIATION
Arvin AlbaresIndiaAsiya Javayant QUALIFIED
Greenwood BologniaGermanyIoni Bowcher PROPOSAL
Murillo MaletUnited KingdomOnyama Limba RENEWAL
James ButtSpainElwin Sharvill NEW
Chavez BriddickIndiaIoni Bowcher RENEWAL
Stacey MacleadAustraliaXuxue Feng RENEWAL
Cody SaylorsIndiaBernardo Dominic 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>