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
Emily WhobreyAustraliaBernardo Dominic PROPOSAL
Misaki RoysterFranceElwin Sharvill RENEWAL
Faith GillianIndiaBernardo Dominic RENEWAL
Sinclair WaycottCanadaElwin Sharvill QUALIFIED
Stacey MacleadBrazilAnna Fali NEGOTIATION
Jones VocelkaGermanyAsiya Javayant RENEWAL
Mayumi KolmetzRussiaIvan Magalhaes PROPOSAL
Rodrigues CampainCanadaStephen Shaw QUALIFIED
Ashley DoeAustraliaAnna Fali NEW
Francesco ShinkoItalyOnyama Limba NEW
Rodrigues CampainRussiaIoni Bowcher RENEWAL
Octavia MaletUnited KingdomAnna Fali QUALIFIED
Maisha RulapaughFranceIvan Magalhaes QUALIFIED
Aditya KuskoGermanyBernardo Dominic NEW
Aika InouyeArgentinaAmy Elsner QUALIFIED
Maisha RulapaughSpainXuxue Feng RENEWAL
Deepesh ChuiFranceXuxue Feng UNQUALIFIED
Claire TollnerGermanyAnna Fali RENEWAL
Munro FerenczFranceIoni Bowcher PROPOSAL
Emily WhobreyCanadaIvan Magalhaes PROPOSAL
Ivar PaprockiFranceAnna Fali NEGOTIATION
Aditya KuskoFranceIoni Bowcher NEGOTIATION
Jones VocelkaFranceAmy Elsner NEGOTIATION
Ivar PaprockiUnited KingdomOnyama Limba PROPOSAL
Jennifer AmigonGermanyOnyama Limba RENEWAL
Silvio SlusarskiItalyIoni Bowcher PROPOSAL
Mujtaba NickaBrazilStephen Shaw UNQUALIFIED
Jeanfrancois VenereGermanyBernardo Dominic UNQUALIFIED
Octavia MaletCanadaIoni Bowcher RENEWAL
Maria MarrierGermanyAnna Fali PROPOSAL
Emily WhobreySpainIvan Magalhaes UNQUALIFIED
Maisha RulapaughItalyOnyama Limba NEGOTIATION
Adams MorascaBrazilAmy Elsner NEGOTIATION
Izzy GarufiAustraliaStephen Shaw PROPOSAL
David DarakjyIndiaIvan Magalhaes RENEWAL
Francesco ShinkoCanadaOnyama Limba PROPOSAL
Kadeem FlosiAustraliaOnyama Limba RENEWAL
Stacey MacleadJapanOnyama Limba UNQUALIFIED
Maria MarrierIndiaIvan Magalhaes PROPOSAL
Kaitlin OstroskyCanadaIvan Magalhaes QUALIFIED
Rodrigues CampainJapanAnna Fali PROPOSAL
Octavia MaletRussiaBernardo Dominic UNQUALIFIED
David DarakjyUnited KingdomBernardo Dominic PROPOSAL
Smith GlickArgentinaElwin Sharvill RENEWAL
Jones VocelkaItalyAsiya Javayant PROPOSAL
Rodrigues CampainUnited KingdomAsiya Javayant PROPOSAL
Aika InouyeJapanXuxue Feng UNQUALIFIED
Kadeem FlosiBrazilElwin Sharvill PROPOSAL
Stacey MacleadArgentinaAsiya Javayant PROPOSAL
Smith GlickIndiaElwin Sharvill QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Leja CaldareraIndiaAmy Elsner NEW
David DarakjyBrazilBernardo Dominic QUALIFIED
Morrow RutaSpainAnna Fali UNQUALIFIED
Tony FollerIndiaIvan Magalhaes NEGOTIATION
Leja CaldareraJapanAsiya Javayant PROPOSAL
Jones VocelkaAustraliaOnyama Limba RENEWAL
Antonio CaudyCanadaAnna Fali RENEWAL
Stacey MacleadJapanAmy Elsner PROPOSAL
James ButtFranceBernardo Dominic RENEWAL
Wickens NestleIndiaAnna Fali QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aditya KuskoIndia2026-06-11Commercial Press RENEWAL78Bernardo Dominic
1001Stacey MacleadAustralia2026-06-08Morlong Associates NEGOTIATION59Xuxue Feng
1002Clifford RimItaly2026-05-31Truhlar And Truhlar Attys QUALIFIED23Stephen Shaw
1003Sinclair WaycottItaly2026-05-19Dorl, James J Esq QUALIFIED33Onyama Limba
1004Jones VocelkaUnited Kingdom2026-05-29Feltz Printing Service NEW89Bernardo Dominic
1005Maisha RulapaughFrance2026-06-08Benton, John B Jr NEW25Asiya Javayant
1006Ivar PaprockiBrazil2026-05-21Commercial Press NEGOTIATION48Elwin Sharvill
1007Misaki RoysterAustralia2026-05-22Chapman, Ross E Esq NEW24Ioni Bowcher
1008Izzy GarufiJapan2026-05-22Chemel, James L Cpa UNQUALIFIED37Amy Elsner
1009Jefferson SchemmerRussia2026-05-14Rousseaux, Michael Esq RENEWAL52Ioni Bowcher
1010Cody SaylorsRussia2026-05-30Chanay, Jeffrey A Esq RENEWAL36Elwin Sharvill
1011Jennifer AmigonBrazil2026-05-14Buckley Miller Wright UNQUALIFIED2Elwin Sharvill
1012Ricardo GauchoCanada2026-05-28Morlong Associates QUALIFIED12Asiya Javayant
1013Jefferson SchemmerRussia2026-05-29Dorl, James J Esq NEW39Xuxue Feng
1014Munro FerenczRussia2026-05-24Benton, John B Jr RENEWAL81Onyama Limba
1015Leon OldroydBrazil2026-06-02Chemel, James L Cpa UNQUALIFIED64Amy Elsner
1016Deepesh ChuiFrance2026-06-09Chapman, Ross E Esq QUALIFIED34Asiya Javayant
1017Stacey MacleadGermany2026-05-25Benton, John B Jr NEGOTIATION66Bernardo Dominic
1018Nicolas IturbideCanada2026-05-14Feiner Bros PROPOSAL8Xuxue Feng
1019Adams MorascaCanada2026-06-06Morlong Associates RENEWAL13Xuxue Feng
1020Leon OldroydFrance2026-06-08Chapman, Ross E Esq NEGOTIATION45Anna Fali
1021Ashley DoeJapan2026-06-02Buckley Miller Wright NEW8Elwin Sharvill
1022Faith GillianGermany2026-06-07Feiner Bros NEGOTIATION27Elwin Sharvill
1023Sinclair WaycottFrance2026-05-13Benton, John B Jr QUALIFIED84Onyama Limba
1024Wickens NestleBrazil2026-05-28Buckley Miller Wright NEW66Xuxue Feng
1025Stacey MacleadArgentina2026-05-24Rangoni Of Florence NEW37Anna Fali
1026Misaki RoysterItaly2026-05-20Chapman, Ross E Esq NEW30Xuxue Feng
1027Jennifer AmigonArgentina2026-05-23King, Christopher A Esq NEW2Ioni Bowcher
1028Murillo MaletSpain2026-05-24Benton, John B Jr PROPOSAL48Xuxue Feng
1029Faith GillianIndia2026-06-09Commercial Press UNQUALIFIED79Stephen Shaw
1030Mayumi KolmetzSpain2026-05-19Morlong Associates UNQUALIFIED86Ivan Magalhaes
1031Darci PoquetteItaly2026-06-06King, Christopher A Esq QUALIFIED5Asiya Javayant
1032David DarakjyIndia2026-06-03Chemel, James L Cpa QUALIFIED96Amy Elsner
1033Maria MarrierRussia2026-05-28Truhlar And Truhlar Attys RENEWAL28Amy Elsner
1034Juan WieserUnited Kingdom2026-06-04Chanay, Jeffrey A Esq QUALIFIED49Elwin Sharvill
1035Arvin AlbaresBrazil2026-06-06Buckley Miller Wright NEGOTIATION50Onyama Limba
1036Munro FerenczRussia2026-06-06Buckley Miller Wright QUALIFIED98Stephen Shaw
1037Mayumi KolmetzUnited Kingdom2026-05-26Benton, John B Jr PROPOSAL35Anna Fali
1038Adams MorascaGermany2026-06-09Rousseaux, Michael Esq RENEWAL12Onyama Limba
1039Nicolas IturbideRussia2026-05-31Morlong Associates RENEWAL19Elwin Sharvill
1040Leja CaldareraArgentina2026-05-22Truhlar And Truhlar Attys NEGOTIATION80Stephen Shaw
1041Wickens NestleGermany2026-05-27Feltz Printing Service UNQUALIFIED64Ivan Magalhaes
1042Faith GillianRussia2026-06-11Chanay, Jeffrey A Esq NEGOTIATION94Bernardo Dominic
1043Emily WhobreyGermany2026-06-01Chemel, James L Cpa RENEWAL49Bernardo Dominic
1044Octavia MaletJapan2026-05-14Buckley Miller Wright NEGOTIATION12Elwin Sharvill
1045Francesco ShinkoItaly2026-06-06Rousseaux, Michael Esq NEW5Ivan Magalhaes
1046Kaitlin OstroskyRussia2026-06-06Chanay, Jeffrey A Esq QUALIFIED91Amy Elsner
1047Chavez BriddickBrazil2026-05-30Benton, John B Jr RENEWAL1Anna Fali
1048Jennifer AmigonSpain2026-05-29Printing Dimensions QUALIFIED78Asiya Javayant
1049Smith GlickRussia2026-06-10Feiner Bros UNQUALIFIED98Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Jennifer AmigonRussiaStephen Shaw PROPOSAL
Tony FollerRussiaBernardo Dominic UNQUALIFIED
Juan WieserCanadaAmy Elsner UNQUALIFIED
Isabel BowleyRussiaIoni Bowcher NEGOTIATION
Aika InouyeUnited KingdomAmy Elsner PROPOSAL
Jones VocelkaJapanAsiya Javayant RENEWAL
Francesco ShinkoRussiaIvan Magalhaes RENEWAL
Adams MorascaRussiaOnyama Limba RENEWAL
Salvatore StockhamArgentinaStephen Shaw RENEWAL
Costa DilliardRussiaIvan Magalhaes PROPOSAL
Arvin AlbaresArgentinaStephen Shaw NEW
Juan WieserUnited KingdomIvan Magalhaes RENEWAL
Murillo MaletUnited KingdomStephen Shaw NEGOTIATION
Claire TollnerJapanAsiya Javayant PROPOSAL
Costa DilliardSpainAsiya Javayant NEW
Murillo MaletFranceStephen Shaw NEW
Sinclair WaycottArgentinaAnna Fali NEGOTIATION
Rodrigues CampainAustraliaIvan Magalhaes RENEWAL
Chavez BriddickArgentinaXuxue Feng UNQUALIFIED
Mayumi KolmetzUnited KingdomAmy Elsner QUALIFIED
Costa DilliardGermanyOnyama Limba RENEWAL
Morrow RutaGermanyAnna Fali NEGOTIATION
Juan WieserAustraliaElwin Sharvill NEW
Chavez BriddickJapanAnna Fali QUALIFIED
Salvatore StockhamItalyIvan Magalhaes NEGOTIATION
Maria MarrierCanadaBernardo Dominic PROPOSAL
Salvatore StockhamGermanyAnna Fali RENEWAL
Stacey MacleadIndiaStephen Shaw RENEWAL
Jones VocelkaArgentinaXuxue Feng UNQUALIFIED
Deepesh ChuiRussiaAmy Elsner NEGOTIATION
Maria MarrierBrazilOnyama Limba QUALIFIED
Tony FollerRussiaAnna Fali RENEWAL
Octavia MaletFranceOnyama Limba RENEWAL
Aruna FigeroaGermanyElwin Sharvill NEGOTIATION
Ivar PaprockiCanadaXuxue Feng NEGOTIATION
Jefferson SchemmerArgentinaBernardo Dominic UNQUALIFIED
Jennifer AmigonSpainXuxue Feng NEGOTIATION
Cody SaylorsItalyElwin Sharvill NEW
Maisha RulapaughUnited KingdomIvan Magalhaes NEW
Deepesh ChuiGermanyElwin Sharvill QUALIFIED
Mayumi KolmetzGermanyAnna Fali PROPOSAL
Salvatore StockhamAustraliaElwin Sharvill RENEWAL
Maria MarrierItalyAnna Fali NEW
Alejandro PerinCanadaIvan Magalhaes UNQUALIFIED
Jeanfrancois VenereSpainAmy Elsner UNQUALIFIED
Smith GlickGermanyBernardo Dominic UNQUALIFIED
Clifford RimAustraliaElwin Sharvill RENEWAL
Aditya KuskoRussiaElwin Sharvill PROPOSAL
Isabel BowleyArgentinaIoni Bowcher NEW
Rodrigues CampainAustraliaBernardo Dominic PROPOSAL
Frozen Columns
Name
Greenwood Bolognia
Tony Foller
Francesco Shinko
Arvin Albares
Adams Morasca
Francesco Shinko
Ivar Paprocki
Chavez Briddick
Deepesh Chui
Darci Poquette
Mayumi Kolmetz
Julie Stenseth
Adams Morasca
Jennifer Amigon
Kaitlin Ostrosky
Leon Oldroyd
Faith Gillian
Ivar Paprocki
Jefferson Schemmer
Sinclair Waycott
Emily Whobrey
Antonio Caudy
James Butt
Ivar Paprocki
Octavia Malet
Rodrigues Campain
Kaitlin Ostrosky
Kaitlin Ostrosky
Arvin Albares
Clifford Rim
Aika Inouye
Clifford Rim
Juan Wieser
Jeanfrancois Venere
Morrow Ruta
Izzy Garufi
Mujtaba Nicka
Tony Foller
David Darakjy
Cody Saylors
Deepesh Chui
Antonio Caudy
Francesco Shinko
Smith Glick
Chavez Briddick
Rodrigues Campain
Arvin Albares
Cody Saylors
Juan Wieser
Izzy Garufi
IdCountryDate
1000Germany2026-05-31
1001Japan2026-05-19
1002Germany2026-06-10
1003United Kingdom2026-05-24
1004Spain2026-06-04
1005India2026-05-21
1006Japan2026-05-28
1007France2026-06-05
1008Spain2026-05-15
1009Australia2026-06-08
1010Russia2026-06-11
1011Argentina2026-05-16
1012Japan2026-05-19
1013United Kingdom2026-05-31
1014Australia2026-06-01
1015Russia2026-05-28
1016Germany2026-05-13
1017Canada2026-06-10
1018Brazil2026-05-13
1019France2026-05-23
1020United Kingdom2026-05-27
1021Brazil2026-05-15
1022Brazil2026-06-01
1023United Kingdom2026-05-22
1024Argentina2026-06-11
1025Germany2026-05-21
1026Japan2026-05-25
1027Brazil2026-05-26
1028Brazil2026-05-13
1029Italy2026-06-01
1030Brazil2026-05-30
1031Japan2026-05-30
1032Argentina2026-06-09
1033United Kingdom2026-05-19
1034Japan2026-06-10
1035Argentina2026-06-08
1036United Kingdom2026-05-21
1037Argentina2026-05-19
1038United Kingdom2026-05-27
1039Australia2026-05-31
1040Italy2026-05-23
1041Spain2026-06-11
1042France2026-06-04
1043India2026-06-10
1044Japan2026-06-08
1045Germany2026-06-01
1046Russia2026-05-21
1047Russia2026-05-16
1048Australia2026-05-15
1049Italy2026-05-17

On-Demand Data

NameIdCountryDate
Juan Wieser1000United Kingdom2026-05-24
David Darakjy1001Russia2026-05-18
Silvio Slusarski1002Canada2026-06-07
Juan Wieser1003Spain2026-06-11
Morrow Ruta1004Canada2026-06-02
James Butt1005France2026-05-15
Arvin Albares1006Spain2026-05-28
Costa Dilliard1007Brazil2026-06-02
Clifford Rim1008Italy2026-05-15
Tony Foller1009Italy2026-06-01
Jones Vocelka1010United Kingdom2026-06-08
Ivar Paprocki1011France2026-05-17
David Darakjy1012Italy2026-05-16
Ashley Doe1013Argentina2026-06-02
David Darakjy1014Australia2026-05-17
Alejandro Perin1015United Kingdom2026-05-28
Cody Saylors1016India2026-06-10
Julie Stenseth1017Argentina2026-06-01
Aika Inouye1018India2026-05-21
Wickens Nestle1019Germany2026-06-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Alejandro PerinGermanyAnna Fali PROPOSAL
Chavez BriddickBrazilBernardo Dominic RENEWAL
Adams MorascaAustraliaBernardo Dominic QUALIFIED
Cody SaylorsBrazilBernardo Dominic UNQUALIFIED
Jeanfrancois VenereItalyStephen Shaw PROPOSAL
Leon OldroydCanadaStephen Shaw NEGOTIATION
James ButtIndiaIvan Magalhaes NEGOTIATION
Deepesh ChuiJapanAsiya Javayant UNQUALIFIED
James ButtJapanXuxue Feng PROPOSAL
Jeanfrancois VenereRussiaOnyama Limba PROPOSAL
Isabel BowleyBrazilBernardo Dominic NEGOTIATION
James ButtBrazilIoni Bowcher RENEWAL
Stacey MacleadBrazilXuxue Feng NEW
Nicolas IturbideUnited KingdomAsiya Javayant PROPOSAL
Costa DilliardJapanAnna Fali RENEWAL
Chavez BriddickIndiaAmy Elsner PROPOSAL
Juan WieserFranceBernardo Dominic RENEWAL
Rodrigues CampainGermanyXuxue Feng NEGOTIATION
Jefferson SchemmerGermanyOnyama Limba PROPOSAL
Faith GillianSpainAmy Elsner NEGOTIATION
Leon OldroydGermanyAsiya Javayant QUALIFIED
Wickens NestleBrazilIvan Magalhaes QUALIFIED
Morrow RutaCanadaOnyama Limba NEW
Chavez BriddickCanadaOnyama Limba NEW
Julie StensethGermanyAsiya Javayant RENEWAL
Julie StensethIndiaIvan Magalhaes UNQUALIFIED
Julie StensethItalyXuxue Feng RENEWAL
Wickens NestleArgentinaXuxue Feng QUALIFIED
Faith GillianGermanyOnyama Limba NEW
Kadeem FlosiItalyIoni Bowcher RENEWAL
Munro FerenczGermanyAnna Fali NEW
Costa DilliardRussiaAsiya Javayant UNQUALIFIED
Leja CaldareraGermanyElwin Sharvill RENEWAL
Jennifer AmigonUnited KingdomAsiya Javayant NEW
Tony FollerArgentinaAnna Fali PROPOSAL
Leja CaldareraJapanStephen Shaw PROPOSAL
Nicolas IturbideAustraliaElwin Sharvill NEGOTIATION
Leja CaldareraIndiaAnna Fali RENEWAL
Nicolas IturbideArgentinaStephen Shaw PROPOSAL
Alejandro PerinRussiaBernardo Dominic 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>