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
Salvatore StockhamCanadaIoni Bowcher RENEWAL
Mujtaba NickaAustraliaElwin Sharvill QUALIFIED
Claire TollnerUnited KingdomIvan Magalhaes UNQUALIFIED
Morrow RutaItalyXuxue Feng PROPOSAL
Kaitlin OstroskyFranceIvan Magalhaes NEW
Ashley DoeBrazilXuxue Feng UNQUALIFIED
Leon OldroydSpainIvan Magalhaes QUALIFIED
Francesco ShinkoUnited KingdomBernardo Dominic PROPOSAL
Jones VocelkaFranceStephen Shaw RENEWAL
Mujtaba NickaUnited KingdomAmy Elsner NEW
Aruna FigeroaUnited KingdomAsiya Javayant PROPOSAL
Maisha RulapaughCanadaAsiya Javayant PROPOSAL
Murillo MaletRussiaStephen Shaw UNQUALIFIED
Claire TollnerSpainElwin Sharvill NEGOTIATION
Greenwood BologniaItalyXuxue Feng QUALIFIED
David DarakjyCanadaOnyama Limba RENEWAL
Jeanfrancois VenereSpainBernardo Dominic UNQUALIFIED
Chavez BriddickAustraliaXuxue Feng NEW
Morrow RutaSpainIvan Magalhaes UNQUALIFIED
James ButtSpainBernardo Dominic QUALIFIED
Aruna FigeroaIndiaIvan Magalhaes QUALIFIED
Greenwood BologniaGermanyIoni Bowcher NEW
Leja CaldareraIndiaXuxue Feng NEGOTIATION
Arvin AlbaresGermanyAmy Elsner PROPOSAL
Darci PoquetteArgentinaAnna Fali NEGOTIATION
Salvatore StockhamArgentinaAnna Fali UNQUALIFIED
Rodrigues CampainItalyAmy Elsner NEGOTIATION
Deepesh ChuiJapanIvan Magalhaes PROPOSAL
Greenwood BologniaJapanStephen Shaw NEGOTIATION
Stacey MacleadAustraliaXuxue Feng UNQUALIFIED
Ricardo GauchoIndiaIoni Bowcher RENEWAL
Silvio SlusarskiAustraliaElwin Sharvill UNQUALIFIED
Arvin AlbaresItalyAnna Fali UNQUALIFIED
Mujtaba NickaJapanIoni Bowcher PROPOSAL
Stacey MacleadItalyAsiya Javayant NEGOTIATION
Isabel BowleyUnited KingdomOnyama Limba QUALIFIED
Nicolas IturbideCanadaAsiya Javayant NEW
Deepesh ChuiAustraliaBernardo Dominic PROPOSAL
Morrow RutaFranceOnyama Limba QUALIFIED
Costa DilliardBrazilAsiya Javayant PROPOSAL
Kadeem FlosiRussiaIoni Bowcher NEW
Mujtaba NickaCanadaStephen Shaw NEGOTIATION
Salvatore StockhamCanadaAmy Elsner NEW
Claire TollnerArgentinaIoni Bowcher PROPOSAL
Mayumi KolmetzCanadaOnyama Limba RENEWAL
Francesco ShinkoBrazilIoni Bowcher UNQUALIFIED
Maria MarrierCanadaAsiya Javayant QUALIFIED
Cody SaylorsGermanyIvan Magalhaes UNQUALIFIED
Murillo MaletUnited KingdomOnyama Limba QUALIFIED
Wickens NestleIndiaStephen Shaw PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Maisha RulapaughItalyAsiya Javayant NEGOTIATION
David DarakjyArgentinaIoni Bowcher NEW
Ricardo GauchoSpainXuxue Feng PROPOSAL
Jones VocelkaSpainAnna Fali NEW
Emily WhobreyIndiaBernardo Dominic UNQUALIFIED
Izzy GarufiRussiaOnyama Limba NEW
Izzy GarufiCanadaAmy Elsner UNQUALIFIED
Aika InouyeCanadaAmy Elsner NEW
Arvin AlbaresArgentinaElwin Sharvill NEW
Darci PoquetteIndiaOnyama Limba QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Maria MarrierRussia2025-08-14Benton, John B Jr NEW92Ivan Magalhaes
1001Maria MarrierIndia2025-08-08Feltz Printing Service QUALIFIED68Elwin Sharvill
1002Cody SaylorsAustralia2025-09-02Dorl, James J Esq PROPOSAL86Ioni Bowcher
1003Chavez BriddickJapan2025-08-11Truhlar And Truhlar Attys QUALIFIED5Ioni Bowcher
1004Mujtaba NickaIndia2025-08-14Chapman, Ross E Esq NEGOTIATION27Xuxue Feng
1005Jeanfrancois VenereGermany2025-08-31Feiner Bros NEW52Amy Elsner
1006Isabel BowleySpain2025-08-08Chapman, Ross E Esq QUALIFIED18Elwin Sharvill
1007Emily WhobreyAustralia2025-08-22Truhlar And Truhlar Attys UNQUALIFIED76Anna Fali
1008Adams MorascaIndia2025-08-17Morlong Associates NEW43Asiya Javayant
1009Clifford RimCanada2025-08-28Dorl, James J Esq NEW95Ivan Magalhaes
1010Aika InouyeRussia2025-08-18Chemel, James L Cpa NEW69Amy Elsner
1011Emily WhobreyGermany2025-08-06Rousseaux, Michael Esq UNQUALIFIED49Onyama Limba
1012Julie StensethBrazil2025-09-04Chanay, Jeffrey A Esq NEGOTIATION38Ioni Bowcher
1013Jefferson SchemmerSpain2025-08-16Buckley Miller Wright UNQUALIFIED69Onyama Limba
1014Faith GillianArgentina2025-08-09Commercial Press UNQUALIFIED7Onyama Limba
1015Adams MorascaGermany2025-08-07Truhlar And Truhlar Attys RENEWAL23Asiya Javayant
1016Johnson SergiGermany2025-08-07Benton, John B Jr PROPOSAL25Ivan Magalhaes
1017Darci PoquetteCanada2025-08-28Chapman, Ross E Esq NEGOTIATION85Bernardo Dominic
1018Aika InouyeArgentina2025-09-02Buckley Miller Wright NEGOTIATION2Bernardo Dominic
1019Faith GillianCanada2025-08-27Benton, John B Jr UNQUALIFIED6Amy Elsner
1020Aruna FigeroaIndia2025-08-11Benton, John B Jr NEGOTIATION24Stephen Shaw
1021Silvio SlusarskiBrazil2025-08-11Truhlar And Truhlar Attys NEGOTIATION53Xuxue Feng
1022Ricardo GauchoCanada2025-09-02Commercial Press RENEWAL73Ioni Bowcher
1023Isabel BowleyCanada2025-08-23King, Christopher A Esq NEGOTIATION67Ivan Magalhaes
1024Mujtaba NickaItaly2025-08-18Feiner Bros RENEWAL48Stephen Shaw
1025Kadeem FlosiCanada2025-08-13Printing Dimensions NEW53Bernardo Dominic
1026Octavia MaletCanada2025-09-01Rangoni Of Florence UNQUALIFIED56Asiya Javayant
1027Johnson SergiArgentina2025-08-23Morlong Associates NEGOTIATION65Anna Fali
1028Misaki RoysterFrance2025-08-12Benton, John B Jr PROPOSAL62Ivan Magalhaes
1029Julie StensethFrance2025-08-14Chemel, James L Cpa NEGOTIATION67Asiya Javayant
1030Costa DilliardItaly2025-08-08Feltz Printing Service QUALIFIED32Amy Elsner
1031Deepesh ChuiItaly2025-08-12Chapman, Ross E Esq QUALIFIED93Anna Fali
1032Julie StensethCanada2025-08-23Commercial Press NEW10Elwin Sharvill
1033Ricardo GauchoUnited Kingdom2025-08-22Commercial Press NEGOTIATION74Asiya Javayant
1034Deepesh ChuiSpain2025-09-03Benton, John B Jr NEW29Onyama Limba
1035Smith GlickAustralia2025-09-01Rousseaux, Michael Esq NEW76Anna Fali
1036Mujtaba NickaIndia2025-08-30Truhlar And Truhlar Attys NEGOTIATION94Bernardo Dominic
1037Julie StensethUnited Kingdom2025-09-01Printing Dimensions NEW3Stephen Shaw
1038Sinclair WaycottGermany2025-08-08Rousseaux, Michael Esq RENEWAL29Ioni Bowcher
1039Silvio SlusarskiRussia2025-08-14Rousseaux, Michael Esq NEGOTIATION12Onyama Limba
1040Deepesh ChuiArgentina2025-09-02Dorl, James J Esq QUALIFIED62Ivan Magalhaes
1041Rodrigues CampainJapan2025-08-06Feiner Bros PROPOSAL30Amy Elsner
1042Stacey MacleadRussia2025-08-13Chanay, Jeffrey A Esq PROPOSAL89Ivan Magalhaes
1043Wickens NestleRussia2025-08-31Buckley Miller Wright PROPOSAL4Amy Elsner
1044Mayumi KolmetzAustralia2025-08-14Dorl, James J Esq UNQUALIFIED23Elwin Sharvill
1045Leon OldroydBrazil2025-08-17King, Christopher A Esq QUALIFIED29Xuxue Feng
1046Faith GillianBrazil2025-08-08Chapman, Ross E Esq RENEWAL91Ivan Magalhaes
1047Leon OldroydUnited Kingdom2025-08-20Buckley Miller Wright NEW70Onyama Limba
1048Maria MarrierFrance2025-08-13Truhlar And Truhlar Attys RENEWAL6Xuxue Feng
1049Maria MarrierBrazil2025-09-03Printing Dimensions UNQUALIFIED1Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Arvin AlbaresCanadaIoni Bowcher UNQUALIFIED
Clifford RimAustraliaAsiya Javayant PROPOSAL
James ButtJapanStephen Shaw NEGOTIATION
Izzy GarufiSpainElwin Sharvill RENEWAL
Adams MorascaItalyElwin Sharvill QUALIFIED
Ivar PaprockiAustraliaElwin Sharvill PROPOSAL
Mujtaba NickaCanadaAmy Elsner PROPOSAL
Mujtaba NickaItalyIoni Bowcher PROPOSAL
Julie StensethFranceBernardo Dominic NEW
Leja CaldareraIndiaIoni Bowcher UNQUALIFIED
Octavia MaletSpainElwin Sharvill PROPOSAL
Costa DilliardUnited KingdomAmy Elsner PROPOSAL
Kadeem FlosiUnited KingdomElwin Sharvill NEGOTIATION
Misaki RoysterSpainIoni Bowcher QUALIFIED
Antonio CaudyBrazilStephen Shaw UNQUALIFIED
Adams MorascaGermanyIvan Magalhaes RENEWAL
Jennifer AmigonRussiaStephen Shaw RENEWAL
Antonio CaudyBrazilAnna Fali NEW
Kadeem FlosiFranceIvan Magalhaes NEGOTIATION
Ashley DoeSpainXuxue Feng RENEWAL
Silvio SlusarskiGermanyAmy Elsner NEW
Sinclair WaycottBrazilBernardo Dominic PROPOSAL
Costa DilliardArgentinaAmy Elsner QUALIFIED
Silvio SlusarskiItalyOnyama Limba NEGOTIATION
Adams MorascaJapanIoni Bowcher PROPOSAL
Smith GlickBrazilAsiya Javayant NEW
Aika InouyeGermanyStephen Shaw QUALIFIED
Faith GillianArgentinaIoni Bowcher PROPOSAL
Jefferson SchemmerJapanIvan Magalhaes UNQUALIFIED
Leon OldroydSpainOnyama Limba NEW
Francesco ShinkoSpainOnyama Limba RENEWAL
Costa DilliardCanadaAmy Elsner NEW
Kadeem FlosiItalyOnyama Limba QUALIFIED
Jennifer AmigonItalyAnna Fali NEGOTIATION
Salvatore StockhamJapanIoni Bowcher UNQUALIFIED
Jefferson SchemmerArgentinaStephen Shaw PROPOSAL
Tony FollerRussiaAnna Fali UNQUALIFIED
Francesco ShinkoSpainElwin Sharvill QUALIFIED
Nicolas IturbideSpainAsiya Javayant RENEWAL
Ashley DoeUnited KingdomIoni Bowcher NEGOTIATION
James ButtFranceAmy Elsner NEW
Mayumi KolmetzRussiaIoni Bowcher NEW
Maisha RulapaughSpainIvan Magalhaes NEGOTIATION
Smith GlickAustraliaIvan Magalhaes UNQUALIFIED
Faith GillianJapanIvan Magalhaes QUALIFIED
Stacey MacleadRussiaAnna Fali NEW
Emily WhobreyCanadaIvan Magalhaes QUALIFIED
Jefferson SchemmerIndiaOnyama Limba NEGOTIATION
Mayumi KolmetzSpainIvan Magalhaes PROPOSAL
Jeanfrancois VenereItalyXuxue Feng NEW
Frozen Columns
Name
Jennifer Amigon
Aika Inouye
Leja Caldarera
Wickens Nestle
Murillo Malet
Kaitlin Ostrosky
Silvio Slusarski
Murillo Malet
Claire Tollner
Faith Gillian
Costa Dilliard
Nicolas Iturbide
Alejandro Perin
Tony Foller
Maisha Rulapaugh
Munro Ferencz
Sinclair Waycott
Salvatore Stockham
Misaki Royster
Cody Saylors
Aika Inouye
Leon Oldroyd
Aditya Kusko
Nicolas Iturbide
Ivar Paprocki
Jeanfrancois Venere
Mayumi Kolmetz
Alejandro Perin
Misaki Royster
Kadeem Flosi
Misaki Royster
Mayumi Kolmetz
Deepesh Chui
Morrow Ruta
Deepesh Chui
Wickens Nestle
Adams Morasca
Wickens Nestle
Clifford Rim
Munro Ferencz
Stacey Maclead
David Darakjy
David Darakjy
Nicolas Iturbide
Rodrigues Campain
Wickens Nestle
James Butt
Mujtaba Nicka
Aditya Kusko
David Darakjy
IdCountryDate
1000Germany2025-08-11
1001Brazil2025-09-01
1002Russia2025-08-12
1003United Kingdom2025-09-01
1004Italy2025-08-19
1005Canada2025-08-12
1006United Kingdom2025-09-04
1007India2025-08-14
1008Australia2025-08-29
1009Canada2025-08-12
1010Russia2025-09-04
1011Brazil2025-08-09
1012Spain2025-08-15
1013France2025-08-20
1014Russia2025-08-25
1015France2025-09-04
1016Spain2025-09-04
1017United Kingdom2025-08-31
1018Australia2025-09-02
1019India2025-08-13
1020Spain2025-08-27
1021Brazil2025-08-23
1022Canada2025-08-19
1023Spain2025-08-25
1024Australia2025-08-13
1025Argentina2025-08-28
1026Canada2025-08-07
1027India2025-08-18
1028United Kingdom2025-08-11
1029Russia2025-08-11
1030Canada2025-08-30
1031Germany2025-09-03
1032India2025-08-08
1033Canada2025-09-01
1034India2025-08-11
1035United Kingdom2025-08-23
1036Brazil2025-08-18
1037Russia2025-08-06
1038India2025-08-23
1039Spain2025-09-02
1040India2025-09-04
1041France2025-08-20
1042Australia2025-08-24
1043Australia2025-08-27
1044Canada2025-08-17
1045India2025-08-19
1046United Kingdom2025-08-19
1047France2025-08-19
1048Australia2025-08-18
1049France2025-08-27

On-Demand Data

NameIdCountryDate
Cody Saylors1000Canada2025-08-23
Johnson Sergi1001Japan2025-09-04
Aditya Kusko1002Brazil2025-08-17
Rodrigues Campain1003Italy2025-08-15
Maisha Rulapaugh1004France2025-08-21
Aruna Figeroa1005Brazil2025-08-24
Munro Ferencz1006United Kingdom2025-09-04
Deepesh Chui1007India2025-09-01
Maisha Rulapaugh1008Russia2025-09-01
David Darakjy1009Russia2025-08-14
James Butt1010United Kingdom2025-08-22
Aruna Figeroa1011France2025-08-08
Claire Tollner1012France2025-08-08
Leon Oldroyd1013Spain2025-08-19
Clifford Rim1014Canada2025-09-01
Leja Caldarera1015India2025-08-14
Francesco Shinko1016Germany2025-08-06
Jennifer Amigon1017France2025-08-16
Cody Saylors1018India2025-08-30
Alejandro Perin1019Spain2025-08-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Emily WhobreyUnited KingdomIvan Magalhaes RENEWAL
Costa DilliardJapanAmy Elsner PROPOSAL
Emily WhobreyUnited KingdomIoni Bowcher NEGOTIATION
Jeanfrancois VenereJapanXuxue Feng PROPOSAL
Darci PoquetteCanadaElwin Sharvill QUALIFIED
Juan WieserArgentinaAsiya Javayant NEGOTIATION
Smith GlickRussiaAnna Fali UNQUALIFIED
Alejandro PerinUnited KingdomIvan Magalhaes NEGOTIATION
Juan WieserRussiaAmy Elsner UNQUALIFIED
Leja CaldareraCanadaIoni Bowcher NEGOTIATION
Cody SaylorsArgentinaAsiya Javayant NEW
Maria MarrierCanadaAmy Elsner RENEWAL
Mujtaba NickaIndiaStephen Shaw NEW
Ricardo GauchoCanadaIvan Magalhaes NEGOTIATION
Murillo MaletRussiaIvan Magalhaes UNQUALIFIED
Mujtaba NickaJapanIvan Magalhaes RENEWAL
Munro FerenczGermanyIvan Magalhaes PROPOSAL
Wickens NestleSpainAnna Fali NEW
Octavia MaletRussiaXuxue Feng NEW
David DarakjyAustraliaIvan Magalhaes QUALIFIED
Kadeem FlosiSpainOnyama Limba RENEWAL
Claire TollnerUnited KingdomIoni Bowcher PROPOSAL
Rodrigues CampainCanadaIoni Bowcher UNQUALIFIED
Arvin AlbaresUnited KingdomAsiya Javayant PROPOSAL
Greenwood BologniaRussiaElwin Sharvill NEW
Silvio SlusarskiGermanyIvan Magalhaes QUALIFIED
Julie StensethItalyElwin Sharvill NEGOTIATION
Costa DilliardGermanyIoni Bowcher RENEWAL
Morrow RutaAustraliaAmy Elsner UNQUALIFIED
Jeanfrancois VenereGermanyAnna Fali RENEWAL
Juan WieserCanadaElwin Sharvill UNQUALIFIED
Aditya KuskoIndiaStephen Shaw NEW
Misaki RoysterFranceXuxue Feng RENEWAL
Juan WieserSpainElwin Sharvill PROPOSAL
Antonio CaudyCanadaAnna Fali RENEWAL
Ricardo GauchoUnited KingdomBernardo Dominic RENEWAL
Aditya KuskoIndiaStephen Shaw QUALIFIED
Chavez BriddickFranceStephen Shaw QUALIFIED
Alejandro PerinItalyIoni Bowcher NEW
Deepesh ChuiCanadaStephen Shaw 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>