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
Salvatore StockhamIndiaAsiya Javayant RENEWAL
Kadeem FlosiFranceAnna Fali RENEWAL
Jennifer AmigonItalyAmy Elsner NEGOTIATION
Jones VocelkaCanadaIvan Magalhaes UNQUALIFIED
Aika InouyeIndiaStephen Shaw PROPOSAL
Leon OldroydCanadaAmy Elsner RENEWAL
Darci PoquetteCanadaElwin Sharvill UNQUALIFIED
Julie StensethArgentinaAmy Elsner RENEWAL
Leja CaldareraCanadaXuxue Feng QUALIFIED
Misaki RoysterCanadaAnna Fali PROPOSAL
Adams MorascaJapanStephen Shaw UNQUALIFIED
Arvin AlbaresAustraliaStephen Shaw RENEWAL
Johnson SergiItalyIvan Magalhaes NEGOTIATION
Ivar PaprockiIndiaElwin Sharvill PROPOSAL
Wickens NestleFranceAsiya Javayant NEGOTIATION
Johnson SergiUnited KingdomAnna Fali RENEWAL
Francesco ShinkoAustraliaAsiya Javayant NEW
Leja CaldareraBrazilBernardo Dominic QUALIFIED
Murillo MaletBrazilAsiya Javayant UNQUALIFIED
Alejandro PerinSpainXuxue Feng NEGOTIATION
Mayumi KolmetzUnited KingdomIoni Bowcher PROPOSAL
Aditya KuskoItalyElwin Sharvill RENEWAL
Darci PoquetteAustraliaIvan Magalhaes NEW
Alejandro PerinRussiaBernardo Dominic NEW
Costa DilliardGermanyAmy Elsner PROPOSAL
Octavia MaletJapanIoni Bowcher NEW
Antonio CaudyArgentinaElwin Sharvill NEW
Kadeem FlosiGermanyAnna Fali RENEWAL
Aditya KuskoBrazilIvan Magalhaes QUALIFIED
Cody SaylorsUnited KingdomBernardo Dominic QUALIFIED
Jones VocelkaItalyIoni Bowcher NEGOTIATION
Sinclair WaycottAustraliaBernardo Dominic QUALIFIED
Deepesh ChuiArgentinaElwin Sharvill QUALIFIED
Aditya KuskoFranceXuxue Feng RENEWAL
Kadeem FlosiIndiaXuxue Feng QUALIFIED
Octavia MaletSpainAmy Elsner UNQUALIFIED
Izzy GarufiUnited KingdomAsiya Javayant NEGOTIATION
Emily WhobreySpainAmy Elsner UNQUALIFIED
Arvin AlbaresCanadaStephen Shaw RENEWAL
Aika InouyeAustraliaIoni Bowcher NEW
Aika InouyeJapanIoni Bowcher PROPOSAL
Isabel BowleyRussiaBernardo Dominic RENEWAL
Juan WieserAustraliaIvan Magalhaes QUALIFIED
Johnson SergiItalyAmy Elsner PROPOSAL
Nicolas IturbideRussiaElwin Sharvill NEGOTIATION
Stacey MacleadFranceIvan Magalhaes NEGOTIATION
Aditya KuskoIndiaAnna Fali UNQUALIFIED
Aruna FigeroaCanadaAmy Elsner RENEWAL
Stacey MacleadCanadaAmy Elsner RENEWAL
Deepesh ChuiFranceBernardo Dominic QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Ashley DoeBrazilAsiya Javayant RENEWAL
Cody SaylorsUnited KingdomStephen Shaw UNQUALIFIED
Wickens NestleSpainIoni Bowcher NEW
Smith GlickSpainAsiya Javayant PROPOSAL
Antonio CaudyJapanAsiya Javayant PROPOSAL
Chavez BriddickRussiaAsiya Javayant RENEWAL
Deepesh ChuiGermanyXuxue Feng RENEWAL
Izzy GarufiJapanXuxue Feng NEW
Arvin AlbaresFranceAnna Fali QUALIFIED
Ivar PaprockiSpainElwin Sharvill NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Wickens NestleIndia2026-04-26Chanay, Jeffrey A Esq NEW59Amy Elsner
1001Misaki RoysterJapan2026-04-21Morlong Associates NEW33Onyama Limba
1002Smith GlickItaly2026-05-08Feiner Bros PROPOSAL85Elwin Sharvill
1003Maisha RulapaughUnited Kingdom2026-04-30King, Christopher A Esq NEGOTIATION35Asiya Javayant
1004Morrow RutaJapan2026-05-02Rangoni Of Florence RENEWAL31Ivan Magalhaes
1005Munro FerenczItaly2026-04-27Rousseaux, Michael Esq NEW73Ioni Bowcher
1006Rodrigues CampainItaly2026-05-07Truhlar And Truhlar Attys QUALIFIED78Anna Fali
1007Munro FerenczRussia2026-04-26Chemel, James L Cpa NEW0Bernardo Dominic
1008Murillo MaletCanada2026-04-27Chapman, Ross E Esq PROPOSAL23Elwin Sharvill
1009Jones VocelkaAustralia2026-05-13Chapman, Ross E Esq NEGOTIATION34Xuxue Feng
1010Stacey MacleadCanada2026-04-25Dorl, James J Esq PROPOSAL11Elwin Sharvill
1011Misaki RoysterArgentina2026-05-15Dorl, James J Esq NEW62Ivan Magalhaes
1012Ricardo GauchoJapan2026-05-17Benton, John B Jr PROPOSAL9Asiya Javayant
1013Sinclair WaycottArgentina2026-05-02Dorl, James J Esq NEGOTIATION26Xuxue Feng
1014Ivar PaprockiAustralia2026-05-06Feltz Printing Service RENEWAL52Ivan Magalhaes
1015Greenwood BologniaAustralia2026-05-13Printing Dimensions QUALIFIED14Stephen Shaw
1016Faith GillianUnited Kingdom2026-05-02Chapman, Ross E Esq QUALIFIED27Bernardo Dominic
1017Alejandro PerinUnited Kingdom2026-04-26Dorl, James J Esq UNQUALIFIED40Onyama Limba
1018Mujtaba NickaIndia2026-05-05Dorl, James J Esq UNQUALIFIED95Elwin Sharvill
1019Ivar PaprockiGermany2026-05-03King, Christopher A Esq RENEWAL92Xuxue Feng
1020Maisha RulapaughCanada2026-04-21Benton, John B Jr PROPOSAL80Xuxue Feng
1021Misaki RoysterIndia2026-05-06Truhlar And Truhlar Attys NEW4Onyama Limba
1022Aruna FigeroaIndia2026-05-03Benton, John B Jr NEW75Ioni Bowcher
1023Maisha RulapaughItaly2026-05-04Rousseaux, Michael Esq NEGOTIATION50Anna Fali
1024Ricardo GauchoBrazil2026-05-10Rousseaux, Michael Esq NEGOTIATION20Elwin Sharvill
1025Francesco ShinkoIndia2026-04-26Printing Dimensions PROPOSAL3Elwin Sharvill
1026Smith GlickItaly2026-05-12Commercial Press QUALIFIED56Elwin Sharvill
1027Jones VocelkaSpain2026-05-20Rangoni Of Florence NEGOTIATION88Amy Elsner
1028Julie StensethBrazil2026-04-30Truhlar And Truhlar Attys QUALIFIED73Onyama Limba
1029Ivar PaprockiAustralia2026-05-10Dorl, James J Esq NEW11Asiya Javayant
1030Cody SaylorsAustralia2026-04-22King, Christopher A Esq QUALIFIED22Asiya Javayant
1031Francesco ShinkoIndia2026-05-16Truhlar And Truhlar Attys PROPOSAL39Xuxue Feng
1032Emily WhobreyAustralia2026-05-12Rangoni Of Florence UNQUALIFIED38Ivan Magalhaes
1033Ricardo GauchoJapan2026-05-03King, Christopher A Esq UNQUALIFIED70Bernardo Dominic
1034Wickens NestleItaly2026-04-25Chemel, James L Cpa QUALIFIED43Ivan Magalhaes
1035Tony FollerAustralia2026-04-30Commercial Press QUALIFIED25Stephen Shaw
1036Izzy GarufiIndia2026-04-22Printing Dimensions NEGOTIATION31Ioni Bowcher
1037Francesco ShinkoUnited Kingdom2026-05-13Chemel, James L Cpa RENEWAL6Stephen Shaw
1038David DarakjyArgentina2026-05-19Feltz Printing Service UNQUALIFIED94Amy Elsner
1039Aika InouyeBrazil2026-05-10Morlong Associates QUALIFIED30Stephen Shaw
1040Izzy GarufiCanada2026-05-07Chemel, James L Cpa NEW0Elwin Sharvill
1041Smith GlickRussia2026-05-08Feltz Printing Service RENEWAL43Onyama Limba
1042Julie StensethSpain2026-05-15Truhlar And Truhlar Attys RENEWAL12Stephen Shaw
1043David DarakjyGermany2026-05-09Rangoni Of Florence RENEWAL27Onyama Limba
1044Munro FerenczIndia2026-05-19Dorl, James J Esq NEGOTIATION15Anna Fali
1045Isabel BowleyIndia2026-04-25Rangoni Of Florence UNQUALIFIED59Onyama Limba
1046Tony FollerBrazil2026-05-15Benton, John B Jr QUALIFIED17Bernardo Dominic
1047Nicolas IturbideRussia2026-05-06Commercial Press NEW88Asiya Javayant
1048Salvatore StockhamGermany2026-05-06Chanay, Jeffrey A Esq NEW26Ivan Magalhaes
1049Smith GlickSpain2026-05-11Feiner Bros PROPOSAL85Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Wickens NestleSpainAmy Elsner NEGOTIATION
Deepesh ChuiArgentinaStephen Shaw NEW
Octavia MaletAustraliaElwin Sharvill RENEWAL
Jeanfrancois VenereBrazilOnyama Limba NEW
Murillo MaletGermanyElwin Sharvill PROPOSAL
Emily WhobreySpainBernardo Dominic RENEWAL
Arvin AlbaresRussiaStephen Shaw NEW
Darci PoquetteSpainElwin Sharvill PROPOSAL
Greenwood BologniaUnited KingdomIoni Bowcher QUALIFIED
Aruna FigeroaJapanStephen Shaw NEGOTIATION
Cody SaylorsJapanAmy Elsner PROPOSAL
Nicolas IturbideAustraliaIvan Magalhaes NEW
Ashley DoeUnited KingdomAnna Fali UNQUALIFIED
Izzy GarufiSpainStephen Shaw QUALIFIED
Leon OldroydJapanAnna Fali PROPOSAL
Nicolas IturbideRussiaAnna Fali PROPOSAL
Isabel BowleyFranceStephen Shaw RENEWAL
Silvio SlusarskiBrazilIoni Bowcher NEGOTIATION
Smith GlickGermanyIvan Magalhaes NEW
Aditya KuskoAustraliaIoni Bowcher NEGOTIATION
Costa DilliardItalyOnyama Limba PROPOSAL
Morrow RutaUnited KingdomIoni Bowcher UNQUALIFIED
Arvin AlbaresUnited KingdomAnna Fali QUALIFIED
Jeanfrancois VenereJapanElwin Sharvill UNQUALIFIED
Jennifer AmigonGermanyAmy Elsner QUALIFIED
Leon OldroydAustraliaStephen Shaw RENEWAL
Ashley DoeItalyAmy Elsner NEGOTIATION
Antonio CaudyArgentinaStephen Shaw QUALIFIED
Murillo MaletFranceXuxue Feng PROPOSAL
Adams MorascaSpainAmy Elsner QUALIFIED
Murillo MaletArgentinaIoni Bowcher NEW
Francesco ShinkoAustraliaBernardo Dominic PROPOSAL
Rodrigues CampainGermanyIoni Bowcher RENEWAL
Leon OldroydFranceOnyama Limba RENEWAL
Wickens NestleRussiaAmy Elsner UNQUALIFIED
Aruna FigeroaItalyElwin Sharvill NEGOTIATION
Francesco ShinkoArgentinaIvan Magalhaes PROPOSAL
Rodrigues CampainJapanAsiya Javayant QUALIFIED
Darci PoquetteAustraliaAsiya Javayant RENEWAL
Wickens NestleBrazilElwin Sharvill RENEWAL
Wickens NestleGermanyOnyama Limba PROPOSAL
Claire TollnerIndiaStephen Shaw NEW
Jeanfrancois VenereIndiaStephen Shaw NEW
Izzy GarufiCanadaAnna Fali QUALIFIED
Mayumi KolmetzSpainOnyama Limba PROPOSAL
Clifford RimItalyXuxue Feng UNQUALIFIED
Kadeem FlosiUnited KingdomXuxue Feng NEGOTIATION
Costa DilliardBrazilIvan Magalhaes QUALIFIED
Arvin AlbaresArgentinaIoni Bowcher PROPOSAL
Juan WieserAustraliaOnyama Limba NEW
Frozen Columns
Name
Alejandro Perin
David Darakjy
Jones Vocelka
Deepesh Chui
Julie Stenseth
Jones Vocelka
Adams Morasca
Stacey Maclead
Smith Glick
Greenwood Bolognia
David Darakjy
Arvin Albares
Jones Vocelka
Rodrigues Campain
Munro Ferencz
Jones Vocelka
Emily Whobrey
Alejandro Perin
Costa Dilliard
Wickens Nestle
Costa Dilliard
Emily Whobrey
Ivar Paprocki
Mujtaba Nicka
Mayumi Kolmetz
Greenwood Bolognia
Francesco Shinko
Isabel Bowley
Aditya Kusko
Kaitlin Ostrosky
Julie Stenseth
Arvin Albares
Maisha Rulapaugh
Salvatore Stockham
Aika Inouye
Aditya Kusko
Greenwood Bolognia
Wickens Nestle
Leja Caldarera
Silvio Slusarski
James Butt
James Butt
Wickens Nestle
Maria Marrier
Kaitlin Ostrosky
Mayumi Kolmetz
Leja Caldarera
Maria Marrier
Greenwood Bolognia
Isabel Bowley
IdCountryDate
1000Italy2026-05-02
1001India2026-04-23
1002Canada2026-05-13
1003Japan2026-05-03
1004Italy2026-05-05
1005Australia2026-04-30
1006France2026-05-16
1007Spain2026-05-18
1008France2026-05-19
1009Japan2026-04-23
1010Spain2026-05-08
1011Brazil2026-05-19
1012Argentina2026-05-06
1013Germany2026-04-30
1014Australia2026-05-20
1015Brazil2026-05-19
1016Spain2026-05-10
1017Brazil2026-05-02
1018Germany2026-05-20
1019Japan2026-05-07
1020Canada2026-04-27
1021Canada2026-04-25
1022United Kingdom2026-05-13
1023Spain2026-05-05
1024Australia2026-05-20
1025Germany2026-05-11
1026United Kingdom2026-05-09
1027United Kingdom2026-05-06
1028Canada2026-05-17
1029Brazil2026-04-24
1030India2026-04-29
1031Italy2026-05-08
1032Germany2026-04-21
1033France2026-05-20
1034France2026-05-16
1035Italy2026-05-04
1036Canada2026-05-06
1037United Kingdom2026-05-09
1038Japan2026-05-19
1039United Kingdom2026-05-16
1040Argentina2026-05-01
1041Italy2026-05-20
1042Spain2026-05-18
1043Brazil2026-04-26
1044France2026-05-11
1045Italy2026-04-22
1046Spain2026-05-04
1047United Kingdom2026-04-21
1048Argentina2026-04-26
1049France2026-05-20

On-Demand Data

NameIdCountryDate
Aika Inouye1000Argentina2026-05-16
Isabel Bowley1001Brazil2026-05-11
Aruna Figeroa1002Brazil2026-04-30
Murillo Malet1003Germany2026-04-22
Antonio Caudy1004Russia2026-05-20
Munro Ferencz1005Australia2026-05-07
Costa Dilliard1006Italy2026-04-24
Costa Dilliard1007Australia2026-05-15
Tony Foller1008Argentina2026-05-03
Johnson Sergi1009Italy2026-04-25
Faith Gillian1010Australia2026-05-09
Ricardo Gaucho1011United Kingdom2026-04-27
Kadeem Flosi1012United Kingdom2026-05-13
Isabel Bowley1013Canada2026-05-01
Maria Marrier1014Russia2026-05-04
Clifford Rim1015Italy2026-04-25
Faith Gillian1016Germany2026-05-02
Stacey Maclead1017France2026-04-26
Mayumi Kolmetz1018Spain2026-04-23
Izzy Garufi1019Argentina2026-04-21
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jefferson SchemmerJapanXuxue Feng NEGOTIATION
Claire TollnerCanadaIoni Bowcher UNQUALIFIED
Clifford RimJapanAsiya Javayant NEW
Darci PoquetteJapanElwin Sharvill NEGOTIATION
Maria MarrierAustraliaIvan Magalhaes NEGOTIATION
Salvatore StockhamIndiaIoni Bowcher NEW
Munro FerenczRussiaAnna Fali NEW
Wickens NestleGermanyIoni Bowcher PROPOSAL
Adams MorascaFranceElwin Sharvill UNQUALIFIED
Antonio CaudySpainAnna Fali NEW
Juan WieserCanadaBernardo Dominic NEW
Kadeem FlosiJapanElwin Sharvill PROPOSAL
Aditya KuskoArgentinaAmy Elsner PROPOSAL
Izzy GarufiJapanAsiya Javayant NEW
Murillo MaletUnited KingdomIvan Magalhaes RENEWAL
Jennifer AmigonGermanyIoni Bowcher NEW
Deepesh ChuiJapanElwin Sharvill UNQUALIFIED
David DarakjyItalyAnna Fali NEW
Alejandro PerinItalyAmy Elsner UNQUALIFIED
Maria MarrierGermanyAnna Fali NEGOTIATION
David DarakjyCanadaElwin Sharvill RENEWAL
Aika InouyeFranceAmy Elsner QUALIFIED
Faith GillianItalyAsiya Javayant PROPOSAL
Kaitlin OstroskyIndiaBernardo Dominic UNQUALIFIED
Tony FollerUnited KingdomXuxue Feng QUALIFIED
Silvio SlusarskiIndiaAmy Elsner UNQUALIFIED
Leja CaldareraBrazilIvan Magalhaes RENEWAL
Silvio SlusarskiIndiaElwin Sharvill PROPOSAL
Wickens NestleGermanyAsiya Javayant QUALIFIED
Johnson SergiGermanyStephen Shaw RENEWAL
Kadeem FlosiCanadaAsiya Javayant UNQUALIFIED
Octavia MaletBrazilAnna Fali NEGOTIATION
Tony FollerJapanXuxue Feng NEW
James ButtFranceXuxue Feng UNQUALIFIED
Francesco ShinkoItalyAmy Elsner NEGOTIATION
Leja CaldareraIndiaBernardo Dominic NEW
Aika InouyeJapanIoni Bowcher QUALIFIED
Kadeem FlosiRussiaOnyama Limba UNQUALIFIED
Antonio CaudyCanadaAnna Fali UNQUALIFIED
Adams MorascaIndiaElwin Sharvill 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>