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
Leon OldroydArgentinaAnna Fali RENEWAL
Maisha RulapaughFranceElwin Sharvill QUALIFIED
Aika InouyeBrazilAsiya Javayant UNQUALIFIED
Maria MarrierArgentinaAnna Fali QUALIFIED
Deepesh ChuiAustraliaOnyama Limba PROPOSAL
Octavia MaletJapanBernardo Dominic RENEWAL
Jefferson SchemmerArgentinaAmy Elsner PROPOSAL
Francesco ShinkoFranceAnna Fali RENEWAL
Jeanfrancois VenereJapanIvan Magalhaes QUALIFIED
Chavez BriddickFranceIvan Magalhaes QUALIFIED
Leja CaldareraFranceIvan Magalhaes NEGOTIATION
Jeanfrancois VenereCanadaAsiya Javayant PROPOSAL
Ivar PaprockiGermanyXuxue Feng UNQUALIFIED
Kadeem FlosiIndiaIvan Magalhaes QUALIFIED
Smith GlickUnited KingdomAmy Elsner UNQUALIFIED
Arvin AlbaresJapanIoni Bowcher UNQUALIFIED
Jones VocelkaJapanAsiya Javayant UNQUALIFIED
Kaitlin OstroskyArgentinaStephen Shaw RENEWAL
Aruna FigeroaAustraliaIvan Magalhaes NEGOTIATION
Darci PoquetteRussiaStephen Shaw NEW
Antonio CaudyCanadaXuxue Feng QUALIFIED
Izzy GarufiUnited KingdomIoni Bowcher QUALIFIED
Maria MarrierItalyOnyama Limba UNQUALIFIED
Izzy GarufiArgentinaIoni Bowcher QUALIFIED
Arvin AlbaresGermanyOnyama Limba NEW
Jones VocelkaFranceAnna Fali NEW
Adams MorascaCanadaIvan Magalhaes NEW
Ashley DoeIndiaStephen Shaw NEGOTIATION
Tony FollerAustraliaIoni Bowcher RENEWAL
Faith GillianArgentinaIoni Bowcher UNQUALIFIED
Leon OldroydArgentinaIoni Bowcher NEW
Aika InouyeArgentinaAnna Fali UNQUALIFIED
Johnson SergiArgentinaAnna Fali NEW
James ButtUnited KingdomAmy Elsner QUALIFIED
Deepesh ChuiGermanyIoni Bowcher QUALIFIED
Leja CaldareraFranceIvan Magalhaes NEW
Izzy GarufiArgentinaIvan Magalhaes NEW
Costa DilliardBrazilXuxue Feng NEGOTIATION
Ashley DoeBrazilAnna Fali PROPOSAL
Julie StensethBrazilIvan Magalhaes RENEWAL
Ivar PaprockiAustraliaAnna Fali RENEWAL
Misaki RoysterArgentinaAsiya Javayant NEGOTIATION
Ashley DoeCanadaXuxue Feng RENEWAL
Claire TollnerUnited KingdomElwin Sharvill RENEWAL
Murillo MaletItalyBernardo Dominic RENEWAL
Aika InouyeAustraliaXuxue Feng QUALIFIED
Kaitlin OstroskyCanadaElwin Sharvill NEGOTIATION
Maria MarrierUnited KingdomOnyama Limba QUALIFIED
Jefferson SchemmerArgentinaOnyama Limba UNQUALIFIED
Greenwood BologniaItalyIoni Bowcher RENEWAL
Horizontal
NameCountryRepresentativeStatus
Clifford RimArgentinaAsiya Javayant RENEWAL
Deepesh ChuiRussiaXuxue Feng RENEWAL
Izzy GarufiArgentinaAnna Fali UNQUALIFIED
Johnson SergiBrazilOnyama Limba NEGOTIATION
Kadeem FlosiRussiaAsiya Javayant NEW
Leon OldroydJapanXuxue Feng NEW
Juan WieserCanadaIvan Magalhaes NEW
Smith GlickArgentinaOnyama Limba UNQUALIFIED
Jefferson SchemmerSpainAsiya Javayant PROPOSAL
Jennifer AmigonUnited KingdomElwin Sharvill RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Emily WhobreyBrazil2026-05-21Truhlar And Truhlar Attys NEW16Ioni Bowcher
1001Smith GlickCanada2026-06-15Rangoni Of Florence NEW79Xuxue Feng
1002Jones VocelkaGermany2026-06-18Chapman, Ross E Esq NEW30Anna Fali
1003Adams MorascaSpain2026-06-06Dorl, James J Esq QUALIFIED40Bernardo Dominic
1004Jones VocelkaItaly2026-06-08Chapman, Ross E Esq RENEWAL25Asiya Javayant
1005Leja CaldareraCanada2026-06-12Printing Dimensions NEW20Anna Fali
1006Adams MorascaGermany2026-06-05Morlong Associates QUALIFIED17Anna Fali
1007Francesco ShinkoRussia2026-06-09Feltz Printing Service UNQUALIFIED23Elwin Sharvill
1008Salvatore StockhamCanada2026-05-23Morlong Associates PROPOSAL78Stephen Shaw
1009Costa DilliardArgentina2026-05-21Chanay, Jeffrey A Esq RENEWAL27Stephen Shaw
1010Isabel BowleyJapan2026-05-31Morlong Associates NEW4Onyama Limba
1011Adams MorascaCanada2026-06-05Rousseaux, Michael Esq NEGOTIATION8Bernardo Dominic
1012Claire TollnerItaly2026-06-13Rangoni Of Florence NEGOTIATION42Elwin Sharvill
1013Ashley DoeAustralia2026-06-03Chapman, Ross E Esq NEGOTIATION96Xuxue Feng
1014Silvio SlusarskiSpain2026-06-18Chemel, James L Cpa UNQUALIFIED78Xuxue Feng
1015Costa DilliardCanada2026-06-15Morlong Associates PROPOSAL96Asiya Javayant
1016Johnson SergiAustralia2026-06-18Chemel, James L Cpa RENEWAL77Ivan Magalhaes
1017Tony FollerUnited Kingdom2026-06-03Chanay, Jeffrey A Esq UNQUALIFIED43Asiya Javayant
1018Costa DilliardGermany2026-06-16Printing Dimensions PROPOSAL10Bernardo Dominic
1019Greenwood BologniaGermany2026-06-06Rousseaux, Michael Esq UNQUALIFIED77Ioni Bowcher
1020Mujtaba NickaSpain2026-05-28Printing Dimensions NEW95Amy Elsner
1021Ashley DoeJapan2026-05-28Truhlar And Truhlar Attys UNQUALIFIED17Stephen Shaw
1022Johnson SergiJapan2026-05-26Buckley Miller Wright RENEWAL67Anna Fali
1023Francesco ShinkoGermany2026-06-06Feiner Bros PROPOSAL95Xuxue Feng
1024Leja CaldareraRussia2026-05-24Rangoni Of Florence QUALIFIED48Stephen Shaw
1025Darci PoquetteIndia2026-05-29Morlong Associates UNQUALIFIED34Elwin Sharvill
1026Clifford RimGermany2026-06-06Feiner Bros RENEWAL54Asiya Javayant
1027Faith GillianRussia2026-05-23Chanay, Jeffrey A Esq RENEWAL14Amy Elsner
1028Francesco ShinkoJapan2026-06-01Benton, John B Jr NEW38Amy Elsner
1029Leon OldroydArgentina2026-05-26Benton, John B Jr RENEWAL5Ioni Bowcher
1030Adams MorascaArgentina2026-05-25Truhlar And Truhlar Attys NEW10Elwin Sharvill
1031Francesco ShinkoFrance2026-06-05Printing Dimensions UNQUALIFIED39Amy Elsner
1032Izzy GarufiItaly2026-06-19Benton, John B Jr NEW90Amy Elsner
1033Mayumi KolmetzGermany2026-06-16Chemel, James L Cpa PROPOSAL79Stephen Shaw
1034Faith GillianRussia2026-06-19Rangoni Of Florence NEW35Bernardo Dominic
1035James ButtArgentina2026-05-27Chapman, Ross E Esq UNQUALIFIED71Stephen Shaw
1036Costa DilliardRussia2026-06-02Benton, John B Jr NEGOTIATION34Ivan Magalhaes
1037Stacey MacleadRussia2026-05-26Chapman, Ross E Esq UNQUALIFIED12Elwin Sharvill
1038Aika InouyeSpain2026-05-26Rangoni Of Florence PROPOSAL98Asiya Javayant
1039James ButtSpain2026-06-19Chanay, Jeffrey A Esq NEW97Amy Elsner
1040Costa DilliardJapan2026-06-14Chapman, Ross E Esq PROPOSAL19Xuxue Feng
1041Johnson SergiArgentina2026-06-15Commercial Press PROPOSAL56Asiya Javayant
1042David DarakjyJapan2026-06-15Dorl, James J Esq NEGOTIATION84Bernardo Dominic
1043Francesco ShinkoJapan2026-06-04Printing Dimensions RENEWAL54Stephen Shaw
1044Jefferson SchemmerGermany2026-06-05King, Christopher A Esq RENEWAL80Elwin Sharvill
1045Smith GlickGermany2026-06-18Printing Dimensions RENEWAL12Stephen Shaw
1046Jones VocelkaIndia2026-06-04Chapman, Ross E Esq RENEWAL66Bernardo Dominic
1047Mujtaba NickaArgentina2026-06-03Commercial Press RENEWAL34Elwin Sharvill
1048Cody SaylorsUnited Kingdom2026-05-28Feltz Printing Service PROPOSAL64Bernardo Dominic
1049Stacey MacleadFrance2026-06-15Chanay, Jeffrey A Esq QUALIFIED34Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Francesco ShinkoBrazilIoni Bowcher UNQUALIFIED
Juan WieserIndiaIvan Magalhaes NEGOTIATION
Francesco ShinkoCanadaOnyama Limba RENEWAL
Salvatore StockhamCanadaOnyama Limba UNQUALIFIED
Octavia MaletIndiaBernardo Dominic UNQUALIFIED
Costa DilliardItalyStephen Shaw RENEWAL
Faith GillianItalyBernardo Dominic NEW
Ivar PaprockiRussiaElwin Sharvill NEGOTIATION
Jones VocelkaArgentinaXuxue Feng NEGOTIATION
Sinclair WaycottSpainIvan Magalhaes NEGOTIATION
Ivar PaprockiUnited KingdomBernardo Dominic QUALIFIED
Johnson SergiItalyAmy Elsner NEGOTIATION
Francesco ShinkoCanadaAsiya Javayant QUALIFIED
Claire TollnerRussiaElwin Sharvill NEGOTIATION
Kaitlin OstroskyBrazilOnyama Limba QUALIFIED
Francesco ShinkoUnited KingdomXuxue Feng UNQUALIFIED
Alejandro PerinAustraliaAnna Fali UNQUALIFIED
Munro FerenczFranceOnyama Limba RENEWAL
Mayumi KolmetzSpainAnna Fali UNQUALIFIED
Tony FollerUnited KingdomElwin Sharvill NEW
Tony FollerGermanyAnna Fali RENEWAL
Ricardo GauchoItalyAsiya Javayant RENEWAL
Faith GillianRussiaOnyama Limba QUALIFIED
Izzy GarufiJapanStephen Shaw NEGOTIATION
Claire TollnerUnited KingdomAmy Elsner RENEWAL
Aruna FigeroaBrazilIvan Magalhaes QUALIFIED
James ButtAustraliaIvan Magalhaes UNQUALIFIED
Munro FerenczItalyAnna Fali NEW
Claire TollnerIndiaBernardo Dominic PROPOSAL
Arvin AlbaresGermanyOnyama Limba QUALIFIED
Costa DilliardArgentinaXuxue Feng NEGOTIATION
Emily WhobreyItalyStephen Shaw NEW
Ricardo GauchoFranceIoni Bowcher PROPOSAL
Leon OldroydCanadaElwin Sharvill PROPOSAL
Leja CaldareraArgentinaAsiya Javayant RENEWAL
Ashley DoeFranceAmy Elsner NEGOTIATION
Silvio SlusarskiCanadaIoni Bowcher NEW
Juan WieserBrazilStephen Shaw QUALIFIED
James ButtUnited KingdomIoni Bowcher PROPOSAL
Aruna FigeroaAustraliaIvan Magalhaes NEGOTIATION
Wickens NestleAustraliaStephen Shaw NEGOTIATION
Izzy GarufiBrazilOnyama Limba PROPOSAL
Ricardo GauchoArgentinaAnna Fali QUALIFIED
Mayumi KolmetzArgentinaStephen Shaw PROPOSAL
Murillo MaletIndiaIoni Bowcher UNQUALIFIED
Smith GlickCanadaXuxue Feng QUALIFIED
Francesco ShinkoRussiaAmy Elsner UNQUALIFIED
Faith GillianArgentinaElwin Sharvill RENEWAL
Julie StensethUnited KingdomAnna Fali RENEWAL
Isabel BowleyItalyAnna Fali NEGOTIATION
Frozen Columns
Name
Misaki Royster
Leon Oldroyd
Emily Whobrey
Aika Inouye
Jefferson Schemmer
Juan Wieser
Jefferson Schemmer
Faith Gillian
Ivar Paprocki
Alejandro Perin
Nicolas Iturbide
Kadeem Flosi
Claire Tollner
Jeanfrancois Venere
Silvio Slusarski
Johnson Sergi
Morrow Ruta
Arvin Albares
Nicolas Iturbide
Aditya Kusko
Salvatore Stockham
Maria Marrier
Ashley Doe
Leon Oldroyd
Leja Caldarera
Ashley Doe
Murillo Malet
Morrow Ruta
Mujtaba Nicka
Cody Saylors
Aruna Figeroa
Aditya Kusko
Silvio Slusarski
Leon Oldroyd
Sinclair Waycott
Silvio Slusarski
Juan Wieser
Darci Poquette
Adams Morasca
Johnson Sergi
Isabel Bowley
David Darakjy
Salvatore Stockham
David Darakjy
Chavez Briddick
Ricardo Gaucho
Chavez Briddick
Emily Whobrey
Izzy Garufi
Antonio Caudy
IdCountryDate
1000Germany2026-06-06
1001United Kingdom2026-06-03
1002Russia2026-05-23
1003Argentina2026-06-14
1004United Kingdom2026-05-29
1005Italy2026-05-24
1006Brazil2026-05-21
1007Canada2026-06-09
1008France2026-06-09
1009Japan2026-06-11
1010Canada2026-06-13
1011Italy2026-06-05
1012Spain2026-06-02
1013Spain2026-05-23
1014Brazil2026-06-01
1015Spain2026-06-19
1016Brazil2026-05-30
1017Japan2026-05-21
1018India2026-06-08
1019Canada2026-06-18
1020Australia2026-06-17
1021Brazil2026-06-17
1022Japan2026-06-02
1023France2026-06-19
1024Spain2026-06-15
1025Argentina2026-06-02
1026Russia2026-05-21
1027India2026-05-22
1028Russia2026-06-18
1029Brazil2026-06-04
1030Canada2026-05-26
1031Canada2026-05-31
1032United Kingdom2026-05-23
1033Australia2026-06-09
1034India2026-06-18
1035Brazil2026-06-02
1036Brazil2026-05-23
1037United Kingdom2026-05-30
1038Argentina2026-06-18
1039Canada2026-06-03
1040Brazil2026-06-17
1041Australia2026-06-04
1042Italy2026-06-04
1043Russia2026-05-22
1044Japan2026-06-08
1045Germany2026-06-09
1046Spain2026-06-09
1047Brazil2026-06-07
1048Russia2026-06-03
1049Italy2026-06-14

On-Demand Data

NameIdCountryDate
Arvin Albares1000France2026-06-04
Tony Foller1001India2026-06-09
Darci Poquette1002Australia2026-06-18
Aika Inouye1003Argentina2026-06-11
Jeanfrancois Venere1004United Kingdom2026-05-31
Ricardo Gaucho1005Canada2026-06-03
Leon Oldroyd1006India2026-06-04
Octavia Malet1007Brazil2026-05-23
Jefferson Schemmer1008Brazil2026-06-02
Maria Marrier1009Germany2026-06-19
Darci Poquette1010United Kingdom2026-06-03
Darci Poquette1011Italy2026-06-11
Aditya Kusko1012Russia2026-06-12
Aika Inouye1013United Kingdom2026-06-05
Jefferson Schemmer1014Spain2026-06-06
Izzy Garufi1015France2026-05-31
Aditya Kusko1016Spain2026-05-25
Greenwood Bolognia1017Spain2026-06-01
Salvatore Stockham1018France2026-06-06
Jefferson Schemmer1019Argentina2026-06-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
James ButtUnited KingdomAnna Fali UNQUALIFIED
Maria MarrierBrazilIoni Bowcher RENEWAL
Maisha RulapaughArgentinaStephen Shaw NEGOTIATION
Ashley DoeUnited KingdomXuxue Feng NEW
Kaitlin OstroskyJapanAmy Elsner QUALIFIED
Jeanfrancois VenereJapanAsiya Javayant PROPOSAL
Jones VocelkaArgentinaIoni Bowcher PROPOSAL
Jennifer AmigonUnited KingdomIvan Magalhaes RENEWAL
Arvin AlbaresJapanAmy Elsner UNQUALIFIED
James ButtArgentinaAmy Elsner NEW
Leon OldroydCanadaXuxue Feng RENEWAL
David DarakjyFranceAnna Fali UNQUALIFIED
Claire TollnerBrazilAsiya Javayant NEGOTIATION
Aruna FigeroaFranceAmy Elsner UNQUALIFIED
Leja CaldareraFranceIoni Bowcher UNQUALIFIED
Ashley DoeBrazilElwin Sharvill PROPOSAL
Silvio SlusarskiUnited KingdomOnyama Limba QUALIFIED
Sinclair WaycottItalyIoni Bowcher PROPOSAL
Chavez BriddickAustraliaIvan Magalhaes NEW
Claire TollnerIndiaAsiya Javayant UNQUALIFIED
Stacey MacleadSpainBernardo Dominic NEW
James ButtGermanyAnna Fali UNQUALIFIED
Isabel BowleySpainAsiya Javayant PROPOSAL
Aruna FigeroaGermanyAsiya Javayant NEGOTIATION
Aruna FigeroaGermanyAmy Elsner PROPOSAL
Murillo MaletIndiaIoni Bowcher NEW
Aditya KuskoCanadaXuxue Feng UNQUALIFIED
Julie StensethFranceXuxue Feng NEGOTIATION
Mujtaba NickaBrazilAsiya Javayant UNQUALIFIED
Alejandro PerinJapanAnna Fali UNQUALIFIED
Jefferson SchemmerGermanyOnyama Limba PROPOSAL
Mujtaba NickaIndiaXuxue Feng PROPOSAL
Juan WieserArgentinaAmy Elsner NEW
Darci PoquetteItalyAmy Elsner NEW
Octavia MaletGermanyXuxue Feng QUALIFIED
Kaitlin OstroskySpainAsiya Javayant NEGOTIATION
Faith GillianIndiaElwin Sharvill NEGOTIATION
Aditya KuskoCanadaIoni Bowcher RENEWAL
Claire TollnerUnited KingdomAnna Fali RENEWAL
Julie StensethBrazilAsiya Javayant PROPOSAL

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