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 GillianBrazilIoni Bowcher NEGOTIATION
Aruna FigeroaCanadaAnna Fali NEGOTIATION
Jones VocelkaArgentinaBernardo Dominic NEGOTIATION
Julie StensethAustraliaIvan Magalhaes RENEWAL
Jennifer AmigonJapanOnyama Limba RENEWAL
Ivar PaprockiIndiaIoni Bowcher PROPOSAL
Clifford RimRussiaBernardo Dominic UNQUALIFIED
Clifford RimIndiaIoni Bowcher QUALIFIED
Mujtaba NickaRussiaAmy Elsner NEW
Antonio CaudyAustraliaXuxue Feng QUALIFIED
Aruna FigeroaArgentinaAmy Elsner UNQUALIFIED
Aruna FigeroaUnited KingdomElwin Sharvill QUALIFIED
Francesco ShinkoRussiaXuxue Feng UNQUALIFIED
Leja CaldareraBrazilElwin Sharvill PROPOSAL
Cody SaylorsJapanBernardo Dominic RENEWAL
Jefferson SchemmerGermanyXuxue Feng NEW
Nicolas IturbideJapanAmy Elsner NEW
Kadeem FlosiRussiaElwin Sharvill UNQUALIFIED
Ricardo GauchoBrazilAmy Elsner NEW
Aditya KuskoAustraliaXuxue Feng UNQUALIFIED
Isabel BowleyBrazilAnna Fali PROPOSAL
Kaitlin OstroskySpainXuxue Feng RENEWAL
James ButtFranceElwin Sharvill PROPOSAL
Morrow RutaAustraliaAmy Elsner QUALIFIED
Julie StensethRussiaElwin Sharvill NEGOTIATION
Murillo MaletArgentinaOnyama Limba PROPOSAL
Chavez BriddickArgentinaIvan Magalhaes QUALIFIED
Murillo MaletIndiaAnna Fali NEGOTIATION
Alejandro PerinRussiaAmy Elsner UNQUALIFIED
Octavia MaletSpainOnyama Limba RENEWAL
Aika InouyeSpainAsiya Javayant RENEWAL
Ivar PaprockiJapanAnna Fali UNQUALIFIED
Leon OldroydUnited KingdomIvan Magalhaes PROPOSAL
Aditya KuskoRussiaXuxue Feng NEW
Emily WhobreyBrazilElwin Sharvill NEGOTIATION
Julie StensethItalyAnna Fali PROPOSAL
Munro FerenczSpainElwin Sharvill PROPOSAL
Jeanfrancois VenereIndiaElwin Sharvill UNQUALIFIED
Faith GillianArgentinaAsiya Javayant QUALIFIED
Alejandro PerinSpainBernardo Dominic QUALIFIED
Tony FollerBrazilXuxue Feng QUALIFIED
Silvio SlusarskiArgentinaOnyama Limba PROPOSAL
Julie StensethArgentinaElwin Sharvill NEW
Mayumi KolmetzBrazilAsiya Javayant RENEWAL
Tony FollerCanadaAnna Fali NEGOTIATION
Aika InouyeItalyXuxue Feng NEW
Maisha RulapaughRussiaAmy Elsner UNQUALIFIED
Misaki RoysterSpainElwin Sharvill UNQUALIFIED
Chavez BriddickBrazilAmy Elsner QUALIFIED
Claire TollnerCanadaIvan Magalhaes RENEWAL
Horizontal
NameCountryRepresentativeStatus
Leja CaldareraCanadaIoni Bowcher PROPOSAL
Ivar PaprockiSpainElwin Sharvill PROPOSAL
Kaitlin OstroskyArgentinaAnna Fali NEGOTIATION
Octavia MaletFranceBernardo Dominic QUALIFIED
Claire TollnerGermanyAsiya Javayant UNQUALIFIED
Murillo MaletUnited KingdomBernardo Dominic NEGOTIATION
James ButtGermanyAmy Elsner NEGOTIATION
Darci PoquetteRussiaAnna Fali RENEWAL
Darci PoquetteArgentinaBernardo Dominic NEW
Costa DilliardFranceOnyama Limba UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Morrow RutaItaly2025-09-03Truhlar And Truhlar Attys UNQUALIFIED70Xuxue Feng
1001Ricardo GauchoJapan2025-09-03Buckley Miller Wright QUALIFIED67Ioni Bowcher
1002Nicolas IturbideFrance2025-09-06Feiner Bros QUALIFIED21Amy Elsner
1003Aruna FigeroaGermany2025-08-20Truhlar And Truhlar Attys QUALIFIED56Asiya Javayant
1004Munro FerenczAustralia2025-08-31Chemel, James L Cpa QUALIFIED75Stephen Shaw
1005Jones VocelkaItaly2025-08-22Commercial Press PROPOSAL31Xuxue Feng
1006Arvin AlbaresItaly2025-08-26Rangoni Of Florence NEGOTIATION18Anna Fali
1007Jefferson SchemmerSpain2025-09-11Benton, John B Jr NEW35Amy Elsner
1008Alejandro PerinAustralia2025-09-12King, Christopher A Esq UNQUALIFIED26Ioni Bowcher
1009Chavez BriddickArgentina2025-08-27Chemel, James L Cpa QUALIFIED96Onyama Limba
1010Ivar PaprockiItaly2025-09-05Chanay, Jeffrey A Esq NEW77Ivan Magalhaes
1011Adams MorascaAustralia2025-08-25Chapman, Ross E Esq QUALIFIED71Anna Fali
1012Julie StensethSpain2025-08-18Buckley Miller Wright QUALIFIED7Onyama Limba
1013Aditya KuskoRussia2025-08-19Chapman, Ross E Esq NEW42Xuxue Feng
1014Mujtaba NickaRussia2025-08-30Truhlar And Truhlar Attys PROPOSAL89Xuxue Feng
1015Deepesh ChuiFrance2025-09-06Chapman, Ross E Esq RENEWAL29Asiya Javayant
1016Munro FerenczBrazil2025-09-05Buckley Miller Wright QUALIFIED43Stephen Shaw
1017Silvio SlusarskiGermany2025-09-08Commercial Press NEGOTIATION60Stephen Shaw
1018Maria MarrierIndia2025-09-10Chanay, Jeffrey A Esq NEGOTIATION59Onyama Limba
1019Chavez BriddickIndia2025-08-23Buckley Miller Wright NEGOTIATION84Ioni Bowcher
1020Jefferson SchemmerSpain2025-09-05Rangoni Of Florence NEGOTIATION37Bernardo Dominic
1021Murillo MaletJapan2025-09-07Chapman, Ross E Esq UNQUALIFIED9Bernardo Dominic
1022Arvin AlbaresUnited Kingdom2025-08-16Morlong Associates PROPOSAL22Elwin Sharvill
1023Jones VocelkaSpain2025-08-19Rangoni Of Florence UNQUALIFIED49Ivan Magalhaes
1024Maisha RulapaughGermany2025-08-25Chapman, Ross E Esq PROPOSAL95Elwin Sharvill
1025Cody SaylorsFrance2025-08-25Feiner Bros NEGOTIATION38Xuxue Feng
1026Morrow RutaAustralia2025-08-29Truhlar And Truhlar Attys PROPOSAL22Ivan Magalhaes
1027Francesco ShinkoSpain2025-08-24Truhlar And Truhlar Attys NEW89Asiya Javayant
1028David DarakjyRussia2025-08-20Feiner Bros RENEWAL36Asiya Javayant
1029Costa DilliardCanada2025-08-21Commercial Press UNQUALIFIED23Amy Elsner
1030Alejandro PerinSpain2025-09-04King, Christopher A Esq QUALIFIED29Anna Fali
1031Leja CaldareraRussia2025-09-09Printing Dimensions QUALIFIED20Ioni Bowcher
1032Emily WhobreyCanada2025-08-22Commercial Press UNQUALIFIED71Amy Elsner
1033Faith GillianFrance2025-09-10Chemel, James L Cpa RENEWAL98Asiya Javayant
1034Cody SaylorsSpain2025-09-01Commercial Press UNQUALIFIED3Anna Fali
1035Jennifer AmigonItaly2025-09-07Rangoni Of Florence NEGOTIATION59Ivan Magalhaes
1036Aika InouyeRussia2025-09-14Chemel, James L Cpa PROPOSAL76Anna Fali
1037James ButtFrance2025-09-10King, Christopher A Esq UNQUALIFIED38Xuxue Feng
1038Jeanfrancois VenereItaly2025-09-05Chemel, James L Cpa NEGOTIATION15Anna Fali
1039Emily WhobreyJapan2025-09-07Buckley Miller Wright NEGOTIATION28Ioni Bowcher
1040Morrow RutaItaly2025-09-10Truhlar And Truhlar Attys RENEWAL21Amy Elsner
1041Izzy GarufiRussia2025-08-16Morlong Associates RENEWAL42Asiya Javayant
1042Maria MarrierGermany2025-09-02Buckley Miller Wright UNQUALIFIED56Stephen Shaw
1043Juan WieserAustralia2025-09-02Rangoni Of Florence RENEWAL67Ivan Magalhaes
1044Jefferson SchemmerItaly2025-09-05Chemel, James L Cpa QUALIFIED45Elwin Sharvill
1045Aika InouyeFrance2025-08-31Chanay, Jeffrey A Esq UNQUALIFIED1Asiya Javayant
1046Aditya KuskoArgentina2025-09-14Chanay, Jeffrey A Esq UNQUALIFIED11Amy Elsner
1047Munro FerenczBrazil2025-08-16Buckley Miller Wright UNQUALIFIED80Ivan Magalhaes
1048Mujtaba NickaItaly2025-08-23Benton, John B Jr UNQUALIFIED2Asiya Javayant
1049David DarakjyIndia2025-08-23Commercial Press RENEWAL72Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Ivar PaprockiCanadaAnna Fali NEW
Costa DilliardUnited KingdomOnyama Limba RENEWAL
Kaitlin OstroskyUnited KingdomBernardo Dominic QUALIFIED
Ivar PaprockiCanadaIoni Bowcher NEW
Jennifer AmigonBrazilAnna Fali QUALIFIED
Octavia MaletArgentinaAmy Elsner UNQUALIFIED
Clifford RimUnited KingdomIvan Magalhaes UNQUALIFIED
Misaki RoysterItalyStephen Shaw QUALIFIED
Darci PoquetteArgentinaXuxue Feng PROPOSAL
Mujtaba NickaGermanyXuxue Feng RENEWAL
Maria MarrierArgentinaOnyama Limba UNQUALIFIED
Munro FerenczGermanyStephen Shaw PROPOSAL
Cody SaylorsGermanyAsiya Javayant RENEWAL
Mayumi KolmetzFranceBernardo Dominic NEGOTIATION
Mujtaba NickaJapanAmy Elsner UNQUALIFIED
Mayumi KolmetzArgentinaIvan Magalhaes QUALIFIED
Julie StensethItalyBernardo Dominic NEW
Cody SaylorsIndiaAmy Elsner QUALIFIED
Maria MarrierItalyAnna Fali NEGOTIATION
Darci PoquetteJapanIvan Magalhaes RENEWAL
Munro FerenczGermanyIvan Magalhaes NEW
Morrow RutaIndiaBernardo Dominic QUALIFIED
Aika InouyeIndiaOnyama Limba PROPOSAL
Munro FerenczRussiaIoni Bowcher PROPOSAL
Leja CaldareraAustraliaBernardo Dominic PROPOSAL
Aruna FigeroaRussiaIoni Bowcher RENEWAL
Misaki RoysterUnited KingdomElwin Sharvill PROPOSAL
Antonio CaudyJapanIvan Magalhaes NEGOTIATION
Antonio CaudyFranceBernardo Dominic RENEWAL
Kaitlin OstroskyBrazilIvan Magalhaes PROPOSAL
Aditya KuskoJapanIoni Bowcher NEW
Maria MarrierArgentinaAnna Fali UNQUALIFIED
Darci PoquetteCanadaXuxue Feng NEW
Mayumi KolmetzSpainStephen Shaw NEW
Julie StensethJapanIvan Magalhaes QUALIFIED
Cody SaylorsAustraliaIvan Magalhaes QUALIFIED
Nicolas IturbideIndiaAsiya Javayant UNQUALIFIED
Morrow RutaFranceAsiya Javayant RENEWAL
Johnson SergiAustraliaIoni Bowcher NEGOTIATION
Darci PoquetteIndiaElwin Sharvill NEW
Nicolas IturbideRussiaAnna Fali PROPOSAL
Isabel BowleyArgentinaAmy Elsner PROPOSAL
Julie StensethFranceStephen Shaw QUALIFIED
Jefferson SchemmerAustraliaIoni Bowcher NEW
Jefferson SchemmerIndiaStephen Shaw NEW
Maria MarrierItalyIvan Magalhaes UNQUALIFIED
Aditya KuskoArgentinaAmy Elsner PROPOSAL
Kaitlin OstroskyFranceBernardo Dominic PROPOSAL
Deepesh ChuiRussiaAnna Fali PROPOSAL
Ricardo GauchoBrazilStephen Shaw RENEWAL
Frozen Columns
Name
Johnson Sergi
Kaitlin Ostrosky
Costa Dilliard
Leja Caldarera
Clifford Rim
Costa Dilliard
Ivar Paprocki
Jones Vocelka
Ashley Doe
Antonio Caudy
Tony Foller
Emily Whobrey
Tony Foller
Wickens Nestle
Stacey Maclead
Johnson Sergi
Morrow Ruta
James Butt
Juan Wieser
Leja Caldarera
Faith Gillian
Maisha Rulapaugh
Aika Inouye
Maria Marrier
Isabel Bowley
Smith Glick
Isabel Bowley
Tony Foller
Silvio Slusarski
Aruna Figeroa
Adams Morasca
Alejandro Perin
Nicolas Iturbide
Ricardo Gaucho
Mujtaba Nicka
Wickens Nestle
Deepesh Chui
Juan Wieser
Salvatore Stockham
Leja Caldarera
Aditya Kusko
Stacey Maclead
David Darakjy
Mayumi Kolmetz
Murillo Malet
Adams Morasca
Smith Glick
Ricardo Gaucho
David Darakjy
Ricardo Gaucho
IdCountryDate
1000Russia2025-09-06
1001Canada2025-08-16
1002Spain2025-09-02
1003Russia2025-09-09
1004Italy2025-08-24
1005Russia2025-09-05
1006Russia2025-08-30
1007Canada2025-08-22
1008Russia2025-09-05
1009Spain2025-08-16
1010Japan2025-08-16
1011Argentina2025-08-19
1012United Kingdom2025-09-06
1013Russia2025-08-31
1014Japan2025-09-14
1015Canada2025-09-06
1016United Kingdom2025-09-01
1017India2025-08-20
1018Canada2025-09-03
1019France2025-09-02
1020India2025-08-21
1021Argentina2025-08-30
1022Brazil2025-08-27
1023Italy2025-09-11
1024Japan2025-09-13
1025Germany2025-08-24
1026Canada2025-09-11
1027Japan2025-09-06
1028Germany2025-08-21
1029Brazil2025-08-24
1030India2025-09-14
1031Japan2025-08-20
1032Japan2025-09-12
1033Canada2025-08-26
1034Brazil2025-09-14
1035Russia2025-09-05
1036Argentina2025-09-14
1037Argentina2025-08-26
1038Spain2025-09-07
1039Brazil2025-09-09
1040Japan2025-08-22
1041Spain2025-09-06
1042Brazil2025-09-03
1043Germany2025-08-27
1044Argentina2025-08-20
1045Argentina2025-09-13
1046Japan2025-09-02
1047Germany2025-08-19
1048Germany2025-08-20
1049Germany2025-08-18

On-Demand Data

NameIdCountryDate
Jones Vocelka1000Argentina2025-08-21
Deepesh Chui1001Brazil2025-08-27
Jeanfrancois Venere1002India2025-09-02
Silvio Slusarski1003Brazil2025-09-05
Wickens Nestle1004Brazil2025-09-06
Mujtaba Nicka1005Canada2025-09-03
Jennifer Amigon1006Australia2025-08-28
Leon Oldroyd1007Brazil2025-09-12
Octavia Malet1008Spain2025-08-29
Leja Caldarera1009Spain2025-08-27
David Darakjy1010Italy2025-09-08
Emily Whobrey1011Spain2025-09-02
Costa Dilliard1012Spain2025-09-10
Mayumi Kolmetz1013Germany2025-08-30
Octavia Malet1014Spain2025-09-08
Izzy Garufi1015Brazil2025-08-27
Kadeem Flosi1016Spain2025-09-06
Wickens Nestle1017United Kingdom2025-08-29
Adams Morasca1018Spain2025-08-26
James Butt1019Spain2025-09-11
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Cody SaylorsGermanyIvan Magalhaes UNQUALIFIED
Alejandro PerinSpainAmy Elsner NEGOTIATION
Stacey MacleadUnited KingdomElwin Sharvill NEW
Faith GillianSpainXuxue Feng NEW
Jones VocelkaFranceXuxue Feng PROPOSAL
Arvin AlbaresBrazilIvan Magalhaes NEGOTIATION
Antonio CaudyItalyXuxue Feng NEGOTIATION
Tony FollerFranceAsiya Javayant QUALIFIED
Claire TollnerRussiaIoni Bowcher RENEWAL
Wickens NestleGermanyOnyama Limba PROPOSAL
Wickens NestleJapanElwin Sharvill UNQUALIFIED
Greenwood BologniaCanadaIvan Magalhaes PROPOSAL
Jones VocelkaCanadaOnyama Limba QUALIFIED
Aika InouyeSpainIoni Bowcher NEW
Darci PoquetteJapanAsiya Javayant NEW
Octavia MaletCanadaIoni Bowcher NEGOTIATION
Aika InouyeItalyAsiya Javayant QUALIFIED
Juan WieserSpainOnyama Limba PROPOSAL
Rodrigues CampainIndiaAsiya Javayant UNQUALIFIED
Julie StensethFranceBernardo Dominic NEW
Ivar PaprockiGermanyOnyama Limba QUALIFIED
Stacey MacleadUnited KingdomAmy Elsner NEGOTIATION
Leja CaldareraJapanAmy Elsner RENEWAL
Kadeem FlosiBrazilBernardo Dominic NEGOTIATION
Ivar PaprockiAustraliaIoni Bowcher QUALIFIED
Octavia MaletFranceStephen Shaw NEGOTIATION
Jefferson SchemmerItalyAsiya Javayant NEW
Ashley DoeBrazilIoni Bowcher QUALIFIED
Jennifer AmigonBrazilStephen Shaw UNQUALIFIED
Kaitlin OstroskyRussiaBernardo Dominic PROPOSAL
Octavia MaletJapanAmy Elsner NEW
Sinclair WaycottArgentinaStephen Shaw PROPOSAL
Jones VocelkaIndiaOnyama Limba UNQUALIFIED
Costa DilliardCanadaOnyama Limba PROPOSAL
Mayumi KolmetzRussiaAsiya Javayant RENEWAL
Isabel BowleyArgentinaStephen Shaw RENEWAL
Misaki RoysterUnited KingdomStephen Shaw NEW
James ButtArgentinaBernardo Dominic QUALIFIED
Nicolas IturbideArgentinaXuxue Feng RENEWAL
Claire TollnerBrazilBernardo Dominic 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>