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
Deepesh ChuiItalyStephen Shaw PROPOSAL
Morrow RutaItalyBernardo Dominic NEGOTIATION
Munro FerenczItalyAmy Elsner RENEWAL
Maria MarrierFranceAmy Elsner UNQUALIFIED
Juan WieserGermanyXuxue Feng QUALIFIED
Murillo MaletFranceIoni Bowcher PROPOSAL
Jennifer AmigonUnited KingdomElwin Sharvill PROPOSAL
James ButtRussiaAmy Elsner UNQUALIFIED
Mujtaba NickaFranceOnyama Limba QUALIFIED
Aika InouyeJapanAnna Fali NEGOTIATION
Kaitlin OstroskyIndiaAmy Elsner NEGOTIATION
Nicolas IturbideGermanyAnna Fali NEGOTIATION
Tony FollerItalyIoni Bowcher QUALIFIED
Jones VocelkaSpainIoni Bowcher PROPOSAL
Mujtaba NickaItalyBernardo Dominic PROPOSAL
Cody SaylorsBrazilStephen Shaw UNQUALIFIED
Emily WhobreyJapanIoni Bowcher UNQUALIFIED
Kadeem FlosiSpainAmy Elsner NEW
James ButtRussiaStephen Shaw UNQUALIFIED
Ashley DoeIndiaBernardo Dominic NEW
Munro FerenczFranceAmy Elsner RENEWAL
Stacey MacleadIndiaBernardo Dominic NEGOTIATION
Ivar PaprockiSpainAmy Elsner RENEWAL
Arvin AlbaresFranceIvan Magalhaes UNQUALIFIED
Isabel BowleyFranceXuxue Feng RENEWAL
Greenwood BologniaCanadaElwin Sharvill QUALIFIED
Ricardo GauchoIndiaIoni Bowcher RENEWAL
Jefferson SchemmerIndiaIvan Magalhaes NEW
Leja CaldareraBrazilStephen Shaw NEGOTIATION
Kaitlin OstroskyUnited KingdomOnyama Limba QUALIFIED
Deepesh ChuiArgentinaAnna Fali NEGOTIATION
Chavez BriddickRussiaBernardo Dominic QUALIFIED
Kaitlin OstroskyRussiaOnyama Limba UNQUALIFIED
Rodrigues CampainSpainAsiya Javayant PROPOSAL
Maria MarrierUnited KingdomElwin Sharvill NEW
Misaki RoysterRussiaIvan Magalhaes NEGOTIATION
Mujtaba NickaIndiaIoni Bowcher UNQUALIFIED
Salvatore StockhamItalyAmy Elsner NEGOTIATION
Wickens NestleIndiaElwin Sharvill NEW
Wickens NestleUnited KingdomOnyama Limba PROPOSAL
Arvin AlbaresCanadaElwin Sharvill QUALIFIED
Johnson SergiIndiaAnna Fali RENEWAL
Smith GlickGermanyStephen Shaw NEGOTIATION
Faith GillianGermanyElwin Sharvill QUALIFIED
Arvin AlbaresItalyIoni Bowcher PROPOSAL
Misaki RoysterSpainBernardo Dominic QUALIFIED
Isabel BowleyRussiaIvan Magalhaes UNQUALIFIED
Ashley DoeBrazilBernardo Dominic QUALIFIED
Maria MarrierArgentinaIvan Magalhaes PROPOSAL
Greenwood BologniaRussiaIoni Bowcher UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Jeanfrancois VenereAustraliaAsiya Javayant NEW
Arvin AlbaresFranceAmy Elsner NEGOTIATION
Aika InouyeRussiaElwin Sharvill UNQUALIFIED
Julie StensethJapanIvan Magalhaes UNQUALIFIED
Leja CaldareraGermanyAsiya Javayant RENEWAL
Kaitlin OstroskyFranceBernardo Dominic QUALIFIED
Jefferson SchemmerGermanyStephen Shaw UNQUALIFIED
Jeanfrancois VenereFranceElwin Sharvill RENEWAL
Salvatore StockhamBrazilXuxue Feng UNQUALIFIED
Maria MarrierGermanyElwin Sharvill RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aditya KuskoIndia2026-04-05Rousseaux, Michael Esq QUALIFIED61Amy Elsner
1001Rodrigues CampainGermany2026-04-22Feltz Printing Service UNQUALIFIED94Ivan Magalhaes
1002Wickens NestleAustralia2026-04-05Chapman, Ross E Esq UNQUALIFIED67Asiya Javayant
1003Deepesh ChuiJapan2026-04-01Chanay, Jeffrey A Esq QUALIFIED74Elwin Sharvill
1004Smith GlickGermany2026-04-20Dorl, James J Esq RENEWAL99Xuxue Feng
1005David DarakjyAustralia2026-03-28Dorl, James J Esq QUALIFIED21Onyama Limba
1006Jefferson SchemmerFrance2026-04-19Benton, John B Jr NEGOTIATION49Stephen Shaw
1007Antonio CaudyAustralia2026-04-02King, Christopher A Esq NEW9Bernardo Dominic
1008Kadeem FlosiItaly2026-04-13Chapman, Ross E Esq QUALIFIED86Ivan Magalhaes
1009Arvin AlbaresSpain2026-04-01King, Christopher A Esq NEGOTIATION80Xuxue Feng
1010Kaitlin OstroskyArgentina2026-04-21Morlong Associates NEGOTIATION26Onyama Limba
1011Murillo MaletJapan2026-04-23Dorl, James J Esq QUALIFIED66Xuxue Feng
1012Smith GlickArgentina2026-04-02Chapman, Ross E Esq RENEWAL60Ivan Magalhaes
1013Silvio SlusarskiCanada2026-04-11Rangoni Of Florence QUALIFIED70Bernardo Dominic
1014Sinclair WaycottSpain2026-03-31Printing Dimensions UNQUALIFIED43Elwin Sharvill
1015Tony FollerCanada2026-04-01Dorl, James J Esq NEGOTIATION5Ivan Magalhaes
1016Juan WieserFrance2026-04-09Morlong Associates QUALIFIED60Asiya Javayant
1017Jefferson SchemmerSpain2026-04-11Truhlar And Truhlar Attys NEW15Anna Fali
1018Cody SaylorsIndia2026-04-24Feltz Printing Service NEGOTIATION29Ivan Magalhaes
1019Wickens NestleUnited Kingdom2026-04-14Chapman, Ross E Esq UNQUALIFIED53Bernardo Dominic
1020Misaki RoysterFrance2026-04-06Commercial Press QUALIFIED25Asiya Javayant
1021Adams MorascaGermany2026-04-21Benton, John B Jr NEW43Ivan Magalhaes
1022Smith GlickGermany2026-04-19Truhlar And Truhlar Attys QUALIFIED5Elwin Sharvill
1023Mujtaba NickaUnited Kingdom2026-04-21Commercial Press UNQUALIFIED28Bernardo Dominic
1024Ashley DoeItaly2026-04-22Rousseaux, Michael Esq NEW94Ioni Bowcher
1025Francesco ShinkoGermany2026-04-21Truhlar And Truhlar Attys NEW14Stephen Shaw
1026Misaki RoysterGermany2026-03-30Truhlar And Truhlar Attys QUALIFIED45Amy Elsner
1027Faith GillianUnited Kingdom2026-03-30Dorl, James J Esq NEGOTIATION87Anna Fali
1028Mayumi KolmetzCanada2026-04-18Chapman, Ross E Esq PROPOSAL83Xuxue Feng
1029Darci PoquetteSpain2026-04-01Feltz Printing Service NEW97Anna Fali
1030Wickens NestleUnited Kingdom2026-04-08Benton, John B Jr PROPOSAL61Asiya Javayant
1031Misaki RoysterBrazil2026-03-29King, Christopher A Esq NEW43Xuxue Feng
1032Leon OldroydSpain2026-04-03Morlong Associates UNQUALIFIED27Amy Elsner
1033James ButtGermany2026-04-25Morlong Associates NEW53Ioni Bowcher
1034Jones VocelkaJapan2026-03-31Benton, John B Jr UNQUALIFIED60Ivan Magalhaes
1035Misaki RoysterIndia2026-04-15Chemel, James L Cpa UNQUALIFIED7Onyama Limba
1036Juan WieserItaly2026-03-29Benton, John B Jr UNQUALIFIED42Ioni Bowcher
1037James ButtJapan2026-04-03Dorl, James J Esq RENEWAL41Xuxue Feng
1038Arvin AlbaresFrance2026-04-03Commercial Press NEW72Onyama Limba
1039Leon OldroydAustralia2026-03-29Chapman, Ross E Esq PROPOSAL82Asiya Javayant
1040Ricardo GauchoJapan2026-04-06Rangoni Of Florence NEGOTIATION9Onyama Limba
1041Clifford RimBrazil2026-04-20Commercial Press NEGOTIATION83Asiya Javayant
1042Munro FerenczSpain2026-04-01Benton, John B Jr PROPOSAL64Bernardo Dominic
1043Misaki RoysterCanada2026-04-10Truhlar And Truhlar Attys NEW6Xuxue Feng
1044Ashley DoeFrance2026-04-08Commercial Press QUALIFIED91Xuxue Feng
1045Faith GillianAustralia2026-04-19Truhlar And Truhlar Attys QUALIFIED62Xuxue Feng
1046Greenwood BologniaBrazil2026-04-19Chapman, Ross E Esq PROPOSAL21Onyama Limba
1047Tony FollerItaly2026-04-16Benton, John B Jr NEW92Elwin Sharvill
1048Jeanfrancois VenereUnited Kingdom2026-03-30Morlong Associates RENEWAL68Onyama Limba
1049Salvatore StockhamUnited Kingdom2026-04-24Rousseaux, Michael Esq NEGOTIATION38Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Emily WhobreySpainOnyama Limba QUALIFIED
Cody SaylorsAustraliaIvan Magalhaes NEW
Aruna FigeroaBrazilOnyama Limba NEGOTIATION
Ashley DoeSpainAsiya Javayant RENEWAL
Alejandro PerinItalyAnna Fali NEGOTIATION
Chavez BriddickArgentinaBernardo Dominic PROPOSAL
Tony FollerFranceIvan Magalhaes NEW
Wickens NestleItalyAsiya Javayant RENEWAL
Isabel BowleySpainAsiya Javayant RENEWAL
Octavia MaletGermanyAmy Elsner RENEWAL
Alejandro PerinCanadaIoni Bowcher QUALIFIED
David DarakjySpainIvan Magalhaes NEGOTIATION
Adams MorascaUnited KingdomAmy Elsner PROPOSAL
Isabel BowleyRussiaAnna Fali RENEWAL
Adams MorascaJapanIvan Magalhaes NEW
Jeanfrancois VenereItalyBernardo Dominic NEGOTIATION
Jeanfrancois VenereItalyIoni Bowcher UNQUALIFIED
Murillo MaletCanadaXuxue Feng PROPOSAL
Tony FollerItalyElwin Sharvill PROPOSAL
Maisha RulapaughSpainAsiya Javayant NEW
Emily WhobreyFranceXuxue Feng NEW
Cody SaylorsCanadaBernardo Dominic UNQUALIFIED
Isabel BowleyUnited KingdomXuxue Feng NEW
Kaitlin OstroskyRussiaIoni Bowcher PROPOSAL
Adams MorascaItalyAmy Elsner RENEWAL
Izzy GarufiIndiaAsiya Javayant UNQUALIFIED
Aditya KuskoGermanyAmy Elsner NEGOTIATION
Leja CaldareraCanadaStephen Shaw NEW
Leon OldroydGermanyElwin Sharvill RENEWAL
Izzy GarufiArgentinaXuxue Feng PROPOSAL
Nicolas IturbideRussiaOnyama Limba QUALIFIED
Mayumi KolmetzBrazilOnyama Limba NEGOTIATION
Kadeem FlosiUnited KingdomIoni Bowcher UNQUALIFIED
Clifford RimJapanIoni Bowcher QUALIFIED
Chavez BriddickJapanAnna Fali RENEWAL
Jones VocelkaBrazilAnna Fali QUALIFIED
Faith GillianArgentinaIoni Bowcher NEW
Silvio SlusarskiIndiaStephen Shaw QUALIFIED
Jones VocelkaGermanyBernardo Dominic NEW
Morrow RutaRussiaAnna Fali RENEWAL
Mayumi KolmetzJapanBernardo Dominic RENEWAL
Misaki RoysterUnited KingdomBernardo Dominic UNQUALIFIED
Kaitlin OstroskyItalyOnyama Limba PROPOSAL
Ivar PaprockiBrazilStephen Shaw UNQUALIFIED
Aika InouyeJapanAsiya Javayant NEGOTIATION
Jeanfrancois VenereFranceStephen Shaw NEW
Leja CaldareraFranceBernardo Dominic UNQUALIFIED
Tony FollerItalyStephen Shaw NEW
Murillo MaletSpainXuxue Feng PROPOSAL
Emily WhobreyGermanyXuxue Feng QUALIFIED
Frozen Columns
Name
Jefferson Schemmer
Octavia Malet
Ricardo Gaucho
Maisha Rulapaugh
Aruna Figeroa
Costa Dilliard
Munro Ferencz
Arvin Albares
Ricardo Gaucho
Kaitlin Ostrosky
Leja Caldarera
Greenwood Bolognia
Emily Whobrey
Maria Marrier
Kadeem Flosi
Kaitlin Ostrosky
Aika Inouye
Francesco Shinko
Mujtaba Nicka
Jones Vocelka
Jennifer Amigon
Morrow Ruta
Murillo Malet
Jeanfrancois Venere
Juan Wieser
Jones Vocelka
Morrow Ruta
Izzy Garufi
Silvio Slusarski
Rodrigues Campain
Smith Glick
Adams Morasca
Ashley Doe
Maria Marrier
Emily Whobrey
Mujtaba Nicka
Arvin Albares
Faith Gillian
Darci Poquette
Leja Caldarera
Smith Glick
Greenwood Bolognia
Chavez Briddick
Leja Caldarera
Wickens Nestle
Maria Marrier
Kadeem Flosi
Leon Oldroyd
Ivar Paprocki
Ivar Paprocki
IdCountryDate
1000Argentina2026-04-07
1001Italy2026-04-25
1002Germany2026-04-22
1003Argentina2026-04-16
1004Russia2026-04-18
1005Argentina2026-04-09
1006United Kingdom2026-04-15
1007United Kingdom2026-04-04
1008Japan2026-04-08
1009Germany2026-04-20
1010Argentina2026-03-28
1011Russia2026-04-14
1012France2026-03-27
1013Russia2026-04-13
1014India2026-04-02
1015Brazil2026-04-01
1016Russia2026-04-06
1017India2026-04-10
1018Argentina2026-03-31
1019Germany2026-04-11
1020Japan2026-03-28
1021Brazil2026-04-24
1022Canada2026-03-31
1023Italy2026-04-25
1024Germany2026-04-14
1025Canada2026-03-28
1026Italy2026-04-15
1027Japan2026-04-25
1028France2026-04-01
1029Australia2026-04-20
1030Brazil2026-04-23
1031United Kingdom2026-04-16
1032Russia2026-04-25
1033United Kingdom2026-04-04
1034France2026-04-04
1035Australia2026-04-07
1036United Kingdom2026-04-16
1037France2026-04-11
1038Russia2026-04-13
1039Brazil2026-03-29
1040Australia2026-04-01
1041Australia2026-03-31
1042Argentina2026-04-09
1043Japan2026-04-09
1044India2026-04-23
1045United Kingdom2026-03-27
1046Japan2026-04-18
1047India2026-04-23
1048Australia2026-04-20
1049Canada2026-04-25

On-Demand Data

NameIdCountryDate
Izzy Garufi1000Italy2026-04-17
Chavez Briddick1001Argentina2026-04-25
Ricardo Gaucho1002Italy2026-04-17
Costa Dilliard1003Argentina2026-04-10
Jefferson Schemmer1004India2026-04-04
David Darakjy1005Spain2026-04-05
Maria Marrier1006France2026-04-17
Smith Glick1007Germany2026-04-03
Munro Ferencz1008India2026-04-12
Silvio Slusarski1009Italy2026-04-10
Tony Foller1010Canada2026-04-08
Faith Gillian1011Argentina2026-03-28
Kadeem Flosi1012Russia2026-04-07
Alejandro Perin1013Russia2026-04-14
Stacey Maclead1014India2026-04-11
Mayumi Kolmetz1015Australia2026-04-08
Wickens Nestle1016United Kingdom2026-04-23
Mayumi Kolmetz1017Brazil2026-04-20
Emily Whobrey1018Spain2026-03-31
Ivar Paprocki1019Spain2026-04-11
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Maria MarrierJapanAmy Elsner RENEWAL
Maisha RulapaughJapanBernardo Dominic RENEWAL
Faith GillianUnited KingdomIvan Magalhaes QUALIFIED
Isabel BowleyIndiaOnyama Limba PROPOSAL
Jefferson SchemmerRussiaIoni Bowcher RENEWAL
Kaitlin OstroskyArgentinaXuxue Feng PROPOSAL
Juan WieserJapanIvan Magalhaes RENEWAL
Misaki RoysterUnited KingdomAmy Elsner NEGOTIATION
Rodrigues CampainCanadaOnyama Limba RENEWAL
Chavez BriddickAustraliaIvan Magalhaes NEGOTIATION
Cody SaylorsGermanyAmy Elsner PROPOSAL
Kaitlin OstroskyBrazilXuxue Feng RENEWAL
Misaki RoysterRussiaAsiya Javayant PROPOSAL
Leja CaldareraItalyAsiya Javayant RENEWAL
Cody SaylorsJapanAmy Elsner NEW
Nicolas IturbideBrazilXuxue Feng RENEWAL
Adams MorascaUnited KingdomOnyama Limba NEW
Costa DilliardArgentinaXuxue Feng UNQUALIFIED
David DarakjySpainOnyama Limba UNQUALIFIED
Claire TollnerFranceIoni Bowcher PROPOSAL
Cody SaylorsFranceElwin Sharvill NEGOTIATION
Murillo MaletJapanElwin Sharvill PROPOSAL
David DarakjyCanadaElwin Sharvill QUALIFIED
Greenwood BologniaSpainAnna Fali NEW
Silvio SlusarskiAustraliaElwin Sharvill QUALIFIED
Murillo MaletIndiaAnna Fali RENEWAL
Tony FollerItalyAmy Elsner UNQUALIFIED
Chavez BriddickBrazilOnyama Limba RENEWAL
David DarakjyFranceElwin Sharvill NEGOTIATION
Cody SaylorsIndiaOnyama Limba RENEWAL
Ashley DoeSpainAnna Fali PROPOSAL
Adams MorascaCanadaXuxue Feng PROPOSAL
Greenwood BologniaArgentinaIvan Magalhaes NEGOTIATION
Aika InouyeBrazilAmy Elsner UNQUALIFIED
Mayumi KolmetzIndiaXuxue Feng RENEWAL
David DarakjyArgentinaAnna Fali QUALIFIED
Deepesh ChuiBrazilAnna Fali UNQUALIFIED
Leja CaldareraArgentinaAmy Elsner RENEWAL
Leja CaldareraGermanyAnna Fali PROPOSAL
Kaitlin OstroskyJapanIoni 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>