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
Cody SaylorsRussiaIoni Bowcher NEGOTIATION
David DarakjySpainStephen Shaw NEGOTIATION
Deepesh ChuiJapanXuxue Feng NEW
Nicolas IturbideCanadaAmy Elsner NEW
Leja CaldareraArgentinaBernardo Dominic QUALIFIED
Juan WieserCanadaAnna Fali RENEWAL
Cody SaylorsItalyAmy Elsner NEW
Ricardo GauchoJapanIoni Bowcher NEGOTIATION
Deepesh ChuiFranceAmy Elsner PROPOSAL
Costa DilliardGermanyAmy Elsner PROPOSAL
Johnson SergiUnited KingdomXuxue Feng NEW
Ashley DoeAustraliaElwin Sharvill NEW
Maisha RulapaughAustraliaIvan Magalhaes NEW
David DarakjyItalyAmy Elsner NEGOTIATION
Nicolas IturbideItalyOnyama Limba PROPOSAL
Julie StensethBrazilIvan Magalhaes UNQUALIFIED
Alejandro PerinGermanyAmy Elsner NEW
Ricardo GauchoArgentinaOnyama Limba NEW
Misaki RoysterFranceOnyama Limba QUALIFIED
James ButtCanadaElwin Sharvill NEGOTIATION
Chavez BriddickUnited KingdomIvan Magalhaes QUALIFIED
Ricardo GauchoCanadaStephen Shaw QUALIFIED
Ashley DoeSpainElwin Sharvill PROPOSAL
Mujtaba NickaAustraliaIoni Bowcher NEW
Clifford RimIndiaAsiya Javayant NEGOTIATION
Nicolas IturbideCanadaIoni Bowcher NEGOTIATION
Sinclair WaycottFranceBernardo Dominic NEGOTIATION
Wickens NestleItalyAnna Fali UNQUALIFIED
Emily WhobreyIndiaIvan Magalhaes PROPOSAL
Greenwood BologniaItalyOnyama Limba RENEWAL
Aditya KuskoSpainBernardo Dominic QUALIFIED
Misaki RoysterIndiaAnna Fali QUALIFIED
Tony FollerCanadaStephen Shaw QUALIFIED
Murillo MaletAustraliaAnna Fali NEGOTIATION
Rodrigues CampainAustraliaIoni Bowcher UNQUALIFIED
Ricardo GauchoSpainElwin Sharvill QUALIFIED
Aika InouyeRussiaAmy Elsner UNQUALIFIED
Ashley DoeSpainStephen Shaw NEGOTIATION
Jennifer AmigonItalyBernardo Dominic NEW
Nicolas IturbideFranceAmy Elsner QUALIFIED
Leon OldroydUnited KingdomAnna Fali RENEWAL
Morrow RutaBrazilAsiya Javayant RENEWAL
Maisha RulapaughIndiaBernardo Dominic QUALIFIED
Juan WieserBrazilAmy Elsner QUALIFIED
Emily WhobreyIndiaIvan Magalhaes NEGOTIATION
Alejandro PerinFranceIvan Magalhaes RENEWAL
Morrow RutaJapanBernardo Dominic UNQUALIFIED
Chavez BriddickCanadaIvan Magalhaes QUALIFIED
Leon OldroydUnited KingdomElwin Sharvill UNQUALIFIED
Leon OldroydSpainIoni Bowcher NEW
Horizontal
NameCountryRepresentativeStatus
James ButtGermanyAsiya Javayant UNQUALIFIED
Ricardo GauchoSpainIvan Magalhaes NEW
Sinclair WaycottBrazilBernardo Dominic RENEWAL
Smith GlickGermanyIvan Magalhaes NEGOTIATION
Claire TollnerAustraliaAsiya Javayant NEGOTIATION
Aruna FigeroaFranceAsiya Javayant NEGOTIATION
Aruna FigeroaGermanyBernardo Dominic NEGOTIATION
Alejandro PerinArgentinaAsiya Javayant QUALIFIED
Ricardo GauchoCanadaXuxue Feng UNQUALIFIED
David DarakjyItalyAmy Elsner QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000James ButtAustralia2026-05-28Buckley Miller Wright NEW27Stephen Shaw
1001Kaitlin OstroskyArgentina2026-06-11Chanay, Jeffrey A Esq NEGOTIATION28Ivan Magalhaes
1002Leja CaldareraBrazil2026-06-15Printing Dimensions UNQUALIFIED63Xuxue Feng
1003Mujtaba NickaIndia2026-06-10Dorl, James J Esq RENEWAL50Ioni Bowcher
1004Nicolas IturbideSpain2026-05-27Rousseaux, Michael Esq NEGOTIATION91Onyama Limba
1005Aruna FigeroaCanada2026-06-11Commercial Press NEGOTIATION58Ivan Magalhaes
1006Leja CaldareraSpain2026-06-11Chanay, Jeffrey A Esq NEGOTIATION34Asiya Javayant
1007Jones VocelkaIndia2026-06-03Chapman, Ross E Esq QUALIFIED2Asiya Javayant
1008Jefferson SchemmerRussia2026-06-06Feiner Bros RENEWAL37Anna Fali
1009Kadeem FlosiUnited Kingdom2026-05-20Feiner Bros PROPOSAL71Bernardo Dominic
1010Costa DilliardArgentina2026-05-22Benton, John B Jr RENEWAL98Elwin Sharvill
1011Silvio SlusarskiGermany2026-06-13Chanay, Jeffrey A Esq PROPOSAL81Xuxue Feng
1012Tony FollerItaly2026-06-15Rangoni Of Florence NEW82Asiya Javayant
1013Smith GlickSpain2026-05-24Chemel, James L Cpa RENEWAL70Anna Fali
1014Munro FerenczAustralia2026-06-09Commercial Press UNQUALIFIED75Bernardo Dominic
1015Ashley DoeItaly2026-05-21Buckley Miller Wright UNQUALIFIED76Stephen Shaw
1016Aruna FigeroaBrazil2026-06-14Rangoni Of Florence NEW28Ivan Magalhaes
1017Cody SaylorsUnited Kingdom2026-05-25Benton, John B Jr UNQUALIFIED75Ivan Magalhaes
1018Mayumi KolmetzBrazil2026-05-31Dorl, James J Esq PROPOSAL32Asiya Javayant
1019Kadeem FlosiJapan2026-06-16Morlong Associates RENEWAL22Elwin Sharvill
1020Aruna FigeroaIndia2026-06-08Chapman, Ross E Esq NEW49Ioni Bowcher
1021Juan WieserFrance2026-06-05Rangoni Of Florence QUALIFIED37Bernardo Dominic
1022Munro FerenczBrazil2026-05-23Rangoni Of Florence NEW47Ivan Magalhaes
1023Jones VocelkaFrance2026-06-09Rousseaux, Michael Esq QUALIFIED35Onyama Limba
1024Octavia MaletRussia2026-05-27Chanay, Jeffrey A Esq NEW86Xuxue Feng
1025David DarakjyUnited Kingdom2026-06-11King, Christopher A Esq QUALIFIED2Anna Fali
1026Cody SaylorsBrazil2026-05-25Printing Dimensions RENEWAL36Amy Elsner
1027Ashley DoeIndia2026-06-01Chanay, Jeffrey A Esq RENEWAL32Xuxue Feng
1028Julie StensethArgentina2026-06-13King, Christopher A Esq NEGOTIATION66Asiya Javayant
1029Aruna FigeroaGermany2026-06-07Feltz Printing Service PROPOSAL2Anna Fali
1030Wickens NestleGermany2026-06-11King, Christopher A Esq PROPOSAL42Onyama Limba
1031Kaitlin OstroskyCanada2026-05-18Rangoni Of Florence NEW10Ivan Magalhaes
1032Izzy GarufiIndia2026-06-01Dorl, James J Esq PROPOSAL25Amy Elsner
1033Costa DilliardFrance2026-06-08Buckley Miller Wright NEW61Anna Fali
1034Antonio CaudyAustralia2026-06-16Buckley Miller Wright QUALIFIED20Onyama Limba
1035Kadeem FlosiFrance2026-05-21Buckley Miller Wright UNQUALIFIED7Bernardo Dominic
1036Mayumi KolmetzIndia2026-06-11Feiner Bros UNQUALIFIED4Asiya Javayant
1037Wickens NestleItaly2026-06-13Commercial Press PROPOSAL36Amy Elsner
1038Isabel BowleyArgentina2026-05-26Dorl, James J Esq NEW3Ioni Bowcher
1039Stacey MacleadIndia2026-06-06Feltz Printing Service NEW5Ivan Magalhaes
1040Ashley DoeJapan2026-06-05King, Christopher A Esq PROPOSAL35Asiya Javayant
1041Adams MorascaCanada2026-06-11Dorl, James J Esq UNQUALIFIED44Asiya Javayant
1042Antonio CaudyItaly2026-06-09Feiner Bros NEGOTIATION74Ioni Bowcher
1043Ricardo GauchoAustralia2026-06-11Dorl, James J Esq PROPOSAL38Anna Fali
1044Munro FerenczIndia2026-05-19Chanay, Jeffrey A Esq RENEWAL59Ivan Magalhaes
1045Faith GillianJapan2026-06-08Benton, John B Jr NEGOTIATION50Bernardo Dominic
1046Mujtaba NickaFrance2026-06-12Feltz Printing Service QUALIFIED88Xuxue Feng
1047Salvatore StockhamRussia2026-05-18Feltz Printing Service NEW56Anna Fali
1048Ashley DoeItaly2026-05-29Commercial Press NEW49Bernardo Dominic
1049Maria MarrierArgentina2026-05-18Chemel, James L Cpa RENEWAL66Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Morrow RutaUnited KingdomElwin Sharvill PROPOSAL
Maisha RulapaughFranceAsiya Javayant NEW
Aditya KuskoAustraliaStephen Shaw PROPOSAL
Maria MarrierUnited KingdomAnna Fali PROPOSAL
Cody SaylorsBrazilAmy Elsner PROPOSAL
Isabel BowleyGermanyBernardo Dominic UNQUALIFIED
Adams MorascaArgentinaXuxue Feng RENEWAL
Adams MorascaBrazilOnyama Limba NEW
Leon OldroydBrazilBernardo Dominic NEW
Deepesh ChuiCanadaXuxue Feng NEW
Izzy GarufiArgentinaBernardo Dominic NEGOTIATION
Ivar PaprockiSpainAmy Elsner NEGOTIATION
Nicolas IturbideJapanElwin Sharvill PROPOSAL
Mujtaba NickaAustraliaXuxue Feng NEGOTIATION
Morrow RutaAustraliaBernardo Dominic PROPOSAL
Nicolas IturbideRussiaBernardo Dominic PROPOSAL
Francesco ShinkoRussiaIoni Bowcher QUALIFIED
Ivar PaprockiItalyIvan Magalhaes NEW
Emily WhobreyUnited KingdomAnna Fali RENEWAL
Morrow RutaBrazilAnna Fali NEGOTIATION
Misaki RoysterSpainElwin Sharvill NEW
Izzy GarufiGermanyIoni Bowcher RENEWAL
Jeanfrancois VenereFranceAnna Fali RENEWAL
Octavia MaletJapanAsiya Javayant NEGOTIATION
Isabel BowleyAustraliaXuxue Feng PROPOSAL
Morrow RutaAustraliaIoni Bowcher NEW
Jennifer AmigonCanadaStephen Shaw QUALIFIED
Sinclair WaycottUnited KingdomOnyama Limba RENEWAL
Ashley DoeGermanyStephen Shaw QUALIFIED
Mayumi KolmetzGermanyBernardo Dominic PROPOSAL
Smith GlickIndiaIoni Bowcher NEGOTIATION
Misaki RoysterFranceElwin Sharvill NEGOTIATION
Rodrigues CampainJapanAnna Fali RENEWAL
Antonio CaudyAustraliaBernardo Dominic PROPOSAL
Wickens NestleJapanBernardo Dominic PROPOSAL
Tony FollerGermanyIvan Magalhaes RENEWAL
Leja CaldareraSpainOnyama Limba PROPOSAL
Aruna FigeroaGermanyElwin Sharvill QUALIFIED
Adams MorascaSpainAsiya Javayant QUALIFIED
Maria MarrierUnited KingdomStephen Shaw UNQUALIFIED
Francesco ShinkoFranceOnyama Limba NEGOTIATION
Johnson SergiArgentinaElwin Sharvill PROPOSAL
Leon OldroydAustraliaAmy Elsner QUALIFIED
Cody SaylorsGermanyElwin Sharvill RENEWAL
Leja CaldareraAustraliaIvan Magalhaes PROPOSAL
Adams MorascaItalyStephen Shaw PROPOSAL
Leja CaldareraCanadaAsiya Javayant RENEWAL
Maria MarrierBrazilAmy Elsner PROPOSAL
Emily WhobreyBrazilElwin Sharvill RENEWAL
Claire TollnerGermanyBernardo Dominic PROPOSAL
Frozen Columns
Name
Maisha Rulapaugh
Silvio Slusarski
Silvio Slusarski
Ashley Doe
Ashley Doe
Greenwood Bolognia
Julie Stenseth
Kadeem Flosi
Aika Inouye
Murillo Malet
Murillo Malet
Darci Poquette
Leja Caldarera
Costa Dilliard
Darci Poquette
Wickens Nestle
Aditya Kusko
Leja Caldarera
Morrow Ruta
Aruna Figeroa
Maisha Rulapaugh
Arvin Albares
Greenwood Bolognia
Isabel Bowley
Arvin Albares
Jeanfrancois Venere
Faith Gillian
Smith Glick
Jeanfrancois Venere
Maisha Rulapaugh
Francesco Shinko
Mujtaba Nicka
Maria Marrier
Kaitlin Ostrosky
Leja Caldarera
Johnson Sergi
Mujtaba Nicka
Adams Morasca
Greenwood Bolognia
Sinclair Waycott
Ricardo Gaucho
Leja Caldarera
Arvin Albares
James Butt
David Darakjy
Maisha Rulapaugh
Cody Saylors
Greenwood Bolognia
Maria Marrier
Rodrigues Campain
IdCountryDate
1000Japan2026-06-15
1001Argentina2026-05-23
1002United Kingdom2026-05-26
1003Russia2026-05-30
1004Spain2026-06-04
1005France2026-06-05
1006Russia2026-06-16
1007Australia2026-06-11
1008Spain2026-06-10
1009Brazil2026-06-01
1010Germany2026-05-22
1011Italy2026-05-25
1012Australia2026-05-29
1013Russia2026-05-21
1014Italy2026-06-03
1015Germany2026-06-09
1016India2026-05-28
1017Spain2026-05-30
1018Brazil2026-05-30
1019United Kingdom2026-06-04
1020Brazil2026-05-21
1021Russia2026-05-22
1022Argentina2026-06-07
1023Japan2026-06-08
1024France2026-05-19
1025Japan2026-05-31
1026Australia2026-05-31
1027France2026-05-20
1028Russia2026-05-28
1029United Kingdom2026-06-09
1030Japan2026-06-07
1031Canada2026-06-07
1032Japan2026-05-29
1033Spain2026-06-03
1034Australia2026-06-09
1035Japan2026-06-09
1036Argentina2026-06-02
1037Germany2026-05-29
1038France2026-05-18
1039Argentina2026-05-27
1040Argentina2026-06-10
1041Italy2026-05-19
1042Spain2026-06-04
1043Germany2026-06-05
1044India2026-05-27
1045Russia2026-06-13
1046Australia2026-05-26
1047Brazil2026-06-04
1048Argentina2026-05-18
1049India2026-06-02

On-Demand Data

NameIdCountryDate
Aditya Kusko1000Brazil2026-05-18
Nicolas Iturbide1001Spain2026-05-24
Greenwood Bolognia1002Russia2026-06-13
Costa Dilliard1003United Kingdom2026-06-09
Jefferson Schemmer1004Argentina2026-06-04
Kaitlin Ostrosky1005Germany2026-06-07
Izzy Garufi1006Germany2026-06-12
Octavia Malet1007Russia2026-06-02
Jeanfrancois Venere1008Argentina2026-06-14
Darci Poquette1009Argentina2026-06-15
Leja Caldarera1010Australia2026-06-03
Aruna Figeroa1011France2026-06-06
Adams Morasca1012United Kingdom2026-05-29
Antonio Caudy1013Brazil2026-05-29
Octavia Malet1014France2026-06-03
Mayumi Kolmetz1015Canada2026-06-14
Mujtaba Nicka1016India2026-06-12
Arvin Albares1017Brazil2026-05-30
Murillo Malet1018Spain2026-05-21
Sinclair Waycott1019Australia2026-06-12
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
David DarakjyFranceElwin Sharvill NEW
Adams MorascaBrazilElwin Sharvill UNQUALIFIED
Ashley DoeBrazilAnna Fali UNQUALIFIED
Julie StensethRussiaXuxue Feng QUALIFIED
Munro FerenczCanadaAmy Elsner NEGOTIATION
Kaitlin OstroskyJapanIvan Magalhaes NEGOTIATION
Octavia MaletSpainBernardo Dominic PROPOSAL
Ashley DoeUnited KingdomAnna Fali QUALIFIED
Faith GillianRussiaElwin Sharvill NEW
Jeanfrancois VenereIndiaOnyama Limba QUALIFIED
Alejandro PerinJapanIvan Magalhaes PROPOSAL
Emily WhobreyRussiaAsiya Javayant NEW
Aditya KuskoFranceStephen Shaw NEGOTIATION
Maisha RulapaughBrazilIvan Magalhaes NEW
Adams MorascaRussiaAnna Fali PROPOSAL
Rodrigues CampainUnited KingdomXuxue Feng NEGOTIATION
Cody SaylorsFranceAsiya Javayant PROPOSAL
Francesco ShinkoRussiaIvan Magalhaes QUALIFIED
Clifford RimUnited KingdomAnna Fali QUALIFIED
Kadeem FlosiAustraliaStephen Shaw RENEWAL
Smith GlickAustraliaAmy Elsner QUALIFIED
Antonio CaudyRussiaXuxue Feng NEW
Clifford RimRussiaAmy Elsner RENEWAL
Ivar PaprockiGermanyAmy Elsner UNQUALIFIED
Antonio CaudyCanadaAsiya Javayant UNQUALIFIED
Francesco ShinkoUnited KingdomAnna Fali NEGOTIATION
Kaitlin OstroskyItalyAsiya Javayant NEW
Deepesh ChuiAustraliaStephen Shaw PROPOSAL
Johnson SergiItalyIvan Magalhaes QUALIFIED
Silvio SlusarskiJapanXuxue Feng RENEWAL
Munro FerenczJapanStephen Shaw UNQUALIFIED
Clifford RimArgentinaXuxue Feng QUALIFIED
Faith GillianCanadaXuxue Feng PROPOSAL
Costa DilliardBrazilXuxue Feng NEW
Leja CaldareraUnited KingdomBernardo Dominic QUALIFIED
Deepesh ChuiAustraliaXuxue Feng UNQUALIFIED
Chavez BriddickSpainElwin Sharvill RENEWAL
Misaki RoysterGermanyIvan Magalhaes QUALIFIED
Isabel BowleyUnited KingdomBernardo Dominic NEGOTIATION
David DarakjyUnited KingdomIoni Bowcher 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>