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
Jefferson SchemmerBrazilBernardo Dominic NEGOTIATION
Emily WhobreyJapanXuxue Feng UNQUALIFIED
Morrow RutaCanadaIvan Magalhaes PROPOSAL
Octavia MaletFranceAnna Fali NEW
Johnson SergiSpainAsiya Javayant UNQUALIFIED
Adams MorascaItalyAsiya Javayant RENEWAL
Aditya KuskoCanadaIvan Magalhaes NEGOTIATION
Juan WieserIndiaAsiya Javayant PROPOSAL
Sinclair WaycottAustraliaElwin Sharvill NEGOTIATION
Nicolas IturbideArgentinaOnyama Limba NEW
Stacey MacleadJapanElwin Sharvill QUALIFIED
Morrow RutaItalyElwin Sharvill NEW
Misaki RoysterJapanIoni Bowcher NEGOTIATION
Aruna FigeroaGermanyXuxue Feng UNQUALIFIED
Faith GillianJapanIvan Magalhaes RENEWAL
Izzy GarufiItalyElwin Sharvill NEGOTIATION
Kaitlin OstroskyItalyAmy Elsner QUALIFIED
Clifford RimBrazilIvan Magalhaes RENEWAL
Jeanfrancois VenereGermanyBernardo Dominic PROPOSAL
Alejandro PerinAustraliaXuxue Feng NEGOTIATION
Costa DilliardJapanAnna Fali QUALIFIED
Antonio CaudyUnited KingdomOnyama Limba QUALIFIED
Silvio SlusarskiFranceXuxue Feng NEW
Clifford RimRussiaOnyama Limba PROPOSAL
Izzy GarufiUnited KingdomBernardo Dominic RENEWAL
Antonio CaudyUnited KingdomAmy Elsner NEGOTIATION
Stacey MacleadArgentinaAmy Elsner NEGOTIATION
Murillo MaletRussiaStephen Shaw NEGOTIATION
Costa DilliardUnited KingdomElwin Sharvill RENEWAL
Kadeem FlosiGermanyElwin Sharvill UNQUALIFIED
Jefferson SchemmerRussiaAsiya Javayant PROPOSAL
Ricardo GauchoItalyOnyama Limba UNQUALIFIED
Deepesh ChuiRussiaElwin Sharvill NEGOTIATION
Salvatore StockhamAustraliaIvan Magalhaes PROPOSAL
Juan WieserIndiaAmy Elsner RENEWAL
Faith GillianRussiaAsiya Javayant NEW
Maria MarrierGermanyAsiya Javayant RENEWAL
Leja CaldareraItalyIvan Magalhaes NEW
Francesco ShinkoSpainElwin Sharvill NEGOTIATION
Adams MorascaSpainStephen Shaw QUALIFIED
Jeanfrancois VenereCanadaIvan Magalhaes NEGOTIATION
David DarakjySpainAsiya Javayant NEW
Maria MarrierItalyOnyama Limba UNQUALIFIED
Rodrigues CampainArgentinaAmy Elsner NEGOTIATION
Costa DilliardRussiaXuxue Feng NEGOTIATION
Isabel BowleyJapanAsiya Javayant PROPOSAL
James ButtItalyOnyama Limba NEW
Jefferson SchemmerGermanyElwin Sharvill NEGOTIATION
Francesco ShinkoGermanyXuxue Feng RENEWAL
Silvio SlusarskiItalyIvan Magalhaes RENEWAL
Horizontal
NameCountryRepresentativeStatus
Costa DilliardIndiaXuxue Feng NEGOTIATION
Isabel BowleyJapanXuxue Feng NEW
Leon OldroydAustraliaXuxue Feng UNQUALIFIED
Munro FerenczJapanXuxue Feng UNQUALIFIED
Smith GlickBrazilAnna Fali UNQUALIFIED
Mayumi KolmetzRussiaIoni Bowcher QUALIFIED
Octavia MaletJapanAsiya Javayant NEGOTIATION
Morrow RutaFranceOnyama Limba PROPOSAL
Kadeem FlosiFranceAsiya Javayant QUALIFIED
Tony FollerItalyXuxue Feng QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Adams MorascaRussia2025-07-17King, Christopher A Esq NEGOTIATION52Onyama Limba
1001Wickens NestleAustralia2025-07-05Chapman, Ross E Esq PROPOSAL86Anna Fali
1002Jennifer AmigonSpain2025-06-26Feltz Printing Service NEGOTIATION13Asiya Javayant
1003Rodrigues CampainFrance2025-07-13Chapman, Ross E Esq NEGOTIATION86Ivan Magalhaes
1004Alejandro PerinArgentina2025-07-11Dorl, James J Esq UNQUALIFIED34Ivan Magalhaes
1005Aruna FigeroaRussia2025-07-14Buckley Miller Wright RENEWAL67Ioni Bowcher
1006Clifford RimBrazil2025-07-19Printing Dimensions PROPOSAL41Ivan Magalhaes
1007Cody SaylorsUnited Kingdom2025-07-09Chemel, James L Cpa RENEWAL61Onyama Limba
1008Kaitlin OstroskyGermany2025-07-03Rousseaux, Michael Esq UNQUALIFIED2Bernardo Dominic
1009Munro FerenczIndia2025-06-26Dorl, James J Esq UNQUALIFIED35Ioni Bowcher
1010Arvin AlbaresJapan2025-07-03Rangoni Of Florence PROPOSAL32Asiya Javayant
1011Arvin AlbaresUnited Kingdom2025-07-13Truhlar And Truhlar Attys UNQUALIFIED10Elwin Sharvill
1012Leja CaldareraCanada2025-07-22Chanay, Jeffrey A Esq PROPOSAL88Anna Fali
1013Ricardo GauchoCanada2025-07-12Commercial Press UNQUALIFIED70Anna Fali
1014Adams MorascaRussia2025-07-03Printing Dimensions NEGOTIATION20Asiya Javayant
1015Murillo MaletUnited Kingdom2025-06-23Printing Dimensions NEW5Anna Fali
1016Arvin AlbaresCanada2025-07-07Feltz Printing Service NEGOTIATION42Anna Fali
1017Julie StensethFrance2025-06-30Rousseaux, Michael Esq NEW96Ioni Bowcher
1018Jones VocelkaUnited Kingdom2025-07-08Dorl, James J Esq NEGOTIATION62Bernardo Dominic
1019Morrow RutaFrance2025-07-07Dorl, James J Esq UNQUALIFIED15Onyama Limba
1020Kadeem FlosiFrance2025-06-25Rangoni Of Florence NEW17Amy Elsner
1021Stacey MacleadFrance2025-07-13King, Christopher A Esq RENEWAL64Amy Elsner
1022Silvio SlusarskiCanada2025-07-15Rangoni Of Florence UNQUALIFIED51Anna Fali
1023Emily WhobreyGermany2025-06-23Chemel, James L Cpa RENEWAL44Amy Elsner
1024Emily WhobreyCanada2025-07-21King, Christopher A Esq RENEWAL27Anna Fali
1025Leon OldroydRussia2025-07-08Chemel, James L Cpa RENEWAL73Ioni Bowcher
1026Chavez BriddickFrance2025-06-28Benton, John B Jr UNQUALIFIED55Bernardo Dominic
1027Johnson SergiGermany2025-07-12Benton, John B Jr RENEWAL34Onyama Limba
1028Deepesh ChuiCanada2025-07-16Printing Dimensions RENEWAL64Xuxue Feng
1029Misaki RoysterUnited Kingdom2025-06-23Chemel, James L Cpa NEGOTIATION40Stephen Shaw
1030Johnson SergiCanada2025-07-16Feltz Printing Service RENEWAL39Elwin Sharvill
1031Greenwood BologniaGermany2025-07-15Morlong Associates PROPOSAL52Asiya Javayant
1032Ashley DoeCanada2025-07-14Chemel, James L Cpa UNQUALIFIED99Bernardo Dominic
1033Ivar PaprockiIndia2025-06-27Commercial Press NEGOTIATION73Elwin Sharvill
1034Faith GillianSpain2025-06-28Rousseaux, Michael Esq QUALIFIED17Amy Elsner
1035Jennifer AmigonRussia2025-06-23Dorl, James J Esq RENEWAL44Anna Fali
1036Clifford RimArgentina2025-07-08Buckley Miller Wright PROPOSAL33Stephen Shaw
1037Leja CaldareraArgentina2025-07-08King, Christopher A Esq NEGOTIATION85Ioni Bowcher
1038Mayumi KolmetzSpain2025-06-23Dorl, James J Esq UNQUALIFIED96Ioni Bowcher
1039Aika InouyeArgentina2025-07-17Rangoni Of Florence UNQUALIFIED71Xuxue Feng
1040Jones VocelkaFrance2025-07-11Rousseaux, Michael Esq NEGOTIATION10Onyama Limba
1041Ivar PaprockiRussia2025-07-11King, Christopher A Esq QUALIFIED42Amy Elsner
1042Leja CaldareraBrazil2025-06-30Feiner Bros NEW7Amy Elsner
1043Leja CaldareraCanada2025-06-24Chapman, Ross E Esq NEGOTIATION11Elwin Sharvill
1044Arvin AlbaresJapan2025-07-09Rousseaux, Michael Esq QUALIFIED29Elwin Sharvill
1045Deepesh ChuiFrance2025-07-06Rangoni Of Florence NEW89Ivan Magalhaes
1046Salvatore StockhamBrazil2025-07-22Truhlar And Truhlar Attys NEW72Bernardo Dominic
1047Cody SaylorsUnited Kingdom2025-07-14King, Christopher A Esq PROPOSAL4Stephen Shaw
1048Jones VocelkaJapan2025-07-02Commercial Press UNQUALIFIED34Ivan Magalhaes
1049Morrow RutaGermany2025-06-25Dorl, James J Esq NEW15Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Deepesh ChuiJapanElwin Sharvill PROPOSAL
Octavia MaletRussiaAnna Fali PROPOSAL
Maria MarrierFranceIoni Bowcher NEGOTIATION
Munro FerenczItalyAnna Fali RENEWAL
Adams MorascaAustraliaIvan Magalhaes PROPOSAL
Ivar PaprockiBrazilIoni Bowcher PROPOSAL
Darci PoquetteRussiaAnna Fali PROPOSAL
Izzy GarufiItalyOnyama Limba NEGOTIATION
Ricardo GauchoUnited KingdomIoni Bowcher UNQUALIFIED
Julie StensethSpainBernardo Dominic NEGOTIATION
Julie StensethGermanyAsiya Javayant UNQUALIFIED
Isabel BowleyIndiaXuxue Feng PROPOSAL
Wickens NestleItalyAsiya Javayant UNQUALIFIED
Darci PoquetteJapanIoni Bowcher PROPOSAL
Arvin AlbaresGermanyStephen Shaw QUALIFIED
Smith GlickRussiaBernardo Dominic PROPOSAL
Tony FollerUnited KingdomIoni Bowcher NEW
Greenwood BologniaIndiaElwin Sharvill NEW
Morrow RutaCanadaStephen Shaw NEGOTIATION
Rodrigues CampainBrazilElwin Sharvill UNQUALIFIED
Clifford RimFranceIvan Magalhaes PROPOSAL
Ashley DoeItalyStephen Shaw RENEWAL
Costa DilliardArgentinaBernardo Dominic NEW
Francesco ShinkoIndiaStephen Shaw QUALIFIED
Faith GillianSpainIoni Bowcher PROPOSAL
Julie StensethItalyBernardo Dominic RENEWAL
Costa DilliardSpainBernardo Dominic NEW
Aruna FigeroaGermanyAsiya Javayant UNQUALIFIED
Misaki RoysterUnited KingdomElwin Sharvill QUALIFIED
Munro FerenczCanadaBernardo Dominic NEGOTIATION
Mujtaba NickaIndiaStephen Shaw NEGOTIATION
Mayumi KolmetzIndiaBernardo Dominic UNQUALIFIED
Nicolas IturbideSpainStephen Shaw QUALIFIED
Kaitlin OstroskyFranceBernardo Dominic NEW
Kadeem FlosiFranceBernardo Dominic NEGOTIATION
Silvio SlusarskiItalyIvan Magalhaes NEGOTIATION
Wickens NestleJapanBernardo Dominic PROPOSAL
Leja CaldareraCanadaXuxue Feng PROPOSAL
Wickens NestleFranceOnyama Limba NEW
Mayumi KolmetzFranceXuxue Feng QUALIFIED
Maisha RulapaughSpainBernardo Dominic RENEWAL
Francesco ShinkoUnited KingdomElwin Sharvill PROPOSAL
Rodrigues CampainJapanBernardo Dominic NEGOTIATION
Julie StensethSpainAmy Elsner NEW
Julie StensethRussiaXuxue Feng NEW
Greenwood BologniaArgentinaIvan Magalhaes NEGOTIATION
Nicolas IturbideItalyIoni Bowcher NEGOTIATION
Aruna FigeroaIndiaIoni Bowcher PROPOSAL
Francesco ShinkoJapanIoni Bowcher UNQUALIFIED
Sinclair WaycottUnited KingdomAmy Elsner QUALIFIED
Frozen Columns
Name
Isabel Bowley
Juan Wieser
Ashley Doe
Silvio Slusarski
Ricardo Gaucho
Isabel Bowley
Darci Poquette
Morrow Ruta
Deepesh Chui
Jeanfrancois Venere
Leja Caldarera
Arvin Albares
Ashley Doe
Francesco Shinko
Maria Marrier
Faith Gillian
Aditya Kusko
Maria Marrier
Jefferson Schemmer
Silvio Slusarski
Francesco Shinko
Darci Poquette
Aditya Kusko
Jennifer Amigon
Misaki Royster
Sinclair Waycott
Antonio Caudy
Octavia Malet
Jones Vocelka
Cody Saylors
David Darakjy
Chavez Briddick
Leja Caldarera
Ricardo Gaucho
Emily Whobrey
Jennifer Amigon
Jefferson Schemmer
Isabel Bowley
Juan Wieser
Tony Foller
Antonio Caudy
Julie Stenseth
Deepesh Chui
Chavez Briddick
Maria Marrier
Maisha Rulapaugh
Izzy Garufi
Jeanfrancois Venere
Johnson Sergi
Jennifer Amigon
IdCountryDate
1000Australia2025-06-26
1001Italy2025-07-03
1002Italy2025-07-06
1003Spain2025-07-17
1004France2025-06-23
1005India2025-06-30
1006France2025-07-02
1007Germany2025-07-11
1008Canada2025-06-24
1009Australia2025-07-11
1010India2025-07-17
1011Canada2025-07-08
1012Argentina2025-07-20
1013Australia2025-07-08
1014Italy2025-07-06
1015Germany2025-06-26
1016Australia2025-07-04
1017France2025-07-05
1018Italy2025-07-19
1019Argentina2025-07-02
1020Australia2025-07-10
1021Canada2025-06-30
1022Russia2025-07-08
1023Argentina2025-07-16
1024France2025-07-10
1025Germany2025-07-01
1026Russia2025-07-20
1027Australia2025-07-17
1028Germany2025-07-19
1029Spain2025-07-09
1030France2025-06-24
1031Canada2025-07-08
1032France2025-07-01
1033Russia2025-07-09
1034France2025-07-15
1035Australia2025-07-07
1036Russia2025-07-08
1037Australia2025-07-12
1038Canada2025-06-26
1039Germany2025-06-29
1040India2025-07-04
1041Canada2025-06-30
1042Italy2025-06-29
1043Brazil2025-06-30
1044Spain2025-07-07
1045United Kingdom2025-07-14
1046Spain2025-07-08
1047France2025-07-03
1048Germany2025-07-21
1049Brazil2025-06-26

On-Demand Data

NameIdCountryDate
Jeanfrancois Venere1000Argentina2025-07-16
Greenwood Bolognia1001Spain2025-07-02
Francesco Shinko1002India2025-06-30
Aruna Figeroa1003Italy2025-07-02
Kadeem Flosi1004United Kingdom2025-07-18
Aruna Figeroa1005Japan2025-07-06
Salvatore Stockham1006Brazil2025-06-24
Alejandro Perin1007Italy2025-07-20
Wickens Nestle1008India2025-06-25
Smith Glick1009Italy2025-07-05
Salvatore Stockham1010Japan2025-07-02
Ashley Doe1011Germany2025-06-29
Ashley Doe1012India2025-07-19
Julie Stenseth1013Canada2025-07-03
Arvin Albares1014Italy2025-06-23
Maisha Rulapaugh1015Brazil2025-07-17
Maisha Rulapaugh1016Japan2025-07-05
Darci Poquette1017Germany2025-06-27
Ashley Doe1018United Kingdom2025-07-15
Jeanfrancois Venere1019Canada2025-07-09
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aika InouyeArgentinaAsiya Javayant RENEWAL
Misaki RoysterFranceAsiya Javayant QUALIFIED
Nicolas IturbideArgentinaElwin Sharvill PROPOSAL
Chavez BriddickSpainAnna Fali NEGOTIATION
Isabel BowleyRussiaAsiya Javayant PROPOSAL
Octavia MaletArgentinaIvan Magalhaes NEW
Johnson SergiGermanyAnna Fali PROPOSAL
Leja CaldareraUnited KingdomAmy Elsner QUALIFIED
Clifford RimRussiaAmy Elsner QUALIFIED
Tony FollerSpainAsiya Javayant PROPOSAL
Morrow RutaSpainIoni Bowcher UNQUALIFIED
Juan WieserBrazilAnna Fali UNQUALIFIED
Johnson SergiItalyIvan Magalhaes QUALIFIED
Stacey MacleadUnited KingdomIvan Magalhaes NEGOTIATION
Mayumi KolmetzRussiaOnyama Limba QUALIFIED
Jennifer AmigonItalyXuxue Feng NEW
Leon OldroydCanadaElwin Sharvill QUALIFIED
Stacey MacleadAustraliaAnna Fali NEW
Julie StensethUnited KingdomAnna Fali UNQUALIFIED
Kaitlin OstroskySpainElwin Sharvill UNQUALIFIED
Rodrigues CampainFranceAmy Elsner QUALIFIED
Leja CaldareraIndiaAsiya Javayant QUALIFIED
Aditya KuskoGermanyAsiya Javayant NEW
Alejandro PerinCanadaBernardo Dominic NEW
Aditya KuskoJapanIoni Bowcher NEW
Munro FerenczBrazilAmy Elsner PROPOSAL
Arvin AlbaresJapanStephen Shaw NEW
Costa DilliardIndiaOnyama Limba QUALIFIED
Kadeem FlosiBrazilAmy Elsner QUALIFIED
Greenwood BologniaJapanElwin Sharvill PROPOSAL
Salvatore StockhamBrazilXuxue Feng NEW
James ButtArgentinaElwin Sharvill NEW
Misaki RoysterJapanIoni Bowcher RENEWAL
Claire TollnerArgentinaBernardo Dominic UNQUALIFIED
Jones VocelkaUnited KingdomBernardo Dominic RENEWAL
Jeanfrancois VenereCanadaIoni Bowcher NEW
Alejandro PerinAustraliaIvan Magalhaes NEGOTIATION
Maria MarrierGermanyIoni Bowcher UNQUALIFIED
Salvatore StockhamIndiaBernardo Dominic RENEWAL
Wickens NestleJapanStephen Shaw 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>