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
Jones VocelkaCanadaBernardo Dominic RENEWAL
Tony FollerSpainOnyama Limba PROPOSAL
Greenwood BologniaJapanBernardo Dominic NEW
Emily WhobreyGermanyIvan Magalhaes PROPOSAL
Leon OldroydJapanIoni Bowcher NEGOTIATION
Jennifer AmigonSpainOnyama Limba NEW
Misaki RoysterRussiaAsiya Javayant NEW
Murillo MaletFranceAnna Fali NEW
Rodrigues CampainAustraliaAmy Elsner PROPOSAL
Octavia MaletRussiaIoni Bowcher NEGOTIATION
Clifford RimJapanBernardo Dominic PROPOSAL
Claire TollnerRussiaElwin Sharvill NEGOTIATION
Misaki RoysterBrazilIvan Magalhaes PROPOSAL
Chavez BriddickBrazilBernardo Dominic UNQUALIFIED
Isabel BowleyBrazilXuxue Feng UNQUALIFIED
Adams MorascaUnited KingdomOnyama Limba UNQUALIFIED
Misaki RoysterIndiaBernardo Dominic NEGOTIATION
James ButtSpainStephen Shaw UNQUALIFIED
Francesco ShinkoSpainOnyama Limba RENEWAL
Faith GillianJapanElwin Sharvill UNQUALIFIED
Deepesh ChuiAustraliaIvan Magalhaes NEGOTIATION
Misaki RoysterRussiaAmy Elsner RENEWAL
Arvin AlbaresRussiaXuxue Feng NEGOTIATION
Johnson SergiGermanyElwin Sharvill NEGOTIATION
Rodrigues CampainCanadaAmy Elsner NEGOTIATION
Mayumi KolmetzBrazilIvan Magalhaes PROPOSAL
Claire TollnerItalyAnna Fali NEW
Ivar PaprockiUnited KingdomElwin Sharvill NEW
Jefferson SchemmerBrazilXuxue Feng QUALIFIED
Francesco ShinkoUnited KingdomStephen Shaw RENEWAL
Jones VocelkaUnited KingdomElwin Sharvill QUALIFIED
Adams MorascaFranceAsiya Javayant RENEWAL
Greenwood BologniaUnited KingdomBernardo Dominic NEGOTIATION
Salvatore StockhamFranceBernardo Dominic NEW
Sinclair WaycottFranceOnyama Limba NEGOTIATION
Stacey MacleadAustraliaAmy Elsner PROPOSAL
Maisha RulapaughJapanStephen Shaw NEW
Jones VocelkaArgentinaAmy Elsner NEW
Jennifer AmigonIndiaOnyama Limba NEW
Isabel BowleyJapanOnyama Limba PROPOSAL
Morrow RutaFranceAmy Elsner RENEWAL
David DarakjyCanadaElwin Sharvill UNQUALIFIED
Murillo MaletUnited KingdomAsiya Javayant NEW
Mayumi KolmetzArgentinaBernardo Dominic NEW
Smith GlickJapanIvan Magalhaes UNQUALIFIED
Faith GillianAustraliaXuxue Feng RENEWAL
Ricardo GauchoIndiaBernardo Dominic QUALIFIED
Jones VocelkaJapanAnna Fali NEGOTIATION
Ivar PaprockiItalyIoni Bowcher RENEWAL
Silvio SlusarskiUnited KingdomIoni Bowcher NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Maisha RulapaughRussiaAnna Fali PROPOSAL
Maria MarrierRussiaElwin Sharvill PROPOSAL
Adams MorascaSpainOnyama Limba RENEWAL
Silvio SlusarskiUnited KingdomBernardo Dominic RENEWAL
Ivar PaprockiFranceStephen Shaw PROPOSAL
Jefferson SchemmerBrazilAnna Fali UNQUALIFIED
Wickens NestleUnited KingdomIvan Magalhaes UNQUALIFIED
Ivar PaprockiAustraliaBernardo Dominic RENEWAL
Munro FerenczCanadaOnyama Limba NEW
Claire TollnerBrazilAmy Elsner UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Tony FollerRussia2026-04-09Rangoni Of Florence QUALIFIED87Asiya Javayant
1001Emily WhobreyJapan2026-03-31Morlong Associates UNQUALIFIED15Stephen Shaw
1002Francesco ShinkoIndia2026-04-02Buckley Miller Wright NEW65Stephen Shaw
1003Francesco ShinkoAustralia2026-04-02Morlong Associates RENEWAL28Elwin Sharvill
1004Francesco ShinkoBrazil2026-04-09Dorl, James J Esq RENEWAL99Anna Fali
1005Isabel BowleySpain2026-04-05Benton, John B Jr QUALIFIED0Anna Fali
1006Izzy GarufiJapan2026-04-11Rangoni Of Florence RENEWAL12Ivan Magalhaes
1007Chavez BriddickFrance2026-04-19Chemel, James L Cpa UNQUALIFIED21Ivan Magalhaes
1008Maisha RulapaughBrazil2026-04-07Commercial Press PROPOSAL5Anna Fali
1009Mujtaba NickaItaly2026-04-24Truhlar And Truhlar Attys PROPOSAL52Ivan Magalhaes
1010Aruna FigeroaSpain2026-04-25Chemel, James L Cpa NEGOTIATION94Asiya Javayant
1011Emily WhobreyGermany2026-04-10Morlong Associates NEW35Ioni Bowcher
1012Ricardo GauchoIndia2026-04-09Benton, John B Jr UNQUALIFIED64Amy Elsner
1013Leon OldroydAustralia2026-04-19King, Christopher A Esq RENEWAL99Amy Elsner
1014Ashley DoeRussia2026-04-02Printing Dimensions PROPOSAL7Ioni Bowcher
1015David DarakjyGermany2026-04-05Commercial Press QUALIFIED49Elwin Sharvill
1016Octavia MaletIndia2026-04-19Truhlar And Truhlar Attys PROPOSAL69Stephen Shaw
1017Munro FerenczSpain2026-04-06Chemel, James L Cpa UNQUALIFIED94Elwin Sharvill
1018Jefferson SchemmerArgentina2026-03-30Chemel, James L Cpa NEW12Ioni Bowcher
1019Mujtaba NickaRussia2026-04-24Morlong Associates UNQUALIFIED34Bernardo Dominic
1020Ivar PaprockiIndia2026-04-26Buckley Miller Wright QUALIFIED41Onyama Limba
1021David DarakjyCanada2026-04-04Feiner Bros UNQUALIFIED62Onyama Limba
1022Aika InouyeIndia2026-04-26Rousseaux, Michael Esq PROPOSAL7Amy Elsner
1023Wickens NestleCanada2026-04-04Benton, John B Jr QUALIFIED24Anna Fali
1024Clifford RimAustralia2026-04-17Dorl, James J Esq QUALIFIED46Stephen Shaw
1025Arvin AlbaresIndia2026-04-12Dorl, James J Esq PROPOSAL58Xuxue Feng
1026James ButtArgentina2026-04-17Chanay, Jeffrey A Esq RENEWAL75Elwin Sharvill
1027Claire TollnerFrance2026-03-28Feltz Printing Service UNQUALIFIED72Bernardo Dominic
1028Jeanfrancois VenereFrance2026-04-26King, Christopher A Esq QUALIFIED76Xuxue Feng
1029Jones VocelkaSpain2026-04-05Commercial Press PROPOSAL35Xuxue Feng
1030Costa DilliardIndia2026-04-04Chanay, Jeffrey A Esq QUALIFIED12Ivan Magalhaes
1031Deepesh ChuiItaly2026-04-19Morlong Associates RENEWAL73Stephen Shaw
1032Munro FerenczItaly2026-04-17Rousseaux, Michael Esq RENEWAL70Ioni Bowcher
1033Silvio SlusarskiGermany2026-03-28Buckley Miller Wright PROPOSAL87Elwin Sharvill
1034Aika InouyeSpain2026-04-18Buckley Miller Wright UNQUALIFIED49Stephen Shaw
1035Ricardo GauchoAustralia2026-04-03Commercial Press NEGOTIATION86Anna Fali
1036Maisha RulapaughFrance2026-04-22Rousseaux, Michael Esq NEGOTIATION38Amy Elsner
1037Wickens NestleGermany2026-04-23Rousseaux, Michael Esq UNQUALIFIED20Xuxue Feng
1038David DarakjyItaly2026-04-24Feltz Printing Service QUALIFIED82Bernardo Dominic
1039Murillo MaletFrance2026-04-14Dorl, James J Esq NEW89Amy Elsner
1040Ricardo GauchoItaly2026-03-31Feltz Printing Service UNQUALIFIED11Bernardo Dominic
1041Faith GillianBrazil2026-04-02Morlong Associates QUALIFIED33Xuxue Feng
1042Morrow RutaArgentina2026-04-11Chemel, James L Cpa UNQUALIFIED7Elwin Sharvill
1043Misaki RoysterAustralia2026-04-26Chemel, James L Cpa UNQUALIFIED58Asiya Javayant
1044Misaki RoysterJapan2026-04-26Benton, John B Jr QUALIFIED46Onyama Limba
1045Salvatore StockhamSpain2026-04-02Feiner Bros NEGOTIATION65Bernardo Dominic
1046Aika InouyeJapan2026-04-24Feiner Bros PROPOSAL30Elwin Sharvill
1047Mujtaba NickaCanada2026-04-13Feltz Printing Service NEGOTIATION54Bernardo Dominic
1048Greenwood BologniaItaly2026-03-29Printing Dimensions UNQUALIFIED18Bernardo Dominic
1049Morrow RutaSpain2026-04-06Chemel, James L Cpa QUALIFIED65Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Salvatore StockhamJapanElwin Sharvill NEW
Jeanfrancois VenereIndiaOnyama Limba NEW
Kaitlin OstroskyFranceElwin Sharvill NEW
Emily WhobreyCanadaStephen Shaw RENEWAL
Aika InouyeUnited KingdomIvan Magalhaes RENEWAL
Munro FerenczRussiaStephen Shaw UNQUALIFIED
David DarakjyFranceAmy Elsner NEW
Misaki RoysterCanadaOnyama Limba RENEWAL
Aika InouyeUnited KingdomIoni Bowcher NEW
Jefferson SchemmerGermanyIoni Bowcher PROPOSAL
Smith GlickItalyStephen Shaw QUALIFIED
Kaitlin OstroskySpainOnyama Limba QUALIFIED
Francesco ShinkoCanadaAmy Elsner UNQUALIFIED
Kadeem FlosiBrazilBernardo Dominic RENEWAL
Kaitlin OstroskyIndiaBernardo Dominic QUALIFIED
Salvatore StockhamIndiaBernardo Dominic NEW
Ashley DoeBrazilIoni Bowcher QUALIFIED
Stacey MacleadArgentinaAnna Fali QUALIFIED
Ivar PaprockiIndiaIoni Bowcher QUALIFIED
Cody SaylorsFranceOnyama Limba RENEWAL
Juan WieserGermanyOnyama Limba PROPOSAL
Emily WhobreyArgentinaIvan Magalhaes RENEWAL
Octavia MaletJapanIvan Magalhaes NEW
Smith GlickUnited KingdomIvan Magalhaes UNQUALIFIED
Aika InouyeRussiaAmy Elsner QUALIFIED
Murillo MaletSpainElwin Sharvill NEGOTIATION
Adams MorascaItalyIvan Magalhaes UNQUALIFIED
Alejandro PerinFranceElwin Sharvill NEGOTIATION
Mayumi KolmetzCanadaElwin Sharvill QUALIFIED
Claire TollnerCanadaOnyama Limba NEGOTIATION
Maisha RulapaughIndiaAsiya Javayant NEGOTIATION
Jeanfrancois VenereSpainAnna Fali QUALIFIED
Ivar PaprockiFranceBernardo Dominic NEGOTIATION
Clifford RimIndiaXuxue Feng NEGOTIATION
Kadeem FlosiJapanAmy Elsner QUALIFIED
Ricardo GauchoSpainIvan Magalhaes RENEWAL
Alejandro PerinFranceOnyama Limba QUALIFIED
Emily WhobreyUnited KingdomAsiya Javayant NEW
Tony FollerJapanAsiya Javayant NEGOTIATION
Leja CaldareraSpainAmy Elsner RENEWAL
Silvio SlusarskiBrazilAnna Fali UNQUALIFIED
Darci PoquetteCanadaBernardo Dominic NEW
Clifford RimCanadaAsiya Javayant QUALIFIED
Alejandro PerinFranceAnna Fali RENEWAL
Clifford RimItalyStephen Shaw UNQUALIFIED
Munro FerenczArgentinaElwin Sharvill QUALIFIED
Johnson SergiRussiaIvan Magalhaes QUALIFIED
David DarakjyArgentinaStephen Shaw QUALIFIED
Clifford RimUnited KingdomIvan Magalhaes RENEWAL
Juan WieserFranceElwin Sharvill NEW
Frozen Columns
Name
Tony Foller
Jones Vocelka
Ricardo Gaucho
Arvin Albares
Silvio Slusarski
Rodrigues Campain
Nicolas Iturbide
Rodrigues Campain
Leon Oldroyd
Francesco Shinko
Octavia Malet
Darci Poquette
Misaki Royster
Aditya Kusko
Ivar Paprocki
Francesco Shinko
Smith Glick
Mujtaba Nicka
Emily Whobrey
Leja Caldarera
Aruna Figeroa
Wickens Nestle
Claire Tollner
Rodrigues Campain
Rodrigues Campain
Jeanfrancois Venere
Jeanfrancois Venere
Aruna Figeroa
Octavia Malet
Maria Marrier
Tony Foller
Sinclair Waycott
Sinclair Waycott
James Butt
Claire Tollner
Claire Tollner
Faith Gillian
Clifford Rim
Adams Morasca
Jennifer Amigon
James Butt
Izzy Garufi
Munro Ferencz
Costa Dilliard
Faith Gillian
Kaitlin Ostrosky
Adams Morasca
Darci Poquette
Maria Marrier
Emily Whobrey
IdCountryDate
1000Australia2026-04-23
1001Spain2026-04-01
1002Argentina2026-04-02
1003Russia2026-04-06
1004Brazil2026-04-03
1005Russia2026-04-23
1006Italy2026-03-30
1007Brazil2026-04-02
1008Japan2026-04-22
1009Germany2026-04-12
1010Germany2026-04-26
1011United Kingdom2026-04-24
1012Argentina2026-04-21
1013United Kingdom2026-04-11
1014Argentina2026-03-30
1015France2026-04-19
1016Brazil2026-04-13
1017Australia2026-04-01
1018Argentina2026-04-15
1019France2026-04-13
1020Italy2026-03-31
1021France2026-04-25
1022Japan2026-04-21
1023France2026-03-30
1024Russia2026-04-16
1025India2026-04-01
1026Spain2026-04-09
1027France2026-04-17
1028Russia2026-04-05
1029France2026-04-06
1030Brazil2026-03-28
1031Canada2026-04-12
1032Australia2026-04-23
1033Argentina2026-04-21
1034Argentina2026-03-29
1035Russia2026-04-22
1036Brazil2026-04-15
1037United Kingdom2026-04-15
1038Australia2026-04-13
1039Brazil2026-03-30
1040India2026-03-29
1041United Kingdom2026-04-03
1042Argentina2026-04-21
1043Japan2026-04-12
1044Japan2026-04-17
1045Canada2026-04-14
1046Canada2026-04-02
1047United Kingdom2026-04-26
1048Argentina2026-04-13
1049Australia2026-04-21

On-Demand Data

NameIdCountryDate
Maria Marrier1000Japan2026-04-10
Morrow Ruta1001Canada2026-04-06
Octavia Malet1002India2026-04-16
Ricardo Gaucho1003Spain2026-04-03
David Darakjy1004India2026-04-08
Munro Ferencz1005Spain2026-04-19
Rodrigues Campain1006Russia2026-03-29
Nicolas Iturbide1007Japan2026-04-07
David Darakjy1008Spain2026-04-10
Johnson Sergi1009Brazil2026-04-12
Ricardo Gaucho1010United Kingdom2026-04-25
Ivar Paprocki1011Australia2026-04-18
Maisha Rulapaugh1012United Kingdom2026-03-30
Faith Gillian1013Brazil2026-04-22
Deepesh Chui1014Argentina2026-04-25
Aika Inouye1015Canada2026-04-23
Alejandro Perin1016India2026-04-16
Wickens Nestle1017Argentina2026-04-09
Emily Whobrey1018Brazil2026-04-05
David Darakjy1019United Kingdom2026-04-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Mayumi KolmetzBrazilBernardo Dominic PROPOSAL
James ButtUnited KingdomAnna Fali QUALIFIED
Cody SaylorsGermanyIvan Magalhaes UNQUALIFIED
Jefferson SchemmerGermanyXuxue Feng NEW
Kaitlin OstroskyGermanyOnyama Limba NEW
Leja CaldareraItalyIvan Magalhaes PROPOSAL
Mujtaba NickaJapanOnyama Limba PROPOSAL
Aditya KuskoUnited KingdomAnna Fali PROPOSAL
Sinclair WaycottGermanyAnna Fali RENEWAL
Greenwood BologniaCanadaBernardo Dominic RENEWAL
Nicolas IturbideSpainAmy Elsner NEGOTIATION
James ButtCanadaXuxue Feng QUALIFIED
Julie StensethCanadaAsiya Javayant QUALIFIED
David DarakjyArgentinaIoni Bowcher PROPOSAL
Smith GlickFranceStephen Shaw PROPOSAL
Nicolas IturbideAustraliaElwin Sharvill QUALIFIED
Francesco ShinkoBrazilIoni Bowcher NEGOTIATION
Jefferson SchemmerCanadaElwin Sharvill RENEWAL
Chavez BriddickUnited KingdomAnna Fali NEW
Munro FerenczIndiaIvan Magalhaes PROPOSAL
James ButtFranceXuxue Feng QUALIFIED
Kaitlin OstroskyJapanIoni Bowcher NEW
Clifford RimAustraliaXuxue Feng NEW
Costa DilliardAustraliaElwin Sharvill PROPOSAL
Maisha RulapaughGermanyAnna Fali RENEWAL
Aika InouyeUnited KingdomAsiya Javayant PROPOSAL
Emily WhobreyAustraliaAnna Fali PROPOSAL
Tony FollerBrazilAsiya Javayant UNQUALIFIED
Julie StensethAustraliaIoni Bowcher QUALIFIED
Rodrigues CampainRussiaAmy Elsner UNQUALIFIED
Costa DilliardBrazilAsiya Javayant NEGOTIATION
Jones VocelkaUnited KingdomOnyama Limba QUALIFIED
Clifford RimSpainIvan Magalhaes QUALIFIED
Jennifer AmigonRussiaIoni Bowcher QUALIFIED
Murillo MaletFranceIvan Magalhaes NEW
Costa DilliardBrazilIvan Magalhaes NEW
Smith GlickArgentinaBernardo Dominic NEGOTIATION
Misaki RoysterArgentinaBernardo Dominic NEW
Jennifer AmigonAustraliaBernardo Dominic PROPOSAL
David DarakjyFranceXuxue Feng 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>