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
Izzy GarufiGermanyIoni Bowcher PROPOSAL
Salvatore StockhamGermanyElwin Sharvill RENEWAL
Leja CaldareraCanadaElwin Sharvill RENEWAL
Sinclair WaycottSpainXuxue Feng NEGOTIATION
Maisha RulapaughJapanStephen Shaw UNQUALIFIED
Kaitlin OstroskySpainElwin Sharvill UNQUALIFIED
Aika InouyeUnited KingdomAnna Fali PROPOSAL
Ashley DoeIndiaXuxue Feng PROPOSAL
Aruna FigeroaGermanyStephen Shaw RENEWAL
Costa DilliardGermanyAnna Fali NEGOTIATION
Adams MorascaJapanAnna Fali QUALIFIED
Johnson SergiJapanIvan Magalhaes PROPOSAL
Ashley DoeIndiaIoni Bowcher NEW
Izzy GarufiAustraliaIoni Bowcher UNQUALIFIED
Kadeem FlosiBrazilElwin Sharvill QUALIFIED
Juan WieserUnited KingdomElwin Sharvill QUALIFIED
Juan WieserJapanAnna Fali PROPOSAL
Aruna FigeroaFranceXuxue Feng NEGOTIATION
David DarakjyFranceStephen Shaw PROPOSAL
Claire TollnerRussiaAmy Elsner RENEWAL
Morrow RutaUnited KingdomAsiya Javayant NEGOTIATION
Antonio CaudySpainIvan Magalhaes NEGOTIATION
Silvio SlusarskiUnited KingdomOnyama Limba PROPOSAL
Morrow RutaGermanyOnyama Limba NEGOTIATION
Rodrigues CampainGermanyElwin Sharvill RENEWAL
Johnson SergiJapanXuxue Feng NEGOTIATION
Johnson SergiIndiaIoni Bowcher PROPOSAL
Kadeem FlosiAustraliaBernardo Dominic QUALIFIED
Mayumi KolmetzBrazilAnna Fali PROPOSAL
Deepesh ChuiAustraliaAmy Elsner UNQUALIFIED
Octavia MaletUnited KingdomStephen Shaw NEW
Greenwood BologniaIndiaAsiya Javayant NEW
Leon OldroydRussiaElwin Sharvill NEW
James ButtSpainXuxue Feng RENEWAL
Aditya KuskoRussiaIvan Magalhaes NEGOTIATION
Mujtaba NickaAustraliaOnyama Limba NEW
Julie StensethJapanBernardo Dominic UNQUALIFIED
Isabel BowleyFranceStephen Shaw QUALIFIED
Alejandro PerinRussiaXuxue Feng RENEWAL
Deepesh ChuiGermanyAmy Elsner UNQUALIFIED
Nicolas IturbideAustraliaXuxue Feng NEGOTIATION
Aruna FigeroaRussiaIvan Magalhaes PROPOSAL
Octavia MaletArgentinaXuxue Feng PROPOSAL
Kadeem FlosiFranceAmy Elsner RENEWAL
Deepesh ChuiCanadaIoni Bowcher PROPOSAL
Misaki RoysterSpainBernardo Dominic NEGOTIATION
Julie StensethFranceIvan Magalhaes NEGOTIATION
Deepesh ChuiCanadaOnyama Limba NEW
Maria MarrierArgentinaStephen Shaw QUALIFIED
Salvatore StockhamJapanBernardo Dominic NEW
Horizontal
NameCountryRepresentativeStatus
Stacey MacleadFranceXuxue Feng UNQUALIFIED
Salvatore StockhamUnited KingdomBernardo Dominic RENEWAL
Ivar PaprockiGermanyAmy Elsner RENEWAL
Ricardo GauchoItalyIoni Bowcher QUALIFIED
Maisha RulapaughIndiaIoni Bowcher RENEWAL
Antonio CaudyCanadaStephen Shaw NEGOTIATION
Cody SaylorsJapanElwin Sharvill NEW
Claire TollnerUnited KingdomElwin Sharvill NEW
Faith GillianJapanIoni Bowcher QUALIFIED
Francesco ShinkoFranceIvan Magalhaes RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Francesco ShinkoRussia2026-05-16King, Christopher A Esq PROPOSAL6Stephen Shaw
1001Ashley DoeGermany2026-05-06Feiner Bros NEGOTIATION85Bernardo Dominic
1002Jeanfrancois VenereUnited Kingdom2026-05-18Morlong Associates NEW32Elwin Sharvill
1003Francesco ShinkoUnited Kingdom2026-05-11Chanay, Jeffrey A Esq QUALIFIED72Bernardo Dominic
1004Ashley DoeBrazil2026-05-22Chanay, Jeffrey A Esq UNQUALIFIED43Bernardo Dominic
1005Darci PoquetteBrazil2026-05-04Morlong Associates NEGOTIATION61Elwin Sharvill
1006David DarakjyBrazil2026-05-10Chapman, Ross E Esq RENEWAL98Ivan Magalhaes
1007Faith GillianArgentina2026-04-28Dorl, James J Esq NEW68Bernardo Dominic
1008Stacey MacleadBrazil2026-05-01Dorl, James J Esq PROPOSAL59Onyama Limba
1009Misaki RoysterJapan2026-04-30Chapman, Ross E Esq NEW58Amy Elsner
1010Sinclair WaycottFrance2026-05-14Truhlar And Truhlar Attys UNQUALIFIED29Xuxue Feng
1011Stacey MacleadGermany2026-05-08Feiner Bros NEGOTIATION8Onyama Limba
1012Mujtaba NickaArgentina2026-05-12Chanay, Jeffrey A Esq PROPOSAL66Elwin Sharvill
1013Kadeem FlosiFrance2026-05-19Feiner Bros NEGOTIATION78Asiya Javayant
1014Stacey MacleadAustralia2026-05-24Printing Dimensions NEW43Amy Elsner
1015Maria MarrierGermany2026-05-06Feiner Bros UNQUALIFIED55Ivan Magalhaes
1016Aika InouyeUnited Kingdom2026-05-10Chapman, Ross E Esq QUALIFIED33Onyama Limba
1017Darci PoquetteBrazil2026-05-12Feiner Bros NEGOTIATION17Amy Elsner
1018Jefferson SchemmerRussia2026-04-28Rangoni Of Florence QUALIFIED5Bernardo Dominic
1019Aika InouyeArgentina2026-04-30Chemel, James L Cpa UNQUALIFIED17Asiya Javayant
1020Jeanfrancois VenereJapan2026-05-20Feltz Printing Service QUALIFIED7Anna Fali
1021Alejandro PerinItaly2026-05-19Chanay, Jeffrey A Esq NEW74Asiya Javayant
1022Munro FerenczItaly2026-05-20King, Christopher A Esq RENEWAL50Ioni Bowcher
1023Ricardo GauchoJapan2026-05-03Buckley Miller Wright QUALIFIED53Asiya Javayant
1024Wickens NestleItaly2026-05-07Buckley Miller Wright UNQUALIFIED75Stephen Shaw
1025Tony FollerSpain2026-05-27King, Christopher A Esq UNQUALIFIED87Elwin Sharvill
1026Leon OldroydRussia2026-05-14King, Christopher A Esq QUALIFIED29Elwin Sharvill
1027Murillo MaletItaly2026-05-25Chemel, James L Cpa QUALIFIED2Ivan Magalhaes
1028Darci PoquetteFrance2026-04-29Chapman, Ross E Esq QUALIFIED25Ivan Magalhaes
1029Darci PoquetteIndia2026-05-22Chemel, James L Cpa NEW25Xuxue Feng
1030Tony FollerArgentina2026-05-10Buckley Miller Wright QUALIFIED65Amy Elsner
1031Claire TollnerCanada2026-05-11Chanay, Jeffrey A Esq NEW58Ivan Magalhaes
1032Faith GillianJapan2026-05-04Truhlar And Truhlar Attys RENEWAL89Ioni Bowcher
1033Deepesh ChuiCanada2026-05-22King, Christopher A Esq UNQUALIFIED19Xuxue Feng
1034Munro FerenczItaly2026-05-24King, Christopher A Esq UNQUALIFIED57Ivan Magalhaes
1035Izzy GarufiItaly2026-05-24Dorl, James J Esq UNQUALIFIED61Onyama Limba
1036Clifford RimGermany2026-05-23Chapman, Ross E Esq NEW11Bernardo Dominic
1037Costa DilliardJapan2026-05-13Rangoni Of Florence NEGOTIATION54Stephen Shaw
1038Adams MorascaFrance2026-05-19Chanay, Jeffrey A Esq PROPOSAL59Elwin Sharvill
1039Sinclair WaycottGermany2026-05-19Truhlar And Truhlar Attys NEW68Onyama Limba
1040Adams MorascaIndia2026-04-30Rangoni Of Florence PROPOSAL64Bernardo Dominic
1041Ivar PaprockiFrance2026-05-14Chemel, James L Cpa NEW60Amy Elsner
1042Francesco ShinkoItaly2026-05-24Rousseaux, Michael Esq QUALIFIED73Bernardo Dominic
1043Faith GillianRussia2026-05-18Feltz Printing Service RENEWAL63Bernardo Dominic
1044Costa DilliardCanada2026-05-20King, Christopher A Esq QUALIFIED55Bernardo Dominic
1045Jones VocelkaFrance2026-05-03Buckley Miller Wright RENEWAL40Bernardo Dominic
1046Isabel BowleyBrazil2026-05-24Chemel, James L Cpa UNQUALIFIED8Elwin Sharvill
1047Leon OldroydAustralia2026-05-01Rousseaux, Michael Esq PROPOSAL19Bernardo Dominic
1048Munro FerenczArgentina2026-05-26Chapman, Ross E Esq NEW93Asiya Javayant
1049Ashley DoeBrazil2026-05-25Rousseaux, Michael Esq NEGOTIATION62Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Aika InouyeSpainAsiya Javayant RENEWAL
Adams MorascaCanadaAsiya Javayant NEW
Sinclair WaycottBrazilIvan Magalhaes NEW
Kadeem FlosiCanadaStephen Shaw QUALIFIED
Silvio SlusarskiArgentinaXuxue Feng UNQUALIFIED
Maisha RulapaughJapanAnna Fali NEW
Salvatore StockhamRussiaAsiya Javayant PROPOSAL
Antonio CaudyFranceXuxue Feng NEGOTIATION
Kaitlin OstroskySpainBernardo Dominic QUALIFIED
Francesco ShinkoAustraliaBernardo Dominic NEGOTIATION
Octavia MaletItalyAnna Fali NEW
Costa DilliardJapanIvan Magalhaes PROPOSAL
Ivar PaprockiUnited KingdomStephen Shaw QUALIFIED
Aditya KuskoBrazilElwin Sharvill NEW
Silvio SlusarskiFranceAsiya Javayant QUALIFIED
Kaitlin OstroskyIndiaIoni Bowcher NEGOTIATION
Aditya KuskoAustraliaXuxue Feng NEGOTIATION
Octavia MaletGermanyAmy Elsner NEW
Munro FerenczArgentinaXuxue Feng UNQUALIFIED
Smith GlickItalyAmy Elsner UNQUALIFIED
Cody SaylorsBrazilAnna Fali QUALIFIED
Sinclair WaycottGermanyIoni Bowcher NEW
Adams MorascaJapanIoni Bowcher PROPOSAL
Ashley DoeUnited KingdomIvan Magalhaes UNQUALIFIED
Deepesh ChuiUnited KingdomStephen Shaw RENEWAL
Ashley DoeJapanOnyama Limba QUALIFIED
Jones VocelkaFranceStephen Shaw QUALIFIED
Antonio CaudyArgentinaXuxue Feng NEGOTIATION
Maria MarrierGermanyIvan Magalhaes QUALIFIED
Aditya KuskoRussiaStephen Shaw PROPOSAL
Leon OldroydRussiaAsiya Javayant RENEWAL
Maria MarrierIndiaIvan Magalhaes UNQUALIFIED
Aruna FigeroaAustraliaXuxue Feng NEW
Jeanfrancois VenereRussiaStephen Shaw RENEWAL
Smith GlickFranceElwin Sharvill NEW
Claire TollnerCanadaAsiya Javayant NEGOTIATION
Kadeem FlosiRussiaIvan Magalhaes NEGOTIATION
Antonio CaudyBrazilBernardo Dominic PROPOSAL
Jeanfrancois VenereFranceOnyama Limba RENEWAL
Adams MorascaSpainElwin Sharvill NEW
Wickens NestleBrazilAmy Elsner RENEWAL
Salvatore StockhamCanadaIoni Bowcher QUALIFIED
Kaitlin OstroskyIndiaBernardo Dominic NEGOTIATION
Isabel BowleyUnited KingdomBernardo Dominic UNQUALIFIED
Kaitlin OstroskyItalyBernardo Dominic RENEWAL
Juan WieserItalyXuxue Feng RENEWAL
Mujtaba NickaGermanyElwin Sharvill QUALIFIED
Isabel BowleyUnited KingdomBernardo Dominic RENEWAL
Maria MarrierJapanAnna Fali RENEWAL
Sinclair WaycottJapanStephen Shaw PROPOSAL
Frozen Columns
Name
Izzy Garufi
Stacey Maclead
Munro Ferencz
Isabel Bowley
Ashley Doe
Chavez Briddick
Costa Dilliard
Munro Ferencz
Kaitlin Ostrosky
Adams Morasca
Jennifer Amigon
Arvin Albares
Silvio Slusarski
Sinclair Waycott
Ashley Doe
Francesco Shinko
Isabel Bowley
Aditya Kusko
Octavia Malet
David Darakjy
Aruna Figeroa
Jones Vocelka
Alejandro Perin
Isabel Bowley
Kadeem Flosi
Adams Morasca
Greenwood Bolognia
Francesco Shinko
Faith Gillian
Sinclair Waycott
Aruna Figeroa
Ricardo Gaucho
James Butt
David Darakjy
Claire Tollner
Faith Gillian
Deepesh Chui
Aruna Figeroa
Stacey Maclead
Emily Whobrey
Alejandro Perin
Nicolas Iturbide
Greenwood Bolognia
Jefferson Schemmer
Leja Caldarera
Alejandro Perin
Juan Wieser
Jennifer Amigon
Darci Poquette
Jeanfrancois Venere
IdCountryDate
1000Spain2026-05-13
1001Italy2026-05-01
1002Russia2026-05-22
1003Argentina2026-04-29
1004Russia2026-05-26
1005Australia2026-05-19
1006Argentina2026-05-11
1007France2026-05-26
1008Canada2026-05-12
1009Spain2026-05-04
1010Germany2026-05-01
1011Argentina2026-04-29
1012Germany2026-05-14
1013Australia2026-05-27
1014United Kingdom2026-05-20
1015Russia2026-05-06
1016Italy2026-05-07
1017Canada2026-04-29
1018France2026-05-25
1019Canada2026-05-01
1020Canada2026-05-06
1021Spain2026-05-23
1022Canada2026-05-23
1023Italy2026-05-25
1024Japan2026-05-27
1025Spain2026-04-30
1026Italy2026-05-27
1027Japan2026-05-26
1028France2026-04-30
1029United Kingdom2026-05-06
1030France2026-05-15
1031France2026-05-02
1032United Kingdom2026-05-22
1033Italy2026-05-04
1034Russia2026-05-13
1035India2026-05-17
1036Japan2026-05-04
1037Germany2026-05-06
1038Russia2026-05-16
1039Argentina2026-05-20
1040India2026-05-08
1041United Kingdom2026-05-21
1042Japan2026-05-06
1043Italy2026-05-17
1044Argentina2026-05-15
1045Russia2026-05-13
1046France2026-04-28
1047Russia2026-05-04
1048Japan2026-05-05
1049Japan2026-05-02

On-Demand Data

NameIdCountryDate
Arvin Albares1000Brazil2026-05-07
Mayumi Kolmetz1001Brazil2026-05-20
Faith Gillian1002Argentina2026-05-27
Arvin Albares1003Japan2026-05-11
Sinclair Waycott1004India2026-05-02
Aika Inouye1005Canada2026-05-27
Antonio Caudy1006Japan2026-05-26
Kaitlin Ostrosky1007Spain2026-04-30
Clifford Rim1008India2026-05-09
Faith Gillian1009Japan2026-05-14
Jefferson Schemmer1010Canada2026-05-06
Salvatore Stockham1011Russia2026-05-24
Munro Ferencz1012Italy2026-05-11
Faith Gillian1013Brazil2026-05-11
Emily Whobrey1014Australia2026-05-09
Misaki Royster1015Canada2026-05-08
Jefferson Schemmer1016Canada2026-05-03
Deepesh Chui1017Spain2026-05-17
Silvio Slusarski1018Japan2026-05-27
Clifford Rim1019Brazil2026-05-04
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
James ButtIndiaAmy Elsner NEGOTIATION
Tony FollerFranceBernardo Dominic RENEWAL
Deepesh ChuiArgentinaOnyama Limba NEW
Alejandro PerinUnited KingdomBernardo Dominic NEGOTIATION
Leon OldroydGermanyStephen Shaw NEGOTIATION
Cody SaylorsJapanAsiya Javayant QUALIFIED
Deepesh ChuiIndiaXuxue Feng RENEWAL
Smith GlickCanadaIvan Magalhaes PROPOSAL
Cody SaylorsItalyIoni Bowcher PROPOSAL
Aika InouyeAustraliaElwin Sharvill PROPOSAL
Silvio SlusarskiArgentinaElwin Sharvill PROPOSAL
Smith GlickBrazilOnyama Limba NEGOTIATION
Rodrigues CampainJapanAmy Elsner NEGOTIATION
Leon OldroydItalyAsiya Javayant RENEWAL
Munro FerenczJapanAmy Elsner UNQUALIFIED
Leon OldroydAustraliaBernardo Dominic NEW
Aika InouyeGermanyXuxue Feng RENEWAL
Jones VocelkaJapanAnna Fali NEW
Darci PoquetteArgentinaBernardo Dominic QUALIFIED
Mayumi KolmetzBrazilOnyama Limba RENEWAL
Murillo MaletGermanyAnna Fali RENEWAL
Jones VocelkaJapanElwin Sharvill NEGOTIATION
Chavez BriddickItalyIvan Magalhaes UNQUALIFIED
Izzy GarufiAustraliaBernardo Dominic UNQUALIFIED
Alejandro PerinFranceBernardo Dominic NEW
Johnson SergiSpainOnyama Limba PROPOSAL
Leon OldroydIndiaAmy Elsner NEW
Kaitlin OstroskyRussiaIoni Bowcher RENEWAL
Ashley DoeArgentinaAsiya Javayant UNQUALIFIED
Leon OldroydSpainXuxue Feng PROPOSAL
Ricardo GauchoSpainAnna Fali UNQUALIFIED
Aditya KuskoSpainAsiya Javayant PROPOSAL
Clifford RimGermanyOnyama Limba RENEWAL
Leja CaldareraIndiaXuxue Feng NEGOTIATION
Nicolas IturbideCanadaIvan Magalhaes QUALIFIED
Johnson SergiFranceXuxue Feng QUALIFIED
Jennifer AmigonBrazilIoni Bowcher NEGOTIATION
Jones VocelkaAustraliaElwin Sharvill UNQUALIFIED
Jones VocelkaCanadaIoni Bowcher QUALIFIED
James ButtSpainAnna Fali UNQUALIFIED

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