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
Aditya KuskoFranceAnna Fali UNQUALIFIED
Maisha RulapaughAustraliaAmy Elsner UNQUALIFIED
Claire TollnerJapanIvan Magalhaes NEGOTIATION
Nicolas IturbideBrazilBernardo Dominic NEW
Johnson SergiCanadaElwin Sharvill QUALIFIED
Kaitlin OstroskyRussiaStephen Shaw RENEWAL
Ivar PaprockiJapanAmy Elsner PROPOSAL
James ButtArgentinaAmy Elsner UNQUALIFIED
Cody SaylorsIndiaAsiya Javayant QUALIFIED
Ashley DoeIndiaAnna Fali NEW
Murillo MaletUnited KingdomIvan Magalhaes NEW
Clifford RimArgentinaAnna Fali NEGOTIATION
Rodrigues CampainAustraliaAnna Fali PROPOSAL
Francesco ShinkoItalyIvan Magalhaes PROPOSAL
Murillo MaletSpainAnna Fali PROPOSAL
Deepesh ChuiFranceIvan Magalhaes UNQUALIFIED
Johnson SergiAustraliaXuxue Feng QUALIFIED
Morrow RutaArgentinaAnna Fali PROPOSAL
Tony FollerSpainIoni Bowcher PROPOSAL
Murillo MaletFranceAnna Fali QUALIFIED
Wickens NestleIndiaStephen Shaw NEW
Deepesh ChuiItalyAsiya Javayant QUALIFIED
Deepesh ChuiJapanAnna Fali RENEWAL
Silvio SlusarskiItalyBernardo Dominic QUALIFIED
Salvatore StockhamGermanyBernardo Dominic NEGOTIATION
Salvatore StockhamItalyAsiya Javayant NEGOTIATION
Jefferson SchemmerAustraliaXuxue Feng NEGOTIATION
Izzy GarufiSpainAsiya Javayant QUALIFIED
Darci PoquetteUnited KingdomIvan Magalhaes NEW
Morrow RutaAustraliaIoni Bowcher UNQUALIFIED
David DarakjyGermanyXuxue Feng NEGOTIATION
Deepesh ChuiRussiaOnyama Limba QUALIFIED
Mujtaba NickaIndiaBernardo Dominic NEW
Jones VocelkaCanadaIoni Bowcher QUALIFIED
David DarakjyFranceIoni Bowcher PROPOSAL
Tony FollerFranceAnna Fali NEW
Johnson SergiGermanyXuxue Feng PROPOSAL
Clifford RimSpainXuxue Feng NEGOTIATION
Tony FollerFranceBernardo Dominic UNQUALIFIED
Chavez BriddickCanadaBernardo Dominic PROPOSAL
Francesco ShinkoArgentinaXuxue Feng PROPOSAL
Darci PoquetteBrazilAmy Elsner NEW
Adams MorascaIndiaElwin Sharvill RENEWAL
Jones VocelkaSpainAsiya Javayant NEW
Jefferson SchemmerIndiaAsiya Javayant QUALIFIED
Greenwood BologniaItalyIoni Bowcher UNQUALIFIED
Adams MorascaUnited KingdomBernardo Dominic NEW
Jones VocelkaUnited KingdomIoni Bowcher NEGOTIATION
Stacey MacleadArgentinaStephen Shaw NEW
Jefferson SchemmerGermanyBernardo Dominic QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Aruna FigeroaArgentinaIvan Magalhaes NEGOTIATION
Mayumi KolmetzItalyStephen Shaw QUALIFIED
Cody SaylorsSpainAsiya Javayant NEW
Greenwood BologniaArgentinaStephen Shaw NEGOTIATION
Munro FerenczSpainOnyama Limba NEW
Emily WhobreyGermanyAsiya Javayant UNQUALIFIED
Ivar PaprockiGermanyXuxue Feng NEGOTIATION
Tony FollerUnited KingdomStephen Shaw NEGOTIATION
Mujtaba NickaGermanyXuxue Feng NEGOTIATION
Silvio SlusarskiItalyOnyama Limba RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000James ButtArgentina2026-04-15Truhlar And Truhlar Attys RENEWAL39Ivan Magalhaes
1001Adams MorascaItaly2026-05-03King, Christopher A Esq QUALIFIED99Stephen Shaw
1002Sinclair WaycottArgentina2026-04-16Benton, John B Jr RENEWAL93Stephen Shaw
1003Francesco ShinkoFrance2026-04-19Feltz Printing Service UNQUALIFIED94Asiya Javayant
1004Salvatore StockhamAustralia2026-05-03Benton, John B Jr NEGOTIATION77Anna Fali
1005Arvin AlbaresFrance2026-04-26Dorl, James J Esq NEGOTIATION23Stephen Shaw
1006Jefferson SchemmerGermany2026-04-16Buckley Miller Wright UNQUALIFIED96Elwin Sharvill
1007Deepesh ChuiSpain2026-05-05Commercial Press PROPOSAL84Onyama Limba
1008Jones VocelkaCanada2026-05-08Buckley Miller Wright NEGOTIATION53Bernardo Dominic
1009Wickens NestleRussia2026-04-14Buckley Miller Wright UNQUALIFIED47Bernardo Dominic
1010Nicolas IturbideBrazil2026-05-02King, Christopher A Esq QUALIFIED85Bernardo Dominic
1011Mujtaba NickaRussia2026-04-27Benton, John B Jr RENEWAL18Onyama Limba
1012Johnson SergiIndia2026-05-05Chanay, Jeffrey A Esq NEW49Asiya Javayant
1013Greenwood BologniaGermany2026-04-21Truhlar And Truhlar Attys UNQUALIFIED34Stephen Shaw
1014Jennifer AmigonSpain2026-04-09Rangoni Of Florence PROPOSAL47Anna Fali
1015David DarakjyArgentina2026-04-13Rousseaux, Michael Esq UNQUALIFIED17Stephen Shaw
1016Sinclair WaycottAustralia2026-04-14King, Christopher A Esq QUALIFIED35Bernardo Dominic
1017Morrow RutaGermany2026-04-29Chanay, Jeffrey A Esq QUALIFIED58Stephen Shaw
1018Aika InouyeSpain2026-05-08Benton, John B Jr UNQUALIFIED60Ioni Bowcher
1019Jennifer AmigonArgentina2026-04-27Chemel, James L Cpa NEGOTIATION47Xuxue Feng
1020Cody SaylorsBrazil2026-04-25Benton, John B Jr NEW51Ivan Magalhaes
1021Munro FerenczArgentina2026-04-23Printing Dimensions QUALIFIED66Stephen Shaw
1022Smith GlickItaly2026-05-05Chapman, Ross E Esq QUALIFIED91Onyama Limba
1023Aruna FigeroaUnited Kingdom2026-04-29Feiner Bros UNQUALIFIED95Onyama Limba
1024David DarakjySpain2026-04-14Buckley Miller Wright QUALIFIED37Anna Fali
1025Aditya KuskoFrance2026-04-19Chapman, Ross E Esq QUALIFIED93Stephen Shaw
1026Munro FerenczAustralia2026-05-05Morlong Associates PROPOSAL49Ivan Magalhaes
1027Arvin AlbaresRussia2026-04-16Morlong Associates NEGOTIATION77Xuxue Feng
1028Jefferson SchemmerArgentina2026-05-07Feltz Printing Service QUALIFIED17Amy Elsner
1029Tony FollerJapan2026-04-10Dorl, James J Esq NEGOTIATION25Anna Fali
1030Antonio CaudyJapan2026-05-06Chemel, James L Cpa NEGOTIATION39Anna Fali
1031David DarakjyIndia2026-05-07Chemel, James L Cpa RENEWAL45Bernardo Dominic
1032Octavia MaletItaly2026-04-21Benton, John B Jr UNQUALIFIED15Anna Fali
1033Munro FerenczFrance2026-04-14Rangoni Of Florence NEW71Elwin Sharvill
1034Leon OldroydGermany2026-04-19Buckley Miller Wright RENEWAL38Xuxue Feng
1035Greenwood BologniaCanada2026-04-17Truhlar And Truhlar Attys NEGOTIATION3Amy Elsner
1036Juan WieserCanada2026-04-15Benton, John B Jr NEGOTIATION6Anna Fali
1037Ivar PaprockiUnited Kingdom2026-05-06Commercial Press NEGOTIATION15Asiya Javayant
1038Mayumi KolmetzAustralia2026-04-18Rousseaux, Michael Esq NEW2Elwin Sharvill
1039Kaitlin OstroskyGermany2026-05-03Rangoni Of Florence RENEWAL68Stephen Shaw
1040Nicolas IturbideFrance2026-05-05Chanay, Jeffrey A Esq NEGOTIATION29Anna Fali
1041Juan WieserCanada2026-04-21Feltz Printing Service NEGOTIATION12Ioni Bowcher
1042Antonio CaudyRussia2026-04-15Printing Dimensions RENEWAL31Asiya Javayant
1043Morrow RutaIndia2026-04-18Chemel, James L Cpa NEW66Elwin Sharvill
1044Arvin AlbaresArgentina2026-05-01Feltz Printing Service RENEWAL85Ivan Magalhaes
1045Octavia MaletCanada2026-04-15Chemel, James L Cpa NEGOTIATION5Anna Fali
1046Ivar PaprockiBrazil2026-04-23Feiner Bros QUALIFIED47Onyama Limba
1047Johnson SergiIndia2026-04-22Morlong Associates QUALIFIED77Ioni Bowcher
1048Cody SaylorsJapan2026-05-02Chapman, Ross E Esq QUALIFIED94Ioni Bowcher
1049Darci PoquetteAustralia2026-04-28Dorl, James J Esq QUALIFIED32Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Smith GlickBrazilAsiya Javayant RENEWAL
Jefferson SchemmerItalyIoni Bowcher QUALIFIED
Nicolas IturbideRussiaStephen Shaw NEW
Octavia MaletIndiaIoni Bowcher QUALIFIED
Greenwood BologniaUnited KingdomBernardo Dominic PROPOSAL
Stacey MacleadItalyOnyama Limba NEGOTIATION
Faith GillianIndiaXuxue Feng UNQUALIFIED
Stacey MacleadItalyOnyama Limba NEW
Kaitlin OstroskyItalyBernardo Dominic NEW
Adams MorascaAustraliaIvan Magalhaes RENEWAL
Alejandro PerinArgentinaStephen Shaw PROPOSAL
Sinclair WaycottSpainAmy Elsner NEW
Sinclair WaycottSpainStephen Shaw QUALIFIED
Misaki RoysterBrazilStephen Shaw UNQUALIFIED
Kaitlin OstroskyAustraliaAsiya Javayant UNQUALIFIED
Tony FollerGermanyAsiya Javayant RENEWAL
Silvio SlusarskiIndiaIvan Magalhaes PROPOSAL
Francesco ShinkoRussiaOnyama Limba RENEWAL
Cody SaylorsItalyStephen Shaw NEW
Rodrigues CampainAustraliaElwin Sharvill PROPOSAL
Aditya KuskoSpainAnna Fali UNQUALIFIED
Johnson SergiFranceElwin Sharvill NEGOTIATION
Isabel BowleySpainIvan Magalhaes NEW
Jones VocelkaIndiaElwin Sharvill RENEWAL
Jeanfrancois VenereArgentinaBernardo Dominic UNQUALIFIED
Claire TollnerSpainAnna Fali NEW
Greenwood BologniaSpainStephen Shaw QUALIFIED
Mujtaba NickaJapanElwin Sharvill RENEWAL
Murillo MaletCanadaAsiya Javayant QUALIFIED
Misaki RoysterGermanyIvan Magalhaes QUALIFIED
Murillo MaletSpainXuxue Feng UNQUALIFIED
Jeanfrancois VenereRussiaAnna Fali UNQUALIFIED
Murillo MaletRussiaXuxue Feng RENEWAL
Maria MarrierCanadaBernardo Dominic QUALIFIED
David DarakjySpainElwin Sharvill UNQUALIFIED
Deepesh ChuiRussiaXuxue Feng RENEWAL
Mayumi KolmetzItalyAmy Elsner NEGOTIATION
Aditya KuskoSpainElwin Sharvill QUALIFIED
Isabel BowleySpainIvan Magalhaes NEGOTIATION
Sinclair WaycottCanadaIoni Bowcher NEW
Stacey MacleadAustraliaOnyama Limba UNQUALIFIED
Deepesh ChuiSpainAsiya Javayant NEGOTIATION
Faith GillianJapanBernardo Dominic PROPOSAL
Smith GlickSpainAnna Fali QUALIFIED
David DarakjyBrazilIoni Bowcher NEGOTIATION
Claire TollnerJapanAsiya Javayant NEW
Murillo MaletSpainXuxue Feng NEW
Maisha RulapaughCanadaAmy Elsner RENEWAL
Deepesh ChuiGermanyBernardo Dominic PROPOSAL
Cody SaylorsUnited KingdomElwin Sharvill NEW
Frozen Columns
Name
Juan Wieser
Juan Wieser
Antonio Caudy
Stacey Maclead
Arvin Albares
Wickens Nestle
Jennifer Amigon
Silvio Slusarski
Isabel Bowley
Antonio Caudy
Chavez Briddick
Aditya Kusko
Deepesh Chui
Jeanfrancois Venere
Antonio Caudy
Chavez Briddick
Ashley Doe
Morrow Ruta
Misaki Royster
Leja Caldarera
Silvio Slusarski
Greenwood Bolognia
Cody Saylors
Darci Poquette
Sinclair Waycott
Johnson Sergi
Arvin Albares
Jefferson Schemmer
Jeanfrancois Venere
Cody Saylors
Ricardo Gaucho
Ivar Paprocki
Stacey Maclead
Clifford Rim
Antonio Caudy
Leon Oldroyd
Alejandro Perin
Mayumi Kolmetz
Jennifer Amigon
Misaki Royster
Maria Marrier
Leja Caldarera
Antonio Caudy
Ashley Doe
Mujtaba Nicka
Isabel Bowley
Ashley Doe
Wickens Nestle
Antonio Caudy
Cody Saylors
IdCountryDate
1000Italy2026-05-01
1001Canada2026-04-16
1002India2026-04-29
1003Australia2026-04-28
1004United Kingdom2026-04-28
1005Canada2026-04-12
1006Argentina2026-05-06
1007India2026-04-22
1008Japan2026-04-14
1009Italy2026-04-11
1010Argentina2026-05-06
1011Argentina2026-05-04
1012Japan2026-04-20
1013Canada2026-04-20
1014Russia2026-04-12
1015Japan2026-04-22
1016Spain2026-04-15
1017Germany2026-04-25
1018Russia2026-05-05
1019Australia2026-05-04
1020India2026-05-02
1021Brazil2026-04-22
1022Canada2026-04-23
1023Australia2026-04-26
1024Germany2026-04-24
1025France2026-04-15
1026Japan2026-04-18
1027Spain2026-04-11
1028Brazil2026-04-11
1029Russia2026-04-19
1030France2026-05-07
1031Argentina2026-04-17
1032Germany2026-04-23
1033Argentina2026-04-30
1034Russia2026-04-30
1035Argentina2026-04-11
1036United Kingdom2026-04-15
1037Canada2026-04-25
1038Argentina2026-04-16
1039United Kingdom2026-04-27
1040United Kingdom2026-04-26
1041Brazil2026-05-05
1042India2026-04-25
1043Spain2026-05-07
1044Japan2026-05-07
1045Australia2026-04-15
1046Australia2026-04-30
1047Germany2026-04-23
1048Italy2026-04-12
1049Germany2026-04-16

On-Demand Data

NameIdCountryDate
Kadeem Flosi1000Germany2026-04-23
Sinclair Waycott1001India2026-04-24
Francesco Shinko1002Spain2026-04-23
Izzy Garufi1003Italy2026-05-07
Leja Caldarera1004Russia2026-05-06
Jefferson Schemmer1005India2026-04-22
Misaki Royster1006Australia2026-04-13
Ivar Paprocki1007Spain2026-05-08
Ivar Paprocki1008United Kingdom2026-04-09
Juan Wieser1009Spain2026-04-17
Misaki Royster1010Canada2026-04-29
Leon Oldroyd1011Argentina2026-04-20
Morrow Ruta1012United Kingdom2026-04-25
Stacey Maclead1013France2026-04-25
Silvio Slusarski1014Russia2026-04-15
Isabel Bowley1015Russia2026-04-11
Munro Ferencz1016India2026-04-28
Izzy Garufi1017United Kingdom2026-04-14
Kadeem Flosi1018Brazil2026-04-13
Chavez Briddick1019France2026-04-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Isabel BowleyItalyXuxue Feng NEW
Silvio SlusarskiItalyAmy Elsner NEW
Mayumi KolmetzIndiaAnna Fali NEW
Jones VocelkaBrazilStephen Shaw UNQUALIFIED
Leon OldroydUnited KingdomXuxue Feng PROPOSAL
Kadeem FlosiItalyElwin Sharvill NEW
Ivar PaprockiIndiaStephen Shaw RENEWAL
Clifford RimItalyXuxue Feng UNQUALIFIED
Maria MarrierArgentinaXuxue Feng QUALIFIED
Darci PoquetteSpainIvan Magalhaes NEGOTIATION
Morrow RutaArgentinaStephen Shaw QUALIFIED
Francesco ShinkoBrazilOnyama Limba NEW
Darci PoquetteRussiaElwin Sharvill NEGOTIATION
Arvin AlbaresRussiaElwin Sharvill UNQUALIFIED
Aruna FigeroaSpainOnyama Limba RENEWAL
Wickens NestleCanadaXuxue Feng NEW
Jennifer AmigonFranceStephen Shaw QUALIFIED
Darci PoquetteFranceElwin Sharvill PROPOSAL
Mujtaba NickaRussiaElwin Sharvill NEW
Maria MarrierFranceBernardo Dominic UNQUALIFIED
Julie StensethFranceAnna Fali NEW
Darci PoquetteCanadaIvan Magalhaes NEGOTIATION
Mujtaba NickaItalyBernardo Dominic UNQUALIFIED
Mujtaba NickaGermanyIoni Bowcher UNQUALIFIED
Wickens NestleBrazilStephen Shaw UNQUALIFIED
Aruna FigeroaGermanyIvan Magalhaes QUALIFIED
Stacey MacleadJapanElwin Sharvill NEGOTIATION
Ivar PaprockiFranceAnna Fali UNQUALIFIED
Salvatore StockhamItalyStephen Shaw PROPOSAL
Misaki RoysterRussiaOnyama Limba PROPOSAL
Smith GlickIndiaAnna Fali NEW
Octavia MaletRussiaOnyama Limba NEGOTIATION
Salvatore StockhamAustraliaIvan Magalhaes RENEWAL
Alejandro PerinAustraliaIvan Magalhaes QUALIFIED
Nicolas IturbideAustraliaAmy Elsner NEW
Kaitlin OstroskyItalyOnyama Limba NEW
Aruna FigeroaIndiaOnyama Limba NEW
Murillo MaletAustraliaBernardo Dominic NEW
Maisha RulapaughBrazilIoni Bowcher UNQUALIFIED
Silvio SlusarskiUnited KingdomXuxue Feng 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>