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 GillianArgentinaXuxue Feng PROPOSAL
Kadeem FlosiFranceIvan Magalhaes NEW
Salvatore StockhamCanadaIoni Bowcher QUALIFIED
Aditya KuskoCanadaXuxue Feng QUALIFIED
Adams MorascaFranceOnyama Limba NEGOTIATION
Jones VocelkaIndiaIoni Bowcher NEW
Arvin AlbaresItalyXuxue Feng QUALIFIED
Leja CaldareraGermanyBernardo Dominic NEGOTIATION
David DarakjyUnited KingdomElwin Sharvill QUALIFIED
Faith GillianFranceAmy Elsner NEW
Maria MarrierGermanyIvan Magalhaes NEGOTIATION
Alejandro PerinUnited KingdomXuxue Feng PROPOSAL
Misaki RoysterGermanyStephen Shaw UNQUALIFIED
Darci PoquetteIndiaAsiya Javayant NEW
Darci PoquetteJapanStephen Shaw RENEWAL
Ivar PaprockiBrazilIoni Bowcher QUALIFIED
Jennifer AmigonIndiaXuxue Feng QUALIFIED
Ricardo GauchoCanadaStephen Shaw UNQUALIFIED
Tony FollerFranceElwin Sharvill NEW
Salvatore StockhamJapanAmy Elsner RENEWAL
Emily WhobreyItalyAsiya Javayant NEGOTIATION
Kaitlin OstroskyGermanyIvan Magalhaes QUALIFIED
Aruna FigeroaArgentinaIoni Bowcher NEGOTIATION
Smith GlickUnited KingdomXuxue Feng RENEWAL
Smith GlickRussiaOnyama Limba QUALIFIED
Izzy GarufiGermanyIoni Bowcher NEGOTIATION
Aditya KuskoItalyBernardo Dominic UNQUALIFIED
Isabel BowleyJapanIoni Bowcher NEGOTIATION
Munro FerenczFranceXuxue Feng QUALIFIED
Tony FollerAustraliaStephen Shaw NEW
Emily WhobreyUnited KingdomIoni Bowcher NEW
Cody SaylorsJapanOnyama Limba RENEWAL
Ashley DoeGermanyBernardo Dominic NEW
Ricardo GauchoCanadaAsiya Javayant RENEWAL
Chavez BriddickJapanBernardo Dominic UNQUALIFIED
Rodrigues CampainCanadaOnyama Limba RENEWAL
James ButtFranceStephen Shaw PROPOSAL
Cody SaylorsArgentinaStephen Shaw RENEWAL
Maria MarrierRussiaAsiya Javayant QUALIFIED
Jones VocelkaAustraliaIoni Bowcher UNQUALIFIED
Ashley DoeAustraliaElwin Sharvill UNQUALIFIED
David DarakjyIndiaBernardo Dominic PROPOSAL
Isabel BowleyUnited KingdomIvan Magalhaes PROPOSAL
Murillo MaletGermanyAmy Elsner RENEWAL
Deepesh ChuiSpainElwin Sharvill QUALIFIED
Juan WieserJapanOnyama Limba NEW
Chavez BriddickCanadaAmy Elsner NEGOTIATION
Ricardo GauchoCanadaIoni Bowcher RENEWAL
Smith GlickItalyBernardo Dominic NEGOTIATION
Isabel BowleyItalyAsiya Javayant UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Francesco ShinkoSpainXuxue Feng RENEWAL
Rodrigues CampainGermanyXuxue Feng NEGOTIATION
Maisha RulapaughRussiaIoni Bowcher UNQUALIFIED
David DarakjyFranceStephen Shaw UNQUALIFIED
Leja CaldareraAustraliaOnyama Limba QUALIFIED
Wickens NestleJapanIvan Magalhaes UNQUALIFIED
Munro FerenczCanadaElwin Sharvill NEW
Antonio CaudyItalyStephen Shaw QUALIFIED
Aika InouyeIndiaAmy Elsner RENEWAL
Julie StensethFranceOnyama Limba QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Murillo MaletItaly2025-09-22Dorl, James J Esq PROPOSAL93Ioni Bowcher
1001Jones VocelkaBrazil2025-10-05Printing Dimensions QUALIFIED83Bernardo Dominic
1002Maisha RulapaughSpain2025-10-11Rangoni Of Florence PROPOSAL59Bernardo Dominic
1003Jeanfrancois VenereCanada2025-09-19Truhlar And Truhlar Attys UNQUALIFIED48Stephen Shaw
1004Mujtaba NickaRussia2025-09-30Dorl, James J Esq NEW16Ivan Magalhaes
1005Silvio SlusarskiFrance2025-09-22Feiner Bros NEW33Xuxue Feng
1006Leja CaldareraJapan2025-10-12Buckley Miller Wright QUALIFIED3Elwin Sharvill
1007Jennifer AmigonFrance2025-10-12King, Christopher A Esq NEW15Anna Fali
1008Julie StensethRussia2025-10-06Feltz Printing Service UNQUALIFIED66Bernardo Dominic
1009Leja CaldareraArgentina2025-09-27King, Christopher A Esq PROPOSAL24Bernardo Dominic
1010Ashley DoeJapan2025-10-07Commercial Press RENEWAL86Bernardo Dominic
1011Tony FollerArgentina2025-10-12Benton, John B Jr NEW41Anna Fali
1012Jones VocelkaCanada2025-09-26Rousseaux, Michael Esq NEGOTIATION44Onyama Limba
1013Antonio CaudyUnited Kingdom2025-10-12Printing Dimensions RENEWAL10Stephen Shaw
1014Sinclair WaycottAustralia2025-09-26King, Christopher A Esq NEW60Ioni Bowcher
1015Aika InouyeIndia2025-10-09Dorl, James J Esq PROPOSAL59Ioni Bowcher
1016Tony FollerFrance2025-09-28Printing Dimensions RENEWAL58Bernardo Dominic
1017Claire TollnerJapan2025-10-07Benton, John B Jr QUALIFIED85Amy Elsner
1018Kaitlin OstroskyIndia2025-09-24Truhlar And Truhlar Attys NEW80Ioni Bowcher
1019Octavia MaletAustralia2025-10-18Chemel, James L Cpa PROPOSAL98Stephen Shaw
1020Nicolas IturbideUnited Kingdom2025-10-18Printing Dimensions UNQUALIFIED22Asiya Javayant
1021Nicolas IturbideRussia2025-09-21Dorl, James J Esq QUALIFIED11Asiya Javayant
1022Aika InouyeBrazil2025-10-18Benton, John B Jr PROPOSAL72Asiya Javayant
1023Misaki RoysterUnited Kingdom2025-09-30Feiner Bros UNQUALIFIED90Xuxue Feng
1024Jeanfrancois VenereBrazil2025-09-23King, Christopher A Esq PROPOSAL26Onyama Limba
1025David DarakjyAustralia2025-09-21Chapman, Ross E Esq NEW10Bernardo Dominic
1026Sinclair WaycottSpain2025-09-24King, Christopher A Esq NEW60Xuxue Feng
1027Clifford RimJapan2025-10-11Chemel, James L Cpa RENEWAL54Amy Elsner
1028Clifford RimArgentina2025-10-15Chanay, Jeffrey A Esq RENEWAL23Stephen Shaw
1029Emily WhobreyGermany2025-10-06Chapman, Ross E Esq PROPOSAL47Anna Fali
1030Jennifer AmigonUnited Kingdom2025-09-27Morlong Associates QUALIFIED92Anna Fali
1031Murillo MaletSpain2025-10-07Commercial Press NEW67Elwin Sharvill
1032David DarakjyCanada2025-10-18Chemel, James L Cpa PROPOSAL38Asiya Javayant
1033Mujtaba NickaAustralia2025-10-12Printing Dimensions RENEWAL90Bernardo Dominic
1034Julie StensethCanada2025-10-04King, Christopher A Esq UNQUALIFIED94Onyama Limba
1035Mayumi KolmetzArgentina2025-09-28Feiner Bros PROPOSAL31Anna Fali
1036Antonio CaudyBrazil2025-09-30Benton, John B Jr NEGOTIATION31Asiya Javayant
1037Arvin AlbaresFrance2025-10-17Buckley Miller Wright NEW91Ivan Magalhaes
1038Julie StensethGermany2025-10-15Rousseaux, Michael Esq QUALIFIED22Amy Elsner
1039Wickens NestleSpain2025-10-17King, Christopher A Esq RENEWAL75Stephen Shaw
1040Jones VocelkaIndia2025-10-11Chapman, Ross E Esq PROPOSAL73Ioni Bowcher
1041Mujtaba NickaSpain2025-09-20Morlong Associates QUALIFIED24Bernardo Dominic
1042Nicolas IturbideUnited Kingdom2025-09-23Chemel, James L Cpa PROPOSAL51Amy Elsner
1043Leja CaldareraGermany2025-09-28Feltz Printing Service QUALIFIED28Ioni Bowcher
1044Darci PoquetteArgentina2025-10-18Chemel, James L Cpa NEW60Amy Elsner
1045Misaki RoysterIndia2025-09-19Commercial Press NEW78Elwin Sharvill
1046Jeanfrancois VenereFrance2025-09-19Chanay, Jeffrey A Esq NEGOTIATION20Ivan Magalhaes
1047Misaki RoysterCanada2025-10-16Dorl, James J Esq NEW5Xuxue Feng
1048David DarakjySpain2025-09-28Buckley Miller Wright UNQUALIFIED86Xuxue Feng
1049Morrow RutaCanada2025-09-19Printing Dimensions QUALIFIED77Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Isabel BowleyIndiaAmy Elsner PROPOSAL
Maisha RulapaughArgentinaElwin Sharvill RENEWAL
Leja CaldareraJapanStephen Shaw NEW
Emily WhobreyIndiaAnna Fali QUALIFIED
Arvin AlbaresSpainIoni Bowcher PROPOSAL
Cody SaylorsRussiaIvan Magalhaes NEW
Francesco ShinkoUnited KingdomAsiya Javayant NEGOTIATION
Sinclair WaycottItalyAmy Elsner PROPOSAL
Silvio SlusarskiCanadaAmy Elsner QUALIFIED
Antonio CaudyGermanyIoni Bowcher NEGOTIATION
Aruna FigeroaBrazilXuxue Feng UNQUALIFIED
Nicolas IturbideUnited KingdomAsiya Javayant NEGOTIATION
Nicolas IturbideArgentinaIvan Magalhaes NEW
David DarakjyGermanyXuxue Feng NEW
Adams MorascaGermanyElwin Sharvill NEGOTIATION
Ashley DoeGermanyIvan Magalhaes PROPOSAL
Ricardo GauchoArgentinaStephen Shaw RENEWAL
James ButtAustraliaAmy Elsner UNQUALIFIED
Smith GlickJapanIvan Magalhaes NEGOTIATION
Faith GillianRussiaBernardo Dominic QUALIFIED
Jennifer AmigonSpainElwin Sharvill NEW
Maria MarrierGermanyAnna Fali QUALIFIED
Jeanfrancois VenereFranceIvan Magalhaes NEGOTIATION
Octavia MaletItalyElwin Sharvill RENEWAL
Darci PoquetteCanadaXuxue Feng NEGOTIATION
Octavia MaletIndiaAmy Elsner UNQUALIFIED
Jefferson SchemmerFranceIoni Bowcher QUALIFIED
Sinclair WaycottUnited KingdomBernardo Dominic UNQUALIFIED
Johnson SergiCanadaOnyama Limba QUALIFIED
Leja CaldareraJapanAnna Fali UNQUALIFIED
Silvio SlusarskiFranceOnyama Limba PROPOSAL
Chavez BriddickIndiaIoni Bowcher QUALIFIED
Faith GillianFranceIoni Bowcher QUALIFIED
Francesco ShinkoArgentinaAsiya Javayant QUALIFIED
Isabel BowleyJapanAnna Fali NEW
Clifford RimItalyIoni Bowcher NEGOTIATION
Mayumi KolmetzBrazilAnna Fali NEW
Clifford RimJapanIoni Bowcher QUALIFIED
Kadeem FlosiItalyBernardo Dominic NEGOTIATION
Aruna FigeroaAustraliaIoni Bowcher QUALIFIED
Jeanfrancois VenereAustraliaStephen Shaw NEW
Ivar PaprockiIndiaAmy Elsner QUALIFIED
Faith GillianBrazilAnna Fali QUALIFIED
Jones VocelkaSpainAsiya Javayant NEGOTIATION
Silvio SlusarskiRussiaIvan Magalhaes UNQUALIFIED
Ivar PaprockiJapanIvan Magalhaes UNQUALIFIED
Darci PoquetteAustraliaAmy Elsner QUALIFIED
Stacey MacleadAustraliaIoni Bowcher NEW
Jeanfrancois VenereBrazilAmy Elsner UNQUALIFIED
Isabel BowleyItalyStephen Shaw NEGOTIATION
Frozen Columns
Name
Stacey Maclead
Leon Oldroyd
Leja Caldarera
Kaitlin Ostrosky
Ricardo Gaucho
Clifford Rim
Costa Dilliard
Faith Gillian
Jeanfrancois Venere
Kadeem Flosi
Nicolas Iturbide
Deepesh Chui
Emily Whobrey
David Darakjy
Johnson Sergi
Adams Morasca
Adams Morasca
Greenwood Bolognia
Jones Vocelka
Leja Caldarera
Cody Saylors
Deepesh Chui
Alejandro Perin
Kadeem Flosi
Munro Ferencz
Julie Stenseth
Rodrigues Campain
Nicolas Iturbide
Adams Morasca
Leja Caldarera
Aruna Figeroa
Antonio Caudy
Smith Glick
Ivar Paprocki
Kaitlin Ostrosky
Faith Gillian
Tony Foller
Aditya Kusko
Faith Gillian
Clifford Rim
Costa Dilliard
Ivar Paprocki
Johnson Sergi
Morrow Ruta
Kadeem Flosi
Maria Marrier
Ivar Paprocki
Cody Saylors
Emily Whobrey
Francesco Shinko
IdCountryDate
1000Australia2025-10-15
1001Germany2025-09-24
1002Germany2025-10-06
1003India2025-10-03
1004Russia2025-09-21
1005Argentina2025-10-03
1006United Kingdom2025-10-11
1007United Kingdom2025-10-17
1008Brazil2025-10-08
1009Spain2025-09-25
1010United Kingdom2025-10-17
1011Canada2025-09-30
1012Brazil2025-09-26
1013Brazil2025-09-23
1014India2025-10-13
1015Spain2025-09-20
1016Russia2025-09-28
1017France2025-09-21
1018Russia2025-10-07
1019United Kingdom2025-09-23
1020Argentina2025-10-04
1021Italy2025-10-13
1022Germany2025-10-11
1023Japan2025-09-25
1024Japan2025-10-17
1025United Kingdom2025-09-30
1026Brazil2025-10-05
1027Italy2025-10-07
1028Canada2025-10-18
1029Argentina2025-10-16
1030Germany2025-10-15
1031Canada2025-09-22
1032Russia2025-09-29
1033France2025-09-25
1034Australia2025-10-18
1035Germany2025-10-04
1036Brazil2025-09-21
1037Australia2025-10-06
1038Russia2025-09-22
1039Brazil2025-10-15
1040Brazil2025-09-21
1041Japan2025-09-23
1042Argentina2025-09-20
1043Spain2025-10-04
1044Canada2025-09-24
1045Argentina2025-09-23
1046Italy2025-10-08
1047United Kingdom2025-09-21
1048United Kingdom2025-10-06
1049Brazil2025-09-27

On-Demand Data

NameIdCountryDate
Leja Caldarera1000India2025-09-19
Maisha Rulapaugh1001Brazil2025-10-14
Ricardo Gaucho1002Russia2025-10-08
Jefferson Schemmer1003United Kingdom2025-10-01
Kadeem Flosi1004Japan2025-10-08
Rodrigues Campain1005Spain2025-10-10
Leon Oldroyd1006United Kingdom2025-10-15
Julie Stenseth1007France2025-10-17
Rodrigues Campain1008Russia2025-10-18
Morrow Ruta1009India2025-09-28
Sinclair Waycott1010Japan2025-10-10
Murillo Malet1011Spain2025-10-05
Mayumi Kolmetz1012India2025-10-03
Ivar Paprocki1013Germany2025-10-13
Greenwood Bolognia1014Argentina2025-09-24
Alejandro Perin1015Italy2025-09-29
Darci Poquette1016Japan2025-10-18
Ricardo Gaucho1017Brazil2025-09-24
Johnson Sergi1018France2025-09-23
Emily Whobrey1019Japan2025-09-29
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jennifer AmigonArgentinaIoni Bowcher UNQUALIFIED
Johnson SergiArgentinaElwin Sharvill UNQUALIFIED
Francesco ShinkoUnited KingdomElwin Sharvill QUALIFIED
Ricardo GauchoIndiaXuxue Feng UNQUALIFIED
Munro FerenczUnited KingdomAsiya Javayant NEW
Morrow RutaAustraliaBernardo Dominic QUALIFIED
Adams MorascaRussiaIoni Bowcher PROPOSAL
Chavez BriddickIndiaIoni Bowcher UNQUALIFIED
Julie StensethItalyElwin Sharvill PROPOSAL
Jones VocelkaBrazilXuxue Feng UNQUALIFIED
Costa DilliardJapanAnna Fali UNQUALIFIED
Faith GillianRussiaElwin Sharvill NEGOTIATION
Aika InouyeFranceElwin Sharvill UNQUALIFIED
Misaki RoysterCanadaAmy Elsner UNQUALIFIED
Misaki RoysterFranceIoni Bowcher QUALIFIED
Aditya KuskoItalyOnyama Limba PROPOSAL
Stacey MacleadFranceBernardo Dominic PROPOSAL
Maisha RulapaughBrazilElwin Sharvill NEGOTIATION
Leja CaldareraArgentinaAnna Fali QUALIFIED
Maria MarrierFranceBernardo Dominic RENEWAL
Aditya KuskoUnited KingdomXuxue Feng NEGOTIATION
Deepesh ChuiSpainIoni Bowcher PROPOSAL
Costa DilliardGermanyAnna Fali QUALIFIED
Smith GlickGermanyElwin Sharvill NEGOTIATION
Morrow RutaIndiaAnna Fali UNQUALIFIED
Emily WhobreyRussiaOnyama Limba UNQUALIFIED
Salvatore StockhamFranceOnyama Limba RENEWAL
Wickens NestleItalyElwin Sharvill RENEWAL
Wickens NestleItalyAnna Fali PROPOSAL
Julie StensethGermanyElwin Sharvill NEW
Johnson SergiRussiaIoni Bowcher QUALIFIED
Wickens NestleRussiaBernardo Dominic PROPOSAL
Isabel BowleyItalyElwin Sharvill PROPOSAL
Rodrigues CampainItalyStephen Shaw QUALIFIED
Ricardo GauchoAustraliaAmy Elsner UNQUALIFIED
Leon OldroydCanadaStephen Shaw PROPOSAL
Misaki RoysterBrazilXuxue Feng UNQUALIFIED
Antonio CaudyIndiaIvan Magalhaes NEGOTIATION
Darci PoquetteFranceOnyama Limba NEGOTIATION
Adams MorascaFranceBernardo Dominic PROPOSAL

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