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
Morrow RutaSpainStephen Shaw QUALIFIED
Francesco ShinkoUnited KingdomIvan Magalhaes PROPOSAL
Johnson SergiArgentinaIvan Magalhaes NEW
Stacey MacleadFranceIoni Bowcher NEW
Costa DilliardFranceIvan Magalhaes UNQUALIFIED
Maisha RulapaughIndiaAsiya Javayant PROPOSAL
Julie StensethUnited KingdomXuxue Feng PROPOSAL
Claire TollnerIndiaIvan Magalhaes NEW
Maria MarrierArgentinaAmy Elsner NEW
Ivar PaprockiJapanXuxue Feng NEGOTIATION
Francesco ShinkoGermanyElwin Sharvill RENEWAL
Juan WieserUnited KingdomStephen Shaw NEW
Ivar PaprockiIndiaElwin Sharvill NEGOTIATION
Isabel BowleySpainAsiya Javayant RENEWAL
Mayumi KolmetzItalyAnna Fali UNQUALIFIED
Adams MorascaArgentinaElwin Sharvill UNQUALIFIED
Deepesh ChuiCanadaElwin Sharvill RENEWAL
Greenwood BologniaArgentinaIvan Magalhaes NEGOTIATION
Chavez BriddickUnited KingdomBernardo Dominic RENEWAL
Antonio CaudyBrazilIoni Bowcher PROPOSAL
Clifford RimRussiaIoni Bowcher UNQUALIFIED
Murillo MaletArgentinaAmy Elsner PROPOSAL
Leon OldroydGermanyAsiya Javayant UNQUALIFIED
Clifford RimSpainXuxue Feng RENEWAL
Jones VocelkaGermanyXuxue Feng UNQUALIFIED
Leon OldroydFranceXuxue Feng NEGOTIATION
Izzy GarufiBrazilAmy Elsner PROPOSAL
Nicolas IturbideArgentinaElwin Sharvill UNQUALIFIED
Octavia MaletRussiaAnna Fali NEW
Jennifer AmigonRussiaIoni Bowcher NEGOTIATION
Deepesh ChuiCanadaIoni Bowcher QUALIFIED
Maisha RulapaughSpainIoni Bowcher UNQUALIFIED
Adams MorascaBrazilIvan Magalhaes NEGOTIATION
Francesco ShinkoArgentinaAmy Elsner PROPOSAL
David DarakjyUnited KingdomStephen Shaw NEGOTIATION
Nicolas IturbideUnited KingdomAnna Fali UNQUALIFIED
Mujtaba NickaSpainAnna Fali NEGOTIATION
Kaitlin OstroskyArgentinaBernardo Dominic RENEWAL
Clifford RimAustraliaXuxue Feng NEW
Aruna FigeroaSpainElwin Sharvill NEGOTIATION
Maria MarrierCanadaElwin Sharvill NEW
Mujtaba NickaUnited KingdomStephen Shaw PROPOSAL
Ashley DoeBrazilStephen Shaw UNQUALIFIED
Claire TollnerCanadaStephen Shaw NEGOTIATION
Octavia MaletJapanAmy Elsner RENEWAL
Morrow RutaJapanBernardo Dominic PROPOSAL
Sinclair WaycottCanadaAmy Elsner RENEWAL
Francesco ShinkoUnited KingdomElwin Sharvill QUALIFIED
Misaki RoysterArgentinaXuxue Feng UNQUALIFIED
Faith GillianBrazilOnyama Limba PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Tony FollerUnited KingdomElwin Sharvill NEW
Alejandro PerinAustraliaIvan Magalhaes UNQUALIFIED
James ButtRussiaStephen Shaw NEW
Octavia MaletItalyAmy Elsner PROPOSAL
Jeanfrancois VenereFranceAsiya Javayant UNQUALIFIED
Kaitlin OstroskyIndiaXuxue Feng RENEWAL
Octavia MaletGermanyElwin Sharvill RENEWAL
Antonio CaudyBrazilXuxue Feng NEGOTIATION
Smith GlickAustraliaIoni Bowcher NEW
Ivar PaprockiRussiaXuxue Feng UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Johnson SergiArgentina2026-04-05Rangoni Of Florence QUALIFIED72Stephen Shaw
1001Kadeem FlosiFrance2026-04-01Commercial Press NEGOTIATION33Asiya Javayant
1002Jefferson SchemmerUnited Kingdom2026-04-08Buckley Miller Wright NEW36Stephen Shaw
1003Aika InouyeArgentina2026-04-18Truhlar And Truhlar Attys UNQUALIFIED7Amy Elsner
1004Smith GlickFrance2026-04-02Rangoni Of Florence QUALIFIED15Amy Elsner
1005Silvio SlusarskiCanada2026-04-11Commercial Press NEGOTIATION94Asiya Javayant
1006Julie StensethArgentina2026-04-02Morlong Associates NEGOTIATION2Onyama Limba
1007Izzy GarufiCanada2026-04-06Chapman, Ross E Esq UNQUALIFIED4Ivan Magalhaes
1008Juan WieserArgentina2026-03-28Buckley Miller Wright NEGOTIATION64Elwin Sharvill
1009Jefferson SchemmerArgentina2026-04-02Truhlar And Truhlar Attys NEW49Ivan Magalhaes
1010Izzy GarufiFrance2026-04-15Printing Dimensions QUALIFIED70Asiya Javayant
1011Aika InouyeBrazil2026-04-10Morlong Associates UNQUALIFIED46Bernardo Dominic
1012Darci PoquetteItaly2026-04-20Rangoni Of Florence NEGOTIATION91Stephen Shaw
1013Tony FollerIndia2026-03-24Chanay, Jeffrey A Esq UNQUALIFIED84Elwin Sharvill
1014Cody SaylorsUnited Kingdom2026-04-14Morlong Associates RENEWAL7Amy Elsner
1015Greenwood BologniaIndia2026-04-10Benton, John B Jr QUALIFIED42Amy Elsner
1016Isabel BowleyItaly2026-03-31Commercial Press QUALIFIED38Ivan Magalhaes
1017Morrow RutaSpain2026-04-05Chemel, James L Cpa UNQUALIFIED86Elwin Sharvill
1018Morrow RutaItaly2026-03-26King, Christopher A Esq NEW31Xuxue Feng
1019Maisha RulapaughArgentina2026-03-27Rangoni Of Florence PROPOSAL30Elwin Sharvill
1020Mujtaba NickaAustralia2026-04-09Benton, John B Jr UNQUALIFIED38Xuxue Feng
1021Octavia MaletBrazil2026-04-05Chapman, Ross E Esq PROPOSAL64Onyama Limba
1022Julie StensethJapan2026-03-23Dorl, James J Esq PROPOSAL90Amy Elsner
1023Costa DilliardRussia2026-04-04King, Christopher A Esq UNQUALIFIED34Ivan Magalhaes
1024Nicolas IturbideFrance2026-04-10Feiner Bros PROPOSAL32Elwin Sharvill
1025Mujtaba NickaRussia2026-03-26Feiner Bros RENEWAL33Ivan Magalhaes
1026Alejandro PerinSpain2026-04-04Feiner Bros NEW55Elwin Sharvill
1027Morrow RutaIndia2026-03-23Feltz Printing Service PROPOSAL92Stephen Shaw
1028Emily WhobreyArgentina2026-04-03Chanay, Jeffrey A Esq NEW23Ivan Magalhaes
1029Wickens NestleCanada2026-04-01Morlong Associates NEGOTIATION79Asiya Javayant
1030Deepesh ChuiArgentina2026-03-24Truhlar And Truhlar Attys NEW87Ivan Magalhaes
1031Mayumi KolmetzFrance2026-04-14Commercial Press NEW15Bernardo Dominic
1032Darci PoquetteGermany2026-04-02Truhlar And Truhlar Attys RENEWAL1Anna Fali
1033Chavez BriddickArgentina2026-04-03Buckley Miller Wright RENEWAL23Onyama Limba
1034Tony FollerSpain2026-04-11Truhlar And Truhlar Attys RENEWAL84Anna Fali
1035Munro FerenczUnited Kingdom2026-04-16Benton, John B Jr PROPOSAL65Elwin Sharvill
1036Isabel BowleyArgentina2026-04-09Chemel, James L Cpa NEW2Stephen Shaw
1037Tony FollerBrazil2026-04-01Truhlar And Truhlar Attys NEGOTIATION63Asiya Javayant
1038Johnson SergiJapan2026-04-04Chapman, Ross E Esq QUALIFIED23Ivan Magalhaes
1039Jennifer AmigonBrazil2026-04-18Feltz Printing Service UNQUALIFIED53Elwin Sharvill
1040Deepesh ChuiItaly2026-03-23Dorl, James J Esq RENEWAL90Asiya Javayant
1041Wickens NestleGermany2026-04-04King, Christopher A Esq PROPOSAL46Ivan Magalhaes
1042Juan WieserCanada2026-04-03Printing Dimensions QUALIFIED83Ioni Bowcher
1043Francesco ShinkoGermany2026-03-31Feiner Bros PROPOSAL97Asiya Javayant
1044Aditya KuskoItaly2026-04-09Feiner Bros NEW12Ioni Bowcher
1045Octavia MaletIndia2026-03-25Truhlar And Truhlar Attys UNQUALIFIED11Elwin Sharvill
1046Jeanfrancois VenereBrazil2026-04-06Morlong Associates PROPOSAL22Ivan Magalhaes
1047Nicolas IturbideJapan2026-04-07Printing Dimensions PROPOSAL15Ioni Bowcher
1048Sinclair WaycottRussia2026-04-07Benton, John B Jr QUALIFIED26Xuxue Feng
1049Salvatore StockhamArgentina2026-04-15Rangoni Of Florence NEGOTIATION58Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Kadeem FlosiCanadaXuxue Feng NEW
Ivar PaprockiCanadaXuxue Feng PROPOSAL
Claire TollnerJapanOnyama Limba QUALIFIED
Juan WieserRussiaAmy Elsner UNQUALIFIED
Jones VocelkaGermanyOnyama Limba UNQUALIFIED
Rodrigues CampainBrazilIoni Bowcher NEGOTIATION
Francesco ShinkoAustraliaIoni Bowcher QUALIFIED
Misaki RoysterItalyBernardo Dominic UNQUALIFIED
Johnson SergiFranceIoni Bowcher NEW
Greenwood BologniaUnited KingdomOnyama Limba NEW
Silvio SlusarskiItalyBernardo Dominic RENEWAL
Misaki RoysterItalyOnyama Limba PROPOSAL
Ricardo GauchoRussiaIoni Bowcher UNQUALIFIED
Chavez BriddickRussiaOnyama Limba QUALIFIED
Isabel BowleyItalyAmy Elsner NEW
Morrow RutaRussiaElwin Sharvill QUALIFIED
Arvin AlbaresItalyBernardo Dominic RENEWAL
Aditya KuskoFranceAmy Elsner QUALIFIED
Munro FerenczIndiaAsiya Javayant UNQUALIFIED
Munro FerenczIndiaXuxue Feng PROPOSAL
Leon OldroydFranceAnna Fali PROPOSAL
Deepesh ChuiAustraliaStephen Shaw RENEWAL
Ashley DoeFranceAsiya Javayant NEGOTIATION
Francesco ShinkoItalyBernardo Dominic NEW
Jeanfrancois VenereRussiaElwin Sharvill RENEWAL
Costa DilliardCanadaStephen Shaw NEW
Jones VocelkaRussiaIoni Bowcher QUALIFIED
Jennifer AmigonJapanStephen Shaw NEW
Kadeem FlosiAustraliaStephen Shaw RENEWAL
Morrow RutaItalyElwin Sharvill QUALIFIED
Jones VocelkaAustraliaIoni Bowcher NEGOTIATION
Octavia MaletJapanAnna Fali RENEWAL
Aika InouyeIndiaIvan Magalhaes RENEWAL
Ashley DoeItalyAnna Fali PROPOSAL
Mujtaba NickaJapanElwin Sharvill NEGOTIATION
Morrow RutaAustraliaXuxue Feng NEGOTIATION
Aditya KuskoIndiaAsiya Javayant PROPOSAL
Antonio CaudyUnited KingdomBernardo Dominic QUALIFIED
Isabel BowleyIndiaIvan Magalhaes NEGOTIATION
Izzy GarufiArgentinaIvan Magalhaes RENEWAL
Salvatore StockhamJapanStephen Shaw UNQUALIFIED
Deepesh ChuiBrazilAnna Fali UNQUALIFIED
Sinclair WaycottIndiaAmy Elsner PROPOSAL
Claire TollnerAustraliaBernardo Dominic RENEWAL
Greenwood BologniaFranceXuxue Feng NEW
Cody SaylorsRussiaOnyama Limba PROPOSAL
Cody SaylorsJapanAsiya Javayant RENEWAL
Claire TollnerBrazilAmy Elsner QUALIFIED
Maria MarrierItalyBernardo Dominic NEW
Julie StensethIndiaAnna Fali RENEWAL
Frozen Columns
Name
Costa Dilliard
Leja Caldarera
Mayumi Kolmetz
Maisha Rulapaugh
Mujtaba Nicka
Maria Marrier
Darci Poquette
Kadeem Flosi
Arvin Albares
Kadeem Flosi
Misaki Royster
Aditya Kusko
Maria Marrier
Jefferson Schemmer
Wickens Nestle
Jennifer Amigon
Ricardo Gaucho
Juan Wieser
Maisha Rulapaugh
Maisha Rulapaugh
Leja Caldarera
Arvin Albares
Clifford Rim
Arvin Albares
Maria Marrier
Isabel Bowley
Ashley Doe
Misaki Royster
Mayumi Kolmetz
Jeanfrancois Venere
Tony Foller
Ricardo Gaucho
Munro Ferencz
David Darakjy
Misaki Royster
Johnson Sergi
Greenwood Bolognia
Ivar Paprocki
Costa Dilliard
Silvio Slusarski
Johnson Sergi
Misaki Royster
Cody Saylors
Claire Tollner
Alejandro Perin
Jones Vocelka
Salvatore Stockham
Faith Gillian
Smith Glick
Stacey Maclead
IdCountryDate
1000Australia2026-03-27
1001Germany2026-04-08
1002Argentina2026-03-22
1003Argentina2026-04-13
1004Brazil2026-04-12
1005Brazil2026-03-25
1006Argentina2026-03-23
1007Germany2026-04-19
1008Argentina2026-04-07
1009Australia2026-04-13
1010Italy2026-04-02
1011Canada2026-04-02
1012Australia2026-04-14
1013Argentina2026-04-12
1014Italy2026-04-04
1015France2026-04-17
1016Japan2026-04-08
1017Australia2026-03-23
1018Italy2026-03-26
1019India2026-04-02
1020Spain2026-04-18
1021Italy2026-03-23
1022Australia2026-03-24
1023Argentina2026-04-01
1024Canada2026-04-19
1025Brazil2026-03-24
1026India2026-04-05
1027France2026-04-20
1028Japan2026-03-23
1029United Kingdom2026-04-08
1030France2026-04-18
1031India2026-04-19
1032France2026-03-26
1033Canada2026-03-24
1034Canada2026-04-12
1035Brazil2026-04-01
1036Germany2026-04-18
1037Germany2026-04-11
1038Russia2026-04-03
1039France2026-04-14
1040Germany2026-04-05
1041Italy2026-04-07
1042Brazil2026-04-20
1043Spain2026-04-17
1044Italy2026-03-24
1045Brazil2026-04-19
1046India2026-04-03
1047France2026-04-12
1048India2026-03-27
1049Italy2026-04-10

On-Demand Data

NameIdCountryDate
Wickens Nestle1000Argentina2026-03-28
Jennifer Amigon1001Germany2026-03-29
Mayumi Kolmetz1002Spain2026-04-19
Octavia Malet1003Australia2026-04-16
Izzy Garufi1004Spain2026-04-08
Costa Dilliard1005Canada2026-04-09
Cody Saylors1006Canada2026-04-05
Rodrigues Campain1007France2026-04-07
Octavia Malet1008Japan2026-03-30
James Butt1009Italy2026-04-08
Johnson Sergi1010Brazil2026-03-31
Munro Ferencz1011Germany2026-04-08
Ricardo Gaucho1012United Kingdom2026-04-04
Jones Vocelka1013Italy2026-04-06
Smith Glick1014Russia2026-03-26
Silvio Slusarski1015Spain2026-03-26
Cody Saylors1016India2026-03-30
Ricardo Gaucho1017United Kingdom2026-03-22
Julie Stenseth1018Russia2026-03-25
Clifford Rim1019Italy2026-03-28
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Octavia MaletFranceIoni Bowcher QUALIFIED
Alejandro PerinFranceAmy Elsner QUALIFIED
Smith GlickArgentinaXuxue Feng RENEWAL
Antonio CaudyItalyIvan Magalhaes QUALIFIED
Morrow RutaRussiaBernardo Dominic RENEWAL
Juan WieserSpainElwin Sharvill QUALIFIED
James ButtSpainAmy Elsner NEW
Cody SaylorsSpainElwin Sharvill RENEWAL
Kaitlin OstroskyAustraliaIoni Bowcher UNQUALIFIED
Leja CaldareraItalyXuxue Feng UNQUALIFIED
Kaitlin OstroskyUnited KingdomStephen Shaw UNQUALIFIED
Munro FerenczArgentinaStephen Shaw NEW
Arvin AlbaresIndiaBernardo Dominic NEW
Mayumi KolmetzCanadaOnyama Limba UNQUALIFIED
Mayumi KolmetzUnited KingdomIvan Magalhaes QUALIFIED
Adams MorascaFranceAnna Fali PROPOSAL
Smith GlickCanadaElwin Sharvill PROPOSAL
Chavez BriddickSpainIoni Bowcher PROPOSAL
Wickens NestleBrazilElwin Sharvill QUALIFIED
David DarakjyJapanIoni Bowcher NEW
Costa DilliardGermanyElwin Sharvill NEW
Johnson SergiAustraliaBernardo Dominic PROPOSAL
Ivar PaprockiIndiaStephen Shaw UNQUALIFIED
Claire TollnerArgentinaAsiya Javayant QUALIFIED
Morrow RutaRussiaOnyama Limba NEGOTIATION
Nicolas IturbideJapanIvan Magalhaes RENEWAL
Smith GlickAustraliaBernardo Dominic NEW
Clifford RimUnited KingdomAmy Elsner NEGOTIATION
Emily WhobreyFranceElwin Sharvill QUALIFIED
Jennifer AmigonSpainOnyama Limba QUALIFIED
Aruna FigeroaAustraliaAmy Elsner UNQUALIFIED
Salvatore StockhamJapanStephen Shaw QUALIFIED
Jefferson SchemmerFranceAmy Elsner UNQUALIFIED
Jeanfrancois VenereSpainXuxue Feng QUALIFIED
Maisha RulapaughUnited KingdomAsiya Javayant RENEWAL
Adams MorascaGermanyXuxue Feng PROPOSAL
Deepesh ChuiBrazilAsiya Javayant PROPOSAL
Clifford RimItalyXuxue Feng PROPOSAL
Smith GlickBrazilBernardo Dominic NEGOTIATION
Misaki RoysterItalyAsiya Javayant 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>