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
Maria MarrierUnited KingdomIvan Magalhaes NEGOTIATION
Jones VocelkaFranceElwin Sharvill UNQUALIFIED
Kadeem FlosiRussiaAsiya Javayant RENEWAL
Octavia MaletSpainIoni Bowcher QUALIFIED
Wickens NestleGermanyOnyama Limba NEW
Faith GillianBrazilXuxue Feng NEW
Murillo MaletJapanAmy Elsner UNQUALIFIED
Wickens NestleFranceAmy Elsner QUALIFIED
Jeanfrancois VenereRussiaAmy Elsner NEGOTIATION
Juan WieserIndiaAsiya Javayant RENEWAL
Octavia MaletCanadaAnna Fali NEW
Aditya KuskoFranceIoni Bowcher UNQUALIFIED
Octavia MaletRussiaAnna Fali PROPOSAL
Greenwood BologniaIndiaAsiya Javayant NEGOTIATION
Ivar PaprockiIndiaAsiya Javayant RENEWAL
Aruna FigeroaBrazilBernardo Dominic QUALIFIED
Clifford RimGermanyAmy Elsner NEGOTIATION
James ButtUnited KingdomAmy Elsner RENEWAL
Faith GillianBrazilElwin Sharvill RENEWAL
Tony FollerUnited KingdomIoni Bowcher NEGOTIATION
James ButtIndiaStephen Shaw NEGOTIATION
Izzy GarufiBrazilStephen Shaw NEGOTIATION
Murillo MaletItalyStephen Shaw NEW
Mujtaba NickaCanadaAnna Fali NEGOTIATION
Kaitlin OstroskyItalyIoni Bowcher NEW
Izzy GarufiFranceIoni Bowcher NEGOTIATION
Jones VocelkaIndiaIoni Bowcher QUALIFIED
Aruna FigeroaItalyBernardo Dominic RENEWAL
Aditya KuskoAustraliaStephen Shaw NEW
Mayumi KolmetzBrazilIvan Magalhaes NEGOTIATION
Alejandro PerinSpainIoni Bowcher QUALIFIED
Costa DilliardCanadaAmy Elsner QUALIFIED
Aika InouyeFranceOnyama Limba NEGOTIATION
Emily WhobreyArgentinaXuxue Feng QUALIFIED
Leja CaldareraRussiaXuxue Feng NEW
Nicolas IturbideCanadaStephen Shaw NEW
Ashley DoeJapanXuxue Feng NEGOTIATION
Julie StensethAustraliaStephen Shaw NEW
Stacey MacleadIndiaXuxue Feng RENEWAL
Jones VocelkaFranceXuxue Feng UNQUALIFIED
Julie StensethCanadaAnna Fali UNQUALIFIED
Mujtaba NickaCanadaElwin Sharvill RENEWAL
Leja CaldareraIndiaAmy Elsner NEW
Aika InouyeGermanyXuxue Feng PROPOSAL
Cody SaylorsBrazilElwin Sharvill RENEWAL
Misaki RoysterItalyAsiya Javayant RENEWAL
Emily WhobreySpainBernardo Dominic RENEWAL
Rodrigues CampainArgentinaIoni Bowcher QUALIFIED
Salvatore StockhamBrazilAmy Elsner QUALIFIED
Morrow RutaAustraliaAmy Elsner NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Morrow RutaGermanyAsiya Javayant PROPOSAL
Costa DilliardIndiaXuxue Feng NEGOTIATION
Morrow RutaSpainOnyama Limba PROPOSAL
Mujtaba NickaBrazilAmy Elsner PROPOSAL
Greenwood BologniaItalyOnyama Limba PROPOSAL
Mujtaba NickaItalyIvan Magalhaes NEGOTIATION
Emily WhobreySpainIvan Magalhaes PROPOSAL
Tony FollerJapanIvan Magalhaes RENEWAL
Francesco ShinkoJapanElwin Sharvill QUALIFIED
Chavez BriddickRussiaStephen Shaw NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aika InouyeJapan2026-04-11Chemel, James L Cpa PROPOSAL79Stephen Shaw
1001Deepesh ChuiSpain2026-04-07Chanay, Jeffrey A Esq NEGOTIATION14Ioni Bowcher
1002Wickens NestleItaly2026-04-24Chapman, Ross E Esq RENEWAL43Anna Fali
1003Chavez BriddickAustralia2026-04-24Morlong Associates UNQUALIFIED92Ioni Bowcher
1004Stacey MacleadArgentina2026-03-27Printing Dimensions NEW96Onyama Limba
1005Misaki RoysterGermany2026-03-28Rousseaux, Michael Esq QUALIFIED35Asiya Javayant
1006Greenwood BologniaItaly2026-04-06Rangoni Of Florence NEGOTIATION86Anna Fali
1007Juan WieserJapan2026-04-21Morlong Associates PROPOSAL17Ivan Magalhaes
1008Jeanfrancois VenereItaly2026-04-21King, Christopher A Esq UNQUALIFIED60Anna Fali
1009Jones VocelkaRussia2026-04-10Dorl, James J Esq RENEWAL14Amy Elsner
1010Jones VocelkaArgentina2026-03-30Benton, John B Jr QUALIFIED74Onyama Limba
1011Mujtaba NickaJapan2026-04-20Printing Dimensions NEW26Xuxue Feng
1012Jones VocelkaFrance2026-03-30King, Christopher A Esq PROPOSAL76Bernardo Dominic
1013Octavia MaletSpain2026-04-06King, Christopher A Esq NEW33Asiya Javayant
1014Silvio SlusarskiJapan2026-04-21Rangoni Of Florence PROPOSAL33Anna Fali
1015Munro FerenczGermany2026-04-07Chapman, Ross E Esq PROPOSAL77Anna Fali
1016Leon OldroydUnited Kingdom2026-03-30Dorl, James J Esq RENEWAL55Bernardo Dominic
1017Leja CaldareraRussia2026-04-06Chapman, Ross E Esq UNQUALIFIED97Ioni Bowcher
1018Juan WieserFrance2026-04-04King, Christopher A Esq PROPOSAL49Onyama Limba
1019James ButtBrazil2026-04-08Rousseaux, Michael Esq UNQUALIFIED2Anna Fali
1020Mujtaba NickaCanada2026-04-04King, Christopher A Esq QUALIFIED37Anna Fali
1021Ivar PaprockiBrazil2026-04-20Chapman, Ross E Esq UNQUALIFIED23Xuxue Feng
1022Izzy GarufiIndia2026-04-09Commercial Press QUALIFIED55Ioni Bowcher
1023Leon OldroydFrance2026-04-08Commercial Press NEW10Asiya Javayant
1024Izzy GarufiAustralia2026-04-23Chapman, Ross E Esq PROPOSAL86Stephen Shaw
1025Jefferson SchemmerUnited Kingdom2026-04-11Chanay, Jeffrey A Esq NEGOTIATION4Asiya Javayant
1026Costa DilliardRussia2026-04-01Commercial Press UNQUALIFIED27Asiya Javayant
1027Maisha RulapaughRussia2026-04-09Chemel, James L Cpa RENEWAL77Stephen Shaw
1028Izzy GarufiFrance2026-03-27Feltz Printing Service RENEWAL41Onyama Limba
1029Chavez BriddickRussia2026-04-11King, Christopher A Esq RENEWAL8Stephen Shaw
1030Johnson SergiArgentina2026-04-02Buckley Miller Wright PROPOSAL38Elwin Sharvill
1031Julie StensethBrazil2026-04-05Truhlar And Truhlar Attys NEW20Stephen Shaw
1032Johnson SergiArgentina2026-04-04Dorl, James J Esq QUALIFIED84Xuxue Feng
1033Jennifer AmigonFrance2026-04-24Chemel, James L Cpa PROPOSAL88Onyama Limba
1034Mujtaba NickaCanada2026-03-30Chapman, Ross E Esq NEGOTIATION94Ivan Magalhaes
1035Chavez BriddickJapan2026-04-03Rousseaux, Michael Esq NEGOTIATION61Elwin Sharvill
1036Greenwood BologniaArgentina2026-04-16Rangoni Of Florence NEGOTIATION69Stephen Shaw
1037Smith GlickUnited Kingdom2026-04-01Chanay, Jeffrey A Esq NEGOTIATION47Ivan Magalhaes
1038Maisha RulapaughCanada2026-03-27Chanay, Jeffrey A Esq UNQUALIFIED80Anna Fali
1039Mayumi KolmetzJapan2026-04-12Feltz Printing Service PROPOSAL72Anna Fali
1040Aruna FigeroaIndia2026-04-12Commercial Press UNQUALIFIED11Amy Elsner
1041Maria MarrierSpain2026-04-21Feltz Printing Service UNQUALIFIED10Stephen Shaw
1042Wickens NestleUnited Kingdom2026-04-15Chemel, James L Cpa UNQUALIFIED3Ivan Magalhaes
1043David DarakjySpain2026-04-02Feltz Printing Service NEW47Xuxue Feng
1044Kadeem FlosiRussia2026-04-24King, Christopher A Esq RENEWAL8Ioni Bowcher
1045Isabel BowleyFrance2026-04-01Commercial Press RENEWAL76Amy Elsner
1046Juan WieserFrance2026-04-16Morlong Associates NEGOTIATION92Onyama Limba
1047Emily WhobreyBrazil2026-04-21Chanay, Jeffrey A Esq NEGOTIATION51Ioni Bowcher
1048Leja CaldareraBrazil2026-03-31Feltz Printing Service NEGOTIATION94Onyama Limba
1049Ivar PaprockiItaly2026-04-16Dorl, James J Esq NEW65Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Johnson SergiJapanAnna Fali RENEWAL
Clifford RimCanadaAmy Elsner PROPOSAL
Adams MorascaGermanyAsiya Javayant UNQUALIFIED
Tony FollerGermanyIvan Magalhaes NEW
Emily WhobreyCanadaElwin Sharvill UNQUALIFIED
Ricardo GauchoJapanOnyama Limba NEW
Alejandro PerinItalyAmy Elsner QUALIFIED
Ricardo GauchoJapanStephen Shaw UNQUALIFIED
Julie StensethJapanAmy Elsner UNQUALIFIED
Wickens NestleJapanStephen Shaw QUALIFIED
Jeanfrancois VenereUnited KingdomAsiya Javayant NEGOTIATION
Leon OldroydArgentinaIoni Bowcher NEW
Mujtaba NickaFranceAsiya Javayant UNQUALIFIED
Kadeem FlosiCanadaXuxue Feng RENEWAL
Maria MarrierGermanyElwin Sharvill QUALIFIED
Jeanfrancois VenereSpainAnna Fali PROPOSAL
Claire TollnerItalyXuxue Feng RENEWAL
Aditya KuskoFranceIoni Bowcher PROPOSAL
Mayumi KolmetzGermanyAnna Fali UNQUALIFIED
Munro FerenczItalyElwin Sharvill RENEWAL
Izzy GarufiGermanyElwin Sharvill RENEWAL
Alejandro PerinGermanyXuxue Feng NEW
Clifford RimRussiaBernardo Dominic NEW
Adams MorascaItalyAmy Elsner RENEWAL
Costa DilliardArgentinaAmy Elsner NEGOTIATION
Cody SaylorsUnited KingdomIoni Bowcher PROPOSAL
Aruna FigeroaArgentinaAsiya Javayant NEW
James ButtGermanyIvan Magalhaes PROPOSAL
Rodrigues CampainItalyAnna Fali PROPOSAL
Clifford RimIndiaBernardo Dominic UNQUALIFIED
Ivar PaprockiItalyXuxue Feng RENEWAL
Misaki RoysterItalyXuxue Feng RENEWAL
Ashley DoeItalyAsiya Javayant NEW
Morrow RutaSpainBernardo Dominic UNQUALIFIED
Alejandro PerinRussiaAsiya Javayant QUALIFIED
Kadeem FlosiGermanyAmy Elsner UNQUALIFIED
Tony FollerBrazilAnna Fali PROPOSAL
Misaki RoysterAustraliaIvan Magalhaes NEGOTIATION
Smith GlickSpainOnyama Limba NEGOTIATION
Emily WhobreyIndiaBernardo Dominic PROPOSAL
Alejandro PerinAustraliaOnyama Limba RENEWAL
Octavia MaletGermanyAsiya Javayant NEGOTIATION
Stacey MacleadIndiaOnyama Limba QUALIFIED
Greenwood BologniaFranceAnna Fali NEW
Greenwood BologniaCanadaBernardo Dominic PROPOSAL
Smith GlickIndiaXuxue Feng RENEWAL
Ivar PaprockiUnited KingdomXuxue Feng NEGOTIATION
Rodrigues CampainAustraliaOnyama Limba QUALIFIED
Arvin AlbaresRussiaXuxue Feng QUALIFIED
Octavia MaletBrazilAmy Elsner RENEWAL
Frozen Columns
Name
Greenwood Bolognia
Izzy Garufi
Clifford Rim
Greenwood Bolognia
Jennifer Amigon
Costa Dilliard
Isabel Bowley
Aditya Kusko
James Butt
Ivar Paprocki
Morrow Ruta
Aditya Kusko
James Butt
Murillo Malet
Francesco Shinko
Aruna Figeroa
Juan Wieser
Johnson Sergi
Faith Gillian
Antonio Caudy
Deepesh Chui
Emily Whobrey
James Butt
Clifford Rim
James Butt
Darci Poquette
Isabel Bowley
Deepesh Chui
Ricardo Gaucho
Maisha Rulapaugh
Aditya Kusko
Munro Ferencz
Johnson Sergi
Maisha Rulapaugh
Munro Ferencz
Izzy Garufi
Isabel Bowley
Adams Morasca
Johnson Sergi
Murillo Malet
Izzy Garufi
Jefferson Schemmer
Darci Poquette
Kadeem Flosi
Leon Oldroyd
Jefferson Schemmer
James Butt
Ashley Doe
Murillo Malet
Silvio Slusarski
IdCountryDate
1000Brazil2026-04-18
1001Italy2026-04-05
1002Germany2026-03-29
1003Germany2026-04-05
1004Germany2026-04-08
1005United Kingdom2026-04-18
1006India2026-04-12
1007India2026-04-04
1008Italy2026-04-18
1009Canada2026-04-10
1010Russia2026-04-10
1011Australia2026-04-06
1012Germany2026-04-21
1013Australia2026-04-12
1014Canada2026-03-26
1015Canada2026-04-21
1016Japan2026-03-26
1017Canada2026-03-28
1018Brazil2026-04-20
1019Spain2026-04-03
1020France2026-04-19
1021Russia2026-04-06
1022Spain2026-04-05
1023India2026-04-03
1024Canada2026-04-02
1025Argentina2026-03-27
1026Brazil2026-03-29
1027Argentina2026-03-26
1028Italy2026-04-18
1029France2026-04-09
1030Japan2026-04-17
1031Italy2026-04-03
1032India2026-04-21
1033Italy2026-04-05
1034Brazil2026-04-15
1035Brazil2026-04-14
1036Canada2026-03-29
1037Spain2026-04-22
1038Spain2026-03-29
1039Brazil2026-04-16
1040Canada2026-03-30
1041Germany2026-04-08
1042Japan2026-04-12
1043United Kingdom2026-04-08
1044India2026-04-01
1045Germany2026-04-20
1046Italy2026-04-08
1047India2026-04-22
1048Australia2026-03-31
1049France2026-04-12

On-Demand Data

NameIdCountryDate
Salvatore Stockham1000Germany2026-04-16
Stacey Maclead1001India2026-04-21
Arvin Albares1002Brazil2026-04-19
Darci Poquette1003Italy2026-04-21
Wickens Nestle1004Russia2026-03-29
Sinclair Waycott1005Australia2026-04-11
Jones Vocelka1006Brazil2026-04-05
Ricardo Gaucho1007Spain2026-04-03
Tony Foller1008Spain2026-04-08
Darci Poquette1009France2026-04-02
Octavia Malet1010Italy2026-04-21
Nicolas Iturbide1011Argentina2026-03-30
Octavia Malet1012Australia2026-04-03
Aika Inouye1013Italy2026-04-24
Tony Foller1014Argentina2026-04-24
Cody Saylors1015Canada2026-04-09
Chavez Briddick1016Canada2026-04-12
Alejandro Perin1017Italy2026-04-15
Stacey Maclead1018Spain2026-04-15
Juan Wieser1019Japan2026-04-01
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Mayumi KolmetzIndiaIvan Magalhaes QUALIFIED
Ivar PaprockiCanadaStephen Shaw PROPOSAL
Emily WhobreyCanadaElwin Sharvill PROPOSAL
Maisha RulapaughGermanyXuxue Feng UNQUALIFIED
Johnson SergiCanadaIoni Bowcher NEW
Smith GlickAustraliaIvan Magalhaes PROPOSAL
Ivar PaprockiBrazilIoni Bowcher UNQUALIFIED
Greenwood BologniaJapanOnyama Limba PROPOSAL
Darci PoquetteAustraliaXuxue Feng NEW
Ashley DoeSpainAnna Fali PROPOSAL
Maisha RulapaughCanadaIoni Bowcher NEW
Ivar PaprockiRussiaIoni Bowcher QUALIFIED
Alejandro PerinFranceAnna Fali NEW
Tony FollerArgentinaAnna Fali UNQUALIFIED
Francesco ShinkoUnited KingdomAsiya Javayant NEGOTIATION
Jennifer AmigonJapanElwin Sharvill NEW
Tony FollerJapanElwin Sharvill NEGOTIATION
Jennifer AmigonJapanXuxue Feng RENEWAL
Tony FollerRussiaAsiya Javayant RENEWAL
Darci PoquetteAustraliaIoni Bowcher QUALIFIED
Deepesh ChuiUnited KingdomAnna Fali QUALIFIED
Aditya KuskoUnited KingdomXuxue Feng QUALIFIED
Arvin AlbaresSpainBernardo Dominic QUALIFIED
Munro FerenczAustraliaAnna Fali PROPOSAL
Cody SaylorsSpainBernardo Dominic QUALIFIED
Darci PoquetteFranceAmy Elsner PROPOSAL
Murillo MaletRussiaElwin Sharvill PROPOSAL
Jennifer AmigonAustraliaStephen Shaw RENEWAL
Izzy GarufiFranceOnyama Limba PROPOSAL
Murillo MaletRussiaOnyama Limba UNQUALIFIED
Maria MarrierAustraliaXuxue Feng UNQUALIFIED
Julie StensethBrazilIoni Bowcher UNQUALIFIED
Octavia MaletArgentinaIvan Magalhaes NEW
Leja CaldareraAustraliaIvan Magalhaes NEGOTIATION
Clifford RimIndiaAmy Elsner UNQUALIFIED
Sinclair WaycottUnited KingdomAmy Elsner RENEWAL
Izzy GarufiSpainStephen Shaw NEW
Faith GillianGermanyIoni Bowcher QUALIFIED
Octavia MaletGermanyElwin Sharvill PROPOSAL
Chavez BriddickGermanyAmy Elsner UNQUALIFIED

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