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
Deepesh ChuiJapanOnyama Limba RENEWAL
Jefferson SchemmerItalyXuxue Feng NEGOTIATION
Emily WhobreyRussiaBernardo Dominic QUALIFIED
Sinclair WaycottJapanXuxue Feng PROPOSAL
Greenwood BologniaCanadaAnna Fali NEGOTIATION
Costa DilliardRussiaBernardo Dominic PROPOSAL
Nicolas IturbideBrazilOnyama Limba UNQUALIFIED
Leja CaldareraCanadaAmy Elsner NEGOTIATION
David DarakjyGermanyElwin Sharvill NEW
Murillo MaletIndiaElwin Sharvill UNQUALIFIED
Salvatore StockhamItalyElwin Sharvill RENEWAL
Munro FerenczRussiaStephen Shaw NEGOTIATION
Munro FerenczSpainAmy Elsner UNQUALIFIED
Stacey MacleadUnited KingdomElwin Sharvill RENEWAL
Chavez BriddickGermanyIvan Magalhaes NEW
Cody SaylorsBrazilXuxue Feng UNQUALIFIED
Misaki RoysterIndiaElwin Sharvill NEW
Stacey MacleadFranceOnyama Limba PROPOSAL
Nicolas IturbideAustraliaIoni Bowcher NEGOTIATION
Ricardo GauchoSpainBernardo Dominic QUALIFIED
Murillo MaletCanadaAnna Fali UNQUALIFIED
Jennifer AmigonRussiaIvan Magalhaes UNQUALIFIED
Maria MarrierArgentinaXuxue Feng PROPOSAL
James ButtGermanyOnyama Limba UNQUALIFIED
Maria MarrierBrazilBernardo Dominic NEW
Julie StensethArgentinaAmy Elsner QUALIFIED
Jennifer AmigonUnited KingdomBernardo Dominic UNQUALIFIED
Alejandro PerinBrazilAnna Fali UNQUALIFIED
Francesco ShinkoAustraliaIvan Magalhaes UNQUALIFIED
Sinclair WaycottIndiaIoni Bowcher NEW
Leja CaldareraIndiaAnna Fali QUALIFIED
David DarakjyAustraliaXuxue Feng QUALIFIED
Octavia MaletSpainAnna Fali UNQUALIFIED
Jefferson SchemmerBrazilAnna Fali NEGOTIATION
Leon OldroydIndiaOnyama Limba RENEWAL
Costa DilliardArgentinaXuxue Feng NEW
Mayumi KolmetzCanadaStephen Shaw QUALIFIED
Jones VocelkaFranceAnna Fali QUALIFIED
Alejandro PerinIndiaStephen Shaw PROPOSAL
Jefferson SchemmerSpainIvan Magalhaes RENEWAL
Morrow RutaSpainIoni Bowcher QUALIFIED
Aika InouyeItalyIoni Bowcher PROPOSAL
David DarakjyAustraliaXuxue Feng PROPOSAL
Francesco ShinkoSpainStephen Shaw NEGOTIATION
Jeanfrancois VenereBrazilAnna Fali UNQUALIFIED
Johnson SergiFranceAsiya Javayant NEGOTIATION
Antonio CaudyCanadaBernardo Dominic NEW
Murillo MaletSpainAnna Fali UNQUALIFIED
Claire TollnerCanadaIvan Magalhaes NEGOTIATION
Octavia MaletCanadaBernardo Dominic PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Chavez BriddickRussiaOnyama Limba NEW
Juan WieserItalyStephen Shaw QUALIFIED
Adams MorascaIndiaOnyama Limba NEGOTIATION
Silvio SlusarskiJapanAsiya Javayant PROPOSAL
Francesco ShinkoAustraliaOnyama Limba UNQUALIFIED
Juan WieserFranceBernardo Dominic NEW
Faith GillianGermanyOnyama Limba PROPOSAL
Claire TollnerBrazilAsiya Javayant QUALIFIED
Maisha RulapaughRussiaOnyama Limba NEGOTIATION
Tony FollerUnited KingdomAnna Fali UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Leon OldroydAustralia2025-06-05Chanay, Jeffrey A Esq QUALIFIED14Amy Elsner
1001Silvio SlusarskiJapan2025-05-28Chemel, James L Cpa QUALIFIED34Elwin Sharvill
1002Aika InouyeGermany2025-05-29Chapman, Ross E Esq UNQUALIFIED95Ioni Bowcher
1003Sinclair WaycottUnited Kingdom2025-06-09Commercial Press NEGOTIATION72Bernardo Dominic
1004Mujtaba NickaAustralia2025-06-19Commercial Press RENEWAL79Amy Elsner
1005Silvio SlusarskiAustralia2025-06-11Buckley Miller Wright UNQUALIFIED69Amy Elsner
1006Ricardo GauchoRussia2025-06-12Chemel, James L Cpa UNQUALIFIED25Ioni Bowcher
1007Rodrigues CampainItaly2025-06-04Truhlar And Truhlar Attys QUALIFIED55Onyama Limba
1008Greenwood BologniaSpain2025-06-22Feiner Bros QUALIFIED1Amy Elsner
1009Kaitlin OstroskyBrazil2025-06-24Benton, John B Jr PROPOSAL7Xuxue Feng
1010Leja CaldareraFrance2025-06-11Chapman, Ross E Esq UNQUALIFIED31Xuxue Feng
1011Stacey MacleadFrance2025-05-31Feiner Bros PROPOSAL85Stephen Shaw
1012Aditya KuskoCanada2025-06-08Feltz Printing Service RENEWAL66Amy Elsner
1013Faith GillianUnited Kingdom2025-06-21Chanay, Jeffrey A Esq RENEWAL72Onyama Limba
1014Murillo MaletIndia2025-06-03Feltz Printing Service NEW7Amy Elsner
1015Nicolas IturbideRussia2025-06-19Chemel, James L Cpa PROPOSAL82Ivan Magalhaes
1016Jennifer AmigonRussia2025-05-28Chanay, Jeffrey A Esq NEGOTIATION21Amy Elsner
1017Faith GillianSpain2025-06-05Commercial Press PROPOSAL48Bernardo Dominic
1018Nicolas IturbideItaly2025-06-01Chemel, James L Cpa NEW58Amy Elsner
1019Antonio CaudyUnited Kingdom2025-06-05Morlong Associates UNQUALIFIED30Ivan Magalhaes
1020Arvin AlbaresAustralia2025-05-29Dorl, James J Esq UNQUALIFIED48Amy Elsner
1021Clifford RimGermany2025-06-07Feiner Bros RENEWAL40Ivan Magalhaes
1022Juan WieserUnited Kingdom2025-06-10Morlong Associates PROPOSAL44Xuxue Feng
1023Murillo MaletGermany2025-06-25Rousseaux, Michael Esq RENEWAL27Xuxue Feng
1024Mayumi KolmetzArgentina2025-06-13Rousseaux, Michael Esq NEW89Ivan Magalhaes
1025Antonio CaudyUnited Kingdom2025-06-16Chanay, Jeffrey A Esq RENEWAL36Asiya Javayant
1026Salvatore StockhamUnited Kingdom2025-06-02Benton, John B Jr NEGOTIATION58Amy Elsner
1027Sinclair WaycottBrazil2025-06-16Printing Dimensions QUALIFIED63Anna Fali
1028Francesco ShinkoJapan2025-06-26Benton, John B Jr RENEWAL14Asiya Javayant
1029Izzy GarufiGermany2025-06-23Chemel, James L Cpa RENEWAL3Xuxue Feng
1030Tony FollerItaly2025-06-19Morlong Associates QUALIFIED1Ioni Bowcher
1031Ricardo GauchoUnited Kingdom2025-06-19Feiner Bros NEGOTIATION12Asiya Javayant
1032Maria MarrierArgentina2025-05-31Commercial Press RENEWAL91Amy Elsner
1033Greenwood BologniaGermany2025-05-29Feiner Bros PROPOSAL79Xuxue Feng
1034Leon OldroydBrazil2025-06-15Rousseaux, Michael Esq UNQUALIFIED34Bernardo Dominic
1035Tony FollerGermany2025-05-28Benton, John B Jr NEW86Ivan Magalhaes
1036Munro FerenczJapan2025-06-12Chanay, Jeffrey A Esq PROPOSAL66Xuxue Feng
1037Sinclair WaycottSpain2025-06-06Buckley Miller Wright PROPOSAL45Stephen Shaw
1038Smith GlickItaly2025-05-29Feltz Printing Service UNQUALIFIED81Xuxue Feng
1039Greenwood BologniaFrance2025-06-09Morlong Associates NEW78Bernardo Dominic
1040Cody SaylorsFrance2025-06-24Feltz Printing Service QUALIFIED39Amy Elsner
1041Clifford RimBrazil2025-06-07Printing Dimensions NEGOTIATION44Ioni Bowcher
1042Kadeem FlosiItaly2025-06-18Feltz Printing Service NEGOTIATION43Ivan Magalhaes
1043Jones VocelkaJapan2025-06-16Chapman, Ross E Esq NEW47Bernardo Dominic
1044Munro FerenczRussia2025-06-09King, Christopher A Esq QUALIFIED43Stephen Shaw
1045Mujtaba NickaAustralia2025-06-11Feiner Bros UNQUALIFIED50Asiya Javayant
1046Costa DilliardBrazil2025-06-16Dorl, James J Esq UNQUALIFIED61Anna Fali
1047Kadeem FlosiRussia2025-06-26Rangoni Of Florence UNQUALIFIED67Bernardo Dominic
1048Jeanfrancois VenereBrazil2025-06-04Morlong Associates NEW4Xuxue Feng
1049Juan WieserRussia2025-06-26Benton, John B Jr PROPOSAL24Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Octavia MaletItalyElwin Sharvill PROPOSAL
Johnson SergiCanadaOnyama Limba NEGOTIATION
Salvatore StockhamAustraliaBernardo Dominic PROPOSAL
Alejandro PerinBrazilIvan Magalhaes UNQUALIFIED
Morrow RutaSpainBernardo Dominic NEW
Arvin AlbaresBrazilAmy Elsner RENEWAL
Mayumi KolmetzCanadaOnyama Limba RENEWAL
Rodrigues CampainAustraliaElwin Sharvill RENEWAL
Claire TollnerUnited KingdomElwin Sharvill PROPOSAL
Faith GillianJapanElwin Sharvill UNQUALIFIED
Aika InouyeBrazilAsiya Javayant QUALIFIED
Stacey MacleadIndiaOnyama Limba UNQUALIFIED
Nicolas IturbideCanadaAnna Fali QUALIFIED
Maria MarrierRussiaIvan Magalhaes RENEWAL
Jennifer AmigonSpainXuxue Feng NEGOTIATION
Leja CaldareraItalyAnna Fali NEW
Juan WieserItalyIvan Magalhaes NEW
Aruna FigeroaJapanBernardo Dominic RENEWAL
Darci PoquetteAustraliaIoni Bowcher NEGOTIATION
Emily WhobreyUnited KingdomXuxue Feng NEGOTIATION
Izzy GarufiUnited KingdomElwin Sharvill PROPOSAL
Octavia MaletIndiaIoni Bowcher QUALIFIED
Maria MarrierUnited KingdomBernardo Dominic NEGOTIATION
Antonio CaudyGermanyIvan Magalhaes UNQUALIFIED
Deepesh ChuiUnited KingdomAnna Fali UNQUALIFIED
Chavez BriddickCanadaAnna Fali UNQUALIFIED
Francesco ShinkoIndiaIoni Bowcher QUALIFIED
Arvin AlbaresArgentinaXuxue Feng RENEWAL
Nicolas IturbideJapanElwin Sharvill RENEWAL
Emily WhobreyAustraliaElwin Sharvill NEW
Salvatore StockhamIndiaElwin Sharvill PROPOSAL
Munro FerenczUnited KingdomStephen Shaw PROPOSAL
Julie StensethUnited KingdomAmy Elsner NEW
Adams MorascaAustraliaBernardo Dominic NEW
Leon OldroydArgentinaXuxue Feng NEGOTIATION
Clifford RimSpainIoni Bowcher QUALIFIED
Costa DilliardGermanyIvan Magalhaes NEW
Johnson SergiFranceAnna Fali NEW
Alejandro PerinIndiaBernardo Dominic RENEWAL
Mayumi KolmetzSpainBernardo Dominic PROPOSAL
Greenwood BologniaArgentinaElwin Sharvill PROPOSAL
Morrow RutaUnited KingdomIoni Bowcher UNQUALIFIED
Chavez BriddickItalyAnna Fali NEW
Morrow RutaBrazilElwin Sharvill NEGOTIATION
Misaki RoysterRussiaBernardo Dominic NEGOTIATION
Juan WieserGermanyElwin Sharvill UNQUALIFIED
Aika InouyeSpainAnna Fali PROPOSAL
Francesco ShinkoItalyAmy Elsner NEGOTIATION
Nicolas IturbideAustraliaAmy Elsner UNQUALIFIED
Arvin AlbaresUnited KingdomOnyama Limba UNQUALIFIED
Frozen Columns
Name
Jeanfrancois Venere
Jeanfrancois Venere
Darci Poquette
Ivar Paprocki
Jefferson Schemmer
Chavez Briddick
Jones Vocelka
Kaitlin Ostrosky
Jeanfrancois Venere
Tony Foller
Leja Caldarera
Cody Saylors
Mayumi Kolmetz
Greenwood Bolognia
Alejandro Perin
Smith Glick
Smith Glick
Arvin Albares
Izzy Garufi
Clifford Rim
Mujtaba Nicka
Octavia Malet
Maria Marrier
Isabel Bowley
Mayumi Kolmetz
Maria Marrier
Tony Foller
Morrow Ruta
Maisha Rulapaugh
Misaki Royster
Salvatore Stockham
Deepesh Chui
Deepesh Chui
Emily Whobrey
Arvin Albares
Murillo Malet
Jeanfrancois Venere
Faith Gillian
Chavez Briddick
Arvin Albares
Julie Stenseth
Octavia Malet
Aika Inouye
Ricardo Gaucho
Claire Tollner
Jones Vocelka
Clifford Rim
Morrow Ruta
Ivar Paprocki
Octavia Malet
IdCountryDate
1000Germany2025-05-29
1001Brazil2025-06-07
1002Spain2025-05-28
1003France2025-06-04
1004Italy2025-06-07
1005Russia2025-06-26
1006Germany2025-06-17
1007Australia2025-06-18
1008Argentina2025-06-13
1009Spain2025-06-01
1010Spain2025-06-09
1011Brazil2025-06-07
1012Germany2025-06-07
1013France2025-06-08
1014India2025-06-08
1015Australia2025-06-17
1016Argentina2025-05-29
1017Brazil2025-06-13
1018Italy2025-05-29
1019France2025-05-28
1020Argentina2025-06-26
1021Japan2025-06-04
1022Canada2025-06-09
1023Canada2025-06-26
1024Spain2025-06-05
1025Japan2025-06-11
1026Germany2025-05-30
1027United Kingdom2025-06-02
1028Brazil2025-06-09
1029Australia2025-05-28
1030Canada2025-06-03
1031Russia2025-06-13
1032Spain2025-06-24
1033Russia2025-05-28
1034India2025-06-23
1035United Kingdom2025-06-10
1036United Kingdom2025-06-19
1037India2025-06-26
1038France2025-06-04
1039Germany2025-06-10
1040Brazil2025-06-12
1041Russia2025-06-18
1042Japan2025-05-31
1043Canada2025-06-02
1044Germany2025-06-14
1045France2025-06-06
1046Australia2025-06-10
1047Argentina2025-06-09
1048India2025-06-14
1049Canada2025-06-09

On-Demand Data

NameIdCountryDate
Arvin Albares1000Argentina2025-06-06
Rodrigues Campain1001Brazil2025-06-19
Mujtaba Nicka1002Spain2025-05-31
Claire Tollner1003France2025-06-14
Leon Oldroyd1004India2025-06-12
Octavia Malet1005Italy2025-06-14
Darci Poquette1006United Kingdom2025-05-29
Mujtaba Nicka1007Japan2025-06-19
Johnson Sergi1008Argentina2025-06-03
Salvatore Stockham1009Canada2025-06-08
Francesco Shinko1010Spain2025-05-29
Maria Marrier1011Canada2025-06-09
Jefferson Schemmer1012Brazil2025-06-04
Jones Vocelka1013Russia2025-06-18
Jones Vocelka1014Russia2025-06-09
Greenwood Bolognia1015Russia2025-05-29
Ricardo Gaucho1016Argentina2025-06-20
Salvatore Stockham1017Brazil2025-06-25
Jones Vocelka1018Spain2025-06-04
Adams Morasca1019Argentina2025-06-02
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Maisha RulapaughJapanAsiya Javayant RENEWAL
Kadeem FlosiItalyXuxue Feng QUALIFIED
Greenwood BologniaItalyAsiya Javayant QUALIFIED
Wickens NestleBrazilBernardo Dominic RENEWAL
Leja CaldareraUnited KingdomIoni Bowcher NEW
Ivar PaprockiItalyAmy Elsner NEW
Isabel BowleySpainXuxue Feng NEW
Stacey MacleadRussiaBernardo Dominic QUALIFIED
Johnson SergiRussiaBernardo Dominic PROPOSAL
Leja CaldareraAustraliaXuxue Feng UNQUALIFIED
Jennifer AmigonIndiaBernardo Dominic UNQUALIFIED
Isabel BowleyGermanyBernardo Dominic UNQUALIFIED
Kadeem FlosiArgentinaAmy Elsner QUALIFIED
Juan WieserUnited KingdomBernardo Dominic UNQUALIFIED
Leja CaldareraUnited KingdomAnna Fali QUALIFIED
Maria MarrierBrazilAsiya Javayant UNQUALIFIED
Cody SaylorsBrazilXuxue Feng QUALIFIED
Darci PoquetteItalyElwin Sharvill UNQUALIFIED
James ButtFranceAnna Fali NEGOTIATION
Claire TollnerAustraliaBernardo Dominic QUALIFIED
Johnson SergiSpainElwin Sharvill QUALIFIED
David DarakjyItalyAnna Fali RENEWAL
Murillo MaletRussiaIvan Magalhaes UNQUALIFIED
Faith GillianRussiaAmy Elsner PROPOSAL
Isabel BowleyCanadaAsiya Javayant PROPOSAL
Ricardo GauchoSpainElwin Sharvill QUALIFIED
Francesco ShinkoItalyAnna Fali UNQUALIFIED
Aruna FigeroaBrazilAmy Elsner NEW
Arvin AlbaresAustraliaAsiya Javayant UNQUALIFIED
Julie StensethItalyAnna Fali PROPOSAL
Alejandro PerinIndiaStephen Shaw NEW
Morrow RutaBrazilXuxue Feng RENEWAL
Smith GlickJapanIvan Magalhaes NEW
Maisha RulapaughSpainBernardo Dominic NEW
Faith GillianCanadaStephen Shaw RENEWAL
Antonio CaudyUnited KingdomBernardo Dominic UNQUALIFIED
Arvin AlbaresAustraliaElwin Sharvill NEW
Smith GlickFranceAmy Elsner RENEWAL
Rodrigues CampainCanadaElwin Sharvill UNQUALIFIED
Rodrigues CampainRussiaElwin 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>