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
Smith GlickArgentinaBernardo Dominic PROPOSAL
Francesco ShinkoGermanyAsiya Javayant UNQUALIFIED
Mujtaba NickaIndiaElwin Sharvill RENEWAL
Kaitlin OstroskySpainAnna Fali QUALIFIED
Aruna FigeroaFranceXuxue Feng PROPOSAL
Maria MarrierJapanElwin Sharvill RENEWAL
Ivar PaprockiAustraliaOnyama Limba UNQUALIFIED
Darci PoquetteCanadaIoni Bowcher PROPOSAL
Maria MarrierArgentinaStephen Shaw PROPOSAL
Sinclair WaycottSpainOnyama Limba RENEWAL
Wickens NestleGermanyElwin Sharvill QUALIFIED
Aruna FigeroaBrazilIvan Magalhaes NEGOTIATION
Maria MarrierCanadaAnna Fali PROPOSAL
Morrow RutaAustraliaAsiya Javayant PROPOSAL
Francesco ShinkoIndiaAmy Elsner NEGOTIATION
Antonio CaudyIndiaIvan Magalhaes RENEWAL
Kaitlin OstroskyUnited KingdomAsiya Javayant NEW
Leon OldroydIndiaBernardo Dominic NEGOTIATION
Cody SaylorsJapanStephen Shaw PROPOSAL
Adams MorascaUnited KingdomOnyama Limba PROPOSAL
James ButtBrazilStephen Shaw QUALIFIED
Mayumi KolmetzCanadaXuxue Feng PROPOSAL
Salvatore StockhamBrazilAnna Fali UNQUALIFIED
Tony FollerSpainStephen Shaw RENEWAL
Misaki RoysterUnited KingdomIoni Bowcher NEGOTIATION
Maisha RulapaughItalyStephen Shaw PROPOSAL
Alejandro PerinAustraliaOnyama Limba RENEWAL
Rodrigues CampainBrazilAmy Elsner PROPOSAL
Deepesh ChuiFranceXuxue Feng PROPOSAL
Morrow RutaRussiaAsiya Javayant NEGOTIATION
Ivar PaprockiArgentinaStephen Shaw RENEWAL
Darci PoquetteRussiaOnyama Limba UNQUALIFIED
Chavez BriddickBrazilIoni Bowcher QUALIFIED
Tony FollerCanadaStephen Shaw NEW
Tony FollerUnited KingdomElwin Sharvill QUALIFIED
Adams MorascaCanadaAsiya Javayant NEGOTIATION
Emily WhobreyJapanIoni Bowcher UNQUALIFIED
Leja CaldareraRussiaElwin Sharvill QUALIFIED
Deepesh ChuiBrazilIvan Magalhaes PROPOSAL
Claire TollnerAustraliaAnna Fali NEW
Munro FerenczRussiaBernardo Dominic QUALIFIED
Julie StensethFranceIoni Bowcher NEW
Isabel BowleyGermanyOnyama Limba NEW
Clifford RimAustraliaElwin Sharvill UNQUALIFIED
Sinclair WaycottIndiaElwin Sharvill RENEWAL
Salvatore StockhamUnited KingdomAnna Fali NEGOTIATION
Cody SaylorsGermanyIvan Magalhaes QUALIFIED
Julie StensethSpainAmy Elsner NEGOTIATION
Emily WhobreyArgentinaAmy Elsner UNQUALIFIED
Claire TollnerFranceAsiya Javayant UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Arvin AlbaresItalyAnna Fali RENEWAL
Ricardo GauchoUnited KingdomAmy Elsner UNQUALIFIED
Aruna FigeroaRussiaAsiya Javayant UNQUALIFIED
Kaitlin OstroskyCanadaStephen Shaw RENEWAL
Ashley DoeSpainOnyama Limba NEGOTIATION
Juan WieserCanadaElwin Sharvill PROPOSAL
Stacey MacleadUnited KingdomAnna Fali NEGOTIATION
Adams MorascaIndiaIvan Magalhaes UNQUALIFIED
Misaki RoysterJapanIoni Bowcher NEW
Adams MorascaUnited KingdomIoni Bowcher QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Francesco ShinkoCanada2026-05-04Chemel, James L Cpa UNQUALIFIED37Xuxue Feng
1001Kaitlin OstroskyRussia2026-05-06Chemel, James L Cpa NEW45Xuxue Feng
1002Tony FollerRussia2026-05-10Chapman, Ross E Esq RENEWAL38Amy Elsner
1003Sinclair WaycottBrazil2026-05-21Dorl, James J Esq QUALIFIED30Amy Elsner
1004Greenwood BologniaJapan2026-05-11Chapman, Ross E Esq RENEWAL79Elwin Sharvill
1005Antonio CaudyBrazil2026-05-01Rangoni Of Florence NEW18Xuxue Feng
1006Smith GlickJapan2026-05-17King, Christopher A Esq NEGOTIATION76Asiya Javayant
1007Aika InouyeAustralia2026-05-24Chemel, James L Cpa UNQUALIFIED59Onyama Limba
1008Darci PoquetteIndia2026-05-13Feltz Printing Service RENEWAL85Ioni Bowcher
1009Silvio SlusarskiUnited Kingdom2026-05-08Feltz Printing Service RENEWAL2Stephen Shaw
1010Ricardo GauchoCanada2026-05-14Morlong Associates QUALIFIED3Elwin Sharvill
1011Sinclair WaycottGermany2026-05-18Morlong Associates NEGOTIATION82Ivan Magalhaes
1012Morrow RutaFrance2026-05-12Feiner Bros RENEWAL29Ioni Bowcher
1013Greenwood BologniaGermany2026-05-05Rangoni Of Florence NEGOTIATION64Xuxue Feng
1014Faith GillianRussia2026-05-07Feiner Bros QUALIFIED62Anna Fali
1015Juan WieserItaly2026-05-11Morlong Associates NEGOTIATION62Bernardo Dominic
1016Tony FollerFrance2026-05-13Rousseaux, Michael Esq NEW99Asiya Javayant
1017Aruna FigeroaArgentina2026-05-04Feiner Bros QUALIFIED82Anna Fali
1018Mayumi KolmetzCanada2026-05-25Chemel, James L Cpa RENEWAL91Onyama Limba
1019Alejandro PerinItaly2026-04-27King, Christopher A Esq RENEWAL36Bernardo Dominic
1020Wickens NestleFrance2026-05-01Chemel, James L Cpa QUALIFIED47Amy Elsner
1021Juan WieserItaly2026-05-20Truhlar And Truhlar Attys NEW2Elwin Sharvill
1022Smith GlickCanada2026-05-20Commercial Press NEGOTIATION39Stephen Shaw
1023Claire TollnerSpain2026-05-24Benton, John B Jr PROPOSAL2Onyama Limba
1024James ButtFrance2026-05-06Morlong Associates UNQUALIFIED33Amy Elsner
1025Emily WhobreyCanada2026-05-22Dorl, James J Esq PROPOSAL47Elwin Sharvill
1026Faith GillianArgentina2026-05-18Rangoni Of Florence QUALIFIED31Ioni Bowcher
1027Emily WhobreyAustralia2026-05-18Buckley Miller Wright QUALIFIED8Xuxue Feng
1028Izzy GarufiGermany2026-05-26Dorl, James J Esq QUALIFIED13Anna Fali
1029Izzy GarufiBrazil2026-05-11Feiner Bros QUALIFIED85Stephen Shaw
1030Ivar PaprockiUnited Kingdom2026-05-14Truhlar And Truhlar Attys NEW10Ivan Magalhaes
1031Juan WieserArgentina2026-05-12Chapman, Ross E Esq UNQUALIFIED71Bernardo Dominic
1032Alejandro PerinCanada2026-05-07Feiner Bros RENEWAL52Asiya Javayant
1033Emily WhobreyArgentina2026-05-25Chapman, Ross E Esq RENEWAL69Bernardo Dominic
1034Arvin AlbaresSpain2026-05-24Chanay, Jeffrey A Esq NEGOTIATION41Stephen Shaw
1035Clifford RimGermany2026-05-01King, Christopher A Esq PROPOSAL57Stephen Shaw
1036Clifford RimCanada2026-05-07Chanay, Jeffrey A Esq NEGOTIATION38Xuxue Feng
1037Smith GlickArgentina2026-05-01Chemel, James L Cpa RENEWAL75Stephen Shaw
1038Wickens NestleJapan2026-05-17Truhlar And Truhlar Attys RENEWAL21Onyama Limba
1039Ivar PaprockiRussia2026-05-20Chanay, Jeffrey A Esq RENEWAL43Elwin Sharvill
1040Izzy GarufiArgentina2026-05-23Dorl, James J Esq PROPOSAL43Onyama Limba
1041Clifford RimArgentina2026-05-16Feltz Printing Service PROPOSAL31Xuxue Feng
1042Costa DilliardUnited Kingdom2026-05-19Feiner Bros RENEWAL34Anna Fali
1043Deepesh ChuiFrance2026-05-15Rousseaux, Michael Esq UNQUALIFIED57Xuxue Feng
1044Silvio SlusarskiGermany2026-05-17Chemel, James L Cpa RENEWAL13Elwin Sharvill
1045Kadeem FlosiArgentina2026-04-29Truhlar And Truhlar Attys NEGOTIATION96Stephen Shaw
1046Tony FollerIndia2026-05-24Rousseaux, Michael Esq QUALIFIED57Asiya Javayant
1047Murillo MaletBrazil2026-05-14Truhlar And Truhlar Attys PROPOSAL30Ivan Magalhaes
1048Kaitlin OstroskyFrance2026-05-14King, Christopher A Esq UNQUALIFIED27Bernardo Dominic
1049Aika InouyeCanada2026-05-09Printing Dimensions RENEWAL7Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Nicolas IturbideCanadaOnyama Limba NEGOTIATION
Salvatore StockhamUnited KingdomOnyama Limba NEW
Munro FerenczItalyXuxue Feng NEGOTIATION
Maria MarrierIndiaAnna Fali PROPOSAL
Ivar PaprockiGermanyOnyama Limba NEGOTIATION
Ivar PaprockiIndiaIvan Magalhaes RENEWAL
Izzy GarufiRussiaElwin Sharvill NEW
Mayumi KolmetzArgentinaIvan Magalhaes RENEWAL
Murillo MaletRussiaAnna Fali UNQUALIFIED
Ashley DoeIndiaAsiya Javayant NEW
Clifford RimUnited KingdomAmy Elsner UNQUALIFIED
Maria MarrierAustraliaIoni Bowcher RENEWAL
Nicolas IturbideItalyIoni Bowcher RENEWAL
Aika InouyeJapanAmy Elsner PROPOSAL
Kadeem FlosiArgentinaBernardo Dominic NEGOTIATION
Cody SaylorsArgentinaXuxue Feng PROPOSAL
Isabel BowleyAustraliaAmy Elsner QUALIFIED
Juan WieserJapanIvan Magalhaes UNQUALIFIED
Clifford RimFranceAnna Fali PROPOSAL
Mujtaba NickaBrazilStephen Shaw NEGOTIATION
Kadeem FlosiItalyAsiya Javayant UNQUALIFIED
Costa DilliardIndiaXuxue Feng NEGOTIATION
Emily WhobreyAustraliaBernardo Dominic NEW
Costa DilliardJapanIvan Magalhaes UNQUALIFIED
Darci PoquetteItalyAsiya Javayant PROPOSAL
Sinclair WaycottBrazilXuxue Feng QUALIFIED
Rodrigues CampainCanadaIoni Bowcher NEW
Leon OldroydItalyIvan Magalhaes UNQUALIFIED
Claire TollnerJapanIvan Magalhaes RENEWAL
Octavia MaletSpainIvan Magalhaes NEW
Tony FollerFranceElwin Sharvill QUALIFIED
Jefferson SchemmerBrazilAmy Elsner RENEWAL
David DarakjyAustraliaStephen Shaw UNQUALIFIED
Jennifer AmigonIndiaXuxue Feng UNQUALIFIED
Aika InouyeGermanyAmy Elsner PROPOSAL
Maria MarrierIndiaIoni Bowcher RENEWAL
Maria MarrierIndiaOnyama Limba PROPOSAL
Murillo MaletItalyAsiya Javayant PROPOSAL
Leja CaldareraBrazilBernardo Dominic NEW
Aditya KuskoIndiaAsiya Javayant NEW
Emily WhobreyCanadaAsiya Javayant UNQUALIFIED
Jennifer AmigonFranceStephen Shaw UNQUALIFIED
Mayumi KolmetzGermanyAmy Elsner NEW
Aruna FigeroaSpainIvan Magalhaes RENEWAL
Jones VocelkaFranceIoni Bowcher PROPOSAL
Alejandro PerinJapanOnyama Limba UNQUALIFIED
Tony FollerJapanAmy Elsner NEW
Smith GlickCanadaIvan Magalhaes NEGOTIATION
Kaitlin OstroskyJapanOnyama Limba QUALIFIED
David DarakjyCanadaBernardo Dominic QUALIFIED
Frozen Columns
Name
Francesco Shinko
Darci Poquette
Ricardo Gaucho
Chavez Briddick
David Darakjy
Wickens Nestle
Nicolas Iturbide
James Butt
Adams Morasca
Ashley Doe
Maria Marrier
Clifford Rim
Jones Vocelka
Stacey Maclead
Rodrigues Campain
Julie Stenseth
Nicolas Iturbide
Jones Vocelka
Kadeem Flosi
Faith Gillian
Octavia Malet
Misaki Royster
Munro Ferencz
Jennifer Amigon
Tony Foller
Mayumi Kolmetz
Mayumi Kolmetz
Ivar Paprocki
Costa Dilliard
Munro Ferencz
Tony Foller
Leja Caldarera
Isabel Bowley
Deepesh Chui
Faith Gillian
Ivar Paprocki
Smith Glick
Francesco Shinko
Adams Morasca
Ivar Paprocki
Darci Poquette
Silvio Slusarski
Cody Saylors
Izzy Garufi
Mayumi Kolmetz
Greenwood Bolognia
Adams Morasca
Aika Inouye
Izzy Garufi
Mujtaba Nicka
IdCountryDate
1000France2026-05-18
1001Canada2026-05-22
1002Argentina2026-05-25
1003India2026-05-03
1004United Kingdom2026-05-25
1005Spain2026-05-24
1006Spain2026-05-26
1007Germany2026-05-02
1008Japan2026-05-14
1009Australia2026-05-14
1010Canada2026-05-15
1011Canada2026-05-09
1012Australia2026-05-24
1013Japan2026-05-22
1014India2026-05-12
1015Italy2026-05-10
1016Spain2026-04-30
1017Germany2026-05-08
1018France2026-05-22
1019United Kingdom2026-05-08
1020France2026-05-26
1021Germany2026-05-19
1022Brazil2026-05-21
1023Russia2026-05-26
1024Italy2026-04-29
1025India2026-05-02
1026United Kingdom2026-05-15
1027United Kingdom2026-05-13
1028Australia2026-05-25
1029Canada2026-05-05
1030Italy2026-05-16
1031Russia2026-04-30
1032Australia2026-05-26
1033Brazil2026-05-01
1034Germany2026-05-10
1035India2026-05-15
1036France2026-05-17
1037Australia2026-05-23
1038Italy2026-05-18
1039Spain2026-04-29
1040France2026-05-16
1041Italy2026-04-27
1042Italy2026-05-24
1043Australia2026-05-20
1044France2026-05-11
1045Argentina2026-04-30
1046Canada2026-05-15
1047Russia2026-05-26
1048United Kingdom2026-05-26
1049Japan2026-04-30

On-Demand Data

NameIdCountryDate
Murillo Malet1000Italy2026-05-20
Sinclair Waycott1001United Kingdom2026-05-03
Nicolas Iturbide1002Brazil2026-05-18
Salvatore Stockham1003Italy2026-05-23
Wickens Nestle1004Spain2026-05-19
Aruna Figeroa1005Spain2026-05-22
Leja Caldarera1006Japan2026-05-18
Leja Caldarera1007Argentina2026-05-06
Jennifer Amigon1008France2026-05-14
Leja Caldarera1009Germany2026-05-19
Alejandro Perin1010Italy2026-04-27
Arvin Albares1011Italy2026-04-29
Sinclair Waycott1012Germany2026-05-16
Mujtaba Nicka1013Argentina2026-05-24
Deepesh Chui1014Japan2026-04-29
Isabel Bowley1015Brazil2026-05-04
Kadeem Flosi1016United Kingdom2026-05-01
Juan Wieser1017Germany2026-05-05
Antonio Caudy1018Australia2026-05-14
Juan Wieser1019United Kingdom2026-05-24
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
James ButtFranceAmy Elsner RENEWAL
Munro FerenczIndiaBernardo Dominic QUALIFIED
Leon OldroydArgentinaOnyama Limba PROPOSAL
Deepesh ChuiSpainIoni Bowcher UNQUALIFIED
Ricardo GauchoJapanStephen Shaw UNQUALIFIED
Izzy GarufiJapanAmy Elsner RENEWAL
Leja CaldareraBrazilIvan Magalhaes PROPOSAL
Arvin AlbaresCanadaIoni Bowcher UNQUALIFIED
Rodrigues CampainSpainXuxue Feng NEW
Mayumi KolmetzArgentinaAnna Fali UNQUALIFIED
Octavia MaletFranceIoni Bowcher PROPOSAL
Ashley DoeAustraliaElwin Sharvill NEW
Greenwood BologniaIndiaElwin Sharvill NEW
Claire TollnerSpainIvan Magalhaes RENEWAL
Ivar PaprockiRussiaIoni Bowcher RENEWAL
Clifford RimJapanIvan Magalhaes PROPOSAL
Rodrigues CampainFranceAsiya Javayant QUALIFIED
Kaitlin OstroskyCanadaAnna Fali PROPOSAL
Maria MarrierJapanXuxue Feng NEGOTIATION
Misaki RoysterUnited KingdomIoni Bowcher PROPOSAL
Maria MarrierFranceAsiya Javayant NEW
Greenwood BologniaCanadaXuxue Feng NEGOTIATION
Octavia MaletSpainAmy Elsner RENEWAL
Kaitlin OstroskyRussiaOnyama Limba NEW
Ivar PaprockiGermanyIoni Bowcher NEGOTIATION
Nicolas IturbideItalyAmy Elsner RENEWAL
Misaki RoysterItalyXuxue Feng NEW
Aruna FigeroaCanadaElwin Sharvill PROPOSAL
Maisha RulapaughIndiaAnna Fali PROPOSAL
Antonio CaudyItalyAnna Fali NEW
Johnson SergiIndiaAsiya Javayant QUALIFIED
Emily WhobreyCanadaElwin Sharvill PROPOSAL
David DarakjySpainIvan Magalhaes PROPOSAL
Murillo MaletUnited KingdomIvan Magalhaes PROPOSAL
Cody SaylorsFranceElwin Sharvill UNQUALIFIED
Arvin AlbaresItalyXuxue Feng NEGOTIATION
Smith GlickSpainStephen Shaw RENEWAL
Antonio CaudyItalyOnyama Limba UNQUALIFIED
Munro FerenczRussiaOnyama Limba PROPOSAL
Chavez BriddickIndiaBernardo Dominic 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>