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 OldroydIndiaXuxue Feng QUALIFIED
Smith GlickBrazilBernardo Dominic NEW
Aika InouyeFranceIvan Magalhaes QUALIFIED
Jones VocelkaAustraliaIvan Magalhaes NEGOTIATION
Isabel BowleyIndiaStephen Shaw NEW
Munro FerenczJapanBernardo Dominic PROPOSAL
Izzy GarufiUnited KingdomXuxue Feng UNQUALIFIED
Jeanfrancois VenereFranceAnna Fali RENEWAL
Claire TollnerArgentinaStephen Shaw QUALIFIED
Emily WhobreyArgentinaBernardo Dominic RENEWAL
David DarakjyJapanStephen Shaw PROPOSAL
Francesco ShinkoGermanyIoni Bowcher NEGOTIATION
Munro FerenczUnited KingdomAsiya Javayant RENEWAL
Chavez BriddickArgentinaBernardo Dominic UNQUALIFIED
Mujtaba NickaFranceIvan Magalhaes RENEWAL
Francesco ShinkoIndiaXuxue Feng NEW
Maisha RulapaughAustraliaAnna Fali NEW
Costa DilliardIndiaIvan Magalhaes RENEWAL
Arvin AlbaresCanadaXuxue Feng UNQUALIFIED
Antonio CaudyFranceStephen Shaw UNQUALIFIED
Arvin AlbaresRussiaAnna Fali NEGOTIATION
Isabel BowleyRussiaStephen Shaw PROPOSAL
Jeanfrancois VenereIndiaIvan Magalhaes PROPOSAL
Aika InouyeCanadaOnyama Limba NEW
Murillo MaletItalyAsiya Javayant UNQUALIFIED
Aruna FigeroaBrazilXuxue Feng NEW
Mujtaba NickaArgentinaIvan Magalhaes NEW
Aika InouyeUnited KingdomAsiya Javayant QUALIFIED
Deepesh ChuiGermanyIoni Bowcher QUALIFIED
Wickens NestleCanadaAmy Elsner NEW
Munro FerenczSpainIoni Bowcher NEGOTIATION
Sinclair WaycottRussiaIoni Bowcher RENEWAL
Sinclair WaycottArgentinaIoni Bowcher NEW
Chavez BriddickSpainAmy Elsner NEGOTIATION
Isabel BowleyBrazilIvan Magalhaes NEW
Alejandro PerinJapanIoni Bowcher NEW
Munro FerenczArgentinaIvan Magalhaes RENEWAL
Juan WieserItalyOnyama Limba PROPOSAL
Emily WhobreyRussiaIoni Bowcher PROPOSAL
Darci PoquetteIndiaIoni Bowcher QUALIFIED
Aditya KuskoRussiaAmy Elsner NEW
Nicolas IturbideRussiaBernardo Dominic NEGOTIATION
Leja CaldareraSpainAsiya Javayant QUALIFIED
Antonio CaudyUnited KingdomAnna Fali QUALIFIED
Mujtaba NickaCanadaAnna Fali NEGOTIATION
Leja CaldareraItalyOnyama Limba NEW
Kadeem FlosiItalyIoni Bowcher NEW
Alejandro PerinArgentinaIoni Bowcher UNQUALIFIED
Emily WhobreyArgentinaAmy Elsner UNQUALIFIED
Isabel BowleyRussiaIvan Magalhaes RENEWAL
Horizontal
NameCountryRepresentativeStatus
Smith GlickCanadaElwin Sharvill PROPOSAL
Claire TollnerArgentinaAsiya Javayant PROPOSAL
James ButtUnited KingdomOnyama Limba NEGOTIATION
Octavia MaletArgentinaElwin Sharvill RENEWAL
Jennifer AmigonCanadaAmy Elsner QUALIFIED
Antonio CaudyUnited KingdomIoni Bowcher RENEWAL
Darci PoquetteJapanIvan Magalhaes QUALIFIED
Darci PoquetteUnited KingdomOnyama Limba RENEWAL
Stacey MacleadUnited KingdomAsiya Javayant UNQUALIFIED
Kadeem FlosiJapanIvan Magalhaes RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Alejandro PerinGermany2026-05-09Printing Dimensions PROPOSAL55Onyama Limba
1001Claire TollnerItaly2026-05-18Feltz Printing Service PROPOSAL47Elwin Sharvill
1002David DarakjyIndia2026-05-17Chapman, Ross E Esq PROPOSAL10Stephen Shaw
1003Emily WhobreyFrance2026-05-26Rousseaux, Michael Esq QUALIFIED56Elwin Sharvill
1004Jennifer AmigonFrance2026-05-14Rousseaux, Michael Esq NEW70Anna Fali
1005Leja CaldareraUnited Kingdom2026-05-19Printing Dimensions NEGOTIATION90Ivan Magalhaes
1006Leon OldroydUnited Kingdom2026-05-31Dorl, James J Esq RENEWAL49Anna Fali
1007Silvio SlusarskiArgentina2026-05-28Feiner Bros PROPOSAL62Asiya Javayant
1008Nicolas IturbideBrazil2026-05-14Feiner Bros UNQUALIFIED58Elwin Sharvill
1009Adams MorascaBrazil2026-06-03Dorl, James J Esq NEGOTIATION5Anna Fali
1010Mujtaba NickaArgentina2026-06-02Chanay, Jeffrey A Esq PROPOSAL56Ioni Bowcher
1011Silvio SlusarskiBrazil2026-05-25Morlong Associates NEGOTIATION12Onyama Limba
1012Ivar PaprockiCanada2026-05-05Benton, John B Jr QUALIFIED99Ivan Magalhaes
1013Leon OldroydRussia2026-05-16Truhlar And Truhlar Attys UNQUALIFIED69Elwin Sharvill
1014Kadeem FlosiBrazil2026-05-13Printing Dimensions NEGOTIATION31Elwin Sharvill
1015Maria MarrierGermany2026-05-09Dorl, James J Esq NEW8Xuxue Feng
1016Arvin AlbaresAustralia2026-05-11Morlong Associates UNQUALIFIED34Ivan Magalhaes
1017Murillo MaletCanada2026-05-17King, Christopher A Esq UNQUALIFIED49Xuxue Feng
1018Deepesh ChuiJapan2026-05-22King, Christopher A Esq RENEWAL61Elwin Sharvill
1019Murillo MaletGermany2026-05-16Truhlar And Truhlar Attys NEW87Ioni Bowcher
1020Emily WhobreyGermany2026-05-10Commercial Press QUALIFIED71Ivan Magalhaes
1021James ButtCanada2026-05-12Dorl, James J Esq NEW61Ivan Magalhaes
1022Darci PoquetteBrazil2026-05-29Dorl, James J Esq NEW91Bernardo Dominic
1023Costa DilliardRussia2026-05-11Morlong Associates UNQUALIFIED93Xuxue Feng
1024Clifford RimFrance2026-05-09Commercial Press RENEWAL88Ivan Magalhaes
1025Morrow RutaJapan2026-05-31Printing Dimensions NEW88Elwin Sharvill
1026Mayumi KolmetzBrazil2026-05-05Feiner Bros QUALIFIED2Asiya Javayant
1027Clifford RimGermany2026-06-03King, Christopher A Esq PROPOSAL43Ioni Bowcher
1028Darci PoquetteJapan2026-06-02Morlong Associates UNQUALIFIED77Bernardo Dominic
1029Kaitlin OstroskyJapan2026-05-22Benton, John B Jr QUALIFIED21Onyama Limba
1030Smith GlickArgentina2026-05-07Benton, John B Jr NEW33Asiya Javayant
1031Emily WhobreyCanada2026-05-11Chemel, James L Cpa UNQUALIFIED59Bernardo Dominic
1032Mayumi KolmetzSpain2026-05-10Feiner Bros PROPOSAL26Ivan Magalhaes
1033Julie StensethArgentina2026-05-29Morlong Associates QUALIFIED87Ioni Bowcher
1034Leja CaldareraUnited Kingdom2026-05-06Buckley Miller Wright NEGOTIATION54Stephen Shaw
1035Jeanfrancois VenereArgentina2026-05-28Chemel, James L Cpa PROPOSAL99Xuxue Feng
1036Murillo MaletFrance2026-05-20Truhlar And Truhlar Attys NEGOTIATION82Asiya Javayant
1037James ButtJapan2026-05-26Chapman, Ross E Esq NEW0Xuxue Feng
1038Misaki RoysterAustralia2026-05-25Truhlar And Truhlar Attys NEW3Ioni Bowcher
1039Murillo MaletFrance2026-05-23Morlong Associates UNQUALIFIED44Xuxue Feng
1040David DarakjyJapan2026-05-27Morlong Associates NEW62Ioni Bowcher
1041Leja CaldareraRussia2026-05-25Truhlar And Truhlar Attys NEW13Stephen Shaw
1042Jones VocelkaIndia2026-06-02Commercial Press NEGOTIATION36Stephen Shaw
1043Ashley DoeAustralia2026-05-24Feiner Bros UNQUALIFIED27Ioni Bowcher
1044Sinclair WaycottArgentina2026-05-27Truhlar And Truhlar Attys RENEWAL36Ivan Magalhaes
1045Johnson SergiSpain2026-06-01Chapman, Ross E Esq UNQUALIFIED35Anna Fali
1046Alejandro PerinCanada2026-05-08King, Christopher A Esq UNQUALIFIED64Asiya Javayant
1047Greenwood BologniaFrance2026-05-22Feiner Bros UNQUALIFIED41Ioni Bowcher
1048Tony FollerItaly2026-05-07Rangoni Of Florence QUALIFIED52Asiya Javayant
1049Claire TollnerBrazil2026-05-29Buckley Miller Wright NEW22Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Johnson SergiItalyIvan Magalhaes PROPOSAL
Misaki RoysterJapanStephen Shaw RENEWAL
Tony FollerItalyAmy Elsner UNQUALIFIED
Ashley DoeArgentinaBernardo Dominic RENEWAL
Clifford RimCanadaAmy Elsner QUALIFIED
Emily WhobreyItalyBernardo Dominic RENEWAL
Deepesh ChuiJapanAsiya Javayant QUALIFIED
Nicolas IturbideArgentinaIvan Magalhaes QUALIFIED
Alejandro PerinSpainStephen Shaw QUALIFIED
Cody SaylorsRussiaAsiya Javayant NEGOTIATION
Salvatore StockhamJapanXuxue Feng UNQUALIFIED
Sinclair WaycottArgentinaBernardo Dominic NEW
Leon OldroydCanadaXuxue Feng UNQUALIFIED
Faith GillianRussiaAmy Elsner RENEWAL
Kaitlin OstroskyJapanElwin Sharvill UNQUALIFIED
Costa DilliardItalyAnna Fali NEW
Murillo MaletSpainElwin Sharvill NEW
Alejandro PerinSpainAmy Elsner QUALIFIED
Munro FerenczArgentinaAnna Fali QUALIFIED
Arvin AlbaresBrazilBernardo Dominic NEW
Nicolas IturbideRussiaIvan Magalhaes PROPOSAL
Arvin AlbaresIndiaBernardo Dominic NEGOTIATION
Mayumi KolmetzIndiaElwin Sharvill NEW
Maria MarrierAustraliaStephen Shaw PROPOSAL
Costa DilliardFranceAsiya Javayant NEGOTIATION
Claire TollnerSpainIvan Magalhaes PROPOSAL
Julie StensethRussiaAsiya Javayant UNQUALIFIED
Alejandro PerinIndiaOnyama Limba RENEWAL
Maisha RulapaughArgentinaElwin Sharvill PROPOSAL
Claire TollnerJapanAsiya Javayant NEGOTIATION
Murillo MaletRussiaAnna Fali UNQUALIFIED
Clifford RimJapanAsiya Javayant RENEWAL
Costa DilliardItalyBernardo Dominic RENEWAL
Chavez BriddickUnited KingdomXuxue Feng QUALIFIED
Isabel BowleyGermanyElwin Sharvill UNQUALIFIED
Maria MarrierIndiaXuxue Feng NEW
Izzy GarufiIndiaAnna Fali QUALIFIED
Tony FollerUnited KingdomOnyama Limba NEW
Jeanfrancois VenereArgentinaElwin Sharvill PROPOSAL
Jefferson SchemmerBrazilAmy Elsner NEW
Rodrigues CampainRussiaOnyama Limba UNQUALIFIED
Arvin AlbaresAustraliaBernardo Dominic QUALIFIED
Kadeem FlosiIndiaStephen Shaw RENEWAL
Aditya KuskoAustraliaAsiya Javayant NEW
Leon OldroydFranceAmy Elsner NEGOTIATION
Kadeem FlosiGermanyStephen Shaw NEW
Alejandro PerinItalyXuxue Feng PROPOSAL
Alejandro PerinCanadaAsiya Javayant RENEWAL
Emily WhobreyIndiaElwin Sharvill NEGOTIATION
Wickens NestleGermanyIoni Bowcher QUALIFIED
Frozen Columns
Name
Emily Whobrey
Jefferson Schemmer
Jones Vocelka
Faith Gillian
Aditya Kusko
Mayumi Kolmetz
Jones Vocelka
Salvatore Stockham
James Butt
Sinclair Waycott
Smith Glick
James Butt
Kaitlin Ostrosky
Morrow Ruta
Jones Vocelka
Clifford Rim
Juan Wieser
Izzy Garufi
Sinclair Waycott
Jeanfrancois Venere
Maria Marrier
Maria Marrier
Arvin Albares
Antonio Caudy
Maisha Rulapaugh
Silvio Slusarski
Jones Vocelka
Johnson Sergi
Wickens Nestle
Izzy Garufi
Smith Glick
Misaki Royster
Aditya Kusko
Costa Dilliard
Octavia Malet
Ivar Paprocki
Ricardo Gaucho
Misaki Royster
Maria Marrier
Ashley Doe
Isabel Bowley
Misaki Royster
Rodrigues Campain
Izzy Garufi
Johnson Sergi
Deepesh Chui
Deepesh Chui
Kadeem Flosi
Misaki Royster
Izzy Garufi
IdCountryDate
1000Canada2026-05-11
1001United Kingdom2026-05-30
1002Japan2026-05-19
1003United Kingdom2026-05-21
1004Germany2026-06-03
1005Italy2026-05-05
1006Canada2026-05-21
1007India2026-05-06
1008Russia2026-05-29
1009Australia2026-05-27
1010Australia2026-05-11
1011France2026-05-23
1012Russia2026-05-26
1013France2026-05-20
1014Brazil2026-05-13
1015Japan2026-06-03
1016Spain2026-05-20
1017Germany2026-05-12
1018Argentina2026-05-30
1019United Kingdom2026-05-25
1020India2026-06-01
1021Germany2026-05-27
1022Japan2026-05-31
1023Australia2026-05-16
1024Spain2026-05-26
1025Germany2026-05-26
1026United Kingdom2026-05-28
1027Canada2026-05-31
1028Australia2026-05-14
1029Italy2026-05-05
1030Spain2026-05-24
1031Argentina2026-05-19
1032Russia2026-05-17
1033Russia2026-05-28
1034France2026-05-20
1035Canada2026-05-31
1036Russia2026-06-02
1037Japan2026-05-07
1038Australia2026-06-03
1039United Kingdom2026-05-26
1040Canada2026-05-10
1041United Kingdom2026-05-27
1042Argentina2026-05-22
1043Brazil2026-05-25
1044Japan2026-05-23
1045Italy2026-05-12
1046Japan2026-05-27
1047Canada2026-05-14
1048United Kingdom2026-05-17
1049Spain2026-05-21

On-Demand Data

NameIdCountryDate
Chavez Briddick1000United Kingdom2026-05-05
Julie Stenseth1001Canada2026-05-06
Octavia Malet1002Spain2026-05-09
Johnson Sergi1003France2026-05-12
Julie Stenseth1004Germany2026-05-19
Francesco Shinko1005Brazil2026-05-22
Tony Foller1006United Kingdom2026-05-08
Claire Tollner1007Brazil2026-05-17
Mujtaba Nicka1008Australia2026-05-12
Wickens Nestle1009Japan2026-05-21
Nicolas Iturbide1010Argentina2026-06-01
Aditya Kusko1011Argentina2026-05-09
Maria Marrier1012France2026-05-23
Claire Tollner1013Spain2026-05-13
Salvatore Stockham1014Australia2026-05-09
Aika Inouye1015Brazil2026-05-21
Kaitlin Ostrosky1016Australia2026-05-17
Aditya Kusko1017Germany2026-06-03
Mujtaba Nicka1018Australia2026-05-17
James Butt1019Australia2026-05-11
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Salvatore StockhamUnited KingdomBernardo Dominic QUALIFIED
Kaitlin OstroskyFranceBernardo Dominic NEW
Antonio CaudyIndiaIvan Magalhaes PROPOSAL
Jefferson SchemmerJapanAmy Elsner PROPOSAL
Ricardo GauchoUnited KingdomXuxue Feng QUALIFIED
Julie StensethItalyBernardo Dominic UNQUALIFIED
Clifford RimIndiaIoni Bowcher UNQUALIFIED
Faith GillianItalyAnna Fali QUALIFIED
Costa DilliardArgentinaXuxue Feng NEGOTIATION
Morrow RutaAustraliaElwin Sharvill RENEWAL
Leon OldroydRussiaIoni Bowcher UNQUALIFIED
Cody SaylorsUnited KingdomIvan Magalhaes NEW
Smith GlickJapanXuxue Feng PROPOSAL
Morrow RutaArgentinaAnna Fali NEW
Greenwood BologniaIndiaXuxue Feng PROPOSAL
Faith GillianFranceIvan Magalhaes PROPOSAL
Johnson SergiCanadaOnyama Limba UNQUALIFIED
David DarakjyGermanyBernardo Dominic PROPOSAL
Octavia MaletGermanyAsiya Javayant RENEWAL
Isabel BowleyCanadaStephen Shaw UNQUALIFIED
Mujtaba NickaUnited KingdomIvan Magalhaes PROPOSAL
Jeanfrancois VenereCanadaStephen Shaw RENEWAL
Misaki RoysterUnited KingdomAmy Elsner UNQUALIFIED
Aruna FigeroaBrazilAnna Fali RENEWAL
Clifford RimItalyIvan Magalhaes UNQUALIFIED
Kadeem FlosiBrazilXuxue Feng RENEWAL
Kadeem FlosiUnited KingdomElwin Sharvill UNQUALIFIED
Maria MarrierArgentinaOnyama Limba RENEWAL
Kaitlin OstroskyCanadaIvan Magalhaes UNQUALIFIED
Costa DilliardUnited KingdomElwin Sharvill RENEWAL
Kaitlin OstroskyJapanAnna Fali QUALIFIED
Ashley DoeBrazilIvan Magalhaes RENEWAL
Rodrigues CampainJapanStephen Shaw PROPOSAL
Jefferson SchemmerFranceStephen Shaw RENEWAL
Izzy GarufiGermanyIoni Bowcher NEGOTIATION
Izzy GarufiJapanAmy Elsner RENEWAL
Tony FollerIndiaBernardo Dominic NEGOTIATION
Faith GillianAustraliaAsiya Javayant NEGOTIATION
Ivar PaprockiRussiaAnna Fali QUALIFIED
Clifford RimSpainAsiya Javayant 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>