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
Murillo MaletUnited KingdomXuxue Feng NEW
Nicolas IturbideUnited KingdomAnna Fali PROPOSAL
Aika InouyeBrazilAmy Elsner PROPOSAL
Adams MorascaIndiaOnyama Limba UNQUALIFIED
Julie StensethAustraliaElwin Sharvill UNQUALIFIED
Aditya KuskoRussiaBernardo Dominic NEW
Ivar PaprockiSpainElwin Sharvill NEW
Clifford RimGermanyOnyama Limba NEGOTIATION
Claire TollnerGermanyAsiya Javayant RENEWAL
Clifford RimUnited KingdomOnyama Limba QUALIFIED
Emily WhobreyBrazilBernardo Dominic PROPOSAL
Juan WieserAustraliaBernardo Dominic PROPOSAL
Salvatore StockhamJapanIvan Magalhaes NEGOTIATION
Kaitlin OstroskyAustraliaIoni Bowcher NEW
Jones VocelkaGermanyIvan Magalhaes NEW
Leja CaldareraArgentinaIvan Magalhaes UNQUALIFIED
Isabel BowleyArgentinaBernardo Dominic NEGOTIATION
Claire TollnerJapanIoni Bowcher QUALIFIED
Faith GillianUnited KingdomIoni Bowcher QUALIFIED
David DarakjyBrazilAnna Fali RENEWAL
Julie StensethGermanyAsiya Javayant NEW
Mujtaba NickaBrazilStephen Shaw RENEWAL
Stacey MacleadRussiaAnna Fali PROPOSAL
Aditya KuskoIndiaIvan Magalhaes UNQUALIFIED
Jennifer AmigonCanadaAsiya Javayant RENEWAL
Isabel BowleySpainStephen Shaw RENEWAL
Leja CaldareraSpainIoni Bowcher NEW
Kadeem FlosiRussiaIoni Bowcher PROPOSAL
Maria MarrierUnited KingdomXuxue Feng NEGOTIATION
Jones VocelkaArgentinaBernardo Dominic PROPOSAL
Deepesh ChuiIndiaBernardo Dominic QUALIFIED
Greenwood BologniaFranceAsiya Javayant NEGOTIATION
Sinclair WaycottArgentinaStephen Shaw RENEWAL
Jeanfrancois VenereSpainElwin Sharvill NEGOTIATION
Rodrigues CampainAustraliaIoni Bowcher UNQUALIFIED
Antonio CaudyBrazilAmy Elsner NEW
Jennifer AmigonCanadaIoni Bowcher QUALIFIED
Adams MorascaFranceIoni Bowcher NEW
Morrow RutaJapanElwin Sharvill NEW
Julie StensethUnited KingdomAmy Elsner PROPOSAL
Nicolas IturbideRussiaIoni Bowcher RENEWAL
Leja CaldareraBrazilElwin Sharvill UNQUALIFIED
Ricardo GauchoCanadaAsiya Javayant PROPOSAL
Nicolas IturbideUnited KingdomAmy Elsner UNQUALIFIED
Morrow RutaFranceStephen Shaw UNQUALIFIED
Ivar PaprockiBrazilOnyama Limba QUALIFIED
Leon OldroydArgentinaAnna Fali NEW
Kaitlin OstroskySpainElwin Sharvill RENEWAL
Jefferson SchemmerBrazilAnna Fali NEW
Jeanfrancois VenereJapanOnyama Limba UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Deepesh ChuiCanadaAmy Elsner PROPOSAL
Juan WieserIndiaIvan Magalhaes QUALIFIED
Octavia MaletAustraliaElwin Sharvill RENEWAL
Smith GlickItalyAnna Fali NEGOTIATION
Maria MarrierFranceAmy Elsner PROPOSAL
Costa DilliardSpainOnyama Limba QUALIFIED
Leja CaldareraRussiaAnna Fali UNQUALIFIED
Sinclair WaycottArgentinaStephen Shaw NEGOTIATION
Munro FerenczSpainAsiya Javayant NEGOTIATION
Ivar PaprockiIndiaXuxue Feng RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Misaki RoysterIndia2026-05-26Rangoni Of Florence RENEWAL78Asiya Javayant
1001Morrow RutaArgentina2026-05-12Chapman, Ross E Esq NEGOTIATION44Ioni Bowcher
1002Adams MorascaItaly2026-05-07Truhlar And Truhlar Attys NEW18Amy Elsner
1003Faith GillianCanada2026-05-21King, Christopher A Esq RENEWAL91Asiya Javayant
1004Johnson SergiJapan2026-05-13Chemel, James L Cpa PROPOSAL73Bernardo Dominic
1005Costa DilliardCanada2026-05-08Benton, John B Jr UNQUALIFIED76Anna Fali
1006Antonio CaudyIndia2026-05-30King, Christopher A Esq UNQUALIFIED71Ivan Magalhaes
1007Isabel BowleyGermany2026-05-20Dorl, James J Esq NEW59Anna Fali
1008Ivar PaprockiFrance2026-05-28Buckley Miller Wright UNQUALIFIED0Onyama Limba
1009Mayumi KolmetzRussia2026-05-18Feltz Printing Service NEW41Ivan Magalhaes
1010Octavia MaletIndia2026-05-26Rousseaux, Michael Esq NEW20Anna Fali
1011Darci PoquetteUnited Kingdom2026-05-30King, Christopher A Esq QUALIFIED31Anna Fali
1012Ricardo GauchoSpain2026-05-17Rousseaux, Michael Esq RENEWAL11Onyama Limba
1013Ivar PaprockiFrance2026-05-16Morlong Associates UNQUALIFIED30Ioni Bowcher
1014David DarakjyRussia2026-05-17Chapman, Ross E Esq NEGOTIATION17Amy Elsner
1015Misaki RoysterCanada2026-05-16Chanay, Jeffrey A Esq QUALIFIED96Amy Elsner
1016Ivar PaprockiCanada2026-05-17Truhlar And Truhlar Attys UNQUALIFIED8Elwin Sharvill
1017Johnson SergiArgentina2026-05-07Feiner Bros UNQUALIFIED85Stephen Shaw
1018Maisha RulapaughCanada2026-05-04King, Christopher A Esq PROPOSAL96Amy Elsner
1019Jones VocelkaBrazil2026-05-27King, Christopher A Esq RENEWAL55Amy Elsner
1020Mujtaba NickaItaly2026-06-01Feltz Printing Service NEGOTIATION71Anna Fali
1021Octavia MaletCanada2026-06-01Rousseaux, Michael Esq PROPOSAL71Elwin Sharvill
1022Leon OldroydAustralia2026-05-10Chapman, Ross E Esq NEW15Elwin Sharvill
1023Leon OldroydArgentina2026-05-14Commercial Press NEGOTIATION3Bernardo Dominic
1024Alejandro PerinJapan2026-05-09Chapman, Ross E Esq RENEWAL74Ioni Bowcher
1025Francesco ShinkoCanada2026-05-07Feiner Bros NEGOTIATION64Anna Fali
1026Arvin AlbaresAustralia2026-05-22Rangoni Of Florence PROPOSAL75Ioni Bowcher
1027Salvatore StockhamUnited Kingdom2026-05-16Buckley Miller Wright UNQUALIFIED20Onyama Limba
1028Arvin AlbaresItaly2026-05-16Dorl, James J Esq UNQUALIFIED80Elwin Sharvill
1029Sinclair WaycottGermany2026-05-26Benton, John B Jr QUALIFIED51Ioni Bowcher
1030Isabel BowleyArgentina2026-05-06Chanay, Jeffrey A Esq NEGOTIATION98Ivan Magalhaes
1031Jefferson SchemmerFrance2026-05-18Dorl, James J Esq RENEWAL19Elwin Sharvill
1032Cody SaylorsFrance2026-05-12Feltz Printing Service PROPOSAL22Anna Fali
1033Rodrigues CampainCanada2026-05-20Feltz Printing Service RENEWAL2Bernardo Dominic
1034Wickens NestleCanada2026-05-31Commercial Press NEW61Onyama Limba
1035Arvin AlbaresRussia2026-05-30Chanay, Jeffrey A Esq RENEWAL49Anna Fali
1036Ricardo GauchoAustralia2026-05-08Chapman, Ross E Esq QUALIFIED17Ioni Bowcher
1037Ivar PaprockiBrazil2026-05-19Rousseaux, Michael Esq UNQUALIFIED0Stephen Shaw
1038Costa DilliardGermany2026-05-11Rousseaux, Michael Esq NEW10Anna Fali
1039Clifford RimJapan2026-05-30Buckley Miller Wright NEW85Ioni Bowcher
1040Munro FerenczGermany2026-05-12Commercial Press NEW50Onyama Limba
1041Mujtaba NickaRussia2026-05-28Buckley Miller Wright PROPOSAL76Amy Elsner
1042Mujtaba NickaFrance2026-05-26Truhlar And Truhlar Attys UNQUALIFIED61Ivan Magalhaes
1043Kadeem FlosiCanada2026-05-24Chanay, Jeffrey A Esq UNQUALIFIED5Stephen Shaw
1044Francesco ShinkoCanada2026-05-09Buckley Miller Wright PROPOSAL72Anna Fali
1045Rodrigues CampainSpain2026-05-09Feiner Bros QUALIFIED9Onyama Limba
1046Aika InouyeAustralia2026-06-01Dorl, James J Esq RENEWAL63Asiya Javayant
1047Ivar PaprockiArgentina2026-05-29Commercial Press NEW40Ioni Bowcher
1048Mujtaba NickaGermany2026-05-07Rangoni Of Florence RENEWAL79Ivan Magalhaes
1049Claire TollnerJapan2026-05-18Chemel, James L Cpa NEW75Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
David DarakjyUnited KingdomXuxue Feng NEW
Claire TollnerArgentinaAmy Elsner NEGOTIATION
Aika InouyeRussiaXuxue Feng UNQUALIFIED
Jefferson SchemmerItalyOnyama Limba RENEWAL
Munro FerenczGermanyIvan Magalhaes PROPOSAL
Salvatore StockhamIndiaElwin Sharvill RENEWAL
Deepesh ChuiItalyXuxue Feng NEW
Izzy GarufiItalyAnna Fali UNQUALIFIED
Wickens NestleAustraliaStephen Shaw NEGOTIATION
Emily WhobreyBrazilXuxue Feng PROPOSAL
Nicolas IturbideSpainAmy Elsner RENEWAL
Aruna FigeroaAustraliaAnna Fali QUALIFIED
Silvio SlusarskiBrazilAmy Elsner UNQUALIFIED
Juan WieserFranceXuxue Feng PROPOSAL
Aruna FigeroaItalyOnyama Limba PROPOSAL
Julie StensethFranceBernardo Dominic RENEWAL
Darci PoquetteBrazilBernardo Dominic QUALIFIED
Munro FerenczArgentinaAnna Fali RENEWAL
Jefferson SchemmerJapanOnyama Limba NEW
Stacey MacleadItalyElwin Sharvill UNQUALIFIED
Rodrigues CampainGermanyIoni Bowcher UNQUALIFIED
Ivar PaprockiUnited KingdomAnna Fali NEGOTIATION
Smith GlickBrazilIoni Bowcher NEW
Costa DilliardUnited KingdomAsiya Javayant PROPOSAL
Cody SaylorsUnited KingdomStephen Shaw RENEWAL
Cody SaylorsGermanyOnyama Limba NEGOTIATION
Jefferson SchemmerIndiaIvan Magalhaes NEGOTIATION
Stacey MacleadUnited KingdomStephen Shaw QUALIFIED
Alejandro PerinItalyAnna Fali NEGOTIATION
Mayumi KolmetzArgentinaAsiya Javayant QUALIFIED
Leja CaldareraJapanIoni Bowcher NEGOTIATION
Morrow RutaIndiaOnyama Limba NEGOTIATION
Leon OldroydItalyOnyama Limba RENEWAL
Antonio CaudyRussiaOnyama Limba NEGOTIATION
Kaitlin OstroskyRussiaStephen Shaw RENEWAL
Emily WhobreyRussiaBernardo Dominic NEW
Jennifer AmigonArgentinaBernardo Dominic QUALIFIED
Stacey MacleadUnited KingdomXuxue Feng NEGOTIATION
Aika InouyeBrazilElwin Sharvill NEW
Alejandro PerinSpainElwin Sharvill NEGOTIATION
Arvin AlbaresAustraliaStephen Shaw NEGOTIATION
Clifford RimUnited KingdomXuxue Feng QUALIFIED
Juan WieserRussiaElwin Sharvill UNQUALIFIED
Smith GlickAustraliaBernardo Dominic NEGOTIATION
Maria MarrierItalyAnna Fali PROPOSAL
Aika InouyeIndiaAmy Elsner UNQUALIFIED
Ricardo GauchoFranceAmy Elsner QUALIFIED
Maisha RulapaughIndiaOnyama Limba NEGOTIATION
Ivar PaprockiBrazilXuxue Feng UNQUALIFIED
Jones VocelkaJapanXuxue Feng UNQUALIFIED
Frozen Columns
Name
James Butt
Emily Whobrey
Julie Stenseth
Juan Wieser
Misaki Royster
Leja Caldarera
Munro Ferencz
Antonio Caudy
Jeanfrancois Venere
Tony Foller
Maisha Rulapaugh
Izzy Garufi
Ivar Paprocki
Leon Oldroyd
Mayumi Kolmetz
Alejandro Perin
Alejandro Perin
Kadeem Flosi
Deepesh Chui
Smith Glick
Cody Saylors
Maisha Rulapaugh
Rodrigues Campain
Deepesh Chui
Arvin Albares
Antonio Caudy
Francesco Shinko
Morrow Ruta
Aruna Figeroa
Nicolas Iturbide
Deepesh Chui
Stacey Maclead
Antonio Caudy
Morrow Ruta
Mujtaba Nicka
Izzy Garufi
Isabel Bowley
Leja Caldarera
Maria Marrier
Antonio Caudy
Antonio Caudy
Aruna Figeroa
Octavia Malet
Salvatore Stockham
Kaitlin Ostrosky
Jefferson Schemmer
Ivar Paprocki
David Darakjy
Julie Stenseth
Emily Whobrey
IdCountryDate
1000Argentina2026-05-23
1001Italy2026-05-20
1002Australia2026-05-07
1003Japan2026-05-27
1004Australia2026-05-11
1005Japan2026-05-25
1006Spain2026-05-07
1007Brazil2026-05-29
1008Argentina2026-05-20
1009Australia2026-05-29
1010Brazil2026-05-07
1011Germany2026-05-15
1012United Kingdom2026-05-21
1013Italy2026-05-30
1014France2026-05-21
1015Brazil2026-05-30
1016Spain2026-05-27
1017Brazil2026-05-10
1018India2026-05-07
1019Germany2026-05-29
1020Australia2026-05-03
1021Australia2026-05-05
1022India2026-05-12
1023Brazil2026-05-13
1024Canada2026-05-08
1025France2026-05-03
1026Germany2026-05-03
1027United Kingdom2026-05-19
1028Germany2026-05-21
1029Brazil2026-05-16
1030United Kingdom2026-05-06
1031Argentina2026-05-18
1032Russia2026-05-31
1033Argentina2026-05-13
1034Japan2026-05-31
1035Canada2026-05-25
1036United Kingdom2026-05-14
1037Canada2026-05-13
1038United Kingdom2026-05-28
1039Argentina2026-05-12
1040Japan2026-05-31
1041United Kingdom2026-05-19
1042Brazil2026-05-20
1043Australia2026-05-23
1044Japan2026-05-29
1045Japan2026-05-21
1046France2026-05-19
1047Brazil2026-05-31
1048France2026-05-17
1049Japan2026-05-23

On-Demand Data

NameIdCountryDate
David Darakjy1000Germany2026-05-04
Mujtaba Nicka1001Brazil2026-05-20
Deepesh Chui1002France2026-05-23
David Darakjy1003United Kingdom2026-05-03
Clifford Rim1004Spain2026-05-05
Kadeem Flosi1005India2026-05-12
Mayumi Kolmetz1006Canada2026-05-09
Misaki Royster1007Canada2026-05-07
Arvin Albares1008Australia2026-05-25
Stacey Maclead1009India2026-05-27
Tony Foller1010Spain2026-05-18
Clifford Rim1011France2026-05-05
Claire Tollner1012India2026-05-18
Johnson Sergi1013Russia2026-05-09
Darci Poquette1014Australia2026-05-09
Kadeem Flosi1015India2026-05-17
Smith Glick1016Russia2026-05-31
Tony Foller1017United Kingdom2026-05-11
Greenwood Bolognia1018France2026-05-07
Clifford Rim1019Japan2026-05-08
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jennifer AmigonJapanElwin Sharvill UNQUALIFIED
Munro FerenczUnited KingdomAnna Fali NEGOTIATION
Munro FerenczIndiaOnyama Limba RENEWAL
Morrow RutaJapanIoni Bowcher QUALIFIED
Arvin AlbaresAustraliaIoni Bowcher QUALIFIED
Nicolas IturbideAustraliaStephen Shaw PROPOSAL
Aika InouyeJapanXuxue Feng NEW
Aruna FigeroaItalyOnyama Limba QUALIFIED
David DarakjyFranceXuxue Feng NEW
Salvatore StockhamAustraliaAnna Fali RENEWAL
Ivar PaprockiCanadaIvan Magalhaes NEW
Jennifer AmigonSpainOnyama Limba PROPOSAL
Smith GlickCanadaAmy Elsner QUALIFIED
Claire TollnerUnited KingdomAnna Fali UNQUALIFIED
Leja CaldareraAustraliaIoni Bowcher RENEWAL
Kadeem FlosiItalyOnyama Limba NEW
Faith GillianAustraliaOnyama Limba NEGOTIATION
Mujtaba NickaAustraliaStephen Shaw NEGOTIATION
Costa DilliardItalyAmy Elsner NEGOTIATION
Nicolas IturbideAustraliaBernardo Dominic UNQUALIFIED
Francesco ShinkoJapanXuxue Feng RENEWAL
Sinclair WaycottGermanyAsiya Javayant NEGOTIATION
Adams MorascaIndiaIoni Bowcher RENEWAL
Aika InouyeSpainBernardo Dominic QUALIFIED
Munro FerenczItalyXuxue Feng PROPOSAL
Arvin AlbaresRussiaOnyama Limba RENEWAL
Maria MarrierArgentinaElwin Sharvill NEW
Adams MorascaRussiaStephen Shaw NEW
Maria MarrierItalyStephen Shaw RENEWAL
Stacey MacleadSpainElwin Sharvill QUALIFIED
Salvatore StockhamFranceIvan Magalhaes PROPOSAL
Francesco ShinkoBrazilXuxue Feng QUALIFIED
Chavez BriddickRussiaAsiya Javayant QUALIFIED
Maisha RulapaughSpainXuxue Feng RENEWAL
Jeanfrancois VenereItalyAmy Elsner PROPOSAL
Kadeem FlosiArgentinaBernardo Dominic RENEWAL
Maria MarrierBrazilXuxue Feng RENEWAL
Tony FollerItalyBernardo Dominic RENEWAL
Leja CaldareraIndiaXuxue Feng QUALIFIED
Alejandro PerinBrazilBernardo Dominic 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>