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
Jennifer AmigonAustraliaIvan Magalhaes RENEWAL
Wickens NestleIndiaOnyama Limba NEGOTIATION
Mayumi KolmetzSpainXuxue Feng PROPOSAL
Isabel BowleySpainXuxue Feng RENEWAL
Leja CaldareraBrazilAnna Fali NEW
Wickens NestleCanadaElwin Sharvill QUALIFIED
Murillo MaletIndiaBernardo Dominic QUALIFIED
Silvio SlusarskiFranceXuxue Feng NEGOTIATION
James ButtSpainOnyama Limba NEGOTIATION
Costa DilliardFranceBernardo Dominic RENEWAL
Maria MarrierArgentinaBernardo Dominic RENEWAL
Julie StensethItalyAnna Fali QUALIFIED
Juan WieserArgentinaBernardo Dominic NEGOTIATION
Arvin AlbaresAustraliaIvan Magalhaes NEGOTIATION
Juan WieserJapanIvan Magalhaes UNQUALIFIED
Francesco ShinkoRussiaBernardo Dominic RENEWAL
Jennifer AmigonGermanyXuxue Feng RENEWAL
Arvin AlbaresSpainIoni Bowcher QUALIFIED
Leja CaldareraBrazilAsiya Javayant RENEWAL
Greenwood BologniaItalyIoni Bowcher RENEWAL
Johnson SergiJapanAmy Elsner PROPOSAL
Jefferson SchemmerGermanyAsiya Javayant NEW
Costa DilliardSpainStephen Shaw PROPOSAL
Murillo MaletGermanyStephen Shaw NEW
Mayumi KolmetzSpainAsiya Javayant NEGOTIATION
Mayumi KolmetzArgentinaStephen Shaw NEGOTIATION
Kaitlin OstroskyJapanAmy Elsner RENEWAL
Sinclair WaycottSpainAmy Elsner NEW
Ivar PaprockiIndiaBernardo Dominic NEGOTIATION
Deepesh ChuiGermanyStephen Shaw RENEWAL
James ButtArgentinaAmy Elsner UNQUALIFIED
Jeanfrancois VenereGermanyXuxue Feng UNQUALIFIED
Isabel BowleyCanadaIvan Magalhaes PROPOSAL
Claire TollnerGermanyIvan Magalhaes NEW
Darci PoquetteArgentinaXuxue Feng RENEWAL
Murillo MaletIndiaAsiya Javayant NEW
Cody SaylorsItalyIvan Magalhaes PROPOSAL
Izzy GarufiBrazilAsiya Javayant RENEWAL
Antonio CaudyCanadaBernardo Dominic QUALIFIED
Greenwood BologniaSpainBernardo Dominic NEW
Silvio SlusarskiItalyStephen Shaw UNQUALIFIED
Arvin AlbaresSpainXuxue Feng NEW
Aika InouyeFranceIvan Magalhaes NEW
Octavia MaletGermanyAnna Fali QUALIFIED
Kadeem FlosiGermanyAnna Fali UNQUALIFIED
Costa DilliardAustraliaElwin Sharvill NEW
Aika InouyeArgentinaBernardo Dominic NEW
Clifford RimFranceStephen Shaw NEW
Alejandro PerinUnited KingdomAsiya Javayant NEGOTIATION
Greenwood BologniaSpainBernardo Dominic QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Cody SaylorsAustraliaIvan Magalhaes PROPOSAL
Juan WieserIndiaXuxue Feng NEGOTIATION
Tony FollerCanadaIvan Magalhaes NEGOTIATION
Aruna FigeroaAustraliaIoni Bowcher NEGOTIATION
Antonio CaudyJapanAmy Elsner NEGOTIATION
Ivar PaprockiArgentinaElwin Sharvill PROPOSAL
Sinclair WaycottRussiaAsiya Javayant NEGOTIATION
Morrow RutaItalyIvan Magalhaes NEGOTIATION
Antonio CaudySpainAsiya Javayant NEGOTIATION
Silvio SlusarskiRussiaOnyama Limba QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Munro FerenczSpain2026-04-28Feiner Bros QUALIFIED31Bernardo Dominic
1001Adams MorascaUnited Kingdom2026-05-01Printing Dimensions UNQUALIFIED26Onyama Limba
1002Aruna FigeroaUnited Kingdom2026-04-21Printing Dimensions PROPOSAL39Ivan Magalhaes
1003Kadeem FlosiIndia2026-04-24Chemel, James L Cpa UNQUALIFIED50Anna Fali
1004Kadeem FlosiIndia2026-04-18Feltz Printing Service QUALIFIED12Elwin Sharvill
1005Emily WhobreySpain2026-05-01Dorl, James J Esq UNQUALIFIED76Bernardo Dominic
1006Maria MarrierArgentina2026-04-23Dorl, James J Esq RENEWAL51Stephen Shaw
1007Wickens NestleFrance2026-04-17Benton, John B Jr RENEWAL51Anna Fali
1008Leon OldroydItaly2026-04-24King, Christopher A Esq RENEWAL67Stephen Shaw
1009James ButtSpain2026-04-22Morlong Associates PROPOSAL95Xuxue Feng
1010Munro FerenczAustralia2026-05-01Commercial Press PROPOSAL30Onyama Limba
1011Morrow RutaIndia2026-04-26Chanay, Jeffrey A Esq NEGOTIATION63Stephen Shaw
1012Jeanfrancois VenereJapan2026-04-14Morlong Associates NEGOTIATION57Xuxue Feng
1013Leon OldroydUnited Kingdom2026-05-10Morlong Associates NEW78Xuxue Feng
1014Johnson SergiRussia2026-04-27King, Christopher A Esq NEGOTIATION33Ioni Bowcher
1015Leja CaldareraItaly2026-04-14Dorl, James J Esq NEGOTIATION44Stephen Shaw
1016Jennifer AmigonRussia2026-04-19Dorl, James J Esq NEW6Elwin Sharvill
1017Johnson SergiUnited Kingdom2026-05-02Rousseaux, Michael Esq RENEWAL66Onyama Limba
1018Francesco ShinkoItaly2026-04-26Rangoni Of Florence RENEWAL6Stephen Shaw
1019Julie StensethArgentina2026-04-16Buckley Miller Wright QUALIFIED2Bernardo Dominic
1020Kaitlin OstroskyAustralia2026-05-01Chapman, Ross E Esq UNQUALIFIED38Asiya Javayant
1021Aika InouyeSpain2026-04-18Chemel, James L Cpa NEGOTIATION55Xuxue Feng
1022Jennifer AmigonAustralia2026-04-22Rangoni Of Florence QUALIFIED63Ioni Bowcher
1023Ricardo GauchoBrazil2026-05-05Printing Dimensions NEW7Stephen Shaw
1024Sinclair WaycottJapan2026-04-14Rangoni Of Florence UNQUALIFIED14Ioni Bowcher
1025Kaitlin OstroskyJapan2026-04-20Chanay, Jeffrey A Esq RENEWAL74Anna Fali
1026Deepesh ChuiIndia2026-04-24Morlong Associates QUALIFIED53Asiya Javayant
1027Greenwood BologniaAustralia2026-05-08Chapman, Ross E Esq NEW68Xuxue Feng
1028Jefferson SchemmerSpain2026-04-22Feltz Printing Service QUALIFIED6Ioni Bowcher
1029Smith GlickUnited Kingdom2026-05-10Rousseaux, Michael Esq NEW89Stephen Shaw
1030Francesco ShinkoItaly2026-05-03Printing Dimensions RENEWAL48Bernardo Dominic
1031Octavia MaletFrance2026-05-08Morlong Associates PROPOSAL81Bernardo Dominic
1032Darci PoquetteAustralia2026-04-24Feiner Bros PROPOSAL21Elwin Sharvill
1033Silvio SlusarskiFrance2026-05-01Benton, John B Jr PROPOSAL41Xuxue Feng
1034Jones VocelkaRussia2026-04-25Morlong Associates PROPOSAL21Stephen Shaw
1035Faith GillianBrazil2026-05-10Benton, John B Jr NEW12Xuxue Feng
1036Darci PoquetteJapan2026-04-15Chemel, James L Cpa PROPOSAL38Bernardo Dominic
1037Salvatore StockhamJapan2026-04-30Dorl, James J Esq QUALIFIED97Asiya Javayant
1038Emily WhobreyCanada2026-04-17Chemel, James L Cpa UNQUALIFIED30Asiya Javayant
1039Aika InouyeUnited Kingdom2026-04-19Chanay, Jeffrey A Esq QUALIFIED96Stephen Shaw
1040Mujtaba NickaUnited Kingdom2026-05-02Feiner Bros UNQUALIFIED55Ivan Magalhaes
1041Leon OldroydItaly2026-04-18Commercial Press NEW54Xuxue Feng
1042Ricardo GauchoArgentina2026-05-02Buckley Miller Wright RENEWAL2Stephen Shaw
1043Mayumi KolmetzCanada2026-04-18Chapman, Ross E Esq RENEWAL58Stephen Shaw
1044Costa DilliardCanada2026-04-30Commercial Press UNQUALIFIED24Ivan Magalhaes
1045Darci PoquetteGermany2026-04-27Chemel, James L Cpa NEW85Ioni Bowcher
1046Salvatore StockhamAustralia2026-05-05Printing Dimensions UNQUALIFIED25Ivan Magalhaes
1047Kaitlin OstroskyCanada2026-05-06King, Christopher A Esq PROPOSAL0Ioni Bowcher
1048Juan WieserBrazil2026-05-11Morlong Associates RENEWAL83Amy Elsner
1049Isabel BowleyCanada2026-05-01Dorl, James J Esq NEGOTIATION19Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Claire TollnerGermanyAsiya Javayant NEW
Julie StensethCanadaAnna Fali PROPOSAL
Misaki RoysterUnited KingdomAmy Elsner RENEWAL
James ButtIndiaStephen Shaw NEGOTIATION
Maria MarrierArgentinaIoni Bowcher UNQUALIFIED
Ivar PaprockiFranceElwin Sharvill PROPOSAL
Julie StensethJapanStephen Shaw PROPOSAL
Darci PoquetteItalyXuxue Feng NEW
Leon OldroydJapanAmy Elsner UNQUALIFIED
Salvatore StockhamItalyAsiya Javayant NEGOTIATION
Julie StensethIndiaIvan Magalhaes QUALIFIED
Johnson SergiCanadaXuxue Feng NEW
Stacey MacleadJapanIoni Bowcher NEW
Mujtaba NickaCanadaAmy Elsner NEW
Aika InouyeItalyIoni Bowcher UNQUALIFIED
Izzy GarufiItalyOnyama Limba NEGOTIATION
Claire TollnerRussiaElwin Sharvill NEGOTIATION
Deepesh ChuiFranceAmy Elsner PROPOSAL
Jefferson SchemmerSpainAmy Elsner RENEWAL
Ivar PaprockiArgentinaIoni Bowcher QUALIFIED
Murillo MaletCanadaIoni Bowcher UNQUALIFIED
Sinclair WaycottCanadaAnna Fali NEW
Mayumi KolmetzIndiaAsiya Javayant UNQUALIFIED
Deepesh ChuiSpainAnna Fali UNQUALIFIED
Francesco ShinkoItalyXuxue Feng UNQUALIFIED
Johnson SergiRussiaIoni Bowcher NEW
David DarakjyBrazilStephen Shaw NEGOTIATION
Maria MarrierItalyElwin Sharvill PROPOSAL
Julie StensethFranceAmy Elsner NEW
Claire TollnerUnited KingdomBernardo Dominic PROPOSAL
Jeanfrancois VenereFranceIvan Magalhaes NEGOTIATION
Antonio CaudyArgentinaAnna Fali QUALIFIED
Emily WhobreyRussiaOnyama Limba RENEWAL
Silvio SlusarskiUnited KingdomElwin Sharvill NEW
Stacey MacleadArgentinaAnna Fali UNQUALIFIED
Salvatore StockhamItalyStephen Shaw PROPOSAL
Jeanfrancois VenereArgentinaAnna Fali PROPOSAL
Emily WhobreyArgentinaAmy Elsner QUALIFIED
Isabel BowleyRussiaElwin Sharvill UNQUALIFIED
Julie StensethBrazilAmy Elsner PROPOSAL
Emily WhobreyGermanyAnna Fali UNQUALIFIED
Adams MorascaGermanyIvan Magalhaes NEGOTIATION
Chavez BriddickItalyXuxue Feng RENEWAL
Cody SaylorsArgentinaAmy Elsner QUALIFIED
Mayumi KolmetzSpainOnyama Limba PROPOSAL
Jones VocelkaUnited KingdomAsiya Javayant NEGOTIATION
Juan WieserIndiaAnna Fali UNQUALIFIED
Francesco ShinkoArgentinaXuxue Feng UNQUALIFIED
Ricardo GauchoArgentinaOnyama Limba NEW
Kaitlin OstroskyJapanIvan Magalhaes UNQUALIFIED
Frozen Columns
Name
Misaki Royster
Isabel Bowley
Francesco Shinko
Rodrigues Campain
Clifford Rim
Jones Vocelka
Izzy Garufi
Munro Ferencz
Salvatore Stockham
Arvin Albares
Clifford Rim
Isabel Bowley
Arvin Albares
Cody Saylors
Salvatore Stockham
Antonio Caudy
Julie Stenseth
Murillo Malet
Cody Saylors
Chavez Briddick
Rodrigues Campain
Munro Ferencz
Kadeem Flosi
Ricardo Gaucho
Aika Inouye
Smith Glick
Sinclair Waycott
Claire Tollner
Antonio Caudy
Stacey Maclead
Smith Glick
Morrow Ruta
Juan Wieser
Salvatore Stockham
James Butt
Clifford Rim
Arvin Albares
Wickens Nestle
Aruna Figeroa
Octavia Malet
Costa Dilliard
Isabel Bowley
Aditya Kusko
Jennifer Amigon
Mayumi Kolmetz
Sinclair Waycott
Greenwood Bolognia
Antonio Caudy
Francesco Shinko
Morrow Ruta
IdCountryDate
1000Argentina2026-04-25
1001United Kingdom2026-05-11
1002Spain2026-05-11
1003France2026-04-29
1004Argentina2026-04-16
1005Brazil2026-05-04
1006Spain2026-04-26
1007Italy2026-04-25
1008Brazil2026-04-29
1009Germany2026-04-17
1010Germany2026-04-19
1011Japan2026-04-16
1012Spain2026-04-16
1013Russia2026-04-14
1014Italy2026-05-09
1015Russia2026-04-28
1016India2026-04-14
1017Spain2026-04-25
1018India2026-04-18
1019India2026-05-12
1020India2026-04-13
1021Brazil2026-04-26
1022Argentina2026-04-23
1023Italy2026-05-08
1024United Kingdom2026-04-23
1025Russia2026-04-29
1026United Kingdom2026-04-20
1027Spain2026-05-08
1028France2026-05-03
1029Russia2026-04-28
1030France2026-04-13
1031Germany2026-05-12
1032Australia2026-05-04
1033France2026-05-11
1034Germany2026-04-23
1035Spain2026-04-26
1036Italy2026-04-28
1037Spain2026-04-27
1038Germany2026-04-28
1039Germany2026-05-12
1040Spain2026-05-08
1041Brazil2026-04-27
1042France2026-04-14
1043India2026-05-11
1044Argentina2026-05-07
1045Italy2026-05-08
1046Russia2026-05-09
1047Russia2026-04-14
1048France2026-04-26
1049Brazil2026-04-26

On-Demand Data

NameIdCountryDate
James Butt1000India2026-05-02
Kadeem Flosi1001Italy2026-04-27
Adams Morasca1002United Kingdom2026-04-16
David Darakjy1003Germany2026-04-20
Mujtaba Nicka1004India2026-05-02
Aika Inouye1005Australia2026-05-04
Julie Stenseth1006Brazil2026-04-26
Alejandro Perin1007Germany2026-04-25
David Darakjy1008Australia2026-04-20
Julie Stenseth1009Spain2026-05-01
Jefferson Schemmer1010Germany2026-05-01
Mujtaba Nicka1011Australia2026-04-22
Ivar Paprocki1012Russia2026-05-05
Mayumi Kolmetz1013France2026-04-25
Ricardo Gaucho1014Brazil2026-05-08
James Butt1015Argentina2026-04-28
Mujtaba Nicka1016France2026-04-28
Faith Gillian1017France2026-04-19
Maria Marrier1018Argentina2026-04-20
Claire Tollner1019Italy2026-04-21
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Clifford RimGermanyIvan Magalhaes RENEWAL
Leja CaldareraRussiaBernardo Dominic NEGOTIATION
Isabel BowleyGermanyIvan Magalhaes PROPOSAL
Sinclair WaycottItalyStephen Shaw NEW
Jefferson SchemmerFranceStephen Shaw UNQUALIFIED
Misaki RoysterIndiaAmy Elsner PROPOSAL
Clifford RimGermanyOnyama Limba NEGOTIATION
Maria MarrierUnited KingdomAmy Elsner UNQUALIFIED
Jefferson SchemmerIndiaIoni Bowcher UNQUALIFIED
Julie StensethJapanOnyama Limba PROPOSAL
Munro FerenczGermanyXuxue Feng RENEWAL
Morrow RutaFranceIoni Bowcher PROPOSAL
Wickens NestleJapanElwin Sharvill PROPOSAL
Mayumi KolmetzBrazilIoni Bowcher UNQUALIFIED
Ivar PaprockiSpainStephen Shaw NEGOTIATION
Greenwood BologniaAustraliaElwin Sharvill RENEWAL
Jeanfrancois VenereAustraliaXuxue Feng QUALIFIED
Leon OldroydCanadaAmy Elsner UNQUALIFIED
Isabel BowleyFranceBernardo Dominic UNQUALIFIED
Juan WieserRussiaAnna Fali NEGOTIATION
Ashley DoeJapanStephen Shaw QUALIFIED
Rodrigues CampainArgentinaXuxue Feng PROPOSAL
Wickens NestleRussiaBernardo Dominic UNQUALIFIED
James ButtItalyIvan Magalhaes RENEWAL
Kaitlin OstroskyIndiaAsiya Javayant PROPOSAL
Misaki RoysterUnited KingdomIoni Bowcher NEW
Johnson SergiAustraliaAmy Elsner PROPOSAL
Clifford RimBrazilStephen Shaw QUALIFIED
Jennifer AmigonGermanyElwin Sharvill UNQUALIFIED
Johnson SergiFranceElwin Sharvill NEGOTIATION
Cody SaylorsIndiaIoni Bowcher PROPOSAL
Izzy GarufiRussiaXuxue Feng NEGOTIATION
Morrow RutaRussiaOnyama Limba PROPOSAL
Ashley DoeRussiaStephen Shaw NEGOTIATION
Smith GlickRussiaXuxue Feng PROPOSAL
Aika InouyeArgentinaIvan Magalhaes NEGOTIATION
Kadeem FlosiSpainAmy Elsner PROPOSAL
Leja CaldareraFranceAnna Fali NEW
Ivar PaprockiUnited KingdomOnyama Limba UNQUALIFIED
Antonio CaudyIndiaXuxue Feng 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>