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
James ButtAustraliaAmy Elsner PROPOSAL
Julie StensethRussiaOnyama Limba NEW
Arvin AlbaresIndiaXuxue Feng RENEWAL
Misaki RoysterUnited KingdomIvan Magalhaes UNQUALIFIED
Johnson SergiFranceIoni Bowcher NEW
Smith GlickIndiaIvan Magalhaes UNQUALIFIED
Wickens NestleItalyIoni Bowcher NEW
Julie StensethIndiaIvan Magalhaes UNQUALIFIED
Emily WhobreyFranceAsiya Javayant RENEWAL
Arvin AlbaresBrazilXuxue Feng QUALIFIED
Salvatore StockhamCanadaIvan Magalhaes NEGOTIATION
Johnson SergiArgentinaXuxue Feng UNQUALIFIED
Murillo MaletSpainIoni Bowcher RENEWAL
Munro FerenczBrazilStephen Shaw QUALIFIED
Darci PoquetteAustraliaAmy Elsner NEW
Antonio CaudyUnited KingdomOnyama Limba PROPOSAL
Tony FollerSpainAsiya Javayant NEW
Sinclair WaycottArgentinaElwin Sharvill QUALIFIED
Juan WieserIndiaAsiya Javayant NEW
Isabel BowleyBrazilBernardo Dominic NEGOTIATION
Adams MorascaGermanyOnyama Limba NEGOTIATION
Deepesh ChuiGermanyAsiya Javayant PROPOSAL
David DarakjyArgentinaOnyama Limba PROPOSAL
Jeanfrancois VenereSpainAnna Fali NEGOTIATION
Deepesh ChuiIndiaBernardo Dominic NEW
Murillo MaletFranceXuxue Feng QUALIFIED
Clifford RimItalyIoni Bowcher PROPOSAL
Izzy GarufiIndiaOnyama Limba PROPOSAL
Octavia MaletCanadaAnna Fali NEW
Octavia MaletSpainAnna Fali PROPOSAL
Ricardo GauchoRussiaXuxue Feng NEW
Silvio SlusarskiRussiaStephen Shaw PROPOSAL
Kadeem FlosiAustraliaIvan Magalhaes QUALIFIED
Salvatore StockhamGermanyIoni Bowcher NEW
Cody SaylorsSpainElwin Sharvill UNQUALIFIED
Ashley DoeIndiaElwin Sharvill NEGOTIATION
Kadeem FlosiRussiaElwin Sharvill PROPOSAL
Aika InouyeRussiaXuxue Feng UNQUALIFIED
Leon OldroydGermanyStephen Shaw UNQUALIFIED
Ashley DoeGermanyStephen Shaw PROPOSAL
Smith GlickIndiaAmy Elsner RENEWAL
Murillo MaletArgentinaElwin Sharvill RENEWAL
Faith GillianIndiaOnyama Limba PROPOSAL
Aruna FigeroaSpainIoni Bowcher RENEWAL
Kaitlin OstroskyRussiaOnyama Limba NEW
Claire TollnerItalyAsiya Javayant RENEWAL
Nicolas IturbideIndiaAsiya Javayant QUALIFIED
Claire TollnerItalyAsiya Javayant RENEWAL
Isabel BowleyFranceIoni Bowcher PROPOSAL
Juan WieserAustraliaAsiya Javayant QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Arvin AlbaresItalyStephen Shaw QUALIFIED
Clifford RimGermanyIvan Magalhaes NEW
Misaki RoysterSpainBernardo Dominic NEW
Silvio SlusarskiSpainStephen Shaw NEGOTIATION
Kadeem FlosiFranceIoni Bowcher QUALIFIED
Tony FollerGermanyElwin Sharvill QUALIFIED
Jefferson SchemmerSpainIvan Magalhaes NEW
Deepesh ChuiUnited KingdomIoni Bowcher PROPOSAL
Arvin AlbaresFranceStephen Shaw NEGOTIATION
Wickens NestleArgentinaIoni Bowcher RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Rodrigues CampainRussia2025-10-11Chanay, Jeffrey A Esq NEGOTIATION43Bernardo Dominic
1001Mujtaba NickaArgentina2025-10-16Buckley Miller Wright RENEWAL34Onyama Limba
1002Faith GillianCanada2025-11-03Rangoni Of Florence NEW93Anna Fali
1003Jennifer AmigonCanada2025-10-21King, Christopher A Esq UNQUALIFIED16Stephen Shaw
1004Wickens NestleRussia2025-10-12Commercial Press NEW8Onyama Limba
1005Aditya KuskoGermany2025-10-23Benton, John B Jr QUALIFIED75Ioni Bowcher
1006Rodrigues CampainJapan2025-10-29Benton, John B Jr PROPOSAL49Amy Elsner
1007Isabel BowleyArgentina2025-10-27Feltz Printing Service PROPOSAL53Elwin Sharvill
1008Rodrigues CampainAustralia2025-10-19Feiner Bros RENEWAL1Onyama Limba
1009Tony FollerCanada2025-11-01Chapman, Ross E Esq PROPOSAL89Amy Elsner
1010Emily WhobreyAustralia2025-10-05Chanay, Jeffrey A Esq NEW41Onyama Limba
1011Tony FollerRussia2025-10-12Buckley Miller Wright QUALIFIED90Stephen Shaw
1012Wickens NestleJapan2025-10-14Benton, John B Jr NEGOTIATION16Stephen Shaw
1013Antonio CaudyItaly2025-10-24Commercial Press NEW43Stephen Shaw
1014Ivar PaprockiIndia2025-10-27Printing Dimensions NEW1Amy Elsner
1015Arvin AlbaresRussia2025-10-31Morlong Associates NEW33Xuxue Feng
1016Morrow RutaJapan2025-10-17Feiner Bros NEGOTIATION80Amy Elsner
1017Greenwood BologniaArgentina2025-10-25Feltz Printing Service RENEWAL41Ioni Bowcher
1018Misaki RoysterArgentina2025-10-27Benton, John B Jr NEGOTIATION62Ivan Magalhaes
1019Smith GlickBrazil2025-10-24King, Christopher A Esq RENEWAL85Stephen Shaw
1020Smith GlickArgentina2025-10-20Feiner Bros UNQUALIFIED25Ivan Magalhaes
1021Stacey MacleadItaly2025-10-07Morlong Associates NEGOTIATION19Ivan Magalhaes
1022Morrow RutaBrazil2025-11-02Morlong Associates QUALIFIED78Ioni Bowcher
1023Deepesh ChuiAustralia2025-10-27Printing Dimensions UNQUALIFIED40Stephen Shaw
1024Morrow RutaUnited Kingdom2025-10-05Rangoni Of Florence QUALIFIED7Bernardo Dominic
1025Leon OldroydGermany2025-10-29Rousseaux, Michael Esq NEW52Ioni Bowcher
1026Tony FollerCanada2025-10-31Truhlar And Truhlar Attys NEW82Xuxue Feng
1027Mayumi KolmetzArgentina2025-10-22Feiner Bros UNQUALIFIED22Stephen Shaw
1028Ricardo GauchoIndia2025-10-19Dorl, James J Esq QUALIFIED54Onyama Limba
1029Misaki RoysterFrance2025-10-06Chemel, James L Cpa NEGOTIATION64Xuxue Feng
1030Sinclair WaycottRussia2025-10-06Rangoni Of Florence QUALIFIED86Amy Elsner
1031Rodrigues CampainArgentina2025-11-03Dorl, James J Esq UNQUALIFIED59Anna Fali
1032Jefferson SchemmerRussia2025-10-30Feiner Bros NEW3Ivan Magalhaes
1033Greenwood BologniaGermany2025-10-24Feiner Bros NEGOTIATION12Asiya Javayant
1034Juan WieserItaly2025-10-16Rousseaux, Michael Esq RENEWAL55Onyama Limba
1035Chavez BriddickSpain2025-10-11King, Christopher A Esq NEGOTIATION29Xuxue Feng
1036Costa DilliardAustralia2025-11-03Feiner Bros RENEWAL52Xuxue Feng
1037Cody SaylorsSpain2025-10-08Buckley Miller Wright QUALIFIED93Anna Fali
1038Emily WhobreyAustralia2025-10-16Printing Dimensions QUALIFIED96Onyama Limba
1039Kadeem FlosiGermany2025-10-26Morlong Associates NEW28Stephen Shaw
1040Nicolas IturbideRussia2025-10-26Printing Dimensions UNQUALIFIED58Ivan Magalhaes
1041Juan WieserArgentina2025-10-27Morlong Associates NEW6Amy Elsner
1042Jeanfrancois VenereAustralia2025-10-06Morlong Associates PROPOSAL78Stephen Shaw
1043Aika InouyeIndia2025-10-18Printing Dimensions RENEWAL82Ivan Magalhaes
1044Claire TollnerItaly2025-10-08Feiner Bros NEGOTIATION40Elwin Sharvill
1045David DarakjyRussia2025-10-17Benton, John B Jr QUALIFIED53Bernardo Dominic
1046Murillo MaletSpain2025-11-01Feltz Printing Service NEGOTIATION64Elwin Sharvill
1047Leon OldroydFrance2025-10-30Feiner Bros PROPOSAL44Ioni Bowcher
1048Clifford RimSpain2025-10-24Truhlar And Truhlar Attys QUALIFIED24Anna Fali
1049David DarakjyRussia2025-10-23Chapman, Ross E Esq QUALIFIED87Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Juan WieserBrazilBernardo Dominic UNQUALIFIED
Maria MarrierUnited KingdomAnna Fali NEGOTIATION
Clifford RimBrazilBernardo Dominic NEW
Ricardo GauchoJapanElwin Sharvill PROPOSAL
Munro FerenczRussiaElwin Sharvill NEW
Maria MarrierUnited KingdomStephen Shaw UNQUALIFIED
Ashley DoeBrazilIoni Bowcher QUALIFIED
Leon OldroydFranceAnna Fali NEW
Rodrigues CampainItalyIoni Bowcher PROPOSAL
Maisha RulapaughRussiaBernardo Dominic NEW
Stacey MacleadCanadaElwin Sharvill NEW
Kadeem FlosiSpainBernardo Dominic UNQUALIFIED
Deepesh ChuiBrazilIoni Bowcher UNQUALIFIED
Greenwood BologniaAustraliaBernardo Dominic RENEWAL
Ivar PaprockiUnited KingdomIoni Bowcher QUALIFIED
Antonio CaudyItalyBernardo Dominic RENEWAL
Chavez BriddickItalyIoni Bowcher RENEWAL
Antonio CaudyFranceOnyama Limba NEGOTIATION
David DarakjyCanadaStephen Shaw NEW
Deepesh ChuiJapanIvan Magalhaes NEW
Jones VocelkaFranceAsiya Javayant QUALIFIED
Clifford RimSpainIoni Bowcher QUALIFIED
Jones VocelkaItalyBernardo Dominic RENEWAL
Ivar PaprockiJapanXuxue Feng QUALIFIED
Izzy GarufiRussiaElwin Sharvill RENEWAL
Leon OldroydUnited KingdomBernardo Dominic NEGOTIATION
Alejandro PerinFranceStephen Shaw RENEWAL
Salvatore StockhamArgentinaAsiya Javayant RENEWAL
Claire TollnerCanadaAsiya Javayant PROPOSAL
Leja CaldareraItalyAmy Elsner NEGOTIATION
Morrow RutaJapanXuxue Feng QUALIFIED
Leja CaldareraUnited KingdomIoni Bowcher PROPOSAL
Mujtaba NickaCanadaBernardo Dominic UNQUALIFIED
Ricardo GauchoIndiaIvan Magalhaes QUALIFIED
Ivar PaprockiItalyAmy Elsner NEGOTIATION
Octavia MaletJapanAmy Elsner PROPOSAL
Wickens NestleItalyAsiya Javayant NEGOTIATION
Maria MarrierUnited KingdomBernardo Dominic QUALIFIED
Salvatore StockhamItalyStephen Shaw RENEWAL
Jeanfrancois VenereItalyElwin Sharvill UNQUALIFIED
Costa DilliardGermanyOnyama Limba RENEWAL
Juan WieserUnited KingdomStephen Shaw UNQUALIFIED
Murillo MaletUnited KingdomAsiya Javayant QUALIFIED
Aruna FigeroaCanadaIvan Magalhaes QUALIFIED
Deepesh ChuiJapanAnna Fali UNQUALIFIED
Deepesh ChuiGermanyIoni Bowcher PROPOSAL
Isabel BowleyGermanyBernardo Dominic RENEWAL
Morrow RutaFranceOnyama Limba PROPOSAL
Nicolas IturbideIndiaBernardo Dominic UNQUALIFIED
Jeanfrancois VenereUnited KingdomElwin Sharvill NEW
Frozen Columns
Name
Salvatore Stockham
Octavia Malet
David Darakjy
Salvatore Stockham
Kaitlin Ostrosky
Stacey Maclead
Tony Foller
Maria Marrier
Salvatore Stockham
Wickens Nestle
Aditya Kusko
Salvatore Stockham
Mayumi Kolmetz
James Butt
Sinclair Waycott
Kadeem Flosi
Mujtaba Nicka
Jennifer Amigon
Silvio Slusarski
Julie Stenseth
Deepesh Chui
Juan Wieser
Aruna Figeroa
Leja Caldarera
Ashley Doe
Kaitlin Ostrosky
Silvio Slusarski
Salvatore Stockham
Jefferson Schemmer
Aditya Kusko
Isabel Bowley
Darci Poquette
Morrow Ruta
Leon Oldroyd
Ivar Paprocki
Greenwood Bolognia
Tony Foller
Clifford Rim
Kadeem Flosi
Izzy Garufi
Izzy Garufi
Ricardo Gaucho
Izzy Garufi
Cody Saylors
Jones Vocelka
James Butt
Julie Stenseth
Greenwood Bolognia
Silvio Slusarski
Chavez Briddick
IdCountryDate
1000Australia2025-10-26
1001Italy2025-10-14
1002Italy2025-10-26
1003Germany2025-10-22
1004Spain2025-10-20
1005Germany2025-11-01
1006India2025-10-16
1007Russia2025-10-26
1008Argentina2025-10-18
1009Brazil2025-11-02
1010Canada2025-10-06
1011India2025-10-07
1012Japan2025-10-18
1013India2025-10-18
1014Germany2025-10-26
1015Canada2025-10-30
1016Spain2025-10-11
1017Argentina2025-10-12
1018United Kingdom2025-10-17
1019Spain2025-10-26
1020Canada2025-10-05
1021Spain2025-10-14
1022Japan2025-10-24
1023United Kingdom2025-10-20
1024Italy2025-10-19
1025Germany2025-10-10
1026Japan2025-10-07
1027Germany2025-10-30
1028Italy2025-10-30
1029United Kingdom2025-10-22
1030Italy2025-10-05
1031Australia2025-10-24
1032Germany2025-10-05
1033Argentina2025-10-29
1034India2025-10-15
1035Italy2025-10-13
1036Spain2025-10-05
1037Brazil2025-10-06
1038Russia2025-10-20
1039United Kingdom2025-10-12
1040France2025-10-09
1041Argentina2025-10-05
1042France2025-10-15
1043Australia2025-11-02
1044Russia2025-10-09
1045Canada2025-10-10
1046India2025-10-10
1047United Kingdom2025-10-07
1048Germany2025-10-14
1049France2025-10-21

On-Demand Data

NameIdCountryDate
Aditya Kusko1000Brazil2025-10-06
Greenwood Bolognia1001Italy2025-10-05
Maisha Rulapaugh1002India2025-10-10
Johnson Sergi1003India2025-10-10
Misaki Royster1004United Kingdom2025-10-06
Jones Vocelka1005Japan2025-10-11
Salvatore Stockham1006Argentina2025-11-03
David Darakjy1007Italy2025-10-14
Jefferson Schemmer1008Canada2025-10-23
Darci Poquette1009Germany2025-10-23
Ivar Paprocki1010Japan2025-10-11
Darci Poquette1011Germany2025-10-11
Tony Foller1012Australia2025-10-20
Costa Dilliard1013Australia2025-10-15
Jones Vocelka1014Japan2025-10-13
Jefferson Schemmer1015Japan2025-10-16
Jeanfrancois Venere1016Argentina2025-10-29
Arvin Albares1017France2025-10-15
Tony Foller1018Italy2025-10-17
Jeanfrancois Venere1019India2025-10-10
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Octavia MaletGermanyAmy Elsner UNQUALIFIED
Isabel BowleyFranceBernardo Dominic NEW
Alejandro PerinUnited KingdomIoni Bowcher PROPOSAL
Jefferson SchemmerItalyAsiya Javayant NEGOTIATION
Stacey MacleadUnited KingdomAsiya Javayant UNQUALIFIED
Emily WhobreyAustraliaElwin Sharvill QUALIFIED
Ivar PaprockiArgentinaStephen Shaw RENEWAL
Ashley DoeSpainStephen Shaw NEGOTIATION
Darci PoquetteUnited KingdomIoni Bowcher RENEWAL
Jennifer AmigonJapanAnna Fali PROPOSAL
Maria MarrierBrazilXuxue Feng RENEWAL
Arvin AlbaresGermanyAsiya Javayant RENEWAL
Juan WieserIndiaAmy Elsner RENEWAL
Isabel BowleyRussiaIoni Bowcher UNQUALIFIED
Leon OldroydCanadaElwin Sharvill NEGOTIATION
Stacey MacleadRussiaIvan Magalhaes RENEWAL
Maria MarrierJapanIoni Bowcher PROPOSAL
Leja CaldareraUnited KingdomXuxue Feng NEGOTIATION
Izzy GarufiGermanyElwin Sharvill PROPOSAL
Aika InouyeItalyElwin Sharvill PROPOSAL
Maria MarrierIndiaIoni Bowcher NEW
Greenwood BologniaIndiaElwin Sharvill NEW
Alejandro PerinArgentinaAmy Elsner RENEWAL
Ricardo GauchoUnited KingdomIoni Bowcher NEGOTIATION
Silvio SlusarskiGermanyIvan Magalhaes PROPOSAL
Antonio CaudyRussiaXuxue Feng NEW
Wickens NestleCanadaBernardo Dominic NEGOTIATION
Sinclair WaycottItalyOnyama Limba NEW
Darci PoquetteBrazilIvan Magalhaes RENEWAL
Antonio CaudyRussiaIvan Magalhaes NEGOTIATION
Murillo MaletJapanBernardo Dominic PROPOSAL
Munro FerenczCanadaAsiya Javayant PROPOSAL
Nicolas IturbideIndiaAnna Fali NEW
Leon OldroydArgentinaAnna Fali PROPOSAL
Mujtaba NickaArgentinaAmy Elsner RENEWAL
Jennifer AmigonIndiaIoni Bowcher PROPOSAL
Mayumi KolmetzCanadaIvan Magalhaes NEGOTIATION
Francesco ShinkoSpainAsiya Javayant NEGOTIATION
Aruna FigeroaArgentinaAmy Elsner NEW
Ashley DoeCanadaElwin Sharvill 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>