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
Mayumi KolmetzBrazilAmy Elsner QUALIFIED
James ButtRussiaAnna Fali QUALIFIED
Adams MorascaRussiaBernardo Dominic RENEWAL
Emily WhobreyArgentinaXuxue Feng UNQUALIFIED
Jefferson SchemmerJapanIvan Magalhaes PROPOSAL
Misaki RoysterAustraliaOnyama Limba QUALIFIED
Johnson SergiIndiaOnyama Limba QUALIFIED
Francesco ShinkoBrazilElwin Sharvill RENEWAL
Murillo MaletUnited KingdomElwin Sharvill UNQUALIFIED
Smith GlickFranceAsiya Javayant NEW
Aditya KuskoArgentinaOnyama Limba NEW
Adams MorascaCanadaIvan Magalhaes NEGOTIATION
Silvio SlusarskiFranceAmy Elsner RENEWAL
Emily WhobreyFranceXuxue Feng NEGOTIATION
Jeanfrancois VenereUnited KingdomOnyama Limba PROPOSAL
Jeanfrancois VenereAustraliaXuxue Feng UNQUALIFIED
Maria MarrierItalyBernardo Dominic RENEWAL
Silvio SlusarskiArgentinaIoni Bowcher QUALIFIED
Stacey MacleadFranceStephen Shaw PROPOSAL
Antonio CaudyJapanAsiya Javayant QUALIFIED
Tony FollerGermanyElwin Sharvill QUALIFIED
Wickens NestleCanadaElwin Sharvill UNQUALIFIED
Faith GillianAustraliaAmy Elsner UNQUALIFIED
Stacey MacleadItalyOnyama Limba PROPOSAL
Mujtaba NickaCanadaXuxue Feng QUALIFIED
David DarakjyArgentinaAsiya Javayant NEW
Stacey MacleadJapanStephen Shaw UNQUALIFIED
Salvatore StockhamUnited KingdomIvan Magalhaes NEW
Octavia MaletFranceBernardo Dominic PROPOSAL
Izzy GarufiItalyAsiya Javayant NEGOTIATION
Deepesh ChuiRussiaIoni Bowcher PROPOSAL
Ashley DoeCanadaIvan Magalhaes QUALIFIED
Jones VocelkaUnited KingdomStephen Shaw NEGOTIATION
Ashley DoeAustraliaAnna Fali RENEWAL
Kadeem FlosiSpainElwin Sharvill RENEWAL
Johnson SergiBrazilBernardo Dominic NEW
Wickens NestleUnited KingdomXuxue Feng RENEWAL
Izzy GarufiIndiaOnyama Limba UNQUALIFIED
Jones VocelkaUnited KingdomStephen Shaw NEGOTIATION
Arvin AlbaresAustraliaAsiya Javayant NEGOTIATION
James ButtJapanBernardo Dominic UNQUALIFIED
Smith GlickFranceXuxue Feng NEGOTIATION
Mujtaba NickaItalyAsiya Javayant QUALIFIED
Ricardo GauchoCanadaIoni Bowcher QUALIFIED
Maria MarrierBrazilStephen Shaw QUALIFIED
David DarakjyItalyAsiya Javayant UNQUALIFIED
Faith GillianJapanIoni Bowcher NEGOTIATION
Kadeem FlosiAustraliaAmy Elsner RENEWAL
Aruna FigeroaSpainAsiya Javayant QUALIFIED
Julie StensethArgentinaAmy Elsner QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Maisha RulapaughCanadaAsiya Javayant PROPOSAL
Mayumi KolmetzSpainBernardo Dominic NEGOTIATION
Johnson SergiItalyXuxue Feng RENEWAL
Izzy GarufiJapanAsiya Javayant NEW
Kaitlin OstroskyGermanyElwin Sharvill UNQUALIFIED
Jeanfrancois VenereItalyIoni Bowcher NEGOTIATION
Cody SaylorsUnited KingdomBernardo Dominic NEW
Jennifer AmigonBrazilAmy Elsner PROPOSAL
Leon OldroydBrazilStephen Shaw UNQUALIFIED
Kadeem FlosiCanadaIoni Bowcher RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Adams MorascaRussia2026-06-01Chemel, James L Cpa PROPOSAL93Asiya Javayant
1001James ButtIndia2026-05-31Feiner Bros NEGOTIATION24Ioni Bowcher
1002Tony FollerAustralia2026-05-23Feiner Bros UNQUALIFIED68Stephen Shaw
1003David DarakjyItaly2026-06-10Chemel, James L Cpa QUALIFIED77Amy Elsner
1004Stacey MacleadItaly2026-05-20Chapman, Ross E Esq NEGOTIATION52Amy Elsner
1005Tony FollerAustralia2026-05-19Buckley Miller Wright RENEWAL52Amy Elsner
1006Sinclair WaycottItaly2026-06-11Benton, John B Jr RENEWAL71Onyama Limba
1007Ivar PaprockiAustralia2026-05-24Feltz Printing Service QUALIFIED51Elwin Sharvill
1008Sinclair WaycottCanada2026-06-06Chapman, Ross E Esq NEW20Xuxue Feng
1009Arvin AlbaresItaly2026-06-02Buckley Miller Wright RENEWAL5Onyama Limba
1010Salvatore StockhamAustralia2026-05-22Chapman, Ross E Esq NEGOTIATION96Anna Fali
1011Arvin AlbaresFrance2026-05-15Feltz Printing Service RENEWAL43Ioni Bowcher
1012Maria MarrierGermany2026-05-22Benton, John B Jr NEGOTIATION57Anna Fali
1013Leja CaldareraRussia2026-06-02Rousseaux, Michael Esq NEGOTIATION55Bernardo Dominic
1014Leon OldroydSpain2026-05-18Benton, John B Jr UNQUALIFIED63Stephen Shaw
1015Maria MarrierArgentina2026-06-09Commercial Press RENEWAL5Elwin Sharvill
1016Isabel BowleyFrance2026-06-08Chanay, Jeffrey A Esq RENEWAL28Anna Fali
1017Leja CaldareraIndia2026-05-19Buckley Miller Wright NEW14Asiya Javayant
1018Maria MarrierSpain2026-05-18Rousseaux, Michael Esq NEGOTIATION76Ioni Bowcher
1019Mujtaba NickaGermany2026-05-20Benton, John B Jr NEGOTIATION43Elwin Sharvill
1020Rodrigues CampainJapan2026-05-31Rangoni Of Florence NEW26Stephen Shaw
1021Antonio CaudyItaly2026-06-04Rousseaux, Michael Esq NEGOTIATION52Elwin Sharvill
1022Clifford RimRussia2026-05-19Chapman, Ross E Esq NEW35Amy Elsner
1023Murillo MaletCanada2026-05-26Chemel, James L Cpa PROPOSAL33Elwin Sharvill
1024Deepesh ChuiAustralia2026-05-16Benton, John B Jr UNQUALIFIED28Asiya Javayant
1025Jeanfrancois VenereJapan2026-06-07Rangoni Of Florence PROPOSAL77Bernardo Dominic
1026Aika InouyeGermany2026-06-01Dorl, James J Esq NEW25Onyama Limba
1027Rodrigues CampainBrazil2026-05-25Rangoni Of Florence PROPOSAL66Amy Elsner
1028Juan WieserGermany2026-05-23Rangoni Of Florence NEGOTIATION19Onyama Limba
1029Leja CaldareraCanada2026-05-17Chapman, Ross E Esq NEW95Xuxue Feng
1030Nicolas IturbideItaly2026-05-16Benton, John B Jr PROPOSAL62Stephen Shaw
1031Rodrigues CampainBrazil2026-06-05King, Christopher A Esq NEW93Ivan Magalhaes
1032Mayumi KolmetzRussia2026-05-17Chemel, James L Cpa QUALIFIED81Ivan Magalhaes
1033Julie StensethUnited Kingdom2026-05-24Chanay, Jeffrey A Esq NEGOTIATION49Stephen Shaw
1034Arvin AlbaresGermany2026-05-30King, Christopher A Esq QUALIFIED71Ioni Bowcher
1035Aruna FigeroaFrance2026-05-17King, Christopher A Esq NEGOTIATION48Anna Fali
1036Tony FollerBrazil2026-06-03Dorl, James J Esq PROPOSAL91Anna Fali
1037Misaki RoysterFrance2026-06-07Chemel, James L Cpa NEGOTIATION67Elwin Sharvill
1038Sinclair WaycottAustralia2026-06-09Rangoni Of Florence NEW42Ivan Magalhaes
1039Clifford RimIndia2026-05-16Morlong Associates NEW57Stephen Shaw
1040Francesco ShinkoBrazil2026-05-27Rousseaux, Michael Esq QUALIFIED56Onyama Limba
1041Jefferson SchemmerAustralia2026-05-16Rousseaux, Michael Esq PROPOSAL59Anna Fali
1042Izzy GarufiBrazil2026-05-29Chanay, Jeffrey A Esq UNQUALIFIED59Ivan Magalhaes
1043Costa DilliardBrazil2026-05-27Printing Dimensions NEGOTIATION27Elwin Sharvill
1044Izzy GarufiIndia2026-05-23Feiner Bros NEGOTIATION71Anna Fali
1045Ashley DoeRussia2026-05-14Dorl, James J Esq RENEWAL12Stephen Shaw
1046Murillo MaletRussia2026-05-24Chanay, Jeffrey A Esq NEW48Xuxue Feng
1047Francesco ShinkoCanada2026-06-10King, Christopher A Esq NEW94Elwin Sharvill
1048Silvio SlusarskiAustralia2026-06-07Chemel, James L Cpa QUALIFIED44Bernardo Dominic
1049Emily WhobreyFrance2026-05-18Chanay, Jeffrey A Esq NEGOTIATION10Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Mayumi KolmetzUnited KingdomBernardo Dominic UNQUALIFIED
Aika InouyeGermanyStephen Shaw NEGOTIATION
Costa DilliardArgentinaAmy Elsner RENEWAL
Kadeem FlosiIndiaElwin Sharvill UNQUALIFIED
Kaitlin OstroskyIndiaAsiya Javayant NEW
Mujtaba NickaItalyElwin Sharvill QUALIFIED
Ashley DoeRussiaAnna Fali NEW
Adams MorascaRussiaXuxue Feng QUALIFIED
Aika InouyeItalyIoni Bowcher RENEWAL
Silvio SlusarskiSpainBernardo Dominic NEW
Arvin AlbaresGermanyBernardo Dominic RENEWAL
Arvin AlbaresFranceAnna Fali RENEWAL
David DarakjyIndiaIvan Magalhaes RENEWAL
Isabel BowleyGermanyIoni Bowcher UNQUALIFIED
Emily WhobreyGermanyAmy Elsner NEW
Stacey MacleadFranceAnna Fali PROPOSAL
Cody SaylorsSpainXuxue Feng RENEWAL
Nicolas IturbideCanadaBernardo Dominic QUALIFIED
Stacey MacleadJapanOnyama Limba UNQUALIFIED
Isabel BowleyBrazilOnyama Limba NEW
Smith GlickItalyAsiya Javayant RENEWAL
Maisha RulapaughRussiaElwin Sharvill UNQUALIFIED
Jeanfrancois VenereBrazilOnyama Limba UNQUALIFIED
Mujtaba NickaCanadaAnna Fali UNQUALIFIED
Isabel BowleyIndiaXuxue Feng PROPOSAL
Kadeem FlosiFranceBernardo Dominic NEGOTIATION
Aika InouyeItalyStephen Shaw NEW
Salvatore StockhamBrazilAsiya Javayant NEGOTIATION
Arvin AlbaresSpainBernardo Dominic NEW
Jones VocelkaGermanyAmy Elsner NEGOTIATION
Kaitlin OstroskyItalyAsiya Javayant UNQUALIFIED
Antonio CaudyUnited KingdomAsiya Javayant NEGOTIATION
Ricardo GauchoSpainBernardo Dominic UNQUALIFIED
James ButtUnited KingdomIvan Magalhaes PROPOSAL
Costa DilliardItalyStephen Shaw PROPOSAL
Juan WieserUnited KingdomElwin Sharvill UNQUALIFIED
Ivar PaprockiUnited KingdomStephen Shaw RENEWAL
Nicolas IturbideSpainBernardo Dominic NEW
Mujtaba NickaJapanAsiya Javayant QUALIFIED
James ButtIndiaAnna Fali NEGOTIATION
Wickens NestleBrazilIvan Magalhaes UNQUALIFIED
Darci PoquetteItalyAnna Fali PROPOSAL
Munro FerenczIndiaStephen Shaw PROPOSAL
Jefferson SchemmerUnited KingdomElwin Sharvill UNQUALIFIED
James ButtRussiaElwin Sharvill UNQUALIFIED
Smith GlickCanadaAmy Elsner NEW
Misaki RoysterGermanyIoni Bowcher UNQUALIFIED
David DarakjyJapanAsiya Javayant PROPOSAL
Costa DilliardIndiaAmy Elsner QUALIFIED
Aditya KuskoAustraliaBernardo Dominic NEGOTIATION
Frozen Columns
Name
Claire Tollner
James Butt
Ivar Paprocki
Arvin Albares
Rodrigues Campain
Kaitlin Ostrosky
Nicolas Iturbide
Smith Glick
Adams Morasca
Ricardo Gaucho
Darci Poquette
Kaitlin Ostrosky
David Darakjy
Murillo Malet
Leja Caldarera
Greenwood Bolognia
Antonio Caudy
Misaki Royster
Chavez Briddick
Tony Foller
Izzy Garufi
Jennifer Amigon
James Butt
Silvio Slusarski
Misaki Royster
Claire Tollner
Aruna Figeroa
Smith Glick
Alejandro Perin
Ricardo Gaucho
Aika Inouye
Isabel Bowley
Mayumi Kolmetz
Kaitlin Ostrosky
Isabel Bowley
Mayumi Kolmetz
Emily Whobrey
Isabel Bowley
Arvin Albares
Juan Wieser
Julie Stenseth
Deepesh Chui
Munro Ferencz
David Darakjy
Smith Glick
Alejandro Perin
Costa Dilliard
Jones Vocelka
Leja Caldarera
Johnson Sergi
IdCountryDate
1000Brazil2026-05-26
1001Canada2026-05-21
1002France2026-05-26
1003United Kingdom2026-06-05
1004India2026-05-17
1005Italy2026-06-10
1006Brazil2026-06-05
1007France2026-05-16
1008Spain2026-05-24
1009Italy2026-05-26
1010Argentina2026-05-19
1011Italy2026-06-08
1012Italy2026-05-28
1013Japan2026-05-17
1014Australia2026-05-15
1015Russia2026-05-25
1016Italy2026-06-03
1017France2026-06-05
1018Italy2026-06-05
1019Russia2026-06-07
1020France2026-06-11
1021India2026-06-04
1022France2026-06-05
1023India2026-05-20
1024India2026-05-17
1025Italy2026-05-31
1026Italy2026-05-17
1027Japan2026-06-04
1028Canada2026-05-27
1029Argentina2026-05-16
1030Japan2026-06-07
1031Italy2026-05-31
1032Russia2026-05-23
1033Japan2026-05-19
1034United Kingdom2026-05-29
1035Canada2026-05-17
1036Italy2026-06-09
1037Brazil2026-06-06
1038Russia2026-06-06
1039Russia2026-06-12
1040Russia2026-06-04
1041Brazil2026-05-14
1042Australia2026-06-09
1043Italy2026-05-25
1044Japan2026-06-04
1045Brazil2026-05-24
1046Germany2026-06-07
1047Australia2026-06-04
1048Spain2026-05-30
1049Italy2026-05-23

On-Demand Data

NameIdCountryDate
Costa Dilliard1000Brazil2026-06-04
Misaki Royster1001Brazil2026-05-25
Alejandro Perin1002Spain2026-06-06
Aditya Kusko1003Argentina2026-05-21
Aika Inouye1004Japan2026-05-18
Darci Poquette1005India2026-05-31
Juan Wieser1006India2026-05-20
Leon Oldroyd1007Russia2026-05-23
Misaki Royster1008France2026-06-02
Morrow Ruta1009France2026-05-27
Faith Gillian1010India2026-06-01
Alejandro Perin1011Canada2026-05-28
Clifford Rim1012Russia2026-06-07
Claire Tollner1013India2026-05-27
Johnson Sergi1014France2026-05-18
Octavia Malet1015Brazil2026-05-25
Leon Oldroyd1016Germany2026-05-15
Murillo Malet1017Italy2026-06-01
Cody Saylors1018Australia2026-05-16
Maria Marrier1019India2026-06-12
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Kadeem FlosiJapanAmy Elsner NEGOTIATION
Kadeem FlosiUnited KingdomElwin Sharvill UNQUALIFIED
Sinclair WaycottIndiaOnyama Limba UNQUALIFIED
Salvatore StockhamArgentinaAnna Fali NEGOTIATION
Arvin AlbaresArgentinaBernardo Dominic PROPOSAL
Jeanfrancois VenereIndiaXuxue Feng NEW
Sinclair WaycottIndiaIoni Bowcher UNQUALIFIED
Ivar PaprockiFranceAsiya Javayant QUALIFIED
Greenwood BologniaArgentinaXuxue Feng NEGOTIATION
Munro FerenczRussiaAmy Elsner UNQUALIFIED
Wickens NestleGermanyOnyama Limba PROPOSAL
Johnson SergiUnited KingdomXuxue Feng PROPOSAL
Morrow RutaRussiaAsiya Javayant UNQUALIFIED
Tony FollerIndiaIoni Bowcher NEGOTIATION
Claire TollnerBrazilStephen Shaw QUALIFIED
Tony FollerJapanBernardo Dominic UNQUALIFIED
Kaitlin OstroskyRussiaStephen Shaw QUALIFIED
Maria MarrierRussiaBernardo Dominic UNQUALIFIED
Jennifer AmigonFranceElwin Sharvill RENEWAL
Mayumi KolmetzCanadaAmy Elsner QUALIFIED
Maisha RulapaughSpainXuxue Feng NEW
Silvio SlusarskiItalyElwin Sharvill UNQUALIFIED
Cody SaylorsCanadaAnna Fali RENEWAL
Leon OldroydBrazilAsiya Javayant UNQUALIFIED
Munro FerenczJapanIoni Bowcher PROPOSAL
Mujtaba NickaGermanyXuxue Feng QUALIFIED
Clifford RimJapanAsiya Javayant QUALIFIED
Octavia MaletIndiaOnyama Limba RENEWAL
Jones VocelkaGermanyBernardo Dominic QUALIFIED
Claire TollnerSpainBernardo Dominic QUALIFIED
David DarakjyBrazilElwin Sharvill NEW
Darci PoquetteRussiaStephen Shaw RENEWAL
Ashley DoeArgentinaAsiya Javayant NEGOTIATION
Darci PoquetteCanadaAsiya Javayant NEW
Stacey MacleadRussiaElwin Sharvill QUALIFIED
Misaki RoysterBrazilAnna Fali PROPOSAL
Leja CaldareraBrazilIoni Bowcher RENEWAL
Kadeem FlosiRussiaStephen Shaw NEGOTIATION
Morrow RutaSpainXuxue Feng PROPOSAL
Munro FerenczFranceAnna Fali PROPOSAL

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