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 RimAustraliaBernardo Dominic RENEWAL
Costa DilliardItalyAnna Fali NEW
Misaki RoysterBrazilAmy Elsner NEW
Rodrigues CampainItalyIoni Bowcher UNQUALIFIED
Rodrigues CampainCanadaStephen Shaw RENEWAL
Arvin AlbaresSpainAsiya Javayant QUALIFIED
Leja CaldareraItalyOnyama Limba UNQUALIFIED
Cody SaylorsSpainIvan Magalhaes UNQUALIFIED
Mayumi KolmetzIndiaIvan Magalhaes QUALIFIED
James ButtJapanIvan Magalhaes NEW
Salvatore StockhamFranceAnna Fali PROPOSAL
Clifford RimCanadaStephen Shaw QUALIFIED
Chavez BriddickIndiaBernardo Dominic UNQUALIFIED
Mayumi KolmetzCanadaElwin Sharvill PROPOSAL
Chavez BriddickBrazilAsiya Javayant RENEWAL
Ashley DoeJapanXuxue Feng RENEWAL
Mujtaba NickaSpainXuxue Feng QUALIFIED
Faith GillianUnited KingdomElwin Sharvill RENEWAL
Alejandro PerinGermanyAsiya Javayant QUALIFIED
Wickens NestleSpainAnna Fali QUALIFIED
Claire TollnerBrazilStephen Shaw NEGOTIATION
David DarakjyBrazilElwin Sharvill NEW
Izzy GarufiCanadaStephen Shaw NEGOTIATION
Leon OldroydBrazilOnyama Limba RENEWAL
Isabel BowleyBrazilXuxue Feng NEW
Octavia MaletItalyBernardo Dominic NEW
Antonio CaudyFranceAmy Elsner NEGOTIATION
Maria MarrierAustraliaXuxue Feng QUALIFIED
Maria MarrierCanadaStephen Shaw UNQUALIFIED
Nicolas IturbideIndiaBernardo Dominic QUALIFIED
Kadeem FlosiCanadaElwin Sharvill QUALIFIED
Leja CaldareraItalyOnyama Limba RENEWAL
Kaitlin OstroskySpainIvan Magalhaes PROPOSAL
Maisha RulapaughArgentinaAsiya Javayant UNQUALIFIED
Leon OldroydSpainAnna Fali UNQUALIFIED
Mujtaba NickaUnited KingdomStephen Shaw RENEWAL
Cody SaylorsRussiaElwin Sharvill UNQUALIFIED
Cody SaylorsItalyAmy Elsner NEW
Morrow RutaJapanIoni Bowcher NEGOTIATION
Wickens NestleBrazilAnna Fali NEGOTIATION
Isabel BowleyBrazilIvan Magalhaes NEGOTIATION
Isabel BowleyBrazilAmy Elsner PROPOSAL
Julie StensethGermanyIvan Magalhaes PROPOSAL
Claire TollnerArgentinaStephen Shaw PROPOSAL
Faith GillianFranceIvan Magalhaes QUALIFIED
Alejandro PerinItalyElwin Sharvill UNQUALIFIED
Ivar PaprockiArgentinaOnyama Limba NEW
Ashley DoeSpainIoni Bowcher NEGOTIATION
Jeanfrancois VenereSpainAnna Fali QUALIFIED
David DarakjyJapanIoni Bowcher NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Francesco ShinkoAustraliaIoni Bowcher UNQUALIFIED
James ButtUnited KingdomOnyama Limba PROPOSAL
Jefferson SchemmerFranceIvan Magalhaes RENEWAL
Alejandro PerinAustraliaAnna Fali UNQUALIFIED
Cody SaylorsRussiaOnyama Limba NEW
Munro FerenczUnited KingdomAnna Fali NEGOTIATION
Cody SaylorsIndiaIoni Bowcher NEGOTIATION
Ivar PaprockiAustraliaElwin Sharvill NEW
Isabel BowleySpainStephen Shaw UNQUALIFIED
Greenwood BologniaAustraliaXuxue Feng NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Francesco ShinkoArgentina2026-05-26Chapman, Ross E Esq UNQUALIFIED48Onyama Limba
1001Leon OldroydAustralia2026-05-14Truhlar And Truhlar Attys QUALIFIED39Anna Fali
1002Arvin AlbaresJapan2026-05-08Buckley Miller Wright PROPOSAL28Xuxue Feng
1003Tony FollerBrazil2026-05-29Chemel, James L Cpa PROPOSAL14Xuxue Feng
1004Arvin AlbaresSpain2026-05-26Chapman, Ross E Esq PROPOSAL42Ioni Bowcher
1005Sinclair WaycottJapan2026-05-20King, Christopher A Esq UNQUALIFIED9Elwin Sharvill
1006Costa DilliardItaly2026-05-28Chemel, James L Cpa NEGOTIATION36Elwin Sharvill
1007Sinclair WaycottCanada2026-05-10Rousseaux, Michael Esq NEGOTIATION8Anna Fali
1008Tony FollerBrazil2026-05-17Commercial Press NEGOTIATION28Bernardo Dominic
1009Rodrigues CampainIndia2026-05-25Truhlar And Truhlar Attys UNQUALIFIED76Bernardo Dominic
1010Tony FollerGermany2026-05-25Commercial Press NEGOTIATION13Amy Elsner
1011Kaitlin OstroskyUnited Kingdom2026-05-21Feiner Bros NEW78Ioni Bowcher
1012Arvin AlbaresSpain2026-05-22Commercial Press PROPOSAL25Ivan Magalhaes
1013Aruna FigeroaIndia2026-05-23Commercial Press PROPOSAL90Asiya Javayant
1014Juan WieserItaly2026-06-01Commercial Press RENEWAL46Ioni Bowcher
1015Antonio CaudyRussia2026-05-21King, Christopher A Esq UNQUALIFIED37Stephen Shaw
1016Ashley DoeArgentina2026-05-25Chanay, Jeffrey A Esq UNQUALIFIED6Ivan Magalhaes
1017Aruna FigeroaArgentina2026-05-19Morlong Associates PROPOSAL46Xuxue Feng
1018Jeanfrancois VenereUnited Kingdom2026-05-05Truhlar And Truhlar Attys NEGOTIATION1Asiya Javayant
1019Kadeem FlosiSpain2026-05-16Feltz Printing Service QUALIFIED31Ivan Magalhaes
1020Claire TollnerUnited Kingdom2026-05-16Truhlar And Truhlar Attys PROPOSAL84Xuxue Feng
1021Murillo MaletSpain2026-05-30Buckley Miller Wright NEW20Stephen Shaw
1022James ButtArgentina2026-05-31Buckley Miller Wright QUALIFIED64Ioni Bowcher
1023Jones VocelkaFrance2026-05-24Rangoni Of Florence UNQUALIFIED34Anna Fali
1024Morrow RutaJapan2026-05-03King, Christopher A Esq NEW42Elwin Sharvill
1025Sinclair WaycottFrance2026-05-16Dorl, James J Esq UNQUALIFIED58Elwin Sharvill
1026Chavez BriddickUnited Kingdom2026-05-10Chemel, James L Cpa NEGOTIATION73Amy Elsner
1027Aditya KuskoJapan2026-05-14Feiner Bros UNQUALIFIED27Xuxue Feng
1028Deepesh ChuiFrance2026-05-19Chemel, James L Cpa RENEWAL7Asiya Javayant
1029Morrow RutaGermany2026-05-22Benton, John B Jr QUALIFIED40Ivan Magalhaes
1030Arvin AlbaresItaly2026-05-07Feltz Printing Service NEW66Bernardo Dominic
1031Jennifer AmigonIndia2026-05-04Morlong Associates NEGOTIATION75Ivan Magalhaes
1032Kaitlin OstroskyArgentina2026-05-31Truhlar And Truhlar Attys RENEWAL83Ioni Bowcher
1033Antonio CaudyBrazil2026-05-08Morlong Associates NEW86Stephen Shaw
1034Jefferson SchemmerGermany2026-05-21Truhlar And Truhlar Attys QUALIFIED58Xuxue Feng
1035Johnson SergiCanada2026-05-18Morlong Associates RENEWAL21Asiya Javayant
1036Johnson SergiArgentina2026-05-13Printing Dimensions UNQUALIFIED10Ioni Bowcher
1037David DarakjyAustralia2026-05-16Chanay, Jeffrey A Esq NEW26Asiya Javayant
1038Aditya KuskoCanada2026-05-13Benton, John B Jr NEGOTIATION20Stephen Shaw
1039Jeanfrancois VenereSpain2026-05-27Dorl, James J Esq NEGOTIATION70Amy Elsner
1040Jennifer AmigonCanada2026-05-20Rangoni Of Florence UNQUALIFIED27Ioni Bowcher
1041Johnson SergiIndia2026-05-06Rousseaux, Michael Esq QUALIFIED85Asiya Javayant
1042Octavia MaletUnited Kingdom2026-05-06Chapman, Ross E Esq NEW57Asiya Javayant
1043Claire TollnerAustralia2026-05-20Dorl, James J Esq UNQUALIFIED30Ioni Bowcher
1044Sinclair WaycottIndia2026-05-19King, Christopher A Esq RENEWAL82Elwin Sharvill
1045Faith GillianJapan2026-05-30Rangoni Of Florence UNQUALIFIED81Bernardo Dominic
1046Julie StensethBrazil2026-05-21Rangoni Of Florence PROPOSAL10Elwin Sharvill
1047Costa DilliardFrance2026-05-24Truhlar And Truhlar Attys RENEWAL70Ivan Magalhaes
1048Emily WhobreyAustralia2026-05-22Printing Dimensions NEGOTIATION21Ivan Magalhaes
1049Kadeem FlosiItaly2026-05-09Chanay, Jeffrey A Esq UNQUALIFIED95Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Kaitlin OstroskyItalyIvan Magalhaes UNQUALIFIED
David DarakjyCanadaAmy Elsner RENEWAL
Maria MarrierAustraliaIoni Bowcher UNQUALIFIED
Izzy GarufiFranceXuxue Feng NEW
Kaitlin OstroskyIndiaAnna Fali RENEWAL
Wickens NestleCanadaIvan Magalhaes UNQUALIFIED
Rodrigues CampainRussiaStephen Shaw RENEWAL
Isabel BowleyGermanyElwin Sharvill QUALIFIED
Ashley DoeUnited KingdomAnna Fali NEGOTIATION
Claire TollnerSpainXuxue Feng NEGOTIATION
Rodrigues CampainItalyBernardo Dominic PROPOSAL
Aruna FigeroaItalyAmy Elsner QUALIFIED
Morrow RutaGermanyAmy Elsner RENEWAL
Arvin AlbaresIndiaIvan Magalhaes NEW
Ricardo GauchoJapanIvan Magalhaes RENEWAL
Johnson SergiCanadaElwin Sharvill NEGOTIATION
Ashley DoeFranceIoni Bowcher NEW
Wickens NestleArgentinaAmy Elsner NEW
Ivar PaprockiRussiaElwin Sharvill RENEWAL
Ashley DoeCanadaIvan Magalhaes RENEWAL
Francesco ShinkoFranceOnyama Limba UNQUALIFIED
Chavez BriddickCanadaIoni Bowcher NEW
Deepesh ChuiJapanIvan Magalhaes QUALIFIED
Ricardo GauchoRussiaXuxue Feng NEW
Smith GlickAustraliaOnyama Limba QUALIFIED
Francesco ShinkoArgentinaAmy Elsner NEGOTIATION
Alejandro PerinAustraliaElwin Sharvill QUALIFIED
Octavia MaletBrazilAnna Fali RENEWAL
Tony FollerJapanOnyama Limba UNQUALIFIED
Maria MarrierSpainIoni Bowcher RENEWAL
Izzy GarufiBrazilIvan Magalhaes NEGOTIATION
Francesco ShinkoItalyXuxue Feng UNQUALIFIED
Costa DilliardJapanBernardo Dominic QUALIFIED
Jones VocelkaUnited KingdomAnna Fali RENEWAL
Isabel BowleyAustraliaAmy Elsner NEGOTIATION
Antonio CaudyIndiaAnna Fali QUALIFIED
Silvio SlusarskiBrazilAmy Elsner NEGOTIATION
Kaitlin OstroskyRussiaOnyama Limba UNQUALIFIED
Misaki RoysterCanadaBernardo Dominic NEGOTIATION
Mujtaba NickaItalyIoni Bowcher UNQUALIFIED
Jefferson SchemmerCanadaOnyama Limba NEW
Sinclair WaycottGermanyBernardo Dominic PROPOSAL
Aditya KuskoSpainElwin Sharvill RENEWAL
Arvin AlbaresSpainBernardo Dominic NEGOTIATION
James ButtItalyStephen Shaw RENEWAL
Isabel BowleySpainAsiya Javayant QUALIFIED
Nicolas IturbideFranceAnna Fali NEGOTIATION
Aditya KuskoUnited KingdomAnna Fali NEW
Ivar PaprockiCanadaIvan Magalhaes QUALIFIED
Emily WhobreyArgentinaStephen Shaw NEGOTIATION
Frozen Columns
Name
Darci Poquette
Aika Inouye
David Darakjy
David Darakjy
Ricardo Gaucho
Kadeem Flosi
Adams Morasca
Isabel Bowley
Emily Whobrey
Misaki Royster
Alejandro Perin
Clifford Rim
Costa Dilliard
Morrow Ruta
Alejandro Perin
Johnson Sergi
Antonio Caudy
Nicolas Iturbide
Octavia Malet
Sinclair Waycott
Wickens Nestle
Deepesh Chui
Nicolas Iturbide
Maisha Rulapaugh
James Butt
Jennifer Amigon
Costa Dilliard
Cody Saylors
Johnson Sergi
Juan Wieser
Jones Vocelka
Costa Dilliard
Silvio Slusarski
Salvatore Stockham
Alejandro Perin
David Darakjy
Ivar Paprocki
Emily Whobrey
Kaitlin Ostrosky
Jefferson Schemmer
James Butt
Mayumi Kolmetz
Kadeem Flosi
Jennifer Amigon
Maria Marrier
Ashley Doe
Faith Gillian
Arvin Albares
Nicolas Iturbide
Morrow Ruta
IdCountryDate
1000Brazil2026-05-30
1001Germany2026-05-14
1002Germany2026-05-08
1003Australia2026-05-15
1004India2026-05-04
1005Russia2026-05-05
1006United Kingdom2026-05-19
1007Australia2026-05-13
1008India2026-05-19
1009India2026-05-20
1010Japan2026-05-21
1011Germany2026-05-05
1012United Kingdom2026-05-28
1013Germany2026-05-07
1014India2026-05-04
1015India2026-05-08
1016Italy2026-05-05
1017United Kingdom2026-05-12
1018Brazil2026-05-03
1019Canada2026-05-17
1020Japan2026-05-16
1021United Kingdom2026-05-18
1022Japan2026-05-12
1023Canada2026-05-24
1024Brazil2026-05-18
1025Spain2026-05-10
1026Australia2026-05-12
1027Argentina2026-05-10
1028United Kingdom2026-05-27
1029Germany2026-05-20
1030Brazil2026-05-10
1031Russia2026-05-22
1032France2026-05-28
1033Russia2026-05-20
1034Italy2026-05-14
1035Germany2026-05-04
1036Canada2026-05-29
1037Spain2026-05-10
1038Australia2026-05-11
1039Brazil2026-05-30
1040Brazil2026-05-20
1041Russia2026-05-20
1042Italy2026-05-29
1043Australia2026-05-07
1044Argentina2026-05-03
1045India2026-05-29
1046Germany2026-05-29
1047Brazil2026-05-07
1048Argentina2026-05-04
1049Germany2026-05-08

On-Demand Data

NameIdCountryDate
Francesco Shinko1000Spain2026-05-23
Wickens Nestle1001Italy2026-05-26
Cody Saylors1002France2026-05-19
Maria Marrier1003Japan2026-05-21
Nicolas Iturbide1004India2026-05-10
Wickens Nestle1005Canada2026-05-20
Claire Tollner1006Spain2026-05-31
Antonio Caudy1007Australia2026-05-23
Antonio Caudy1008India2026-05-19
Cody Saylors1009Australia2026-05-12
Smith Glick1010Canada2026-05-08
Darci Poquette1011Canada2026-05-23
Johnson Sergi1012Brazil2026-05-18
Maisha Rulapaugh1013Russia2026-05-22
Aruna Figeroa1014Russia2026-05-30
Rodrigues Campain1015Argentina2026-05-24
Nicolas Iturbide1016Brazil2026-05-26
Mujtaba Nicka1017Germany2026-05-05
Darci Poquette1018Brazil2026-05-14
Aruna Figeroa1019Brazil2026-05-10
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Greenwood BologniaBrazilBernardo Dominic PROPOSAL
Rodrigues CampainJapanBernardo Dominic NEGOTIATION
Antonio CaudyBrazilAnna Fali UNQUALIFIED
Silvio SlusarskiUnited KingdomIoni Bowcher RENEWAL
Juan WieserRussiaStephen Shaw UNQUALIFIED
Faith GillianUnited KingdomIvan Magalhaes PROPOSAL
Salvatore StockhamItalyStephen Shaw RENEWAL
Ricardo GauchoSpainIoni Bowcher PROPOSAL
Clifford RimBrazilOnyama Limba NEW
Izzy GarufiRussiaOnyama Limba RENEWAL
Wickens NestleIndiaAmy Elsner QUALIFIED
Wickens NestleItalyAsiya Javayant RENEWAL
Aditya KuskoFranceOnyama Limba RENEWAL
Faith GillianJapanElwin Sharvill RENEWAL
Jefferson SchemmerRussiaBernardo Dominic QUALIFIED
Izzy GarufiRussiaXuxue Feng RENEWAL
Leja CaldareraItalyElwin Sharvill NEW
Tony FollerIndiaBernardo Dominic PROPOSAL
Aika InouyeAustraliaStephen Shaw NEGOTIATION
Deepesh ChuiCanadaBernardo Dominic NEGOTIATION
Faith GillianBrazilStephen Shaw QUALIFIED
Clifford RimSpainIvan Magalhaes NEGOTIATION
Jeanfrancois VenereJapanIoni Bowcher PROPOSAL
Antonio CaudyJapanIvan Magalhaes NEGOTIATION
Kaitlin OstroskyBrazilIoni Bowcher PROPOSAL
Kadeem FlosiJapanBernardo Dominic NEGOTIATION
Leja CaldareraJapanOnyama Limba PROPOSAL
Murillo MaletRussiaElwin Sharvill PROPOSAL
Rodrigues CampainGermanyBernardo Dominic NEW
Aditya KuskoJapanXuxue Feng PROPOSAL
Costa DilliardFranceXuxue Feng QUALIFIED
Tony FollerAustraliaElwin Sharvill RENEWAL
Sinclair WaycottFranceAsiya Javayant NEW
Maisha RulapaughBrazilElwin Sharvill UNQUALIFIED
Mayumi KolmetzCanadaStephen Shaw NEW
Aditya KuskoGermanyStephen Shaw PROPOSAL
Faith GillianBrazilBernardo Dominic RENEWAL
Mujtaba NickaItalyBernardo Dominic UNQUALIFIED
Antonio CaudyJapanStephen Shaw RENEWAL
Tony FollerCanadaOnyama Limba 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>