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
Kaitlin OstroskyRussiaAnna Fali NEW
Juan WieserIndiaIvan Magalhaes RENEWAL
Kaitlin OstroskyJapanBernardo Dominic PROPOSAL
Kaitlin OstroskyArgentinaIvan Magalhaes NEW
Alejandro PerinCanadaAnna Fali QUALIFIED
Costa DilliardUnited KingdomBernardo Dominic QUALIFIED
Mayumi KolmetzIndiaBernardo Dominic NEW
Julie StensethBrazilBernardo Dominic NEW
Deepesh ChuiCanadaIvan Magalhaes PROPOSAL
Tony FollerRussiaStephen Shaw QUALIFIED
Aditya KuskoBrazilAmy Elsner RENEWAL
Nicolas IturbideCanadaAnna Fali UNQUALIFIED
Sinclair WaycottJapanStephen Shaw PROPOSAL
Leja CaldareraIndiaAnna Fali NEGOTIATION
Costa DilliardIndiaAmy Elsner QUALIFIED
Deepesh ChuiSpainOnyama Limba RENEWAL
Maria MarrierSpainAmy Elsner PROPOSAL
Johnson SergiAustraliaIvan Magalhaes NEGOTIATION
Ricardo GauchoUnited KingdomStephen Shaw PROPOSAL
Cody SaylorsGermanyAnna Fali QUALIFIED
Leon OldroydIndiaIvan Magalhaes PROPOSAL
Maisha RulapaughRussiaOnyama Limba UNQUALIFIED
Chavez BriddickRussiaAmy Elsner PROPOSAL
James ButtJapanElwin Sharvill NEGOTIATION
Claire TollnerUnited KingdomAsiya Javayant PROPOSAL
Adams MorascaAustraliaIvan Magalhaes RENEWAL
Aruna FigeroaCanadaAnna Fali QUALIFIED
Greenwood BologniaArgentinaIoni Bowcher NEW
Tony FollerGermanyXuxue Feng UNQUALIFIED
Alejandro PerinIndiaStephen Shaw UNQUALIFIED
Ivar PaprockiUnited KingdomAsiya Javayant UNQUALIFIED
Morrow RutaRussiaAsiya Javayant UNQUALIFIED
Sinclair WaycottBrazilAsiya Javayant QUALIFIED
Silvio SlusarskiJapanAsiya Javayant QUALIFIED
Emily WhobreySpainIoni Bowcher NEW
Chavez BriddickRussiaBernardo Dominic UNQUALIFIED
Adams MorascaSpainElwin Sharvill QUALIFIED
Antonio CaudyGermanyElwin Sharvill NEW
Johnson SergiFranceAnna Fali UNQUALIFIED
Stacey MacleadBrazilOnyama Limba NEW
Kadeem FlosiRussiaAsiya Javayant QUALIFIED
Sinclair WaycottUnited KingdomStephen Shaw NEGOTIATION
James ButtSpainOnyama Limba UNQUALIFIED
Wickens NestleCanadaIoni Bowcher NEGOTIATION
Faith GillianRussiaOnyama Limba NEW
Johnson SergiGermanyAnna Fali PROPOSAL
James ButtArgentinaIoni Bowcher QUALIFIED
Antonio CaudyAustraliaIoni Bowcher UNQUALIFIED
Ivar PaprockiIndiaStephen Shaw QUALIFIED
Jennifer AmigonItalyIoni Bowcher QUALIFIED
Horizontal
NameCountryRepresentativeStatus
James ButtUnited KingdomIoni Bowcher NEGOTIATION
Chavez BriddickUnited KingdomBernardo Dominic NEGOTIATION
Maria MarrierUnited KingdomAmy Elsner QUALIFIED
Alejandro PerinItalyIoni Bowcher UNQUALIFIED
Julie StensethFranceIvan Magalhaes RENEWAL
Adams MorascaIndiaXuxue Feng NEW
Maria MarrierBrazilOnyama Limba RENEWAL
Antonio CaudyJapanAnna Fali NEGOTIATION
Misaki RoysterItalyIvan Magalhaes RENEWAL
James ButtJapanOnyama Limba NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Darci PoquetteCanada2026-05-14Truhlar And Truhlar Attys NEGOTIATION25Amy Elsner
1001Silvio SlusarskiJapan2026-06-02Feiner Bros UNQUALIFIED94Bernardo Dominic
1002Greenwood BologniaFrance2026-05-23Dorl, James J Esq RENEWAL93Stephen Shaw
1003Faith GillianAustralia2026-05-15Feiner Bros QUALIFIED3Onyama Limba
1004Costa DilliardCanada2026-05-25Benton, John B Jr PROPOSAL75Ivan Magalhaes
1005Aruna FigeroaCanada2026-05-27Commercial Press NEGOTIATION79Anna Fali
1006Sinclair WaycottSpain2026-05-18Chapman, Ross E Esq NEW30Onyama Limba
1007Izzy GarufiIndia2026-05-14Buckley Miller Wright UNQUALIFIED93Xuxue Feng
1008Maria MarrierBrazil2026-05-30Feiner Bros RENEWAL44Stephen Shaw
1009Silvio SlusarskiJapan2026-06-04Chemel, James L Cpa PROPOSAL28Asiya Javayant
1010Misaki RoysterUnited Kingdom2026-06-11Rousseaux, Michael Esq PROPOSAL31Bernardo Dominic
1011Tony FollerArgentina2026-06-01Printing Dimensions NEGOTIATION23Stephen Shaw
1012Leja CaldareraItaly2026-05-23Printing Dimensions UNQUALIFIED45Onyama Limba
1013Wickens NestleUnited Kingdom2026-05-31Chanay, Jeffrey A Esq RENEWAL49Asiya Javayant
1014Costa DilliardSpain2026-05-20Rousseaux, Michael Esq NEGOTIATION5Anna Fali
1015Jefferson SchemmerCanada2026-05-18Rousseaux, Michael Esq NEGOTIATION34Asiya Javayant
1016Cody SaylorsFrance2026-05-17Rousseaux, Michael Esq NEGOTIATION21Onyama Limba
1017Izzy GarufiIndia2026-05-27Buckley Miller Wright NEGOTIATION23Ivan Magalhaes
1018Salvatore StockhamCanada2026-05-26Commercial Press RENEWAL0Asiya Javayant
1019Mujtaba NickaGermany2026-06-01Chanay, Jeffrey A Esq NEW41Anna Fali
1020Sinclair WaycottFrance2026-05-25King, Christopher A Esq NEW85Asiya Javayant
1021Tony FollerRussia2026-06-09Rousseaux, Michael Esq PROPOSAL30Xuxue Feng
1022Munro FerenczJapan2026-06-04Chemel, James L Cpa PROPOSAL23Ivan Magalhaes
1023Jones VocelkaUnited Kingdom2026-06-10Printing Dimensions QUALIFIED45Elwin Sharvill
1024Faith GillianArgentina2026-05-31Chapman, Ross E Esq NEGOTIATION95Ivan Magalhaes
1025Claire TollnerItaly2026-05-26Rangoni Of Florence QUALIFIED16Ioni Bowcher
1026Smith GlickFrance2026-05-19Rangoni Of Florence NEGOTIATION68Amy Elsner
1027Stacey MacleadArgentina2026-06-09Morlong Associates NEGOTIATION64Bernardo Dominic
1028Jefferson SchemmerRussia2026-05-24Chanay, Jeffrey A Esq QUALIFIED12Stephen Shaw
1029Juan WieserIndia2026-05-24Rousseaux, Michael Esq QUALIFIED25Asiya Javayant
1030Claire TollnerCanada2026-05-27Benton, John B Jr QUALIFIED44Stephen Shaw
1031Misaki RoysterGermany2026-05-18Feltz Printing Service NEW40Anna Fali
1032Ricardo GauchoItaly2026-05-23Feiner Bros QUALIFIED8Elwin Sharvill
1033Costa DilliardFrance2026-06-08Printing Dimensions PROPOSAL85Asiya Javayant
1034Clifford RimBrazil2026-05-28Dorl, James J Esq UNQUALIFIED87Ioni Bowcher
1035Claire TollnerFrance2026-06-02Feltz Printing Service QUALIFIED33Anna Fali
1036Kadeem FlosiUnited Kingdom2026-06-05Commercial Press NEGOTIATION5Amy Elsner
1037Mujtaba NickaUnited Kingdom2026-05-29Benton, John B Jr PROPOSAL7Onyama Limba
1038Aika InouyeFrance2026-06-02Buckley Miller Wright PROPOSAL12Ioni Bowcher
1039James ButtSpain2026-05-27Rangoni Of Florence RENEWAL63Ioni Bowcher
1040Alejandro PerinAustralia2026-06-01Chanay, Jeffrey A Esq NEGOTIATION84Elwin Sharvill
1041Morrow RutaSpain2026-05-18Commercial Press RENEWAL18Xuxue Feng
1042Rodrigues CampainJapan2026-06-01Morlong Associates QUALIFIED58Ivan Magalhaes
1043Jefferson SchemmerAustralia2026-06-01Buckley Miller Wright RENEWAL38Asiya Javayant
1044Mayumi KolmetzAustralia2026-06-05Chanay, Jeffrey A Esq UNQUALIFIED16Xuxue Feng
1045Salvatore StockhamSpain2026-05-16Feiner Bros PROPOSAL33Amy Elsner
1046James ButtJapan2026-05-22Feltz Printing Service PROPOSAL71Amy Elsner
1047Aruna FigeroaAustralia2026-06-10Truhlar And Truhlar Attys QUALIFIED29Xuxue Feng
1048Antonio CaudyItaly2026-05-20Rangoni Of Florence QUALIFIED40Onyama Limba
1049Smith GlickArgentina2026-06-05Commercial Press PROPOSAL29Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Murillo MaletJapanXuxue Feng QUALIFIED
Isabel BowleyCanadaOnyama Limba PROPOSAL
Kaitlin OstroskyCanadaBernardo Dominic NEW
Ashley DoeItalyIvan Magalhaes QUALIFIED
Izzy GarufiIndiaAmy Elsner UNQUALIFIED
Julie StensethFranceOnyama Limba NEW
Costa DilliardUnited KingdomIoni Bowcher UNQUALIFIED
Rodrigues CampainRussiaXuxue Feng QUALIFIED
Clifford RimAustraliaBernardo Dominic QUALIFIED
Alejandro PerinArgentinaAsiya Javayant RENEWAL
Octavia MaletSpainAmy Elsner PROPOSAL
Mujtaba NickaItalyAmy Elsner NEGOTIATION
Jeanfrancois VenereRussiaStephen Shaw PROPOSAL
Jefferson SchemmerFranceIoni Bowcher RENEWAL
Clifford RimJapanAnna Fali UNQUALIFIED
Aditya KuskoItalyIvan Magalhaes PROPOSAL
Wickens NestleIndiaOnyama Limba UNQUALIFIED
James ButtArgentinaIvan Magalhaes NEGOTIATION
Rodrigues CampainAustraliaIvan Magalhaes UNQUALIFIED
Antonio CaudyIndiaStephen Shaw NEW
Murillo MaletItalyOnyama Limba RENEWAL
Claire TollnerUnited KingdomOnyama Limba UNQUALIFIED
Nicolas IturbideSpainOnyama Limba UNQUALIFIED
Deepesh ChuiBrazilXuxue Feng PROPOSAL
Deepesh ChuiAustraliaIvan Magalhaes NEW
Arvin AlbaresRussiaStephen Shaw QUALIFIED
Aruna FigeroaItalyStephen Shaw NEGOTIATION
Greenwood BologniaIndiaAnna Fali RENEWAL
Leon OldroydCanadaIoni Bowcher RENEWAL
Leja CaldareraItalyBernardo Dominic UNQUALIFIED
Murillo MaletJapanOnyama Limba UNQUALIFIED
Mujtaba NickaJapanIoni Bowcher UNQUALIFIED
Tony FollerCanadaAnna Fali RENEWAL
Emily WhobreyGermanyElwin Sharvill NEW
Nicolas IturbideAustraliaIoni Bowcher NEGOTIATION
Nicolas IturbideJapanStephen Shaw QUALIFIED
Morrow RutaItalyBernardo Dominic UNQUALIFIED
James ButtJapanAnna Fali UNQUALIFIED
Clifford RimArgentinaOnyama Limba PROPOSAL
Murillo MaletJapanAmy Elsner UNQUALIFIED
Nicolas IturbideItalyAnna Fali RENEWAL
Cody SaylorsItalyIoni Bowcher NEW
Aruna FigeroaCanadaBernardo Dominic RENEWAL
Johnson SergiIndiaAsiya Javayant PROPOSAL
Jefferson SchemmerBrazilElwin Sharvill NEGOTIATION
Mujtaba NickaCanadaAmy Elsner NEW
Faith GillianJapanAsiya Javayant PROPOSAL
Aditya KuskoUnited KingdomXuxue Feng NEW
Alejandro PerinIndiaStephen Shaw NEW
Costa DilliardJapanAmy Elsner UNQUALIFIED
Frozen Columns
Name
Jefferson Schemmer
Alejandro Perin
Alejandro Perin
Jefferson Schemmer
Wickens Nestle
Chavez Briddick
James Butt
Mayumi Kolmetz
Misaki Royster
Aditya Kusko
Stacey Maclead
Octavia Malet
Aditya Kusko
Julie Stenseth
Darci Poquette
Stacey Maclead
Faith Gillian
Emily Whobrey
Cody Saylors
Munro Ferencz
Kadeem Flosi
Kaitlin Ostrosky
Jennifer Amigon
Aruna Figeroa
Isabel Bowley
David Darakjy
Francesco Shinko
Sinclair Waycott
Munro Ferencz
Silvio Slusarski
Adams Morasca
Aruna Figeroa
Morrow Ruta
Jones Vocelka
Francesco Shinko
Izzy Garufi
Isabel Bowley
Clifford Rim
Leon Oldroyd
Maria Marrier
Tony Foller
Darci Poquette
Izzy Garufi
Salvatore Stockham
Nicolas Iturbide
Kadeem Flosi
Claire Tollner
Salvatore Stockham
Morrow Ruta
Stacey Maclead
IdCountryDate
1000Spain2026-06-03
1001Brazil2026-06-07
1002Germany2026-05-16
1003Brazil2026-06-06
1004Italy2026-06-07
1005Canada2026-05-13
1006France2026-06-06
1007Canada2026-05-31
1008Russia2026-05-17
1009Australia2026-05-15
1010Russia2026-05-13
1011Italy2026-06-03
1012United Kingdom2026-06-08
1013Spain2026-05-30
1014Argentina2026-05-20
1015Japan2026-05-19
1016India2026-05-25
1017Japan2026-05-13
1018Germany2026-05-17
1019Brazil2026-05-30
1020India2026-05-16
1021Canada2026-05-29
1022Brazil2026-05-15
1023Russia2026-06-03
1024Argentina2026-06-08
1025Spain2026-06-08
1026Australia2026-05-23
1027India2026-05-19
1028Japan2026-05-18
1029Italy2026-05-18
1030Australia2026-05-21
1031India2026-05-28
1032India2026-05-22
1033Canada2026-05-19
1034Spain2026-06-10
1035Italy2026-06-08
1036Argentina2026-05-18
1037Brazil2026-06-07
1038Japan2026-05-16
1039Spain2026-05-31
1040Germany2026-05-16
1041France2026-06-11
1042Canada2026-05-31
1043United Kingdom2026-06-06
1044Canada2026-05-21
1045Russia2026-05-19
1046Australia2026-05-13
1047United Kingdom2026-06-09
1048Argentina2026-05-16
1049Spain2026-05-14

On-Demand Data

NameIdCountryDate
Costa Dilliard1000Australia2026-05-18
Greenwood Bolognia1001Australia2026-06-11
Salvatore Stockham1002Germany2026-05-13
Julie Stenseth1003Italy2026-06-04
Aika Inouye1004India2026-05-26
Silvio Slusarski1005Argentina2026-05-22
Adams Morasca1006Australia2026-06-01
Misaki Royster1007Russia2026-05-25
Deepesh Chui1008India2026-06-11
Rodrigues Campain1009France2026-05-13
Stacey Maclead1010Germany2026-06-01
Alejandro Perin1011France2026-05-21
Silvio Slusarski1012France2026-05-19
Sinclair Waycott1013India2026-06-08
Ricardo Gaucho1014Germany2026-06-09
Alejandro Perin1015Russia2026-06-01
Silvio Slusarski1016Russia2026-06-06
Greenwood Bolognia1017Argentina2026-06-05
Faith Gillian1018Italy2026-05-23
Antonio Caudy1019France2026-05-28
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Morrow RutaCanadaAnna Fali NEGOTIATION
Clifford RimFranceAmy Elsner PROPOSAL
Darci PoquetteArgentinaIoni Bowcher NEW
Maria MarrierIndiaAnna Fali PROPOSAL
Deepesh ChuiItalyAsiya Javayant PROPOSAL
Ricardo GauchoUnited KingdomBernardo Dominic UNQUALIFIED
Clifford RimFranceAnna Fali NEW
David DarakjySpainAsiya Javayant NEW
Costa DilliardUnited KingdomAsiya Javayant QUALIFIED
Silvio SlusarskiRussiaStephen Shaw QUALIFIED
Cody SaylorsIndiaIvan Magalhaes PROPOSAL
Chavez BriddickJapanXuxue Feng UNQUALIFIED
Wickens NestleUnited KingdomStephen Shaw NEGOTIATION
Aditya KuskoCanadaXuxue Feng RENEWAL
Arvin AlbaresSpainBernardo Dominic PROPOSAL
Jennifer AmigonSpainAsiya Javayant RENEWAL
Antonio CaudyBrazilXuxue Feng RENEWAL
Aditya KuskoItalyElwin Sharvill UNQUALIFIED
Jennifer AmigonGermanyAmy Elsner QUALIFIED
Mujtaba NickaArgentinaAnna Fali QUALIFIED
Smith GlickRussiaAmy Elsner RENEWAL
Tony FollerArgentinaXuxue Feng NEW
Silvio SlusarskiJapanXuxue Feng NEW
Julie StensethFranceOnyama Limba NEGOTIATION
Wickens NestleItalyAmy Elsner UNQUALIFIED
Silvio SlusarskiGermanyIoni Bowcher NEGOTIATION
Murillo MaletAustraliaIoni Bowcher UNQUALIFIED
Julie StensethUnited KingdomAsiya Javayant QUALIFIED
Cody SaylorsAustraliaAnna Fali UNQUALIFIED
Cody SaylorsBrazilBernardo Dominic NEW
Jeanfrancois VenereFranceBernardo Dominic RENEWAL
Claire TollnerRussiaIvan Magalhaes QUALIFIED
Jennifer AmigonBrazilAnna Fali RENEWAL
Rodrigues CampainJapanBernardo Dominic NEGOTIATION
Munro FerenczSpainAmy Elsner UNQUALIFIED
Aruna FigeroaArgentinaAnna Fali NEGOTIATION
Leon OldroydFranceAsiya Javayant NEGOTIATION
Mujtaba NickaJapanAmy Elsner NEGOTIATION
Aditya KuskoUnited KingdomStephen Shaw UNQUALIFIED
Mujtaba NickaBrazilXuxue Feng 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>