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
Clifford RimBrazilStephen Shaw PROPOSAL
James ButtAustraliaIvan Magalhaes RENEWAL
Darci PoquetteCanadaXuxue Feng NEW
Leon OldroydBrazilAmy Elsner UNQUALIFIED
Claire TollnerBrazilXuxue Feng PROPOSAL
Maria MarrierGermanyBernardo Dominic NEGOTIATION
Mayumi KolmetzArgentinaOnyama Limba QUALIFIED
Kaitlin OstroskyAustraliaIoni Bowcher NEW
James ButtUnited KingdomAmy Elsner NEW
Claire TollnerCanadaBernardo Dominic QUALIFIED
David DarakjyIndiaOnyama Limba NEW
Greenwood BologniaIndiaAsiya Javayant NEGOTIATION
Faith GillianAustraliaBernardo Dominic PROPOSAL
Octavia MaletCanadaStephen Shaw RENEWAL
Kadeem FlosiCanadaOnyama Limba PROPOSAL
Octavia MaletIndiaAmy Elsner PROPOSAL
David DarakjyItalyIvan Magalhaes PROPOSAL
Adams MorascaJapanXuxue Feng NEGOTIATION
Misaki RoysterJapanAmy Elsner UNQUALIFIED
Adams MorascaItalyIvan Magalhaes RENEWAL
Munro FerenczAustraliaAnna Fali RENEWAL
Arvin AlbaresIndiaElwin Sharvill QUALIFIED
Aruna FigeroaGermanyStephen Shaw NEW
Johnson SergiItalyXuxue Feng PROPOSAL
Aditya KuskoUnited KingdomIvan Magalhaes NEGOTIATION
Ivar PaprockiJapanAnna Fali NEGOTIATION
Aditya KuskoItalyXuxue Feng NEGOTIATION
Jones VocelkaUnited KingdomOnyama Limba UNQUALIFIED
Alejandro PerinJapanAnna Fali PROPOSAL
Tony FollerArgentinaBernardo Dominic RENEWAL
Mujtaba NickaUnited KingdomIvan Magalhaes PROPOSAL
Wickens NestleAustraliaIoni Bowcher UNQUALIFIED
Silvio SlusarskiRussiaXuxue Feng NEGOTIATION
Claire TollnerCanadaOnyama Limba QUALIFIED
Jeanfrancois VenereGermanyAmy Elsner NEW
Leja CaldareraItalyStephen Shaw PROPOSAL
Chavez BriddickJapanAsiya Javayant NEGOTIATION
Izzy GarufiGermanyAsiya Javayant RENEWAL
Darci PoquetteArgentinaAmy Elsner NEGOTIATION
Ricardo GauchoItalyXuxue Feng NEGOTIATION
Maisha RulapaughArgentinaIoni Bowcher NEGOTIATION
Deepesh ChuiCanadaAnna Fali NEW
Juan WieserArgentinaIoni Bowcher NEGOTIATION
Maisha RulapaughUnited KingdomXuxue Feng QUALIFIED
Emily WhobreyJapanAmy Elsner NEW
Ricardo GauchoGermanyStephen Shaw PROPOSAL
Munro FerenczAustraliaElwin Sharvill PROPOSAL
Aika InouyeRussiaStephen Shaw PROPOSAL
Nicolas IturbideBrazilAmy Elsner PROPOSAL
Isabel BowleyItalyStephen Shaw UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Wickens NestleIndiaStephen Shaw RENEWAL
Rodrigues CampainUnited KingdomXuxue Feng QUALIFIED
Kadeem FlosiAustraliaAnna Fali NEW
Maria MarrierJapanBernardo Dominic UNQUALIFIED
Arvin AlbaresIndiaOnyama Limba RENEWAL
Sinclair WaycottBrazilOnyama Limba PROPOSAL
Cody SaylorsArgentinaAmy Elsner PROPOSAL
Leja CaldareraSpainXuxue Feng QUALIFIED
Claire TollnerIndiaStephen Shaw UNQUALIFIED
Rodrigues CampainFranceAmy Elsner UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Greenwood BologniaGermany2025-08-05Chapman, Ross E Esq NEGOTIATION83Bernardo Dominic
1001Darci PoquetteGermany2025-07-14Morlong Associates UNQUALIFIED9Xuxue Feng
1002Faith GillianSpain2025-07-31Truhlar And Truhlar Attys NEW64Ivan Magalhaes
1003Darci PoquetteRussia2025-07-29Rousseaux, Michael Esq RENEWAL70Asiya Javayant
1004Salvatore StockhamJapan2025-07-19Feiner Bros UNQUALIFIED81Ivan Magalhaes
1005Adams MorascaCanada2025-07-13Buckley Miller Wright UNQUALIFIED80Bernardo Dominic
1006Clifford RimIndia2025-08-03Chemel, James L Cpa RENEWAL28Ivan Magalhaes
1007Jones VocelkaFrance2025-08-04Feltz Printing Service NEGOTIATION75Elwin Sharvill
1008Cody SaylorsItaly2025-08-10King, Christopher A Esq NEW49Ioni Bowcher
1009Smith GlickBrazil2025-07-12Truhlar And Truhlar Attys PROPOSAL46Anna Fali
1010Salvatore StockhamIndia2025-08-01Chanay, Jeffrey A Esq RENEWAL78Anna Fali
1011Arvin AlbaresBrazil2025-08-04Morlong Associates UNQUALIFIED35Onyama Limba
1012Darci PoquetteUnited Kingdom2025-07-30Feiner Bros NEGOTIATION81Ivan Magalhaes
1013Octavia MaletItaly2025-07-23King, Christopher A Esq NEGOTIATION64Onyama Limba
1014Leon OldroydUnited Kingdom2025-07-31Truhlar And Truhlar Attys PROPOSAL67Stephen Shaw
1015Greenwood BologniaFrance2025-07-31Rangoni Of Florence UNQUALIFIED84Bernardo Dominic
1016Jefferson SchemmerCanada2025-07-19Chapman, Ross E Esq NEGOTIATION41Stephen Shaw
1017Maisha RulapaughCanada2025-08-03Dorl, James J Esq RENEWAL3Amy Elsner
1018Alejandro PerinJapan2025-08-10Dorl, James J Esq QUALIFIED93Amy Elsner
1019Deepesh ChuiCanada2025-08-10Feiner Bros RENEWAL18Amy Elsner
1020Stacey MacleadBrazil2025-07-20Chemel, James L Cpa NEGOTIATION24Onyama Limba
1021Aika InouyeGermany2025-08-05King, Christopher A Esq UNQUALIFIED7Xuxue Feng
1022Misaki RoysterArgentina2025-08-10Dorl, James J Esq UNQUALIFIED93Bernardo Dominic
1023Aruna FigeroaIndia2025-07-12Printing Dimensions RENEWAL79Asiya Javayant
1024Emily WhobreyArgentina2025-07-29Benton, John B Jr NEW83Xuxue Feng
1025Deepesh ChuiGermany2025-07-22Feltz Printing Service RENEWAL75Ivan Magalhaes
1026James ButtUnited Kingdom2025-07-25Rangoni Of Florence UNQUALIFIED5Elwin Sharvill
1027Nicolas IturbideFrance2025-08-02Buckley Miller Wright PROPOSAL51Elwin Sharvill
1028Francesco ShinkoJapan2025-07-23Rousseaux, Michael Esq QUALIFIED90Elwin Sharvill
1029Costa DilliardUnited Kingdom2025-08-02Chemel, James L Cpa UNQUALIFIED85Ivan Magalhaes
1030Juan WieserGermany2025-08-09Rousseaux, Michael Esq PROPOSAL99Stephen Shaw
1031Deepesh ChuiCanada2025-07-23Benton, John B Jr QUALIFIED6Anna Fali
1032Julie StensethFrance2025-07-23Printing Dimensions NEGOTIATION77Xuxue Feng
1033Maria MarrierGermany2025-07-12Chanay, Jeffrey A Esq RENEWAL63Onyama Limba
1034Johnson SergiCanada2025-07-29Commercial Press UNQUALIFIED77Stephen Shaw
1035Jennifer AmigonItaly2025-08-08Dorl, James J Esq PROPOSAL99Anna Fali
1036Rodrigues CampainItaly2025-08-06Buckley Miller Wright UNQUALIFIED45Anna Fali
1037Aditya KuskoIndia2025-07-28Chanay, Jeffrey A Esq NEGOTIATION14Elwin Sharvill
1038Faith GillianRussia2025-07-19Feiner Bros UNQUALIFIED70Onyama Limba
1039Ashley DoeCanada2025-07-26Benton, John B Jr NEGOTIATION58Asiya Javayant
1040Wickens NestleSpain2025-08-02Buckley Miller Wright UNQUALIFIED34Stephen Shaw
1041Silvio SlusarskiArgentina2025-08-02Truhlar And Truhlar Attys PROPOSAL18Anna Fali
1042Cody SaylorsAustralia2025-07-25Morlong Associates NEW64Onyama Limba
1043Mayumi KolmetzGermany2025-07-16Feltz Printing Service UNQUALIFIED86Stephen Shaw
1044Kadeem FlosiSpain2025-07-27Rousseaux, Michael Esq UNQUALIFIED43Asiya Javayant
1045Isabel BowleySpain2025-07-22Commercial Press PROPOSAL93Ivan Magalhaes
1046Claire TollnerCanada2025-07-27Commercial Press NEGOTIATION57Anna Fali
1047Izzy GarufiRussia2025-07-17Feiner Bros PROPOSAL4Xuxue Feng
1048David DarakjyJapan2025-07-31Rangoni Of Florence QUALIFIED94Elwin Sharvill
1049Tony FollerCanada2025-07-14Buckley Miller Wright QUALIFIED53Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Silvio SlusarskiCanadaAmy Elsner NEGOTIATION
Misaki RoysterGermanyAmy Elsner UNQUALIFIED
Aika InouyeSpainAnna Fali NEGOTIATION
Leja CaldareraFranceAsiya Javayant RENEWAL
Misaki RoysterCanadaElwin Sharvill RENEWAL
Jefferson SchemmerJapanXuxue Feng NEW
Jennifer AmigonUnited KingdomAnna Fali RENEWAL
Juan WieserGermanyIvan Magalhaes PROPOSAL
Chavez BriddickArgentinaBernardo Dominic QUALIFIED
Johnson SergiAustraliaXuxue Feng PROPOSAL
Kadeem FlosiArgentinaStephen Shaw PROPOSAL
Jefferson SchemmerUnited KingdomElwin Sharvill UNQUALIFIED
Leja CaldareraJapanAnna Fali RENEWAL
Faith GillianBrazilAmy Elsner NEGOTIATION
Arvin AlbaresUnited KingdomIoni Bowcher PROPOSAL
Murillo MaletSpainIvan Magalhaes UNQUALIFIED
Murillo MaletArgentinaBernardo Dominic PROPOSAL
Cody SaylorsUnited KingdomStephen Shaw QUALIFIED
Maisha RulapaughFranceBernardo Dominic QUALIFIED
Murillo MaletJapanBernardo Dominic NEGOTIATION
Salvatore StockhamItalyAmy Elsner NEGOTIATION
Isabel BowleyJapanIvan Magalhaes UNQUALIFIED
Chavez BriddickAustraliaAmy Elsner UNQUALIFIED
David DarakjyArgentinaIoni Bowcher RENEWAL
Smith GlickArgentinaIoni Bowcher RENEWAL
Kaitlin OstroskyUnited KingdomIvan Magalhaes UNQUALIFIED
Misaki RoysterAustraliaElwin Sharvill PROPOSAL
Faith GillianBrazilXuxue Feng QUALIFIED
Juan WieserArgentinaElwin Sharvill NEW
Claire TollnerBrazilElwin Sharvill QUALIFIED
Stacey MacleadFranceBernardo Dominic PROPOSAL
Ivar PaprockiAustraliaAsiya Javayant NEGOTIATION
Julie StensethRussiaIoni Bowcher PROPOSAL
Silvio SlusarskiGermanyStephen Shaw PROPOSAL
Wickens NestleCanadaAsiya Javayant QUALIFIED
Faith GillianJapanIvan Magalhaes RENEWAL
Johnson SergiIndiaStephen Shaw UNQUALIFIED
Aika InouyeArgentinaIvan Magalhaes NEW
Maria MarrierJapanOnyama Limba UNQUALIFIED
Deepesh ChuiGermanyAsiya Javayant NEGOTIATION
Smith GlickGermanyElwin Sharvill NEW
Cody SaylorsUnited KingdomAsiya Javayant NEGOTIATION
Jones VocelkaRussiaIoni Bowcher RENEWAL
Aruna FigeroaIndiaStephen Shaw NEGOTIATION
Ashley DoeRussiaIoni Bowcher RENEWAL
Cody SaylorsBrazilAsiya Javayant QUALIFIED
Emily WhobreyGermanyElwin Sharvill NEW
Costa DilliardGermanyStephen Shaw NEGOTIATION
Maria MarrierGermanyBernardo Dominic NEGOTIATION
Aika InouyeItalyBernardo Dominic QUALIFIED
Frozen Columns
Name
Clifford Rim
Aruna Figeroa
Nicolas Iturbide
Jeanfrancois Venere
Cody Saylors
Munro Ferencz
Juan Wieser
Cody Saylors
James Butt
Claire Tollner
Chavez Briddick
Kadeem Flosi
Jefferson Schemmer
Antonio Caudy
Salvatore Stockham
Wickens Nestle
Emily Whobrey
Tony Foller
Smith Glick
Nicolas Iturbide
Salvatore Stockham
Claire Tollner
Mayumi Kolmetz
Stacey Maclead
Izzy Garufi
Kaitlin Ostrosky
Johnson Sergi
Leja Caldarera
Cody Saylors
Ricardo Gaucho
Claire Tollner
Izzy Garufi
Izzy Garufi
Julie Stenseth
Maria Marrier
Smith Glick
Jennifer Amigon
Darci Poquette
Jones Vocelka
Chavez Briddick
Adams Morasca
Julie Stenseth
Cody Saylors
Ivar Paprocki
Kadeem Flosi
Maria Marrier
Darci Poquette
Jefferson Schemmer
Rodrigues Campain
Jones Vocelka
IdCountryDate
1000Argentina2025-07-31
1001Russia2025-07-25
1002Japan2025-07-25
1003Canada2025-07-18
1004Russia2025-07-16
1005France2025-07-18
1006Germany2025-07-26
1007Germany2025-07-24
1008India2025-08-06
1009Japan2025-07-23
1010India2025-07-27
1011India2025-08-10
1012Japan2025-07-22
1013Germany2025-07-27
1014Brazil2025-07-14
1015India2025-07-20
1016United Kingdom2025-08-06
1017Brazil2025-07-25
1018Japan2025-07-15
1019Italy2025-07-12
1020Russia2025-07-30
1021India2025-07-13
1022Italy2025-08-08
1023Spain2025-08-09
1024Australia2025-07-28
1025Germany2025-07-23
1026Canada2025-07-23
1027Australia2025-07-17
1028Brazil2025-08-05
1029India2025-07-20
1030Brazil2025-07-12
1031Canada2025-08-09
1032Russia2025-07-15
1033France2025-07-28
1034Japan2025-07-21
1035Italy2025-08-09
1036Italy2025-07-24
1037France2025-07-26
1038Argentina2025-08-10
1039Russia2025-08-06
1040Brazil2025-07-15
1041India2025-07-28
1042United Kingdom2025-07-17
1043Russia2025-07-31
1044Russia2025-07-28
1045Australia2025-07-20
1046Russia2025-07-15
1047Japan2025-07-20
1048Russia2025-07-26
1049Italy2025-07-24

On-Demand Data

NameIdCountryDate
Costa Dilliard1000Spain2025-07-24
Tony Foller1001Spain2025-07-22
Julie Stenseth1002Brazil2025-08-10
Morrow Ruta1003Russia2025-07-18
Jefferson Schemmer1004Spain2025-07-18
Alejandro Perin1005Germany2025-07-16
Munro Ferencz1006India2025-07-29
Ivar Paprocki1007Russia2025-07-26
Smith Glick1008Russia2025-07-15
Mujtaba Nicka1009Italy2025-08-08
Leja Caldarera1010Japan2025-08-06
Chavez Briddick1011Russia2025-07-18
Ivar Paprocki1012India2025-08-03
Julie Stenseth1013Russia2025-07-19
Mujtaba Nicka1014Russia2025-08-01
Nicolas Iturbide1015Argentina2025-08-08
Jefferson Schemmer1016India2025-07-12
Cody Saylors1017Italy2025-08-07
Rodrigues Campain1018India2025-07-14
Smith Glick1019Canada2025-07-13
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Silvio SlusarskiBrazilIoni Bowcher UNQUALIFIED
Murillo MaletAustraliaElwin Sharvill NEW
Munro FerenczArgentinaAnna Fali RENEWAL
Costa DilliardGermanyAnna Fali UNQUALIFIED
Jennifer AmigonAustraliaIoni Bowcher QUALIFIED
Ashley DoeSpainAmy Elsner UNQUALIFIED
Arvin AlbaresItalyStephen Shaw RENEWAL
Ivar PaprockiCanadaElwin Sharvill RENEWAL
Deepesh ChuiCanadaBernardo Dominic QUALIFIED
Adams MorascaRussiaOnyama Limba NEGOTIATION
Antonio CaudyUnited KingdomElwin Sharvill PROPOSAL
Salvatore StockhamAustraliaIvan Magalhaes RENEWAL
Jefferson SchemmerSpainStephen Shaw UNQUALIFIED
Salvatore StockhamCanadaElwin Sharvill NEGOTIATION
Munro FerenczBrazilIoni Bowcher QUALIFIED
Silvio SlusarskiSpainElwin Sharvill NEGOTIATION
Maria MarrierSpainBernardo Dominic QUALIFIED
Kaitlin OstroskyIndiaIoni Bowcher NEGOTIATION
Maria MarrierAustraliaElwin Sharvill QUALIFIED
Julie StensethBrazilElwin Sharvill PROPOSAL
Faith GillianArgentinaElwin Sharvill NEGOTIATION
Salvatore StockhamBrazilElwin Sharvill QUALIFIED
Kadeem FlosiSpainElwin Sharvill PROPOSAL
Octavia MaletJapanIvan Magalhaes QUALIFIED
Mujtaba NickaGermanyOnyama Limba UNQUALIFIED
Kadeem FlosiIndiaStephen Shaw RENEWAL
Aika InouyeAustraliaIoni Bowcher UNQUALIFIED
Leja CaldareraFranceAnna Fali QUALIFIED
Wickens NestleBrazilAnna Fali RENEWAL
Mujtaba NickaJapanBernardo Dominic UNQUALIFIED
Murillo MaletItalyOnyama Limba QUALIFIED
Munro FerenczUnited KingdomXuxue Feng NEW
Arvin AlbaresSpainXuxue Feng QUALIFIED
Mujtaba NickaFranceIvan Magalhaes NEW
Jones VocelkaGermanyAmy Elsner NEGOTIATION
Arvin AlbaresFranceOnyama Limba RENEWAL
Jennifer AmigonIndiaAsiya Javayant NEGOTIATION
James ButtBrazilElwin Sharvill NEW
Chavez BriddickJapanStephen Shaw NEW
Maria MarrierArgentinaOnyama Limba 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>