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
James ButtRussiaAmy Elsner NEW
Leja CaldareraIndiaAsiya Javayant NEW
Julie StensethAustraliaStephen Shaw PROPOSAL
Adams MorascaBrazilAmy Elsner RENEWAL
David DarakjyUnited KingdomStephen Shaw NEGOTIATION
Greenwood BologniaGermanyAnna Fali RENEWAL
Leon OldroydItalyIvan Magalhaes UNQUALIFIED
Wickens NestleItalyAnna Fali NEW
Francesco ShinkoFranceAsiya Javayant QUALIFIED
Isabel BowleyArgentinaStephen Shaw RENEWAL
Johnson SergiJapanBernardo Dominic NEGOTIATION
Jefferson SchemmerIndiaIoni Bowcher PROPOSAL
Ricardo GauchoItalyElwin Sharvill UNQUALIFIED
Wickens NestleIndiaAnna Fali NEGOTIATION
Aika InouyeJapanElwin Sharvill NEW
Stacey MacleadUnited KingdomAnna Fali UNQUALIFIED
Aruna FigeroaUnited KingdomOnyama Limba PROPOSAL
Octavia MaletRussiaIvan Magalhaes PROPOSAL
James ButtAustraliaAsiya Javayant NEGOTIATION
Chavez BriddickIndiaElwin Sharvill NEGOTIATION
Mujtaba NickaFranceAnna Fali QUALIFIED
Smith GlickUnited KingdomAnna Fali QUALIFIED
Aditya KuskoIndiaBernardo Dominic NEGOTIATION
Deepesh ChuiBrazilElwin Sharvill RENEWAL
Julie StensethGermanyElwin Sharvill RENEWAL
Izzy GarufiItalyIoni Bowcher RENEWAL
Munro FerenczArgentinaAsiya Javayant RENEWAL
Isabel BowleyFranceBernardo Dominic RENEWAL
Chavez BriddickBrazilAnna Fali NEW
Nicolas IturbideJapanAmy Elsner UNQUALIFIED
Leon OldroydSpainStephen Shaw NEGOTIATION
Misaki RoysterIndiaXuxue Feng RENEWAL
Morrow RutaUnited KingdomElwin Sharvill QUALIFIED
Munro FerenczIndiaIvan Magalhaes NEGOTIATION
Kaitlin OstroskyArgentinaAmy Elsner NEGOTIATION
Salvatore StockhamIndiaAnna Fali NEGOTIATION
Maria MarrierRussiaOnyama Limba RENEWAL
Jennifer AmigonArgentinaIvan Magalhaes UNQUALIFIED
Greenwood BologniaItalyXuxue Feng QUALIFIED
Johnson SergiIndiaAsiya Javayant UNQUALIFIED
James ButtUnited KingdomOnyama Limba NEW
Aruna FigeroaSpainXuxue Feng NEGOTIATION
Leja CaldareraSpainAsiya Javayant NEW
Johnson SergiRussiaElwin Sharvill QUALIFIED
Wickens NestleCanadaAnna Fali NEGOTIATION
Cody SaylorsUnited KingdomBernardo Dominic RENEWAL
Julie StensethArgentinaOnyama Limba QUALIFIED
Jones VocelkaGermanyAnna Fali QUALIFIED
Aruna FigeroaCanadaIoni Bowcher QUALIFIED
Munro FerenczArgentinaAnna Fali NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Kadeem FlosiBrazilAmy Elsner NEW
Greenwood BologniaIndiaAmy Elsner NEW
Ashley DoeArgentinaElwin Sharvill QUALIFIED
Jefferson SchemmerAustraliaBernardo Dominic NEW
Alejandro PerinGermanyIvan Magalhaes UNQUALIFIED
Maria MarrierUnited KingdomAnna Fali NEGOTIATION
Darci PoquetteSpainIvan Magalhaes NEGOTIATION
Kadeem FlosiRussiaBernardo Dominic NEGOTIATION
Rodrigues CampainUnited KingdomAmy Elsner PROPOSAL
Leja CaldareraJapanXuxue Feng RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Darci PoquetteUnited Kingdom2025-08-03Benton, John B Jr NEGOTIATION79Stephen Shaw
1001Mujtaba NickaIndia2025-07-21Chemel, James L Cpa NEGOTIATION9Anna Fali
1002Antonio CaudyFrance2025-07-31Chanay, Jeffrey A Esq NEGOTIATION24Anna Fali
1003Stacey MacleadFrance2025-07-28Benton, John B Jr RENEWAL60Anna Fali
1004Stacey MacleadGermany2025-08-15Buckley Miller Wright NEW61Bernardo Dominic
1005Isabel BowleyArgentina2025-07-30Chemel, James L Cpa RENEWAL59Anna Fali
1006David DarakjyIndia2025-07-22Dorl, James J Esq RENEWAL98Asiya Javayant
1007Octavia MaletJapan2025-07-28Rangoni Of Florence NEGOTIATION66Ivan Magalhaes
1008Clifford RimRussia2025-07-25Morlong Associates NEGOTIATION68Ioni Bowcher
1009Kaitlin OstroskyIndia2025-07-31Rangoni Of Florence UNQUALIFIED1Xuxue Feng
1010Faith GillianJapan2025-07-29Buckley Miller Wright RENEWAL7Xuxue Feng
1011Alejandro PerinCanada2025-08-08Printing Dimensions NEGOTIATION79Stephen Shaw
1012Adams MorascaJapan2025-08-13Feltz Printing Service QUALIFIED56Elwin Sharvill
1013Ivar PaprockiUnited Kingdom2025-07-23Chapman, Ross E Esq NEW73Ivan Magalhaes
1014Antonio CaudyGermany2025-07-28Feltz Printing Service PROPOSAL7Stephen Shaw
1015Jones VocelkaBrazil2025-08-01Benton, John B Jr RENEWAL92Bernardo Dominic
1016Juan WieserJapan2025-08-05Feltz Printing Service PROPOSAL88Ivan Magalhaes
1017Claire TollnerJapan2025-08-06Morlong Associates NEW25Amy Elsner
1018Aruna FigeroaBrazil2025-07-26Morlong Associates UNQUALIFIED28Bernardo Dominic
1019Aruna FigeroaIndia2025-08-12Chapman, Ross E Esq UNQUALIFIED22Stephen Shaw
1020Sinclair WaycottJapan2025-08-03Morlong Associates RENEWAL61Stephen Shaw
1021Antonio CaudyArgentina2025-08-13Rangoni Of Florence NEW53Elwin Sharvill
1022Darci PoquetteRussia2025-07-21Printing Dimensions NEW50Ivan Magalhaes
1023Adams MorascaBrazil2025-07-29Chapman, Ross E Esq RENEWAL14Stephen Shaw
1024Aditya KuskoArgentina2025-08-01Chemel, James L Cpa QUALIFIED35Elwin Sharvill
1025Leja CaldareraItaly2025-07-25Dorl, James J Esq QUALIFIED88Elwin Sharvill
1026Jeanfrancois VenereItaly2025-07-20Chanay, Jeffrey A Esq QUALIFIED67Onyama Limba
1027Jefferson SchemmerAustralia2025-08-06Dorl, James J Esq RENEWAL70Amy Elsner
1028Deepesh ChuiGermany2025-07-30Rousseaux, Michael Esq PROPOSAL98Anna Fali
1029Munro FerenczCanada2025-08-03Truhlar And Truhlar Attys PROPOSAL69Onyama Limba
1030Darci PoquetteAustralia2025-08-15Chanay, Jeffrey A Esq UNQUALIFIED75Stephen Shaw
1031Octavia MaletBrazil2025-07-23Chapman, Ross E Esq NEGOTIATION10Bernardo Dominic
1032Isabel BowleyFrance2025-07-28Chapman, Ross E Esq QUALIFIED97Onyama Limba
1033Aika InouyeBrazil2025-08-17Chemel, James L Cpa UNQUALIFIED29Xuxue Feng
1034Emily WhobreyItaly2025-08-12Chanay, Jeffrey A Esq NEGOTIATION92Xuxue Feng
1035Chavez BriddickItaly2025-08-18Buckley Miller Wright UNQUALIFIED19Ivan Magalhaes
1036Kadeem FlosiCanada2025-07-24Commercial Press RENEWAL21Ioni Bowcher
1037Maria MarrierJapan2025-07-31Chemel, James L Cpa NEGOTIATION79Bernardo Dominic
1038Mujtaba NickaGermany2025-08-14Rangoni Of Florence UNQUALIFIED37Ioni Bowcher
1039Jeanfrancois VenereUnited Kingdom2025-08-17Chanay, Jeffrey A Esq QUALIFIED15Ivan Magalhaes
1040Francesco ShinkoCanada2025-08-02King, Christopher A Esq NEW94Xuxue Feng
1041Adams MorascaSpain2025-08-02Truhlar And Truhlar Attys NEGOTIATION16Stephen Shaw
1042James ButtFrance2025-07-25Commercial Press QUALIFIED64Onyama Limba
1043Clifford RimUnited Kingdom2025-08-02Truhlar And Truhlar Attys NEGOTIATION89Onyama Limba
1044Nicolas IturbideAustralia2025-08-13Chemel, James L Cpa NEGOTIATION44Asiya Javayant
1045Arvin AlbaresCanada2025-08-08Rousseaux, Michael Esq NEGOTIATION77Xuxue Feng
1046Aditya KuskoItaly2025-07-25Feltz Printing Service RENEWAL56Ivan Magalhaes
1047Cody SaylorsCanada2025-08-04Feiner Bros PROPOSAL71Xuxue Feng
1048Sinclair WaycottGermany2025-07-30Morlong Associates PROPOSAL5Asiya Javayant
1049Murillo MaletItaly2025-07-22Chanay, Jeffrey A Esq NEGOTIATION9Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Kaitlin OstroskyJapanIoni Bowcher QUALIFIED
Nicolas IturbideSpainBernardo Dominic NEW
Morrow RutaJapanIvan Magalhaes NEGOTIATION
Faith GillianUnited KingdomStephen Shaw RENEWAL
James ButtIndiaAmy Elsner NEGOTIATION
Arvin AlbaresFranceAnna Fali PROPOSAL
Smith GlickArgentinaIoni Bowcher PROPOSAL
Leja CaldareraItalyStephen Shaw NEW
Jennifer AmigonIndiaAnna Fali NEW
Aruna FigeroaAustraliaAmy Elsner PROPOSAL
Silvio SlusarskiIndiaBernardo Dominic PROPOSAL
Jeanfrancois VenereUnited KingdomElwin Sharvill UNQUALIFIED
Wickens NestleJapanElwin Sharvill QUALIFIED
Morrow RutaUnited KingdomElwin Sharvill NEGOTIATION
Clifford RimGermanyBernardo Dominic RENEWAL
Ivar PaprockiAustraliaAmy Elsner QUALIFIED
Chavez BriddickItalyIvan Magalhaes PROPOSAL
Jefferson SchemmerFranceIvan Magalhaes PROPOSAL
Munro FerenczJapanOnyama Limba UNQUALIFIED
Cody SaylorsIndiaBernardo Dominic RENEWAL
Francesco ShinkoGermanyIoni Bowcher NEW
Aruna FigeroaJapanBernardo Dominic PROPOSAL
Jennifer AmigonRussiaBernardo Dominic RENEWAL
Julie StensethUnited KingdomElwin Sharvill PROPOSAL
Misaki RoysterRussiaXuxue Feng PROPOSAL
Silvio SlusarskiJapanAnna Fali NEGOTIATION
Arvin AlbaresUnited KingdomAsiya Javayant RENEWAL
Isabel BowleyFranceIvan Magalhaes QUALIFIED
Maria MarrierIndiaOnyama Limba RENEWAL
Arvin AlbaresItalyXuxue Feng NEGOTIATION
Stacey MacleadJapanStephen Shaw RENEWAL
Jones VocelkaCanadaIvan Magalhaes NEGOTIATION
Nicolas IturbideItalyXuxue Feng QUALIFIED
Clifford RimUnited KingdomIvan Magalhaes QUALIFIED
Salvatore StockhamIndiaAmy Elsner NEW
Izzy GarufiGermanyElwin Sharvill QUALIFIED
Costa DilliardRussiaXuxue Feng QUALIFIED
Deepesh ChuiCanadaAnna Fali UNQUALIFIED
Emily WhobreyArgentinaBernardo Dominic NEW
Stacey MacleadArgentinaStephen Shaw NEW
Arvin AlbaresItalyAsiya Javayant RENEWAL
Deepesh ChuiRussiaAnna Fali NEGOTIATION
James ButtCanadaElwin Sharvill UNQUALIFIED
Faith GillianUnited KingdomIoni Bowcher NEW
Deepesh ChuiAustraliaAmy Elsner UNQUALIFIED
Ricardo GauchoFranceOnyama Limba UNQUALIFIED
Antonio CaudyGermanyBernardo Dominic NEGOTIATION
Francesco ShinkoIndiaAmy Elsner NEGOTIATION
Leja CaldareraBrazilElwin Sharvill RENEWAL
Mujtaba NickaIndiaIoni Bowcher UNQUALIFIED
Frozen Columns
Name
Aruna Figeroa
Mayumi Kolmetz
Aika Inouye
Silvio Slusarski
Ricardo Gaucho
Ashley Doe
Emily Whobrey
Cody Saylors
Mayumi Kolmetz
Ashley Doe
Kaitlin Ostrosky
Maria Marrier
Leon Oldroyd
Arvin Albares
Alejandro Perin
Mujtaba Nicka
Munro Ferencz
Morrow Ruta
Antonio Caudy
Deepesh Chui
Wickens Nestle
Claire Tollner
Munro Ferencz
Mujtaba Nicka
Maria Marrier
Clifford Rim
Aruna Figeroa
James Butt
Claire Tollner
James Butt
Sinclair Waycott
Mujtaba Nicka
Adams Morasca
Octavia Malet
Ashley Doe
James Butt
Maria Marrier
Jeanfrancois Venere
Mujtaba Nicka
Wickens Nestle
Deepesh Chui
Misaki Royster
Munro Ferencz
Jones Vocelka
Ricardo Gaucho
James Butt
Misaki Royster
Izzy Garufi
Faith Gillian
Munro Ferencz
IdCountryDate
1000United Kingdom2025-07-24
1001Spain2025-07-27
1002India2025-08-10
1003United Kingdom2025-08-14
1004Canada2025-08-01
1005Japan2025-08-13
1006Russia2025-08-16
1007Germany2025-08-17
1008India2025-08-09
1009Japan2025-07-25
1010India2025-08-17
1011United Kingdom2025-07-26
1012France2025-07-21
1013Brazil2025-08-12
1014Italy2025-08-08
1015United Kingdom2025-07-20
1016Russia2025-08-01
1017India2025-08-14
1018Canada2025-08-16
1019Italy2025-08-07
1020Italy2025-08-03
1021Brazil2025-08-16
1022France2025-08-11
1023Russia2025-08-08
1024Canada2025-07-21
1025Canada2025-08-05
1026Argentina2025-08-09
1027Brazil2025-07-29
1028Argentina2025-08-05
1029Canada2025-07-22
1030Canada2025-08-12
1031Brazil2025-08-14
1032Australia2025-08-08
1033Germany2025-08-04
1034France2025-07-24
1035Japan2025-07-23
1036Spain2025-08-10
1037United Kingdom2025-08-15
1038Brazil2025-08-12
1039France2025-07-25
1040Russia2025-08-06
1041France2025-08-01
1042United Kingdom2025-08-11
1043Brazil2025-07-26
1044India2025-07-27
1045India2025-08-18
1046France2025-07-27
1047Japan2025-08-09
1048Spain2025-07-26
1049Italy2025-08-17

On-Demand Data

NameIdCountryDate
Morrow Ruta1000Argentina2025-08-04
Morrow Ruta1001India2025-07-31
Ricardo Gaucho1002Australia2025-07-27
Wickens Nestle1003France2025-08-15
Nicolas Iturbide1004Brazil2025-08-03
Izzy Garufi1005Canada2025-07-22
Ashley Doe1006Spain2025-08-02
Ashley Doe1007Brazil2025-08-13
Rodrigues Campain1008United Kingdom2025-07-22
Ricardo Gaucho1009Brazil2025-08-17
Silvio Slusarski1010Germany2025-08-11
Julie Stenseth1011France2025-08-04
Wickens Nestle1012Germany2025-08-09
Mayumi Kolmetz1013Russia2025-08-10
Stacey Maclead1014Spain2025-07-26
Wickens Nestle1015Argentina2025-07-25
Aruna Figeroa1016Spain2025-08-12
Mujtaba Nicka1017Italy2025-07-28
Francesco Shinko1018Japan2025-07-24
Juan Wieser1019Russia2025-07-30
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Clifford RimJapanAsiya Javayant QUALIFIED
Ashley DoeRussiaAnna Fali NEW
Julie StensethGermanyXuxue Feng UNQUALIFIED
Octavia MaletArgentinaAsiya Javayant UNQUALIFIED
Adams MorascaSpainStephen Shaw QUALIFIED
Kadeem FlosiJapanAnna Fali PROPOSAL
Kadeem FlosiGermanyAnna Fali RENEWAL
Morrow RutaJapanBernardo Dominic NEGOTIATION
James ButtBrazilElwin Sharvill UNQUALIFIED
Maria MarrierCanadaStephen Shaw PROPOSAL
Izzy GarufiAustraliaAnna Fali PROPOSAL
Kaitlin OstroskyArgentinaIoni Bowcher PROPOSAL
Faith GillianSpainElwin Sharvill RENEWAL
Adams MorascaItalyAnna Fali NEGOTIATION
Mayumi KolmetzRussiaIoni Bowcher PROPOSAL
Kadeem FlosiSpainAnna Fali NEGOTIATION
Emily WhobreySpainAmy Elsner UNQUALIFIED
David DarakjyCanadaBernardo Dominic QUALIFIED
Jeanfrancois VenereGermanyOnyama Limba NEW
Mayumi KolmetzBrazilElwin Sharvill NEW
Jennifer AmigonJapanIvan Magalhaes UNQUALIFIED
Maria MarrierArgentinaAsiya Javayant RENEWAL
Antonio CaudyIndiaAsiya Javayant NEW
Ivar PaprockiRussiaElwin Sharvill UNQUALIFIED
Murillo MaletItalyBernardo Dominic PROPOSAL
Leja CaldareraGermanyAmy Elsner RENEWAL
Morrow RutaCanadaIvan Magalhaes PROPOSAL
Adams MorascaItalyAmy Elsner QUALIFIED
Cody SaylorsCanadaElwin Sharvill UNQUALIFIED
Darci PoquetteRussiaXuxue Feng UNQUALIFIED
Jennifer AmigonItalyBernardo Dominic QUALIFIED
Aika InouyeCanadaAnna Fali PROPOSAL
Aditya KuskoSpainBernardo Dominic UNQUALIFIED
Costa DilliardIndiaAsiya Javayant PROPOSAL
Sinclair WaycottUnited KingdomXuxue Feng UNQUALIFIED
Octavia MaletUnited KingdomElwin Sharvill QUALIFIED
Izzy GarufiRussiaAnna Fali RENEWAL
Claire TollnerSpainStephen Shaw NEW
Leon OldroydAustraliaBernardo Dominic PROPOSAL
Ivar PaprockiArgentinaOnyama Limba 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>