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
Misaki RoysterJapanAnna Fali RENEWAL
Juan WieserGermanyOnyama Limba UNQUALIFIED
Murillo MaletSpainAsiya Javayant PROPOSAL
Julie StensethFranceAnna Fali UNQUALIFIED
Isabel BowleyBrazilAmy Elsner NEW
Jeanfrancois VenereUnited KingdomAsiya Javayant UNQUALIFIED
Tony FollerFranceBernardo Dominic NEGOTIATION
Costa DilliardArgentinaAmy Elsner NEGOTIATION
Izzy GarufiSpainAmy Elsner NEW
Nicolas IturbideGermanyIvan Magalhaes NEW
Aruna FigeroaSpainOnyama Limba NEGOTIATION
Francesco ShinkoAustraliaStephen Shaw NEGOTIATION
Deepesh ChuiIndiaXuxue Feng QUALIFIED
Ricardo GauchoItalyAsiya Javayant RENEWAL
Leja CaldareraSpainElwin Sharvill PROPOSAL
Mayumi KolmetzFranceBernardo Dominic RENEWAL
David DarakjyArgentinaStephen Shaw QUALIFIED
Darci PoquetteSpainOnyama Limba UNQUALIFIED
Cody SaylorsArgentinaIvan Magalhaes NEGOTIATION
Misaki RoysterArgentinaOnyama Limba NEGOTIATION
Octavia MaletRussiaXuxue Feng NEW
Alejandro PerinFranceIvan Magalhaes QUALIFIED
Mujtaba NickaRussiaXuxue Feng NEW
Aika InouyeBrazilStephen Shaw QUALIFIED
Jennifer AmigonUnited KingdomElwin Sharvill QUALIFIED
Aika InouyeAustraliaElwin Sharvill NEW
Tony FollerUnited KingdomXuxue Feng NEW
Ivar PaprockiBrazilAsiya Javayant UNQUALIFIED
Octavia MaletSpainIoni Bowcher UNQUALIFIED
Tony FollerArgentinaStephen Shaw RENEWAL
Octavia MaletAustraliaIvan Magalhaes UNQUALIFIED
Adams MorascaGermanyStephen Shaw UNQUALIFIED
Tony FollerAustraliaIoni Bowcher RENEWAL
Johnson SergiFranceAsiya Javayant NEW
Faith GillianSpainElwin Sharvill RENEWAL
Faith GillianCanadaOnyama Limba QUALIFIED
Maisha RulapaughIndiaXuxue Feng NEW
Leon OldroydUnited KingdomAnna Fali RENEWAL
Izzy GarufiBrazilElwin Sharvill NEGOTIATION
Jefferson SchemmerGermanyXuxue Feng QUALIFIED
Johnson SergiRussiaOnyama Limba NEW
Jeanfrancois VenereFranceXuxue Feng RENEWAL
Johnson SergiUnited KingdomOnyama Limba PROPOSAL
Maisha RulapaughCanadaAsiya Javayant NEGOTIATION
Ashley DoeBrazilStephen Shaw NEGOTIATION
Juan WieserJapanIvan Magalhaes NEGOTIATION
Rodrigues CampainIndiaOnyama Limba QUALIFIED
Izzy GarufiRussiaBernardo Dominic UNQUALIFIED
Emily WhobreyCanadaElwin Sharvill NEGOTIATION
Salvatore StockhamRussiaElwin Sharvill NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Octavia MaletFranceIvan Magalhaes UNQUALIFIED
Silvio SlusarskiBrazilIvan Magalhaes RENEWAL
Darci PoquetteArgentinaStephen Shaw UNQUALIFIED
Jefferson SchemmerJapanElwin Sharvill PROPOSAL
Tony FollerIndiaBernardo Dominic QUALIFIED
Emily WhobreyGermanyIvan Magalhaes PROPOSAL
Salvatore StockhamJapanOnyama Limba QUALIFIED
Ricardo GauchoItalyElwin Sharvill NEGOTIATION
Misaki RoysterBrazilIoni Bowcher QUALIFIED
Rodrigues CampainCanadaIoni Bowcher NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Johnson SergiItaly2026-05-29Morlong Associates QUALIFIED89Ivan Magalhaes
1001Maisha RulapaughSpain2026-05-17Buckley Miller Wright PROPOSAL45Ioni Bowcher
1002Claire TollnerArgentina2026-05-30Benton, John B Jr QUALIFIED56Xuxue Feng
1003Munro FerenczSpain2026-05-18Printing Dimensions NEW68Onyama Limba
1004Octavia MaletAustralia2026-05-14Benton, John B Jr NEGOTIATION15Ivan Magalhaes
1005Maria MarrierGermany2026-05-23Morlong Associates RENEWAL0Xuxue Feng
1006Misaki RoysterRussia2026-06-10Chemel, James L Cpa UNQUALIFIED71Ivan Magalhaes
1007Aika InouyeBrazil2026-05-24Buckley Miller Wright QUALIFIED20Anna Fali
1008Johnson SergiArgentina2026-05-19Dorl, James J Esq PROPOSAL5Amy Elsner
1009Ashley DoeUnited Kingdom2026-05-15Morlong Associates RENEWAL81Anna Fali
1010Cody SaylorsCanada2026-06-03Dorl, James J Esq RENEWAL4Onyama Limba
1011Morrow RutaJapan2026-05-27Dorl, James J Esq NEW4Stephen Shaw
1012Jennifer AmigonGermany2026-06-07Chanay, Jeffrey A Esq RENEWAL12Ivan Magalhaes
1013Mayumi KolmetzSpain2026-05-25Feiner Bros UNQUALIFIED17Anna Fali
1014Chavez BriddickRussia2026-05-17Dorl, James J Esq RENEWAL25Bernardo Dominic
1015Deepesh ChuiRussia2026-06-10Chapman, Ross E Esq NEW72Xuxue Feng
1016Octavia MaletSpain2026-06-08Feiner Bros RENEWAL94Ioni Bowcher
1017Emily WhobreyJapan2026-06-07King, Christopher A Esq UNQUALIFIED73Stephen Shaw
1018Greenwood BologniaGermany2026-05-17Printing Dimensions NEW55Anna Fali
1019Cody SaylorsSpain2026-05-22Morlong Associates PROPOSAL78Stephen Shaw
1020Jefferson SchemmerItaly2026-05-16Morlong Associates UNQUALIFIED0Onyama Limba
1021David DarakjySpain2026-05-29Morlong Associates QUALIFIED80Onyama Limba
1022Cody SaylorsBrazil2026-05-29Rousseaux, Michael Esq QUALIFIED90Xuxue Feng
1023Claire TollnerIndia2026-05-20Chanay, Jeffrey A Esq QUALIFIED29Ivan Magalhaes
1024Aika InouyeGermany2026-05-13Printing Dimensions NEGOTIATION38Asiya Javayant
1025Murillo MaletSpain2026-06-06Feltz Printing Service UNQUALIFIED75Amy Elsner
1026Julie StensethUnited Kingdom2026-05-13Benton, John B Jr NEGOTIATION72Bernardo Dominic
1027Arvin AlbaresRussia2026-05-28Chemel, James L Cpa RENEWAL79Ioni Bowcher
1028Kadeem FlosiArgentina2026-05-31Truhlar And Truhlar Attys QUALIFIED54Xuxue Feng
1029Misaki RoysterFrance2026-05-13Chemel, James L Cpa QUALIFIED72Asiya Javayant
1030Silvio SlusarskiFrance2026-05-25Truhlar And Truhlar Attys UNQUALIFIED60Anna Fali
1031Jennifer AmigonGermany2026-05-22King, Christopher A Esq UNQUALIFIED60Elwin Sharvill
1032Jefferson SchemmerFrance2026-05-25Dorl, James J Esq QUALIFIED80Anna Fali
1033Jefferson SchemmerRussia2026-05-25Benton, John B Jr NEGOTIATION41Anna Fali
1034Juan WieserIndia2026-05-26Rousseaux, Michael Esq NEGOTIATION18Bernardo Dominic
1035Alejandro PerinItaly2026-05-24Printing Dimensions QUALIFIED23Bernardo Dominic
1036Arvin AlbaresCanada2026-06-04King, Christopher A Esq NEW53Stephen Shaw
1037Rodrigues CampainIndia2026-06-05Chemel, James L Cpa QUALIFIED58Xuxue Feng
1038Kaitlin OstroskyJapan2026-06-03Feiner Bros NEGOTIATION56Stephen Shaw
1039Kaitlin OstroskyBrazil2026-05-22Rousseaux, Michael Esq QUALIFIED41Elwin Sharvill
1040Adams MorascaUnited Kingdom2026-05-17Chapman, Ross E Esq NEGOTIATION74Stephen Shaw
1041Costa DilliardItaly2026-05-16Commercial Press PROPOSAL25Elwin Sharvill
1042Silvio SlusarskiArgentina2026-05-28King, Christopher A Esq PROPOSAL46Asiya Javayant
1043Maisha RulapaughSpain2026-05-31Rangoni Of Florence QUALIFIED10Ivan Magalhaes
1044Stacey MacleadSpain2026-05-17Commercial Press RENEWAL60Stephen Shaw
1045Isabel BowleyFrance2026-05-31Printing Dimensions RENEWAL68Bernardo Dominic
1046Silvio SlusarskiRussia2026-05-23Printing Dimensions NEW3Elwin Sharvill
1047Smith GlickBrazil2026-06-02Morlong Associates RENEWAL64Bernardo Dominic
1048James ButtRussia2026-05-27Buckley Miller Wright PROPOSAL7Stephen Shaw
1049Francesco ShinkoJapan2026-06-04Feltz Printing Service QUALIFIED64Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Kaitlin OstroskyCanadaXuxue Feng RENEWAL
Maisha RulapaughBrazilOnyama Limba RENEWAL
Ashley DoeFranceIvan Magalhaes NEGOTIATION
Arvin AlbaresGermanyIvan Magalhaes PROPOSAL
Rodrigues CampainSpainAsiya Javayant NEW
Stacey MacleadUnited KingdomAmy Elsner RENEWAL
Rodrigues CampainCanadaXuxue Feng PROPOSAL
Darci PoquetteSpainBernardo Dominic RENEWAL
Tony FollerUnited KingdomXuxue Feng NEGOTIATION
Alejandro PerinSpainIoni Bowcher NEGOTIATION
Aditya KuskoBrazilAnna Fali NEW
Maisha RulapaughUnited KingdomAsiya Javayant PROPOSAL
Deepesh ChuiCanadaStephen Shaw PROPOSAL
Aruna FigeroaRussiaAnna Fali UNQUALIFIED
Juan WieserCanadaBernardo Dominic NEW
Izzy GarufiCanadaAnna Fali QUALIFIED
Smith GlickSpainAmy Elsner PROPOSAL
Octavia MaletJapanAsiya Javayant UNQUALIFIED
Adams MorascaArgentinaIvan Magalhaes RENEWAL
Jennifer AmigonItalyElwin Sharvill RENEWAL
Octavia MaletSpainAmy Elsner QUALIFIED
Mujtaba NickaJapanXuxue Feng NEGOTIATION
Isabel BowleyFranceBernardo Dominic NEW
Juan WieserSpainAsiya Javayant PROPOSAL
Arvin AlbaresAustraliaOnyama Limba NEGOTIATION
Kadeem FlosiFranceAmy Elsner UNQUALIFIED
Izzy GarufiRussiaXuxue Feng NEGOTIATION
Ricardo GauchoAustraliaAnna Fali PROPOSAL
Faith GillianJapanIvan Magalhaes RENEWAL
Alejandro PerinGermanyAnna Fali RENEWAL
Tony FollerRussiaBernardo Dominic QUALIFIED
Ashley DoeSpainXuxue Feng RENEWAL
Izzy GarufiUnited KingdomAsiya Javayant UNQUALIFIED
Wickens NestleUnited KingdomIoni Bowcher PROPOSAL
Darci PoquetteItalyIvan Magalhaes PROPOSAL
Julie StensethUnited KingdomAsiya Javayant NEGOTIATION
Leja CaldareraItalyBernardo Dominic NEGOTIATION
Jeanfrancois VenereIndiaAsiya Javayant RENEWAL
Clifford RimBrazilStephen Shaw UNQUALIFIED
Octavia MaletJapanXuxue Feng PROPOSAL
James ButtJapanIvan Magalhaes UNQUALIFIED
Faith GillianAustraliaIvan Magalhaes QUALIFIED
David DarakjySpainAmy Elsner QUALIFIED
Murillo MaletBrazilOnyama Limba QUALIFIED
Morrow RutaIndiaAnna Fali NEW
Ivar PaprockiBrazilAsiya Javayant NEGOTIATION
Aditya KuskoUnited KingdomXuxue Feng NEGOTIATION
Adams MorascaAustraliaIvan Magalhaes NEGOTIATION
Misaki RoysterCanadaAsiya Javayant QUALIFIED
Ricardo GauchoBrazilStephen Shaw QUALIFIED
Frozen Columns
Name
Clifford Rim
Clifford Rim
Leja Caldarera
Leon Oldroyd
Aika Inouye
Claire Tollner
Aruna Figeroa
Julie Stenseth
Salvatore Stockham
James Butt
Maria Marrier
Salvatore Stockham
James Butt
Mujtaba Nicka
Arvin Albares
Costa Dilliard
Maria Marrier
Jones Vocelka
Kadeem Flosi
Misaki Royster
Mayumi Kolmetz
Izzy Garufi
Sinclair Waycott
Clifford Rim
Greenwood Bolognia
Tony Foller
Kaitlin Ostrosky
Ivar Paprocki
Isabel Bowley
Leon Oldroyd
Misaki Royster
Silvio Slusarski
Silvio Slusarski
Ivar Paprocki
Darci Poquette
David Darakjy
James Butt
Tony Foller
Leja Caldarera
Stacey Maclead
Nicolas Iturbide
Aruna Figeroa
Johnson Sergi
Rodrigues Campain
Costa Dilliard
Costa Dilliard
Clifford Rim
Tony Foller
Rodrigues Campain
Aruna Figeroa
IdCountryDate
1000Spain2026-06-02
1001India2026-06-08
1002France2026-05-13
1003Italy2026-06-09
1004Australia2026-05-19
1005Australia2026-05-29
1006Argentina2026-05-25
1007India2026-06-09
1008France2026-05-13
1009Russia2026-05-24
1010Australia2026-05-27
1011Japan2026-05-17
1012France2026-05-13
1013India2026-05-13
1014Argentina2026-05-28
1015Spain2026-06-09
1016Canada2026-05-30
1017Australia2026-05-15
1018Russia2026-06-04
1019Spain2026-05-12
1020Argentina2026-05-18
1021France2026-05-26
1022Japan2026-05-28
1023United Kingdom2026-05-29
1024Australia2026-05-20
1025Japan2026-05-23
1026Brazil2026-05-15
1027Brazil2026-05-31
1028Japan2026-05-26
1029Japan2026-06-07
1030Brazil2026-05-27
1031United Kingdom2026-06-08
1032France2026-06-05
1033Canada2026-05-23
1034India2026-06-03
1035India2026-05-20
1036France2026-05-25
1037France2026-06-04
1038Germany2026-05-12
1039France2026-05-20
1040Australia2026-05-27
1041Germany2026-05-16
1042Australia2026-05-30
1043Australia2026-05-22
1044Russia2026-05-31
1045United Kingdom2026-06-10
1046Brazil2026-06-01
1047Spain2026-06-09
1048Japan2026-05-30
1049Spain2026-05-23

On-Demand Data

NameIdCountryDate
Jones Vocelka1000United Kingdom2026-05-20
James Butt1001Germany2026-05-30
Octavia Malet1002Germany2026-06-04
Cody Saylors1003Russia2026-05-27
Claire Tollner1004France2026-05-24
Salvatore Stockham1005Argentina2026-05-27
Chavez Briddick1006France2026-05-24
David Darakjy1007Russia2026-06-10
Aruna Figeroa1008Argentina2026-05-18
Maisha Rulapaugh1009Russia2026-06-10
Misaki Royster1010United Kingdom2026-05-24
Cody Saylors1011Spain2026-05-15
Octavia Malet1012Brazil2026-05-21
Emily Whobrey1013Canada2026-05-21
Ricardo Gaucho1014Italy2026-06-09
Ivar Paprocki1015Japan2026-06-02
Clifford Rim1016Canada2026-05-30
Darci Poquette1017Canada2026-05-18
Alejandro Perin1018Australia2026-05-24
Juan Wieser1019Spain2026-06-10
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jennifer AmigonItalyIvan Magalhaes UNQUALIFIED
Ashley DoeIndiaAnna Fali PROPOSAL
Greenwood BologniaItalyXuxue Feng UNQUALIFIED
Morrow RutaSpainIoni Bowcher NEW
Antonio CaudySpainAmy Elsner NEW
Octavia MaletIndiaAmy Elsner QUALIFIED
Maisha RulapaughIndiaAnna Fali UNQUALIFIED
Antonio CaudyArgentinaAsiya Javayant NEW
Claire TollnerFranceAsiya Javayant PROPOSAL
Murillo MaletJapanOnyama Limba UNQUALIFIED
David DarakjyUnited KingdomIoni Bowcher PROPOSAL
Clifford RimFranceStephen Shaw UNQUALIFIED
Izzy GarufiIndiaOnyama Limba UNQUALIFIED
Mayumi KolmetzCanadaOnyama Limba NEGOTIATION
Nicolas IturbideJapanStephen Shaw UNQUALIFIED
Ivar PaprockiCanadaXuxue Feng NEW
Adams MorascaRussiaIoni Bowcher NEGOTIATION
Kaitlin OstroskyIndiaAnna Fali NEGOTIATION
Alejandro PerinSpainAsiya Javayant UNQUALIFIED
Antonio CaudyCanadaXuxue Feng QUALIFIED
Faith GillianGermanyAnna Fali PROPOSAL
Ashley DoeArgentinaIoni Bowcher QUALIFIED
David DarakjyBrazilAsiya Javayant RENEWAL
Ricardo GauchoIndiaOnyama Limba RENEWAL
Francesco ShinkoItalyStephen Shaw RENEWAL
Silvio SlusarskiUnited KingdomAsiya Javayant UNQUALIFIED
Misaki RoysterGermanyBernardo Dominic PROPOSAL
Mujtaba NickaCanadaStephen Shaw QUALIFIED
Costa DilliardIndiaAsiya Javayant UNQUALIFIED
Mayumi KolmetzAustraliaBernardo Dominic UNQUALIFIED
Aditya KuskoGermanyIoni Bowcher NEGOTIATION
Octavia MaletAustraliaXuxue Feng PROPOSAL
Maisha RulapaughBrazilAmy Elsner PROPOSAL
Cody SaylorsUnited KingdomAsiya Javayant UNQUALIFIED
Faith GillianFranceOnyama Limba PROPOSAL
Julie StensethRussiaAsiya Javayant UNQUALIFIED
Sinclair WaycottJapanAmy Elsner NEGOTIATION
Juan WieserIndiaAsiya Javayant UNQUALIFIED
Jennifer AmigonIndiaXuxue Feng PROPOSAL
Arvin AlbaresItalyAnna Fali UNQUALIFIED

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