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
Claire TollnerCanadaElwin Sharvill NEGOTIATION
Clifford RimCanadaAnna Fali NEW
Jeanfrancois VenereArgentinaIoni Bowcher NEW
David DarakjyIndiaAmy Elsner UNQUALIFIED
Morrow RutaIndiaAsiya Javayant NEW
Faith GillianCanadaAmy Elsner PROPOSAL
Rodrigues CampainBrazilElwin Sharvill UNQUALIFIED
Aika InouyeRussiaAsiya Javayant NEGOTIATION
Claire TollnerItalyAnna Fali QUALIFIED
Jeanfrancois VenereBrazilAnna Fali QUALIFIED
Juan WieserFranceElwin Sharvill RENEWAL
Salvatore StockhamGermanyElwin Sharvill NEW
Wickens NestleRussiaAnna Fali NEW
Mayumi KolmetzAustraliaAmy Elsner NEW
Tony FollerRussiaAmy Elsner NEW
Faith GillianFranceIoni Bowcher UNQUALIFIED
Aruna FigeroaCanadaStephen Shaw QUALIFIED
Rodrigues CampainSpainIoni Bowcher NEGOTIATION
Maria MarrierBrazilAmy Elsner NEGOTIATION
Morrow RutaJapanAnna Fali PROPOSAL
Salvatore StockhamGermanyStephen Shaw NEW
Julie StensethCanadaXuxue Feng RENEWAL
Wickens NestleSpainElwin Sharvill NEGOTIATION
Silvio SlusarskiFranceXuxue Feng PROPOSAL
Faith GillianUnited KingdomIvan Magalhaes UNQUALIFIED
Silvio SlusarskiCanadaElwin Sharvill NEW
Maria MarrierArgentinaOnyama Limba PROPOSAL
Ivar PaprockiItalyAmy Elsner QUALIFIED
Greenwood BologniaCanadaXuxue Feng RENEWAL
Mujtaba NickaUnited KingdomAmy Elsner RENEWAL
Isabel BowleyJapanElwin Sharvill NEW
Ashley DoeSpainAmy Elsner PROPOSAL
Jennifer AmigonJapanIvan Magalhaes PROPOSAL
Johnson SergiItalyBernardo Dominic NEGOTIATION
Ricardo GauchoGermanyAmy Elsner RENEWAL
Jennifer AmigonItalyBernardo Dominic UNQUALIFIED
Rodrigues CampainUnited KingdomXuxue Feng QUALIFIED
James ButtAustraliaBernardo Dominic RENEWAL
Izzy GarufiAustraliaIoni Bowcher UNQUALIFIED
Kadeem FlosiJapanAmy Elsner RENEWAL
Kadeem FlosiGermanyStephen Shaw NEW
Isabel BowleyGermanyAsiya Javayant UNQUALIFIED
Isabel BowleyGermanyElwin Sharvill QUALIFIED
Sinclair WaycottSpainAmy Elsner UNQUALIFIED
Jennifer AmigonFranceElwin Sharvill NEGOTIATION
Clifford RimArgentinaAnna Fali QUALIFIED
Rodrigues CampainRussiaAnna Fali UNQUALIFIED
Alejandro PerinRussiaAnna Fali RENEWAL
Ivar PaprockiUnited KingdomIvan Magalhaes NEGOTIATION
Stacey MacleadCanadaIvan Magalhaes QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Murillo MaletArgentinaOnyama Limba NEGOTIATION
Faith GillianBrazilIoni Bowcher UNQUALIFIED
Clifford RimRussiaBernardo Dominic NEW
Greenwood BologniaIndiaAnna Fali PROPOSAL
Ricardo GauchoRussiaIvan Magalhaes QUALIFIED
Maisha RulapaughSpainAmy Elsner NEW
Johnson SergiAustraliaElwin Sharvill QUALIFIED
Adams MorascaCanadaAmy Elsner PROPOSAL
Chavez BriddickFranceBernardo Dominic QUALIFIED
Jeanfrancois VenereItalyOnyama Limba NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Rodrigues CampainFrance2026-05-23Rousseaux, Michael Esq RENEWAL12Onyama Limba
1001Ricardo GauchoIndia2026-06-04Printing Dimensions PROPOSAL88Xuxue Feng
1002Deepesh ChuiIndia2026-05-24Benton, John B Jr NEW2Xuxue Feng
1003Misaki RoysterBrazil2026-06-10Printing Dimensions PROPOSAL83Bernardo Dominic
1004Misaki RoysterJapan2026-05-22Dorl, James J Esq QUALIFIED39Anna Fali
1005Leja CaldareraFrance2026-05-21Buckley Miller Wright NEW34Asiya Javayant
1006Mujtaba NickaAustralia2026-06-07Chemel, James L Cpa NEW45Asiya Javayant
1007Aditya KuskoArgentina2026-06-05Dorl, James J Esq QUALIFIED23Asiya Javayant
1008Clifford RimFrance2026-06-01King, Christopher A Esq RENEWAL77Elwin Sharvill
1009Silvio SlusarskiFrance2026-05-19Morlong Associates QUALIFIED59Ioni Bowcher
1010Ashley DoeFrance2026-05-24Chapman, Ross E Esq UNQUALIFIED64Bernardo Dominic
1011Ricardo GauchoRussia2026-05-18Morlong Associates RENEWAL64Onyama Limba
1012Deepesh ChuiIndia2026-05-17Rangoni Of Florence NEW88Anna Fali
1013Juan WieserArgentina2026-05-19Feltz Printing Service QUALIFIED57Bernardo Dominic
1014Deepesh ChuiFrance2026-05-20Chemel, James L Cpa UNQUALIFIED15Elwin Sharvill
1015Jones VocelkaAustralia2026-06-02Benton, John B Jr NEGOTIATION93Asiya Javayant
1016Chavez BriddickArgentina2026-05-19Feiner Bros NEW58Asiya Javayant
1017Arvin AlbaresGermany2026-06-07Truhlar And Truhlar Attys QUALIFIED29Xuxue Feng
1018Isabel BowleyRussia2026-06-02Printing Dimensions QUALIFIED15Xuxue Feng
1019David DarakjyItaly2026-06-13Rangoni Of Florence UNQUALIFIED81Stephen Shaw
1020Clifford RimArgentina2026-06-11Chemel, James L Cpa PROPOSAL79Bernardo Dominic
1021Jeanfrancois VenereIndia2026-06-06Rousseaux, Michael Esq QUALIFIED82Amy Elsner
1022Johnson SergiBrazil2026-06-08Truhlar And Truhlar Attys NEGOTIATION51Elwin Sharvill
1023Tony FollerBrazil2026-05-17Feiner Bros PROPOSAL38Anna Fali
1024Costa DilliardArgentina2026-05-20Benton, John B Jr NEGOTIATION88Stephen Shaw
1025Octavia MaletUnited Kingdom2026-06-14Feltz Printing Service PROPOSAL42Asiya Javayant
1026Munro FerenczAustralia2026-05-20Truhlar And Truhlar Attys NEGOTIATION24Ivan Magalhaes
1027Juan WieserRussia2026-06-06Dorl, James J Esq NEGOTIATION68Amy Elsner
1028Aruna FigeroaAustralia2026-05-29Buckley Miller Wright NEGOTIATION60Xuxue Feng
1029Aruna FigeroaIndia2026-05-22Chapman, Ross E Esq NEGOTIATION63Onyama Limba
1030Faith GillianGermany2026-06-05Commercial Press NEGOTIATION71Asiya Javayant
1031Greenwood BologniaJapan2026-05-22Printing Dimensions RENEWAL6Anna Fali
1032Silvio SlusarskiBrazil2026-05-25Rousseaux, Michael Esq UNQUALIFIED47Amy Elsner
1033Aika InouyeRussia2026-06-08Commercial Press QUALIFIED32Ivan Magalhaes
1034Jennifer AmigonCanada2026-05-24King, Christopher A Esq QUALIFIED29Xuxue Feng
1035James ButtJapan2026-05-31Benton, John B Jr RENEWAL70Bernardo Dominic
1036Wickens NestleJapan2026-06-10Benton, John B Jr QUALIFIED57Onyama Limba
1037Johnson SergiFrance2026-06-01Buckley Miller Wright PROPOSAL92Amy Elsner
1038Aruna FigeroaGermany2026-05-30Chemel, James L Cpa UNQUALIFIED9Elwin Sharvill
1039Ricardo GauchoBrazil2026-06-03Feltz Printing Service PROPOSAL90Ivan Magalhaes
1040Jones VocelkaSpain2026-05-21Buckley Miller Wright NEGOTIATION48Xuxue Feng
1041Izzy GarufiGermany2026-05-17Feiner Bros UNQUALIFIED16Stephen Shaw
1042Greenwood BologniaItaly2026-06-09Dorl, James J Esq PROPOSAL31Stephen Shaw
1043Isabel BowleyAustralia2026-06-04Printing Dimensions NEGOTIATION9Amy Elsner
1044Chavez BriddickRussia2026-05-16Feiner Bros PROPOSAL43Anna Fali
1045Izzy GarufiArgentina2026-05-24Feltz Printing Service QUALIFIED7Asiya Javayant
1046Stacey MacleadGermany2026-06-02Chapman, Ross E Esq QUALIFIED92Onyama Limba
1047Ashley DoeUnited Kingdom2026-06-10Commercial Press PROPOSAL88Ioni Bowcher
1048Costa DilliardSpain2026-05-23Buckley Miller Wright RENEWAL32Ivan Magalhaes
1049Francesco ShinkoUnited Kingdom2026-06-03King, Christopher A Esq UNQUALIFIED1Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Jennifer AmigonRussiaXuxue Feng PROPOSAL
Munro FerenczRussiaStephen Shaw PROPOSAL
Faith GillianUnited KingdomElwin Sharvill RENEWAL
Ivar PaprockiAustraliaIvan Magalhaes NEGOTIATION
Ashley DoeAustraliaAnna Fali UNQUALIFIED
Isabel BowleyIndiaIoni Bowcher QUALIFIED
Munro FerenczUnited KingdomAsiya Javayant NEGOTIATION
Juan WieserIndiaAnna Fali RENEWAL
David DarakjyJapanIoni Bowcher UNQUALIFIED
Ricardo GauchoCanadaOnyama Limba PROPOSAL
Octavia MaletJapanElwin Sharvill UNQUALIFIED
Julie StensethCanadaAnna Fali NEGOTIATION
Juan WieserCanadaOnyama Limba PROPOSAL
Isabel BowleyGermanyBernardo Dominic RENEWAL
Murillo MaletSpainAsiya Javayant NEGOTIATION
Sinclair WaycottGermanyElwin Sharvill PROPOSAL
Octavia MaletJapanAsiya Javayant PROPOSAL
Aika InouyeItalyOnyama Limba RENEWAL
Sinclair WaycottIndiaAmy Elsner PROPOSAL
Aditya KuskoGermanyBernardo Dominic UNQUALIFIED
Johnson SergiUnited KingdomBernardo Dominic QUALIFIED
Emily WhobreyGermanyElwin Sharvill UNQUALIFIED
Octavia MaletGermanyAsiya Javayant PROPOSAL
Adams MorascaCanadaXuxue Feng PROPOSAL
Jeanfrancois VenereArgentinaIvan Magalhaes NEW
Mayumi KolmetzIndiaIvan Magalhaes NEGOTIATION
Smith GlickFranceElwin Sharvill PROPOSAL
Jefferson SchemmerBrazilBernardo Dominic QUALIFIED
Faith GillianItalyStephen Shaw QUALIFIED
Adams MorascaArgentinaXuxue Feng UNQUALIFIED
Ashley DoeFranceAsiya Javayant NEW
Jennifer AmigonAustraliaAnna Fali UNQUALIFIED
Leon OldroydFranceElwin Sharvill NEGOTIATION
Alejandro PerinFranceAnna Fali PROPOSAL
James ButtUnited KingdomAnna Fali UNQUALIFIED
Costa DilliardAustraliaBernardo Dominic QUALIFIED
Deepesh ChuiAustraliaAnna Fali QUALIFIED
Mayumi KolmetzItalyAmy Elsner PROPOSAL
Arvin AlbaresFranceOnyama Limba UNQUALIFIED
Jennifer AmigonGermanyBernardo Dominic QUALIFIED
Sinclair WaycottAustraliaAnna Fali PROPOSAL
Mujtaba NickaBrazilXuxue Feng PROPOSAL
Isabel BowleyIndiaAmy Elsner RENEWAL
Misaki RoysterCanadaBernardo Dominic RENEWAL
Silvio SlusarskiItalyAnna Fali RENEWAL
Jeanfrancois VenereIndiaOnyama Limba QUALIFIED
Leon OldroydBrazilAmy Elsner UNQUALIFIED
Jennifer AmigonIndiaXuxue Feng NEGOTIATION
Deepesh ChuiAustraliaStephen Shaw NEGOTIATION
Maisha RulapaughGermanyAnna Fali PROPOSAL
Frozen Columns
Name
Jeanfrancois Venere
Wickens Nestle
Aika Inouye
Smith Glick
Ashley Doe
David Darakjy
Sinclair Waycott
Maria Marrier
Deepesh Chui
Izzy Garufi
Murillo Malet
Faith Gillian
Julie Stenseth
Leja Caldarera
Leon Oldroyd
Leja Caldarera
Octavia Malet
Wickens Nestle
Rodrigues Campain
Jefferson Schemmer
Jefferson Schemmer
Darci Poquette
Maria Marrier
Ivar Paprocki
Francesco Shinko
Isabel Bowley
Greenwood Bolognia
Leja Caldarera
Jennifer Amigon
Kadeem Flosi
Jeanfrancois Venere
Emily Whobrey
Claire Tollner
Nicolas Iturbide
Aruna Figeroa
Murillo Malet
Jefferson Schemmer
Mujtaba Nicka
Greenwood Bolognia
Leon Oldroyd
Antonio Caudy
Chavez Briddick
Clifford Rim
Ricardo Gaucho
Costa Dilliard
Jefferson Schemmer
Antonio Caudy
Leon Oldroyd
Jones Vocelka
Jeanfrancois Venere
IdCountryDate
1000India2026-05-26
1001Italy2026-06-10
1002United Kingdom2026-05-29
1003Spain2026-06-08
1004Russia2026-05-25
1005Russia2026-06-02
1006Brazil2026-05-17
1007Japan2026-06-13
1008France2026-06-11
1009Canada2026-06-12
1010Japan2026-06-05
1011Germany2026-05-19
1012Brazil2026-05-27
1013Canada2026-06-06
1014United Kingdom2026-05-18
1015Brazil2026-05-19
1016Spain2026-05-30
1017Spain2026-05-21
1018France2026-05-24
1019Japan2026-06-02
1020Germany2026-06-12
1021France2026-05-19
1022Brazil2026-06-06
1023Spain2026-06-07
1024Canada2026-05-26
1025Italy2026-06-13
1026Japan2026-06-05
1027Spain2026-05-23
1028France2026-05-22
1029Germany2026-05-30
1030Japan2026-06-03
1031Australia2026-06-02
1032Japan2026-05-26
1033Australia2026-06-14
1034Argentina2026-05-30
1035France2026-05-16
1036Argentina2026-06-02
1037Brazil2026-05-31
1038United Kingdom2026-05-28
1039Brazil2026-05-19
1040Brazil2026-05-17
1041Russia2026-06-03
1042Argentina2026-06-07
1043Canada2026-06-02
1044Argentina2026-06-05
1045Japan2026-05-31
1046India2026-06-08
1047Italy2026-05-28
1048Canada2026-06-10
1049Japan2026-05-19

On-Demand Data

NameIdCountryDate
Jefferson Schemmer1000France2026-05-24
Darci Poquette1001India2026-06-04
Clifford Rim1002Russia2026-06-03
Silvio Slusarski1003Spain2026-05-25
Nicolas Iturbide1004Russia2026-05-27
Aruna Figeroa1005United Kingdom2026-05-21
Salvatore Stockham1006Italy2026-06-08
Johnson Sergi1007Argentina2026-05-29
Ivar Paprocki1008Spain2026-05-31
Smith Glick1009Argentina2026-05-25
Nicolas Iturbide1010Brazil2026-05-24
Emily Whobrey1011United Kingdom2026-06-05
Clifford Rim1012Brazil2026-06-11
Silvio Slusarski1013Russia2026-06-14
Francesco Shinko1014Brazil2026-05-29
Jeanfrancois Venere1015Germany2026-05-25
Jones Vocelka1016Russia2026-06-11
Jennifer Amigon1017Australia2026-05-29
Mayumi Kolmetz1018Brazil2026-06-07
Emily Whobrey1019France2026-06-10
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Emily WhobreyJapanStephen Shaw PROPOSAL
Francesco ShinkoBrazilAnna Fali NEW
Mayumi KolmetzSpainBernardo Dominic PROPOSAL
Jennifer AmigonCanadaOnyama Limba NEGOTIATION
Octavia MaletUnited KingdomStephen Shaw QUALIFIED
Cody SaylorsUnited KingdomIoni Bowcher NEGOTIATION
Jones VocelkaBrazilElwin Sharvill RENEWAL
Faith GillianItalyElwin Sharvill QUALIFIED
Kadeem FlosiAustraliaStephen Shaw PROPOSAL
Morrow RutaUnited KingdomIoni Bowcher UNQUALIFIED
Johnson SergiIndiaStephen Shaw NEW
Ricardo GauchoGermanyAnna Fali UNQUALIFIED
Morrow RutaJapanIoni Bowcher PROPOSAL
Nicolas IturbideUnited KingdomXuxue Feng NEGOTIATION
Salvatore StockhamSpainAsiya Javayant QUALIFIED
Mujtaba NickaArgentinaAnna Fali NEGOTIATION
Kadeem FlosiSpainBernardo Dominic NEGOTIATION
Morrow RutaBrazilXuxue Feng NEW
Jefferson SchemmerIndiaStephen Shaw QUALIFIED
Tony FollerFranceIvan Magalhaes UNQUALIFIED
Deepesh ChuiGermanyElwin Sharvill PROPOSAL
Sinclair WaycottBrazilIoni Bowcher UNQUALIFIED
Ashley DoeBrazilAsiya Javayant NEGOTIATION
Greenwood BologniaBrazilIvan Magalhaes RENEWAL
Jeanfrancois VenereUnited KingdomElwin Sharvill QUALIFIED
Murillo MaletIndiaStephen Shaw RENEWAL
Ashley DoeAustraliaBernardo Dominic NEGOTIATION
Kaitlin OstroskyBrazilAnna Fali QUALIFIED
Costa DilliardItalyAsiya Javayant UNQUALIFIED
Stacey MacleadAustraliaIvan Magalhaes NEW
Julie StensethUnited KingdomAsiya Javayant NEGOTIATION
Alejandro PerinGermanyOnyama Limba UNQUALIFIED
Munro FerenczCanadaAmy Elsner PROPOSAL
Alejandro PerinIndiaElwin Sharvill NEGOTIATION
Clifford RimSpainAnna Fali PROPOSAL
Octavia MaletAustraliaElwin Sharvill RENEWAL
Johnson SergiIndiaBernardo Dominic QUALIFIED
Jefferson SchemmerRussiaAmy Elsner NEW
Aruna FigeroaArgentinaXuxue Feng PROPOSAL
Nicolas IturbideGermanyAsiya Javayant NEGOTIATION

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