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
Emily WhobreySpainStephen Shaw RENEWAL
Clifford RimIndiaStephen Shaw QUALIFIED
Jones VocelkaArgentinaAsiya Javayant PROPOSAL
Deepesh ChuiFranceStephen Shaw PROPOSAL
Jefferson SchemmerAustraliaBernardo Dominic NEGOTIATION
Adams MorascaJapanXuxue Feng QUALIFIED
Leja CaldareraCanadaIoni Bowcher PROPOSAL
Emily WhobreyAustraliaIvan Magalhaes NEW
Mayumi KolmetzUnited KingdomStephen Shaw UNQUALIFIED
Jones VocelkaCanadaXuxue Feng UNQUALIFIED
Rodrigues CampainRussiaOnyama Limba UNQUALIFIED
Jones VocelkaFranceIvan Magalhaes RENEWAL
Leja CaldareraFranceElwin Sharvill PROPOSAL
Mujtaba NickaRussiaAsiya Javayant UNQUALIFIED
Maria MarrierGermanyAnna Fali NEW
Faith GillianGermanyAnna Fali PROPOSAL
Clifford RimFranceOnyama Limba NEGOTIATION
Alejandro PerinArgentinaIoni Bowcher PROPOSAL
Leja CaldareraRussiaOnyama Limba NEGOTIATION
Murillo MaletItalyAsiya Javayant QUALIFIED
Adams MorascaIndiaIoni Bowcher NEGOTIATION
Arvin AlbaresArgentinaStephen Shaw NEW
Juan WieserAustraliaStephen Shaw RENEWAL
Aruna FigeroaIndiaStephen Shaw QUALIFIED
Johnson SergiRussiaIoni Bowcher UNQUALIFIED
Maria MarrierSpainXuxue Feng QUALIFIED
Munro FerenczJapanBernardo Dominic QUALIFIED
Aika InouyeSpainIvan Magalhaes QUALIFIED
Aika InouyeBrazilOnyama Limba QUALIFIED
Deepesh ChuiJapanAmy Elsner NEGOTIATION
Octavia MaletRussiaBernardo Dominic NEW
Faith GillianJapanXuxue Feng PROPOSAL
Juan WieserFranceIoni Bowcher RENEWAL
Faith GillianIndiaXuxue Feng UNQUALIFIED
Tony FollerFranceElwin Sharvill RENEWAL
Francesco ShinkoAustraliaOnyama Limba NEW
Kadeem FlosiCanadaBernardo Dominic RENEWAL
Johnson SergiCanadaOnyama Limba NEW
Leon OldroydRussiaAmy Elsner NEGOTIATION
Rodrigues CampainFranceAnna Fali NEW
Antonio CaudyUnited KingdomXuxue Feng UNQUALIFIED
Antonio CaudyRussiaAnna Fali NEW
Silvio SlusarskiArgentinaElwin Sharvill PROPOSAL
Aika InouyeRussiaIoni Bowcher PROPOSAL
Jefferson SchemmerGermanyXuxue Feng QUALIFIED
Murillo MaletCanadaIoni Bowcher NEGOTIATION
Costa DilliardFranceAnna Fali PROPOSAL
Silvio SlusarskiSpainAmy Elsner NEW
Maisha RulapaughAustraliaAsiya Javayant PROPOSAL
Leja CaldareraBrazilElwin Sharvill UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Ashley DoeAustraliaAnna Fali RENEWAL
Jones VocelkaFranceXuxue Feng NEW
Greenwood BologniaRussiaBernardo Dominic NEW
Murillo MaletSpainAmy Elsner NEGOTIATION
Smith GlickRussiaOnyama Limba QUALIFIED
Isabel BowleyJapanOnyama Limba RENEWAL
Clifford RimCanadaXuxue Feng PROPOSAL
Darci PoquetteItalyOnyama Limba PROPOSAL
Mayumi KolmetzAustraliaAsiya Javayant QUALIFIED
Mayumi KolmetzItalyIoni Bowcher NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Johnson SergiFrance2025-08-11Benton, John B Jr QUALIFIED37Ioni Bowcher
1001Maisha RulapaughSpain2025-07-29Feiner Bros UNQUALIFIED31Elwin Sharvill
1002Salvatore StockhamIndia2025-08-05Feltz Printing Service QUALIFIED87Asiya Javayant
1003Jennifer AmigonIndia2025-08-09Commercial Press NEW51Onyama Limba
1004Octavia MaletGermany2025-07-28Commercial Press QUALIFIED7Ioni Bowcher
1005Greenwood BologniaCanada2025-08-01Feiner Bros PROPOSAL78Anna Fali
1006Silvio SlusarskiIndia2025-07-28Morlong Associates PROPOSAL29Ioni Bowcher
1007Antonio CaudyBrazil2025-07-25King, Christopher A Esq NEGOTIATION59Onyama Limba
1008Chavez BriddickIndia2025-08-03Rangoni Of Florence RENEWAL47Amy Elsner
1009Francesco ShinkoArgentina2025-08-07Printing Dimensions NEGOTIATION24Ivan Magalhaes
1010Deepesh ChuiCanada2025-08-04Rousseaux, Michael Esq NEGOTIATION64Bernardo Dominic
1011Izzy GarufiCanada2025-08-01Feiner Bros QUALIFIED69Onyama Limba
1012Arvin AlbaresGermany2025-08-04Printing Dimensions QUALIFIED1Onyama Limba
1013Aruna FigeroaUnited Kingdom2025-08-11Rousseaux, Michael Esq UNQUALIFIED95Anna Fali
1014Clifford RimItaly2025-08-02Commercial Press NEGOTIATION14Ioni Bowcher
1015Jeanfrancois VenereJapan2025-07-29Morlong Associates QUALIFIED8Onyama Limba
1016Salvatore StockhamIndia2025-07-14Rangoni Of Florence NEW2Asiya Javayant
1017Ricardo GauchoItaly2025-07-20Chanay, Jeffrey A Esq NEGOTIATION67Onyama Limba
1018Claire TollnerCanada2025-08-01Benton, John B Jr NEGOTIATION55Asiya Javayant
1019Francesco ShinkoAustralia2025-08-04Chemel, James L Cpa RENEWAL53Elwin Sharvill
1020Morrow RutaBrazil2025-08-11Chanay, Jeffrey A Esq NEGOTIATION77Bernardo Dominic
1021Leja CaldareraCanada2025-07-23Truhlar And Truhlar Attys UNQUALIFIED55Elwin Sharvill
1022Ashley DoeFrance2025-08-11Feiner Bros NEW54Bernardo Dominic
1023Munro FerenczUnited Kingdom2025-07-15Morlong Associates NEW33Xuxue Feng
1024Murillo MaletGermany2025-07-30Chapman, Ross E Esq UNQUALIFIED79Onyama Limba
1025Greenwood BologniaUnited Kingdom2025-08-04Chemel, James L Cpa NEGOTIATION31Ioni Bowcher
1026Greenwood BologniaFrance2025-07-18Benton, John B Jr QUALIFIED1Stephen Shaw
1027Ashley DoeItaly2025-07-26Rousseaux, Michael Esq NEW61Onyama Limba
1028Costa DilliardItaly2025-08-12Chanay, Jeffrey A Esq UNQUALIFIED74Xuxue Feng
1029Sinclair WaycottIndia2025-07-14Chapman, Ross E Esq QUALIFIED67Stephen Shaw
1030Maisha RulapaughAustralia2025-07-19Chanay, Jeffrey A Esq NEGOTIATION85Xuxue Feng
1031Tony FollerUnited Kingdom2025-07-24Printing Dimensions RENEWAL20Onyama Limba
1032Sinclair WaycottJapan2025-08-04Benton, John B Jr NEGOTIATION59Bernardo Dominic
1033Francesco ShinkoFrance2025-08-04Dorl, James J Esq QUALIFIED99Ioni Bowcher
1034Izzy GarufiGermany2025-08-11Truhlar And Truhlar Attys NEW86Bernardo Dominic
1035Munro FerenczSpain2025-07-23Truhlar And Truhlar Attys UNQUALIFIED72Onyama Limba
1036Jennifer AmigonArgentina2025-07-24Rangoni Of Florence QUALIFIED65Xuxue Feng
1037Francesco ShinkoIndia2025-08-01Rangoni Of Florence QUALIFIED80Stephen Shaw
1038Adams MorascaBrazil2025-08-11Rousseaux, Michael Esq RENEWAL89Stephen Shaw
1039Aditya KuskoFrance2025-08-03Benton, John B Jr RENEWAL57Asiya Javayant
1040Nicolas IturbideAustralia2025-07-29Benton, John B Jr UNQUALIFIED77Ivan Magalhaes
1041Greenwood BologniaGermany2025-08-06Rangoni Of Florence NEGOTIATION98Onyama Limba
1042Stacey MacleadAustralia2025-08-02Rangoni Of Florence NEW74Amy Elsner
1043Arvin AlbaresArgentina2025-07-21Chapman, Ross E Esq NEGOTIATION86Amy Elsner
1044Johnson SergiUnited Kingdom2025-07-25Benton, John B Jr RENEWAL89Onyama Limba
1045Kaitlin OstroskyRussia2025-08-04Benton, John B Jr PROPOSAL45Ioni Bowcher
1046Juan WieserSpain2025-07-18Dorl, James J Esq UNQUALIFIED19Bernardo Dominic
1047Octavia MaletIndia2025-07-26Rangoni Of Florence PROPOSAL6Anna Fali
1048Chavez BriddickFrance2025-08-03Dorl, James J Esq RENEWAL54Ivan Magalhaes
1049Jones VocelkaSpain2025-08-07Buckley Miller Wright QUALIFIED57Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Isabel BowleyBrazilIvan Magalhaes NEW
Faith GillianJapanElwin Sharvill UNQUALIFIED
Costa DilliardRussiaIvan Magalhaes NEW
Claire TollnerJapanElwin Sharvill PROPOSAL
Mujtaba NickaItalyBernardo Dominic PROPOSAL
Izzy GarufiArgentinaOnyama Limba NEGOTIATION
Alejandro PerinJapanElwin Sharvill PROPOSAL
Smith GlickCanadaIvan Magalhaes RENEWAL
Greenwood BologniaArgentinaXuxue Feng UNQUALIFIED
Ricardo GauchoAustraliaIoni Bowcher RENEWAL
Faith GillianAustraliaIvan Magalhaes UNQUALIFIED
Smith GlickSpainIvan Magalhaes RENEWAL
Aika InouyeIndiaAnna Fali QUALIFIED
Julie StensethBrazilBernardo Dominic NEGOTIATION
Sinclair WaycottGermanyBernardo Dominic RENEWAL
Nicolas IturbideIndiaIvan Magalhaes QUALIFIED
Leja CaldareraArgentinaOnyama Limba NEW
Octavia MaletGermanyAnna Fali UNQUALIFIED
Aruna FigeroaArgentinaXuxue Feng PROPOSAL
Sinclair WaycottItalyElwin Sharvill PROPOSAL
Nicolas IturbideSpainAsiya Javayant QUALIFIED
Aditya KuskoAustraliaStephen Shaw PROPOSAL
Leja CaldareraAustraliaAsiya Javayant RENEWAL
James ButtCanadaBernardo Dominic PROPOSAL
Maria MarrierSpainOnyama Limba NEGOTIATION
Julie StensethUnited KingdomIvan Magalhaes UNQUALIFIED
Arvin AlbaresBrazilIoni Bowcher NEGOTIATION
Wickens NestleIndiaElwin Sharvill QUALIFIED
Ashley DoeCanadaXuxue Feng NEGOTIATION
Wickens NestleUnited KingdomAmy Elsner UNQUALIFIED
Isabel BowleySpainBernardo Dominic UNQUALIFIED
David DarakjyUnited KingdomBernardo Dominic PROPOSAL
Morrow RutaUnited KingdomBernardo Dominic UNQUALIFIED
Aruna FigeroaArgentinaAnna Fali NEW
Juan WieserSpainIvan Magalhaes PROPOSAL
Stacey MacleadItalyIoni Bowcher NEW
Misaki RoysterUnited KingdomAmy Elsner NEGOTIATION
Munro FerenczAustraliaStephen Shaw UNQUALIFIED
Munro FerenczRussiaXuxue Feng UNQUALIFIED
Isabel BowleyItalyXuxue Feng NEW
Smith GlickBrazilAsiya Javayant NEGOTIATION
Kaitlin OstroskyUnited KingdomStephen Shaw NEW
Costa DilliardArgentinaIoni Bowcher PROPOSAL
Stacey MacleadGermanyElwin Sharvill PROPOSAL
Morrow RutaSpainAmy Elsner NEW
Julie StensethFranceIoni Bowcher RENEWAL
Izzy GarufiFranceIoni Bowcher NEW
Juan WieserFranceStephen Shaw QUALIFIED
James ButtArgentinaIvan Magalhaes NEGOTIATION
Chavez BriddickIndiaBernardo Dominic NEW
Frozen Columns
Name
Tony Foller
Juan Wieser
Jones Vocelka
Ricardo Gaucho
Octavia Malet
James Butt
Sinclair Waycott
Arvin Albares
Misaki Royster
Aditya Kusko
Juan Wieser
Antonio Caudy
Murillo Malet
Arvin Albares
Octavia Malet
Ashley Doe
Adams Morasca
Leon Oldroyd
Julie Stenseth
Izzy Garufi
James Butt
Misaki Royster
Johnson Sergi
Aruna Figeroa
David Darakjy
Antonio Caudy
Leon Oldroyd
David Darakjy
Deepesh Chui
Aditya Kusko
Johnson Sergi
Salvatore Stockham
Murillo Malet
Aditya Kusko
Tony Foller
Isabel Bowley
Salvatore Stockham
Octavia Malet
Kaitlin Ostrosky
Faith Gillian
Aika Inouye
Rodrigues Campain
Jeanfrancois Venere
Stacey Maclead
Julie Stenseth
Silvio Slusarski
Octavia Malet
Costa Dilliard
Antonio Caudy
Izzy Garufi
IdCountryDate
1000India2025-08-02
1001India2025-07-17
1002France2025-08-01
1003Australia2025-07-27
1004United Kingdom2025-07-19
1005Spain2025-07-28
1006India2025-07-15
1007Russia2025-08-01
1008Japan2025-07-19
1009Canada2025-07-26
1010Argentina2025-07-28
1011Argentina2025-07-18
1012Canada2025-07-28
1013United Kingdom2025-08-01
1014Japan2025-08-02
1015Spain2025-08-03
1016Italy2025-08-05
1017Germany2025-07-20
1018India2025-08-11
1019France2025-08-03
1020Spain2025-07-29
1021Argentina2025-08-12
1022Japan2025-07-16
1023France2025-08-06
1024Brazil2025-07-22
1025Germany2025-08-02
1026United Kingdom2025-08-10
1027Japan2025-07-22
1028Italy2025-08-04
1029Spain2025-07-20
1030Spain2025-07-20
1031France2025-07-16
1032Italy2025-07-30
1033Russia2025-07-19
1034Australia2025-07-15
1035India2025-07-24
1036France2025-08-03
1037Australia2025-08-08
1038Spain2025-07-17
1039Russia2025-08-09
1040France2025-07-29
1041Canada2025-07-20
1042Japan2025-08-01
1043Italy2025-07-29
1044Germany2025-08-05
1045Canada2025-08-02
1046Spain2025-08-01
1047Italy2025-08-12
1048India2025-08-12
1049India2025-08-05

On-Demand Data

NameIdCountryDate
Arvin Albares1000Brazil2025-07-26
Cody Saylors1001Spain2025-07-26
Alejandro Perin1002India2025-07-15
Murillo Malet1003Brazil2025-07-25
Arvin Albares1004Russia2025-08-01
Alejandro Perin1005Japan2025-08-07
Munro Ferencz1006Italy2025-08-04
Munro Ferencz1007Brazil2025-07-18
Aditya Kusko1008France2025-08-07
Aika Inouye1009Russia2025-08-05
Rodrigues Campain1010Canada2025-07-15
Faith Gillian1011Germany2025-07-18
Alejandro Perin1012Japan2025-08-01
Salvatore Stockham1013United Kingdom2025-07-22
Clifford Rim1014Japan2025-07-20
Costa Dilliard1015United Kingdom2025-07-29
Stacey Maclead1016United Kingdom2025-07-17
Julie Stenseth1017Australia2025-07-15
Faith Gillian1018India2025-07-17
Wickens Nestle1019Spain2025-08-05
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Johnson SergiUnited KingdomXuxue Feng UNQUALIFIED
Alejandro PerinItalyElwin Sharvill QUALIFIED
Deepesh ChuiArgentinaStephen Shaw QUALIFIED
Nicolas IturbideAustraliaIoni Bowcher RENEWAL
Faith GillianGermanyElwin Sharvill PROPOSAL
Maria MarrierFranceIvan Magalhaes NEGOTIATION
Misaki RoysterSpainIvan Magalhaes NEW
Wickens NestleArgentinaElwin Sharvill NEW
Aruna FigeroaIndiaElwin Sharvill NEW
Aika InouyeIndiaBernardo Dominic RENEWAL
Jones VocelkaGermanyXuxue Feng NEGOTIATION
Nicolas IturbideGermanyBernardo Dominic QUALIFIED
Darci PoquetteSpainIvan Magalhaes NEGOTIATION
Tony FollerAustraliaAmy Elsner PROPOSAL
Sinclair WaycottUnited KingdomBernardo Dominic RENEWAL
Jones VocelkaFranceBernardo Dominic NEGOTIATION
Maria MarrierFranceElwin Sharvill QUALIFIED
Murillo MaletSpainAmy Elsner RENEWAL
Faith GillianGermanyAmy Elsner UNQUALIFIED
Misaki RoysterBrazilElwin Sharvill QUALIFIED
Clifford RimIndiaAsiya Javayant NEW
Munro FerenczItalyAmy Elsner NEW
Murillo MaletCanadaXuxue Feng NEGOTIATION
Claire TollnerSpainBernardo Dominic PROPOSAL
Aruna FigeroaItalyAnna Fali PROPOSAL
Faith GillianIndiaAnna Fali RENEWAL
Sinclair WaycottRussiaIvan Magalhaes UNQUALIFIED
Smith GlickSpainIvan Magalhaes NEW
Antonio CaudyCanadaAnna Fali QUALIFIED
Clifford RimAustraliaIvan Magalhaes QUALIFIED
Deepesh ChuiBrazilBernardo Dominic NEGOTIATION
Izzy GarufiRussiaXuxue Feng QUALIFIED
Octavia MaletIndiaBernardo Dominic UNQUALIFIED
Morrow RutaItalyAnna Fali NEW
Aditya KuskoJapanBernardo Dominic QUALIFIED
Cody SaylorsJapanXuxue Feng RENEWAL
Sinclair WaycottCanadaBernardo Dominic PROPOSAL
Sinclair WaycottBrazilXuxue Feng QUALIFIED
Rodrigues CampainSpainOnyama Limba NEW
Mujtaba NickaItalyAmy Elsner 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>