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
Darci PoquetteGermanyBernardo Dominic QUALIFIED
Stacey MacleadAustraliaAsiya Javayant NEW
Stacey MacleadRussiaBernardo Dominic QUALIFIED
Jefferson SchemmerUnited KingdomElwin Sharvill QUALIFIED
Aruna FigeroaIndiaElwin Sharvill QUALIFIED
Octavia MaletItalyIvan Magalhaes NEGOTIATION
Greenwood BologniaItalyAnna Fali PROPOSAL
Rodrigues CampainRussiaXuxue Feng QUALIFIED
Alejandro PerinItalyElwin Sharvill PROPOSAL
Ricardo GauchoSpainStephen Shaw PROPOSAL
Leja CaldareraFranceAnna Fali NEW
Aika InouyeFranceStephen Shaw PROPOSAL
Stacey MacleadBrazilAsiya Javayant RENEWAL
Greenwood BologniaArgentinaIvan Magalhaes RENEWAL
Smith GlickJapanOnyama Limba PROPOSAL
Cody SaylorsCanadaAmy Elsner QUALIFIED
Ashley DoeJapanAsiya Javayant NEW
Maisha RulapaughIndiaIoni Bowcher RENEWAL
Adams MorascaJapanBernardo Dominic NEW
Misaki RoysterArgentinaIoni Bowcher NEGOTIATION
Murillo MaletIndiaBernardo Dominic RENEWAL
Stacey MacleadUnited KingdomAsiya Javayant PROPOSAL
Leja CaldareraBrazilElwin Sharvill NEGOTIATION
Ashley DoeGermanyAnna Fali UNQUALIFIED
Salvatore StockhamArgentinaAmy Elsner RENEWAL
Mujtaba NickaArgentinaBernardo Dominic NEGOTIATION
Juan WieserSpainXuxue Feng QUALIFIED
Costa DilliardJapanXuxue Feng QUALIFIED
Leon OldroydSpainOnyama Limba QUALIFIED
Murillo MaletJapanXuxue Feng NEGOTIATION
Francesco ShinkoItalyIvan Magalhaes NEGOTIATION
Arvin AlbaresAustraliaBernardo Dominic QUALIFIED
Costa DilliardSpainElwin Sharvill NEW
Kaitlin OstroskyUnited KingdomIoni Bowcher NEW
Munro FerenczAustraliaElwin Sharvill NEGOTIATION
Misaki RoysterAustraliaAnna Fali NEGOTIATION
Greenwood BologniaCanadaAnna Fali UNQUALIFIED
Tony FollerItalyIvan Magalhaes NEGOTIATION
Clifford RimGermanyIoni Bowcher UNQUALIFIED
Alejandro PerinRussiaOnyama Limba RENEWAL
Jeanfrancois VenereBrazilBernardo Dominic QUALIFIED
Kadeem FlosiItalyXuxue Feng NEW
Darci PoquetteGermanyAnna Fali NEGOTIATION
Arvin AlbaresUnited KingdomOnyama Limba NEW
David DarakjyAustraliaAnna Fali NEW
Jones VocelkaGermanyAnna Fali PROPOSAL
Jefferson SchemmerArgentinaBernardo Dominic NEW
Costa DilliardFranceXuxue Feng RENEWAL
Juan WieserAustraliaOnyama Limba QUALIFIED
Tony FollerCanadaBernardo Dominic NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Nicolas IturbideUnited KingdomAmy Elsner PROPOSAL
Misaki RoysterUnited KingdomAmy Elsner NEGOTIATION
Wickens NestleIndiaIvan Magalhaes NEGOTIATION
Julie StensethArgentinaAmy Elsner NEGOTIATION
Greenwood BologniaItalyStephen Shaw RENEWAL
Stacey MacleadSpainIoni Bowcher RENEWAL
Jefferson SchemmerArgentinaBernardo Dominic UNQUALIFIED
Alejandro PerinItalyAmy Elsner UNQUALIFIED
Murillo MaletBrazilStephen Shaw UNQUALIFIED
Sinclair WaycottIndiaXuxue Feng NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Mayumi KolmetzBrazil2026-04-10Chanay, Jeffrey A Esq NEGOTIATION71Bernardo Dominic
1001Kadeem FlosiAustralia2026-04-17Truhlar And Truhlar Attys PROPOSAL60Stephen Shaw
1002David DarakjySpain2026-04-05Truhlar And Truhlar Attys NEW40Xuxue Feng
1003Clifford RimArgentina2026-04-18Rousseaux, Michael Esq NEGOTIATION2Onyama Limba
1004Jones VocelkaItaly2026-04-20Feiner Bros NEW29Stephen Shaw
1005Faith GillianUnited Kingdom2026-04-06Rousseaux, Michael Esq PROPOSAL85Elwin Sharvill
1006Leja CaldareraUnited Kingdom2026-04-17Morlong Associates NEGOTIATION13Bernardo Dominic
1007Antonio CaudyRussia2026-04-18Dorl, James J Esq QUALIFIED25Xuxue Feng
1008Maisha RulapaughCanada2026-04-12Chapman, Ross E Esq NEW4Ioni Bowcher
1009Tony FollerSpain2026-04-07Buckley Miller Wright UNQUALIFIED99Ivan Magalhaes
1010Costa DilliardRussia2026-04-28Printing Dimensions RENEWAL66Ivan Magalhaes
1011Stacey MacleadIndia2026-04-28Printing Dimensions NEGOTIATION89Stephen Shaw
1012Cody SaylorsBrazil2026-04-18Dorl, James J Esq UNQUALIFIED82Ioni Bowcher
1013Ashley DoeBrazil2026-04-30Rangoni Of Florence UNQUALIFIED36Asiya Javayant
1014Wickens NestleBrazil2026-04-19Truhlar And Truhlar Attys NEGOTIATION38Amy Elsner
1015Clifford RimRussia2026-04-25Truhlar And Truhlar Attys NEW67Xuxue Feng
1016Johnson SergiArgentina2026-04-05Rangoni Of Florence NEW6Ioni Bowcher
1017Jones VocelkaIndia2026-04-17Feltz Printing Service QUALIFIED22Amy Elsner
1018Mayumi KolmetzGermany2026-04-13Truhlar And Truhlar Attys UNQUALIFIED0Elwin Sharvill
1019Ricardo GauchoRussia2026-04-22Feltz Printing Service NEGOTIATION39Elwin Sharvill
1020Greenwood BologniaBrazil2026-04-14Benton, John B Jr QUALIFIED30Asiya Javayant
1021Cody SaylorsAustralia2026-04-22Truhlar And Truhlar Attys NEGOTIATION95Elwin Sharvill
1022Maisha RulapaughArgentina2026-04-22Dorl, James J Esq NEGOTIATION17Ivan Magalhaes
1023Leon OldroydGermany2026-04-23Chapman, Ross E Esq UNQUALIFIED30Stephen Shaw
1024Aruna FigeroaBrazil2026-04-13Printing Dimensions UNQUALIFIED44Xuxue Feng
1025Clifford RimBrazil2026-04-19Chemel, James L Cpa QUALIFIED82Ioni Bowcher
1026Maria MarrierRussia2026-04-08Chapman, Ross E Esq UNQUALIFIED43Asiya Javayant
1027Jones VocelkaBrazil2026-04-21Buckley Miller Wright NEGOTIATION83Stephen Shaw
1028Faith GillianArgentina2026-04-08Printing Dimensions QUALIFIED72Ivan Magalhaes
1029Maisha RulapaughAustralia2026-04-10Chanay, Jeffrey A Esq PROPOSAL61Elwin Sharvill
1030Juan WieserRussia2026-05-03Commercial Press RENEWAL90Ioni Bowcher
1031Misaki RoysterSpain2026-04-18Chapman, Ross E Esq QUALIFIED41Onyama Limba
1032Greenwood BologniaAustralia2026-04-27Feltz Printing Service NEGOTIATION73Xuxue Feng
1033Mayumi KolmetzGermany2026-04-07Feltz Printing Service QUALIFIED27Elwin Sharvill
1034Jones VocelkaGermany2026-04-08Commercial Press QUALIFIED28Bernardo Dominic
1035Kaitlin OstroskyAustralia2026-04-05Benton, John B Jr NEW94Onyama Limba
1036David DarakjyFrance2026-04-11Morlong Associates UNQUALIFIED13Elwin Sharvill
1037Darci PoquetteItaly2026-04-15Feltz Printing Service UNQUALIFIED31Stephen Shaw
1038Nicolas IturbideFrance2026-04-27King, Christopher A Esq NEW22Bernardo Dominic
1039James ButtSpain2026-04-16Feltz Printing Service PROPOSAL70Onyama Limba
1040Adams MorascaArgentina2026-04-04Feltz Printing Service PROPOSAL96Asiya Javayant
1041Rodrigues CampainSpain2026-04-05Feltz Printing Service RENEWAL2Ivan Magalhaes
1042Nicolas IturbideFrance2026-05-01Buckley Miller Wright NEW64Asiya Javayant
1043Darci PoquetteIndia2026-04-14Rangoni Of Florence NEGOTIATION65Ivan Magalhaes
1044Maisha RulapaughFrance2026-04-10Commercial Press NEGOTIATION84Stephen Shaw
1045Octavia MaletCanada2026-04-20King, Christopher A Esq NEW81Ioni Bowcher
1046Faith GillianUnited Kingdom2026-04-11Rousseaux, Michael Esq NEGOTIATION16Asiya Javayant
1047Maria MarrierArgentina2026-04-09King, Christopher A Esq QUALIFIED5Bernardo Dominic
1048Kadeem FlosiGermany2026-04-30Rangoni Of Florence UNQUALIFIED86Anna Fali
1049Ashley DoeBrazil2026-04-29King, Christopher A Esq RENEWAL89Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Alejandro PerinUnited KingdomIoni Bowcher NEGOTIATION
Salvatore StockhamBrazilElwin Sharvill UNQUALIFIED
Ashley DoeIndiaAmy Elsner PROPOSAL
Deepesh ChuiJapanAmy Elsner PROPOSAL
Johnson SergiJapanXuxue Feng UNQUALIFIED
Isabel BowleyArgentinaOnyama Limba NEGOTIATION
Octavia MaletFranceXuxue Feng QUALIFIED
Darci PoquetteFranceAnna Fali QUALIFIED
Adams MorascaArgentinaAnna Fali QUALIFIED
Jennifer AmigonAustraliaIvan Magalhaes RENEWAL
Cody SaylorsFranceXuxue Feng PROPOSAL
Izzy GarufiFranceBernardo Dominic UNQUALIFIED
Clifford RimIndiaBernardo Dominic QUALIFIED
Munro FerenczCanadaIvan Magalhaes RENEWAL
Greenwood BologniaIndiaIvan Magalhaes NEGOTIATION
Nicolas IturbideRussiaElwin Sharvill PROPOSAL
Costa DilliardBrazilOnyama Limba RENEWAL
Ivar PaprockiCanadaIvan Magalhaes QUALIFIED
Cody SaylorsItalyIvan Magalhaes QUALIFIED
Darci PoquetteUnited KingdomAnna Fali NEGOTIATION
Jones VocelkaArgentinaAmy Elsner RENEWAL
David DarakjySpainOnyama Limba NEW
Smith GlickUnited KingdomAmy Elsner UNQUALIFIED
David DarakjySpainAnna Fali NEGOTIATION
Jeanfrancois VenereJapanAsiya Javayant PROPOSAL
Mujtaba NickaAustraliaIoni Bowcher NEW
James ButtGermanyAmy Elsner RENEWAL
Ivar PaprockiItalyXuxue Feng RENEWAL
Jones VocelkaUnited KingdomBernardo Dominic NEW
Greenwood BologniaArgentinaAnna Fali UNQUALIFIED
Maisha RulapaughUnited KingdomAsiya Javayant NEW
Nicolas IturbideUnited KingdomOnyama Limba PROPOSAL
Clifford RimItalyStephen Shaw UNQUALIFIED
Wickens NestleBrazilXuxue Feng RENEWAL
Johnson SergiJapanBernardo Dominic NEW
Costa DilliardUnited KingdomIvan Magalhaes UNQUALIFIED
Greenwood BologniaJapanIvan Magalhaes QUALIFIED
Octavia MaletFranceAmy Elsner RENEWAL
Isabel BowleySpainIvan Magalhaes NEGOTIATION
Claire TollnerIndiaStephen Shaw RENEWAL
Darci PoquetteArgentinaAsiya Javayant QUALIFIED
Jones VocelkaSpainElwin Sharvill NEW
Misaki RoysterAustraliaIoni Bowcher QUALIFIED
Nicolas IturbideCanadaBernardo Dominic RENEWAL
Kaitlin OstroskyJapanAmy Elsner NEGOTIATION
Francesco ShinkoBrazilBernardo Dominic PROPOSAL
Ivar PaprockiSpainAmy Elsner QUALIFIED
Emily WhobreyItalyBernardo Dominic RENEWAL
Sinclair WaycottSpainXuxue Feng RENEWAL
Jennifer AmigonItalyIoni Bowcher PROPOSAL
Frozen Columns
Name
Maria Marrier
Aditya Kusko
Johnson Sergi
Salvatore Stockham
Claire Tollner
Costa Dilliard
Rodrigues Campain
Ricardo Gaucho
Faith Gillian
Aditya Kusko
Jefferson Schemmer
Aruna Figeroa
Silvio Slusarski
Leon Oldroyd
Jeanfrancois Venere
Ricardo Gaucho
Clifford Rim
Greenwood Bolognia
Jeanfrancois Venere
Silvio Slusarski
Smith Glick
Aditya Kusko
Greenwood Bolognia
Emily Whobrey
Julie Stenseth
Jones Vocelka
Darci Poquette
Maria Marrier
Cody Saylors
Ricardo Gaucho
Wickens Nestle
Aika Inouye
Octavia Malet
Ricardo Gaucho
Clifford Rim
Alejandro Perin
Chavez Briddick
Munro Ferencz
Maria Marrier
Julie Stenseth
Octavia Malet
Cody Saylors
Stacey Maclead
Ashley Doe
Maria Marrier
Arvin Albares
Alejandro Perin
Silvio Slusarski
Stacey Maclead
Smith Glick
IdCountryDate
1000United Kingdom2026-04-04
1001India2026-04-24
1002United Kingdom2026-04-17
1003India2026-04-05
1004Russia2026-04-27
1005India2026-04-13
1006France2026-04-14
1007Italy2026-04-11
1008Germany2026-04-30
1009Canada2026-04-28
1010France2026-04-23
1011United Kingdom2026-04-09
1012Canada2026-04-13
1013Japan2026-04-16
1014Japan2026-04-10
1015Canada2026-04-06
1016Brazil2026-04-07
1017Germany2026-05-01
1018Spain2026-04-04
1019United Kingdom2026-04-16
1020United Kingdom2026-04-10
1021Argentina2026-04-05
1022France2026-04-26
1023Brazil2026-04-16
1024Russia2026-04-29
1025Spain2026-04-14
1026Australia2026-04-07
1027Russia2026-04-18
1028Italy2026-05-02
1029Italy2026-04-24
1030Australia2026-04-06
1031India2026-04-24
1032Spain2026-04-16
1033Germany2026-04-23
1034France2026-04-29
1035Canada2026-04-25
1036Argentina2026-04-10
1037Spain2026-04-27
1038India2026-04-24
1039Germany2026-04-15
1040Brazil2026-04-26
1041Canada2026-04-25
1042Germany2026-05-02
1043Australia2026-04-07
1044Argentina2026-04-09
1045Canada2026-04-22
1046Australia2026-04-09
1047Germany2026-04-12
1048Russia2026-04-21
1049Germany2026-04-25

On-Demand Data

NameIdCountryDate
Jeanfrancois Venere1000Canada2026-04-04
Jefferson Schemmer1001Australia2026-05-01
Adams Morasca1002Japan2026-04-07
Jefferson Schemmer1003Argentina2026-04-23
Chavez Briddick1004Argentina2026-04-11
Clifford Rim1005United Kingdom2026-04-22
David Darakjy1006Spain2026-04-16
Claire Tollner1007United Kingdom2026-04-07
Ricardo Gaucho1008Italy2026-04-25
Greenwood Bolognia1009Italy2026-04-17
Leon Oldroyd1010Italy2026-04-08
Aika Inouye1011Russia2026-04-24
Faith Gillian1012France2026-04-29
Antonio Caudy1013Russia2026-04-26
Isabel Bowley1014Canada2026-04-12
Murillo Malet1015Russia2026-05-02
Jones Vocelka1016Brazil2026-04-13
Francesco Shinko1017India2026-04-13
Sinclair Waycott1018United Kingdom2026-04-15
Jennifer Amigon1019Australia2026-04-15
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Ivar PaprockiItalyIoni Bowcher UNQUALIFIED
Morrow RutaCanadaAnna Fali PROPOSAL
Kaitlin OstroskyJapanAnna Fali NEGOTIATION
Munro FerenczSpainElwin Sharvill QUALIFIED
Leon OldroydArgentinaXuxue Feng NEGOTIATION
Jennifer AmigonArgentinaAmy Elsner PROPOSAL
Maria MarrierArgentinaIvan Magalhaes UNQUALIFIED
James ButtRussiaIvan Magalhaes RENEWAL
Darci PoquetteArgentinaXuxue Feng RENEWAL
Aditya KuskoJapanIvan Magalhaes NEGOTIATION
Julie StensethSpainStephen Shaw PROPOSAL
Ivar PaprockiItalyIoni Bowcher PROPOSAL
Jeanfrancois VenereGermanyAnna Fali NEGOTIATION
Deepesh ChuiRussiaStephen Shaw QUALIFIED
Mujtaba NickaArgentinaIvan Magalhaes PROPOSAL
Kadeem FlosiSpainBernardo Dominic UNQUALIFIED
Adams MorascaItalyIvan Magalhaes PROPOSAL
Julie StensethItalyStephen Shaw RENEWAL
Kadeem FlosiJapanBernardo Dominic NEGOTIATION
Jefferson SchemmerFranceStephen Shaw NEGOTIATION
Wickens NestleIndiaXuxue Feng QUALIFIED
Maisha RulapaughFranceXuxue Feng UNQUALIFIED
Kadeem FlosiCanadaStephen Shaw RENEWAL
Francesco ShinkoItalyStephen Shaw NEW
Ivar PaprockiCanadaStephen Shaw NEW
Maria MarrierBrazilAnna Fali PROPOSAL
David DarakjyFranceOnyama Limba NEGOTIATION
Emily WhobreyRussiaIvan Magalhaes NEW
Stacey MacleadFranceAnna Fali NEGOTIATION
David DarakjyJapanAmy Elsner NEGOTIATION
Jones VocelkaGermanyXuxue Feng NEW
Greenwood BologniaAustraliaBernardo Dominic QUALIFIED
Mayumi KolmetzIndiaBernardo Dominic NEW
Smith GlickFranceXuxue Feng QUALIFIED
Tony FollerCanadaAsiya Javayant UNQUALIFIED
Kadeem FlosiBrazilBernardo Dominic NEW
James ButtSpainXuxue Feng NEW
Clifford RimFranceAsiya Javayant RENEWAL
Greenwood BologniaBrazilAnna Fali RENEWAL
Emily WhobreyRussiaOnyama Limba NEGOTIATION

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