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
Smith GlickGermanyIoni Bowcher NEW
James ButtAustraliaAsiya Javayant PROPOSAL
Isabel BowleyItalyAnna Fali QUALIFIED
Adams MorascaItalyStephen Shaw RENEWAL
Costa DilliardIndiaBernardo Dominic NEW
Octavia MaletSpainStephen Shaw PROPOSAL
Deepesh ChuiFranceAmy Elsner NEGOTIATION
Kaitlin OstroskyBrazilElwin Sharvill QUALIFIED
Murillo MaletArgentinaOnyama Limba UNQUALIFIED
Greenwood BologniaCanadaAnna Fali RENEWAL
Adams MorascaIndiaStephen Shaw QUALIFIED
Mujtaba NickaBrazilAnna Fali NEGOTIATION
Kaitlin OstroskySpainAmy Elsner RENEWAL
Tony FollerSpainStephen Shaw NEGOTIATION
Stacey MacleadItalyAsiya Javayant NEGOTIATION
Ivar PaprockiBrazilXuxue Feng NEW
Jones VocelkaCanadaAmy Elsner UNQUALIFIED
Maisha RulapaughJapanAnna Fali RENEWAL
Darci PoquetteRussiaAnna Fali NEW
Mayumi KolmetzAustraliaAnna Fali RENEWAL
Morrow RutaFranceXuxue Feng NEGOTIATION
Costa DilliardIndiaIvan Magalhaes PROPOSAL
Aika InouyeAustraliaBernardo Dominic PROPOSAL
Kadeem FlosiFranceIoni Bowcher UNQUALIFIED
Octavia MaletFranceIoni Bowcher UNQUALIFIED
Misaki RoysterSpainBernardo Dominic RENEWAL
Murillo MaletArgentinaElwin Sharvill UNQUALIFIED
Adams MorascaAustraliaElwin Sharvill PROPOSAL
Isabel BowleySpainOnyama Limba QUALIFIED
Julie StensethRussiaBernardo Dominic RENEWAL
Ivar PaprockiCanadaElwin Sharvill NEW
Alejandro PerinIndiaAmy Elsner UNQUALIFIED
Murillo MaletRussiaAsiya Javayant QUALIFIED
Aditya KuskoRussiaXuxue Feng NEGOTIATION
Alejandro PerinRussiaAsiya Javayant UNQUALIFIED
Isabel BowleyGermanyStephen Shaw QUALIFIED
Leja CaldareraBrazilAsiya Javayant QUALIFIED
Izzy GarufiUnited KingdomAnna Fali NEGOTIATION
Morrow RutaItalyBernardo Dominic RENEWAL
Nicolas IturbideAustraliaStephen Shaw UNQUALIFIED
Leja CaldareraIndiaElwin Sharvill NEGOTIATION
Costa DilliardFranceBernardo Dominic PROPOSAL
Sinclair WaycottItalyAmy Elsner UNQUALIFIED
Tony FollerItalyIoni Bowcher NEGOTIATION
Aditya KuskoGermanyAmy Elsner NEW
Kadeem FlosiBrazilStephen Shaw QUALIFIED
Tony FollerUnited KingdomAsiya Javayant NEW
Leon OldroydItalyOnyama Limba QUALIFIED
Greenwood BologniaItalyIoni Bowcher NEGOTIATION
Ricardo GauchoBrazilIvan Magalhaes NEW
Horizontal
NameCountryRepresentativeStatus
Jeanfrancois VenereBrazilAmy Elsner NEW
Maisha RulapaughAustraliaAmy Elsner PROPOSAL
Jennifer AmigonUnited KingdomElwin Sharvill PROPOSAL
Kadeem FlosiCanadaAnna Fali PROPOSAL
Silvio SlusarskiItalyStephen Shaw NEGOTIATION
Jones VocelkaFranceElwin Sharvill UNQUALIFIED
Sinclair WaycottJapanOnyama Limba QUALIFIED
Izzy GarufiItalyXuxue Feng PROPOSAL
Jones VocelkaFranceXuxue Feng PROPOSAL
Morrow RutaCanadaAsiya Javayant QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Clifford RimFrance2025-06-15Benton, John B Jr NEW98Amy Elsner
1001Tony FollerRussia2025-06-22Chanay, Jeffrey A Esq QUALIFIED55Stephen Shaw
1002Ivar PaprockiSpain2025-06-23Benton, John B Jr UNQUALIFIED99Bernardo Dominic
1003Mujtaba NickaCanada2025-06-19Chanay, Jeffrey A Esq NEGOTIATION30Ioni Bowcher
1004Salvatore StockhamGermany2025-06-16Feiner Bros PROPOSAL58Xuxue Feng
1005Francesco ShinkoFrance2025-06-23Commercial Press QUALIFIED45Onyama Limba
1006Kaitlin OstroskyBrazil2025-06-21Commercial Press NEW93Ioni Bowcher
1007Leon OldroydCanada2025-06-02Feiner Bros NEW87Stephen Shaw
1008Aika InouyeIndia2025-06-26Feltz Printing Service QUALIFIED25Onyama Limba
1009Nicolas IturbideUnited Kingdom2025-06-19Buckley Miller Wright PROPOSAL87Xuxue Feng
1010Faith GillianJapan2025-06-22Truhlar And Truhlar Attys NEW11Asiya Javayant
1011Julie StensethAustralia2025-06-05Commercial Press PROPOSAL83Bernardo Dominic
1012Octavia MaletBrazil2025-06-23King, Christopher A Esq UNQUALIFIED46Anna Fali
1013Jones VocelkaArgentina2025-06-06Printing Dimensions UNQUALIFIED42Elwin Sharvill
1014Mayumi KolmetzCanada2025-06-16King, Christopher A Esq QUALIFIED1Elwin Sharvill
1015Aruna FigeroaSpain2025-06-22Truhlar And Truhlar Attys UNQUALIFIED22Onyama Limba
1016Cody SaylorsJapan2025-06-06Dorl, James J Esq QUALIFIED44Asiya Javayant
1017Arvin AlbaresItaly2025-06-25Chanay, Jeffrey A Esq NEW68Elwin Sharvill
1018Greenwood BologniaSpain2025-06-19Feiner Bros UNQUALIFIED69Elwin Sharvill
1019Aika InouyeItaly2025-06-03Feiner Bros UNQUALIFIED44Asiya Javayant
1020Misaki RoysterArgentina2025-06-12Truhlar And Truhlar Attys QUALIFIED9Asiya Javayant
1021Darci PoquetteAustralia2025-06-09Dorl, James J Esq UNQUALIFIED97Ivan Magalhaes
1022Jeanfrancois VenereArgentina2025-06-01Benton, John B Jr RENEWAL78Xuxue Feng
1023Aika InouyeJapan2025-06-07Dorl, James J Esq RENEWAL52Amy Elsner
1024Kaitlin OstroskyFrance2025-06-30Chanay, Jeffrey A Esq QUALIFIED1Onyama Limba
1025Aruna FigeroaBrazil2025-06-29Buckley Miller Wright PROPOSAL99Asiya Javayant
1026Nicolas IturbideRussia2025-06-17Rousseaux, Michael Esq NEGOTIATION53Xuxue Feng
1027Kadeem FlosiArgentina2025-06-03King, Christopher A Esq NEGOTIATION72Bernardo Dominic
1028Octavia MaletRussia2025-06-27Rousseaux, Michael Esq NEGOTIATION78Stephen Shaw
1029Munro FerenczArgentina2025-06-08Rousseaux, Michael Esq NEGOTIATION94Anna Fali
1030Clifford RimJapan2025-06-09King, Christopher A Esq QUALIFIED52Stephen Shaw
1031Misaki RoysterIndia2025-06-06Truhlar And Truhlar Attys PROPOSAL7Asiya Javayant
1032Nicolas IturbideIndia2025-06-14Chanay, Jeffrey A Esq QUALIFIED23Elwin Sharvill
1033Cody SaylorsUnited Kingdom2025-06-21Truhlar And Truhlar Attys NEGOTIATION37Xuxue Feng
1034Leon OldroydBrazil2025-06-09Feltz Printing Service RENEWAL45Ioni Bowcher
1035Claire TollnerRussia2025-06-11Printing Dimensions UNQUALIFIED14Xuxue Feng
1036Cody SaylorsGermany2025-06-22Buckley Miller Wright PROPOSAL42Amy Elsner
1037Sinclair WaycottBrazil2025-06-02Chemel, James L Cpa PROPOSAL31Amy Elsner
1038Maisha RulapaughArgentina2025-06-07Chapman, Ross E Esq RENEWAL1Asiya Javayant
1039Jeanfrancois VenereRussia2025-06-13Buckley Miller Wright UNQUALIFIED71Xuxue Feng
1040Emily WhobreyItaly2025-06-09Feiner Bros NEGOTIATION14Asiya Javayant
1041Arvin AlbaresGermany2025-06-14Buckley Miller Wright UNQUALIFIED12Anna Fali
1042Isabel BowleyGermany2025-06-05Dorl, James J Esq NEW54Elwin Sharvill
1043Stacey MacleadFrance2025-06-11Chapman, Ross E Esq UNQUALIFIED33Xuxue Feng
1044Julie StensethGermany2025-06-25Chanay, Jeffrey A Esq NEGOTIATION41Anna Fali
1045Aditya KuskoRussia2025-06-15Chapman, Ross E Esq UNQUALIFIED80Ioni Bowcher
1046Tony FollerSpain2025-06-05Chemel, James L Cpa NEW54Bernardo Dominic
1047Maisha RulapaughJapan2025-06-17Commercial Press UNQUALIFIED12Ioni Bowcher
1048Stacey MacleadArgentina2025-06-20Chemel, James L Cpa RENEWAL65Ivan Magalhaes
1049Isabel BowleyAustralia2025-06-20Commercial Press NEW12Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Salvatore StockhamBrazilAsiya Javayant UNQUALIFIED
Chavez BriddickGermanyIvan Magalhaes RENEWAL
Munro FerenczFranceAnna Fali RENEWAL
Sinclair WaycottCanadaIoni Bowcher NEW
Clifford RimArgentinaElwin Sharvill QUALIFIED
Costa DilliardCanadaBernardo Dominic UNQUALIFIED
Misaki RoysterRussiaBernardo Dominic QUALIFIED
Nicolas IturbideItalyAsiya Javayant RENEWAL
Aditya KuskoFranceBernardo Dominic PROPOSAL
Ashley DoeCanadaAmy Elsner QUALIFIED
Kadeem FlosiItalyAsiya Javayant QUALIFIED
Sinclair WaycottFranceStephen Shaw PROPOSAL
Rodrigues CampainUnited KingdomAsiya Javayant PROPOSAL
Smith GlickArgentinaAsiya Javayant RENEWAL
Faith GillianUnited KingdomOnyama Limba NEGOTIATION
Salvatore StockhamSpainStephen Shaw UNQUALIFIED
Aditya KuskoJapanElwin Sharvill NEW
Stacey MacleadIndiaAnna Fali PROPOSAL
James ButtBrazilAmy Elsner RENEWAL
Ivar PaprockiGermanyXuxue Feng NEGOTIATION
Izzy GarufiGermanyStephen Shaw RENEWAL
Munro FerenczJapanIoni Bowcher PROPOSAL
Nicolas IturbideFranceIvan Magalhaes NEW
Claire TollnerFranceElwin Sharvill PROPOSAL
Smith GlickCanadaXuxue Feng UNQUALIFIED
Costa DilliardBrazilAsiya Javayant QUALIFIED
Wickens NestleCanadaBernardo Dominic NEGOTIATION
Claire TollnerArgentinaXuxue Feng RENEWAL
Octavia MaletArgentinaOnyama Limba NEW
Nicolas IturbideJapanElwin Sharvill NEGOTIATION
Misaki RoysterItalyElwin Sharvill NEW
Smith GlickJapanBernardo Dominic RENEWAL
James ButtBrazilAsiya Javayant PROPOSAL
Antonio CaudyUnited KingdomAsiya Javayant PROPOSAL
Nicolas IturbideItalyOnyama Limba NEGOTIATION
Chavez BriddickSpainAsiya Javayant PROPOSAL
Smith GlickItalyAsiya Javayant NEGOTIATION
Ricardo GauchoCanadaIvan Magalhaes NEGOTIATION
Ricardo GauchoSpainOnyama Limba RENEWAL
Ricardo GauchoRussiaElwin Sharvill PROPOSAL
Kadeem FlosiArgentinaAnna Fali NEW
Adams MorascaBrazilElwin Sharvill NEW
Isabel BowleyIndiaBernardo Dominic PROPOSAL
Kaitlin OstroskyFranceAsiya Javayant QUALIFIED
Izzy GarufiItalyBernardo Dominic UNQUALIFIED
Deepesh ChuiRussiaAmy Elsner PROPOSAL
David DarakjyGermanyAmy Elsner NEGOTIATION
Jones VocelkaItalyElwin Sharvill PROPOSAL
Jeanfrancois VenereSpainElwin Sharvill PROPOSAL
Greenwood BologniaAustraliaIvan Magalhaes RENEWAL
Frozen Columns
Name
Aruna Figeroa
Aika Inouye
Murillo Malet
Julie Stenseth
Rodrigues Campain
Adams Morasca
Misaki Royster
Chavez Briddick
Jennifer Amigon
Munro Ferencz
Munro Ferencz
Juan Wieser
Antonio Caudy
Emily Whobrey
Salvatore Stockham
Wickens Nestle
James Butt
Smith Glick
Ricardo Gaucho
Ivar Paprocki
Morrow Ruta
Misaki Royster
Salvatore Stockham
Cody Saylors
Cody Saylors
Deepesh Chui
Costa Dilliard
Kadeem Flosi
Jeanfrancois Venere
Ivar Paprocki
Aditya Kusko
Mayumi Kolmetz
Clifford Rim
Smith Glick
Deepesh Chui
Emily Whobrey
Ashley Doe
Jefferson Schemmer
Murillo Malet
Cody Saylors
Aditya Kusko
Clifford Rim
Munro Ferencz
Murillo Malet
Deepesh Chui
Claire Tollner
Aditya Kusko
Cody Saylors
Salvatore Stockham
Antonio Caudy
IdCountryDate
1000Brazil2025-06-02
1001United Kingdom2025-06-19
1002Germany2025-06-11
1003Russia2025-06-21
1004Brazil2025-06-20
1005Spain2025-06-30
1006Russia2025-06-13
1007Argentina2025-06-29
1008Germany2025-06-26
1009India2025-06-17
1010India2025-06-15
1011United Kingdom2025-06-08
1012United Kingdom2025-06-01
1013Japan2025-06-26
1014Australia2025-06-08
1015Russia2025-06-25
1016Russia2025-06-15
1017France2025-06-14
1018Japan2025-06-05
1019France2025-06-04
1020Spain2025-06-30
1021Canada2025-06-18
1022Japan2025-06-22
1023Spain2025-06-07
1024Canada2025-06-29
1025Italy2025-06-26
1026Italy2025-06-30
1027Russia2025-06-16
1028Germany2025-06-25
1029Russia2025-06-16
1030Canada2025-06-14
1031Argentina2025-06-10
1032Canada2025-06-20
1033Spain2025-06-22
1034Canada2025-06-21
1035Germany2025-06-28
1036India2025-06-18
1037Canada2025-06-11
1038Japan2025-06-30
1039Brazil2025-06-03
1040Argentina2025-06-25
1041France2025-06-11
1042United Kingdom2025-06-24
1043Germany2025-06-19
1044Germany2025-06-28
1045Australia2025-06-29
1046Germany2025-06-18
1047Germany2025-06-26
1048India2025-06-16
1049United Kingdom2025-06-18

On-Demand Data

NameIdCountryDate
Octavia Malet1000Canada2025-06-16
Darci Poquette1001United Kingdom2025-06-02
Aditya Kusko1002Spain2025-06-27
Francesco Shinko1003Italy2025-06-07
Arvin Albares1004Australia2025-06-18
Clifford Rim1005Germany2025-06-08
Adams Morasca1006Italy2025-06-23
Nicolas Iturbide1007Brazil2025-06-06
Sinclair Waycott1008Spain2025-06-06
Emily Whobrey1009Canada2025-06-26
Emily Whobrey1010Australia2025-06-24
Isabel Bowley1011France2025-06-14
Leja Caldarera1012Italy2025-06-20
Antonio Caudy1013Japan2025-06-08
Aika Inouye1014India2025-06-09
Kadeem Flosi1015Canada2025-06-23
Alejandro Perin1016Italy2025-06-10
Leon Oldroyd1017Germany2025-06-02
Chavez Briddick1018Australia2025-06-30
Mujtaba Nicka1019Brazil2025-06-12
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Morrow RutaCanadaIoni Bowcher QUALIFIED
Deepesh ChuiBrazilIoni Bowcher QUALIFIED
Claire TollnerSpainAmy Elsner UNQUALIFIED
Francesco ShinkoCanadaOnyama Limba PROPOSAL
Deepesh ChuiArgentinaAsiya Javayant NEW
Emily WhobreyFranceAsiya Javayant NEGOTIATION
Stacey MacleadUnited KingdomOnyama Limba UNQUALIFIED
Jefferson SchemmerFranceStephen Shaw UNQUALIFIED
Julie StensethGermanyAnna Fali PROPOSAL
Jennifer AmigonArgentinaAnna Fali UNQUALIFIED
Deepesh ChuiArgentinaOnyama Limba NEW
Francesco ShinkoSpainAmy Elsner RENEWAL
Ricardo GauchoAustraliaXuxue Feng NEW
Ashley DoeCanadaIoni Bowcher NEGOTIATION
Johnson SergiUnited KingdomIvan Magalhaes PROPOSAL
Jones VocelkaUnited KingdomIoni Bowcher RENEWAL
Alejandro PerinArgentinaIvan Magalhaes NEGOTIATION
Munro FerenczJapanBernardo Dominic QUALIFIED
Chavez BriddickJapanIoni Bowcher UNQUALIFIED
Jones VocelkaBrazilElwin Sharvill QUALIFIED
Aditya KuskoGermanyBernardo Dominic PROPOSAL
Aika InouyeIndiaAsiya Javayant RENEWAL
Emily WhobreyArgentinaAmy Elsner RENEWAL
Greenwood BologniaIndiaXuxue Feng PROPOSAL
Greenwood BologniaUnited KingdomBernardo Dominic QUALIFIED
Aditya KuskoArgentinaXuxue Feng UNQUALIFIED
Tony FollerItalyAmy Elsner QUALIFIED
Francesco ShinkoIndiaAnna Fali RENEWAL
Julie StensethJapanAsiya Javayant QUALIFIED
Leon OldroydArgentinaBernardo Dominic PROPOSAL
Maria MarrierIndiaAmy Elsner NEGOTIATION
Costa DilliardArgentinaStephen Shaw NEGOTIATION
Leja CaldareraCanadaIoni Bowcher UNQUALIFIED
Mayumi KolmetzJapanXuxue Feng PROPOSAL
Rodrigues CampainIndiaOnyama Limba RENEWAL
Morrow RutaFranceAsiya Javayant UNQUALIFIED
Tony FollerCanadaIoni Bowcher RENEWAL
Ashley DoeJapanAnna Fali QUALIFIED
Mujtaba NickaArgentinaIoni Bowcher QUALIFIED
Clifford RimGermanyBernardo Dominic 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>