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
Adams MorascaSpainXuxue Feng PROPOSAL
Francesco ShinkoJapanBernardo Dominic NEW
Kaitlin OstroskyItalyStephen Shaw RENEWAL
Jennifer AmigonSpainAnna Fali UNQUALIFIED
Ricardo GauchoCanadaIvan Magalhaes QUALIFIED
Maria MarrierSpainXuxue Feng RENEWAL
Leon OldroydIndiaElwin Sharvill NEGOTIATION
Rodrigues CampainCanadaStephen Shaw QUALIFIED
Jones VocelkaIndiaBernardo Dominic UNQUALIFIED
James ButtIndiaStephen Shaw PROPOSAL
Kaitlin OstroskyUnited KingdomAmy Elsner RENEWAL
Morrow RutaFranceElwin Sharvill NEGOTIATION
Deepesh ChuiRussiaIvan Magalhaes RENEWAL
Octavia MaletUnited KingdomOnyama Limba NEW
Octavia MaletItalyAsiya Javayant NEW
Ricardo GauchoRussiaXuxue Feng UNQUALIFIED
Johnson SergiAustraliaStephen Shaw UNQUALIFIED
Aika InouyeSpainAsiya Javayant QUALIFIED
Munro FerenczUnited KingdomElwin Sharvill PROPOSAL
Ivar PaprockiArgentinaAnna Fali RENEWAL
Jennifer AmigonIndiaStephen Shaw UNQUALIFIED
Ricardo GauchoRussiaXuxue Feng RENEWAL
Misaki RoysterBrazilAsiya Javayant NEW
David DarakjyJapanAnna Fali NEGOTIATION
Smith GlickAustraliaAmy Elsner QUALIFIED
Murillo MaletJapanOnyama Limba NEGOTIATION
Johnson SergiCanadaIoni Bowcher NEGOTIATION
Salvatore StockhamSpainBernardo Dominic UNQUALIFIED
Clifford RimJapanIoni Bowcher NEW
Stacey MacleadUnited KingdomAmy Elsner UNQUALIFIED
Wickens NestleItalyIoni Bowcher UNQUALIFIED
David DarakjyBrazilStephen Shaw PROPOSAL
Francesco ShinkoCanadaAsiya Javayant QUALIFIED
Deepesh ChuiJapanOnyama Limba NEW
Emily WhobreySpainAnna Fali NEGOTIATION
Leon OldroydAustraliaAsiya Javayant QUALIFIED
Faith GillianAustraliaAnna Fali RENEWAL
Johnson SergiGermanyOnyama Limba PROPOSAL
Jefferson SchemmerArgentinaAmy Elsner NEGOTIATION
Antonio CaudyRussiaAmy Elsner QUALIFIED
Munro FerenczRussiaStephen Shaw NEW
Cody SaylorsRussiaOnyama Limba PROPOSAL
Costa DilliardAustraliaAnna Fali QUALIFIED
Arvin AlbaresArgentinaElwin Sharvill RENEWAL
Faith GillianGermanyStephen Shaw NEW
Ricardo GauchoJapanAmy Elsner RENEWAL
James ButtCanadaStephen Shaw NEGOTIATION
Rodrigues CampainAustraliaAmy Elsner PROPOSAL
Stacey MacleadUnited KingdomOnyama Limba UNQUALIFIED
Kadeem FlosiGermanyIoni Bowcher QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Clifford RimAustraliaIvan Magalhaes NEGOTIATION
Ashley DoeBrazilStephen Shaw NEW
Arvin AlbaresIndiaAmy Elsner NEGOTIATION
Mayumi KolmetzRussiaOnyama Limba NEGOTIATION
Salvatore StockhamAustraliaAnna Fali UNQUALIFIED
Stacey MacleadGermanyAsiya Javayant UNQUALIFIED
Silvio SlusarskiRussiaAnna Fali QUALIFIED
Stacey MacleadUnited KingdomAnna Fali QUALIFIED
Jeanfrancois VenereAustraliaIoni Bowcher RENEWAL
Mujtaba NickaItalyAnna Fali RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Leja CaldareraJapan2025-08-02Dorl, James J Esq QUALIFIED23Bernardo Dominic
1001Ivar PaprockiBrazil2025-07-23Rangoni Of Florence RENEWAL18Ivan Magalhaes
1002Ivar PaprockiBrazil2025-07-15Buckley Miller Wright NEGOTIATION91Ioni Bowcher
1003David DarakjyAustralia2025-08-10Morlong Associates NEW23Ioni Bowcher
1004Julie StensethRussia2025-08-06King, Christopher A Esq PROPOSAL34Amy Elsner
1005Mayumi KolmetzIndia2025-08-08Chemel, James L Cpa PROPOSAL33Onyama Limba
1006Ivar PaprockiArgentina2025-07-28Benton, John B Jr UNQUALIFIED54Ioni Bowcher
1007Maisha RulapaughCanada2025-07-30Chapman, Ross E Esq NEGOTIATION86Ioni Bowcher
1008Leja CaldareraSpain2025-07-31Commercial Press NEGOTIATION7Amy Elsner
1009Darci PoquetteGermany2025-07-25Chanay, Jeffrey A Esq PROPOSAL78Onyama Limba
1010Francesco ShinkoIndia2025-07-16Feltz Printing Service NEGOTIATION6Onyama Limba
1011Mayumi KolmetzIndia2025-07-24Feltz Printing Service RENEWAL5Ivan Magalhaes
1012Munro FerenczCanada2025-07-17Chapman, Ross E Esq QUALIFIED46Xuxue Feng
1013Clifford RimJapan2025-07-15Feltz Printing Service QUALIFIED69Elwin Sharvill
1014Octavia MaletItaly2025-07-25Benton, John B Jr NEW39Ioni Bowcher
1015Octavia MaletArgentina2025-07-19Rangoni Of Florence UNQUALIFIED64Amy Elsner
1016David DarakjyFrance2025-08-11Benton, John B Jr UNQUALIFIED79Stephen Shaw
1017Johnson SergiUnited Kingdom2025-08-10Chapman, Ross E Esq NEW77Xuxue Feng
1018Wickens NestleAustralia2025-08-01Benton, John B Jr NEGOTIATION55Anna Fali
1019Jones VocelkaAustralia2025-08-08Morlong Associates QUALIFIED8Xuxue Feng
1020Wickens NestleJapan2025-08-01Morlong Associates UNQUALIFIED21Xuxue Feng
1021Julie StensethRussia2025-08-11Buckley Miller Wright QUALIFIED21Xuxue Feng
1022Kaitlin OstroskySpain2025-07-30Rangoni Of Florence NEGOTIATION63Asiya Javayant
1023Alejandro PerinAustralia2025-08-12Printing Dimensions NEGOTIATION80Asiya Javayant
1024Maisha RulapaughCanada2025-07-16Buckley Miller Wright NEGOTIATION52Xuxue Feng
1025Kaitlin OstroskyAustralia2025-08-02Chemel, James L Cpa UNQUALIFIED67Bernardo Dominic
1026Ashley DoeGermany2025-07-25Morlong Associates NEW30Elwin Sharvill
1027Juan WieserItaly2025-07-20Feltz Printing Service NEGOTIATION86Anna Fali
1028Leon OldroydIndia2025-07-17Dorl, James J Esq QUALIFIED55Amy Elsner
1029Faith GillianUnited Kingdom2025-07-22Rousseaux, Michael Esq NEGOTIATION2Ivan Magalhaes
1030Rodrigues CampainAustralia2025-07-24Chemel, James L Cpa PROPOSAL69Bernardo Dominic
1031Juan WieserGermany2025-08-04Morlong Associates NEW87Amy Elsner
1032Aruna FigeroaRussia2025-07-31Chanay, Jeffrey A Esq PROPOSAL18Stephen Shaw
1033Salvatore StockhamBrazil2025-08-02Feiner Bros UNQUALIFIED47Bernardo Dominic
1034Murillo MaletRussia2025-08-09Chapman, Ross E Esq PROPOSAL46Amy Elsner
1035Sinclair WaycottRussia2025-07-22Morlong Associates NEW39Asiya Javayant
1036Jefferson SchemmerBrazil2025-08-09Morlong Associates NEGOTIATION55Stephen Shaw
1037Izzy GarufiRussia2025-07-22Printing Dimensions UNQUALIFIED87Asiya Javayant
1038Alejandro PerinRussia2025-08-05Dorl, James J Esq UNQUALIFIED72Elwin Sharvill
1039Isabel BowleyArgentina2025-08-04Chemel, James L Cpa NEGOTIATION76Amy Elsner
1040Octavia MaletUnited Kingdom2025-08-05Benton, John B Jr NEGOTIATION53Ioni Bowcher
1041Mujtaba NickaGermany2025-07-25Feltz Printing Service NEW11Amy Elsner
1042Tony FollerAustralia2025-07-27Feiner Bros NEW34Stephen Shaw
1043Rodrigues CampainSpain2025-07-16Commercial Press UNQUALIFIED67Onyama Limba
1044Leon OldroydItaly2025-07-22Commercial Press PROPOSAL69Ioni Bowcher
1045Nicolas IturbideRussia2025-07-23Printing Dimensions NEGOTIATION85Asiya Javayant
1046Arvin AlbaresSpain2025-08-09Dorl, James J Esq PROPOSAL67Asiya Javayant
1047Munro FerenczItaly2025-08-10Printing Dimensions NEW89Elwin Sharvill
1048Octavia MaletJapan2025-07-31Dorl, James J Esq NEW66Ioni Bowcher
1049Morrow RutaUnited Kingdom2025-07-16Rousseaux, Michael Esq QUALIFIED45Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Ivar PaprockiArgentinaIvan Magalhaes QUALIFIED
Francesco ShinkoAustraliaElwin Sharvill PROPOSAL
Antonio CaudyCanadaAnna Fali NEW
Ashley DoeGermanyIoni Bowcher RENEWAL
Leon OldroydItalyAnna Fali UNQUALIFIED
Cody SaylorsRussiaIvan Magalhaes UNQUALIFIED
Murillo MaletCanadaBernardo Dominic NEW
Jones VocelkaSpainOnyama Limba NEW
Cody SaylorsBrazilAnna Fali QUALIFIED
Nicolas IturbideUnited KingdomIoni Bowcher NEGOTIATION
Jennifer AmigonBrazilElwin Sharvill NEW
Faith GillianJapanElwin Sharvill RENEWAL
Maisha RulapaughCanadaAnna Fali NEGOTIATION
Stacey MacleadJapanAnna Fali UNQUALIFIED
Izzy GarufiItalyElwin Sharvill UNQUALIFIED
David DarakjyItalyAsiya Javayant UNQUALIFIED
Arvin AlbaresBrazilAsiya Javayant RENEWAL
Chavez BriddickUnited KingdomOnyama Limba PROPOSAL
Aditya KuskoItalyAnna Fali RENEWAL
Misaki RoysterAustraliaBernardo Dominic QUALIFIED
Adams MorascaAustraliaStephen Shaw UNQUALIFIED
Aditya KuskoIndiaXuxue Feng RENEWAL
Johnson SergiItalyStephen Shaw PROPOSAL
Deepesh ChuiBrazilAsiya Javayant NEGOTIATION
Isabel BowleyAustraliaAsiya Javayant QUALIFIED
David DarakjySpainElwin Sharvill QUALIFIED
Leon OldroydCanadaAnna Fali PROPOSAL
Kadeem FlosiRussiaAsiya Javayant NEW
Aditya KuskoCanadaXuxue Feng PROPOSAL
Misaki RoysterArgentinaStephen Shaw QUALIFIED
Emily WhobreyGermanyXuxue Feng RENEWAL
Jeanfrancois VenereCanadaStephen Shaw NEW
Misaki RoysterBrazilBernardo Dominic PROPOSAL
Jefferson SchemmerIndiaIoni Bowcher NEW
Rodrigues CampainIndiaIvan Magalhaes RENEWAL
Aruna FigeroaCanadaIoni Bowcher PROPOSAL
Julie StensethFranceOnyama Limba UNQUALIFIED
Claire TollnerBrazilElwin Sharvill NEW
Adams MorascaJapanAnna Fali RENEWAL
Izzy GarufiAustraliaIoni Bowcher NEW
Juan WieserFranceIvan Magalhaes NEW
Stacey MacleadUnited KingdomAnna Fali RENEWAL
Aditya KuskoRussiaBernardo Dominic PROPOSAL
Morrow RutaJapanIoni Bowcher QUALIFIED
Deepesh ChuiBrazilStephen Shaw UNQUALIFIED
Costa DilliardRussiaOnyama Limba PROPOSAL
Aditya KuskoCanadaAnna Fali RENEWAL
Isabel BowleySpainXuxue Feng QUALIFIED
Murillo MaletGermanyElwin Sharvill UNQUALIFIED
Nicolas IturbideUnited KingdomStephen Shaw RENEWAL
Frozen Columns
Name
Deepesh Chui
Jefferson Schemmer
Emily Whobrey
Aditya Kusko
Nicolas Iturbide
Sinclair Waycott
Octavia Malet
Maisha Rulapaugh
Claire Tollner
Munro Ferencz
Nicolas Iturbide
Jefferson Schemmer
Arvin Albares
Aika Inouye
James Butt
Alejandro Perin
Deepesh Chui
Cody Saylors
Leon Oldroyd
Salvatore Stockham
David Darakjy
Leja Caldarera
Mujtaba Nicka
Leon Oldroyd
Costa Dilliard
Maisha Rulapaugh
Murillo Malet
Salvatore Stockham
Maria Marrier
Munro Ferencz
David Darakjy
Ivar Paprocki
Alejandro Perin
Isabel Bowley
Leja Caldarera
Maisha Rulapaugh
Izzy Garufi
Murillo Malet
Murillo Malet
Munro Ferencz
Claire Tollner
Mujtaba Nicka
Cody Saylors
David Darakjy
Maria Marrier
Aika Inouye
Mujtaba Nicka
Kaitlin Ostrosky
Murillo Malet
Maria Marrier
IdCountryDate
1000France2025-08-02
1001Canada2025-07-26
1002United Kingdom2025-08-01
1003Japan2025-08-04
1004Australia2025-08-12
1005Russia2025-08-05
1006United Kingdom2025-08-04
1007Australia2025-07-20
1008France2025-08-07
1009United Kingdom2025-07-15
1010United Kingdom2025-08-01
1011Spain2025-08-08
1012Argentina2025-07-23
1013Russia2025-07-24
1014Australia2025-07-26
1015France2025-08-12
1016Canada2025-07-16
1017India2025-07-25
1018Canada2025-08-01
1019France2025-07-17
1020Spain2025-07-25
1021Japan2025-08-02
1022India2025-07-24
1023Brazil2025-07-27
1024Spain2025-07-14
1025Russia2025-07-24
1026United Kingdom2025-07-23
1027United Kingdom2025-08-11
1028India2025-07-15
1029Italy2025-07-19
1030Germany2025-07-23
1031Russia2025-07-16
1032Italy2025-08-04
1033Brazil2025-07-28
1034Japan2025-07-19
1035Argentina2025-07-27
1036Russia2025-07-28
1037Argentina2025-07-24
1038United Kingdom2025-08-05
1039Argentina2025-07-29
1040Australia2025-07-22
1041Russia2025-08-10
1042Germany2025-07-14
1043Italy2025-08-11
1044United Kingdom2025-07-20
1045United Kingdom2025-08-09
1046Australia2025-08-04
1047Argentina2025-07-14
1048Spain2025-08-03
1049Spain2025-08-05

On-Demand Data

NameIdCountryDate
Octavia Malet1000Italy2025-07-28
Tony Foller1001Italy2025-07-14
Julie Stenseth1002France2025-07-15
Faith Gillian1003Spain2025-08-07
Aditya Kusko1004Canada2025-07-28
Mujtaba Nicka1005Italy2025-07-18
Francesco Shinko1006United Kingdom2025-07-19
Claire Tollner1007Brazil2025-07-23
Aditya Kusko1008Canada2025-07-24
Chavez Briddick1009Russia2025-08-01
Julie Stenseth1010Spain2025-07-19
Aditya Kusko1011France2025-07-29
Adams Morasca1012Canada2025-07-21
Julie Stenseth1013Germany2025-08-05
Murillo Malet1014Russia2025-08-05
Claire Tollner1015Australia2025-07-31
Clifford Rim1016Germany2025-07-28
Julie Stenseth1017Canada2025-08-07
Jones Vocelka1018Russia2025-07-29
Mayumi Kolmetz1019Russia2025-07-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Sinclair WaycottGermanyAsiya Javayant NEGOTIATION
Julie StensethBrazilAsiya Javayant RENEWAL
Mayumi KolmetzCanadaAmy Elsner NEW
Ashley DoeRussiaBernardo Dominic NEW
Izzy GarufiBrazilStephen Shaw QUALIFIED
Ashley DoeBrazilIvan Magalhaes NEW
Nicolas IturbideJapanOnyama Limba NEGOTIATION
Misaki RoysterSpainOnyama Limba PROPOSAL
Jennifer AmigonIndiaAmy Elsner NEW
Misaki RoysterIndiaBernardo Dominic NEGOTIATION
Stacey MacleadGermanyIoni Bowcher RENEWAL
Aditya KuskoArgentinaIvan Magalhaes QUALIFIED
Aruna FigeroaArgentinaOnyama Limba QUALIFIED
Clifford RimIndiaIoni Bowcher NEW
Adams MorascaItalyIvan Magalhaes NEGOTIATION
Nicolas IturbideCanadaAmy Elsner PROPOSAL
Claire TollnerGermanyIoni Bowcher RENEWAL
Rodrigues CampainRussiaAsiya Javayant UNQUALIFIED
Jeanfrancois VenereGermanyStephen Shaw PROPOSAL
Sinclair WaycottUnited KingdomIoni Bowcher NEGOTIATION
Antonio CaudyItalyIoni Bowcher PROPOSAL
Aditya KuskoItalyIvan Magalhaes PROPOSAL
Maisha RulapaughRussiaAsiya Javayant NEGOTIATION
Darci PoquetteRussiaXuxue Feng NEGOTIATION
Stacey MacleadBrazilOnyama Limba NEW
Kadeem FlosiAustraliaAsiya Javayant NEW
Aruna FigeroaIndiaStephen Shaw NEW
Ivar PaprockiSpainXuxue Feng QUALIFIED
Greenwood BologniaUnited KingdomStephen Shaw PROPOSAL
Emily WhobreyArgentinaBernardo Dominic NEW
Smith GlickGermanyOnyama Limba NEW
Arvin AlbaresArgentinaAsiya Javayant NEGOTIATION
Leon OldroydArgentinaElwin Sharvill UNQUALIFIED
Maisha RulapaughCanadaOnyama Limba PROPOSAL
Cody SaylorsSpainAsiya Javayant NEW
Julie StensethIndiaOnyama Limba UNQUALIFIED
Arvin AlbaresRussiaXuxue Feng NEW
Jeanfrancois VenereSpainOnyama Limba RENEWAL
Aruna FigeroaRussiaAnna Fali RENEWAL
Antonio CaudyGermanyAnna Fali RENEWAL

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