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
Greenwood BologniaIndiaElwin Sharvill RENEWAL
Jones VocelkaIndiaIvan Magalhaes RENEWAL
Adams MorascaSpainBernardo Dominic NEW
Salvatore StockhamRussiaIvan Magalhaes UNQUALIFIED
Aditya KuskoJapanIvan Magalhaes NEW
Antonio CaudyBrazilXuxue Feng QUALIFIED
Munro FerenczArgentinaAmy Elsner NEW
Ashley DoeUnited KingdomIvan Magalhaes PROPOSAL
Aika InouyeRussiaIvan Magalhaes NEW
Faith GillianIndiaIvan Magalhaes PROPOSAL
Misaki RoysterBrazilAmy Elsner UNQUALIFIED
Misaki RoysterSpainAnna Fali RENEWAL
Claire TollnerBrazilOnyama Limba QUALIFIED
Clifford RimSpainBernardo Dominic QUALIFIED
Murillo MaletUnited KingdomElwin Sharvill PROPOSAL
Greenwood BologniaBrazilAnna Fali RENEWAL
Emily WhobreySpainAnna Fali PROPOSAL
Chavez BriddickUnited KingdomOnyama Limba UNQUALIFIED
Nicolas IturbideUnited KingdomAmy Elsner UNQUALIFIED
Wickens NestleSpainElwin Sharvill NEGOTIATION
Stacey MacleadAustraliaElwin Sharvill PROPOSAL
Johnson SergiSpainIoni Bowcher NEGOTIATION
Kaitlin OstroskyIndiaBernardo Dominic RENEWAL
Misaki RoysterSpainXuxue Feng UNQUALIFIED
Adams MorascaSpainElwin Sharvill UNQUALIFIED
Ricardo GauchoGermanyAnna Fali NEGOTIATION
Francesco ShinkoAustraliaIoni Bowcher UNQUALIFIED
James ButtRussiaElwin Sharvill NEGOTIATION
Ivar PaprockiJapanIoni Bowcher UNQUALIFIED
Costa DilliardJapanIvan Magalhaes NEGOTIATION
Morrow RutaArgentinaIoni Bowcher QUALIFIED
Jones VocelkaArgentinaIvan Magalhaes UNQUALIFIED
Sinclair WaycottIndiaAnna Fali UNQUALIFIED
Arvin AlbaresItalyXuxue Feng PROPOSAL
Jefferson SchemmerIndiaAmy Elsner RENEWAL
Mayumi KolmetzBrazilAsiya Javayant RENEWAL
Francesco ShinkoCanadaBernardo Dominic RENEWAL
Greenwood BologniaUnited KingdomOnyama Limba PROPOSAL
Sinclair WaycottGermanyAsiya Javayant QUALIFIED
Jeanfrancois VenereJapanStephen Shaw NEW
Aditya KuskoGermanyAsiya Javayant NEGOTIATION
Emily WhobreyItalyBernardo Dominic UNQUALIFIED
Francesco ShinkoBrazilAmy Elsner NEGOTIATION
Aditya KuskoGermanyXuxue Feng UNQUALIFIED
Kadeem FlosiGermanyIvan Magalhaes RENEWAL
Jones VocelkaGermanyAmy Elsner QUALIFIED
Francesco ShinkoSpainIvan Magalhaes NEGOTIATION
Aika InouyeUnited KingdomIvan Magalhaes PROPOSAL
Ivar PaprockiAustraliaAmy Elsner QUALIFIED
Claire TollnerRussiaStephen Shaw NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Jeanfrancois VenereCanadaAsiya Javayant NEW
David DarakjyAustraliaStephen Shaw UNQUALIFIED
Kadeem FlosiIndiaIoni Bowcher PROPOSAL
Costa DilliardIndiaBernardo Dominic RENEWAL
Jefferson SchemmerBrazilXuxue Feng NEGOTIATION
Francesco ShinkoItalyAmy Elsner QUALIFIED
Juan WieserUnited KingdomOnyama Limba PROPOSAL
Nicolas IturbideGermanyAmy Elsner NEW
Tony FollerCanadaStephen Shaw UNQUALIFIED
Kadeem FlosiSpainAnna Fali RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Faith GillianItaly2025-09-03Rousseaux, Michael Esq NEW30Ioni Bowcher
1001Arvin AlbaresJapan2025-08-28Printing Dimensions PROPOSAL18Amy Elsner
1002Deepesh ChuiGermany2025-09-09King, Christopher A Esq NEGOTIATION19Ivan Magalhaes
1003Faith GillianFrance2025-09-12Feiner Bros QUALIFIED25Ivan Magalhaes
1004Juan WieserJapan2025-08-18King, Christopher A Esq UNQUALIFIED30Amy Elsner
1005Costa DilliardArgentina2025-09-14Buckley Miller Wright RENEWAL87Asiya Javayant
1006Clifford RimCanada2025-09-09Chemel, James L Cpa RENEWAL5Stephen Shaw
1007Isabel BowleyAustralia2025-08-18Morlong Associates NEGOTIATION54Elwin Sharvill
1008Salvatore StockhamBrazil2025-08-18Feiner Bros QUALIFIED45Anna Fali
1009Misaki RoysterItaly2025-08-23Feltz Printing Service UNQUALIFIED36Bernardo Dominic
1010Murillo MaletFrance2025-09-04Commercial Press UNQUALIFIED19Asiya Javayant
1011Sinclair WaycottRussia2025-08-20Rousseaux, Michael Esq UNQUALIFIED91Stephen Shaw
1012Mayumi KolmetzArgentina2025-08-28Chapman, Ross E Esq PROPOSAL98Bernardo Dominic
1013Misaki RoysterJapan2025-08-29Truhlar And Truhlar Attys UNQUALIFIED67Xuxue Feng
1014Aika InouyeGermany2025-08-19Printing Dimensions NEGOTIATION60Anna Fali
1015Nicolas IturbideUnited Kingdom2025-09-15Feltz Printing Service NEW37Anna Fali
1016Isabel BowleyIndia2025-08-26Printing Dimensions QUALIFIED61Asiya Javayant
1017Munro FerenczFrance2025-09-11Rousseaux, Michael Esq NEGOTIATION13Amy Elsner
1018Nicolas IturbideFrance2025-08-23Rousseaux, Michael Esq PROPOSAL61Ivan Magalhaes
1019Isabel BowleyGermany2025-08-31Dorl, James J Esq NEW35Anna Fali
1020Jennifer AmigonBrazil2025-08-18Morlong Associates QUALIFIED32Onyama Limba
1021Adams MorascaGermany2025-09-10Morlong Associates RENEWAL44Stephen Shaw
1022Ashley DoeJapan2025-09-06Buckley Miller Wright NEGOTIATION24Amy Elsner
1023Misaki RoysterRussia2025-08-31Commercial Press NEW23Onyama Limba
1024Francesco ShinkoItaly2025-08-29Chanay, Jeffrey A Esq UNQUALIFIED64Onyama Limba
1025Jennifer AmigonBrazil2025-08-18Morlong Associates PROPOSAL32Asiya Javayant
1026Jennifer AmigonGermany2025-08-23Truhlar And Truhlar Attys QUALIFIED75Ivan Magalhaes
1027James ButtSpain2025-08-28Commercial Press NEW88Elwin Sharvill
1028Kadeem FlosiIndia2025-08-29Dorl, James J Esq RENEWAL46Bernardo Dominic
1029Jefferson SchemmerFrance2025-08-21Commercial Press QUALIFIED37Xuxue Feng
1030Darci PoquetteFrance2025-08-25Dorl, James J Esq UNQUALIFIED17Bernardo Dominic
1031Clifford RimFrance2025-09-03Printing Dimensions NEGOTIATION11Asiya Javayant
1032Jeanfrancois VenereIndia2025-08-24Chapman, Ross E Esq RENEWAL27Anna Fali
1033Smith GlickSpain2025-09-13Feltz Printing Service RENEWAL42Asiya Javayant
1034Greenwood BologniaUnited Kingdom2025-08-21Benton, John B Jr QUALIFIED98Bernardo Dominic
1035Maisha RulapaughArgentina2025-08-22Morlong Associates NEGOTIATION21Amy Elsner
1036Claire TollnerCanada2025-08-30Chemel, James L Cpa QUALIFIED53Ioni Bowcher
1037Jennifer AmigonBrazil2025-09-13Chemel, James L Cpa UNQUALIFIED19Ioni Bowcher
1038Clifford RimGermany2025-08-22King, Christopher A Esq NEGOTIATION77Elwin Sharvill
1039Munro FerenczSpain2025-08-23Feiner Bros RENEWAL98Asiya Javayant
1040Alejandro PerinIndia2025-08-31Feltz Printing Service RENEWAL72Anna Fali
1041Jennifer AmigonBrazil2025-08-22Morlong Associates QUALIFIED34Elwin Sharvill
1042Clifford RimFrance2025-09-12Morlong Associates PROPOSAL66Elwin Sharvill
1043Munro FerenczAustralia2025-08-29Commercial Press PROPOSAL62Onyama Limba
1044Wickens NestleIndia2025-09-02Dorl, James J Esq UNQUALIFIED17Bernardo Dominic
1045Maria MarrierUnited Kingdom2025-08-29Commercial Press QUALIFIED43Elwin Sharvill
1046Darci PoquetteBrazil2025-08-31King, Christopher A Esq UNQUALIFIED14Amy Elsner
1047Mayumi KolmetzJapan2025-09-08Rangoni Of Florence NEGOTIATION14Stephen Shaw
1048Nicolas IturbideGermany2025-09-09Chanay, Jeffrey A Esq NEGOTIATION37Onyama Limba
1049Isabel BowleyFrance2025-09-04Truhlar And Truhlar Attys RENEWAL23Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Greenwood BologniaSpainXuxue Feng UNQUALIFIED
Smith GlickArgentinaBernardo Dominic QUALIFIED
Antonio CaudyJapanAmy Elsner RENEWAL
Emily WhobreyArgentinaElwin Sharvill UNQUALIFIED
Deepesh ChuiRussiaBernardo Dominic NEW
Jeanfrancois VenereArgentinaOnyama Limba PROPOSAL
Octavia MaletUnited KingdomAmy Elsner RENEWAL
Tony FollerJapanOnyama Limba NEW
Deepesh ChuiJapanOnyama Limba NEW
James ButtSpainStephen Shaw PROPOSAL
Jones VocelkaJapanAnna Fali QUALIFIED
Julie StensethFranceOnyama Limba NEGOTIATION
Ashley DoeCanadaIvan Magalhaes UNQUALIFIED
Greenwood BologniaIndiaIvan Magalhaes RENEWAL
Octavia MaletIndiaAmy Elsner RENEWAL
Johnson SergiSpainStephen Shaw PROPOSAL
Julie StensethBrazilBernardo Dominic PROPOSAL
Jones VocelkaUnited KingdomXuxue Feng RENEWAL
Ivar PaprockiGermanyXuxue Feng RENEWAL
Costa DilliardItalyElwin Sharvill NEW
Stacey MacleadArgentinaIoni Bowcher PROPOSAL
Faith GillianItalyIvan Magalhaes NEGOTIATION
Kadeem FlosiItalyIoni Bowcher RENEWAL
Maisha RulapaughIndiaStephen Shaw UNQUALIFIED
Antonio CaudyAustraliaElwin Sharvill NEW
Deepesh ChuiBrazilAnna Fali RENEWAL
Deepesh ChuiJapanIvan Magalhaes PROPOSAL
Aditya KuskoCanadaElwin Sharvill PROPOSAL
Mujtaba NickaUnited KingdomXuxue Feng NEGOTIATION
Ashley DoeCanadaIvan Magalhaes UNQUALIFIED
Salvatore StockhamBrazilAmy Elsner UNQUALIFIED
Claire TollnerFranceIvan Magalhaes UNQUALIFIED
Rodrigues CampainBrazilElwin Sharvill NEW
Smith GlickItalyIvan Magalhaes PROPOSAL
Isabel BowleyGermanyIoni Bowcher QUALIFIED
Jones VocelkaArgentinaXuxue Feng QUALIFIED
Aika InouyeAustraliaAnna Fali RENEWAL
Aika InouyeJapanAsiya Javayant PROPOSAL
Jefferson SchemmerItalyIvan Magalhaes RENEWAL
Stacey MacleadItalyStephen Shaw QUALIFIED
Kadeem FlosiBrazilBernardo Dominic UNQUALIFIED
Ricardo GauchoJapanAnna Fali PROPOSAL
Aika InouyeRussiaOnyama Limba NEGOTIATION
David DarakjyUnited KingdomStephen Shaw PROPOSAL
Aruna FigeroaCanadaAmy Elsner PROPOSAL
Cody SaylorsCanadaBernardo Dominic QUALIFIED
Arvin AlbaresArgentinaAsiya Javayant RENEWAL
Juan WieserFranceStephen Shaw PROPOSAL
Mayumi KolmetzFranceIoni Bowcher QUALIFIED
Smith GlickArgentinaAmy Elsner NEW
Frozen Columns
Name
Francesco Shinko
Johnson Sergi
Aditya Kusko
Julie Stenseth
Greenwood Bolognia
Tony Foller
Costa Dilliard
Arvin Albares
Kaitlin Ostrosky
Stacey Maclead
Jefferson Schemmer
Octavia Malet
Leon Oldroyd
Chavez Briddick
Stacey Maclead
Smith Glick
Costa Dilliard
Leon Oldroyd
Leja Caldarera
Juan Wieser
Jones Vocelka
Arvin Albares
Sinclair Waycott
Morrow Ruta
Ivar Paprocki
Clifford Rim
Aditya Kusko
Alejandro Perin
Smith Glick
Darci Poquette
Smith Glick
Kaitlin Ostrosky
Greenwood Bolognia
Leon Oldroyd
Aditya Kusko
Misaki Royster
Jefferson Schemmer
James Butt
Maisha Rulapaugh
Antonio Caudy
David Darakjy
Misaki Royster
Leon Oldroyd
Chavez Briddick
Izzy Garufi
Aika Inouye
Aruna Figeroa
Claire Tollner
Maisha Rulapaugh
Ashley Doe
IdCountryDate
1000Germany2025-08-21
1001Argentina2025-09-11
1002United Kingdom2025-08-26
1003Australia2025-08-30
1004Japan2025-09-01
1005India2025-09-09
1006Spain2025-08-24
1007Russia2025-09-04
1008Russia2025-08-23
1009Canada2025-08-25
1010Brazil2025-08-24
1011Australia2025-09-15
1012Brazil2025-08-26
1013Argentina2025-09-02
1014Russia2025-08-24
1015Spain2025-09-02
1016Canada2025-08-20
1017Argentina2025-08-23
1018United Kingdom2025-09-06
1019Italy2025-08-30
1020Spain2025-09-05
1021India2025-09-15
1022India2025-09-14
1023Canada2025-09-03
1024Brazil2025-08-21
1025United Kingdom2025-08-29
1026India2025-09-05
1027Russia2025-08-27
1028Italy2025-08-24
1029Japan2025-09-10
1030Germany2025-09-09
1031Germany2025-09-16
1032India2025-09-01
1033Germany2025-09-10
1034Italy2025-08-18
1035India2025-08-18
1036France2025-09-03
1037Canada2025-09-15
1038India2025-08-22
1039Canada2025-08-27
1040Italy2025-09-07
1041Russia2025-08-18
1042Brazil2025-08-23
1043Spain2025-09-04
1044Japan2025-09-02
1045Argentina2025-08-22
1046Spain2025-09-12
1047United Kingdom2025-09-05
1048Canada2025-08-26
1049France2025-09-10

On-Demand Data

NameIdCountryDate
Ashley Doe1000Spain2025-08-26
Jennifer Amigon1001Brazil2025-08-27
Stacey Maclead1002Japan2025-09-04
Salvatore Stockham1003Spain2025-08-28
Ricardo Gaucho1004Argentina2025-08-22
Izzy Garufi1005Spain2025-09-06
Arvin Albares1006Spain2025-09-04
Emily Whobrey1007Australia2025-09-13
Jennifer Amigon1008France2025-09-03
Sinclair Waycott1009Germany2025-08-31
Misaki Royster1010Canada2025-09-01
Stacey Maclead1011France2025-08-28
Clifford Rim1012Italy2025-08-19
Darci Poquette1013Argentina2025-08-18
Darci Poquette1014Australia2025-09-12
Leon Oldroyd1015Australia2025-08-27
Rodrigues Campain1016Brazil2025-08-28
Jones Vocelka1017Japan2025-09-10
Tony Foller1018United Kingdom2025-09-04
Nicolas Iturbide1019France2025-09-13
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Arvin AlbaresItalyXuxue Feng UNQUALIFIED
Adams MorascaGermanyStephen Shaw UNQUALIFIED
Smith GlickFranceAmy Elsner QUALIFIED
Jennifer AmigonRussiaElwin Sharvill PROPOSAL
Munro FerenczCanadaAsiya Javayant PROPOSAL
Murillo MaletUnited KingdomAsiya Javayant QUALIFIED
Francesco ShinkoFranceIvan Magalhaes PROPOSAL
Octavia MaletFranceXuxue Feng QUALIFIED
Kaitlin OstroskyIndiaElwin Sharvill RENEWAL
Nicolas IturbideSpainXuxue Feng NEGOTIATION
Costa DilliardRussiaAsiya Javayant NEGOTIATION
Misaki RoysterJapanIoni Bowcher NEW
Mujtaba NickaBrazilIoni Bowcher NEGOTIATION
Emily WhobreyJapanIvan Magalhaes NEGOTIATION
Maisha RulapaughBrazilElwin Sharvill NEW
Deepesh ChuiIndiaIoni Bowcher RENEWAL
Maria MarrierBrazilXuxue Feng RENEWAL
Antonio CaudyAustraliaOnyama Limba UNQUALIFIED
Jennifer AmigonCanadaXuxue Feng NEGOTIATION
Kadeem FlosiJapanElwin Sharvill QUALIFIED
Tony FollerItalyAsiya Javayant RENEWAL
Isabel BowleyGermanyIoni Bowcher NEW
Mayumi KolmetzSpainOnyama Limba QUALIFIED
Mayumi KolmetzItalyStephen Shaw QUALIFIED
Aruna FigeroaFranceAmy Elsner NEW
Costa DilliardArgentinaIvan Magalhaes NEGOTIATION
Rodrigues CampainCanadaElwin Sharvill RENEWAL
Leon OldroydArgentinaAsiya Javayant RENEWAL
Sinclair WaycottArgentinaIoni Bowcher UNQUALIFIED
Morrow RutaRussiaAmy Elsner UNQUALIFIED
Aditya KuskoJapanAnna Fali NEGOTIATION
Juan WieserBrazilIvan Magalhaes UNQUALIFIED
Ashley DoeCanadaAnna Fali NEW
Emily WhobreyRussiaOnyama Limba UNQUALIFIED
Deepesh ChuiAustraliaBernardo Dominic QUALIFIED
Isabel BowleyArgentinaXuxue Feng RENEWAL
Leja CaldareraIndiaAnna Fali NEGOTIATION
Isabel BowleyJapanElwin Sharvill QUALIFIED
Cody SaylorsFranceIoni Bowcher NEW
Deepesh ChuiUnited KingdomXuxue Feng 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>