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 GlickGermanyOnyama Limba RENEWAL
Isabel BowleyFranceBernardo Dominic UNQUALIFIED
Claire TollnerIndiaIoni Bowcher UNQUALIFIED
Rodrigues CampainItalyBernardo Dominic PROPOSAL
Antonio CaudyBrazilOnyama Limba PROPOSAL
Julie StensethFranceAnna Fali PROPOSAL
Julie StensethFranceElwin Sharvill PROPOSAL
Darci PoquetteItalyAnna Fali NEW
Greenwood BologniaAustraliaIvan Magalhaes NEGOTIATION
Greenwood BologniaJapanBernardo Dominic NEW
Johnson SergiFranceIoni Bowcher PROPOSAL
James ButtRussiaAsiya Javayant QUALIFIED
Jennifer AmigonGermanyElwin Sharvill NEGOTIATION
Salvatore StockhamFranceIvan Magalhaes NEW
Johnson SergiBrazilXuxue Feng RENEWAL
Izzy GarufiFranceXuxue Feng NEGOTIATION
Alejandro PerinItalyAmy Elsner RENEWAL
Cody SaylorsArgentinaIvan Magalhaes RENEWAL
Salvatore StockhamItalyBernardo Dominic QUALIFIED
Leja CaldareraFranceOnyama Limba NEGOTIATION
Chavez BriddickItalyBernardo Dominic RENEWAL
Ricardo GauchoCanadaXuxue Feng RENEWAL
Nicolas IturbideAustraliaIvan Magalhaes UNQUALIFIED
Rodrigues CampainIndiaAmy Elsner RENEWAL
Greenwood BologniaRussiaStephen Shaw UNQUALIFIED
Murillo MaletUnited KingdomElwin Sharvill QUALIFIED
Ivar PaprockiGermanyAnna Fali RENEWAL
Greenwood BologniaItalyXuxue Feng UNQUALIFIED
Sinclair WaycottJapanOnyama Limba NEGOTIATION
Kaitlin OstroskyIndiaIoni Bowcher RENEWAL
Sinclair WaycottIndiaAmy Elsner NEGOTIATION
Chavez BriddickBrazilXuxue Feng RENEWAL
James ButtGermanyXuxue Feng NEW
Adams MorascaAustraliaElwin Sharvill NEW
Maria MarrierSpainXuxue Feng UNQUALIFIED
Izzy GarufiIndiaAnna Fali PROPOSAL
Silvio SlusarskiBrazilIoni Bowcher NEGOTIATION
Leja CaldareraItalyAsiya Javayant UNQUALIFIED
Octavia MaletSpainStephen Shaw UNQUALIFIED
Cody SaylorsFranceElwin Sharvill RENEWAL
Mujtaba NickaItalyXuxue Feng QUALIFIED
Alejandro PerinItalyXuxue Feng UNQUALIFIED
Claire TollnerItalyOnyama Limba NEW
Stacey MacleadItalyXuxue Feng UNQUALIFIED
Aika InouyeSpainElwin Sharvill UNQUALIFIED
Leja CaldareraFranceIvan Magalhaes NEW
Greenwood BologniaRussiaBernardo Dominic NEW
Antonio CaudyAustraliaIvan Magalhaes PROPOSAL
Morrow RutaCanadaXuxue Feng RENEWAL
Jennifer AmigonUnited KingdomBernardo Dominic QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Faith GillianRussiaAsiya Javayant PROPOSAL
Kadeem FlosiFranceXuxue Feng PROPOSAL
Salvatore StockhamRussiaOnyama Limba PROPOSAL
Salvatore StockhamUnited KingdomXuxue Feng QUALIFIED
Jefferson SchemmerIndiaAsiya Javayant NEGOTIATION
Leja CaldareraUnited KingdomBernardo Dominic PROPOSAL
Mujtaba NickaUnited KingdomAnna Fali PROPOSAL
Jefferson SchemmerItalyAsiya Javayant NEGOTIATION
Izzy GarufiAustraliaXuxue Feng PROPOSAL
Maria MarrierItalyStephen Shaw RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aditya KuskoBrazil2026-05-11Commercial Press NEW63Amy Elsner
1001Morrow RutaArgentina2026-05-19Rousseaux, Michael Esq UNQUALIFIED21Onyama Limba
1002Maria MarrierFrance2026-05-17Rousseaux, Michael Esq NEGOTIATION7Stephen Shaw
1003Jennifer AmigonCanada2026-05-11Truhlar And Truhlar Attys NEW91Bernardo Dominic
1004Leon OldroydJapan2026-05-11Benton, John B Jr UNQUALIFIED53Asiya Javayant
1005Tony FollerArgentina2026-06-02Dorl, James J Esq UNQUALIFIED34Elwin Sharvill
1006Smith GlickJapan2026-05-25Chemel, James L Cpa PROPOSAL47Ioni Bowcher
1007Morrow RutaJapan2026-06-04Printing Dimensions RENEWAL62Elwin Sharvill
1008Aditya KuskoSpain2026-06-07King, Christopher A Esq UNQUALIFIED62Onyama Limba
1009Greenwood BologniaJapan2026-06-06Commercial Press RENEWAL4Ivan Magalhaes
1010Rodrigues CampainIndia2026-05-31Rangoni Of Florence PROPOSAL9Ivan Magalhaes
1011Emily WhobreyFrance2026-05-15Chanay, Jeffrey A Esq UNQUALIFIED90Stephen Shaw
1012David DarakjySpain2026-05-09Chapman, Ross E Esq QUALIFIED64Anna Fali
1013Ivar PaprockiGermany2026-05-27Chapman, Ross E Esq NEGOTIATION31Amy Elsner
1014Wickens NestleArgentina2026-05-31Dorl, James J Esq NEGOTIATION94Stephen Shaw
1015Leja CaldareraAustralia2026-05-09Commercial Press QUALIFIED33Ivan Magalhaes
1016Maria MarrierFrance2026-05-10Rousseaux, Michael Esq NEGOTIATION54Ioni Bowcher
1017Smith GlickAustralia2026-06-01Feltz Printing Service NEW49Amy Elsner
1018Munro FerenczFrance2026-05-09Benton, John B Jr UNQUALIFIED87Asiya Javayant
1019Claire TollnerAustralia2026-05-22Dorl, James J Esq NEGOTIATION71Ivan Magalhaes
1020Claire TollnerArgentina2026-06-05Commercial Press QUALIFIED57Stephen Shaw
1021Adams MorascaGermany2026-05-30Buckley Miller Wright QUALIFIED63Asiya Javayant
1022Wickens NestleArgentina2026-05-23Benton, John B Jr PROPOSAL56Stephen Shaw
1023Isabel BowleyArgentina2026-05-20Feiner Bros RENEWAL82Ivan Magalhaes
1024Stacey MacleadIndia2026-05-10Benton, John B Jr QUALIFIED24Stephen Shaw
1025Kaitlin OstroskyItaly2026-05-17Chapman, Ross E Esq PROPOSAL88Onyama Limba
1026Deepesh ChuiIndia2026-05-17Feltz Printing Service RENEWAL56Amy Elsner
1027Smith GlickSpain2026-05-20King, Christopher A Esq NEW83Elwin Sharvill
1028Costa DilliardFrance2026-05-30Dorl, James J Esq QUALIFIED43Bernardo Dominic
1029Aika InouyeCanada2026-06-01Rangoni Of Florence UNQUALIFIED86Ioni Bowcher
1030Tony FollerCanada2026-06-07Chapman, Ross E Esq PROPOSAL70Ivan Magalhaes
1031Faith GillianBrazil2026-06-02Morlong Associates UNQUALIFIED32Bernardo Dominic
1032Adams MorascaSpain2026-05-28Rousseaux, Michael Esq NEGOTIATION23Onyama Limba
1033Johnson SergiJapan2026-05-11Feltz Printing Service UNQUALIFIED61Asiya Javayant
1034Cody SaylorsUnited Kingdom2026-05-23Feltz Printing Service RENEWAL1Onyama Limba
1035Leja CaldareraUnited Kingdom2026-05-23Feiner Bros PROPOSAL53Ivan Magalhaes
1036Jefferson SchemmerGermany2026-05-22Dorl, James J Esq RENEWAL96Amy Elsner
1037Julie StensethCanada2026-06-05Chemel, James L Cpa NEGOTIATION71Onyama Limba
1038Isabel BowleyGermany2026-05-15Printing Dimensions RENEWAL69Amy Elsner
1039Deepesh ChuiArgentina2026-05-14Chanay, Jeffrey A Esq NEGOTIATION83Asiya Javayant
1040Isabel BowleyUnited Kingdom2026-06-06King, Christopher A Esq PROPOSAL34Xuxue Feng
1041Octavia MaletUnited Kingdom2026-05-29Printing Dimensions PROPOSAL88Anna Fali
1042Cody SaylorsGermany2026-05-17Buckley Miller Wright NEGOTIATION46Onyama Limba
1043Isabel BowleyJapan2026-05-15Morlong Associates PROPOSAL93Stephen Shaw
1044Wickens NestleFrance2026-05-31Rousseaux, Michael Esq QUALIFIED71Onyama Limba
1045Cody SaylorsSpain2026-06-03Benton, John B Jr QUALIFIED66Stephen Shaw
1046Tony FollerAustralia2026-06-01Buckley Miller Wright QUALIFIED63Stephen Shaw
1047Jeanfrancois VenereItaly2026-05-17Feltz Printing Service RENEWAL18Ioni Bowcher
1048Antonio CaudyJapan2026-05-24Benton, John B Jr PROPOSAL39Anna Fali
1049Kaitlin OstroskyRussia2026-06-04King, Christopher A Esq RENEWAL13Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Jones VocelkaCanadaAnna Fali NEGOTIATION
Wickens NestleAustraliaAmy Elsner QUALIFIED
Murillo MaletIndiaAnna Fali QUALIFIED
Aruna FigeroaIndiaIvan Magalhaes PROPOSAL
Jeanfrancois VenereFranceAnna Fali PROPOSAL
Ivar PaprockiCanadaIoni Bowcher UNQUALIFIED
Morrow RutaIndiaIvan Magalhaes PROPOSAL
Izzy GarufiSpainBernardo Dominic NEW
Wickens NestleSpainAmy Elsner UNQUALIFIED
Wickens NestleItalyAnna Fali PROPOSAL
Clifford RimRussiaIvan Magalhaes QUALIFIED
Morrow RutaIndiaBernardo Dominic QUALIFIED
Jennifer AmigonFranceXuxue Feng NEGOTIATION
Chavez BriddickArgentinaXuxue Feng QUALIFIED
Stacey MacleadFranceOnyama Limba NEGOTIATION
Kadeem FlosiJapanBernardo Dominic NEGOTIATION
Jennifer AmigonRussiaAsiya Javayant PROPOSAL
Izzy GarufiSpainIoni Bowcher NEW
Arvin AlbaresJapanOnyama Limba UNQUALIFIED
Murillo MaletSpainXuxue Feng NEGOTIATION
Chavez BriddickFranceIvan Magalhaes RENEWAL
Ashley DoeRussiaXuxue Feng RENEWAL
Antonio CaudyJapanOnyama Limba QUALIFIED
Maria MarrierJapanAnna Fali UNQUALIFIED
Misaki RoysterIndiaBernardo Dominic UNQUALIFIED
Jeanfrancois VenereBrazilXuxue Feng RENEWAL
Faith GillianFranceStephen Shaw UNQUALIFIED
Aruna FigeroaItalyElwin Sharvill QUALIFIED
Maisha RulapaughIndiaXuxue Feng QUALIFIED
Deepesh ChuiArgentinaIoni Bowcher QUALIFIED
Octavia MaletArgentinaXuxue Feng RENEWAL
Mayumi KolmetzItalyXuxue Feng NEGOTIATION
Maria MarrierBrazilOnyama Limba QUALIFIED
Ivar PaprockiArgentinaIoni Bowcher NEW
Ricardo GauchoSpainAnna Fali RENEWAL
Greenwood BologniaFranceXuxue Feng RENEWAL
David DarakjyRussiaIoni Bowcher PROPOSAL
Johnson SergiCanadaStephen Shaw NEW
Wickens NestleJapanBernardo Dominic PROPOSAL
Faith GillianSpainIoni Bowcher NEGOTIATION
Arvin AlbaresBrazilAsiya Javayant PROPOSAL
Leja CaldareraUnited KingdomStephen Shaw NEGOTIATION
Johnson SergiJapanAnna Fali RENEWAL
Mujtaba NickaAustraliaOnyama Limba NEW
Sinclair WaycottArgentinaAnna Fali NEGOTIATION
Aditya KuskoFranceXuxue Feng PROPOSAL
Wickens NestleSpainAnna Fali NEGOTIATION
Darci PoquetteRussiaBernardo Dominic NEW
Mayumi KolmetzCanadaStephen Shaw PROPOSAL
Nicolas IturbideJapanXuxue Feng QUALIFIED
Frozen Columns
Name
Jennifer Amigon
David Darakjy
Faith Gillian
Cody Saylors
Stacey Maclead
Munro Ferencz
Tony Foller
Tony Foller
Stacey Maclead
Kadeem Flosi
Misaki Royster
Ricardo Gaucho
Darci Poquette
Silvio Slusarski
Silvio Slusarski
Adams Morasca
Munro Ferencz
Alejandro Perin
David Darakjy
Ashley Doe
Salvatore Stockham
Arvin Albares
Julie Stenseth
Adams Morasca
Munro Ferencz
Sinclair Waycott
Leja Caldarera
Cody Saylors
Julie Stenseth
Aditya Kusko
Emily Whobrey
Maisha Rulapaugh
Silvio Slusarski
Kaitlin Ostrosky
Leja Caldarera
Misaki Royster
James Butt
Mayumi Kolmetz
Wickens Nestle
Emily Whobrey
David Darakjy
Kaitlin Ostrosky
Adams Morasca
Alejandro Perin
Jeanfrancois Venere
Octavia Malet
Aruna Figeroa
Tony Foller
Octavia Malet
Smith Glick
IdCountryDate
1000Italy2026-05-28
1001Brazil2026-05-10
1002Australia2026-05-18
1003Australia2026-05-23
1004India2026-05-30
1005Australia2026-05-23
1006Russia2026-05-18
1007Japan2026-05-14
1008India2026-06-01
1009Germany2026-05-15
1010Russia2026-05-18
1011Canada2026-05-11
1012Spain2026-05-29
1013Japan2026-05-30
1014Australia2026-05-15
1015India2026-05-29
1016Italy2026-05-19
1017Russia2026-06-01
1018India2026-05-10
1019India2026-05-18
1020Canada2026-06-04
1021Japan2026-05-23
1022Canada2026-05-22
1023Japan2026-05-14
1024Italy2026-05-26
1025India2026-05-28
1026Italy2026-05-24
1027Japan2026-05-15
1028Argentina2026-05-19
1029Russia2026-06-01
1030United Kingdom2026-05-13
1031United Kingdom2026-06-02
1032France2026-06-07
1033Spain2026-05-22
1034Canada2026-05-11
1035Australia2026-05-29
1036India2026-05-22
1037Australia2026-05-31
1038United Kingdom2026-06-02
1039Australia2026-06-04
1040India2026-05-16
1041Argentina2026-05-13
1042Canada2026-05-10
1043Brazil2026-05-21
1044Italy2026-05-23
1045Spain2026-06-06
1046Brazil2026-05-29
1047Japan2026-05-17
1048India2026-05-20
1049Argentina2026-05-27

On-Demand Data

NameIdCountryDate
Costa Dilliard1000Canada2026-05-19
Antonio Caudy1001Japan2026-05-10
Kaitlin Ostrosky1002Japan2026-05-26
Mayumi Kolmetz1003Japan2026-05-11
Misaki Royster1004United Kingdom2026-06-06
James Butt1005Australia2026-06-06
Julie Stenseth1006Canada2026-05-26
Leon Oldroyd1007Brazil2026-06-03
Isabel Bowley1008Argentina2026-06-02
Aruna Figeroa1009India2026-06-01
Ivar Paprocki1010Italy2026-05-27
Costa Dilliard1011United Kingdom2026-05-12
Jones Vocelka1012Japan2026-05-20
Jennifer Amigon1013Italy2026-05-13
Kaitlin Ostrosky1014Italy2026-05-23
Jennifer Amigon1015France2026-05-17
Izzy Garufi1016Argentina2026-05-19
Kadeem Flosi1017Japan2026-05-11
Julie Stenseth1018Australia2026-05-28
Leon Oldroyd1019Germany2026-05-15
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Faith GillianRussiaOnyama Limba PROPOSAL
Clifford RimUnited KingdomAnna Fali QUALIFIED
Jennifer AmigonArgentinaIvan Magalhaes QUALIFIED
Chavez BriddickBrazilAmy Elsner NEGOTIATION
Ashley DoeSpainIvan Magalhaes UNQUALIFIED
Jones VocelkaJapanIvan Magalhaes NEGOTIATION
Faith GillianBrazilBernardo Dominic NEW
Arvin AlbaresCanadaIoni Bowcher PROPOSAL
Mujtaba NickaAustraliaIoni Bowcher QUALIFIED
Aditya KuskoItalyAnna Fali NEGOTIATION
Jones VocelkaCanadaXuxue Feng QUALIFIED
Murillo MaletIndiaOnyama Limba UNQUALIFIED
Nicolas IturbideArgentinaBernardo Dominic NEW
Deepesh ChuiUnited KingdomAmy Elsner QUALIFIED
Alejandro PerinItalyOnyama Limba UNQUALIFIED
Aditya KuskoSpainXuxue Feng QUALIFIED
Silvio SlusarskiRussiaXuxue Feng NEGOTIATION
Costa DilliardFranceStephen Shaw PROPOSAL
Emily WhobreyFranceBernardo Dominic RENEWAL
Chavez BriddickSpainAnna Fali QUALIFIED
Greenwood BologniaSpainAmy Elsner NEGOTIATION
Munro FerenczBrazilBernardo Dominic PROPOSAL
Stacey MacleadRussiaIoni Bowcher NEW
Munro FerenczFranceIoni Bowcher PROPOSAL
James ButtFranceAnna Fali NEW
Jeanfrancois VenereArgentinaElwin Sharvill UNQUALIFIED
Adams MorascaSpainXuxue Feng UNQUALIFIED
Murillo MaletIndiaOnyama Limba NEW
Misaki RoysterAustraliaIvan Magalhaes NEGOTIATION
Faith GillianUnited KingdomIvan Magalhaes UNQUALIFIED
Antonio CaudyBrazilAnna Fali QUALIFIED
Clifford RimRussiaXuxue Feng NEW
Julie StensethJapanAsiya Javayant QUALIFIED
Aditya KuskoRussiaIvan Magalhaes RENEWAL
Clifford RimItalyElwin Sharvill NEW
Francesco ShinkoFranceAnna Fali RENEWAL
Cody SaylorsItalyOnyama Limba PROPOSAL
Emily WhobreyBrazilXuxue Feng NEGOTIATION
Jones VocelkaFranceOnyama Limba NEGOTIATION
Jefferson SchemmerAustraliaElwin Sharvill RENEWAL

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