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
Deepesh ChuiSpainIoni Bowcher QUALIFIED
James ButtSpainIvan Magalhaes QUALIFIED
Juan WieserSpainElwin Sharvill NEGOTIATION
Juan WieserArgentinaAmy Elsner PROPOSAL
Deepesh ChuiFranceIoni Bowcher RENEWAL
Kadeem FlosiFranceAnna Fali NEW
Alejandro PerinRussiaBernardo Dominic RENEWAL
Johnson SergiUnited KingdomAmy Elsner PROPOSAL
Sinclair WaycottGermanyIvan Magalhaes UNQUALIFIED
Deepesh ChuiJapanStephen Shaw NEGOTIATION
Chavez BriddickSpainBernardo Dominic PROPOSAL
Deepesh ChuiCanadaElwin Sharvill NEW
Silvio SlusarskiJapanXuxue Feng QUALIFIED
Jennifer AmigonArgentinaAmy Elsner NEW
Tony FollerRussiaAnna Fali NEGOTIATION
Deepesh ChuiBrazilIvan Magalhaes QUALIFIED
Ivar PaprockiSpainBernardo Dominic NEGOTIATION
Leja CaldareraJapanAmy Elsner PROPOSAL
James ButtJapanOnyama Limba QUALIFIED
Deepesh ChuiAustraliaElwin Sharvill NEW
Salvatore StockhamSpainStephen Shaw PROPOSAL
Tony FollerArgentinaIoni Bowcher RENEWAL
Salvatore StockhamFranceAnna Fali QUALIFIED
Isabel BowleyCanadaAnna Fali QUALIFIED
Murillo MaletJapanOnyama Limba PROPOSAL
Jeanfrancois VenereJapanOnyama Limba PROPOSAL
Kaitlin OstroskyArgentinaStephen Shaw RENEWAL
Jeanfrancois VenereJapanAnna Fali RENEWAL
Wickens NestleGermanyAsiya Javayant UNQUALIFIED
Juan WieserFranceBernardo Dominic UNQUALIFIED
Munro FerenczArgentinaAnna Fali NEW
Arvin AlbaresRussiaOnyama Limba RENEWAL
Francesco ShinkoItalyXuxue Feng RENEWAL
Mayumi KolmetzFranceElwin Sharvill PROPOSAL
Mujtaba NickaIndiaIvan Magalhaes UNQUALIFIED
Nicolas IturbideAustraliaAmy Elsner QUALIFIED
Munro FerenczCanadaBernardo Dominic PROPOSAL
Alejandro PerinIndiaAmy Elsner QUALIFIED
Julie StensethSpainAnna Fali PROPOSAL
Deepesh ChuiJapanOnyama Limba RENEWAL
Sinclair WaycottCanadaBernardo Dominic RENEWAL
Sinclair WaycottFranceAsiya Javayant RENEWAL
Emily WhobreyUnited KingdomBernardo Dominic QUALIFIED
Smith GlickItalyAmy Elsner NEGOTIATION
Leja CaldareraIndiaBernardo Dominic PROPOSAL
Maisha RulapaughGermanyAsiya Javayant NEW
Salvatore StockhamArgentinaElwin Sharvill PROPOSAL
Faith GillianItalyXuxue Feng RENEWAL
Emily WhobreyCanadaAnna Fali NEW
Julie StensethGermanyAmy Elsner NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Izzy GarufiFranceStephen Shaw NEGOTIATION
Costa DilliardSpainStephen Shaw RENEWAL
Silvio SlusarskiJapanIvan Magalhaes RENEWAL
Morrow RutaArgentinaIvan Magalhaes PROPOSAL
Jeanfrancois VenereItalyOnyama Limba QUALIFIED
Aika InouyeRussiaIvan Magalhaes PROPOSAL
Maisha RulapaughArgentinaStephen Shaw NEW
James ButtGermanyStephen Shaw PROPOSAL
Aika InouyeCanadaAnna Fali NEGOTIATION
Ivar PaprockiSpainAnna Fali NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Mujtaba NickaJapan2026-05-24Buckley Miller Wright UNQUALIFIED12Asiya Javayant
1001Ricardo GauchoItaly2026-05-15Printing Dimensions NEGOTIATION13Elwin Sharvill
1002Rodrigues CampainBrazil2026-04-28Chapman, Ross E Esq QUALIFIED37Asiya Javayant
1003James ButtArgentina2026-05-08Buckley Miller Wright UNQUALIFIED44Bernardo Dominic
1004Stacey MacleadUnited Kingdom2026-05-17Chapman, Ross E Esq QUALIFIED3Bernardo Dominic
1005Costa DilliardFrance2026-05-04Feiner Bros PROPOSAL65Anna Fali
1006Alejandro PerinAustralia2026-05-12Rangoni Of Florence NEW14Elwin Sharvill
1007Isabel BowleyFrance2026-05-14Chemel, James L Cpa NEW9Ivan Magalhaes
1008Aruna FigeroaJapan2026-05-04Buckley Miller Wright NEGOTIATION71Ioni Bowcher
1009Johnson SergiUnited Kingdom2026-05-20Buckley Miller Wright NEGOTIATION27Stephen Shaw
1010Sinclair WaycottJapan2026-05-12Dorl, James J Esq QUALIFIED89Ioni Bowcher
1011Kaitlin OstroskyAustralia2026-05-19Buckley Miller Wright NEW61Stephen Shaw
1012Aditya KuskoJapan2026-05-01Feltz Printing Service QUALIFIED88Stephen Shaw
1013Munro FerenczRussia2026-05-17Truhlar And Truhlar Attys NEW39Onyama Limba
1014Alejandro PerinGermany2026-05-22King, Christopher A Esq NEGOTIATION77Xuxue Feng
1015Mayumi KolmetzCanada2026-04-26Feltz Printing Service PROPOSAL44Stephen Shaw
1016Jeanfrancois VenereAustralia2026-05-12Printing Dimensions QUALIFIED32Ivan Magalhaes
1017James ButtCanada2026-05-19Chanay, Jeffrey A Esq QUALIFIED34Anna Fali
1018Juan WieserCanada2026-05-22Chanay, Jeffrey A Esq NEW45Onyama Limba
1019Mujtaba NickaArgentina2026-05-09Chemel, James L Cpa PROPOSAL84Elwin Sharvill
1020Arvin AlbaresItaly2026-05-22Buckley Miller Wright PROPOSAL3Xuxue Feng
1021Kadeem FlosiCanada2026-04-27Chapman, Ross E Esq NEW44Asiya Javayant
1022Ivar PaprockiFrance2026-05-02King, Christopher A Esq PROPOSAL62Ioni Bowcher
1023Nicolas IturbideCanada2026-05-08Morlong Associates UNQUALIFIED51Amy Elsner
1024Munro FerenczBrazil2026-04-27Rousseaux, Michael Esq PROPOSAL58Ivan Magalhaes
1025Ricardo GauchoAustralia2026-05-16Rangoni Of Florence NEGOTIATION4Ivan Magalhaes
1026Faith GillianGermany2026-04-26Chanay, Jeffrey A Esq QUALIFIED40Stephen Shaw
1027Murillo MaletFrance2026-04-30Rangoni Of Florence NEGOTIATION95Onyama Limba
1028Stacey MacleadGermany2026-05-20Dorl, James J Esq NEGOTIATION59Amy Elsner
1029Stacey MacleadJapan2026-05-20King, Christopher A Esq NEGOTIATION39Bernardo Dominic
1030Isabel BowleyAustralia2026-05-10Rangoni Of Florence PROPOSAL77Stephen Shaw
1031Ashley DoeJapan2026-05-02Chemel, James L Cpa RENEWAL61Asiya Javayant
1032Leja CaldareraGermany2026-05-19Rousseaux, Michael Esq RENEWAL36Ivan Magalhaes
1033Izzy GarufiIndia2026-05-06Chemel, James L Cpa RENEWAL21Elwin Sharvill
1034Ivar PaprockiRussia2026-05-12Feltz Printing Service QUALIFIED65Bernardo Dominic
1035Murillo MaletItaly2026-05-09Truhlar And Truhlar Attys PROPOSAL0Anna Fali
1036Adams MorascaIndia2026-04-30Chemel, James L Cpa NEW36Ivan Magalhaes
1037Izzy GarufiJapan2026-05-18Printing Dimensions QUALIFIED21Onyama Limba
1038Johnson SergiCanada2026-05-12Truhlar And Truhlar Attys NEW22Amy Elsner
1039Juan WieserArgentina2026-05-18Printing Dimensions PROPOSAL3Elwin Sharvill
1040Francesco ShinkoItaly2026-05-25Printing Dimensions QUALIFIED23Xuxue Feng
1041Faith GillianUnited Kingdom2026-05-06Morlong Associates PROPOSAL93Elwin Sharvill
1042Nicolas IturbideSpain2026-05-24Chanay, Jeffrey A Esq RENEWAL41Onyama Limba
1043Aruna FigeroaRussia2026-05-04Truhlar And Truhlar Attys QUALIFIED59Xuxue Feng
1044Murillo MaletIndia2026-05-08Chanay, Jeffrey A Esq QUALIFIED87Onyama Limba
1045Wickens NestleRussia2026-05-22Chemel, James L Cpa NEGOTIATION85Ioni Bowcher
1046Greenwood BologniaBrazil2026-05-02Feiner Bros NEGOTIATION2Ivan Magalhaes
1047Maisha RulapaughAustralia2026-04-29Feltz Printing Service PROPOSAL6Stephen Shaw
1048Aditya KuskoCanada2026-05-14Chanay, Jeffrey A Esq NEW7Amy Elsner
1049Aika InouyeArgentina2026-05-20Chemel, James L Cpa NEW84Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Alejandro PerinAustraliaBernardo Dominic NEW
Chavez BriddickSpainElwin Sharvill NEGOTIATION
Mujtaba NickaJapanAmy Elsner QUALIFIED
Cody SaylorsAustraliaOnyama Limba QUALIFIED
Stacey MacleadIndiaIoni Bowcher QUALIFIED
Julie StensethBrazilBernardo Dominic PROPOSAL
Aika InouyeFranceIoni Bowcher QUALIFIED
David DarakjyCanadaIvan Magalhaes QUALIFIED
Maisha RulapaughUnited KingdomAnna Fali UNQUALIFIED
Izzy GarufiIndiaAsiya Javayant UNQUALIFIED
Isabel BowleyGermanyStephen Shaw UNQUALIFIED
Morrow RutaItalyIoni Bowcher NEW
Aika InouyeJapanAnna Fali NEGOTIATION
Greenwood BologniaSpainXuxue Feng QUALIFIED
Deepesh ChuiRussiaIvan Magalhaes PROPOSAL
Deepesh ChuiUnited KingdomAnna Fali QUALIFIED
Jones VocelkaSpainIoni Bowcher NEW
Jeanfrancois VenereRussiaAnna Fali QUALIFIED
Jeanfrancois VenereFranceIvan Magalhaes UNQUALIFIED
Nicolas IturbideItalyBernardo Dominic UNQUALIFIED
Misaki RoysterItalyOnyama Limba UNQUALIFIED
Stacey MacleadJapanIvan Magalhaes RENEWAL
Juan WieserAustraliaBernardo Dominic NEGOTIATION
Clifford RimBrazilBernardo Dominic NEGOTIATION
Wickens NestleRussiaAmy Elsner UNQUALIFIED
Jefferson SchemmerFranceXuxue Feng UNQUALIFIED
Octavia MaletGermanyAmy Elsner PROPOSAL
Kadeem FlosiBrazilStephen Shaw PROPOSAL
Mayumi KolmetzIndiaAsiya Javayant NEW
Jennifer AmigonSpainIoni Bowcher NEGOTIATION
Murillo MaletSpainElwin Sharvill PROPOSAL
Maisha RulapaughGermanyIvan Magalhaes QUALIFIED
Maisha RulapaughCanadaAsiya Javayant PROPOSAL
Ivar PaprockiArgentinaOnyama Limba UNQUALIFIED
Jennifer AmigonRussiaStephen Shaw PROPOSAL
Silvio SlusarskiIndiaStephen Shaw UNQUALIFIED
Antonio CaudyIndiaXuxue Feng PROPOSAL
James ButtGermanyIoni Bowcher NEW
Antonio CaudyArgentinaElwin Sharvill NEGOTIATION
Aika InouyeIndiaAmy Elsner NEGOTIATION
David DarakjyFranceIvan Magalhaes RENEWAL
Ivar PaprockiFranceStephen Shaw RENEWAL
Costa DilliardBrazilIoni Bowcher NEGOTIATION
Deepesh ChuiUnited KingdomStephen Shaw PROPOSAL
Emily WhobreyFranceElwin Sharvill QUALIFIED
Leja CaldareraUnited KingdomAmy Elsner NEW
Misaki RoysterFranceIvan Magalhaes NEGOTIATION
Murillo MaletRussiaAsiya Javayant PROPOSAL
Isabel BowleyFranceIvan Magalhaes UNQUALIFIED
Mujtaba NickaJapanAsiya Javayant PROPOSAL
Frozen Columns
Name
Sinclair Waycott
Maria Marrier
Misaki Royster
Jefferson Schemmer
Ricardo Gaucho
Cody Saylors
Stacey Maclead
Munro Ferencz
Francesco Shinko
Wickens Nestle
Silvio Slusarski
Julie Stenseth
Morrow Ruta
Izzy Garufi
Rodrigues Campain
Leja Caldarera
Faith Gillian
Jennifer Amigon
Deepesh Chui
Sinclair Waycott
Clifford Rim
Ashley Doe
Jones Vocelka
Munro Ferencz
Clifford Rim
Claire Tollner
Aditya Kusko
David Darakjy
Wickens Nestle
Sinclair Waycott
Maisha Rulapaugh
Emily Whobrey
Wickens Nestle
Aruna Figeroa
Stacey Maclead
Johnson Sergi
Julie Stenseth
Stacey Maclead
Claire Tollner
Arvin Albares
Aika Inouye
Ivar Paprocki
Munro Ferencz
Ricardo Gaucho
Salvatore Stockham
Jones Vocelka
Jefferson Schemmer
Faith Gillian
Rodrigues Campain
Maisha Rulapaugh
IdCountryDate
1000Italy2026-04-26
1001France2026-05-14
1002Canada2026-05-07
1003Russia2026-05-20
1004Japan2026-05-08
1005Japan2026-05-07
1006Australia2026-05-07
1007Italy2026-04-26
1008Canada2026-05-14
1009Australia2026-04-28
1010Argentina2026-05-15
1011Argentina2026-05-07
1012Argentina2026-05-23
1013Australia2026-05-03
1014Japan2026-05-01
1015Japan2026-05-15
1016Japan2026-04-26
1017Brazil2026-05-24
1018Australia2026-05-05
1019India2026-05-25
1020Brazil2026-05-13
1021India2026-05-02
1022Argentina2026-05-11
1023Spain2026-05-25
1024Argentina2026-05-06
1025Spain2026-04-27
1026Italy2026-05-12
1027Italy2026-05-12
1028France2026-05-08
1029Canada2026-05-09
1030Brazil2026-04-27
1031Russia2026-05-16
1032France2026-05-08
1033Argentina2026-05-08
1034Germany2026-05-18
1035India2026-05-06
1036United Kingdom2026-05-04
1037Brazil2026-04-30
1038Germany2026-05-10
1039Italy2026-05-01
1040United Kingdom2026-05-08
1041Japan2026-05-16
1042Russia2026-05-20
1043Germany2026-05-20
1044Australia2026-04-30
1045Canada2026-05-18
1046Argentina2026-05-14
1047Brazil2026-04-28
1048United Kingdom2026-04-27
1049Australia2026-05-22

On-Demand Data

NameIdCountryDate
Jeanfrancois Venere1000United Kingdom2026-05-20
Jeanfrancois Venere1001United Kingdom2026-05-01
Octavia Malet1002Germany2026-05-13
Greenwood Bolognia1003Japan2026-05-25
Cody Saylors1004United Kingdom2026-05-02
Munro Ferencz1005France2026-04-27
Kadeem Flosi1006Australia2026-05-04
James Butt1007Germany2026-05-19
Rodrigues Campain1008Germany2026-04-29
Silvio Slusarski1009Germany2026-05-12
Wickens Nestle1010Spain2026-05-19
Clifford Rim1011Germany2026-05-12
Kaitlin Ostrosky1012Japan2026-05-02
David Darakjy1013Canada2026-05-17
Sinclair Waycott1014Japan2026-04-30
Julie Stenseth1015Germany2026-05-13
Antonio Caudy1016Spain2026-04-27
Isabel Bowley1017Brazil2026-05-04
Ivar Paprocki1018Spain2026-05-22
David Darakjy1019Canada2026-04-28
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jefferson SchemmerUnited KingdomStephen Shaw UNQUALIFIED
Mujtaba NickaArgentinaXuxue Feng PROPOSAL
Costa DilliardGermanyOnyama Limba PROPOSAL
Chavez BriddickUnited KingdomIvan Magalhaes RENEWAL
Ricardo GauchoJapanIoni Bowcher PROPOSAL
Salvatore StockhamBrazilOnyama Limba UNQUALIFIED
Sinclair WaycottBrazilOnyama Limba PROPOSAL
Francesco ShinkoUnited KingdomStephen Shaw RENEWAL
Faith GillianRussiaElwin Sharvill PROPOSAL
Wickens NestleBrazilXuxue Feng PROPOSAL
Francesco ShinkoArgentinaIvan Magalhaes UNQUALIFIED
Francesco ShinkoCanadaOnyama Limba RENEWAL
Leja CaldareraBrazilElwin Sharvill NEGOTIATION
Misaki RoysterItalyStephen Shaw UNQUALIFIED
Rodrigues CampainSpainAmy Elsner UNQUALIFIED
Morrow RutaArgentinaBernardo Dominic QUALIFIED
Alejandro PerinIndiaIoni Bowcher UNQUALIFIED
Jones VocelkaIndiaAmy Elsner RENEWAL
Antonio CaudyIndiaXuxue Feng RENEWAL
Kaitlin OstroskyArgentinaElwin Sharvill RENEWAL
Jefferson SchemmerGermanyAmy Elsner NEGOTIATION
Octavia MaletCanadaElwin Sharvill QUALIFIED
Julie StensethUnited KingdomAnna Fali NEW
Jones VocelkaItalyAsiya Javayant RENEWAL
Tony FollerUnited KingdomAsiya Javayant UNQUALIFIED
Alejandro PerinArgentinaIoni Bowcher UNQUALIFIED
Octavia MaletCanadaIvan Magalhaes QUALIFIED
Jefferson SchemmerItalyXuxue Feng RENEWAL
Mayumi KolmetzRussiaXuxue Feng RENEWAL
Johnson SergiFranceAmy Elsner UNQUALIFIED
Darci PoquetteBrazilElwin Sharvill NEGOTIATION
Maisha RulapaughSpainAmy Elsner UNQUALIFIED
Tony FollerJapanBernardo Dominic RENEWAL
Faith GillianBrazilAsiya Javayant QUALIFIED
Darci PoquetteSpainIvan Magalhaes UNQUALIFIED
Jones VocelkaAustraliaBernardo Dominic NEGOTIATION
Octavia MaletGermanyAsiya Javayant NEGOTIATION
Jeanfrancois VenereGermanyIvan Magalhaes UNQUALIFIED
Morrow RutaCanadaAsiya Javayant PROPOSAL
Mayumi KolmetzSpainXuxue Feng UNQUALIFIED

<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>