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
Cody SaylorsAustraliaOnyama Limba PROPOSAL
Aika InouyeJapanAsiya Javayant UNQUALIFIED
Mujtaba NickaArgentinaXuxue Feng QUALIFIED
Tony FollerSpainStephen Shaw RENEWAL
Ashley DoeSpainXuxue Feng NEGOTIATION
Rodrigues CampainFranceXuxue Feng UNQUALIFIED
Mayumi KolmetzArgentinaOnyama Limba QUALIFIED
Johnson SergiJapanAsiya Javayant NEW
Ivar PaprockiFranceBernardo Dominic PROPOSAL
Silvio SlusarskiAustraliaAnna Fali UNQUALIFIED
Alejandro PerinRussiaAmy Elsner NEGOTIATION
Cody SaylorsSpainAsiya Javayant UNQUALIFIED
Morrow RutaFranceXuxue Feng PROPOSAL
Aika InouyeFranceIvan Magalhaes RENEWAL
Mujtaba NickaUnited KingdomXuxue Feng QUALIFIED
James ButtBrazilXuxue Feng PROPOSAL
Misaki RoysterRussiaStephen Shaw NEGOTIATION
Leon OldroydGermanyAsiya Javayant NEGOTIATION
Mayumi KolmetzBrazilIoni Bowcher RENEWAL
Leja CaldareraArgentinaBernardo Dominic NEW
Francesco ShinkoFranceAnna Fali PROPOSAL
Claire TollnerGermanyAsiya Javayant PROPOSAL
Clifford RimCanadaStephen Shaw NEW
Aditya KuskoRussiaAnna Fali UNQUALIFIED
Mayumi KolmetzCanadaOnyama Limba NEGOTIATION
Wickens NestleUnited KingdomAsiya Javayant QUALIFIED
Smith GlickGermanyElwin Sharvill PROPOSAL
Aruna FigeroaRussiaIvan Magalhaes NEGOTIATION
Aika InouyeJapanAnna Fali PROPOSAL
Jeanfrancois VenereIndiaOnyama Limba UNQUALIFIED
Kadeem FlosiArgentinaAnna Fali UNQUALIFIED
Faith GillianIndiaAnna Fali NEGOTIATION
Murillo MaletArgentinaElwin Sharvill NEW
Costa DilliardRussiaBernardo Dominic NEGOTIATION
Stacey MacleadGermanyStephen Shaw RENEWAL
Kaitlin OstroskyIndiaAmy Elsner RENEWAL
Jones VocelkaBrazilAmy Elsner PROPOSAL
Chavez BriddickRussiaAmy Elsner RENEWAL
Munro FerenczGermanyIvan Magalhaes RENEWAL
Morrow RutaRussiaStephen Shaw NEGOTIATION
Tony FollerCanadaAsiya Javayant PROPOSAL
Johnson SergiItalyOnyama Limba RENEWAL
Greenwood BologniaSpainAsiya Javayant PROPOSAL
Leja CaldareraItalyXuxue Feng QUALIFIED
Octavia MaletGermanyXuxue Feng QUALIFIED
Arvin AlbaresCanadaElwin Sharvill NEW
Smith GlickCanadaElwin Sharvill PROPOSAL
Faith GillianBrazilBernardo Dominic UNQUALIFIED
Misaki RoysterFranceOnyama Limba QUALIFIED
Silvio SlusarskiJapanAsiya Javayant NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Darci PoquetteJapanIvan Magalhaes UNQUALIFIED
Emily WhobreyRussiaIoni Bowcher NEW
Jennifer AmigonRussiaIvan Magalhaes PROPOSAL
Silvio SlusarskiUnited KingdomElwin Sharvill RENEWAL
Sinclair WaycottCanadaElwin Sharvill PROPOSAL
Nicolas IturbideJapanAsiya Javayant QUALIFIED
Octavia MaletIndiaOnyama Limba NEGOTIATION
Izzy GarufiCanadaXuxue Feng PROPOSAL
Leja CaldareraArgentinaBernardo Dominic RENEWAL
Morrow RutaCanadaXuxue Feng NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Salvatore StockhamSpain2026-06-05Buckley Miller Wright PROPOSAL4Bernardo Dominic
1001Munro FerenczAustralia2026-06-06Dorl, James J Esq QUALIFIED57Ioni Bowcher
1002Sinclair WaycottAustralia2026-06-05King, Christopher A Esq UNQUALIFIED52Stephen Shaw
1003Faith GillianUnited Kingdom2026-06-03Truhlar And Truhlar Attys RENEWAL37Anna Fali
1004Claire TollnerFrance2026-05-27Chanay, Jeffrey A Esq UNQUALIFIED52Elwin Sharvill
1005Aditya KuskoGermany2026-05-19Feltz Printing Service PROPOSAL94Ivan Magalhaes
1006Arvin AlbaresJapan2026-06-01Truhlar And Truhlar Attys PROPOSAL65Amy Elsner
1007Izzy GarufiAustralia2026-05-18Morlong Associates RENEWAL23Anna Fali
1008Ivar PaprockiFrance2026-05-13Chanay, Jeffrey A Esq RENEWAL23Asiya Javayant
1009Darci PoquetteUnited Kingdom2026-05-30Truhlar And Truhlar Attys UNQUALIFIED35Anna Fali
1010David DarakjyUnited Kingdom2026-05-31Dorl, James J Esq NEGOTIATION61Asiya Javayant
1011Misaki RoysterBrazil2026-05-22Chemel, James L Cpa NEGOTIATION56Bernardo Dominic
1012Emily WhobreyRussia2026-06-08Dorl, James J Esq NEW71Onyama Limba
1013Izzy GarufiFrance2026-06-09Chapman, Ross E Esq QUALIFIED28Xuxue Feng
1014Cody SaylorsGermany2026-05-12Truhlar And Truhlar Attys PROPOSAL27Asiya Javayant
1015Chavez BriddickAustralia2026-06-06King, Christopher A Esq NEW93Asiya Javayant
1016Rodrigues CampainCanada2026-06-04Morlong Associates RENEWAL85Bernardo Dominic
1017Maisha RulapaughArgentina2026-06-10Benton, John B Jr NEGOTIATION15Stephen Shaw
1018Ivar PaprockiGermany2026-05-26Truhlar And Truhlar Attys NEW57Stephen Shaw
1019Chavez BriddickRussia2026-06-03Chanay, Jeffrey A Esq NEGOTIATION34Ivan Magalhaes
1020Izzy GarufiItaly2026-05-17Truhlar And Truhlar Attys UNQUALIFIED82Bernardo Dominic
1021Emily WhobreyItaly2026-05-24Truhlar And Truhlar Attys QUALIFIED91Bernardo Dominic
1022Salvatore StockhamFrance2026-05-14Rousseaux, Michael Esq NEW58Xuxue Feng
1023Kadeem FlosiFrance2026-05-18King, Christopher A Esq NEW84Stephen Shaw
1024Darci PoquetteAustralia2026-06-01Chapman, Ross E Esq NEGOTIATION12Ioni Bowcher
1025Ivar PaprockiGermany2026-06-06Benton, John B Jr PROPOSAL96Amy Elsner
1026Kadeem FlosiJapan2026-05-23Feltz Printing Service NEGOTIATION65Xuxue Feng
1027Stacey MacleadItaly2026-05-17Dorl, James J Esq NEGOTIATION68Bernardo Dominic
1028Johnson SergiIndia2026-06-10Chanay, Jeffrey A Esq PROPOSAL3Amy Elsner
1029Maria MarrierUnited Kingdom2026-06-04Printing Dimensions PROPOSAL32Elwin Sharvill
1030Isabel BowleyAustralia2026-05-21King, Christopher A Esq PROPOSAL14Xuxue Feng
1031Johnson SergiAustralia2026-06-08Chanay, Jeffrey A Esq NEGOTIATION83Bernardo Dominic
1032Darci PoquetteAustralia2026-05-31King, Christopher A Esq NEGOTIATION3Elwin Sharvill
1033Silvio SlusarskiFrance2026-05-29Commercial Press NEGOTIATION79Asiya Javayant
1034Cody SaylorsBrazil2026-05-23Feiner Bros UNQUALIFIED86Ivan Magalhaes
1035David DarakjyGermany2026-05-16Printing Dimensions NEGOTIATION12Ivan Magalhaes
1036Chavez BriddickCanada2026-05-27Buckley Miller Wright PROPOSAL63Onyama Limba
1037Smith GlickBrazil2026-05-24Chanay, Jeffrey A Esq QUALIFIED38Onyama Limba
1038Cody SaylorsCanada2026-05-22Rangoni Of Florence UNQUALIFIED21Anna Fali
1039Isabel BowleyBrazil2026-05-15Buckley Miller Wright UNQUALIFIED87Ivan Magalhaes
1040Rodrigues CampainAustralia2026-06-03Chapman, Ross E Esq UNQUALIFIED82Ivan Magalhaes
1041Munro FerenczAustralia2026-05-25Chemel, James L Cpa RENEWAL44Ivan Magalhaes
1042Ashley DoeItaly2026-06-06Chemel, James L Cpa NEW53Anna Fali
1043Cody SaylorsBrazil2026-06-07Printing Dimensions PROPOSAL78Amy Elsner
1044Rodrigues CampainAustralia2026-06-01Truhlar And Truhlar Attys RENEWAL47Onyama Limba
1045Ivar PaprockiUnited Kingdom2026-05-17Morlong Associates PROPOSAL37Xuxue Feng
1046Ivar PaprockiAustralia2026-05-12Chanay, Jeffrey A Esq UNQUALIFIED97Amy Elsner
1047Jeanfrancois VenereCanada2026-06-06Feltz Printing Service UNQUALIFIED37Amy Elsner
1048Isabel BowleyAustralia2026-05-30King, Christopher A Esq RENEWAL90Elwin Sharvill
1049Deepesh ChuiCanada2026-06-05Buckley Miller Wright PROPOSAL84Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Aika InouyeAustraliaIvan Magalhaes RENEWAL
Ivar PaprockiGermanyAsiya Javayant RENEWAL
Darci PoquetteFranceStephen Shaw RENEWAL
Isabel BowleyCanadaIvan Magalhaes UNQUALIFIED
Cody SaylorsGermanyAmy Elsner UNQUALIFIED
Adams MorascaUnited KingdomAnna Fali NEW
Cody SaylorsCanadaOnyama Limba QUALIFIED
Antonio CaudyFranceIvan Magalhaes PROPOSAL
Clifford RimAustraliaStephen Shaw NEGOTIATION
Claire TollnerCanadaStephen Shaw NEW
Mujtaba NickaSpainIvan Magalhaes RENEWAL
Maisha RulapaughSpainIoni Bowcher PROPOSAL
David DarakjyItalyAnna Fali PROPOSAL
Mujtaba NickaSpainAnna Fali RENEWAL
Francesco ShinkoCanadaAmy Elsner UNQUALIFIED
Stacey MacleadSpainElwin Sharvill UNQUALIFIED
Adams MorascaArgentinaAnna Fali RENEWAL
Munro FerenczAustraliaAmy Elsner UNQUALIFIED
Greenwood BologniaGermanyStephen Shaw NEW
Rodrigues CampainArgentinaAnna Fali NEGOTIATION
Misaki RoysterIndiaOnyama Limba NEW
Kaitlin OstroskyAustraliaBernardo Dominic NEW
Smith GlickSpainStephen Shaw NEW
Alejandro PerinBrazilIvan Magalhaes QUALIFIED
Isabel BowleyUnited KingdomStephen Shaw RENEWAL
Leon OldroydRussiaXuxue Feng NEGOTIATION
Leja CaldareraRussiaOnyama Limba UNQUALIFIED
Claire TollnerBrazilIvan Magalhaes QUALIFIED
Sinclair WaycottCanadaAsiya Javayant NEW
Rodrigues CampainItalyAsiya Javayant NEGOTIATION
Clifford RimCanadaAmy Elsner PROPOSAL
Leon OldroydArgentinaBernardo Dominic RENEWAL
Murillo MaletItalyAmy Elsner RENEWAL
David DarakjyRussiaAsiya Javayant PROPOSAL
Clifford RimJapanElwin Sharvill UNQUALIFIED
Octavia MaletUnited KingdomXuxue Feng RENEWAL
Arvin AlbaresIndiaBernardo Dominic NEW
Emily WhobreyFranceBernardo Dominic PROPOSAL
Murillo MaletCanadaIvan Magalhaes NEW
Alejandro PerinSpainAsiya Javayant PROPOSAL
David DarakjyBrazilElwin Sharvill RENEWAL
Ricardo GauchoGermanyElwin Sharvill PROPOSAL
Clifford RimIndiaStephen Shaw UNQUALIFIED
Alejandro PerinIndiaOnyama Limba PROPOSAL
Claire TollnerGermanyStephen Shaw NEW
Aika InouyeSpainStephen Shaw PROPOSAL
Alejandro PerinGermanyElwin Sharvill QUALIFIED
Johnson SergiRussiaIvan Magalhaes PROPOSAL
James ButtGermanyAsiya Javayant QUALIFIED
Octavia MaletRussiaAsiya Javayant PROPOSAL
Frozen Columns
Name
Maria Marrier
Ashley Doe
Salvatore Stockham
Tony Foller
James Butt
Ashley Doe
Chavez Briddick
Deepesh Chui
Maria Marrier
Leon Oldroyd
Jefferson Schemmer
David Darakjy
Jennifer Amigon
Jennifer Amigon
David Darakjy
Octavia Malet
Julie Stenseth
Misaki Royster
Costa Dilliard
Johnson Sergi
Antonio Caudy
Cody Saylors
Johnson Sergi
Emily Whobrey
Stacey Maclead
Adams Morasca
Sinclair Waycott
Smith Glick
Wickens Nestle
Deepesh Chui
Nicolas Iturbide
Munro Ferencz
Izzy Garufi
Clifford Rim
Jennifer Amigon
Munro Ferencz
Mayumi Kolmetz
Munro Ferencz
Isabel Bowley
Francesco Shinko
Silvio Slusarski
Jennifer Amigon
Ricardo Gaucho
Morrow Ruta
Cody Saylors
Kaitlin Ostrosky
David Darakjy
Juan Wieser
Alejandro Perin
Munro Ferencz
IdCountryDate
1000France2026-06-05
1001France2026-05-31
1002Argentina2026-05-29
1003Russia2026-05-24
1004France2026-05-20
1005Canada2026-06-08
1006United Kingdom2026-05-25
1007United Kingdom2026-06-09
1008Argentina2026-05-29
1009Australia2026-06-03
1010Argentina2026-05-12
1011Brazil2026-05-22
1012Germany2026-05-26
1013United Kingdom2026-05-28
1014Brazil2026-06-01
1015Germany2026-05-31
1016India2026-05-15
1017Russia2026-06-10
1018Canada2026-05-16
1019Brazil2026-06-03
1020Brazil2026-05-19
1021France2026-05-21
1022Canada2026-06-07
1023France2026-06-03
1024United Kingdom2026-05-25
1025United Kingdom2026-05-15
1026Russia2026-06-08
1027France2026-06-06
1028Canada2026-05-16
1029Brazil2026-06-04
1030Spain2026-06-05
1031Japan2026-05-17
1032Japan2026-05-31
1033Australia2026-06-02
1034Japan2026-06-05
1035France2026-06-05
1036Australia2026-05-27
1037Spain2026-06-04
1038Canada2026-05-28
1039Argentina2026-05-18
1040United Kingdom2026-05-30
1041Argentina2026-05-28
1042Spain2026-05-15
1043Australia2026-05-24
1044Germany2026-05-26
1045United Kingdom2026-06-10
1046Australia2026-05-22
1047Germany2026-05-27
1048France2026-05-17
1049Italy2026-05-18

On-Demand Data

NameIdCountryDate
Greenwood Bolognia1000United Kingdom2026-05-20
Cody Saylors1001Russia2026-05-16
Misaki Royster1002Australia2026-05-28
Juan Wieser1003Canada2026-06-04
Tony Foller1004Germany2026-06-09
Jennifer Amigon1005India2026-06-08
Faith Gillian1006Japan2026-05-25
Julie Stenseth1007Italy2026-06-04
Sinclair Waycott1008Japan2026-06-06
Jennifer Amigon1009United Kingdom2026-05-19
Silvio Slusarski1010Russia2026-05-23
David Darakjy1011Germany2026-05-16
Antonio Caudy1012Japan2026-06-06
David Darakjy1013Germany2026-05-20
Emily Whobrey1014Italy2026-05-25
Leon Oldroyd1015Australia2026-06-10
Claire Tollner1016France2026-05-31
Silvio Slusarski1017France2026-05-14
James Butt1018India2026-05-18
Jefferson Schemmer1019Australia2026-06-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Isabel BowleyCanadaElwin Sharvill NEW
Sinclair WaycottCanadaXuxue Feng NEGOTIATION
Antonio CaudyGermanyAmy Elsner PROPOSAL
Rodrigues CampainRussiaBernardo Dominic QUALIFIED
Murillo MaletIndiaElwin Sharvill NEGOTIATION
Arvin AlbaresCanadaOnyama Limba RENEWAL
Costa DilliardUnited KingdomIoni Bowcher RENEWAL
Faith GillianBrazilAnna Fali NEGOTIATION
Clifford RimRussiaAnna Fali NEW
Sinclair WaycottUnited KingdomElwin Sharvill NEGOTIATION
Aditya KuskoUnited KingdomOnyama Limba RENEWAL
Adams MorascaCanadaIoni Bowcher RENEWAL
Chavez BriddickFranceIvan Magalhaes PROPOSAL
Maria MarrierCanadaElwin Sharvill RENEWAL
Greenwood BologniaItalyStephen Shaw PROPOSAL
Chavez BriddickJapanIvan Magalhaes NEW
Faith GillianJapanStephen Shaw NEGOTIATION
Stacey MacleadSpainXuxue Feng NEW
Ashley DoeArgentinaElwin Sharvill NEGOTIATION
Adams MorascaUnited KingdomAmy Elsner NEW
Johnson SergiJapanIvan Magalhaes PROPOSAL
Alejandro PerinRussiaAmy Elsner PROPOSAL
Emily WhobreyItalyAmy Elsner UNQUALIFIED
Wickens NestleSpainOnyama Limba PROPOSAL
Deepesh ChuiIndiaAsiya Javayant NEW
Mayumi KolmetzJapanElwin Sharvill QUALIFIED
Maria MarrierGermanyAmy Elsner UNQUALIFIED
Wickens NestleBrazilXuxue Feng PROPOSAL
Arvin AlbaresUnited KingdomXuxue Feng PROPOSAL
Izzy GarufiRussiaOnyama Limba NEGOTIATION
Murillo MaletCanadaOnyama Limba QUALIFIED
Deepesh ChuiCanadaIoni Bowcher QUALIFIED
Julie StensethRussiaXuxue Feng NEW
Salvatore StockhamJapanIvan Magalhaes NEW
Chavez BriddickSpainAnna Fali UNQUALIFIED
Tony FollerArgentinaAmy Elsner NEGOTIATION
Leon OldroydArgentinaIvan Magalhaes RENEWAL
Antonio CaudyUnited KingdomOnyama Limba NEGOTIATION
David DarakjyUnited KingdomIoni Bowcher NEGOTIATION
Wickens NestleItalyAmy Elsner 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>