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
Jones VocelkaSpainBernardo Dominic RENEWAL
Misaki RoysterUnited KingdomStephen Shaw RENEWAL
Julie StensethBrazilIvan Magalhaes NEGOTIATION
Francesco ShinkoUnited KingdomAmy Elsner RENEWAL
Emily WhobreyRussiaBernardo Dominic NEGOTIATION
Isabel BowleyJapanStephen Shaw NEW
Ricardo GauchoSpainAnna Fali QUALIFIED
Adams MorascaJapanOnyama Limba QUALIFIED
Adams MorascaSpainStephen Shaw NEGOTIATION
Aruna FigeroaGermanyAnna Fali RENEWAL
Deepesh ChuiBrazilAsiya Javayant NEW
Kaitlin OstroskyCanadaOnyama Limba NEGOTIATION
Adams MorascaBrazilAmy Elsner NEW
Darci PoquetteGermanyAnna Fali NEGOTIATION
Kaitlin OstroskyUnited KingdomAmy Elsner UNQUALIFIED
Jefferson SchemmerIndiaIoni Bowcher NEW
Leon OldroydUnited KingdomAnna Fali PROPOSAL
Aika InouyeJapanXuxue Feng RENEWAL
Jefferson SchemmerRussiaOnyama Limba QUALIFIED
Leon OldroydCanadaBernardo Dominic PROPOSAL
Murillo MaletAustraliaIvan Magalhaes PROPOSAL
Jefferson SchemmerSpainIvan Magalhaes UNQUALIFIED
Mayumi KolmetzItalyAmy Elsner PROPOSAL
Smith GlickUnited KingdomAsiya Javayant RENEWAL
Kaitlin OstroskyIndiaAsiya Javayant RENEWAL
Greenwood BologniaSpainAsiya Javayant RENEWAL
Octavia MaletJapanElwin Sharvill RENEWAL
Silvio SlusarskiAustraliaAnna Fali NEW
Wickens NestleGermanyElwin Sharvill QUALIFIED
Tony FollerUnited KingdomAmy Elsner PROPOSAL
Costa DilliardSpainAnna Fali PROPOSAL
Mujtaba NickaUnited KingdomElwin Sharvill QUALIFIED
Clifford RimGermanyAmy Elsner NEGOTIATION
Antonio CaudyAustraliaElwin Sharvill NEW
Smith GlickFranceIoni Bowcher RENEWAL
Kadeem FlosiIndiaXuxue Feng QUALIFIED
Jefferson SchemmerBrazilXuxue Feng NEGOTIATION
Rodrigues CampainUnited KingdomXuxue Feng UNQUALIFIED
Stacey MacleadGermanyBernardo Dominic RENEWAL
Murillo MaletRussiaOnyama Limba NEGOTIATION
Cody SaylorsArgentinaAmy Elsner NEW
Leon OldroydUnited KingdomBernardo Dominic PROPOSAL
Maisha RulapaughAustraliaAsiya Javayant RENEWAL
David DarakjyUnited KingdomIvan Magalhaes UNQUALIFIED
Munro FerenczCanadaIvan Magalhaes NEW
Stacey MacleadAustraliaIoni Bowcher NEW
Silvio SlusarskiRussiaAnna Fali QUALIFIED
Emily WhobreyBrazilAsiya Javayant UNQUALIFIED
Jones VocelkaGermanyIvan Magalhaes NEW
Jones VocelkaArgentinaIoni Bowcher NEW
Horizontal
NameCountryRepresentativeStatus
Alejandro PerinAustraliaAmy Elsner NEW
Arvin AlbaresFranceBernardo Dominic RENEWAL
James ButtAustraliaBernardo Dominic RENEWAL
Tony FollerBrazilElwin Sharvill NEW
Greenwood BologniaCanadaIvan Magalhaes UNQUALIFIED
Arvin AlbaresItalyAsiya Javayant PROPOSAL
Juan WieserRussiaBernardo Dominic QUALIFIED
Octavia MaletRussiaAnna Fali QUALIFIED
Mayumi KolmetzItalyIoni Bowcher RENEWAL
Julie StensethRussiaIvan Magalhaes QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Greenwood BologniaIndia2026-05-11Benton, John B Jr QUALIFIED30Ivan Magalhaes
1001Stacey MacleadRussia2026-05-20Feiner Bros UNQUALIFIED9Onyama Limba
1002Ashley DoeJapan2026-05-06Feiner Bros NEW77Onyama Limba
1003Smith GlickArgentina2026-05-05Truhlar And Truhlar Attys UNQUALIFIED75Elwin Sharvill
1004Smith GlickCanada2026-05-04Feltz Printing Service PROPOSAL32Bernardo Dominic
1005Silvio SlusarskiRussia2026-05-14Commercial Press QUALIFIED7Xuxue Feng
1006Misaki RoysterAustralia2026-05-26King, Christopher A Esq NEGOTIATION10Asiya Javayant
1007Julie StensethItaly2026-05-18Chemel, James L Cpa NEW29Ivan Magalhaes
1008Arvin AlbaresGermany2026-05-30Chanay, Jeffrey A Esq QUALIFIED59Stephen Shaw
1009Alejandro PerinUnited Kingdom2026-05-25Dorl, James J Esq NEGOTIATION59Asiya Javayant
1010Izzy GarufiJapan2026-05-02Chanay, Jeffrey A Esq PROPOSAL84Xuxue Feng
1011Leon OldroydSpain2026-05-02Commercial Press QUALIFIED7Stephen Shaw
1012Aika InouyeCanada2026-05-29Printing Dimensions NEGOTIATION2Ivan Magalhaes
1013Greenwood BologniaAustralia2026-05-23Truhlar And Truhlar Attys NEGOTIATION11Stephen Shaw
1014Maisha RulapaughRussia2026-05-11Dorl, James J Esq QUALIFIED37Amy Elsner
1015Aika InouyeCanada2026-05-31Benton, John B Jr NEW69Amy Elsner
1016Faith GillianIndia2026-05-29Morlong Associates RENEWAL45Elwin Sharvill
1017Jefferson SchemmerGermany2026-05-22Rousseaux, Michael Esq RENEWAL63Stephen Shaw
1018Maisha RulapaughIndia2026-05-20Benton, John B Jr RENEWAL96Ioni Bowcher
1019Kadeem FlosiIndia2026-05-10Rousseaux, Michael Esq PROPOSAL5Onyama Limba
1020Aika InouyeSpain2026-05-14Rangoni Of Florence NEW94Amy Elsner
1021Ashley DoeUnited Kingdom2026-05-22Chemel, James L Cpa NEW58Onyama Limba
1022Mayumi KolmetzIndia2026-05-18Buckley Miller Wright PROPOSAL22Amy Elsner
1023Maisha RulapaughCanada2026-05-31Commercial Press PROPOSAL36Ioni Bowcher
1024Jeanfrancois VenereCanada2026-05-21Feiner Bros UNQUALIFIED28Amy Elsner
1025Nicolas IturbideArgentina2026-05-23Morlong Associates QUALIFIED20Elwin Sharvill
1026Silvio SlusarskiBrazil2026-05-28Morlong Associates UNQUALIFIED35Anna Fali
1027Ricardo GauchoBrazil2026-05-28Dorl, James J Esq QUALIFIED54Anna Fali
1028Jennifer AmigonJapan2026-05-06Rousseaux, Michael Esq RENEWAL38Ivan Magalhaes
1029Juan WieserIndia2026-05-18Truhlar And Truhlar Attys UNQUALIFIED71Ioni Bowcher
1030Ivar PaprockiArgentina2026-05-13Benton, John B Jr QUALIFIED34Elwin Sharvill
1031Greenwood BologniaIndia2026-05-30Buckley Miller Wright PROPOSAL32Stephen Shaw
1032Johnson SergiGermany2026-05-10Dorl, James J Esq NEGOTIATION18Stephen Shaw
1033Jefferson SchemmerArgentina2026-05-28Rousseaux, Michael Esq QUALIFIED15Elwin Sharvill
1034Emily WhobreyCanada2026-05-21Printing Dimensions UNQUALIFIED6Anna Fali
1035Alejandro PerinGermany2026-05-25Truhlar And Truhlar Attys NEW30Amy Elsner
1036Costa DilliardJapan2026-05-05Buckley Miller Wright NEGOTIATION12Stephen Shaw
1037Aditya KuskoIndia2026-05-16Printing Dimensions NEW78Bernardo Dominic
1038Stacey MacleadArgentina2026-05-26Chapman, Ross E Esq PROPOSAL59Bernardo Dominic
1039Francesco ShinkoBrazil2026-05-12Truhlar And Truhlar Attys PROPOSAL90Xuxue Feng
1040Munro FerenczFrance2026-05-29Chemel, James L Cpa NEGOTIATION80Anna Fali
1041Wickens NestleRussia2026-05-02Buckley Miller Wright NEGOTIATION81Ivan Magalhaes
1042Deepesh ChuiArgentina2026-05-19Dorl, James J Esq UNQUALIFIED28Elwin Sharvill
1043Morrow RutaUnited Kingdom2026-05-24Feiner Bros QUALIFIED30Elwin Sharvill
1044Morrow RutaItaly2026-05-18Feiner Bros QUALIFIED18Ivan Magalhaes
1045Munro FerenczBrazil2026-05-09Dorl, James J Esq NEW3Amy Elsner
1046Darci PoquetteRussia2026-05-14Feltz Printing Service RENEWAL59Stephen Shaw
1047Murillo MaletArgentina2026-05-22Commercial Press PROPOSAL39Anna Fali
1048Johnson SergiCanada2026-05-15Rangoni Of Florence UNQUALIFIED37Elwin Sharvill
1049Clifford RimItaly2026-05-27Feltz Printing Service QUALIFIED23Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Juan WieserSpainElwin Sharvill NEGOTIATION
Jefferson SchemmerItalyAnna Fali PROPOSAL
Smith GlickAustraliaOnyama Limba NEW
Octavia MaletBrazilIoni Bowcher PROPOSAL
Aika InouyeIndiaIoni Bowcher NEW
Munro FerenczItalyStephen Shaw UNQUALIFIED
Mujtaba NickaIndiaIoni Bowcher NEGOTIATION
Johnson SergiAustraliaStephen Shaw PROPOSAL
Silvio SlusarskiGermanyAnna Fali UNQUALIFIED
Juan WieserRussiaAsiya Javayant QUALIFIED
David DarakjyRussiaElwin Sharvill NEW
Julie StensethItalyIvan Magalhaes RENEWAL
Stacey MacleadArgentinaAsiya Javayant QUALIFIED
Jefferson SchemmerSpainAmy Elsner UNQUALIFIED
Mujtaba NickaUnited KingdomOnyama Limba NEGOTIATION
Mayumi KolmetzBrazilXuxue Feng PROPOSAL
Ivar PaprockiRussiaIvan Magalhaes NEW
James ButtJapanIoni Bowcher UNQUALIFIED
Adams MorascaJapanIvan Magalhaes NEW
Aditya KuskoIndiaBernardo Dominic PROPOSAL
Misaki RoysterJapanAnna Fali NEGOTIATION
Mayumi KolmetzBrazilIvan Magalhaes PROPOSAL
Aditya KuskoIndiaIoni Bowcher UNQUALIFIED
Emily WhobreyUnited KingdomIvan Magalhaes RENEWAL
Izzy GarufiRussiaBernardo Dominic QUALIFIED
Alejandro PerinArgentinaStephen Shaw QUALIFIED
Murillo MaletIndiaOnyama Limba PROPOSAL
Sinclair WaycottBrazilAmy Elsner PROPOSAL
Emily WhobreyBrazilAmy Elsner QUALIFIED
Greenwood BologniaGermanyAnna Fali NEGOTIATION
Francesco ShinkoRussiaAnna Fali UNQUALIFIED
Morrow RutaIndiaAnna Fali NEGOTIATION
Costa DilliardBrazilIoni Bowcher RENEWAL
Francesco ShinkoUnited KingdomIvan Magalhaes UNQUALIFIED
Juan WieserArgentinaIvan Magalhaes QUALIFIED
Jeanfrancois VenereSpainBernardo Dominic NEW
Deepesh ChuiCanadaOnyama Limba NEGOTIATION
Greenwood BologniaBrazilOnyama Limba NEGOTIATION
Greenwood BologniaArgentinaAmy Elsner NEGOTIATION
Faith GillianBrazilBernardo Dominic PROPOSAL
Sinclair WaycottBrazilBernardo Dominic UNQUALIFIED
Wickens NestleUnited KingdomAnna Fali UNQUALIFIED
Munro FerenczSpainAsiya Javayant UNQUALIFIED
Aditya KuskoRussiaAnna Fali UNQUALIFIED
Aika InouyeUnited KingdomStephen Shaw NEGOTIATION
Greenwood BologniaUnited KingdomIvan Magalhaes QUALIFIED
Leon OldroydCanadaXuxue Feng NEW
Leja CaldareraBrazilAmy Elsner NEW
Jefferson SchemmerBrazilStephen Shaw UNQUALIFIED
Sinclair WaycottArgentinaXuxue Feng UNQUALIFIED
Frozen Columns
Name
Alejandro Perin
Stacey Maclead
Alejandro Perin
Kadeem Flosi
Johnson Sergi
Sinclair Waycott
Munro Ferencz
Silvio Slusarski
Juan Wieser
Antonio Caudy
Adams Morasca
Cody Saylors
Jennifer Amigon
Costa Dilliard
Clifford Rim
David Darakjy
Sinclair Waycott
Ricardo Gaucho
Greenwood Bolognia
Smith Glick
Deepesh Chui
Alejandro Perin
Ivar Paprocki
Costa Dilliard
Ricardo Gaucho
Aruna Figeroa
Faith Gillian
Aditya Kusko
Costa Dilliard
Misaki Royster
Jeanfrancois Venere
Murillo Malet
Aruna Figeroa
Munro Ferencz
Alejandro Perin
Jones Vocelka
Misaki Royster
Maria Marrier
Jones Vocelka
Octavia Malet
Cody Saylors
Emily Whobrey
Murillo Malet
Octavia Malet
Izzy Garufi
Cody Saylors
Aruna Figeroa
Aditya Kusko
Tony Foller
Izzy Garufi
IdCountryDate
1000United Kingdom2026-05-13
1001United Kingdom2026-05-26
1002Italy2026-05-07
1003Italy2026-05-28
1004Canada2026-05-10
1005India2026-05-03
1006Spain2026-05-26
1007United Kingdom2026-05-20
1008Italy2026-05-07
1009Russia2026-05-06
1010United Kingdom2026-05-15
1011Russia2026-05-22
1012Japan2026-05-20
1013United Kingdom2026-05-24
1014Russia2026-05-09
1015Japan2026-05-06
1016Japan2026-05-17
1017India2026-05-16
1018Spain2026-05-07
1019Australia2026-05-31
1020Russia2026-05-17
1021Argentina2026-05-03
1022Japan2026-05-29
1023Japan2026-05-31
1024Brazil2026-05-19
1025Spain2026-05-04
1026Italy2026-05-30
1027India2026-05-23
1028India2026-05-10
1029Spain2026-05-02
1030Italy2026-05-07
1031Canada2026-05-04
1032India2026-05-17
1033Canada2026-05-06
1034United Kingdom2026-05-22
1035Argentina2026-05-07
1036Canada2026-05-28
1037Italy2026-05-27
1038Germany2026-05-19
1039Russia2026-05-21
1040Russia2026-05-11
1041United Kingdom2026-05-25
1042Australia2026-05-24
1043Brazil2026-05-27
1044Japan2026-05-28
1045United Kingdom2026-05-25
1046Brazil2026-05-24
1047Brazil2026-05-06
1048Argentina2026-05-18
1049Australia2026-05-05

On-Demand Data

NameIdCountryDate
Jones Vocelka1000Canada2026-05-22
Emily Whobrey1001Spain2026-05-14
Nicolas Iturbide1002Spain2026-05-04
Antonio Caudy1003Canada2026-05-21
Alejandro Perin1004Canada2026-05-28
Ashley Doe1005France2026-05-25
Jones Vocelka1006Australia2026-05-03
Mujtaba Nicka1007Japan2026-05-23
Antonio Caudy1008Russia2026-05-12
Leja Caldarera1009Japan2026-05-18
Kaitlin Ostrosky1010Brazil2026-05-07
Maria Marrier1011India2026-05-23
Claire Tollner1012Spain2026-05-12
Ashley Doe1013United Kingdom2026-05-25
Alejandro Perin1014India2026-05-20
Ashley Doe1015France2026-05-06
Wickens Nestle1016United Kingdom2026-05-16
Stacey Maclead1017Canada2026-05-25
Francesco Shinko1018Canada2026-05-27
Ashley Doe1019Australia2026-05-30
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Emily WhobreyJapanOnyama Limba RENEWAL
Johnson SergiItalyAmy Elsner NEW
Izzy GarufiIndiaStephen Shaw PROPOSAL
Johnson SergiRussiaAsiya Javayant NEGOTIATION
Silvio SlusarskiCanadaIvan Magalhaes RENEWAL
Chavez BriddickIndiaXuxue Feng NEGOTIATION
Johnson SergiGermanyElwin Sharvill PROPOSAL
Adams MorascaSpainAmy Elsner PROPOSAL
Salvatore StockhamRussiaOnyama Limba NEW
Mayumi KolmetzBrazilAmy Elsner QUALIFIED
Octavia MaletFranceXuxue Feng QUALIFIED
Costa DilliardJapanElwin Sharvill NEGOTIATION
Smith GlickUnited KingdomAnna Fali RENEWAL
Stacey MacleadJapanIoni Bowcher NEGOTIATION
Munro FerenczJapanAmy Elsner UNQUALIFIED
Mayumi KolmetzBrazilXuxue Feng QUALIFIED
Julie StensethGermanyXuxue Feng PROPOSAL
Jefferson SchemmerGermanyStephen Shaw NEW
Leja CaldareraFranceIvan Magalhaes NEW
Leja CaldareraArgentinaOnyama Limba NEGOTIATION
Leja CaldareraSpainAsiya Javayant UNQUALIFIED
Adams MorascaItalyAmy Elsner NEW
Rodrigues CampainFranceIvan Magalhaes PROPOSAL
Isabel BowleyCanadaAsiya Javayant QUALIFIED
Julie StensethSpainElwin Sharvill NEGOTIATION
Julie StensethGermanyAsiya Javayant UNQUALIFIED
Juan WieserArgentinaBernardo Dominic NEGOTIATION
Munro FerenczRussiaElwin Sharvill NEW
Mayumi KolmetzBrazilAnna Fali NEW
Tony FollerArgentinaAnna Fali RENEWAL
Tony FollerCanadaAsiya Javayant NEGOTIATION
Munro FerenczJapanIoni Bowcher NEGOTIATION
Mujtaba NickaCanadaAnna Fali PROPOSAL
Emily WhobreyItalyAsiya Javayant PROPOSAL
Ivar PaprockiSpainAsiya Javayant QUALIFIED
Wickens NestleUnited KingdomAmy Elsner QUALIFIED
Mujtaba NickaSpainIvan Magalhaes NEGOTIATION
Juan WieserItalyIoni Bowcher QUALIFIED
Claire TollnerRussiaElwin Sharvill PROPOSAL
Julie StensethRussiaXuxue Feng UNQUALIFIED

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