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
Izzy GarufiBrazilElwin Sharvill NEGOTIATION
Jones VocelkaFranceBernardo Dominic QUALIFIED
Greenwood BologniaGermanyAnna Fali RENEWAL
Kaitlin OstroskyArgentinaElwin Sharvill QUALIFIED
Antonio CaudyAustraliaAsiya Javayant QUALIFIED
Aditya KuskoSpainIoni Bowcher NEW
Jefferson SchemmerArgentinaAsiya Javayant RENEWAL
Julie StensethBrazilIoni Bowcher QUALIFIED
David DarakjyBrazilBernardo Dominic UNQUALIFIED
Rodrigues CampainBrazilXuxue Feng RENEWAL
Darci PoquetteBrazilIoni Bowcher PROPOSAL
Kadeem FlosiJapanAnna Fali NEW
Aruna FigeroaItalyIoni Bowcher NEW
Deepesh ChuiIndiaBernardo Dominic UNQUALIFIED
Juan WieserRussiaOnyama Limba NEGOTIATION
Octavia MaletIndiaIvan Magalhaes PROPOSAL
David DarakjyBrazilAnna Fali RENEWAL
Rodrigues CampainRussiaElwin Sharvill QUALIFIED
Francesco ShinkoArgentinaBernardo Dominic RENEWAL
Cody SaylorsUnited KingdomIoni Bowcher PROPOSAL
Juan WieserIndiaAsiya Javayant NEW
David DarakjyBrazilAnna Fali PROPOSAL
Ashley DoeGermanyXuxue Feng QUALIFIED
Murillo MaletIndiaIoni Bowcher PROPOSAL
Adams MorascaSpainOnyama Limba NEW
Kadeem FlosiCanadaAmy Elsner UNQUALIFIED
Aditya KuskoUnited KingdomElwin Sharvill UNQUALIFIED
Nicolas IturbideGermanyIoni Bowcher UNQUALIFIED
Deepesh ChuiUnited KingdomAsiya Javayant UNQUALIFIED
Tony FollerJapanIvan Magalhaes PROPOSAL
Leon OldroydItalyXuxue Feng UNQUALIFIED
Morrow RutaUnited KingdomBernardo Dominic NEW
Greenwood BologniaRussiaAnna Fali NEW
Antonio CaudyJapanStephen Shaw UNQUALIFIED
Cody SaylorsGermanyElwin Sharvill RENEWAL
Julie StensethFranceAsiya Javayant UNQUALIFIED
Jones VocelkaRussiaStephen Shaw QUALIFIED
Chavez BriddickItalyXuxue Feng PROPOSAL
Kaitlin OstroskyJapanBernardo Dominic RENEWAL
Jeanfrancois VenereItalyAnna Fali NEW
Francesco ShinkoJapanXuxue Feng QUALIFIED
Cody SaylorsItalyXuxue Feng NEGOTIATION
Claire TollnerSpainElwin Sharvill NEGOTIATION
Silvio SlusarskiGermanyStephen Shaw PROPOSAL
Maria MarrierGermanyElwin Sharvill UNQUALIFIED
Alejandro PerinUnited KingdomAmy Elsner PROPOSAL
Maria MarrierRussiaElwin Sharvill QUALIFIED
Arvin AlbaresUnited KingdomBernardo Dominic RENEWAL
Jeanfrancois VenereArgentinaAmy Elsner UNQUALIFIED
Izzy GarufiBrazilElwin Sharvill QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Greenwood BologniaFranceStephen Shaw PROPOSAL
Stacey MacleadAustraliaElwin Sharvill NEGOTIATION
Munro FerenczSpainOnyama Limba NEW
Jefferson SchemmerFranceAnna Fali NEGOTIATION
Silvio SlusarskiIndiaStephen Shaw RENEWAL
Izzy GarufiIndiaStephen Shaw NEW
Juan WieserRussiaXuxue Feng RENEWAL
Smith GlickFranceElwin Sharvill RENEWAL
Murillo MaletBrazilIoni Bowcher QUALIFIED
Julie StensethBrazilIvan Magalhaes NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Claire TollnerSpain2026-05-15Feiner Bros PROPOSAL63Asiya Javayant
1001Leon OldroydArgentina2026-05-13Feltz Printing Service RENEWAL43Ivan Magalhaes
1002Stacey MacleadUnited Kingdom2026-05-10Rousseaux, Michael Esq UNQUALIFIED5Ioni Bowcher
1003Octavia MaletItaly2026-05-06Benton, John B Jr PROPOSAL20Asiya Javayant
1004Morrow RutaAustralia2026-05-24King, Christopher A Esq PROPOSAL18Asiya Javayant
1005Francesco ShinkoIndia2026-05-09King, Christopher A Esq NEGOTIATION10Stephen Shaw
1006Adams MorascaArgentina2026-05-25Commercial Press NEW45Onyama Limba
1007Faith GillianGermany2026-05-26Chanay, Jeffrey A Esq NEGOTIATION56Anna Fali
1008Stacey MacleadAustralia2026-05-20Morlong Associates UNQUALIFIED63Elwin Sharvill
1009Faith GillianGermany2026-05-27Rousseaux, Michael Esq NEGOTIATION83Stephen Shaw
1010Kaitlin OstroskyItaly2026-05-16Truhlar And Truhlar Attys QUALIFIED53Ioni Bowcher
1011Mayumi KolmetzGermany2026-05-28Buckley Miller Wright NEGOTIATION43Amy Elsner
1012Ashley DoeIndia2026-05-03Morlong Associates QUALIFIED57Onyama Limba
1013Murillo MaletBrazil2026-05-30Morlong Associates RENEWAL84Ivan Magalhaes
1014Rodrigues CampainBrazil2026-05-06Rousseaux, Michael Esq UNQUALIFIED65Ivan Magalhaes
1015Arvin AlbaresRussia2026-05-11Chanay, Jeffrey A Esq UNQUALIFIED3Xuxue Feng
1016Silvio SlusarskiRussia2026-05-24King, Christopher A Esq QUALIFIED65Ioni Bowcher
1017Jeanfrancois VenereCanada2026-05-20Buckley Miller Wright UNQUALIFIED5Amy Elsner
1018Maria MarrierSpain2026-05-13Benton, John B Jr NEGOTIATION75Ioni Bowcher
1019Arvin AlbaresFrance2026-05-15Buckley Miller Wright PROPOSAL14Amy Elsner
1020Wickens NestleBrazil2026-05-18Chapman, Ross E Esq QUALIFIED14Ioni Bowcher
1021Jones VocelkaGermany2026-05-03Commercial Press RENEWAL52Stephen Shaw
1022Maria MarrierFrance2026-05-22Printing Dimensions NEGOTIATION13Asiya Javayant
1023Mujtaba NickaFrance2026-05-16King, Christopher A Esq NEGOTIATION81Elwin Sharvill
1024Arvin AlbaresSpain2026-05-10Morlong Associates QUALIFIED70Ivan Magalhaes
1025Silvio SlusarskiRussia2026-05-25Buckley Miller Wright PROPOSAL68Asiya Javayant
1026Juan WieserCanada2026-05-22Chapman, Ross E Esq NEGOTIATION79Ioni Bowcher
1027David DarakjySpain2026-05-14Rousseaux, Michael Esq NEGOTIATION80Amy Elsner
1028Kadeem FlosiUnited Kingdom2026-05-31King, Christopher A Esq NEW51Xuxue Feng
1029Alejandro PerinIndia2026-05-11Truhlar And Truhlar Attys NEGOTIATION49Elwin Sharvill
1030Munro FerenczFrance2026-05-13Dorl, James J Esq PROPOSAL28Bernardo Dominic
1031Maisha RulapaughUnited Kingdom2026-05-08Chapman, Ross E Esq UNQUALIFIED97Asiya Javayant
1032Tony FollerIndia2026-05-15Buckley Miller Wright NEW21Asiya Javayant
1033David DarakjyBrazil2026-05-03Truhlar And Truhlar Attys PROPOSAL89Elwin Sharvill
1034Chavez BriddickArgentina2026-05-22Feltz Printing Service RENEWAL41Bernardo Dominic
1035Jennifer AmigonGermany2026-05-05Rousseaux, Michael Esq UNQUALIFIED2Amy Elsner
1036Julie StensethGermany2026-05-30Feiner Bros UNQUALIFIED64Elwin Sharvill
1037Izzy GarufiUnited Kingdom2026-05-29Benton, John B Jr NEW36Amy Elsner
1038Aika InouyeFrance2026-05-11Dorl, James J Esq RENEWAL64Ivan Magalhaes
1039Morrow RutaJapan2026-05-19Chemel, James L Cpa UNQUALIFIED81Anna Fali
1040Faith GillianFrance2026-05-24Feiner Bros NEW61Stephen Shaw
1041Adams MorascaJapan2026-05-14Chapman, Ross E Esq UNQUALIFIED13Ivan Magalhaes
1042Stacey MacleadBrazil2026-05-03Morlong Associates PROPOSAL5Anna Fali
1043Adams MorascaJapan2026-06-01King, Christopher A Esq RENEWAL42Anna Fali
1044Ricardo GauchoBrazil2026-05-31Benton, John B Jr NEGOTIATION73Asiya Javayant
1045Misaki RoysterArgentina2026-05-06Morlong Associates PROPOSAL72Ivan Magalhaes
1046Stacey MacleadAustralia2026-05-03Rousseaux, Michael Esq RENEWAL59Xuxue Feng
1047Emily WhobreyAustralia2026-05-07Truhlar And Truhlar Attys PROPOSAL75Anna Fali
1048Stacey MacleadRussia2026-06-01Chanay, Jeffrey A Esq RENEWAL60Ioni Bowcher
1049Izzy GarufiArgentina2026-05-07Morlong Associates QUALIFIED52Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Jeanfrancois VenereCanadaAsiya Javayant NEW
Morrow RutaFranceBernardo Dominic NEGOTIATION
Ivar PaprockiIndiaAmy Elsner NEGOTIATION
Izzy GarufiItalyBernardo Dominic NEW
Alejandro PerinIndiaStephen Shaw PROPOSAL
Wickens NestleJapanXuxue Feng UNQUALIFIED
Rodrigues CampainJapanStephen Shaw RENEWAL
Stacey MacleadGermanyIvan Magalhaes NEGOTIATION
Adams MorascaJapanOnyama Limba QUALIFIED
Julie StensethCanadaIvan Magalhaes PROPOSAL
Arvin AlbaresRussiaStephen Shaw NEW
Darci PoquetteItalyOnyama Limba RENEWAL
Mayumi KolmetzUnited KingdomAnna Fali PROPOSAL
Smith GlickCanadaXuxue Feng NEGOTIATION
Alejandro PerinItalyAmy Elsner RENEWAL
Mujtaba NickaGermanyXuxue Feng NEW
Deepesh ChuiSpainElwin Sharvill NEGOTIATION
Silvio SlusarskiUnited KingdomAmy Elsner QUALIFIED
Aditya KuskoAustraliaElwin Sharvill NEGOTIATION
Deepesh ChuiFranceOnyama Limba NEW
Isabel BowleyUnited KingdomIvan Magalhaes RENEWAL
Ashley DoeCanadaAmy Elsner NEGOTIATION
Julie StensethBrazilElwin Sharvill UNQUALIFIED
Darci PoquetteItalyAsiya Javayant UNQUALIFIED
Jones VocelkaFranceElwin Sharvill NEW
Jefferson SchemmerCanadaIvan Magalhaes NEGOTIATION
Kaitlin OstroskyAustraliaIoni Bowcher UNQUALIFIED
Jennifer AmigonJapanXuxue Feng NEW
Rodrigues CampainItalyOnyama Limba NEGOTIATION
Morrow RutaCanadaAsiya Javayant UNQUALIFIED
Wickens NestleCanadaOnyama Limba UNQUALIFIED
Leon OldroydItalyStephen Shaw RENEWAL
Rodrigues CampainArgentinaIvan Magalhaes QUALIFIED
Alejandro PerinBrazilAmy Elsner PROPOSAL
Arvin AlbaresFranceAnna Fali NEGOTIATION
Murillo MaletArgentinaAmy Elsner QUALIFIED
Nicolas IturbideAustraliaBernardo Dominic NEW
Adams MorascaArgentinaStephen Shaw QUALIFIED
James ButtCanadaOnyama Limba QUALIFIED
Aditya KuskoArgentinaIoni Bowcher RENEWAL
Alejandro PerinCanadaStephen Shaw UNQUALIFIED
Kadeem FlosiGermanyIoni Bowcher QUALIFIED
Ricardo GauchoSpainOnyama Limba PROPOSAL
Francesco ShinkoItalyBernardo Dominic UNQUALIFIED
Clifford RimCanadaElwin Sharvill QUALIFIED
Aika InouyeRussiaAnna Fali NEGOTIATION
Arvin AlbaresBrazilAmy Elsner QUALIFIED
Maisha RulapaughIndiaIvan Magalhaes NEW
Isabel BowleyIndiaAmy Elsner NEGOTIATION
Leja CaldareraBrazilIoni Bowcher NEGOTIATION
Frozen Columns
Name
Jennifer Amigon
Tony Foller
Rodrigues Campain
Tony Foller
Jennifer Amigon
David Darakjy
Antonio Caudy
Morrow Ruta
Aditya Kusko
Sinclair Waycott
Mayumi Kolmetz
Jeanfrancois Venere
David Darakjy
Leon Oldroyd
Clifford Rim
Mayumi Kolmetz
Maria Marrier
Stacey Maclead
Emily Whobrey
Wickens Nestle
David Darakjy
Darci Poquette
Clifford Rim
David Darakjy
Stacey Maclead
Ashley Doe
Stacey Maclead
Wickens Nestle
Aditya Kusko
Kaitlin Ostrosky
Murillo Malet
Kadeem Flosi
Faith Gillian
Clifford Rim
Jones Vocelka
Stacey Maclead
Stacey Maclead
Jeanfrancois Venere
Maisha Rulapaugh
Francesco Shinko
Kaitlin Ostrosky
Ivar Paprocki
David Darakjy
Mayumi Kolmetz
Mujtaba Nicka
Adams Morasca
Smith Glick
Ricardo Gaucho
Arvin Albares
Leon Oldroyd
IdCountryDate
1000Germany2026-05-25
1001Spain2026-05-11
1002Brazil2026-05-04
1003Argentina2026-05-11
1004Spain2026-06-01
1005Argentina2026-05-22
1006Australia2026-05-15
1007Canada2026-05-12
1008Spain2026-05-03
1009Japan2026-05-07
1010France2026-05-14
1011Australia2026-05-19
1012United Kingdom2026-05-27
1013Argentina2026-05-17
1014Japan2026-05-26
1015Russia2026-05-16
1016Italy2026-05-30
1017Argentina2026-05-07
1018India2026-05-12
1019Spain2026-05-30
1020Italy2026-05-10
1021Argentina2026-06-01
1022Canada2026-05-10
1023India2026-05-24
1024Argentina2026-05-10
1025Spain2026-05-13
1026Japan2026-05-05
1027Argentina2026-05-16
1028Spain2026-05-20
1029Brazil2026-05-12
1030Brazil2026-05-15
1031Germany2026-05-12
1032Argentina2026-05-20
1033Italy2026-05-27
1034Germany2026-05-28
1035Argentina2026-05-18
1036Argentina2026-06-01
1037Japan2026-05-31
1038Brazil2026-05-14
1039Canada2026-05-25
1040Germany2026-05-03
1041Canada2026-05-28
1042Australia2026-05-21
1043Germany2026-05-17
1044France2026-05-06
1045Japan2026-06-01
1046France2026-05-06
1047France2026-05-12
1048Spain2026-05-21
1049Russia2026-05-13

On-Demand Data

NameIdCountryDate
Munro Ferencz1000Spain2026-05-24
Aruna Figeroa1001Germany2026-05-03
Alejandro Perin1002India2026-05-28
Francesco Shinko1003Germany2026-05-03
Salvatore Stockham1004Canada2026-05-19
Adams Morasca1005Italy2026-05-05
Mujtaba Nicka1006Spain2026-05-29
Ricardo Gaucho1007Brazil2026-05-22
Rodrigues Campain1008India2026-05-25
Ricardo Gaucho1009Australia2026-05-19
Silvio Slusarski1010Japan2026-05-28
Alejandro Perin1011France2026-05-29
Antonio Caudy1012India2026-05-07
Kaitlin Ostrosky1013Spain2026-05-14
Morrow Ruta1014Italy2026-05-14
Salvatore Stockham1015Russia2026-05-30
Arvin Albares1016Spain2026-05-03
Murillo Malet1017United Kingdom2026-05-22
Murillo Malet1018Argentina2026-06-01
Smith Glick1019Japan2026-06-01
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Leja CaldareraAustraliaElwin Sharvill NEW
Jennifer AmigonArgentinaBernardo Dominic NEW
Mujtaba NickaJapanIoni Bowcher RENEWAL
Octavia MaletCanadaAnna Fali UNQUALIFIED
Sinclair WaycottSpainAnna Fali NEGOTIATION
Kaitlin OstroskyIndiaAnna Fali NEGOTIATION
Izzy GarufiFranceIvan Magalhaes UNQUALIFIED
Tony FollerSpainAsiya Javayant NEGOTIATION
Leon OldroydGermanyAsiya Javayant NEGOTIATION
Ashley DoeGermanyXuxue Feng NEGOTIATION
Antonio CaudyGermanyOnyama Limba UNQUALIFIED
Salvatore StockhamRussiaAmy Elsner UNQUALIFIED
Aditya KuskoFranceBernardo Dominic NEW
Deepesh ChuiFranceElwin Sharvill PROPOSAL
Rodrigues CampainItalyIvan Magalhaes NEGOTIATION
Emily WhobreyArgentinaAsiya Javayant PROPOSAL
Deepesh ChuiSpainAsiya Javayant PROPOSAL
Cody SaylorsItalyAmy Elsner NEGOTIATION
Juan WieserItalyStephen Shaw RENEWAL
Smith GlickSpainOnyama Limba PROPOSAL
Aditya KuskoArgentinaIvan Magalhaes PROPOSAL
Maria MarrierItalyAmy Elsner QUALIFIED
Aika InouyeArgentinaIoni Bowcher RENEWAL
Rodrigues CampainIndiaElwin Sharvill QUALIFIED
Morrow RutaGermanyStephen Shaw PROPOSAL
Mujtaba NickaIndiaOnyama Limba RENEWAL
Arvin AlbaresAustraliaOnyama Limba UNQUALIFIED
Nicolas IturbideBrazilIoni Bowcher NEGOTIATION
Kadeem FlosiJapanOnyama Limba NEW
David DarakjyItalyAmy Elsner NEGOTIATION
Nicolas IturbideJapanElwin Sharvill RENEWAL
Sinclair WaycottJapanOnyama Limba NEGOTIATION
Munro FerenczJapanXuxue Feng QUALIFIED
Izzy GarufiRussiaAsiya Javayant NEGOTIATION
Mayumi KolmetzIndiaOnyama Limba RENEWAL
Kadeem FlosiCanadaAsiya Javayant UNQUALIFIED
Stacey MacleadJapanAsiya Javayant RENEWAL
Jennifer AmigonSpainAnna Fali RENEWAL
Munro FerenczJapanIvan Magalhaes NEW
Silvio SlusarskiIndiaAnna Fali QUALIFIED

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