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
Mujtaba NickaIndiaAnna Fali QUALIFIED
Rodrigues CampainJapanXuxue Feng NEW
Jeanfrancois VenereAustraliaStephen Shaw RENEWAL
Mujtaba NickaFranceIvan Magalhaes PROPOSAL
Kaitlin OstroskyFranceIoni Bowcher QUALIFIED
Nicolas IturbideFranceAsiya Javayant UNQUALIFIED
Wickens NestleRussiaAmy Elsner PROPOSAL
Morrow RutaJapanAnna Fali QUALIFIED
Clifford RimBrazilElwin Sharvill NEW
Smith GlickSpainIoni Bowcher NEW
Cody SaylorsJapanStephen Shaw QUALIFIED
Salvatore StockhamBrazilXuxue Feng QUALIFIED
Kaitlin OstroskyJapanAsiya Javayant NEW
Murillo MaletIndiaIvan Magalhaes UNQUALIFIED
Maria MarrierItalyIvan Magalhaes PROPOSAL
Francesco ShinkoRussiaBernardo Dominic UNQUALIFIED
Emily WhobreyAustraliaStephen Shaw NEW
Darci PoquetteIndiaBernardo Dominic RENEWAL
Ashley DoeAustraliaAsiya Javayant NEGOTIATION
Mayumi KolmetzBrazilIvan Magalhaes RENEWAL
Sinclair WaycottArgentinaOnyama Limba NEGOTIATION
Emily WhobreyRussiaElwin Sharvill NEGOTIATION
Maria MarrierIndiaStephen Shaw NEW
Aditya KuskoCanadaXuxue Feng NEW
Murillo MaletJapanBernardo Dominic NEW
Kaitlin OstroskyUnited KingdomIvan Magalhaes UNQUALIFIED
Alejandro PerinAustraliaStephen Shaw NEGOTIATION
James ButtFranceBernardo Dominic NEGOTIATION
Mayumi KolmetzRussiaBernardo Dominic NEW
Mayumi KolmetzGermanyOnyama Limba NEW
Izzy GarufiSpainIvan Magalhaes UNQUALIFIED
Leja CaldareraBrazilStephen Shaw QUALIFIED
Alejandro PerinCanadaAmy Elsner UNQUALIFIED
Octavia MaletArgentinaAnna Fali UNQUALIFIED
Silvio SlusarskiJapanBernardo Dominic RENEWAL
Izzy GarufiCanadaAsiya Javayant UNQUALIFIED
Misaki RoysterSpainStephen Shaw UNQUALIFIED
Aditya KuskoUnited KingdomStephen Shaw QUALIFIED
Aditya KuskoCanadaIoni Bowcher NEGOTIATION
Silvio SlusarskiCanadaIoni Bowcher RENEWAL
Mayumi KolmetzUnited KingdomIoni Bowcher NEW
Aruna FigeroaAustraliaAsiya Javayant NEGOTIATION
Silvio SlusarskiFranceBernardo Dominic PROPOSAL
Isabel BowleyRussiaOnyama Limba QUALIFIED
Darci PoquetteRussiaAnna Fali NEW
Ricardo GauchoIndiaIoni Bowcher PROPOSAL
Wickens NestleRussiaElwin Sharvill UNQUALIFIED
Faith GillianItalyXuxue Feng RENEWAL
Juan WieserSpainElwin Sharvill QUALIFIED
Misaki RoysterUnited KingdomElwin Sharvill RENEWAL
Horizontal
NameCountryRepresentativeStatus
James ButtBrazilXuxue Feng PROPOSAL
Clifford RimGermanyAsiya Javayant RENEWAL
Kaitlin OstroskyItalyOnyama Limba RENEWAL
Deepesh ChuiGermanyAmy Elsner NEGOTIATION
Nicolas IturbideSpainAmy Elsner QUALIFIED
James ButtArgentinaBernardo Dominic RENEWAL
Deepesh ChuiUnited KingdomAnna Fali NEW
Kaitlin OstroskyRussiaAnna Fali RENEWAL
Mayumi KolmetzItalyAnna Fali NEW
Aruna FigeroaFranceElwin Sharvill UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Jones VocelkaAustralia2026-05-25Chapman, Ross E Esq NEW60Elwin Sharvill
1001Costa DilliardJapan2026-05-09Dorl, James J Esq NEW46Ioni Bowcher
1002Jennifer AmigonFrance2026-05-20Commercial Press QUALIFIED59Amy Elsner
1003Octavia MaletRussia2026-05-25Dorl, James J Esq RENEWAL24Elwin Sharvill
1004Munro FerenczUnited Kingdom2026-05-18Morlong Associates NEGOTIATION70Xuxue Feng
1005Faith GillianArgentina2026-05-11Rousseaux, Michael Esq PROPOSAL83Amy Elsner
1006Darci PoquetteUnited Kingdom2026-05-07Buckley Miller Wright NEGOTIATION94Elwin Sharvill
1007Murillo MaletUnited Kingdom2026-05-20Chapman, Ross E Esq QUALIFIED73Stephen Shaw
1008Wickens NestleRussia2026-05-14Feiner Bros PROPOSAL31Onyama Limba
1009Juan WieserFrance2026-05-11Dorl, James J Esq PROPOSAL34Amy Elsner
1010Jennifer AmigonUnited Kingdom2026-05-11Benton, John B Jr RENEWAL15Ioni Bowcher
1011Chavez BriddickBrazil2026-05-01Truhlar And Truhlar Attys QUALIFIED44Amy Elsner
1012Clifford RimGermany2026-05-09Truhlar And Truhlar Attys NEGOTIATION71Asiya Javayant
1013Arvin AlbaresGermany2026-05-05Chemel, James L Cpa QUALIFIED36Amy Elsner
1014Faith GillianArgentina2026-04-30King, Christopher A Esq UNQUALIFIED16Ivan Magalhaes
1015Juan WieserJapan2026-05-22Rousseaux, Michael Esq RENEWAL2Asiya Javayant
1016Silvio SlusarskiGermany2026-05-21Commercial Press NEW2Asiya Javayant
1017Claire TollnerGermany2026-05-16Feltz Printing Service NEGOTIATION96Ioni Bowcher
1018Julie StensethAustralia2026-05-24Feltz Printing Service QUALIFIED50Elwin Sharvill
1019Mujtaba NickaBrazil2026-05-02Chapman, Ross E Esq UNQUALIFIED64Ivan Magalhaes
1020James ButtAustralia2026-05-17Feiner Bros NEW91Ivan Magalhaes
1021Octavia MaletUnited Kingdom2026-04-26Truhlar And Truhlar Attys PROPOSAL72Xuxue Feng
1022Mayumi KolmetzAustralia2026-05-13Rousseaux, Michael Esq PROPOSAL70Ioni Bowcher
1023Emily WhobreyJapan2026-05-17Buckley Miller Wright NEW30Onyama Limba
1024Mayumi KolmetzAustralia2026-05-16Morlong Associates UNQUALIFIED39Bernardo Dominic
1025Ivar PaprockiJapan2026-04-27Printing Dimensions RENEWAL78Ivan Magalhaes
1026Wickens NestleBrazil2026-05-15Feltz Printing Service PROPOSAL3Asiya Javayant
1027Kaitlin OstroskyItaly2026-05-13Benton, John B Jr RENEWAL85Stephen Shaw
1028Aruna FigeroaFrance2026-05-01Buckley Miller Wright NEGOTIATION33Bernardo Dominic
1029Kaitlin OstroskyAustralia2026-04-29Morlong Associates PROPOSAL7Anna Fali
1030Arvin AlbaresFrance2026-05-18Feiner Bros UNQUALIFIED49Bernardo Dominic
1031Alejandro PerinItaly2026-05-20Feltz Printing Service PROPOSAL84Anna Fali
1032Nicolas IturbideCanada2026-05-03Morlong Associates NEW14Bernardo Dominic
1033Octavia MaletSpain2026-05-01Truhlar And Truhlar Attys NEW74Xuxue Feng
1034Francesco ShinkoBrazil2026-05-19Benton, John B Jr UNQUALIFIED52Anna Fali
1035James ButtIndia2026-05-21Feltz Printing Service UNQUALIFIED3Onyama Limba
1036Stacey MacleadJapan2026-05-13Chanay, Jeffrey A Esq RENEWAL48Elwin Sharvill
1037Ricardo GauchoItaly2026-04-30Chemel, James L Cpa NEW68Ioni Bowcher
1038Claire TollnerSpain2026-05-23Chapman, Ross E Esq PROPOSAL31Amy Elsner
1039Stacey MacleadArgentina2026-05-04Commercial Press QUALIFIED61Onyama Limba
1040Kadeem FlosiBrazil2026-05-03Morlong Associates PROPOSAL59Amy Elsner
1041Kadeem FlosiItaly2026-05-03Commercial Press RENEWAL12Anna Fali
1042Silvio SlusarskiSpain2026-05-04Benton, John B Jr NEGOTIATION83Stephen Shaw
1043Ivar PaprockiAustralia2026-05-12Buckley Miller Wright RENEWAL71Asiya Javayant
1044Aruna FigeroaBrazil2026-05-22King, Christopher A Esq PROPOSAL83Asiya Javayant
1045Silvio SlusarskiCanada2026-05-01Chanay, Jeffrey A Esq NEGOTIATION46Ivan Magalhaes
1046Jefferson SchemmerRussia2026-05-22Feiner Bros NEGOTIATION59Asiya Javayant
1047Smith GlickItaly2026-04-30Chanay, Jeffrey A Esq UNQUALIFIED3Bernardo Dominic
1048James ButtGermany2026-05-20Benton, John B Jr PROPOSAL17Xuxue Feng
1049Aditya KuskoRussia2026-05-21Rangoni Of Florence NEGOTIATION40Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
James ButtAustraliaIvan Magalhaes QUALIFIED
Nicolas IturbideArgentinaElwin Sharvill UNQUALIFIED
Costa DilliardBrazilAsiya Javayant RENEWAL
Aruna FigeroaBrazilStephen Shaw UNQUALIFIED
Wickens NestleArgentinaIvan Magalhaes PROPOSAL
Juan WieserFranceIoni Bowcher UNQUALIFIED
Maria MarrierRussiaElwin Sharvill NEW
Morrow RutaJapanAmy Elsner NEGOTIATION
Clifford RimUnited KingdomOnyama Limba RENEWAL
Alejandro PerinJapanIvan Magalhaes RENEWAL
David DarakjyCanadaStephen Shaw NEW
Murillo MaletArgentinaOnyama Limba QUALIFIED
Leon OldroydSpainStephen Shaw UNQUALIFIED
Arvin AlbaresUnited KingdomXuxue Feng QUALIFIED
Aditya KuskoGermanyAsiya Javayant NEW
Antonio CaudyArgentinaElwin Sharvill NEW
Kaitlin OstroskyIndiaAsiya Javayant RENEWAL
Francesco ShinkoFranceAsiya Javayant QUALIFIED
Costa DilliardFranceIoni Bowcher QUALIFIED
Jeanfrancois VenereBrazilXuxue Feng PROPOSAL
Leon OldroydBrazilIvan Magalhaes RENEWAL
Darci PoquetteAustraliaIvan Magalhaes NEW
Alejandro PerinUnited KingdomOnyama Limba UNQUALIFIED
Salvatore StockhamJapanAmy Elsner PROPOSAL
Sinclair WaycottItalyStephen Shaw RENEWAL
Costa DilliardSpainAsiya Javayant RENEWAL
Nicolas IturbideGermanyAnna Fali QUALIFIED
Nicolas IturbideBrazilStephen Shaw NEW
Ivar PaprockiArgentinaIvan Magalhaes UNQUALIFIED
Ricardo GauchoIndiaOnyama Limba UNQUALIFIED
Murillo MaletFranceElwin Sharvill PROPOSAL
Kadeem FlosiFranceXuxue Feng RENEWAL
Leja CaldareraRussiaElwin Sharvill UNQUALIFIED
Johnson SergiGermanyIoni Bowcher RENEWAL
Ivar PaprockiSpainElwin Sharvill QUALIFIED
Octavia MaletUnited KingdomElwin Sharvill PROPOSAL
Murillo MaletArgentinaOnyama Limba QUALIFIED
Rodrigues CampainCanadaStephen Shaw PROPOSAL
Jeanfrancois VenereGermanyAnna Fali QUALIFIED
Ashley DoeBrazilAnna Fali NEW
Tony FollerJapanOnyama Limba NEW
Stacey MacleadGermanyElwin Sharvill NEW
Antonio CaudyBrazilAmy Elsner NEGOTIATION
Salvatore StockhamGermanyXuxue Feng RENEWAL
Silvio SlusarskiRussiaXuxue Feng PROPOSAL
Morrow RutaIndiaAnna Fali NEW
Emily WhobreyIndiaIoni Bowcher QUALIFIED
Silvio SlusarskiCanadaBernardo Dominic UNQUALIFIED
Francesco ShinkoGermanyIoni Bowcher NEGOTIATION
Leon OldroydSpainAnna Fali QUALIFIED
Frozen Columns
Name
Faith Gillian
Kadeem Flosi
Chavez Briddick
Morrow Ruta
Leja Caldarera
Maisha Rulapaugh
Nicolas Iturbide
Mujtaba Nicka
Salvatore Stockham
Aditya Kusko
Leon Oldroyd
Morrow Ruta
Morrow Ruta
Murillo Malet
Johnson Sergi
Antonio Caudy
Johnson Sergi
Aditya Kusko
Mayumi Kolmetz
Claire Tollner
Salvatore Stockham
Jennifer Amigon
Kaitlin Ostrosky
Greenwood Bolognia
Jennifer Amigon
Jennifer Amigon
David Darakjy
Antonio Caudy
Ivar Paprocki
Isabel Bowley
Juan Wieser
Murillo Malet
Francesco Shinko
Ricardo Gaucho
Aditya Kusko
Ivar Paprocki
Francesco Shinko
Darci Poquette
Aruna Figeroa
Deepesh Chui
Aika Inouye
Izzy Garufi
Arvin Albares
Aruna Figeroa
Isabel Bowley
Stacey Maclead
Aruna Figeroa
Izzy Garufi
Antonio Caudy
Juan Wieser
IdCountryDate
1000Spain2026-05-15
1001France2026-05-14
1002Spain2026-05-07
1003Russia2026-04-30
1004India2026-04-28
1005Brazil2026-05-03
1006United Kingdom2026-04-26
1007United Kingdom2026-04-26
1008United Kingdom2026-05-22
1009Japan2026-05-17
1010France2026-04-28
1011Brazil2026-05-17
1012United Kingdom2026-05-24
1013Russia2026-05-05
1014Australia2026-05-17
1015Russia2026-05-14
1016Japan2026-05-13
1017Spain2026-05-24
1018Australia2026-05-11
1019Canada2026-05-25
1020Italy2026-05-13
1021Russia2026-05-12
1022Argentina2026-05-11
1023France2026-05-10
1024Canada2026-05-12
1025India2026-05-25
1026Germany2026-04-27
1027India2026-05-17
1028Italy2026-05-17
1029Italy2026-05-15
1030Argentina2026-05-23
1031Japan2026-05-21
1032Italy2026-05-03
1033Argentina2026-05-09
1034France2026-05-04
1035Japan2026-05-04
1036Italy2026-05-21
1037Spain2026-05-09
1038Italy2026-05-03
1039United Kingdom2026-05-14
1040Argentina2026-05-20
1041Australia2026-05-08
1042Japan2026-05-11
1043United Kingdom2026-04-29
1044Italy2026-05-16
1045Brazil2026-05-02
1046Spain2026-05-18
1047Russia2026-05-04
1048France2026-05-23
1049Germany2026-05-13

On-Demand Data

NameIdCountryDate
Faith Gillian1000Russia2026-04-29
Darci Poquette1001France2026-05-22
David Darakjy1002Australia2026-05-01
Stacey Maclead1003Brazil2026-04-26
Wickens Nestle1004Russia2026-05-14
Greenwood Bolognia1005India2026-05-11
Murillo Malet1006Canada2026-05-01
Wickens Nestle1007Russia2026-05-13
Clifford Rim1008Japan2026-05-18
James Butt1009United Kingdom2026-05-06
Murillo Malet1010Italy2026-05-10
Costa Dilliard1011Russia2026-05-16
Juan Wieser1012Japan2026-05-21
Izzy Garufi1013Spain2026-05-11
Mujtaba Nicka1014Argentina2026-05-17
Jefferson Schemmer1015Spain2026-05-13
Smith Glick1016Germany2026-05-17
Rodrigues Campain1017India2026-05-21
Nicolas Iturbide1018Argentina2026-05-18
Darci Poquette1019Brazil2026-04-30
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Mayumi KolmetzCanadaBernardo Dominic NEW
Tony FollerGermanyOnyama Limba NEW
Johnson SergiIndiaElwin Sharvill QUALIFIED
Emily WhobreyAustraliaIvan Magalhaes NEGOTIATION
Munro FerenczItalyIvan Magalhaes QUALIFIED
Ricardo GauchoBrazilBernardo Dominic UNQUALIFIED
Costa DilliardUnited KingdomAmy Elsner QUALIFIED
David DarakjyIndiaStephen Shaw NEGOTIATION
Munro FerenczCanadaAnna Fali NEGOTIATION
Aruna FigeroaFranceAnna Fali PROPOSAL
Silvio SlusarskiGermanyStephen Shaw PROPOSAL
Faith GillianFranceOnyama Limba NEW
Adams MorascaCanadaElwin Sharvill NEW
Aditya KuskoAustraliaIoni Bowcher NEW
Ricardo GauchoAustraliaAmy Elsner UNQUALIFIED
David DarakjyArgentinaXuxue Feng UNQUALIFIED
Antonio CaudySpainStephen Shaw RENEWAL
Julie StensethCanadaXuxue Feng RENEWAL
Claire TollnerFranceStephen Shaw NEW
Clifford RimFranceIvan Magalhaes NEGOTIATION
Johnson SergiArgentinaAsiya Javayant NEGOTIATION
Jeanfrancois VenereIndiaAmy Elsner NEGOTIATION
Antonio CaudyItalyIoni Bowcher QUALIFIED
Rodrigues CampainSpainElwin Sharvill NEW
Leon OldroydIndiaElwin Sharvill UNQUALIFIED
James ButtRussiaXuxue Feng QUALIFIED
Deepesh ChuiRussiaIvan Magalhaes UNQUALIFIED
Maisha RulapaughGermanyIvan Magalhaes UNQUALIFIED
Aditya KuskoArgentinaElwin Sharvill NEGOTIATION
Octavia MaletRussiaAsiya Javayant PROPOSAL
Juan WieserIndiaStephen Shaw QUALIFIED
Maisha RulapaughSpainAsiya Javayant PROPOSAL
Jennifer AmigonArgentinaAnna Fali RENEWAL
Kaitlin OstroskyJapanOnyama Limba UNQUALIFIED
Julie StensethUnited KingdomBernardo Dominic NEW
Jones VocelkaFranceIvan Magalhaes QUALIFIED
Tony FollerJapanAnna Fali PROPOSAL
Emily WhobreyUnited KingdomAmy Elsner UNQUALIFIED
Rodrigues CampainRussiaStephen Shaw PROPOSAL
Silvio SlusarskiCanadaAmy Elsner RENEWAL

<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>