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
Smith GlickFranceIoni Bowcher RENEWAL
Johnson SergiUnited KingdomStephen Shaw PROPOSAL
Isabel BowleyJapanOnyama Limba RENEWAL
Aruna FigeroaAustraliaAnna Fali NEGOTIATION
Chavez BriddickArgentinaIoni Bowcher QUALIFIED
Jones VocelkaSpainStephen Shaw PROPOSAL
Johnson SergiArgentinaBernardo Dominic RENEWAL
Leja CaldareraBrazilAsiya Javayant NEW
Alejandro PerinAustraliaElwin Sharvill PROPOSAL
James ButtItalyIoni Bowcher RENEWAL
Jeanfrancois VenereRussiaBernardo Dominic UNQUALIFIED
Alejandro PerinCanadaAsiya Javayant NEGOTIATION
Costa DilliardAustraliaOnyama Limba UNQUALIFIED
Wickens NestleIndiaOnyama Limba QUALIFIED
Alejandro PerinIndiaIvan Magalhaes RENEWAL
Claire TollnerJapanAsiya Javayant QUALIFIED
Greenwood BologniaFranceAsiya Javayant UNQUALIFIED
David DarakjyIndiaIoni Bowcher PROPOSAL
Deepesh ChuiItalyIoni Bowcher PROPOSAL
Antonio CaudyCanadaElwin Sharvill UNQUALIFIED
Tony FollerJapanStephen Shaw NEGOTIATION
Misaki RoysterGermanyAnna Fali QUALIFIED
Tony FollerGermanyBernardo Dominic UNQUALIFIED
Tony FollerItalyOnyama Limba RENEWAL
Ashley DoeItalyAmy Elsner PROPOSAL
Maisha RulapaughFranceIvan Magalhaes QUALIFIED
Jeanfrancois VenereIndiaIoni Bowcher UNQUALIFIED
Mujtaba NickaArgentinaBernardo Dominic RENEWAL
Silvio SlusarskiUnited KingdomXuxue Feng QUALIFIED
Francesco ShinkoItalyIvan Magalhaes NEGOTIATION
Murillo MaletSpainBernardo Dominic UNQUALIFIED
Ivar PaprockiSpainAnna Fali NEGOTIATION
Morrow RutaFranceIvan Magalhaes QUALIFIED
Costa DilliardUnited KingdomStephen Shaw RENEWAL
Silvio SlusarskiJapanAsiya Javayant QUALIFIED
Emily WhobreyIndiaAmy Elsner NEGOTIATION
Jones VocelkaItalyIoni Bowcher NEW
Chavez BriddickArgentinaAnna Fali RENEWAL
Leon OldroydFranceBernardo Dominic NEGOTIATION
Isabel BowleyBrazilIvan Magalhaes NEW
Johnson SergiAustraliaBernardo Dominic NEW
Morrow RutaRussiaStephen Shaw NEGOTIATION
Deepesh ChuiUnited KingdomIoni Bowcher RENEWAL
Alejandro PerinUnited KingdomIvan Magalhaes NEW
Nicolas IturbideItalyStephen Shaw NEW
Emily WhobreyRussiaXuxue Feng PROPOSAL
Adams MorascaIndiaAmy Elsner UNQUALIFIED
Aditya KuskoJapanXuxue Feng NEGOTIATION
Aika InouyeJapanOnyama Limba NEGOTIATION
Cody SaylorsGermanyOnyama Limba PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Adams MorascaFranceElwin Sharvill NEW
James ButtFranceAnna Fali NEGOTIATION
Misaki RoysterGermanyAmy Elsner RENEWAL
Kadeem FlosiAustraliaOnyama Limba NEW
Stacey MacleadBrazilAmy Elsner QUALIFIED
Munro FerenczUnited KingdomAnna Fali UNQUALIFIED
Alejandro PerinFranceBernardo Dominic PROPOSAL
Aruna FigeroaAustraliaIoni Bowcher NEGOTIATION
Aika InouyeArgentinaElwin Sharvill UNQUALIFIED
Jones VocelkaFranceAnna Fali UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Munro FerenczItaly2026-04-21Dorl, James J Esq NEW61Onyama Limba
1001Cody SaylorsSpain2026-04-09Chemel, James L Cpa PROPOSAL69Bernardo Dominic
1002Julie StensethSpain2026-04-23Feltz Printing Service UNQUALIFIED54Anna Fali
1003Deepesh ChuiUnited Kingdom2026-04-14Chapman, Ross E Esq UNQUALIFIED12Stephen Shaw
1004Octavia MaletGermany2026-05-03Truhlar And Truhlar Attys NEW31Ivan Magalhaes
1005Emily WhobreyUnited Kingdom2026-04-20Feltz Printing Service RENEWAL59Bernardo Dominic
1006Tony FollerCanada2026-04-18Truhlar And Truhlar Attys UNQUALIFIED94Xuxue Feng
1007James ButtCanada2026-05-03Feltz Printing Service UNQUALIFIED13Stephen Shaw
1008Chavez BriddickGermany2026-04-18Benton, John B Jr UNQUALIFIED73Onyama Limba
1009Mayumi KolmetzCanada2026-04-22Feiner Bros QUALIFIED92Bernardo Dominic
1010Smith GlickUnited Kingdom2026-04-08Dorl, James J Esq QUALIFIED78Onyama Limba
1011Stacey MacleadIndia2026-04-17Feltz Printing Service QUALIFIED20Anna Fali
1012Jeanfrancois VenereRussia2026-04-17Rangoni Of Florence NEW79Elwin Sharvill
1013Alejandro PerinItaly2026-04-29Feiner Bros NEGOTIATION35Asiya Javayant
1014Ashley DoeUnited Kingdom2026-04-17Benton, John B Jr QUALIFIED98Anna Fali
1015Nicolas IturbideIndia2026-04-09Rangoni Of Florence NEW32Ioni Bowcher
1016Chavez BriddickUnited Kingdom2026-04-08Chapman, Ross E Esq PROPOSAL81Stephen Shaw
1017Johnson SergiArgentina2026-04-05Feiner Bros QUALIFIED67Stephen Shaw
1018Claire TollnerCanada2026-04-29Morlong Associates RENEWAL48Asiya Javayant
1019Jeanfrancois VenereFrance2026-04-12Chapman, Ross E Esq QUALIFIED22Ivan Magalhaes
1020Cody SaylorsArgentina2026-04-23Feiner Bros RENEWAL49Xuxue Feng
1021Leja CaldareraFrance2026-04-20Printing Dimensions PROPOSAL29Onyama Limba
1022Kaitlin OstroskyAustralia2026-04-05Dorl, James J Esq NEGOTIATION92Anna Fali
1023Leja CaldareraUnited Kingdom2026-04-19Rangoni Of Florence RENEWAL39Stephen Shaw
1024Leja CaldareraSpain2026-04-13Dorl, James J Esq RENEWAL40Ivan Magalhaes
1025Smith GlickUnited Kingdom2026-04-16Rangoni Of Florence NEW68Amy Elsner
1026Wickens NestleSpain2026-04-24Rousseaux, Michael Esq PROPOSAL7Elwin Sharvill
1027Smith GlickGermany2026-04-29Dorl, James J Esq QUALIFIED70Ivan Magalhaes
1028Darci PoquetteAustralia2026-04-11Benton, John B Jr QUALIFIED34Stephen Shaw
1029Munro FerenczJapan2026-04-11Chemel, James L Cpa NEGOTIATION58Onyama Limba
1030Mayumi KolmetzUnited Kingdom2026-04-29Commercial Press RENEWAL67Ivan Magalhaes
1031Misaki RoysterCanada2026-05-04King, Christopher A Esq NEW39Ivan Magalhaes
1032Clifford RimAustralia2026-04-20Truhlar And Truhlar Attys RENEWAL89Ioni Bowcher
1033Ricardo GauchoRussia2026-04-19Commercial Press QUALIFIED8Stephen Shaw
1034Alejandro PerinCanada2026-04-12Truhlar And Truhlar Attys UNQUALIFIED95Xuxue Feng
1035Salvatore StockhamUnited Kingdom2026-04-07Chanay, Jeffrey A Esq NEGOTIATION77Onyama Limba
1036Aditya KuskoJapan2026-04-27Chapman, Ross E Esq QUALIFIED99Elwin Sharvill
1037Johnson SergiFrance2026-04-28Commercial Press PROPOSAL76Asiya Javayant
1038Tony FollerJapan2026-04-30Rangoni Of Florence RENEWAL20Ioni Bowcher
1039Francesco ShinkoUnited Kingdom2026-04-30Morlong Associates PROPOSAL88Elwin Sharvill
1040Silvio SlusarskiIndia2026-04-25Chemel, James L Cpa QUALIFIED1Anna Fali
1041Greenwood BologniaBrazil2026-04-21Rangoni Of Florence QUALIFIED25Onyama Limba
1042Leja CaldareraSpain2026-04-29Dorl, James J Esq NEGOTIATION73Anna Fali
1043Murillo MaletFrance2026-04-22Feiner Bros PROPOSAL16Xuxue Feng
1044Smith GlickRussia2026-04-26Feltz Printing Service UNQUALIFIED94Amy Elsner
1045Salvatore StockhamAustralia2026-04-16Truhlar And Truhlar Attys PROPOSAL88Asiya Javayant
1046Alejandro PerinAustralia2026-04-09Printing Dimensions UNQUALIFIED26Ivan Magalhaes
1047Kadeem FlosiAustralia2026-04-22Rangoni Of Florence NEGOTIATION8Xuxue Feng
1048Claire TollnerRussia2026-04-14Truhlar And Truhlar Attys RENEWAL21Elwin Sharvill
1049Cody SaylorsItaly2026-04-17Dorl, James J Esq NEW10Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Johnson SergiItalyBernardo Dominic NEW
Francesco ShinkoCanadaXuxue Feng PROPOSAL
Cody SaylorsCanadaBernardo Dominic NEW
Costa DilliardAustraliaBernardo Dominic QUALIFIED
Octavia MaletArgentinaElwin Sharvill PROPOSAL
David DarakjyIndiaAnna Fali UNQUALIFIED
Antonio CaudyJapanBernardo Dominic QUALIFIED
Mujtaba NickaSpainBernardo Dominic QUALIFIED
James ButtIndiaStephen Shaw NEW
Aruna FigeroaGermanyAmy Elsner RENEWAL
Johnson SergiRussiaElwin Sharvill UNQUALIFIED
Johnson SergiSpainOnyama Limba UNQUALIFIED
Deepesh ChuiGermanyAsiya Javayant PROPOSAL
Leon OldroydSpainBernardo Dominic PROPOSAL
Alejandro PerinCanadaAsiya Javayant PROPOSAL
Mayumi KolmetzBrazilIoni Bowcher PROPOSAL
Aditya KuskoAustraliaAmy Elsner NEGOTIATION
Juan WieserIndiaIvan Magalhaes UNQUALIFIED
Jefferson SchemmerGermanyXuxue Feng NEW
Ivar PaprockiSpainAmy Elsner NEW
Alejandro PerinBrazilIoni Bowcher PROPOSAL
Smith GlickUnited KingdomStephen Shaw NEGOTIATION
Chavez BriddickBrazilXuxue Feng QUALIFIED
Izzy GarufiFranceStephen Shaw PROPOSAL
Juan WieserIndiaXuxue Feng RENEWAL
Isabel BowleyBrazilElwin Sharvill NEGOTIATION
Ivar PaprockiRussiaStephen Shaw NEW
Adams MorascaAustraliaAmy Elsner QUALIFIED
Octavia MaletJapanIvan Magalhaes PROPOSAL
Murillo MaletRussiaXuxue Feng UNQUALIFIED
Leja CaldareraAustraliaAnna Fali QUALIFIED
Jones VocelkaGermanyStephen Shaw UNQUALIFIED
Salvatore StockhamGermanyAmy Elsner QUALIFIED
Stacey MacleadCanadaElwin Sharvill PROPOSAL
Leon OldroydJapanIoni Bowcher NEGOTIATION
David DarakjyFranceAnna Fali UNQUALIFIED
Adams MorascaItalyElwin Sharvill RENEWAL
Ivar PaprockiGermanyOnyama Limba RENEWAL
Aruna FigeroaAustraliaIvan Magalhaes NEW
Adams MorascaUnited KingdomIoni Bowcher RENEWAL
Isabel BowleyRussiaElwin Sharvill NEGOTIATION
Munro FerenczIndiaOnyama Limba UNQUALIFIED
Aruna FigeroaArgentinaIvan Magalhaes UNQUALIFIED
Octavia MaletSpainAsiya Javayant NEGOTIATION
Emily WhobreyIndiaIoni Bowcher NEGOTIATION
Stacey MacleadItalyIvan Magalhaes UNQUALIFIED
Wickens NestleAustraliaOnyama Limba PROPOSAL
Salvatore StockhamItalyAmy Elsner PROPOSAL
Mayumi KolmetzUnited KingdomStephen Shaw NEGOTIATION
Maisha RulapaughRussiaBernardo Dominic NEGOTIATION
Frozen Columns
Name
Jefferson Schemmer
Emily Whobrey
Francesco Shinko
Costa Dilliard
Wickens Nestle
Cody Saylors
Ashley Doe
Nicolas Iturbide
Isabel Bowley
Leon Oldroyd
Maisha Rulapaugh
Faith Gillian
Leon Oldroyd
Antonio Caudy
Cody Saylors
Leja Caldarera
Jennifer Amigon
Misaki Royster
Sinclair Waycott
Silvio Slusarski
Jennifer Amigon
Tony Foller
Arvin Albares
David Darakjy
Aditya Kusko
David Darakjy
Morrow Ruta
Costa Dilliard
Maisha Rulapaugh
Kaitlin Ostrosky
Antonio Caudy
Faith Gillian
Clifford Rim
Costa Dilliard
Jones Vocelka
Aruna Figeroa
Costa Dilliard
Johnson Sergi
Arvin Albares
Smith Glick
Morrow Ruta
Mujtaba Nicka
Nicolas Iturbide
Greenwood Bolognia
Maisha Rulapaugh
Sinclair Waycott
Greenwood Bolognia
Adams Morasca
Nicolas Iturbide
Greenwood Bolognia
IdCountryDate
1000Argentina2026-04-27
1001France2026-05-01
1002Canada2026-04-16
1003Italy2026-04-06
1004Russia2026-04-24
1005France2026-04-10
1006Australia2026-04-15
1007Russia2026-04-21
1008Russia2026-04-07
1009Japan2026-04-06
1010France2026-04-16
1011India2026-04-11
1012Australia2026-04-12
1013Canada2026-05-04
1014Australia2026-04-05
1015United Kingdom2026-04-20
1016Japan2026-05-02
1017Spain2026-05-03
1018France2026-04-10
1019Australia2026-04-29
1020India2026-04-25
1021Spain2026-04-16
1022Japan2026-04-11
1023France2026-04-20
1024Italy2026-04-23
1025Japan2026-04-09
1026Japan2026-04-11
1027Japan2026-04-15
1028Italy2026-04-15
1029Italy2026-04-15
1030Brazil2026-05-01
1031Germany2026-04-20
1032Brazil2026-05-01
1033Russia2026-04-11
1034Russia2026-04-28
1035Brazil2026-04-29
1036Russia2026-04-17
1037Brazil2026-04-08
1038France2026-04-13
1039Japan2026-04-13
1040Argentina2026-04-20
1041Canada2026-04-18
1042Canada2026-04-26
1043France2026-04-11
1044Canada2026-04-25
1045Russia2026-04-10
1046Canada2026-04-11
1047Italy2026-04-25
1048Japan2026-04-10
1049Spain2026-04-15

On-Demand Data

NameIdCountryDate
Emily Whobrey1000Spain2026-04-12
Silvio Slusarski1001Germany2026-04-12
Ricardo Gaucho1002France2026-04-09
Jones Vocelka1003United Kingdom2026-04-15
Morrow Ruta1004France2026-05-03
Deepesh Chui1005United Kingdom2026-04-17
Kadeem Flosi1006United Kingdom2026-04-05
Maria Marrier1007Australia2026-04-11
Tony Foller1008United Kingdom2026-04-14
Leon Oldroyd1009Canada2026-04-06
Silvio Slusarski1010Russia2026-04-30
Salvatore Stockham1011Italy2026-04-05
Aditya Kusko1012Australia2026-04-18
Cody Saylors1013Japan2026-04-18
Morrow Ruta1014United Kingdom2026-04-19
Clifford Rim1015India2026-04-19
Salvatore Stockham1016Canada2026-04-18
Alejandro Perin1017Russia2026-04-15
Clifford Rim1018Germany2026-04-30
Costa Dilliard1019Spain2026-04-23
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aika InouyeFranceOnyama Limba NEGOTIATION
Julie StensethRussiaIoni Bowcher RENEWAL
David DarakjyGermanyStephen Shaw QUALIFIED
Octavia MaletUnited KingdomStephen Shaw NEGOTIATION
Ivar PaprockiIndiaAmy Elsner NEW
Octavia MaletSpainElwin Sharvill RENEWAL
Aruna FigeroaFranceIoni Bowcher NEGOTIATION
Salvatore StockhamJapanAsiya Javayant NEW
Julie StensethIndiaXuxue Feng RENEWAL
Nicolas IturbideCanadaBernardo Dominic RENEWAL
Aditya KuskoRussiaAmy Elsner RENEWAL
Nicolas IturbideItalyElwin Sharvill QUALIFIED
Jefferson SchemmerFranceXuxue Feng QUALIFIED
Rodrigues CampainFranceElwin Sharvill UNQUALIFIED
Jones VocelkaItalyElwin Sharvill UNQUALIFIED
Munro FerenczIndiaBernardo Dominic QUALIFIED
Ivar PaprockiJapanIvan Magalhaes NEGOTIATION
Leja CaldareraRussiaXuxue Feng QUALIFIED
Murillo MaletRussiaXuxue Feng NEGOTIATION
Johnson SergiCanadaElwin Sharvill PROPOSAL
Julie StensethSpainBernardo Dominic QUALIFIED
Emily WhobreySpainIoni Bowcher RENEWAL
Antonio CaudyIndiaIoni Bowcher PROPOSAL
Mayumi KolmetzRussiaBernardo Dominic NEGOTIATION
Aditya KuskoFranceBernardo Dominic NEW
Smith GlickJapanAnna Fali NEW
Tony FollerIndiaStephen Shaw NEGOTIATION
Emily WhobreySpainXuxue Feng NEW
Octavia MaletArgentinaIvan Magalhaes RENEWAL
Chavez BriddickBrazilIoni Bowcher NEW
Jennifer AmigonJapanOnyama Limba PROPOSAL
Darci PoquetteGermanyOnyama Limba QUALIFIED
Jeanfrancois VenereJapanAmy Elsner NEW
Munro FerenczFranceElwin Sharvill UNQUALIFIED
Isabel BowleyUnited KingdomAsiya Javayant RENEWAL
Ricardo GauchoRussiaIvan Magalhaes UNQUALIFIED
Claire TollnerCanadaAsiya Javayant NEGOTIATION
Smith GlickArgentinaStephen Shaw RENEWAL
Cody SaylorsIndiaXuxue Feng PROPOSAL
Morrow RutaFranceIoni Bowcher 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>