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
Aika InouyeSpainStephen Shaw NEGOTIATION
Alejandro PerinItalyStephen Shaw PROPOSAL
Izzy GarufiAustraliaAnna Fali RENEWAL
Greenwood BologniaBrazilXuxue Feng NEGOTIATION
Juan WieserJapanXuxue Feng RENEWAL
Mujtaba NickaCanadaXuxue Feng PROPOSAL
Silvio SlusarskiBrazilBernardo Dominic QUALIFIED
Munro FerenczRussiaBernardo Dominic RENEWAL
Francesco ShinkoCanadaStephen Shaw UNQUALIFIED
Faith GillianCanadaBernardo Dominic QUALIFIED
Claire TollnerFranceOnyama Limba PROPOSAL
Alejandro PerinAustraliaBernardo Dominic NEGOTIATION
Arvin AlbaresArgentinaIvan Magalhaes QUALIFIED
Alejandro PerinBrazilBernardo Dominic PROPOSAL
Ricardo GauchoSpainAnna Fali NEW
Mujtaba NickaSpainAsiya Javayant RENEWAL
Mujtaba NickaAustraliaElwin Sharvill NEW
Juan WieserAustraliaAsiya Javayant PROPOSAL
Greenwood BologniaBrazilAnna Fali QUALIFIED
Darci PoquetteBrazilElwin Sharvill QUALIFIED
Aruna FigeroaArgentinaElwin Sharvill QUALIFIED
Costa DilliardBrazilXuxue Feng NEW
Sinclair WaycottAustraliaAmy Elsner QUALIFIED
Juan WieserArgentinaAmy Elsner UNQUALIFIED
Ashley DoeJapanIvan Magalhaes NEGOTIATION
Maisha RulapaughUnited KingdomAnna Fali PROPOSAL
Izzy GarufiGermanyElwin Sharvill RENEWAL
Deepesh ChuiAustraliaIvan Magalhaes QUALIFIED
Tony FollerJapanAsiya Javayant NEW
Salvatore StockhamJapanIvan Magalhaes NEW
Jones VocelkaBrazilBernardo Dominic NEGOTIATION
Jennifer AmigonCanadaAmy Elsner UNQUALIFIED
Leja CaldareraCanadaAnna Fali UNQUALIFIED
Misaki RoysterGermanyAsiya Javayant PROPOSAL
Octavia MaletFranceIoni Bowcher RENEWAL
Emily WhobreyCanadaAmy Elsner NEGOTIATION
Kaitlin OstroskyBrazilAmy Elsner QUALIFIED
Ashley DoeSpainStephen Shaw NEW
Nicolas IturbideRussiaAmy Elsner NEGOTIATION
Aika InouyeItalyElwin Sharvill RENEWAL
Ivar PaprockiCanadaElwin Sharvill NEW
Costa DilliardBrazilIoni Bowcher NEGOTIATION
Octavia MaletIndiaIoni Bowcher RENEWAL
David DarakjyGermanyAnna Fali NEGOTIATION
Murillo MaletGermanyOnyama Limba NEW
Claire TollnerAustraliaAsiya Javayant UNQUALIFIED
Alejandro PerinSpainAnna Fali NEW
Maria MarrierGermanyElwin Sharvill UNQUALIFIED
James ButtUnited KingdomIvan Magalhaes UNQUALIFIED
Leja CaldareraCanadaAnna Fali QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Arvin AlbaresSpainStephen Shaw NEW
Sinclair WaycottUnited KingdomAsiya Javayant PROPOSAL
Claire TollnerCanadaAnna Fali NEW
Clifford RimGermanyAnna Fali NEGOTIATION
Tony FollerItalyXuxue Feng PROPOSAL
Jones VocelkaSpainAsiya Javayant UNQUALIFIED
Munro FerenczGermanyXuxue Feng RENEWAL
Salvatore StockhamCanadaElwin Sharvill NEGOTIATION
Jefferson SchemmerItalyIoni Bowcher NEW
David DarakjyBrazilIoni Bowcher NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Leon OldroydJapan2025-10-16Chanay, Jeffrey A Esq PROPOSAL13Ioni Bowcher
1001Sinclair WaycottJapan2025-09-17Truhlar And Truhlar Attys PROPOSAL56Onyama Limba
1002James ButtArgentina2025-09-21Commercial Press QUALIFIED57Bernardo Dominic
1003Munro FerenczIndia2025-10-10Buckley Miller Wright RENEWAL57Asiya Javayant
1004Aditya KuskoSpain2025-09-30Truhlar And Truhlar Attys NEGOTIATION96Xuxue Feng
1005Misaki RoysterUnited Kingdom2025-10-14Chapman, Ross E Esq PROPOSAL9Onyama Limba
1006Francesco ShinkoCanada2025-10-10Feiner Bros QUALIFIED13Asiya Javayant
1007Adams MorascaSpain2025-09-27Feiner Bros NEGOTIATION86Anna Fali
1008Tony FollerJapan2025-10-02Chemel, James L Cpa NEW79Xuxue Feng
1009Ashley DoeItaly2025-10-03Chapman, Ross E Esq NEW69Ivan Magalhaes
1010Emily WhobreyAustralia2025-09-21Buckley Miller Wright UNQUALIFIED94Elwin Sharvill
1011Kadeem FlosiIndia2025-09-19Chapman, Ross E Esq UNQUALIFIED26Asiya Javayant
1012Cody SaylorsAustralia2025-10-14Rangoni Of Florence QUALIFIED9Ivan Magalhaes
1013Kaitlin OstroskyFrance2025-09-20Dorl, James J Esq NEW3Elwin Sharvill
1014Kaitlin OstroskyItaly2025-09-21Truhlar And Truhlar Attys NEW11Asiya Javayant
1015Arvin AlbaresGermany2025-10-03Chanay, Jeffrey A Esq PROPOSAL44Bernardo Dominic
1016Morrow RutaAustralia2025-10-10Buckley Miller Wright QUALIFIED12Asiya Javayant
1017Murillo MaletRussia2025-10-10Morlong Associates NEW46Ivan Magalhaes
1018Julie StensethBrazil2025-09-22Feltz Printing Service PROPOSAL37Asiya Javayant
1019Alejandro PerinFrance2025-09-24Chemel, James L Cpa PROPOSAL91Ioni Bowcher
1020Jefferson SchemmerJapan2025-10-09Chemel, James L Cpa QUALIFIED22Ivan Magalhaes
1021David DarakjyUnited Kingdom2025-10-09Truhlar And Truhlar Attys PROPOSAL49Elwin Sharvill
1022James ButtAustralia2025-10-07Benton, John B Jr QUALIFIED62Elwin Sharvill
1023Darci PoquetteIndia2025-09-18Truhlar And Truhlar Attys RENEWAL9Xuxue Feng
1024Johnson SergiArgentina2025-09-25Chanay, Jeffrey A Esq NEW72Stephen Shaw
1025Faith GillianUnited Kingdom2025-10-03Commercial Press NEGOTIATION76Asiya Javayant
1026Ricardo GauchoIndia2025-10-02King, Christopher A Esq NEGOTIATION44Stephen Shaw
1027Julie StensethCanada2025-10-08Printing Dimensions QUALIFIED6Amy Elsner
1028Smith GlickIndia2025-10-04King, Christopher A Esq NEGOTIATION17Bernardo Dominic
1029Tony FollerGermany2025-10-01Feiner Bros PROPOSAL50Bernardo Dominic
1030Morrow RutaSpain2025-09-24Rangoni Of Florence NEW67Elwin Sharvill
1031Tony FollerIndia2025-10-13Truhlar And Truhlar Attys PROPOSAL78Ivan Magalhaes
1032Kadeem FlosiFrance2025-10-09Chapman, Ross E Esq NEW22Ivan Magalhaes
1033Octavia MaletRussia2025-10-16Feltz Printing Service UNQUALIFIED20Asiya Javayant
1034Darci PoquetteBrazil2025-09-20Chapman, Ross E Esq NEGOTIATION75Onyama Limba
1035Leja CaldareraAustralia2025-10-02Rousseaux, Michael Esq RENEWAL68Ivan Magalhaes
1036Jennifer AmigonIndia2025-10-06King, Christopher A Esq NEW17Amy Elsner
1037Antonio CaudyCanada2025-09-17King, Christopher A Esq PROPOSAL17Elwin Sharvill
1038Ivar PaprockiRussia2025-09-24Truhlar And Truhlar Attys RENEWAL78Bernardo Dominic
1039Clifford RimBrazil2025-09-26Buckley Miller Wright RENEWAL66Ioni Bowcher
1040Jefferson SchemmerUnited Kingdom2025-10-01Feiner Bros RENEWAL10Ivan Magalhaes
1041Aruna FigeroaBrazil2025-10-06Dorl, James J Esq RENEWAL21Bernardo Dominic
1042Octavia MaletJapan2025-10-14Rangoni Of Florence NEGOTIATION13Anna Fali
1043Mujtaba NickaRussia2025-10-05Buckley Miller Wright NEGOTIATION94Bernardo Dominic
1044Morrow RutaGermany2025-10-07Rangoni Of Florence PROPOSAL90Xuxue Feng
1045Wickens NestleRussia2025-10-05Chemel, James L Cpa RENEWAL92Bernardo Dominic
1046Mujtaba NickaGermany2025-10-04Chapman, Ross E Esq NEW32Stephen Shaw
1047Ivar PaprockiItaly2025-10-09Feiner Bros NEW39Onyama Limba
1048Izzy GarufiGermany2025-10-07Printing Dimensions NEW12Bernardo Dominic
1049Darci PoquetteJapan2025-10-03Printing Dimensions PROPOSAL67Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Misaki RoysterGermanyXuxue Feng UNQUALIFIED
Maria MarrierRussiaIoni Bowcher RENEWAL
Isabel BowleyCanadaAsiya Javayant NEGOTIATION
Alejandro PerinUnited KingdomIoni Bowcher QUALIFIED
Smith GlickItalyAsiya Javayant QUALIFIED
Munro FerenczIndiaElwin Sharvill RENEWAL
James ButtSpainOnyama Limba PROPOSAL
Ashley DoeAustraliaOnyama Limba QUALIFIED
Leja CaldareraAustraliaIoni Bowcher NEW
Izzy GarufiJapanStephen Shaw PROPOSAL
Leon OldroydSpainIoni Bowcher QUALIFIED
Deepesh ChuiArgentinaElwin Sharvill QUALIFIED
Leja CaldareraUnited KingdomElwin Sharvill UNQUALIFIED
Aditya KuskoJapanIvan Magalhaes NEW
Juan WieserSpainAmy Elsner QUALIFIED
Kaitlin OstroskyGermanyBernardo Dominic RENEWAL
Nicolas IturbideAustraliaStephen Shaw QUALIFIED
Jennifer AmigonCanadaIoni Bowcher NEGOTIATION
Kadeem FlosiBrazilAnna Fali QUALIFIED
Maria MarrierIndiaOnyama Limba NEGOTIATION
Faith GillianGermanyAsiya Javayant NEGOTIATION
Alejandro PerinGermanyOnyama Limba RENEWAL
Jones VocelkaArgentinaAsiya Javayant RENEWAL
Smith GlickArgentinaAsiya Javayant QUALIFIED
David DarakjyItalyOnyama Limba NEW
Maria MarrierSpainBernardo Dominic QUALIFIED
Leon OldroydRussiaXuxue Feng PROPOSAL
Clifford RimArgentinaBernardo Dominic QUALIFIED
Chavez BriddickSpainBernardo Dominic PROPOSAL
Adams MorascaBrazilAmy Elsner NEGOTIATION
Jeanfrancois VenereSpainAnna Fali NEW
Stacey MacleadItalyIvan Magalhaes PROPOSAL
Nicolas IturbideIndiaStephen Shaw NEW
James ButtCanadaAsiya Javayant RENEWAL
Murillo MaletRussiaAsiya Javayant PROPOSAL
Stacey MacleadIndiaIvan Magalhaes PROPOSAL
Misaki RoysterIndiaStephen Shaw RENEWAL
Emily WhobreyFranceBernardo Dominic PROPOSAL
Francesco ShinkoJapanIoni Bowcher NEGOTIATION
Ivar PaprockiJapanOnyama Limba RENEWAL
Chavez BriddickItalyIvan Magalhaes QUALIFIED
Munro FerenczItalyAsiya Javayant RENEWAL
Faith GillianArgentinaOnyama Limba QUALIFIED
Adams MorascaSpainElwin Sharvill UNQUALIFIED
Morrow RutaIndiaXuxue Feng UNQUALIFIED
Wickens NestleBrazilBernardo Dominic NEGOTIATION
Costa DilliardAustraliaAsiya Javayant PROPOSAL
Jefferson SchemmerSpainIoni Bowcher RENEWAL
Isabel BowleyUnited KingdomXuxue Feng RENEWAL
Ivar PaprockiItalyAnna Fali NEW
Frozen Columns
Name
Maria Marrier
Morrow Ruta
Rodrigues Campain
Isabel Bowley
Ashley Doe
Tony Foller
Arvin Albares
Leon Oldroyd
Aruna Figeroa
Alejandro Perin
Maria Marrier
Julie Stenseth
Murillo Malet
Morrow Ruta
Julie Stenseth
Aruna Figeroa
Maisha Rulapaugh
Silvio Slusarski
Ashley Doe
Jeanfrancois Venere
Jennifer Amigon
Murillo Malet
Sinclair Waycott
Emily Whobrey
Ashley Doe
David Darakjy
Costa Dilliard
Munro Ferencz
Antonio Caudy
Arvin Albares
Octavia Malet
Tony Foller
Izzy Garufi
Salvatore Stockham
Ashley Doe
Ricardo Gaucho
Ashley Doe
Morrow Ruta
Deepesh Chui
Izzy Garufi
Jeanfrancois Venere
Costa Dilliard
Mayumi Kolmetz
Ricardo Gaucho
Ivar Paprocki
Costa Dilliard
David Darakjy
Faith Gillian
Isabel Bowley
Leon Oldroyd
IdCountryDate
1000Brazil2025-10-13
1001Germany2025-10-10
1002Argentina2025-10-07
1003Russia2025-10-13
1004India2025-10-13
1005Argentina2025-10-01
1006France2025-10-16
1007Brazil2025-10-11
1008France2025-10-15
1009Italy2025-10-06
1010Brazil2025-09-19
1011Germany2025-10-08
1012Spain2025-09-18
1013Spain2025-10-06
1014United Kingdom2025-10-09
1015Canada2025-09-26
1016Canada2025-10-06
1017France2025-09-20
1018India2025-10-10
1019Italy2025-10-10
1020Russia2025-09-23
1021United Kingdom2025-10-10
1022Australia2025-10-15
1023India2025-10-02
1024United Kingdom2025-09-28
1025Brazil2025-09-24
1026Italy2025-10-09
1027Canada2025-10-16
1028Russia2025-09-19
1029Germany2025-10-07
1030India2025-09-25
1031India2025-10-15
1032Argentina2025-09-24
1033Germany2025-09-19
1034Russia2025-09-30
1035Brazil2025-10-16
1036Italy2025-10-08
1037Russia2025-09-28
1038United Kingdom2025-09-17
1039Argentina2025-10-03
1040Italy2025-10-03
1041Australia2025-09-25
1042Italy2025-09-19
1043Germany2025-09-20
1044Brazil2025-09-26
1045India2025-10-04
1046Australia2025-09-28
1047Japan2025-09-25
1048Japan2025-09-20
1049Australia2025-10-03

On-Demand Data

NameIdCountryDate
Aika Inouye1000United Kingdom2025-10-09
Antonio Caudy1001United Kingdom2025-10-05
Stacey Maclead1002Germany2025-09-17
Maisha Rulapaugh1003Russia2025-09-21
James Butt1004Russia2025-10-12
Misaki Royster1005Canada2025-10-01
Kadeem Flosi1006Japan2025-10-07
Arvin Albares1007India2025-10-15
Leja Caldarera1008Canada2025-10-12
Cody Saylors1009Japan2025-10-07
Ricardo Gaucho1010United Kingdom2025-10-13
Aruna Figeroa1011Spain2025-10-03
Clifford Rim1012United Kingdom2025-10-07
Wickens Nestle1013Canada2025-09-23
Leja Caldarera1014India2025-10-04
Smith Glick1015India2025-09-21
Johnson Sergi1016Argentina2025-10-10
Leon Oldroyd1017United Kingdom2025-10-10
Jefferson Schemmer1018United Kingdom2025-10-11
Smith Glick1019Spain2025-09-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Johnson SergiBrazilStephen Shaw QUALIFIED
Mujtaba NickaSpainAmy Elsner UNQUALIFIED
Chavez BriddickFranceOnyama Limba UNQUALIFIED
Deepesh ChuiUnited KingdomBernardo Dominic NEW
Claire TollnerJapanStephen Shaw RENEWAL
Clifford RimArgentinaIvan Magalhaes RENEWAL
Chavez BriddickSpainOnyama Limba UNQUALIFIED
Clifford RimJapanAmy Elsner NEGOTIATION
Aika InouyeIndiaOnyama Limba NEGOTIATION
Salvatore StockhamUnited KingdomIoni Bowcher NEW
Ricardo GauchoSpainIvan Magalhaes PROPOSAL
Jeanfrancois VenereGermanyIoni Bowcher QUALIFIED
Faith GillianRussiaXuxue Feng QUALIFIED
James ButtSpainIvan Magalhaes NEW
Leja CaldareraItalyIvan Magalhaes PROPOSAL
Rodrigues CampainBrazilAsiya Javayant NEGOTIATION
Alejandro PerinCanadaAsiya Javayant NEGOTIATION
James ButtArgentinaIoni Bowcher QUALIFIED
Misaki RoysterCanadaBernardo Dominic NEGOTIATION
Francesco ShinkoFranceXuxue Feng RENEWAL
Emily WhobreyIndiaXuxue Feng NEGOTIATION
Ashley DoeIndiaAsiya Javayant QUALIFIED
Jeanfrancois VenereCanadaAsiya Javayant QUALIFIED
Johnson SergiCanadaElwin Sharvill QUALIFIED
Murillo MaletJapanAmy Elsner QUALIFIED
Johnson SergiCanadaAsiya Javayant QUALIFIED
David DarakjyAustraliaIvan Magalhaes QUALIFIED
Kaitlin OstroskyCanadaStephen Shaw NEGOTIATION
Maisha RulapaughItalyAmy Elsner RENEWAL
Julie StensethJapanXuxue Feng QUALIFIED
Mujtaba NickaFranceIoni Bowcher QUALIFIED
Silvio SlusarskiJapanAsiya Javayant UNQUALIFIED
Murillo MaletFranceXuxue Feng NEW
Francesco ShinkoSpainIvan Magalhaes NEGOTIATION
Clifford RimJapanAmy Elsner QUALIFIED
Jennifer AmigonCanadaBernardo Dominic RENEWAL
Maisha RulapaughSpainBernardo Dominic RENEWAL
Claire TollnerIndiaOnyama Limba RENEWAL
Aika InouyeAustraliaAsiya Javayant PROPOSAL
Alejandro PerinFranceBernardo Dominic NEGOTIATION

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