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
Ashley DoeGermanyOnyama Limba UNQUALIFIED
Kadeem FlosiRussiaXuxue Feng UNQUALIFIED
Maria MarrierIndiaStephen Shaw RENEWAL
Wickens NestleCanadaStephen Shaw UNQUALIFIED
Morrow RutaJapanIoni Bowcher NEGOTIATION
Wickens NestleIndiaStephen Shaw PROPOSAL
Misaki RoysterItalyAmy Elsner UNQUALIFIED
Kadeem FlosiRussiaAnna Fali PROPOSAL
Johnson SergiAustraliaAnna Fali NEGOTIATION
Faith GillianRussiaAmy Elsner UNQUALIFIED
Kaitlin OstroskyBrazilOnyama Limba NEGOTIATION
Claire TollnerArgentinaElwin Sharvill QUALIFIED
Aruna FigeroaFranceAnna Fali NEGOTIATION
Leon OldroydUnited KingdomStephen Shaw UNQUALIFIED
Tony FollerGermanyBernardo Dominic NEGOTIATION
Misaki RoysterFranceAmy Elsner NEW
Wickens NestleGermanyXuxue Feng PROPOSAL
Kadeem FlosiFranceBernardo Dominic NEGOTIATION
Silvio SlusarskiGermanyBernardo Dominic NEW
Kaitlin OstroskyRussiaBernardo Dominic PROPOSAL
Faith GillianRussiaElwin Sharvill QUALIFIED
Jennifer AmigonFranceAsiya Javayant PROPOSAL
Morrow RutaGermanyAnna Fali QUALIFIED
Deepesh ChuiItalyBernardo Dominic PROPOSAL
Kaitlin OstroskyFranceElwin Sharvill UNQUALIFIED
Clifford RimCanadaBernardo Dominic UNQUALIFIED
Alejandro PerinRussiaIoni Bowcher NEW
Salvatore StockhamFranceStephen Shaw RENEWAL
David DarakjyUnited KingdomAsiya Javayant NEGOTIATION
Leja CaldareraUnited KingdomBernardo Dominic RENEWAL
Nicolas IturbideItalyElwin Sharvill RENEWAL
Deepesh ChuiFranceIvan Magalhaes QUALIFIED
Mayumi KolmetzBrazilIvan Magalhaes NEGOTIATION
Greenwood BologniaSpainBernardo Dominic RENEWAL
Emily WhobreyRussiaAmy Elsner PROPOSAL
Claire TollnerBrazilElwin Sharvill NEGOTIATION
Leja CaldareraItalyIoni Bowcher NEW
Nicolas IturbideItalyElwin Sharvill NEGOTIATION
Octavia MaletFranceAmy Elsner PROPOSAL
Morrow RutaCanadaIvan Magalhaes QUALIFIED
Francesco ShinkoArgentinaBernardo Dominic PROPOSAL
Leja CaldareraFranceAmy Elsner PROPOSAL
Kaitlin OstroskyBrazilBernardo Dominic QUALIFIED
Jefferson SchemmerItalyIoni Bowcher QUALIFIED
Maria MarrierAustraliaAsiya Javayant RENEWAL
Munro FerenczGermanyStephen Shaw PROPOSAL
Aditya KuskoSpainBernardo Dominic UNQUALIFIED
Isabel BowleyItalyIvan Magalhaes UNQUALIFIED
Cody SaylorsFranceIvan Magalhaes UNQUALIFIED
Jeanfrancois VenereSpainOnyama Limba QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Darci PoquetteItalyAmy Elsner QUALIFIED
Arvin AlbaresFranceStephen Shaw NEW
Stacey MacleadAustraliaOnyama Limba PROPOSAL
Munro FerenczBrazilIoni Bowcher RENEWAL
Faith GillianSpainAsiya Javayant QUALIFIED
Wickens NestleArgentinaXuxue Feng QUALIFIED
Leja CaldareraBrazilIvan Magalhaes NEGOTIATION
Isabel BowleyIndiaAsiya Javayant PROPOSAL
Jennifer AmigonUnited KingdomIvan Magalhaes UNQUALIFIED
Leon OldroydArgentinaElwin Sharvill UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Stacey MacleadGermany2026-06-03Printing Dimensions PROPOSAL32Stephen Shaw
1001Cody SaylorsGermany2026-05-21Chanay, Jeffrey A Esq NEW77Stephen Shaw
1002Clifford RimJapan2026-06-19Chapman, Ross E Esq NEGOTIATION31Bernardo Dominic
1003Johnson SergiIndia2026-06-05Truhlar And Truhlar Attys NEGOTIATION33Anna Fali
1004Morrow RutaItaly2026-05-28Dorl, James J Esq UNQUALIFIED95Onyama Limba
1005David DarakjyUnited Kingdom2026-06-08Commercial Press NEW21Elwin Sharvill
1006Smith GlickAustralia2026-05-27Chanay, Jeffrey A Esq NEGOTIATION89Stephen Shaw
1007Arvin AlbaresIndia2026-06-16Chemel, James L Cpa QUALIFIED44Bernardo Dominic
1008Leon OldroydIndia2026-05-24Chanay, Jeffrey A Esq NEW33Xuxue Feng
1009Ricardo GauchoJapan2026-06-15Chapman, Ross E Esq QUALIFIED98Elwin Sharvill
1010Salvatore StockhamIndia2026-05-24Feltz Printing Service QUALIFIED19Onyama Limba
1011Johnson SergiSpain2026-05-28Printing Dimensions UNQUALIFIED24Xuxue Feng
1012Silvio SlusarskiCanada2026-06-13Dorl, James J Esq RENEWAL80Elwin Sharvill
1013Isabel BowleyItaly2026-06-14Feltz Printing Service PROPOSAL19Ioni Bowcher
1014Antonio CaudyCanada2026-06-12Buckley Miller Wright QUALIFIED87Ivan Magalhaes
1015Sinclair WaycottFrance2026-06-18Chemel, James L Cpa PROPOSAL46Anna Fali
1016Arvin AlbaresAustralia2026-05-31Rangoni Of Florence NEW18Bernardo Dominic
1017Juan WieserItaly2026-05-30Commercial Press QUALIFIED18Amy Elsner
1018Leon OldroydCanada2026-06-14Benton, John B Jr QUALIFIED58Xuxue Feng
1019Julie StensethAustralia2026-05-29Chapman, Ross E Esq UNQUALIFIED46Amy Elsner
1020Deepesh ChuiGermany2026-06-10Feltz Printing Service RENEWAL59Elwin Sharvill
1021Deepesh ChuiUnited Kingdom2026-05-29Truhlar And Truhlar Attys RENEWAL90Onyama Limba
1022Cody SaylorsFrance2026-06-01Rangoni Of Florence PROPOSAL26Amy Elsner
1023Murillo MaletCanada2026-06-11Benton, John B Jr NEGOTIATION60Onyama Limba
1024Alejandro PerinIndia2026-06-07Truhlar And Truhlar Attys NEGOTIATION80Asiya Javayant
1025Octavia MaletFrance2026-06-15Rangoni Of Florence QUALIFIED70Anna Fali
1026Emily WhobreyCanada2026-05-29Buckley Miller Wright NEW5Amy Elsner
1027Juan WieserSpain2026-05-23Feltz Printing Service NEW48Amy Elsner
1028Aika InouyeUnited Kingdom2026-06-02Chemel, James L Cpa NEW35Bernardo Dominic
1029Darci PoquetteBrazil2026-06-05Truhlar And Truhlar Attys PROPOSAL93Xuxue Feng
1030Kaitlin OstroskyIndia2026-05-26Chapman, Ross E Esq NEW7Ioni Bowcher
1031Aruna FigeroaArgentina2026-05-31Printing Dimensions NEGOTIATION52Amy Elsner
1032Greenwood BologniaItaly2026-06-17Commercial Press UNQUALIFIED8Ivan Magalhaes
1033Darci PoquetteItaly2026-06-10Buckley Miller Wright NEGOTIATION48Anna Fali
1034Nicolas IturbideRussia2026-06-14King, Christopher A Esq PROPOSAL8Elwin Sharvill
1035Ricardo GauchoCanada2026-06-19Chapman, Ross E Esq NEW51Onyama Limba
1036Darci PoquetteUnited Kingdom2026-06-01Feiner Bros RENEWAL18Stephen Shaw
1037Munro FerenczIndia2026-06-02Rousseaux, Michael Esq QUALIFIED72Xuxue Feng
1038Octavia MaletFrance2026-05-21Commercial Press QUALIFIED34Xuxue Feng
1039Darci PoquetteCanada2026-05-25King, Christopher A Esq UNQUALIFIED23Bernardo Dominic
1040Ivar PaprockiJapan2026-05-28Dorl, James J Esq NEW18Xuxue Feng
1041Adams MorascaArgentina2026-06-09Feiner Bros NEGOTIATION72Onyama Limba
1042Munro FerenczUnited Kingdom2026-06-16Commercial Press NEW90Stephen Shaw
1043Greenwood BologniaSpain2026-05-29Morlong Associates NEGOTIATION67Asiya Javayant
1044Misaki RoysterBrazil2026-06-01Chapman, Ross E Esq PROPOSAL79Elwin Sharvill
1045Kadeem FlosiArgentina2026-05-26King, Christopher A Esq NEGOTIATION37Bernardo Dominic
1046Jennifer AmigonBrazil2026-05-31Chemel, James L Cpa NEGOTIATION64Ioni Bowcher
1047Aika InouyeJapan2026-06-09Rousseaux, Michael Esq PROPOSAL5Ivan Magalhaes
1048Jefferson SchemmerGermany2026-05-24Feltz Printing Service NEW14Xuxue Feng
1049Leon OldroydJapan2026-06-09Chanay, Jeffrey A Esq QUALIFIED7Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Izzy GarufiItalyStephen Shaw RENEWAL
Arvin AlbaresBrazilOnyama Limba QUALIFIED
Adams MorascaArgentinaIvan Magalhaes UNQUALIFIED
Munro FerenczJapanElwin Sharvill RENEWAL
Aditya KuskoArgentinaElwin Sharvill NEGOTIATION
Kaitlin OstroskySpainAsiya Javayant NEW
Arvin AlbaresCanadaAnna Fali NEW
Jeanfrancois VenereBrazilElwin Sharvill UNQUALIFIED
Leon OldroydUnited KingdomAsiya Javayant UNQUALIFIED
Greenwood BologniaArgentinaOnyama Limba PROPOSAL
Kadeem FlosiCanadaXuxue Feng PROPOSAL
Octavia MaletJapanElwin Sharvill PROPOSAL
Rodrigues CampainFranceAsiya Javayant NEW
Mayumi KolmetzAustraliaOnyama Limba QUALIFIED
Izzy GarufiFranceStephen Shaw QUALIFIED
Izzy GarufiJapanIoni Bowcher NEGOTIATION
Munro FerenczArgentinaIoni Bowcher NEW
Sinclair WaycottAustraliaElwin Sharvill QUALIFIED
Clifford RimRussiaElwin Sharvill PROPOSAL
Rodrigues CampainItalyStephen Shaw QUALIFIED
Johnson SergiAustraliaOnyama Limba NEW
Faith GillianBrazilIoni Bowcher RENEWAL
Emily WhobreyArgentinaStephen Shaw NEGOTIATION
Sinclair WaycottArgentinaXuxue Feng PROPOSAL
Rodrigues CampainJapanAsiya Javayant NEGOTIATION
Cody SaylorsSpainStephen Shaw RENEWAL
Arvin AlbaresItalyIoni Bowcher NEGOTIATION
Deepesh ChuiFranceAmy Elsner UNQUALIFIED
Sinclair WaycottCanadaIoni Bowcher NEGOTIATION
Faith GillianJapanIoni Bowcher RENEWAL
Aruna FigeroaUnited KingdomIoni Bowcher NEW
Claire TollnerUnited KingdomElwin Sharvill QUALIFIED
Salvatore StockhamIndiaIvan Magalhaes PROPOSAL
Cody SaylorsRussiaXuxue Feng UNQUALIFIED
Jennifer AmigonIndiaIoni Bowcher UNQUALIFIED
Nicolas IturbideCanadaStephen Shaw QUALIFIED
Jones VocelkaGermanyXuxue Feng NEGOTIATION
Aika InouyeUnited KingdomIoni Bowcher NEW
Sinclair WaycottFranceIoni Bowcher NEGOTIATION
Arvin AlbaresUnited KingdomStephen Shaw QUALIFIED
Francesco ShinkoJapanBernardo Dominic NEW
Aruna FigeroaSpainElwin Sharvill QUALIFIED
Jefferson SchemmerBrazilAmy Elsner RENEWAL
Francesco ShinkoIndiaXuxue Feng RENEWAL
Faith GillianAustraliaElwin Sharvill UNQUALIFIED
Francesco ShinkoJapanBernardo Dominic UNQUALIFIED
Smith GlickItalyAsiya Javayant RENEWAL
Ivar PaprockiFranceAmy Elsner UNQUALIFIED
James ButtJapanAnna Fali PROPOSAL
Arvin AlbaresGermanyAmy Elsner QUALIFIED
Frozen Columns
Name
Antonio Caudy
Claire Tollner
Leon Oldroyd
Rodrigues Campain
Morrow Ruta
Ivar Paprocki
Ivar Paprocki
Maria Marrier
Misaki Royster
Johnson Sergi
Emily Whobrey
Emily Whobrey
Antonio Caudy
Chavez Briddick
Mayumi Kolmetz
Claire Tollner
Salvatore Stockham
Salvatore Stockham
Cody Saylors
Ricardo Gaucho
Aika Inouye
Deepesh Chui
Juan Wieser
David Darakjy
Kaitlin Ostrosky
Antonio Caudy
Mayumi Kolmetz
Munro Ferencz
Rodrigues Campain
Ricardo Gaucho
Darci Poquette
Mayumi Kolmetz
Silvio Slusarski
Leja Caldarera
Izzy Garufi
Faith Gillian
Arvin Albares
Emily Whobrey
Mayumi Kolmetz
Costa Dilliard
Maria Marrier
Rodrigues Campain
Francesco Shinko
Juan Wieser
James Butt
Aruna Figeroa
Nicolas Iturbide
Alejandro Perin
Rodrigues Campain
Mujtaba Nicka
IdCountryDate
1000India2026-06-06
1001Canada2026-05-31
1002Canada2026-06-05
1003Canada2026-06-01
1004Australia2026-06-04
1005India2026-06-12
1006Argentina2026-06-15
1007Argentina2026-06-01
1008Germany2026-05-31
1009Spain2026-06-11
1010Canada2026-06-13
1011Japan2026-06-11
1012Spain2026-06-04
1013Argentina2026-06-13
1014Australia2026-06-13
1015India2026-05-25
1016Australia2026-06-14
1017Canada2026-05-27
1018Canada2026-06-19
1019Argentina2026-06-03
1020Australia2026-06-13
1021Brazil2026-06-19
1022India2026-05-23
1023France2026-06-02
1024Italy2026-06-11
1025Germany2026-05-23
1026Japan2026-06-16
1027France2026-06-03
1028Canada2026-05-22
1029Russia2026-05-27
1030Russia2026-06-03
1031Australia2026-06-16
1032Spain2026-06-19
1033Argentina2026-05-26
1034Germany2026-05-30
1035Brazil2026-06-03
1036Germany2026-06-01
1037India2026-06-12
1038Argentina2026-06-17
1039Australia2026-06-11
1040Spain2026-05-22
1041Argentina2026-06-08
1042Canada2026-06-02
1043Italy2026-06-14
1044Germany2026-06-07
1045Japan2026-06-15
1046Argentina2026-05-27
1047United Kingdom2026-06-02
1048Brazil2026-05-27
1049Spain2026-06-16

On-Demand Data

NameIdCountryDate
Cody Saylors1000Italy2026-05-23
Octavia Malet1001United Kingdom2026-06-07
Aika Inouye1002United Kingdom2026-06-07
Kadeem Flosi1003Germany2026-06-15
Kaitlin Ostrosky1004Germany2026-06-19
Ashley Doe1005Argentina2026-05-30
Izzy Garufi1006Argentina2026-06-18
Chavez Briddick1007United Kingdom2026-06-12
Ivar Paprocki1008Canada2026-05-27
Deepesh Chui1009Canada2026-05-23
Cody Saylors1010Brazil2026-06-15
Jeanfrancois Venere1011United Kingdom2026-06-08
Nicolas Iturbide1012Spain2026-06-15
Alejandro Perin1013Argentina2026-06-18
Clifford Rim1014Italy2026-06-12
Alejandro Perin1015Russia2026-06-17
Isabel Bowley1016Italy2026-06-06
Ivar Paprocki1017Spain2026-05-21
Alejandro Perin1018United Kingdom2026-06-15
Claire Tollner1019France2026-06-08
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Wickens NestleFranceElwin Sharvill QUALIFIED
Maria MarrierItalyOnyama Limba PROPOSAL
Misaki RoysterCanadaIoni Bowcher QUALIFIED
Ivar PaprockiRussiaAmy Elsner NEGOTIATION
Isabel BowleyCanadaAnna Fali RENEWAL
Adams MorascaRussiaIoni Bowcher UNQUALIFIED
Leja CaldareraBrazilIvan Magalhaes PROPOSAL
Greenwood BologniaItalyXuxue Feng UNQUALIFIED
Jefferson SchemmerCanadaElwin Sharvill NEGOTIATION
James ButtSpainAmy Elsner NEGOTIATION
Greenwood BologniaSpainAnna Fali NEGOTIATION
Chavez BriddickSpainElwin Sharvill QUALIFIED
Tony FollerRussiaXuxue Feng UNQUALIFIED
Jefferson SchemmerUnited KingdomAmy Elsner PROPOSAL
Alejandro PerinRussiaAnna Fali UNQUALIFIED
Sinclair WaycottItalyAnna Fali PROPOSAL
Rodrigues CampainArgentinaOnyama Limba QUALIFIED
Maria MarrierBrazilXuxue Feng NEGOTIATION
Wickens NestleRussiaIvan Magalhaes NEGOTIATION
Izzy GarufiJapanOnyama Limba NEW
Leja CaldareraRussiaAsiya Javayant NEW
Smith GlickItalyIoni Bowcher UNQUALIFIED
Silvio SlusarskiArgentinaIvan Magalhaes NEGOTIATION
Leja CaldareraArgentinaAsiya Javayant RENEWAL
Aditya KuskoAustraliaIvan Magalhaes PROPOSAL
Greenwood BologniaFranceBernardo Dominic NEGOTIATION
Emily WhobreyUnited KingdomIvan Magalhaes RENEWAL
Ricardo GauchoSpainAsiya Javayant QUALIFIED
Ivar PaprockiGermanyElwin Sharvill UNQUALIFIED
Ivar PaprockiItalyAsiya Javayant QUALIFIED
Wickens NestleArgentinaIvan Magalhaes QUALIFIED
Leon OldroydAustraliaOnyama Limba NEGOTIATION
Adams MorascaAustraliaAmy Elsner NEW
Smith GlickRussiaXuxue Feng NEGOTIATION
Deepesh ChuiIndiaXuxue Feng RENEWAL
Alejandro PerinBrazilElwin Sharvill UNQUALIFIED
Nicolas IturbideFranceIoni Bowcher NEGOTIATION
Silvio SlusarskiFranceOnyama Limba QUALIFIED
Johnson SergiArgentinaIoni Bowcher PROPOSAL
Jones VocelkaAustraliaIvan Magalhaes NEW

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