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
Misaki RoysterSpainBernardo Dominic QUALIFIED
Izzy GarufiBrazilBernardo Dominic NEGOTIATION
Greenwood BologniaAustraliaXuxue Feng QUALIFIED
Greenwood BologniaSpainBernardo Dominic QUALIFIED
Kadeem FlosiGermanyAnna Fali UNQUALIFIED
Faith GillianBrazilIoni Bowcher QUALIFIED
Jeanfrancois VenereSpainAsiya Javayant PROPOSAL
Murillo MaletArgentinaXuxue Feng NEW
Wickens NestleBrazilAsiya Javayant QUALIFIED
Francesco ShinkoRussiaAnna Fali PROPOSAL
Arvin AlbaresUnited KingdomIoni Bowcher UNQUALIFIED
Faith GillianRussiaBernardo Dominic NEGOTIATION
Francesco ShinkoCanadaOnyama Limba UNQUALIFIED
Adams MorascaRussiaStephen Shaw NEGOTIATION
Costa DilliardRussiaStephen Shaw UNQUALIFIED
Wickens NestleCanadaBernardo Dominic QUALIFIED
Jennifer AmigonUnited KingdomAsiya Javayant NEW
Arvin AlbaresSpainAsiya Javayant NEW
Cody SaylorsIndiaElwin Sharvill RENEWAL
Francesco ShinkoUnited KingdomAsiya Javayant NEGOTIATION
Ivar PaprockiIndiaStephen Shaw PROPOSAL
Cody SaylorsFranceAnna Fali QUALIFIED
Jennifer AmigonUnited KingdomBernardo Dominic PROPOSAL
Isabel BowleyAustraliaOnyama Limba RENEWAL
Rodrigues CampainCanadaStephen Shaw PROPOSAL
Maria MarrierGermanyOnyama Limba PROPOSAL
Izzy GarufiSpainXuxue Feng NEW
Smith GlickSpainXuxue Feng UNQUALIFIED
Costa DilliardSpainOnyama Limba PROPOSAL
Alejandro PerinJapanStephen Shaw RENEWAL
Munro FerenczIndiaElwin Sharvill UNQUALIFIED
Julie StensethFranceOnyama Limba RENEWAL
Morrow RutaUnited KingdomAsiya Javayant NEGOTIATION
Johnson SergiSpainXuxue Feng PROPOSAL
Salvatore StockhamCanadaStephen Shaw RENEWAL
Costa DilliardAustraliaElwin Sharvill RENEWAL
Maria MarrierItalyBernardo Dominic NEW
Tony FollerAustraliaAnna Fali RENEWAL
Nicolas IturbideArgentinaIoni Bowcher QUALIFIED
Leja CaldareraFranceElwin Sharvill NEW
Darci PoquetteRussiaOnyama Limba RENEWAL
Kaitlin OstroskyFranceXuxue Feng QUALIFIED
Greenwood BologniaGermanyAmy Elsner UNQUALIFIED
Aruna FigeroaSpainAsiya Javayant NEGOTIATION
Maria MarrierJapanAsiya Javayant NEGOTIATION
Julie StensethArgentinaAnna Fali NEW
Nicolas IturbideUnited KingdomXuxue Feng QUALIFIED
Aika InouyeUnited KingdomOnyama Limba QUALIFIED
Aika InouyeArgentinaBernardo Dominic UNQUALIFIED
Juan WieserIndiaAsiya Javayant NEW
Horizontal
NameCountryRepresentativeStatus
Mujtaba NickaItalyAnna Fali UNQUALIFIED
Leja CaldareraCanadaElwin Sharvill UNQUALIFIED
Silvio SlusarskiCanadaStephen Shaw NEGOTIATION
Izzy GarufiRussiaIvan Magalhaes PROPOSAL
David DarakjySpainIoni Bowcher NEW
Adams MorascaSpainStephen Shaw UNQUALIFIED
Ashley DoeRussiaElwin Sharvill NEGOTIATION
Greenwood BologniaSpainIvan Magalhaes NEW
Sinclair WaycottCanadaIvan Magalhaes UNQUALIFIED
Maisha RulapaughJapanAnna Fali QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Julie StensethArgentina2025-06-17Morlong Associates PROPOSAL32Onyama Limba
1001Wickens NestleArgentina2025-07-06Truhlar And Truhlar Attys PROPOSAL24Xuxue Feng
1002Octavia MaletIndia2025-06-21Chapman, Ross E Esq PROPOSAL96Ioni Bowcher
1003Ashley DoeAustralia2025-06-17Feiner Bros PROPOSAL86Onyama Limba
1004Aruna FigeroaAustralia2025-06-28Printing Dimensions NEGOTIATION48Xuxue Feng
1005Aditya KuskoCanada2025-06-27Benton, John B Jr NEGOTIATION87Amy Elsner
1006Antonio CaudyFrance2025-07-03Dorl, James J Esq PROPOSAL57Xuxue Feng
1007Munro FerenczSpain2025-07-06Buckley Miller Wright NEW23Elwin Sharvill
1008Ivar PaprockiAustralia2025-07-08Chapman, Ross E Esq QUALIFIED83Bernardo Dominic
1009Deepesh ChuiArgentina2025-07-03Morlong Associates NEW17Ivan Magalhaes
1010Kadeem FlosiBrazil2025-07-10Chemel, James L Cpa PROPOSAL98Elwin Sharvill
1011Wickens NestleGermany2025-06-21Feltz Printing Service QUALIFIED15Amy Elsner
1012Adams MorascaSpain2025-06-17Chapman, Ross E Esq NEW49Anna Fali
1013Francesco ShinkoUnited Kingdom2025-07-10Buckley Miller Wright RENEWAL7Elwin Sharvill
1014Aruna FigeroaRussia2025-07-08Rangoni Of Florence NEGOTIATION32Onyama Limba
1015Isabel BowleyUnited Kingdom2025-06-18Printing Dimensions UNQUALIFIED73Ioni Bowcher
1016Stacey MacleadArgentina2025-06-21Morlong Associates QUALIFIED58Ioni Bowcher
1017Misaki RoysterArgentina2025-06-19Commercial Press RENEWAL86Ivan Magalhaes
1018Munro FerenczIndia2025-06-21Truhlar And Truhlar Attys RENEWAL37Amy Elsner
1019Adams MorascaArgentina2025-06-14King, Christopher A Esq UNQUALIFIED21Onyama Limba
1020Chavez BriddickItaly2025-06-19King, Christopher A Esq RENEWAL56Xuxue Feng
1021Murillo MaletIndia2025-06-20Chemel, James L Cpa UNQUALIFIED93Anna Fali
1022Mujtaba NickaBrazil2025-06-19Chanay, Jeffrey A Esq RENEWAL76Xuxue Feng
1023Emily WhobreyIndia2025-07-11Rousseaux, Michael Esq UNQUALIFIED46Anna Fali
1024Kadeem FlosiRussia2025-07-05Truhlar And Truhlar Attys RENEWAL61Amy Elsner
1025Aika InouyeCanada2025-06-29Feltz Printing Service NEGOTIATION1Stephen Shaw
1026Kaitlin OstroskyUnited Kingdom2025-07-11Commercial Press RENEWAL96Ioni Bowcher
1027Ricardo GauchoJapan2025-07-04Morlong Associates UNQUALIFIED57Asiya Javayant
1028Mujtaba NickaUnited Kingdom2025-07-04Dorl, James J Esq QUALIFIED7Stephen Shaw
1029Octavia MaletFrance2025-07-10Feltz Printing Service QUALIFIED95Ivan Magalhaes
1030Alejandro PerinRussia2025-06-12Rousseaux, Michael Esq UNQUALIFIED56Ivan Magalhaes
1031Johnson SergiSpain2025-07-02Benton, John B Jr NEW23Asiya Javayant
1032Octavia MaletUnited Kingdom2025-06-29Benton, John B Jr RENEWAL31Asiya Javayant
1033Deepesh ChuiCanada2025-06-20Rangoni Of Florence RENEWAL14Ioni Bowcher
1034Kaitlin OstroskyItaly2025-06-24Truhlar And Truhlar Attys NEW6Anna Fali
1035Silvio SlusarskiRussia2025-06-17Commercial Press QUALIFIED83Ioni Bowcher
1036Antonio CaudyUnited Kingdom2025-06-17Truhlar And Truhlar Attys UNQUALIFIED29Stephen Shaw
1037Aditya KuskoRussia2025-07-01Chapman, Ross E Esq QUALIFIED27Ioni Bowcher
1038Adams MorascaUnited Kingdom2025-06-26Buckley Miller Wright NEGOTIATION6Amy Elsner
1039Ashley DoeBrazil2025-07-08Feiner Bros RENEWAL96Ivan Magalhaes
1040Jefferson SchemmerJapan2025-06-22Feltz Printing Service RENEWAL10Ivan Magalhaes
1041Deepesh ChuiUnited Kingdom2025-06-22Morlong Associates PROPOSAL4Anna Fali
1042Jennifer AmigonSpain2025-06-13Dorl, James J Esq UNQUALIFIED27Xuxue Feng
1043Julie StensethUnited Kingdom2025-06-20Printing Dimensions NEGOTIATION4Anna Fali
1044Sinclair WaycottUnited Kingdom2025-07-04King, Christopher A Esq RENEWAL31Bernardo Dominic
1045Arvin AlbaresRussia2025-06-12Commercial Press RENEWAL27Elwin Sharvill
1046Cody SaylorsJapan2025-06-20Buckley Miller Wright PROPOSAL50Ioni Bowcher
1047Cody SaylorsArgentina2025-06-27Morlong Associates NEW81Stephen Shaw
1048Faith GillianIndia2025-06-25King, Christopher A Esq UNQUALIFIED51Ioni Bowcher
1049Juan WieserArgentina2025-07-02Feltz Printing Service NEW88Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Izzy GarufiItalyStephen Shaw NEW
Jefferson SchemmerSpainIvan Magalhaes QUALIFIED
Silvio SlusarskiAustraliaElwin Sharvill NEW
Costa DilliardUnited KingdomAmy Elsner PROPOSAL
Ashley DoeRussiaIvan Magalhaes RENEWAL
Morrow RutaFranceOnyama Limba UNQUALIFIED
Cody SaylorsRussiaIvan Magalhaes RENEWAL
Arvin AlbaresJapanAnna Fali QUALIFIED
Ashley DoeGermanyBernardo Dominic PROPOSAL
Mujtaba NickaJapanAnna Fali UNQUALIFIED
Aruna FigeroaArgentinaIoni Bowcher UNQUALIFIED
Alejandro PerinArgentinaAnna Fali NEGOTIATION
Sinclair WaycottCanadaElwin Sharvill UNQUALIFIED
Julie StensethFranceAnna Fali NEW
Ashley DoeSpainAnna Fali NEW
Mayumi KolmetzCanadaStephen Shaw PROPOSAL
Johnson SergiSpainElwin Sharvill RENEWAL
Ricardo GauchoBrazilXuxue Feng PROPOSAL
Kadeem FlosiAustraliaIoni Bowcher NEGOTIATION
Wickens NestleRussiaBernardo Dominic PROPOSAL
Maria MarrierIndiaElwin Sharvill UNQUALIFIED
Johnson SergiBrazilIvan Magalhaes RENEWAL
Murillo MaletBrazilAmy Elsner UNQUALIFIED
Emily WhobreyArgentinaIoni Bowcher NEW
Izzy GarufiItalyIoni Bowcher RENEWAL
Chavez BriddickBrazilAsiya Javayant PROPOSAL
Murillo MaletJapanAsiya Javayant NEW
Octavia MaletSpainXuxue Feng UNQUALIFIED
Maria MarrierGermanyBernardo Dominic NEGOTIATION
Deepesh ChuiJapanXuxue Feng QUALIFIED
Julie StensethFranceIvan Magalhaes NEW
David DarakjyJapanOnyama Limba PROPOSAL
Chavez BriddickUnited KingdomAnna Fali RENEWAL
Clifford RimAustraliaAsiya Javayant NEW
Francesco ShinkoFranceElwin Sharvill PROPOSAL
Ricardo GauchoCanadaAnna Fali NEW
Aruna FigeroaBrazilElwin Sharvill QUALIFIED
Deepesh ChuiItalyIvan Magalhaes QUALIFIED
David DarakjySpainAsiya Javayant NEGOTIATION
Silvio SlusarskiUnited KingdomIvan Magalhaes UNQUALIFIED
Wickens NestleRussiaElwin Sharvill QUALIFIED
Jones VocelkaSpainStephen Shaw UNQUALIFIED
Johnson SergiItalyElwin Sharvill NEW
Ashley DoeIndiaStephen Shaw UNQUALIFIED
Smith GlickUnited KingdomIoni Bowcher NEW
Misaki RoysterJapanAnna Fali QUALIFIED
Izzy GarufiRussiaBernardo Dominic RENEWAL
Cody SaylorsCanadaStephen Shaw NEGOTIATION
Izzy GarufiAustraliaAmy Elsner UNQUALIFIED
Aditya KuskoCanadaElwin Sharvill UNQUALIFIED
Frozen Columns
Name
Sinclair Waycott
Francesco Shinko
Jefferson Schemmer
Wickens Nestle
Jones Vocelka
Murillo Malet
Silvio Slusarski
Silvio Slusarski
Faith Gillian
Munro Ferencz
Kaitlin Ostrosky
Nicolas Iturbide
Isabel Bowley
Darci Poquette
Francesco Shinko
Ricardo Gaucho
Juan Wieser
Clifford Rim
Julie Stenseth
David Darakjy
Izzy Garufi
Jefferson Schemmer
Tony Foller
Claire Tollner
Maria Marrier
Ivar Paprocki
James Butt
Smith Glick
Faith Gillian
Octavia Malet
Clifford Rim
Julie Stenseth
Cody Saylors
Octavia Malet
Deepesh Chui
Rodrigues Campain
Aika Inouye
Octavia Malet
Faith Gillian
Izzy Garufi
Adams Morasca
Leja Caldarera
Aika Inouye
Aika Inouye
Wickens Nestle
Aruna Figeroa
Maisha Rulapaugh
Wickens Nestle
Izzy Garufi
David Darakjy
IdCountryDate
1000Japan2025-06-16
1001United Kingdom2025-06-28
1002France2025-07-07
1003Australia2025-07-06
1004Germany2025-06-12
1005Italy2025-07-03
1006Australia2025-06-28
1007Argentina2025-06-12
1008Australia2025-06-18
1009Canada2025-06-15
1010Japan2025-06-13
1011Australia2025-07-09
1012Brazil2025-06-28
1013Brazil2025-07-04
1014Australia2025-06-21
1015Brazil2025-06-26
1016Russia2025-06-20
1017France2025-06-27
1018Canada2025-06-22
1019Brazil2025-06-29
1020Russia2025-06-25
1021United Kingdom2025-07-06
1022Russia2025-06-30
1023Germany2025-07-07
1024Italy2025-06-23
1025Canada2025-06-15
1026India2025-06-25
1027Brazil2025-07-05
1028Spain2025-06-28
1029Brazil2025-06-14
1030France2025-07-10
1031India2025-06-13
1032Russia2025-07-08
1033France2025-07-08
1034Spain2025-06-23
1035Brazil2025-06-27
1036Canada2025-06-14
1037Spain2025-07-05
1038Italy2025-06-14
1039France2025-06-20
1040India2025-07-11
1041Italy2025-06-29
1042Japan2025-07-10
1043Brazil2025-06-20
1044Spain2025-06-20
1045Brazil2025-06-24
1046Japan2025-06-13
1047Russia2025-06-15
1048Australia2025-06-19
1049India2025-06-18

On-Demand Data

NameIdCountryDate
Salvatore Stockham1000Brazil2025-06-16
Greenwood Bolognia1001Australia2025-06-30
Maria Marrier1002Germany2025-07-02
Johnson Sergi1003United Kingdom2025-06-15
Kaitlin Ostrosky1004India2025-06-12
Sinclair Waycott1005Russia2025-06-30
Tony Foller1006Spain2025-06-14
Rodrigues Campain1007Russia2025-06-30
Izzy Garufi1008Canada2025-06-25
Aditya Kusko1009Germany2025-07-07
Izzy Garufi1010Japan2025-06-14
Isabel Bowley1011Argentina2025-06-27
Chavez Briddick1012Russia2025-06-28
Deepesh Chui1013Spain2025-06-29
Ashley Doe1014Australia2025-06-16
Rodrigues Campain1015Spain2025-06-29
Jones Vocelka1016Japan2025-07-05
Jennifer Amigon1017Germany2025-06-24
Johnson Sergi1018United Kingdom2025-06-29
Jennifer Amigon1019Australia2025-06-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Tony FollerSpainElwin Sharvill QUALIFIED
Murillo MaletIndiaElwin Sharvill RENEWAL
Alejandro PerinSpainXuxue Feng RENEWAL
Leja CaldareraCanadaBernardo Dominic RENEWAL
Clifford RimItalyAnna Fali QUALIFIED
Aruna FigeroaItalyIvan Magalhaes UNQUALIFIED
Mujtaba NickaBrazilIvan Magalhaes NEGOTIATION
Mayumi KolmetzGermanyBernardo Dominic RENEWAL
Julie StensethBrazilBernardo Dominic RENEWAL
Darci PoquetteBrazilStephen Shaw QUALIFIED
Maisha RulapaughJapanBernardo Dominic NEGOTIATION
Darci PoquetteRussiaOnyama Limba PROPOSAL
Ivar PaprockiCanadaAsiya Javayant NEGOTIATION
Murillo MaletUnited KingdomIvan Magalhaes PROPOSAL
Jefferson SchemmerRussiaXuxue Feng QUALIFIED
Mujtaba NickaItalyXuxue Feng PROPOSAL
Kadeem FlosiAustraliaElwin Sharvill QUALIFIED
Salvatore StockhamRussiaStephen Shaw NEGOTIATION
Morrow RutaBrazilOnyama Limba QUALIFIED
Nicolas IturbideSpainStephen Shaw UNQUALIFIED
Jones VocelkaSpainAnna Fali NEGOTIATION
Maria MarrierBrazilStephen Shaw NEW
Cody SaylorsSpainBernardo Dominic UNQUALIFIED
Aika InouyeIndiaIvan Magalhaes UNQUALIFIED
David DarakjyFranceBernardo Dominic RENEWAL
Faith GillianItalyIvan Magalhaes UNQUALIFIED
Faith GillianBrazilAnna Fali PROPOSAL
Munro FerenczIndiaOnyama Limba RENEWAL
Kaitlin OstroskyRussiaElwin Sharvill RENEWAL
Murillo MaletAustraliaAnna Fali NEW
Tony FollerJapanStephen Shaw QUALIFIED
Kadeem FlosiJapanIoni Bowcher NEW
Murillo MaletItalyStephen Shaw NEGOTIATION
Octavia MaletRussiaStephen Shaw RENEWAL
Izzy GarufiJapanAnna Fali QUALIFIED
Maria MarrierArgentinaIvan Magalhaes NEGOTIATION
Maisha RulapaughIndiaIvan Magalhaes PROPOSAL
Wickens NestleSpainAnna Fali PROPOSAL
Claire TollnerGermanyIoni Bowcher RENEWAL
Morrow RutaRussiaIvan Magalhaes 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>