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
Antonio CaudySpainElwin Sharvill QUALIFIED
Ivar PaprockiUnited KingdomAsiya Javayant NEGOTIATION
Silvio SlusarskiBrazilAsiya Javayant QUALIFIED
Greenwood BologniaBrazilAnna Fali UNQUALIFIED
Isabel BowleyAustraliaElwin Sharvill UNQUALIFIED
Deepesh ChuiGermanyAsiya Javayant NEW
Ricardo GauchoItalyAmy Elsner NEW
Ivar PaprockiRussiaAmy Elsner PROPOSAL
David DarakjySpainXuxue Feng PROPOSAL
Izzy GarufiUnited KingdomBernardo Dominic UNQUALIFIED
Leja CaldareraUnited KingdomAnna Fali NEW
Darci PoquetteArgentinaElwin Sharvill RENEWAL
Jones VocelkaSpainBernardo Dominic PROPOSAL
Izzy GarufiArgentinaStephen Shaw PROPOSAL
Rodrigues CampainCanadaOnyama Limba RENEWAL
Chavez BriddickFranceAsiya Javayant NEW
Isabel BowleySpainStephen Shaw RENEWAL
Maisha RulapaughGermanyIvan Magalhaes PROPOSAL
Isabel BowleyItalyXuxue Feng QUALIFIED
Kadeem FlosiCanadaAsiya Javayant QUALIFIED
Mujtaba NickaIndiaBernardo Dominic PROPOSAL
Jefferson SchemmerUnited KingdomAmy Elsner QUALIFIED
Jeanfrancois VenereSpainAsiya Javayant NEW
Stacey MacleadAustraliaAsiya Javayant NEW
Murillo MaletSpainStephen Shaw UNQUALIFIED
Mujtaba NickaGermanyIoni Bowcher RENEWAL
Juan WieserArgentinaAmy Elsner NEGOTIATION
Mayumi KolmetzBrazilAsiya Javayant QUALIFIED
Octavia MaletJapanAsiya Javayant RENEWAL
Leja CaldareraRussiaIvan Magalhaes NEW
Darci PoquetteRussiaStephen Shaw QUALIFIED
Ivar PaprockiGermanyStephen Shaw QUALIFIED
Cody SaylorsUnited KingdomAmy Elsner QUALIFIED
Jefferson SchemmerCanadaAmy Elsner NEGOTIATION
Sinclair WaycottRussiaIvan Magalhaes UNQUALIFIED
Darci PoquetteItalyElwin Sharvill NEGOTIATION
Izzy GarufiCanadaAnna Fali PROPOSAL
Rodrigues CampainUnited KingdomAsiya Javayant NEGOTIATION
Leon OldroydItalyIoni Bowcher PROPOSAL
Leon OldroydArgentinaBernardo Dominic PROPOSAL
Mayumi KolmetzItalyIvan Magalhaes RENEWAL
Emily WhobreySpainStephen Shaw UNQUALIFIED
Jeanfrancois VenereCanadaAsiya Javayant QUALIFIED
Stacey MacleadUnited KingdomAmy Elsner NEGOTIATION
Jones VocelkaAustraliaStephen Shaw UNQUALIFIED
Ivar PaprockiUnited KingdomIoni Bowcher RENEWAL
Leja CaldareraJapanIvan Magalhaes PROPOSAL
Sinclair WaycottIndiaStephen Shaw RENEWAL
Greenwood BologniaFranceElwin Sharvill UNQUALIFIED
Leja CaldareraFranceAmy Elsner QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Octavia MaletGermanyIvan Magalhaes QUALIFIED
Leon OldroydRussiaOnyama Limba NEGOTIATION
Ashley DoeItalyIvan Magalhaes PROPOSAL
Octavia MaletArgentinaXuxue Feng RENEWAL
Isabel BowleyCanadaIoni Bowcher NEGOTIATION
Antonio CaudyFranceElwin Sharvill NEW
Faith GillianJapanBernardo Dominic QUALIFIED
Aditya KuskoSpainStephen Shaw NEGOTIATION
Emily WhobreyJapanIvan Magalhaes NEGOTIATION
Sinclair WaycottJapanXuxue Feng QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Claire TollnerCanada2025-10-05Buckley Miller Wright PROPOSAL87Anna Fali
1001Aditya KuskoAustralia2025-10-10Dorl, James J Esq NEGOTIATION4Elwin Sharvill
1002Mujtaba NickaCanada2025-09-23Chemel, James L Cpa UNQUALIFIED46Onyama Limba
1003Kadeem FlosiUnited Kingdom2025-10-11Chapman, Ross E Esq NEW68Elwin Sharvill
1004Leon OldroydArgentina2025-10-17Truhlar And Truhlar Attys UNQUALIFIED60Elwin Sharvill
1005Chavez BriddickRussia2025-10-02Commercial Press RENEWAL38Stephen Shaw
1006James ButtArgentina2025-10-06Chanay, Jeffrey A Esq NEW72Bernardo Dominic
1007Smith GlickUnited Kingdom2025-09-19Truhlar And Truhlar Attys NEGOTIATION96Stephen Shaw
1008Jones VocelkaBrazil2025-10-16Rangoni Of Florence UNQUALIFIED23Amy Elsner
1009Silvio SlusarskiCanada2025-10-16Benton, John B Jr NEW13Bernardo Dominic
1010James ButtUnited Kingdom2025-09-22Printing Dimensions NEGOTIATION76Amy Elsner
1011Juan WieserJapan2025-10-16King, Christopher A Esq RENEWAL62Anna Fali
1012Adams MorascaUnited Kingdom2025-10-12Truhlar And Truhlar Attys NEW55Stephen Shaw
1013Izzy GarufiAustralia2025-10-05Commercial Press NEW5Anna Fali
1014Smith GlickSpain2025-09-30Buckley Miller Wright QUALIFIED72Onyama Limba
1015James ButtAustralia2025-09-28Commercial Press PROPOSAL17Ivan Magalhaes
1016Isabel BowleyRussia2025-09-27Printing Dimensions NEW34Elwin Sharvill
1017Francesco ShinkoArgentina2025-09-23Chapman, Ross E Esq PROPOSAL80Bernardo Dominic
1018Cody SaylorsItaly2025-10-17Buckley Miller Wright RENEWAL44Xuxue Feng
1019Sinclair WaycottIndia2025-09-29Rousseaux, Michael Esq NEW69Amy Elsner
1020Chavez BriddickBrazil2025-10-05Feltz Printing Service NEW84Amy Elsner
1021David DarakjyFrance2025-09-24Feiner Bros NEGOTIATION28Stephen Shaw
1022Jefferson SchemmerCanada2025-10-10Feiner Bros UNQUALIFIED38Elwin Sharvill
1023Morrow RutaIndia2025-10-05Dorl, James J Esq PROPOSAL68Stephen Shaw
1024Greenwood BologniaItaly2025-09-20Truhlar And Truhlar Attys RENEWAL10Amy Elsner
1025Faith GillianBrazil2025-10-03Chemel, James L Cpa NEW47Ivan Magalhaes
1026Aditya KuskoBrazil2025-10-09Chapman, Ross E Esq NEW61Ivan Magalhaes
1027Misaki RoysterSpain2025-10-04Morlong Associates PROPOSAL49Asiya Javayant
1028Silvio SlusarskiFrance2025-10-06Chapman, Ross E Esq NEW4Elwin Sharvill
1029Stacey MacleadGermany2025-10-09Chapman, Ross E Esq NEGOTIATION90Stephen Shaw
1030Johnson SergiItaly2025-10-01Rangoni Of Florence RENEWAL76Anna Fali
1031Juan WieserFrance2025-09-25Printing Dimensions PROPOSAL30Ioni Bowcher
1032Aruna FigeroaRussia2025-09-21Rousseaux, Michael Esq UNQUALIFIED78Amy Elsner
1033Greenwood BologniaArgentina2025-10-04Rangoni Of Florence NEGOTIATION15Bernardo Dominic
1034Alejandro PerinUnited Kingdom2025-10-12Buckley Miller Wright NEGOTIATION29Ioni Bowcher
1035Julie StensethIndia2025-09-29Chanay, Jeffrey A Esq NEW78Ioni Bowcher
1036Johnson SergiFrance2025-10-09Printing Dimensions RENEWAL91Xuxue Feng
1037Leja CaldareraCanada2025-10-03Chemel, James L Cpa PROPOSAL93Asiya Javayant
1038Greenwood BologniaItaly2025-09-20Chemel, James L Cpa RENEWAL14Ioni Bowcher
1039Aika InouyeJapan2025-10-02Feiner Bros PROPOSAL12Anna Fali
1040Aditya KuskoBrazil2025-09-25Rousseaux, Michael Esq NEGOTIATION20Anna Fali
1041Leon OldroydRussia2025-10-07Buckley Miller Wright RENEWAL66Bernardo Dominic
1042Izzy GarufiAustralia2025-10-08King, Christopher A Esq NEGOTIATION39Stephen Shaw
1043Julie StensethSpain2025-09-21Feltz Printing Service UNQUALIFIED10Xuxue Feng
1044Faith GillianItaly2025-09-23Chanay, Jeffrey A Esq QUALIFIED41Ioni Bowcher
1045Salvatore StockhamFrance2025-10-17Truhlar And Truhlar Attys NEGOTIATION62Ioni Bowcher
1046Faith GillianIndia2025-09-20Chemel, James L Cpa NEW20Stephen Shaw
1047Adams MorascaBrazil2025-10-16Chanay, Jeffrey A Esq PROPOSAL42Bernardo Dominic
1048Johnson SergiSpain2025-10-17Chanay, Jeffrey A Esq NEW78Xuxue Feng
1049Mayumi KolmetzBrazil2025-10-06Buckley Miller Wright NEW38Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Faith GillianUnited KingdomAmy Elsner PROPOSAL
Octavia MaletRussiaXuxue Feng NEGOTIATION
Kaitlin OstroskyGermanyXuxue Feng RENEWAL
Chavez BriddickJapanOnyama Limba PROPOSAL
Silvio SlusarskiSpainAsiya Javayant RENEWAL
Munro FerenczBrazilAnna Fali UNQUALIFIED
Ashley DoeSpainIvan Magalhaes NEGOTIATION
Antonio CaudyItalyStephen Shaw QUALIFIED
Sinclair WaycottUnited KingdomAmy Elsner PROPOSAL
Mujtaba NickaCanadaBernardo Dominic NEW
Tony FollerFranceAmy Elsner RENEWAL
Morrow RutaIndiaIoni Bowcher QUALIFIED
Murillo MaletFranceBernardo Dominic PROPOSAL
Isabel BowleyGermanyElwin Sharvill QUALIFIED
Claire TollnerJapanOnyama Limba NEGOTIATION
Kadeem FlosiSpainOnyama Limba NEGOTIATION
Kadeem FlosiCanadaElwin Sharvill NEGOTIATION
Julie StensethCanadaIvan Magalhaes PROPOSAL
Juan WieserAustraliaAsiya Javayant PROPOSAL
Kadeem FlosiJapanAnna Fali NEW
Leja CaldareraCanadaStephen Shaw NEGOTIATION
Isabel BowleyRussiaIvan Magalhaes PROPOSAL
Kaitlin OstroskyJapanAnna Fali QUALIFIED
Antonio CaudyArgentinaBernardo Dominic NEW
Cody SaylorsSpainElwin Sharvill NEGOTIATION
Kaitlin OstroskyJapanOnyama Limba PROPOSAL
Smith GlickAustraliaAnna Fali UNQUALIFIED
Mayumi KolmetzGermanyStephen Shaw QUALIFIED
Silvio SlusarskiUnited KingdomAsiya Javayant NEW
Clifford RimSpainIoni Bowcher QUALIFIED
Darci PoquetteAustraliaAnna Fali NEW
Smith GlickBrazilAnna Fali QUALIFIED
Jennifer AmigonGermanyBernardo Dominic NEGOTIATION
Johnson SergiSpainIoni Bowcher NEW
Mayumi KolmetzRussiaAmy Elsner RENEWAL
Sinclair WaycottAustraliaAnna Fali UNQUALIFIED
Johnson SergiUnited KingdomAmy Elsner NEW
Maria MarrierGermanyXuxue Feng NEGOTIATION
Claire TollnerAustraliaAmy Elsner QUALIFIED
Rodrigues CampainUnited KingdomXuxue Feng NEW
Adams MorascaGermanyElwin Sharvill NEGOTIATION
Rodrigues CampainItalyElwin Sharvill UNQUALIFIED
Emily WhobreySpainIvan Magalhaes PROPOSAL
Kadeem FlosiGermanyElwin Sharvill NEW
Cody SaylorsAustraliaXuxue Feng RENEWAL
Deepesh ChuiArgentinaElwin Sharvill NEW
Aika InouyeItalyAmy Elsner UNQUALIFIED
Greenwood BologniaSpainAsiya Javayant NEGOTIATION
Rodrigues CampainUnited KingdomAmy Elsner PROPOSAL
Costa DilliardJapanElwin Sharvill RENEWAL
Frozen Columns
Name
Sinclair Waycott
Munro Ferencz
Leja Caldarera
Sinclair Waycott
Wickens Nestle
Munro Ferencz
Alejandro Perin
Sinclair Waycott
Jefferson Schemmer
Munro Ferencz
Darci Poquette
Aruna Figeroa
Rodrigues Campain
Rodrigues Campain
Emily Whobrey
Maisha Rulapaugh
Tony Foller
Nicolas Iturbide
Misaki Royster
Jennifer Amigon
Costa Dilliard
Darci Poquette
Misaki Royster
Aditya Kusko
Smith Glick
Ashley Doe
Jeanfrancois Venere
Antonio Caudy
Silvio Slusarski
Ivar Paprocki
Francesco Shinko
Jeanfrancois Venere
Murillo Malet
Mujtaba Nicka
Wickens Nestle
Maisha Rulapaugh
Smith Glick
Ashley Doe
Francesco Shinko
Aika Inouye
Smith Glick
Rodrigues Campain
Leon Oldroyd
Silvio Slusarski
Smith Glick
Misaki Royster
Francesco Shinko
Faith Gillian
Jennifer Amigon
Mayumi Kolmetz
IdCountryDate
1000Canada2025-10-15
1001Canada2025-10-05
1002Germany2025-10-13
1003Japan2025-10-01
1004Germany2025-10-13
1005Argentina2025-10-17
1006Spain2025-10-16
1007United Kingdom2025-09-27
1008Australia2025-09-29
1009Spain2025-10-16
1010Spain2025-09-29
1011Canada2025-10-03
1012Canada2025-10-14
1013Germany2025-09-28
1014United Kingdom2025-09-23
1015Argentina2025-09-26
1016Brazil2025-09-30
1017India2025-10-05
1018United Kingdom2025-09-25
1019Germany2025-10-15
1020Italy2025-09-22
1021India2025-10-10
1022Spain2025-10-04
1023Italy2025-10-10
1024Argentina2025-09-28
1025India2025-09-30
1026Japan2025-09-25
1027France2025-10-06
1028Germany2025-10-03
1029Spain2025-09-21
1030United Kingdom2025-09-28
1031Russia2025-09-22
1032Italy2025-09-27
1033United Kingdom2025-10-11
1034Brazil2025-09-19
1035Japan2025-10-11
1036Germany2025-10-12
1037Australia2025-10-07
1038Japan2025-10-04
1039India2025-10-04
1040Russia2025-09-19
1041United Kingdom2025-09-19
1042United Kingdom2025-10-04
1043Italy2025-10-11
1044Germany2025-10-09
1045Brazil2025-10-14
1046Spain2025-10-03
1047France2025-09-29
1048Australia2025-10-10
1049France2025-09-26

On-Demand Data

NameIdCountryDate
Ashley Doe1000Australia2025-09-21
Jones Vocelka1001Canada2025-09-21
Ivar Paprocki1002France2025-10-01
Aruna Figeroa1003Australia2025-10-18
Adams Morasca1004India2025-10-10
Smith Glick1005Canada2025-10-02
Maria Marrier1006Argentina2025-10-08
Octavia Malet1007Russia2025-10-02
Octavia Malet1008Japan2025-09-22
Alejandro Perin1009France2025-10-07
Mayumi Kolmetz1010Argentina2025-10-11
Johnson Sergi1011Russia2025-09-19
Leon Oldroyd1012Brazil2025-09-24
Nicolas Iturbide1013Japan2025-10-03
Tony Foller1014India2025-10-12
Ivar Paprocki1015Germany2025-10-17
Ivar Paprocki1016France2025-09-28
Faith Gillian1017Germany2025-10-01
Emily Whobrey1018Brazil2025-09-26
Antonio Caudy1019Argentina2025-09-20
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Mayumi KolmetzRussiaStephen Shaw QUALIFIED
Isabel BowleyUnited KingdomOnyama Limba PROPOSAL
Adams MorascaJapanElwin Sharvill NEW
Claire TollnerGermanyIvan Magalhaes NEGOTIATION
Misaki RoysterRussiaXuxue Feng NEW
Kadeem FlosiItalyXuxue Feng PROPOSAL
Jones VocelkaCanadaElwin Sharvill RENEWAL
Sinclair WaycottFranceBernardo Dominic NEGOTIATION
Aika InouyeJapanAmy Elsner PROPOSAL
Johnson SergiGermanyBernardo Dominic UNQUALIFIED
Salvatore StockhamFranceXuxue Feng NEW
Munro FerenczBrazilAmy Elsner NEW
Aika InouyeGermanyAsiya Javayant RENEWAL
Arvin AlbaresCanadaIvan Magalhaes NEGOTIATION
Stacey MacleadCanadaAnna Fali UNQUALIFIED
Alejandro PerinCanadaBernardo Dominic QUALIFIED
Greenwood BologniaCanadaIoni Bowcher NEGOTIATION
Jones VocelkaBrazilIoni Bowcher NEGOTIATION
Alejandro PerinRussiaElwin Sharvill QUALIFIED
Stacey MacleadJapanAmy Elsner PROPOSAL
Nicolas IturbideJapanElwin Sharvill NEW
Juan WieserAustraliaBernardo Dominic NEGOTIATION
Adams MorascaSpainElwin Sharvill PROPOSAL
Mujtaba NickaRussiaIoni Bowcher UNQUALIFIED
Jennifer AmigonSpainAsiya Javayant PROPOSAL
Ivar PaprockiJapanElwin Sharvill UNQUALIFIED
Morrow RutaArgentinaIoni Bowcher QUALIFIED
Izzy GarufiUnited KingdomXuxue Feng RENEWAL
Francesco ShinkoArgentinaStephen Shaw NEGOTIATION
Arvin AlbaresCanadaXuxue Feng RENEWAL
Smith GlickRussiaElwin Sharvill QUALIFIED
Wickens NestleArgentinaElwin Sharvill RENEWAL
Isabel BowleyUnited KingdomXuxue Feng RENEWAL
Ricardo GauchoAustraliaIvan Magalhaes UNQUALIFIED
Ricardo GauchoFranceBernardo Dominic NEW
Izzy GarufiUnited KingdomStephen Shaw UNQUALIFIED
Leon OldroydJapanBernardo Dominic UNQUALIFIED
Rodrigues CampainBrazilElwin Sharvill RENEWAL
James ButtGermanyBernardo Dominic UNQUALIFIED
Sinclair WaycottItalyAsiya Javayant QUALIFIED

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