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
Morrow RutaFranceElwin Sharvill UNQUALIFIED
Murillo MaletCanadaAmy Elsner PROPOSAL
Munro FerenczItalyXuxue Feng UNQUALIFIED
Wickens NestleArgentinaStephen Shaw QUALIFIED
Jennifer AmigonRussiaElwin Sharvill QUALIFIED
James ButtIndiaBernardo Dominic QUALIFIED
Francesco ShinkoBrazilAmy Elsner UNQUALIFIED
Tony FollerArgentinaIvan Magalhaes NEW
Stacey MacleadBrazilAsiya Javayant QUALIFIED
Maria MarrierArgentinaAnna Fali NEGOTIATION
Johnson SergiRussiaAsiya Javayant NEW
Chavez BriddickFranceIoni Bowcher UNQUALIFIED
Jefferson SchemmerItalyXuxue Feng UNQUALIFIED
Ricardo GauchoUnited KingdomIoni Bowcher UNQUALIFIED
Johnson SergiBrazilAsiya Javayant UNQUALIFIED
James ButtUnited KingdomAmy Elsner RENEWAL
Claire TollnerIndiaIvan Magalhaes PROPOSAL
Mayumi KolmetzAustraliaAnna Fali NEGOTIATION
Maisha RulapaughRussiaAmy Elsner UNQUALIFIED
Izzy GarufiBrazilIvan Magalhaes PROPOSAL
Johnson SergiFranceBernardo Dominic UNQUALIFIED
Kadeem FlosiArgentinaOnyama Limba RENEWAL
Ivar PaprockiGermanyOnyama Limba NEGOTIATION
Stacey MacleadJapanOnyama Limba PROPOSAL
Isabel BowleyUnited KingdomOnyama Limba NEW
Munro FerenczItalyXuxue Feng NEW
Maisha RulapaughCanadaOnyama Limba QUALIFIED
Antonio CaudySpainIoni Bowcher RENEWAL
Morrow RutaUnited KingdomElwin Sharvill UNQUALIFIED
Silvio SlusarskiJapanBernardo Dominic RENEWAL
Arvin AlbaresGermanyOnyama Limba RENEWAL
Jennifer AmigonRussiaAnna Fali NEGOTIATION
Juan WieserCanadaXuxue Feng PROPOSAL
Mayumi KolmetzBrazilElwin Sharvill RENEWAL
Wickens NestleRussiaElwin Sharvill RENEWAL
Leon OldroydAustraliaAnna Fali RENEWAL
Adams MorascaArgentinaElwin Sharvill NEGOTIATION
Kaitlin OstroskyCanadaElwin Sharvill PROPOSAL
Arvin AlbaresGermanyIoni Bowcher NEGOTIATION
Faith GillianCanadaElwin Sharvill RENEWAL
Leja CaldareraGermanyStephen Shaw UNQUALIFIED
Aruna FigeroaArgentinaXuxue Feng NEGOTIATION
Darci PoquetteSpainAnna Fali UNQUALIFIED
Octavia MaletRussiaIvan Magalhaes RENEWAL
Deepesh ChuiGermanyIoni Bowcher NEGOTIATION
Chavez BriddickArgentinaXuxue Feng NEGOTIATION
Adams MorascaGermanyAmy Elsner UNQUALIFIED
Misaki RoysterIndiaXuxue Feng PROPOSAL
David DarakjyGermanyXuxue Feng PROPOSAL
Maisha RulapaughIndiaOnyama Limba NEW
Horizontal
NameCountryRepresentativeStatus
Ashley DoeCanadaOnyama Limba PROPOSAL
Misaki RoysterSpainOnyama Limba NEW
Octavia MaletArgentinaIvan Magalhaes QUALIFIED
Munro FerenczAustraliaIvan Magalhaes QUALIFIED
Tony FollerSpainIoni Bowcher QUALIFIED
Costa DilliardArgentinaAmy Elsner NEW
Isabel BowleyGermanyAmy Elsner QUALIFIED
Munro FerenczIndiaBernardo Dominic QUALIFIED
Aika InouyeGermanyAsiya Javayant NEGOTIATION
Smith GlickCanadaIvan Magalhaes NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Kaitlin OstroskyUnited Kingdom2025-09-23Truhlar And Truhlar Attys RENEWAL7Stephen Shaw
1001Misaki RoysterGermany2025-09-28Chemel, James L Cpa QUALIFIED69Xuxue Feng
1002Rodrigues CampainIndia2025-09-30Chemel, James L Cpa RENEWAL87Ivan Magalhaes
1003Jones VocelkaGermany2025-09-27Printing Dimensions NEW70Ivan Magalhaes
1004Greenwood BologniaBrazil2025-09-16Commercial Press RENEWAL68Xuxue Feng
1005Sinclair WaycottIndia2025-10-03King, Christopher A Esq RENEWAL57Anna Fali
1006Chavez BriddickBrazil2025-09-20Feltz Printing Service QUALIFIED0Anna Fali
1007Aika InouyeJapan2025-10-13Benton, John B Jr NEGOTIATION35Amy Elsner
1008Francesco ShinkoGermany2025-10-09Chanay, Jeffrey A Esq PROPOSAL18Anna Fali
1009Greenwood BologniaItaly2025-10-05Rousseaux, Michael Esq QUALIFIED26Stephen Shaw
1010Mayumi KolmetzUnited Kingdom2025-09-29Chapman, Ross E Esq RENEWAL19Onyama Limba
1011Ashley DoeJapan2025-10-01Buckley Miller Wright NEGOTIATION42Elwin Sharvill
1012Clifford RimItaly2025-10-13Benton, John B Jr RENEWAL98Bernardo Dominic
1013Greenwood BologniaGermany2025-10-01Rangoni Of Florence RENEWAL14Stephen Shaw
1014Claire TollnerSpain2025-09-25Commercial Press PROPOSAL39Elwin Sharvill
1015Johnson SergiIndia2025-09-15Chanay, Jeffrey A Esq RENEWAL72Xuxue Feng
1016Aditya KuskoBrazil2025-10-01Feiner Bros RENEWAL93Elwin Sharvill
1017Costa DilliardArgentina2025-09-15Benton, John B Jr UNQUALIFIED95Xuxue Feng
1018James ButtArgentina2025-09-19Feltz Printing Service QUALIFIED2Xuxue Feng
1019Adams MorascaRussia2025-09-26Chanay, Jeffrey A Esq QUALIFIED56Bernardo Dominic
1020Sinclair WaycottAustralia2025-10-12Truhlar And Truhlar Attys NEGOTIATION75Xuxue Feng
1021Jones VocelkaJapan2025-10-06Dorl, James J Esq PROPOSAL34Bernardo Dominic
1022Mayumi KolmetzGermany2025-10-13Benton, John B Jr NEGOTIATION94Asiya Javayant
1023Chavez BriddickRussia2025-09-25Printing Dimensions RENEWAL79Stephen Shaw
1024Rodrigues CampainUnited Kingdom2025-10-04Dorl, James J Esq PROPOSAL45Xuxue Feng
1025Adams MorascaAustralia2025-09-26Dorl, James J Esq NEW76Xuxue Feng
1026Ricardo GauchoAustralia2025-10-07Benton, John B Jr NEW1Amy Elsner
1027Juan WieserBrazil2025-09-15Morlong Associates RENEWAL96Asiya Javayant
1028Antonio CaudyUnited Kingdom2025-09-15Rangoni Of Florence QUALIFIED53Anna Fali
1029Izzy GarufiArgentina2025-09-25Chemel, James L Cpa UNQUALIFIED6Onyama Limba
1030Murillo MaletUnited Kingdom2025-09-24Commercial Press NEGOTIATION44Asiya Javayant
1031Mayumi KolmetzSpain2025-09-26Rangoni Of Florence NEW28Xuxue Feng
1032Sinclair WaycottSpain2025-09-26Rangoni Of Florence PROPOSAL94Anna Fali
1033Darci PoquetteIndia2025-09-18Feltz Printing Service NEGOTIATION24Onyama Limba
1034Munro FerenczUnited Kingdom2025-10-04Dorl, James J Esq NEW9Onyama Limba
1035Murillo MaletFrance2025-09-20Feiner Bros NEW88Elwin Sharvill
1036Murillo MaletArgentina2025-09-27Chapman, Ross E Esq NEW55Ioni Bowcher
1037Jones VocelkaCanada2025-09-30Chapman, Ross E Esq PROPOSAL97Asiya Javayant
1038Smith GlickUnited Kingdom2025-09-20Printing Dimensions UNQUALIFIED58Asiya Javayant
1039Munro FerenczIndia2025-09-30Buckley Miller Wright QUALIFIED38Amy Elsner
1040Alejandro PerinArgentina2025-09-22Chanay, Jeffrey A Esq NEW47Xuxue Feng
1041Octavia MaletItaly2025-10-03Morlong Associates NEW56Onyama Limba
1042Rodrigues CampainUnited Kingdom2025-10-13Printing Dimensions NEW61Onyama Limba
1043Ashley DoeFrance2025-10-13Rousseaux, Michael Esq QUALIFIED27Ivan Magalhaes
1044Costa DilliardGermany2025-09-23Chemel, James L Cpa NEGOTIATION92Elwin Sharvill
1045David DarakjyItaly2025-10-08Buckley Miller Wright QUALIFIED4Asiya Javayant
1046Maisha RulapaughSpain2025-09-29Rousseaux, Michael Esq RENEWAL82Amy Elsner
1047Aruna FigeroaAustralia2025-09-16Printing Dimensions PROPOSAL80Amy Elsner
1048Deepesh ChuiJapan2025-10-09Rangoni Of Florence PROPOSAL36Asiya Javayant
1049Jennifer AmigonUnited Kingdom2025-10-11Commercial Press PROPOSAL71Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Clifford RimGermanyElwin Sharvill PROPOSAL
Adams MorascaIndiaBernardo Dominic NEW
Faith GillianBrazilAnna Fali PROPOSAL
Aditya KuskoFranceOnyama Limba NEW
Isabel BowleyFranceOnyama Limba QUALIFIED
Tony FollerSpainIoni Bowcher PROPOSAL
Ricardo GauchoAustraliaIoni Bowcher QUALIFIED
Cody SaylorsCanadaBernardo Dominic NEW
Kadeem FlosiJapanAmy Elsner QUALIFIED
Julie StensethRussiaAmy Elsner UNQUALIFIED
Stacey MacleadCanadaIvan Magalhaes UNQUALIFIED
Costa DilliardRussiaAnna Fali NEW
Leja CaldareraFranceBernardo Dominic UNQUALIFIED
Rodrigues CampainCanadaOnyama Limba NEW
Smith GlickCanadaAnna Fali QUALIFIED
Isabel BowleyRussiaBernardo Dominic UNQUALIFIED
Stacey MacleadAustraliaIvan Magalhaes RENEWAL
Maisha RulapaughUnited KingdomElwin Sharvill QUALIFIED
Murillo MaletArgentinaOnyama Limba PROPOSAL
Ricardo GauchoRussiaIoni Bowcher NEW
Rodrigues CampainItalyIoni Bowcher PROPOSAL
Misaki RoysterBrazilAmy Elsner NEGOTIATION
Julie StensethAustraliaIvan Magalhaes NEGOTIATION
Jefferson SchemmerBrazilXuxue Feng UNQUALIFIED
Maisha RulapaughRussiaElwin Sharvill RENEWAL
Jefferson SchemmerArgentinaIvan Magalhaes NEGOTIATION
Octavia MaletIndiaBernardo Dominic PROPOSAL
Darci PoquetteCanadaAnna Fali UNQUALIFIED
Antonio CaudyItalyAsiya Javayant QUALIFIED
Jefferson SchemmerIndiaStephen Shaw PROPOSAL
Jones VocelkaIndiaAsiya Javayant RENEWAL
Sinclair WaycottJapanAmy Elsner PROPOSAL
Arvin AlbaresUnited KingdomIoni Bowcher NEW
Wickens NestleCanadaXuxue Feng UNQUALIFIED
Isabel BowleyRussiaAnna Fali RENEWAL
Mujtaba NickaFranceXuxue Feng PROPOSAL
Jefferson SchemmerIndiaStephen Shaw RENEWAL
Maria MarrierSpainIoni Bowcher RENEWAL
Claire TollnerBrazilXuxue Feng NEGOTIATION
Jefferson SchemmerIndiaAmy Elsner QUALIFIED
Deepesh ChuiItalyAsiya Javayant UNQUALIFIED
Jeanfrancois VenereRussiaAsiya Javayant UNQUALIFIED
Jefferson SchemmerFranceOnyama Limba QUALIFIED
Leon OldroydAustraliaOnyama Limba NEW
Morrow RutaSpainOnyama Limba RENEWAL
Stacey MacleadCanadaIoni Bowcher NEGOTIATION
Morrow RutaBrazilElwin Sharvill QUALIFIED
James ButtSpainAsiya Javayant PROPOSAL
Tony FollerJapanXuxue Feng NEGOTIATION
Misaki RoysterJapanStephen Shaw PROPOSAL
Frozen Columns
Name
Izzy Garufi
Salvatore Stockham
Munro Ferencz
Greenwood Bolognia
Mayumi Kolmetz
Aruna Figeroa
Jones Vocelka
Salvatore Stockham
Tony Foller
Izzy Garufi
Jennifer Amigon
Murillo Malet
Alejandro Perin
Deepesh Chui
Julie Stenseth
Smith Glick
Munro Ferencz
Leja Caldarera
Isabel Bowley
Munro Ferencz
Maria Marrier
Ivar Paprocki
Misaki Royster
Mujtaba Nicka
David Darakjy
Jeanfrancois Venere
Adams Morasca
Sinclair Waycott
Jefferson Schemmer
Izzy Garufi
Munro Ferencz
Mujtaba Nicka
Claire Tollner
Faith Gillian
Kaitlin Ostrosky
Cody Saylors
Emily Whobrey
Mujtaba Nicka
Murillo Malet
Jennifer Amigon
Smith Glick
Morrow Ruta
Ashley Doe
Arvin Albares
Cody Saylors
Isabel Bowley
Aika Inouye
Greenwood Bolognia
Smith Glick
Julie Stenseth
IdCountryDate
1000Germany2025-10-07
1001Germany2025-10-07
1002France2025-10-02
1003Australia2025-09-29
1004Germany2025-09-27
1005United Kingdom2025-09-27
1006France2025-09-19
1007France2025-10-08
1008Russia2025-10-12
1009Canada2025-10-09
1010Japan2025-09-26
1011Germany2025-09-17
1012Russia2025-10-04
1013Japan2025-09-14
1014Spain2025-09-15
1015France2025-10-13
1016India2025-09-27
1017India2025-10-11
1018Italy2025-09-27
1019Canada2025-09-18
1020United Kingdom2025-10-09
1021Australia2025-09-26
1022Australia2025-09-25
1023Brazil2025-10-01
1024Canada2025-10-02
1025Japan2025-09-26
1026United Kingdom2025-09-14
1027Russia2025-09-22
1028Canada2025-10-02
1029Canada2025-10-09
1030United Kingdom2025-09-14
1031Italy2025-10-07
1032Japan2025-09-15
1033Japan2025-09-18
1034India2025-09-21
1035Canada2025-09-18
1036India2025-10-10
1037Brazil2025-09-28
1038Argentina2025-09-14
1039Russia2025-09-21
1040Russia2025-09-21
1041Germany2025-10-13
1042Italy2025-09-21
1043Brazil2025-09-28
1044Italy2025-09-22
1045Brazil2025-09-21
1046Canada2025-10-09
1047Germany2025-09-16
1048Russia2025-09-15
1049Russia2025-10-10

On-Demand Data

NameIdCountryDate
Maria Marrier1000United Kingdom2025-09-22
Johnson Sergi1001India2025-09-23
Alejandro Perin1002Germany2025-10-10
Leja Caldarera1003Brazil2025-09-15
Morrow Ruta1004Italy2025-10-05
Adams Morasca1005France2025-09-19
Ricardo Gaucho1006Argentina2025-09-18
Clifford Rim1007United Kingdom2025-09-15
Sinclair Waycott1008Germany2025-10-01
Cody Saylors1009Argentina2025-10-06
Wickens Nestle1010United Kingdom2025-09-27
Tony Foller1011India2025-10-03
Aika Inouye1012Australia2025-10-01
Maisha Rulapaugh1013Russia2025-09-16
Francesco Shinko1014United Kingdom2025-09-17
Ashley Doe1015Australia2025-10-12
Isabel Bowley1016Italy2025-10-10
Aruna Figeroa1017Japan2025-09-23
Rodrigues Campain1018Argentina2025-10-07
Smith Glick1019Canada2025-10-11
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jeanfrancois VenereGermanyIoni Bowcher NEGOTIATION
Adams MorascaSpainAmy Elsner NEGOTIATION
Nicolas IturbideFranceStephen Shaw UNQUALIFIED
Octavia MaletArgentinaXuxue Feng PROPOSAL
Julie StensethIndiaIvan Magalhaes UNQUALIFIED
Jennifer AmigonJapanAmy Elsner QUALIFIED
Jefferson SchemmerFranceAmy Elsner PROPOSAL
Smith GlickAustraliaBernardo Dominic UNQUALIFIED
Mujtaba NickaArgentinaAsiya Javayant NEGOTIATION
David DarakjyArgentinaOnyama Limba QUALIFIED
Tony FollerUnited KingdomIoni Bowcher QUALIFIED
Johnson SergiBrazilAsiya Javayant QUALIFIED
Clifford RimCanadaIoni Bowcher RENEWAL
Juan WieserSpainStephen Shaw NEGOTIATION
James ButtGermanyIvan Magalhaes QUALIFIED
Smith GlickBrazilAsiya Javayant PROPOSAL
Mujtaba NickaArgentinaAmy Elsner NEGOTIATION
Misaki RoysterArgentinaAmy Elsner NEGOTIATION
Mayumi KolmetzGermanyXuxue Feng UNQUALIFIED
Greenwood BologniaJapanAmy Elsner UNQUALIFIED
Claire TollnerAustraliaIoni Bowcher RENEWAL
Kadeem FlosiJapanAsiya Javayant NEW
James ButtFranceXuxue Feng NEGOTIATION
Arvin AlbaresCanadaStephen Shaw RENEWAL
Jennifer AmigonItalyAmy Elsner NEGOTIATION
Maisha RulapaughBrazilXuxue Feng PROPOSAL
Emily WhobreyCanadaAsiya Javayant NEW
Faith GillianUnited KingdomIoni Bowcher NEW
Munro FerenczItalyAnna Fali UNQUALIFIED
Mujtaba NickaSpainOnyama Limba QUALIFIED
Jones VocelkaArgentinaOnyama Limba PROPOSAL
Kaitlin OstroskyCanadaIvan Magalhaes PROPOSAL
Ricardo GauchoRussiaXuxue Feng RENEWAL
David DarakjyArgentinaOnyama Limba UNQUALIFIED
Clifford RimUnited KingdomAmy Elsner NEW
Costa DilliardAustraliaAmy Elsner NEW
Juan WieserFranceStephen Shaw UNQUALIFIED
Aditya KuskoGermanyStephen Shaw NEGOTIATION
Sinclair WaycottArgentinaAmy Elsner PROPOSAL
Mayumi KolmetzBrazilIoni Bowcher 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>