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
Sinclair WaycottGermanyAsiya Javayant RENEWAL
Johnson SergiSpainBernardo Dominic UNQUALIFIED
Chavez BriddickRussiaBernardo Dominic PROPOSAL
Wickens NestleArgentinaStephen Shaw NEGOTIATION
Smith GlickFranceAmy Elsner UNQUALIFIED
David DarakjyUnited KingdomAmy Elsner PROPOSAL
Wickens NestleGermanyIoni Bowcher NEW
Juan WieserArgentinaElwin Sharvill RENEWAL
Leja CaldareraCanadaIvan Magalhaes NEW
Murillo MaletBrazilBernardo Dominic PROPOSAL
Ricardo GauchoCanadaElwin Sharvill NEGOTIATION
Leja CaldareraUnited KingdomOnyama Limba NEW
Tony FollerIndiaAnna Fali NEGOTIATION
Isabel BowleyJapanAnna Fali PROPOSAL
Ashley DoeGermanyAnna Fali PROPOSAL
Cody SaylorsJapanIvan Magalhaes QUALIFIED
Ashley DoeFranceAnna Fali QUALIFIED
David DarakjyIndiaElwin Sharvill NEW
David DarakjyFranceIoni Bowcher NEGOTIATION
Mujtaba NickaItalyAnna Fali NEW
Izzy GarufiBrazilBernardo Dominic PROPOSAL
Ashley DoeJapanAsiya Javayant PROPOSAL
Mayumi KolmetzAustraliaElwin Sharvill NEGOTIATION
Jones VocelkaIndiaIoni Bowcher PROPOSAL
Morrow RutaItalyIoni Bowcher PROPOSAL
Morrow RutaUnited KingdomAsiya Javayant NEW
Stacey MacleadFranceXuxue Feng NEW
Rodrigues CampainGermanyStephen Shaw QUALIFIED
Ivar PaprockiGermanyBernardo Dominic UNQUALIFIED
Aditya KuskoFranceXuxue Feng PROPOSAL
Nicolas IturbideBrazilAsiya Javayant PROPOSAL
Jeanfrancois VenereJapanStephen Shaw NEGOTIATION
Octavia MaletRussiaElwin Sharvill NEGOTIATION
Sinclair WaycottIndiaAsiya Javayant RENEWAL
Octavia MaletJapanElwin Sharvill NEW
Isabel BowleyRussiaOnyama Limba NEGOTIATION
Isabel BowleyIndiaElwin Sharvill QUALIFIED
Faith GillianUnited KingdomStephen Shaw NEW
Alejandro PerinCanadaXuxue Feng RENEWAL
Murillo MaletAustraliaElwin Sharvill RENEWAL
Clifford RimGermanyElwin Sharvill NEW
Darci PoquetteGermanyElwin Sharvill UNQUALIFIED
Ashley DoeGermanyIoni Bowcher NEW
Francesco ShinkoCanadaAmy Elsner NEGOTIATION
Tony FollerAustraliaOnyama Limba RENEWAL
Greenwood BologniaUnited KingdomBernardo Dominic RENEWAL
Faith GillianArgentinaAsiya Javayant PROPOSAL
Salvatore StockhamFranceXuxue Feng PROPOSAL
Sinclair WaycottIndiaElwin Sharvill RENEWAL
Arvin AlbaresSpainIoni Bowcher QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Stacey MacleadIndiaAmy Elsner NEGOTIATION
Jefferson SchemmerItalyBernardo Dominic PROPOSAL
Leja CaldareraArgentinaAsiya Javayant QUALIFIED
Munro FerenczItalyIoni Bowcher NEGOTIATION
Murillo MaletFranceXuxue Feng NEW
Julie StensethJapanBernardo Dominic UNQUALIFIED
Maria MarrierItalyIoni Bowcher NEGOTIATION
Aditya KuskoGermanyIvan Magalhaes UNQUALIFIED
Maisha RulapaughCanadaElwin Sharvill RENEWAL
Leon OldroydFranceIoni Bowcher NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Nicolas IturbideRussia2026-05-24Truhlar And Truhlar Attys UNQUALIFIED10Anna Fali
1001Rodrigues CampainBrazil2026-05-18Benton, John B Jr RENEWAL85Bernardo Dominic
1002Adams MorascaUnited Kingdom2026-05-30Truhlar And Truhlar Attys NEGOTIATION24Xuxue Feng
1003Antonio CaudyUnited Kingdom2026-05-28Truhlar And Truhlar Attys NEW46Onyama Limba
1004Octavia MaletJapan2026-05-03Rousseaux, Michael Esq UNQUALIFIED55Xuxue Feng
1005Adams MorascaRussia2026-05-22Commercial Press PROPOSAL2Amy Elsner
1006Darci PoquetteRussia2026-05-02Printing Dimensions NEGOTIATION65Xuxue Feng
1007Isabel BowleyItaly2026-05-11Dorl, James J Esq QUALIFIED15Xuxue Feng
1008Octavia MaletIndia2026-05-02Benton, John B Jr QUALIFIED9Xuxue Feng
1009Arvin AlbaresItaly2026-05-31Feltz Printing Service PROPOSAL80Bernardo Dominic
1010Deepesh ChuiCanada2026-05-17Rousseaux, Michael Esq UNQUALIFIED0Elwin Sharvill
1011Stacey MacleadArgentina2026-05-07Feiner Bros NEGOTIATION32Onyama Limba
1012Nicolas IturbideArgentina2026-05-06Truhlar And Truhlar Attys NEGOTIATION35Xuxue Feng
1013Rodrigues CampainJapan2026-05-16Benton, John B Jr RENEWAL5Bernardo Dominic
1014Morrow RutaItaly2026-05-26Buckley Miller Wright QUALIFIED43Bernardo Dominic
1015Tony FollerRussia2026-05-19Rousseaux, Michael Esq PROPOSAL27Stephen Shaw
1016Maria MarrierArgentina2026-05-31Chapman, Ross E Esq UNQUALIFIED50Asiya Javayant
1017David DarakjyUnited Kingdom2026-05-28Commercial Press UNQUALIFIED20Amy Elsner
1018Maisha RulapaughUnited Kingdom2026-05-18Truhlar And Truhlar Attys NEW12Ioni Bowcher
1019Silvio SlusarskiFrance2026-05-04Rangoni Of Florence UNQUALIFIED78Amy Elsner
1020Maisha RulapaughSpain2026-05-17Truhlar And Truhlar Attys QUALIFIED39Stephen Shaw
1021Nicolas IturbideSpain2026-05-29Commercial Press NEGOTIATION57Elwin Sharvill
1022Smith GlickSpain2026-05-26Buckley Miller Wright NEW49Elwin Sharvill
1023Stacey MacleadJapan2026-05-20Morlong Associates NEGOTIATION41Anna Fali
1024Costa DilliardSpain2026-05-15Rangoni Of Florence PROPOSAL62Amy Elsner
1025James ButtJapan2026-05-07Feltz Printing Service NEW48Xuxue Feng
1026Julie StensethCanada2026-05-23Buckley Miller Wright UNQUALIFIED52Asiya Javayant
1027Francesco ShinkoCanada2026-05-07Chanay, Jeffrey A Esq RENEWAL13Elwin Sharvill
1028Francesco ShinkoAustralia2026-05-28Rousseaux, Michael Esq NEW88Xuxue Feng
1029Octavia MaletBrazil2026-05-13Rousseaux, Michael Esq NEW36Anna Fali
1030Cody SaylorsFrance2026-05-09Feltz Printing Service NEW77Xuxue Feng
1031Aditya KuskoSpain2026-05-08Chemel, James L Cpa RENEWAL64Anna Fali
1032Maria MarrierArgentina2026-05-29Feltz Printing Service NEW49Xuxue Feng
1033Rodrigues CampainSpain2026-05-09Chanay, Jeffrey A Esq NEGOTIATION43Ioni Bowcher
1034Mujtaba NickaJapan2026-05-10Feltz Printing Service NEW13Anna Fali
1035Cody SaylorsGermany2026-05-11Printing Dimensions NEGOTIATION42Onyama Limba
1036James ButtGermany2026-05-19Dorl, James J Esq RENEWAL49Stephen Shaw
1037Misaki RoysterIndia2026-05-09Truhlar And Truhlar Attys UNQUALIFIED6Anna Fali
1038Rodrigues CampainUnited Kingdom2026-05-19Buckley Miller Wright RENEWAL17Xuxue Feng
1039Aika InouyeRussia2026-05-17Dorl, James J Esq QUALIFIED32Anna Fali
1040Stacey MacleadRussia2026-05-19Morlong Associates NEW53Ioni Bowcher
1041Aika InouyeArgentina2026-05-06Chanay, Jeffrey A Esq PROPOSAL81Ioni Bowcher
1042Greenwood BologniaBrazil2026-05-29Morlong Associates RENEWAL57Bernardo Dominic
1043Octavia MaletItaly2026-05-24Truhlar And Truhlar Attys UNQUALIFIED71Onyama Limba
1044Rodrigues CampainRussia2026-05-10Dorl, James J Esq NEW90Asiya Javayant
1045Alejandro PerinItaly2026-05-11Feltz Printing Service RENEWAL40Stephen Shaw
1046Costa DilliardBrazil2026-05-19Chapman, Ross E Esq NEW85Bernardo Dominic
1047Ivar PaprockiItaly2026-05-08Dorl, James J Esq NEGOTIATION57Stephen Shaw
1048Greenwood BologniaRussia2026-05-30Chemel, James L Cpa NEGOTIATION34Elwin Sharvill
1049Clifford RimAustralia2026-05-16Chemel, James L Cpa NEW98Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Salvatore StockhamArgentinaXuxue Feng QUALIFIED
Julie StensethItalyIoni Bowcher QUALIFIED
Aika InouyeAustraliaXuxue Feng UNQUALIFIED
Francesco ShinkoUnited KingdomElwin Sharvill NEW
Arvin AlbaresBrazilAsiya Javayant UNQUALIFIED
David DarakjyRussiaOnyama Limba NEW
Rodrigues CampainItalyAnna Fali RENEWAL
Salvatore StockhamFranceAmy Elsner QUALIFIED
Maria MarrierAustraliaAsiya Javayant UNQUALIFIED
Chavez BriddickFranceIoni Bowcher UNQUALIFIED
Chavez BriddickBrazilBernardo Dominic NEW
Tony FollerBrazilXuxue Feng RENEWAL
Silvio SlusarskiAustraliaStephen Shaw QUALIFIED
Jones VocelkaFranceStephen Shaw UNQUALIFIED
Ashley DoeAustraliaAnna Fali NEGOTIATION
Claire TollnerIndiaBernardo Dominic NEW
Murillo MaletArgentinaOnyama Limba UNQUALIFIED
Costa DilliardSpainAmy Elsner QUALIFIED
Ivar PaprockiRussiaAmy Elsner NEGOTIATION
Jefferson SchemmerArgentinaAnna Fali PROPOSAL
Faith GillianBrazilAmy Elsner UNQUALIFIED
Chavez BriddickFranceAsiya Javayant PROPOSAL
Leon OldroydItalyIvan Magalhaes RENEWAL
Sinclair WaycottBrazilXuxue Feng NEGOTIATION
Jefferson SchemmerIndiaIoni Bowcher UNQUALIFIED
Isabel BowleyRussiaIoni Bowcher PROPOSAL
Antonio CaudyIndiaAsiya Javayant QUALIFIED
Wickens NestleCanadaAnna Fali UNQUALIFIED
Aruna FigeroaArgentinaBernardo Dominic RENEWAL
Ivar PaprockiAustraliaAnna Fali PROPOSAL
Octavia MaletJapanOnyama Limba PROPOSAL
Murillo MaletBrazilBernardo Dominic NEGOTIATION
Aruna FigeroaArgentinaOnyama Limba NEW
Leon OldroydIndiaIoni Bowcher QUALIFIED
Salvatore StockhamArgentinaAmy Elsner NEGOTIATION
Silvio SlusarskiUnited KingdomXuxue Feng NEGOTIATION
Murillo MaletFranceIoni Bowcher RENEWAL
Aruna FigeroaUnited KingdomBernardo Dominic RENEWAL
Jeanfrancois VenereRussiaAnna Fali NEW
Maria MarrierJapanOnyama Limba RENEWAL
Silvio SlusarskiUnited KingdomStephen Shaw NEW
Kaitlin OstroskyRussiaAsiya Javayant UNQUALIFIED
Munro FerenczAustraliaAsiya Javayant RENEWAL
David DarakjyAustraliaIvan Magalhaes UNQUALIFIED
Leon OldroydUnited KingdomXuxue Feng QUALIFIED
Rodrigues CampainCanadaAsiya Javayant NEGOTIATION
James ButtRussiaAsiya Javayant NEW
Izzy GarufiBrazilXuxue Feng UNQUALIFIED
Greenwood BologniaGermanyOnyama Limba NEW
Alejandro PerinJapanIvan Magalhaes UNQUALIFIED
Frozen Columns
Name
Jennifer Amigon
Silvio Slusarski
Kaitlin Ostrosky
Francesco Shinko
Kaitlin Ostrosky
Smith Glick
Tony Foller
Kaitlin Ostrosky
Alejandro Perin
Octavia Malet
Silvio Slusarski
Izzy Garufi
Ricardo Gaucho
Munro Ferencz
Leon Oldroyd
Julie Stenseth
Juan Wieser
Greenwood Bolognia
Jefferson Schemmer
Rodrigues Campain
Maria Marrier
Ashley Doe
Mayumi Kolmetz
Smith Glick
Munro Ferencz
Darci Poquette
Claire Tollner
Murillo Malet
Jeanfrancois Venere
Faith Gillian
Greenwood Bolognia
Alejandro Perin
Silvio Slusarski
Octavia Malet
Ashley Doe
Kadeem Flosi
David Darakjy
Aika Inouye
Mayumi Kolmetz
Cody Saylors
Rodrigues Campain
Darci Poquette
Aika Inouye
Rodrigues Campain
Antonio Caudy
Aika Inouye
Adams Morasca
Leon Oldroyd
Cody Saylors
Darci Poquette
IdCountryDate
1000Russia2026-05-04
1001France2026-05-17
1002Japan2026-05-10
1003India2026-05-28
1004Brazil2026-05-15
1005India2026-05-02
1006Brazil2026-05-14
1007Canada2026-05-08
1008Canada2026-05-08
1009Japan2026-05-30
1010Argentina2026-05-16
1011Russia2026-05-03
1012India2026-05-21
1013France2026-05-26
1014Brazil2026-05-23
1015Brazil2026-05-21
1016Australia2026-05-02
1017Japan2026-05-17
1018Brazil2026-05-31
1019Germany2026-05-18
1020Argentina2026-05-12
1021Italy2026-05-18
1022Germany2026-05-27
1023Canada2026-05-31
1024Australia2026-05-16
1025India2026-05-09
1026United Kingdom2026-05-23
1027United Kingdom2026-05-22
1028Germany2026-05-11
1029Russia2026-05-14
1030Argentina2026-05-02
1031France2026-05-16
1032Australia2026-05-21
1033France2026-05-14
1034United Kingdom2026-05-29
1035India2026-05-30
1036Argentina2026-05-07
1037India2026-05-14
1038France2026-05-14
1039Russia2026-05-08
1040Germany2026-05-04
1041Canada2026-05-20
1042United Kingdom2026-05-26
1043Japan2026-05-29
1044Japan2026-05-31
1045Australia2026-05-10
1046Russia2026-05-11
1047Germany2026-05-08
1048Australia2026-05-20
1049Spain2026-05-02

On-Demand Data

NameIdCountryDate
Octavia Malet1000Brazil2026-05-14
Clifford Rim1001Canada2026-05-16
Clifford Rim1002Australia2026-05-24
Murillo Malet1003Spain2026-05-21
Alejandro Perin1004Canada2026-05-14
Rodrigues Campain1005India2026-05-13
Maria Marrier1006India2026-05-23
Julie Stenseth1007Japan2026-05-18
Juan Wieser1008Spain2026-05-10
Clifford Rim1009Australia2026-05-23
Antonio Caudy1010Brazil2026-05-21
Mayumi Kolmetz1011United Kingdom2026-05-13
Misaki Royster1012Germany2026-05-08
Morrow Ruta1013Italy2026-05-24
Chavez Briddick1014Russia2026-05-24
Johnson Sergi1015Argentina2026-05-29
Chavez Briddick1016Canada2026-05-02
Aika Inouye1017Spain2026-05-09
Murillo Malet1018Canada2026-05-18
Leon Oldroyd1019Canada2026-05-26
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jeanfrancois VenereCanadaOnyama Limba QUALIFIED
Clifford RimItalyElwin Sharvill NEGOTIATION
Johnson SergiBrazilIvan Magalhaes PROPOSAL
Adams MorascaBrazilElwin Sharvill PROPOSAL
Jeanfrancois VenereItalyElwin Sharvill NEGOTIATION
Faith GillianGermanyElwin Sharvill NEW
Ricardo GauchoArgentinaAnna Fali RENEWAL
Cody SaylorsUnited KingdomBernardo Dominic PROPOSAL
Mujtaba NickaRussiaBernardo Dominic PROPOSAL
Leja CaldareraFranceAmy Elsner UNQUALIFIED
David DarakjyUnited KingdomIvan Magalhaes NEGOTIATION
Maisha RulapaughItalyAsiya Javayant QUALIFIED
Salvatore StockhamFranceStephen Shaw RENEWAL
Claire TollnerBrazilAmy Elsner UNQUALIFIED
Silvio SlusarskiFranceElwin Sharvill PROPOSAL
Salvatore StockhamItalyAnna Fali RENEWAL
Smith GlickBrazilStephen Shaw NEGOTIATION
Ricardo GauchoSpainAsiya Javayant RENEWAL
Morrow RutaIndiaElwin Sharvill RENEWAL
Izzy GarufiArgentinaAmy Elsner UNQUALIFIED
Smith GlickIndiaStephen Shaw NEGOTIATION
Jones VocelkaItalyXuxue Feng NEGOTIATION
Deepesh ChuiJapanIoni Bowcher RENEWAL
Munro FerenczUnited KingdomAmy Elsner NEGOTIATION
Misaki RoysterGermanyAsiya Javayant PROPOSAL
Wickens NestleRussiaStephen Shaw NEGOTIATION
Misaki RoysterGermanyIoni Bowcher NEGOTIATION
Izzy GarufiIndiaBernardo Dominic NEW
Alejandro PerinBrazilXuxue Feng PROPOSAL
Jefferson SchemmerRussiaAmy Elsner QUALIFIED
Darci PoquetteGermanyBernardo Dominic QUALIFIED
Morrow RutaBrazilAsiya Javayant UNQUALIFIED
Deepesh ChuiUnited KingdomStephen Shaw PROPOSAL
Leon OldroydRussiaAnna Fali UNQUALIFIED
Alejandro PerinArgentinaElwin Sharvill PROPOSAL
Antonio CaudyGermanyBernardo Dominic QUALIFIED
Smith GlickCanadaAsiya Javayant RENEWAL
Mujtaba NickaItalyStephen Shaw NEGOTIATION
Maisha RulapaughBrazilAsiya Javayant UNQUALIFIED
Emily WhobreySpainElwin Sharvill 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>