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
Misaki RoysterIndiaIvan Magalhaes PROPOSAL
Sinclair WaycottIndiaOnyama Limba NEGOTIATION
Ivar PaprockiIndiaElwin Sharvill PROPOSAL
James ButtCanadaAmy Elsner UNQUALIFIED
Izzy GarufiUnited KingdomAsiya Javayant RENEWAL
Mujtaba NickaIndiaXuxue Feng RENEWAL
Juan WieserBrazilAmy Elsner UNQUALIFIED
Izzy GarufiRussiaIoni Bowcher QUALIFIED
Munro FerenczFranceStephen Shaw RENEWAL
Greenwood BologniaFranceXuxue Feng PROPOSAL
Darci PoquetteJapanXuxue Feng QUALIFIED
Smith GlickSpainXuxue Feng NEW
Aditya KuskoFranceIvan Magalhaes RENEWAL
Juan WieserBrazilXuxue Feng NEW
Julie StensethUnited KingdomIoni Bowcher UNQUALIFIED
Emily WhobreyFranceBernardo Dominic UNQUALIFIED
Aditya KuskoGermanyAnna Fali UNQUALIFIED
Izzy GarufiIndiaStephen Shaw QUALIFIED
Francesco ShinkoGermanyOnyama Limba QUALIFIED
Salvatore StockhamAustraliaElwin Sharvill QUALIFIED
Mayumi KolmetzUnited KingdomOnyama Limba PROPOSAL
Sinclair WaycottIndiaBernardo Dominic RENEWAL
Costa DilliardRussiaXuxue Feng PROPOSAL
David DarakjyAustraliaOnyama Limba QUALIFIED
Francesco ShinkoAustraliaBernardo Dominic NEGOTIATION
Alejandro PerinArgentinaIvan Magalhaes NEGOTIATION
Rodrigues CampainArgentinaAnna Fali QUALIFIED
Smith GlickJapanAmy Elsner NEGOTIATION
Deepesh ChuiArgentinaIvan Magalhaes UNQUALIFIED
Jefferson SchemmerFranceOnyama Limba NEW
Kaitlin OstroskySpainElwin Sharvill NEGOTIATION
James ButtAustraliaAmy Elsner UNQUALIFIED
Morrow RutaIndiaAsiya Javayant RENEWAL
Kaitlin OstroskyItalyIoni Bowcher NEW
Silvio SlusarskiGermanyIvan Magalhaes PROPOSAL
Mujtaba NickaRussiaStephen Shaw NEW
Ricardo GauchoRussiaBernardo Dominic NEW
Munro FerenczSpainAsiya Javayant RENEWAL
Juan WieserSpainBernardo Dominic NEGOTIATION
Nicolas IturbideGermanyOnyama Limba QUALIFIED
Kadeem FlosiSpainElwin Sharvill QUALIFIED
Salvatore StockhamJapanAmy Elsner PROPOSAL
Kaitlin OstroskyIndiaAnna Fali NEW
Sinclair WaycottAustraliaIoni Bowcher PROPOSAL
Cody SaylorsSpainXuxue Feng NEW
Wickens NestleJapanStephen Shaw PROPOSAL
Chavez BriddickSpainIvan Magalhaes QUALIFIED
Darci PoquetteRussiaIoni Bowcher NEGOTIATION
Adams MorascaFranceBernardo Dominic RENEWAL
Johnson SergiCanadaElwin Sharvill PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Izzy GarufiCanadaElwin Sharvill QUALIFIED
Jefferson SchemmerIndiaStephen Shaw NEW
Deepesh ChuiCanadaIvan Magalhaes NEW
Sinclair WaycottCanadaAnna Fali UNQUALIFIED
Aditya KuskoCanadaBernardo Dominic QUALIFIED
James ButtUnited KingdomAmy Elsner NEW
Chavez BriddickRussiaOnyama Limba RENEWAL
Mayumi KolmetzArgentinaAmy Elsner NEGOTIATION
Rodrigues CampainBrazilOnyama Limba PROPOSAL
Izzy GarufiAustraliaElwin Sharvill NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Ivar PaprockiBrazil2025-07-06Chapman, Ross E Esq QUALIFIED23Bernardo Dominic
1001Adams MorascaSpain2025-07-08Benton, John B Jr NEW13Anna Fali
1002Jeanfrancois VenereCanada2025-08-02Printing Dimensions NEW74Stephen Shaw
1003Octavia MaletJapan2025-07-19Commercial Press PROPOSAL9Asiya Javayant
1004Deepesh ChuiBrazil2025-07-30Truhlar And Truhlar Attys NEGOTIATION98Elwin Sharvill
1005Clifford RimArgentina2025-07-12Benton, John B Jr NEW97Anna Fali
1006Nicolas IturbideArgentina2025-07-31Dorl, James J Esq NEW39Asiya Javayant
1007Aruna FigeroaIndia2025-07-07Chanay, Jeffrey A Esq NEW82Onyama Limba
1008Arvin AlbaresBrazil2025-07-16Chapman, Ross E Esq QUALIFIED63Asiya Javayant
1009Aika InouyeFrance2025-07-30Chanay, Jeffrey A Esq RENEWAL72Asiya Javayant
1010Ricardo GauchoItaly2025-07-13Rangoni Of Florence NEGOTIATION23Onyama Limba
1011Jeanfrancois VenereBrazil2025-07-25Chapman, Ross E Esq RENEWAL90Xuxue Feng
1012Wickens NestleBrazil2025-07-27Feltz Printing Service UNQUALIFIED80Stephen Shaw
1013Isabel BowleyCanada2025-07-12Truhlar And Truhlar Attys NEW19Ivan Magalhaes
1014Stacey MacleadFrance2025-07-29King, Christopher A Esq RENEWAL2Ivan Magalhaes
1015Costa DilliardGermany2025-07-26Feltz Printing Service UNQUALIFIED44Bernardo Dominic
1016Aika InouyeArgentina2025-07-19Truhlar And Truhlar Attys NEGOTIATION30Amy Elsner
1017Greenwood BologniaIndia2025-07-18Commercial Press NEGOTIATION63Anna Fali
1018Munro FerenczRussia2025-07-27Feltz Printing Service PROPOSAL13Anna Fali
1019Maria MarrierItaly2025-07-08Chapman, Ross E Esq NEW82Bernardo Dominic
1020David DarakjyAustralia2025-07-18Printing Dimensions UNQUALIFIED21Amy Elsner
1021Mujtaba NickaFrance2025-08-02Printing Dimensions PROPOSAL29Stephen Shaw
1022Juan WieserAustralia2025-07-24Printing Dimensions QUALIFIED4Elwin Sharvill
1023Arvin AlbaresFrance2025-07-18Dorl, James J Esq NEGOTIATION3Bernardo Dominic
1024Julie StensethGermany2025-07-27Buckley Miller Wright PROPOSAL49Elwin Sharvill
1025Leon OldroydAustralia2025-07-27Printing Dimensions NEGOTIATION86Anna Fali
1026Arvin AlbaresSpain2025-08-03Commercial Press UNQUALIFIED30Amy Elsner
1027Leja CaldareraAustralia2025-07-09King, Christopher A Esq NEGOTIATION64Stephen Shaw
1028Stacey MacleadGermany2025-07-14Buckley Miller Wright NEW67Stephen Shaw
1029Aika InouyeBrazil2025-07-14Buckley Miller Wright NEW87Xuxue Feng
1030Ricardo GauchoRussia2025-07-20Morlong Associates RENEWAL21Asiya Javayant
1031Aika InouyeSpain2025-07-05Feltz Printing Service PROPOSAL25Bernardo Dominic
1032Munro FerenczJapan2025-07-30Truhlar And Truhlar Attys UNQUALIFIED65Elwin Sharvill
1033Greenwood BologniaIndia2025-07-09King, Christopher A Esq PROPOSAL16Onyama Limba
1034Jennifer AmigonArgentina2025-07-05Benton, John B Jr RENEWAL27Ivan Magalhaes
1035Stacey MacleadUnited Kingdom2025-07-07King, Christopher A Esq NEGOTIATION72Stephen Shaw
1036Arvin AlbaresUnited Kingdom2025-08-03Feiner Bros PROPOSAL33Amy Elsner
1037Chavez BriddickRussia2025-07-17Feiner Bros UNQUALIFIED61Ioni Bowcher
1038Morrow RutaBrazil2025-07-29Chapman, Ross E Esq NEW18Stephen Shaw
1039Claire TollnerBrazil2025-07-26Printing Dimensions NEGOTIATION79Bernardo Dominic
1040Costa DilliardBrazil2025-07-09Feltz Printing Service QUALIFIED26Stephen Shaw
1041Aditya KuskoSpain2025-07-17Dorl, James J Esq NEGOTIATION34Onyama Limba
1042Juan WieserBrazil2025-07-08Feiner Bros QUALIFIED13Ivan Magalhaes
1043Arvin AlbaresGermany2025-07-15Benton, John B Jr PROPOSAL14Bernardo Dominic
1044Cody SaylorsUnited Kingdom2025-07-27Benton, John B Jr PROPOSAL73Onyama Limba
1045Aika InouyeJapan2025-08-02Rousseaux, Michael Esq QUALIFIED6Onyama Limba
1046Misaki RoysterUnited Kingdom2025-07-29Rangoni Of Florence NEW10Anna Fali
1047Rodrigues CampainUnited Kingdom2025-07-15Truhlar And Truhlar Attys NEW67Ivan Magalhaes
1048Chavez BriddickItaly2025-07-18Morlong Associates RENEWAL50Bernardo Dominic
1049Deepesh ChuiBrazil2025-07-08King, Christopher A Esq NEGOTIATION59Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
James ButtIndiaAsiya Javayant NEW
Greenwood BologniaRussiaAsiya Javayant PROPOSAL
Aruna FigeroaSpainIvan Magalhaes PROPOSAL
Jefferson SchemmerSpainIoni Bowcher NEW
Alejandro PerinUnited KingdomOnyama Limba NEW
Adams MorascaArgentinaAmy Elsner UNQUALIFIED
Rodrigues CampainRussiaElwin Sharvill RENEWAL
Greenwood BologniaAustraliaOnyama Limba NEW
Wickens NestleArgentinaIoni Bowcher NEW
Sinclair WaycottSpainAmy Elsner NEW
Mayumi KolmetzGermanyElwin Sharvill UNQUALIFIED
Emily WhobreyRussiaXuxue Feng PROPOSAL
Jennifer AmigonRussiaOnyama Limba PROPOSAL
Sinclair WaycottGermanyElwin Sharvill UNQUALIFIED
Octavia MaletRussiaAnna Fali QUALIFIED
Cody SaylorsSpainAnna Fali RENEWAL
Silvio SlusarskiSpainElwin Sharvill QUALIFIED
Johnson SergiCanadaIvan Magalhaes RENEWAL
Arvin AlbaresArgentinaElwin Sharvill NEW
Stacey MacleadCanadaIvan Magalhaes PROPOSAL
Rodrigues CampainCanadaBernardo Dominic RENEWAL
Johnson SergiAustraliaStephen Shaw NEGOTIATION
James ButtRussiaIvan Magalhaes QUALIFIED
Kadeem FlosiBrazilAsiya Javayant QUALIFIED
Silvio SlusarskiIndiaAmy Elsner QUALIFIED
Izzy GarufiIndiaElwin Sharvill UNQUALIFIED
Salvatore StockhamUnited KingdomIoni Bowcher RENEWAL
Johnson SergiAustraliaOnyama Limba UNQUALIFIED
Kaitlin OstroskyIndiaIvan Magalhaes NEW
Costa DilliardSpainOnyama Limba NEW
Maria MarrierFranceAnna Fali NEW
Cody SaylorsAustraliaIoni Bowcher NEW
Emily WhobreySpainOnyama Limba NEW
Claire TollnerBrazilIoni Bowcher NEW
Johnson SergiCanadaXuxue Feng NEGOTIATION
Munro FerenczRussiaElwin Sharvill UNQUALIFIED
Izzy GarufiCanadaBernardo Dominic PROPOSAL
Octavia MaletAustraliaIvan Magalhaes NEW
Juan WieserAustraliaIvan Magalhaes NEGOTIATION
Leon OldroydAustraliaOnyama Limba RENEWAL
Mujtaba NickaIndiaIvan Magalhaes NEGOTIATION
Tony FollerFranceBernardo Dominic QUALIFIED
Isabel BowleyIndiaElwin Sharvill NEGOTIATION
James ButtArgentinaXuxue Feng NEW
Morrow RutaRussiaBernardo Dominic NEW
Morrow RutaRussiaAmy Elsner PROPOSAL
Wickens NestleBrazilStephen Shaw PROPOSAL
Johnson SergiItalyIoni Bowcher RENEWAL
Costa DilliardArgentinaIoni Bowcher QUALIFIED
Aruna FigeroaItalyBernardo Dominic RENEWAL
Frozen Columns
Name
Deepesh Chui
Aditya Kusko
Jones Vocelka
Leja Caldarera
Izzy Garufi
Arvin Albares
Mujtaba Nicka
Darci Poquette
Jones Vocelka
Alejandro Perin
Costa Dilliard
Greenwood Bolognia
Francesco Shinko
Costa Dilliard
Sinclair Waycott
James Butt
Deepesh Chui
Jeanfrancois Venere
Octavia Malet
Rodrigues Campain
Adams Morasca
Munro Ferencz
Mujtaba Nicka
Jeanfrancois Venere
Rodrigues Campain
Faith Gillian
Faith Gillian
Nicolas Iturbide
Costa Dilliard
David Darakjy
Claire Tollner
Clifford Rim
James Butt
Antonio Caudy
Salvatore Stockham
Silvio Slusarski
Leja Caldarera
Wickens Nestle
Johnson Sergi
Smith Glick
Mayumi Kolmetz
Misaki Royster
Antonio Caudy
Aika Inouye
Cody Saylors
Maria Marrier
Mayumi Kolmetz
Claire Tollner
Julie Stenseth
Jefferson Schemmer
IdCountryDate
1000Spain2025-07-18
1001India2025-07-30
1002Australia2025-08-01
1003France2025-07-15
1004Spain2025-07-20
1005Germany2025-07-27
1006Australia2025-07-10
1007Italy2025-07-28
1008Italy2025-07-21
1009Germany2025-07-28
1010France2025-07-18
1011Spain2025-07-14
1012Argentina2025-07-10
1013Germany2025-07-14
1014Spain2025-07-23
1015India2025-07-22
1016Russia2025-08-03
1017Argentina2025-07-31
1018Germany2025-07-07
1019Italy2025-08-03
1020Germany2025-07-22
1021United Kingdom2025-07-18
1022Russia2025-07-29
1023Germany2025-08-01
1024Spain2025-07-28
1025India2025-07-15
1026Germany2025-07-18
1027Germany2025-07-23
1028Italy2025-07-22
1029France2025-07-29
1030Italy2025-08-02
1031Italy2025-07-10
1032Russia2025-07-14
1033Italy2025-07-07
1034Argentina2025-07-17
1035Argentina2025-07-24
1036Argentina2025-07-24
1037Japan2025-07-21
1038India2025-07-06
1039Brazil2025-07-19
1040Spain2025-07-12
1041Russia2025-07-09
1042United Kingdom2025-07-12
1043Russia2025-07-13
1044Italy2025-07-21
1045Japan2025-07-25
1046Germany2025-07-15
1047Japan2025-07-09
1048Canada2025-07-19
1049Japan2025-07-10

On-Demand Data

NameIdCountryDate
Morrow Ruta1000Japan2025-08-02
Stacey Maclead1001Japan2025-07-24
Chavez Briddick1002Argentina2025-07-18
Aruna Figeroa1003France2025-07-27
Emily Whobrey1004Italy2025-07-29
Jones Vocelka1005Japan2025-07-28
Nicolas Iturbide1006Australia2025-08-03
Murillo Malet1007Australia2025-07-18
Murillo Malet1008Australia2025-07-21
James Butt1009Russia2025-07-19
Jennifer Amigon1010Brazil2025-07-18
Tony Foller1011Brazil2025-07-08
Ashley Doe1012Argentina2025-07-22
Rodrigues Campain1013Spain2025-07-15
Aditya Kusko1014Russia2025-07-22
Ashley Doe1015Russia2025-07-29
Cody Saylors1016India2025-08-01
Ricardo Gaucho1017Australia2025-07-31
Aruna Figeroa1018Spain2025-08-02
Julie Stenseth1019India2025-07-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Clifford RimFranceStephen Shaw PROPOSAL
Claire TollnerIndiaElwin Sharvill UNQUALIFIED
Aika InouyeSpainAsiya Javayant PROPOSAL
Izzy GarufiItalyIvan Magalhaes PROPOSAL
Octavia MaletBrazilStephen Shaw PROPOSAL
Sinclair WaycottGermanyElwin Sharvill PROPOSAL
Wickens NestleArgentinaXuxue Feng NEGOTIATION
Ashley DoeArgentinaAsiya Javayant QUALIFIED
Isabel BowleyRussiaXuxue Feng PROPOSAL
Silvio SlusarskiCanadaAsiya Javayant QUALIFIED
Salvatore StockhamArgentinaIoni Bowcher RENEWAL
Juan WieserBrazilStephen Shaw NEW
Deepesh ChuiIndiaOnyama Limba NEW
Arvin AlbaresIndiaElwin Sharvill NEW
Kadeem FlosiGermanyOnyama Limba QUALIFIED
Mujtaba NickaJapanAnna Fali RENEWAL
Faith GillianIndiaAsiya Javayant PROPOSAL
Costa DilliardArgentinaIvan Magalhaes NEGOTIATION
Aditya KuskoJapanOnyama Limba NEW
Emily WhobreyGermanyAnna Fali PROPOSAL
Jefferson SchemmerJapanAmy Elsner PROPOSAL
Johnson SergiIndiaStephen Shaw QUALIFIED
David DarakjyAustraliaIoni Bowcher QUALIFIED
Faith GillianSpainElwin Sharvill QUALIFIED
Adams MorascaBrazilElwin Sharvill UNQUALIFIED
Deepesh ChuiRussiaAmy Elsner RENEWAL
Munro FerenczIndiaBernardo Dominic QUALIFIED
Wickens NestleAustraliaAmy Elsner UNQUALIFIED
Antonio CaudyUnited KingdomBernardo Dominic NEGOTIATION
Tony FollerFranceAmy Elsner NEGOTIATION
Maisha RulapaughRussiaAnna Fali NEW
Isabel BowleyRussiaAsiya Javayant NEW
Morrow RutaArgentinaAnna Fali PROPOSAL
Ivar PaprockiUnited KingdomXuxue Feng NEGOTIATION
Munro FerenczIndiaIoni Bowcher QUALIFIED
Johnson SergiBrazilIvan Magalhaes NEGOTIATION
Wickens NestleIndiaAmy Elsner QUALIFIED
Leon OldroydBrazilStephen Shaw UNQUALIFIED
Juan WieserBrazilAmy Elsner NEGOTIATION
Ivar PaprockiBrazilAnna Fali 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>