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
Francesco ShinkoUnited KingdomAsiya Javayant QUALIFIED
Misaki RoysterUnited KingdomXuxue Feng QUALIFIED
Mujtaba NickaArgentinaOnyama Limba UNQUALIFIED
Maisha RulapaughRussiaIvan Magalhaes RENEWAL
Sinclair WaycottRussiaBernardo Dominic PROPOSAL
Jennifer AmigonIndiaIoni Bowcher NEGOTIATION
Wickens NestleRussiaIoni Bowcher RENEWAL
Izzy GarufiArgentinaAnna Fali RENEWAL
Octavia MaletUnited KingdomAsiya Javayant PROPOSAL
Alejandro PerinSpainIoni Bowcher PROPOSAL
Costa DilliardJapanElwin Sharvill RENEWAL
Silvio SlusarskiItalyAnna Fali RENEWAL
Munro FerenczItalyBernardo Dominic NEGOTIATION
Mujtaba NickaAustraliaOnyama Limba UNQUALIFIED
Julie StensethSpainBernardo Dominic NEGOTIATION
Aika InouyeCanadaStephen Shaw NEGOTIATION
Morrow RutaItalyElwin Sharvill PROPOSAL
Munro FerenczIndiaBernardo Dominic RENEWAL
Murillo MaletCanadaAsiya Javayant RENEWAL
Cody SaylorsGermanyStephen Shaw NEGOTIATION
Izzy GarufiBrazilOnyama Limba NEGOTIATION
Antonio CaudySpainStephen Shaw NEW
Faith GillianSpainIvan Magalhaes NEGOTIATION
Jennifer AmigonFranceIvan Magalhaes RENEWAL
Nicolas IturbideIndiaElwin Sharvill NEGOTIATION
Jefferson SchemmerItalyAmy Elsner UNQUALIFIED
Smith GlickIndiaAnna Fali NEW
Kaitlin OstroskyRussiaAmy Elsner RENEWAL
Morrow RutaJapanAsiya Javayant QUALIFIED
Jones VocelkaItalyXuxue Feng QUALIFIED
Morrow RutaBrazilXuxue Feng UNQUALIFIED
Ashley DoeCanadaBernardo Dominic QUALIFIED
Silvio SlusarskiAustraliaAsiya Javayant QUALIFIED
Cody SaylorsUnited KingdomIvan Magalhaes RENEWAL
Johnson SergiRussiaIvan Magalhaes QUALIFIED
Jefferson SchemmerGermanyBernardo Dominic PROPOSAL
Francesco ShinkoSpainAsiya Javayant QUALIFIED
Alejandro PerinGermanyXuxue Feng RENEWAL
Alejandro PerinItalyOnyama Limba UNQUALIFIED
David DarakjyCanadaOnyama Limba RENEWAL
Octavia MaletIndiaAsiya Javayant NEGOTIATION
Alejandro PerinAustraliaElwin Sharvill NEW
Emily WhobreyAustraliaXuxue Feng QUALIFIED
Wickens NestleSpainXuxue Feng PROPOSAL
Silvio SlusarskiItalyBernardo Dominic RENEWAL
Aruna FigeroaGermanyAmy Elsner RENEWAL
Alejandro PerinFranceIoni Bowcher QUALIFIED
Deepesh ChuiBrazilBernardo Dominic RENEWAL
Leon OldroydJapanOnyama Limba QUALIFIED
Silvio SlusarskiRussiaStephen Shaw NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Salvatore StockhamJapanXuxue Feng QUALIFIED
Ivar PaprockiSpainOnyama Limba RENEWAL
Nicolas IturbideCanadaElwin Sharvill NEGOTIATION
Ivar PaprockiBrazilAsiya Javayant QUALIFIED
Ivar PaprockiItalyAnna Fali UNQUALIFIED
Sinclair WaycottItalyIvan Magalhaes UNQUALIFIED
Maria MarrierSpainIoni Bowcher NEGOTIATION
Adams MorascaArgentinaOnyama Limba NEW
Leon OldroydBrazilAnna Fali UNQUALIFIED
Salvatore StockhamItalyXuxue Feng NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Kadeem FlosiJapan2026-05-11Dorl, James J Esq QUALIFIED4Amy Elsner
1001Faith GillianAustralia2026-05-25Benton, John B Jr NEGOTIATION53Ivan Magalhaes
1002Leja CaldareraBrazil2026-05-17Benton, John B Jr PROPOSAL44Xuxue Feng
1003Darci PoquetteGermany2026-05-18Rangoni Of Florence NEGOTIATION76Xuxue Feng
1004Clifford RimRussia2026-05-28Buckley Miller Wright QUALIFIED69Amy Elsner
1005Mayumi KolmetzItaly2026-06-04Rousseaux, Michael Esq UNQUALIFIED20Elwin Sharvill
1006Leja CaldareraJapan2026-05-15Feiner Bros QUALIFIED74Stephen Shaw
1007Aditya KuskoFrance2026-05-17Dorl, James J Esq QUALIFIED21Bernardo Dominic
1008Izzy GarufiUnited Kingdom2026-05-25Benton, John B Jr NEW85Anna Fali
1009Aika InouyeBrazil2026-05-13Truhlar And Truhlar Attys RENEWAL20Anna Fali
1010Isabel BowleySpain2026-06-02Buckley Miller Wright QUALIFIED7Bernardo Dominic
1011Antonio CaudyArgentina2026-05-30Printing Dimensions PROPOSAL32Ioni Bowcher
1012Stacey MacleadUnited Kingdom2026-05-30Truhlar And Truhlar Attys PROPOSAL8Anna Fali
1013Faith GillianBrazil2026-05-19Printing Dimensions NEGOTIATION2Onyama Limba
1014Stacey MacleadJapan2026-05-19Commercial Press NEW77Ioni Bowcher
1015Murillo MaletRussia2026-05-22Rangoni Of Florence PROPOSAL16Asiya Javayant
1016Ivar PaprockiCanada2026-06-09Chapman, Ross E Esq PROPOSAL40Ivan Magalhaes
1017Jones VocelkaRussia2026-05-18Chemel, James L Cpa RENEWAL27Ivan Magalhaes
1018Jefferson SchemmerUnited Kingdom2026-05-20Chemel, James L Cpa NEGOTIATION71Ivan Magalhaes
1019Julie StensethBrazil2026-06-08Printing Dimensions QUALIFIED46Elwin Sharvill
1020Aruna FigeroaIndia2026-06-07Benton, John B Jr RENEWAL4Stephen Shaw
1021Johnson SergiUnited Kingdom2026-05-25Truhlar And Truhlar Attys NEGOTIATION12Ioni Bowcher
1022Tony FollerUnited Kingdom2026-06-05Dorl, James J Esq RENEWAL68Amy Elsner
1023Clifford RimSpain2026-06-02Benton, John B Jr NEGOTIATION21Asiya Javayant
1024Faith GillianBrazil2026-05-18Morlong Associates PROPOSAL17Bernardo Dominic
1025Ricardo GauchoFrance2026-06-03Truhlar And Truhlar Attys NEGOTIATION59Ioni Bowcher
1026Smith GlickIndia2026-05-11Feiner Bros NEGOTIATION73Amy Elsner
1027Smith GlickUnited Kingdom2026-05-16Chemel, James L Cpa QUALIFIED85Anna Fali
1028Greenwood BologniaCanada2026-05-15Chapman, Ross E Esq UNQUALIFIED79Bernardo Dominic
1029Claire TollnerCanada2026-06-02Truhlar And Truhlar Attys NEW51Asiya Javayant
1030Leon OldroydJapan2026-05-25Buckley Miller Wright UNQUALIFIED42Bernardo Dominic
1031Octavia MaletArgentina2026-06-09Buckley Miller Wright QUALIFIED17Ioni Bowcher
1032Murillo MaletBrazil2026-06-03Benton, John B Jr PROPOSAL6Ioni Bowcher
1033Leja CaldareraItaly2026-05-21Buckley Miller Wright PROPOSAL61Bernardo Dominic
1034Kaitlin OstroskyIndia2026-06-06Rangoni Of Florence NEGOTIATION47Anna Fali
1035James ButtFrance2026-05-24Rangoni Of Florence RENEWAL52Xuxue Feng
1036Johnson SergiIndia2026-06-07Chapman, Ross E Esq QUALIFIED67Ivan Magalhaes
1037Faith GillianAustralia2026-05-15Truhlar And Truhlar Attys UNQUALIFIED5Ivan Magalhaes
1038Salvatore StockhamJapan2026-05-21Buckley Miller Wright NEW23Ioni Bowcher
1039Ivar PaprockiAustralia2026-05-27Buckley Miller Wright QUALIFIED25Onyama Limba
1040Maisha RulapaughSpain2026-06-01Rousseaux, Michael Esq PROPOSAL36Anna Fali
1041Isabel BowleyGermany2026-05-21Commercial Press PROPOSAL34Onyama Limba
1042David DarakjyGermany2026-05-11Printing Dimensions UNQUALIFIED13Anna Fali
1043Sinclair WaycottRussia2026-05-26Rousseaux, Michael Esq NEW75Bernardo Dominic
1044Julie StensethSpain2026-05-21Printing Dimensions NEGOTIATION40Onyama Limba
1045Isabel BowleyGermany2026-05-14Chapman, Ross E Esq UNQUALIFIED50Elwin Sharvill
1046Clifford RimFrance2026-06-03King, Christopher A Esq NEW90Onyama Limba
1047Leon OldroydBrazil2026-05-19Feiner Bros NEGOTIATION94Amy Elsner
1048Ricardo GauchoIndia2026-06-09Buckley Miller Wright NEGOTIATION19Asiya Javayant
1049Faith GillianIndia2026-06-08King, Christopher A Esq UNQUALIFIED12Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Ivar PaprockiIndiaStephen Shaw NEGOTIATION
Kadeem FlosiBrazilStephen Shaw PROPOSAL
Chavez BriddickCanadaAsiya Javayant RENEWAL
Ashley DoeRussiaXuxue Feng QUALIFIED
Aruna FigeroaIndiaStephen Shaw PROPOSAL
David DarakjyCanadaAmy Elsner NEGOTIATION
Greenwood BologniaSpainXuxue Feng NEGOTIATION
Murillo MaletIndiaElwin Sharvill NEW
James ButtIndiaIoni Bowcher PROPOSAL
Jennifer AmigonGermanyStephen Shaw PROPOSAL
Tony FollerIndiaElwin Sharvill RENEWAL
Emily WhobreyArgentinaAmy Elsner PROPOSAL
Murillo MaletIndiaAmy Elsner NEGOTIATION
Juan WieserBrazilIoni Bowcher NEW
Emily WhobreyUnited KingdomIoni Bowcher UNQUALIFIED
Rodrigues CampainSpainAmy Elsner UNQUALIFIED
Costa DilliardItalyElwin Sharvill NEGOTIATION
Silvio SlusarskiCanadaBernardo Dominic NEW
Tony FollerCanadaIoni Bowcher NEW
Leon OldroydFranceAnna Fali NEGOTIATION
Emily WhobreyBrazilXuxue Feng RENEWAL
Jeanfrancois VenereJapanStephen Shaw RENEWAL
James ButtRussiaAmy Elsner RENEWAL
Morrow RutaSpainElwin Sharvill UNQUALIFIED
Emily WhobreyIndiaIvan Magalhaes PROPOSAL
Chavez BriddickUnited KingdomStephen Shaw RENEWAL
Francesco ShinkoItalyIvan Magalhaes UNQUALIFIED
Clifford RimUnited KingdomAmy Elsner UNQUALIFIED
Arvin AlbaresAustraliaStephen Shaw NEW
Aditya KuskoBrazilIvan Magalhaes NEGOTIATION
Stacey MacleadBrazilElwin Sharvill NEW
Isabel BowleyAustraliaAsiya Javayant RENEWAL
Faith GillianCanadaXuxue Feng PROPOSAL
Johnson SergiRussiaStephen Shaw NEW
Sinclair WaycottFranceAsiya Javayant NEW
Ashley DoeIndiaBernardo Dominic NEW
Clifford RimAustraliaIvan Magalhaes NEGOTIATION
Mayumi KolmetzArgentinaElwin Sharvill NEGOTIATION
Sinclair WaycottAustraliaAsiya Javayant PROPOSAL
Julie StensethRussiaAmy Elsner RENEWAL
Deepesh ChuiArgentinaAmy Elsner NEW
Munro FerenczItalyElwin Sharvill PROPOSAL
Kaitlin OstroskyAustraliaIoni Bowcher NEGOTIATION
Ashley DoeGermanyAmy Elsner RENEWAL
Misaki RoysterAustraliaIvan Magalhaes NEGOTIATION
Wickens NestleGermanyAnna Fali UNQUALIFIED
Mayumi KolmetzIndiaBernardo Dominic UNQUALIFIED
Arvin AlbaresJapanIvan Magalhaes RENEWAL
Silvio SlusarskiIndiaOnyama Limba UNQUALIFIED
Greenwood BologniaGermanyIoni Bowcher NEGOTIATION
Frozen Columns
Name
Rodrigues Campain
Costa Dilliard
Darci Poquette
Julie Stenseth
Clifford Rim
Cody Saylors
Maisha Rulapaugh
Chavez Briddick
Francesco Shinko
Alejandro Perin
Tony Foller
Johnson Sergi
Sinclair Waycott
Morrow Ruta
Wickens Nestle
Silvio Slusarski
Mayumi Kolmetz
Aruna Figeroa
David Darakjy
Munro Ferencz
Silvio Slusarski
Cody Saylors
Murillo Malet
Sinclair Waycott
Jennifer Amigon
Nicolas Iturbide
Antonio Caudy
James Butt
Johnson Sergi
Cody Saylors
Maisha Rulapaugh
Rodrigues Campain
Deepesh Chui
David Darakjy
Darci Poquette
Salvatore Stockham
Stacey Maclead
Jones Vocelka
Maria Marrier
Maria Marrier
Aditya Kusko
Arvin Albares
Izzy Garufi
Salvatore Stockham
Aruna Figeroa
Jones Vocelka
Sinclair Waycott
Murillo Malet
Chavez Briddick
Alejandro Perin
IdCountryDate
1000Australia2026-05-24
1001India2026-05-19
1002Germany2026-05-16
1003Brazil2026-06-02
1004France2026-05-15
1005Italy2026-05-15
1006India2026-05-25
1007Italy2026-05-30
1008Germany2026-05-17
1009Japan2026-05-18
1010Australia2026-05-24
1011Germany2026-05-26
1012Spain2026-05-24
1013France2026-05-22
1014France2026-05-11
1015United Kingdom2026-05-13
1016Italy2026-05-12
1017Argentina2026-06-06
1018Russia2026-05-12
1019Japan2026-05-12
1020Canada2026-06-04
1021Russia2026-06-02
1022Brazil2026-05-31
1023India2026-05-19
1024Brazil2026-05-19
1025Brazil2026-05-16
1026Canada2026-06-05
1027Germany2026-06-07
1028Japan2026-05-15
1029Spain2026-05-22
1030Japan2026-06-02
1031Australia2026-06-06
1032Australia2026-05-24
1033Spain2026-06-01
1034Australia2026-05-21
1035Italy2026-06-07
1036India2026-06-09
1037Germany2026-05-18
1038India2026-06-07
1039Canada2026-05-16
1040Germany2026-05-11
1041Russia2026-06-05
1042Brazil2026-05-15
1043Japan2026-05-27
1044Brazil2026-05-28
1045Canada2026-05-20
1046France2026-05-29
1047Canada2026-06-04
1048Spain2026-05-16
1049Australia2026-05-11

On-Demand Data

NameIdCountryDate
Arvin Albares1000United Kingdom2026-05-25
Jones Vocelka1001Argentina2026-05-11
Chavez Briddick1002Italy2026-05-29
Octavia Malet1003Australia2026-06-05
Maisha Rulapaugh1004Japan2026-06-06
Leon Oldroyd1005Spain2026-06-01
Wickens Nestle1006Canada2026-05-22
Munro Ferencz1007India2026-05-22
Wickens Nestle1008Italy2026-06-04
Johnson Sergi1009Brazil2026-06-04
Leon Oldroyd1010Italy2026-05-24
Arvin Albares1011Germany2026-05-19
Jeanfrancois Venere1012Japan2026-05-17
Nicolas Iturbide1013Australia2026-06-02
Morrow Ruta1014Spain2026-05-28
Maisha Rulapaugh1015Australia2026-05-21
Kadeem Flosi1016India2026-05-26
Ashley Doe1017Australia2026-05-25
Chavez Briddick1018France2026-06-09
Julie Stenseth1019Germany2026-05-22
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Johnson SergiFranceIoni Bowcher NEW
Octavia MaletSpainAsiya Javayant PROPOSAL
Isabel BowleyArgentinaBernardo Dominic PROPOSAL
Salvatore StockhamBrazilStephen Shaw NEGOTIATION
Aika InouyeSpainElwin Sharvill NEGOTIATION
Alejandro PerinGermanyIoni Bowcher NEGOTIATION
Faith GillianCanadaBernardo Dominic RENEWAL
Nicolas IturbideUnited KingdomBernardo Dominic QUALIFIED
Sinclair WaycottFranceBernardo Dominic NEGOTIATION
Stacey MacleadAustraliaAnna Fali PROPOSAL
Ricardo GauchoItalyAsiya Javayant NEGOTIATION
Murillo MaletArgentinaIvan Magalhaes NEW
Jones VocelkaFranceStephen Shaw QUALIFIED
Kadeem FlosiCanadaAnna Fali QUALIFIED
Francesco ShinkoGermanyIoni Bowcher NEGOTIATION
Aruna FigeroaItalyAsiya Javayant UNQUALIFIED
Claire TollnerRussiaElwin Sharvill PROPOSAL
Adams MorascaSpainAsiya Javayant RENEWAL
Silvio SlusarskiIndiaBernardo Dominic NEW
Wickens NestleJapanElwin Sharvill RENEWAL
Misaki RoysterBrazilStephen Shaw RENEWAL
Alejandro PerinFranceAnna Fali UNQUALIFIED
Wickens NestleFranceIvan Magalhaes PROPOSAL
Juan WieserSpainAmy Elsner RENEWAL
David DarakjyUnited KingdomBernardo Dominic RENEWAL
Wickens NestleUnited KingdomBernardo Dominic NEW
Emily WhobreyJapanAnna Fali NEW
Aika InouyeSpainIvan Magalhaes UNQUALIFIED
Juan WieserGermanyAnna Fali NEGOTIATION
David DarakjySpainAmy Elsner NEW
Sinclair WaycottItalyStephen Shaw PROPOSAL
Costa DilliardUnited KingdomAsiya Javayant NEGOTIATION
Morrow RutaFranceIvan Magalhaes NEW
Ricardo GauchoArgentinaAmy Elsner PROPOSAL
Jennifer AmigonRussiaAmy Elsner PROPOSAL
Mayumi KolmetzArgentinaOnyama Limba RENEWAL
Antonio CaudyRussiaElwin Sharvill NEGOTIATION
Mayumi KolmetzAustraliaAsiya Javayant PROPOSAL
Adams MorascaSpainElwin Sharvill QUALIFIED
Salvatore StockhamSpainAsiya Javayant 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>