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
Rodrigues CampainCanadaAnna Fali UNQUALIFIED
James ButtBrazilElwin Sharvill PROPOSAL
Claire TollnerItalyXuxue Feng RENEWAL
Rodrigues CampainSpainElwin Sharvill RENEWAL
Stacey MacleadSpainAmy Elsner UNQUALIFIED
Darci PoquetteBrazilAsiya Javayant NEW
Mayumi KolmetzFranceAnna Fali NEGOTIATION
Kaitlin OstroskyUnited KingdomStephen Shaw NEGOTIATION
Mujtaba NickaRussiaAnna Fali NEGOTIATION
Rodrigues CampainBrazilOnyama Limba QUALIFIED
Arvin AlbaresBrazilAsiya Javayant NEGOTIATION
Sinclair WaycottBrazilXuxue Feng NEGOTIATION
Maria MarrierArgentinaElwin Sharvill UNQUALIFIED
Aika InouyeRussiaIvan Magalhaes NEGOTIATION
Cody SaylorsFranceAsiya Javayant RENEWAL
Greenwood BologniaBrazilAnna Fali PROPOSAL
Mayumi KolmetzIndiaXuxue Feng NEGOTIATION
Claire TollnerCanadaBernardo Dominic NEW
Clifford RimRussiaBernardo Dominic UNQUALIFIED
Leon OldroydSpainAsiya Javayant QUALIFIED
Maria MarrierItalyAsiya Javayant NEW
Francesco ShinkoFranceElwin Sharvill QUALIFIED
Ivar PaprockiRussiaAsiya Javayant RENEWAL
Maisha RulapaughItalyBernardo Dominic RENEWAL
Juan WieserIndiaOnyama Limba PROPOSAL
David DarakjyItalyElwin Sharvill NEGOTIATION
Arvin AlbaresItalyElwin Sharvill RENEWAL
Aditya KuskoArgentinaAsiya Javayant PROPOSAL
Ricardo GauchoSpainIvan Magalhaes PROPOSAL
Rodrigues CampainItalyOnyama Limba RENEWAL
Faith GillianSpainElwin Sharvill UNQUALIFIED
Alejandro PerinItalyOnyama Limba UNQUALIFIED
Chavez BriddickBrazilStephen Shaw UNQUALIFIED
Jennifer AmigonSpainAnna Fali UNQUALIFIED
Murillo MaletItalyIoni Bowcher RENEWAL
Adams MorascaGermanyIvan Magalhaes NEW
Maisha RulapaughItalyElwin Sharvill UNQUALIFIED
Mayumi KolmetzSpainXuxue Feng UNQUALIFIED
Jefferson SchemmerItalyIvan Magalhaes QUALIFIED
Stacey MacleadSpainAsiya Javayant UNQUALIFIED
Ashley DoeCanadaStephen Shaw UNQUALIFIED
Aruna FigeroaRussiaIvan Magalhaes NEGOTIATION
Leon OldroydJapanIoni Bowcher PROPOSAL
Ivar PaprockiAustraliaAnna Fali UNQUALIFIED
Juan WieserIndiaIvan Magalhaes QUALIFIED
Jones VocelkaCanadaAsiya Javayant UNQUALIFIED
Morrow RutaSpainAnna Fali UNQUALIFIED
Darci PoquetteBrazilBernardo Dominic NEW
Aruna FigeroaItalyIoni Bowcher UNQUALIFIED
Chavez BriddickCanadaAmy Elsner NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Aruna FigeroaGermanyOnyama Limba PROPOSAL
Jennifer AmigonSpainStephen Shaw UNQUALIFIED
Claire TollnerUnited KingdomElwin Sharvill QUALIFIED
Sinclair WaycottFranceElwin Sharvill UNQUALIFIED
Ashley DoeArgentinaIvan Magalhaes QUALIFIED
Jones VocelkaAustraliaIoni Bowcher QUALIFIED
James ButtBrazilAsiya Javayant PROPOSAL
David DarakjySpainIoni Bowcher QUALIFIED
Nicolas IturbideAustraliaAsiya Javayant NEW
Clifford RimUnited KingdomIoni Bowcher QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Sinclair WaycottItaly2025-10-20Chemel, James L Cpa QUALIFIED39Ivan Magalhaes
1001Adams MorascaSpain2025-10-30Feiner Bros UNQUALIFIED27Asiya Javayant
1002Aditya KuskoFrance2025-10-30Truhlar And Truhlar Attys RENEWAL57Bernardo Dominic
1003Maisha RulapaughSpain2025-10-13King, Christopher A Esq QUALIFIED46Ioni Bowcher
1004Maria MarrierRussia2025-10-22Feiner Bros NEGOTIATION26Stephen Shaw
1005Stacey MacleadSpain2025-10-11Truhlar And Truhlar Attys NEW91Ioni Bowcher
1006Jones VocelkaIndia2025-10-27Commercial Press NEGOTIATION77Xuxue Feng
1007Tony FollerSpain2025-10-11Dorl, James J Esq NEGOTIATION5Anna Fali
1008Chavez BriddickGermany2025-11-03Rousseaux, Michael Esq QUALIFIED84Stephen Shaw
1009Costa DilliardGermany2025-10-30Dorl, James J Esq RENEWAL81Onyama Limba
1010Misaki RoysterArgentina2025-10-08Truhlar And Truhlar Attys NEW31Ioni Bowcher
1011Cody SaylorsUnited Kingdom2025-10-13Printing Dimensions NEGOTIATION19Asiya Javayant
1012Munro FerenczJapan2025-10-20Rangoni Of Florence NEW72Anna Fali
1013Isabel BowleyBrazil2025-10-30Buckley Miller Wright UNQUALIFIED70Amy Elsner
1014Juan WieserJapan2025-11-05Chemel, James L Cpa NEGOTIATION23Stephen Shaw
1015Octavia MaletArgentina2025-10-12Chapman, Ross E Esq RENEWAL87Ivan Magalhaes
1016Juan WieserSpain2025-11-06Morlong Associates PROPOSAL19Amy Elsner
1017Kaitlin OstroskyUnited Kingdom2025-10-14Printing Dimensions PROPOSAL1Elwin Sharvill
1018Claire TollnerJapan2025-10-18Chemel, James L Cpa NEW31Anna Fali
1019Maisha RulapaughJapan2025-11-02Commercial Press PROPOSAL77Ioni Bowcher
1020Sinclair WaycottUnited Kingdom2025-11-03Chapman, Ross E Esq RENEWAL83Onyama Limba
1021Aika InouyeRussia2025-10-19Dorl, James J Esq NEGOTIATION61Anna Fali
1022Jeanfrancois VenereIndia2025-10-17Dorl, James J Esq NEGOTIATION51Amy Elsner
1023Clifford RimItaly2025-10-24Buckley Miller Wright UNQUALIFIED82Onyama Limba
1024Aditya KuskoItaly2025-11-06Printing Dimensions RENEWAL52Bernardo Dominic
1025Aditya KuskoIndia2025-10-19Chapman, Ross E Esq PROPOSAL65Xuxue Feng
1026Ricardo GauchoRussia2025-10-26Benton, John B Jr QUALIFIED92Elwin Sharvill
1027Mayumi KolmetzArgentina2025-10-22Chanay, Jeffrey A Esq PROPOSAL33Elwin Sharvill
1028Leja CaldareraJapan2025-10-28Printing Dimensions QUALIFIED27Onyama Limba
1029Misaki RoysterIndia2025-11-03Commercial Press UNQUALIFIED87Onyama Limba
1030Mujtaba NickaArgentina2025-11-05Rangoni Of Florence NEGOTIATION10Ioni Bowcher
1031Stacey MacleadArgentina2025-10-29Printing Dimensions RENEWAL77Onyama Limba
1032Greenwood BologniaCanada2025-10-11Buckley Miller Wright NEW83Elwin Sharvill
1033Munro FerenczIndia2025-10-08Truhlar And Truhlar Attys QUALIFIED53Onyama Limba
1034Darci PoquetteSpain2025-10-11Truhlar And Truhlar Attys NEW96Amy Elsner
1035Johnson SergiRussia2025-10-24Chanay, Jeffrey A Esq UNQUALIFIED48Amy Elsner
1036Stacey MacleadArgentina2025-11-02Chemel, James L Cpa QUALIFIED25Onyama Limba
1037Wickens NestleBrazil2025-10-13Chapman, Ross E Esq NEGOTIATION92Anna Fali
1038Smith GlickFrance2025-11-05Chapman, Ross E Esq NEW85Stephen Shaw
1039Deepesh ChuiCanada2025-10-22Commercial Press RENEWAL47Ioni Bowcher
1040Claire TollnerCanada2025-11-03Feltz Printing Service PROPOSAL87Stephen Shaw
1041Rodrigues CampainAustralia2025-11-06Feiner Bros PROPOSAL39Ivan Magalhaes
1042Murillo MaletAustralia2025-10-11Chemel, James L Cpa NEGOTIATION97Onyama Limba
1043Jefferson SchemmerBrazil2025-10-08Commercial Press PROPOSAL5Bernardo Dominic
1044Mujtaba NickaUnited Kingdom2025-10-15Buckley Miller Wright UNQUALIFIED65Bernardo Dominic
1045Arvin AlbaresUnited Kingdom2025-10-29Commercial Press RENEWAL46Onyama Limba
1046Jefferson SchemmerRussia2025-11-06Morlong Associates NEGOTIATION77Elwin Sharvill
1047Leja CaldareraAustralia2025-10-12Chanay, Jeffrey A Esq NEW53Bernardo Dominic
1048Darci PoquetteCanada2025-10-21Printing Dimensions NEW11Xuxue Feng
1049Costa DilliardJapan2025-10-18Dorl, James J Esq NEGOTIATION1Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Alejandro PerinCanadaOnyama Limba PROPOSAL
Jennifer AmigonBrazilElwin Sharvill PROPOSAL
Cody SaylorsRussiaAnna Fali PROPOSAL
Chavez BriddickGermanyIvan Magalhaes QUALIFIED
Wickens NestleFranceStephen Shaw NEW
Johnson SergiItalyAmy Elsner RENEWAL
Ashley DoeArgentinaAnna Fali UNQUALIFIED
Chavez BriddickBrazilStephen Shaw RENEWAL
Julie StensethSpainXuxue Feng UNQUALIFIED
Alejandro PerinArgentinaOnyama Limba QUALIFIED
Jeanfrancois VenereGermanyIoni Bowcher RENEWAL
Costa DilliardGermanyIoni Bowcher RENEWAL
Silvio SlusarskiJapanStephen Shaw QUALIFIED
Isabel BowleyIndiaBernardo Dominic UNQUALIFIED
Ivar PaprockiRussiaOnyama Limba NEGOTIATION
Rodrigues CampainGermanyAnna Fali QUALIFIED
Izzy GarufiCanadaOnyama Limba UNQUALIFIED
Nicolas IturbideRussiaAsiya Javayant RENEWAL
Deepesh ChuiGermanyIoni Bowcher RENEWAL
Maria MarrierCanadaOnyama Limba UNQUALIFIED
Munro FerenczArgentinaAsiya Javayant RENEWAL
Jennifer AmigonItalyXuxue Feng NEGOTIATION
Rodrigues CampainGermanyStephen Shaw QUALIFIED
Isabel BowleyIndiaElwin Sharvill NEW
Francesco ShinkoCanadaAsiya Javayant PROPOSAL
Smith GlickSpainStephen Shaw RENEWAL
Nicolas IturbideItalyAnna Fali NEW
Johnson SergiGermanyIoni Bowcher NEGOTIATION
Leja CaldareraUnited KingdomStephen Shaw PROPOSAL
Wickens NestleSpainAmy Elsner NEGOTIATION
Francesco ShinkoAustraliaElwin Sharvill PROPOSAL
Francesco ShinkoJapanXuxue Feng NEW
James ButtFranceAnna Fali NEW
Alejandro PerinCanadaIoni Bowcher PROPOSAL
Chavez BriddickBrazilStephen Shaw NEW
Maisha RulapaughBrazilAmy Elsner QUALIFIED
Francesco ShinkoUnited KingdomStephen Shaw NEGOTIATION
Leja CaldareraGermanyXuxue Feng NEGOTIATION
Wickens NestleAustraliaAmy Elsner NEW
Ashley DoeBrazilStephen Shaw QUALIFIED
Ivar PaprockiJapanBernardo Dominic UNQUALIFIED
Munro FerenczCanadaStephen Shaw QUALIFIED
Clifford RimArgentinaBernardo Dominic UNQUALIFIED
David DarakjyArgentinaOnyama Limba NEW
Salvatore StockhamArgentinaStephen Shaw NEGOTIATION
Aika InouyeCanadaAmy Elsner UNQUALIFIED
Salvatore StockhamSpainIvan Magalhaes QUALIFIED
Greenwood BologniaItalyAsiya Javayant PROPOSAL
Maria MarrierGermanyIoni Bowcher QUALIFIED
Jeanfrancois VenereUnited KingdomIoni Bowcher NEW
Frozen Columns
Name
Aruna Figeroa
Ricardo Gaucho
Leja Caldarera
David Darakjy
Alejandro Perin
Francesco Shinko
Chavez Briddick
Rodrigues Campain
Arvin Albares
Francesco Shinko
Ivar Paprocki
Mayumi Kolmetz
Nicolas Iturbide
Francesco Shinko
Isabel Bowley
Isabel Bowley
Aika Inouye
Maisha Rulapaugh
Ricardo Gaucho
Jefferson Schemmer
Aditya Kusko
Emily Whobrey
Arvin Albares
Tony Foller
Kadeem Flosi
Octavia Malet
Nicolas Iturbide
Chavez Briddick
Greenwood Bolognia
Clifford Rim
Deepesh Chui
Antonio Caudy
Jones Vocelka
Clifford Rim
Kaitlin Ostrosky
Salvatore Stockham
Munro Ferencz
Leon Oldroyd
Maisha Rulapaugh
Aruna Figeroa
Aditya Kusko
Kaitlin Ostrosky
Ricardo Gaucho
Aika Inouye
Kaitlin Ostrosky
Isabel Bowley
Aditya Kusko
Juan Wieser
Cody Saylors
Alejandro Perin
IdCountryDate
1000Argentina2025-11-04
1001Japan2025-11-05
1002Australia2025-10-20
1003Spain2025-10-26
1004Australia2025-10-23
1005Australia2025-11-06
1006France2025-10-23
1007Italy2025-10-23
1008Germany2025-11-06
1009Germany2025-11-04
1010India2025-11-02
1011Brazil2025-10-12
1012United Kingdom2025-11-02
1013India2025-10-15
1014United Kingdom2025-10-08
1015Russia2025-11-06
1016Brazil2025-10-23
1017Italy2025-10-09
1018United Kingdom2025-10-15
1019Australia2025-10-10
1020Russia2025-10-21
1021Australia2025-11-03
1022Argentina2025-10-13
1023Germany2025-10-17
1024Russia2025-10-17
1025United Kingdom2025-10-22
1026United Kingdom2025-10-25
1027Italy2025-10-20
1028Australia2025-11-01
1029Australia2025-10-19
1030Brazil2025-10-09
1031Argentina2025-10-24
1032United Kingdom2025-10-17
1033India2025-10-13
1034Australia2025-10-14
1035Germany2025-10-17
1036Italy2025-10-22
1037Canada2025-10-22
1038Japan2025-10-27
1039Russia2025-10-27
1040Spain2025-10-11
1041Spain2025-11-03
1042Australia2025-10-27
1043Russia2025-10-22
1044Japan2025-10-27
1045Canada2025-10-23
1046Italy2025-11-05
1047Canada2025-10-09
1048Canada2025-10-11
1049France2025-11-02

On-Demand Data

NameIdCountryDate
Claire Tollner1000Germany2025-10-29
Antonio Caudy1001United Kingdom2025-11-04
Adams Morasca1002Brazil2025-11-04
Wickens Nestle1003Russia2025-11-04
Julie Stenseth1004Italy2025-11-02
Julie Stenseth1005Russia2025-11-03
Johnson Sergi1006Germany2025-10-19
Jennifer Amigon1007Spain2025-11-05
Izzy Garufi1008Italy2025-10-20
Jennifer Amigon1009Italy2025-10-20
Sinclair Waycott1010Italy2025-10-26
Misaki Royster1011Italy2025-10-16
David Darakjy1012France2025-10-15
Leja Caldarera1013France2025-10-17
Murillo Malet1014Argentina2025-10-18
Tony Foller1015Canada2025-11-01
Aditya Kusko1016Japan2025-10-21
Jennifer Amigon1017Australia2025-10-10
Francesco Shinko1018Italy2025-10-12
Nicolas Iturbide1019Russia2025-10-28
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Munro FerenczUnited KingdomIoni Bowcher PROPOSAL
Ashley DoeBrazilIvan Magalhaes QUALIFIED
Julie StensethItalyElwin Sharvill NEGOTIATION
Tony FollerArgentinaBernardo Dominic NEW
Aika InouyeGermanyAmy Elsner PROPOSAL
Adams MorascaUnited KingdomStephen Shaw RENEWAL
Antonio CaudyGermanyOnyama Limba NEGOTIATION
Wickens NestleSpainElwin Sharvill QUALIFIED
Greenwood BologniaIndiaOnyama Limba PROPOSAL
Isabel BowleyItalyAsiya Javayant QUALIFIED
Rodrigues CampainCanadaAnna Fali UNQUALIFIED
Chavez BriddickAustraliaElwin Sharvill NEW
David DarakjyArgentinaElwin Sharvill NEW
Juan WieserBrazilStephen Shaw UNQUALIFIED
Costa DilliardFranceAmy Elsner PROPOSAL
Maisha RulapaughUnited KingdomOnyama Limba UNQUALIFIED
Ashley DoeCanadaOnyama Limba RENEWAL
Francesco ShinkoIndiaIvan Magalhaes NEW
Aika InouyeSpainElwin Sharvill UNQUALIFIED
Aruna FigeroaFranceAmy Elsner RENEWAL
Izzy GarufiUnited KingdomStephen Shaw PROPOSAL
Cody SaylorsAustraliaAmy Elsner UNQUALIFIED
Chavez BriddickGermanyIvan Magalhaes NEW
Alejandro PerinSpainOnyama Limba PROPOSAL
Julie StensethArgentinaElwin Sharvill NEGOTIATION
Francesco ShinkoItalyAmy Elsner PROPOSAL
Munro FerenczIndiaElwin Sharvill QUALIFIED
Smith GlickArgentinaStephen Shaw RENEWAL
Sinclair WaycottUnited KingdomBernardo Dominic NEGOTIATION
Ivar PaprockiArgentinaIvan Magalhaes NEGOTIATION
Sinclair WaycottIndiaElwin Sharvill QUALIFIED
Kaitlin OstroskyIndiaAsiya Javayant RENEWAL
Mujtaba NickaGermanyStephen Shaw QUALIFIED
Ivar PaprockiFranceIvan Magalhaes UNQUALIFIED
Greenwood BologniaRussiaOnyama Limba RENEWAL
Jeanfrancois VenereCanadaAnna Fali UNQUALIFIED
Jeanfrancois VenereJapanIvan Magalhaes UNQUALIFIED
Leja CaldareraArgentinaOnyama Limba QUALIFIED
Aruna FigeroaIndiaIoni Bowcher NEW
Smith GlickIndiaIoni Bowcher 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>