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
Adams MorascaFranceIoni Bowcher RENEWAL
Arvin AlbaresArgentinaBernardo Dominic PROPOSAL
Jones VocelkaItalyIvan Magalhaes UNQUALIFIED
Johnson SergiIndiaOnyama Limba RENEWAL
Kadeem FlosiFranceIvan Magalhaes NEGOTIATION
James ButtRussiaIvan Magalhaes NEGOTIATION
James ButtGermanyBernardo Dominic UNQUALIFIED
James ButtUnited KingdomElwin Sharvill NEGOTIATION
Jones VocelkaUnited KingdomXuxue Feng PROPOSAL
Jones VocelkaBrazilAmy Elsner QUALIFIED
Francesco ShinkoAustraliaBernardo Dominic NEGOTIATION
Chavez BriddickItalyXuxue Feng UNQUALIFIED
Leja CaldareraJapanXuxue Feng NEW
Morrow RutaIndiaAmy Elsner UNQUALIFIED
Greenwood BologniaJapanIoni Bowcher UNQUALIFIED
Nicolas IturbideBrazilOnyama Limba PROPOSAL
Aika InouyeSpainAsiya Javayant PROPOSAL
Arvin AlbaresArgentinaElwin Sharvill PROPOSAL
Julie StensethSpainOnyama Limba UNQUALIFIED
Stacey MacleadArgentinaAmy Elsner RENEWAL
Mayumi KolmetzUnited KingdomStephen Shaw UNQUALIFIED
Sinclair WaycottRussiaOnyama Limba PROPOSAL
Claire TollnerRussiaXuxue Feng NEGOTIATION
Maria MarrierArgentinaAmy Elsner RENEWAL
Jeanfrancois VenereGermanyAsiya Javayant RENEWAL
Faith GillianUnited KingdomIoni Bowcher NEGOTIATION
Faith GillianGermanyOnyama Limba QUALIFIED
Sinclair WaycottSpainBernardo Dominic QUALIFIED
Alejandro PerinBrazilXuxue Feng QUALIFIED
Misaki RoysterArgentinaStephen Shaw UNQUALIFIED
Clifford RimSpainAnna Fali NEW
Juan WieserItalyIvan Magalhaes QUALIFIED
Wickens NestleItalyStephen Shaw PROPOSAL
Antonio CaudyIndiaIvan Magalhaes QUALIFIED
Costa DilliardBrazilStephen Shaw UNQUALIFIED
Kadeem FlosiJapanXuxue Feng UNQUALIFIED
Alejandro PerinItalyAsiya Javayant RENEWAL
Octavia MaletGermanyAnna Fali NEW
David DarakjyBrazilOnyama Limba PROPOSAL
Julie StensethSpainOnyama Limba QUALIFIED
Wickens NestleGermanyBernardo Dominic NEGOTIATION
Murillo MaletArgentinaAmy Elsner PROPOSAL
Nicolas IturbideJapanAmy Elsner UNQUALIFIED
Antonio CaudyBrazilIvan Magalhaes RENEWAL
Nicolas IturbideIndiaOnyama Limba RENEWAL
Misaki RoysterFranceElwin Sharvill NEGOTIATION
Alejandro PerinItalyAmy Elsner PROPOSAL
Antonio CaudyArgentinaIvan Magalhaes UNQUALIFIED
Kaitlin OstroskyBrazilAsiya Javayant QUALIFIED
Arvin AlbaresGermanyIoni Bowcher NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Julie StensethFranceElwin Sharvill QUALIFIED
Octavia MaletRussiaAsiya Javayant NEW
Octavia MaletAustraliaAsiya Javayant QUALIFIED
Arvin AlbaresJapanBernardo Dominic UNQUALIFIED
Aika InouyeFranceElwin Sharvill PROPOSAL
Cody SaylorsSpainIvan Magalhaes PROPOSAL
Murillo MaletSpainAmy Elsner NEGOTIATION
Silvio SlusarskiBrazilIoni Bowcher UNQUALIFIED
Darci PoquetteCanadaIvan Magalhaes RENEWAL
Mujtaba NickaFranceAsiya Javayant QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Kadeem FlosiGermany2026-04-28King, Christopher A Esq QUALIFIED70Anna Fali
1001Izzy GarufiCanada2026-05-04Morlong Associates QUALIFIED71Xuxue Feng
1002Mujtaba NickaRussia2026-05-14Dorl, James J Esq QUALIFIED96Ivan Magalhaes
1003Misaki RoysterAustralia2026-04-28Rousseaux, Michael Esq NEW80Ioni Bowcher
1004Costa DilliardSpain2026-04-24Printing Dimensions NEGOTIATION24Ioni Bowcher
1005Jennifer AmigonItaly2026-05-05Morlong Associates NEW56Onyama Limba
1006Aditya KuskoUnited Kingdom2026-05-12Printing Dimensions UNQUALIFIED28Ioni Bowcher
1007Francesco ShinkoIndia2026-04-25Buckley Miller Wright UNQUALIFIED34Bernardo Dominic
1008Ashley DoeAustralia2026-05-18Chapman, Ross E Esq UNQUALIFIED87Elwin Sharvill
1009Jennifer AmigonUnited Kingdom2026-05-10Rangoni Of Florence QUALIFIED74Asiya Javayant
1010Aditya KuskoSpain2026-05-01Chanay, Jeffrey A Esq RENEWAL34Bernardo Dominic
1011Leja CaldareraAustralia2026-05-15Commercial Press QUALIFIED12Bernardo Dominic
1012Murillo MaletJapan2026-05-13Buckley Miller Wright UNQUALIFIED40Amy Elsner
1013Ashley DoeIndia2026-04-22Commercial Press NEW61Xuxue Feng
1014Chavez BriddickSpain2026-04-24Chemel, James L Cpa NEGOTIATION39Bernardo Dominic
1015Aika InouyeGermany2026-04-26King, Christopher A Esq RENEWAL66Ivan Magalhaes
1016Leon OldroydJapan2026-04-27Buckley Miller Wright NEW67Onyama Limba
1017Mujtaba NickaRussia2026-05-17Chemel, James L Cpa NEW34Elwin Sharvill
1018Aditya KuskoIndia2026-04-27Commercial Press UNQUALIFIED28Amy Elsner
1019Jeanfrancois VenereFrance2026-04-28Printing Dimensions NEW79Bernardo Dominic
1020Maisha RulapaughItaly2026-05-05Commercial Press PROPOSAL15Anna Fali
1021Arvin AlbaresJapan2026-04-20Printing Dimensions RENEWAL61Onyama Limba
1022Morrow RutaSpain2026-04-20Feiner Bros NEGOTIATION16Asiya Javayant
1023Jeanfrancois VenereRussia2026-04-29Chanay, Jeffrey A Esq UNQUALIFIED90Onyama Limba
1024Juan WieserRussia2026-05-12Dorl, James J Esq NEW5Amy Elsner
1025Darci PoquetteArgentina2026-05-08Chemel, James L Cpa QUALIFIED74Anna Fali
1026James ButtJapan2026-04-25Benton, John B Jr PROPOSAL54Asiya Javayant
1027Leja CaldareraItaly2026-04-28Feiner Bros NEW81Bernardo Dominic
1028Aditya KuskoCanada2026-05-15Dorl, James J Esq UNQUALIFIED98Stephen Shaw
1029Clifford RimFrance2026-04-25Feltz Printing Service QUALIFIED52Elwin Sharvill
1030Kadeem FlosiSpain2026-05-18Dorl, James J Esq QUALIFIED75Amy Elsner
1031Rodrigues CampainArgentina2026-05-07Chemel, James L Cpa RENEWAL36Stephen Shaw
1032Aruna FigeroaBrazil2026-05-02Chanay, Jeffrey A Esq UNQUALIFIED40Amy Elsner
1033Mujtaba NickaUnited Kingdom2026-05-17King, Christopher A Esq NEGOTIATION3Elwin Sharvill
1034Jefferson SchemmerIndia2026-04-23Chapman, Ross E Esq UNQUALIFIED0Stephen Shaw
1035Emily WhobreyRussia2026-05-12Dorl, James J Esq NEGOTIATION75Anna Fali
1036Octavia MaletJapan2026-05-10Rousseaux, Michael Esq QUALIFIED59Stephen Shaw
1037Deepesh ChuiIndia2026-05-17King, Christopher A Esq RENEWAL90Amy Elsner
1038James ButtBrazil2026-04-23Printing Dimensions QUALIFIED61Xuxue Feng
1039Isabel BowleyArgentina2026-05-06Dorl, James J Esq NEGOTIATION9Asiya Javayant
1040Misaki RoysterGermany2026-05-13Rangoni Of Florence RENEWAL46Asiya Javayant
1041Aika InouyeAustralia2026-05-17Rousseaux, Michael Esq PROPOSAL53Ioni Bowcher
1042Mayumi KolmetzItaly2026-05-13Feiner Bros PROPOSAL66Anna Fali
1043Juan WieserFrance2026-05-12Rangoni Of Florence RENEWAL4Xuxue Feng
1044Juan WieserRussia2026-04-24Commercial Press UNQUALIFIED53Ioni Bowcher
1045Ricardo GauchoBrazil2026-04-23Chanay, Jeffrey A Esq NEGOTIATION18Stephen Shaw
1046Arvin AlbaresRussia2026-05-14Commercial Press QUALIFIED61Asiya Javayant
1047Johnson SergiArgentina2026-05-02Dorl, James J Esq RENEWAL54Xuxue Feng
1048Ashley DoeRussia2026-04-21Feiner Bros UNQUALIFIED81Elwin Sharvill
1049Izzy GarufiArgentina2026-04-21Rangoni Of Florence NEW0Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Silvio SlusarskiUnited KingdomAsiya Javayant NEGOTIATION
Claire TollnerAustraliaStephen Shaw NEW
Smith GlickUnited KingdomXuxue Feng NEGOTIATION
Murillo MaletGermanyStephen Shaw QUALIFIED
Chavez BriddickAustraliaIvan Magalhaes UNQUALIFIED
Claire TollnerUnited KingdomElwin Sharvill NEGOTIATION
Clifford RimIndiaBernardo Dominic PROPOSAL
Wickens NestleIndiaAsiya Javayant NEW
Octavia MaletFranceAnna Fali RENEWAL
Alejandro PerinRussiaAsiya Javayant NEW
Salvatore StockhamRussiaAsiya Javayant NEGOTIATION
Cody SaylorsArgentinaOnyama Limba UNQUALIFIED
Isabel BowleyAustraliaAsiya Javayant PROPOSAL
Jefferson SchemmerIndiaStephen Shaw PROPOSAL
Ashley DoeRussiaXuxue Feng QUALIFIED
Adams MorascaJapanElwin Sharvill PROPOSAL
Greenwood BologniaBrazilIvan Magalhaes PROPOSAL
Mayumi KolmetzCanadaOnyama Limba QUALIFIED
Aika InouyeArgentinaAmy Elsner PROPOSAL
Jeanfrancois VenereBrazilBernardo Dominic UNQUALIFIED
Jennifer AmigonArgentinaBernardo Dominic PROPOSAL
Misaki RoysterItalyXuxue Feng NEGOTIATION
Ashley DoeGermanyXuxue Feng QUALIFIED
Tony FollerGermanyStephen Shaw NEGOTIATION
Tony FollerArgentinaXuxue Feng UNQUALIFIED
Misaki RoysterIndiaBernardo Dominic PROPOSAL
Aika InouyeSpainBernardo Dominic RENEWAL
Maria MarrierArgentinaStephen Shaw UNQUALIFIED
Stacey MacleadIndiaAsiya Javayant UNQUALIFIED
Rodrigues CampainUnited KingdomAsiya Javayant PROPOSAL
Johnson SergiIndiaAsiya Javayant RENEWAL
Misaki RoysterBrazilXuxue Feng PROPOSAL
Ashley DoeAustraliaAnna Fali UNQUALIFIED
Stacey MacleadJapanAsiya Javayant PROPOSAL
Tony FollerFranceBernardo Dominic RENEWAL
Munro FerenczUnited KingdomAmy Elsner RENEWAL
Kaitlin OstroskyAustraliaOnyama Limba NEW
Maria MarrierJapanStephen Shaw RENEWAL
Juan WieserAustraliaOnyama Limba RENEWAL
Murillo MaletIndiaXuxue Feng UNQUALIFIED
Isabel BowleyCanadaAsiya Javayant NEW
Rodrigues CampainUnited KingdomAsiya Javayant NEW
Mujtaba NickaIndiaStephen Shaw NEGOTIATION
Silvio SlusarskiBrazilElwin Sharvill NEGOTIATION
Ivar PaprockiAustraliaOnyama Limba NEW
Kadeem FlosiBrazilIvan Magalhaes QUALIFIED
Misaki RoysterRussiaStephen Shaw QUALIFIED
Ivar PaprockiRussiaIvan Magalhaes RENEWAL
Maisha RulapaughRussiaBernardo Dominic RENEWAL
Faith GillianJapanAmy Elsner PROPOSAL
Frozen Columns
Name
Murillo Malet
Claire Tollner
Jeanfrancois Venere
James Butt
Sinclair Waycott
Maria Marrier
Mayumi Kolmetz
Juan Wieser
Leon Oldroyd
Emily Whobrey
Salvatore Stockham
Greenwood Bolognia
Kaitlin Ostrosky
Jeanfrancois Venere
Silvio Slusarski
Faith Gillian
Kadeem Flosi
Nicolas Iturbide
Leja Caldarera
Jefferson Schemmer
Julie Stenseth
Nicolas Iturbide
Ashley Doe
Alejandro Perin
Rodrigues Campain
David Darakjy
Aruna Figeroa
Mayumi Kolmetz
Nicolas Iturbide
Chavez Briddick
Mujtaba Nicka
Alejandro Perin
Misaki Royster
Jones Vocelka
Nicolas Iturbide
Arvin Albares
Ricardo Gaucho
David Darakjy
Emily Whobrey
Nicolas Iturbide
Cody Saylors
Costa Dilliard
Alejandro Perin
Deepesh Chui
Ashley Doe
Mayumi Kolmetz
Kadeem Flosi
Mayumi Kolmetz
Silvio Slusarski
Chavez Briddick
IdCountryDate
1000Canada2026-04-21
1001Brazil2026-05-01
1002Spain2026-04-25
1003United Kingdom2026-04-23
1004Germany2026-05-16
1005Germany2026-04-21
1006Spain2026-05-07
1007India2026-05-14
1008Russia2026-05-19
1009Russia2026-05-14
1010India2026-05-08
1011Italy2026-05-09
1012India2026-05-18
1013India2026-04-22
1014United Kingdom2026-04-26
1015France2026-05-04
1016United Kingdom2026-05-02
1017Brazil2026-04-28
1018Germany2026-04-29
1019India2026-05-19
1020Brazil2026-04-20
1021Germany2026-05-15
1022Canada2026-04-24
1023Spain2026-04-25
1024France2026-05-05
1025India2026-05-06
1026Australia2026-05-19
1027Spain2026-04-28
1028France2026-05-09
1029Australia2026-04-23
1030Russia2026-05-15
1031France2026-05-02
1032Argentina2026-04-21
1033Australia2026-04-20
1034France2026-05-15
1035Brazil2026-04-24
1036India2026-05-07
1037Australia2026-05-19
1038Argentina2026-04-26
1039Germany2026-04-26
1040United Kingdom2026-05-14
1041Brazil2026-05-01
1042Argentina2026-05-04
1043India2026-05-10
1044Brazil2026-05-18
1045United Kingdom2026-05-12
1046Russia2026-05-13
1047Russia2026-04-23
1048Germany2026-05-07
1049United Kingdom2026-04-29

On-Demand Data

NameIdCountryDate
Maisha Rulapaugh1000Spain2026-05-10
Juan Wieser1001India2026-04-21
Ivar Paprocki1002United Kingdom2026-05-16
Morrow Ruta1003France2026-04-25
Nicolas Iturbide1004Italy2026-05-09
Sinclair Waycott1005Germany2026-05-01
Wickens Nestle1006Russia2026-05-18
Clifford Rim1007France2026-05-17
Leon Oldroyd1008United Kingdom2026-04-30
Ashley Doe1009Argentina2026-05-04
Ricardo Gaucho1010India2026-04-22
Jefferson Schemmer1011Italy2026-05-05
Francesco Shinko1012Spain2026-04-25
David Darakjy1013Argentina2026-05-04
Aditya Kusko1014Russia2026-05-01
Munro Ferencz1015France2026-04-23
Maisha Rulapaugh1016Russia2026-04-22
Alejandro Perin1017Russia2026-05-04
Arvin Albares1018Spain2026-05-10
Mayumi Kolmetz1019Japan2026-05-01
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Murillo MaletJapanAmy Elsner RENEWAL
David DarakjyCanadaStephen Shaw NEW
Darci PoquetteSpainOnyama Limba UNQUALIFIED
Kaitlin OstroskyItalyOnyama Limba PROPOSAL
Costa DilliardJapanIoni Bowcher PROPOSAL
Ricardo GauchoArgentinaStephen Shaw QUALIFIED
Arvin AlbaresIndiaIoni Bowcher NEW
Nicolas IturbideUnited KingdomOnyama Limba NEW
Clifford RimSpainElwin Sharvill QUALIFIED
Juan WieserFranceAmy Elsner NEGOTIATION
Johnson SergiSpainAnna Fali QUALIFIED
Johnson SergiSpainElwin Sharvill NEGOTIATION
Tony FollerRussiaOnyama Limba QUALIFIED
Arvin AlbaresCanadaAnna Fali PROPOSAL
Greenwood BologniaRussiaAsiya Javayant PROPOSAL
Nicolas IturbideBrazilIvan Magalhaes UNQUALIFIED
Ricardo GauchoGermanyIoni Bowcher UNQUALIFIED
Murillo MaletIndiaOnyama Limba PROPOSAL
David DarakjyAustraliaBernardo Dominic RENEWAL
Faith GillianJapanIoni Bowcher NEW
Salvatore StockhamArgentinaElwin Sharvill NEGOTIATION
James ButtRussiaStephen Shaw NEW
Jennifer AmigonArgentinaAsiya Javayant QUALIFIED
James ButtIndiaOnyama Limba UNQUALIFIED
Arvin AlbaresArgentinaOnyama Limba RENEWAL
Ivar PaprockiGermanyOnyama Limba NEW
Octavia MaletItalyElwin Sharvill NEW
Francesco ShinkoBrazilAnna Fali NEGOTIATION
Aika InouyeArgentinaAmy Elsner UNQUALIFIED
Tony FollerUnited KingdomStephen Shaw PROPOSAL
Salvatore StockhamArgentinaIoni Bowcher RENEWAL
Aditya KuskoItalyAsiya Javayant QUALIFIED
Salvatore StockhamIndiaStephen Shaw NEGOTIATION
Octavia MaletUnited KingdomAnna Fali QUALIFIED
Claire TollnerUnited KingdomAmy Elsner PROPOSAL
Nicolas IturbideSpainStephen Shaw NEW
Isabel BowleyFranceXuxue Feng QUALIFIED
Munro FerenczArgentinaIvan Magalhaes UNQUALIFIED
Leon OldroydRussiaAnna Fali QUALIFIED
Costa DilliardBrazilAnna Fali NEW

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