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
Mayumi KolmetzSpainXuxue Feng PROPOSAL
David DarakjyBrazilIoni Bowcher NEW
Jennifer AmigonFranceIvan Magalhaes NEGOTIATION
Kadeem FlosiRussiaAnna Fali QUALIFIED
Mujtaba NickaIndiaElwin Sharvill PROPOSAL
Jennifer AmigonArgentinaAsiya Javayant RENEWAL
Isabel BowleyItalyXuxue Feng PROPOSAL
Clifford RimAustraliaOnyama Limba RENEWAL
Misaki RoysterArgentinaBernardo Dominic RENEWAL
Maria MarrierFranceAmy Elsner PROPOSAL
Antonio CaudyAustraliaXuxue Feng QUALIFIED
Wickens NestleGermanyIoni Bowcher NEGOTIATION
Maisha RulapaughSpainXuxue Feng QUALIFIED
Smith GlickUnited KingdomElwin Sharvill RENEWAL
Deepesh ChuiFranceXuxue Feng NEW
Clifford RimIndiaAmy Elsner QUALIFIED
Clifford RimIndiaStephen Shaw NEW
Darci PoquetteJapanIvan Magalhaes NEW
Wickens NestleBrazilElwin Sharvill NEW
Jones VocelkaAustraliaAsiya Javayant NEGOTIATION
Salvatore StockhamGermanyXuxue Feng PROPOSAL
Octavia MaletCanadaIvan Magalhaes PROPOSAL
Tony FollerRussiaAmy Elsner NEGOTIATION
Aika InouyeArgentinaElwin Sharvill PROPOSAL
Chavez BriddickJapanAnna Fali RENEWAL
Munro FerenczCanadaStephen Shaw PROPOSAL
Darci PoquetteItalyOnyama Limba RENEWAL
Mujtaba NickaItalyAsiya Javayant PROPOSAL
Misaki RoysterAustraliaOnyama Limba NEW
Cody SaylorsItalyBernardo Dominic QUALIFIED
Ivar PaprockiCanadaIvan Magalhaes PROPOSAL
Munro FerenczCanadaXuxue Feng QUALIFIED
Antonio CaudyBrazilAsiya Javayant NEGOTIATION
Jennifer AmigonArgentinaIvan Magalhaes PROPOSAL
Kadeem FlosiJapanAsiya Javayant NEW
Octavia MaletItalyBernardo Dominic NEGOTIATION
Chavez BriddickItalyOnyama Limba RENEWAL
Jefferson SchemmerSpainElwin Sharvill PROPOSAL
Octavia MaletSpainAmy Elsner PROPOSAL
Maria MarrierCanadaOnyama Limba RENEWAL
Jones VocelkaFranceIvan Magalhaes UNQUALIFIED
Jefferson SchemmerUnited KingdomElwin Sharvill NEGOTIATION
Jennifer AmigonItalyOnyama Limba UNQUALIFIED
Kadeem FlosiRussiaBernardo Dominic PROPOSAL
Alejandro PerinSpainAnna Fali PROPOSAL
Francesco ShinkoGermanyAsiya Javayant QUALIFIED
Sinclair WaycottBrazilIoni Bowcher UNQUALIFIED
Jeanfrancois VenereCanadaBernardo Dominic NEW
Maria MarrierRussiaBernardo Dominic NEW
David DarakjyJapanAnna Fali RENEWAL
Horizontal
NameCountryRepresentativeStatus
Ashley DoeJapanXuxue Feng UNQUALIFIED
Leon OldroydAustraliaStephen Shaw QUALIFIED
Darci PoquetteArgentinaAnna Fali QUALIFIED
Mayumi KolmetzFranceIvan Magalhaes RENEWAL
Salvatore StockhamCanadaXuxue Feng NEW
James ButtFranceIvan Magalhaes RENEWAL
Costa DilliardItalyIoni Bowcher PROPOSAL
Izzy GarufiCanadaBernardo Dominic PROPOSAL
Darci PoquetteIndiaAsiya Javayant PROPOSAL
Antonio CaudyBrazilXuxue Feng NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Isabel BowleyJapan2026-04-03Rangoni Of Florence NEW73Elwin Sharvill
1001Sinclair WaycottBrazil2026-04-07Chemel, James L Cpa NEGOTIATION6Asiya Javayant
1002Jennifer AmigonGermany2026-03-28Printing Dimensions QUALIFIED66Anna Fali
1003Murillo MaletRussia2026-03-28Chanay, Jeffrey A Esq NEGOTIATION34Stephen Shaw
1004Darci PoquetteItaly2026-04-05Benton, John B Jr UNQUALIFIED91Onyama Limba
1005Jeanfrancois VenereItaly2026-03-21Buckley Miller Wright QUALIFIED70Xuxue Feng
1006Jefferson SchemmerSpain2026-03-26Commercial Press RENEWAL47Onyama Limba
1007Smith GlickItaly2026-04-19Chemel, James L Cpa QUALIFIED37Ioni Bowcher
1008Kadeem FlosiAustralia2026-03-23Feltz Printing Service QUALIFIED92Stephen Shaw
1009Silvio SlusarskiItaly2026-03-27Rousseaux, Michael Esq NEW37Ivan Magalhaes
1010Julie StensethAustralia2026-04-10Buckley Miller Wright PROPOSAL44Anna Fali
1011Aditya KuskoGermany2026-04-01Printing Dimensions QUALIFIED34Onyama Limba
1012Clifford RimUnited Kingdom2026-03-24Truhlar And Truhlar Attys UNQUALIFIED73Stephen Shaw
1013Salvatore StockhamUnited Kingdom2026-04-09Chapman, Ross E Esq UNQUALIFIED12Ioni Bowcher
1014Leon OldroydCanada2026-03-31Feltz Printing Service UNQUALIFIED43Asiya Javayant
1015Julie StensethIndia2026-04-19Commercial Press RENEWAL39Xuxue Feng
1016Johnson SergiSpain2026-04-13Rangoni Of Florence RENEWAL77Amy Elsner
1017Mujtaba NickaItaly2026-03-27Feiner Bros NEGOTIATION46Anna Fali
1018Chavez BriddickRussia2026-03-24Printing Dimensions QUALIFIED67Amy Elsner
1019Jefferson SchemmerRussia2026-04-13Commercial Press PROPOSAL39Stephen Shaw
1020Kadeem FlosiBrazil2026-03-23Chapman, Ross E Esq PROPOSAL10Stephen Shaw
1021Jeanfrancois VenereFrance2026-03-24Commercial Press PROPOSAL81Ivan Magalhaes
1022Adams MorascaAustralia2026-04-05Morlong Associates UNQUALIFIED62Stephen Shaw
1023Smith GlickGermany2026-03-29Benton, John B Jr NEGOTIATION75Ioni Bowcher
1024Silvio SlusarskiUnited Kingdom2026-03-28Morlong Associates UNQUALIFIED76Onyama Limba
1025Emily WhobreyAustralia2026-04-04Rousseaux, Michael Esq NEGOTIATION71Ivan Magalhaes
1026Greenwood BologniaBrazil2026-04-15Chanay, Jeffrey A Esq PROPOSAL20Ioni Bowcher
1027Clifford RimIndia2026-04-11Printing Dimensions NEW49Onyama Limba
1028Wickens NestleGermany2026-04-09Feltz Printing Service UNQUALIFIED98Amy Elsner
1029Tony FollerIndia2026-04-01Truhlar And Truhlar Attys UNQUALIFIED24Ioni Bowcher
1030Silvio SlusarskiIndia2026-03-29King, Christopher A Esq QUALIFIED49Asiya Javayant
1031Aruna FigeroaGermany2026-04-12Dorl, James J Esq NEW16Xuxue Feng
1032Faith GillianGermany2026-04-14Buckley Miller Wright UNQUALIFIED12Bernardo Dominic
1033Kaitlin OstroskyAustralia2026-03-23Printing Dimensions NEGOTIATION2Bernardo Dominic
1034David DarakjyCanada2026-04-19Commercial Press UNQUALIFIED56Elwin Sharvill
1035Alejandro PerinIndia2026-04-11Chapman, Ross E Esq NEW18Ivan Magalhaes
1036Murillo MaletBrazil2026-04-04Chapman, Ross E Esq RENEWAL0Ioni Bowcher
1037Chavez BriddickGermany2026-04-09Rousseaux, Michael Esq PROPOSAL59Stephen Shaw
1038Mujtaba NickaFrance2026-04-06Truhlar And Truhlar Attys QUALIFIED96Amy Elsner
1039Leja CaldareraJapan2026-03-29Benton, John B Jr UNQUALIFIED64Ioni Bowcher
1040Smith GlickIndia2026-04-02Dorl, James J Esq NEW39Ivan Magalhaes
1041Darci PoquetteIndia2026-04-04King, Christopher A Esq UNQUALIFIED25Bernardo Dominic
1042Alejandro PerinIndia2026-03-29Feltz Printing Service QUALIFIED67Elwin Sharvill
1043Mayumi KolmetzRussia2026-03-29Truhlar And Truhlar Attys NEW32Asiya Javayant
1044Antonio CaudyJapan2026-03-24Chapman, Ross E Esq QUALIFIED76Onyama Limba
1045Ashley DoeAustralia2026-04-02Commercial Press QUALIFIED12Stephen Shaw
1046Octavia MaletUnited Kingdom2026-03-25Chemel, James L Cpa NEGOTIATION29Ivan Magalhaes
1047Antonio CaudyIndia2026-04-14Feiner Bros RENEWAL62Bernardo Dominic
1048Sinclair WaycottAustralia2026-03-23Chemel, James L Cpa QUALIFIED83Elwin Sharvill
1049Claire TollnerArgentina2026-04-06Rangoni Of Florence QUALIFIED14Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Octavia MaletItalyAsiya Javayant PROPOSAL
Jennifer AmigonItalyElwin Sharvill PROPOSAL
Maisha RulapaughFranceBernardo Dominic PROPOSAL
Murillo MaletSpainIoni Bowcher NEW
Claire TollnerSpainIvan Magalhaes RENEWAL
Misaki RoysterUnited KingdomOnyama Limba UNQUALIFIED
Juan WieserAustraliaIoni Bowcher RENEWAL
Silvio SlusarskiCanadaAnna Fali NEW
Aika InouyeCanadaAnna Fali UNQUALIFIED
Rodrigues CampainSpainStephen Shaw PROPOSAL
Jefferson SchemmerCanadaElwin Sharvill NEGOTIATION
Munro FerenczAustraliaElwin Sharvill QUALIFIED
Arvin AlbaresIndiaAsiya Javayant PROPOSAL
Johnson SergiGermanyStephen Shaw RENEWAL
Emily WhobreyGermanyAsiya Javayant UNQUALIFIED
Jennifer AmigonJapanIvan Magalhaes PROPOSAL
Stacey MacleadCanadaAsiya Javayant NEW
Murillo MaletUnited KingdomXuxue Feng QUALIFIED
Salvatore StockhamBrazilXuxue Feng QUALIFIED
Leon OldroydFranceAnna Fali QUALIFIED
Clifford RimUnited KingdomElwin Sharvill PROPOSAL
Jeanfrancois VenereFranceOnyama Limba UNQUALIFIED
Jennifer AmigonCanadaElwin Sharvill NEW
Maria MarrierAustraliaElwin Sharvill UNQUALIFIED
Mujtaba NickaJapanAmy Elsner PROPOSAL
Leon OldroydBrazilElwin Sharvill NEW
Clifford RimSpainBernardo Dominic QUALIFIED
Jefferson SchemmerGermanyAsiya Javayant QUALIFIED
Murillo MaletGermanyStephen Shaw PROPOSAL
Deepesh ChuiGermanyBernardo Dominic NEGOTIATION
Morrow RutaAustraliaElwin Sharvill NEGOTIATION
Francesco ShinkoBrazilIvan Magalhaes UNQUALIFIED
Francesco ShinkoGermanyXuxue Feng QUALIFIED
Ivar PaprockiIndiaIoni Bowcher NEGOTIATION
Smith GlickArgentinaIoni Bowcher RENEWAL
Julie StensethBrazilXuxue Feng RENEWAL
Ivar PaprockiAustraliaStephen Shaw NEW
Mayumi KolmetzSpainIvan Magalhaes RENEWAL
Isabel BowleyBrazilStephen Shaw NEW
Clifford RimArgentinaStephen Shaw NEGOTIATION
Izzy GarufiAustraliaOnyama Limba QUALIFIED
Nicolas IturbideGermanyElwin Sharvill UNQUALIFIED
Aruna FigeroaFranceStephen Shaw NEGOTIATION
Alejandro PerinIndiaOnyama Limba RENEWAL
Stacey MacleadJapanAsiya Javayant PROPOSAL
Juan WieserAustraliaElwin Sharvill PROPOSAL
Greenwood BologniaSpainOnyama Limba QUALIFIED
Julie StensethBrazilIoni Bowcher UNQUALIFIED
Kadeem FlosiJapanBernardo Dominic QUALIFIED
Costa DilliardRussiaIvan Magalhaes UNQUALIFIED
Frozen Columns
Name
Deepesh Chui
Rodrigues Campain
Faith Gillian
Deepesh Chui
Smith Glick
Faith Gillian
Leja Caldarera
Adams Morasca
Francesco Shinko
Stacey Maclead
Clifford Rim
Izzy Garufi
Jeanfrancois Venere
Costa Dilliard
Leja Caldarera
Jefferson Schemmer
Munro Ferencz
Misaki Royster
Deepesh Chui
Darci Poquette
Octavia Malet
Isabel Bowley
Johnson Sergi
Claire Tollner
Julie Stenseth
Jeanfrancois Venere
Alejandro Perin
Maisha Rulapaugh
Jefferson Schemmer
Clifford Rim
Sinclair Waycott
Kadeem Flosi
Ivar Paprocki
Ashley Doe
Jennifer Amigon
Maria Marrier
Mayumi Kolmetz
Maisha Rulapaugh
Clifford Rim
Nicolas Iturbide
Aika Inouye
Jeanfrancois Venere
Isabel Bowley
Kaitlin Ostrosky
Murillo Malet
Maisha Rulapaugh
Adams Morasca
Izzy Garufi
Julie Stenseth
Francesco Shinko
IdCountryDate
1000Australia2026-03-21
1001France2026-04-02
1002France2026-03-25
1003Italy2026-04-02
1004Japan2026-04-02
1005Russia2026-04-01
1006Italy2026-03-28
1007United Kingdom2026-04-08
1008Brazil2026-03-26
1009United Kingdom2026-04-05
1010France2026-03-29
1011Spain2026-04-19
1012Argentina2026-04-05
1013Russia2026-03-21
1014Germany2026-04-12
1015United Kingdom2026-03-27
1016France2026-04-08
1017Spain2026-04-07
1018Australia2026-04-16
1019Spain2026-04-13
1020Canada2026-04-04
1021Canada2026-04-08
1022Japan2026-04-02
1023Spain2026-03-24
1024Spain2026-04-04
1025Italy2026-04-18
1026United Kingdom2026-03-21
1027India2026-04-17
1028Russia2026-03-27
1029Germany2026-03-27
1030Japan2026-04-14
1031Russia2026-04-04
1032Japan2026-04-06
1033Argentina2026-04-03
1034India2026-03-25
1035Australia2026-04-06
1036India2026-03-21
1037Russia2026-03-22
1038United Kingdom2026-04-10
1039Germany2026-03-22
1040France2026-04-09
1041India2026-03-21
1042United Kingdom2026-03-22
1043Spain2026-04-14
1044United Kingdom2026-03-24
1045Japan2026-04-11
1046Brazil2026-04-18
1047Japan2026-04-08
1048Germany2026-04-09
1049France2026-03-21

On-Demand Data

NameIdCountryDate
Stacey Maclead1000India2026-03-28
Clifford Rim1001India2026-04-02
Nicolas Iturbide1002Russia2026-04-18
Silvio Slusarski1003Canada2026-04-14
Smith Glick1004Canada2026-04-10
Octavia Malet1005India2026-03-29
Jefferson Schemmer1006India2026-04-19
Rodrigues Campain1007Italy2026-04-09
Smith Glick1008Canada2026-03-25
Arvin Albares1009United Kingdom2026-03-28
James Butt1010Italy2026-04-09
Isabel Bowley1011Japan2026-04-06
Jones Vocelka1012Spain2026-04-07
Sinclair Waycott1013India2026-03-28
Maisha Rulapaugh1014India2026-04-03
Tony Foller1015Japan2026-03-21
Salvatore Stockham1016Canada2026-04-09
Maisha Rulapaugh1017Germany2026-03-26
Jefferson Schemmer1018Japan2026-04-06
Antonio Caudy1019Australia2026-03-30
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Mayumi KolmetzUnited KingdomAsiya Javayant PROPOSAL
Darci PoquetteCanadaAmy Elsner PROPOSAL
Ricardo GauchoRussiaStephen Shaw PROPOSAL
Tony FollerItalyElwin Sharvill NEGOTIATION
Mujtaba NickaBrazilStephen Shaw NEGOTIATION
Darci PoquetteIndiaAnna Fali UNQUALIFIED
Claire TollnerItalyAnna Fali UNQUALIFIED
Murillo MaletBrazilBernardo Dominic NEW
Ivar PaprockiFranceAnna Fali NEGOTIATION
Misaki RoysterRussiaAsiya Javayant QUALIFIED
David DarakjyAustraliaAnna Fali RENEWAL
Arvin AlbaresItalyAnna Fali PROPOSAL
Costa DilliardCanadaBernardo Dominic QUALIFIED
Ashley DoeAustraliaElwin Sharvill NEGOTIATION
Clifford RimFranceIvan Magalhaes NEGOTIATION
James ButtJapanIvan Magalhaes RENEWAL
Jeanfrancois VenereBrazilXuxue Feng NEGOTIATION
Claire TollnerItalyIoni Bowcher UNQUALIFIED
Maria MarrierIndiaXuxue Feng NEGOTIATION
Ashley DoeRussiaElwin Sharvill UNQUALIFIED
Smith GlickGermanyElwin Sharvill QUALIFIED
Adams MorascaFranceIoni Bowcher UNQUALIFIED
Silvio SlusarskiSpainAnna Fali PROPOSAL
Izzy GarufiRussiaOnyama Limba UNQUALIFIED
Aditya KuskoSpainElwin Sharvill NEW
Leon OldroydGermanyElwin Sharvill PROPOSAL
Munro FerenczArgentinaIvan Magalhaes QUALIFIED
Clifford RimGermanyIoni Bowcher PROPOSAL
Chavez BriddickUnited KingdomStephen Shaw RENEWAL
Faith GillianItalyAnna Fali RENEWAL
Munro FerenczSpainBernardo Dominic RENEWAL
Kaitlin OstroskyArgentinaStephen Shaw PROPOSAL
Jefferson SchemmerIndiaAsiya Javayant NEW
Izzy GarufiUnited KingdomStephen Shaw QUALIFIED
Mayumi KolmetzRussiaAsiya Javayant PROPOSAL
Izzy GarufiGermanyAmy Elsner QUALIFIED
Leon OldroydBrazilStephen Shaw QUALIFIED
Ivar PaprockiBrazilIvan Magalhaes QUALIFIED
Cody SaylorsUnited KingdomXuxue Feng QUALIFIED
Ivar PaprockiRussiaStephen Shaw PROPOSAL

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