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
Jeanfrancois VenereFranceAsiya Javayant RENEWAL
Sinclair WaycottRussiaAsiya Javayant PROPOSAL
Aditya KuskoItalyOnyama Limba QUALIFIED
Jefferson SchemmerIndiaAnna Fali UNQUALIFIED
Alejandro PerinBrazilXuxue Feng UNQUALIFIED
Maria MarrierJapanIvan Magalhaes NEGOTIATION
Maisha RulapaughAustraliaAsiya Javayant QUALIFIED
Sinclair WaycottItalyIoni Bowcher NEGOTIATION
Stacey MacleadIndiaAsiya Javayant UNQUALIFIED
Mujtaba NickaJapanAmy Elsner NEGOTIATION
Leja CaldareraSpainIoni Bowcher QUALIFIED
Johnson SergiItalyAnna Fali UNQUALIFIED
Cody SaylorsItalyElwin Sharvill PROPOSAL
Cody SaylorsJapanAmy Elsner NEW
Jones VocelkaIndiaXuxue Feng PROPOSAL
Aditya KuskoGermanyIoni Bowcher PROPOSAL
Ivar PaprockiIndiaOnyama Limba PROPOSAL
Aika InouyeBrazilIoni Bowcher QUALIFIED
Jennifer AmigonRussiaElwin Sharvill PROPOSAL
Jeanfrancois VenereUnited KingdomElwin Sharvill NEW
Izzy GarufiRussiaIvan Magalhaes RENEWAL
Aika InouyeCanadaStephen Shaw PROPOSAL
Mujtaba NickaUnited KingdomElwin Sharvill NEW
Chavez BriddickRussiaAmy Elsner UNQUALIFIED
Murillo MaletAustraliaElwin Sharvill NEGOTIATION
Sinclair WaycottCanadaStephen Shaw QUALIFIED
Jefferson SchemmerItalyElwin Sharvill NEGOTIATION
Rodrigues CampainSpainAmy Elsner NEW
Sinclair WaycottGermanyElwin Sharvill NEGOTIATION
Mayumi KolmetzUnited KingdomXuxue Feng QUALIFIED
Juan WieserAustraliaIoni Bowcher RENEWAL
Stacey MacleadSpainElwin Sharvill RENEWAL
Salvatore StockhamItalyElwin Sharvill QUALIFIED
Jeanfrancois VenereJapanXuxue Feng UNQUALIFIED
Stacey MacleadItalyBernardo Dominic NEW
Darci PoquetteIndiaAmy Elsner NEGOTIATION
Tony FollerJapanOnyama Limba PROPOSAL
Ricardo GauchoIndiaIvan Magalhaes QUALIFIED
Antonio CaudyItalyElwin Sharvill RENEWAL
Ricardo GauchoFranceAsiya Javayant PROPOSAL
Maisha RulapaughFranceElwin Sharvill RENEWAL
Aika InouyeCanadaAmy Elsner UNQUALIFIED
Kadeem FlosiSpainAsiya Javayant UNQUALIFIED
Faith GillianSpainAmy Elsner NEW
Jones VocelkaCanadaAsiya Javayant UNQUALIFIED
Leja CaldareraBrazilOnyama Limba NEGOTIATION
Wickens NestleIndiaElwin Sharvill QUALIFIED
Maria MarrierArgentinaOnyama Limba NEGOTIATION
Kaitlin OstroskyIndiaStephen Shaw QUALIFIED
David DarakjyBrazilAnna Fali PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Jeanfrancois VenereSpainIvan Magalhaes NEGOTIATION
Misaki RoysterUnited KingdomAmy Elsner NEW
Ashley DoeArgentinaElwin Sharvill NEGOTIATION
Murillo MaletItalyIvan Magalhaes UNQUALIFIED
Leon OldroydCanadaIoni Bowcher UNQUALIFIED
Deepesh ChuiFranceElwin Sharvill NEW
Mujtaba NickaJapanElwin Sharvill PROPOSAL
Francesco ShinkoBrazilIvan Magalhaes PROPOSAL
Kadeem FlosiJapanIvan Magalhaes UNQUALIFIED
Clifford RimBrazilAmy Elsner QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Kadeem FlosiItaly2026-04-30Morlong Associates QUALIFIED78Ivan Magalhaes
1001Costa DilliardJapan2026-04-25Chemel, James L Cpa UNQUALIFIED25Xuxue Feng
1002Ashley DoeGermany2026-05-11Feiner Bros NEGOTIATION92Ioni Bowcher
1003Aruna FigeroaUnited Kingdom2026-04-15Printing Dimensions NEGOTIATION83Xuxue Feng
1004Leja CaldareraBrazil2026-04-21Truhlar And Truhlar Attys RENEWAL65Elwin Sharvill
1005Jones VocelkaAustralia2026-05-06Rousseaux, Michael Esq UNQUALIFIED49Asiya Javayant
1006Greenwood BologniaItaly2026-05-13King, Christopher A Esq QUALIFIED63Anna Fali
1007Leja CaldareraArgentina2026-04-24Printing Dimensions PROPOSAL64Onyama Limba
1008Maria MarrierGermany2026-05-08King, Christopher A Esq NEW39Ivan Magalhaes
1009Johnson SergiJapan2026-04-29King, Christopher A Esq NEW55Anna Fali
1010Alejandro PerinCanada2026-04-15Chapman, Ross E Esq RENEWAL13Elwin Sharvill
1011Julie StensethCanada2026-04-19Buckley Miller Wright QUALIFIED35Bernardo Dominic
1012Izzy GarufiIndia2026-04-22Morlong Associates NEGOTIATION94Elwin Sharvill
1013Costa DilliardSpain2026-04-18Printing Dimensions RENEWAL2Asiya Javayant
1014Ricardo GauchoRussia2026-05-10Commercial Press UNQUALIFIED77Ioni Bowcher
1015Ashley DoeFrance2026-05-05Rousseaux, Michael Esq PROPOSAL14Ivan Magalhaes
1016Emily WhobreyFrance2026-05-10Truhlar And Truhlar Attys UNQUALIFIED89Asiya Javayant
1017Cody SaylorsJapan2026-04-23Rangoni Of Florence NEW90Anna Fali
1018Antonio CaudyGermany2026-04-24Rangoni Of Florence NEW46Ioni Bowcher
1019Johnson SergiSpain2026-04-14Feltz Printing Service RENEWAL92Bernardo Dominic
1020Munro FerenczJapan2026-05-04King, Christopher A Esq QUALIFIED76Asiya Javayant
1021Mayumi KolmetzBrazil2026-05-09King, Christopher A Esq UNQUALIFIED98Stephen Shaw
1022Sinclair WaycottIndia2026-04-14Dorl, James J Esq QUALIFIED10Onyama Limba
1023Salvatore StockhamUnited Kingdom2026-04-14Morlong Associates PROPOSAL5Ioni Bowcher
1024Claire TollnerUnited Kingdom2026-05-02Chemel, James L Cpa NEGOTIATION91Anna Fali
1025Sinclair WaycottRussia2026-04-20King, Christopher A Esq UNQUALIFIED20Ioni Bowcher
1026Stacey MacleadCanada2026-05-10Printing Dimensions NEW63Elwin Sharvill
1027James ButtUnited Kingdom2026-04-25Printing Dimensions NEGOTIATION6Onyama Limba
1028Kadeem FlosiArgentina2026-04-20Chapman, Ross E Esq PROPOSAL51Asiya Javayant
1029Aruna FigeroaRussia2026-05-12Feiner Bros NEGOTIATION48Amy Elsner
1030Morrow RutaBrazil2026-04-30Morlong Associates NEW93Ioni Bowcher
1031Johnson SergiCanada2026-05-07Commercial Press QUALIFIED84Bernardo Dominic
1032Silvio SlusarskiUnited Kingdom2026-04-20Dorl, James J Esq PROPOSAL12Onyama Limba
1033Arvin AlbaresAustralia2026-04-14Chanay, Jeffrey A Esq PROPOSAL16Ioni Bowcher
1034Clifford RimBrazil2026-04-18Chapman, Ross E Esq RENEWAL23Xuxue Feng
1035Murillo MaletBrazil2026-04-27Rangoni Of Florence QUALIFIED91Ivan Magalhaes
1036Mayumi KolmetzArgentina2026-04-15Commercial Press PROPOSAL89Stephen Shaw
1037Morrow RutaAustralia2026-04-15Buckley Miller Wright QUALIFIED82Onyama Limba
1038Maria MarrierBrazil2026-04-18Truhlar And Truhlar Attys UNQUALIFIED86Ioni Bowcher
1039Jeanfrancois VenereCanada2026-05-09Feltz Printing Service NEW13Xuxue Feng
1040Kadeem FlosiBrazil2026-05-01Feiner Bros RENEWAL21Ioni Bowcher
1041Francesco ShinkoCanada2026-04-18King, Christopher A Esq PROPOSAL91Stephen Shaw
1042Rodrigues CampainSpain2026-05-01Feiner Bros RENEWAL10Onyama Limba
1043Arvin AlbaresRussia2026-05-13King, Christopher A Esq NEW94Asiya Javayant
1044Tony FollerGermany2026-05-04Chapman, Ross E Esq RENEWAL30Ivan Magalhaes
1045Maria MarrierGermany2026-04-27Rousseaux, Michael Esq NEGOTIATION38Onyama Limba
1046Tony FollerJapan2026-05-01Chemel, James L Cpa NEW67Onyama Limba
1047Julie StensethRussia2026-04-22Rousseaux, Michael Esq QUALIFIED90Anna Fali
1048Jennifer AmigonJapan2026-05-06Truhlar And Truhlar Attys QUALIFIED86Xuxue Feng
1049Clifford RimCanada2026-04-26Buckley Miller Wright NEGOTIATION26Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Wickens NestleCanadaElwin Sharvill RENEWAL
Isabel BowleyArgentinaBernardo Dominic RENEWAL
Kaitlin OstroskyJapanOnyama Limba UNQUALIFIED
Greenwood BologniaUnited KingdomAsiya Javayant RENEWAL
Jones VocelkaRussiaStephen Shaw PROPOSAL
Francesco ShinkoIndiaIvan Magalhaes QUALIFIED
Ashley DoeUnited KingdomAnna Fali NEW
Nicolas IturbideJapanAsiya Javayant PROPOSAL
Ivar PaprockiRussiaAsiya Javayant QUALIFIED
Faith GillianFranceOnyama Limba NEGOTIATION
Maria MarrierUnited KingdomAnna Fali PROPOSAL
Aruna FigeroaJapanIoni Bowcher NEW
Silvio SlusarskiJapanIvan Magalhaes NEGOTIATION
Izzy GarufiUnited KingdomStephen Shaw NEGOTIATION
Johnson SergiSpainIoni Bowcher PROPOSAL
Stacey MacleadGermanyOnyama Limba UNQUALIFIED
Johnson SergiArgentinaElwin Sharvill NEW
Alejandro PerinItalyXuxue Feng PROPOSAL
James ButtGermanyBernardo Dominic PROPOSAL
Tony FollerBrazilIoni Bowcher NEGOTIATION
Stacey MacleadRussiaAsiya Javayant NEW
Francesco ShinkoFranceIoni Bowcher RENEWAL
Kaitlin OstroskyUnited KingdomBernardo Dominic NEGOTIATION
Jeanfrancois VenereAustraliaElwin Sharvill PROPOSAL
Octavia MaletRussiaXuxue Feng UNQUALIFIED
Smith GlickArgentinaAsiya Javayant RENEWAL
Stacey MacleadJapanStephen Shaw RENEWAL
Misaki RoysterUnited KingdomBernardo Dominic QUALIFIED
Cody SaylorsArgentinaIvan Magalhaes RENEWAL
Smith GlickBrazilElwin Sharvill PROPOSAL
Octavia MaletCanadaIvan Magalhaes QUALIFIED
Silvio SlusarskiItalyAsiya Javayant UNQUALIFIED
Francesco ShinkoJapanOnyama Limba RENEWAL
Juan WieserAustraliaElwin Sharvill NEGOTIATION
Cody SaylorsArgentinaIoni Bowcher NEGOTIATION
Juan WieserRussiaIoni Bowcher NEGOTIATION
Alejandro PerinFranceStephen Shaw NEGOTIATION
Octavia MaletJapanAnna Fali QUALIFIED
Silvio SlusarskiUnited KingdomIoni Bowcher NEGOTIATION
Darci PoquetteIndiaBernardo Dominic UNQUALIFIED
Jones VocelkaRussiaElwin Sharvill NEW
Maria MarrierItalyAnna Fali RENEWAL
Alejandro PerinAustraliaXuxue Feng PROPOSAL
Rodrigues CampainSpainOnyama Limba UNQUALIFIED
Tony FollerArgentinaOnyama Limba NEW
Adams MorascaItalyAmy Elsner PROPOSAL
Arvin AlbaresFranceAsiya Javayant NEGOTIATION
Leja CaldareraBrazilBernardo Dominic PROPOSAL
Emily WhobreyUnited KingdomAnna Fali NEW
Kadeem FlosiItalyBernardo Dominic UNQUALIFIED
Frozen Columns
Name
Ashley Doe
Rodrigues Campain
Chavez Briddick
Sinclair Waycott
Stacey Maclead
Leja Caldarera
Chavez Briddick
Chavez Briddick
Greenwood Bolognia
Jeanfrancois Venere
Izzy Garufi
Cody Saylors
Juan Wieser
Octavia Malet
Emily Whobrey
Claire Tollner
Murillo Malet
Jeanfrancois Venere
Leja Caldarera
Antonio Caudy
Kaitlin Ostrosky
Darci Poquette
Deepesh Chui
Rodrigues Campain
Kaitlin Ostrosky
Leon Oldroyd
Maria Marrier
Ricardo Gaucho
Darci Poquette
Greenwood Bolognia
Aruna Figeroa
Jones Vocelka
Morrow Ruta
Misaki Royster
Mujtaba Nicka
Adams Morasca
Misaki Royster
Jennifer Amigon
Greenwood Bolognia
Izzy Garufi
Adams Morasca
Juan Wieser
Misaki Royster
Maisha Rulapaugh
Johnson Sergi
Mayumi Kolmetz
Mujtaba Nicka
Kaitlin Ostrosky
Jeanfrancois Venere
Izzy Garufi
IdCountryDate
1000Brazil2026-05-05
1001Italy2026-05-05
1002Russia2026-05-02
1003India2026-04-24
1004France2026-04-26
1005Argentina2026-04-28
1006Spain2026-05-05
1007Spain2026-05-08
1008Russia2026-04-26
1009Argentina2026-05-08
1010Argentina2026-05-08
1011Argentina2026-05-07
1012Australia2026-04-18
1013France2026-04-25
1014Japan2026-04-19
1015Argentina2026-04-15
1016France2026-05-02
1017Germany2026-04-17
1018Russia2026-05-06
1019France2026-05-12
1020Germany2026-04-15
1021Argentina2026-05-05
1022Italy2026-04-17
1023Russia2026-04-15
1024Argentina2026-04-16
1025Germany2026-05-07
1026Germany2026-05-04
1027India2026-05-11
1028Spain2026-04-19
1029Argentina2026-05-09
1030India2026-04-16
1031Brazil2026-05-01
1032India2026-05-10
1033Argentina2026-05-08
1034Italy2026-05-11
1035France2026-04-19
1036Canada2026-04-22
1037Italy2026-05-06
1038Argentina2026-05-08
1039Australia2026-05-09
1040Argentina2026-04-21
1041France2026-04-30
1042France2026-04-29
1043United Kingdom2026-04-21
1044Japan2026-05-04
1045Australia2026-04-22
1046Russia2026-04-15
1047India2026-05-09
1048Australia2026-04-17
1049Russia2026-05-10

On-Demand Data

NameIdCountryDate
Jennifer Amigon1000India2026-05-01
Clifford Rim1001Spain2026-05-11
Morrow Ruta1002Italy2026-04-14
Silvio Slusarski1003Spain2026-04-22
Claire Tollner1004Canada2026-05-05
Kaitlin Ostrosky1005Japan2026-04-17
Johnson Sergi1006United Kingdom2026-05-04
Costa Dilliard1007Australia2026-05-08
Adams Morasca1008Canada2026-05-02
Kadeem Flosi1009India2026-05-11
Juan Wieser1010Italy2026-04-18
Leja Caldarera1011United Kingdom2026-04-23
Salvatore Stockham1012France2026-04-28
Arvin Albares1013India2026-04-19
Kadeem Flosi1014Japan2026-05-11
Deepesh Chui1015Australia2026-05-05
Aruna Figeroa1016United Kingdom2026-04-30
Costa Dilliard1017Spain2026-05-05
Maria Marrier1018United Kingdom2026-04-19
Smith Glick1019Canada2026-04-29
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aika InouyeCanadaStephen Shaw RENEWAL
Ricardo GauchoArgentinaIvan Magalhaes QUALIFIED
Arvin AlbaresFranceIvan Magalhaes PROPOSAL
Darci PoquetteIndiaOnyama Limba RENEWAL
Francesco ShinkoItalyStephen Shaw UNQUALIFIED
Arvin AlbaresSpainIoni Bowcher NEGOTIATION
Claire TollnerCanadaAsiya Javayant RENEWAL
Julie StensethCanadaIvan Magalhaes PROPOSAL
Maisha RulapaughFranceXuxue Feng PROPOSAL
Jeanfrancois VenereArgentinaStephen Shaw NEW
Maisha RulapaughUnited KingdomAnna Fali RENEWAL
Antonio CaudyUnited KingdomXuxue Feng NEW
Maisha RulapaughIndiaStephen Shaw PROPOSAL
Francesco ShinkoFranceIvan Magalhaes NEW
Izzy GarufiUnited KingdomStephen Shaw RENEWAL
Rodrigues CampainIndiaAnna Fali RENEWAL
Tony FollerRussiaAmy Elsner PROPOSAL
Wickens NestleGermanyAsiya Javayant RENEWAL
Emily WhobreyRussiaAnna Fali UNQUALIFIED
Kadeem FlosiAustraliaOnyama Limba QUALIFIED
Antonio CaudyFranceIvan Magalhaes UNQUALIFIED
James ButtItalyStephen Shaw RENEWAL
Tony FollerUnited KingdomElwin Sharvill NEW
Maria MarrierRussiaAmy Elsner UNQUALIFIED
Octavia MaletUnited KingdomIoni Bowcher RENEWAL
Faith GillianRussiaAnna Fali NEW
Deepesh ChuiSpainStephen Shaw NEW
Silvio SlusarskiIndiaXuxue Feng UNQUALIFIED
Aika InouyeItalyBernardo Dominic PROPOSAL
Leja CaldareraItalyXuxue Feng QUALIFIED
Antonio CaudyRussiaIvan Magalhaes NEW
Aika InouyeSpainXuxue Feng PROPOSAL
Maria MarrierAustraliaIvan Magalhaes UNQUALIFIED
David DarakjyUnited KingdomBernardo Dominic NEW
Misaki RoysterFranceAmy Elsner RENEWAL
Leja CaldareraFranceIvan Magalhaes UNQUALIFIED
Julie StensethAustraliaOnyama Limba RENEWAL
Emily WhobreySpainAsiya Javayant RENEWAL
Tony FollerCanadaAnna Fali RENEWAL
Ricardo GauchoGermanyStephen Shaw UNQUALIFIED

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