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
Julie StensethJapanStephen Shaw RENEWAL
Kadeem FlosiItalyXuxue Feng QUALIFIED
Leon OldroydIndiaOnyama Limba QUALIFIED
Clifford RimJapanAnna Fali NEGOTIATION
Ashley DoeIndiaIoni Bowcher NEGOTIATION
Aika InouyeUnited KingdomAmy Elsner UNQUALIFIED
Sinclair WaycottFranceAmy Elsner QUALIFIED
Francesco ShinkoGermanyOnyama Limba NEW
Ashley DoeRussiaOnyama Limba QUALIFIED
Octavia MaletAustraliaIoni Bowcher PROPOSAL
Misaki RoysterItalyAnna Fali NEW
Jeanfrancois VenereIndiaStephen Shaw NEGOTIATION
Kadeem FlosiItalyAnna Fali PROPOSAL
Claire TollnerIndiaAmy Elsner NEW
Leja CaldareraIndiaOnyama Limba RENEWAL
Jones VocelkaSpainAsiya Javayant NEW
Juan WieserCanadaElwin Sharvill PROPOSAL
Deepesh ChuiRussiaIvan Magalhaes RENEWAL
Jennifer AmigonJapanAmy Elsner NEGOTIATION
Jones VocelkaFranceBernardo Dominic UNQUALIFIED
Murillo MaletRussiaAnna Fali QUALIFIED
Leja CaldareraIndiaXuxue Feng PROPOSAL
Misaki RoysterArgentinaIoni Bowcher QUALIFIED
Antonio CaudyGermanyIoni Bowcher NEW
Kaitlin OstroskyBrazilAnna Fali QUALIFIED
Ricardo GauchoJapanAsiya Javayant NEGOTIATION
Ashley DoeGermanyIvan Magalhaes RENEWAL
Smith GlickFranceBernardo Dominic NEW
Antonio CaudyArgentinaStephen Shaw QUALIFIED
David DarakjyBrazilIvan Magalhaes NEGOTIATION
Leja CaldareraArgentinaBernardo Dominic QUALIFIED
Maria MarrierCanadaIvan Magalhaes UNQUALIFIED
Emily WhobreyJapanOnyama Limba QUALIFIED
Smith GlickSpainXuxue Feng RENEWAL
Johnson SergiRussiaOnyama Limba UNQUALIFIED
Ricardo GauchoRussiaIoni Bowcher NEW
Jones VocelkaFranceAmy Elsner NEGOTIATION
Munro FerenczAustraliaStephen Shaw UNQUALIFIED
Francesco ShinkoAustraliaStephen Shaw PROPOSAL
Ivar PaprockiBrazilAsiya Javayant RENEWAL
Ashley DoeArgentinaXuxue Feng PROPOSAL
Arvin AlbaresSpainElwin Sharvill QUALIFIED
Kaitlin OstroskyUnited KingdomAmy Elsner NEW
Jones VocelkaAustraliaAmy Elsner RENEWAL
Kaitlin OstroskyUnited KingdomXuxue Feng QUALIFIED
Emily WhobreyRussiaOnyama Limba QUALIFIED
Johnson SergiRussiaXuxue Feng PROPOSAL
Mujtaba NickaCanadaAmy Elsner PROPOSAL
Deepesh ChuiItalyStephen Shaw PROPOSAL
Rodrigues CampainAustraliaAsiya Javayant QUALIFIED
Horizontal
NameCountryRepresentativeStatus
David DarakjyGermanyBernardo Dominic NEW
Kaitlin OstroskyJapanAmy Elsner NEW
Clifford RimRussiaAsiya Javayant NEGOTIATION
Stacey MacleadArgentinaAsiya Javayant PROPOSAL
Morrow RutaGermanyIoni Bowcher PROPOSAL
Kadeem FlosiSpainAmy Elsner UNQUALIFIED
Chavez BriddickUnited KingdomElwin Sharvill PROPOSAL
Kaitlin OstroskyCanadaIoni Bowcher QUALIFIED
Ashley DoeCanadaXuxue Feng RENEWAL
Faith GillianItalyAnna Fali QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Alejandro PerinGermany2026-05-03Buckley Miller Wright UNQUALIFIED39Amy Elsner
1001Faith GillianJapan2026-04-23Chapman, Ross E Esq RENEWAL81Bernardo Dominic
1002Stacey MacleadItaly2026-05-02Feiner Bros PROPOSAL80Elwin Sharvill
1003Costa DilliardRussia2026-04-18Dorl, James J Esq UNQUALIFIED19Xuxue Feng
1004Maria MarrierGermany2026-04-30Truhlar And Truhlar Attys NEW11Ioni Bowcher
1005Antonio CaudyFrance2026-05-08Dorl, James J Esq QUALIFIED41Ivan Magalhaes
1006Chavez BriddickBrazil2026-04-30King, Christopher A Esq NEW18Asiya Javayant
1007Kaitlin OstroskyIndia2026-05-08Rangoni Of Florence PROPOSAL44Bernardo Dominic
1008Murillo MaletItaly2026-05-12King, Christopher A Esq NEGOTIATION60Anna Fali
1009Claire TollnerBrazil2026-05-11Dorl, James J Esq PROPOSAL11Onyama Limba
1010Salvatore StockhamRussia2026-04-29Chanay, Jeffrey A Esq NEW29Stephen Shaw
1011Leon OldroydCanada2026-05-12Chanay, Jeffrey A Esq QUALIFIED26Anna Fali
1012Munro FerenczGermany2026-04-29Rousseaux, Michael Esq NEW39Onyama Limba
1013Stacey MacleadItaly2026-05-13Truhlar And Truhlar Attys NEW44Ioni Bowcher
1014Silvio SlusarskiRussia2026-05-13Buckley Miller Wright NEW87Xuxue Feng
1015Jones VocelkaCanada2026-04-24Benton, John B Jr RENEWAL72Amy Elsner
1016Jefferson SchemmerAustralia2026-05-10Morlong Associates NEGOTIATION61Amy Elsner
1017Chavez BriddickSpain2026-05-11Morlong Associates NEW86Stephen Shaw
1018Rodrigues CampainBrazil2026-04-18Feltz Printing Service QUALIFIED24Onyama Limba
1019Leja CaldareraRussia2026-05-01Chanay, Jeffrey A Esq PROPOSAL48Bernardo Dominic
1020Tony FollerAustralia2026-04-14Benton, John B Jr NEW74Amy Elsner
1021Misaki RoysterCanada2026-04-25Dorl, James J Esq PROPOSAL37Elwin Sharvill
1022Ivar PaprockiSpain2026-04-28Chemel, James L Cpa NEGOTIATION51Stephen Shaw
1023Aruna FigeroaUnited Kingdom2026-05-02Truhlar And Truhlar Attys PROPOSAL86Amy Elsner
1024Octavia MaletItaly2026-05-04King, Christopher A Esq QUALIFIED6Elwin Sharvill
1025Jennifer AmigonItaly2026-05-10Morlong Associates RENEWAL29Stephen Shaw
1026Alejandro PerinBrazil2026-04-20Truhlar And Truhlar Attys RENEWAL47Ivan Magalhaes
1027Stacey MacleadUnited Kingdom2026-05-12Benton, John B Jr RENEWAL25Bernardo Dominic
1028Ricardo GauchoArgentina2026-04-22Printing Dimensions NEGOTIATION87Ioni Bowcher
1029Mayumi KolmetzArgentina2026-04-15Chemel, James L Cpa NEW10Ioni Bowcher
1030Francesco ShinkoFrance2026-05-06Feiner Bros PROPOSAL48Onyama Limba
1031Tony FollerSpain2026-04-21Chapman, Ross E Esq QUALIFIED59Anna Fali
1032Isabel BowleyUnited Kingdom2026-05-03Chemel, James L Cpa QUALIFIED0Elwin Sharvill
1033Jones VocelkaGermany2026-05-06Benton, John B Jr PROPOSAL85Asiya Javayant
1034Salvatore StockhamBrazil2026-05-02Truhlar And Truhlar Attys UNQUALIFIED75Onyama Limba
1035Adams MorascaAustralia2026-04-27Morlong Associates NEW96Ivan Magalhaes
1036Leja CaldareraCanada2026-04-21Rangoni Of Florence NEGOTIATION95Xuxue Feng
1037Mayumi KolmetzIndia2026-04-27King, Christopher A Esq QUALIFIED62Elwin Sharvill
1038Rodrigues CampainGermany2026-04-15Benton, John B Jr UNQUALIFIED61Anna Fali
1039Faith GillianSpain2026-05-03Chanay, Jeffrey A Esq RENEWAL10Ioni Bowcher
1040Nicolas IturbideFrance2026-05-13Feiner Bros NEGOTIATION79Onyama Limba
1041Aditya KuskoGermany2026-04-20Chanay, Jeffrey A Esq NEW68Bernardo Dominic
1042Jennifer AmigonJapan2026-04-25Rousseaux, Michael Esq RENEWAL93Bernardo Dominic
1043Nicolas IturbideFrance2026-04-20Printing Dimensions NEW4Asiya Javayant
1044Mayumi KolmetzJapan2026-04-22Chemel, James L Cpa RENEWAL58Ivan Magalhaes
1045Antonio CaudyIndia2026-05-11Morlong Associates PROPOSAL78Bernardo Dominic
1046Ivar PaprockiFrance2026-05-11King, Christopher A Esq NEW62Stephen Shaw
1047Rodrigues CampainCanada2026-05-10Benton, John B Jr PROPOSAL8Ioni Bowcher
1048Morrow RutaArgentina2026-04-18Benton, John B Jr PROPOSAL27Ioni Bowcher
1049Octavia MaletSpain2026-04-28Morlong Associates NEW31Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Julie StensethSpainOnyama Limba QUALIFIED
Kadeem FlosiSpainBernardo Dominic QUALIFIED
Clifford RimBrazilXuxue Feng RENEWAL
Smith GlickJapanStephen Shaw UNQUALIFIED
David DarakjyCanadaAmy Elsner QUALIFIED
Antonio CaudyRussiaIvan Magalhaes RENEWAL
Alejandro PerinArgentinaIoni Bowcher NEW
Salvatore StockhamJapanIvan Magalhaes NEGOTIATION
Leon OldroydIndiaStephen Shaw RENEWAL
Emily WhobreyAustraliaAmy Elsner RENEWAL
Clifford RimUnited KingdomAnna Fali NEW
Izzy GarufiRussiaIoni Bowcher UNQUALIFIED
Izzy GarufiFranceAnna Fali NEW
Aditya KuskoItalyElwin Sharvill NEGOTIATION
Jennifer AmigonIndiaAmy Elsner RENEWAL
Greenwood BologniaArgentinaBernardo Dominic NEW
Julie StensethJapanAnna Fali PROPOSAL
Octavia MaletGermanyIvan Magalhaes NEGOTIATION
Nicolas IturbideAustraliaAnna Fali QUALIFIED
Alejandro PerinIndiaAsiya Javayant PROPOSAL
Adams MorascaSpainElwin Sharvill NEGOTIATION
Munro FerenczSpainElwin Sharvill NEGOTIATION
Aditya KuskoJapanElwin Sharvill UNQUALIFIED
Aditya KuskoSpainIoni Bowcher PROPOSAL
Tony FollerJapanOnyama Limba RENEWAL
Mayumi KolmetzRussiaElwin Sharvill QUALIFIED
Morrow RutaCanadaStephen Shaw UNQUALIFIED
Sinclair WaycottItalyAmy Elsner PROPOSAL
Ricardo GauchoFranceOnyama Limba PROPOSAL
Alejandro PerinFranceAnna Fali NEW
Murillo MaletFranceIvan Magalhaes RENEWAL
Izzy GarufiRussiaIvan Magalhaes UNQUALIFIED
Aika InouyeItalyIvan Magalhaes NEGOTIATION
Julie StensethUnited KingdomBernardo Dominic UNQUALIFIED
Arvin AlbaresFranceAnna Fali PROPOSAL
Maria MarrierFranceAsiya Javayant NEW
Wickens NestleArgentinaAsiya Javayant UNQUALIFIED
Emily WhobreyIndiaStephen Shaw UNQUALIFIED
Jennifer AmigonRussiaIvan Magalhaes RENEWAL
Arvin AlbaresItalyOnyama Limba RENEWAL
James ButtSpainStephen Shaw QUALIFIED
Morrow RutaGermanyAnna Fali QUALIFIED
Sinclair WaycottItalyAnna Fali PROPOSAL
Aruna FigeroaAustraliaElwin Sharvill RENEWAL
Kaitlin OstroskyBrazilBernardo Dominic PROPOSAL
Arvin AlbaresRussiaBernardo Dominic NEGOTIATION
Rodrigues CampainCanadaStephen Shaw RENEWAL
Juan WieserAustraliaIoni Bowcher QUALIFIED
Greenwood BologniaIndiaOnyama Limba NEW
Maisha RulapaughGermanyAmy Elsner QUALIFIED
Frozen Columns
Name
Wickens Nestle
Octavia Malet
Deepesh Chui
Salvatore Stockham
Aika Inouye
Munro Ferencz
Isabel Bowley
Munro Ferencz
Misaki Royster
Izzy Garufi
Maria Marrier
Darci Poquette
Maisha Rulapaugh
Maisha Rulapaugh
James Butt
Tony Foller
Emily Whobrey
Mujtaba Nicka
Deepesh Chui
Ivar Paprocki
Jennifer Amigon
Aika Inouye
Clifford Rim
Jones Vocelka
Aika Inouye
Leon Oldroyd
Costa Dilliard
Aditya Kusko
Stacey Maclead
Francesco Shinko
Morrow Ruta
Deepesh Chui
Silvio Slusarski
Morrow Ruta
Leon Oldroyd
Stacey Maclead
Jeanfrancois Venere
Cody Saylors
Morrow Ruta
Leon Oldroyd
Kadeem Flosi
Aruna Figeroa
Mayumi Kolmetz
Antonio Caudy
James Butt
Aditya Kusko
Jones Vocelka
Aditya Kusko
Octavia Malet
Isabel Bowley
IdCountryDate
1000Brazil2026-04-27
1001Australia2026-05-13
1002Australia2026-05-10
1003France2026-04-15
1004Argentina2026-04-30
1005Italy2026-05-01
1006France2026-04-18
1007Italy2026-04-24
1008Germany2026-04-25
1009United Kingdom2026-05-01
1010Australia2026-05-02
1011France2026-05-11
1012Canada2026-04-18
1013Spain2026-05-01
1014Brazil2026-05-12
1015Italy2026-04-26
1016Australia2026-04-20
1017Russia2026-04-16
1018France2026-04-25
1019Brazil2026-05-07
1020Spain2026-05-08
1021Russia2026-05-06
1022Argentina2026-04-17
1023Germany2026-05-09
1024India2026-05-09
1025Canada2026-04-19
1026Brazil2026-04-30
1027United Kingdom2026-05-08
1028Japan2026-04-22
1029United Kingdom2026-05-11
1030Japan2026-04-19
1031Canada2026-04-21
1032Germany2026-05-09
1033Brazil2026-04-30
1034Brazil2026-05-10
1035Australia2026-05-03
1036France2026-04-28
1037Australia2026-04-30
1038Germany2026-04-27
1039Japan2026-05-06
1040India2026-04-17
1041Canada2026-05-11
1042United Kingdom2026-05-13
1043Australia2026-04-22
1044United Kingdom2026-04-26
1045Germany2026-05-05
1046Canada2026-04-26
1047Australia2026-05-11
1048Brazil2026-05-05
1049Russia2026-04-21

On-Demand Data

NameIdCountryDate
Aruna Figeroa1000Australia2026-05-08
Antonio Caudy1001Canada2026-04-18
James Butt1002Brazil2026-04-25
Nicolas Iturbide1003Japan2026-04-29
Julie Stenseth1004United Kingdom2026-05-10
Wickens Nestle1005Canada2026-05-07
James Butt1006United Kingdom2026-05-02
Juan Wieser1007Brazil2026-05-08
Greenwood Bolognia1008Germany2026-04-19
Tony Foller1009Italy2026-04-30
Emily Whobrey1010Canada2026-04-22
Mayumi Kolmetz1011Canada2026-05-05
Kadeem Flosi1012Spain2026-04-18
Murillo Malet1013India2026-05-02
Emily Whobrey1014France2026-04-26
Jeanfrancois Venere1015France2026-04-17
Jefferson Schemmer1016Australia2026-04-18
Morrow Ruta1017Australia2026-04-23
Maisha Rulapaugh1018United Kingdom2026-05-03
Aika Inouye1019Germany2026-04-21
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Kaitlin OstroskyFranceAnna Fali UNQUALIFIED
Silvio SlusarskiJapanIvan Magalhaes NEGOTIATION
Greenwood BologniaJapanAmy Elsner NEW
Emily WhobreyGermanyAmy Elsner NEW
Morrow RutaSpainIvan Magalhaes QUALIFIED
Jeanfrancois VenereIndiaXuxue Feng NEGOTIATION
Cody SaylorsGermanyIvan Magalhaes RENEWAL
Kadeem FlosiIndiaAnna Fali NEGOTIATION
Arvin AlbaresIndiaAnna Fali QUALIFIED
Greenwood BologniaFranceElwin Sharvill NEW
Jennifer AmigonAustraliaAnna Fali UNQUALIFIED
Emily WhobreyCanadaBernardo Dominic NEW
Arvin AlbaresIndiaAmy Elsner UNQUALIFIED
Juan WieserJapanAsiya Javayant UNQUALIFIED
Antonio CaudyIndiaXuxue Feng RENEWAL
Chavez BriddickGermanyIoni Bowcher QUALIFIED
Misaki RoysterAustraliaAmy Elsner RENEWAL
Stacey MacleadFranceStephen Shaw NEW
Arvin AlbaresFranceAnna Fali QUALIFIED
Chavez BriddickIndiaOnyama Limba QUALIFIED
Salvatore StockhamFranceAsiya Javayant RENEWAL
Silvio SlusarskiGermanyAsiya Javayant PROPOSAL
Jones VocelkaItalyAmy Elsner NEW
Nicolas IturbideBrazilAnna Fali NEGOTIATION
Johnson SergiItalyOnyama Limba RENEWAL
Salvatore StockhamJapanXuxue Feng RENEWAL
Tony FollerArgentinaIvan Magalhaes RENEWAL
Aruna FigeroaArgentinaXuxue Feng PROPOSAL
David DarakjyGermanyBernardo Dominic NEGOTIATION
Darci PoquetteAustraliaAnna Fali PROPOSAL
Maria MarrierCanadaIoni Bowcher RENEWAL
Chavez BriddickAustraliaAmy Elsner RENEWAL
Kaitlin OstroskyJapanBernardo Dominic NEW
Stacey MacleadBrazilStephen Shaw UNQUALIFIED
Claire TollnerCanadaStephen Shaw UNQUALIFIED
Ricardo GauchoJapanBernardo Dominic UNQUALIFIED
Ashley DoeFranceAsiya Javayant NEW
Ashley DoeGermanyStephen Shaw UNQUALIFIED
Ashley DoeIndiaAmy Elsner PROPOSAL
Kaitlin OstroskySpainOnyama Limba NEW

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