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
James ButtUnited KingdomBernardo Dominic NEGOTIATION
David DarakjySpainAsiya Javayant NEW
Jennifer AmigonCanadaAnna Fali NEGOTIATION
Jennifer AmigonJapanStephen Shaw UNQUALIFIED
Izzy GarufiRussiaAnna Fali NEW
Smith GlickGermanyIoni Bowcher QUALIFIED
Murillo MaletFranceAsiya Javayant RENEWAL
Ivar PaprockiUnited KingdomBernardo Dominic QUALIFIED
Misaki RoysterArgentinaAsiya Javayant UNQUALIFIED
Clifford RimAustraliaOnyama Limba RENEWAL
Ricardo GauchoItalyAmy Elsner RENEWAL
Johnson SergiRussiaXuxue Feng QUALIFIED
Antonio CaudyCanadaBernardo Dominic RENEWAL
Mujtaba NickaRussiaAnna Fali QUALIFIED
Jefferson SchemmerRussiaAsiya Javayant NEW
Juan WieserIndiaBernardo Dominic UNQUALIFIED
David DarakjyItalyIoni Bowcher NEGOTIATION
Mayumi KolmetzBrazilElwin Sharvill PROPOSAL
Ricardo GauchoFranceAsiya Javayant NEGOTIATION
David DarakjyItalyAmy Elsner RENEWAL
Jeanfrancois VenereIndiaIvan Magalhaes RENEWAL
Octavia MaletBrazilElwin Sharvill PROPOSAL
Ashley DoeIndiaOnyama Limba PROPOSAL
Smith GlickIndiaIoni Bowcher NEGOTIATION
Nicolas IturbideUnited KingdomIvan Magalhaes NEGOTIATION
Alejandro PerinJapanStephen Shaw UNQUALIFIED
Jones VocelkaAustraliaAnna Fali UNQUALIFIED
Maria MarrierSpainStephen Shaw RENEWAL
Salvatore StockhamItalyOnyama Limba PROPOSAL
Greenwood BologniaUnited KingdomAsiya Javayant RENEWAL
Antonio CaudyGermanyAmy Elsner RENEWAL
Jones VocelkaFranceAnna Fali NEW
Alejandro PerinJapanOnyama Limba UNQUALIFIED
Leja CaldareraBrazilIvan Magalhaes QUALIFIED
Jeanfrancois VenereGermanyAnna Fali RENEWAL
Antonio CaudyRussiaStephen Shaw RENEWAL
Clifford RimSpainOnyama Limba PROPOSAL
Johnson SergiUnited KingdomXuxue Feng RENEWAL
Silvio SlusarskiBrazilIvan Magalhaes NEW
Misaki RoysterItalyIoni Bowcher QUALIFIED
Jones VocelkaBrazilAsiya Javayant NEW
Costa DilliardAustraliaAsiya Javayant PROPOSAL
Cody SaylorsRussiaIoni Bowcher UNQUALIFIED
Darci PoquetteUnited KingdomXuxue Feng RENEWAL
Alejandro PerinItalyIvan Magalhaes NEW
Morrow RutaItalyBernardo Dominic NEGOTIATION
Izzy GarufiSpainXuxue Feng NEW
Murillo MaletSpainIvan Magalhaes NEGOTIATION
Kadeem FlosiJapanIoni Bowcher QUALIFIED
David DarakjyRussiaAmy Elsner NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Aika InouyeJapanAnna Fali RENEWAL
Greenwood BologniaGermanyXuxue Feng NEGOTIATION
Tony FollerArgentinaAmy Elsner RENEWAL
Deepesh ChuiArgentinaElwin Sharvill QUALIFIED
Jones VocelkaUnited KingdomAsiya Javayant PROPOSAL
James ButtUnited KingdomOnyama Limba UNQUALIFIED
Emily WhobreyJapanElwin Sharvill PROPOSAL
Ricardo GauchoRussiaAnna Fali UNQUALIFIED
Francesco ShinkoFranceAsiya Javayant RENEWAL
James ButtUnited KingdomOnyama Limba UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Mayumi KolmetzFrance2026-05-15Commercial Press NEGOTIATION88Onyama Limba
1001Adams MorascaArgentina2026-06-01Chapman, Ross E Esq UNQUALIFIED21Bernardo Dominic
1002Maisha RulapaughSpain2026-05-12Printing Dimensions PROPOSAL39Stephen Shaw
1003Silvio SlusarskiCanada2026-05-10Chapman, Ross E Esq NEGOTIATION16Ivan Magalhaes
1004Salvatore StockhamAustralia2026-05-19Buckley Miller Wright RENEWAL17Stephen Shaw
1005Arvin AlbaresJapan2026-05-29Rousseaux, Michael Esq QUALIFIED69Ioni Bowcher
1006Kaitlin OstroskyAustralia2026-05-29Rousseaux, Michael Esq NEGOTIATION48Ioni Bowcher
1007Emily WhobreySpain2026-06-04Feltz Printing Service RENEWAL14Stephen Shaw
1008David DarakjyUnited Kingdom2026-06-04Feiner Bros NEGOTIATION7Ioni Bowcher
1009Kaitlin OstroskyArgentina2026-05-28Dorl, James J Esq RENEWAL95Onyama Limba
1010Kadeem FlosiFrance2026-05-27Feiner Bros PROPOSAL6Elwin Sharvill
1011Maria MarrierArgentina2026-05-07Chanay, Jeffrey A Esq RENEWAL18Onyama Limba
1012Emily WhobreyUnited Kingdom2026-05-29Rousseaux, Michael Esq RENEWAL99Ivan Magalhaes
1013Maisha RulapaughGermany2026-05-16Feltz Printing Service NEW99Xuxue Feng
1014Smith GlickAustralia2026-05-27Printing Dimensions PROPOSAL30Onyama Limba
1015Izzy GarufiGermany2026-05-19Morlong Associates NEW20Ioni Bowcher
1016Sinclair WaycottSpain2026-05-21Feiner Bros NEW85Anna Fali
1017James ButtBrazil2026-05-28Commercial Press PROPOSAL96Onyama Limba
1018Clifford RimGermany2026-05-11Feltz Printing Service RENEWAL12Asiya Javayant
1019Murillo MaletItaly2026-05-24Benton, John B Jr RENEWAL66Onyama Limba
1020Cody SaylorsUnited Kingdom2026-05-10Chapman, Ross E Esq UNQUALIFIED87Onyama Limba
1021Julie StensethArgentina2026-05-06Truhlar And Truhlar Attys PROPOSAL49Asiya Javayant
1022Darci PoquetteAustralia2026-05-24Morlong Associates PROPOSAL91Onyama Limba
1023Darci PoquetteRussia2026-05-31Chanay, Jeffrey A Esq QUALIFIED60Ioni Bowcher
1024Clifford RimItaly2026-05-19Chapman, Ross E Esq QUALIFIED82Amy Elsner
1025Emily WhobreySpain2026-05-11Rangoni Of Florence RENEWAL74Ioni Bowcher
1026Morrow RutaItaly2026-06-04Printing Dimensions QUALIFIED50Ioni Bowcher
1027James ButtSpain2026-05-10King, Christopher A Esq UNQUALIFIED39Elwin Sharvill
1028Ashley DoeAustralia2026-05-06Chanay, Jeffrey A Esq NEW30Anna Fali
1029Julie StensethUnited Kingdom2026-05-28Buckley Miller Wright PROPOSAL2Asiya Javayant
1030Murillo MaletFrance2026-05-29Dorl, James J Esq NEGOTIATION30Xuxue Feng
1031Emily WhobreySpain2026-05-19Feltz Printing Service PROPOSAL82Xuxue Feng
1032Aika InouyeCanada2026-05-10Chapman, Ross E Esq RENEWAL16Anna Fali
1033Aditya KuskoItaly2026-06-01Dorl, James J Esq UNQUALIFIED70Amy Elsner
1034Alejandro PerinCanada2026-05-27Truhlar And Truhlar Attys UNQUALIFIED76Anna Fali
1035Stacey MacleadAustralia2026-05-24Rousseaux, Michael Esq NEGOTIATION96Onyama Limba
1036Alejandro PerinArgentina2026-05-06Feiner Bros NEGOTIATION27Anna Fali
1037Clifford RimItaly2026-05-25Buckley Miller Wright QUALIFIED16Ivan Magalhaes
1038Stacey MacleadIndia2026-05-22Feiner Bros PROPOSAL39Xuxue Feng
1039Jefferson SchemmerRussia2026-05-15Commercial Press UNQUALIFIED6Stephen Shaw
1040Smith GlickUnited Kingdom2026-05-29Printing Dimensions NEW18Onyama Limba
1041Smith GlickCanada2026-06-04Buckley Miller Wright PROPOSAL44Ivan Magalhaes
1042Leja CaldareraCanada2026-05-10Feiner Bros RENEWAL83Asiya Javayant
1043Misaki RoysterArgentina2026-05-27Dorl, James J Esq NEGOTIATION7Asiya Javayant
1044Rodrigues CampainBrazil2026-05-22Chemel, James L Cpa NEW49Bernardo Dominic
1045Ricardo GauchoBrazil2026-05-21Buckley Miller Wright NEGOTIATION2Stephen Shaw
1046Ashley DoeFrance2026-05-24Chemel, James L Cpa NEGOTIATION49Anna Fali
1047Ivar PaprockiBrazil2026-05-10Benton, John B Jr NEGOTIATION74Asiya Javayant
1048Claire TollnerItaly2026-05-30Commercial Press UNQUALIFIED16Elwin Sharvill
1049Aditya KuskoItaly2026-06-02Buckley Miller Wright NEW68Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Antonio CaudyItalyStephen Shaw NEGOTIATION
Costa DilliardArgentinaOnyama Limba RENEWAL
Deepesh ChuiIndiaStephen Shaw UNQUALIFIED
Greenwood BologniaCanadaAmy Elsner NEW
Chavez BriddickUnited KingdomIoni Bowcher NEW
Arvin AlbaresFranceBernardo Dominic QUALIFIED
Antonio CaudyItalyAmy Elsner RENEWAL
Julie StensethCanadaStephen Shaw RENEWAL
Jones VocelkaSpainAsiya Javayant PROPOSAL
Aditya KuskoAustraliaStephen Shaw PROPOSAL
Julie StensethItalyIoni Bowcher PROPOSAL
Aruna FigeroaAustraliaIvan Magalhaes NEGOTIATION
Mujtaba NickaCanadaAmy Elsner NEGOTIATION
Greenwood BologniaGermanyElwin Sharvill QUALIFIED
Aika InouyeGermanyBernardo Dominic PROPOSAL
Ricardo GauchoCanadaBernardo Dominic NEGOTIATION
Clifford RimGermanyAsiya Javayant RENEWAL
Izzy GarufiSpainIoni Bowcher PROPOSAL
Jennifer AmigonJapanBernardo Dominic NEGOTIATION
Julie StensethUnited KingdomBernardo Dominic RENEWAL
Misaki RoysterUnited KingdomOnyama Limba RENEWAL
Ashley DoeArgentinaAnna Fali RENEWAL
Smith GlickAustraliaAnna Fali UNQUALIFIED
Silvio SlusarskiArgentinaIoni Bowcher RENEWAL
Morrow RutaGermanyElwin Sharvill NEW
Johnson SergiSpainOnyama Limba PROPOSAL
Arvin AlbaresArgentinaStephen Shaw UNQUALIFIED
Ivar PaprockiIndiaBernardo Dominic UNQUALIFIED
James ButtFranceOnyama Limba QUALIFIED
Aika InouyeSpainStephen Shaw QUALIFIED
Aditya KuskoBrazilElwin Sharvill PROPOSAL
Alejandro PerinBrazilAsiya Javayant RENEWAL
Sinclair WaycottSpainAsiya Javayant QUALIFIED
Alejandro PerinGermanyBernardo Dominic NEGOTIATION
Clifford RimUnited KingdomAnna Fali NEW
Rodrigues CampainGermanyXuxue Feng NEGOTIATION
Francesco ShinkoUnited KingdomXuxue Feng UNQUALIFIED
Ivar PaprockiUnited KingdomAsiya Javayant RENEWAL
Ricardo GauchoAustraliaBernardo Dominic RENEWAL
Ivar PaprockiItalyElwin Sharvill NEGOTIATION
Salvatore StockhamGermanyStephen Shaw NEW
Jeanfrancois VenereUnited KingdomElwin Sharvill RENEWAL
Ashley DoeArgentinaAnna Fali UNQUALIFIED
Aika InouyeRussiaBernardo Dominic RENEWAL
Darci PoquetteUnited KingdomAnna Fali NEGOTIATION
Misaki RoysterArgentinaIoni Bowcher RENEWAL
Faith GillianUnited KingdomBernardo Dominic UNQUALIFIED
Mayumi KolmetzArgentinaAsiya Javayant NEW
Octavia MaletAustraliaOnyama Limba NEGOTIATION
Isabel BowleyCanadaBernardo Dominic PROPOSAL
Frozen Columns
Name
Munro Ferencz
Wickens Nestle
Wickens Nestle
Chavez Briddick
Johnson Sergi
Maria Marrier
Clifford Rim
Jefferson Schemmer
Izzy Garufi
Deepesh Chui
Rodrigues Campain
Aditya Kusko
Wickens Nestle
Ricardo Gaucho
Morrow Ruta
Octavia Malet
Jefferson Schemmer
Arvin Albares
Darci Poquette
Johnson Sergi
Tony Foller
Aruna Figeroa
Munro Ferencz
Jones Vocelka
Jefferson Schemmer
Sinclair Waycott
Murillo Malet
Costa Dilliard
David Darakjy
Murillo Malet
David Darakjy
Maisha Rulapaugh
Stacey Maclead
Stacey Maclead
Stacey Maclead
Ashley Doe
Julie Stenseth
Julie Stenseth
Silvio Slusarski
Ricardo Gaucho
Juan Wieser
Salvatore Stockham
Isabel Bowley
Morrow Ruta
Antonio Caudy
Jeanfrancois Venere
Greenwood Bolognia
Leon Oldroyd
Ashley Doe
Julie Stenseth
IdCountryDate
1000Argentina2026-05-09
1001Italy2026-05-18
1002Japan2026-05-25
1003Japan2026-05-13
1004Japan2026-05-31
1005Australia2026-05-27
1006Japan2026-05-28
1007Australia2026-05-26
1008Brazil2026-05-18
1009India2026-05-12
1010Argentina2026-05-10
1011Spain2026-05-24
1012Russia2026-05-30
1013Russia2026-05-31
1014Brazil2026-06-02
1015Brazil2026-05-24
1016France2026-05-31
1017United Kingdom2026-05-19
1018United Kingdom2026-05-29
1019Australia2026-05-23
1020United Kingdom2026-05-12
1021France2026-06-01
1022Argentina2026-05-28
1023Japan2026-05-11
1024United Kingdom2026-05-10
1025United Kingdom2026-05-13
1026Germany2026-05-29
1027Russia2026-05-27
1028Germany2026-05-15
1029Japan2026-05-07
1030United Kingdom2026-05-30
1031Argentina2026-05-26
1032Argentina2026-05-08
1033United Kingdom2026-05-19
1034India2026-05-08
1035United Kingdom2026-06-04
1036Italy2026-05-27
1037Germany2026-06-02
1038Italy2026-05-06
1039Japan2026-05-06
1040Brazil2026-05-25
1041France2026-05-27
1042Australia2026-05-09
1043Germany2026-05-21
1044France2026-05-11
1045Argentina2026-05-14
1046Australia2026-05-24
1047Spain2026-05-13
1048Russia2026-05-19
1049Japan2026-05-09

On-Demand Data

NameIdCountryDate
Aika Inouye1000Germany2026-05-12
Faith Gillian1001Canada2026-05-30
Aika Inouye1002France2026-05-17
Aditya Kusko1003France2026-05-26
Aditya Kusko1004France2026-05-08
Kadeem Flosi1005Japan2026-05-17
Johnson Sergi1006Brazil2026-05-26
Kaitlin Ostrosky1007Spain2026-05-22
Isabel Bowley1008Australia2026-05-19
Salvatore Stockham1009Spain2026-06-03
Nicolas Iturbide1010Canada2026-05-19
Mujtaba Nicka1011Italy2026-05-12
Silvio Slusarski1012Japan2026-06-04
Emily Whobrey1013Germany2026-05-17
Claire Tollner1014Australia2026-05-27
Arvin Albares1015Brazil2026-05-08
Ashley Doe1016Germany2026-05-07
Antonio Caudy1017Japan2026-05-24
Tony Foller1018Germany2026-05-18
Kaitlin Ostrosky1019Russia2026-05-27
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Maisha RulapaughRussiaAmy Elsner QUALIFIED
Leon OldroydUnited KingdomAsiya Javayant RENEWAL
Munro FerenczArgentinaBernardo Dominic QUALIFIED
Jeanfrancois VenereFranceAsiya Javayant QUALIFIED
Salvatore StockhamUnited KingdomIoni Bowcher NEW
Johnson SergiFranceAnna Fali UNQUALIFIED
Aruna FigeroaArgentinaXuxue Feng NEGOTIATION
Rodrigues CampainUnited KingdomOnyama Limba NEW
Cody SaylorsGermanyAsiya Javayant RENEWAL
Darci PoquetteSpainAmy Elsner NEGOTIATION
Aika InouyeCanadaElwin Sharvill QUALIFIED
Jefferson SchemmerRussiaAsiya Javayant UNQUALIFIED
Jones VocelkaSpainIoni Bowcher RENEWAL
Alejandro PerinSpainXuxue Feng NEGOTIATION
Rodrigues CampainJapanOnyama Limba RENEWAL
Adams MorascaUnited KingdomStephen Shaw RENEWAL
Johnson SergiIndiaAsiya Javayant NEW
Jeanfrancois VenereJapanBernardo Dominic RENEWAL
Octavia MaletSpainAsiya Javayant PROPOSAL
Darci PoquetteUnited KingdomXuxue Feng RENEWAL
Rodrigues CampainFranceIvan Magalhaes PROPOSAL
Cody SaylorsAustraliaAmy Elsner NEGOTIATION
Jones VocelkaBrazilStephen Shaw NEGOTIATION
Silvio SlusarskiUnited KingdomAnna Fali UNQUALIFIED
Jennifer AmigonArgentinaIvan Magalhaes RENEWAL
Francesco ShinkoUnited KingdomIvan Magalhaes NEW
Rodrigues CampainJapanAsiya Javayant NEGOTIATION
Rodrigues CampainFranceXuxue Feng NEW
Morrow RutaGermanyIoni Bowcher PROPOSAL
Leon OldroydRussiaAnna Fali NEGOTIATION
Misaki RoysterJapanIvan Magalhaes PROPOSAL
Costa DilliardBrazilXuxue Feng QUALIFIED
Jefferson SchemmerItalyStephen Shaw NEW
Francesco ShinkoGermanyAnna Fali PROPOSAL
Emily WhobreyGermanyAmy Elsner NEW
Aditya KuskoIndiaOnyama Limba UNQUALIFIED
Leon OldroydFranceAsiya Javayant NEGOTIATION
Jennifer AmigonIndiaIoni Bowcher PROPOSAL
Faith GillianUnited KingdomIvan Magalhaes NEW
Greenwood BologniaItalyBernardo Dominic 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>