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
Antonio CaudyBrazilAmy Elsner RENEWAL
Aditya KuskoItalyBernardo Dominic PROPOSAL
Jennifer AmigonAustraliaAnna Fali RENEWAL
Ivar PaprockiJapanAmy Elsner NEW
Misaki RoysterRussiaAsiya Javayant NEW
Tony FollerBrazilOnyama Limba PROPOSAL
Adams MorascaCanadaAnna Fali QUALIFIED
Emily WhobreyFranceAnna Fali QUALIFIED
Julie StensethGermanyOnyama Limba UNQUALIFIED
Costa DilliardBrazilIoni Bowcher NEW
Misaki RoysterRussiaOnyama Limba QUALIFIED
David DarakjyJapanElwin Sharvill QUALIFIED
Greenwood BologniaUnited KingdomOnyama Limba PROPOSAL
Murillo MaletJapanAsiya Javayant RENEWAL
Aditya KuskoFranceAsiya Javayant QUALIFIED
Sinclair WaycottSpainBernardo Dominic UNQUALIFIED
Faith GillianRussiaIvan Magalhaes RENEWAL
Maria MarrierIndiaAmy Elsner UNQUALIFIED
Darci PoquetteArgentinaIoni Bowcher RENEWAL
Wickens NestleIndiaXuxue Feng RENEWAL
Costa DilliardFranceOnyama Limba NEW
Francesco ShinkoBrazilAnna Fali UNQUALIFIED
David DarakjySpainIvan Magalhaes UNQUALIFIED
Tony FollerRussiaElwin Sharvill RENEWAL
Alejandro PerinItalyIvan Magalhaes NEW
Emily WhobreyArgentinaAmy Elsner NEW
Morrow RutaItalyStephen Shaw RENEWAL
Mujtaba NickaCanadaOnyama Limba NEW
Octavia MaletIndiaIoni Bowcher QUALIFIED
Ricardo GauchoGermanyBernardo Dominic NEW
Tony FollerCanadaStephen Shaw RENEWAL
Silvio SlusarskiArgentinaBernardo Dominic NEW
Misaki RoysterArgentinaAnna Fali PROPOSAL
Tony FollerSpainIvan Magalhaes RENEWAL
Alejandro PerinIndiaAmy Elsner NEGOTIATION
Silvio SlusarskiItalyIvan Magalhaes UNQUALIFIED
Darci PoquetteArgentinaStephen Shaw NEW
Darci PoquetteJapanIoni Bowcher NEW
Clifford RimGermanyIoni Bowcher QUALIFIED
Emily WhobreyItalyIoni Bowcher QUALIFIED
Smith GlickCanadaXuxue Feng NEGOTIATION
Greenwood BologniaCanadaAnna Fali RENEWAL
Greenwood BologniaBrazilElwin Sharvill NEGOTIATION
Octavia MaletBrazilAnna Fali PROPOSAL
Silvio SlusarskiJapanElwin Sharvill PROPOSAL
Kadeem FlosiJapanIvan Magalhaes QUALIFIED
Aika InouyeBrazilElwin Sharvill UNQUALIFIED
Ivar PaprockiItalyIvan Magalhaes QUALIFIED
Misaki RoysterGermanyAmy Elsner RENEWAL
Chavez BriddickUnited KingdomBernardo Dominic NEW
Horizontal
NameCountryRepresentativeStatus
Johnson SergiCanadaOnyama Limba UNQUALIFIED
Leja CaldareraBrazilXuxue Feng NEGOTIATION
Alejandro PerinAustraliaIvan Magalhaes UNQUALIFIED
David DarakjyArgentinaIvan Magalhaes QUALIFIED
Ivar PaprockiJapanIvan Magalhaes NEGOTIATION
Mujtaba NickaAustraliaXuxue Feng QUALIFIED
Clifford RimIndiaIvan Magalhaes NEGOTIATION
Aruna FigeroaGermanyIvan Magalhaes NEW
Nicolas IturbideBrazilAsiya Javayant NEW
Kadeem FlosiBrazilStephen Shaw NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Maisha RulapaughIndia2026-06-02Rangoni Of Florence NEGOTIATION92Ivan Magalhaes
1001Jeanfrancois VenereAustralia2026-06-16Commercial Press UNQUALIFIED47Xuxue Feng
1002Jennifer AmigonBrazil2026-06-04Feltz Printing Service UNQUALIFIED13Asiya Javayant
1003Jennifer AmigonJapan2026-06-05Rousseaux, Michael Esq RENEWAL16Anna Fali
1004Munro FerenczBrazil2026-06-05Dorl, James J Esq QUALIFIED65Stephen Shaw
1005Aditya KuskoUnited Kingdom2026-06-02Dorl, James J Esq QUALIFIED41Bernardo Dominic
1006Kaitlin OstroskyRussia2026-06-16King, Christopher A Esq PROPOSAL33Asiya Javayant
1007Darci PoquetteGermany2026-06-01Rousseaux, Michael Esq NEW36Bernardo Dominic
1008Antonio CaudyFrance2026-06-05King, Christopher A Esq PROPOSAL92Bernardo Dominic
1009Deepesh ChuiBrazil2026-06-12Feiner Bros UNQUALIFIED52Stephen Shaw
1010Antonio CaudySpain2026-06-08Chanay, Jeffrey A Esq PROPOSAL98Xuxue Feng
1011Johnson SergiIndia2026-05-21Chemel, James L Cpa RENEWAL62Anna Fali
1012Cody SaylorsRussia2026-06-08King, Christopher A Esq PROPOSAL66Ivan Magalhaes
1013Murillo MaletSpain2026-05-24Chanay, Jeffrey A Esq NEW37Bernardo Dominic
1014Izzy GarufiBrazil2026-05-25Benton, John B Jr UNQUALIFIED75Bernardo Dominic
1015Leon OldroydJapan2026-05-31Feiner Bros NEGOTIATION56Amy Elsner
1016Jefferson SchemmerJapan2026-06-16Rangoni Of Florence RENEWAL50Xuxue Feng
1017Greenwood BologniaRussia2026-06-07King, Christopher A Esq QUALIFIED38Ivan Magalhaes
1018Kadeem FlosiUnited Kingdom2026-05-21Chapman, Ross E Esq UNQUALIFIED75Amy Elsner
1019Wickens NestleItaly2026-06-14Truhlar And Truhlar Attys NEGOTIATION39Asiya Javayant
1020Chavez BriddickIndia2026-06-03Feltz Printing Service QUALIFIED81Ioni Bowcher
1021Kadeem FlosiRussia2026-06-07Chapman, Ross E Esq PROPOSAL9Onyama Limba
1022Leon OldroydRussia2026-06-05Feiner Bros NEW79Xuxue Feng
1023Jones VocelkaUnited Kingdom2026-06-01Feltz Printing Service UNQUALIFIED54Onyama Limba
1024Mayumi KolmetzAustralia2026-05-28Chapman, Ross E Esq NEW0Stephen Shaw
1025Silvio SlusarskiArgentina2026-05-21Commercial Press PROPOSAL68Xuxue Feng
1026Jeanfrancois VenereFrance2026-05-23Chanay, Jeffrey A Esq NEGOTIATION25Xuxue Feng
1027Aruna FigeroaSpain2026-05-21Commercial Press UNQUALIFIED36Asiya Javayant
1028Silvio SlusarskiIndia2026-06-15Printing Dimensions RENEWAL28Stephen Shaw
1029Clifford RimCanada2026-06-07Rousseaux, Michael Esq PROPOSAL52Amy Elsner
1030Greenwood BologniaBrazil2026-05-29Feltz Printing Service NEGOTIATION22Anna Fali
1031Ashley DoeFrance2026-05-27Commercial Press RENEWAL49Anna Fali
1032Emily WhobreyCanada2026-05-26Buckley Miller Wright PROPOSAL17Onyama Limba
1033Ivar PaprockiBrazil2026-05-21Chemel, James L Cpa PROPOSAL65Elwin Sharvill
1034Alejandro PerinFrance2026-06-14Feltz Printing Service PROPOSAL66Anna Fali
1035Aruna FigeroaCanada2026-06-15Chanay, Jeffrey A Esq NEGOTIATION59Xuxue Feng
1036Aruna FigeroaCanada2026-06-15King, Christopher A Esq NEW39Ivan Magalhaes
1037Costa DilliardGermany2026-05-30Feltz Printing Service QUALIFIED7Bernardo Dominic
1038Faith GillianUnited Kingdom2026-05-25Feltz Printing Service QUALIFIED22Xuxue Feng
1039Chavez BriddickArgentina2026-06-13Chemel, James L Cpa UNQUALIFIED34Stephen Shaw
1040Claire TollnerIndia2026-05-30King, Christopher A Esq QUALIFIED64Anna Fali
1041Kaitlin OstroskyUnited Kingdom2026-06-10Feltz Printing Service RENEWAL82Elwin Sharvill
1042Aruna FigeroaArgentina2026-05-30Truhlar And Truhlar Attys NEW43Xuxue Feng
1043Leon OldroydArgentina2026-05-22Truhlar And Truhlar Attys UNQUALIFIED28Anna Fali
1044Morrow RutaRussia2026-06-06Chapman, Ross E Esq UNQUALIFIED30Bernardo Dominic
1045Kaitlin OstroskyRussia2026-05-25Buckley Miller Wright RENEWAL93Anna Fali
1046Octavia MaletRussia2026-06-07Chapman, Ross E Esq RENEWAL22Xuxue Feng
1047Costa DilliardSpain2026-06-12Commercial Press PROPOSAL94Onyama Limba
1048Murillo MaletItaly2026-06-17Rousseaux, Michael Esq QUALIFIED87Amy Elsner
1049Juan WieserAustralia2026-05-30Chapman, Ross E Esq QUALIFIED38Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Arvin AlbaresGermanyAnna Fali NEGOTIATION
Costa DilliardGermanyAnna Fali NEW
Stacey MacleadArgentinaStephen Shaw PROPOSAL
Ivar PaprockiBrazilIoni Bowcher UNQUALIFIED
Izzy GarufiArgentinaXuxue Feng QUALIFIED
Mayumi KolmetzJapanIvan Magalhaes RENEWAL
Adams MorascaFranceOnyama Limba UNQUALIFIED
Ashley DoeGermanyAnna Fali RENEWAL
Misaki RoysterCanadaElwin Sharvill RENEWAL
Stacey MacleadUnited KingdomAnna Fali RENEWAL
Ivar PaprockiSpainAmy Elsner RENEWAL
Salvatore StockhamSpainAnna Fali QUALIFIED
Johnson SergiRussiaIvan Magalhaes NEW
Alejandro PerinRussiaAnna Fali RENEWAL
Faith GillianArgentinaAmy Elsner NEW
Mujtaba NickaBrazilIoni Bowcher PROPOSAL
Jefferson SchemmerAustraliaXuxue Feng NEW
Mujtaba NickaArgentinaOnyama Limba QUALIFIED
Kaitlin OstroskyArgentinaAnna Fali QUALIFIED
Ricardo GauchoBrazilElwin Sharvill QUALIFIED
Arvin AlbaresItalyIvan Magalhaes NEW
Leja CaldareraCanadaXuxue Feng PROPOSAL
Claire TollnerIndiaOnyama Limba RENEWAL
Jones VocelkaRussiaXuxue Feng UNQUALIFIED
Claire TollnerAustraliaAsiya Javayant UNQUALIFIED
Isabel BowleyArgentinaOnyama Limba QUALIFIED
Ivar PaprockiGermanyIvan Magalhaes PROPOSAL
Ricardo GauchoFranceOnyama Limba NEW
Jefferson SchemmerCanadaStephen Shaw QUALIFIED
Claire TollnerUnited KingdomXuxue Feng UNQUALIFIED
Tony FollerUnited KingdomAnna Fali NEGOTIATION
Aditya KuskoRussiaStephen Shaw UNQUALIFIED
Arvin AlbaresBrazilOnyama Limba RENEWAL
Jones VocelkaBrazilAmy Elsner RENEWAL
Rodrigues CampainBrazilElwin Sharvill UNQUALIFIED
James ButtCanadaIvan Magalhaes NEGOTIATION
Juan WieserArgentinaAsiya Javayant NEGOTIATION
Murillo MaletBrazilElwin Sharvill PROPOSAL
Francesco ShinkoGermanyIvan Magalhaes QUALIFIED
Clifford RimItalyAsiya Javayant QUALIFIED
Arvin AlbaresSpainBernardo Dominic NEW
Aika InouyeUnited KingdomAnna Fali PROPOSAL
Morrow RutaFranceIvan Magalhaes QUALIFIED
Cody SaylorsUnited KingdomXuxue Feng PROPOSAL
Nicolas IturbideGermanyBernardo Dominic QUALIFIED
Chavez BriddickFranceOnyama Limba RENEWAL
Aika InouyeItalyIoni Bowcher UNQUALIFIED
Mayumi KolmetzJapanBernardo Dominic RENEWAL
Faith GillianFranceIvan Magalhaes QUALIFIED
Rodrigues CampainJapanIoni Bowcher RENEWAL
Frozen Columns
Name
Emily Whobrey
Francesco Shinko
Maria Marrier
Costa Dilliard
Arvin Albares
Deepesh Chui
Silvio Slusarski
Stacey Maclead
Claire Tollner
Cody Saylors
Aika Inouye
Costa Dilliard
Jeanfrancois Venere
Tony Foller
Izzy Garufi
Claire Tollner
Nicolas Iturbide
Mayumi Kolmetz
Jeanfrancois Venere
Faith Gillian
Jeanfrancois Venere
Mujtaba Nicka
Julie Stenseth
Johnson Sergi
Antonio Caudy
Jones Vocelka
Jennifer Amigon
Leja Caldarera
Antonio Caudy
Murillo Malet
Maria Marrier
Sinclair Waycott
Izzy Garufi
Francesco Shinko
Leon Oldroyd
Arvin Albares
Adams Morasca
Arvin Albares
Kaitlin Ostrosky
Smith Glick
Jones Vocelka
Wickens Nestle
Francesco Shinko
Jeanfrancois Venere
David Darakjy
Chavez Briddick
Silvio Slusarski
Rodrigues Campain
Wickens Nestle
Maria Marrier
IdCountryDate
1000Germany2026-06-07
1001Japan2026-05-28
1002Italy2026-06-17
1003Argentina2026-05-31
1004Australia2026-06-17
1005Canada2026-06-08
1006Canada2026-05-27
1007Canada2026-06-06
1008Brazil2026-06-02
1009Brazil2026-05-20
1010Brazil2026-06-07
1011Canada2026-05-30
1012Russia2026-06-09
1013France2026-06-04
1014Brazil2026-05-21
1015Italy2026-06-05
1016Brazil2026-05-31
1017Germany2026-05-30
1018Australia2026-06-04
1019Argentina2026-05-23
1020Canada2026-06-14
1021United Kingdom2026-05-31
1022Argentina2026-05-20
1023Russia2026-06-03
1024Spain2026-06-11
1025Argentina2026-06-09
1026United Kingdom2026-06-01
1027Germany2026-06-03
1028Canada2026-06-17
1029United Kingdom2026-06-13
1030Brazil2026-06-14
1031Australia2026-06-11
1032Canada2026-05-27
1033Spain2026-05-27
1034Japan2026-06-16
1035Australia2026-05-21
1036Italy2026-05-27
1037India2026-05-31
1038Italy2026-06-11
1039Italy2026-06-09
1040Russia2026-06-11
1041India2026-05-21
1042Italy2026-06-03
1043India2026-05-25
1044Italy2026-06-08
1045United Kingdom2026-05-25
1046Brazil2026-05-23
1047Italy2026-06-08
1048Japan2026-06-06
1049United Kingdom2026-05-31

On-Demand Data

NameIdCountryDate
Leja Caldarera1000Japan2026-06-18
Kaitlin Ostrosky1001Canada2026-06-10
Ashley Doe1002Argentina2026-05-31
Antonio Caudy1003Brazil2026-05-21
Silvio Slusarski1004Canada2026-06-09
Jennifer Amigon1005Spain2026-06-16
Greenwood Bolognia1006Russia2026-06-02
Mujtaba Nicka1007Italy2026-06-10
Costa Dilliard1008Australia2026-05-21
Smith Glick1009Canada2026-06-02
Mujtaba Nicka1010India2026-06-13
Arvin Albares1011Australia2026-05-30
Julie Stenseth1012Australia2026-06-01
Tony Foller1013Spain2026-05-28
Emily Whobrey1014Spain2026-05-21
Wickens Nestle1015Italy2026-05-25
Claire Tollner1016Argentina2026-05-20
Chavez Briddick1017Germany2026-06-09
Morrow Ruta1018Brazil2026-06-13
Ashley Doe1019United Kingdom2026-05-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jones VocelkaGermanyBernardo Dominic QUALIFIED
Jefferson SchemmerGermanyAsiya Javayant NEGOTIATION
Leon OldroydItalyIoni Bowcher NEGOTIATION
Emily WhobreyJapanIoni Bowcher QUALIFIED
Deepesh ChuiRussiaXuxue Feng NEW
Greenwood BologniaIndiaAmy Elsner NEW
Rodrigues CampainGermanyAsiya Javayant RENEWAL
Mayumi KolmetzRussiaAmy Elsner NEW
Kadeem FlosiSpainAnna Fali UNQUALIFIED
Octavia MaletFranceStephen Shaw UNQUALIFIED
Rodrigues CampainJapanElwin Sharvill QUALIFIED
Aika InouyeCanadaIvan Magalhaes PROPOSAL
Salvatore StockhamFranceOnyama Limba NEW
Munro FerenczArgentinaAmy Elsner NEW
Julie StensethJapanOnyama Limba NEGOTIATION
Antonio CaudyIndiaStephen Shaw PROPOSAL
Cody SaylorsItalyIvan Magalhaes PROPOSAL
Cody SaylorsCanadaOnyama Limba NEW
Silvio SlusarskiArgentinaAmy Elsner RENEWAL
Jennifer AmigonRussiaStephen Shaw NEGOTIATION
David DarakjyGermanyElwin Sharvill NEGOTIATION
Wickens NestleArgentinaElwin Sharvill RENEWAL
Faith GillianJapanElwin Sharvill UNQUALIFIED
Chavez BriddickAustraliaAnna Fali QUALIFIED
Octavia MaletRussiaElwin Sharvill QUALIFIED
Morrow RutaArgentinaAnna Fali NEGOTIATION
Maisha RulapaughRussiaBernardo Dominic UNQUALIFIED
Munro FerenczBrazilAmy Elsner NEGOTIATION
Cody SaylorsBrazilElwin Sharvill UNQUALIFIED
Jefferson SchemmerCanadaIoni Bowcher PROPOSAL
Octavia MaletBrazilAmy Elsner RENEWAL
Costa DilliardUnited KingdomXuxue Feng NEW
Clifford RimIndiaAnna Fali UNQUALIFIED
Adams MorascaGermanyXuxue Feng UNQUALIFIED
Silvio SlusarskiIndiaAsiya Javayant QUALIFIED
Arvin AlbaresArgentinaBernardo Dominic RENEWAL
Morrow RutaBrazilElwin Sharvill QUALIFIED
Leja CaldareraIndiaElwin Sharvill QUALIFIED
Munro FerenczFranceIvan Magalhaes NEW
Cody SaylorsItalyIvan Magalhaes 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>