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
Ivar PaprockiCanadaIoni Bowcher UNQUALIFIED
Maria MarrierGermanyStephen Shaw NEGOTIATION
Greenwood BologniaRussiaStephen Shaw NEW
Tony FollerFranceIvan Magalhaes UNQUALIFIED
Munro FerenczFranceAsiya Javayant QUALIFIED
Izzy GarufiFranceElwin Sharvill NEW
Wickens NestleFranceIvan Magalhaes NEGOTIATION
Misaki RoysterGermanyStephen Shaw NEW
Jefferson SchemmerRussiaStephen Shaw PROPOSAL
Munro FerenczUnited KingdomAnna Fali NEGOTIATION
David DarakjyJapanBernardo Dominic NEW
Cody SaylorsAustraliaOnyama Limba NEGOTIATION
Emily WhobreyBrazilStephen Shaw NEW
Alejandro PerinIndiaXuxue Feng RENEWAL
Misaki RoysterItalyIoni Bowcher RENEWAL
Maisha RulapaughUnited KingdomAmy Elsner UNQUALIFIED
Mayumi KolmetzUnited KingdomIvan Magalhaes PROPOSAL
Faith GillianUnited KingdomAsiya Javayant QUALIFIED
Tony FollerSpainAmy Elsner QUALIFIED
Kaitlin OstroskySpainStephen Shaw QUALIFIED
Antonio CaudyAustraliaXuxue Feng PROPOSAL
Greenwood BologniaSpainIoni Bowcher RENEWAL
Jeanfrancois VenereBrazilAsiya Javayant PROPOSAL
Aditya KuskoBrazilBernardo Dominic QUALIFIED
Johnson SergiItalyElwin Sharvill QUALIFIED
Leja CaldareraRussiaAmy Elsner QUALIFIED
Ashley DoeItalyIvan Magalhaes UNQUALIFIED
Wickens NestleJapanAnna Fali NEW
Murillo MaletUnited KingdomOnyama Limba NEW
Darci PoquetteAustraliaBernardo Dominic UNQUALIFIED
Sinclair WaycottCanadaElwin Sharvill NEW
Chavez BriddickJapanIoni Bowcher NEW
Wickens NestleUnited KingdomStephen Shaw UNQUALIFIED
Jeanfrancois VenereSpainBernardo Dominic NEW
David DarakjyItalyIvan Magalhaes PROPOSAL
Misaki RoysterIndiaStephen Shaw QUALIFIED
Costa DilliardSpainStephen Shaw NEW
James ButtSpainAmy Elsner PROPOSAL
Mayumi KolmetzArgentinaStephen Shaw RENEWAL
Maisha RulapaughArgentinaXuxue Feng RENEWAL
Aika InouyeArgentinaOnyama Limba QUALIFIED
Jeanfrancois VenereUnited KingdomIvan Magalhaes UNQUALIFIED
Wickens NestleGermanyElwin Sharvill RENEWAL
Smith GlickItalyXuxue Feng QUALIFIED
Alejandro PerinJapanAmy Elsner NEGOTIATION
Jennifer AmigonUnited KingdomAnna Fali UNQUALIFIED
Clifford RimAustraliaIvan Magalhaes NEW
Leja CaldareraGermanyAnna Fali QUALIFIED
David DarakjyArgentinaOnyama Limba UNQUALIFIED
Jeanfrancois VenereArgentinaAmy Elsner UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Claire TollnerJapanAsiya Javayant UNQUALIFIED
Mayumi KolmetzGermanyIoni Bowcher PROPOSAL
Clifford RimFranceIoni Bowcher UNQUALIFIED
Morrow RutaJapanXuxue Feng QUALIFIED
Maisha RulapaughArgentinaStephen Shaw NEGOTIATION
Ashley DoeRussiaOnyama Limba UNQUALIFIED
Costa DilliardBrazilAsiya Javayant PROPOSAL
Maisha RulapaughRussiaIoni Bowcher UNQUALIFIED
Deepesh ChuiFranceXuxue Feng QUALIFIED
Salvatore StockhamItalyXuxue Feng RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Tony FollerIndia2026-04-15Commercial Press UNQUALIFIED88Stephen Shaw
1001Tony FollerItaly2026-04-21Feiner Bros NEGOTIATION16Elwin Sharvill
1002Clifford RimGermany2026-04-01Morlong Associates NEGOTIATION57Asiya Javayant
1003Leon OldroydArgentina2026-03-23Rangoni Of Florence QUALIFIED3Asiya Javayant
1004Juan WieserIndia2026-03-30Buckley Miller Wright RENEWAL91Ioni Bowcher
1005Tony FollerUnited Kingdom2026-04-15Chemel, James L Cpa UNQUALIFIED96Anna Fali
1006Johnson SergiAustralia2026-03-27Printing Dimensions NEGOTIATION86Ioni Bowcher
1007Rodrigues CampainJapan2026-04-02King, Christopher A Esq QUALIFIED25Stephen Shaw
1008Costa DilliardArgentina2026-04-11Rousseaux, Michael Esq QUALIFIED10Ioni Bowcher
1009Stacey MacleadIndia2026-04-04Feltz Printing Service RENEWAL81Asiya Javayant
1010Mayumi KolmetzJapan2026-03-26Printing Dimensions QUALIFIED79Elwin Sharvill
1011Antonio CaudyFrance2026-04-12Feiner Bros PROPOSAL68Elwin Sharvill
1012Morrow RutaSpain2026-04-14Rangoni Of Florence NEW68Ioni Bowcher
1013Aditya KuskoRussia2026-04-04Feltz Printing Service QUALIFIED61Amy Elsner
1014Julie StensethSpain2026-04-15Feltz Printing Service NEGOTIATION5Onyama Limba
1015Faith GillianUnited Kingdom2026-04-08Rousseaux, Michael Esq NEGOTIATION38Elwin Sharvill
1016Silvio SlusarskiItaly2026-04-19Dorl, James J Esq RENEWAL61Elwin Sharvill
1017Aditya KuskoFrance2026-04-17Feiner Bros NEGOTIATION58Bernardo Dominic
1018Smith GlickBrazil2026-03-24Feiner Bros QUALIFIED85Onyama Limba
1019Mujtaba NickaArgentina2026-03-26King, Christopher A Esq RENEWAL82Ivan Magalhaes
1020Antonio CaudyBrazil2026-04-04Printing Dimensions NEW16Onyama Limba
1021Jennifer AmigonBrazil2026-04-19Commercial Press NEGOTIATION5Xuxue Feng
1022Isabel BowleyGermany2026-04-18Chanay, Jeffrey A Esq NEGOTIATION71Bernardo Dominic
1023Juan WieserGermany2026-04-05Dorl, James J Esq RENEWAL97Stephen Shaw
1024Alejandro PerinUnited Kingdom2026-03-29Rousseaux, Michael Esq RENEWAL67Xuxue Feng
1025Chavez BriddickAustralia2026-04-11Feltz Printing Service UNQUALIFIED69Elwin Sharvill
1026Smith GlickBrazil2026-04-08Dorl, James J Esq UNQUALIFIED2Asiya Javayant
1027Aditya KuskoArgentina2026-04-13Printing Dimensions QUALIFIED24Anna Fali
1028Jefferson SchemmerArgentina2026-04-08Rousseaux, Michael Esq NEGOTIATION34Amy Elsner
1029Adams MorascaAustralia2026-04-16Feltz Printing Service NEW29Anna Fali
1030Julie StensethCanada2026-04-07Truhlar And Truhlar Attys QUALIFIED36Stephen Shaw
1031Stacey MacleadCanada2026-04-03Rousseaux, Michael Esq PROPOSAL11Anna Fali
1032Salvatore StockhamFrance2026-04-12Dorl, James J Esq NEW7Asiya Javayant
1033Aruna FigeroaGermany2026-03-28Truhlar And Truhlar Attys UNQUALIFIED8Ioni Bowcher
1034Rodrigues CampainJapan2026-04-15Feiner Bros PROPOSAL33Amy Elsner
1035Tony FollerFrance2026-03-30Chanay, Jeffrey A Esq RENEWAL85Xuxue Feng
1036Mayumi KolmetzCanada2026-04-18Truhlar And Truhlar Attys NEW96Onyama Limba
1037Antonio CaudyCanada2026-03-27Rousseaux, Michael Esq NEGOTIATION4Xuxue Feng
1038Jefferson SchemmerArgentina2026-03-24Chemel, James L Cpa QUALIFIED32Xuxue Feng
1039Izzy GarufiBrazil2026-04-10Truhlar And Truhlar Attys NEW45Elwin Sharvill
1040Aika InouyeArgentina2026-04-19Printing Dimensions RENEWAL42Bernardo Dominic
1041Darci PoquetteSpain2026-04-11Buckley Miller Wright UNQUALIFIED69Bernardo Dominic
1042Ashley DoeBrazil2026-04-04Printing Dimensions NEGOTIATION38Onyama Limba
1043Ricardo GauchoItaly2026-03-26Rangoni Of Florence NEGOTIATION52Stephen Shaw
1044Chavez BriddickAustralia2026-04-04Chanay, Jeffrey A Esq PROPOSAL76Onyama Limba
1045Clifford RimFrance2026-03-23Buckley Miller Wright QUALIFIED24Ivan Magalhaes
1046Adams MorascaFrance2026-04-13Buckley Miller Wright UNQUALIFIED79Asiya Javayant
1047Ivar PaprockiFrance2026-03-28Commercial Press NEW71Onyama Limba
1048Greenwood BologniaArgentina2026-04-02Rousseaux, Michael Esq NEGOTIATION70Ivan Magalhaes
1049David DarakjyAustralia2026-04-11Chemel, James L Cpa RENEWAL7Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Maria MarrierGermanyBernardo Dominic UNQUALIFIED
Munro FerenczItalyIvan Magalhaes UNQUALIFIED
Johnson SergiFranceXuxue Feng UNQUALIFIED
Mayumi KolmetzSpainIvan Magalhaes UNQUALIFIED
Claire TollnerIndiaOnyama Limba NEGOTIATION
Stacey MacleadItalyAmy Elsner NEW
Sinclair WaycottGermanyOnyama Limba NEGOTIATION
Julie StensethIndiaAmy Elsner RENEWAL
Mayumi KolmetzSpainElwin Sharvill RENEWAL
Rodrigues CampainGermanyIoni Bowcher PROPOSAL
Aditya KuskoSpainAnna Fali UNQUALIFIED
Kadeem FlosiGermanyOnyama Limba PROPOSAL
Munro FerenczAustraliaXuxue Feng PROPOSAL
Murillo MaletArgentinaAmy Elsner RENEWAL
Ivar PaprockiSpainAsiya Javayant NEW
Leon OldroydRussiaAmy Elsner PROPOSAL
Jefferson SchemmerItalyAmy Elsner RENEWAL
Ashley DoeBrazilElwin Sharvill NEGOTIATION
Alejandro PerinSpainStephen Shaw QUALIFIED
Octavia MaletSpainIoni Bowcher PROPOSAL
Costa DilliardGermanyStephen Shaw NEW
Maria MarrierBrazilStephen Shaw UNQUALIFIED
Salvatore StockhamArgentinaAmy Elsner NEGOTIATION
Munro FerenczUnited KingdomOnyama Limba UNQUALIFIED
Francesco ShinkoGermanyBernardo Dominic UNQUALIFIED
Juan WieserSpainIvan Magalhaes PROPOSAL
Aika InouyeGermanyIvan Magalhaes QUALIFIED
Jeanfrancois VenereUnited KingdomIvan Magalhaes NEW
Nicolas IturbideCanadaIoni Bowcher PROPOSAL
Leon OldroydItalyStephen Shaw PROPOSAL
Antonio CaudyArgentinaAmy Elsner NEGOTIATION
Kaitlin OstroskyBrazilStephen Shaw QUALIFIED
Morrow RutaUnited KingdomIvan Magalhaes RENEWAL
Salvatore StockhamSpainXuxue Feng RENEWAL
Julie StensethAustraliaElwin Sharvill PROPOSAL
Francesco ShinkoUnited KingdomXuxue Feng NEGOTIATION
Maria MarrierGermanyOnyama Limba NEW
Misaki RoysterRussiaXuxue Feng NEW
Greenwood BologniaAustraliaOnyama Limba PROPOSAL
James ButtCanadaIoni Bowcher NEGOTIATION
Smith GlickUnited KingdomIvan Magalhaes UNQUALIFIED
Salvatore StockhamJapanStephen Shaw UNQUALIFIED
Munro FerenczGermanyAsiya Javayant NEW
Juan WieserArgentinaBernardo Dominic UNQUALIFIED
Johnson SergiAustraliaAmy Elsner PROPOSAL
Maria MarrierSpainBernardo Dominic UNQUALIFIED
Ivar PaprockiRussiaIvan Magalhaes RENEWAL
Francesco ShinkoAustraliaIvan Magalhaes UNQUALIFIED
Clifford RimIndiaAsiya Javayant NEGOTIATION
Kadeem FlosiAustraliaAnna Fali QUALIFIED
Frozen Columns
Name
Ivar Paprocki
Clifford Rim
Mujtaba Nicka
Ivar Paprocki
Mujtaba Nicka
Stacey Maclead
Murillo Malet
Chavez Briddick
Tony Foller
Nicolas Iturbide
Julie Stenseth
Maria Marrier
Kaitlin Ostrosky
Morrow Ruta
David Darakjy
Francesco Shinko
Kaitlin Ostrosky
Salvatore Stockham
Kadeem Flosi
Isabel Bowley
Aditya Kusko
Chavez Briddick
Greenwood Bolognia
Adams Morasca
Chavez Briddick
Antonio Caudy
Emily Whobrey
Nicolas Iturbide
Maisha Rulapaugh
Izzy Garufi
Wickens Nestle
Tony Foller
Aruna Figeroa
Kaitlin Ostrosky
Claire Tollner
Adams Morasca
Salvatore Stockham
Jeanfrancois Venere
Ivar Paprocki
Jefferson Schemmer
Greenwood Bolognia
Kaitlin Ostrosky
Kadeem Flosi
Aika Inouye
Ricardo Gaucho
Mayumi Kolmetz
Ricardo Gaucho
Leja Caldarera
Clifford Rim
Francesco Shinko
IdCountryDate
1000Argentina2026-04-02
1001Brazil2026-03-23
1002United Kingdom2026-04-21
1003Germany2026-03-24
1004Japan2026-04-11
1005France2026-03-27
1006France2026-04-01
1007Italy2026-04-02
1008Russia2026-03-29
1009Spain2026-03-29
1010Japan2026-04-13
1011Italy2026-03-27
1012France2026-04-09
1013Australia2026-04-18
1014Argentina2026-03-27
1015Germany2026-03-31
1016Australia2026-04-01
1017Australia2026-04-20
1018Italy2026-04-08
1019Japan2026-04-11
1020Canada2026-04-09
1021Argentina2026-04-10
1022Argentina2026-04-21
1023India2026-03-25
1024Italy2026-04-09
1025Germany2026-04-18
1026India2026-04-11
1027Argentina2026-04-01
1028United Kingdom2026-03-28
1029Germany2026-04-11
1030Canada2026-04-10
1031United Kingdom2026-04-13
1032United Kingdom2026-03-25
1033Germany2026-03-27
1034Japan2026-04-15
1035Germany2026-03-23
1036India2026-03-24
1037Brazil2026-04-11
1038Italy2026-04-01
1039France2026-04-19
1040Russia2026-04-05
1041Germany2026-04-02
1042Argentina2026-04-14
1043Brazil2026-04-14
1044Australia2026-04-11
1045France2026-04-02
1046Italy2026-04-01
1047Russia2026-04-13
1048Italy2026-04-19
1049Canada2026-03-27

On-Demand Data

NameIdCountryDate
Jennifer Amigon1000Brazil2026-04-18
Leon Oldroyd1001Russia2026-04-19
Izzy Garufi1002Germany2026-04-10
Isabel Bowley1003India2026-04-04
Mujtaba Nicka1004India2026-03-29
Deepesh Chui1005Australia2026-04-18
Isabel Bowley1006Japan2026-04-21
Chavez Briddick1007Australia2026-04-06
Julie Stenseth1008Russia2026-04-01
Jennifer Amigon1009France2026-03-29
Emily Whobrey1010Australia2026-04-10
Maria Marrier1011Germany2026-04-18
Jennifer Amigon1012Argentina2026-03-29
Jeanfrancois Venere1013Australia2026-04-03
Arvin Albares1014India2026-04-08
Izzy Garufi1015Canada2026-04-06
Darci Poquette1016Italy2026-04-19
Isabel Bowley1017Japan2026-04-03
Morrow Ruta1018Canada2026-04-09
Costa Dilliard1019India2026-03-29
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jennifer AmigonAustraliaElwin Sharvill QUALIFIED
Juan WieserIndiaElwin Sharvill PROPOSAL
Kaitlin OstroskyUnited KingdomAnna Fali QUALIFIED
Ricardo GauchoRussiaAnna Fali UNQUALIFIED
Mayumi KolmetzFranceAnna Fali RENEWAL
Costa DilliardIndiaIvan Magalhaes PROPOSAL
Darci PoquetteItalyAnna Fali NEGOTIATION
Clifford RimBrazilAsiya Javayant UNQUALIFIED
Cody SaylorsAustraliaAsiya Javayant PROPOSAL
David DarakjyAustraliaBernardo Dominic NEW
Costa DilliardJapanStephen Shaw RENEWAL
Juan WieserCanadaBernardo Dominic PROPOSAL
Maria MarrierCanadaBernardo Dominic RENEWAL
Munro FerenczAustraliaIoni Bowcher QUALIFIED
Silvio SlusarskiFranceStephen Shaw RENEWAL
Leja CaldareraAustraliaXuxue Feng NEW
Aika InouyeFranceIoni Bowcher NEGOTIATION
Jeanfrancois VenereUnited KingdomAsiya Javayant RENEWAL
Aditya KuskoItalyIoni Bowcher RENEWAL
Morrow RutaIndiaIoni Bowcher QUALIFIED
Salvatore StockhamRussiaAsiya Javayant PROPOSAL
Emily WhobreyBrazilAsiya Javayant NEW
Claire TollnerUnited KingdomOnyama Limba NEW
Tony FollerRussiaXuxue Feng RENEWAL
Maisha RulapaughIndiaAnna Fali UNQUALIFIED
Francesco ShinkoGermanyStephen Shaw NEGOTIATION
Deepesh ChuiJapanAnna Fali UNQUALIFIED
Costa DilliardAustraliaXuxue Feng PROPOSAL
Izzy GarufiCanadaAnna Fali QUALIFIED
Misaki RoysterGermanyOnyama Limba RENEWAL
Clifford RimSpainOnyama Limba PROPOSAL
Tony FollerJapanAsiya Javayant RENEWAL
Silvio SlusarskiBrazilXuxue Feng PROPOSAL
Aditya KuskoUnited KingdomAmy Elsner NEGOTIATION
James ButtArgentinaOnyama Limba UNQUALIFIED
Adams MorascaGermanyIoni Bowcher PROPOSAL
Silvio SlusarskiItalyAsiya Javayant RENEWAL
Darci PoquetteUnited KingdomElwin Sharvill PROPOSAL
Rodrigues CampainGermanyStephen Shaw RENEWAL
Murillo MaletBrazilXuxue 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>