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
Maria MarrierItalyAnna Fali PROPOSAL
Mujtaba NickaJapanStephen Shaw RENEWAL
Silvio SlusarskiJapanOnyama Limba PROPOSAL
Arvin AlbaresJapanAnna Fali RENEWAL
Emily WhobreyFranceElwin Sharvill UNQUALIFIED
Maria MarrierCanadaAsiya Javayant QUALIFIED
Smith GlickRussiaStephen Shaw NEW
Aruna FigeroaBrazilAsiya Javayant PROPOSAL
Arvin AlbaresIndiaElwin Sharvill RENEWAL
Rodrigues CampainBrazilAsiya Javayant PROPOSAL
Maisha RulapaughSpainOnyama Limba PROPOSAL
Nicolas IturbideJapanAsiya Javayant UNQUALIFIED
Chavez BriddickIndiaXuxue Feng UNQUALIFIED
Misaki RoysterBrazilAsiya Javayant RENEWAL
Darci PoquetteFranceXuxue Feng NEGOTIATION
Johnson SergiIndiaAnna Fali UNQUALIFIED
Octavia MaletGermanyStephen Shaw RENEWAL
Ashley DoeGermanyAnna Fali QUALIFIED
Darci PoquetteJapanElwin Sharvill NEW
Sinclair WaycottArgentinaBernardo Dominic PROPOSAL
Adams MorascaGermanyOnyama Limba NEGOTIATION
Jefferson SchemmerAustraliaBernardo Dominic PROPOSAL
Faith GillianRussiaAsiya Javayant UNQUALIFIED
Leon OldroydAustraliaXuxue Feng NEW
Darci PoquetteSpainXuxue Feng PROPOSAL
Aditya KuskoGermanyIvan Magalhaes RENEWAL
Isabel BowleyIndiaIvan Magalhaes QUALIFIED
Emily WhobreySpainIvan Magalhaes QUALIFIED
Wickens NestleCanadaOnyama Limba UNQUALIFIED
Tony FollerItalyAnna Fali UNQUALIFIED
Rodrigues CampainAustraliaAnna Fali NEW
Ricardo GauchoRussiaAnna Fali RENEWAL
Jefferson SchemmerJapanAnna Fali UNQUALIFIED
Antonio CaudyArgentinaBernardo Dominic NEW
Octavia MaletSpainStephen Shaw NEW
Mayumi KolmetzAustraliaBernardo Dominic RENEWAL
Kadeem FlosiFranceIvan Magalhaes PROPOSAL
Adams MorascaFranceElwin Sharvill NEW
Morrow RutaFranceElwin Sharvill NEGOTIATION
Clifford RimGermanyAmy Elsner RENEWAL
Mayumi KolmetzBrazilAnna Fali RENEWAL
Jefferson SchemmerGermanyAnna Fali NEGOTIATION
Murillo MaletRussiaIvan Magalhaes PROPOSAL
Mayumi KolmetzBrazilStephen Shaw NEW
Silvio SlusarskiGermanyAnna Fali UNQUALIFIED
Arvin AlbaresUnited KingdomAnna Fali NEGOTIATION
David DarakjyJapanIvan Magalhaes RENEWAL
Greenwood BologniaGermanyAnna Fali UNQUALIFIED
David DarakjyArgentinaBernardo Dominic NEGOTIATION
Morrow RutaSpainStephen Shaw PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Leja CaldareraCanadaXuxue Feng NEGOTIATION
Jennifer AmigonSpainAsiya Javayant NEGOTIATION
Darci PoquetteSpainOnyama Limba NEGOTIATION
Misaki RoysterFranceIvan Magalhaes PROPOSAL
Maisha RulapaughAustraliaAsiya Javayant UNQUALIFIED
Octavia MaletRussiaIoni Bowcher PROPOSAL
Ricardo GauchoSpainXuxue Feng NEGOTIATION
Murillo MaletItalyAmy Elsner QUALIFIED
Darci PoquetteBrazilElwin Sharvill NEW
Mujtaba NickaAustraliaIoni Bowcher RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Darci PoquetteJapan2026-05-14Buckley Miller Wright NEW63Elwin Sharvill
1001Alejandro PerinItaly2026-04-26Rousseaux, Michael Esq NEGOTIATION85Bernardo Dominic
1002Adams MorascaBrazil2026-05-21Chapman, Ross E Esq UNQUALIFIED83Anna Fali
1003Murillo MaletIndia2026-05-12Chemel, James L Cpa PROPOSAL96Ioni Bowcher
1004Francesco ShinkoBrazil2026-04-29Commercial Press NEW98Xuxue Feng
1005Antonio CaudyJapan2026-05-14Commercial Press NEGOTIATION71Amy Elsner
1006Mayumi KolmetzJapan2026-05-11Chanay, Jeffrey A Esq NEW97Elwin Sharvill
1007Clifford RimRussia2026-04-30Printing Dimensions QUALIFIED66Anna Fali
1008Jones VocelkaAustralia2026-05-13King, Christopher A Esq RENEWAL94Onyama Limba
1009Nicolas IturbideGermany2026-05-07Feiner Bros NEW43Onyama Limba
1010Ricardo GauchoRussia2026-05-07Buckley Miller Wright RENEWAL82Elwin Sharvill
1011Ashley DoeRussia2026-05-09Dorl, James J Esq RENEWAL96Anna Fali
1012Maria MarrierArgentina2026-04-29King, Christopher A Esq UNQUALIFIED30Bernardo Dominic
1013Rodrigues CampainGermany2026-05-03Truhlar And Truhlar Attys NEW38Elwin Sharvill
1014Ricardo GauchoBrazil2026-05-13Printing Dimensions RENEWAL40Asiya Javayant
1015Julie StensethFrance2026-04-30Printing Dimensions NEGOTIATION36Bernardo Dominic
1016Stacey MacleadRussia2026-05-16Chemel, James L Cpa PROPOSAL74Xuxue Feng
1017Octavia MaletCanada2026-04-27Rousseaux, Michael Esq RENEWAL56Elwin Sharvill
1018Ricardo GauchoBrazil2026-05-10Morlong Associates RENEWAL13Onyama Limba
1019Tony FollerRussia2026-04-23Printing Dimensions QUALIFIED72Anna Fali
1020Sinclair WaycottCanada2026-05-16Feiner Bros PROPOSAL58Anna Fali
1021Jennifer AmigonCanada2026-05-01Chanay, Jeffrey A Esq NEGOTIATION8Asiya Javayant
1022Isabel BowleyJapan2026-05-10Printing Dimensions NEW19Onyama Limba
1023Ashley DoeJapan2026-05-15Feiner Bros NEW49Ivan Magalhaes
1024Adams MorascaAustralia2026-05-01Rousseaux, Michael Esq NEW85Xuxue Feng
1025Jennifer AmigonJapan2026-05-08King, Christopher A Esq UNQUALIFIED11Anna Fali
1026Deepesh ChuiUnited Kingdom2026-05-03Commercial Press UNQUALIFIED82Xuxue Feng
1027Mujtaba NickaArgentina2026-05-18Commercial Press RENEWAL5Stephen Shaw
1028Antonio CaudyIndia2026-04-26Commercial Press UNQUALIFIED5Stephen Shaw
1029Silvio SlusarskiUnited Kingdom2026-05-21Chapman, Ross E Esq QUALIFIED1Amy Elsner
1030Ivar PaprockiGermany2026-05-03Rousseaux, Michael Esq NEW3Ivan Magalhaes
1031Octavia MaletFrance2026-05-13Chanay, Jeffrey A Esq RENEWAL8Ioni Bowcher
1032Kaitlin OstroskyGermany2026-05-16Dorl, James J Esq NEW84Ioni Bowcher
1033Ashley DoeRussia2026-05-07Chemel, James L Cpa RENEWAL22Bernardo Dominic
1034Deepesh ChuiItaly2026-05-20Rousseaux, Michael Esq NEGOTIATION58Anna Fali
1035Adams MorascaJapan2026-04-26King, Christopher A Esq NEGOTIATION14Xuxue Feng
1036Wickens NestleBrazil2026-05-12Rousseaux, Michael Esq UNQUALIFIED9Ivan Magalhaes
1037Murillo MaletRussia2026-05-21Rousseaux, Michael Esq UNQUALIFIED19Onyama Limba
1038Jeanfrancois VenereUnited Kingdom2026-05-16Chemel, James L Cpa RENEWAL52Stephen Shaw
1039Chavez BriddickFrance2026-05-22Printing Dimensions NEW83Asiya Javayant
1040David DarakjyJapan2026-05-15Feltz Printing Service NEW44Elwin Sharvill
1041Clifford RimIndia2026-04-24Truhlar And Truhlar Attys NEGOTIATION49Onyama Limba
1042James ButtCanada2026-05-12Feiner Bros QUALIFIED19Ioni Bowcher
1043Ashley DoeFrance2026-05-08Buckley Miller Wright NEGOTIATION6Ivan Magalhaes
1044Octavia MaletCanada2026-05-21Feltz Printing Service NEGOTIATION99Xuxue Feng
1045Antonio CaudySpain2026-05-22Chapman, Ross E Esq QUALIFIED13Xuxue Feng
1046Clifford RimSpain2026-05-19Feltz Printing Service PROPOSAL99Elwin Sharvill
1047Julie StensethJapan2026-05-12Feltz Printing Service QUALIFIED47Xuxue Feng
1048Wickens NestleCanada2026-05-06Rangoni Of Florence NEGOTIATION4Stephen Shaw
1049Alejandro PerinIndia2026-05-19Truhlar And Truhlar Attys PROPOSAL25Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Aruna FigeroaArgentinaAsiya Javayant UNQUALIFIED
Emily WhobreyGermanyBernardo Dominic NEW
Clifford RimIndiaIvan Magalhaes UNQUALIFIED
Cody SaylorsItalyAnna Fali QUALIFIED
Jefferson SchemmerSpainBernardo Dominic NEGOTIATION
Aditya KuskoAustraliaStephen Shaw QUALIFIED
Murillo MaletBrazilAmy Elsner NEGOTIATION
Wickens NestleRussiaStephen Shaw PROPOSAL
Maria MarrierItalyElwin Sharvill NEGOTIATION
Leon OldroydSpainStephen Shaw NEGOTIATION
Jefferson SchemmerRussiaBernardo Dominic UNQUALIFIED
Jefferson SchemmerCanadaAmy Elsner RENEWAL
Salvatore StockhamArgentinaAnna Fali RENEWAL
David DarakjyFranceAmy Elsner PROPOSAL
Ivar PaprockiIndiaXuxue Feng NEW
Kadeem FlosiGermanyAsiya Javayant QUALIFIED
Octavia MaletArgentinaIoni Bowcher UNQUALIFIED
Kaitlin OstroskyIndiaStephen Shaw QUALIFIED
Alejandro PerinIndiaAnna Fali NEW
Wickens NestleArgentinaStephen Shaw NEW
Sinclair WaycottArgentinaAsiya Javayant RENEWAL
Jefferson SchemmerRussiaElwin Sharvill UNQUALIFIED
Murillo MaletAustraliaElwin Sharvill PROPOSAL
Clifford RimSpainBernardo Dominic QUALIFIED
Leon OldroydGermanyBernardo Dominic UNQUALIFIED
Stacey MacleadAustraliaXuxue Feng PROPOSAL
Greenwood BologniaAustraliaAmy Elsner QUALIFIED
Jennifer AmigonArgentinaXuxue Feng NEW
Aika InouyeRussiaStephen Shaw PROPOSAL
Deepesh ChuiItalyXuxue Feng RENEWAL
Costa DilliardGermanyAmy Elsner RENEWAL
Stacey MacleadBrazilIvan Magalhaes UNQUALIFIED
Salvatore StockhamJapanElwin Sharvill PROPOSAL
Darci PoquetteJapanAsiya Javayant QUALIFIED
Costa DilliardItalyAnna Fali UNQUALIFIED
Silvio SlusarskiRussiaAnna Fali QUALIFIED
Arvin AlbaresArgentinaAsiya Javayant UNQUALIFIED
Greenwood BologniaRussiaAsiya Javayant UNQUALIFIED
Emily WhobreyArgentinaIoni Bowcher QUALIFIED
Murillo MaletJapanIoni Bowcher QUALIFIED
Emily WhobreyCanadaAsiya Javayant QUALIFIED
Tony FollerArgentinaAmy Elsner UNQUALIFIED
Johnson SergiCanadaAmy Elsner NEGOTIATION
Jefferson SchemmerArgentinaOnyama Limba PROPOSAL
Sinclair WaycottCanadaAnna Fali RENEWAL
Greenwood BologniaJapanElwin Sharvill UNQUALIFIED
Faith GillianAustraliaOnyama Limba RENEWAL
Juan WieserSpainAnna Fali PROPOSAL
Mayumi KolmetzAustraliaXuxue Feng RENEWAL
Jones VocelkaArgentinaIvan Magalhaes RENEWAL
Frozen Columns
Name
Alejandro Perin
Claire Tollner
Chavez Briddick
Wickens Nestle
Johnson Sergi
David Darakjy
Munro Ferencz
Emily Whobrey
Murillo Malet
Maisha Rulapaugh
Misaki Royster
Nicolas Iturbide
Izzy Garufi
Leon Oldroyd
Jones Vocelka
Kadeem Flosi
Ashley Doe
Sinclair Waycott
Izzy Garufi
Adams Morasca
Jefferson Schemmer
Jennifer Amigon
Jones Vocelka
Cody Saylors
Nicolas Iturbide
Silvio Slusarski
Chavez Briddick
Juan Wieser
Munro Ferencz
Claire Tollner
Julie Stenseth
Isabel Bowley
Sinclair Waycott
Rodrigues Campain
Julie Stenseth
Adams Morasca
Rodrigues Campain
Clifford Rim
Wickens Nestle
Julie Stenseth
Mujtaba Nicka
Smith Glick
Silvio Slusarski
Nicolas Iturbide
Emily Whobrey
Darci Poquette
Salvatore Stockham
Tony Foller
Adams Morasca
Maisha Rulapaugh
IdCountryDate
1000Spain2026-04-23
1001United Kingdom2026-05-12
1002Spain2026-05-03
1003Japan2026-05-01
1004Spain2026-04-27
1005Spain2026-05-02
1006Russia2026-05-10
1007Japan2026-05-06
1008India2026-05-13
1009Argentina2026-05-10
1010France2026-05-15
1011Russia2026-05-12
1012Spain2026-05-09
1013Germany2026-05-08
1014France2026-05-06
1015Italy2026-04-28
1016Germany2026-05-07
1017United Kingdom2026-05-05
1018France2026-05-07
1019Russia2026-05-04
1020Spain2026-05-07
1021Argentina2026-04-30
1022Germany2026-04-23
1023Italy2026-05-07
1024France2026-05-11
1025Canada2026-05-15
1026Japan2026-05-02
1027Canada2026-05-05
1028India2026-05-18
1029Australia2026-05-08
1030Argentina2026-05-20
1031Germany2026-05-06
1032United Kingdom2026-05-20
1033India2026-05-14
1034Argentina2026-05-14
1035Germany2026-05-11
1036Canada2026-05-22
1037Italy2026-05-16
1038Argentina2026-04-26
1039Russia2026-04-23
1040Italy2026-05-01
1041Japan2026-05-01
1042Canada2026-05-16
1043Spain2026-05-01
1044India2026-04-23
1045France2026-05-05
1046Italy2026-05-05
1047Japan2026-05-12
1048Japan2026-04-24
1049Spain2026-04-24

On-Demand Data

NameIdCountryDate
Silvio Slusarski1000Russia2026-05-03
Maisha Rulapaugh1001United Kingdom2026-05-16
Claire Tollner1002Argentina2026-05-11
Sinclair Waycott1003Japan2026-05-05
Aika Inouye1004Argentina2026-04-23
Ricardo Gaucho1005India2026-05-11
Aruna Figeroa1006Russia2026-05-03
Aruna Figeroa1007Australia2026-05-14
Nicolas Iturbide1008Brazil2026-05-19
Octavia Malet1009Russia2026-05-13
Wickens Nestle1010Japan2026-04-23
Adams Morasca1011Argentina2026-05-15
Mujtaba Nicka1012United Kingdom2026-04-28
Jefferson Schemmer1013Brazil2026-04-26
Mujtaba Nicka1014Germany2026-04-24
Jones Vocelka1015France2026-05-14
Silvio Slusarski1016Spain2026-05-07
Juan Wieser1017France2026-05-19
Rodrigues Campain1018Brazil2026-05-14
Leja Caldarera1019Australia2026-05-01
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Rodrigues CampainBrazilBernardo Dominic RENEWAL
Jeanfrancois VenereGermanyIvan Magalhaes RENEWAL
Mujtaba NickaGermanyOnyama Limba PROPOSAL
Leja CaldareraAustraliaAnna Fali RENEWAL
Stacey MacleadArgentinaAnna Fali PROPOSAL
Ricardo GauchoBrazilIvan Magalhaes RENEWAL
Mujtaba NickaRussiaIoni Bowcher NEGOTIATION
Misaki RoysterGermanyIoni Bowcher QUALIFIED
Jones VocelkaArgentinaXuxue Feng NEGOTIATION
Ricardo GauchoUnited KingdomStephen Shaw RENEWAL
Faith GillianJapanAsiya Javayant QUALIFIED
Nicolas IturbideAustraliaIoni Bowcher NEW
Jennifer AmigonJapanAsiya Javayant QUALIFIED
Jefferson SchemmerIndiaStephen Shaw PROPOSAL
Darci PoquetteJapanIoni Bowcher PROPOSAL
Ashley DoeJapanIoni Bowcher QUALIFIED
Misaki RoysterSpainXuxue Feng UNQUALIFIED
Isabel BowleyCanadaStephen Shaw UNQUALIFIED
Julie StensethIndiaIoni Bowcher QUALIFIED
Cody SaylorsSpainStephen Shaw RENEWAL
Costa DilliardArgentinaElwin Sharvill RENEWAL
Greenwood BologniaIndiaIoni Bowcher PROPOSAL
Aditya KuskoGermanyAsiya Javayant PROPOSAL
Leja CaldareraCanadaXuxue Feng RENEWAL
Jennifer AmigonIndiaElwin Sharvill RENEWAL
Chavez BriddickArgentinaIvan Magalhaes RENEWAL
Francesco ShinkoItalyStephen Shaw NEGOTIATION
Tony FollerSpainIoni Bowcher PROPOSAL
Juan WieserAustraliaIvan Magalhaes NEW
Octavia MaletCanadaAmy Elsner PROPOSAL
Jones VocelkaJapanStephen Shaw NEW
Jennifer AmigonUnited KingdomAnna Fali RENEWAL
Jennifer AmigonBrazilStephen Shaw UNQUALIFIED
Antonio CaudyGermanyOnyama Limba PROPOSAL
Kaitlin OstroskyAustraliaBernardo Dominic PROPOSAL
Emily WhobreySpainStephen Shaw QUALIFIED
Adams MorascaCanadaIvan Magalhaes RENEWAL
Salvatore StockhamCanadaElwin Sharvill RENEWAL
Deepesh ChuiBrazilAmy Elsner NEGOTIATION
Juan WieserCanadaIoni 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>