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
Claire TollnerCanadaAmy Elsner PROPOSAL
Wickens NestleUnited KingdomOnyama Limba QUALIFIED
Nicolas IturbideIndiaElwin Sharvill QUALIFIED
Aika InouyeCanadaAsiya Javayant UNQUALIFIED
Isabel BowleyArgentinaAsiya Javayant PROPOSAL
Stacey MacleadFranceElwin Sharvill UNQUALIFIED
Rodrigues CampainJapanAmy Elsner PROPOSAL
Clifford RimIndiaElwin Sharvill UNQUALIFIED
Silvio SlusarskiSpainAmy Elsner UNQUALIFIED
Isabel BowleyUnited KingdomStephen Shaw PROPOSAL
Claire TollnerArgentinaBernardo Dominic PROPOSAL
Silvio SlusarskiBrazilAsiya Javayant QUALIFIED
Alejandro PerinGermanyOnyama Limba NEW
Mayumi KolmetzGermanyIoni Bowcher PROPOSAL
Silvio SlusarskiCanadaAnna Fali UNQUALIFIED
Deepesh ChuiCanadaAmy Elsner QUALIFIED
Faith GillianIndiaIvan Magalhaes NEW
Kaitlin OstroskyArgentinaStephen Shaw QUALIFIED
Aika InouyeUnited KingdomAnna Fali UNQUALIFIED
Maisha RulapaughGermanyElwin Sharvill NEW
Maisha RulapaughIndiaIvan Magalhaes NEW
Clifford RimSpainAmy Elsner NEW
Francesco ShinkoAustraliaElwin Sharvill PROPOSAL
Arvin AlbaresUnited KingdomAnna Fali QUALIFIED
Nicolas IturbideFranceIvan Magalhaes UNQUALIFIED
Alejandro PerinSpainXuxue Feng UNQUALIFIED
Isabel BowleyCanadaStephen Shaw UNQUALIFIED
Misaki RoysterAustraliaIvan Magalhaes PROPOSAL
Smith GlickJapanAmy Elsner QUALIFIED
Emily WhobreyArgentinaIoni Bowcher UNQUALIFIED
Jeanfrancois VenereArgentinaAsiya Javayant QUALIFIED
Kaitlin OstroskySpainStephen Shaw QUALIFIED
Nicolas IturbideGermanyAsiya Javayant NEW
Adams MorascaUnited KingdomAmy Elsner NEW
Johnson SergiJapanElwin Sharvill PROPOSAL
Tony FollerAustraliaAmy Elsner QUALIFIED
Costa DilliardUnited KingdomAnna Fali UNQUALIFIED
Clifford RimBrazilBernardo Dominic PROPOSAL
Salvatore StockhamArgentinaXuxue Feng RENEWAL
Maria MarrierIndiaElwin Sharvill NEGOTIATION
Claire TollnerJapanAsiya Javayant NEGOTIATION
Leon OldroydBrazilIoni Bowcher NEW
Octavia MaletBrazilBernardo Dominic NEW
Aika InouyeAustraliaBernardo Dominic UNQUALIFIED
Alejandro PerinBrazilIvan Magalhaes NEW
Izzy GarufiIndiaOnyama Limba NEGOTIATION
Juan WieserJapanAmy Elsner QUALIFIED
Jennifer AmigonArgentinaXuxue Feng NEGOTIATION
Jefferson SchemmerItalyOnyama Limba NEGOTIATION
Greenwood BologniaCanadaAnna Fali NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Misaki RoysterUnited KingdomXuxue Feng NEGOTIATION
Antonio CaudyUnited KingdomXuxue Feng UNQUALIFIED
Costa DilliardGermanyXuxue Feng PROPOSAL
Maisha RulapaughArgentinaXuxue Feng RENEWAL
Rodrigues CampainIndiaAsiya Javayant QUALIFIED
Mujtaba NickaRussiaAmy Elsner QUALIFIED
Maria MarrierCanadaXuxue Feng RENEWAL
David DarakjyBrazilIvan Magalhaes QUALIFIED
Isabel BowleyBrazilAsiya Javayant QUALIFIED
Claire TollnerFranceBernardo Dominic UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Rodrigues CampainRussia2026-06-05Rangoni Of Florence RENEWAL67Ioni Bowcher
1001Juan WieserGermany2026-05-24Rousseaux, Michael Esq QUALIFIED89Asiya Javayant
1002Munro FerenczAustralia2026-06-03Feltz Printing Service NEGOTIATION56Anna Fali
1003Kaitlin OstroskyBrazil2026-05-31Buckley Miller Wright UNQUALIFIED50Asiya Javayant
1004Jefferson SchemmerArgentina2026-06-08Buckley Miller Wright PROPOSAL63Stephen Shaw
1005Ricardo GauchoArgentina2026-05-20Chanay, Jeffrey A Esq NEGOTIATION5Bernardo Dominic
1006Sinclair WaycottUnited Kingdom2026-06-02Chapman, Ross E Esq UNQUALIFIED51Amy Elsner
1007Kadeem FlosiBrazil2026-05-20Chapman, Ross E Esq NEW37Onyama Limba
1008Antonio CaudyCanada2026-05-23Morlong Associates PROPOSAL57Asiya Javayant
1009Aditya KuskoRussia2026-05-29King, Christopher A Esq PROPOSAL52Stephen Shaw
1010Leon OldroydCanada2026-06-09Commercial Press RENEWAL79Asiya Javayant
1011Silvio SlusarskiFrance2026-05-23Printing Dimensions PROPOSAL64Elwin Sharvill
1012Octavia MaletGermany2026-06-06Dorl, James J Esq UNQUALIFIED10Xuxue Feng
1013Sinclair WaycottRussia2026-06-02Rousseaux, Michael Esq NEGOTIATION94Onyama Limba
1014Faith GillianRussia2026-06-03Truhlar And Truhlar Attys QUALIFIED46Amy Elsner
1015Ricardo GauchoAustralia2026-05-27Buckley Miller Wright NEGOTIATION61Stephen Shaw
1016Greenwood BologniaCanada2026-05-18Benton, John B Jr QUALIFIED42Xuxue Feng
1017Mayumi KolmetzItaly2026-06-09Chanay, Jeffrey A Esq NEW19Onyama Limba
1018Antonio CaudyGermany2026-06-11Feiner Bros NEGOTIATION49Anna Fali
1019Murillo MaletJapan2026-05-25Buckley Miller Wright QUALIFIED82Xuxue Feng
1020Aditya KuskoFrance2026-06-04Morlong Associates QUALIFIED71Onyama Limba
1021Johnson SergiFrance2026-06-08Rousseaux, Michael Esq PROPOSAL91Asiya Javayant
1022Francesco ShinkoCanada2026-05-25Morlong Associates NEW63Bernardo Dominic
1023Isabel BowleyBrazil2026-05-30Feltz Printing Service UNQUALIFIED6Asiya Javayant
1024Octavia MaletUnited Kingdom2026-06-03Rangoni Of Florence NEW94Bernardo Dominic
1025Leja CaldareraItaly2026-05-25Feiner Bros UNQUALIFIED62Elwin Sharvill
1026Cody SaylorsRussia2026-06-11Truhlar And Truhlar Attys RENEWAL61Onyama Limba
1027Nicolas IturbideRussia2026-06-01Morlong Associates UNQUALIFIED55Stephen Shaw
1028Misaki RoysterItaly2026-06-15Chanay, Jeffrey A Esq NEW2Ioni Bowcher
1029James ButtUnited Kingdom2026-05-25King, Christopher A Esq UNQUALIFIED98Asiya Javayant
1030Clifford RimRussia2026-05-31Rangoni Of Florence NEW43Amy Elsner
1031Munro FerenczJapan2026-05-18Commercial Press PROPOSAL28Elwin Sharvill
1032Salvatore StockhamGermany2026-06-03Benton, John B Jr PROPOSAL16Stephen Shaw
1033Kaitlin OstroskyRussia2026-05-28Feiner Bros UNQUALIFIED5Xuxue Feng
1034Darci PoquetteRussia2026-05-29Feiner Bros UNQUALIFIED24Elwin Sharvill
1035Emily WhobreyIndia2026-06-14Feltz Printing Service NEW14Bernardo Dominic
1036Adams MorascaSpain2026-05-24Chapman, Ross E Esq QUALIFIED34Onyama Limba
1037Francesco ShinkoRussia2026-05-23Commercial Press RENEWAL22Elwin Sharvill
1038Misaki RoysterItaly2026-06-13Benton, John B Jr PROPOSAL85Onyama Limba
1039Aruna FigeroaSpain2026-06-13Chemel, James L Cpa NEW74Asiya Javayant
1040Tony FollerRussia2026-05-24Chanay, Jeffrey A Esq NEW46Asiya Javayant
1041Leon OldroydRussia2026-05-21Rousseaux, Michael Esq QUALIFIED49Ioni Bowcher
1042Julie StensethUnited Kingdom2026-05-18Rangoni Of Florence PROPOSAL11Onyama Limba
1043Ivar PaprockiAustralia2026-05-24Feiner Bros UNQUALIFIED82Onyama Limba
1044Kadeem FlosiIndia2026-05-31Truhlar And Truhlar Attys NEGOTIATION66Stephen Shaw
1045Maria MarrierBrazil2026-05-20Feiner Bros NEGOTIATION72Bernardo Dominic
1046Clifford RimJapan2026-06-14Feltz Printing Service PROPOSAL48Stephen Shaw
1047Adams MorascaRussia2026-05-29Chanay, Jeffrey A Esq RENEWAL61Onyama Limba
1048Murillo MaletItaly2026-05-20Rousseaux, Michael Esq NEW92Ivan Magalhaes
1049Ricardo GauchoIndia2026-05-24Rousseaux, Michael Esq NEGOTIATION73Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Misaki RoysterRussiaIvan Magalhaes NEGOTIATION
Antonio CaudyItalyBernardo Dominic NEW
Rodrigues CampainIndiaElwin Sharvill QUALIFIED
Chavez BriddickBrazilElwin Sharvill NEW
Julie StensethJapanIvan Magalhaes UNQUALIFIED
Emily WhobreyCanadaBernardo Dominic NEW
Kaitlin OstroskyBrazilBernardo Dominic NEGOTIATION
Morrow RutaSpainAsiya Javayant QUALIFIED
Johnson SergiJapanIvan Magalhaes NEW
Misaki RoysterBrazilStephen Shaw PROPOSAL
Misaki RoysterSpainOnyama Limba RENEWAL
Smith GlickRussiaAsiya Javayant UNQUALIFIED
Ivar PaprockiCanadaBernardo Dominic NEGOTIATION
Emily WhobreyCanadaIvan Magalhaes QUALIFIED
Jones VocelkaCanadaElwin Sharvill NEW
Jennifer AmigonItalyElwin Sharvill PROPOSAL
Kadeem FlosiAustraliaAnna Fali NEW
David DarakjyCanadaIvan Magalhaes NEGOTIATION
Ivar PaprockiIndiaAmy Elsner NEGOTIATION
Wickens NestleJapanAsiya Javayant NEW
Isabel BowleyRussiaXuxue Feng QUALIFIED
Julie StensethSpainXuxue Feng NEW
Nicolas IturbideIndiaAsiya Javayant NEW
Francesco ShinkoFranceStephen Shaw QUALIFIED
Clifford RimUnited KingdomBernardo Dominic RENEWAL
Ricardo GauchoRussiaAmy Elsner NEW
Darci PoquetteIndiaAsiya Javayant NEGOTIATION
Jones VocelkaItalyXuxue Feng NEGOTIATION
Darci PoquetteBrazilAmy Elsner QUALIFIED
Maria MarrierUnited KingdomBernardo Dominic RENEWAL
Clifford RimGermanyAmy Elsner NEW
Aditya KuskoIndiaAsiya Javayant PROPOSAL
Misaki RoysterCanadaElwin Sharvill NEW
Ricardo GauchoCanadaAsiya Javayant PROPOSAL
Aruna FigeroaSpainAsiya Javayant UNQUALIFIED
Kaitlin OstroskyRussiaIoni Bowcher QUALIFIED
Morrow RutaFranceBernardo Dominic RENEWAL
Salvatore StockhamBrazilBernardo Dominic NEGOTIATION
James ButtItalyElwin Sharvill PROPOSAL
Tony FollerIndiaXuxue Feng NEW
Deepesh ChuiIndiaIvan Magalhaes UNQUALIFIED
Smith GlickArgentinaAnna Fali QUALIFIED
Ivar PaprockiBrazilStephen Shaw NEGOTIATION
Aruna FigeroaArgentinaElwin Sharvill PROPOSAL
Salvatore StockhamItalyElwin Sharvill QUALIFIED
Salvatore StockhamBrazilIvan Magalhaes UNQUALIFIED
Antonio CaudyFranceIvan Magalhaes PROPOSAL
Munro FerenczIndiaOnyama Limba QUALIFIED
Mayumi KolmetzIndiaAmy Elsner PROPOSAL
Rodrigues CampainIndiaOnyama Limba NEGOTIATION
Frozen Columns
Name
Mujtaba Nicka
Julie Stenseth
Juan Wieser
Aditya Kusko
Aditya Kusko
Jennifer Amigon
Izzy Garufi
Jennifer Amigon
Mujtaba Nicka
Sinclair Waycott
Francesco Shinko
Costa Dilliard
Leja Caldarera
Jefferson Schemmer
Murillo Malet
Cody Saylors
Chavez Briddick
Kadeem Flosi
Murillo Malet
Greenwood Bolognia
Leon Oldroyd
Costa Dilliard
Aditya Kusko
Aika Inouye
Juan Wieser
Leon Oldroyd
Adams Morasca
Morrow Ruta
Deepesh Chui
Darci Poquette
Maria Marrier
Mayumi Kolmetz
Arvin Albares
James Butt
Tony Foller
Kadeem Flosi
Mayumi Kolmetz
Jones Vocelka
Cody Saylors
Julie Stenseth
Kadeem Flosi
Alejandro Perin
Misaki Royster
Rodrigues Campain
Wickens Nestle
Sinclair Waycott
Ashley Doe
Clifford Rim
Izzy Garufi
Jones Vocelka
IdCountryDate
1000France2026-06-10
1001Russia2026-06-13
1002Canada2026-05-21
1003Spain2026-06-02
1004India2026-06-13
1005Japan2026-06-15
1006United Kingdom2026-05-21
1007India2026-05-21
1008Japan2026-05-23
1009United Kingdom2026-05-29
1010Argentina2026-06-01
1011Argentina2026-05-21
1012Japan2026-05-27
1013Brazil2026-05-18
1014Australia2026-06-03
1015Spain2026-05-28
1016Canada2026-06-04
1017Canada2026-05-18
1018Japan2026-06-04
1019Australia2026-05-23
1020Canada2026-05-26
1021France2026-06-04
1022Australia2026-05-31
1023United Kingdom2026-06-05
1024United Kingdom2026-05-30
1025Spain2026-06-10
1026Germany2026-06-02
1027United Kingdom2026-06-15
1028India2026-06-14
1029Germany2026-06-05
1030Russia2026-05-17
1031Spain2026-05-24
1032Japan2026-06-08
1033France2026-05-18
1034France2026-05-31
1035Canada2026-06-15
1036Italy2026-06-11
1037Brazil2026-06-14
1038Canada2026-06-06
1039Italy2026-06-15
1040United Kingdom2026-05-26
1041Japan2026-05-19
1042India2026-06-09
1043Argentina2026-05-19
1044Spain2026-05-20
1045Italy2026-05-20
1046Germany2026-05-25
1047Australia2026-05-21
1048United Kingdom2026-05-24
1049Russia2026-06-05

On-Demand Data

NameIdCountryDate
Morrow Ruta1000Spain2026-06-02
Murillo Malet1001Argentina2026-06-02
Greenwood Bolognia1002Germany2026-06-15
Misaki Royster1003France2026-05-17
Isabel Bowley1004India2026-06-06
Mujtaba Nicka1005Australia2026-05-24
Leja Caldarera1006Russia2026-06-06
David Darakjy1007Argentina2026-05-20
Julie Stenseth1008Spain2026-06-12
Munro Ferencz1009Argentina2026-06-01
Adams Morasca1010Italy2026-05-26
Johnson Sergi1011Germany2026-05-23
David Darakjy1012Germany2026-06-02
Isabel Bowley1013Canada2026-06-14
Deepesh Chui1014Canada2026-06-07
Munro Ferencz1015Australia2026-06-14
Stacey Maclead1016Brazil2026-05-24
Cody Saylors1017Italy2026-05-21
Octavia Malet1018Argentina2026-06-01
Silvio Slusarski1019Canada2026-05-19
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Cody SaylorsIndiaOnyama Limba PROPOSAL
Alejandro PerinJapanStephen Shaw NEGOTIATION
Alejandro PerinSpainAsiya Javayant PROPOSAL
Jones VocelkaUnited KingdomStephen Shaw QUALIFIED
Silvio SlusarskiUnited KingdomAmy Elsner NEW
Deepesh ChuiBrazilIvan Magalhaes NEGOTIATION
Ivar PaprockiJapanElwin Sharvill NEGOTIATION
Silvio SlusarskiItalyOnyama Limba QUALIFIED
Francesco ShinkoItalyAnna Fali PROPOSAL
Wickens NestleAustraliaOnyama Limba NEW
Juan WieserCanadaElwin Sharvill NEGOTIATION
Salvatore StockhamFranceIoni Bowcher RENEWAL
Jones VocelkaItalyElwin Sharvill RENEWAL
Rodrigues CampainIndiaAsiya Javayant NEW
Emily WhobreyCanadaXuxue Feng UNQUALIFIED
Aditya KuskoSpainOnyama Limba UNQUALIFIED
Aditya KuskoBrazilIvan Magalhaes NEW
James ButtCanadaAmy Elsner PROPOSAL
Julie StensethSpainAnna Fali UNQUALIFIED
Faith GillianAustraliaAnna Fali PROPOSAL
Alejandro PerinArgentinaIoni Bowcher NEW
Ashley DoeUnited KingdomXuxue Feng UNQUALIFIED
Kaitlin OstroskyAustraliaAnna Fali PROPOSAL
Leon OldroydSpainOnyama Limba QUALIFIED
Kadeem FlosiBrazilAnna Fali UNQUALIFIED
Greenwood BologniaItalyIvan Magalhaes UNQUALIFIED
Maisha RulapaughFranceStephen Shaw NEGOTIATION
Leja CaldareraIndiaIoni Bowcher QUALIFIED
Chavez BriddickIndiaXuxue Feng NEGOTIATION
Smith GlickBrazilAmy Elsner PROPOSAL
Isabel BowleySpainBernardo Dominic PROPOSAL
Faith GillianIndiaAsiya Javayant UNQUALIFIED
Mayumi KolmetzGermanyElwin Sharvill RENEWAL
Greenwood BologniaJapanAsiya Javayant RENEWAL
Clifford RimUnited KingdomIvan Magalhaes PROPOSAL
Jones VocelkaRussiaAmy Elsner RENEWAL
David DarakjyFranceOnyama Limba QUALIFIED
James ButtJapanXuxue Feng QUALIFIED
Munro FerenczFranceBernardo Dominic NEGOTIATION
Darci PoquetteIndiaIoni Bowcher 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>