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
Emily WhobreyFranceIvan Magalhaes UNQUALIFIED
Jones VocelkaIndiaStephen Shaw QUALIFIED
Chavez BriddickIndiaElwin Sharvill NEW
Jennifer AmigonFranceAsiya Javayant NEGOTIATION
Murillo MaletJapanAsiya Javayant PROPOSAL
Emily WhobreyIndiaIoni Bowcher QUALIFIED
Chavez BriddickBrazilAnna Fali RENEWAL
Aika InouyeRussiaAmy Elsner NEW
Ivar PaprockiItalyStephen Shaw NEGOTIATION
Alejandro PerinUnited KingdomAsiya Javayant NEGOTIATION
Adams MorascaCanadaOnyama Limba UNQUALIFIED
Jeanfrancois VenereJapanAsiya Javayant UNQUALIFIED
Faith GillianCanadaAnna Fali RENEWAL
Mujtaba NickaRussiaStephen Shaw UNQUALIFIED
Clifford RimAustraliaElwin Sharvill UNQUALIFIED
Tony FollerItalyAsiya Javayant QUALIFIED
Octavia MaletJapanAmy Elsner PROPOSAL
Kadeem FlosiJapanIvan Magalhaes RENEWAL
Emily WhobreyGermanyIvan Magalhaes PROPOSAL
Aika InouyeFranceXuxue Feng UNQUALIFIED
Sinclair WaycottArgentinaBernardo Dominic NEGOTIATION
Maisha RulapaughFranceAmy Elsner QUALIFIED
Morrow RutaCanadaIoni Bowcher NEGOTIATION
Wickens NestleItalyIoni Bowcher QUALIFIED
Silvio SlusarskiJapanBernardo Dominic NEW
Munro FerenczJapanXuxue Feng NEGOTIATION
Mujtaba NickaCanadaBernardo Dominic QUALIFIED
Juan WieserArgentinaAsiya Javayant PROPOSAL
Antonio CaudySpainAsiya Javayant RENEWAL
David DarakjyCanadaIvan Magalhaes QUALIFIED
Ashley DoeAustraliaIvan Magalhaes PROPOSAL
Aika InouyeIndiaIoni Bowcher NEW
Sinclair WaycottBrazilOnyama Limba NEW
Silvio SlusarskiIndiaIoni Bowcher UNQUALIFIED
Mujtaba NickaSpainAnna Fali RENEWAL
Claire TollnerFranceIoni Bowcher QUALIFIED
Leon OldroydSpainBernardo Dominic NEGOTIATION
Maisha RulapaughCanadaOnyama Limba UNQUALIFIED
Maisha RulapaughUnited KingdomAmy Elsner UNQUALIFIED
Costa DilliardAustraliaXuxue Feng PROPOSAL
Rodrigues CampainIndiaElwin Sharvill RENEWAL
Cody SaylorsFranceOnyama Limba NEW
Cody SaylorsArgentinaAsiya Javayant UNQUALIFIED
Ricardo GauchoSpainElwin Sharvill RENEWAL
Clifford RimFranceElwin Sharvill QUALIFIED
Clifford RimItalyOnyama Limba NEGOTIATION
Kadeem FlosiSpainAmy Elsner QUALIFIED
Jennifer AmigonIndiaBernardo Dominic QUALIFIED
Julie StensethJapanIvan Magalhaes QUALIFIED
Kadeem FlosiGermanyIoni Bowcher NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Arvin AlbaresItalyBernardo Dominic NEGOTIATION
Emily WhobreyAustraliaBernardo Dominic RENEWAL
Misaki RoysterRussiaIoni Bowcher NEW
Kadeem FlosiItalyAnna Fali PROPOSAL
Antonio CaudyUnited KingdomXuxue Feng UNQUALIFIED
Ashley DoeBrazilXuxue Feng NEW
Misaki RoysterCanadaElwin Sharvill NEGOTIATION
Nicolas IturbideFranceElwin Sharvill QUALIFIED
Smith GlickSpainBernardo Dominic NEW
Jefferson SchemmerIndiaAnna Fali UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Costa DilliardIndia2026-04-18Rangoni Of Florence NEW42Amy Elsner
1001Leon OldroydItaly2026-04-12Benton, John B Jr UNQUALIFIED71Asiya Javayant
1002Jefferson SchemmerUnited Kingdom2026-04-12Commercial Press PROPOSAL60Asiya Javayant
1003Murillo MaletJapan2026-03-27Feltz Printing Service RENEWAL95Onyama Limba
1004Wickens NestleAustralia2026-04-01Chanay, Jeffrey A Esq RENEWAL10Amy Elsner
1005Ashley DoeSpain2026-03-23Feiner Bros QUALIFIED77Ioni Bowcher
1006Octavia MaletBrazil2026-04-09King, Christopher A Esq NEGOTIATION20Elwin Sharvill
1007Maisha RulapaughAustralia2026-04-10Truhlar And Truhlar Attys RENEWAL82Ioni Bowcher
1008Alejandro PerinItaly2026-04-14Morlong Associates NEW86Ivan Magalhaes
1009Jennifer AmigonFrance2026-03-24Printing Dimensions NEGOTIATION61Xuxue Feng
1010Deepesh ChuiSpain2026-04-12Rangoni Of Florence QUALIFIED56Stephen Shaw
1011Jones VocelkaGermany2026-03-25Benton, John B Jr NEGOTIATION2Onyama Limba
1012Tony FollerBrazil2026-04-10Buckley Miller Wright PROPOSAL61Amy Elsner
1013Emily WhobreyBrazil2026-04-02Rousseaux, Michael Esq RENEWAL93Ioni Bowcher
1014Juan WieserJapan2026-04-04Feiner Bros QUALIFIED50Elwin Sharvill
1015Faith GillianItaly2026-03-30Feltz Printing Service RENEWAL98Xuxue Feng
1016Smith GlickIndia2026-04-04Morlong Associates UNQUALIFIED55Onyama Limba
1017Kaitlin OstroskyItaly2026-03-29King, Christopher A Esq PROPOSAL16Stephen Shaw
1018Maisha RulapaughRussia2026-03-24Chanay, Jeffrey A Esq UNQUALIFIED21Amy Elsner
1019Mujtaba NickaAustralia2026-04-03Chemel, James L Cpa UNQUALIFIED12Asiya Javayant
1020Morrow RutaFrance2026-04-14Chanay, Jeffrey A Esq RENEWAL42Ivan Magalhaes
1021Kadeem FlosiFrance2026-04-18Printing Dimensions PROPOSAL31Ivan Magalhaes
1022Juan WieserItaly2026-03-24Feltz Printing Service QUALIFIED29Ioni Bowcher
1023Claire TollnerIndia2026-04-16Truhlar And Truhlar Attys UNQUALIFIED26Stephen Shaw
1024Adams MorascaSpain2026-04-08Chemel, James L Cpa PROPOSAL70Asiya Javayant
1025Leja CaldareraUnited Kingdom2026-04-19Commercial Press PROPOSAL80Onyama Limba
1026Maisha RulapaughAustralia2026-04-06Dorl, James J Esq QUALIFIED99Anna Fali
1027Juan WieserRussia2026-03-28Printing Dimensions NEW30Amy Elsner
1028Sinclair WaycottFrance2026-04-13Feiner Bros NEW73Elwin Sharvill
1029Greenwood BologniaSpain2026-04-01King, Christopher A Esq UNQUALIFIED28Bernardo Dominic
1030Chavez BriddickAustralia2026-03-30Dorl, James J Esq NEW26Stephen Shaw
1031Jones VocelkaItaly2026-04-17Buckley Miller Wright UNQUALIFIED8Ivan Magalhaes
1032Maisha RulapaughJapan2026-04-01Chanay, Jeffrey A Esq QUALIFIED98Ivan Magalhaes
1033Emily WhobreyGermany2026-04-15Chapman, Ross E Esq RENEWAL30Elwin Sharvill
1034Rodrigues CampainGermany2026-03-23Printing Dimensions PROPOSAL44Xuxue Feng
1035Octavia MaletFrance2026-04-12Chemel, James L Cpa QUALIFIED76Ivan Magalhaes
1036Sinclair WaycottFrance2026-04-04Chemel, James L Cpa RENEWAL26Xuxue Feng
1037Mayumi KolmetzIndia2026-04-14Feiner Bros QUALIFIED3Onyama Limba
1038Julie StensethCanada2026-04-05Rangoni Of Florence QUALIFIED47Stephen Shaw
1039Julie StensethGermany2026-03-28Morlong Associates NEW60Ioni Bowcher
1040Greenwood BologniaRussia2026-04-17Feltz Printing Service NEGOTIATION47Stephen Shaw
1041Leja CaldareraCanada2026-04-13Benton, John B Jr PROPOSAL59Ivan Magalhaes
1042Greenwood BologniaItaly2026-04-15Commercial Press NEW2Amy Elsner
1043David DarakjyIndia2026-04-10Chemel, James L Cpa PROPOSAL89Bernardo Dominic
1044Mayumi KolmetzBrazil2026-04-02Chemel, James L Cpa NEGOTIATION33Anna Fali
1045Antonio CaudySpain2026-04-17Chanay, Jeffrey A Esq NEGOTIATION32Anna Fali
1046Chavez BriddickBrazil2026-03-28Morlong Associates NEGOTIATION64Elwin Sharvill
1047Juan WieserSpain2026-04-12Feiner Bros QUALIFIED46Stephen Shaw
1048Jones VocelkaCanada2026-03-24Dorl, James J Esq QUALIFIED55Ivan Magalhaes
1049Costa DilliardArgentina2026-04-04King, Christopher A Esq NEW82Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Wickens NestleUnited KingdomOnyama Limba PROPOSAL
Nicolas IturbideGermanyStephen Shaw RENEWAL
Maisha RulapaughUnited KingdomOnyama Limba QUALIFIED
Julie StensethSpainBernardo Dominic NEGOTIATION
Isabel BowleyArgentinaElwin Sharvill QUALIFIED
Chavez BriddickSpainAmy Elsner NEW
Arvin AlbaresUnited KingdomBernardo Dominic QUALIFIED
Alejandro PerinSpainAmy Elsner QUALIFIED
Nicolas IturbideRussiaAnna Fali UNQUALIFIED
Johnson SergiFranceXuxue Feng QUALIFIED
James ButtGermanyOnyama Limba NEW
Clifford RimSpainAmy Elsner UNQUALIFIED
Leja CaldareraAustraliaIoni Bowcher PROPOSAL
Faith GillianItalyAmy Elsner PROPOSAL
David DarakjyGermanyIoni Bowcher QUALIFIED
Wickens NestleJapanBernardo Dominic PROPOSAL
James ButtSpainBernardo Dominic NEW
Arvin AlbaresSpainAnna Fali QUALIFIED
Maria MarrierCanadaXuxue Feng RENEWAL
Kadeem FlosiJapanXuxue Feng NEGOTIATION
Julie StensethRussiaElwin Sharvill PROPOSAL
Nicolas IturbideBrazilIoni Bowcher RENEWAL
Francesco ShinkoGermanyAnna Fali UNQUALIFIED
Rodrigues CampainRussiaAnna Fali RENEWAL
Tony FollerBrazilStephen Shaw PROPOSAL
Juan WieserSpainIoni Bowcher UNQUALIFIED
David DarakjyCanadaIvan Magalhaes NEW
James ButtRussiaXuxue Feng NEGOTIATION
Leja CaldareraArgentinaElwin Sharvill RENEWAL
Ricardo GauchoRussiaOnyama Limba RENEWAL
Kaitlin OstroskyCanadaXuxue Feng UNQUALIFIED
Mujtaba NickaIndiaBernardo Dominic NEGOTIATION
Cody SaylorsRussiaAmy Elsner UNQUALIFIED
David DarakjyJapanXuxue Feng QUALIFIED
Aruna FigeroaRussiaXuxue Feng NEGOTIATION
Octavia MaletGermanyIoni Bowcher QUALIFIED
Darci PoquetteUnited KingdomIoni Bowcher NEW
Wickens NestleRussiaIvan Magalhaes NEW
David DarakjySpainIoni Bowcher PROPOSAL
Misaki RoysterJapanXuxue Feng NEGOTIATION
Maisha RulapaughJapanStephen Shaw NEW
Darci PoquetteSpainAnna Fali UNQUALIFIED
Leja CaldareraIndiaXuxue Feng PROPOSAL
Costa DilliardUnited KingdomXuxue Feng QUALIFIED
Murillo MaletBrazilIvan Magalhaes QUALIFIED
Greenwood BologniaCanadaIvan Magalhaes RENEWAL
Aruna FigeroaArgentinaStephen Shaw PROPOSAL
Julie StensethFranceAnna Fali NEW
Morrow RutaGermanyIvan Magalhaes NEW
Octavia MaletUnited KingdomIvan Magalhaes RENEWAL
Frozen Columns
Name
Jefferson Schemmer
Kadeem Flosi
Mujtaba Nicka
Nicolas Iturbide
Aditya Kusko
Ivar Paprocki
Cody Saylors
Francesco Shinko
Tony Foller
Sinclair Waycott
Chavez Briddick
Leon Oldroyd
Juan Wieser
Ashley Doe
Morrow Ruta
Tony Foller
Munro Ferencz
Deepesh Chui
Darci Poquette
Izzy Garufi
Alejandro Perin
Maria Marrier
Arvin Albares
Clifford Rim
Francesco Shinko
Adams Morasca
Maria Marrier
Maria Marrier
Adams Morasca
David Darakjy
Emily Whobrey
Faith Gillian
Wickens Nestle
Cody Saylors
Claire Tollner
Arvin Albares
Mujtaba Nicka
Kadeem Flosi
Kaitlin Ostrosky
Tony Foller
Munro Ferencz
Kadeem Flosi
Salvatore Stockham
Morrow Ruta
Misaki Royster
Darci Poquette
Johnson Sergi
David Darakjy
Aditya Kusko
Tony Foller
IdCountryDate
1000Italy2026-04-18
1001Australia2026-03-24
1002India2026-03-27
1003Italy2026-03-29
1004Canada2026-03-30
1005Spain2026-04-08
1006Italy2026-04-16
1007India2026-04-15
1008Argentina2026-03-24
1009Australia2026-04-18
1010United Kingdom2026-04-11
1011Japan2026-04-13
1012Germany2026-03-26
1013France2026-04-17
1014India2026-04-15
1015Germany2026-04-08
1016Argentina2026-04-01
1017Argentina2026-04-05
1018Russia2026-04-07
1019Italy2026-04-13
1020Germany2026-04-13
1021Germany2026-03-24
1022Brazil2026-04-09
1023United Kingdom2026-04-21
1024Canada2026-04-21
1025United Kingdom2026-03-25
1026Japan2026-04-21
1027Brazil2026-03-25
1028France2026-04-01
1029United Kingdom2026-04-20
1030Russia2026-04-20
1031United Kingdom2026-04-07
1032Canada2026-03-23
1033Italy2026-04-14
1034Brazil2026-04-01
1035France2026-03-24
1036Germany2026-04-01
1037Brazil2026-04-17
1038Australia2026-04-21
1039United Kingdom2026-03-24
1040Germany2026-04-19
1041India2026-03-31
1042Italy2026-04-14
1043Australia2026-04-17
1044United Kingdom2026-04-01
1045Japan2026-04-10
1046India2026-04-03
1047Germany2026-04-01
1048Italy2026-04-11
1049Russia2026-04-17

On-Demand Data

NameIdCountryDate
Kaitlin Ostrosky1000United Kingdom2026-04-10
Aruna Figeroa1001Canada2026-04-09
Aruna Figeroa1002Argentina2026-04-17
Faith Gillian1003Spain2026-03-23
Leon Oldroyd1004Australia2026-04-04
Misaki Royster1005Japan2026-04-02
David Darakjy1006India2026-04-12
Kadeem Flosi1007Brazil2026-03-27
Kadeem Flosi1008United Kingdom2026-04-13
Maisha Rulapaugh1009Russia2026-04-02
Darci Poquette1010Japan2026-04-14
Ashley Doe1011Australia2026-04-21
Maisha Rulapaugh1012Japan2026-04-13
Mayumi Kolmetz1013Japan2026-03-25
Jennifer Amigon1014Italy2026-04-12
Morrow Ruta1015Italy2026-03-25
Kadeem Flosi1016Brazil2026-04-14
Maisha Rulapaugh1017India2026-04-11
Mayumi Kolmetz1018Japan2026-04-17
Silvio Slusarski1019India2026-03-30
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Kaitlin OstroskyCanadaStephen Shaw PROPOSAL
Greenwood BologniaIndiaAnna Fali RENEWAL
Munro FerenczArgentinaStephen Shaw RENEWAL
Ashley DoeCanadaElwin Sharvill PROPOSAL
Juan WieserItalyOnyama Limba UNQUALIFIED
Darci PoquetteSpainAsiya Javayant RENEWAL
Nicolas IturbideArgentinaIoni Bowcher UNQUALIFIED
Francesco ShinkoSpainAsiya Javayant UNQUALIFIED
Darci PoquetteBrazilOnyama Limba NEGOTIATION
Antonio CaudyJapanIoni Bowcher RENEWAL
Octavia MaletCanadaAmy Elsner PROPOSAL
Morrow RutaGermanyBernardo Dominic RENEWAL
Juan WieserJapanBernardo Dominic QUALIFIED
Aditya KuskoJapanIvan Magalhaes UNQUALIFIED
Jennifer AmigonSpainAsiya Javayant PROPOSAL
Alejandro PerinJapanIvan Magalhaes PROPOSAL
Leon OldroydSpainBernardo Dominic QUALIFIED
Deepesh ChuiGermanyAnna Fali NEGOTIATION
Cody SaylorsFranceAmy Elsner RENEWAL
Morrow RutaBrazilElwin Sharvill NEW
Jefferson SchemmerSpainIoni Bowcher RENEWAL
Octavia MaletUnited KingdomIoni Bowcher NEGOTIATION
Costa DilliardArgentinaIoni Bowcher NEGOTIATION
Mujtaba NickaCanadaOnyama Limba QUALIFIED
Sinclair WaycottRussiaIvan Magalhaes NEGOTIATION
Greenwood BologniaUnited KingdomStephen Shaw RENEWAL
Sinclair WaycottCanadaXuxue Feng QUALIFIED
Greenwood BologniaCanadaStephen Shaw QUALIFIED
Jennifer AmigonUnited KingdomIoni Bowcher RENEWAL
Mujtaba NickaRussiaBernardo Dominic PROPOSAL
Mayumi KolmetzGermanyOnyama Limba RENEWAL
Maria MarrierIndiaXuxue Feng QUALIFIED
Octavia MaletCanadaStephen Shaw NEW
Misaki RoysterJapanAmy Elsner PROPOSAL
Salvatore StockhamBrazilBernardo Dominic PROPOSAL
Jennifer AmigonJapanElwin Sharvill NEW
Smith GlickBrazilStephen Shaw PROPOSAL
Jones VocelkaFranceAmy Elsner PROPOSAL
Morrow RutaBrazilXuxue Feng NEGOTIATION
Jones VocelkaAustraliaStephen Shaw 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>