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
Leon OldroydCanadaXuxue Feng QUALIFIED
Wickens NestleUnited KingdomAsiya Javayant QUALIFIED
Alejandro PerinIndiaIoni Bowcher NEGOTIATION
Misaki RoysterIndiaXuxue Feng RENEWAL
Costa DilliardCanadaStephen Shaw UNQUALIFIED
Leja CaldareraCanadaElwin Sharvill PROPOSAL
Antonio CaudyCanadaStephen Shaw NEW
Faith GillianFranceAmy Elsner NEW
Morrow RutaArgentinaAsiya Javayant UNQUALIFIED
Faith GillianAustraliaIvan Magalhaes UNQUALIFIED
Mujtaba NickaArgentinaIoni Bowcher NEW
Darci PoquetteCanadaBernardo Dominic NEGOTIATION
Deepesh ChuiFranceAnna Fali UNQUALIFIED
Mujtaba NickaSpainAsiya Javayant NEW
Isabel BowleyGermanyStephen Shaw UNQUALIFIED
Costa DilliardAustraliaIoni Bowcher NEGOTIATION
Izzy GarufiUnited KingdomElwin Sharvill NEW
Darci PoquetteSpainAnna Fali RENEWAL
Mujtaba NickaUnited KingdomElwin Sharvill QUALIFIED
David DarakjyAustraliaIvan Magalhaes PROPOSAL
Rodrigues CampainGermanyAsiya Javayant NEW
Leon OldroydRussiaBernardo Dominic QUALIFIED
Jeanfrancois VenereJapanBernardo Dominic PROPOSAL
Darci PoquetteArgentinaOnyama Limba QUALIFIED
Jones VocelkaItalyXuxue Feng QUALIFIED
Mujtaba NickaItalyXuxue Feng QUALIFIED
Alejandro PerinAustraliaOnyama Limba QUALIFIED
Maria MarrierAustraliaOnyama Limba NEW
Adams MorascaJapanStephen Shaw UNQUALIFIED
Jennifer AmigonItalyAnna Fali QUALIFIED
Smith GlickGermanyAsiya Javayant UNQUALIFIED
Ivar PaprockiGermanyAnna Fali NEW
Tony FollerItalyAmy Elsner RENEWAL
Jeanfrancois VenereRussiaXuxue Feng PROPOSAL
Juan WieserArgentinaOnyama Limba PROPOSAL
Ashley DoeCanadaXuxue Feng QUALIFIED
Alejandro PerinArgentinaIvan Magalhaes PROPOSAL
Misaki RoysterItalyXuxue Feng PROPOSAL
Izzy GarufiIndiaIvan Magalhaes NEGOTIATION
Juan WieserUnited KingdomIvan Magalhaes NEGOTIATION
Izzy GarufiItalyIvan Magalhaes NEW
Leja CaldareraGermanyAsiya Javayant NEGOTIATION
Greenwood BologniaItalyAmy Elsner NEGOTIATION
Maria MarrierUnited KingdomAnna Fali NEGOTIATION
Johnson SergiAustraliaAmy Elsner UNQUALIFIED
Leon OldroydSpainBernardo Dominic QUALIFIED
Leon OldroydItalyIoni Bowcher NEW
Jones VocelkaArgentinaAmy Elsner PROPOSAL
Rodrigues CampainRussiaAsiya Javayant QUALIFIED
Sinclair WaycottFranceAnna Fali QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Francesco ShinkoFranceElwin Sharvill RENEWAL
Isabel BowleyAustraliaIoni Bowcher RENEWAL
Jefferson SchemmerBrazilAnna Fali NEGOTIATION
Maria MarrierSpainElwin Sharvill NEW
Misaki RoysterItalyOnyama Limba RENEWAL
Ivar PaprockiRussiaElwin Sharvill PROPOSAL
Maisha RulapaughArgentinaOnyama Limba RENEWAL
Maria MarrierUnited KingdomAmy Elsner NEGOTIATION
Maisha RulapaughIndiaBernardo Dominic NEGOTIATION
Faith GillianCanadaXuxue Feng PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Chavez BriddickArgentina2026-05-25Truhlar And Truhlar Attys PROPOSAL1Ivan Magalhaes
1001Jeanfrancois VenereArgentina2026-05-29Feltz Printing Service PROPOSAL13Elwin Sharvill
1002Wickens NestleFrance2026-05-27Chapman, Ross E Esq UNQUALIFIED17Bernardo Dominic
1003Sinclair WaycottCanada2026-06-14King, Christopher A Esq PROPOSAL56Onyama Limba
1004Antonio CaudyAustralia2026-05-28Commercial Press NEW97Asiya Javayant
1005Deepesh ChuiRussia2026-05-26Dorl, James J Esq PROPOSAL5Ivan Magalhaes
1006Antonio CaudyBrazil2026-06-04Benton, John B Jr UNQUALIFIED79Asiya Javayant
1007Ashley DoeArgentina2026-06-14Commercial Press RENEWAL52Anna Fali
1008Isabel BowleyUnited Kingdom2026-06-02Feltz Printing Service PROPOSAL45Asiya Javayant
1009Kadeem FlosiArgentina2026-05-22Morlong Associates NEW71Amy Elsner
1010Kaitlin OstroskyJapan2026-05-22Commercial Press PROPOSAL68Amy Elsner
1011Leja CaldareraSpain2026-05-22Morlong Associates QUALIFIED62Asiya Javayant
1012Juan WieserItaly2026-05-23Printing Dimensions NEGOTIATION18Elwin Sharvill
1013Tony FollerJapan2026-05-20Truhlar And Truhlar Attys RENEWAL81Ioni Bowcher
1014Faith GillianJapan2026-05-26Printing Dimensions QUALIFIED88Elwin Sharvill
1015Leon OldroydFrance2026-06-09Feiner Bros NEW88Elwin Sharvill
1016Greenwood BologniaSpain2026-06-07Chanay, Jeffrey A Esq NEW86Elwin Sharvill
1017Emily WhobreySpain2026-05-28Benton, John B Jr RENEWAL12Ivan Magalhaes
1018Sinclair WaycottGermany2026-05-23Morlong Associates NEGOTIATION19Xuxue Feng
1019David DarakjyRussia2026-06-06Rangoni Of Florence PROPOSAL13Anna Fali
1020Darci PoquetteUnited Kingdom2026-06-15Benton, John B Jr NEW73Xuxue Feng
1021Antonio CaudyGermany2026-06-02Chapman, Ross E Esq NEGOTIATION40Stephen Shaw
1022Jefferson SchemmerArgentina2026-06-17Printing Dimensions QUALIFIED57Onyama Limba
1023Salvatore StockhamAustralia2026-06-01Feltz Printing Service PROPOSAL4Xuxue Feng
1024Johnson SergiGermany2026-06-04Chemel, James L Cpa NEGOTIATION69Ioni Bowcher
1025Salvatore StockhamIndia2026-06-07Feltz Printing Service NEGOTIATION66Amy Elsner
1026Mujtaba NickaUnited Kingdom2026-05-24Chapman, Ross E Esq PROPOSAL63Amy Elsner
1027Deepesh ChuiCanada2026-05-25Rangoni Of Florence NEGOTIATION42Onyama Limba
1028Costa DilliardGermany2026-05-28Printing Dimensions NEGOTIATION99Asiya Javayant
1029Stacey MacleadIndia2026-06-08Printing Dimensions RENEWAL36Amy Elsner
1030Francesco ShinkoGermany2026-06-11Chapman, Ross E Esq RENEWAL55Xuxue Feng
1031Jones VocelkaGermany2026-05-29Rangoni Of Florence UNQUALIFIED63Bernardo Dominic
1032Octavia MaletUnited Kingdom2026-05-22Rangoni Of Florence PROPOSAL26Anna Fali
1033Darci PoquetteSpain2026-06-06Benton, John B Jr UNQUALIFIED5Ioni Bowcher
1034Faith GillianItaly2026-05-25Printing Dimensions PROPOSAL24Amy Elsner
1035Darci PoquetteFrance2026-05-20Feiner Bros NEGOTIATION35Stephen Shaw
1036Aika InouyeUnited Kingdom2026-06-04Feiner Bros RENEWAL88Asiya Javayant
1037Jones VocelkaItaly2026-06-06Chanay, Jeffrey A Esq PROPOSAL64Onyama Limba
1038Francesco ShinkoCanada2026-06-04Chanay, Jeffrey A Esq PROPOSAL73Onyama Limba
1039Jefferson SchemmerBrazil2026-05-20Benton, John B Jr RENEWAL9Amy Elsner
1040Ivar PaprockiIndia2026-05-28Buckley Miller Wright QUALIFIED39Ioni Bowcher
1041Murillo MaletRussia2026-06-07Rousseaux, Michael Esq QUALIFIED73Stephen Shaw
1042Jeanfrancois VenereIndia2026-05-31Feiner Bros RENEWAL54Amy Elsner
1043Julie StensethCanada2026-06-07Rangoni Of Florence RENEWAL2Ioni Bowcher
1044Morrow RutaItaly2026-06-07Benton, John B Jr RENEWAL5Bernardo Dominic
1045Smith GlickSpain2026-06-09Buckley Miller Wright RENEWAL84Stephen Shaw
1046James ButtJapan2026-06-16Benton, John B Jr NEW59Elwin Sharvill
1047Mayumi KolmetzGermany2026-06-01Rangoni Of Florence NEW91Xuxue Feng
1048Misaki RoysterUnited Kingdom2026-06-13Printing Dimensions RENEWAL25Bernardo Dominic
1049Kadeem FlosiFrance2026-06-09Truhlar And Truhlar Attys NEGOTIATION28Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Jones VocelkaUnited KingdomIoni Bowcher NEGOTIATION
Juan WieserRussiaIvan Magalhaes UNQUALIFIED
Aditya KuskoFranceBernardo Dominic NEGOTIATION
Morrow RutaBrazilIvan Magalhaes NEGOTIATION
Munro FerenczSpainBernardo Dominic PROPOSAL
Octavia MaletAustraliaAnna Fali QUALIFIED
Adams MorascaCanadaBernardo Dominic UNQUALIFIED
Wickens NestleAustraliaXuxue Feng NEW
Darci PoquetteBrazilStephen Shaw UNQUALIFIED
Mujtaba NickaSpainOnyama Limba QUALIFIED
Misaki RoysterCanadaAsiya Javayant QUALIFIED
David DarakjyItalyAnna Fali QUALIFIED
Jones VocelkaFranceIvan Magalhaes PROPOSAL
Wickens NestleIndiaOnyama Limba NEW
Deepesh ChuiArgentinaStephen Shaw UNQUALIFIED
Francesco ShinkoSpainXuxue Feng PROPOSAL
Deepesh ChuiSpainAnna Fali RENEWAL
Ricardo GauchoUnited KingdomElwin Sharvill UNQUALIFIED
Smith GlickRussiaBernardo Dominic NEGOTIATION
Jeanfrancois VenereIndiaElwin Sharvill NEW
Alejandro PerinBrazilStephen Shaw RENEWAL
Chavez BriddickCanadaBernardo Dominic UNQUALIFIED
Cody SaylorsArgentinaXuxue Feng NEW
Cody SaylorsUnited KingdomAsiya Javayant QUALIFIED
Alejandro PerinRussiaIvan Magalhaes PROPOSAL
Kadeem FlosiAustraliaAnna Fali RENEWAL
Jefferson SchemmerBrazilXuxue Feng RENEWAL
Nicolas IturbideItalyIoni Bowcher UNQUALIFIED
Costa DilliardJapanAsiya Javayant NEGOTIATION
Kadeem FlosiArgentinaIvan Magalhaes RENEWAL
Aditya KuskoBrazilIoni Bowcher PROPOSAL
Ivar PaprockiAustraliaStephen Shaw QUALIFIED
Morrow RutaGermanyIoni Bowcher NEW
Aruna FigeroaFranceXuxue Feng PROPOSAL
Emily WhobreyGermanyBernardo Dominic RENEWAL
Cody SaylorsArgentinaXuxue Feng NEGOTIATION
Francesco ShinkoItalyAmy Elsner UNQUALIFIED
Leon OldroydItalyStephen Shaw NEGOTIATION
Misaki RoysterArgentinaXuxue Feng NEW
Nicolas IturbideFranceXuxue Feng UNQUALIFIED
Ricardo GauchoCanadaAnna Fali RENEWAL
Ricardo GauchoSpainIvan Magalhaes RENEWAL
Maisha RulapaughCanadaElwin Sharvill QUALIFIED
Kaitlin OstroskyArgentinaOnyama Limba NEGOTIATION
Morrow RutaIndiaElwin Sharvill RENEWAL
Leja CaldareraItalyIoni Bowcher RENEWAL
Izzy GarufiSpainStephen Shaw PROPOSAL
Emily WhobreyArgentinaAsiya Javayant NEW
Silvio SlusarskiCanadaAnna Fali UNQUALIFIED
Emily WhobreyFranceAmy Elsner QUALIFIED
Frozen Columns
Name
Munro Ferencz
David Darakjy
Izzy Garufi
Deepesh Chui
Aika Inouye
Stacey Maclead
Darci Poquette
Chavez Briddick
Jennifer Amigon
James Butt
Claire Tollner
Tony Foller
Clifford Rim
Morrow Ruta
Arvin Albares
Deepesh Chui
Mayumi Kolmetz
Rodrigues Campain
Alejandro Perin
Jeanfrancois Venere
Jennifer Amigon
Mayumi Kolmetz
Chavez Briddick
Kadeem Flosi
Salvatore Stockham
David Darakjy
Deepesh Chui
Alejandro Perin
Morrow Ruta
Greenwood Bolognia
Salvatore Stockham
Deepesh Chui
Tony Foller
Isabel Bowley
Ricardo Gaucho
Nicolas Iturbide
Adams Morasca
Darci Poquette
Antonio Caudy
Cody Saylors
Izzy Garufi
Ashley Doe
Chavez Briddick
Maisha Rulapaugh
Leja Caldarera
Sinclair Waycott
Mayumi Kolmetz
Chavez Briddick
Francesco Shinko
James Butt
IdCountryDate
1000France2026-06-15
1001Argentina2026-05-27
1002India2026-06-01
1003Spain2026-05-21
1004United Kingdom2026-05-25
1005Australia2026-06-11
1006Spain2026-06-12
1007Canada2026-06-02
1008Argentina2026-06-05
1009Spain2026-05-31
1010Argentina2026-05-26
1011India2026-06-16
1012Japan2026-06-06
1013Australia2026-05-31
1014France2026-06-16
1015Argentina2026-06-17
1016Australia2026-05-21
1017Spain2026-06-04
1018Australia2026-06-08
1019Italy2026-05-31
1020United Kingdom2026-06-04
1021France2026-06-02
1022Canada2026-06-10
1023Argentina2026-06-18
1024India2026-05-28
1025Italy2026-05-25
1026Spain2026-06-05
1027Japan2026-05-22
1028Argentina2026-06-09
1029Canada2026-05-31
1030India2026-06-18
1031India2026-05-29
1032France2026-06-05
1033Canada2026-06-10
1034Japan2026-06-01
1035Russia2026-06-08
1036Brazil2026-05-21
1037Spain2026-05-25
1038Italy2026-06-09
1039France2026-05-27
1040Russia2026-06-09
1041France2026-06-04
1042Japan2026-06-16
1043Italy2026-05-30
1044Spain2026-06-14
1045Russia2026-05-28
1046Italy2026-05-31
1047France2026-05-22
1048Japan2026-06-10
1049Japan2026-05-27

On-Demand Data

NameIdCountryDate
Ivar Paprocki1000United Kingdom2026-06-06
Julie Stenseth1001Australia2026-05-26
Murillo Malet1002Italy2026-05-27
Kadeem Flosi1003Italy2026-06-05
Octavia Malet1004France2026-05-27
Sinclair Waycott1005France2026-05-22
Juan Wieser1006Spain2026-05-21
Leon Oldroyd1007Spain2026-05-30
Stacey Maclead1008Japan2026-06-14
Emily Whobrey1009Argentina2026-05-26
Munro Ferencz1010Germany2026-06-10
Maisha Rulapaugh1011United Kingdom2026-05-20
Costa Dilliard1012Spain2026-05-23
Juan Wieser1013Australia2026-05-25
Faith Gillian1014Canada2026-06-02
Ricardo Gaucho1015Australia2026-05-25
Murillo Malet1016France2026-06-18
Chavez Briddick1017United Kingdom2026-06-11
Smith Glick1018Italy2026-06-17
Aruna Figeroa1019Canada2026-06-17
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Mayumi KolmetzBrazilIvan Magalhaes NEW
Kaitlin OstroskyCanadaIvan Magalhaes UNQUALIFIED
Izzy GarufiJapanIoni Bowcher UNQUALIFIED
David DarakjyIndiaOnyama Limba NEW
Costa DilliardArgentinaElwin Sharvill NEW
Stacey MacleadBrazilAmy Elsner NEW
Jennifer AmigonCanadaXuxue Feng RENEWAL
Greenwood BologniaGermanyElwin Sharvill NEGOTIATION
Jones VocelkaUnited KingdomStephen Shaw UNQUALIFIED
Adams MorascaRussiaElwin Sharvill UNQUALIFIED
Aditya KuskoGermanyIvan Magalhaes NEW
Maria MarrierCanadaXuxue Feng NEW
Munro FerenczItalyBernardo Dominic NEGOTIATION
David DarakjyAustraliaAmy Elsner UNQUALIFIED
Aditya KuskoSpainXuxue Feng NEW
Leja CaldareraGermanyBernardo Dominic QUALIFIED
Isabel BowleyJapanAmy Elsner RENEWAL
Sinclair WaycottAustraliaBernardo Dominic NEGOTIATION
Murillo MaletItalyIvan Magalhaes NEW
Wickens NestleIndiaIoni Bowcher NEGOTIATION
Darci PoquetteUnited KingdomBernardo Dominic RENEWAL
Isabel BowleyIndiaAsiya Javayant RENEWAL
Misaki RoysterAustraliaIoni Bowcher RENEWAL
Clifford RimGermanyStephen Shaw QUALIFIED
Emily WhobreyArgentinaAnna Fali NEGOTIATION
Jeanfrancois VenereAustraliaBernardo Dominic RENEWAL
Maisha RulapaughUnited KingdomXuxue Feng NEW
Greenwood BologniaRussiaIoni Bowcher NEW
Chavez BriddickUnited KingdomXuxue Feng NEGOTIATION
Murillo MaletFranceElwin Sharvill NEGOTIATION
Ivar PaprockiFranceIvan Magalhaes UNQUALIFIED
Leon OldroydSpainBernardo Dominic NEGOTIATION
Octavia MaletBrazilAmy Elsner PROPOSAL
Izzy GarufiArgentinaIvan Magalhaes PROPOSAL
Darci PoquetteFranceElwin Sharvill RENEWAL
Mujtaba NickaRussiaAnna Fali RENEWAL
Ashley DoeItalyIoni Bowcher NEW
Smith GlickSpainAsiya Javayant RENEWAL
Aditya KuskoRussiaIoni Bowcher NEGOTIATION
David DarakjySpainXuxue Feng 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>