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
Aditya KuskoItalyXuxue Feng NEW
James ButtAustraliaXuxue Feng NEW
Leja CaldareraFranceXuxue Feng NEW
Munro FerenczArgentinaOnyama Limba PROPOSAL
Mayumi KolmetzGermanyElwin Sharvill QUALIFIED
Faith GillianCanadaElwin Sharvill RENEWAL
Murillo MaletRussiaOnyama Limba NEW
Morrow RutaItalyIoni Bowcher UNQUALIFIED
Isabel BowleyItalyOnyama Limba QUALIFIED
Salvatore StockhamUnited KingdomXuxue Feng NEW
Adams MorascaAustraliaOnyama Limba NEW
Ivar PaprockiBrazilXuxue Feng NEW
Cody SaylorsFranceIoni Bowcher NEGOTIATION
Murillo MaletFranceBernardo Dominic NEW
Johnson SergiJapanIoni Bowcher RENEWAL
Octavia MaletBrazilOnyama Limba UNQUALIFIED
Octavia MaletRussiaBernardo Dominic PROPOSAL
Mujtaba NickaBrazilAmy Elsner PROPOSAL
Sinclair WaycottUnited KingdomIoni Bowcher UNQUALIFIED
Salvatore StockhamCanadaBernardo Dominic PROPOSAL
Jeanfrancois VenereArgentinaAsiya Javayant RENEWAL
Aditya KuskoFranceAmy Elsner NEW
Jennifer AmigonArgentinaOnyama Limba NEGOTIATION
Isabel BowleyRussiaBernardo Dominic RENEWAL
Tony FollerArgentinaElwin Sharvill RENEWAL
Maisha RulapaughSpainAnna Fali PROPOSAL
Francesco ShinkoUnited KingdomAmy Elsner UNQUALIFIED
Tony FollerFranceAmy Elsner UNQUALIFIED
Juan WieserIndiaXuxue Feng NEGOTIATION
Mujtaba NickaArgentinaAnna Fali NEW
Greenwood BologniaCanadaAsiya Javayant PROPOSAL
Aditya KuskoJapanBernardo Dominic NEGOTIATION
Costa DilliardGermanyOnyama Limba PROPOSAL
Leja CaldareraFranceIvan Magalhaes QUALIFIED
Julie StensethAustraliaAmy Elsner PROPOSAL
Leja CaldareraArgentinaAnna Fali PROPOSAL
Leja CaldareraItalyElwin Sharvill RENEWAL
David DarakjyArgentinaIvan Magalhaes QUALIFIED
Maisha RulapaughUnited KingdomXuxue Feng UNQUALIFIED
Juan WieserGermanyIoni Bowcher NEW
Adams MorascaSpainOnyama Limba NEGOTIATION
Leon OldroydAustraliaElwin Sharvill PROPOSAL
Kaitlin OstroskyAustraliaAmy Elsner QUALIFIED
Murillo MaletRussiaAsiya Javayant NEW
Jeanfrancois VenereItalyStephen Shaw RENEWAL
Deepesh ChuiRussiaIvan Magalhaes UNQUALIFIED
Costa DilliardSpainOnyama Limba NEW
Salvatore StockhamCanadaElwin Sharvill QUALIFIED
Nicolas IturbideGermanyStephen Shaw NEW
Smith GlickGermanyAsiya Javayant NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Wickens NestleAustraliaStephen Shaw QUALIFIED
Morrow RutaSpainXuxue Feng RENEWAL
Darci PoquetteSpainAnna Fali QUALIFIED
Tony FollerItalyBernardo Dominic PROPOSAL
Antonio CaudySpainBernardo Dominic NEW
Munro FerenczGermanyBernardo Dominic NEGOTIATION
Sinclair WaycottJapanBernardo Dominic PROPOSAL
Greenwood BologniaItalyAmy Elsner QUALIFIED
Misaki RoysterBrazilBernardo Dominic NEW
Stacey MacleadArgentinaXuxue Feng QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Isabel BowleyCanada2026-05-20Buckley Miller Wright QUALIFIED49Xuxue Feng
1001Johnson SergiUnited Kingdom2026-06-10Feiner Bros RENEWAL30Stephen Shaw
1002Jones VocelkaSpain2026-05-30Printing Dimensions QUALIFIED85Anna Fali
1003Isabel BowleyBrazil2026-06-02King, Christopher A Esq NEW31Ioni Bowcher
1004Arvin AlbaresJapan2026-05-21King, Christopher A Esq PROPOSAL86Ioni Bowcher
1005Izzy GarufiCanada2026-06-09Morlong Associates PROPOSAL12Onyama Limba
1006Silvio SlusarskiArgentina2026-05-18Feiner Bros UNQUALIFIED73Amy Elsner
1007Johnson SergiIndia2026-05-29Rangoni Of Florence NEGOTIATION1Ivan Magalhaes
1008Silvio SlusarskiSpain2026-06-11Feltz Printing Service QUALIFIED70Stephen Shaw
1009Claire TollnerFrance2026-05-30Chemel, James L Cpa PROPOSAL53Onyama Limba
1010Sinclair WaycottRussia2026-06-01Chanay, Jeffrey A Esq RENEWAL34Ioni Bowcher
1011Juan WieserGermany2026-05-29Commercial Press QUALIFIED29Bernardo Dominic
1012Mayumi KolmetzItaly2026-05-13Commercial Press PROPOSAL43Asiya Javayant
1013Morrow RutaRussia2026-06-03Buckley Miller Wright NEW84Onyama Limba
1014Jennifer AmigonRussia2026-06-04Chemel, James L Cpa QUALIFIED40Xuxue Feng
1015Francesco ShinkoSpain2026-06-09Truhlar And Truhlar Attys RENEWAL21Ioni Bowcher
1016Aruna FigeroaUnited Kingdom2026-05-27Feiner Bros UNQUALIFIED57Anna Fali
1017Aruna FigeroaFrance2026-05-23Rousseaux, Michael Esq PROPOSAL92Xuxue Feng
1018Misaki RoysterItaly2026-06-05Benton, John B Jr PROPOSAL12Asiya Javayant
1019Johnson SergiGermany2026-05-23Chemel, James L Cpa QUALIFIED90Amy Elsner
1020Stacey MacleadCanada2026-06-03Truhlar And Truhlar Attys UNQUALIFIED91Anna Fali
1021Mayumi KolmetzBrazil2026-06-07Morlong Associates UNQUALIFIED59Stephen Shaw
1022Costa DilliardJapan2026-05-28Feiner Bros NEW93Stephen Shaw
1023Jennifer AmigonAustralia2026-05-30Feiner Bros PROPOSAL70Amy Elsner
1024Jefferson SchemmerIndia2026-06-06Rangoni Of Florence RENEWAL62Bernardo Dominic
1025Deepesh ChuiItaly2026-05-31King, Christopher A Esq QUALIFIED23Anna Fali
1026Johnson SergiAustralia2026-05-23Feiner Bros PROPOSAL30Elwin Sharvill
1027Faith GillianAustralia2026-05-22Commercial Press NEGOTIATION35Elwin Sharvill
1028Jefferson SchemmerArgentina2026-05-18Dorl, James J Esq NEGOTIATION32Anna Fali
1029Maisha RulapaughFrance2026-05-16Rousseaux, Michael Esq NEW24Xuxue Feng
1030Deepesh ChuiFrance2026-06-04Chapman, Ross E Esq QUALIFIED90Stephen Shaw
1031Isabel BowleyJapan2026-05-16Truhlar And Truhlar Attys PROPOSAL92Bernardo Dominic
1032Nicolas IturbideIndia2026-06-03Benton, John B Jr NEW3Onyama Limba
1033Misaki RoysterGermany2026-06-07Buckley Miller Wright UNQUALIFIED90Xuxue Feng
1034Aruna FigeroaRussia2026-05-25Chapman, Ross E Esq NEW52Elwin Sharvill
1035Alejandro PerinBrazil2026-05-29Commercial Press UNQUALIFIED10Elwin Sharvill
1036Alejandro PerinArgentina2026-06-06King, Christopher A Esq PROPOSAL23Anna Fali
1037Cody SaylorsItaly2026-06-05Morlong Associates PROPOSAL58Stephen Shaw
1038Nicolas IturbideArgentina2026-06-10Rangoni Of Florence RENEWAL15Ivan Magalhaes
1039Kaitlin OstroskyGermany2026-06-01Rangoni Of Florence QUALIFIED31Anna Fali
1040Ricardo GauchoCanada2026-06-06Feltz Printing Service QUALIFIED52Bernardo Dominic
1041Alejandro PerinBrazil2026-06-04Feltz Printing Service UNQUALIFIED21Amy Elsner
1042Octavia MaletCanada2026-06-09King, Christopher A Esq NEW77Xuxue Feng
1043James ButtIndia2026-05-30King, Christopher A Esq NEW9Ioni Bowcher
1044Rodrigues CampainCanada2026-06-09Benton, John B Jr PROPOSAL44Anna Fali
1045Ashley DoeIndia2026-05-28Rangoni Of Florence NEGOTIATION15Stephen Shaw
1046Clifford RimSpain2026-06-11Buckley Miller Wright NEW57Stephen Shaw
1047Darci PoquetteGermany2026-05-27Rousseaux, Michael Esq UNQUALIFIED86Bernardo Dominic
1048Greenwood BologniaFrance2026-05-29Rangoni Of Florence PROPOSAL56Stephen Shaw
1049Kadeem FlosiGermany2026-05-22Buckley Miller Wright PROPOSAL65Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Claire TollnerGermanyAsiya Javayant PROPOSAL
Antonio CaudyUnited KingdomElwin Sharvill PROPOSAL
Adams MorascaSpainIoni Bowcher NEGOTIATION
Mujtaba NickaArgentinaOnyama Limba QUALIFIED
Francesco ShinkoIndiaAnna Fali UNQUALIFIED
Clifford RimGermanyXuxue Feng PROPOSAL
Sinclair WaycottSpainIoni Bowcher NEGOTIATION
Cody SaylorsSpainOnyama Limba UNQUALIFIED
Isabel BowleySpainElwin Sharvill RENEWAL
Arvin AlbaresUnited KingdomXuxue Feng UNQUALIFIED
Jeanfrancois VenereArgentinaXuxue Feng UNQUALIFIED
Smith GlickRussiaIoni Bowcher NEW
Murillo MaletIndiaStephen Shaw PROPOSAL
Greenwood BologniaBrazilAsiya Javayant QUALIFIED
Darci PoquetteUnited KingdomStephen Shaw QUALIFIED
Antonio CaudyAustraliaElwin Sharvill UNQUALIFIED
Leon OldroydUnited KingdomAnna Fali RENEWAL
Adams MorascaArgentinaAsiya Javayant RENEWAL
Morrow RutaIndiaIoni Bowcher RENEWAL
Greenwood BologniaArgentinaIvan Magalhaes QUALIFIED
Rodrigues CampainUnited KingdomStephen Shaw UNQUALIFIED
Leon OldroydAustraliaAmy Elsner NEGOTIATION
Maisha RulapaughJapanXuxue Feng UNQUALIFIED
Greenwood BologniaIndiaXuxue Feng NEGOTIATION
Morrow RutaCanadaAmy Elsner UNQUALIFIED
Costa DilliardUnited KingdomStephen Shaw NEGOTIATION
Kadeem FlosiBrazilAmy Elsner RENEWAL
Aruna FigeroaIndiaElwin Sharvill NEGOTIATION
David DarakjyIndiaElwin Sharvill QUALIFIED
Alejandro PerinFranceElwin Sharvill PROPOSAL
Stacey MacleadAustraliaIvan Magalhaes NEW
David DarakjyFranceIoni Bowcher NEGOTIATION
Silvio SlusarskiAustraliaIvan Magalhaes QUALIFIED
Silvio SlusarskiCanadaElwin Sharvill UNQUALIFIED
Johnson SergiSpainAmy Elsner NEGOTIATION
Maria MarrierIndiaAmy Elsner QUALIFIED
Misaki RoysterArgentinaAsiya Javayant NEGOTIATION
Ashley DoeGermanyAnna Fali UNQUALIFIED
Deepesh ChuiUnited KingdomIoni Bowcher NEGOTIATION
David DarakjyCanadaAmy Elsner QUALIFIED
Johnson SergiGermanyIoni Bowcher QUALIFIED
Kadeem FlosiRussiaIoni Bowcher RENEWAL
Mujtaba NickaFranceOnyama Limba RENEWAL
Sinclair WaycottItalyAnna Fali NEGOTIATION
Salvatore StockhamIndiaElwin Sharvill NEW
Rodrigues CampainArgentinaStephen Shaw UNQUALIFIED
Wickens NestleArgentinaXuxue Feng QUALIFIED
Smith GlickGermanyElwin Sharvill RENEWAL
Faith GillianUnited KingdomXuxue Feng QUALIFIED
Silvio SlusarskiCanadaXuxue Feng RENEWAL
Frozen Columns
Name
Jefferson Schemmer
Jennifer Amigon
Julie Stenseth
Izzy Garufi
Greenwood Bolognia
Clifford Rim
Alejandro Perin
Nicolas Iturbide
Ashley Doe
Jeanfrancois Venere
Arvin Albares
Jennifer Amigon
Rodrigues Campain
Chavez Briddick
Smith Glick
Maisha Rulapaugh
Aika Inouye
Tony Foller
Clifford Rim
Octavia Malet
Jeanfrancois Venere
Smith Glick
Salvatore Stockham
Silvio Slusarski
Jones Vocelka
Isabel Bowley
Ricardo Gaucho
Claire Tollner
Jeanfrancois Venere
David Darakjy
Arvin Albares
Jones Vocelka
Jennifer Amigon
Murillo Malet
Leja Caldarera
Misaki Royster
Kadeem Flosi
Jefferson Schemmer
Juan Wieser
Kadeem Flosi
Aika Inouye
Jeanfrancois Venere
Kadeem Flosi
Octavia Malet
Kaitlin Ostrosky
Kaitlin Ostrosky
Octavia Malet
Darci Poquette
Cody Saylors
Ivar Paprocki
IdCountryDate
1000Australia2026-05-16
1001Germany2026-06-01
1002Japan2026-05-24
1003Argentina2026-05-15
1004Germany2026-06-04
1005Italy2026-06-07
1006Argentina2026-05-27
1007Brazil2026-05-27
1008Japan2026-05-16
1009Canada2026-05-19
1010France2026-05-13
1011Argentina2026-06-08
1012France2026-05-26
1013India2026-05-24
1014Argentina2026-06-09
1015Russia2026-06-09
1016Brazil2026-05-17
1017Canada2026-06-09
1018Brazil2026-05-19
1019Japan2026-05-13
1020Germany2026-06-10
1021Russia2026-05-17
1022France2026-06-08
1023Brazil2026-05-13
1024Brazil2026-05-23
1025Italy2026-06-01
1026India2026-05-29
1027Australia2026-06-01
1028France2026-05-22
1029France2026-06-03
1030France2026-06-08
1031Canada2026-06-08
1032Argentina2026-05-27
1033Japan2026-06-10
1034France2026-05-22
1035Russia2026-06-05
1036Italy2026-06-03
1037Japan2026-05-20
1038Argentina2026-06-04
1039Japan2026-06-08
1040Japan2026-05-29
1041Germany2026-05-21
1042Russia2026-05-25
1043United Kingdom2026-05-18
1044Canada2026-06-06
1045France2026-06-11
1046Argentina2026-06-06
1047Brazil2026-05-26
1048Spain2026-05-19
1049France2026-06-11

On-Demand Data

NameIdCountryDate
Aruna Figeroa1000Japan2026-06-05
Deepesh Chui1001Spain2026-06-02
Isabel Bowley1002Australia2026-05-25
Aditya Kusko1003India2026-05-16
Octavia Malet1004Japan2026-05-24
Tony Foller1005Russia2026-05-29
Smith Glick1006Brazil2026-05-31
Cody Saylors1007Spain2026-06-01
Rodrigues Campain1008Russia2026-06-07
James Butt1009Japan2026-06-06
Julie Stenseth1010Australia2026-05-30
Jeanfrancois Venere1011United Kingdom2026-06-02
Smith Glick1012Australia2026-06-09
Deepesh Chui1013United Kingdom2026-05-15
Alejandro Perin1014Australia2026-05-27
Kaitlin Ostrosky1015India2026-05-13
Ivar Paprocki1016France2026-05-24
Munro Ferencz1017Australia2026-05-21
Salvatore Stockham1018Canada2026-05-22
Misaki Royster1019Argentina2026-05-28
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
David DarakjyJapanElwin Sharvill QUALIFIED
Mujtaba NickaJapanAnna Fali NEGOTIATION
Stacey MacleadItalyStephen Shaw RENEWAL
Darci PoquetteGermanyAmy Elsner RENEWAL
James ButtAustraliaXuxue Feng RENEWAL
Johnson SergiUnited KingdomAmy Elsner NEW
Deepesh ChuiAustraliaIoni Bowcher RENEWAL
Jennifer AmigonJapanElwin Sharvill QUALIFIED
Morrow RutaUnited KingdomAnna Fali NEGOTIATION
Mayumi KolmetzCanadaAnna Fali NEGOTIATION
Costa DilliardIndiaXuxue Feng UNQUALIFIED
Smith GlickIndiaIvan Magalhaes NEW
Chavez BriddickJapanAmy Elsner QUALIFIED
Mayumi KolmetzFranceAmy Elsner PROPOSAL
Mayumi KolmetzRussiaElwin Sharvill PROPOSAL
Jennifer AmigonBrazilOnyama Limba PROPOSAL
Stacey MacleadSpainXuxue Feng NEW
Morrow RutaGermanyElwin Sharvill RENEWAL
Johnson SergiJapanStephen Shaw NEW
Faith GillianGermanyIvan Magalhaes PROPOSAL
Silvio SlusarskiGermanyAsiya Javayant PROPOSAL
Claire TollnerJapanElwin Sharvill NEGOTIATION
Murillo MaletJapanAmy Elsner UNQUALIFIED
Adams MorascaSpainXuxue Feng UNQUALIFIED
Maria MarrierUnited KingdomXuxue Feng QUALIFIED
Mujtaba NickaFranceAnna Fali PROPOSAL
Salvatore StockhamFranceIoni Bowcher NEGOTIATION
Darci PoquetteAustraliaIvan Magalhaes NEGOTIATION
Octavia MaletBrazilXuxue Feng QUALIFIED
Jennifer AmigonSpainIvan Magalhaes QUALIFIED
Izzy GarufiFranceIvan Magalhaes QUALIFIED
Mayumi KolmetzGermanyIoni Bowcher NEGOTIATION
Mujtaba NickaRussiaElwin Sharvill NEGOTIATION
Izzy GarufiItalyElwin Sharvill UNQUALIFIED
Juan WieserUnited KingdomElwin Sharvill QUALIFIED
Jones VocelkaUnited KingdomBernardo Dominic NEGOTIATION
Kaitlin OstroskyAustraliaElwin Sharvill PROPOSAL
Smith GlickCanadaAnna Fali QUALIFIED
Mayumi KolmetzArgentinaAnna Fali PROPOSAL
Tony FollerCanadaAnna Fali QUALIFIED

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