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
Francesco ShinkoJapanBernardo Dominic NEGOTIATION
Murillo MaletIndiaBernardo Dominic QUALIFIED
Jones VocelkaIndiaStephen Shaw PROPOSAL
Stacey MacleadSpainStephen Shaw UNQUALIFIED
Misaki RoysterGermanyAmy Elsner PROPOSAL
Stacey MacleadSpainAmy Elsner NEGOTIATION
Jeanfrancois VenereCanadaStephen Shaw RENEWAL
David DarakjyGermanyElwin Sharvill UNQUALIFIED
Emily WhobreyAustraliaAsiya Javayant PROPOSAL
Rodrigues CampainFranceElwin Sharvill RENEWAL
Ricardo GauchoFranceIvan Magalhaes NEW
Faith GillianGermanyIvan Magalhaes RENEWAL
Francesco ShinkoIndiaXuxue Feng PROPOSAL
Clifford RimSpainOnyama Limba NEGOTIATION
Maisha RulapaughJapanOnyama Limba NEW
David DarakjyBrazilOnyama Limba NEW
Emily WhobreyCanadaStephen Shaw QUALIFIED
Jefferson SchemmerJapanAmy Elsner PROPOSAL
Sinclair WaycottAustraliaOnyama Limba QUALIFIED
Cody SaylorsRussiaBernardo Dominic UNQUALIFIED
Leon OldroydCanadaBernardo Dominic RENEWAL
Aruna FigeroaUnited KingdomBernardo Dominic NEW
Isabel BowleyGermanyAmy Elsner UNQUALIFIED
Kaitlin OstroskyAustraliaBernardo Dominic NEGOTIATION
Ivar PaprockiJapanAmy Elsner NEW
Rodrigues CampainCanadaAmy Elsner NEGOTIATION
Darci PoquetteJapanIoni Bowcher NEW
Jeanfrancois VenereBrazilAmy Elsner RENEWAL
Claire TollnerSpainBernardo Dominic QUALIFIED
Mayumi KolmetzGermanyOnyama Limba UNQUALIFIED
Jennifer AmigonBrazilElwin Sharvill NEW
Julie StensethSpainAnna Fali PROPOSAL
Juan WieserRussiaIvan Magalhaes QUALIFIED
Johnson SergiArgentinaIvan Magalhaes UNQUALIFIED
Wickens NestleAustraliaXuxue Feng PROPOSAL
Tony FollerCanadaBernardo Dominic NEW
Misaki RoysterArgentinaBernardo Dominic PROPOSAL
Silvio SlusarskiSpainAmy Elsner PROPOSAL
Tony FollerUnited KingdomAmy Elsner PROPOSAL
Maisha RulapaughGermanyBernardo Dominic PROPOSAL
Clifford RimUnited KingdomAmy Elsner NEGOTIATION
James ButtRussiaAmy Elsner RENEWAL
Johnson SergiAustraliaElwin Sharvill RENEWAL
Costa DilliardIndiaIvan Magalhaes UNQUALIFIED
Aika InouyeCanadaAmy Elsner UNQUALIFIED
Leja CaldareraItalyAnna Fali NEGOTIATION
Deepesh ChuiArgentinaAmy Elsner NEW
Salvatore StockhamAustraliaStephen Shaw NEW
Emily WhobreyIndiaAmy Elsner PROPOSAL
Murillo MaletGermanyAmy Elsner UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Chavez BriddickSpainIvan Magalhaes QUALIFIED
Julie StensethIndiaAnna Fali QUALIFIED
Adams MorascaCanadaOnyama Limba UNQUALIFIED
Kaitlin OstroskyUnited KingdomElwin Sharvill NEGOTIATION
Cody SaylorsJapanBernardo Dominic PROPOSAL
Jones VocelkaUnited KingdomIoni Bowcher NEGOTIATION
Octavia MaletIndiaAsiya Javayant RENEWAL
Costa DilliardGermanyIoni Bowcher NEW
Ivar PaprockiAustraliaIoni Bowcher PROPOSAL
Salvatore StockhamAustraliaStephen Shaw UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Juan WieserJapan2026-04-13Rousseaux, Michael Esq NEGOTIATION70Onyama Limba
1001Greenwood BologniaItaly2026-04-24Chanay, Jeffrey A Esq RENEWAL63Asiya Javayant
1002Francesco ShinkoItaly2026-04-30Chemel, James L Cpa NEW99Asiya Javayant
1003Izzy GarufiBrazil2026-04-29Truhlar And Truhlar Attys UNQUALIFIED10Stephen Shaw
1004Ricardo GauchoSpain2026-04-06Buckley Miller Wright PROPOSAL58Asiya Javayant
1005Kaitlin OstroskyUnited Kingdom2026-05-05Chapman, Ross E Esq NEW25Ioni Bowcher
1006Juan WieserSpain2026-04-23Dorl, James J Esq UNQUALIFIED94Stephen Shaw
1007Ashley DoeItaly2026-04-21Rangoni Of Florence NEW77Stephen Shaw
1008Francesco ShinkoRussia2026-04-21Benton, John B Jr NEGOTIATION65Ivan Magalhaes
1009Juan WieserItaly2026-04-10Benton, John B Jr NEW96Onyama Limba
1010Emily WhobreyItaly2026-05-03Rangoni Of Florence RENEWAL8Ioni Bowcher
1011Juan WieserRussia2026-04-08Chapman, Ross E Esq UNQUALIFIED94Elwin Sharvill
1012David DarakjyRussia2026-04-25Dorl, James J Esq UNQUALIFIED81Ivan Magalhaes
1013Maria MarrierRussia2026-04-17Chanay, Jeffrey A Esq NEW93Amy Elsner
1014Darci PoquetteRussia2026-04-09Feltz Printing Service RENEWAL85Stephen Shaw
1015Deepesh ChuiBrazil2026-04-27Morlong Associates NEGOTIATION52Onyama Limba
1016Kaitlin OstroskyIndia2026-04-27Rousseaux, Michael Esq PROPOSAL15Elwin Sharvill
1017Jefferson SchemmerSpain2026-04-24Chanay, Jeffrey A Esq QUALIFIED21Xuxue Feng
1018Nicolas IturbideFrance2026-05-03Rangoni Of Florence NEW56Ivan Magalhaes
1019Maria MarrierIndia2026-04-30Benton, John B Jr QUALIFIED69Bernardo Dominic
1020Stacey MacleadSpain2026-04-27Feiner Bros RENEWAL82Bernardo Dominic
1021David DarakjyUnited Kingdom2026-04-29Benton, John B Jr NEGOTIATION9Amy Elsner
1022Arvin AlbaresIndia2026-05-02Truhlar And Truhlar Attys UNQUALIFIED31Bernardo Dominic
1023Jeanfrancois VenereArgentina2026-04-22Chanay, Jeffrey A Esq NEW45Ivan Magalhaes
1024Mujtaba NickaGermany2026-04-15Morlong Associates NEW47Ioni Bowcher
1025Tony FollerCanada2026-05-01Feltz Printing Service NEW79Onyama Limba
1026Greenwood BologniaItaly2026-04-23Commercial Press NEGOTIATION22Onyama Limba
1027Sinclair WaycottUnited Kingdom2026-04-13Buckley Miller Wright NEW11Amy Elsner
1028Clifford RimRussia2026-04-26Dorl, James J Esq QUALIFIED44Elwin Sharvill
1029Costa DilliardIndia2026-04-21Chanay, Jeffrey A Esq RENEWAL26Stephen Shaw
1030Aruna FigeroaJapan2026-04-09Buckley Miller Wright RENEWAL36Amy Elsner
1031Cody SaylorsFrance2026-05-03Feiner Bros NEW46Ivan Magalhaes
1032Sinclair WaycottIndia2026-04-08Chemel, James L Cpa QUALIFIED24Bernardo Dominic
1033Claire TollnerGermany2026-04-12Commercial Press NEGOTIATION9Bernardo Dominic
1034Isabel BowleyItaly2026-04-11Morlong Associates QUALIFIED30Onyama Limba
1035Adams MorascaRussia2026-04-27Chemel, James L Cpa PROPOSAL25Onyama Limba
1036Claire TollnerUnited Kingdom2026-04-20Chapman, Ross E Esq QUALIFIED89Amy Elsner
1037Clifford RimUnited Kingdom2026-05-03Chapman, Ross E Esq NEW58Bernardo Dominic
1038Jennifer AmigonAustralia2026-04-22Buckley Miller Wright NEW46Ivan Magalhaes
1039Maisha RulapaughBrazil2026-04-21Commercial Press RENEWAL67Xuxue Feng
1040Ricardo GauchoUnited Kingdom2026-04-06Feiner Bros NEW42Elwin Sharvill
1041Sinclair WaycottItaly2026-05-03Chanay, Jeffrey A Esq NEW37Amy Elsner
1042Sinclair WaycottFrance2026-04-20Dorl, James J Esq RENEWAL81Bernardo Dominic
1043Wickens NestleGermany2026-04-14Rousseaux, Michael Esq UNQUALIFIED66Amy Elsner
1044Mujtaba NickaFrance2026-04-11Dorl, James J Esq NEGOTIATION68Stephen Shaw
1045Isabel BowleyAustralia2026-04-28Chanay, Jeffrey A Esq NEGOTIATION15Anna Fali
1046Jefferson SchemmerItaly2026-04-13Morlong Associates QUALIFIED90Ioni Bowcher
1047Jones VocelkaItaly2026-04-08Feltz Printing Service PROPOSAL92Xuxue Feng
1048Morrow RutaIndia2026-04-29Rousseaux, Michael Esq NEGOTIATION76Elwin Sharvill
1049Antonio CaudyAustralia2026-04-09Dorl, James J Esq RENEWAL17Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Kadeem FlosiUnited KingdomIvan Magalhaes RENEWAL
Mayumi KolmetzUnited KingdomAnna Fali RENEWAL
Ashley DoeRussiaAnna Fali UNQUALIFIED
Leon OldroydGermanyElwin Sharvill PROPOSAL
Stacey MacleadJapanAnna Fali QUALIFIED
Jones VocelkaCanadaAmy Elsner NEGOTIATION
Antonio CaudyArgentinaXuxue Feng PROPOSAL
Deepesh ChuiSpainStephen Shaw RENEWAL
Adams MorascaArgentinaAsiya Javayant PROPOSAL
Sinclair WaycottSpainOnyama Limba NEGOTIATION
Leja CaldareraArgentinaElwin Sharvill PROPOSAL
Kadeem FlosiIndiaStephen Shaw NEGOTIATION
Kaitlin OstroskyArgentinaBernardo Dominic UNQUALIFIED
Leja CaldareraItalyXuxue Feng RENEWAL
Faith GillianAustraliaAmy Elsner PROPOSAL
Silvio SlusarskiSpainElwin Sharvill PROPOSAL
Jennifer AmigonItalyOnyama Limba PROPOSAL
Jones VocelkaIndiaXuxue Feng RENEWAL
David DarakjyRussiaBernardo Dominic UNQUALIFIED
Ricardo GauchoJapanBernardo Dominic NEGOTIATION
Sinclair WaycottIndiaIoni Bowcher QUALIFIED
Faith GillianJapanStephen Shaw NEW
Jeanfrancois VenereJapanBernardo Dominic QUALIFIED
Alejandro PerinArgentinaStephen Shaw UNQUALIFIED
Leon OldroydBrazilAsiya Javayant NEGOTIATION
Costa DilliardItalyBernardo Dominic NEW
Jones VocelkaBrazilOnyama Limba NEGOTIATION
Sinclair WaycottCanadaIoni Bowcher QUALIFIED
Adams MorascaCanadaAnna Fali QUALIFIED
Tony FollerIndiaAmy Elsner PROPOSAL
Munro FerenczSpainIvan Magalhaes UNQUALIFIED
Costa DilliardGermanyAsiya Javayant UNQUALIFIED
Costa DilliardCanadaAnna Fali NEGOTIATION
Leja CaldareraAustraliaXuxue Feng NEGOTIATION
Isabel BowleyCanadaOnyama Limba NEW
Aditya KuskoFranceIoni Bowcher PROPOSAL
Ivar PaprockiGermanyIvan Magalhaes RENEWAL
Deepesh ChuiArgentinaXuxue Feng NEGOTIATION
Octavia MaletArgentinaOnyama Limba UNQUALIFIED
Murillo MaletIndiaIvan Magalhaes RENEWAL
Julie StensethBrazilAnna Fali UNQUALIFIED
Adams MorascaItalyOnyama Limba NEGOTIATION
Juan WieserCanadaElwin Sharvill QUALIFIED
Isabel BowleyBrazilBernardo Dominic NEGOTIATION
Leon OldroydIndiaIvan Magalhaes PROPOSAL
Aruna FigeroaUnited KingdomAnna Fali UNQUALIFIED
Ricardo GauchoGermanyOnyama Limba NEW
Jennifer AmigonItalyElwin Sharvill QUALIFIED
Leon OldroydFranceIoni Bowcher PROPOSAL
Munro FerenczIndiaOnyama Limba QUALIFIED
Frozen Columns
Name
Jennifer Amigon
Jones Vocelka
Emily Whobrey
Cody Saylors
Darci Poquette
Adams Morasca
Chavez Briddick
Maria Marrier
Salvatore Stockham
Greenwood Bolognia
Aika Inouye
Maria Marrier
Nicolas Iturbide
Tony Foller
Arvin Albares
Salvatore Stockham
Ashley Doe
Sinclair Waycott
Nicolas Iturbide
Maisha Rulapaugh
Sinclair Waycott
Kadeem Flosi
Aika Inouye
Tony Foller
Rodrigues Campain
Octavia Malet
Julie Stenseth
Deepesh Chui
Aruna Figeroa
Faith Gillian
Rodrigues Campain
Mujtaba Nicka
Aruna Figeroa
Kadeem Flosi
Ashley Doe
Cody Saylors
Sinclair Waycott
Jones Vocelka
Emily Whobrey
Aika Inouye
Cody Saylors
Aika Inouye
Silvio Slusarski
Octavia Malet
Tony Foller
Aruna Figeroa
Kadeem Flosi
Octavia Malet
David Darakjy
Tony Foller
IdCountryDate
1000India2026-04-21
1001Australia2026-04-06
1002United Kingdom2026-05-05
1003Russia2026-04-19
1004Australia2026-05-03
1005Japan2026-04-16
1006Australia2026-04-15
1007Russia2026-04-18
1008United Kingdom2026-05-01
1009Australia2026-04-17
1010Japan2026-04-29
1011India2026-04-20
1012Canada2026-04-09
1013Australia2026-04-08
1014Spain2026-04-10
1015France2026-04-13
1016Russia2026-05-04
1017Italy2026-04-07
1018Spain2026-04-27
1019Brazil2026-04-27
1020Canada2026-05-02
1021Japan2026-04-30
1022Germany2026-04-10
1023Russia2026-04-18
1024Australia2026-04-12
1025Canada2026-04-20
1026Brazil2026-05-05
1027Brazil2026-04-25
1028Australia2026-04-23
1029Canada2026-05-04
1030Italy2026-04-28
1031Canada2026-04-14
1032Brazil2026-05-04
1033Canada2026-04-11
1034Canada2026-04-23
1035Australia2026-04-19
1036Germany2026-04-23
1037Brazil2026-04-21
1038Argentina2026-04-21
1039Argentina2026-05-05
1040Australia2026-05-05
1041Argentina2026-04-09
1042United Kingdom2026-04-25
1043Canada2026-04-12
1044Italy2026-04-07
1045Germany2026-05-02
1046Canada2026-04-21
1047Spain2026-04-16
1048Japan2026-05-04
1049Japan2026-04-22

On-Demand Data

NameIdCountryDate
David Darakjy1000Spain2026-05-03
Kadeem Flosi1001India2026-04-17
Francesco Shinko1002Germany2026-05-02
Misaki Royster1003France2026-04-13
Aditya Kusko1004Argentina2026-04-12
Kadeem Flosi1005Italy2026-04-27
Julie Stenseth1006India2026-04-20
Faith Gillian1007Argentina2026-04-17
Smith Glick1008Italy2026-04-11
Ashley Doe1009Argentina2026-04-14
Aika Inouye1010Australia2026-04-13
Maria Marrier1011France2026-04-22
Silvio Slusarski1012Spain2026-04-06
Leon Oldroyd1013Russia2026-05-03
Misaki Royster1014United Kingdom2026-04-15
Silvio Slusarski1015Canada2026-05-01
Aika Inouye1016Australia2026-04-10
Johnson Sergi1017Spain2026-04-23
Claire Tollner1018United Kingdom2026-04-18
Jefferson Schemmer1019France2026-04-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Mujtaba NickaUnited KingdomBernardo Dominic NEGOTIATION
Johnson SergiFranceElwin Sharvill QUALIFIED
Jennifer AmigonItalyXuxue Feng PROPOSAL
Arvin AlbaresIndiaAmy Elsner UNQUALIFIED
Izzy GarufiItalyXuxue Feng QUALIFIED
Deepesh ChuiArgentinaStephen Shaw NEGOTIATION
Ivar PaprockiBrazilAmy Elsner NEGOTIATION
Nicolas IturbideJapanIoni Bowcher NEW
Sinclair WaycottItalyAmy Elsner PROPOSAL
Jones VocelkaArgentinaXuxue Feng UNQUALIFIED
Deepesh ChuiRussiaIoni Bowcher UNQUALIFIED
Aditya KuskoUnited KingdomAmy Elsner RENEWAL
Aditya KuskoGermanyAsiya Javayant RENEWAL
Maria MarrierAustraliaIoni Bowcher NEW
Francesco ShinkoUnited KingdomAmy Elsner QUALIFIED
Mujtaba NickaCanadaStephen Shaw UNQUALIFIED
Cody SaylorsBrazilAmy Elsner NEGOTIATION
Wickens NestleIndiaOnyama Limba NEGOTIATION
Tony FollerJapanStephen Shaw UNQUALIFIED
Nicolas IturbideArgentinaOnyama Limba PROPOSAL
Sinclair WaycottFranceElwin Sharvill NEW
Mayumi KolmetzJapanAnna Fali NEGOTIATION
Julie StensethItalyOnyama Limba QUALIFIED
Isabel BowleyArgentinaXuxue Feng UNQUALIFIED
Juan WieserCanadaOnyama Limba UNQUALIFIED
Misaki RoysterFranceIvan Magalhaes NEW
Emily WhobreyItalyBernardo Dominic RENEWAL
Deepesh ChuiGermanyAnna Fali PROPOSAL
Alejandro PerinIndiaAmy Elsner NEGOTIATION
Izzy GarufiAustraliaElwin Sharvill QUALIFIED
Leja CaldareraIndiaElwin Sharvill PROPOSAL
Darci PoquetteIndiaStephen Shaw PROPOSAL
Deepesh ChuiIndiaElwin Sharvill PROPOSAL
Misaki RoysterUnited KingdomBernardo Dominic NEW
Greenwood BologniaArgentinaAnna Fali UNQUALIFIED
Morrow RutaSpainAmy Elsner QUALIFIED
Leja CaldareraCanadaAsiya Javayant UNQUALIFIED
Misaki RoysterArgentinaXuxue Feng PROPOSAL
Kaitlin OstroskySpainAmy Elsner NEGOTIATION
James ButtItalyStephen Shaw 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>