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 RutaCanadaBernardo Dominic RENEWAL
Aika InouyeItalyBernardo Dominic NEGOTIATION
Jefferson SchemmerBrazilOnyama Limba PROPOSAL
Morrow RutaGermanyOnyama Limba PROPOSAL
Leon OldroydFranceBernardo Dominic RENEWAL
Clifford RimSpainAmy Elsner PROPOSAL
Francesco ShinkoItalyIoni Bowcher QUALIFIED
Leja CaldareraItalyStephen Shaw PROPOSAL
David DarakjyRussiaElwin Sharvill UNQUALIFIED
Claire TollnerArgentinaElwin Sharvill QUALIFIED
Deepesh ChuiBrazilElwin Sharvill RENEWAL
Murillo MaletGermanyAnna Fali RENEWAL
Kadeem FlosiJapanAsiya Javayant PROPOSAL
Ricardo GauchoFranceOnyama Limba RENEWAL
Johnson SergiAustraliaIoni Bowcher NEGOTIATION
Wickens NestleIndiaAnna Fali NEW
Mayumi KolmetzIndiaBernardo Dominic NEGOTIATION
James ButtIndiaIvan Magalhaes NEW
Misaki RoysterGermanyIoni Bowcher UNQUALIFIED
Salvatore StockhamBrazilBernardo Dominic NEW
Emily WhobreyIndiaIoni Bowcher NEW
Johnson SergiCanadaAmy Elsner QUALIFIED
David DarakjyUnited KingdomElwin Sharvill UNQUALIFIED
Wickens NestleBrazilOnyama Limba NEGOTIATION
Mujtaba NickaCanadaXuxue Feng PROPOSAL
Misaki RoysterArgentinaStephen Shaw NEGOTIATION
James ButtItalyStephen Shaw QUALIFIED
Wickens NestleGermanyAnna Fali RENEWAL
Maisha RulapaughFranceXuxue Feng UNQUALIFIED
Arvin AlbaresAustraliaStephen Shaw NEGOTIATION
Julie StensethGermanyIvan Magalhaes PROPOSAL
Jefferson SchemmerFranceIvan Magalhaes QUALIFIED
Isabel BowleyCanadaOnyama Limba QUALIFIED
Silvio SlusarskiBrazilBernardo Dominic NEW
Claire TollnerArgentinaXuxue Feng QUALIFIED
Mujtaba NickaSpainAnna Fali QUALIFIED
Jones VocelkaArgentinaIoni Bowcher NEW
Mayumi KolmetzItalyAmy Elsner RENEWAL
Murillo MaletRussiaElwin Sharvill NEGOTIATION
Morrow RutaItalyAmy Elsner UNQUALIFIED
Maria MarrierUnited KingdomXuxue Feng NEW
James ButtArgentinaBernardo Dominic QUALIFIED
Clifford RimFranceIvan Magalhaes NEGOTIATION
Mujtaba NickaBrazilStephen Shaw NEW
Morrow RutaUnited KingdomElwin Sharvill UNQUALIFIED
Maria MarrierCanadaBernardo Dominic UNQUALIFIED
Aruna FigeroaJapanBernardo Dominic QUALIFIED
Jones VocelkaArgentinaXuxue Feng PROPOSAL
Greenwood BologniaUnited KingdomBernardo Dominic NEGOTIATION
Juan WieserJapanBernardo Dominic QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Tony FollerJapanIvan Magalhaes QUALIFIED
Octavia MaletAustraliaOnyama Limba QUALIFIED
Jefferson SchemmerItalyAnna Fali NEW
Jennifer AmigonArgentinaAnna Fali NEGOTIATION
Mayumi KolmetzJapanAmy Elsner NEW
Deepesh ChuiRussiaIvan Magalhaes UNQUALIFIED
Antonio CaudyUnited KingdomAmy Elsner UNQUALIFIED
Munro FerenczSpainAnna Fali PROPOSAL
Salvatore StockhamJapanIvan Magalhaes UNQUALIFIED
Faith GillianGermanyAnna Fali PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Arvin AlbaresSpain2025-07-25Benton, John B Jr NEGOTIATION18Bernardo Dominic
1001Greenwood BologniaIndia2025-08-16Commercial Press QUALIFIED41Asiya Javayant
1002Mujtaba NickaBrazil2025-08-02Printing Dimensions RENEWAL33Anna Fali
1003Jefferson SchemmerFrance2025-08-05Morlong Associates UNQUALIFIED20Ivan Magalhaes
1004Jones VocelkaItaly2025-08-04Dorl, James J Esq NEGOTIATION13Anna Fali
1005Sinclair WaycottSpain2025-08-12Printing Dimensions NEW7Amy Elsner
1006Mayumi KolmetzArgentina2025-07-26Benton, John B Jr NEW11Stephen Shaw
1007Aika InouyeFrance2025-08-09Buckley Miller Wright NEGOTIATION36Asiya Javayant
1008Munro FerenczAustralia2025-07-20Chapman, Ross E Esq RENEWAL18Ioni Bowcher
1009Sinclair WaycottArgentina2025-07-26Chemel, James L Cpa RENEWAL99Asiya Javayant
1010Claire TollnerRussia2025-08-07Chapman, Ross E Esq PROPOSAL82Stephen Shaw
1011Smith GlickGermany2025-08-06Rousseaux, Michael Esq PROPOSAL45Amy Elsner
1012Izzy GarufiUnited Kingdom2025-08-17Chemel, James L Cpa QUALIFIED81Onyama Limba
1013Julie StensethAustralia2025-08-04King, Christopher A Esq RENEWAL12Xuxue Feng
1014Alejandro PerinGermany2025-07-29Buckley Miller Wright RENEWAL85Ivan Magalhaes
1015Ricardo GauchoArgentina2025-07-31Printing Dimensions NEGOTIATION33Stephen Shaw
1016Arvin AlbaresArgentina2025-07-26King, Christopher A Esq RENEWAL86Elwin Sharvill
1017Costa DilliardFrance2025-07-23Chapman, Ross E Esq QUALIFIED18Elwin Sharvill
1018Emily WhobreyFrance2025-08-18Printing Dimensions NEW99Elwin Sharvill
1019Jennifer AmigonJapan2025-08-03Rousseaux, Michael Esq PROPOSAL54Xuxue Feng
1020Salvatore StockhamArgentina2025-08-10King, Christopher A Esq RENEWAL98Asiya Javayant
1021Mujtaba NickaRussia2025-07-23King, Christopher A Esq QUALIFIED64Ivan Magalhaes
1022Kadeem FlosiRussia2025-08-16Feltz Printing Service NEW58Onyama Limba
1023Francesco ShinkoCanada2025-08-13Buckley Miller Wright PROPOSAL48Amy Elsner
1024Salvatore StockhamGermany2025-07-26Feiner Bros RENEWAL95Onyama Limba
1025Jennifer AmigonGermany2025-07-27Feiner Bros RENEWAL89Onyama Limba
1026Jennifer AmigonJapan2025-08-12Chapman, Ross E Esq UNQUALIFIED82Xuxue Feng
1027Munro FerenczBrazil2025-08-18Buckley Miller Wright QUALIFIED62Anna Fali
1028Ricardo GauchoRussia2025-07-25Dorl, James J Esq QUALIFIED95Asiya Javayant
1029Jefferson SchemmerFrance2025-08-10Rangoni Of Florence QUALIFIED31Amy Elsner
1030Kadeem FlosiArgentina2025-08-08Truhlar And Truhlar Attys RENEWAL11Anna Fali
1031Faith GillianRussia2025-07-21Printing Dimensions UNQUALIFIED60Amy Elsner
1032Deepesh ChuiFrance2025-07-23Chanay, Jeffrey A Esq NEGOTIATION61Stephen Shaw
1033Ricardo GauchoJapan2025-08-11Commercial Press PROPOSAL29Elwin Sharvill
1034Alejandro PerinUnited Kingdom2025-08-08King, Christopher A Esq UNQUALIFIED86Bernardo Dominic
1035Juan WieserItaly2025-08-02Chapman, Ross E Esq PROPOSAL81Amy Elsner
1036Silvio SlusarskiItaly2025-08-17Benton, John B Jr PROPOSAL50Asiya Javayant
1037Greenwood BologniaRussia2025-07-28Morlong Associates QUALIFIED57Elwin Sharvill
1038Isabel BowleyArgentina2025-08-02Morlong Associates NEW11Elwin Sharvill
1039David DarakjyItaly2025-08-04Benton, John B Jr NEGOTIATION80Anna Fali
1040David DarakjyArgentina2025-07-22Rangoni Of Florence RENEWAL46Onyama Limba
1041Julie StensethUnited Kingdom2025-08-16Chapman, Ross E Esq QUALIFIED68Anna Fali
1042Aditya KuskoUnited Kingdom2025-08-10Dorl, James J Esq UNQUALIFIED59Ivan Magalhaes
1043Rodrigues CampainRussia2025-07-21King, Christopher A Esq UNQUALIFIED73Ivan Magalhaes
1044Deepesh ChuiIndia2025-08-05Truhlar And Truhlar Attys PROPOSAL12Elwin Sharvill
1045Adams MorascaFrance2025-07-28Chanay, Jeffrey A Esq RENEWAL18Ivan Magalhaes
1046Alejandro PerinGermany2025-08-18Rangoni Of Florence UNQUALIFIED83Ivan Magalhaes
1047Alejandro PerinItaly2025-08-15Morlong Associates QUALIFIED53Amy Elsner
1048Murillo MaletItaly2025-08-05Truhlar And Truhlar Attys UNQUALIFIED0Stephen Shaw
1049Izzy GarufiJapan2025-07-28Chemel, James L Cpa PROPOSAL2Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Jennifer AmigonCanadaAnna Fali NEGOTIATION
Faith GillianRussiaBernardo Dominic UNQUALIFIED
Silvio SlusarskiCanadaStephen Shaw NEGOTIATION
Silvio SlusarskiArgentinaAmy Elsner NEGOTIATION
Aika InouyeBrazilIvan Magalhaes QUALIFIED
Cody SaylorsItalyOnyama Limba UNQUALIFIED
Silvio SlusarskiUnited KingdomIoni Bowcher PROPOSAL
Misaki RoysterRussiaAnna Fali UNQUALIFIED
Emily WhobreyFranceOnyama Limba RENEWAL
Clifford RimSpainIoni Bowcher RENEWAL
Leja CaldareraCanadaAmy Elsner NEW
Jennifer AmigonBrazilBernardo Dominic RENEWAL
Maria MarrierSpainStephen Shaw PROPOSAL
Murillo MaletUnited KingdomBernardo Dominic RENEWAL
Adams MorascaCanadaXuxue Feng QUALIFIED
Wickens NestleItalyXuxue Feng UNQUALIFIED
Murillo MaletUnited KingdomOnyama Limba RENEWAL
Francesco ShinkoFranceAnna Fali RENEWAL
Silvio SlusarskiAustraliaXuxue Feng NEGOTIATION
Rodrigues CampainItalyBernardo Dominic QUALIFIED
Leon OldroydJapanStephen Shaw RENEWAL
Aruna FigeroaJapanIvan Magalhaes QUALIFIED
Kadeem FlosiArgentinaElwin Sharvill UNQUALIFIED
Wickens NestleIndiaAnna Fali PROPOSAL
Salvatore StockhamAustraliaIvan Magalhaes UNQUALIFIED
Isabel BowleyBrazilAmy Elsner PROPOSAL
Smith GlickRussiaIvan Magalhaes NEW
Ivar PaprockiJapanIoni Bowcher NEW
Sinclair WaycottItalyElwin Sharvill NEGOTIATION
James ButtArgentinaBernardo Dominic UNQUALIFIED
Clifford RimSpainIvan Magalhaes NEW
Isabel BowleyFranceStephen Shaw PROPOSAL
Aika InouyeSpainAsiya Javayant RENEWAL
Murillo MaletArgentinaBernardo Dominic PROPOSAL
Claire TollnerRussiaIvan Magalhaes QUALIFIED
Silvio SlusarskiAustraliaOnyama Limba RENEWAL
James ButtJapanOnyama Limba UNQUALIFIED
Aditya KuskoBrazilOnyama Limba PROPOSAL
Leon OldroydArgentinaElwin Sharvill NEGOTIATION
Mujtaba NickaArgentinaXuxue Feng PROPOSAL
Deepesh ChuiFranceIoni Bowcher RENEWAL
Cody SaylorsAustraliaAnna Fali NEGOTIATION
David DarakjyCanadaBernardo Dominic UNQUALIFIED
Alejandro PerinArgentinaOnyama Limba PROPOSAL
Kadeem FlosiGermanyIvan Magalhaes UNQUALIFIED
Darci PoquetteArgentinaXuxue Feng NEGOTIATION
Kadeem FlosiSpainElwin Sharvill NEW
Julie StensethIndiaOnyama Limba UNQUALIFIED
Kaitlin OstroskyArgentinaIoni Bowcher UNQUALIFIED
Salvatore StockhamUnited KingdomAnna Fali QUALIFIED
Frozen Columns
Name
Smith Glick
Chavez Briddick
Maisha Rulapaugh
Jones Vocelka
Adams Morasca
Rodrigues Campain
Greenwood Bolognia
Misaki Royster
Aditya Kusko
Jones Vocelka
Deepesh Chui
Mujtaba Nicka
Johnson Sergi
Kaitlin Ostrosky
Smith Glick
Salvatore Stockham
Cody Saylors
Aruna Figeroa
Ivar Paprocki
Chavez Briddick
Jeanfrancois Venere
Maria Marrier
Kaitlin Ostrosky
Murillo Malet
Nicolas Iturbide
Izzy Garufi
Adams Morasca
Octavia Malet
Stacey Maclead
Aruna Figeroa
Johnson Sergi
Silvio Slusarski
Faith Gillian
Adams Morasca
Ricardo Gaucho
Sinclair Waycott
Claire Tollner
Kadeem Flosi
Leon Oldroyd
Sinclair Waycott
Tony Foller
Cody Saylors
Sinclair Waycott
Stacey Maclead
Maisha Rulapaugh
Murillo Malet
Faith Gillian
Ashley Doe
Ashley Doe
Costa Dilliard
IdCountryDate
1000Italy2025-08-07
1001United Kingdom2025-08-15
1002Japan2025-08-02
1003India2025-07-22
1004Spain2025-08-02
1005Argentina2025-08-12
1006Japan2025-08-01
1007Japan2025-07-22
1008Italy2025-08-11
1009Canada2025-07-24
1010Brazil2025-07-20
1011Argentina2025-07-21
1012United Kingdom2025-08-12
1013Australia2025-08-16
1014Argentina2025-08-06
1015Canada2025-08-02
1016Argentina2025-08-13
1017India2025-07-20
1018Argentina2025-08-16
1019Russia2025-08-12
1020Canada2025-07-31
1021Japan2025-08-13
1022Australia2025-07-22
1023Australia2025-08-04
1024Argentina2025-08-01
1025Russia2025-07-31
1026Canada2025-07-22
1027Germany2025-08-09
1028Spain2025-08-03
1029India2025-08-14
1030Australia2025-07-26
1031Australia2025-07-30
1032India2025-07-20
1033Spain2025-08-02
1034Russia2025-07-31
1035Germany2025-08-05
1036France2025-07-21
1037Japan2025-08-01
1038France2025-08-10
1039Russia2025-08-12
1040India2025-07-22
1041Brazil2025-08-16
1042Italy2025-07-27
1043Germany2025-07-25
1044Russia2025-07-23
1045India2025-07-28
1046Argentina2025-08-08
1047Argentina2025-07-26
1048Canada2025-08-13
1049Italy2025-07-22

On-Demand Data

NameIdCountryDate
Arvin Albares1000Canada2025-07-23
Munro Ferencz1001India2025-07-25
Aika Inouye1002Canada2025-08-12
James Butt1003Italy2025-07-26
Deepesh Chui1004United Kingdom2025-08-16
Isabel Bowley1005Australia2025-08-07
Juan Wieser1006France2025-07-20
David Darakjy1007Japan2025-07-22
Octavia Malet1008Germany2025-07-23
Sinclair Waycott1009Italy2025-08-06
Smith Glick1010United Kingdom2025-08-03
Murillo Malet1011Russia2025-08-11
Izzy Garufi1012Japan2025-07-27
Jones Vocelka1013United Kingdom2025-08-09
Leja Caldarera1014India2025-07-22
Isabel Bowley1015Russia2025-08-09
Sinclair Waycott1016United Kingdom2025-08-06
Kaitlin Ostrosky1017Argentina2025-08-05
David Darakjy1018United Kingdom2025-08-10
Morrow Ruta1019Russia2025-07-23
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Claire TollnerFranceIoni Bowcher UNQUALIFIED
Juan WieserItalyAnna Fali NEW
Cody SaylorsSpainElwin Sharvill NEGOTIATION
Morrow RutaAustraliaBernardo Dominic UNQUALIFIED
Ashley DoeJapanBernardo Dominic NEW
Izzy GarufiRussiaIvan Magalhaes NEW
Ashley DoeBrazilAmy Elsner PROPOSAL
Jefferson SchemmerUnited KingdomXuxue Feng UNQUALIFIED
Munro FerenczRussiaAsiya Javayant NEGOTIATION
Claire TollnerIndiaAnna Fali UNQUALIFIED
Deepesh ChuiBrazilStephen Shaw RENEWAL
Jennifer AmigonCanadaIoni Bowcher PROPOSAL
Munro FerenczItalyStephen Shaw RENEWAL
Octavia MaletIndiaAnna Fali UNQUALIFIED
Costa DilliardArgentinaAsiya Javayant PROPOSAL
Misaki RoysterIndiaAmy Elsner PROPOSAL
Stacey MacleadRussiaOnyama Limba UNQUALIFIED
Izzy GarufiJapanBernardo Dominic QUALIFIED
Leja CaldareraGermanyXuxue Feng QUALIFIED
Cody SaylorsItalyIvan Magalhaes QUALIFIED
Nicolas IturbideUnited KingdomXuxue Feng NEW
Silvio SlusarskiJapanAsiya Javayant NEW
Alejandro PerinItalyOnyama Limba NEW
Mayumi KolmetzGermanyOnyama Limba RENEWAL
Greenwood BologniaRussiaBernardo Dominic PROPOSAL
Morrow RutaItalyXuxue Feng PROPOSAL
Ivar PaprockiItalyBernardo Dominic NEGOTIATION
Isabel BowleyCanadaXuxue Feng QUALIFIED
Deepesh ChuiCanadaIoni Bowcher NEW
Maria MarrierAustraliaBernardo Dominic PROPOSAL
Costa DilliardIndiaStephen Shaw PROPOSAL
Rodrigues CampainFranceIvan Magalhaes UNQUALIFIED
Greenwood BologniaUnited KingdomOnyama Limba NEW
Adams MorascaFranceStephen Shaw NEW
Mayumi KolmetzJapanXuxue Feng PROPOSAL
Smith GlickBrazilIoni Bowcher PROPOSAL
Clifford RimIndiaXuxue Feng NEGOTIATION
Ashley DoeCanadaAsiya Javayant PROPOSAL
Chavez BriddickGermanyOnyama Limba NEW
Aika InouyeBrazilStephen Shaw RENEWAL

<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>