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
Mayumi KolmetzAustraliaIvan Magalhaes UNQUALIFIED
Aruna FigeroaUnited KingdomBernardo Dominic NEGOTIATION
Adams MorascaFranceIoni Bowcher NEGOTIATION
Deepesh ChuiRussiaElwin Sharvill NEGOTIATION
Costa DilliardSpainAmy Elsner PROPOSAL
Julie StensethIndiaIoni Bowcher RENEWAL
Jones VocelkaJapanStephen Shaw NEW
Julie StensethIndiaIvan Magalhaes NEGOTIATION
Ricardo GauchoGermanyStephen Shaw RENEWAL
Tony FollerCanadaOnyama Limba PROPOSAL
Misaki RoysterArgentinaStephen Shaw NEGOTIATION
Maisha RulapaughItalyStephen Shaw PROPOSAL
Greenwood BologniaAustraliaOnyama Limba UNQUALIFIED
Kadeem FlosiCanadaBernardo Dominic UNQUALIFIED
Mayumi KolmetzCanadaIoni Bowcher RENEWAL
Jones VocelkaGermanyOnyama Limba QUALIFIED
Kadeem FlosiCanadaStephen Shaw QUALIFIED
Jeanfrancois VenereUnited KingdomAnna Fali NEW
Izzy GarufiJapanIoni Bowcher RENEWAL
Morrow RutaRussiaIvan Magalhaes PROPOSAL
Emily WhobreyCanadaOnyama Limba NEW
Darci PoquetteUnited KingdomStephen Shaw PROPOSAL
Julie StensethIndiaAnna Fali PROPOSAL
Mayumi KolmetzRussiaAmy Elsner QUALIFIED
Smith GlickRussiaBernardo Dominic NEGOTIATION
David DarakjyJapanIoni Bowcher UNQUALIFIED
Juan WieserSpainAnna Fali QUALIFIED
Wickens NestleGermanyAmy Elsner RENEWAL
Kadeem FlosiUnited KingdomXuxue Feng NEGOTIATION
Sinclair WaycottUnited KingdomAsiya Javayant PROPOSAL
Alejandro PerinGermanyStephen Shaw NEW
Salvatore StockhamArgentinaAnna Fali QUALIFIED
Darci PoquetteRussiaOnyama Limba UNQUALIFIED
Jeanfrancois VenereRussiaBernardo Dominic PROPOSAL
Izzy GarufiUnited KingdomAnna Fali UNQUALIFIED
Maisha RulapaughIndiaBernardo Dominic PROPOSAL
Aditya KuskoJapanOnyama Limba PROPOSAL
Ricardo GauchoUnited KingdomIoni Bowcher NEGOTIATION
Wickens NestleAustraliaXuxue Feng NEW
Stacey MacleadBrazilXuxue Feng PROPOSAL
Kadeem FlosiBrazilAnna Fali PROPOSAL
Juan WieserJapanStephen Shaw UNQUALIFIED
Jefferson SchemmerItalyXuxue Feng NEGOTIATION
Francesco ShinkoUnited KingdomOnyama Limba NEW
Jennifer AmigonIndiaIoni Bowcher PROPOSAL
Arvin AlbaresFranceStephen Shaw NEW
Chavez BriddickItalyAnna Fali QUALIFIED
Jones VocelkaAustraliaAsiya Javayant QUALIFIED
Mayumi KolmetzAustraliaIoni Bowcher QUALIFIED
Alejandro PerinItalyIoni Bowcher RENEWAL
Horizontal
NameCountryRepresentativeStatus
Arvin AlbaresAustraliaAmy Elsner RENEWAL
Faith GillianRussiaStephen Shaw RENEWAL
Faith GillianIndiaIoni Bowcher UNQUALIFIED
Jones VocelkaSpainAnna Fali QUALIFIED
Morrow RutaGermanyAmy Elsner PROPOSAL
Jennifer AmigonBrazilElwin Sharvill NEGOTIATION
Chavez BriddickJapanStephen Shaw PROPOSAL
Aika InouyeRussiaAnna Fali NEW
Morrow RutaIndiaIvan Magalhaes RENEWAL
Clifford RimGermanyElwin Sharvill NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Mayumi KolmetzBrazil2026-04-02Truhlar And Truhlar Attys NEW3Xuxue Feng
1001David DarakjyGermany2026-03-23Commercial Press NEW4Stephen Shaw
1002Nicolas IturbideJapan2026-04-01Truhlar And Truhlar Attys RENEWAL73Anna Fali
1003Costa DilliardSpain2026-04-03Truhlar And Truhlar Attys RENEWAL54Elwin Sharvill
1004Claire TollnerItaly2026-03-28Chapman, Ross E Esq UNQUALIFIED1Anna Fali
1005Maisha RulapaughAustralia2026-04-05Rousseaux, Michael Esq UNQUALIFIED33Onyama Limba
1006Munro FerenczRussia2026-03-24Dorl, James J Esq NEGOTIATION67Amy Elsner
1007Costa DilliardRussia2026-04-03Chapman, Ross E Esq PROPOSAL69Anna Fali
1008Francesco ShinkoSpain2026-04-20Rousseaux, Michael Esq UNQUALIFIED66Xuxue Feng
1009Wickens NestleGermany2026-03-24Printing Dimensions QUALIFIED96Xuxue Feng
1010James ButtGermany2026-03-29Chemel, James L Cpa NEW8Stephen Shaw
1011Jennifer AmigonSpain2026-04-11Rousseaux, Michael Esq QUALIFIED77Onyama Limba
1012Tony FollerUnited Kingdom2026-04-19Buckley Miller Wright NEW45Anna Fali
1013Nicolas IturbideJapan2026-04-04Dorl, James J Esq NEGOTIATION50Amy Elsner
1014Stacey MacleadRussia2026-04-20Rousseaux, Michael Esq RENEWAL1Bernardo Dominic
1015Greenwood BologniaItaly2026-04-15Truhlar And Truhlar Attys NEGOTIATION88Stephen Shaw
1016Murillo MaletRussia2026-04-19Feltz Printing Service NEGOTIATION50Xuxue Feng
1017Nicolas IturbideIndia2026-04-11Dorl, James J Esq QUALIFIED83Amy Elsner
1018Sinclair WaycottSpain2026-04-13Chapman, Ross E Esq QUALIFIED40Elwin Sharvill
1019Claire TollnerIndia2026-04-05Benton, John B Jr QUALIFIED92Onyama Limba
1020Mujtaba NickaRussia2026-03-30Commercial Press NEGOTIATION4Stephen Shaw
1021Salvatore StockhamCanada2026-04-17Buckley Miller Wright PROPOSAL85Stephen Shaw
1022Faith GillianJapan2026-04-05Chanay, Jeffrey A Esq RENEWAL0Asiya Javayant
1023Jeanfrancois VenereIndia2026-03-25Commercial Press QUALIFIED23Amy Elsner
1024Cody SaylorsAustralia2026-03-29Chanay, Jeffrey A Esq QUALIFIED91Asiya Javayant
1025Salvatore StockhamGermany2026-04-06Rousseaux, Michael Esq NEW71Anna Fali
1026Sinclair WaycottRussia2026-03-26Truhlar And Truhlar Attys NEW81Xuxue Feng
1027Ricardo GauchoAustralia2026-04-14Benton, John B Jr PROPOSAL45Anna Fali
1028Morrow RutaUnited Kingdom2026-03-29Dorl, James J Esq QUALIFIED6Ioni Bowcher
1029Silvio SlusarskiRussia2026-04-03Feltz Printing Service NEGOTIATION41Asiya Javayant
1030Emily WhobreyBrazil2026-03-24Rangoni Of Florence PROPOSAL63Anna Fali
1031Jennifer AmigonRussia2026-04-18Printing Dimensions NEW47Onyama Limba
1032Salvatore StockhamBrazil2026-03-28Rangoni Of Florence RENEWAL85Asiya Javayant
1033Jefferson SchemmerCanada2026-04-18King, Christopher A Esq PROPOSAL30Elwin Sharvill
1034Ricardo GauchoSpain2026-03-22Printing Dimensions NEGOTIATION36Bernardo Dominic
1035Morrow RutaGermany2026-03-24Morlong Associates NEW76Asiya Javayant
1036Stacey MacleadGermany2026-03-24Chapman, Ross E Esq RENEWAL87Xuxue Feng
1037Mayumi KolmetzGermany2026-04-04King, Christopher A Esq RENEWAL45Amy Elsner
1038Jennifer AmigonJapan2026-04-01Rousseaux, Michael Esq QUALIFIED91Ivan Magalhaes
1039Misaki RoysterCanada2026-04-07Rangoni Of Florence UNQUALIFIED83Stephen Shaw
1040Murillo MaletJapan2026-04-14Truhlar And Truhlar Attys QUALIFIED5Bernardo Dominic
1041Mayumi KolmetzSpain2026-03-25Chapman, Ross E Esq QUALIFIED92Xuxue Feng
1042Maisha RulapaughBrazil2026-04-12Feiner Bros PROPOSAL90Asiya Javayant
1043Smith GlickSpain2026-04-19Benton, John B Jr QUALIFIED47Stephen Shaw
1044Wickens NestleFrance2026-04-01Buckley Miller Wright NEGOTIATION1Ioni Bowcher
1045Sinclair WaycottAustralia2026-04-08Chanay, Jeffrey A Esq NEW71Asiya Javayant
1046Adams MorascaCanada2026-04-02Chemel, James L Cpa UNQUALIFIED18Anna Fali
1047Aditya KuskoIndia2026-04-19Commercial Press RENEWAL36Anna Fali
1048Darci PoquetteJapan2026-04-03Commercial Press UNQUALIFIED90Stephen Shaw
1049Jefferson SchemmerAustralia2026-03-25Dorl, James J Esq PROPOSAL40Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Izzy GarufiJapanIoni Bowcher NEGOTIATION
Isabel BowleyArgentinaElwin Sharvill NEW
Adams MorascaJapanBernardo Dominic NEW
Wickens NestleJapanStephen Shaw QUALIFIED
Juan WieserGermanyBernardo Dominic RENEWAL
Jefferson SchemmerItalyXuxue Feng UNQUALIFIED
Faith GillianGermanyBernardo Dominic PROPOSAL
David DarakjyBrazilAnna Fali UNQUALIFIED
Kadeem FlosiItalyBernardo Dominic QUALIFIED
Faith GillianAustraliaIoni Bowcher PROPOSAL
Jennifer AmigonGermanyOnyama Limba QUALIFIED
Francesco ShinkoJapanStephen Shaw RENEWAL
Maria MarrierAustraliaElwin Sharvill NEW
Alejandro PerinIndiaIoni Bowcher NEGOTIATION
Isabel BowleyCanadaIvan Magalhaes RENEWAL
Octavia MaletItalyAsiya Javayant RENEWAL
Smith GlickArgentinaAmy Elsner UNQUALIFIED
Clifford RimIndiaStephen Shaw RENEWAL
Jeanfrancois VenereIndiaAnna Fali NEGOTIATION
Munro FerenczSpainOnyama Limba UNQUALIFIED
Murillo MaletAustraliaIvan Magalhaes PROPOSAL
Jennifer AmigonCanadaAnna Fali NEGOTIATION
Alejandro PerinGermanyIvan Magalhaes PROPOSAL
Francesco ShinkoBrazilAnna Fali NEGOTIATION
Jones VocelkaGermanyBernardo Dominic NEGOTIATION
Juan WieserBrazilElwin Sharvill PROPOSAL
Smith GlickItalyElwin Sharvill NEGOTIATION
Faith GillianSpainAnna Fali QUALIFIED
Juan WieserGermanyStephen Shaw NEGOTIATION
Wickens NestleUnited KingdomBernardo Dominic NEGOTIATION
Kadeem FlosiIndiaXuxue Feng RENEWAL
Octavia MaletArgentinaStephen Shaw UNQUALIFIED
Jefferson SchemmerJapanAmy Elsner PROPOSAL
Octavia MaletIndiaIoni Bowcher RENEWAL
Tony FollerJapanIvan Magalhaes UNQUALIFIED
Ricardo GauchoUnited KingdomXuxue Feng UNQUALIFIED
Juan WieserItalyStephen Shaw PROPOSAL
Chavez BriddickAustraliaAmy Elsner NEGOTIATION
Kaitlin OstroskyIndiaBernardo Dominic NEW
Leon OldroydItalyElwin Sharvill NEGOTIATION
Nicolas IturbideSpainAnna Fali QUALIFIED
David DarakjyFranceStephen Shaw NEGOTIATION
Claire TollnerRussiaAsiya Javayant UNQUALIFIED
Clifford RimBrazilBernardo Dominic NEGOTIATION
Claire TollnerRussiaAnna Fali NEGOTIATION
Tony FollerAustraliaIoni Bowcher UNQUALIFIED
Chavez BriddickBrazilIoni Bowcher NEW
Ashley DoeIndiaIoni Bowcher NEW
Claire TollnerJapanStephen Shaw RENEWAL
Antonio CaudyJapanAmy Elsner PROPOSAL
Frozen Columns
Name
Maria Marrier
Murillo Malet
Isabel Bowley
Kaitlin Ostrosky
Johnson Sergi
Nicolas Iturbide
Kadeem Flosi
Ashley Doe
Julie Stenseth
Jennifer Amigon
Claire Tollner
James Butt
Antonio Caudy
Misaki Royster
Alejandro Perin
David Darakjy
Smith Glick
Aika Inouye
David Darakjy
Costa Dilliard
Leon Oldroyd
Maisha Rulapaugh
Sinclair Waycott
Faith Gillian
Kaitlin Ostrosky
Juan Wieser
Greenwood Bolognia
Kadeem Flosi
Maisha Rulapaugh
Johnson Sergi
David Darakjy
Leja Caldarera
Maisha Rulapaugh
Tony Foller
Wickens Nestle
Julie Stenseth
Claire Tollner
Cody Saylors
Nicolas Iturbide
Chavez Briddick
David Darakjy
Maisha Rulapaugh
Aditya Kusko
Jones Vocelka
Deepesh Chui
Juan Wieser
Maria Marrier
Aruna Figeroa
Leja Caldarera
Murillo Malet
IdCountryDate
1000United Kingdom2026-04-06
1001United Kingdom2026-03-24
1002India2026-04-16
1003United Kingdom2026-03-22
1004Spain2026-03-30
1005India2026-04-15
1006Brazil2026-03-29
1007United Kingdom2026-03-26
1008Argentina2026-04-10
1009France2026-03-31
1010United Kingdom2026-04-09
1011France2026-03-27
1012Germany2026-04-15
1013Brazil2026-04-19
1014Russia2026-03-25
1015Argentina2026-04-02
1016Brazil2026-04-01
1017France2026-04-16
1018Italy2026-04-17
1019Italy2026-04-15
1020Australia2026-04-02
1021India2026-03-31
1022Italy2026-03-26
1023Russia2026-04-10
1024Japan2026-04-12
1025Spain2026-03-31
1026Spain2026-03-22
1027United Kingdom2026-04-14
1028Russia2026-04-05
1029Australia2026-04-05
1030Italy2026-04-06
1031Canada2026-04-09
1032Japan2026-04-19
1033Russia2026-03-22
1034Argentina2026-04-07
1035Russia2026-03-22
1036Germany2026-03-25
1037Spain2026-04-16
1038Brazil2026-04-14
1039Japan2026-03-31
1040Australia2026-03-29
1041Brazil2026-04-20
1042Brazil2026-03-23
1043France2026-03-24
1044Canada2026-04-02
1045Germany2026-03-29
1046Japan2026-04-17
1047Brazil2026-04-04
1048France2026-04-16
1049Italy2026-03-23

On-Demand Data

NameIdCountryDate
Nicolas Iturbide1000United Kingdom2026-04-12
Salvatore Stockham1001Brazil2026-03-30
Wickens Nestle1002Spain2026-04-16
Maisha Rulapaugh1003India2026-04-03
Aditya Kusko1004Canada2026-04-04
Morrow Ruta1005India2026-04-13
Clifford Rim1006India2026-03-29
Aika Inouye1007Argentina2026-03-25
Faith Gillian1008Russia2026-04-17
Aruna Figeroa1009Japan2026-04-04
Misaki Royster1010Canada2026-03-30
Antonio Caudy1011United Kingdom2026-03-29
Nicolas Iturbide1012Germany2026-04-01
Leja Caldarera1013India2026-04-07
Alejandro Perin1014Australia2026-04-03
Sinclair Waycott1015United Kingdom2026-04-09
David Darakjy1016Spain2026-03-27
Izzy Garufi1017Brazil2026-04-14
Sinclair Waycott1018Canada2026-04-05
Ashley Doe1019Germany2026-03-24
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Darci PoquetteIndiaElwin Sharvill RENEWAL
Ashley DoeBrazilXuxue Feng NEW
Stacey MacleadUnited KingdomOnyama Limba UNQUALIFIED
Darci PoquetteBrazilOnyama Limba RENEWAL
Sinclair WaycottGermanyOnyama Limba NEW
Kadeem FlosiItalyXuxue Feng PROPOSAL
Maria MarrierArgentinaElwin Sharvill NEGOTIATION
Ashley DoeGermanyOnyama Limba RENEWAL
Jeanfrancois VenereUnited KingdomBernardo Dominic PROPOSAL
Smith GlickArgentinaIvan Magalhaes NEW
Rodrigues CampainFranceOnyama Limba RENEWAL
Darci PoquetteItalyElwin Sharvill NEW
Munro FerenczCanadaBernardo Dominic NEW
Alejandro PerinItalyAsiya Javayant UNQUALIFIED
Tony FollerBrazilStephen Shaw NEW
Emily WhobreyJapanIvan Magalhaes RENEWAL
Johnson SergiGermanyStephen Shaw RENEWAL
Rodrigues CampainFranceIoni Bowcher RENEWAL
Misaki RoysterJapanBernardo Dominic RENEWAL
Tony FollerUnited KingdomAsiya Javayant NEW
Ashley DoeIndiaXuxue Feng NEGOTIATION
Clifford RimAustraliaIvan Magalhaes QUALIFIED
Munro FerenczItalyAnna Fali UNQUALIFIED
Jeanfrancois VenereIndiaAnna Fali UNQUALIFIED
Jeanfrancois VenereGermanyIvan Magalhaes NEW
Ivar PaprockiJapanAmy Elsner UNQUALIFIED
Johnson SergiRussiaIoni Bowcher QUALIFIED
Aditya KuskoAustraliaStephen Shaw QUALIFIED
Francesco ShinkoUnited KingdomIvan Magalhaes RENEWAL
Emily WhobreyRussiaElwin Sharvill NEGOTIATION
Ashley DoeBrazilIoni Bowcher RENEWAL
Antonio CaudyFranceAsiya Javayant PROPOSAL
Mayumi KolmetzUnited KingdomStephen Shaw NEGOTIATION
Alejandro PerinUnited KingdomAsiya Javayant NEGOTIATION
Isabel BowleyAustraliaBernardo Dominic NEGOTIATION
Juan WieserItalyStephen Shaw NEW
Aika InouyeBrazilStephen Shaw NEGOTIATION
Murillo MaletIndiaOnyama Limba QUALIFIED
Julie StensethItalyIvan Magalhaes UNQUALIFIED
Smith GlickJapanXuxue 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>