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
Greenwood BologniaAustraliaOnyama Limba UNQUALIFIED
Jones VocelkaIndiaAnna Fali QUALIFIED
Greenwood BologniaItalyAsiya Javayant UNQUALIFIED
Ashley DoeSpainStephen Shaw RENEWAL
Juan WieserItalyAnna Fali RENEWAL
Alejandro PerinCanadaAsiya Javayant RENEWAL
Aika InouyeGermanyAmy Elsner RENEWAL
Aditya KuskoArgentinaElwin Sharvill QUALIFIED
Jones VocelkaUnited KingdomBernardo Dominic NEGOTIATION
Tony FollerCanadaAsiya Javayant QUALIFIED
Ivar PaprockiSpainAnna Fali UNQUALIFIED
Arvin AlbaresAustraliaStephen Shaw QUALIFIED
Cody SaylorsItalyIoni Bowcher NEW
Julie StensethRussiaStephen Shaw QUALIFIED
Aditya KuskoJapanIvan Magalhaes PROPOSAL
Mujtaba NickaItalyAmy Elsner PROPOSAL
Kadeem FlosiGermanyOnyama Limba PROPOSAL
Chavez BriddickRussiaStephen Shaw NEW
Stacey MacleadItalyStephen Shaw NEGOTIATION
Ashley DoeBrazilIvan Magalhaes PROPOSAL
Isabel BowleyItalyIoni Bowcher UNQUALIFIED
Nicolas IturbideBrazilStephen Shaw RENEWAL
Mayumi KolmetzGermanyAmy Elsner RENEWAL
Isabel BowleyArgentinaBernardo Dominic RENEWAL
Alejandro PerinBrazilIvan Magalhaes NEW
Aditya KuskoItalyIvan Magalhaes RENEWAL
Juan WieserRussiaXuxue Feng UNQUALIFIED
Juan WieserCanadaAsiya Javayant PROPOSAL
Aruna FigeroaGermanyAnna Fali QUALIFIED
Chavez BriddickGermanyStephen Shaw NEW
Alejandro PerinRussiaIvan Magalhaes UNQUALIFIED
David DarakjyFranceStephen Shaw UNQUALIFIED
Johnson SergiJapanIoni Bowcher NEW
Juan WieserIndiaIoni Bowcher PROPOSAL
Leja CaldareraBrazilBernardo Dominic UNQUALIFIED
Silvio SlusarskiJapanIvan Magalhaes NEGOTIATION
Isabel BowleyGermanyIvan Magalhaes QUALIFIED
Ivar PaprockiUnited KingdomBernardo Dominic RENEWAL
Kadeem FlosiIndiaIoni Bowcher RENEWAL
Greenwood BologniaFranceAmy Elsner UNQUALIFIED
Tony FollerIndiaIvan Magalhaes RENEWAL
James ButtCanadaIvan Magalhaes RENEWAL
Clifford RimCanadaBernardo Dominic UNQUALIFIED
Leon OldroydAustraliaAsiya Javayant RENEWAL
Ricardo GauchoBrazilAsiya Javayant QUALIFIED
Ashley DoeFranceIvan Magalhaes NEW
Arvin AlbaresFranceAnna Fali QUALIFIED
Misaki RoysterGermanyElwin Sharvill NEW
Costa DilliardGermanyAsiya Javayant RENEWAL
Sinclair WaycottUnited KingdomAsiya Javayant PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Costa DilliardAustraliaBernardo Dominic UNQUALIFIED
Ashley DoeCanadaElwin Sharvill NEW
Arvin AlbaresCanadaXuxue Feng NEGOTIATION
Mayumi KolmetzIndiaAnna Fali NEGOTIATION
Kaitlin OstroskyAustraliaAsiya Javayant NEGOTIATION
Aruna FigeroaJapanXuxue Feng RENEWAL
Isabel BowleyIndiaAsiya Javayant NEGOTIATION
Arvin AlbaresBrazilXuxue Feng UNQUALIFIED
Johnson SergiCanadaAsiya Javayant NEW
Cody SaylorsArgentinaStephen Shaw NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Chavez BriddickSpain2026-04-16Feiner Bros PROPOSAL38Xuxue Feng
1001Costa DilliardRussia2026-04-25Rangoni Of Florence NEGOTIATION14Onyama Limba
1002Murillo MaletAustralia2026-04-16Feltz Printing Service NEGOTIATION4Amy Elsner
1003Alejandro PerinAustralia2026-04-19Feiner Bros QUALIFIED59Anna Fali
1004Jefferson SchemmerItaly2026-05-01Chanay, Jeffrey A Esq UNQUALIFIED88Onyama Limba
1005David DarakjyIndia2026-04-23Chanay, Jeffrey A Esq NEGOTIATION40Elwin Sharvill
1006Morrow RutaSpain2026-04-23Commercial Press PROPOSAL2Stephen Shaw
1007Maisha RulapaughArgentina2026-04-27Benton, John B Jr NEGOTIATION71Ivan Magalhaes
1008Maisha RulapaughCanada2026-04-30Rangoni Of Florence UNQUALIFIED15Bernardo Dominic
1009Costa DilliardSpain2026-04-24Chanay, Jeffrey A Esq PROPOSAL16Xuxue Feng
1010Jefferson SchemmerItaly2026-04-10Chapman, Ross E Esq NEW95Stephen Shaw
1011Johnson SergiBrazil2026-04-09Commercial Press QUALIFIED26Anna Fali
1012Faith GillianCanada2026-04-19Benton, John B Jr RENEWAL40Asiya Javayant
1013Julie StensethItaly2026-04-16Rangoni Of Florence RENEWAL37Onyama Limba
1014David DarakjyGermany2026-04-24Buckley Miller Wright RENEWAL95Amy Elsner
1015Kaitlin OstroskyAustralia2026-04-11Rangoni Of Florence NEW53Asiya Javayant
1016Ivar PaprockiGermany2026-04-18Chapman, Ross E Esq PROPOSAL56Anna Fali
1017Faith GillianRussia2026-04-30Morlong Associates RENEWAL28Asiya Javayant
1018Darci PoquetteCanada2026-04-10Chapman, Ross E Esq RENEWAL38Elwin Sharvill
1019Greenwood BologniaGermany2026-04-30Feiner Bros QUALIFIED75Ioni Bowcher
1020James ButtFrance2026-04-18Chemel, James L Cpa NEGOTIATION24Ioni Bowcher
1021Wickens NestleUnited Kingdom2026-05-02Buckley Miller Wright QUALIFIED60Bernardo Dominic
1022Aika InouyeItaly2026-04-19Feiner Bros NEW1Onyama Limba
1023Leja CaldareraFrance2026-04-08Printing Dimensions QUALIFIED86Bernardo Dominic
1024Aditya KuskoFrance2026-04-19Morlong Associates NEW98Ioni Bowcher
1025Rodrigues CampainSpain2026-04-24Chapman, Ross E Esq QUALIFIED28Xuxue Feng
1026Chavez BriddickFrance2026-04-08Rousseaux, Michael Esq NEGOTIATION20Xuxue Feng
1027Alejandro PerinBrazil2026-04-20Chanay, Jeffrey A Esq NEW60Elwin Sharvill
1028Isabel BowleyArgentina2026-05-01Morlong Associates NEGOTIATION4Elwin Sharvill
1029Aruna FigeroaBrazil2026-04-04Buckley Miller Wright RENEWAL10Xuxue Feng
1030Wickens NestleAustralia2026-04-17Chanay, Jeffrey A Esq QUALIFIED0Onyama Limba
1031Johnson SergiUnited Kingdom2026-04-18Feiner Bros QUALIFIED28Xuxue Feng
1032Ashley DoeSpain2026-04-19Benton, John B Jr NEW76Ivan Magalhaes
1033James ButtArgentina2026-05-01Printing Dimensions QUALIFIED71Anna Fali
1034Murillo MaletRussia2026-04-25Chanay, Jeffrey A Esq NEW51Ivan Magalhaes
1035Alejandro PerinRussia2026-04-05Rangoni Of Florence PROPOSAL12Anna Fali
1036Aditya KuskoArgentina2026-04-05Dorl, James J Esq PROPOSAL92Elwin Sharvill
1037Morrow RutaCanada2026-04-10King, Christopher A Esq NEGOTIATION84Amy Elsner
1038Leon OldroydJapan2026-04-25Rangoni Of Florence PROPOSAL50Asiya Javayant
1039Maisha RulapaughSpain2026-04-14Rousseaux, Michael Esq NEGOTIATION54Ioni Bowcher
1040Julie StensethGermany2026-04-25Feiner Bros QUALIFIED91Ivan Magalhaes
1041Kaitlin OstroskyRussia2026-04-03Chapman, Ross E Esq RENEWAL95Amy Elsner
1042Rodrigues CampainSpain2026-04-17Feltz Printing Service QUALIFIED59Amy Elsner
1043Johnson SergiRussia2026-04-03Buckley Miller Wright UNQUALIFIED88Xuxue Feng
1044Chavez BriddickFrance2026-04-05Truhlar And Truhlar Attys PROPOSAL59Amy Elsner
1045Octavia MaletRussia2026-04-15Rangoni Of Florence UNQUALIFIED39Asiya Javayant
1046Mayumi KolmetzIndia2026-04-25Buckley Miller Wright PROPOSAL27Anna Fali
1047Mayumi KolmetzUnited Kingdom2026-04-03Rousseaux, Michael Esq NEGOTIATION75Anna Fali
1048Ricardo GauchoGermany2026-04-27Feltz Printing Service QUALIFIED44Stephen Shaw
1049Claire TollnerJapan2026-05-01Rangoni Of Florence UNQUALIFIED18Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Wickens NestleUnited KingdomStephen Shaw NEGOTIATION
Rodrigues CampainSpainXuxue Feng QUALIFIED
Stacey MacleadGermanyAnna Fali RENEWAL
James ButtAustraliaAsiya Javayant RENEWAL
Costa DilliardGermanyIoni Bowcher NEW
Johnson SergiItalyStephen Shaw NEGOTIATION
Nicolas IturbideRussiaElwin Sharvill RENEWAL
Arvin AlbaresCanadaBernardo Dominic PROPOSAL
Ivar PaprockiSpainXuxue Feng NEGOTIATION
Mujtaba NickaSpainAsiya Javayant NEGOTIATION
Costa DilliardItalyIvan Magalhaes PROPOSAL
Jones VocelkaBrazilAnna Fali QUALIFIED
Cody SaylorsGermanyAnna Fali QUALIFIED
Wickens NestleItalyIoni Bowcher QUALIFIED
James ButtIndiaStephen Shaw NEGOTIATION
Rodrigues CampainCanadaIvan Magalhaes QUALIFIED
Clifford RimUnited KingdomAmy Elsner NEW
Munro FerenczGermanyStephen Shaw PROPOSAL
Emily WhobreyUnited KingdomAmy Elsner NEW
Emily WhobreyBrazilAnna Fali QUALIFIED
Maisha RulapaughJapanXuxue Feng QUALIFIED
Jefferson SchemmerBrazilIvan Magalhaes PROPOSAL
Salvatore StockhamUnited KingdomAmy Elsner QUALIFIED
Smith GlickCanadaBernardo Dominic QUALIFIED
Maisha RulapaughItalyAmy Elsner UNQUALIFIED
Clifford RimUnited KingdomBernardo Dominic RENEWAL
David DarakjyFranceIoni Bowcher UNQUALIFIED
Cody SaylorsAustraliaBernardo Dominic PROPOSAL
Smith GlickIndiaAnna Fali NEW
Ashley DoeArgentinaAnna Fali UNQUALIFIED
Arvin AlbaresRussiaAmy Elsner NEGOTIATION
Chavez BriddickRussiaIvan Magalhaes QUALIFIED
Jeanfrancois VenereAustraliaIoni Bowcher NEGOTIATION
Claire TollnerAustraliaXuxue Feng QUALIFIED
Jefferson SchemmerArgentinaStephen Shaw QUALIFIED
Jones VocelkaItalyXuxue Feng RENEWAL
Julie StensethAustraliaIoni Bowcher QUALIFIED
Silvio SlusarskiCanadaAmy Elsner NEW
Smith GlickFranceAnna Fali NEW
Jefferson SchemmerJapanElwin Sharvill PROPOSAL
Alejandro PerinItalyAmy Elsner RENEWAL
Clifford RimSpainIoni Bowcher QUALIFIED
Ashley DoeBrazilStephen Shaw QUALIFIED
Ricardo GauchoCanadaXuxue Feng UNQUALIFIED
Julie StensethJapanAmy Elsner NEGOTIATION
Ivar PaprockiArgentinaXuxue Feng NEGOTIATION
Munro FerenczCanadaAsiya Javayant UNQUALIFIED
Jones VocelkaItalyIoni Bowcher NEGOTIATION
Jennifer AmigonRussiaAsiya Javayant UNQUALIFIED
Isabel BowleySpainBernardo Dominic NEGOTIATION
Frozen Columns
Name
Maisha Rulapaugh
Juan Wieser
Jennifer Amigon
Alejandro Perin
Maria Marrier
Maria Marrier
Stacey Maclead
Misaki Royster
Julie Stenseth
Mujtaba Nicka
Jeanfrancois Venere
Smith Glick
Smith Glick
Ricardo Gaucho
Munro Ferencz
Smith Glick
Wickens Nestle
Deepesh Chui
Cody Saylors
Mujtaba Nicka
Maisha Rulapaugh
Wickens Nestle
Francesco Shinko
Aika Inouye
Kadeem Flosi
Aika Inouye
Aditya Kusko
Jennifer Amigon
Aditya Kusko
Kadeem Flosi
Alejandro Perin
Morrow Ruta
Aditya Kusko
Octavia Malet
Clifford Rim
Arvin Albares
Kaitlin Ostrosky
Izzy Garufi
Johnson Sergi
Ricardo Gaucho
Ashley Doe
Jennifer Amigon
Antonio Caudy
Maisha Rulapaugh
Leon Oldroyd
Costa Dilliard
Mujtaba Nicka
Claire Tollner
Antonio Caudy
Kaitlin Ostrosky
IdCountryDate
1000Russia2026-04-22
1001Japan2026-04-29
1002India2026-04-24
1003Brazil2026-04-28
1004Brazil2026-04-12
1005Argentina2026-04-27
1006Japan2026-04-18
1007France2026-04-28
1008Argentina2026-04-12
1009Germany2026-04-15
1010Argentina2026-04-22
1011France2026-04-15
1012Italy2026-04-13
1013Russia2026-04-04
1014Brazil2026-04-07
1015Argentina2026-04-03
1016Japan2026-04-04
1017Spain2026-04-14
1018Spain2026-04-27
1019Australia2026-04-28
1020Japan2026-04-24
1021Australia2026-04-12
1022United Kingdom2026-04-08
1023Argentina2026-04-05
1024United Kingdom2026-04-05
1025France2026-04-12
1026France2026-04-25
1027France2026-04-28
1028India2026-04-17
1029Russia2026-04-15
1030Australia2026-04-24
1031Italy2026-04-19
1032India2026-04-14
1033Italy2026-04-20
1034Japan2026-04-05
1035France2026-04-19
1036France2026-04-09
1037Japan2026-04-17
1038United Kingdom2026-04-07
1039Russia2026-04-17
1040Canada2026-04-18
1041India2026-04-26
1042Japan2026-04-15
1043France2026-04-18
1044Japan2026-04-29
1045Australia2026-04-22
1046Russia2026-04-03
1047France2026-04-15
1048France2026-04-17
1049Canada2026-04-25

On-Demand Data

NameIdCountryDate
Ricardo Gaucho1000Australia2026-04-15
Kaitlin Ostrosky1001Spain2026-04-06
Leon Oldroyd1002Canada2026-04-12
Misaki Royster1003United Kingdom2026-04-05
Aditya Kusko1004Australia2026-04-04
Maria Marrier1005Spain2026-04-20
Nicolas Iturbide1006Japan2026-04-17
Emily Whobrey1007India2026-04-16
Deepesh Chui1008Japan2026-04-04
Stacey Maclead1009Italy2026-04-13
Adams Morasca1010France2026-04-15
Arvin Albares1011Italy2026-04-07
Jefferson Schemmer1012Canada2026-04-08
Aditya Kusko1013Canada2026-04-15
Faith Gillian1014United Kingdom2026-05-02
Alejandro Perin1015United Kingdom2026-04-23
Octavia Malet1016India2026-04-04
Kaitlin Ostrosky1017France2026-04-04
Aditya Kusko1018France2026-05-02
Jennifer Amigon1019Japan2026-04-08
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Darci PoquetteItalyBernardo Dominic UNQUALIFIED
Tony FollerIndiaOnyama Limba PROPOSAL
Silvio SlusarskiRussiaAsiya Javayant UNQUALIFIED
Aika InouyeFranceElwin Sharvill UNQUALIFIED
Leja CaldareraCanadaOnyama Limba QUALIFIED
Darci PoquetteBrazilXuxue Feng UNQUALIFIED
Julie StensethIndiaAnna Fali UNQUALIFIED
Greenwood BologniaFranceStephen Shaw QUALIFIED
Munro FerenczArgentinaAsiya Javayant RENEWAL
Leon OldroydItalyIoni Bowcher NEGOTIATION
Kaitlin OstroskyRussiaStephen Shaw NEW
Ashley DoeIndiaOnyama Limba RENEWAL
Aika InouyeUnited KingdomElwin Sharvill PROPOSAL
Octavia MaletFranceAnna Fali UNQUALIFIED
Antonio CaudyUnited KingdomAmy Elsner PROPOSAL
Isabel BowleyIndiaBernardo Dominic NEGOTIATION
Salvatore StockhamJapanIoni Bowcher QUALIFIED
Leon OldroydUnited KingdomAsiya Javayant NEW
Francesco ShinkoRussiaBernardo Dominic QUALIFIED
Clifford RimItalyElwin Sharvill UNQUALIFIED
Morrow RutaBrazilXuxue Feng RENEWAL
Wickens NestleFranceIoni Bowcher NEW
Sinclair WaycottRussiaIvan Magalhaes NEW
Jeanfrancois VenereItalyAsiya Javayant NEGOTIATION
Costa DilliardGermanyIoni Bowcher NEW
Wickens NestleGermanyAnna Fali NEGOTIATION
Juan WieserIndiaElwin Sharvill QUALIFIED
Leja CaldareraIndiaBernardo Dominic NEGOTIATION
Morrow RutaGermanyIvan Magalhaes NEW
Ricardo GauchoUnited KingdomOnyama Limba RENEWAL
Wickens NestleItalyAnna Fali PROPOSAL
Faith GillianArgentinaStephen Shaw QUALIFIED
Arvin AlbaresAustraliaBernardo Dominic UNQUALIFIED
Kaitlin OstroskyCanadaOnyama Limba RENEWAL
Aika InouyeGermanyElwin Sharvill UNQUALIFIED
Kaitlin OstroskySpainXuxue Feng NEW
Deepesh ChuiAustraliaElwin Sharvill NEGOTIATION
Kadeem FlosiAustraliaAsiya Javayant QUALIFIED
David DarakjyBrazilIvan Magalhaes PROPOSAL
Deepesh ChuiItalyOnyama Limba 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>