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
Izzy GarufiCanadaXuxue Feng NEW
Jennifer AmigonSpainStephen Shaw UNQUALIFIED
Nicolas IturbideArgentinaAsiya Javayant NEW
Costa DilliardJapanAmy Elsner UNQUALIFIED
Faith GillianJapanBernardo Dominic NEW
Ricardo GauchoJapanStephen Shaw RENEWAL
Mujtaba NickaCanadaAnna Fali NEGOTIATION
Tony FollerSpainAnna Fali RENEWAL
Nicolas IturbideSpainOnyama Limba NEGOTIATION
Alejandro PerinFranceAnna Fali UNQUALIFIED
Kaitlin OstroskyItalyOnyama Limba PROPOSAL
James ButtUnited KingdomBernardo Dominic RENEWAL
Isabel BowleyRussiaIvan Magalhaes NEGOTIATION
Emily WhobreyBrazilXuxue Feng QUALIFIED
Morrow RutaSpainElwin Sharvill QUALIFIED
Francesco ShinkoArgentinaAmy Elsner UNQUALIFIED
Ashley DoeCanadaIoni Bowcher PROPOSAL
Mayumi KolmetzJapanBernardo Dominic UNQUALIFIED
Cody SaylorsCanadaOnyama Limba NEW
Aika InouyeIndiaElwin Sharvill NEW
Silvio SlusarskiFranceStephen Shaw NEGOTIATION
Clifford RimArgentinaIvan Magalhaes RENEWAL
Maisha RulapaughAustraliaBernardo Dominic QUALIFIED
Ashley DoeItalyAmy Elsner QUALIFIED
Deepesh ChuiGermanyXuxue Feng QUALIFIED
Costa DilliardArgentinaOnyama Limba PROPOSAL
Stacey MacleadGermanyIoni Bowcher NEGOTIATION
Nicolas IturbideJapanElwin Sharvill UNQUALIFIED
Murillo MaletFranceStephen Shaw RENEWAL
Chavez BriddickRussiaXuxue Feng UNQUALIFIED
Maria MarrierRussiaIvan Magalhaes NEW
Murillo MaletFranceStephen Shaw QUALIFIED
Jefferson SchemmerUnited KingdomAmy Elsner UNQUALIFIED
Nicolas IturbideSpainAnna Fali PROPOSAL
Claire TollnerJapanAnna Fali NEW
Adams MorascaIndiaXuxue Feng NEGOTIATION
Antonio CaudySpainStephen Shaw NEW
Juan WieserCanadaAmy Elsner PROPOSAL
Greenwood BologniaFranceOnyama Limba NEGOTIATION
Tony FollerIndiaIoni Bowcher NEW
Darci PoquetteBrazilElwin Sharvill UNQUALIFIED
Morrow RutaItalyOnyama Limba RENEWAL
Aditya KuskoGermanyAnna Fali PROPOSAL
Tony FollerItalyStephen Shaw QUALIFIED
Johnson SergiBrazilOnyama Limba NEGOTIATION
Rodrigues CampainUnited KingdomOnyama Limba RENEWAL
Greenwood BologniaRussiaAnna Fali QUALIFIED
Tony FollerArgentinaIvan Magalhaes NEW
Mayumi KolmetzAustraliaStephen Shaw QUALIFIED
Ricardo GauchoCanadaElwin Sharvill QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Jones VocelkaUnited KingdomStephen Shaw RENEWAL
Darci PoquetteIndiaXuxue Feng RENEWAL
Claire TollnerBrazilStephen Shaw RENEWAL
Munro FerenczFranceOnyama Limba QUALIFIED
Claire TollnerUnited KingdomStephen Shaw PROPOSAL
Claire TollnerArgentinaAsiya Javayant NEW
Claire TollnerFranceXuxue Feng NEW
Tony FollerArgentinaXuxue Feng NEW
David DarakjyItalyAsiya Javayant NEW
Aika InouyeRussiaAnna Fali NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Julie StensethIndia2026-05-26King, Christopher A Esq UNQUALIFIED25Ioni Bowcher
1001Faith GillianUnited Kingdom2026-05-29Chapman, Ross E Esq NEW88Xuxue Feng
1002Stacey MacleadCanada2026-05-14Truhlar And Truhlar Attys NEGOTIATION59Amy Elsner
1003Stacey MacleadArgentina2026-05-25Printing Dimensions NEW68Bernardo Dominic
1004Juan WieserArgentina2026-05-26Rangoni Of Florence UNQUALIFIED90Ivan Magalhaes
1005Johnson SergiIndia2026-05-13Feltz Printing Service PROPOSAL32Bernardo Dominic
1006Darci PoquetteRussia2026-05-31Buckley Miller Wright NEGOTIATION6Xuxue Feng
1007Sinclair WaycottUnited Kingdom2026-05-12Feiner Bros UNQUALIFIED22Ioni Bowcher
1008Clifford RimAustralia2026-05-17Morlong Associates NEW76Xuxue Feng
1009Kaitlin OstroskyBrazil2026-05-12Chemel, James L Cpa PROPOSAL78Elwin Sharvill
1010Mujtaba NickaItaly2026-05-23Chapman, Ross E Esq PROPOSAL64Anna Fali
1011Maria MarrierAustralia2026-05-31Morlong Associates NEGOTIATION63Amy Elsner
1012Salvatore StockhamGermany2026-05-26Commercial Press PROPOSAL89Asiya Javayant
1013Alejandro PerinAustralia2026-05-27Buckley Miller Wright NEGOTIATION5Ioni Bowcher
1014Leja CaldareraAustralia2026-05-26Truhlar And Truhlar Attys QUALIFIED31Onyama Limba
1015Antonio CaudyItaly2026-05-24Rangoni Of Florence QUALIFIED48Onyama Limba
1016Alejandro PerinItaly2026-05-18Truhlar And Truhlar Attys NEW3Ioni Bowcher
1017Stacey MacleadItaly2026-05-07Dorl, James J Esq PROPOSAL88Onyama Limba
1018James ButtBrazil2026-05-08Chanay, Jeffrey A Esq NEW81Ivan Magalhaes
1019Nicolas IturbideIndia2026-05-24Dorl, James J Esq RENEWAL89Elwin Sharvill
1020Maisha RulapaughAustralia2026-05-07Feltz Printing Service NEGOTIATION38Xuxue Feng
1021Smith GlickItaly2026-05-10Benton, John B Jr NEGOTIATION6Bernardo Dominic
1022Mujtaba NickaUnited Kingdom2026-05-30Feltz Printing Service NEW96Anna Fali
1023Misaki RoysterArgentina2026-05-20Chapman, Ross E Esq QUALIFIED28Bernardo Dominic
1024Deepesh ChuiAustralia2026-05-13Rangoni Of Florence NEW73Ivan Magalhaes
1025Isabel BowleyIndia2026-05-26Chanay, Jeffrey A Esq RENEWAL29Asiya Javayant
1026Smith GlickArgentina2026-05-06Chanay, Jeffrey A Esq UNQUALIFIED13Ivan Magalhaes
1027Deepesh ChuiCanada2026-06-01Commercial Press NEGOTIATION92Onyama Limba
1028Tony FollerFrance2026-06-01Feltz Printing Service NEGOTIATION43Ivan Magalhaes
1029Faith GillianRussia2026-05-27Feiner Bros NEW32Ioni Bowcher
1030David DarakjyJapan2026-05-29Chemel, James L Cpa PROPOSAL25Ioni Bowcher
1031Jefferson SchemmerFrance2026-05-28Rousseaux, Michael Esq NEGOTIATION73Amy Elsner
1032Ashley DoeCanada2026-05-09Dorl, James J Esq NEW85Stephen Shaw
1033Murillo MaletCanada2026-05-28Morlong Associates UNQUALIFIED87Xuxue Feng
1034Morrow RutaIndia2026-05-14Buckley Miller Wright QUALIFIED71Elwin Sharvill
1035Aditya KuskoUnited Kingdom2026-05-06Printing Dimensions PROPOSAL64Asiya Javayant
1036Alejandro PerinGermany2026-05-09Chemel, James L Cpa PROPOSAL13Stephen Shaw
1037Wickens NestleCanada2026-05-05Commercial Press PROPOSAL90Amy Elsner
1038Rodrigues CampainArgentina2026-06-01Morlong Associates RENEWAL84Stephen Shaw
1039Silvio SlusarskiFrance2026-05-13Commercial Press NEGOTIATION74Amy Elsner
1040Alejandro PerinCanada2026-05-30Rangoni Of Florence PROPOSAL38Ioni Bowcher
1041Wickens NestleArgentina2026-05-12Dorl, James J Esq QUALIFIED57Amy Elsner
1042Silvio SlusarskiBrazil2026-05-24Morlong Associates QUALIFIED18Asiya Javayant
1043Maisha RulapaughRussia2026-05-15Feltz Printing Service PROPOSAL51Bernardo Dominic
1044Morrow RutaSpain2026-05-29Dorl, James J Esq RENEWAL56Ioni Bowcher
1045Arvin AlbaresItaly2026-05-30Feltz Printing Service PROPOSAL67Onyama Limba
1046Ashley DoeRussia2026-05-29Feltz Printing Service NEW99Amy Elsner
1047Stacey MacleadUnited Kingdom2026-05-20Chanay, Jeffrey A Esq PROPOSAL44Ioni Bowcher
1048Darci PoquetteArgentina2026-05-25Chanay, Jeffrey A Esq UNQUALIFIED56Onyama Limba
1049Isabel BowleyUnited Kingdom2026-05-05Chemel, James L Cpa NEW73Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Salvatore StockhamJapanAnna Fali PROPOSAL
Jennifer AmigonUnited KingdomAmy Elsner RENEWAL
Aika InouyeJapanIvan Magalhaes PROPOSAL
Juan WieserFranceAmy Elsner PROPOSAL
Maisha RulapaughItalyXuxue Feng NEGOTIATION
Leon OldroydArgentinaOnyama Limba PROPOSAL
Ivar PaprockiGermanyAmy Elsner QUALIFIED
David DarakjyUnited KingdomXuxue Feng NEW
Julie StensethGermanyIoni Bowcher NEW
Izzy GarufiArgentinaXuxue Feng QUALIFIED
Alejandro PerinBrazilOnyama Limba PROPOSAL
Cody SaylorsJapanOnyama Limba RENEWAL
Clifford RimArgentinaOnyama Limba RENEWAL
Salvatore StockhamUnited KingdomAnna Fali NEW
Smith GlickArgentinaStephen Shaw RENEWAL
Francesco ShinkoArgentinaOnyama Limba QUALIFIED
Stacey MacleadRussiaIoni Bowcher UNQUALIFIED
Morrow RutaItalyXuxue Feng NEW
Kadeem FlosiItalyAsiya Javayant NEGOTIATION
Munro FerenczIndiaOnyama Limba NEW
Octavia MaletItalyAsiya Javayant NEGOTIATION
Emily WhobreyGermanyIvan Magalhaes NEGOTIATION
Jefferson SchemmerUnited KingdomStephen Shaw RENEWAL
James ButtJapanAnna Fali QUALIFIED
Darci PoquetteIndiaIvan Magalhaes NEW
Aruna FigeroaGermanyElwin Sharvill PROPOSAL
James ButtIndiaAsiya Javayant NEW
Chavez BriddickRussiaXuxue Feng NEGOTIATION
Juan WieserAustraliaAsiya Javayant NEGOTIATION
Jeanfrancois VenereGermanyIoni Bowcher UNQUALIFIED
Stacey MacleadUnited KingdomAmy Elsner NEGOTIATION
Chavez BriddickItalyAmy Elsner NEW
Stacey MacleadAustraliaStephen Shaw QUALIFIED
Salvatore StockhamIndiaElwin Sharvill QUALIFIED
Chavez BriddickGermanyBernardo Dominic PROPOSAL
Julie StensethItalyOnyama Limba RENEWAL
Arvin AlbaresSpainStephen Shaw PROPOSAL
Deepesh ChuiUnited KingdomIoni Bowcher UNQUALIFIED
Izzy GarufiItalyStephen Shaw NEGOTIATION
Salvatore StockhamItalyAnna Fali NEGOTIATION
Jennifer AmigonGermanyIoni Bowcher PROPOSAL
Arvin AlbaresSpainAmy Elsner RENEWAL
Darci PoquetteItalyXuxue Feng UNQUALIFIED
Silvio SlusarskiItalyBernardo Dominic RENEWAL
James ButtUnited KingdomXuxue Feng QUALIFIED
Aditya KuskoIndiaAnna Fali NEW
Octavia MaletJapanAnna Fali UNQUALIFIED
Faith GillianCanadaXuxue Feng RENEWAL
Salvatore StockhamItalyAmy Elsner QUALIFIED
Smith GlickUnited KingdomBernardo Dominic UNQUALIFIED
Frozen Columns
Name
Tony Foller
Ashley Doe
Leja Caldarera
Stacey Maclead
Mayumi Kolmetz
Smith Glick
Antonio Caudy
Izzy Garufi
Cody Saylors
Smith Glick
Ivar Paprocki
Costa Dilliard
Julie Stenseth
Smith Glick
Antonio Caudy
Ashley Doe
Wickens Nestle
Johnson Sergi
David Darakjy
Maisha Rulapaugh
Sinclair Waycott
Chavez Briddick
Stacey Maclead
Claire Tollner
Greenwood Bolognia
Alejandro Perin
Misaki Royster
Murillo Malet
Mujtaba Nicka
Wickens Nestle
Greenwood Bolognia
Cody Saylors
James Butt
Francesco Shinko
Juan Wieser
Faith Gillian
Claire Tollner
Kaitlin Ostrosky
Alejandro Perin
Izzy Garufi
Costa Dilliard
Ashley Doe
Maria Marrier
Smith Glick
Ivar Paprocki
Adams Morasca
Jefferson Schemmer
Darci Poquette
Costa Dilliard
Aika Inouye
IdCountryDate
1000Australia2026-05-16
1001Canada2026-05-29
1002Brazil2026-06-01
1003Russia2026-05-24
1004Germany2026-05-22
1005France2026-05-19
1006France2026-05-20
1007Germany2026-05-24
1008Italy2026-05-31
1009Italy2026-06-01
1010Argentina2026-05-29
1011Brazil2026-05-04
1012India2026-05-21
1013Argentina2026-06-02
1014Spain2026-05-29
1015Spain2026-05-06
1016Russia2026-05-08
1017Australia2026-05-12
1018India2026-05-29
1019Russia2026-05-17
1020Spain2026-05-08
1021France2026-05-06
1022Spain2026-05-31
1023Germany2026-05-06
1024France2026-05-08
1025Brazil2026-05-24
1026Spain2026-06-02
1027France2026-05-05
1028Germany2026-05-14
1029Russia2026-05-28
1030Australia2026-05-08
1031Argentina2026-05-30
1032Germany2026-06-01
1033India2026-05-19
1034Italy2026-05-11
1035Japan2026-05-13
1036Spain2026-05-31
1037Japan2026-05-28
1038Germany2026-05-17
1039United Kingdom2026-05-20
1040India2026-05-05
1041Italy2026-05-22
1042Italy2026-05-08
1043Argentina2026-05-10
1044Germany2026-05-18
1045Italy2026-05-19
1046Argentina2026-05-08
1047United Kingdom2026-05-28
1048France2026-05-04
1049Italy2026-05-30

On-Demand Data

NameIdCountryDate
Octavia Malet1000Canada2026-05-30
Antonio Caudy1001Russia2026-05-10
Julie Stenseth1002Canada2026-05-13
Ashley Doe1003Australia2026-05-27
Costa Dilliard1004Canada2026-05-19
Cody Saylors1005Brazil2026-05-12
Claire Tollner1006India2026-05-28
Mayumi Kolmetz1007United Kingdom2026-05-23
Leja Caldarera1008Canada2026-06-01
James Butt1009Argentina2026-05-23
Adams Morasca1010Canada2026-05-06
Adams Morasca1011Japan2026-05-19
Smith Glick1012Canada2026-05-09
Arvin Albares1013Brazil2026-05-08
Kaitlin Ostrosky1014Australia2026-05-21
Ricardo Gaucho1015Spain2026-05-13
Jennifer Amigon1016France2026-05-20
Francesco Shinko1017Argentina2026-05-10
Rodrigues Campain1018Russia2026-05-29
Francesco Shinko1019Australia2026-05-16
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Morrow RutaRussiaAmy Elsner UNQUALIFIED
Stacey MacleadUnited KingdomAmy Elsner NEW
Darci PoquetteFranceXuxue Feng NEW
Maisha RulapaughRussiaIoni Bowcher NEGOTIATION
Wickens NestleFranceAmy Elsner UNQUALIFIED
Sinclair WaycottGermanyXuxue Feng UNQUALIFIED
Jones VocelkaBrazilStephen Shaw RENEWAL
Darci PoquetteIndiaOnyama Limba PROPOSAL
Morrow RutaArgentinaStephen Shaw UNQUALIFIED
Stacey MacleadIndiaStephen Shaw NEW
Greenwood BologniaBrazilIoni Bowcher PROPOSAL
Salvatore StockhamBrazilStephen Shaw NEW
Julie StensethAustraliaElwin Sharvill UNQUALIFIED
Kaitlin OstroskyArgentinaOnyama Limba NEW
Maria MarrierArgentinaStephen Shaw NEGOTIATION
Wickens NestleIndiaOnyama Limba UNQUALIFIED
Tony FollerJapanXuxue Feng UNQUALIFIED
Julie StensethFranceIoni Bowcher NEGOTIATION
Ashley DoeBrazilAnna Fali PROPOSAL
Adams MorascaUnited KingdomIvan Magalhaes PROPOSAL
Stacey MacleadArgentinaXuxue Feng RENEWAL
Johnson SergiGermanyOnyama Limba PROPOSAL
Tony FollerAustraliaAmy Elsner PROPOSAL
David DarakjyArgentinaStephen Shaw UNQUALIFIED
Ashley DoeSpainStephen Shaw RENEWAL
Jefferson SchemmerJapanAmy Elsner QUALIFIED
Maisha RulapaughItalyAnna Fali NEW
Aditya KuskoBrazilIoni Bowcher NEW
Octavia MaletFranceStephen Shaw RENEWAL
Murillo MaletUnited KingdomStephen Shaw RENEWAL
Morrow RutaBrazilOnyama Limba UNQUALIFIED
Ivar PaprockiAustraliaBernardo Dominic PROPOSAL
James ButtGermanyBernardo Dominic PROPOSAL
Kaitlin OstroskySpainIvan Magalhaes RENEWAL
Morrow RutaGermanyXuxue Feng RENEWAL
Aruna FigeroaAustraliaIoni Bowcher RENEWAL
Cody SaylorsBrazilAsiya Javayant NEGOTIATION
Aika InouyeArgentinaXuxue Feng PROPOSAL
Stacey MacleadAustraliaStephen Shaw QUALIFIED
Kadeem FlosiBrazilAmy Elsner NEW

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