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
Darci PoquetteBrazilStephen Shaw UNQUALIFIED
Faith GillianArgentinaElwin Sharvill PROPOSAL
Johnson SergiUnited KingdomBernardo Dominic UNQUALIFIED
Arvin AlbaresIndiaStephen Shaw NEGOTIATION
Antonio CaudyUnited KingdomElwin Sharvill NEGOTIATION
Izzy GarufiIndiaAnna Fali NEW
Silvio SlusarskiUnited KingdomAnna Fali NEGOTIATION
Octavia MaletFranceStephen Shaw NEW
Smith GlickAustraliaOnyama Limba RENEWAL
Greenwood BologniaFranceAnna Fali RENEWAL
Greenwood BologniaItalyElwin Sharvill NEGOTIATION
Francesco ShinkoRussiaStephen Shaw NEW
Juan WieserAustraliaElwin Sharvill UNQUALIFIED
Arvin AlbaresIndiaIvan Magalhaes RENEWAL
Darci PoquetteArgentinaAmy Elsner UNQUALIFIED
Greenwood BologniaIndiaIoni Bowcher NEW
Deepesh ChuiFranceIvan Magalhaes RENEWAL
Munro FerenczSpainIvan Magalhaes NEGOTIATION
Aditya KuskoArgentinaAnna Fali PROPOSAL
Ashley DoeFranceElwin Sharvill UNQUALIFIED
Aruna FigeroaArgentinaBernardo Dominic UNQUALIFIED
Johnson SergiUnited KingdomXuxue Feng NEW
Silvio SlusarskiSpainXuxue Feng RENEWAL
Francesco ShinkoRussiaBernardo Dominic QUALIFIED
Darci PoquetteIndiaBernardo Dominic NEGOTIATION
Ricardo GauchoItalyStephen Shaw UNQUALIFIED
Tony FollerBrazilIvan Magalhaes NEW
Cody SaylorsGermanyIoni Bowcher RENEWAL
Faith GillianIndiaAsiya Javayant QUALIFIED
Julie StensethCanadaStephen Shaw UNQUALIFIED
James ButtUnited KingdomAnna Fali NEW
Jennifer AmigonBrazilOnyama Limba QUALIFIED
Jeanfrancois VenereCanadaStephen Shaw UNQUALIFIED
Tony FollerIndiaIvan Magalhaes RENEWAL
Rodrigues CampainCanadaOnyama Limba QUALIFIED
Emily WhobreyItalyAsiya Javayant PROPOSAL
Claire TollnerUnited KingdomIoni Bowcher NEW
Salvatore StockhamAustraliaBernardo Dominic QUALIFIED
Stacey MacleadGermanyAnna Fali PROPOSAL
Murillo MaletFranceAnna Fali PROPOSAL
Darci PoquetteAustraliaXuxue Feng NEW
Mayumi KolmetzCanadaBernardo Dominic UNQUALIFIED
Francesco ShinkoArgentinaAnna Fali NEW
Aika InouyeBrazilElwin Sharvill PROPOSAL
Emily WhobreyAustraliaAsiya Javayant PROPOSAL
Clifford RimFranceBernardo Dominic QUALIFIED
Tony FollerCanadaXuxue Feng QUALIFIED
Izzy GarufiFranceStephen Shaw NEW
Stacey MacleadItalyXuxue Feng PROPOSAL
Johnson SergiBrazilOnyama Limba PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Salvatore StockhamAustraliaElwin Sharvill NEGOTIATION
Antonio CaudyFranceAmy Elsner NEGOTIATION
Julie StensethRussiaXuxue Feng NEW
Clifford RimUnited KingdomAsiya Javayant RENEWAL
Stacey MacleadSpainStephen Shaw RENEWAL
Ashley DoeFranceXuxue Feng UNQUALIFIED
James ButtRussiaIvan Magalhaes NEW
Kaitlin OstroskyGermanyAsiya Javayant UNQUALIFIED
Aika InouyeBrazilBernardo Dominic UNQUALIFIED
Mujtaba NickaArgentinaElwin Sharvill NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Darci PoquetteSpain2026-05-01Chanay, Jeffrey A Esq UNQUALIFIED24Bernardo Dominic
1001Aika InouyeFrance2026-04-29Rousseaux, Michael Esq NEW68Ioni Bowcher
1002Maria MarrierGermany2026-05-03Printing Dimensions UNQUALIFIED99Onyama Limba
1003Ricardo GauchoFrance2026-04-28Feiner Bros UNQUALIFIED32Onyama Limba
1004Darci PoquetteCanada2026-05-03Dorl, James J Esq NEGOTIATION91Ioni Bowcher
1005Maisha RulapaughUnited Kingdom2026-05-07Chemel, James L Cpa RENEWAL74Onyama Limba
1006Faith GillianJapan2026-04-26Chapman, Ross E Esq UNQUALIFIED97Elwin Sharvill
1007Morrow RutaAustralia2026-05-10Benton, John B Jr RENEWAL79Stephen Shaw
1008Mayumi KolmetzFrance2026-05-06Dorl, James J Esq PROPOSAL82Bernardo Dominic
1009Clifford RimGermany2026-04-29King, Christopher A Esq QUALIFIED42Asiya Javayant
1010Maisha RulapaughSpain2026-05-10Rangoni Of Florence UNQUALIFIED35Stephen Shaw
1011Clifford RimCanada2026-04-26Buckley Miller Wright UNQUALIFIED87Anna Fali
1012Arvin AlbaresSpain2026-04-20Rangoni Of Florence QUALIFIED48Amy Elsner
1013Maisha RulapaughBrazil2026-05-02Printing Dimensions UNQUALIFIED96Onyama Limba
1014Maria MarrierArgentina2026-04-19Buckley Miller Wright NEGOTIATION24Bernardo Dominic
1015Adams MorascaIndia2026-05-04Benton, John B Jr QUALIFIED99Ivan Magalhaes
1016Sinclair WaycottUnited Kingdom2026-04-14Chanay, Jeffrey A Esq NEGOTIATION27Xuxue Feng
1017Mayumi KolmetzSpain2026-05-09King, Christopher A Esq PROPOSAL50Onyama Limba
1018Stacey MacleadArgentina2026-04-25Rousseaux, Michael Esq QUALIFIED36Ioni Bowcher
1019Deepesh ChuiCanada2026-04-14Buckley Miller Wright NEGOTIATION46Xuxue Feng
1020Darci PoquetteAustralia2026-05-11Chanay, Jeffrey A Esq RENEWAL41Elwin Sharvill
1021Maria MarrierJapan2026-04-23Dorl, James J Esq PROPOSAL67Bernardo Dominic
1022Mayumi KolmetzJapan2026-04-19Feiner Bros NEW68Bernardo Dominic
1023Maisha RulapaughFrance2026-05-05Morlong Associates NEW2Stephen Shaw
1024Alejandro PerinUnited Kingdom2026-04-19Rousseaux, Michael Esq QUALIFIED90Amy Elsner
1025Greenwood BologniaGermany2026-04-21Buckley Miller Wright PROPOSAL52Xuxue Feng
1026Maisha RulapaughRussia2026-05-11Buckley Miller Wright RENEWAL28Stephen Shaw
1027Silvio SlusarskiGermany2026-05-07Truhlar And Truhlar Attys QUALIFIED88Xuxue Feng
1028Chavez BriddickArgentina2026-04-26Chemel, James L Cpa NEW73Xuxue Feng
1029Chavez BriddickSpain2026-04-15Rangoni Of Florence NEW23Stephen Shaw
1030Maisha RulapaughJapan2026-04-22Rousseaux, Michael Esq QUALIFIED97Bernardo Dominic
1031Darci PoquetteItaly2026-04-23Benton, John B Jr UNQUALIFIED42Asiya Javayant
1032Jennifer AmigonItaly2026-04-21Feltz Printing Service NEW84Ioni Bowcher
1033Ivar PaprockiBrazil2026-04-17Truhlar And Truhlar Attys NEGOTIATION83Bernardo Dominic
1034Emily WhobreyJapan2026-04-20Chapman, Ross E Esq NEGOTIATION47Elwin Sharvill
1035Jeanfrancois VenereFrance2026-05-04Truhlar And Truhlar Attys PROPOSAL90Onyama Limba
1036Ricardo GauchoCanada2026-05-09Chanay, Jeffrey A Esq NEGOTIATION70Anna Fali
1037Octavia MaletJapan2026-05-11Dorl, James J Esq NEGOTIATION1Amy Elsner
1038Maria MarrierCanada2026-04-23Chanay, Jeffrey A Esq NEGOTIATION83Stephen Shaw
1039Izzy GarufiAustralia2026-04-15Feltz Printing Service NEGOTIATION23Ioni Bowcher
1040Octavia MaletItaly2026-04-13Morlong Associates UNQUALIFIED81Ivan Magalhaes
1041Costa DilliardIndia2026-04-15Rangoni Of Florence RENEWAL75Bernardo Dominic
1042Adams MorascaArgentina2026-04-16Chemel, James L Cpa UNQUALIFIED58Bernardo Dominic
1043Aditya KuskoIndia2026-05-05King, Christopher A Esq NEW37Bernardo Dominic
1044Leon OldroydIndia2026-04-20Morlong Associates RENEWAL63Anna Fali
1045Chavez BriddickIndia2026-04-27Chanay, Jeffrey A Esq PROPOSAL42Ioni Bowcher
1046Faith GillianJapan2026-04-24Chemel, James L Cpa UNQUALIFIED59Ivan Magalhaes
1047Alejandro PerinAustralia2026-05-08Feiner Bros RENEWAL18Elwin Sharvill
1048Tony FollerIndia2026-04-17Chanay, Jeffrey A Esq UNQUALIFIED92Ivan Magalhaes
1049Cody SaylorsBrazil2026-05-09Feltz Printing Service RENEWAL51Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Deepesh ChuiAustraliaBernardo Dominic NEGOTIATION
James ButtAustraliaOnyama Limba RENEWAL
Cody SaylorsSpainAmy Elsner NEW
Maria MarrierRussiaBernardo Dominic RENEWAL
Nicolas IturbideRussiaAmy Elsner NEW
Isabel BowleyIndiaIvan Magalhaes QUALIFIED
Jennifer AmigonRussiaIvan Magalhaes QUALIFIED
Claire TollnerGermanyAnna Fali UNQUALIFIED
Kadeem FlosiJapanBernardo Dominic NEW
Murillo MaletIndiaXuxue Feng QUALIFIED
Aruna FigeroaUnited KingdomIvan Magalhaes PROPOSAL
Jones VocelkaUnited KingdomXuxue Feng NEGOTIATION
Silvio SlusarskiIndiaStephen Shaw QUALIFIED
Chavez BriddickSpainAnna Fali RENEWAL
Maisha RulapaughItalyElwin Sharvill UNQUALIFIED
Sinclair WaycottArgentinaXuxue Feng NEGOTIATION
Misaki RoysterAustraliaBernardo Dominic PROPOSAL
Julie StensethUnited KingdomBernardo Dominic PROPOSAL
Morrow RutaFranceStephen Shaw NEW
Antonio CaudyJapanElwin Sharvill NEGOTIATION
Ricardo GauchoGermanyAsiya Javayant PROPOSAL
Jones VocelkaItalyAsiya Javayant NEGOTIATION
Claire TollnerUnited KingdomElwin Sharvill NEW
Ricardo GauchoRussiaStephen Shaw UNQUALIFIED
Deepesh ChuiBrazilAmy Elsner PROPOSAL
Tony FollerItalyStephen Shaw PROPOSAL
Darci PoquetteJapanXuxue Feng UNQUALIFIED
Maisha RulapaughUnited KingdomOnyama Limba PROPOSAL
Cody SaylorsFranceXuxue Feng RENEWAL
Wickens NestleIndiaBernardo Dominic QUALIFIED
Sinclair WaycottArgentinaIvan Magalhaes RENEWAL
Wickens NestleRussiaAmy Elsner PROPOSAL
Izzy GarufiSpainStephen Shaw NEGOTIATION
Smith GlickIndiaIoni Bowcher QUALIFIED
Darci PoquetteBrazilElwin Sharvill QUALIFIED
Smith GlickCanadaElwin Sharvill QUALIFIED
Kaitlin OstroskyGermanyElwin Sharvill PROPOSAL
Jefferson SchemmerBrazilAmy Elsner QUALIFIED
Ashley DoeGermanyXuxue Feng QUALIFIED
Isabel BowleyJapanAsiya Javayant QUALIFIED
Mujtaba NickaIndiaXuxue Feng RENEWAL
Sinclair WaycottFranceElwin Sharvill NEGOTIATION
Kaitlin OstroskyCanadaBernardo Dominic UNQUALIFIED
Aruna FigeroaIndiaAsiya Javayant NEGOTIATION
Sinclair WaycottBrazilAmy Elsner QUALIFIED
Antonio CaudyBrazilXuxue Feng NEGOTIATION
Morrow RutaJapanAmy Elsner RENEWAL
Maisha RulapaughUnited KingdomOnyama Limba NEGOTIATION
Tony FollerGermanyAsiya Javayant RENEWAL
Adams MorascaSpainAmy Elsner PROPOSAL
Frozen Columns
Name
Adams Morasca
Ivar Paprocki
Silvio Slusarski
Darci Poquette
Izzy Garufi
Misaki Royster
Jennifer Amigon
Antonio Caudy
Murillo Malet
Octavia Malet
Julie Stenseth
Faith Gillian
Sinclair Waycott
Ivar Paprocki
Ricardo Gaucho
Izzy Garufi
Isabel Bowley
Antonio Caudy
Kadeem Flosi
Jones Vocelka
David Darakjy
Nicolas Iturbide
Antonio Caudy
Murillo Malet
Jones Vocelka
Sinclair Waycott
Julie Stenseth
Julie Stenseth
Smith Glick
Aruna Figeroa
Smith Glick
Munro Ferencz
Juan Wieser
Stacey Maclead
Maria Marrier
Aika Inouye
Nicolas Iturbide
Chavez Briddick
Nicolas Iturbide
Deepesh Chui
Ivar Paprocki
Greenwood Bolognia
Jefferson Schemmer
Jennifer Amigon
Deepesh Chui
Aika Inouye
Silvio Slusarski
Jeanfrancois Venere
Leon Oldroyd
Rodrigues Campain
IdCountryDate
1000Argentina2026-05-07
1001Canada2026-04-13
1002Italy2026-05-01
1003United Kingdom2026-04-14
1004Spain2026-05-08
1005United Kingdom2026-04-28
1006Russia2026-05-03
1007Canada2026-04-26
1008Canada2026-05-08
1009Australia2026-04-25
1010Canada2026-04-21
1011Australia2026-04-21
1012Argentina2026-04-20
1013Canada2026-04-17
1014Canada2026-04-19
1015Australia2026-04-19
1016Germany2026-05-01
1017Brazil2026-04-21
1018United Kingdom2026-04-28
1019Argentina2026-05-05
1020France2026-05-02
1021Brazil2026-04-22
1022Russia2026-05-05
1023France2026-05-10
1024Spain2026-05-06
1025Brazil2026-04-22
1026India2026-04-26
1027Italy2026-05-10
1028Italy2026-05-09
1029Italy2026-04-29
1030France2026-05-06
1031France2026-05-04
1032Argentina2026-04-15
1033Brazil2026-04-24
1034Germany2026-04-18
1035Italy2026-04-27
1036Australia2026-05-12
1037Italy2026-04-23
1038Spain2026-04-25
1039Brazil2026-04-23
1040Canada2026-04-17
1041France2026-05-12
1042Russia2026-05-03
1043Japan2026-04-22
1044Italy2026-04-14
1045Japan2026-04-24
1046Canada2026-04-21
1047Japan2026-04-23
1048Argentina2026-04-26
1049Brazil2026-05-09

On-Demand Data

NameIdCountryDate
Tony Foller1000Russia2026-04-29
Julie Stenseth1001Japan2026-04-24
Arvin Albares1002Japan2026-04-17
Claire Tollner1003Germany2026-04-16
Smith Glick1004Australia2026-05-12
Francesco Shinko1005Russia2026-04-22
Deepesh Chui1006France2026-05-11
Sinclair Waycott1007Germany2026-04-25
Kaitlin Ostrosky1008Russia2026-05-04
Smith Glick1009Russia2026-05-11
Izzy Garufi1010Brazil2026-05-03
Tony Foller1011Spain2026-05-03
Claire Tollner1012Argentina2026-04-18
Maisha Rulapaugh1013Argentina2026-05-02
Mayumi Kolmetz1014Spain2026-05-10
Darci Poquette1015Australia2026-04-22
Mujtaba Nicka1016France2026-04-18
Jefferson Schemmer1017Brazil2026-04-14
Julie Stenseth1018Russia2026-05-03
Greenwood Bolognia1019Germany2026-04-29
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jefferson SchemmerGermanyOnyama Limba NEW
Leja CaldareraSpainIvan Magalhaes NEGOTIATION
Chavez BriddickUnited KingdomStephen Shaw QUALIFIED
Jeanfrancois VenereCanadaOnyama Limba NEGOTIATION
Clifford RimIndiaIvan Magalhaes NEW
Alejandro PerinUnited KingdomAmy Elsner NEW
James ButtFranceAnna Fali UNQUALIFIED
Wickens NestleJapanIoni Bowcher RENEWAL
David DarakjyCanadaElwin Sharvill PROPOSAL
Izzy GarufiRussiaBernardo Dominic PROPOSAL
Ivar PaprockiIndiaXuxue Feng RENEWAL
Munro FerenczIndiaAmy Elsner UNQUALIFIED
Munro FerenczCanadaBernardo Dominic NEGOTIATION
Ashley DoeCanadaAsiya Javayant UNQUALIFIED
Chavez BriddickAustraliaElwin Sharvill UNQUALIFIED
Sinclair WaycottAustraliaAmy Elsner PROPOSAL
Arvin AlbaresItalyStephen Shaw UNQUALIFIED
Isabel BowleyUnited KingdomOnyama Limba UNQUALIFIED
Kaitlin OstroskyItalyIoni Bowcher UNQUALIFIED
Ricardo GauchoSpainOnyama Limba NEW
Octavia MaletIndiaOnyama Limba NEGOTIATION
Jones VocelkaSpainStephen Shaw PROPOSAL
Deepesh ChuiJapanXuxue Feng QUALIFIED
Alejandro PerinItalyIoni Bowcher PROPOSAL
Adams MorascaGermanyAnna Fali UNQUALIFIED
Morrow RutaIndiaAmy Elsner RENEWAL
Julie StensethBrazilIvan Magalhaes RENEWAL
Alejandro PerinRussiaElwin Sharvill PROPOSAL
Jones VocelkaIndiaAmy Elsner NEGOTIATION
Maria MarrierCanadaXuxue Feng QUALIFIED
Salvatore StockhamUnited KingdomOnyama Limba PROPOSAL
David DarakjySpainIoni Bowcher UNQUALIFIED
Arvin AlbaresIndiaAmy Elsner RENEWAL
Leja CaldareraSpainElwin Sharvill PROPOSAL
Maisha RulapaughRussiaStephen Shaw UNQUALIFIED
Emily WhobreyArgentinaIoni Bowcher NEGOTIATION
Ricardo GauchoJapanBernardo Dominic QUALIFIED
Octavia MaletUnited KingdomBernardo Dominic RENEWAL
Smith GlickFranceElwin Sharvill QUALIFIED
Silvio SlusarskiGermanyStephen Shaw 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>