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
Sinclair WaycottFranceIoni Bowcher RENEWAL
Jefferson SchemmerJapanAmy Elsner NEGOTIATION
Mayumi KolmetzJapanAnna Fali NEW
Morrow RutaSpainAnna Fali UNQUALIFIED
Ashley DoeItalyStephen Shaw PROPOSAL
Isabel BowleyArgentinaAmy Elsner QUALIFIED
Wickens NestleSpainXuxue Feng UNQUALIFIED
Julie StensethJapanAmy Elsner QUALIFIED
Izzy GarufiUnited KingdomBernardo Dominic UNQUALIFIED
Morrow RutaSpainOnyama Limba NEGOTIATION
Murillo MaletCanadaAnna Fali QUALIFIED
Johnson SergiGermanyStephen Shaw NEGOTIATION
Leon OldroydFranceStephen Shaw QUALIFIED
Leon OldroydItalyStephen Shaw RENEWAL
Julie StensethAustraliaIvan Magalhaes NEGOTIATION
Ashley DoeUnited KingdomIvan Magalhaes NEW
Deepesh ChuiJapanIoni Bowcher NEGOTIATION
Sinclair WaycottFranceBernardo Dominic UNQUALIFIED
Francesco ShinkoFranceAsiya Javayant NEGOTIATION
Murillo MaletItalyAnna Fali NEW
David DarakjyJapanElwin Sharvill UNQUALIFIED
Alejandro PerinItalyIoni Bowcher NEGOTIATION
Julie StensethBrazilAmy Elsner NEW
Faith GillianBrazilAnna Fali QUALIFIED
Clifford RimAustraliaIoni Bowcher NEW
Ricardo GauchoCanadaElwin Sharvill UNQUALIFIED
Maria MarrierGermanyIoni Bowcher UNQUALIFIED
Aditya KuskoIndiaAnna Fali QUALIFIED
Julie StensethUnited KingdomStephen Shaw NEW
Isabel BowleyIndiaAsiya Javayant RENEWAL
Nicolas IturbideJapanBernardo Dominic RENEWAL
Jeanfrancois VenereAustraliaIvan Magalhaes PROPOSAL
Silvio SlusarskiBrazilIoni Bowcher NEW
Costa DilliardCanadaBernardo Dominic PROPOSAL
Smith GlickArgentinaXuxue Feng RENEWAL
Maisha RulapaughIndiaOnyama Limba UNQUALIFIED
Adams MorascaRussiaOnyama Limba UNQUALIFIED
Aditya KuskoArgentinaIoni Bowcher PROPOSAL
James ButtFranceIoni Bowcher PROPOSAL
Maisha RulapaughBrazilStephen Shaw NEGOTIATION
Murillo MaletJapanAmy Elsner PROPOSAL
Leon OldroydArgentinaElwin Sharvill NEGOTIATION
Cody SaylorsFranceAnna Fali NEW
Cody SaylorsArgentinaIoni Bowcher RENEWAL
Jefferson SchemmerArgentinaIoni Bowcher UNQUALIFIED
Greenwood BologniaAustraliaAmy Elsner UNQUALIFIED
Tony FollerAustraliaXuxue Feng PROPOSAL
Kaitlin OstroskyBrazilAnna Fali UNQUALIFIED
Nicolas IturbideGermanyIvan Magalhaes UNQUALIFIED
Aditya KuskoBrazilAmy Elsner NEW
Horizontal
NameCountryRepresentativeStatus
Faith GillianCanadaIoni Bowcher UNQUALIFIED
Ivar PaprockiBrazilIvan Magalhaes NEGOTIATION
James ButtAustraliaIoni Bowcher PROPOSAL
Emily WhobreyIndiaXuxue Feng PROPOSAL
Misaki RoysterIndiaAsiya Javayant NEGOTIATION
James ButtIndiaOnyama Limba NEGOTIATION
Jefferson SchemmerAustraliaXuxue Feng UNQUALIFIED
Rodrigues CampainArgentinaXuxue Feng NEW
Ricardo GauchoSpainAsiya Javayant QUALIFIED
Alejandro PerinItalyOnyama Limba UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Ivar PaprockiUnited Kingdom2025-09-15Chanay, Jeffrey A Esq PROPOSAL59Anna Fali
1001Claire TollnerGermany2025-08-28Chanay, Jeffrey A Esq RENEWAL69Asiya Javayant
1002Tony FollerSpain2025-08-23King, Christopher A Esq NEGOTIATION47Xuxue Feng
1003Sinclair WaycottItaly2025-08-26King, Christopher A Esq RENEWAL40Asiya Javayant
1004Arvin AlbaresAustralia2025-09-12Chemel, James L Cpa NEGOTIATION9Stephen Shaw
1005Sinclair WaycottGermany2025-09-07Feltz Printing Service PROPOSAL54Onyama Limba
1006Stacey MacleadIndia2025-09-19Feiner Bros PROPOSAL99Anna Fali
1007Tony FollerAustralia2025-09-14Feiner Bros RENEWAL59Asiya Javayant
1008Clifford RimAustralia2025-09-20Feiner Bros UNQUALIFIED19Bernardo Dominic
1009Maisha RulapaughAustralia2025-09-08Chemel, James L Cpa PROPOSAL39Onyama Limba
1010Aditya KuskoUnited Kingdom2025-09-08Buckley Miller Wright NEGOTIATION63Elwin Sharvill
1011Smith GlickItaly2025-08-24Truhlar And Truhlar Attys UNQUALIFIED98Ioni Bowcher
1012Wickens NestleJapan2025-09-20Rangoni Of Florence RENEWAL96Ioni Bowcher
1013Faith GillianGermany2025-09-11Truhlar And Truhlar Attys QUALIFIED78Asiya Javayant
1014Arvin AlbaresFrance2025-09-07Rangoni Of Florence UNQUALIFIED7Anna Fali
1015Clifford RimIndia2025-09-20Rousseaux, Michael Esq NEW46Ioni Bowcher
1016Faith GillianRussia2025-09-15Dorl, James J Esq PROPOSAL80Bernardo Dominic
1017Faith GillianAustralia2025-09-04King, Christopher A Esq NEW0Xuxue Feng
1018Leja CaldareraAustralia2025-09-11Chanay, Jeffrey A Esq QUALIFIED14Xuxue Feng
1019Isabel BowleyRussia2025-08-25Chemel, James L Cpa NEGOTIATION4Onyama Limba
1020Silvio SlusarskiBrazil2025-09-10Morlong Associates PROPOSAL21Onyama Limba
1021Maria MarrierJapan2025-08-28Chapman, Ross E Esq PROPOSAL13Asiya Javayant
1022Wickens NestleUnited Kingdom2025-08-26Truhlar And Truhlar Attys PROPOSAL37Onyama Limba
1023Wickens NestleItaly2025-09-03Chemel, James L Cpa RENEWAL19Onyama Limba
1024Jeanfrancois VenereItaly2025-08-30Rousseaux, Michael Esq UNQUALIFIED2Anna Fali
1025Sinclair WaycottUnited Kingdom2025-09-18Chemel, James L Cpa RENEWAL94Bernardo Dominic
1026Chavez BriddickBrazil2025-08-24Dorl, James J Esq NEW54Xuxue Feng
1027Johnson SergiRussia2025-09-02Chapman, Ross E Esq PROPOSAL60Ivan Magalhaes
1028Mujtaba NickaIndia2025-09-15Chemel, James L Cpa UNQUALIFIED13Bernardo Dominic
1029Sinclair WaycottCanada2025-09-06Morlong Associates QUALIFIED6Stephen Shaw
1030Maisha RulapaughFrance2025-09-05King, Christopher A Esq RENEWAL53Ivan Magalhaes
1031Adams MorascaGermany2025-09-10Truhlar And Truhlar Attys NEGOTIATION73Anna Fali
1032Juan WieserBrazil2025-09-05Feltz Printing Service NEGOTIATION73Bernardo Dominic
1033Rodrigues CampainAustralia2025-08-22Chemel, James L Cpa RENEWAL66Ioni Bowcher
1034Leon OldroydItaly2025-09-08Dorl, James J Esq RENEWAL99Anna Fali
1035Aika InouyeCanada2025-09-14Truhlar And Truhlar Attys NEGOTIATION43Ivan Magalhaes
1036Smith GlickItaly2025-09-04Chanay, Jeffrey A Esq NEW90Onyama Limba
1037Silvio SlusarskiBrazil2025-09-02Morlong Associates RENEWAL91Ioni Bowcher
1038Isabel BowleySpain2025-09-17Chemel, James L Cpa UNQUALIFIED88Bernardo Dominic
1039Smith GlickIndia2025-09-12Feiner Bros RENEWAL87Xuxue Feng
1040Nicolas IturbideAustralia2025-09-04King, Christopher A Esq RENEWAL1Xuxue Feng
1041James ButtRussia2025-08-30Chanay, Jeffrey A Esq NEW31Anna Fali
1042Octavia MaletFrance2025-09-08King, Christopher A Esq PROPOSAL83Ivan Magalhaes
1043Mujtaba NickaRussia2025-09-14Dorl, James J Esq PROPOSAL23Amy Elsner
1044Chavez BriddickGermany2025-08-29Rangoni Of Florence UNQUALIFIED23Elwin Sharvill
1045Leon OldroydFrance2025-08-27King, Christopher A Esq NEW32Ioni Bowcher
1046Kadeem FlosiItaly2025-08-26Morlong Associates NEW52Ioni Bowcher
1047Misaki RoysterRussia2025-09-16Dorl, James J Esq NEW65Onyama Limba
1048Sinclair WaycottAustralia2025-09-15Truhlar And Truhlar Attys PROPOSAL43Xuxue Feng
1049Faith GillianArgentina2025-09-13Truhlar And Truhlar Attys PROPOSAL92Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Nicolas IturbideRussiaIvan Magalhaes NEW
Rodrigues CampainItalyElwin Sharvill NEGOTIATION
Misaki RoysterGermanyIoni Bowcher PROPOSAL
Tony FollerIndiaAnna Fali NEGOTIATION
Emily WhobreyItalyStephen Shaw NEW
Aika InouyeAustraliaAnna Fali NEW
Aika InouyeUnited KingdomIoni Bowcher PROPOSAL
Leon OldroydGermanyOnyama Limba UNQUALIFIED
Sinclair WaycottRussiaAmy Elsner QUALIFIED
Aditya KuskoBrazilAnna Fali PROPOSAL
Wickens NestleUnited KingdomAsiya Javayant RENEWAL
Jeanfrancois VenereSpainOnyama Limba UNQUALIFIED
Jeanfrancois VenereUnited KingdomAsiya Javayant NEW
Antonio CaudyArgentinaAnna Fali NEW
Leja CaldareraAustraliaAnna Fali NEW
Costa DilliardUnited KingdomAmy Elsner NEW
Alejandro PerinBrazilIvan Magalhaes NEGOTIATION
Claire TollnerAustraliaIoni Bowcher QUALIFIED
Wickens NestleJapanAnna Fali UNQUALIFIED
Tony FollerItalyAnna Fali NEW
Julie StensethIndiaOnyama Limba RENEWAL
Jennifer AmigonJapanBernardo Dominic NEW
Misaki RoysterArgentinaXuxue Feng QUALIFIED
Nicolas IturbideRussiaAsiya Javayant QUALIFIED
Jones VocelkaJapanAsiya Javayant RENEWAL
Isabel BowleyFranceOnyama Limba NEGOTIATION
Jennifer AmigonGermanyIoni Bowcher PROPOSAL
Claire TollnerJapanOnyama Limba UNQUALIFIED
Juan WieserRussiaOnyama Limba NEW
Murillo MaletFranceStephen Shaw QUALIFIED
Costa DilliardBrazilOnyama Limba NEW
Claire TollnerGermanyAnna Fali UNQUALIFIED
Darci PoquetteCanadaXuxue Feng NEGOTIATION
Sinclair WaycottFranceAsiya Javayant RENEWAL
Isabel BowleyUnited KingdomElwin Sharvill NEW
Kadeem FlosiJapanAnna Fali PROPOSAL
Sinclair WaycottGermanyStephen Shaw UNQUALIFIED
Mujtaba NickaFranceOnyama Limba NEGOTIATION
Nicolas IturbideRussiaElwin Sharvill PROPOSAL
Maisha RulapaughBrazilElwin Sharvill NEW
Emily WhobreyAustraliaIvan Magalhaes PROPOSAL
Jeanfrancois VenereAustraliaXuxue Feng QUALIFIED
Ricardo GauchoAustraliaXuxue Feng NEGOTIATION
Clifford RimItalyIoni Bowcher QUALIFIED
Maisha RulapaughBrazilAsiya Javayant QUALIFIED
Cody SaylorsFranceAmy Elsner UNQUALIFIED
Murillo MaletGermanyBernardo Dominic RENEWAL
Francesco ShinkoGermanyElwin Sharvill UNQUALIFIED
Ricardo GauchoSpainElwin Sharvill UNQUALIFIED
James ButtFranceXuxue Feng QUALIFIED
Frozen Columns
Name
Jeanfrancois Venere
Isabel Bowley
Salvatore Stockham
Deepesh Chui
Salvatore Stockham
Silvio Slusarski
Adams Morasca
James Butt
Morrow Ruta
Rodrigues Campain
Tony Foller
Silvio Slusarski
Greenwood Bolognia
Morrow Ruta
Emily Whobrey
Smith Glick
Isabel Bowley
Mujtaba Nicka
Rodrigues Campain
Aruna Figeroa
Jennifer Amigon
Kaitlin Ostrosky
Adams Morasca
Emily Whobrey
Jennifer Amigon
Alejandro Perin
Jeanfrancois Venere
Jeanfrancois Venere
Emily Whobrey
Jeanfrancois Venere
Greenwood Bolognia
Ricardo Gaucho
Maria Marrier
Nicolas Iturbide
Leja Caldarera
Chavez Briddick
Maisha Rulapaugh
Aruna Figeroa
Morrow Ruta
Misaki Royster
Jeanfrancois Venere
Ivar Paprocki
Costa Dilliard
Darci Poquette
Smith Glick
Rodrigues Campain
Francesco Shinko
James Butt
Kaitlin Ostrosky
Jennifer Amigon
IdCountryDate
1000Spain2025-08-30
1001Spain2025-09-09
1002Australia2025-08-30
1003India2025-08-27
1004Australia2025-09-13
1005Canada2025-08-24
1006Canada2025-09-14
1007Brazil2025-09-04
1008Italy2025-09-09
1009Japan2025-08-25
1010Italy2025-08-31
1011Russia2025-09-11
1012Japan2025-09-16
1013Russia2025-09-17
1014Spain2025-09-06
1015Australia2025-09-19
1016Spain2025-09-01
1017Canada2025-08-28
1018Spain2025-09-11
1019United Kingdom2025-09-01
1020Spain2025-08-23
1021Brazil2025-08-30
1022Australia2025-09-04
1023United Kingdom2025-09-08
1024United Kingdom2025-09-13
1025Spain2025-09-03
1026India2025-09-08
1027Germany2025-09-15
1028Brazil2025-09-04
1029Germany2025-08-27
1030Australia2025-09-07
1031Japan2025-09-10
1032Germany2025-08-23
1033Australia2025-08-28
1034Australia2025-08-24
1035Spain2025-09-09
1036Spain2025-09-12
1037Argentina2025-08-25
1038Japan2025-08-22
1039Italy2025-08-22
1040Spain2025-08-23
1041Germany2025-09-20
1042Italy2025-08-23
1043Canada2025-09-14
1044Japan2025-09-19
1045Italy2025-09-01
1046Spain2025-08-28
1047Italy2025-09-14
1048Argentina2025-09-11
1049Germany2025-08-22

On-Demand Data

NameIdCountryDate
Leja Caldarera1000Germany2025-09-09
Wickens Nestle1001Japan2025-09-09
Jefferson Schemmer1002Italy2025-09-02
Wickens Nestle1003Spain2025-09-02
Ashley Doe1004India2025-09-07
Emily Whobrey1005Italy2025-08-23
Mujtaba Nicka1006Spain2025-09-12
Morrow Ruta1007United Kingdom2025-09-12
Jeanfrancois Venere1008United Kingdom2025-08-26
Costa Dilliard1009Italy2025-09-02
Emily Whobrey1010Argentina2025-08-26
Silvio Slusarski1011Canada2025-09-15
Francesco Shinko1012Japan2025-08-27
Ricardo Gaucho1013Brazil2025-08-31
Wickens Nestle1014Germany2025-09-18
Smith Glick1015Spain2025-09-11
Cody Saylors1016Germany2025-09-03
Munro Ferencz1017India2025-09-11
Izzy Garufi1018Russia2025-09-06
Munro Ferencz1019France2025-09-09
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Clifford RimSpainElwin Sharvill PROPOSAL
Darci PoquetteBrazilAsiya Javayant QUALIFIED
Kaitlin OstroskyJapanAsiya Javayant PROPOSAL
Juan WieserRussiaAsiya Javayant NEW
Faith GillianBrazilElwin Sharvill NEGOTIATION
Murillo MaletBrazilElwin Sharvill NEGOTIATION
Maria MarrierFranceIvan Magalhaes PROPOSAL
Salvatore StockhamRussiaIvan Magalhaes NEGOTIATION
Sinclair WaycottSpainBernardo Dominic PROPOSAL
Aika InouyeArgentinaElwin Sharvill NEW
Rodrigues CampainJapanAmy Elsner RENEWAL
Julie StensethIndiaElwin Sharvill NEW
Kaitlin OstroskyFranceAnna Fali RENEWAL
Nicolas IturbideArgentinaIvan Magalhaes QUALIFIED
Claire TollnerIndiaXuxue Feng QUALIFIED
Aika InouyeItalyOnyama Limba QUALIFIED
Johnson SergiRussiaAnna Fali QUALIFIED
Emily WhobreyFranceIvan Magalhaes PROPOSAL
Mujtaba NickaGermanyXuxue Feng NEW
Aruna FigeroaItalyBernardo Dominic UNQUALIFIED
Chavez BriddickAustraliaIvan Magalhaes PROPOSAL
Maisha RulapaughAustraliaIvan Magalhaes NEGOTIATION
Jones VocelkaItalyAsiya Javayant QUALIFIED
Munro FerenczGermanyIvan Magalhaes UNQUALIFIED
Jones VocelkaArgentinaStephen Shaw RENEWAL
Darci PoquetteCanadaOnyama Limba UNQUALIFIED
Murillo MaletCanadaIvan Magalhaes PROPOSAL
Antonio CaudyAustraliaBernardo Dominic NEGOTIATION
Antonio CaudyAustraliaOnyama Limba NEW
Emily WhobreyItalyAnna Fali UNQUALIFIED
Silvio SlusarskiUnited KingdomAnna Fali QUALIFIED
Misaki RoysterRussiaBernardo Dominic NEGOTIATION
Jones VocelkaUnited KingdomStephen Shaw RENEWAL
Ricardo GauchoUnited KingdomIoni Bowcher QUALIFIED
Jefferson SchemmerFranceAnna Fali RENEWAL
Izzy GarufiCanadaElwin Sharvill NEW
Jeanfrancois VenereBrazilXuxue Feng QUALIFIED
Claire TollnerItalyAmy Elsner QUALIFIED
Jones VocelkaRussiaIoni Bowcher NEGOTIATION
Clifford RimAustraliaAmy Elsner 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>