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
Morrow RutaJapanXuxue Feng RENEWAL
Jennifer AmigonFranceOnyama Limba QUALIFIED
Leja CaldareraArgentinaIoni Bowcher NEGOTIATION
Munro FerenczJapanXuxue Feng NEW
Emily WhobreyIndiaBernardo Dominic NEGOTIATION
Julie StensethCanadaAsiya Javayant NEW
Adams MorascaGermanyXuxue Feng NEGOTIATION
Ricardo GauchoCanadaAmy Elsner NEW
Murillo MaletArgentinaBernardo Dominic UNQUALIFIED
Maria MarrierAustraliaOnyama Limba RENEWAL
David DarakjyItalyAmy Elsner RENEWAL
Leon OldroydItalyOnyama Limba UNQUALIFIED
Ivar PaprockiSpainAsiya Javayant QUALIFIED
Aika InouyeArgentinaAsiya Javayant UNQUALIFIED
Morrow RutaCanadaXuxue Feng RENEWAL
Sinclair WaycottArgentinaAnna Fali RENEWAL
Juan WieserGermanyOnyama Limba QUALIFIED
Chavez BriddickGermanyIvan Magalhaes NEGOTIATION
Kadeem FlosiRussiaXuxue Feng NEGOTIATION
Sinclair WaycottFranceAmy Elsner QUALIFIED
Jennifer AmigonItalyStephen Shaw UNQUALIFIED
Julie StensethCanadaOnyama Limba NEGOTIATION
Greenwood BologniaArgentinaElwin Sharvill UNQUALIFIED
Cody SaylorsJapanStephen Shaw UNQUALIFIED
Ashley DoeRussiaAsiya Javayant UNQUALIFIED
Ricardo GauchoRussiaStephen Shaw NEGOTIATION
Johnson SergiJapanAnna Fali NEW
Cody SaylorsFranceIvan Magalhaes UNQUALIFIED
Morrow RutaAustraliaElwin Sharvill RENEWAL
Morrow RutaIndiaAsiya Javayant UNQUALIFIED
Antonio CaudyItalyAnna Fali QUALIFIED
Maria MarrierIndiaStephen Shaw RENEWAL
Misaki RoysterGermanyElwin Sharvill QUALIFIED
Kadeem FlosiArgentinaBernardo Dominic RENEWAL
Jeanfrancois VenereIndiaBernardo Dominic UNQUALIFIED
Kaitlin OstroskyAustraliaAmy Elsner NEGOTIATION
Smith GlickArgentinaOnyama Limba NEW
Clifford RimUnited KingdomIoni Bowcher RENEWAL
Mujtaba NickaJapanAmy Elsner RENEWAL
Leja CaldareraGermanyXuxue Feng NEW
Aika InouyeFranceElwin Sharvill RENEWAL
Leon OldroydArgentinaAsiya Javayant QUALIFIED
Kadeem FlosiUnited KingdomAmy Elsner NEW
Arvin AlbaresIndiaXuxue Feng PROPOSAL
Mujtaba NickaArgentinaIvan Magalhaes NEGOTIATION
Nicolas IturbideUnited KingdomElwin Sharvill NEW
Aditya KuskoIndiaAsiya Javayant PROPOSAL
Munro FerenczGermanyBernardo Dominic QUALIFIED
Smith GlickBrazilIvan Magalhaes PROPOSAL
David DarakjyGermanyAnna Fali NEW
Horizontal
NameCountryRepresentativeStatus
Isabel BowleyRussiaElwin Sharvill NEW
Sinclair WaycottItalyAsiya Javayant PROPOSAL
Francesco ShinkoGermanyBernardo Dominic UNQUALIFIED
Jennifer AmigonAustraliaAnna Fali UNQUALIFIED
David DarakjyBrazilOnyama Limba RENEWAL
Misaki RoysterGermanyAmy Elsner NEW
Nicolas IturbideFranceAnna Fali UNQUALIFIED
Clifford RimItalyAnna Fali NEGOTIATION
Antonio CaudyUnited KingdomIoni Bowcher NEW
Ivar PaprockiCanadaStephen Shaw NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Claire TollnerRussia2026-04-22Rangoni Of Florence PROPOSAL30Stephen Shaw
1001James ButtArgentina2026-05-12Morlong Associates NEGOTIATION56Anna Fali
1002Deepesh ChuiAustralia2026-05-08Feltz Printing Service PROPOSAL47Anna Fali
1003James ButtCanada2026-04-29Rangoni Of Florence RENEWAL8Anna Fali
1004Greenwood BologniaItaly2026-04-28Chanay, Jeffrey A Esq NEGOTIATION68Amy Elsner
1005Tony FollerJapan2026-05-05Commercial Press PROPOSAL47Ivan Magalhaes
1006Morrow RutaUnited Kingdom2026-04-30Rousseaux, Michael Esq PROPOSAL23Elwin Sharvill
1007Jennifer AmigonBrazil2026-04-23Chanay, Jeffrey A Esq QUALIFIED65Ioni Bowcher
1008Octavia MaletArgentina2026-04-30Rangoni Of Florence UNQUALIFIED44Anna Fali
1009Jones VocelkaBrazil2026-04-25Buckley Miller Wright RENEWAL99Onyama Limba
1010Leja CaldareraIndia2026-04-28Buckley Miller Wright PROPOSAL26Stephen Shaw
1011Isabel BowleyJapan2026-05-04Chapman, Ross E Esq QUALIFIED73Ivan Magalhaes
1012Salvatore StockhamSpain2026-05-05Rousseaux, Michael Esq QUALIFIED95Stephen Shaw
1013Arvin AlbaresSpain2026-04-30King, Christopher A Esq NEGOTIATION81Asiya Javayant
1014Tony FollerSpain2026-04-22Rousseaux, Michael Esq PROPOSAL36Onyama Limba
1015Antonio CaudyArgentina2026-05-04Feiner Bros NEW32Xuxue Feng
1016Silvio SlusarskiRussia2026-05-20Feiner Bros NEW50Asiya Javayant
1017Francesco ShinkoFrance2026-05-10Rousseaux, Michael Esq RENEWAL71Ivan Magalhaes
1018Jeanfrancois VenereIndia2026-04-28Chanay, Jeffrey A Esq UNQUALIFIED25Ioni Bowcher
1019Juan WieserRussia2026-05-04Buckley Miller Wright NEW97Anna Fali
1020Julie StensethItaly2026-05-20Buckley Miller Wright RENEWAL37Anna Fali
1021Munro FerenczAustralia2026-05-02Morlong Associates UNQUALIFIED9Elwin Sharvill
1022Leon OldroydArgentina2026-05-03Feiner Bros RENEWAL24Anna Fali
1023Sinclair WaycottAustralia2026-04-23King, Christopher A Esq NEGOTIATION26Stephen Shaw
1024Cody SaylorsSpain2026-05-15Feiner Bros RENEWAL48Anna Fali
1025Izzy GarufiArgentina2026-05-18Dorl, James J Esq RENEWAL26Onyama Limba
1026Morrow RutaCanada2026-05-09Morlong Associates NEW94Asiya Javayant
1027David DarakjyJapan2026-04-25Buckley Miller Wright RENEWAL15Amy Elsner
1028Silvio SlusarskiFrance2026-04-29Dorl, James J Esq QUALIFIED5Anna Fali
1029Emily WhobreyJapan2026-04-30Printing Dimensions NEW48Stephen Shaw
1030Mayumi KolmetzJapan2026-05-04King, Christopher A Esq QUALIFIED48Ivan Magalhaes
1031Emily WhobreyArgentina2026-05-08Chapman, Ross E Esq RENEWAL85Elwin Sharvill
1032Leja CaldareraIndia2026-05-11Benton, John B Jr UNQUALIFIED32Xuxue Feng
1033Claire TollnerAustralia2026-04-21Morlong Associates NEW15Ioni Bowcher
1034Ashley DoeJapan2026-04-21Chemel, James L Cpa PROPOSAL31Elwin Sharvill
1035Stacey MacleadArgentina2026-05-03King, Christopher A Esq UNQUALIFIED79Amy Elsner
1036Salvatore StockhamFrance2026-05-11Rousseaux, Michael Esq NEW37Anna Fali
1037Jeanfrancois VenereArgentina2026-05-10King, Christopher A Esq QUALIFIED55Ivan Magalhaes
1038Chavez BriddickGermany2026-04-30Chemel, James L Cpa NEGOTIATION71Anna Fali
1039Maria MarrierItaly2026-05-10Rousseaux, Michael Esq RENEWAL28Ivan Magalhaes
1040Juan WieserUnited Kingdom2026-05-15Dorl, James J Esq RENEWAL33Onyama Limba
1041Costa DilliardRussia2026-05-16Rangoni Of Florence NEGOTIATION39Ioni Bowcher
1042Claire TollnerJapan2026-04-21Feiner Bros UNQUALIFIED91Elwin Sharvill
1043Antonio CaudyCanada2026-05-04Chanay, Jeffrey A Esq PROPOSAL80Amy Elsner
1044Chavez BriddickBrazil2026-05-02Chemel, James L Cpa QUALIFIED82Xuxue Feng
1045Salvatore StockhamArgentina2026-05-12Rousseaux, Michael Esq NEGOTIATION76Stephen Shaw
1046Faith GillianItaly2026-05-10King, Christopher A Esq QUALIFIED79Anna Fali
1047Octavia MaletGermany2026-05-06Benton, John B Jr UNQUALIFIED31Anna Fali
1048Maisha RulapaughRussia2026-05-07Dorl, James J Esq QUALIFIED49Onyama Limba
1049Misaki RoysterRussia2026-05-04Commercial Press UNQUALIFIED6Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Aditya KuskoBrazilXuxue Feng NEGOTIATION
Rodrigues CampainCanadaAmy Elsner UNQUALIFIED
Wickens NestleAustraliaAsiya Javayant QUALIFIED
Ivar PaprockiSpainXuxue Feng NEGOTIATION
Darci PoquetteIndiaElwin Sharvill NEGOTIATION
Cody SaylorsCanadaIoni Bowcher RENEWAL
James ButtIndiaAsiya Javayant UNQUALIFIED
Izzy GarufiIndiaIoni Bowcher QUALIFIED
Alejandro PerinJapanOnyama Limba QUALIFIED
Izzy GarufiIndiaXuxue Feng QUALIFIED
Nicolas IturbideFranceXuxue Feng PROPOSAL
Leja CaldareraSpainAmy Elsner NEGOTIATION
Aditya KuskoSpainAsiya Javayant QUALIFIED
Octavia MaletAustraliaElwin Sharvill NEGOTIATION
Aika InouyeCanadaIoni Bowcher QUALIFIED
Smith GlickArgentinaStephen Shaw NEGOTIATION
Kaitlin OstroskyArgentinaElwin Sharvill RENEWAL
Jennifer AmigonBrazilIoni Bowcher NEW
Francesco ShinkoItalyAnna Fali UNQUALIFIED
Juan WieserJapanStephen Shaw RENEWAL
Arvin AlbaresSpainAnna Fali PROPOSAL
Kaitlin OstroskyJapanAmy Elsner RENEWAL
Mujtaba NickaItalyBernardo Dominic PROPOSAL
Aika InouyeCanadaXuxue Feng UNQUALIFIED
Costa DilliardItalyAsiya Javayant RENEWAL
Ivar PaprockiGermanyAmy Elsner QUALIFIED
Tony FollerArgentinaAnna Fali NEW
Tony FollerAustraliaStephen Shaw QUALIFIED
Munro FerenczAustraliaAmy Elsner PROPOSAL
Claire TollnerGermanyOnyama Limba UNQUALIFIED
Maria MarrierCanadaAsiya Javayant NEW
Munro FerenczFranceOnyama Limba RENEWAL
Francesco ShinkoRussiaAsiya Javayant PROPOSAL
Misaki RoysterRussiaStephen Shaw PROPOSAL
Faith GillianJapanAsiya Javayant PROPOSAL
Deepesh ChuiSpainAsiya Javayant QUALIFIED
Isabel BowleyFranceOnyama Limba NEGOTIATION
Leja CaldareraCanadaBernardo Dominic PROPOSAL
Maria MarrierFranceIoni Bowcher NEGOTIATION
Juan WieserArgentinaIoni Bowcher RENEWAL
David DarakjyRussiaAsiya Javayant RENEWAL
Jones VocelkaGermanyIoni Bowcher NEGOTIATION
Cody SaylorsArgentinaIoni Bowcher PROPOSAL
Deepesh ChuiRussiaAmy Elsner PROPOSAL
Cody SaylorsItalyIvan Magalhaes NEW
Isabel BowleyIndiaAnna Fali NEGOTIATION
Ricardo GauchoAustraliaAsiya Javayant UNQUALIFIED
Rodrigues CampainJapanIoni Bowcher RENEWAL
James ButtSpainBernardo Dominic QUALIFIED
Darci PoquetteAustraliaOnyama Limba PROPOSAL
Frozen Columns
Name
Kadeem Flosi
Rodrigues Campain
Ivar Paprocki
Kadeem Flosi
Mayumi Kolmetz
Clifford Rim
Aika Inouye
Julie Stenseth
Tony Foller
Jefferson Schemmer
Maria Marrier
Izzy Garufi
Darci Poquette
Faith Gillian
Johnson Sergi
Chavez Briddick
Jeanfrancois Venere
Chavez Briddick
Salvatore Stockham
Adams Morasca
Emily Whobrey
Isabel Bowley
Deepesh Chui
Jones Vocelka
Jefferson Schemmer
Clifford Rim
Claire Tollner
Ricardo Gaucho
Ashley Doe
Aika Inouye
Clifford Rim
Johnson Sergi
Antonio Caudy
Mujtaba Nicka
Darci Poquette
Morrow Ruta
Aruna Figeroa
Jennifer Amigon
Octavia Malet
Isabel Bowley
Morrow Ruta
Jones Vocelka
David Darakjy
Julie Stenseth
Jeanfrancois Venere
Octavia Malet
Misaki Royster
David Darakjy
Jones Vocelka
Alejandro Perin
IdCountryDate
1000Germany2026-05-17
1001Germany2026-05-02
1002Canada2026-05-15
1003Brazil2026-05-13
1004France2026-05-03
1005France2026-05-03
1006Australia2026-05-15
1007Japan2026-05-18
1008United Kingdom2026-04-25
1009Germany2026-04-24
1010United Kingdom2026-05-01
1011United Kingdom2026-05-13
1012Spain2026-04-30
1013Australia2026-04-28
1014Germany2026-04-23
1015Italy2026-04-25
1016Canada2026-04-21
1017Germany2026-05-08
1018India2026-05-11
1019Italy2026-05-07
1020India2026-04-28
1021India2026-05-07
1022Australia2026-05-13
1023Australia2026-05-07
1024Brazil2026-05-19
1025Italy2026-05-16
1026Canada2026-05-03
1027Brazil2026-05-01
1028Spain2026-05-02
1029France2026-05-02
1030Germany2026-05-12
1031Japan2026-05-03
1032Russia2026-04-23
1033Spain2026-05-07
1034United Kingdom2026-04-30
1035Australia2026-05-09
1036France2026-05-10
1037Japan2026-04-30
1038Canada2026-05-03
1039Japan2026-05-01
1040United Kingdom2026-05-08
1041Argentina2026-04-23
1042Canada2026-04-23
1043Russia2026-05-02
1044India2026-05-03
1045Australia2026-05-12
1046India2026-05-03
1047Brazil2026-05-15
1048Germany2026-05-09
1049Russia2026-04-30

On-Demand Data

NameIdCountryDate
Claire Tollner1000United Kingdom2026-05-11
Kadeem Flosi1001Canada2026-04-26
Greenwood Bolognia1002Germany2026-05-18
Jennifer Amigon1003United Kingdom2026-04-21
Francesco Shinko1004Russia2026-05-02
Munro Ferencz1005Spain2026-04-23
Ivar Paprocki1006India2026-05-01
Clifford Rim1007France2026-05-15
Isabel Bowley1008United Kingdom2026-05-11
Jennifer Amigon1009Spain2026-05-05
Deepesh Chui1010Japan2026-05-08
Darci Poquette1011Italy2026-04-28
Cody Saylors1012Canada2026-04-30
Adams Morasca1013Germany2026-04-21
Munro Ferencz1014Japan2026-05-10
Misaki Royster1015Russia2026-05-16
Smith Glick1016Germany2026-05-13
Jones Vocelka1017Brazil2026-05-17
Leon Oldroyd1018Argentina2026-05-08
James Butt1019France2026-05-07
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Claire TollnerRussiaIvan Magalhaes NEGOTIATION
Munro FerenczGermanyAmy Elsner PROPOSAL
Silvio SlusarskiUnited KingdomElwin Sharvill NEGOTIATION
Claire TollnerIndiaElwin Sharvill RENEWAL
Ricardo GauchoJapanAmy Elsner NEGOTIATION
Leja CaldareraJapanAnna Fali NEW
Maisha RulapaughBrazilBernardo Dominic NEGOTIATION
Claire TollnerRussiaXuxue Feng NEW
Jefferson SchemmerBrazilAsiya Javayant NEW
Arvin AlbaresArgentinaXuxue Feng UNQUALIFIED
Leon OldroydJapanBernardo Dominic NEW
Misaki RoysterIndiaOnyama Limba UNQUALIFIED
Misaki RoysterIndiaElwin Sharvill NEW
Aruna FigeroaBrazilAnna Fali NEGOTIATION
Tony FollerRussiaBernardo Dominic NEGOTIATION
Nicolas IturbideIndiaStephen Shaw PROPOSAL
Munro FerenczRussiaIvan Magalhaes NEW
Leon OldroydItalyElwin Sharvill RENEWAL
Stacey MacleadFranceOnyama Limba NEGOTIATION
Ashley DoeBrazilStephen Shaw QUALIFIED
Izzy GarufiItalyIoni Bowcher QUALIFIED
Misaki RoysterJapanBernardo Dominic UNQUALIFIED
Octavia MaletItalyAnna Fali UNQUALIFIED
Ivar PaprockiSpainElwin Sharvill QUALIFIED
Jones VocelkaBrazilStephen Shaw QUALIFIED
Ashley DoeCanadaOnyama Limba PROPOSAL
Francesco ShinkoJapanBernardo Dominic NEW
Chavez BriddickGermanyOnyama Limba NEGOTIATION
Nicolas IturbideItalyOnyama Limba UNQUALIFIED
Misaki RoysterGermanyIvan Magalhaes PROPOSAL
Rodrigues CampainArgentinaIoni Bowcher UNQUALIFIED
Jones VocelkaRussiaAmy Elsner NEW
Jones VocelkaAustraliaAnna Fali NEGOTIATION
Costa DilliardRussiaAmy Elsner RENEWAL
Aruna FigeroaRussiaStephen Shaw RENEWAL
Wickens NestleIndiaStephen Shaw NEW
Francesco ShinkoFranceAmy Elsner NEW
Leja CaldareraBrazilAnna Fali QUALIFIED
Smith GlickIndiaElwin Sharvill QUALIFIED
Jeanfrancois VenereGermanyIoni Bowcher 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>