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
Leon OldroydAustraliaStephen Shaw PROPOSAL
Silvio SlusarskiFranceIoni Bowcher NEGOTIATION
Adams MorascaSpainStephen Shaw NEGOTIATION
Aditya KuskoCanadaXuxue Feng PROPOSAL
Emily WhobreyCanadaXuxue Feng PROPOSAL
Aditya KuskoSpainStephen Shaw NEW
Salvatore StockhamItalyElwin Sharvill RENEWAL
Jefferson SchemmerRussiaBernardo Dominic NEW
Julie StensethGermanyBernardo Dominic QUALIFIED
Jones VocelkaCanadaIoni Bowcher PROPOSAL
Aika InouyeJapanXuxue Feng PROPOSAL
Jefferson SchemmerArgentinaAmy Elsner NEW
Deepesh ChuiCanadaOnyama Limba NEGOTIATION
Mujtaba NickaSpainXuxue Feng RENEWAL
Kaitlin OstroskyFranceIvan Magalhaes NEGOTIATION
David DarakjyArgentinaElwin Sharvill NEGOTIATION
Aruna FigeroaGermanyOnyama Limba NEW
Arvin AlbaresArgentinaBernardo Dominic RENEWAL
Clifford RimBrazilAsiya Javayant QUALIFIED
Claire TollnerCanadaAsiya Javayant UNQUALIFIED
Deepesh ChuiUnited KingdomAsiya Javayant NEW
Jefferson SchemmerRussiaAmy Elsner RENEWAL
Jefferson SchemmerIndiaIvan Magalhaes NEW
Clifford RimBrazilAnna Fali RENEWAL
Salvatore StockhamIndiaXuxue Feng NEGOTIATION
Francesco ShinkoBrazilBernardo Dominic RENEWAL
Johnson SergiItalyOnyama Limba NEGOTIATION
Darci PoquetteFranceAmy Elsner PROPOSAL
Emily WhobreyUnited KingdomIvan Magalhaes NEW
Jones VocelkaBrazilXuxue Feng RENEWAL
Maisha RulapaughAustraliaIoni Bowcher PROPOSAL
Julie StensethFranceAsiya Javayant NEW
Arvin AlbaresGermanyStephen Shaw NEW
Ricardo GauchoSpainAsiya Javayant NEW
Johnson SergiArgentinaElwin Sharvill NEGOTIATION
Kadeem FlosiJapanStephen Shaw UNQUALIFIED
Ivar PaprockiItalyIvan Magalhaes UNQUALIFIED
Tony FollerCanadaElwin Sharvill UNQUALIFIED
Jefferson SchemmerFranceAnna Fali NEW
Cody SaylorsGermanyOnyama Limba PROPOSAL
Jones VocelkaUnited KingdomXuxue Feng NEGOTIATION
Ashley DoeUnited KingdomXuxue Feng RENEWAL
Sinclair WaycottGermanyXuxue Feng NEGOTIATION
Wickens NestleJapanXuxue Feng NEW
Darci PoquetteIndiaAsiya Javayant NEW
Munro FerenczAustraliaElwin Sharvill UNQUALIFIED
Aruna FigeroaJapanBernardo Dominic PROPOSAL
Kaitlin OstroskyUnited KingdomAnna Fali NEGOTIATION
Julie StensethArgentinaIvan Magalhaes UNQUALIFIED
Maisha RulapaughUnited KingdomIoni Bowcher PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Misaki RoysterIndiaXuxue Feng NEGOTIATION
Ivar PaprockiArgentinaAnna Fali RENEWAL
Maisha RulapaughFranceBernardo Dominic NEGOTIATION
Aditya KuskoUnited KingdomElwin Sharvill NEGOTIATION
Arvin AlbaresFranceIvan Magalhaes NEGOTIATION
Jefferson SchemmerSpainElwin Sharvill NEGOTIATION
Clifford RimUnited KingdomAsiya Javayant UNQUALIFIED
Izzy GarufiUnited KingdomAsiya Javayant RENEWAL
Leja CaldareraUnited KingdomOnyama Limba PROPOSAL
Mujtaba NickaItalyOnyama Limba NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Faith GillianCanada2026-05-01Rangoni Of Florence QUALIFIED37Ioni Bowcher
1001Francesco ShinkoFrance2026-05-08Commercial Press PROPOSAL38Ioni Bowcher
1002Izzy GarufiIndia2026-04-23Buckley Miller Wright PROPOSAL30Anna Fali
1003Jennifer AmigonJapan2026-04-17King, Christopher A Esq NEW10Ioni Bowcher
1004Mayumi KolmetzArgentina2026-05-12King, Christopher A Esq PROPOSAL13Onyama Limba
1005Faith GillianBrazil2026-05-12Commercial Press PROPOSAL15Ivan Magalhaes
1006Deepesh ChuiJapan2026-05-08Feltz Printing Service UNQUALIFIED7Stephen Shaw
1007Wickens NestleCanada2026-05-02Rangoni Of Florence UNQUALIFIED51Bernardo Dominic
1008Kaitlin OstroskyGermany2026-05-04Buckley Miller Wright UNQUALIFIED73Ivan Magalhaes
1009Tony FollerItaly2026-05-08Chanay, Jeffrey A Esq QUALIFIED81Stephen Shaw
1010Isabel BowleySpain2026-05-04Buckley Miller Wright QUALIFIED79Anna Fali
1011Kaitlin OstroskyFrance2026-04-16Feiner Bros NEGOTIATION4Bernardo Dominic
1012Smith GlickAustralia2026-04-16Printing Dimensions UNQUALIFIED29Amy Elsner
1013Ivar PaprockiAustralia2026-04-30King, Christopher A Esq UNQUALIFIED80Amy Elsner
1014Wickens NestleItaly2026-04-26Printing Dimensions PROPOSAL65Ioni Bowcher
1015Deepesh ChuiArgentina2026-04-19Chapman, Ross E Esq NEGOTIATION96Ioni Bowcher
1016Munro FerenczSpain2026-05-11Chemel, James L Cpa QUALIFIED52Onyama Limba
1017Kadeem FlosiGermany2026-04-22Morlong Associates PROPOSAL92Stephen Shaw
1018Stacey MacleadRussia2026-05-06Commercial Press NEGOTIATION90Elwin Sharvill
1019Jefferson SchemmerGermany2026-05-04Feiner Bros NEGOTIATION37Xuxue Feng
1020Faith GillianSpain2026-04-22Commercial Press RENEWAL61Bernardo Dominic
1021Clifford RimFrance2026-04-26Truhlar And Truhlar Attys RENEWAL77Elwin Sharvill
1022Silvio SlusarskiArgentina2026-05-12Rangoni Of Florence UNQUALIFIED93Onyama Limba
1023Munro FerenczGermany2026-04-22Buckley Miller Wright UNQUALIFIED79Bernardo Dominic
1024Murillo MaletIndia2026-05-03Printing Dimensions PROPOSAL55Stephen Shaw
1025Munro FerenczJapan2026-04-15Truhlar And Truhlar Attys QUALIFIED13Ioni Bowcher
1026Jefferson SchemmerIndia2026-04-23Benton, John B Jr NEW96Asiya Javayant
1027Salvatore StockhamCanada2026-05-08Benton, John B Jr QUALIFIED90Asiya Javayant
1028Tony FollerFrance2026-04-26Printing Dimensions RENEWAL2Ivan Magalhaes
1029Aika InouyeBrazil2026-05-04Benton, John B Jr UNQUALIFIED94Ioni Bowcher
1030Deepesh ChuiArgentina2026-04-15Chapman, Ross E Esq PROPOSAL44Amy Elsner
1031Clifford RimIndia2026-04-15Chemel, James L Cpa QUALIFIED1Xuxue Feng
1032Juan WieserArgentina2026-05-08Chapman, Ross E Esq NEW98Xuxue Feng
1033Kadeem FlosiSpain2026-05-06Commercial Press RENEWAL56Bernardo Dominic
1034Jeanfrancois VenereArgentina2026-05-07Buckley Miller Wright QUALIFIED95Onyama Limba
1035Jeanfrancois VenereRussia2026-04-22Feiner Bros NEGOTIATION56Stephen Shaw
1036Aruna FigeroaRussia2026-04-17Chemel, James L Cpa RENEWAL46Onyama Limba
1037Rodrigues CampainItaly2026-05-12Chanay, Jeffrey A Esq PROPOSAL25Asiya Javayant
1038Leja CaldareraJapan2026-05-11Benton, John B Jr QUALIFIED91Ivan Magalhaes
1039Tony FollerRussia2026-04-22Truhlar And Truhlar Attys RENEWAL68Ioni Bowcher
1040Emily WhobreyJapan2026-04-17Morlong Associates QUALIFIED79Bernardo Dominic
1041Deepesh ChuiCanada2026-04-29Morlong Associates RENEWAL29Asiya Javayant
1042Deepesh ChuiFrance2026-05-06Truhlar And Truhlar Attys QUALIFIED92Anna Fali
1043Mujtaba NickaIndia2026-04-25Commercial Press QUALIFIED32Bernardo Dominic
1044Deepesh ChuiGermany2026-04-27Commercial Press PROPOSAL99Amy Elsner
1045Francesco ShinkoFrance2026-04-15Chemel, James L Cpa RENEWAL50Stephen Shaw
1046Costa DilliardBrazil2026-05-12Rangoni Of Florence NEW68Amy Elsner
1047Jefferson SchemmerAustralia2026-04-21Benton, John B Jr QUALIFIED98Amy Elsner
1048Costa DilliardFrance2026-04-20Chanay, Jeffrey A Esq RENEWAL78Asiya Javayant
1049Costa DilliardSpain2026-04-16Feiner Bros NEGOTIATION13Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Adams MorascaSpainBernardo Dominic NEW
Arvin AlbaresArgentinaAnna Fali RENEWAL
Silvio SlusarskiArgentinaIvan Magalhaes UNQUALIFIED
Izzy GarufiUnited KingdomBernardo Dominic NEGOTIATION
Jennifer AmigonAustraliaBernardo Dominic PROPOSAL
James ButtAustraliaStephen Shaw NEGOTIATION
Cody SaylorsCanadaAmy Elsner RENEWAL
Arvin AlbaresItalyStephen Shaw RENEWAL
Leon OldroydAustraliaXuxue Feng UNQUALIFIED
Adams MorascaItalyElwin Sharvill QUALIFIED
Jennifer AmigonSpainOnyama Limba NEW
Wickens NestleIndiaAmy Elsner QUALIFIED
Chavez BriddickGermanyIvan Magalhaes UNQUALIFIED
Claire TollnerCanadaElwin Sharvill RENEWAL
Greenwood BologniaBrazilXuxue Feng PROPOSAL
Kadeem FlosiItalyAmy Elsner RENEWAL
Smith GlickIndiaAnna Fali PROPOSAL
Aika InouyeUnited KingdomAmy Elsner UNQUALIFIED
Munro FerenczJapanAsiya Javayant NEGOTIATION
Smith GlickJapanAnna Fali NEW
David DarakjyGermanyStephen Shaw PROPOSAL
Leon OldroydIndiaAmy Elsner NEW
Chavez BriddickItalyAnna Fali PROPOSAL
Ricardo GauchoJapanIoni Bowcher PROPOSAL
Smith GlickJapanXuxue Feng NEGOTIATION
Aika InouyeIndiaElwin Sharvill NEW
Faith GillianRussiaBernardo Dominic NEGOTIATION
Antonio CaudyFranceAmy Elsner QUALIFIED
Stacey MacleadFranceBernardo Dominic NEW
James ButtFranceAnna Fali NEW
Greenwood BologniaBrazilXuxue Feng RENEWAL
Tony FollerJapanAmy Elsner QUALIFIED
Stacey MacleadJapanBernardo Dominic PROPOSAL
Munro FerenczFranceBernardo Dominic UNQUALIFIED
Mayumi KolmetzItalyAnna Fali QUALIFIED
Ivar PaprockiUnited KingdomXuxue Feng NEW
Kadeem FlosiItalyBernardo Dominic RENEWAL
Munro FerenczSpainOnyama Limba QUALIFIED
Juan WieserBrazilOnyama Limba PROPOSAL
Arvin AlbaresItalyAsiya Javayant NEGOTIATION
Alejandro PerinBrazilOnyama Limba QUALIFIED
Kaitlin OstroskyAustraliaOnyama Limba UNQUALIFIED
Leja CaldareraAustraliaXuxue Feng QUALIFIED
Jefferson SchemmerBrazilAnna Fali QUALIFIED
Adams MorascaIndiaOnyama Limba PROPOSAL
Aika InouyeCanadaAsiya Javayant RENEWAL
Maisha RulapaughCanadaStephen Shaw QUALIFIED
Julie StensethArgentinaElwin Sharvill NEW
Mayumi KolmetzArgentinaAnna Fali PROPOSAL
Silvio SlusarskiAustraliaBernardo Dominic NEGOTIATION
Frozen Columns
Name
Nicolas Iturbide
Jeanfrancois Venere
Claire Tollner
Emily Whobrey
Greenwood Bolognia
Leja Caldarera
Stacey Maclead
Misaki Royster
Izzy Garufi
Izzy Garufi
Misaki Royster
Ricardo Gaucho
Kaitlin Ostrosky
Kadeem Flosi
Mayumi Kolmetz
Julie Stenseth
Darci Poquette
Nicolas Iturbide
Aditya Kusko
Octavia Malet
Darci Poquette
Silvio Slusarski
Silvio Slusarski
Leja Caldarera
Munro Ferencz
Murillo Malet
Juan Wieser
Leon Oldroyd
Claire Tollner
Jennifer Amigon
Jefferson Schemmer
David Darakjy
Johnson Sergi
Silvio Slusarski
Tony Foller
Ivar Paprocki
Alejandro Perin
James Butt
Ricardo Gaucho
Deepesh Chui
Francesco Shinko
Wickens Nestle
Kaitlin Ostrosky
Tony Foller
Isabel Bowley
Maisha Rulapaugh
Juan Wieser
Cody Saylors
Greenwood Bolognia
Salvatore Stockham
IdCountryDate
1000Spain2026-04-14
1001France2026-05-06
1002Russia2026-04-23
1003Russia2026-04-25
1004Japan2026-05-01
1005Russia2026-04-28
1006Russia2026-04-21
1007United Kingdom2026-05-03
1008France2026-05-03
1009Italy2026-04-26
1010Argentina2026-05-06
1011France2026-05-10
1012Italy2026-05-12
1013Australia2026-05-01
1014Italy2026-04-21
1015United Kingdom2026-04-29
1016Argentina2026-04-18
1017Argentina2026-05-10
1018France2026-04-21
1019Germany2026-05-01
1020Japan2026-05-04
1021Russia2026-05-02
1022Brazil2026-04-17
1023France2026-04-21
1024Brazil2026-05-01
1025France2026-04-22
1026Germany2026-04-20
1027France2026-04-22
1028Canada2026-04-26
1029United Kingdom2026-04-23
1030Japan2026-04-14
1031Russia2026-04-27
1032Italy2026-04-22
1033India2026-05-08
1034Australia2026-04-17
1035India2026-05-11
1036India2026-05-10
1037India2026-05-02
1038Argentina2026-04-14
1039Brazil2026-05-06
1040France2026-04-19
1041Italy2026-05-09
1042Germany2026-04-24
1043Japan2026-04-18
1044Japan2026-04-27
1045Italy2026-05-05
1046India2026-04-22
1047Germany2026-04-16
1048United Kingdom2026-04-27
1049India2026-05-08

On-Demand Data

NameIdCountryDate
James Butt1000Argentina2026-04-27
Aika Inouye1001Spain2026-05-04
Julie Stenseth1002United Kingdom2026-04-30
Aruna Figeroa1003Spain2026-04-25
Murillo Malet1004Russia2026-04-15
Izzy Garufi1005United Kingdom2026-04-25
Johnson Sergi1006Germany2026-04-15
Ivar Paprocki1007Canada2026-04-14
Greenwood Bolognia1008United Kingdom2026-04-24
Sinclair Waycott1009United Kingdom2026-04-20
Kaitlin Ostrosky1010Japan2026-04-16
Smith Glick1011France2026-04-14
Cody Saylors1012Brazil2026-04-27
Francesco Shinko1013United Kingdom2026-04-28
Greenwood Bolognia1014Australia2026-05-01
Darci Poquette1015Brazil2026-04-23
Julie Stenseth1016Germany2026-04-25
Deepesh Chui1017Australia2026-05-08
Leon Oldroyd1018Brazil2026-05-01
Maisha Rulapaugh1019Canada2026-05-03
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Alejandro PerinBrazilAsiya Javayant PROPOSAL
Kaitlin OstroskyIndiaOnyama Limba UNQUALIFIED
Sinclair WaycottJapanStephen Shaw NEGOTIATION
Izzy GarufiGermanyXuxue Feng PROPOSAL
Maria MarrierGermanyAmy Elsner UNQUALIFIED
David DarakjyArgentinaIoni Bowcher QUALIFIED
Morrow RutaCanadaAmy Elsner RENEWAL
Stacey MacleadCanadaAmy Elsner NEW
David DarakjyJapanStephen Shaw NEW
James ButtJapanStephen Shaw RENEWAL
James ButtSpainAmy Elsner PROPOSAL
Murillo MaletItalyBernardo Dominic NEW
Kadeem FlosiRussiaAnna Fali PROPOSAL
Silvio SlusarskiIndiaOnyama Limba QUALIFIED
Izzy GarufiGermanyElwin Sharvill UNQUALIFIED
Clifford RimFranceAsiya Javayant QUALIFIED
Mujtaba NickaArgentinaBernardo Dominic QUALIFIED
Chavez BriddickFranceAnna Fali UNQUALIFIED
Costa DilliardIndiaOnyama Limba PROPOSAL
James ButtFranceAsiya Javayant NEGOTIATION
Salvatore StockhamItalyOnyama Limba UNQUALIFIED
Murillo MaletJapanElwin Sharvill NEW
Antonio CaudyArgentinaElwin Sharvill NEW
Antonio CaudyJapanXuxue Feng RENEWAL
Jefferson SchemmerUnited KingdomAsiya Javayant NEW
Tony FollerSpainBernardo Dominic PROPOSAL
Kaitlin OstroskyArgentinaElwin Sharvill PROPOSAL
Johnson SergiRussiaIvan Magalhaes NEGOTIATION
Alejandro PerinAustraliaAmy Elsner NEGOTIATION
Faith GillianFranceIvan Magalhaes PROPOSAL
Ricardo GauchoArgentinaAmy Elsner NEW
Clifford RimCanadaXuxue Feng NEGOTIATION
Jennifer AmigonSpainAmy Elsner PROPOSAL
Ashley DoeSpainAmy Elsner RENEWAL
Salvatore StockhamItalyIvan Magalhaes QUALIFIED
Cody SaylorsRussiaElwin Sharvill NEW
Ivar PaprockiGermanyXuxue Feng PROPOSAL
Aika InouyeRussiaXuxue Feng UNQUALIFIED
Adams MorascaRussiaBernardo Dominic QUALIFIED
Silvio SlusarskiGermanyAmy Elsner UNQUALIFIED

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