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
Juan WieserSpainBernardo Dominic QUALIFIED
Maisha RulapaughCanadaXuxue Feng NEGOTIATION
Ricardo GauchoUnited KingdomIvan Magalhaes NEGOTIATION
Greenwood BologniaItalyStephen Shaw RENEWAL
Silvio SlusarskiCanadaStephen Shaw UNQUALIFIED
Francesco ShinkoItalyAmy Elsner PROPOSAL
Clifford RimBrazilElwin Sharvill PROPOSAL
Jeanfrancois VenereUnited KingdomOnyama Limba RENEWAL
Smith GlickGermanyAmy Elsner NEGOTIATION
Maisha RulapaughRussiaAsiya Javayant NEGOTIATION
David DarakjySpainXuxue Feng NEGOTIATION
Ashley DoeItalyStephen Shaw NEW
Jefferson SchemmerSpainOnyama Limba NEGOTIATION
Silvio SlusarskiArgentinaIoni Bowcher NEW
Claire TollnerAustraliaAnna Fali QUALIFIED
Arvin AlbaresUnited KingdomAsiya Javayant PROPOSAL
Octavia MaletBrazilAsiya Javayant NEW
Salvatore StockhamUnited KingdomXuxue Feng QUALIFIED
Jeanfrancois VenereUnited KingdomAnna Fali UNQUALIFIED
James ButtBrazilIoni Bowcher NEGOTIATION
Deepesh ChuiArgentinaXuxue Feng UNQUALIFIED
Clifford RimCanadaAsiya Javayant NEGOTIATION
Ivar PaprockiSpainIvan Magalhaes PROPOSAL
Faith GillianAustraliaElwin Sharvill NEGOTIATION
Ashley DoeItalyIoni Bowcher NEGOTIATION
James ButtRussiaXuxue Feng NEW
Arvin AlbaresIndiaAnna Fali RENEWAL
Costa DilliardGermanyStephen Shaw NEW
Cody SaylorsCanadaOnyama Limba QUALIFIED
Juan WieserJapanXuxue Feng RENEWAL
Alejandro PerinIndiaIvan Magalhaes NEGOTIATION
Isabel BowleySpainBernardo Dominic QUALIFIED
Emily WhobreyJapanAsiya Javayant UNQUALIFIED
Murillo MaletJapanElwin Sharvill UNQUALIFIED
Munro FerenczRussiaStephen Shaw NEGOTIATION
Rodrigues CampainItalyAsiya Javayant PROPOSAL
Aika InouyeRussiaAmy Elsner RENEWAL
Arvin AlbaresArgentinaAsiya Javayant RENEWAL
Leon OldroydItalyIoni Bowcher UNQUALIFIED
Salvatore StockhamSpainOnyama Limba QUALIFIED
Johnson SergiSpainIoni Bowcher UNQUALIFIED
Ashley DoeGermanyIoni Bowcher NEW
Francesco ShinkoJapanBernardo Dominic QUALIFIED
Izzy GarufiBrazilXuxue Feng NEW
Costa DilliardSpainBernardo Dominic NEGOTIATION
Misaki RoysterAustraliaOnyama Limba NEGOTIATION
Mayumi KolmetzJapanOnyama Limba UNQUALIFIED
Isabel BowleyItalyXuxue Feng NEGOTIATION
Jefferson SchemmerGermanyStephen Shaw UNQUALIFIED
Adams MorascaArgentinaOnyama Limba NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Jennifer AmigonIndiaAsiya Javayant NEGOTIATION
Darci PoquetteRussiaIvan Magalhaes QUALIFIED
Maria MarrierSpainAnna Fali QUALIFIED
Deepesh ChuiUnited KingdomOnyama Limba RENEWAL
Adams MorascaIndiaElwin Sharvill NEW
Isabel BowleyItalyAsiya Javayant NEGOTIATION
Mujtaba NickaIndiaStephen Shaw UNQUALIFIED
Faith GillianIndiaIoni Bowcher PROPOSAL
Alejandro PerinItalyAnna Fali UNQUALIFIED
Faith GillianCanadaAmy Elsner NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Jones VocelkaUnited Kingdom2025-10-10Feiner Bros UNQUALIFIED46Stephen Shaw
1001Misaki RoysterUnited Kingdom2025-10-21Chapman, Ross E Esq NEW52Asiya Javayant
1002Kadeem FlosiBrazil2025-09-27Dorl, James J Esq NEGOTIATION7Anna Fali
1003Adams MorascaBrazil2025-10-09Truhlar And Truhlar Attys PROPOSAL77Anna Fali
1004Costa DilliardAustralia2025-10-04Rangoni Of Florence NEGOTIATION84Xuxue Feng
1005Izzy GarufiArgentina2025-10-01Chemel, James L Cpa RENEWAL24Xuxue Feng
1006Kaitlin OstroskyGermany2025-10-11Benton, John B Jr NEGOTIATION63Amy Elsner
1007Stacey MacleadSpain2025-09-27Rangoni Of Florence NEGOTIATION9Onyama Limba
1008Maisha RulapaughFrance2025-10-21Chanay, Jeffrey A Esq NEGOTIATION57Stephen Shaw
1009Darci PoquetteRussia2025-10-19King, Christopher A Esq RENEWAL26Ivan Magalhaes
1010Ivar PaprockiUnited Kingdom2025-09-27Rousseaux, Michael Esq NEW67Xuxue Feng
1011Morrow RutaArgentina2025-10-10Morlong Associates RENEWAL43Asiya Javayant
1012Adams MorascaCanada2025-10-04King, Christopher A Esq NEW72Stephen Shaw
1013Morrow RutaBrazil2025-09-28Chapman, Ross E Esq RENEWAL47Xuxue Feng
1014Sinclair WaycottAustralia2025-10-02Rousseaux, Michael Esq PROPOSAL82Ioni Bowcher
1015Kadeem FlosiUnited Kingdom2025-09-27Morlong Associates UNQUALIFIED86Stephen Shaw
1016Maisha RulapaughFrance2025-09-28Truhlar And Truhlar Attys PROPOSAL16Ivan Magalhaes
1017Clifford RimFrance2025-10-04Chanay, Jeffrey A Esq RENEWAL81Ivan Magalhaes
1018Murillo MaletUnited Kingdom2025-09-30Rousseaux, Michael Esq NEGOTIATION81Xuxue Feng
1019Costa DilliardJapan2025-10-02Feiner Bros NEW55Stephen Shaw
1020Izzy GarufiUnited Kingdom2025-10-05Truhlar And Truhlar Attys QUALIFIED64Onyama Limba
1021Arvin AlbaresUnited Kingdom2025-10-21Chanay, Jeffrey A Esq NEW45Xuxue Feng
1022Octavia MaletArgentina2025-10-02Rousseaux, Michael Esq UNQUALIFIED21Ioni Bowcher
1023Leon OldroydUnited Kingdom2025-10-03Rangoni Of Florence PROPOSAL5Xuxue Feng
1024Sinclair WaycottRussia2025-09-30Dorl, James J Esq QUALIFIED12Elwin Sharvill
1025Arvin AlbaresItaly2025-10-16King, Christopher A Esq NEW60Xuxue Feng
1026Salvatore StockhamUnited Kingdom2025-10-08Commercial Press NEW86Stephen Shaw
1027Francesco ShinkoItaly2025-10-15Chapman, Ross E Esq PROPOSAL98Amy Elsner
1028Rodrigues CampainUnited Kingdom2025-10-21Feltz Printing Service PROPOSAL33Asiya Javayant
1029Aika InouyeAustralia2025-10-22Truhlar And Truhlar Attys PROPOSAL90Xuxue Feng
1030Jefferson SchemmerGermany2025-10-07Feltz Printing Service PROPOSAL38Elwin Sharvill
1031Cody SaylorsBrazil2025-10-17Morlong Associates RENEWAL26Xuxue Feng
1032Cody SaylorsJapan2025-09-24Morlong Associates RENEWAL33Xuxue Feng
1033Jennifer AmigonUnited Kingdom2025-09-25Commercial Press PROPOSAL50Amy Elsner
1034Jeanfrancois VenereAustralia2025-10-20Feiner Bros NEGOTIATION82Bernardo Dominic
1035Sinclair WaycottItaly2025-10-12Feiner Bros NEW33Asiya Javayant
1036Kadeem FlosiFrance2025-10-12Chanay, Jeffrey A Esq UNQUALIFIED36Stephen Shaw
1037Leon OldroydIndia2025-10-21Buckley Miller Wright UNQUALIFIED73Onyama Limba
1038Chavez BriddickGermany2025-10-14King, Christopher A Esq RENEWAL73Bernardo Dominic
1039Ricardo GauchoRussia2025-10-18Morlong Associates PROPOSAL72Elwin Sharvill
1040Maisha RulapaughCanada2025-10-08Rousseaux, Michael Esq NEW73Elwin Sharvill
1041Sinclair WaycottRussia2025-10-05Rousseaux, Michael Esq QUALIFIED7Anna Fali
1042Alejandro PerinJapan2025-10-10Commercial Press PROPOSAL71Amy Elsner
1043James ButtGermany2025-10-16Benton, John B Jr UNQUALIFIED71Xuxue Feng
1044Francesco ShinkoFrance2025-10-11Dorl, James J Esq UNQUALIFIED81Elwin Sharvill
1045Maria MarrierItaly2025-10-02Rangoni Of Florence QUALIFIED35Ivan Magalhaes
1046Silvio SlusarskiItaly2025-10-03Rangoni Of Florence RENEWAL70Xuxue Feng
1047Julie StensethUnited Kingdom2025-10-02Rousseaux, Michael Esq NEGOTIATION98Asiya Javayant
1048Munro FerenczBrazil2025-10-11Commercial Press UNQUALIFIED38Bernardo Dominic
1049Francesco ShinkoBrazil2025-09-26Morlong Associates RENEWAL47Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Ricardo GauchoBrazilAsiya Javayant QUALIFIED
Murillo MaletAustraliaAmy Elsner NEW
Izzy GarufiIndiaAmy Elsner UNQUALIFIED
Clifford RimBrazilOnyama Limba PROPOSAL
Francesco ShinkoGermanyAsiya Javayant UNQUALIFIED
David DarakjySpainXuxue Feng RENEWAL
Jennifer AmigonIndiaXuxue Feng UNQUALIFIED
Aruna FigeroaArgentinaAsiya Javayant QUALIFIED
Jones VocelkaGermanyAmy Elsner RENEWAL
Kadeem FlosiAustraliaIoni Bowcher RENEWAL
Leja CaldareraIndiaOnyama Limba UNQUALIFIED
Salvatore StockhamGermanyIvan Magalhaes UNQUALIFIED
Mayumi KolmetzJapanStephen Shaw UNQUALIFIED
Morrow RutaSpainXuxue Feng RENEWAL
Aruna FigeroaAustraliaXuxue Feng RENEWAL
Jeanfrancois VenereFranceIoni Bowcher UNQUALIFIED
Adams MorascaRussiaOnyama Limba UNQUALIFIED
Alejandro PerinSpainStephen Shaw RENEWAL
Leon OldroydIndiaElwin Sharvill QUALIFIED
Aika InouyeIndiaElwin Sharvill RENEWAL
Clifford RimGermanyIoni Bowcher QUALIFIED
Morrow RutaFranceIvan Magalhaes QUALIFIED
Morrow RutaArgentinaIvan Magalhaes PROPOSAL
Murillo MaletBrazilAmy Elsner NEGOTIATION
Claire TollnerIndiaAnna Fali PROPOSAL
Jeanfrancois VenereBrazilAnna Fali RENEWAL
Maria MarrierIndiaAsiya Javayant QUALIFIED
Sinclair WaycottItalyBernardo Dominic NEW
Isabel BowleyRussiaBernardo Dominic PROPOSAL
Ricardo GauchoFranceBernardo Dominic NEW
Wickens NestleFranceStephen Shaw NEGOTIATION
Salvatore StockhamItalyAnna Fali NEGOTIATION
Munro FerenczJapanBernardo Dominic QUALIFIED
Munro FerenczFranceAsiya Javayant RENEWAL
Adams MorascaAustraliaAsiya Javayant NEW
Sinclair WaycottJapanBernardo Dominic NEW
Jennifer AmigonIndiaStephen Shaw RENEWAL
Morrow RutaFranceElwin Sharvill UNQUALIFIED
James ButtCanadaElwin Sharvill UNQUALIFIED
Juan WieserIndiaXuxue Feng UNQUALIFIED
Faith GillianRussiaAmy Elsner PROPOSAL
Cody SaylorsUnited KingdomStephen Shaw PROPOSAL
Silvio SlusarskiBrazilIoni Bowcher UNQUALIFIED
Munro FerenczIndiaBernardo Dominic NEGOTIATION
Morrow RutaSpainIvan Magalhaes RENEWAL
Kaitlin OstroskyIndiaElwin Sharvill NEW
Antonio CaudyArgentinaAsiya Javayant PROPOSAL
Kadeem FlosiBrazilAsiya Javayant QUALIFIED
Leja CaldareraFranceXuxue Feng NEGOTIATION
Jeanfrancois VenereAustraliaStephen Shaw RENEWAL
Frozen Columns
Name
Johnson Sergi
Octavia Malet
Tony Foller
Darci Poquette
Johnson Sergi
Ashley Doe
Morrow Ruta
Izzy Garufi
Jeanfrancois Venere
Misaki Royster
Nicolas Iturbide
Chavez Briddick
Kadeem Flosi
Morrow Ruta
Claire Tollner
Jefferson Schemmer
Ivar Paprocki
Juan Wieser
Stacey Maclead
Costa Dilliard
Stacey Maclead
Juan Wieser
Izzy Garufi
Jeanfrancois Venere
Chavez Briddick
Ivar Paprocki
Aditya Kusko
Julie Stenseth
Stacey Maclead
Maisha Rulapaugh
Cody Saylors
Chavez Briddick
Juan Wieser
Aika Inouye
Tony Foller
Leja Caldarera
Claire Tollner
Misaki Royster
Morrow Ruta
David Darakjy
Aditya Kusko
Nicolas Iturbide
Munro Ferencz
Kaitlin Ostrosky
Mayumi Kolmetz
Leon Oldroyd
Izzy Garufi
Maria Marrier
Nicolas Iturbide
Nicolas Iturbide
IdCountryDate
1000Russia2025-10-03
1001Japan2025-09-30
1002India2025-10-09
1003Russia2025-10-11
1004Italy2025-10-01
1005Spain2025-09-30
1006Japan2025-10-06
1007Spain2025-09-26
1008Australia2025-10-21
1009India2025-10-18
1010Russia2025-10-01
1011United Kingdom2025-10-15
1012Russia2025-09-29
1013Argentina2025-10-09
1014Canada2025-10-16
1015United Kingdom2025-10-22
1016Brazil2025-10-23
1017Japan2025-09-25
1018Canada2025-10-06
1019Italy2025-10-12
1020Canada2025-10-23
1021Canada2025-10-02
1022Australia2025-09-26
1023Australia2025-10-01
1024France2025-10-07
1025Italy2025-10-08
1026Australia2025-10-08
1027Italy2025-09-26
1028Germany2025-10-06
1029Argentina2025-09-28
1030Japan2025-10-05
1031Russia2025-10-09
1032Spain2025-09-24
1033Argentina2025-10-07
1034Russia2025-10-09
1035Germany2025-09-25
1036Russia2025-09-28
1037Brazil2025-10-15
1038Italy2025-10-19
1039United Kingdom2025-10-05
1040Brazil2025-09-24
1041Brazil2025-10-11
1042Russia2025-10-14
1043Argentina2025-09-30
1044France2025-10-08
1045Japan2025-09-26
1046Japan2025-09-30
1047Spain2025-09-24
1048Argentina2025-10-02
1049India2025-10-07

On-Demand Data

NameIdCountryDate
Chavez Briddick1000India2025-10-21
Cody Saylors1001Canada2025-10-09
Francesco Shinko1002Italy2025-10-20
Murillo Malet1003France2025-10-19
Jennifer Amigon1004France2025-10-08
Jeanfrancois Venere1005Italy2025-10-06
Izzy Garufi1006Spain2025-09-24
Salvatore Stockham1007France2025-10-09
Aruna Figeroa1008United Kingdom2025-10-10
Sinclair Waycott1009Russia2025-10-04
Costa Dilliard1010United Kingdom2025-10-21
Mayumi Kolmetz1011United Kingdom2025-10-04
Alejandro Perin1012India2025-10-04
Ricardo Gaucho1013Russia2025-09-30
Francesco Shinko1014Argentina2025-10-17
Julie Stenseth1015Australia2025-10-08
Faith Gillian1016India2025-10-10
Juan Wieser1017Australia2025-10-01
Jennifer Amigon1018Spain2025-10-21
Adams Morasca1019Brazil2025-10-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Greenwood BologniaRussiaBernardo Dominic QUALIFIED
Salvatore StockhamCanadaBernardo Dominic NEGOTIATION
Morrow RutaItalyElwin Sharvill PROPOSAL
Smith GlickUnited KingdomAmy Elsner QUALIFIED
Jones VocelkaArgentinaIvan Magalhaes RENEWAL
Rodrigues CampainGermanyAnna Fali UNQUALIFIED
Morrow RutaItalyAmy Elsner NEGOTIATION
Mayumi KolmetzUnited KingdomElwin Sharvill QUALIFIED
Arvin AlbaresGermanyXuxue Feng NEW
Sinclair WaycottSpainStephen Shaw NEGOTIATION
Deepesh ChuiCanadaAsiya Javayant QUALIFIED
Maisha RulapaughBrazilOnyama Limba NEGOTIATION
Jeanfrancois VenereCanadaAnna Fali RENEWAL
Leon OldroydFranceAsiya Javayant RENEWAL
Ashley DoeSpainAsiya Javayant NEGOTIATION
Nicolas IturbideItalyAsiya Javayant QUALIFIED
Francesco ShinkoFranceXuxue Feng NEGOTIATION
Francesco ShinkoRussiaElwin Sharvill PROPOSAL
Aditya KuskoJapanOnyama Limba NEGOTIATION
Munro FerenczUnited KingdomXuxue Feng NEW
Aditya KuskoItalyAmy Elsner RENEWAL
Adams MorascaBrazilAmy Elsner QUALIFIED
Aruna FigeroaUnited KingdomOnyama Limba NEGOTIATION
Tony FollerAustraliaIoni Bowcher RENEWAL
Aika InouyeUnited KingdomAnna Fali NEW
Maisha RulapaughArgentinaAsiya Javayant UNQUALIFIED
James ButtBrazilAmy Elsner NEGOTIATION
Emily WhobreyUnited KingdomStephen Shaw UNQUALIFIED
Morrow RutaItalyStephen Shaw RENEWAL
Morrow RutaFranceIvan Magalhaes QUALIFIED
Emily WhobreySpainElwin Sharvill PROPOSAL
Ashley DoeGermanyIoni Bowcher QUALIFIED
Arvin AlbaresCanadaAmy Elsner RENEWAL
Silvio SlusarskiArgentinaBernardo Dominic RENEWAL
Francesco ShinkoUnited KingdomStephen Shaw RENEWAL
Juan WieserFranceStephen Shaw NEW
Juan WieserRussiaAnna Fali UNQUALIFIED
Faith GillianSpainBernardo Dominic NEGOTIATION
Adams MorascaBrazilBernardo Dominic PROPOSAL
Octavia MaletSpainIoni Bowcher NEGOTIATION

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