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
Aditya KuskoRussiaXuxue Feng RENEWAL
Mayumi KolmetzRussiaAnna Fali UNQUALIFIED
Francesco ShinkoItalyAnna Fali NEW
Misaki RoysterArgentinaXuxue Feng RENEWAL
Costa DilliardCanadaOnyama Limba QUALIFIED
Jones VocelkaBrazilXuxue Feng NEGOTIATION
Deepesh ChuiGermanyIoni Bowcher RENEWAL
Cody SaylorsCanadaElwin Sharvill UNQUALIFIED
Sinclair WaycottIndiaStephen Shaw UNQUALIFIED
Juan WieserUnited KingdomOnyama Limba QUALIFIED
Francesco ShinkoItalyIvan Magalhaes RENEWAL
Stacey MacleadAustraliaOnyama Limba PROPOSAL
James ButtGermanyElwin Sharvill QUALIFIED
Mujtaba NickaAustraliaBernardo Dominic NEGOTIATION
Cody SaylorsFranceAmy Elsner NEW
Greenwood BologniaItalyBernardo Dominic NEW
Aruna FigeroaIndiaAsiya Javayant PROPOSAL
Ashley DoeUnited KingdomAnna Fali UNQUALIFIED
Morrow RutaItalyIvan Magalhaes UNQUALIFIED
Francesco ShinkoBrazilIoni Bowcher PROPOSAL
Kaitlin OstroskySpainXuxue Feng NEW
Salvatore StockhamAustraliaAsiya Javayant PROPOSAL
Arvin AlbaresJapanBernardo Dominic NEW
Silvio SlusarskiIndiaStephen Shaw NEGOTIATION
Leon OldroydAustraliaXuxue Feng RENEWAL
Sinclair WaycottIndiaElwin Sharvill UNQUALIFIED
Adams MorascaBrazilIoni Bowcher NEGOTIATION
Stacey MacleadRussiaBernardo Dominic QUALIFIED
Adams MorascaIndiaStephen Shaw NEW
Ashley DoeCanadaBernardo Dominic NEGOTIATION
Kadeem FlosiFranceIoni Bowcher RENEWAL
Wickens NestleBrazilElwin Sharvill RENEWAL
Silvio SlusarskiGermanyStephen Shaw UNQUALIFIED
Jeanfrancois VenereJapanAmy Elsner QUALIFIED
Rodrigues CampainRussiaStephen Shaw NEGOTIATION
James ButtJapanAsiya Javayant NEGOTIATION
Jones VocelkaBrazilBernardo Dominic PROPOSAL
Juan WieserItalyAmy Elsner QUALIFIED
Claire TollnerUnited KingdomAmy Elsner UNQUALIFIED
Rodrigues CampainBrazilBernardo Dominic RENEWAL
Adams MorascaGermanyAnna Fali NEGOTIATION
Maria MarrierUnited KingdomAnna Fali RENEWAL
Chavez BriddickItalyStephen Shaw NEGOTIATION
Leon OldroydItalyIoni Bowcher RENEWAL
Murillo MaletIndiaAsiya Javayant NEW
Silvio SlusarskiItalyStephen Shaw RENEWAL
Jones VocelkaUnited KingdomIvan Magalhaes NEW
Octavia MaletAustraliaBernardo Dominic UNQUALIFIED
Misaki RoysterIndiaStephen Shaw PROPOSAL
Cody SaylorsUnited KingdomXuxue Feng NEW
Horizontal
NameCountryRepresentativeStatus
Chavez BriddickSpainXuxue Feng PROPOSAL
Murillo MaletCanadaIvan Magalhaes RENEWAL
Jones VocelkaAustraliaElwin Sharvill PROPOSAL
Emily WhobreyAustraliaOnyama Limba NEW
Jefferson SchemmerArgentinaIvan Magalhaes NEW
James ButtGermanyIoni Bowcher NEGOTIATION
Emily WhobreySpainIvan Magalhaes UNQUALIFIED
Jeanfrancois VenereIndiaElwin Sharvill PROPOSAL
Maria MarrierAustraliaBernardo Dominic QUALIFIED
Nicolas IturbideGermanyAnna Fali PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Leon OldroydRussia2026-06-16King, Christopher A Esq QUALIFIED12Xuxue Feng
1001Salvatore StockhamFrance2026-06-12Rangoni Of Florence RENEWAL94Amy Elsner
1002Jones VocelkaGermany2026-06-06Truhlar And Truhlar Attys PROPOSAL10Ivan Magalhaes
1003Maisha RulapaughAustralia2026-06-02Chemel, James L Cpa QUALIFIED6Amy Elsner
1004Aditya KuskoArgentina2026-06-15Printing Dimensions RENEWAL20Stephen Shaw
1005Adams MorascaSpain2026-05-22Morlong Associates NEW46Ivan Magalhaes
1006Julie StensethAustralia2026-06-19Rangoni Of Florence QUALIFIED29Bernardo Dominic
1007Maisha RulapaughArgentina2026-06-15Chanay, Jeffrey A Esq RENEWAL99Ivan Magalhaes
1008Ricardo GauchoAustralia2026-05-27Feiner Bros NEW54Elwin Sharvill
1009Wickens NestleAustralia2026-06-08Chapman, Ross E Esq QUALIFIED52Ioni Bowcher
1010Clifford RimItaly2026-06-11Commercial Press NEGOTIATION92Ivan Magalhaes
1011Clifford RimBrazil2026-06-06Chemel, James L Cpa UNQUALIFIED97Bernardo Dominic
1012Ivar PaprockiArgentina2026-06-09Dorl, James J Esq RENEWAL24Xuxue Feng
1013Izzy GarufiGermany2026-06-04Printing Dimensions NEW41Elwin Sharvill
1014Maria MarrierUnited Kingdom2026-05-21Printing Dimensions RENEWAL64Ivan Magalhaes
1015Adams MorascaCanada2026-05-22Rangoni Of Florence NEGOTIATION49Elwin Sharvill
1016Morrow RutaRussia2026-06-12Buckley Miller Wright UNQUALIFIED31Xuxue Feng
1017Stacey MacleadItaly2026-06-01Printing Dimensions RENEWAL46Asiya Javayant
1018Smith GlickCanada2026-06-07Rangoni Of Florence NEW6Stephen Shaw
1019Costa DilliardUnited Kingdom2026-05-30Chapman, Ross E Esq RENEWAL75Amy Elsner
1020Greenwood BologniaUnited Kingdom2026-05-27Morlong Associates RENEWAL37Asiya Javayant
1021Darci PoquetteSpain2026-06-07Chapman, Ross E Esq PROPOSAL9Elwin Sharvill
1022Ricardo GauchoAustralia2026-05-28Chanay, Jeffrey A Esq NEGOTIATION57Anna Fali
1023Alejandro PerinUnited Kingdom2026-06-06Buckley Miller Wright NEW66Xuxue Feng
1024Clifford RimFrance2026-06-12Feltz Printing Service RENEWAL5Ioni Bowcher
1025Murillo MaletItaly2026-06-06Rousseaux, Michael Esq PROPOSAL88Onyama Limba
1026Kadeem FlosiUnited Kingdom2026-05-23Benton, John B Jr PROPOSAL37Asiya Javayant
1027Costa DilliardRussia2026-06-13Feiner Bros RENEWAL35Xuxue Feng
1028Ivar PaprockiItaly2026-06-04Chemel, James L Cpa NEW23Anna Fali
1029Leon OldroydSpain2026-05-23Rousseaux, Michael Esq QUALIFIED59Amy Elsner
1030Nicolas IturbideIndia2026-06-01Dorl, James J Esq UNQUALIFIED67Elwin Sharvill
1031Kaitlin OstroskySpain2026-06-11Buckley Miller Wright NEGOTIATION85Asiya Javayant
1032Mayumi KolmetzFrance2026-05-31Feiner Bros RENEWAL96Anna Fali
1033Octavia MaletBrazil2026-05-31Chemel, James L Cpa NEGOTIATION96Bernardo Dominic
1034Jones VocelkaBrazil2026-06-08Chanay, Jeffrey A Esq NEGOTIATION64Stephen Shaw
1035Emily WhobreyFrance2026-05-22Chapman, Ross E Esq PROPOSAL22Bernardo Dominic
1036Kadeem FlosiCanada2026-06-03Chemel, James L Cpa RENEWAL75Stephen Shaw
1037Claire TollnerRussia2026-06-17Commercial Press UNQUALIFIED43Anna Fali
1038David DarakjySpain2026-06-01Feltz Printing Service RENEWAL63Ioni Bowcher
1039James ButtAustralia2026-05-29Dorl, James J Esq QUALIFIED79Stephen Shaw
1040Jennifer AmigonGermany2026-05-27Chemel, James L Cpa PROPOSAL36Ioni Bowcher
1041Smith GlickAustralia2026-05-28Morlong Associates QUALIFIED41Xuxue Feng
1042Rodrigues CampainRussia2026-06-09Benton, John B Jr PROPOSAL15Xuxue Feng
1043Izzy GarufiJapan2026-06-09Chemel, James L Cpa NEW99Stephen Shaw
1044David DarakjyUnited Kingdom2026-05-22Buckley Miller Wright QUALIFIED55Asiya Javayant
1045Costa DilliardFrance2026-06-18Morlong Associates NEW78Elwin Sharvill
1046Jones VocelkaUnited Kingdom2026-06-11Feiner Bros PROPOSAL0Xuxue Feng
1047Silvio SlusarskiUnited Kingdom2026-06-15Feltz Printing Service QUALIFIED38Xuxue Feng
1048Morrow RutaRussia2026-06-17Chapman, Ross E Esq PROPOSAL52Bernardo Dominic
1049Tony FollerBrazil2026-06-01Printing Dimensions UNQUALIFIED5Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Silvio SlusarskiRussiaIvan Magalhaes NEW
Deepesh ChuiUnited KingdomAnna Fali UNQUALIFIED
Murillo MaletJapanXuxue Feng PROPOSAL
Leon OldroydFranceAsiya Javayant UNQUALIFIED
Rodrigues CampainSpainAsiya Javayant NEW
David DarakjyJapanIoni Bowcher NEW
Aika InouyeUnited KingdomIvan Magalhaes NEGOTIATION
Jeanfrancois VenereRussiaStephen Shaw NEGOTIATION
Rodrigues CampainFranceAmy Elsner PROPOSAL
Maisha RulapaughAustraliaAsiya Javayant NEW
Chavez BriddickGermanyIoni Bowcher UNQUALIFIED
Faith GillianGermanyIvan Magalhaes UNQUALIFIED
Antonio CaudyFranceStephen Shaw QUALIFIED
Jones VocelkaBrazilAmy Elsner NEW
James ButtGermanyXuxue Feng NEW
Jones VocelkaSpainStephen Shaw QUALIFIED
Izzy GarufiSpainAnna Fali QUALIFIED
Jennifer AmigonItalyBernardo Dominic PROPOSAL
Juan WieserCanadaOnyama Limba NEW
Arvin AlbaresCanadaIvan Magalhaes NEGOTIATION
Tony FollerItalyBernardo Dominic NEW
Cody SaylorsItalyOnyama Limba NEW
Johnson SergiRussiaBernardo Dominic QUALIFIED
Leja CaldareraFranceElwin Sharvill RENEWAL
Jennifer AmigonItalyXuxue Feng QUALIFIED
Adams MorascaSpainAsiya Javayant RENEWAL
Deepesh ChuiJapanAnna Fali RENEWAL
Francesco ShinkoArgentinaIvan Magalhaes NEW
Francesco ShinkoItalyAnna Fali UNQUALIFIED
Julie StensethUnited KingdomXuxue Feng NEGOTIATION
Maria MarrierSpainXuxue Feng NEW
Maisha RulapaughSpainElwin Sharvill QUALIFIED
Adams MorascaSpainElwin Sharvill NEW
Aruna FigeroaItalyXuxue Feng UNQUALIFIED
Johnson SergiIndiaElwin Sharvill UNQUALIFIED
Alejandro PerinIndiaBernardo Dominic NEW
David DarakjyGermanyElwin Sharvill NEW
Adams MorascaItalyStephen Shaw RENEWAL
Izzy GarufiArgentinaAmy Elsner NEW
Smith GlickIndiaAmy Elsner PROPOSAL
Maria MarrierCanadaOnyama Limba PROPOSAL
Kaitlin OstroskyItalyBernardo Dominic NEW
Silvio SlusarskiArgentinaBernardo Dominic NEGOTIATION
Izzy GarufiFranceIvan Magalhaes QUALIFIED
Chavez BriddickSpainAnna Fali PROPOSAL
Isabel BowleyAustraliaAsiya Javayant RENEWAL
Ricardo GauchoRussiaAnna Fali QUALIFIED
Ricardo GauchoItalyOnyama Limba NEGOTIATION
Nicolas IturbideBrazilElwin Sharvill RENEWAL
Wickens NestleAustraliaStephen Shaw QUALIFIED
Frozen Columns
Name
Smith Glick
Tony Foller
Ricardo Gaucho
Rodrigues Campain
Alejandro Perin
Maisha Rulapaugh
Smith Glick
Jones Vocelka
Kaitlin Ostrosky
Chavez Briddick
Arvin Albares
Julie Stenseth
Mayumi Kolmetz
Ivar Paprocki
Claire Tollner
Chavez Briddick
Darci Poquette
Deepesh Chui
Silvio Slusarski
Kaitlin Ostrosky
Costa Dilliard
Maisha Rulapaugh
Wickens Nestle
Smith Glick
Izzy Garufi
Adams Morasca
Cody Saylors
Jefferson Schemmer
Costa Dilliard
Emily Whobrey
Leon Oldroyd
Juan Wieser
Claire Tollner
Salvatore Stockham
Mujtaba Nicka
Costa Dilliard
Chavez Briddick
Emily Whobrey
Johnson Sergi
Maria Marrier
Maisha Rulapaugh
Salvatore Stockham
Nicolas Iturbide
Alejandro Perin
Misaki Royster
Aditya Kusko
Mujtaba Nicka
Adams Morasca
Rodrigues Campain
Emily Whobrey
IdCountryDate
1000Australia2026-05-23
1001Russia2026-05-25
1002United Kingdom2026-06-18
1003United Kingdom2026-06-15
1004Spain2026-06-12
1005Argentina2026-06-14
1006Spain2026-06-14
1007Germany2026-05-31
1008Italy2026-06-01
1009India2026-06-16
1010Russia2026-06-17
1011Argentina2026-05-27
1012Japan2026-06-19
1013Canada2026-06-03
1014Canada2026-05-27
1015Germany2026-05-27
1016Italy2026-06-10
1017Australia2026-05-30
1018Russia2026-06-07
1019Brazil2026-05-24
1020Germany2026-06-07
1021Japan2026-06-14
1022Russia2026-06-17
1023Brazil2026-06-18
1024India2026-06-16
1025Brazil2026-06-03
1026Australia2026-06-05
1027Spain2026-06-09
1028Argentina2026-06-05
1029Brazil2026-05-23
1030Germany2026-05-31
1031Italy2026-06-05
1032Canada2026-06-07
1033Russia2026-05-30
1034Australia2026-05-22
1035Canada2026-05-26
1036United Kingdom2026-05-26
1037Russia2026-05-28
1038Russia2026-05-21
1039Japan2026-06-12
1040India2026-06-04
1041France2026-05-24
1042Australia2026-06-16
1043Japan2026-06-13
1044Argentina2026-06-12
1045Australia2026-06-10
1046Brazil2026-05-23
1047France2026-05-28
1048Russia2026-06-09
1049Australia2026-06-11

On-Demand Data

NameIdCountryDate
Misaki Royster1000Japan2026-06-16
Aruna Figeroa1001India2026-05-29
Faith Gillian1002Argentina2026-06-08
Maisha Rulapaugh1003Japan2026-05-25
Jefferson Schemmer1004Germany2026-06-02
Kadeem Flosi1005United Kingdom2026-06-19
Nicolas Iturbide1006Australia2026-06-16
Morrow Ruta1007Brazil2026-05-22
Cody Saylors1008Spain2026-06-01
Darci Poquette1009Spain2026-06-10
Mayumi Kolmetz1010Japan2026-06-18
Ricardo Gaucho1011Argentina2026-05-23
Rodrigues Campain1012Australia2026-06-14
Silvio Slusarski1013Brazil2026-06-15
Juan Wieser1014Russia2026-06-04
Ivar Paprocki1015Australia2026-06-19
Isabel Bowley1016Brazil2026-06-16
Clifford Rim1017Germany2026-06-01
Nicolas Iturbide1018Germany2026-06-19
Mayumi Kolmetz1019Argentina2026-06-16
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Izzy GarufiAustraliaAnna Fali RENEWAL
Adams MorascaUnited KingdomStephen Shaw NEGOTIATION
Emily WhobreyFranceIvan Magalhaes UNQUALIFIED
Juan WieserSpainAnna Fali NEGOTIATION
David DarakjyBrazilAmy Elsner PROPOSAL
Antonio CaudyUnited KingdomStephen Shaw RENEWAL
Sinclair WaycottGermanyStephen Shaw PROPOSAL
Silvio SlusarskiIndiaOnyama Limba PROPOSAL
Leja CaldareraGermanyAmy Elsner NEW
Nicolas IturbideIndiaStephen Shaw QUALIFIED
Silvio SlusarskiAustraliaElwin Sharvill NEGOTIATION
Alejandro PerinRussiaXuxue Feng PROPOSAL
Claire TollnerCanadaIvan Magalhaes NEGOTIATION
Adams MorascaGermanyElwin Sharvill NEGOTIATION
Juan WieserUnited KingdomOnyama Limba UNQUALIFIED
Antonio CaudyBrazilIvan Magalhaes NEGOTIATION
Stacey MacleadGermanyElwin Sharvill QUALIFIED
Salvatore StockhamIndiaAnna Fali NEW
Isabel BowleyJapanAnna Fali NEW
Wickens NestleArgentinaAsiya Javayant UNQUALIFIED
Jennifer AmigonJapanAmy Elsner QUALIFIED
David DarakjyUnited KingdomElwin Sharvill QUALIFIED
Kadeem FlosiArgentinaBernardo Dominic UNQUALIFIED
Tony FollerIndiaAnna Fali UNQUALIFIED
Morrow RutaGermanyIoni Bowcher RENEWAL
Mayumi KolmetzUnited KingdomOnyama Limba NEGOTIATION
Kaitlin OstroskySpainIvan Magalhaes PROPOSAL
Rodrigues CampainUnited KingdomAmy Elsner UNQUALIFIED
Costa DilliardIndiaIoni Bowcher NEW
Munro FerenczSpainXuxue Feng QUALIFIED
Darci PoquetteAustraliaIvan Magalhaes QUALIFIED
Darci PoquetteIndiaBernardo Dominic RENEWAL
Alejandro PerinRussiaStephen Shaw RENEWAL
Ivar PaprockiBrazilIvan Magalhaes PROPOSAL
Francesco ShinkoSpainAmy Elsner NEGOTIATION
Silvio SlusarskiIndiaStephen Shaw NEW
Aditya KuskoRussiaXuxue Feng UNQUALIFIED
Kaitlin OstroskyGermanyElwin Sharvill QUALIFIED
Cody SaylorsFranceAsiya Javayant UNQUALIFIED
Smith GlickGermanyStephen Shaw 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>