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
Kadeem FlosiFranceAnna Fali PROPOSAL
Misaki RoysterUnited KingdomAsiya Javayant PROPOSAL
Munro FerenczArgentinaIvan Magalhaes UNQUALIFIED
Leon OldroydJapanXuxue Feng NEW
Darci PoquetteArgentinaXuxue Feng QUALIFIED
Mayumi KolmetzCanadaBernardo Dominic RENEWAL
Jennifer AmigonGermanyIvan Magalhaes UNQUALIFIED
Emily WhobreyUnited KingdomStephen Shaw QUALIFIED
Munro FerenczJapanIvan Magalhaes RENEWAL
Chavez BriddickArgentinaAnna Fali PROPOSAL
Maisha RulapaughCanadaBernardo Dominic UNQUALIFIED
Wickens NestleSpainXuxue Feng UNQUALIFIED
Aditya KuskoRussiaOnyama Limba NEW
Jefferson SchemmerGermanyStephen Shaw NEW
James ButtUnited KingdomAsiya Javayant RENEWAL
Smith GlickArgentinaOnyama Limba RENEWAL
Tony FollerArgentinaStephen Shaw QUALIFIED
Maisha RulapaughCanadaXuxue Feng NEGOTIATION
Jennifer AmigonJapanBernardo Dominic NEGOTIATION
David DarakjyAustraliaAsiya Javayant NEGOTIATION
David DarakjyArgentinaIvan Magalhaes NEW
Maisha RulapaughSpainIvan Magalhaes RENEWAL
Stacey MacleadItalyAsiya Javayant PROPOSAL
Misaki RoysterArgentinaIoni Bowcher NEW
James ButtJapanAsiya Javayant NEW
Antonio CaudyUnited KingdomIoni Bowcher NEW
Stacey MacleadUnited KingdomAnna Fali PROPOSAL
Antonio CaudyItalyBernardo Dominic UNQUALIFIED
Munro FerenczGermanyOnyama Limba UNQUALIFIED
Misaki RoysterUnited KingdomBernardo Dominic NEW
Faith GillianAustraliaElwin Sharvill UNQUALIFIED
Kadeem FlosiUnited KingdomBernardo Dominic UNQUALIFIED
Julie StensethRussiaAsiya Javayant RENEWAL
Sinclair WaycottCanadaBernardo Dominic RENEWAL
Emily WhobreyFranceXuxue Feng NEW
David DarakjyFranceStephen Shaw RENEWAL
Greenwood BologniaJapanBernardo Dominic RENEWAL
Maria MarrierAustraliaBernardo Dominic UNQUALIFIED
Silvio SlusarskiJapanIoni Bowcher NEW
Emily WhobreyItalyXuxue Feng PROPOSAL
Stacey MacleadGermanyAnna Fali QUALIFIED
Smith GlickAustraliaAnna Fali QUALIFIED
Antonio CaudyJapanOnyama Limba NEGOTIATION
Mayumi KolmetzSpainAsiya Javayant UNQUALIFIED
Ashley DoeSpainStephen Shaw QUALIFIED
Ashley DoeUnited KingdomXuxue Feng UNQUALIFIED
Sinclair WaycottCanadaIoni Bowcher PROPOSAL
Smith GlickJapanXuxue Feng UNQUALIFIED
Darci PoquetteSpainAsiya Javayant PROPOSAL
Rodrigues CampainIndiaBernardo Dominic QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Munro FerenczCanadaAmy Elsner UNQUALIFIED
Smith GlickAustraliaStephen Shaw UNQUALIFIED
Kaitlin OstroskyBrazilAnna Fali RENEWAL
Jennifer AmigonUnited KingdomXuxue Feng NEW
Kadeem FlosiRussiaBernardo Dominic NEW
Leja CaldareraBrazilStephen Shaw NEGOTIATION
Maisha RulapaughCanadaXuxue Feng NEW
Silvio SlusarskiRussiaXuxue Feng UNQUALIFIED
Aditya KuskoSpainAsiya Javayant RENEWAL
Clifford RimRussiaAmy Elsner UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aruna FigeroaBrazil2026-04-03Benton, John B Jr PROPOSAL24Ivan Magalhaes
1001Octavia MaletCanada2026-04-04Dorl, James J Esq NEW55Bernardo Dominic
1002Misaki RoysterFrance2026-05-01Printing Dimensions RENEWAL22Stephen Shaw
1003Francesco ShinkoAustralia2026-04-19Buckley Miller Wright QUALIFIED76Stephen Shaw
1004Izzy GarufiItaly2026-04-10Feiner Bros NEGOTIATION73Ioni Bowcher
1005Aruna FigeroaBrazil2026-04-29Feltz Printing Service PROPOSAL60Stephen Shaw
1006Emily WhobreyAustralia2026-04-05Chapman, Ross E Esq NEGOTIATION87Ivan Magalhaes
1007Darci PoquetteIndia2026-04-02Chanay, Jeffrey A Esq NEGOTIATION71Stephen Shaw
1008Jones VocelkaBrazil2026-04-22Feltz Printing Service NEGOTIATION64Xuxue Feng
1009Antonio CaudyRussia2026-04-18Benton, John B Jr UNQUALIFIED23Anna Fali
1010Juan WieserItaly2026-04-08Benton, John B Jr QUALIFIED16Ioni Bowcher
1011Jefferson SchemmerIndia2026-04-06Chemel, James L Cpa NEW38Onyama Limba
1012Chavez BriddickAustralia2026-04-12Morlong Associates NEW70Elwin Sharvill
1013Julie StensethUnited Kingdom2026-04-06Printing Dimensions UNQUALIFIED94Elwin Sharvill
1014Aditya KuskoArgentina2026-04-03Benton, John B Jr PROPOSAL0Onyama Limba
1015Izzy GarufiSpain2026-04-23Buckley Miller Wright UNQUALIFIED20Asiya Javayant
1016Darci PoquetteSpain2026-04-06Rousseaux, Michael Esq UNQUALIFIED22Anna Fali
1017Francesco ShinkoItaly2026-04-08Morlong Associates RENEWAL29Elwin Sharvill
1018Izzy GarufiBrazil2026-04-13Benton, John B Jr QUALIFIED38Anna Fali
1019Isabel BowleyIndia2026-04-02Chanay, Jeffrey A Esq NEW16Ioni Bowcher
1020Deepesh ChuiAustralia2026-04-08Chanay, Jeffrey A Esq QUALIFIED29Stephen Shaw
1021Morrow RutaFrance2026-04-09Chapman, Ross E Esq QUALIFIED39Anna Fali
1022Ashley DoeGermany2026-04-23Rousseaux, Michael Esq NEGOTIATION1Ivan Magalhaes
1023Greenwood BologniaSpain2026-04-11Feiner Bros QUALIFIED14Ioni Bowcher
1024Tony FollerIndia2026-04-12Printing Dimensions NEGOTIATION46Amy Elsner
1025Julie StensethFrance2026-04-17Feiner Bros NEW86Stephen Shaw
1026Octavia MaletUnited Kingdom2026-04-09Printing Dimensions RENEWAL88Xuxue Feng
1027Clifford RimSpain2026-04-02Chemel, James L Cpa PROPOSAL26Ivan Magalhaes
1028Ashley DoeRussia2026-04-14Commercial Press RENEWAL52Onyama Limba
1029Kadeem FlosiFrance2026-05-01Dorl, James J Esq PROPOSAL58Stephen Shaw
1030Cody SaylorsCanada2026-04-04Buckley Miller Wright UNQUALIFIED36Anna Fali
1031Clifford RimRussia2026-04-04Rousseaux, Michael Esq QUALIFIED19Elwin Sharvill
1032Izzy GarufiBrazil2026-04-08Buckley Miller Wright PROPOSAL29Bernardo Dominic
1033Mujtaba NickaSpain2026-04-27Chanay, Jeffrey A Esq NEW6Amy Elsner
1034Jennifer AmigonRussia2026-04-07Chemel, James L Cpa NEW70Elwin Sharvill
1035Sinclair WaycottJapan2026-04-05Dorl, James J Esq RENEWAL48Bernardo Dominic
1036Ricardo GauchoGermany2026-04-15Chanay, Jeffrey A Esq UNQUALIFIED38Stephen Shaw
1037Mayumi KolmetzRussia2026-04-07Rangoni Of Florence NEW45Ivan Magalhaes
1038Aruna FigeroaJapan2026-04-03Buckley Miller Wright RENEWAL48Amy Elsner
1039Alejandro PerinAustralia2026-04-15Feiner Bros RENEWAL50Amy Elsner
1040Jones VocelkaBrazil2026-05-01Chemel, James L Cpa NEW47Amy Elsner
1041Izzy GarufiItaly2026-04-09Dorl, James J Esq NEW9Stephen Shaw
1042Smith GlickFrance2026-04-19Feltz Printing Service RENEWAL48Bernardo Dominic
1043Clifford RimSpain2026-04-02Chapman, Ross E Esq QUALIFIED21Ivan Magalhaes
1044Emily WhobreyBrazil2026-04-16Truhlar And Truhlar Attys QUALIFIED77Stephen Shaw
1045Maisha RulapaughCanada2026-04-21Feltz Printing Service NEW24Bernardo Dominic
1046Mujtaba NickaBrazil2026-04-09Feiner Bros NEGOTIATION82Amy Elsner
1047Salvatore StockhamItaly2026-04-29Rousseaux, Michael Esq PROPOSAL5Anna Fali
1048Smith GlickBrazil2026-04-30Truhlar And Truhlar Attys QUALIFIED65Anna Fali
1049Juan WieserJapan2026-04-15Chanay, Jeffrey A Esq NEGOTIATION24Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Kaitlin OstroskyIndiaAnna Fali NEGOTIATION
Maisha RulapaughItalyAsiya Javayant UNQUALIFIED
Stacey MacleadAustraliaElwin Sharvill RENEWAL
Jeanfrancois VenereItalyAsiya Javayant RENEWAL
Johnson SergiBrazilAsiya Javayant PROPOSAL
Misaki RoysterSpainBernardo Dominic RENEWAL
Murillo MaletIndiaElwin Sharvill UNQUALIFIED
Aditya KuskoBrazilIoni Bowcher UNQUALIFIED
Morrow RutaRussiaAnna Fali PROPOSAL
Leon OldroydFranceXuxue Feng NEGOTIATION
Smith GlickSpainOnyama Limba NEGOTIATION
Leja CaldareraBrazilXuxue Feng NEGOTIATION
Claire TollnerBrazilOnyama Limba RENEWAL
Sinclair WaycottBrazilAsiya Javayant NEGOTIATION
Alejandro PerinCanadaAnna Fali QUALIFIED
Salvatore StockhamFranceIvan Magalhaes UNQUALIFIED
Alejandro PerinAustraliaOnyama Limba NEW
Izzy GarufiAustraliaStephen Shaw NEGOTIATION
Aika InouyeRussiaAmy Elsner UNQUALIFIED
Jeanfrancois VenereArgentinaStephen Shaw QUALIFIED
David DarakjyBrazilXuxue Feng UNQUALIFIED
Greenwood BologniaFranceStephen Shaw PROPOSAL
Jennifer AmigonJapanStephen Shaw PROPOSAL
Morrow RutaJapanStephen Shaw RENEWAL
Isabel BowleyGermanyAnna Fali PROPOSAL
Isabel BowleyCanadaIoni Bowcher NEGOTIATION
Jefferson SchemmerSpainStephen Shaw RENEWAL
Kadeem FlosiArgentinaAmy Elsner NEW
Rodrigues CampainGermanyXuxue Feng QUALIFIED
Chavez BriddickIndiaBernardo Dominic PROPOSAL
Adams MorascaSpainAmy Elsner NEW
Clifford RimSpainIoni Bowcher QUALIFIED
Francesco ShinkoGermanyIoni Bowcher NEGOTIATION
Misaki RoysterItalyAnna Fali PROPOSAL
Clifford RimGermanyIoni Bowcher RENEWAL
Mujtaba NickaRussiaOnyama Limba UNQUALIFIED
Aruna FigeroaUnited KingdomOnyama Limba NEW
Costa DilliardSpainXuxue Feng RENEWAL
Arvin AlbaresArgentinaAsiya Javayant QUALIFIED
Aruna FigeroaSpainIvan Magalhaes QUALIFIED
Adams MorascaSpainIoni Bowcher NEW
Aruna FigeroaIndiaOnyama Limba RENEWAL
Chavez BriddickIndiaAnna Fali QUALIFIED
Silvio SlusarskiSpainStephen Shaw NEW
Rodrigues CampainCanadaStephen Shaw NEGOTIATION
Leon OldroydGermanyAsiya Javayant NEW
Aditya KuskoJapanBernardo Dominic PROPOSAL
Jefferson SchemmerIndiaOnyama Limba RENEWAL
Salvatore StockhamRussiaIvan Magalhaes NEW
Morrow RutaRussiaAnna Fali UNQUALIFIED
Frozen Columns
Name
Murillo Malet
Cody Saylors
Julie Stenseth
Murillo Malet
Maisha Rulapaugh
Ashley Doe
Maria Marrier
Juan Wieser
Aditya Kusko
Kadeem Flosi
Mayumi Kolmetz
Maisha Rulapaugh
Johnson Sergi
Francesco Shinko
James Butt
Leja Caldarera
Sinclair Waycott
Octavia Malet
Julie Stenseth
Isabel Bowley
Misaki Royster
David Darakjy
Johnson Sergi
Silvio Slusarski
Sinclair Waycott
Greenwood Bolognia
Ivar Paprocki
Aika Inouye
Jeanfrancois Venere
Kadeem Flosi
Ricardo Gaucho
Deepesh Chui
Cody Saylors
Alejandro Perin
Smith Glick
Faith Gillian
Mayumi Kolmetz
Salvatore Stockham
Faith Gillian
Costa Dilliard
Ivar Paprocki
Silvio Slusarski
Wickens Nestle
Aditya Kusko
Leon Oldroyd
Misaki Royster
Isabel Bowley
Stacey Maclead
Kadeem Flosi
Smith Glick
IdCountryDate
1000Australia2026-04-04
1001Brazil2026-04-29
1002France2026-04-08
1003Russia2026-04-14
1004France2026-04-03
1005United Kingdom2026-04-20
1006Brazil2026-05-01
1007Germany2026-04-20
1008Japan2026-04-16
1009Brazil2026-04-25
1010Germany2026-04-11
1011India2026-04-09
1012Germany2026-04-06
1013Canada2026-04-17
1014India2026-04-29
1015Canada2026-04-25
1016Japan2026-04-21
1017Spain2026-04-03
1018Japan2026-04-17
1019Spain2026-04-07
1020Canada2026-04-30
1021Brazil2026-04-07
1022Japan2026-04-10
1023Argentina2026-04-03
1024Japan2026-05-01
1025Italy2026-04-07
1026Brazil2026-05-01
1027Canada2026-04-17
1028Russia2026-04-19
1029United Kingdom2026-04-19
1030France2026-04-20
1031Argentina2026-04-17
1032United Kingdom2026-04-04
1033Argentina2026-04-02
1034India2026-04-06
1035United Kingdom2026-04-15
1036Spain2026-04-12
1037Brazil2026-04-14
1038Russia2026-04-21
1039Germany2026-04-23
1040Argentina2026-04-30
1041Brazil2026-04-29
1042Spain2026-04-06
1043Australia2026-04-21
1044Spain2026-04-06
1045Brazil2026-04-10
1046Australia2026-04-30
1047Brazil2026-04-10
1048Canada2026-04-15
1049Canada2026-04-30

On-Demand Data

NameIdCountryDate
Munro Ferencz1000Italy2026-04-12
James Butt1001Brazil2026-04-03
Nicolas Iturbide1002Japan2026-04-22
Izzy Garufi1003Germany2026-04-16
Wickens Nestle1004Argentina2026-04-28
Sinclair Waycott1005United Kingdom2026-04-29
Rodrigues Campain1006Germany2026-05-01
Faith Gillian1007Spain2026-04-23
Francesco Shinko1008India2026-04-15
Claire Tollner1009United Kingdom2026-04-14
Mayumi Kolmetz1010Canada2026-04-10
Jeanfrancois Venere1011Argentina2026-04-25
Costa Dilliard1012Brazil2026-04-27
Morrow Ruta1013France2026-04-23
Wickens Nestle1014Argentina2026-04-27
Jennifer Amigon1015India2026-04-05
Munro Ferencz1016United Kingdom2026-04-14
Ivar Paprocki1017Australia2026-04-20
Maria Marrier1018Italy2026-04-18
Smith Glick1019Argentina2026-04-21
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Francesco ShinkoFranceStephen Shaw NEW
Emily WhobreyGermanyAnna Fali QUALIFIED
Chavez BriddickUnited KingdomAsiya Javayant PROPOSAL
Leja CaldareraGermanyIvan Magalhaes NEW
Silvio SlusarskiGermanyAmy Elsner UNQUALIFIED
Octavia MaletFranceAnna Fali RENEWAL
Misaki RoysterUnited KingdomAmy Elsner QUALIFIED
Julie StensethSpainBernardo Dominic NEGOTIATION
Aruna FigeroaItalyStephen Shaw NEGOTIATION
Mujtaba NickaAustraliaAmy Elsner QUALIFIED
Sinclair WaycottCanadaElwin Sharvill UNQUALIFIED
Deepesh ChuiUnited KingdomAsiya Javayant UNQUALIFIED
Misaki RoysterUnited KingdomIoni Bowcher NEW
Darci PoquetteGermanyElwin Sharvill QUALIFIED
David DarakjyCanadaXuxue Feng UNQUALIFIED
Munro FerenczBrazilElwin Sharvill NEW
Julie StensethGermanyAmy Elsner NEGOTIATION
Sinclair WaycottIndiaAnna Fali NEGOTIATION
Francesco ShinkoAustraliaIoni Bowcher NEGOTIATION
Maisha RulapaughIndiaIoni Bowcher NEW
Arvin AlbaresArgentinaIoni Bowcher QUALIFIED
Aditya KuskoIndiaStephen Shaw NEW
Murillo MaletCanadaStephen Shaw RENEWAL
Salvatore StockhamJapanStephen Shaw NEW
Mayumi KolmetzBrazilElwin Sharvill NEGOTIATION
Tony FollerAustraliaXuxue Feng UNQUALIFIED
Morrow RutaArgentinaAmy Elsner RENEWAL
Jeanfrancois VenereRussiaElwin Sharvill NEW
Johnson SergiArgentinaOnyama Limba NEGOTIATION
Faith GillianArgentinaStephen Shaw RENEWAL
Sinclair WaycottArgentinaStephen Shaw NEW
Stacey MacleadFranceStephen Shaw UNQUALIFIED
Jefferson SchemmerSpainElwin Sharvill NEGOTIATION
Aditya KuskoArgentinaIoni Bowcher NEW
Antonio CaudyBrazilStephen Shaw RENEWAL
Arvin AlbaresIndiaOnyama Limba QUALIFIED
Maisha RulapaughArgentinaIvan Magalhaes QUALIFIED
Maisha RulapaughGermanyAnna Fali NEGOTIATION
Alejandro PerinSpainStephen Shaw RENEWAL
Ashley DoeIndiaIoni Bowcher 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>