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
Jennifer AmigonItalyElwin Sharvill UNQUALIFIED
Greenwood BologniaArgentinaElwin Sharvill UNQUALIFIED
Jennifer AmigonCanadaBernardo Dominic UNQUALIFIED
Aruna FigeroaGermanyBernardo Dominic UNQUALIFIED
Ricardo GauchoRussiaIoni Bowcher NEGOTIATION
Faith GillianBrazilStephen Shaw QUALIFIED
Nicolas IturbideIndiaXuxue Feng RENEWAL
Salvatore StockhamJapanXuxue Feng RENEWAL
Cody SaylorsCanadaAmy Elsner UNQUALIFIED
Deepesh ChuiArgentinaBernardo Dominic QUALIFIED
Mayumi KolmetzAustraliaAmy Elsner UNQUALIFIED
Julie StensethBrazilBernardo Dominic NEW
Jennifer AmigonBrazilIvan Magalhaes RENEWAL
Aika InouyeGermanyIoni Bowcher PROPOSAL
Ivar PaprockiItalyAsiya Javayant PROPOSAL
Cody SaylorsBrazilIvan Magalhaes NEW
Aruna FigeroaRussiaAmy Elsner PROPOSAL
Claire TollnerItalyBernardo Dominic NEW
Jefferson SchemmerUnited KingdomStephen Shaw PROPOSAL
Maria MarrierSpainBernardo Dominic RENEWAL
Wickens NestleCanadaXuxue Feng RENEWAL
Sinclair WaycottUnited KingdomAsiya Javayant RENEWAL
Rodrigues CampainFranceOnyama Limba UNQUALIFIED
Costa DilliardJapanBernardo Dominic QUALIFIED
Kaitlin OstroskyUnited KingdomIoni Bowcher QUALIFIED
Leja CaldareraFranceAsiya Javayant NEW
Leja CaldareraFranceXuxue Feng PROPOSAL
Ashley DoeUnited KingdomAnna Fali QUALIFIED
Smith GlickUnited KingdomElwin Sharvill QUALIFIED
Alejandro PerinItalyIvan Magalhaes QUALIFIED
Octavia MaletRussiaOnyama Limba UNQUALIFIED
Jennifer AmigonUnited KingdomIoni Bowcher NEGOTIATION
Mayumi KolmetzBrazilAmy Elsner UNQUALIFIED
Leja CaldareraArgentinaAnna Fali QUALIFIED
Antonio CaudyRussiaIvan Magalhaes RENEWAL
Julie StensethFranceBernardo Dominic UNQUALIFIED
Cody SaylorsCanadaOnyama Limba QUALIFIED
Jefferson SchemmerRussiaIoni Bowcher RENEWAL
Leja CaldareraGermanyIoni Bowcher QUALIFIED
Jennifer AmigonItalyElwin Sharvill QUALIFIED
Faith GillianArgentinaAmy Elsner NEGOTIATION
Faith GillianFranceElwin Sharvill RENEWAL
Costa DilliardSpainIvan Magalhaes QUALIFIED
Jefferson SchemmerJapanIoni Bowcher QUALIFIED
Emily WhobreyUnited KingdomBernardo Dominic RENEWAL
Claire TollnerAustraliaAmy Elsner RENEWAL
Maisha RulapaughRussiaIoni Bowcher NEGOTIATION
Wickens NestleAustraliaStephen Shaw RENEWAL
Stacey MacleadIndiaIvan Magalhaes NEGOTIATION
Faith GillianArgentinaXuxue Feng UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Jennifer AmigonAustraliaOnyama Limba NEGOTIATION
Maria MarrierCanadaElwin Sharvill PROPOSAL
Maria MarrierAustraliaIvan Magalhaes UNQUALIFIED
Arvin AlbaresGermanyIoni Bowcher QUALIFIED
Jeanfrancois VenereAustraliaOnyama Limba NEGOTIATION
Costa DilliardFranceOnyama Limba RENEWAL
Francesco ShinkoBrazilBernardo Dominic NEGOTIATION
Kadeem FlosiRussiaIoni Bowcher PROPOSAL
Rodrigues CampainItalyStephen Shaw QUALIFIED
Ivar PaprockiIndiaIoni Bowcher NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Arvin AlbaresRussia2026-04-19Morlong Associates NEW73Ioni Bowcher
1001Misaki RoysterIndia2026-04-13Buckley Miller Wright NEW29Amy Elsner
1002Kadeem FlosiUnited Kingdom2026-04-21Chanay, Jeffrey A Esq NEGOTIATION23Elwin Sharvill
1003Nicolas IturbideArgentina2026-04-15Chemel, James L Cpa RENEWAL79Xuxue Feng
1004Jefferson SchemmerFrance2026-04-22Benton, John B Jr QUALIFIED98Ioni Bowcher
1005Murillo MaletUnited Kingdom2026-04-21Commercial Press NEGOTIATION43Ivan Magalhaes
1006Izzy GarufiBrazil2026-04-12Benton, John B Jr PROPOSAL18Bernardo Dominic
1007Francesco ShinkoRussia2026-04-22Morlong Associates QUALIFIED49Ioni Bowcher
1008Jennifer AmigonFrance2026-04-08Morlong Associates NEGOTIATION53Stephen Shaw
1009Kaitlin OstroskyAustralia2026-04-19Morlong Associates UNQUALIFIED20Ivan Magalhaes
1010Leja CaldareraGermany2026-03-25Buckley Miller Wright QUALIFIED30Bernardo Dominic
1011Emily WhobreyRussia2026-04-20Printing Dimensions RENEWAL33Anna Fali
1012Darci PoquetteSpain2026-04-14Chanay, Jeffrey A Esq QUALIFIED74Anna Fali
1013Stacey MacleadSpain2026-04-15Commercial Press QUALIFIED46Anna Fali
1014Alejandro PerinJapan2026-04-10King, Christopher A Esq NEGOTIATION54Stephen Shaw
1015Deepesh ChuiArgentina2026-04-11Dorl, James J Esq UNQUALIFIED60Asiya Javayant
1016Johnson SergiBrazil2026-03-28Chapman, Ross E Esq NEGOTIATION16Anna Fali
1017Jones VocelkaSpain2026-04-18Benton, John B Jr UNQUALIFIED48Xuxue Feng
1018Claire TollnerGermany2026-04-11Chapman, Ross E Esq NEW45Elwin Sharvill
1019Aruna FigeroaAustralia2026-04-12Truhlar And Truhlar Attys UNQUALIFIED24Elwin Sharvill
1020Faith GillianGermany2026-04-05Feltz Printing Service QUALIFIED64Amy Elsner
1021Salvatore StockhamBrazil2026-04-01Feltz Printing Service PROPOSAL4Amy Elsner
1022Jeanfrancois VenereFrance2026-04-21Buckley Miller Wright PROPOSAL92Stephen Shaw
1023Ricardo GauchoJapan2026-03-27Truhlar And Truhlar Attys UNQUALIFIED12Onyama Limba
1024Aika InouyeUnited Kingdom2026-03-25Benton, John B Jr RENEWAL66Xuxue Feng
1025Aruna FigeroaCanada2026-03-24Benton, John B Jr RENEWAL13Asiya Javayant
1026David DarakjyGermany2026-04-03Dorl, James J Esq NEGOTIATION94Ivan Magalhaes
1027Sinclair WaycottSpain2026-04-16Truhlar And Truhlar Attys PROPOSAL73Xuxue Feng
1028David DarakjyUnited Kingdom2026-04-15Feltz Printing Service RENEWAL55Bernardo Dominic
1029Sinclair WaycottFrance2026-03-30Dorl, James J Esq UNQUALIFIED17Elwin Sharvill
1030Alejandro PerinUnited Kingdom2026-03-26Dorl, James J Esq NEW81Ivan Magalhaes
1031Nicolas IturbideIndia2026-04-07Chanay, Jeffrey A Esq RENEWAL37Bernardo Dominic
1032Ashley DoeUnited Kingdom2026-03-26Chemel, James L Cpa PROPOSAL6Stephen Shaw
1033Aruna FigeroaBrazil2026-04-15Morlong Associates NEW38Stephen Shaw
1034Ricardo GauchoSpain2026-04-10Morlong Associates NEGOTIATION38Anna Fali
1035Salvatore StockhamJapan2026-03-24Chemel, James L Cpa NEW67Anna Fali
1036Antonio CaudyIndia2026-03-24Commercial Press NEW97Amy Elsner
1037Adams MorascaGermany2026-04-22Chanay, Jeffrey A Esq QUALIFIED92Elwin Sharvill
1038Mujtaba NickaCanada2026-04-05Rousseaux, Michael Esq PROPOSAL92Asiya Javayant
1039Greenwood BologniaCanada2026-03-29Feiner Bros RENEWAL54Anna Fali
1040Ricardo GauchoBrazil2026-04-11Rousseaux, Michael Esq UNQUALIFIED42Onyama Limba
1041Deepesh ChuiAustralia2026-03-24Rousseaux, Michael Esq RENEWAL43Ivan Magalhaes
1042Clifford RimFrance2026-04-21Rousseaux, Michael Esq NEGOTIATION48Onyama Limba
1043Francesco ShinkoUnited Kingdom2026-04-10Chapman, Ross E Esq PROPOSAL82Elwin Sharvill
1044Ashley DoeGermany2026-04-11Morlong Associates RENEWAL24Ioni Bowcher
1045Tony FollerFrance2026-04-13Benton, John B Jr PROPOSAL95Xuxue Feng
1046Greenwood BologniaJapan2026-04-19Chemel, James L Cpa UNQUALIFIED26Stephen Shaw
1047Johnson SergiCanada2026-04-14Buckley Miller Wright NEW43Ivan Magalhaes
1048Mujtaba NickaRussia2026-04-04Truhlar And Truhlar Attys NEGOTIATION57Stephen Shaw
1049Aditya KuskoAustralia2026-03-25Chanay, Jeffrey A Esq PROPOSAL29Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
James ButtSpainAsiya Javayant NEGOTIATION
Ivar PaprockiBrazilIvan Magalhaes NEGOTIATION
Smith GlickBrazilAnna Fali NEGOTIATION
Silvio SlusarskiBrazilIoni Bowcher NEGOTIATION
Aruna FigeroaRussiaAmy Elsner UNQUALIFIED
Kaitlin OstroskyItalyXuxue Feng RENEWAL
Jeanfrancois VenereSpainIvan Magalhaes PROPOSAL
Francesco ShinkoItalyIvan Magalhaes NEW
Tony FollerSpainElwin Sharvill NEW
James ButtGermanyElwin Sharvill RENEWAL
Maria MarrierSpainOnyama Limba PROPOSAL
Stacey MacleadArgentinaOnyama Limba PROPOSAL
Morrow RutaArgentinaIvan Magalhaes NEW
Misaki RoysterFranceOnyama Limba NEGOTIATION
Sinclair WaycottBrazilIvan Magalhaes PROPOSAL
Jennifer AmigonArgentinaXuxue Feng NEGOTIATION
Cody SaylorsArgentinaAsiya Javayant PROPOSAL
Morrow RutaArgentinaIoni Bowcher UNQUALIFIED
Aditya KuskoIndiaOnyama Limba UNQUALIFIED
Adams MorascaItalyStephen Shaw NEGOTIATION
Maisha RulapaughRussiaXuxue Feng NEGOTIATION
Leon OldroydJapanAmy Elsner NEW
Leja CaldareraBrazilIoni Bowcher RENEWAL
Johnson SergiArgentinaAsiya Javayant UNQUALIFIED
Aika InouyeItalyBernardo Dominic NEW
Ashley DoeSpainStephen Shaw QUALIFIED
Munro FerenczJapanAmy Elsner QUALIFIED
Morrow RutaAustraliaXuxue Feng UNQUALIFIED
Adams MorascaUnited KingdomAnna Fali NEGOTIATION
Ashley DoeUnited KingdomAnna Fali QUALIFIED
Julie StensethGermanyAmy Elsner NEGOTIATION
Juan WieserSpainBernardo Dominic PROPOSAL
Ivar PaprockiBrazilAsiya Javayant UNQUALIFIED
Aruna FigeroaAustraliaAmy Elsner NEGOTIATION
Maria MarrierAustraliaOnyama Limba RENEWAL
Ivar PaprockiArgentinaStephen Shaw NEGOTIATION
Juan WieserArgentinaAsiya Javayant QUALIFIED
Octavia MaletUnited KingdomOnyama Limba NEGOTIATION
Wickens NestleGermanyXuxue Feng NEW
Izzy GarufiJapanAmy Elsner QUALIFIED
Ivar PaprockiGermanyIoni Bowcher QUALIFIED
Faith GillianUnited KingdomIoni Bowcher NEW
Ricardo GauchoUnited KingdomStephen Shaw PROPOSAL
David DarakjyBrazilXuxue Feng QUALIFIED
Jefferson SchemmerItalyAmy Elsner RENEWAL
Nicolas IturbideSpainIvan Magalhaes NEW
Jeanfrancois VenereGermanyIvan Magalhaes PROPOSAL
Silvio SlusarskiSpainBernardo Dominic RENEWAL
Greenwood BologniaAustraliaIvan Magalhaes PROPOSAL
Costa DilliardAustraliaOnyama Limba UNQUALIFIED
Frozen Columns
Name
Kaitlin Ostrosky
Emily Whobrey
Deepesh Chui
Octavia Malet
David Darakjy
Morrow Ruta
Mayumi Kolmetz
Aditya Kusko
Greenwood Bolognia
Kaitlin Ostrosky
Ashley Doe
Antonio Caudy
Sinclair Waycott
Munro Ferencz
Ivar Paprocki
Greenwood Bolognia
Greenwood Bolognia
Johnson Sergi
Salvatore Stockham
Salvatore Stockham
Sinclair Waycott
Salvatore Stockham
Faith Gillian
Aruna Figeroa
Morrow Ruta
Nicolas Iturbide
Rodrigues Campain
Jones Vocelka
Greenwood Bolognia
Salvatore Stockham
Jeanfrancois Venere
Juan Wieser
Silvio Slusarski
Ricardo Gaucho
Smith Glick
Mayumi Kolmetz
Darci Poquette
Jennifer Amigon
Murillo Malet
Johnson Sergi
Misaki Royster
Isabel Bowley
David Darakjy
Aruna Figeroa
Isabel Bowley
Antonio Caudy
Emily Whobrey
Jones Vocelka
Jefferson Schemmer
Jones Vocelka
IdCountryDate
1000United Kingdom2026-04-08
1001Spain2026-04-09
1002Argentina2026-03-29
1003India2026-03-26
1004Canada2026-04-12
1005Italy2026-04-11
1006India2026-04-21
1007Brazil2026-03-29
1008India2026-03-27
1009Germany2026-04-15
1010Russia2026-04-11
1011Germany2026-03-27
1012France2026-03-30
1013United Kingdom2026-04-18
1014India2026-04-17
1015Spain2026-04-19
1016Spain2026-04-17
1017Canada2026-03-29
1018Spain2026-04-10
1019Brazil2026-03-29
1020Russia2026-04-15
1021Germany2026-04-18
1022United Kingdom2026-04-03
1023India2026-04-16
1024Japan2026-04-18
1025Argentina2026-04-05
1026Japan2026-03-31
1027Italy2026-03-27
1028Germany2026-04-08
1029Canada2026-03-27
1030Brazil2026-03-24
1031Australia2026-04-10
1032Australia2026-03-24
1033Italy2026-04-16
1034Australia2026-04-14
1035Canada2026-04-01
1036Australia2026-04-01
1037Argentina2026-04-08
1038Spain2026-04-11
1039Russia2026-04-06
1040India2026-04-19
1041Japan2026-04-04
1042France2026-04-10
1043Japan2026-04-15
1044Russia2026-04-02
1045Argentina2026-04-16
1046Australia2026-03-25
1047France2026-04-19
1048India2026-04-08
1049Argentina2026-04-11

On-Demand Data

NameIdCountryDate
Octavia Malet1000Brazil2026-04-13
Jones Vocelka1001Canada2026-03-24
Jones Vocelka1002Australia2026-03-24
Juan Wieser1003Spain2026-04-04
Ivar Paprocki1004Australia2026-04-02
Faith Gillian1005United Kingdom2026-04-06
Jennifer Amigon1006Brazil2026-04-02
Isabel Bowley1007Brazil2026-04-07
Ricardo Gaucho1008Spain2026-04-21
Aditya Kusko1009France2026-04-14
Sinclair Waycott1010Japan2026-04-12
Johnson Sergi1011Italy2026-04-19
Aika Inouye1012Italy2026-04-09
Jones Vocelka1013India2026-04-05
Leja Caldarera1014Canada2026-03-25
Nicolas Iturbide1015Australia2026-04-08
Leja Caldarera1016United Kingdom2026-04-03
Deepesh Chui1017France2026-04-21
Silvio Slusarski1018Spain2026-04-20
Maisha Rulapaugh1019India2026-04-02
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Morrow RutaUnited KingdomXuxue Feng QUALIFIED
Ivar PaprockiAustraliaXuxue Feng PROPOSAL
Arvin AlbaresSpainOnyama Limba PROPOSAL
Jefferson SchemmerFranceBernardo Dominic NEW
Cody SaylorsBrazilIoni Bowcher NEW
Francesco ShinkoUnited KingdomIoni Bowcher UNQUALIFIED
Leja CaldareraIndiaIvan Magalhaes PROPOSAL
Arvin AlbaresSpainAsiya Javayant PROPOSAL
Munro FerenczItalyAnna Fali QUALIFIED
Mayumi KolmetzJapanOnyama Limba PROPOSAL
Ivar PaprockiUnited KingdomIoni Bowcher UNQUALIFIED
Leja CaldareraArgentinaAnna Fali PROPOSAL
Aika InouyeSpainIvan Magalhaes PROPOSAL
Mujtaba NickaIndiaAnna Fali NEGOTIATION
Silvio SlusarskiAustraliaElwin Sharvill NEGOTIATION
Mayumi KolmetzRussiaXuxue Feng RENEWAL
Izzy GarufiJapanIoni Bowcher NEW
Mayumi KolmetzSpainStephen Shaw NEGOTIATION
James ButtFranceStephen Shaw QUALIFIED
Arvin AlbaresArgentinaAnna Fali RENEWAL
Juan WieserGermanyStephen Shaw QUALIFIED
Morrow RutaJapanXuxue Feng NEGOTIATION
Kaitlin OstroskyCanadaIoni Bowcher RENEWAL
Johnson SergiArgentinaXuxue Feng NEGOTIATION
Salvatore StockhamItalyBernardo Dominic NEGOTIATION
Aika InouyeArgentinaXuxue Feng QUALIFIED
Francesco ShinkoSpainBernardo Dominic QUALIFIED
James ButtIndiaXuxue Feng NEGOTIATION
Jeanfrancois VenereItalyOnyama Limba QUALIFIED
Mayumi KolmetzGermanyIoni Bowcher QUALIFIED
Smith GlickGermanyAmy Elsner UNQUALIFIED
Leon OldroydSpainOnyama Limba QUALIFIED
Octavia MaletFranceElwin Sharvill NEGOTIATION
Izzy GarufiFranceIvan Magalhaes RENEWAL
Leon OldroydRussiaBernardo Dominic NEW
Salvatore StockhamFranceOnyama Limba RENEWAL
Cody SaylorsSpainIvan Magalhaes RENEWAL
Juan WieserRussiaBernardo Dominic RENEWAL
Costa DilliardUnited KingdomAmy Elsner NEGOTIATION
Clifford RimUnited KingdomAmy Elsner 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>