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
Mayumi KolmetzRussiaIvan Magalhaes QUALIFIED
Isabel BowleyGermanyXuxue Feng NEGOTIATION
Costa DilliardCanadaElwin Sharvill RENEWAL
James ButtIndiaIoni Bowcher PROPOSAL
Clifford RimAustraliaElwin Sharvill RENEWAL
Murillo MaletBrazilStephen Shaw QUALIFIED
Jefferson SchemmerUnited KingdomAsiya Javayant RENEWAL
Kaitlin OstroskyFranceIoni Bowcher PROPOSAL
Alejandro PerinCanadaBernardo Dominic NEW
Emily WhobreyArgentinaAsiya Javayant QUALIFIED
Jefferson SchemmerIndiaStephen Shaw NEW
Jefferson SchemmerIndiaBernardo Dominic PROPOSAL
Jones VocelkaFranceAsiya Javayant UNQUALIFIED
Stacey MacleadItalyAnna Fali NEW
Rodrigues CampainBrazilAmy Elsner NEW
Ricardo GauchoItalyOnyama Limba QUALIFIED
Juan WieserAustraliaIvan Magalhaes RENEWAL
Adams MorascaFranceOnyama Limba UNQUALIFIED
Leja CaldareraIndiaOnyama Limba NEW
Jennifer AmigonUnited KingdomIvan Magalhaes UNQUALIFIED
Adams MorascaCanadaElwin Sharvill UNQUALIFIED
Tony FollerJapanOnyama Limba NEGOTIATION
Murillo MaletArgentinaOnyama Limba NEW
Smith GlickBrazilIoni Bowcher PROPOSAL
Stacey MacleadGermanyBernardo Dominic QUALIFIED
Kaitlin OstroskyRussiaAmy Elsner QUALIFIED
Juan WieserJapanAsiya Javayant NEW
Adams MorascaRussiaAmy Elsner PROPOSAL
James ButtAustraliaXuxue Feng QUALIFIED
Greenwood BologniaAustraliaAsiya Javayant NEW
Octavia MaletItalyElwin Sharvill UNQUALIFIED
Aika InouyeRussiaOnyama Limba UNQUALIFIED
Isabel BowleyItalyOnyama Limba UNQUALIFIED
Octavia MaletCanadaAmy Elsner UNQUALIFIED
Stacey MacleadFranceStephen Shaw UNQUALIFIED
Darci PoquetteFranceAnna Fali RENEWAL
Kaitlin OstroskyAustraliaAnna Fali RENEWAL
Leon OldroydArgentinaStephen Shaw QUALIFIED
Clifford RimArgentinaStephen Shaw UNQUALIFIED
Morrow RutaRussiaElwin Sharvill RENEWAL
Faith GillianItalyAnna Fali UNQUALIFIED
Darci PoquetteGermanyStephen Shaw NEW
David DarakjySpainAmy Elsner NEW
Arvin AlbaresFranceAnna Fali QUALIFIED
Isabel BowleyCanadaElwin Sharvill PROPOSAL
Misaki RoysterRussiaAnna Fali QUALIFIED
Leja CaldareraRussiaIvan Magalhaes NEW
Salvatore StockhamFranceIoni Bowcher NEW
Arvin AlbaresItalyElwin Sharvill UNQUALIFIED
Jeanfrancois VenereJapanOnyama Limba RENEWAL
Horizontal
NameCountryRepresentativeStatus
Rodrigues CampainFranceElwin Sharvill QUALIFIED
Murillo MaletGermanyElwin Sharvill UNQUALIFIED
Arvin AlbaresFranceAsiya Javayant PROPOSAL
Greenwood BologniaArgentinaStephen Shaw RENEWAL
Sinclair WaycottAustraliaIoni Bowcher PROPOSAL
Alejandro PerinAustraliaAmy Elsner NEGOTIATION
Nicolas IturbideBrazilBernardo Dominic UNQUALIFIED
Nicolas IturbideSpainAnna Fali NEGOTIATION
Antonio CaudyItalyIvan Magalhaes UNQUALIFIED
Leon OldroydCanadaIoni Bowcher UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Claire TollnerIndia2026-06-12Chemel, James L Cpa NEW98Stephen Shaw
1001Claire TollnerSpain2026-06-01Morlong Associates NEGOTIATION38Amy Elsner
1002Mayumi KolmetzBrazil2026-06-14Rousseaux, Michael Esq NEW84Ioni Bowcher
1003Stacey MacleadGermany2026-06-11Dorl, James J Esq PROPOSAL23Xuxue Feng
1004Emily WhobreyCanada2026-06-05Feltz Printing Service NEGOTIATION90Bernardo Dominic
1005Salvatore StockhamBrazil2026-06-13Commercial Press NEGOTIATION13Onyama Limba
1006Arvin AlbaresGermany2026-06-16Rangoni Of Florence UNQUALIFIED57Bernardo Dominic
1007Sinclair WaycottSpain2026-05-27Chanay, Jeffrey A Esq NEGOTIATION23Stephen Shaw
1008Misaki RoysterItaly2026-06-02Feiner Bros RENEWAL29Ivan Magalhaes
1009Clifford RimSpain2026-05-31Buckley Miller Wright NEW62Onyama Limba
1010Izzy GarufiItaly2026-06-13Chapman, Ross E Esq NEGOTIATION69Ivan Magalhaes
1011David DarakjyIndia2026-06-07Morlong Associates UNQUALIFIED17Anna Fali
1012Arvin AlbaresFrance2026-05-31Chapman, Ross E Esq NEW96Ioni Bowcher
1013Jeanfrancois VenereCanada2026-06-10Rousseaux, Michael Esq PROPOSAL13Amy Elsner
1014Emily WhobreyAustralia2026-05-22Morlong Associates UNQUALIFIED87Anna Fali
1015Aruna FigeroaAustralia2026-05-25Benton, John B Jr NEW42Elwin Sharvill
1016Ricardo GauchoAustralia2026-05-28King, Christopher A Esq PROPOSAL71Xuxue Feng
1017Ashley DoeArgentina2026-06-17Dorl, James J Esq NEGOTIATION10Ioni Bowcher
1018David DarakjyIndia2026-06-07Rangoni Of Florence UNQUALIFIED91Elwin Sharvill
1019Kaitlin OstroskyGermany2026-05-27Chanay, Jeffrey A Esq PROPOSAL65Bernardo Dominic
1020Mayumi KolmetzRussia2026-06-13Printing Dimensions NEGOTIATION19Anna Fali
1021Kadeem FlosiUnited Kingdom2026-06-01Chapman, Ross E Esq RENEWAL59Xuxue Feng
1022Jefferson SchemmerCanada2026-05-29Feltz Printing Service UNQUALIFIED77Anna Fali
1023Ricardo GauchoArgentina2026-06-07Chapman, Ross E Esq NEGOTIATION4Amy Elsner
1024Tony FollerItaly2026-06-03Feltz Printing Service RENEWAL86Ivan Magalhaes
1025Kaitlin OstroskyJapan2026-06-11Chanay, Jeffrey A Esq RENEWAL93Bernardo Dominic
1026Maria MarrierJapan2026-06-14Morlong Associates NEGOTIATION90Ivan Magalhaes
1027Isabel BowleyFrance2026-05-24Commercial Press NEGOTIATION64Anna Fali
1028Alejandro PerinSpain2026-06-17Rousseaux, Michael Esq RENEWAL60Onyama Limba
1029Costa DilliardAustralia2026-06-02Feiner Bros QUALIFIED9Asiya Javayant
1030Greenwood BologniaIndia2026-06-14Printing Dimensions RENEWAL27Onyama Limba
1031Maisha RulapaughGermany2026-05-25Rousseaux, Michael Esq UNQUALIFIED13Onyama Limba
1032Stacey MacleadJapan2026-06-17Benton, John B Jr QUALIFIED82Asiya Javayant
1033Arvin AlbaresSpain2026-06-16Commercial Press UNQUALIFIED98Bernardo Dominic
1034Leon OldroydUnited Kingdom2026-06-03Buckley Miller Wright RENEWAL73Anna Fali
1035Misaki RoysterSpain2026-06-16Feltz Printing Service RENEWAL93Ivan Magalhaes
1036Mayumi KolmetzRussia2026-06-06Buckley Miller Wright QUALIFIED88Anna Fali
1037Darci PoquetteRussia2026-06-10Printing Dimensions PROPOSAL22Bernardo Dominic
1038Juan WieserSpain2026-06-15Chemel, James L Cpa RENEWAL56Bernardo Dominic
1039Adams MorascaCanada2026-05-25Chanay, Jeffrey A Esq UNQUALIFIED74Onyama Limba
1040Cody SaylorsItaly2026-06-17Dorl, James J Esq PROPOSAL19Anna Fali
1041Kaitlin OstroskyFrance2026-06-06Commercial Press RENEWAL77Onyama Limba
1042Cody SaylorsSpain2026-06-14Dorl, James J Esq NEW17Bernardo Dominic
1043Izzy GarufiRussia2026-06-02Benton, John B Jr UNQUALIFIED19Stephen Shaw
1044Silvio SlusarskiFrance2026-06-12Feltz Printing Service NEW9Asiya Javayant
1045Cody SaylorsGermany2026-05-31Chemel, James L Cpa NEW13Ivan Magalhaes
1046Antonio CaudyFrance2026-06-08Rousseaux, Michael Esq NEGOTIATION54Stephen Shaw
1047Ricardo GauchoFrance2026-06-06Rousseaux, Michael Esq PROPOSAL74Stephen Shaw
1048Munro FerenczArgentina2026-05-25Morlong Associates NEGOTIATION57Asiya Javayant
1049Deepesh ChuiFrance2026-05-31Benton, John B Jr UNQUALIFIED65Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Kadeem FlosiArgentinaAmy Elsner UNQUALIFIED
Sinclair WaycottSpainIoni Bowcher RENEWAL
Munro FerenczBrazilOnyama Limba PROPOSAL
James ButtRussiaAsiya Javayant RENEWAL
Salvatore StockhamUnited KingdomElwin Sharvill UNQUALIFIED
Costa DilliardCanadaAmy Elsner PROPOSAL
Aika InouyeBrazilAsiya Javayant NEW
Francesco ShinkoFranceAnna Fali PROPOSAL
Murillo MaletIndiaAnna Fali PROPOSAL
Darci PoquetteJapanIoni Bowcher QUALIFIED
Deepesh ChuiRussiaBernardo Dominic RENEWAL
Jones VocelkaSpainAmy Elsner RENEWAL
Ashley DoeItalyBernardo Dominic RENEWAL
Smith GlickCanadaAnna Fali NEW
Julie StensethArgentinaAnna Fali NEGOTIATION
Claire TollnerBrazilXuxue Feng RENEWAL
David DarakjyUnited KingdomOnyama Limba NEGOTIATION
Nicolas IturbideArgentinaAnna Fali NEGOTIATION
Izzy GarufiIndiaOnyama Limba QUALIFIED
Cody SaylorsCanadaIvan Magalhaes UNQUALIFIED
Maria MarrierGermanyIvan Magalhaes QUALIFIED
Alejandro PerinArgentinaOnyama Limba NEW
Salvatore StockhamSpainAnna Fali PROPOSAL
Smith GlickRussiaAnna Fali PROPOSAL
Ashley DoeAustraliaStephen Shaw PROPOSAL
Tony FollerRussiaIvan Magalhaes PROPOSAL
Silvio SlusarskiAustraliaAsiya Javayant UNQUALIFIED
Arvin AlbaresItalyOnyama Limba NEGOTIATION
Tony FollerRussiaIoni Bowcher NEGOTIATION
Smith GlickArgentinaElwin Sharvill PROPOSAL
Leon OldroydUnited KingdomBernardo Dominic PROPOSAL
Wickens NestleGermanyBernardo Dominic NEW
Adams MorascaCanadaStephen Shaw NEGOTIATION
Darci PoquetteAustraliaStephen Shaw PROPOSAL
Isabel BowleyUnited KingdomAnna Fali UNQUALIFIED
Leon OldroydUnited KingdomAsiya Javayant NEGOTIATION
Ivar PaprockiBrazilIoni Bowcher UNQUALIFIED
Smith GlickIndiaIvan Magalhaes QUALIFIED
Morrow RutaItalyIvan Magalhaes RENEWAL
Izzy GarufiGermanyAmy Elsner RENEWAL
Jones VocelkaItalyAnna Fali QUALIFIED
Faith GillianFranceAsiya Javayant RENEWAL
Greenwood BologniaItalyOnyama Limba QUALIFIED
Morrow RutaUnited KingdomBernardo Dominic NEW
Ashley DoeBrazilAmy Elsner NEGOTIATION
Tony FollerArgentinaAnna Fali PROPOSAL
Ricardo GauchoCanadaStephen Shaw NEGOTIATION
Greenwood BologniaArgentinaElwin Sharvill NEGOTIATION
Munro FerenczCanadaIvan Magalhaes NEW
Jones VocelkaIndiaAmy Elsner PROPOSAL
Frozen Columns
Name
Greenwood Bolognia
Francesco Shinko
Ashley Doe
Kaitlin Ostrosky
Jennifer Amigon
Aditya Kusko
Antonio Caudy
Aruna Figeroa
Cody Saylors
Isabel Bowley
Izzy Garufi
Jones Vocelka
Silvio Slusarski
Aika Inouye
Costa Dilliard
Aika Inouye
Aika Inouye
Arvin Albares
David Darakjy
Jones Vocelka
Ivar Paprocki
Deepesh Chui
Antonio Caudy
Ricardo Gaucho
Wickens Nestle
Jennifer Amigon
Aruna Figeroa
Maria Marrier
Silvio Slusarski
Izzy Garufi
Misaki Royster
Arvin Albares
Ashley Doe
Jones Vocelka
Munro Ferencz
Wickens Nestle
Jeanfrancois Venere
Nicolas Iturbide
David Darakjy
Greenwood Bolognia
Murillo Malet
Chavez Briddick
David Darakjy
Leja Caldarera
Tony Foller
Jones Vocelka
Julie Stenseth
Arvin Albares
Maisha Rulapaugh
Rodrigues Campain
IdCountryDate
1000Russia2026-06-14
1001Brazil2026-06-18
1002India2026-06-18
1003Italy2026-05-20
1004Germany2026-06-14
1005Russia2026-06-16
1006Japan2026-05-21
1007France2026-06-17
1008Japan2026-05-27
1009Russia2026-05-24
1010Japan2026-06-16
1011Russia2026-05-31
1012Russia2026-05-30
1013Japan2026-06-17
1014Germany2026-06-11
1015France2026-05-31
1016United Kingdom2026-05-28
1017Canada2026-06-17
1018Argentina2026-06-13
1019United Kingdom2026-06-10
1020Italy2026-06-15
1021Canada2026-05-26
1022Brazil2026-06-16
1023Japan2026-05-24
1024Brazil2026-05-30
1025Spain2026-05-25
1026Italy2026-06-13
1027Argentina2026-05-31
1028Germany2026-06-01
1029Canada2026-06-03
1030India2026-05-24
1031Argentina2026-06-01
1032Australia2026-05-27
1033Germany2026-06-14
1034Australia2026-06-05
1035Australia2026-06-18
1036United Kingdom2026-05-23
1037Spain2026-05-28
1038Russia2026-06-03
1039Spain2026-06-08
1040Australia2026-05-23
1041France2026-06-18
1042Russia2026-06-11
1043France2026-05-21
1044Australia2026-06-16
1045India2026-06-03
1046Australia2026-06-11
1047Spain2026-05-28
1048Australia2026-05-28
1049Spain2026-05-31

On-Demand Data

NameIdCountryDate
Tony Foller1000Spain2026-06-12
Jones Vocelka1001Argentina2026-06-11
Antonio Caudy1002Australia2026-05-22
Clifford Rim1003Spain2026-05-28
Francesco Shinko1004Spain2026-06-03
Adams Morasca1005Spain2026-05-23
Emily Whobrey1006Russia2026-05-28
Aika Inouye1007Canada2026-06-05
Juan Wieser1008Brazil2026-06-11
Maisha Rulapaugh1009Germany2026-06-09
Deepesh Chui1010Spain2026-06-02
Ashley Doe1011United Kingdom2026-05-30
Smith Glick1012Australia2026-05-31
Jeanfrancois Venere1013Germany2026-06-04
Mujtaba Nicka1014Russia2026-06-15
Kaitlin Ostrosky1015United Kingdom2026-05-20
David Darakjy1016Japan2026-06-13
Costa Dilliard1017Spain2026-05-23
Johnson Sergi1018Australia2026-06-14
Antonio Caudy1019United Kingdom2026-06-07
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Nicolas IturbideJapanStephen Shaw PROPOSAL
Mayumi KolmetzCanadaElwin Sharvill UNQUALIFIED
Alejandro PerinItalyXuxue Feng NEW
Stacey MacleadItalyStephen Shaw QUALIFIED
Adams MorascaUnited KingdomIvan Magalhaes UNQUALIFIED
Nicolas IturbideAustraliaStephen Shaw NEGOTIATION
Darci PoquetteUnited KingdomBernardo Dominic NEW
Francesco ShinkoAustraliaOnyama Limba RENEWAL
Antonio CaudyGermanyAmy Elsner NEGOTIATION
Isabel BowleyIndiaOnyama Limba PROPOSAL
Francesco ShinkoSpainStephen Shaw QUALIFIED
Ashley DoeBrazilBernardo Dominic UNQUALIFIED
Julie StensethIndiaAnna Fali RENEWAL
James ButtFranceElwin Sharvill UNQUALIFIED
Sinclair WaycottSpainIoni Bowcher QUALIFIED
Sinclair WaycottIndiaIvan Magalhaes NEGOTIATION
Mujtaba NickaFranceElwin Sharvill UNQUALIFIED
Jennifer AmigonSpainXuxue Feng PROPOSAL
Deepesh ChuiRussiaAnna Fali NEW
Kaitlin OstroskyUnited KingdomAmy Elsner QUALIFIED
Smith GlickUnited KingdomElwin Sharvill RENEWAL
Emily WhobreyAustraliaAsiya Javayant NEW
Greenwood BologniaArgentinaBernardo Dominic QUALIFIED
Maria MarrierBrazilAnna Fali PROPOSAL
Adams MorascaRussiaAsiya Javayant NEW
Ashley DoeSpainXuxue Feng UNQUALIFIED
Murillo MaletUnited KingdomOnyama Limba NEGOTIATION
Smith GlickFranceIvan Magalhaes RENEWAL
Maisha RulapaughSpainAsiya Javayant NEGOTIATION
Maisha RulapaughJapanIoni Bowcher RENEWAL
Leon OldroydFranceAmy Elsner UNQUALIFIED
Claire TollnerJapanIoni Bowcher PROPOSAL
James ButtArgentinaBernardo Dominic NEGOTIATION
Aika InouyeArgentinaElwin Sharvill NEGOTIATION
Salvatore StockhamUnited KingdomOnyama Limba NEGOTIATION
Deepesh ChuiCanadaBernardo Dominic PROPOSAL
Smith GlickUnited KingdomIoni Bowcher QUALIFIED
Mayumi KolmetzArgentinaIoni Bowcher UNQUALIFIED
Leja CaldareraFranceAnna Fali PROPOSAL
Stacey MacleadRussiaIoni Bowcher NEW

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