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
Aika InouyeSpainAnna Fali NEW
Rodrigues CampainFranceElwin Sharvill RENEWAL
Aruna FigeroaJapanIvan Magalhaes UNQUALIFIED
Julie StensethBrazilAnna Fali RENEWAL
Izzy GarufiBrazilAnna Fali NEGOTIATION
Jennifer AmigonUnited KingdomElwin Sharvill RENEWAL
Alejandro PerinCanadaElwin Sharvill PROPOSAL
Clifford RimAustraliaBernardo Dominic RENEWAL
Wickens NestleGermanyAsiya Javayant RENEWAL
Jefferson SchemmerSpainBernardo Dominic NEW
Emily WhobreyUnited KingdomXuxue Feng UNQUALIFIED
Isabel BowleyCanadaOnyama Limba UNQUALIFIED
Ricardo GauchoFranceBernardo Dominic UNQUALIFIED
Smith GlickRussiaAsiya Javayant UNQUALIFIED
Ashley DoeAustraliaBernardo Dominic UNQUALIFIED
Misaki RoysterGermanyAnna Fali NEGOTIATION
Jones VocelkaBrazilAsiya Javayant UNQUALIFIED
Arvin AlbaresArgentinaAsiya Javayant RENEWAL
Leon OldroydSpainOnyama Limba NEGOTIATION
Deepesh ChuiCanadaAsiya Javayant NEGOTIATION
Francesco ShinkoUnited KingdomAnna Fali QUALIFIED
Silvio SlusarskiArgentinaElwin Sharvill NEW
Chavez BriddickJapanBernardo Dominic NEW
David DarakjyCanadaStephen Shaw NEGOTIATION
Smith GlickCanadaIvan Magalhaes NEGOTIATION
Clifford RimIndiaXuxue Feng UNQUALIFIED
Rodrigues CampainRussiaAsiya Javayant QUALIFIED
Aruna FigeroaJapanIvan Magalhaes NEW
Julie StensethItalyIoni Bowcher UNQUALIFIED
Antonio CaudyBrazilAmy Elsner PROPOSAL
Juan WieserAustraliaElwin Sharvill RENEWAL
Leon OldroydUnited KingdomBernardo Dominic UNQUALIFIED
Aditya KuskoGermanyXuxue Feng RENEWAL
Emily WhobreyAustraliaIvan Magalhaes QUALIFIED
Izzy GarufiGermanyAsiya Javayant NEGOTIATION
Maria MarrierJapanAnna Fali NEGOTIATION
Isabel BowleyItalyStephen Shaw NEGOTIATION
Ricardo GauchoAustraliaOnyama Limba NEGOTIATION
Mayumi KolmetzJapanIoni Bowcher NEW
Chavez BriddickUnited KingdomStephen Shaw PROPOSAL
Clifford RimJapanBernardo Dominic UNQUALIFIED
Faith GillianItalyAmy Elsner RENEWAL
Morrow RutaItalyAnna Fali UNQUALIFIED
Mujtaba NickaCanadaElwin Sharvill RENEWAL
Isabel BowleyCanadaAnna Fali NEGOTIATION
Rodrigues CampainCanadaStephen Shaw RENEWAL
Smith GlickJapanBernardo Dominic UNQUALIFIED
Aruna FigeroaItalyIvan Magalhaes NEW
Adams MorascaItalyStephen Shaw NEGOTIATION
Kaitlin OstroskyIndiaIvan Magalhaes NEW
Horizontal
NameCountryRepresentativeStatus
Francesco ShinkoAustraliaAmy Elsner NEGOTIATION
Chavez BriddickJapanXuxue Feng QUALIFIED
Ashley DoeFranceElwin Sharvill PROPOSAL
Jennifer AmigonSpainElwin Sharvill NEW
Munro FerenczIndiaAsiya Javayant UNQUALIFIED
Kaitlin OstroskyRussiaOnyama Limba UNQUALIFIED
Kadeem FlosiCanadaIoni Bowcher NEGOTIATION
Emily WhobreyCanadaStephen Shaw QUALIFIED
Clifford RimSpainXuxue Feng RENEWAL
Emily WhobreyArgentinaAsiya Javayant NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Smith GlickFrance2025-10-04Feltz Printing Service RENEWAL90Ioni Bowcher
1001Chavez BriddickSpain2025-10-06Chapman, Ross E Esq UNQUALIFIED70Ivan Magalhaes
1002Darci PoquetteItaly2025-09-29Chemel, James L Cpa RENEWAL25Onyama Limba
1003Greenwood BologniaItaly2025-10-13Buckley Miller Wright PROPOSAL62Elwin Sharvill
1004Ricardo GauchoCanada2025-10-10Chanay, Jeffrey A Esq NEW41Amy Elsner
1005Adams MorascaArgentina2025-10-10Feltz Printing Service QUALIFIED57Stephen Shaw
1006Isabel BowleyIndia2025-09-29Feltz Printing Service RENEWAL92Onyama Limba
1007Jeanfrancois VenereRussia2025-10-10Buckley Miller Wright PROPOSAL13Elwin Sharvill
1008Smith GlickAustralia2025-09-29Dorl, James J Esq NEW2Onyama Limba
1009Octavia MaletGermany2025-09-21Chanay, Jeffrey A Esq PROPOSAL92Amy Elsner
1010Stacey MacleadSpain2025-10-14Feiner Bros NEW85Xuxue Feng
1011Deepesh ChuiSpain2025-10-10Feltz Printing Service NEW17Elwin Sharvill
1012Chavez BriddickIndia2025-09-25Printing Dimensions RENEWAL63Xuxue Feng
1013Aditya KuskoSpain2025-09-25Printing Dimensions PROPOSAL51Stephen Shaw
1014Costa DilliardCanada2025-09-25Dorl, James J Esq UNQUALIFIED37Onyama Limba
1015David DarakjyItaly2025-10-01Feiner Bros QUALIFIED55Ioni Bowcher
1016Jones VocelkaJapan2025-09-27King, Christopher A Esq QUALIFIED31Xuxue Feng
1017Emily WhobreyBrazil2025-10-17Commercial Press PROPOSAL21Bernardo Dominic
1018Munro FerenczRussia2025-10-10King, Christopher A Esq UNQUALIFIED68Onyama Limba
1019Greenwood BologniaUnited Kingdom2025-10-15Truhlar And Truhlar Attys NEGOTIATION18Elwin Sharvill
1020Clifford RimUnited Kingdom2025-09-27Dorl, James J Esq QUALIFIED0Asiya Javayant
1021Rodrigues CampainBrazil2025-10-10Chanay, Jeffrey A Esq PROPOSAL57Elwin Sharvill
1022Tony FollerItaly2025-10-11Chemel, James L Cpa QUALIFIED28Ioni Bowcher
1023Silvio SlusarskiBrazil2025-10-10Rousseaux, Michael Esq UNQUALIFIED74Elwin Sharvill
1024Misaki RoysterIndia2025-10-01Feiner Bros UNQUALIFIED55Amy Elsner
1025David DarakjySpain2025-10-03Commercial Press QUALIFIED95Bernardo Dominic
1026Leon OldroydRussia2025-10-10Truhlar And Truhlar Attys UNQUALIFIED3Onyama Limba
1027Aika InouyeRussia2025-10-17Benton, John B Jr NEW78Bernardo Dominic
1028Ricardo GauchoSpain2025-10-04Truhlar And Truhlar Attys NEW32Ioni Bowcher
1029Smith GlickUnited Kingdom2025-09-26Chapman, Ross E Esq UNQUALIFIED90Amy Elsner
1030Izzy GarufiFrance2025-10-08Feiner Bros NEW11Ioni Bowcher
1031Mujtaba NickaUnited Kingdom2025-10-09Dorl, James J Esq UNQUALIFIED37Onyama Limba
1032Jones VocelkaGermany2025-10-08Rangoni Of Florence NEGOTIATION11Ivan Magalhaes
1033Leon OldroydSpain2025-09-22Dorl, James J Esq PROPOSAL35Ivan Magalhaes
1034Wickens NestleItaly2025-10-04Printing Dimensions NEW12Bernardo Dominic
1035Tony FollerItaly2025-10-06King, Christopher A Esq PROPOSAL18Ioni Bowcher
1036Francesco ShinkoIndia2025-09-23Chemel, James L Cpa NEGOTIATION31Amy Elsner
1037Leja CaldareraUnited Kingdom2025-09-21Chanay, Jeffrey A Esq PROPOSAL48Ivan Magalhaes
1038Juan WieserRussia2025-10-16Chanay, Jeffrey A Esq PROPOSAL80Onyama Limba
1039Octavia MaletUnited Kingdom2025-10-19Chapman, Ross E Esq UNQUALIFIED6Bernardo Dominic
1040Ashley DoeFrance2025-09-29Printing Dimensions QUALIFIED59Onyama Limba
1041James ButtArgentina2025-09-21Printing Dimensions PROPOSAL21Elwin Sharvill
1042Izzy GarufiItaly2025-09-29Feiner Bros NEGOTIATION97Asiya Javayant
1043Rodrigues CampainUnited Kingdom2025-10-04Printing Dimensions NEW35Xuxue Feng
1044Sinclair WaycottFrance2025-10-14Dorl, James J Esq NEGOTIATION8Onyama Limba
1045Jefferson SchemmerArgentina2025-10-15Chanay, Jeffrey A Esq NEGOTIATION82Elwin Sharvill
1046James ButtArgentina2025-10-20Feltz Printing Service PROPOSAL45Ioni Bowcher
1047Aditya KuskoAustralia2025-09-22Buckley Miller Wright RENEWAL18Anna Fali
1048Julie StensethIndia2025-10-16Rangoni Of Florence RENEWAL79Ioni Bowcher
1049Nicolas IturbideRussia2025-10-03Chemel, James L Cpa NEGOTIATION9Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Munro FerenczArgentinaStephen Shaw PROPOSAL
Johnson SergiUnited KingdomAsiya Javayant UNQUALIFIED
Silvio SlusarskiAustraliaIoni Bowcher RENEWAL
Aditya KuskoGermanyBernardo Dominic RENEWAL
Murillo MaletIndiaAsiya Javayant UNQUALIFIED
Munro FerenczIndiaAsiya Javayant NEGOTIATION
Antonio CaudyUnited KingdomAsiya Javayant UNQUALIFIED
Jeanfrancois VenereSpainAnna Fali PROPOSAL
Ricardo GauchoSpainAmy Elsner RENEWAL
Sinclair WaycottGermanyIvan Magalhaes NEGOTIATION
Jefferson SchemmerRussiaIvan Magalhaes UNQUALIFIED
Tony FollerAustraliaAsiya Javayant NEW
Ivar PaprockiCanadaAnna Fali RENEWAL
Aika InouyeFranceAmy Elsner PROPOSAL
Kaitlin OstroskyRussiaIvan Magalhaes RENEWAL
Antonio CaudyArgentinaAnna Fali RENEWAL
Jones VocelkaItalyElwin Sharvill PROPOSAL
Mayumi KolmetzFranceAmy Elsner NEGOTIATION
Kadeem FlosiRussiaAsiya Javayant NEW
Rodrigues CampainUnited KingdomAsiya Javayant UNQUALIFIED
Francesco ShinkoSpainAsiya Javayant RENEWAL
Emily WhobreyAustraliaElwin Sharvill RENEWAL
Leon OldroydArgentinaBernardo Dominic UNQUALIFIED
Greenwood BologniaUnited KingdomAsiya Javayant QUALIFIED
Aruna FigeroaIndiaIoni Bowcher NEW
Munro FerenczItalyAnna Fali NEW
Misaki RoysterFranceIoni Bowcher NEW
Stacey MacleadCanadaAnna Fali UNQUALIFIED
Sinclair WaycottAustraliaAmy Elsner UNQUALIFIED
Darci PoquetteSpainBernardo Dominic NEGOTIATION
Deepesh ChuiArgentinaAmy Elsner UNQUALIFIED
Mayumi KolmetzIndiaAmy Elsner PROPOSAL
Jennifer AmigonAustraliaIoni Bowcher UNQUALIFIED
Darci PoquetteBrazilElwin Sharvill UNQUALIFIED
Maria MarrierFranceElwin Sharvill QUALIFIED
Aruna FigeroaFranceElwin Sharvill RENEWAL
Nicolas IturbideArgentinaAsiya Javayant NEW
Antonio CaudySpainStephen Shaw NEW
Smith GlickCanadaIoni Bowcher QUALIFIED
Emily WhobreySpainAmy Elsner PROPOSAL
Chavez BriddickAustraliaBernardo Dominic RENEWAL
Salvatore StockhamIndiaAmy Elsner QUALIFIED
Stacey MacleadUnited KingdomIoni Bowcher RENEWAL
Juan WieserArgentinaAmy Elsner NEGOTIATION
Sinclair WaycottAustraliaOnyama Limba NEGOTIATION
Aditya KuskoArgentinaStephen Shaw QUALIFIED
Izzy GarufiFranceOnyama Limba RENEWAL
Darci PoquetteGermanyIvan Magalhaes QUALIFIED
Aika InouyeIndiaIoni Bowcher NEGOTIATION
Sinclair WaycottFranceIoni Bowcher UNQUALIFIED
Frozen Columns
Name
Costa Dilliard
Jones Vocelka
Faith Gillian
Antonio Caudy
Emily Whobrey
Claire Tollner
Aditya Kusko
Leja Caldarera
Costa Dilliard
Aruna Figeroa
Silvio Slusarski
Tony Foller
Aruna Figeroa
Deepesh Chui
Jefferson Schemmer
Clifford Rim
Jennifer Amigon
Johnson Sergi
Octavia Malet
Mujtaba Nicka
Jennifer Amigon
Leja Caldarera
Costa Dilliard
Faith Gillian
Maisha Rulapaugh
Antonio Caudy
Silvio Slusarski
Sinclair Waycott
Antonio Caudy
Munro Ferencz
Wickens Nestle
Misaki Royster
Francesco Shinko
Emily Whobrey
Francesco Shinko
Cody Saylors
Darci Poquette
Francesco Shinko
Smith Glick
Maria Marrier
Octavia Malet
Aditya Kusko
Ricardo Gaucho
Mayumi Kolmetz
Cody Saylors
Arvin Albares
Emily Whobrey
Izzy Garufi
David Darakjy
Aruna Figeroa
IdCountryDate
1000Australia2025-09-23
1001Argentina2025-10-11
1002Australia2025-10-01
1003Canada2025-10-08
1004Canada2025-10-05
1005Canada2025-10-13
1006United Kingdom2025-10-13
1007Canada2025-10-16
1008Canada2025-10-04
1009India2025-10-17
1010Italy2025-10-20
1011Spain2025-09-25
1012Spain2025-10-13
1013Brazil2025-09-26
1014Japan2025-09-22
1015India2025-10-03
1016France2025-10-07
1017Australia2025-10-13
1018France2025-10-16
1019Argentina2025-10-04
1020Germany2025-09-30
1021India2025-10-20
1022Germany2025-10-10
1023Brazil2025-09-26
1024Germany2025-10-12
1025United Kingdom2025-10-16
1026Australia2025-10-01
1027Australia2025-10-18
1028India2025-09-26
1029France2025-10-02
1030Japan2025-10-18
1031Russia2025-10-10
1032Germany2025-10-01
1033Australia2025-10-14
1034Russia2025-10-11
1035Argentina2025-10-04
1036Canada2025-09-22
1037Australia2025-10-20
1038Canada2025-10-14
1039Germany2025-09-29
1040United Kingdom2025-10-17
1041Brazil2025-09-22
1042Germany2025-09-24
1043France2025-09-26
1044Germany2025-10-15
1045Japan2025-09-22
1046Italy2025-10-17
1047Russia2025-10-14
1048Argentina2025-10-07
1049Japan2025-10-14

On-Demand Data

NameIdCountryDate
Darci Poquette1000Canada2025-09-25
Juan Wieser1001United Kingdom2025-10-05
Sinclair Waycott1002Japan2025-10-01
Faith Gillian1003Germany2025-10-16
James Butt1004Germany2025-10-10
Octavia Malet1005Germany2025-10-04
Deepesh Chui1006Argentina2025-09-23
Stacey Maclead1007Argentina2025-10-19
Aruna Figeroa1008Canada2025-09-22
Leja Caldarera1009Russia2025-09-26
Emily Whobrey1010Australia2025-10-09
Tony Foller1011Italy2025-10-07
Aruna Figeroa1012France2025-10-02
Deepesh Chui1013Australia2025-10-10
Ivar Paprocki1014Russia2025-10-12
Leja Caldarera1015Argentina2025-10-04
Darci Poquette1016Argentina2025-10-02
Mayumi Kolmetz1017Russia2025-10-18
Claire Tollner1018Japan2025-10-08
Aruna Figeroa1019Argentina2025-10-15
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aditya KuskoGermanyAnna Fali NEW
Maisha RulapaughAustraliaBernardo Dominic NEGOTIATION
Morrow RutaCanadaXuxue Feng NEW
Ashley DoeFranceStephen Shaw NEGOTIATION
Clifford RimUnited KingdomIoni Bowcher PROPOSAL
Clifford RimAustraliaAsiya Javayant RENEWAL
Chavez BriddickGermanyAsiya Javayant QUALIFIED
Rodrigues CampainArgentinaAsiya Javayant NEW
Arvin AlbaresBrazilAsiya Javayant QUALIFIED
Aruna FigeroaGermanyIvan Magalhaes NEW
Munro FerenczGermanyAsiya Javayant QUALIFIED
Mayumi KolmetzIndiaAmy Elsner NEW
Tony FollerSpainIoni Bowcher RENEWAL
Aika InouyeItalyAsiya Javayant UNQUALIFIED
Ricardo GauchoBrazilIoni Bowcher QUALIFIED
Faith GillianBrazilXuxue Feng NEW
Kadeem FlosiUnited KingdomXuxue Feng NEGOTIATION
Ashley DoeCanadaIoni Bowcher RENEWAL
Rodrigues CampainArgentinaStephen Shaw NEGOTIATION
Kaitlin OstroskyRussiaElwin Sharvill NEGOTIATION
Aruna FigeroaGermanyStephen Shaw QUALIFIED
David DarakjyArgentinaAsiya Javayant PROPOSAL
Claire TollnerFranceElwin Sharvill QUALIFIED
Sinclair WaycottFranceIvan Magalhaes NEGOTIATION
Aika InouyeJapanAnna Fali NEGOTIATION
Mayumi KolmetzAustraliaAsiya Javayant PROPOSAL
Emily WhobreyFranceIvan Magalhaes QUALIFIED
Ivar PaprockiJapanBernardo Dominic RENEWAL
Maisha RulapaughSpainIvan Magalhaes UNQUALIFIED
Arvin AlbaresBrazilAnna Fali PROPOSAL
Deepesh ChuiIndiaBernardo Dominic UNQUALIFIED
Leja CaldareraSpainIoni Bowcher PROPOSAL
Claire TollnerUnited KingdomIvan Magalhaes UNQUALIFIED
Misaki RoysterJapanIoni Bowcher PROPOSAL
Maria MarrierSpainAsiya Javayant UNQUALIFIED
Misaki RoysterUnited KingdomAmy Elsner RENEWAL
Cody SaylorsItalyElwin Sharvill QUALIFIED
Jennifer AmigonFranceIvan Magalhaes UNQUALIFIED
Octavia MaletUnited KingdomXuxue Feng NEGOTIATION
Juan WieserGermanyAnna Fali 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>