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
Wickens NestleItalyAnna Fali PROPOSAL
Munro FerenczCanadaBernardo Dominic UNQUALIFIED
Faith GillianFranceXuxue Feng NEW
Aika InouyeBrazilElwin Sharvill NEW
Claire TollnerUnited KingdomAnna Fali NEGOTIATION
Ivar PaprockiIndiaBernardo Dominic UNQUALIFIED
Chavez BriddickJapanIoni Bowcher QUALIFIED
Salvatore StockhamItalyAmy Elsner UNQUALIFIED
Nicolas IturbideItalyXuxue Feng NEGOTIATION
Francesco ShinkoCanadaIvan Magalhaes UNQUALIFIED
Clifford RimFranceXuxue Feng NEGOTIATION
Sinclair WaycottAustraliaAnna Fali NEW
Arvin AlbaresRussiaXuxue Feng NEW
Adams MorascaRussiaXuxue Feng NEW
Kadeem FlosiBrazilElwin Sharvill UNQUALIFIED
Kaitlin OstroskyFranceElwin Sharvill UNQUALIFIED
Adams MorascaGermanyXuxue Feng NEGOTIATION
Greenwood BologniaFranceXuxue Feng RENEWAL
Murillo MaletSpainStephen Shaw PROPOSAL
Misaki RoysterItalyOnyama Limba PROPOSAL
Emily WhobreyCanadaBernardo Dominic QUALIFIED
Sinclair WaycottBrazilIoni Bowcher PROPOSAL
Cody SaylorsIndiaAsiya Javayant QUALIFIED
Mujtaba NickaArgentinaXuxue Feng QUALIFIED
Francesco ShinkoSpainBernardo Dominic QUALIFIED
Sinclair WaycottCanadaAnna Fali NEGOTIATION
Costa DilliardFranceAsiya Javayant PROPOSAL
Munro FerenczArgentinaAmy Elsner NEW
Octavia MaletItalyIvan Magalhaes NEGOTIATION
Aruna FigeroaCanadaXuxue Feng NEW
Wickens NestleIndiaAsiya Javayant UNQUALIFIED
Morrow RutaItalyStephen Shaw NEW
Faith GillianCanadaIvan Magalhaes NEGOTIATION
Morrow RutaFranceAnna Fali RENEWAL
Cody SaylorsAustraliaAmy Elsner RENEWAL
Wickens NestleIndiaOnyama Limba PROPOSAL
Sinclair WaycottCanadaIvan Magalhaes UNQUALIFIED
Murillo MaletBrazilOnyama Limba NEGOTIATION
Silvio SlusarskiCanadaIoni Bowcher PROPOSAL
Greenwood BologniaGermanyAnna Fali QUALIFIED
Kaitlin OstroskyBrazilOnyama Limba PROPOSAL
David DarakjyCanadaIvan Magalhaes PROPOSAL
Aruna FigeroaGermanyOnyama Limba UNQUALIFIED
Rodrigues CampainUnited KingdomIvan Magalhaes PROPOSAL
Chavez BriddickSpainIvan Magalhaes NEW
Maria MarrierRussiaElwin Sharvill RENEWAL
Leon OldroydItalyStephen Shaw PROPOSAL
Deepesh ChuiCanadaAmy Elsner NEGOTIATION
Deepesh ChuiGermanyOnyama Limba UNQUALIFIED
Rodrigues CampainRussiaAsiya Javayant UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Claire TollnerSpainXuxue Feng NEGOTIATION
Alejandro PerinUnited KingdomIvan Magalhaes QUALIFIED
Arvin AlbaresBrazilOnyama Limba UNQUALIFIED
Antonio CaudyJapanIoni Bowcher QUALIFIED
Isabel BowleyFranceStephen Shaw NEW
Chavez BriddickAustraliaAnna Fali PROPOSAL
Leon OldroydFranceAmy Elsner UNQUALIFIED
Costa DilliardFranceIoni Bowcher UNQUALIFIED
Faith GillianCanadaStephen Shaw UNQUALIFIED
Johnson SergiJapanIoni Bowcher NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Stacey MacleadJapan2026-04-27Buckley Miller Wright NEW13Amy Elsner
1001Isabel BowleyIndia2026-04-18Rangoni Of Florence NEW89Stephen Shaw
1002Emily WhobreyGermany2026-04-23Commercial Press NEGOTIATION47Elwin Sharvill
1003Munro FerenczIndia2026-04-14Morlong Associates NEGOTIATION74Anna Fali
1004Murillo MaletUnited Kingdom2026-05-01Truhlar And Truhlar Attys UNQUALIFIED52Elwin Sharvill
1005Kaitlin OstroskyIndia2026-04-25Chemel, James L Cpa RENEWAL50Stephen Shaw
1006Leon OldroydIndia2026-04-24Benton, John B Jr NEGOTIATION68Bernardo Dominic
1007Nicolas IturbideGermany2026-04-30Rangoni Of Florence UNQUALIFIED98Amy Elsner
1008Stacey MacleadItaly2026-04-17Printing Dimensions NEGOTIATION84Bernardo Dominic
1009Jennifer AmigonAustralia2026-04-18Morlong Associates NEGOTIATION5Amy Elsner
1010Rodrigues CampainUnited Kingdom2026-04-10Printing Dimensions NEW5Elwin Sharvill
1011Octavia MaletBrazil2026-04-17Rousseaux, Michael Esq PROPOSAL63Onyama Limba
1012Cody SaylorsItaly2026-04-08Morlong Associates RENEWAL27Ivan Magalhaes
1013Faith GillianArgentina2026-04-07Chapman, Ross E Esq UNQUALIFIED99Bernardo Dominic
1014Tony FollerJapan2026-04-11Chapman, Ross E Esq RENEWAL5Xuxue Feng
1015Maisha RulapaughFrance2026-04-16Truhlar And Truhlar Attys UNQUALIFIED98Bernardo Dominic
1016Izzy GarufiIndia2026-04-17Chemel, James L Cpa RENEWAL66Asiya Javayant
1017Silvio SlusarskiItaly2026-04-17Printing Dimensions UNQUALIFIED83Onyama Limba
1018Alejandro PerinFrance2026-04-21Dorl, James J Esq QUALIFIED19Onyama Limba
1019Mayumi KolmetzRussia2026-04-17Printing Dimensions PROPOSAL63Anna Fali
1020Maisha RulapaughItaly2026-04-13Rangoni Of Florence QUALIFIED30Ioni Bowcher
1021Faith GillianArgentina2026-04-17King, Christopher A Esq PROPOSAL56Amy Elsner
1022Costa DilliardJapan2026-04-30Rousseaux, Michael Esq UNQUALIFIED55Ivan Magalhaes
1023Munro FerenczBrazil2026-05-01King, Christopher A Esq NEGOTIATION97Asiya Javayant
1024David DarakjyJapan2026-04-22Chanay, Jeffrey A Esq UNQUALIFIED54Bernardo Dominic
1025Misaki RoysterItaly2026-04-09Buckley Miller Wright NEW9Asiya Javayant
1026Clifford RimItaly2026-04-06Morlong Associates QUALIFIED39Anna Fali
1027Emily WhobreyUnited Kingdom2026-04-17Printing Dimensions UNQUALIFIED23Anna Fali
1028Wickens NestleBrazil2026-05-02Dorl, James J Esq PROPOSAL40Bernardo Dominic
1029Leon OldroydFrance2026-04-10Chemel, James L Cpa NEGOTIATION64Anna Fali
1030Francesco ShinkoArgentina2026-04-20Chemel, James L Cpa PROPOSAL3Ioni Bowcher
1031Johnson SergiRussia2026-04-19Chapman, Ross E Esq PROPOSAL8Asiya Javayant
1032Darci PoquetteIndia2026-05-04Feiner Bros NEGOTIATION30Ivan Magalhaes
1033Mayumi KolmetzRussia2026-04-18Buckley Miller Wright NEGOTIATION73Elwin Sharvill
1034Emily WhobreyArgentina2026-05-02Feiner Bros NEW66Bernardo Dominic
1035Emily WhobreyUnited Kingdom2026-04-29Dorl, James J Esq PROPOSAL2Stephen Shaw
1036Jennifer AmigonArgentina2026-04-17Commercial Press QUALIFIED24Bernardo Dominic
1037Murillo MaletFrance2026-04-21Feltz Printing Service NEGOTIATION71Bernardo Dominic
1038Ashley DoeFrance2026-05-03Truhlar And Truhlar Attys NEGOTIATION83Elwin Sharvill
1039Maria MarrierArgentina2026-04-09Feltz Printing Service RENEWAL52Xuxue Feng
1040Kadeem FlosiIndia2026-04-17King, Christopher A Esq NEW66Xuxue Feng
1041Aditya KuskoSpain2026-04-22Rousseaux, Michael Esq PROPOSAL47Ivan Magalhaes
1042Alejandro PerinAustralia2026-04-14Chanay, Jeffrey A Esq UNQUALIFIED10Xuxue Feng
1043James ButtAustralia2026-05-01Feltz Printing Service NEW67Xuxue Feng
1044Ricardo GauchoIndia2026-04-07Feltz Printing Service NEGOTIATION57Amy Elsner
1045Aika InouyeArgentina2026-04-15Rousseaux, Michael Esq UNQUALIFIED46Ivan Magalhaes
1046Mujtaba NickaIndia2026-05-01Feiner Bros QUALIFIED88Ivan Magalhaes
1047Juan WieserFrance2026-04-16Chapman, Ross E Esq RENEWAL76Onyama Limba
1048Izzy GarufiSpain2026-04-10King, Christopher A Esq UNQUALIFIED17Amy Elsner
1049Wickens NestleItaly2026-04-09Buckley Miller Wright PROPOSAL89Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
James ButtUnited KingdomAnna Fali QUALIFIED
Munro FerenczGermanyAmy Elsner NEGOTIATION
Ashley DoeGermanyElwin Sharvill UNQUALIFIED
Leja CaldareraArgentinaAnna Fali PROPOSAL
Maisha RulapaughArgentinaElwin Sharvill NEW
Ivar PaprockiFranceIvan Magalhaes UNQUALIFIED
Leja CaldareraBrazilIvan Magalhaes RENEWAL
Claire TollnerArgentinaStephen Shaw NEGOTIATION
Tony FollerIndiaAmy Elsner PROPOSAL
Salvatore StockhamRussiaXuxue Feng UNQUALIFIED
David DarakjyIndiaIvan Magalhaes RENEWAL
Emily WhobreyUnited KingdomXuxue Feng PROPOSAL
David DarakjyRussiaAmy Elsner NEGOTIATION
Smith GlickBrazilBernardo Dominic RENEWAL
James ButtUnited KingdomAnna Fali UNQUALIFIED
Francesco ShinkoIndiaIvan Magalhaes NEW
Ivar PaprockiSpainAnna Fali NEGOTIATION
Alejandro PerinUnited KingdomStephen Shaw NEW
Arvin AlbaresIndiaAnna Fali RENEWAL
Greenwood BologniaBrazilIoni Bowcher UNQUALIFIED
Alejandro PerinBrazilAmy Elsner NEGOTIATION
Deepesh ChuiArgentinaAmy Elsner NEW
Chavez BriddickFranceElwin Sharvill NEGOTIATION
Emily WhobreyArgentinaBernardo Dominic QUALIFIED
Smith GlickJapanXuxue Feng QUALIFIED
Jones VocelkaBrazilStephen Shaw QUALIFIED
Faith GillianRussiaBernardo Dominic NEGOTIATION
Alejandro PerinCanadaIvan Magalhaes RENEWAL
Clifford RimFranceXuxue Feng UNQUALIFIED
Emily WhobreyBrazilXuxue Feng NEW
Julie StensethAustraliaStephen Shaw RENEWAL
Cody SaylorsUnited KingdomOnyama Limba NEW
Kaitlin OstroskyGermanyStephen Shaw NEGOTIATION
Misaki RoysterArgentinaBernardo Dominic RENEWAL
Jefferson SchemmerRussiaAmy Elsner QUALIFIED
Arvin AlbaresBrazilBernardo Dominic UNQUALIFIED
David DarakjyFranceBernardo Dominic PROPOSAL
Salvatore StockhamArgentinaIoni Bowcher QUALIFIED
Claire TollnerFranceIoni Bowcher UNQUALIFIED
Alejandro PerinAustraliaIvan Magalhaes NEW
Nicolas IturbideItalyAnna Fali RENEWAL
Ivar PaprockiUnited KingdomBernardo Dominic RENEWAL
Claire TollnerAustraliaAsiya Javayant UNQUALIFIED
Mujtaba NickaAustraliaIoni Bowcher RENEWAL
Francesco ShinkoCanadaElwin Sharvill PROPOSAL
Francesco ShinkoRussiaAsiya Javayant PROPOSAL
Adams MorascaGermanyAnna Fali NEGOTIATION
Stacey MacleadRussiaAnna Fali NEGOTIATION
Deepesh ChuiJapanIvan Magalhaes PROPOSAL
Leja CaldareraGermanyAnna Fali UNQUALIFIED
Frozen Columns
Name
Sinclair Waycott
Leon Oldroyd
Darci Poquette
Costa Dilliard
Murillo Malet
Julie Stenseth
Alejandro Perin
Izzy Garufi
Maria Marrier
Aruna Figeroa
Octavia Malet
Francesco Shinko
Mujtaba Nicka
Kaitlin Ostrosky
Costa Dilliard
Leja Caldarera
Ashley Doe
Kaitlin Ostrosky
Costa Dilliard
Faith Gillian
Leon Oldroyd
Silvio Slusarski
Izzy Garufi
Darci Poquette
Tony Foller
Isabel Bowley
Leon Oldroyd
Cody Saylors
Jennifer Amigon
Leon Oldroyd
Johnson Sergi
Costa Dilliard
Smith Glick
Nicolas Iturbide
Smith Glick
Maisha Rulapaugh
Aditya Kusko
Costa Dilliard
Costa Dilliard
Cody Saylors
Stacey Maclead
Chavez Briddick
Aika Inouye
Jones Vocelka
David Darakjy
Tony Foller
Adams Morasca
Jennifer Amigon
Faith Gillian
Greenwood Bolognia
IdCountryDate
1000Germany2026-04-16
1001Italy2026-04-10
1002Canada2026-04-30
1003Germany2026-04-26
1004Italy2026-04-25
1005Brazil2026-04-23
1006Russia2026-04-20
1007India2026-05-02
1008Italy2026-04-28
1009Germany2026-04-15
1010Italy2026-04-07
1011Spain2026-04-13
1012France2026-05-05
1013Argentina2026-04-13
1014Canada2026-05-04
1015Brazil2026-04-14
1016Japan2026-05-01
1017Argentina2026-04-16
1018Germany2026-04-11
1019Japan2026-04-14
1020Canada2026-04-29
1021France2026-04-24
1022Spain2026-04-19
1023Canada2026-04-24
1024Spain2026-04-27
1025United Kingdom2026-04-22
1026Brazil2026-04-28
1027Brazil2026-05-04
1028Canada2026-04-11
1029Canada2026-04-10
1030Spain2026-04-19
1031Canada2026-04-10
1032Brazil2026-04-27
1033United Kingdom2026-04-19
1034Germany2026-04-12
1035Argentina2026-04-09
1036Brazil2026-05-03
1037Italy2026-04-21
1038Brazil2026-04-13
1039United Kingdom2026-04-27
1040Germany2026-04-13
1041Russia2026-04-23
1042Spain2026-05-04
1043Japan2026-04-08
1044Brazil2026-05-04
1045Japan2026-04-30
1046Australia2026-04-27
1047United Kingdom2026-04-19
1048Germany2026-04-07
1049India2026-05-03

On-Demand Data

NameIdCountryDate
Costa Dilliard1000Italy2026-05-03
Alejandro Perin1001United Kingdom2026-04-20
Nicolas Iturbide1002Argentina2026-04-19
Silvio Slusarski1003United Kingdom2026-04-23
Ashley Doe1004Italy2026-04-16
Octavia Malet1005India2026-05-03
Francesco Shinko1006Germany2026-04-07
Aditya Kusko1007Russia2026-04-19
Deepesh Chui1008India2026-04-20
Costa Dilliard1009Australia2026-05-01
Jeanfrancois Venere1010Russia2026-04-21
Darci Poquette1011Russia2026-04-16
Maria Marrier1012Brazil2026-04-29
Adams Morasca1013France2026-04-20
Claire Tollner1014Brazil2026-05-05
Francesco Shinko1015India2026-04-15
Deepesh Chui1016Argentina2026-04-09
Ricardo Gaucho1017Brazil2026-04-30
Emily Whobrey1018Spain2026-04-17
Claire Tollner1019United Kingdom2026-04-12
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
David DarakjyBrazilStephen Shaw QUALIFIED
Kadeem FlosiGermanyOnyama Limba NEW
Jones VocelkaUnited KingdomAsiya Javayant PROPOSAL
Morrow RutaGermanyElwin Sharvill NEGOTIATION
Stacey MacleadFranceElwin Sharvill QUALIFIED
Ricardo GauchoGermanyBernardo Dominic PROPOSAL
Emily WhobreyUnited KingdomOnyama Limba NEGOTIATION
Aika InouyeRussiaXuxue Feng NEGOTIATION
Jones VocelkaJapanOnyama Limba UNQUALIFIED
Adams MorascaArgentinaXuxue Feng NEW
Aditya KuskoGermanyAsiya Javayant QUALIFIED
Tony FollerArgentinaAmy Elsner UNQUALIFIED
Adams MorascaAustraliaOnyama Limba NEW
Antonio CaudyGermanyXuxue Feng NEGOTIATION
Juan WieserBrazilAsiya Javayant QUALIFIED
Deepesh ChuiItalyIoni Bowcher NEGOTIATION
Smith GlickAustraliaIvan Magalhaes QUALIFIED
Greenwood BologniaAustraliaIvan Magalhaes PROPOSAL
Alejandro PerinRussiaIoni Bowcher NEW
Cody SaylorsSpainElwin Sharvill UNQUALIFIED
Emily WhobreyRussiaElwin Sharvill NEW
Mujtaba NickaGermanyAsiya Javayant NEW
Isabel BowleyRussiaBernardo Dominic UNQUALIFIED
Leja CaldareraGermanyIvan Magalhaes NEW
Isabel BowleySpainIoni Bowcher UNQUALIFIED
Misaki RoysterRussiaBernardo Dominic NEGOTIATION
Faith GillianSpainStephen Shaw PROPOSAL
Murillo MaletCanadaBernardo Dominic PROPOSAL
Adams MorascaItalyIvan Magalhaes PROPOSAL
Francesco ShinkoIndiaAnna Fali PROPOSAL
Faith GillianRussiaIoni Bowcher NEW
Deepesh ChuiSpainAmy Elsner PROPOSAL
Stacey MacleadFranceIoni Bowcher QUALIFIED
Stacey MacleadCanadaIoni Bowcher NEGOTIATION
Ashley DoeItalyOnyama Limba UNQUALIFIED
Kaitlin OstroskyGermanyAsiya Javayant RENEWAL
Claire TollnerAustraliaOnyama Limba PROPOSAL
Maria MarrierSpainBernardo Dominic NEGOTIATION
Smith GlickFranceOnyama Limba UNQUALIFIED
Antonio CaudyAustraliaIvan Magalhaes PROPOSAL

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