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
Faith GillianArgentinaOnyama Limba NEGOTIATION
Costa DilliardAustraliaElwin Sharvill QUALIFIED
Mayumi KolmetzBrazilIvan Magalhaes NEW
Munro FerenczIndiaStephen Shaw QUALIFIED
Costa DilliardUnited KingdomAnna Fali UNQUALIFIED
Julie StensethArgentinaXuxue Feng NEW
Salvatore StockhamUnited KingdomBernardo Dominic QUALIFIED
Chavez BriddickIndiaStephen Shaw NEGOTIATION
Wickens NestleFranceStephen Shaw RENEWAL
Deepesh ChuiSpainAnna Fali PROPOSAL
Greenwood BologniaArgentinaStephen Shaw NEGOTIATION
Jennifer AmigonArgentinaIoni Bowcher PROPOSAL
Mayumi KolmetzSpainIoni Bowcher UNQUALIFIED
Izzy GarufiRussiaBernardo Dominic NEW
Cody SaylorsIndiaAnna Fali PROPOSAL
Clifford RimCanadaIvan Magalhaes RENEWAL
Murillo MaletBrazilAsiya Javayant NEGOTIATION
Misaki RoysterFranceAmy Elsner NEGOTIATION
Nicolas IturbideCanadaStephen Shaw NEGOTIATION
Julie StensethArgentinaIoni Bowcher RENEWAL
Antonio CaudyItalyOnyama Limba UNQUALIFIED
Maria MarrierJapanIvan Magalhaes NEGOTIATION
David DarakjyGermanyAnna Fali NEW
Julie StensethUnited KingdomAnna Fali NEW
Jennifer AmigonSpainElwin Sharvill RENEWAL
Ashley DoeCanadaAnna Fali PROPOSAL
Octavia MaletUnited KingdomIoni Bowcher UNQUALIFIED
Munro FerenczGermanyXuxue Feng PROPOSAL
James ButtJapanStephen Shaw NEW
Smith GlickIndiaElwin Sharvill RENEWAL
Leja CaldareraArgentinaAsiya Javayant PROPOSAL
Faith GillianIndiaOnyama Limba PROPOSAL
Maisha RulapaughJapanAsiya Javayant RENEWAL
Izzy GarufiCanadaElwin Sharvill NEW
Jefferson SchemmerFranceStephen Shaw NEW
Cody SaylorsSpainIoni Bowcher RENEWAL
Adams MorascaIndiaAsiya Javayant UNQUALIFIED
Silvio SlusarskiGermanyAmy Elsner RENEWAL
James ButtAustraliaAmy Elsner RENEWAL
Misaki RoysterBrazilAmy Elsner NEGOTIATION
Deepesh ChuiUnited KingdomAnna Fali NEW
Aruna FigeroaArgentinaBernardo Dominic QUALIFIED
Morrow RutaIndiaAnna Fali QUALIFIED
Francesco ShinkoArgentinaXuxue Feng QUALIFIED
Chavez BriddickBrazilAsiya Javayant RENEWAL
Sinclair WaycottSpainXuxue Feng NEW
Adams MorascaAustraliaOnyama Limba NEGOTIATION
Murillo MaletItalyAnna Fali PROPOSAL
Faith GillianSpainStephen Shaw NEGOTIATION
Leon OldroydUnited KingdomIoni Bowcher RENEWAL
Horizontal
NameCountryRepresentativeStatus
Cody SaylorsArgentinaStephen Shaw UNQUALIFIED
Faith GillianGermanyAnna Fali NEW
Johnson SergiRussiaOnyama Limba PROPOSAL
Claire TollnerFranceAsiya Javayant NEGOTIATION
Johnson SergiCanadaAmy Elsner RENEWAL
David DarakjyItalyXuxue Feng NEGOTIATION
Greenwood BologniaIndiaAsiya Javayant PROPOSAL
Nicolas IturbideItalyBernardo Dominic QUALIFIED
Mujtaba NickaSpainElwin Sharvill PROPOSAL
Izzy GarufiUnited KingdomElwin Sharvill PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Ivar PaprockiJapan2026-05-15Rousseaux, Michael Esq UNQUALIFIED13Anna Fali
1001Smith GlickArgentina2026-05-15Benton, John B Jr PROPOSAL57Ivan Magalhaes
1002Francesco ShinkoAustralia2026-05-06Dorl, James J Esq QUALIFIED48Ioni Bowcher
1003Ricardo GauchoItaly2026-05-06Feltz Printing Service PROPOSAL86Asiya Javayant
1004Sinclair WaycottCanada2026-05-14Buckley Miller Wright NEW23Onyama Limba
1005Aruna FigeroaArgentina2026-05-19Feltz Printing Service QUALIFIED46Stephen Shaw
1006Adams MorascaSpain2026-05-14Dorl, James J Esq PROPOSAL49Amy Elsner
1007Aika InouyeAustralia2026-05-16Feltz Printing Service PROPOSAL55Elwin Sharvill
1008Ivar PaprockiItaly2026-05-14Feltz Printing Service QUALIFIED85Amy Elsner
1009Stacey MacleadAustralia2026-05-17King, Christopher A Esq NEGOTIATION16Asiya Javayant
1010Francesco ShinkoItaly2026-06-01Chapman, Ross E Esq NEW70Xuxue Feng
1011Leon OldroydFrance2026-05-30Commercial Press RENEWAL46Bernardo Dominic
1012Cody SaylorsArgentina2026-06-01Feiner Bros RENEWAL1Ioni Bowcher
1013Aika InouyeIndia2026-05-19Feiner Bros UNQUALIFIED32Onyama Limba
1014Kaitlin OstroskyArgentina2026-05-31Feltz Printing Service UNQUALIFIED46Amy Elsner
1015Jeanfrancois VenereCanada2026-05-11Commercial Press NEW26Ivan Magalhaes
1016Maisha RulapaughSpain2026-05-16King, Christopher A Esq QUALIFIED88Stephen Shaw
1017Aika InouyeIndia2026-05-27Buckley Miller Wright NEGOTIATION90Ioni Bowcher
1018Julie StensethRussia2026-06-02King, Christopher A Esq NEGOTIATION84Onyama Limba
1019Nicolas IturbideBrazil2026-05-16Dorl, James J Esq NEW24Stephen Shaw
1020Mayumi KolmetzSpain2026-05-18Chanay, Jeffrey A Esq QUALIFIED41Anna Fali
1021Mujtaba NickaItaly2026-05-27Benton, John B Jr QUALIFIED51Elwin Sharvill
1022Francesco ShinkoGermany2026-05-28Rangoni Of Florence QUALIFIED49Onyama Limba
1023Aika InouyeBrazil2026-05-06Morlong Associates UNQUALIFIED37Asiya Javayant
1024David DarakjyJapan2026-05-10Benton, John B Jr NEW48Anna Fali
1025Misaki RoysterJapan2026-05-08Printing Dimensions UNQUALIFIED93Stephen Shaw
1026Maria MarrierAustralia2026-05-08Rousseaux, Michael Esq PROPOSAL74Amy Elsner
1027Juan WieserSpain2026-05-25Commercial Press PROPOSAL59Stephen Shaw
1028Leja CaldareraItaly2026-05-22Commercial Press UNQUALIFIED74Onyama Limba
1029Aruna FigeroaBrazil2026-05-06Buckley Miller Wright UNQUALIFIED71Stephen Shaw
1030Nicolas IturbideArgentina2026-05-15Commercial Press QUALIFIED42Elwin Sharvill
1031David DarakjyGermany2026-05-26King, Christopher A Esq QUALIFIED28Bernardo Dominic
1032Francesco ShinkoBrazil2026-05-06Chanay, Jeffrey A Esq QUALIFIED48Ivan Magalhaes
1033Jeanfrancois VenereBrazil2026-06-04Printing Dimensions RENEWAL13Asiya Javayant
1034Deepesh ChuiRussia2026-05-13Rangoni Of Florence PROPOSAL21Asiya Javayant
1035Leja CaldareraAustralia2026-05-23Truhlar And Truhlar Attys NEW64Xuxue Feng
1036Isabel BowleyAustralia2026-05-18Morlong Associates NEGOTIATION76Bernardo Dominic
1037Kadeem FlosiCanada2026-05-10Rangoni Of Florence NEW78Bernardo Dominic
1038Sinclair WaycottArgentina2026-05-10Rangoni Of Florence QUALIFIED50Elwin Sharvill
1039Misaki RoysterGermany2026-05-31Morlong Associates RENEWAL62Bernardo Dominic
1040Kaitlin OstroskyCanada2026-06-02Truhlar And Truhlar Attys NEGOTIATION26Xuxue Feng
1041Mayumi KolmetzSpain2026-05-18Feiner Bros NEW78Bernardo Dominic
1042Leon OldroydItaly2026-05-26Morlong Associates NEW23Asiya Javayant
1043Johnson SergiAustralia2026-06-04Rangoni Of Florence RENEWAL96Onyama Limba
1044Salvatore StockhamItaly2026-05-10Truhlar And Truhlar Attys UNQUALIFIED15Stephen Shaw
1045Aruna FigeroaJapan2026-05-07Chanay, Jeffrey A Esq QUALIFIED20Xuxue Feng
1046Isabel BowleySpain2026-05-28Commercial Press QUALIFIED13Anna Fali
1047Costa DilliardIndia2026-05-30Morlong Associates RENEWAL74Ivan Magalhaes
1048Nicolas IturbideGermany2026-05-14Chemel, James L Cpa RENEWAL53Asiya Javayant
1049David DarakjyCanada2026-05-26Buckley Miller Wright QUALIFIED47Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Munro FerenczGermanyElwin Sharvill NEGOTIATION
Maisha RulapaughUnited KingdomBernardo Dominic NEW
Leon OldroydAustraliaIvan Magalhaes UNQUALIFIED
Tony FollerJapanIoni Bowcher NEGOTIATION
Darci PoquetteRussiaBernardo Dominic RENEWAL
Kaitlin OstroskyArgentinaBernardo Dominic UNQUALIFIED
Emily WhobreyFranceAnna Fali NEGOTIATION
Smith GlickGermanyAsiya Javayant RENEWAL
Silvio SlusarskiGermanyStephen Shaw NEW
Octavia MaletAustraliaElwin Sharvill NEW
Tony FollerArgentinaElwin Sharvill NEW
Munro FerenczGermanyAsiya Javayant PROPOSAL
Darci PoquetteFranceStephen Shaw UNQUALIFIED
Nicolas IturbideIndiaAsiya Javayant UNQUALIFIED
Alejandro PerinGermanyBernardo Dominic QUALIFIED
Jennifer AmigonFranceAnna Fali QUALIFIED
Rodrigues CampainItalyIvan Magalhaes PROPOSAL
Greenwood BologniaJapanXuxue Feng QUALIFIED
Antonio CaudyGermanyBernardo Dominic PROPOSAL
Smith GlickUnited KingdomXuxue Feng PROPOSAL
Octavia MaletBrazilOnyama Limba QUALIFIED
Silvio SlusarskiGermanyStephen Shaw PROPOSAL
Darci PoquetteSpainBernardo Dominic NEGOTIATION
Aruna FigeroaSpainAmy Elsner PROPOSAL
Adams MorascaIndiaOnyama Limba RENEWAL
Murillo MaletUnited KingdomXuxue Feng PROPOSAL
Maisha RulapaughJapanIvan Magalhaes NEW
Mayumi KolmetzArgentinaElwin Sharvill PROPOSAL
Misaki RoysterSpainAmy Elsner NEW
Julie StensethBrazilIvan Magalhaes QUALIFIED
Octavia MaletUnited KingdomStephen Shaw RENEWAL
Johnson SergiCanadaIoni Bowcher PROPOSAL
Izzy GarufiBrazilStephen Shaw RENEWAL
Kadeem FlosiRussiaIvan Magalhaes UNQUALIFIED
James ButtSpainBernardo Dominic PROPOSAL
Darci PoquetteGermanyElwin Sharvill UNQUALIFIED
Aika InouyeRussiaIvan Magalhaes UNQUALIFIED
Jennifer AmigonGermanyOnyama Limba PROPOSAL
Silvio SlusarskiGermanyXuxue Feng PROPOSAL
Rodrigues CampainJapanIoni Bowcher NEGOTIATION
Clifford RimArgentinaElwin Sharvill PROPOSAL
Juan WieserIndiaIoni Bowcher RENEWAL
Aditya KuskoArgentinaBernardo Dominic NEGOTIATION
Leon OldroydArgentinaIoni Bowcher UNQUALIFIED
Kaitlin OstroskyGermanyOnyama Limba QUALIFIED
Juan WieserIndiaAsiya Javayant UNQUALIFIED
Salvatore StockhamFranceIvan Magalhaes UNQUALIFIED
Faith GillianRussiaOnyama Limba QUALIFIED
Johnson SergiArgentinaXuxue Feng QUALIFIED
James ButtUnited KingdomBernardo Dominic RENEWAL
Frozen Columns
Name
Misaki Royster
Aika Inouye
Stacey Maclead
Greenwood Bolognia
Smith Glick
Octavia Malet
Kadeem Flosi
Francesco Shinko
Nicolas Iturbide
Deepesh Chui
Aika Inouye
Aruna Figeroa
Leon Oldroyd
Mujtaba Nicka
Rodrigues Campain
Nicolas Iturbide
Kaitlin Ostrosky
Kaitlin Ostrosky
Smith Glick
Juan Wieser
Octavia Malet
Silvio Slusarski
Ricardo Gaucho
Kadeem Flosi
Adams Morasca
Aruna Figeroa
Maisha Rulapaugh
Chavez Briddick
Tony Foller
Francesco Shinko
Costa Dilliard
Munro Ferencz
Cody Saylors
Nicolas Iturbide
Tony Foller
Wickens Nestle
Juan Wieser
Greenwood Bolognia
Cody Saylors
Morrow Ruta
Ricardo Gaucho
Wickens Nestle
Aika Inouye
Francesco Shinko
Leon Oldroyd
Arvin Albares
Misaki Royster
Wickens Nestle
Aruna Figeroa
David Darakjy
IdCountryDate
1000Spain2026-05-31
1001Brazil2026-05-13
1002Australia2026-05-07
1003France2026-05-07
1004Spain2026-05-07
1005Canada2026-05-11
1006Argentina2026-05-24
1007Russia2026-05-10
1008Russia2026-05-30
1009Japan2026-05-22
1010India2026-05-13
1011Brazil2026-05-14
1012Canada2026-05-17
1013Germany2026-05-15
1014Germany2026-05-17
1015Canada2026-05-27
1016Russia2026-05-24
1017Italy2026-05-26
1018Germany2026-05-30
1019Canada2026-05-14
1020India2026-05-13
1021Canada2026-05-12
1022Germany2026-05-11
1023Argentina2026-05-30
1024Argentina2026-05-18
1025United Kingdom2026-05-21
1026Russia2026-05-10
1027Argentina2026-05-14
1028Spain2026-05-14
1029France2026-05-16
1030United Kingdom2026-05-08
1031United Kingdom2026-05-10
1032Brazil2026-05-28
1033Russia2026-05-11
1034Australia2026-06-04
1035Argentina2026-05-06
1036India2026-05-17
1037Argentina2026-05-16
1038Italy2026-05-20
1039Australia2026-05-31
1040United Kingdom2026-06-02
1041France2026-05-10
1042France2026-05-15
1043Argentina2026-05-29
1044Canada2026-05-22
1045Australia2026-05-27
1046Australia2026-05-31
1047Argentina2026-05-09
1048Russia2026-05-22
1049Canada2026-05-09

On-Demand Data

NameIdCountryDate
Tony Foller1000Italy2026-05-29
Jefferson Schemmer1001France2026-05-08
Kaitlin Ostrosky1002Spain2026-05-21
Antonio Caudy1003France2026-05-23
Wickens Nestle1004Australia2026-05-13
Aditya Kusko1005Brazil2026-05-15
Kadeem Flosi1006India2026-05-15
Maria Marrier1007Italy2026-05-12
Tony Foller1008Argentina2026-06-03
Izzy Garufi1009United Kingdom2026-05-12
Ivar Paprocki1010United Kingdom2026-05-12
Johnson Sergi1011Japan2026-05-22
Leja Caldarera1012Japan2026-05-10
Ivar Paprocki1013Argentina2026-05-08
Aruna Figeroa1014Japan2026-05-30
Kadeem Flosi1015Australia2026-05-23
Deepesh Chui1016United Kingdom2026-05-27
Costa Dilliard1017United Kingdom2026-05-27
Aruna Figeroa1018Japan2026-05-18
Octavia Malet1019Canada2026-05-16
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Maria MarrierSpainIvan Magalhaes NEGOTIATION
Murillo MaletCanadaIoni Bowcher QUALIFIED
Jones VocelkaCanadaStephen Shaw PROPOSAL
Julie StensethUnited KingdomElwin Sharvill UNQUALIFIED
Clifford RimAustraliaBernardo Dominic PROPOSAL
Jefferson SchemmerBrazilOnyama Limba NEW
Greenwood BologniaSpainBernardo Dominic NEGOTIATION
Aditya KuskoGermanyElwin Sharvill NEGOTIATION
Kaitlin OstroskyIndiaIoni Bowcher UNQUALIFIED
Salvatore StockhamArgentinaBernardo Dominic NEW
Ashley DoeGermanyBernardo Dominic QUALIFIED
Arvin AlbaresItalyAmy Elsner UNQUALIFIED
Mujtaba NickaArgentinaElwin Sharvill UNQUALIFIED
Mayumi KolmetzUnited KingdomAmy Elsner QUALIFIED
Rodrigues CampainBrazilIoni Bowcher NEGOTIATION
Rodrigues CampainRussiaXuxue Feng PROPOSAL
Tony FollerArgentinaElwin Sharvill RENEWAL
Maria MarrierItalyElwin Sharvill UNQUALIFIED
Aruna FigeroaSpainBernardo Dominic RENEWAL
Sinclair WaycottBrazilIoni Bowcher NEGOTIATION
Morrow RutaUnited KingdomOnyama Limba NEGOTIATION
Ivar PaprockiBrazilIoni Bowcher NEGOTIATION
Arvin AlbaresBrazilAnna Fali UNQUALIFIED
Sinclair WaycottAustraliaXuxue Feng NEGOTIATION
Leon OldroydFranceAsiya Javayant UNQUALIFIED
Ivar PaprockiFranceElwin Sharvill NEGOTIATION
Rodrigues CampainArgentinaXuxue Feng RENEWAL
Claire TollnerRussiaBernardo Dominic QUALIFIED
Adams MorascaCanadaElwin Sharvill NEGOTIATION
Faith GillianItalyAsiya Javayant PROPOSAL
Isabel BowleyFranceBernardo Dominic NEW
Aika InouyeItalyAnna Fali NEGOTIATION
James ButtIndiaXuxue Feng NEW
Alejandro PerinBrazilIoni Bowcher UNQUALIFIED
James ButtJapanIvan Magalhaes PROPOSAL
Aruna FigeroaIndiaStephen Shaw RENEWAL
Johnson SergiArgentinaXuxue Feng NEGOTIATION
Faith GillianRussiaOnyama Limba PROPOSAL
Maisha RulapaughBrazilStephen Shaw QUALIFIED
Aditya KuskoAustraliaAsiya Javayant 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>