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
Kadeem FlosiAustraliaIvan Magalhaes NEW
Jennifer AmigonItalyAnna Fali PROPOSAL
Ricardo GauchoUnited KingdomAnna Fali NEW
Tony FollerAustraliaStephen Shaw NEW
Jones VocelkaAustraliaAsiya Javayant QUALIFIED
Octavia MaletBrazilIoni Bowcher UNQUALIFIED
Ivar PaprockiUnited KingdomAnna Fali QUALIFIED
Chavez BriddickRussiaXuxue Feng QUALIFIED
Kadeem FlosiItalyXuxue Feng PROPOSAL
Clifford RimCanadaAsiya Javayant NEGOTIATION
Chavez BriddickFranceIoni Bowcher QUALIFIED
Julie StensethCanadaIvan Magalhaes PROPOSAL
Leon OldroydCanadaAnna Fali RENEWAL
David DarakjyArgentinaAnna Fali UNQUALIFIED
Salvatore StockhamRussiaIvan Magalhaes QUALIFIED
Aika InouyeIndiaStephen Shaw PROPOSAL
Ivar PaprockiCanadaIvan Magalhaes NEGOTIATION
James ButtItalyElwin Sharvill NEGOTIATION
Mujtaba NickaItalyOnyama Limba NEW
Costa DilliardFranceAsiya Javayant NEGOTIATION
Alejandro PerinAustraliaOnyama Limba QUALIFIED
Mayumi KolmetzRussiaElwin Sharvill UNQUALIFIED
Octavia MaletRussiaIoni Bowcher PROPOSAL
Mayumi KolmetzAustraliaStephen Shaw UNQUALIFIED
Sinclair WaycottItalyElwin Sharvill UNQUALIFIED
Faith GillianIndiaElwin Sharvill NEGOTIATION
Stacey MacleadSpainElwin Sharvill NEGOTIATION
Cody SaylorsJapanElwin Sharvill PROPOSAL
Maria MarrierJapanIvan Magalhaes UNQUALIFIED
Julie StensethUnited KingdomXuxue Feng PROPOSAL
Johnson SergiCanadaAnna Fali RENEWAL
James ButtAustraliaIvan Magalhaes NEGOTIATION
Ivar PaprockiGermanyOnyama Limba NEGOTIATION
Kaitlin OstroskyAustraliaIvan Magalhaes QUALIFIED
Ashley DoeCanadaIvan Magalhaes UNQUALIFIED
Chavez BriddickRussiaAmy Elsner UNQUALIFIED
Rodrigues CampainSpainAmy Elsner NEW
Cody SaylorsUnited KingdomStephen Shaw QUALIFIED
Jones VocelkaRussiaAnna Fali UNQUALIFIED
Clifford RimIndiaElwin Sharvill NEW
James ButtSpainIvan Magalhaes NEW
Maria MarrierFranceBernardo Dominic RENEWAL
Silvio SlusarskiIndiaStephen Shaw NEGOTIATION
Aditya KuskoArgentinaAsiya Javayant QUALIFIED
Murillo MaletUnited KingdomBernardo Dominic PROPOSAL
Murillo MaletSpainAnna Fali NEGOTIATION
Costa DilliardJapanAmy Elsner QUALIFIED
Maria MarrierRussiaIoni Bowcher RENEWAL
Costa DilliardArgentinaOnyama Limba NEW
Francesco ShinkoUnited KingdomAmy Elsner NEW
Horizontal
NameCountryRepresentativeStatus
Jennifer AmigonArgentinaAsiya Javayant NEW
Greenwood BologniaGermanyElwin Sharvill UNQUALIFIED
Munro FerenczJapanStephen Shaw NEGOTIATION
Jefferson SchemmerAustraliaElwin Sharvill QUALIFIED
Darci PoquetteFranceIoni Bowcher QUALIFIED
Faith GillianCanadaElwin Sharvill PROPOSAL
Isabel BowleySpainAnna Fali UNQUALIFIED
Izzy GarufiCanadaStephen Shaw QUALIFIED
Chavez BriddickIndiaBernardo Dominic NEGOTIATION
David DarakjyGermanyIvan Magalhaes UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Alejandro PerinArgentina2026-05-19Rousseaux, Michael Esq UNQUALIFIED47Anna Fali
1001Cody SaylorsGermany2026-06-12Benton, John B Jr RENEWAL37Anna Fali
1002Julie StensethGermany2026-06-13Chapman, Ross E Esq PROPOSAL69Asiya Javayant
1003Aika InouyeIndia2026-06-09Rangoni Of Florence RENEWAL15Stephen Shaw
1004Claire TollnerFrance2026-05-29Feltz Printing Service NEW0Stephen Shaw
1005Kadeem FlosiGermany2026-06-08Morlong Associates NEW10Asiya Javayant
1006Ricardo GauchoRussia2026-05-20Chemel, James L Cpa NEGOTIATION71Anna Fali
1007Mayumi KolmetzGermany2026-05-30Chapman, Ross E Esq UNQUALIFIED12Stephen Shaw
1008Claire TollnerIndia2026-06-14Truhlar And Truhlar Attys QUALIFIED41Asiya Javayant
1009Mayumi KolmetzSpain2026-05-29Rousseaux, Michael Esq RENEWAL73Elwin Sharvill
1010Maria MarrierItaly2026-06-14Chapman, Ross E Esq PROPOSAL81Anna Fali
1011Aruna FigeroaUnited Kingdom2026-05-20Feiner Bros RENEWAL35Amy Elsner
1012Faith GillianJapan2026-06-13Feltz Printing Service NEW2Ioni Bowcher
1013Alejandro PerinArgentina2026-06-07Benton, John B Jr RENEWAL3Anna Fali
1014Emily WhobreyArgentina2026-05-31Buckley Miller Wright NEW56Onyama Limba
1015Mayumi KolmetzBrazil2026-05-19Morlong Associates PROPOSAL90Onyama Limba
1016Murillo MaletUnited Kingdom2026-06-07Chapman, Ross E Esq UNQUALIFIED3Bernardo Dominic
1017Deepesh ChuiFrance2026-06-13Printing Dimensions QUALIFIED20Amy Elsner
1018Salvatore StockhamUnited Kingdom2026-05-26Feiner Bros PROPOSAL44Bernardo Dominic
1019Aika InouyeJapan2026-05-29Feiner Bros NEGOTIATION51Asiya Javayant
1020Jones VocelkaUnited Kingdom2026-06-11Chemel, James L Cpa UNQUALIFIED73Ivan Magalhaes
1021Izzy GarufiRussia2026-05-31Feltz Printing Service NEW62Amy Elsner
1022Costa DilliardItaly2026-05-28Benton, John B Jr PROPOSAL43Xuxue Feng
1023Arvin AlbaresItaly2026-06-06Commercial Press NEGOTIATION71Bernardo Dominic
1024Juan WieserUnited Kingdom2026-06-11Morlong Associates UNQUALIFIED36Onyama Limba
1025Costa DilliardItaly2026-06-07Truhlar And Truhlar Attys UNQUALIFIED9Asiya Javayant
1026Adams MorascaItaly2026-06-14Morlong Associates PROPOSAL37Xuxue Feng
1027Izzy GarufiItaly2026-05-21Feltz Printing Service UNQUALIFIED2Xuxue Feng
1028Izzy GarufiFrance2026-06-04Chemel, James L Cpa RENEWAL79Asiya Javayant
1029Clifford RimJapan2026-05-17King, Christopher A Esq NEGOTIATION53Stephen Shaw
1030Maisha RulapaughIndia2026-06-04Chemel, James L Cpa NEW13Ivan Magalhaes
1031Darci PoquetteArgentina2026-05-16Commercial Press PROPOSAL88Stephen Shaw
1032Sinclair WaycottCanada2026-05-31Commercial Press PROPOSAL91Xuxue Feng
1033Jefferson SchemmerFrance2026-05-23Truhlar And Truhlar Attys NEGOTIATION67Anna Fali
1034Wickens NestleIndia2026-06-01Chanay, Jeffrey A Esq UNQUALIFIED36Stephen Shaw
1035Emily WhobreyUnited Kingdom2026-05-30King, Christopher A Esq NEGOTIATION72Stephen Shaw
1036Salvatore StockhamRussia2026-05-19Chanay, Jeffrey A Esq UNQUALIFIED40Asiya Javayant
1037Adams MorascaJapan2026-05-31Dorl, James J Esq RENEWAL85Ivan Magalhaes
1038Jones VocelkaIndia2026-05-21King, Christopher A Esq UNQUALIFIED67Anna Fali
1039Aruna FigeroaIndia2026-05-21Feltz Printing Service QUALIFIED54Onyama Limba
1040Faith GillianAustralia2026-05-28Morlong Associates RENEWAL31Stephen Shaw
1041Antonio CaudyJapan2026-06-01Chapman, Ross E Esq RENEWAL22Bernardo Dominic
1042Maisha RulapaughUnited Kingdom2026-05-18Buckley Miller Wright NEW63Ivan Magalhaes
1043Adams MorascaUnited Kingdom2026-06-11Rangoni Of Florence QUALIFIED44Ivan Magalhaes
1044Mayumi KolmetzFrance2026-06-07Chemel, James L Cpa RENEWAL12Anna Fali
1045Adams MorascaArgentina2026-06-11Truhlar And Truhlar Attys PROPOSAL21Ivan Magalhaes
1046Jeanfrancois VenereSpain2026-06-03Chemel, James L Cpa RENEWAL18Onyama Limba
1047Jefferson SchemmerCanada2026-06-04Chemel, James L Cpa NEW22Amy Elsner
1048Nicolas IturbideUnited Kingdom2026-06-14Benton, John B Jr QUALIFIED1Bernardo Dominic
1049Maisha RulapaughFrance2026-05-19Buckley Miller Wright QUALIFIED1Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Chavez BriddickArgentinaIvan Magalhaes PROPOSAL
Antonio CaudyIndiaIvan Magalhaes QUALIFIED
Rodrigues CampainJapanAnna Fali UNQUALIFIED
Emily WhobreyAustraliaIoni Bowcher PROPOSAL
Izzy GarufiUnited KingdomStephen Shaw NEGOTIATION
Darci PoquetteFranceElwin Sharvill RENEWAL
Salvatore StockhamFranceBernardo Dominic RENEWAL
Murillo MaletCanadaAnna Fali NEGOTIATION
Octavia MaletUnited KingdomAmy Elsner RENEWAL
Silvio SlusarskiRussiaOnyama Limba NEW
Adams MorascaIndiaAsiya Javayant NEGOTIATION
James ButtItalyBernardo Dominic NEW
Izzy GarufiCanadaBernardo Dominic QUALIFIED
Aruna FigeroaItalyAnna Fali PROPOSAL
Isabel BowleyBrazilElwin Sharvill RENEWAL
Adams MorascaArgentinaIoni Bowcher UNQUALIFIED
Emily WhobreyRussiaXuxue Feng RENEWAL
Juan WieserIndiaElwin Sharvill QUALIFIED
Julie StensethSpainAnna Fali NEW
Maisha RulapaughRussiaAsiya Javayant NEGOTIATION
Aruna FigeroaCanadaXuxue Feng NEW
Misaki RoysterSpainIoni Bowcher NEW
Arvin AlbaresBrazilAsiya Javayant RENEWAL
Darci PoquetteJapanXuxue Feng QUALIFIED
Leja CaldareraJapanAsiya Javayant RENEWAL
Ivar PaprockiUnited KingdomAmy Elsner QUALIFIED
Izzy GarufiArgentinaAnna Fali NEW
Kaitlin OstroskyJapanElwin Sharvill PROPOSAL
Rodrigues CampainRussiaAmy Elsner NEGOTIATION
Jeanfrancois VenereArgentinaOnyama Limba PROPOSAL
Jennifer AmigonArgentinaBernardo Dominic NEW
Mayumi KolmetzSpainBernardo Dominic UNQUALIFIED
Francesco ShinkoUnited KingdomAsiya Javayant NEGOTIATION
Ashley DoeFranceStephen Shaw NEW
Chavez BriddickIndiaAmy Elsner RENEWAL
Smith GlickItalyXuxue Feng NEW
David DarakjyUnited KingdomAnna Fali UNQUALIFIED
Greenwood BologniaIndiaAnna Fali QUALIFIED
Izzy GarufiRussiaStephen Shaw PROPOSAL
Ricardo GauchoArgentinaAmy Elsner NEGOTIATION
Munro FerenczCanadaAsiya Javayant RENEWAL
Smith GlickAustraliaIoni Bowcher RENEWAL
Wickens NestleArgentinaElwin Sharvill UNQUALIFIED
Jennifer AmigonBrazilAmy Elsner QUALIFIED
Kadeem FlosiAustraliaAmy Elsner NEGOTIATION
Aika InouyeBrazilBernardo Dominic PROPOSAL
Morrow RutaItalyAmy Elsner UNQUALIFIED
Alejandro PerinBrazilStephen Shaw PROPOSAL
Claire TollnerFranceStephen Shaw NEW
James ButtCanadaAmy Elsner NEGOTIATION
Frozen Columns
Name
Silvio Slusarski
Costa Dilliard
Chavez Briddick
Leon Oldroyd
Rodrigues Campain
Francesco Shinko
Silvio Slusarski
Chavez Briddick
Kadeem Flosi
Darci Poquette
Smith Glick
Clifford Rim
Arvin Albares
Ivar Paprocki
Cody Saylors
Silvio Slusarski
Emily Whobrey
Chavez Briddick
Alejandro Perin
Faith Gillian
Misaki Royster
Arvin Albares
Alejandro Perin
Alejandro Perin
Julie Stenseth
Smith Glick
Alejandro Perin
Isabel Bowley
Aika Inouye
James Butt
Misaki Royster
Maisha Rulapaugh
Jefferson Schemmer
Aditya Kusko
Mayumi Kolmetz
Chavez Briddick
Maisha Rulapaugh
Johnson Sergi
Greenwood Bolognia
Ashley Doe
Johnson Sergi
Emily Whobrey
Salvatore Stockham
Jones Vocelka
Ricardo Gaucho
Ricardo Gaucho
Rodrigues Campain
Murillo Malet
David Darakjy
Chavez Briddick
IdCountryDate
1000Japan2026-05-18
1001Italy2026-05-29
1002Australia2026-06-08
1003Japan2026-05-17
1004Brazil2026-05-29
1005Canada2026-06-10
1006United Kingdom2026-05-31
1007Germany2026-05-27
1008Germany2026-06-08
1009Brazil2026-06-13
1010United Kingdom2026-05-17
1011India2026-06-12
1012United Kingdom2026-05-19
1013India2026-06-07
1014Japan2026-05-17
1015Brazil2026-05-31
1016Australia2026-06-10
1017Australia2026-06-14
1018India2026-05-20
1019Brazil2026-05-25
1020Russia2026-05-26
1021Italy2026-06-01
1022Japan2026-06-05
1023Canada2026-05-31
1024India2026-06-11
1025Australia2026-05-22
1026Spain2026-05-17
1027Argentina2026-05-20
1028Argentina2026-06-03
1029United Kingdom2026-05-21
1030India2026-05-24
1031Russia2026-06-09
1032Brazil2026-06-02
1033Italy2026-06-11
1034Spain2026-06-05
1035Argentina2026-05-25
1036United Kingdom2026-05-31
1037Argentina2026-05-31
1038Japan2026-05-17
1039United Kingdom2026-06-02
1040Russia2026-06-09
1041Italy2026-05-16
1042Australia2026-06-09
1043France2026-05-18
1044United Kingdom2026-05-30
1045Japan2026-05-31
1046Japan2026-06-06
1047Russia2026-05-23
1048Japan2026-05-17
1049France2026-05-17

On-Demand Data

NameIdCountryDate
Nicolas Iturbide1000Japan2026-05-19
Darci Poquette1001Australia2026-06-03
Maisha Rulapaugh1002Canada2026-06-12
Antonio Caudy1003Canada2026-05-26
Stacey Maclead1004Germany2026-06-10
Tony Foller1005United Kingdom2026-05-21
Emily Whobrey1006Italy2026-05-29
Greenwood Bolognia1007Australia2026-05-16
Emily Whobrey1008Spain2026-05-30
Cody Saylors1009Argentina2026-06-05
Deepesh Chui1010India2026-06-13
Antonio Caudy1011Australia2026-05-25
Salvatore Stockham1012United Kingdom2026-06-12
Jones Vocelka1013Canada2026-05-27
Stacey Maclead1014Japan2026-06-12
Ivar Paprocki1015Canada2026-06-03
Emily Whobrey1016Japan2026-06-04
Aika Inouye1017India2026-06-14
Mujtaba Nicka1018Japan2026-06-12
Adams Morasca1019Italy2026-06-10
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Izzy GarufiUnited KingdomElwin Sharvill NEGOTIATION
Jones VocelkaSpainAnna Fali NEW
Johnson SergiFranceIvan Magalhaes PROPOSAL
Julie StensethUnited KingdomAmy Elsner RENEWAL
Ashley DoeArgentinaOnyama Limba QUALIFIED
Smith GlickArgentinaBernardo Dominic UNQUALIFIED
Aditya KuskoFranceElwin Sharvill RENEWAL
Jennifer AmigonUnited KingdomElwin Sharvill NEW
Stacey MacleadCanadaStephen Shaw NEGOTIATION
Cody SaylorsGermanyAmy Elsner NEGOTIATION
Stacey MacleadUnited KingdomAsiya Javayant UNQUALIFIED
Jeanfrancois VenereCanadaElwin Sharvill NEW
Aruna FigeroaRussiaIvan Magalhaes NEGOTIATION
Aika InouyeUnited KingdomIoni Bowcher RENEWAL
Silvio SlusarskiArgentinaOnyama Limba UNQUALIFIED
Sinclair WaycottAustraliaElwin Sharvill PROPOSAL
Smith GlickIndiaAmy Elsner UNQUALIFIED
Mayumi KolmetzUnited KingdomOnyama Limba QUALIFIED
Costa DilliardCanadaBernardo Dominic PROPOSAL
Salvatore StockhamBrazilElwin Sharvill PROPOSAL
Arvin AlbaresRussiaAsiya Javayant UNQUALIFIED
Antonio CaudyJapanElwin Sharvill NEGOTIATION
Maisha RulapaughArgentinaStephen Shaw RENEWAL
James ButtJapanAsiya Javayant NEW
Jennifer AmigonGermanyStephen Shaw UNQUALIFIED
Darci PoquetteSpainXuxue Feng NEW
Morrow RutaItalyIoni Bowcher RENEWAL
Aika InouyeCanadaBernardo Dominic PROPOSAL
Ricardo GauchoAustraliaIvan Magalhaes UNQUALIFIED
Clifford RimSpainElwin Sharvill RENEWAL
Faith GillianJapanAnna Fali UNQUALIFIED
Alejandro PerinAustraliaIvan Magalhaes NEGOTIATION
Morrow RutaAustraliaAsiya Javayant UNQUALIFIED
Sinclair WaycottJapanXuxue Feng QUALIFIED
Izzy GarufiUnited KingdomStephen Shaw PROPOSAL
Kadeem FlosiUnited KingdomXuxue Feng PROPOSAL
Arvin AlbaresUnited KingdomOnyama Limba QUALIFIED
Clifford RimAustraliaIoni Bowcher NEW
Wickens NestleIndiaAsiya Javayant PROPOSAL
Leja CaldareraFranceElwin Sharvill 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>