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 MarrierGermanyAsiya Javayant RENEWAL
Izzy GarufiIndiaAsiya Javayant RENEWAL
Johnson SergiBrazilAsiya Javayant PROPOSAL
Salvatore StockhamIndiaAnna Fali UNQUALIFIED
Ivar PaprockiRussiaIoni Bowcher NEGOTIATION
Chavez BriddickItalyAmy Elsner QUALIFIED
Alejandro PerinBrazilBernardo Dominic NEGOTIATION
Ivar PaprockiArgentinaAsiya Javayant NEGOTIATION
Clifford RimSpainBernardo Dominic QUALIFIED
Octavia MaletJapanStephen Shaw PROPOSAL
Costa DilliardGermanyAsiya Javayant NEGOTIATION
Stacey MacleadSpainAsiya Javayant UNQUALIFIED
Morrow RutaAustraliaElwin Sharvill QUALIFIED
Faith GillianArgentinaStephen Shaw RENEWAL
Ashley DoeSpainAnna Fali QUALIFIED
Antonio CaudySpainIvan Magalhaes NEW
Nicolas IturbideBrazilXuxue Feng NEW
Silvio SlusarskiCanadaIvan Magalhaes QUALIFIED
Leon OldroydArgentinaXuxue Feng NEGOTIATION
Stacey MacleadFranceAnna Fali UNQUALIFIED
Costa DilliardJapanOnyama Limba RENEWAL
Darci PoquetteJapanStephen Shaw RENEWAL
Munro FerenczAustraliaIvan Magalhaes RENEWAL
Jeanfrancois VenereUnited KingdomIvan Magalhaes NEGOTIATION
James ButtCanadaIvan Magalhaes QUALIFIED
Misaki RoysterItalyOnyama Limba PROPOSAL
Antonio CaudyRussiaBernardo Dominic RENEWAL
Jefferson SchemmerAustraliaStephen Shaw PROPOSAL
Izzy GarufiFranceIvan Magalhaes NEW
Clifford RimJapanIvan Magalhaes QUALIFIED
Faith GillianFranceAmy Elsner QUALIFIED
Maisha RulapaughIndiaAmy Elsner NEGOTIATION
Emily WhobreyBrazilOnyama Limba RENEWAL
Silvio SlusarskiAustraliaIoni Bowcher PROPOSAL
Sinclair WaycottUnited KingdomOnyama Limba QUALIFIED
Antonio CaudyItalyAnna Fali QUALIFIED
Jennifer AmigonArgentinaStephen Shaw PROPOSAL
Wickens NestleFranceAsiya Javayant PROPOSAL
Smith GlickUnited KingdomStephen Shaw NEW
Deepesh ChuiIndiaStephen Shaw RENEWAL
Greenwood BologniaJapanXuxue Feng QUALIFIED
Faith GillianUnited KingdomStephen Shaw PROPOSAL
Rodrigues CampainGermanyStephen Shaw RENEWAL
Ivar PaprockiRussiaIoni Bowcher RENEWAL
Greenwood BologniaSpainIoni Bowcher UNQUALIFIED
Aika InouyeCanadaElwin Sharvill RENEWAL
Stacey MacleadUnited KingdomElwin Sharvill UNQUALIFIED
Munro FerenczFranceOnyama Limba QUALIFIED
Julie StensethAustraliaAsiya Javayant QUALIFIED
Jones VocelkaAustraliaBernardo Dominic QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Deepesh ChuiRussiaOnyama Limba RENEWAL
Munro FerenczBrazilXuxue Feng RENEWAL
Arvin AlbaresFranceBernardo Dominic RENEWAL
Adams MorascaBrazilStephen Shaw UNQUALIFIED
Greenwood BologniaFranceAnna Fali QUALIFIED
Murillo MaletAustraliaStephen Shaw UNQUALIFIED
Aruna FigeroaFranceBernardo Dominic NEGOTIATION
Cody SaylorsGermanyOnyama Limba QUALIFIED
Jefferson SchemmerItalyIvan Magalhaes PROPOSAL
Nicolas IturbideJapanElwin Sharvill RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Smith GlickIndia2026-06-14Rangoni Of Florence PROPOSAL95Ivan Magalhaes
1001Aditya KuskoRussia2026-06-20Rangoni Of Florence PROPOSAL78Bernardo Dominic
1002Clifford RimGermany2026-05-28Commercial Press NEW53Stephen Shaw
1003Julie StensethItaly2026-06-03Chapman, Ross E Esq PROPOSAL9Ioni Bowcher
1004Maria MarrierSpain2026-06-08Chemel, James L Cpa RENEWAL50Bernardo Dominic
1005Faith GillianIndia2026-06-07Buckley Miller Wright RENEWAL13Ivan Magalhaes
1006Juan WieserItaly2026-06-20Feiner Bros RENEWAL74Asiya Javayant
1007Mujtaba NickaCanada2026-06-09Buckley Miller Wright NEW28Bernardo Dominic
1008Francesco ShinkoItaly2026-05-31Buckley Miller Wright RENEWAL96Anna Fali
1009Aditya KuskoCanada2026-06-09Commercial Press PROPOSAL19Onyama Limba
1010Adams MorascaJapan2026-06-18Printing Dimensions PROPOSAL29Xuxue Feng
1011Costa DilliardCanada2026-06-07Feltz Printing Service QUALIFIED6Bernardo Dominic
1012Aditya KuskoSpain2026-05-22Chemel, James L Cpa NEW20Ioni Bowcher
1013Arvin AlbaresItaly2026-05-31Chemel, James L Cpa UNQUALIFIED47Ivan Magalhaes
1014Julie StensethItaly2026-06-04Chemel, James L Cpa UNQUALIFIED96Ioni Bowcher
1015Emily WhobreyRussia2026-06-01Commercial Press QUALIFIED81Stephen Shaw
1016Octavia MaletArgentina2026-06-15Dorl, James J Esq PROPOSAL34Amy Elsner
1017Nicolas IturbideIndia2026-06-03Commercial Press QUALIFIED73Ioni Bowcher
1018Jeanfrancois VenereBrazil2026-06-11Feltz Printing Service PROPOSAL70Onyama Limba
1019Deepesh ChuiSpain2026-05-31Buckley Miller Wright RENEWAL68Xuxue Feng
1020Tony FollerUnited Kingdom2026-05-31Buckley Miller Wright NEW55Asiya Javayant
1021Maisha RulapaughItaly2026-06-02Commercial Press NEGOTIATION33Asiya Javayant
1022Antonio CaudyGermany2026-05-22King, Christopher A Esq NEW42Amy Elsner
1023Mayumi KolmetzArgentina2026-06-13Benton, John B Jr RENEWAL7Anna Fali
1024James ButtArgentina2026-06-06Chemel, James L Cpa NEW86Anna Fali
1025Chavez BriddickSpain2026-06-13King, Christopher A Esq RENEWAL17Ioni Bowcher
1026Johnson SergiUnited Kingdom2026-06-16Benton, John B Jr QUALIFIED18Ivan Magalhaes
1027Nicolas IturbideGermany2026-06-10Truhlar And Truhlar Attys QUALIFIED80Xuxue Feng
1028Misaki RoysterCanada2026-06-07Rangoni Of Florence QUALIFIED67Bernardo Dominic
1029Jeanfrancois VenereIndia2026-06-02Chapman, Ross E Esq RENEWAL56Anna Fali
1030Maisha RulapaughBrazil2026-06-09Commercial Press QUALIFIED16Asiya Javayant
1031James ButtIndia2026-05-26Dorl, James J Esq RENEWAL84Asiya Javayant
1032Isabel BowleyJapan2026-05-30Chemel, James L Cpa RENEWAL63Anna Fali
1033Izzy GarufiArgentina2026-06-15Chemel, James L Cpa PROPOSAL60Ioni Bowcher
1034Isabel BowleyArgentina2026-06-02Rangoni Of Florence NEGOTIATION54Bernardo Dominic
1035Jefferson SchemmerGermany2026-06-08Rangoni Of Florence PROPOSAL89Ivan Magalhaes
1036Smith GlickJapan2026-05-27Chemel, James L Cpa UNQUALIFIED6Anna Fali
1037James ButtBrazil2026-06-20Truhlar And Truhlar Attys NEGOTIATION8Xuxue Feng
1038Jefferson SchemmerCanada2026-06-15Feltz Printing Service NEW89Elwin Sharvill
1039Adams MorascaItaly2026-06-02Printing Dimensions PROPOSAL35Xuxue Feng
1040Murillo MaletArgentina2026-05-29Feltz Printing Service NEW35Ivan Magalhaes
1041Jefferson SchemmerArgentina2026-06-18Rousseaux, Michael Esq QUALIFIED21Elwin Sharvill
1042Alejandro PerinFrance2026-06-20Morlong Associates QUALIFIED15Anna Fali
1043Faith GillianArgentina2026-06-03Printing Dimensions NEW93Elwin Sharvill
1044Rodrigues CampainAustralia2026-06-13King, Christopher A Esq NEGOTIATION8Ivan Magalhaes
1045Cody SaylorsItaly2026-06-03Morlong Associates QUALIFIED61Stephen Shaw
1046Jennifer AmigonBrazil2026-05-30King, Christopher A Esq RENEWAL48Onyama Limba
1047Maisha RulapaughCanada2026-05-25Chapman, Ross E Esq UNQUALIFIED53Ioni Bowcher
1048Ashley DoeRussia2026-05-22Printing Dimensions RENEWAL48Asiya Javayant
1049Emily WhobreyArgentina2026-06-14Rangoni Of Florence QUALIFIED95Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Silvio SlusarskiFranceIoni Bowcher QUALIFIED
Leja CaldareraRussiaXuxue Feng NEW
Deepesh ChuiIndiaXuxue Feng NEGOTIATION
Isabel BowleyJapanXuxue Feng PROPOSAL
Aditya KuskoAustraliaAnna Fali PROPOSAL
Leon OldroydCanadaAnna Fali NEGOTIATION
Deepesh ChuiBrazilStephen Shaw QUALIFIED
Julie StensethJapanIvan Magalhaes RENEWAL
Ashley DoeIndiaAnna Fali NEW
Silvio SlusarskiSpainAnna Fali RENEWAL
Mujtaba NickaArgentinaIoni Bowcher NEW
Ashley DoeArgentinaStephen Shaw NEGOTIATION
Misaki RoysterBrazilStephen Shaw NEGOTIATION
Deepesh ChuiBrazilAmy Elsner RENEWAL
Misaki RoysterIndiaOnyama Limba QUALIFIED
Mayumi KolmetzBrazilIoni Bowcher RENEWAL
Claire TollnerUnited KingdomAsiya Javayant NEW
Faith GillianBrazilOnyama Limba NEW
Kaitlin OstroskyIndiaAmy Elsner UNQUALIFIED
Misaki RoysterItalyStephen Shaw PROPOSAL
Smith GlickSpainXuxue Feng RENEWAL
Darci PoquetteArgentinaIoni Bowcher PROPOSAL
Jones VocelkaArgentinaAsiya Javayant QUALIFIED
Mayumi KolmetzAustraliaXuxue Feng RENEWAL
Murillo MaletJapanXuxue Feng NEW
Chavez BriddickItalyBernardo Dominic NEGOTIATION
Misaki RoysterBrazilBernardo Dominic NEGOTIATION
Ivar PaprockiJapanIvan Magalhaes RENEWAL
Chavez BriddickArgentinaBernardo Dominic QUALIFIED
David DarakjyJapanIoni Bowcher UNQUALIFIED
Mayumi KolmetzRussiaAmy Elsner UNQUALIFIED
Aruna FigeroaGermanyXuxue Feng NEGOTIATION
Aruna FigeroaItalyStephen Shaw QUALIFIED
Isabel BowleyBrazilXuxue Feng QUALIFIED
Aruna FigeroaFranceAmy Elsner QUALIFIED
Claire TollnerRussiaIoni Bowcher NEW
Leja CaldareraIndiaOnyama Limba UNQUALIFIED
Julie StensethRussiaIvan Magalhaes NEW
Isabel BowleyRussiaStephen Shaw QUALIFIED
Kaitlin OstroskyIndiaBernardo Dominic PROPOSAL
Isabel BowleyBrazilIvan Magalhaes RENEWAL
Misaki RoysterBrazilStephen Shaw RENEWAL
Salvatore StockhamCanadaBernardo Dominic NEGOTIATION
Francesco ShinkoRussiaOnyama Limba RENEWAL
Mayumi KolmetzAustraliaAmy Elsner NEGOTIATION
Chavez BriddickJapanElwin Sharvill UNQUALIFIED
Mujtaba NickaUnited KingdomXuxue Feng PROPOSAL
Claire TollnerSpainIvan Magalhaes RENEWAL
Sinclair WaycottJapanIvan Magalhaes RENEWAL
Silvio SlusarskiJapanXuxue Feng NEGOTIATION
Frozen Columns
Name
Leja Caldarera
Deepesh Chui
Morrow Ruta
Leja Caldarera
Murillo Malet
Kaitlin Ostrosky
Aditya Kusko
Kadeem Flosi
Claire Tollner
Aruna Figeroa
Leja Caldarera
Emily Whobrey
Misaki Royster
Antonio Caudy
Ricardo Gaucho
Emily Whobrey
Morrow Ruta
Emily Whobrey
Juan Wieser
Jennifer Amigon
Salvatore Stockham
Cody Saylors
Chavez Briddick
Munro Ferencz
Emily Whobrey
Leja Caldarera
David Darakjy
Murillo Malet
Alejandro Perin
Maria Marrier
Julie Stenseth
Maisha Rulapaugh
Ashley Doe
Mayumi Kolmetz
Nicolas Iturbide
Rodrigues Campain
Ivar Paprocki
Aika Inouye
Alejandro Perin
Jefferson Schemmer
Ivar Paprocki
Kaitlin Ostrosky
Chavez Briddick
Izzy Garufi
Adams Morasca
Izzy Garufi
Chavez Briddick
Ricardo Gaucho
Cody Saylors
Julie Stenseth
IdCountryDate
1000Argentina2026-06-11
1001Argentina2026-06-17
1002Canada2026-06-19
1003Russia2026-06-12
1004United Kingdom2026-06-13
1005France2026-06-03
1006India2026-06-17
1007Italy2026-06-08
1008Canada2026-05-23
1009India2026-06-15
1010Australia2026-05-26
1011Australia2026-06-19
1012Italy2026-06-14
1013Canada2026-06-01
1014Australia2026-06-17
1015Spain2026-06-03
1016Japan2026-05-29
1017India2026-05-24
1018Italy2026-05-29
1019Russia2026-05-22
1020Canada2026-05-24
1021United Kingdom2026-05-23
1022Argentina2026-06-08
1023Canada2026-06-20
1024Germany2026-05-29
1025Italy2026-05-29
1026France2026-06-03
1027Argentina2026-05-30
1028Russia2026-06-19
1029Brazil2026-06-10
1030Australia2026-05-30
1031Germany2026-06-07
1032Australia2026-06-16
1033India2026-06-11
1034Japan2026-05-31
1035Canada2026-06-16
1036Australia2026-06-11
1037Italy2026-05-22
1038Germany2026-05-22
1039Canada2026-05-28
1040Russia2026-05-31
1041United Kingdom2026-06-01
1042India2026-06-16
1043Australia2026-06-08
1044Australia2026-06-07
1045Argentina2026-06-02
1046Italy2026-05-27
1047Russia2026-06-10
1048Argentina2026-06-04
1049United Kingdom2026-05-23

On-Demand Data

NameIdCountryDate
Mayumi Kolmetz1000France2026-06-12
Jefferson Schemmer1001Spain2026-05-30
Clifford Rim1002Argentina2026-06-01
Darci Poquette1003Russia2026-06-15
Isabel Bowley1004United Kingdom2026-05-30
Murillo Malet1005Russia2026-06-04
Greenwood Bolognia1006Canada2026-06-04
Aditya Kusko1007Australia2026-06-14
Jones Vocelka1008United Kingdom2026-06-13
Leon Oldroyd1009Italy2026-06-16
Costa Dilliard1010Japan2026-06-11
Francesco Shinko1011Italy2026-05-31
Juan Wieser1012France2026-06-02
Silvio Slusarski1013Brazil2026-06-03
Murillo Malet1014Australia2026-05-22
James Butt1015Spain2026-05-24
Faith Gillian1016Canada2026-05-23
Misaki Royster1017Argentina2026-06-10
Claire Tollner1018Germany2026-06-19
Claire Tollner1019Japan2026-06-13
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jennifer AmigonFranceAsiya Javayant NEGOTIATION
Alejandro PerinGermanyBernardo Dominic UNQUALIFIED
Jones VocelkaSpainElwin Sharvill RENEWAL
Aruna FigeroaBrazilIoni Bowcher NEW
Izzy GarufiJapanElwin Sharvill UNQUALIFIED
Maria MarrierAustraliaOnyama Limba NEGOTIATION
Jones VocelkaIndiaXuxue Feng UNQUALIFIED
Kaitlin OstroskyGermanyOnyama Limba QUALIFIED
Aika InouyeSpainXuxue Feng QUALIFIED
Jefferson SchemmerArgentinaIoni Bowcher RENEWAL
Morrow RutaArgentinaIoni Bowcher NEW
Jennifer AmigonItalyElwin Sharvill QUALIFIED
Johnson SergiGermanyIoni Bowcher NEW
Faith GillianSpainAnna Fali PROPOSAL
Cody SaylorsArgentinaAnna Fali UNQUALIFIED
Stacey MacleadAustraliaIvan Magalhaes QUALIFIED
Stacey MacleadGermanyAsiya Javayant RENEWAL
Silvio SlusarskiArgentinaOnyama Limba PROPOSAL
Jennifer AmigonIndiaAsiya Javayant NEW
Darci PoquetteBrazilIoni Bowcher RENEWAL
Kadeem FlosiBrazilOnyama Limba NEW
David DarakjyRussiaOnyama Limba RENEWAL
Greenwood BologniaSpainOnyama Limba UNQUALIFIED
Stacey MacleadUnited KingdomBernardo Dominic NEGOTIATION
Maria MarrierIndiaIoni Bowcher NEW
Morrow RutaRussiaAnna Fali PROPOSAL
Ivar PaprockiFranceBernardo Dominic QUALIFIED
Izzy GarufiSpainAmy Elsner QUALIFIED
Emily WhobreyGermanyAnna Fali RENEWAL
Ricardo GauchoJapanAmy Elsner NEGOTIATION
James ButtAustraliaElwin Sharvill QUALIFIED
Mujtaba NickaAustraliaIvan Magalhaes UNQUALIFIED
Maisha RulapaughCanadaBernardo Dominic QUALIFIED
Morrow RutaArgentinaXuxue Feng NEGOTIATION
Costa DilliardArgentinaBernardo Dominic QUALIFIED
Mayumi KolmetzArgentinaAmy Elsner NEGOTIATION
Tony FollerCanadaElwin Sharvill RENEWAL
James ButtAustraliaElwin Sharvill NEGOTIATION
Mayumi KolmetzItalyXuxue Feng NEW
Darci PoquetteJapanIvan Magalhaes NEW

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