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
Ivar PaprockiUnited KingdomXuxue Feng PROPOSAL
Julie StensethItalyElwin Sharvill NEGOTIATION
Aika InouyeIndiaXuxue Feng UNQUALIFIED
Ivar PaprockiItalyAmy Elsner NEGOTIATION
Leja CaldareraGermanyStephen Shaw NEGOTIATION
Chavez BriddickCanadaIoni Bowcher QUALIFIED
Arvin AlbaresSpainBernardo Dominic NEW
Silvio SlusarskiIndiaAsiya Javayant UNQUALIFIED
Ricardo GauchoFranceAmy Elsner QUALIFIED
Alejandro PerinGermanyElwin Sharvill NEW
Greenwood BologniaFranceBernardo Dominic UNQUALIFIED
Misaki RoysterAustraliaAmy Elsner RENEWAL
James ButtBrazilElwin Sharvill UNQUALIFIED
Morrow RutaIndiaElwin Sharvill QUALIFIED
Jefferson SchemmerIndiaElwin Sharvill UNQUALIFIED
Kaitlin OstroskyGermanyAsiya Javayant RENEWAL
Adams MorascaArgentinaOnyama Limba QUALIFIED
Ashley DoeItalyOnyama Limba NEW
Aika InouyeRussiaIoni Bowcher NEGOTIATION
David DarakjyRussiaAmy Elsner NEW
Mayumi KolmetzFranceAsiya Javayant NEGOTIATION
Chavez BriddickRussiaXuxue Feng PROPOSAL
Rodrigues CampainGermanyIoni Bowcher RENEWAL
Smith GlickUnited KingdomBernardo Dominic UNQUALIFIED
Octavia MaletJapanIvan Magalhaes NEGOTIATION
Murillo MaletBrazilElwin Sharvill NEGOTIATION
Izzy GarufiJapanStephen Shaw RENEWAL
Ricardo GauchoIndiaBernardo Dominic QUALIFIED
Mujtaba NickaIndiaIoni Bowcher NEW
Tony FollerGermanyStephen Shaw RENEWAL
Izzy GarufiSpainElwin Sharvill QUALIFIED
Morrow RutaUnited KingdomIoni Bowcher NEGOTIATION
Cody SaylorsArgentinaXuxue Feng QUALIFIED
Jones VocelkaSpainAnna Fali QUALIFIED
Antonio CaudyAustraliaXuxue Feng NEW
Jones VocelkaArgentinaStephen Shaw NEW
Ivar PaprockiSpainElwin Sharvill NEW
Jeanfrancois VenereIndiaXuxue Feng RENEWAL
Murillo MaletAustraliaAnna Fali UNQUALIFIED
Kadeem FlosiJapanIoni Bowcher QUALIFIED
Emily WhobreyAustraliaXuxue Feng NEW
Chavez BriddickItalyOnyama Limba PROPOSAL
David DarakjyArgentinaIoni Bowcher NEGOTIATION
Mayumi KolmetzRussiaAmy Elsner UNQUALIFIED
Arvin AlbaresSpainIvan Magalhaes NEGOTIATION
Ashley DoeGermanyXuxue Feng NEGOTIATION
Mujtaba NickaCanadaStephen Shaw QUALIFIED
Wickens NestleIndiaXuxue Feng NEGOTIATION
Ricardo GauchoRussiaXuxue Feng QUALIFIED
Kadeem FlosiCanadaStephen Shaw RENEWAL
Horizontal
NameCountryRepresentativeStatus
Johnson SergiRussiaAnna Fali PROPOSAL
Kadeem FlosiIndiaBernardo Dominic QUALIFIED
Morrow RutaArgentinaBernardo Dominic PROPOSAL
Faith GillianJapanIoni Bowcher QUALIFIED
Silvio SlusarskiBrazilBernardo Dominic UNQUALIFIED
Wickens NestleItalyAsiya Javayant RENEWAL
Leja CaldareraUnited KingdomBernardo Dominic UNQUALIFIED
Smith GlickItalyAnna Fali QUALIFIED
Wickens NestleFranceIoni Bowcher UNQUALIFIED
David DarakjyAustraliaIoni Bowcher UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000David DarakjyCanada2025-10-07King, Christopher A Esq NEW74Anna Fali
1001Octavia MaletIndia2025-10-27Dorl, James J Esq PROPOSAL88Ioni Bowcher
1002Emily WhobreyBrazil2025-10-19Chapman, Ross E Esq NEGOTIATION37Stephen Shaw
1003Aruna FigeroaAustralia2025-10-18Chanay, Jeffrey A Esq UNQUALIFIED87Anna Fali
1004Emily WhobreyRussia2025-10-06Rousseaux, Michael Esq UNQUALIFIED21Onyama Limba
1005Antonio CaudyUnited Kingdom2025-10-16Rangoni Of Florence PROPOSAL84Stephen Shaw
1006Jones VocelkaGermany2025-10-19Feiner Bros UNQUALIFIED45Onyama Limba
1007Emily WhobreyRussia2025-10-11Feiner Bros NEGOTIATION63Amy Elsner
1008Sinclair WaycottFrance2025-10-17King, Christopher A Esq QUALIFIED26Ioni Bowcher
1009Morrow RutaGermany2025-10-27King, Christopher A Esq NEGOTIATION48Ioni Bowcher
1010Ivar PaprockiIndia2025-10-11Morlong Associates PROPOSAL98Ioni Bowcher
1011Morrow RutaJapan2025-10-22Buckley Miller Wright UNQUALIFIED55Elwin Sharvill
1012James ButtSpain2025-10-09Rousseaux, Michael Esq NEW85Elwin Sharvill
1013Jefferson SchemmerAustralia2025-10-17Chemel, James L Cpa UNQUALIFIED85Amy Elsner
1014Octavia MaletJapan2025-10-25Chanay, Jeffrey A Esq QUALIFIED8Onyama Limba
1015Clifford RimAustralia2025-10-13Chapman, Ross E Esq QUALIFIED79Anna Fali
1016Francesco ShinkoGermany2025-10-22Rangoni Of Florence NEW42Asiya Javayant
1017Kaitlin OstroskyIndia2025-10-10Chapman, Ross E Esq QUALIFIED2Xuxue Feng
1018Juan WieserGermany2025-10-16Chemel, James L Cpa QUALIFIED65Bernardo Dominic
1019Jennifer AmigonGermany2025-10-07Printing Dimensions NEGOTIATION71Ioni Bowcher
1020Costa DilliardUnited Kingdom2025-10-20Benton, John B Jr UNQUALIFIED22Elwin Sharvill
1021Octavia MaletUnited Kingdom2025-10-23Rangoni Of Florence NEGOTIATION56Elwin Sharvill
1022Leon OldroydBrazil2025-10-26Chapman, Ross E Esq NEW46Stephen Shaw
1023Leon OldroydGermany2025-10-19Truhlar And Truhlar Attys PROPOSAL18Bernardo Dominic
1024Wickens NestleFrance2025-10-08Chapman, Ross E Esq QUALIFIED48Xuxue Feng
1025Kadeem FlosiFrance2025-10-10Chapman, Ross E Esq NEGOTIATION35Ivan Magalhaes
1026Kaitlin OstroskyFrance2025-10-09Chapman, Ross E Esq NEW8Anna Fali
1027Claire TollnerCanada2025-10-25Printing Dimensions RENEWAL91Ioni Bowcher
1028Maria MarrierArgentina2025-10-13King, Christopher A Esq QUALIFIED21Onyama Limba
1029Aika InouyeBrazil2025-10-27Buckley Miller Wright NEW76Bernardo Dominic
1030Wickens NestleArgentina2025-10-17Printing Dimensions UNQUALIFIED88Onyama Limba
1031Darci PoquetteBrazil2025-10-28King, Christopher A Esq QUALIFIED87Bernardo Dominic
1032Antonio CaudyAustralia2025-10-07Chemel, James L Cpa UNQUALIFIED88Elwin Sharvill
1033Costa DilliardItaly2025-10-28Chapman, Ross E Esq NEW39Bernardo Dominic
1034Kaitlin OstroskySpain2025-10-13Rangoni Of Florence UNQUALIFIED87Ioni Bowcher
1035Maria MarrierRussia2025-10-19Chapman, Ross E Esq NEW77Bernardo Dominic
1036Faith GillianFrance2025-10-16Buckley Miller Wright NEGOTIATION33Stephen Shaw
1037Sinclair WaycottAustralia2025-10-19Chemel, James L Cpa UNQUALIFIED49Stephen Shaw
1038Leon OldroydAustralia2025-10-09Truhlar And Truhlar Attys PROPOSAL0Ioni Bowcher
1039Faith GillianGermany2025-11-02Buckley Miller Wright NEGOTIATION64Bernardo Dominic
1040Wickens NestleCanada2025-10-16Benton, John B Jr PROPOSAL39Bernardo Dominic
1041Arvin AlbaresUnited Kingdom2025-10-27Rangoni Of Florence PROPOSAL58Anna Fali
1042Chavez BriddickArgentina2025-10-07Morlong Associates RENEWAL96Ivan Magalhaes
1043Chavez BriddickAustralia2025-10-28Commercial Press QUALIFIED22Anna Fali
1044Kadeem FlosiGermany2025-10-08Feiner Bros PROPOSAL26Ioni Bowcher
1045Emily WhobreyRussia2025-10-06Benton, John B Jr UNQUALIFIED77Elwin Sharvill
1046Adams MorascaIndia2025-10-08Printing Dimensions PROPOSAL26Ioni Bowcher
1047Jennifer AmigonUnited Kingdom2025-10-07Benton, John B Jr NEW17Ioni Bowcher
1048Aika InouyeGermany2025-10-13Printing Dimensions QUALIFIED77Stephen Shaw
1049Arvin AlbaresAustralia2025-10-14Commercial Press NEGOTIATION89Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Wickens NestleFranceOnyama Limba NEGOTIATION
Greenwood BologniaIndiaAnna Fali NEW
Adams MorascaCanadaElwin Sharvill QUALIFIED
Jones VocelkaSpainAnna Fali NEW
Faith GillianRussiaAsiya Javayant UNQUALIFIED
Jeanfrancois VenereSpainIvan Magalhaes NEGOTIATION
Isabel BowleyGermanyXuxue Feng RENEWAL
Munro FerenczBrazilIvan Magalhaes UNQUALIFIED
Chavez BriddickUnited KingdomElwin Sharvill NEW
Rodrigues CampainIndiaIvan Magalhaes QUALIFIED
Aruna FigeroaGermanyAsiya Javayant UNQUALIFIED
Jennifer AmigonArgentinaIvan Magalhaes NEGOTIATION
Rodrigues CampainIndiaIoni Bowcher PROPOSAL
Greenwood BologniaSpainOnyama Limba QUALIFIED
Munro FerenczFranceBernardo Dominic NEGOTIATION
Isabel BowleyJapanStephen Shaw PROPOSAL
Maisha RulapaughSpainIoni Bowcher UNQUALIFIED
Julie StensethGermanyIvan Magalhaes NEGOTIATION
Nicolas IturbideAustraliaStephen Shaw NEGOTIATION
Mujtaba NickaRussiaElwin Sharvill RENEWAL
Misaki RoysterIndiaOnyama Limba UNQUALIFIED
Adams MorascaUnited KingdomAnna Fali UNQUALIFIED
Mayumi KolmetzJapanElwin Sharvill RENEWAL
Murillo MaletFranceStephen Shaw QUALIFIED
Munro FerenczItalyIvan Magalhaes RENEWAL
Salvatore StockhamFranceBernardo Dominic RENEWAL
Morrow RutaBrazilStephen Shaw NEW
Cody SaylorsItalyAmy Elsner PROPOSAL
Julie StensethAustraliaStephen Shaw RENEWAL
Izzy GarufiSpainXuxue Feng UNQUALIFIED
Maria MarrierSpainAnna Fali UNQUALIFIED
Silvio SlusarskiItalyXuxue Feng QUALIFIED
James ButtIndiaBernardo Dominic PROPOSAL
Mayumi KolmetzFranceAmy Elsner NEW
Maisha RulapaughUnited KingdomOnyama Limba PROPOSAL
Kadeem FlosiSpainElwin Sharvill UNQUALIFIED
Johnson SergiFranceIoni Bowcher PROPOSAL
Mayumi KolmetzSpainIoni Bowcher PROPOSAL
Sinclair WaycottArgentinaAmy Elsner QUALIFIED
Munro FerenczSpainIoni Bowcher NEGOTIATION
Adams MorascaFranceOnyama Limba NEGOTIATION
Leon OldroydAustraliaAsiya Javayant NEGOTIATION
Deepesh ChuiCanadaElwin Sharvill NEGOTIATION
Maria MarrierFranceBernardo Dominic QUALIFIED
Claire TollnerBrazilAnna Fali QUALIFIED
Mujtaba NickaSpainOnyama Limba NEW
Arvin AlbaresJapanIvan Magalhaes RENEWAL
Ricardo GauchoCanadaAnna Fali UNQUALIFIED
Leja CaldareraBrazilIoni Bowcher PROPOSAL
Izzy GarufiIndiaAmy Elsner UNQUALIFIED
Frozen Columns
Name
David Darakjy
Clifford Rim
Deepesh Chui
Antonio Caudy
Wickens Nestle
Misaki Royster
Claire Tollner
Kadeem Flosi
Aditya Kusko
Leon Oldroyd
Jones Vocelka
Silvio Slusarski
Ashley Doe
James Butt
Morrow Ruta
Isabel Bowley
Costa Dilliard
Arvin Albares
Leon Oldroyd
Deepesh Chui
Johnson Sergi
Octavia Malet
Aruna Figeroa
Costa Dilliard
Misaki Royster
Isabel Bowley
Jeanfrancois Venere
Adams Morasca
James Butt
Arvin Albares
Maisha Rulapaugh
Jefferson Schemmer
Aruna Figeroa
Stacey Maclead
Sinclair Waycott
Octavia Malet
Jefferson Schemmer
Greenwood Bolognia
Ricardo Gaucho
Cody Saylors
Greenwood Bolognia
Francesco Shinko
Jennifer Amigon
Maria Marrier
Faith Gillian
Isabel Bowley
Johnson Sergi
Ricardo Gaucho
Costa Dilliard
Deepesh Chui
IdCountryDate
1000Canada2025-10-23
1001Germany2025-10-29
1002Germany2025-10-29
1003France2025-10-29
1004France2025-10-15
1005Canada2025-10-17
1006Brazil2025-10-10
1007Brazil2025-10-22
1008Spain2025-10-07
1009Spain2025-10-27
1010Russia2025-10-28
1011Russia2025-10-06
1012United Kingdom2025-10-15
1013Canada2025-11-01
1014Argentina2025-11-03
1015Japan2025-10-16
1016Japan2025-10-15
1017Spain2025-10-10
1018Russia2025-10-10
1019Russia2025-10-20
1020Japan2025-10-11
1021Japan2025-10-23
1022India2025-10-29
1023Brazil2025-10-14
1024United Kingdom2025-10-31
1025Canada2025-10-08
1026Russia2025-10-08
1027Spain2025-10-22
1028Germany2025-10-23
1029France2025-10-19
1030Spain2025-10-14
1031Brazil2025-10-31
1032Canada2025-10-28
1033Brazil2025-10-25
1034India2025-10-15
1035Russia2025-10-16
1036Japan2025-10-18
1037Australia2025-10-29
1038Italy2025-10-13
1039France2025-10-20
1040Australia2025-10-19
1041Brazil2025-10-25
1042Spain2025-10-16
1043United Kingdom2025-10-12
1044Germany2025-10-21
1045Australia2025-10-18
1046France2025-10-07
1047Spain2025-10-30
1048Italy2025-10-30
1049Canada2025-10-23

On-Demand Data

NameIdCountryDate
Francesco Shinko1000Germany2025-10-08
Izzy Garufi1001Argentina2025-10-22
Silvio Slusarski1002Argentina2025-10-24
Deepesh Chui1003India2025-10-30
Aditya Kusko1004Italy2025-11-02
Cody Saylors1005Japan2025-10-25
Izzy Garufi1006Argentina2025-11-03
Arvin Albares1007Australia2025-10-08
Aruna Figeroa1008Italy2025-11-03
Francesco Shinko1009Spain2025-11-03
Costa Dilliard1010Spain2025-10-17
Izzy Garufi1011Italy2025-10-20
Adams Morasca1012India2025-10-15
Faith Gillian1013Italy2025-10-27
Murillo Malet1014Argentina2025-10-18
Francesco Shinko1015India2025-10-28
Arvin Albares1016Australia2025-10-19
Murillo Malet1017Spain2025-10-13
Munro Ferencz1018France2025-10-13
Izzy Garufi1019Spain2025-10-18
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Cody SaylorsRussiaIoni Bowcher NEW
Cody SaylorsRussiaElwin Sharvill NEW
Jones VocelkaAustraliaElwin Sharvill NEW
Maisha RulapaughAustraliaBernardo Dominic UNQUALIFIED
Isabel BowleyBrazilXuxue Feng NEW
Mayumi KolmetzBrazilOnyama Limba UNQUALIFIED
Jeanfrancois VenereBrazilIvan Magalhaes NEGOTIATION
Nicolas IturbideItalyBernardo Dominic QUALIFIED
Silvio SlusarskiAustraliaIoni Bowcher NEW
Arvin AlbaresBrazilElwin Sharvill NEGOTIATION
Mujtaba NickaGermanyOnyama Limba NEGOTIATION
Ashley DoeFranceAnna Fali PROPOSAL
Ashley DoeJapanBernardo Dominic UNQUALIFIED
Silvio SlusarskiUnited KingdomXuxue Feng RENEWAL
Emily WhobreyArgentinaAsiya Javayant QUALIFIED
Mayumi KolmetzItalyIvan Magalhaes NEGOTIATION
Ivar PaprockiGermanyXuxue Feng PROPOSAL
Costa DilliardRussiaBernardo Dominic NEGOTIATION
David DarakjyItalyXuxue Feng QUALIFIED
Arvin AlbaresGermanyBernardo Dominic UNQUALIFIED
Claire TollnerItalyAnna Fali PROPOSAL
Aditya KuskoCanadaIoni Bowcher NEW
Arvin AlbaresGermanyAsiya Javayant RENEWAL
Jennifer AmigonSpainXuxue Feng RENEWAL
Faith GillianCanadaAnna Fali QUALIFIED
Mayumi KolmetzCanadaStephen Shaw PROPOSAL
Munro FerenczJapanAnna Fali RENEWAL
Leon OldroydIndiaIvan Magalhaes NEW
Mayumi KolmetzFranceAsiya Javayant NEGOTIATION
Nicolas IturbideBrazilOnyama Limba NEW
Johnson SergiAustraliaAmy Elsner UNQUALIFIED
Claire TollnerFranceElwin Sharvill UNQUALIFIED
Kadeem FlosiCanadaBernardo Dominic PROPOSAL
Arvin AlbaresIndiaAmy Elsner RENEWAL
Munro FerenczIndiaIvan Magalhaes NEGOTIATION
Stacey MacleadAustraliaXuxue Feng NEW
Greenwood BologniaJapanElwin Sharvill PROPOSAL
Cody SaylorsGermanyOnyama Limba RENEWAL
Mujtaba NickaIndiaOnyama Limba NEGOTIATION
David DarakjyArgentinaAsiya 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>