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
Cody SaylorsUnited KingdomStephen Shaw PROPOSAL
Aika InouyeRussiaXuxue Feng QUALIFIED
Adams MorascaIndiaStephen Shaw QUALIFIED
Smith GlickBrazilOnyama Limba UNQUALIFIED
Wickens NestleFranceStephen Shaw RENEWAL
Salvatore StockhamItalyAnna Fali RENEWAL
Aika InouyeRussiaIvan Magalhaes NEGOTIATION
Sinclair WaycottGermanyAnna Fali NEW
Jones VocelkaArgentinaAnna Fali NEGOTIATION
Murillo MaletGermanyIoni Bowcher UNQUALIFIED
Darci PoquetteJapanBernardo Dominic QUALIFIED
Deepesh ChuiSpainAsiya Javayant NEW
Cody SaylorsJapanIvan Magalhaes NEGOTIATION
Nicolas IturbideGermanyOnyama Limba NEW
Leja CaldareraAustraliaOnyama Limba RENEWAL
Alejandro PerinJapanOnyama Limba UNQUALIFIED
Johnson SergiAustraliaAmy Elsner UNQUALIFIED
Murillo MaletUnited KingdomAsiya Javayant NEW
Mayumi KolmetzRussiaAmy Elsner NEGOTIATION
Murillo MaletItalyOnyama Limba QUALIFIED
Deepesh ChuiBrazilAsiya Javayant RENEWAL
Salvatore StockhamGermanyOnyama Limba PROPOSAL
Julie StensethFranceElwin Sharvill QUALIFIED
Izzy GarufiItalyIoni Bowcher QUALIFIED
Johnson SergiBrazilBernardo Dominic RENEWAL
Salvatore StockhamIndiaBernardo Dominic RENEWAL
Cody SaylorsFranceIoni Bowcher NEGOTIATION
Leja CaldareraArgentinaBernardo Dominic RENEWAL
Leon OldroydUnited KingdomAnna Fali UNQUALIFIED
James ButtAustraliaAnna Fali QUALIFIED
Antonio CaudyArgentinaElwin Sharvill RENEWAL
Aditya KuskoBrazilStephen Shaw PROPOSAL
Aika InouyeArgentinaXuxue Feng PROPOSAL
Aika InouyeArgentinaElwin Sharvill NEGOTIATION
Jefferson SchemmerItalyBernardo Dominic PROPOSAL
Arvin AlbaresFranceElwin Sharvill QUALIFIED
Adams MorascaGermanyIvan Magalhaes UNQUALIFIED
Sinclair WaycottUnited KingdomAsiya Javayant PROPOSAL
James ButtUnited KingdomElwin Sharvill PROPOSAL
Antonio CaudySpainXuxue Feng QUALIFIED
Emily WhobreyGermanyXuxue Feng UNQUALIFIED
Salvatore StockhamAustraliaIoni Bowcher PROPOSAL
Wickens NestleBrazilAsiya Javayant UNQUALIFIED
Leon OldroydSpainOnyama Limba QUALIFIED
Rodrigues CampainRussiaAmy Elsner UNQUALIFIED
Deepesh ChuiFranceAsiya Javayant QUALIFIED
Wickens NestleItalyBernardo Dominic UNQUALIFIED
Greenwood BologniaGermanyAmy Elsner RENEWAL
Juan WieserUnited KingdomIvan Magalhaes RENEWAL
Leon OldroydBrazilAmy Elsner UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Isabel BowleyItalyIvan Magalhaes UNQUALIFIED
Sinclair WaycottFranceBernardo Dominic RENEWAL
Aruna FigeroaAustraliaBernardo Dominic NEW
Maisha RulapaughIndiaAmy Elsner UNQUALIFIED
Mayumi KolmetzIndiaIoni Bowcher NEGOTIATION
Clifford RimJapanIoni Bowcher NEW
David DarakjySpainStephen Shaw QUALIFIED
Octavia MaletCanadaAsiya Javayant QUALIFIED
Aruna FigeroaFranceAsiya Javayant PROPOSAL
Claire TollnerSpainElwin Sharvill NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Ricardo GauchoItaly2026-05-12Benton, John B Jr QUALIFIED92Amy Elsner
1001Octavia MaletRussia2026-05-27Chapman, Ross E Esq QUALIFIED60Onyama Limba
1002Jennifer AmigonJapan2026-05-06King, Christopher A Esq NEGOTIATION66Asiya Javayant
1003Francesco ShinkoArgentina2026-05-18Feiner Bros QUALIFIED43Ivan Magalhaes
1004Leon OldroydUnited Kingdom2026-04-29Benton, John B Jr UNQUALIFIED38Elwin Sharvill
1005Arvin AlbaresRussia2026-05-20Chapman, Ross E Esq PROPOSAL84Stephen Shaw
1006Faith GillianCanada2026-05-02Buckley Miller Wright UNQUALIFIED1Elwin Sharvill
1007Rodrigues CampainIndia2026-05-13Printing Dimensions PROPOSAL9Ioni Bowcher
1008Claire TollnerArgentina2026-05-26Dorl, James J Esq QUALIFIED42Onyama Limba
1009Silvio SlusarskiItaly2026-05-06Truhlar And Truhlar Attys PROPOSAL99Asiya Javayant
1010Adams MorascaArgentina2026-05-23Feltz Printing Service UNQUALIFIED21Ivan Magalhaes
1011Rodrigues CampainJapan2026-05-04Morlong Associates PROPOSAL52Asiya Javayant
1012Faith GillianIndia2026-05-03Rangoni Of Florence NEW6Anna Fali
1013Deepesh ChuiAustralia2026-04-30Buckley Miller Wright UNQUALIFIED60Stephen Shaw
1014Claire TollnerCanada2026-05-03Feiner Bros QUALIFIED66Ivan Magalhaes
1015Julie StensethCanada2026-05-06Dorl, James J Esq PROPOSAL18Onyama Limba
1016Rodrigues CampainAustralia2026-05-07Dorl, James J Esq RENEWAL43Anna Fali
1017Greenwood BologniaSpain2026-05-07Benton, John B Jr QUALIFIED53Ioni Bowcher
1018Octavia MaletCanada2026-05-04Feiner Bros NEGOTIATION94Elwin Sharvill
1019Munro FerenczUnited Kingdom2026-05-15Chapman, Ross E Esq RENEWAL18Asiya Javayant
1020Antonio CaudyArgentina2026-05-02Commercial Press RENEWAL66Xuxue Feng
1021Jennifer AmigonGermany2026-05-27Buckley Miller Wright NEGOTIATION36Ioni Bowcher
1022Jefferson SchemmerIndia2026-05-16Chapman, Ross E Esq RENEWAL21Stephen Shaw
1023Ashley DoeAustralia2026-05-15Chanay, Jeffrey A Esq NEW77Xuxue Feng
1024Jennifer AmigonFrance2026-05-07Morlong Associates QUALIFIED10Bernardo Dominic
1025Antonio CaudyRussia2026-05-27King, Christopher A Esq PROPOSAL97Anna Fali
1026Munro FerenczJapan2026-05-24Feiner Bros UNQUALIFIED6Onyama Limba
1027Kadeem FlosiRussia2026-05-23Benton, John B Jr NEW3Anna Fali
1028Smith GlickAustralia2026-05-21Printing Dimensions QUALIFIED95Ivan Magalhaes
1029Julie StensethSpain2026-05-22Chapman, Ross E Esq NEW20Asiya Javayant
1030Jeanfrancois VenereItaly2026-05-11Benton, John B Jr QUALIFIED84Ivan Magalhaes
1031Mujtaba NickaGermany2026-05-10Printing Dimensions NEW48Asiya Javayant
1032Wickens NestleFrance2026-05-07Printing Dimensions PROPOSAL91Onyama Limba
1033Morrow RutaItaly2026-04-29King, Christopher A Esq UNQUALIFIED30Bernardo Dominic
1034Adams MorascaBrazil2026-05-26Printing Dimensions NEW20Stephen Shaw
1035Cody SaylorsArgentina2026-05-07Benton, John B Jr NEW71Bernardo Dominic
1036Aika InouyeItaly2026-05-25Rangoni Of Florence PROPOSAL59Onyama Limba
1037Costa DilliardBrazil2026-05-22Chemel, James L Cpa PROPOSAL91Anna Fali
1038Claire TollnerJapan2026-05-21Rousseaux, Michael Esq NEGOTIATION66Amy Elsner
1039Aika InouyeItaly2026-05-19Commercial Press NEW76Xuxue Feng
1040Stacey MacleadFrance2026-05-10Feltz Printing Service NEW41Ivan Magalhaes
1041Ashley DoeCanada2026-05-24Chapman, Ross E Esq RENEWAL16Onyama Limba
1042Juan WieserAustralia2026-04-28King, Christopher A Esq UNQUALIFIED96Stephen Shaw
1043Maria MarrierAustralia2026-05-13Chanay, Jeffrey A Esq QUALIFIED58Anna Fali
1044Maisha RulapaughFrance2026-05-21Benton, John B Jr PROPOSAL48Anna Fali
1045Izzy GarufiCanada2026-05-27Benton, John B Jr NEW54Stephen Shaw
1046Jeanfrancois VenereCanada2026-05-07Rangoni Of Florence PROPOSAL88Stephen Shaw
1047Rodrigues CampainIndia2026-05-03Feiner Bros PROPOSAL45Amy Elsner
1048Silvio SlusarskiBrazil2026-05-11Rangoni Of Florence NEW47Stephen Shaw
1049Darci PoquetteArgentina2026-05-22Rousseaux, Michael Esq QUALIFIED18Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Mayumi KolmetzAustraliaAmy Elsner NEGOTIATION
Francesco ShinkoCanadaAnna Fali UNQUALIFIED
Adams MorascaRussiaAnna Fali UNQUALIFIED
Rodrigues CampainUnited KingdomAmy Elsner RENEWAL
Maisha RulapaughArgentinaAnna Fali UNQUALIFIED
Nicolas IturbideRussiaXuxue Feng NEGOTIATION
James ButtBrazilIoni Bowcher UNQUALIFIED
Smith GlickBrazilIoni Bowcher NEGOTIATION
Ricardo GauchoItalyAnna Fali NEGOTIATION
Faith GillianJapanStephen Shaw PROPOSAL
Greenwood BologniaCanadaOnyama Limba NEGOTIATION
Mujtaba NickaSpainAnna Fali NEW
Ricardo GauchoRussiaAsiya Javayant RENEWAL
Aika InouyeFranceOnyama Limba NEGOTIATION
Costa DilliardItalyIoni Bowcher QUALIFIED
Ricardo GauchoBrazilElwin Sharvill UNQUALIFIED
Francesco ShinkoRussiaBernardo Dominic NEGOTIATION
Jones VocelkaItalyIoni Bowcher NEW
Aruna FigeroaArgentinaAmy Elsner UNQUALIFIED
Aditya KuskoUnited KingdomOnyama Limba UNQUALIFIED
Aruna FigeroaIndiaOnyama Limba PROPOSAL
Ricardo GauchoSpainStephen Shaw QUALIFIED
Morrow RutaArgentinaBernardo Dominic NEGOTIATION
Aditya KuskoIndiaAmy Elsner QUALIFIED
Tony FollerJapanAmy Elsner QUALIFIED
Julie StensethAustraliaElwin Sharvill PROPOSAL
Julie StensethAustraliaAsiya Javayant UNQUALIFIED
Murillo MaletFranceAmy Elsner NEW
Ivar PaprockiSpainOnyama Limba UNQUALIFIED
Arvin AlbaresIndiaAsiya Javayant UNQUALIFIED
Francesco ShinkoUnited KingdomElwin Sharvill PROPOSAL
Clifford RimJapanStephen Shaw RENEWAL
Darci PoquetteFranceStephen Shaw UNQUALIFIED
Jones VocelkaItalyElwin Sharvill UNQUALIFIED
Kadeem FlosiJapanAsiya Javayant QUALIFIED
Ricardo GauchoRussiaAsiya Javayant UNQUALIFIED
Ricardo GauchoUnited KingdomAnna Fali PROPOSAL
Aruna FigeroaBrazilElwin Sharvill UNQUALIFIED
Misaki RoysterRussiaAsiya Javayant PROPOSAL
Johnson SergiGermanyStephen Shaw UNQUALIFIED
Clifford RimJapanAmy Elsner NEW
Wickens NestleJapanStephen Shaw NEW
Mujtaba NickaFranceAnna Fali NEW
Deepesh ChuiSpainBernardo Dominic QUALIFIED
Jones VocelkaCanadaStephen Shaw NEW
Alejandro PerinGermanyIoni Bowcher RENEWAL
Tony FollerCanadaElwin Sharvill QUALIFIED
Rodrigues CampainFranceOnyama Limba UNQUALIFIED
Claire TollnerUnited KingdomAnna Fali NEGOTIATION
Jennifer AmigonUnited KingdomOnyama Limba NEGOTIATION
Frozen Columns
Name
Faith Gillian
Clifford Rim
Izzy Garufi
Sinclair Waycott
Ivar Paprocki
Rodrigues Campain
Chavez Briddick
Deepesh Chui
Chavez Briddick
Francesco Shinko
Maisha Rulapaugh
Kaitlin Ostrosky
Antonio Caudy
Deepesh Chui
Leja Caldarera
Chavez Briddick
Wickens Nestle
Jennifer Amigon
Deepesh Chui
Juan Wieser
Greenwood Bolognia
Smith Glick
Antonio Caudy
Francesco Shinko
Ivar Paprocki
Julie Stenseth
James Butt
Faith Gillian
Maisha Rulapaugh
Antonio Caudy
Salvatore Stockham
Rodrigues Campain
Leja Caldarera
Faith Gillian
Murillo Malet
Stacey Maclead
Maria Marrier
Maria Marrier
Johnson Sergi
Ashley Doe
Isabel Bowley
Aika Inouye
Jeanfrancois Venere
Izzy Garufi
James Butt
Deepesh Chui
Kaitlin Ostrosky
Aika Inouye
Jeanfrancois Venere
Stacey Maclead
IdCountryDate
1000France2026-05-12
1001Brazil2026-05-06
1002France2026-05-16
1003Australia2026-04-28
1004France2026-04-28
1005Russia2026-04-30
1006Japan2026-05-22
1007Canada2026-05-11
1008Russia2026-05-21
1009Brazil2026-05-01
1010India2026-05-14
1011Italy2026-04-29
1012Australia2026-05-12
1013Brazil2026-05-21
1014France2026-05-09
1015Argentina2026-05-27
1016Russia2026-04-28
1017Japan2026-05-04
1018Russia2026-05-02
1019France2026-04-29
1020Italy2026-05-05
1021Australia2026-05-02
1022United Kingdom2026-04-30
1023Germany2026-05-09
1024United Kingdom2026-05-01
1025Russia2026-05-01
1026Germany2026-05-20
1027Russia2026-05-08
1028Russia2026-04-30
1029Brazil2026-05-19
1030Japan2026-05-01
1031Italy2026-05-06
1032India2026-05-12
1033Brazil2026-04-30
1034Germany2026-05-11
1035Canada2026-05-20
1036Spain2026-05-27
1037Australia2026-05-03
1038Argentina2026-05-13
1039France2026-05-15
1040Germany2026-05-25
1041India2026-05-11
1042Germany2026-05-08
1043India2026-05-03
1044Germany2026-05-04
1045Germany2026-05-19
1046Australia2026-04-30
1047Germany2026-05-23
1048Germany2026-05-04
1049Australia2026-05-18

On-Demand Data

NameIdCountryDate
Claire Tollner1000Japan2026-05-24
Darci Poquette1001Italy2026-05-10
Ivar Paprocki1002Canada2026-05-15
Ivar Paprocki1003Brazil2026-05-05
Jennifer Amigon1004Australia2026-05-13
Jeanfrancois Venere1005Russia2026-05-09
Cody Saylors1006Australia2026-05-16
Aruna Figeroa1007France2026-05-13
Francesco Shinko1008Japan2026-05-27
Morrow Ruta1009Canada2026-05-15
Rodrigues Campain1010Argentina2026-05-15
Cody Saylors1011Germany2026-05-25
Leon Oldroyd1012Spain2026-05-21
Izzy Garufi1013Brazil2026-05-13
Aika Inouye1014Spain2026-05-21
Jones Vocelka1015Argentina2026-05-03
James Butt1016India2026-05-21
Jeanfrancois Venere1017Russia2026-05-06
Aruna Figeroa1018Argentina2026-05-05
Deepesh Chui1019Australia2026-05-04
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Leon OldroydFranceIoni Bowcher UNQUALIFIED
Salvatore StockhamBrazilAnna Fali QUALIFIED
Octavia MaletAustraliaElwin Sharvill NEW
Jennifer AmigonCanadaOnyama Limba NEW
Clifford RimRussiaIoni Bowcher UNQUALIFIED
Ashley DoeJapanElwin Sharvill NEW
Adams MorascaAustraliaOnyama Limba NEGOTIATION
Cody SaylorsRussiaXuxue Feng UNQUALIFIED
Clifford RimBrazilAmy Elsner RENEWAL
Octavia MaletJapanElwin Sharvill NEW
Cody SaylorsBrazilOnyama Limba QUALIFIED
Izzy GarufiSpainAsiya Javayant UNQUALIFIED
Ricardo GauchoItalyIvan Magalhaes QUALIFIED
Morrow RutaSpainAsiya Javayant QUALIFIED
Emily WhobreyItalyElwin Sharvill NEGOTIATION
Leon OldroydCanadaAsiya Javayant NEGOTIATION
Adams MorascaItalyIoni Bowcher UNQUALIFIED
Juan WieserJapanAmy Elsner NEW
Murillo MaletRussiaIoni Bowcher RENEWAL
Mayumi KolmetzIndiaElwin Sharvill UNQUALIFIED
Mujtaba NickaJapanIvan Magalhaes RENEWAL
Maisha RulapaughFranceOnyama Limba NEGOTIATION
Jones VocelkaSpainAnna Fali RENEWAL
Octavia MaletUnited KingdomIoni Bowcher QUALIFIED
Ivar PaprockiItalyAsiya Javayant NEGOTIATION
Rodrigues CampainRussiaIvan Magalhaes RENEWAL
Jefferson SchemmerItalyOnyama Limba NEW
Kadeem FlosiCanadaXuxue Feng NEGOTIATION
Stacey MacleadIndiaStephen Shaw RENEWAL
Arvin AlbaresRussiaXuxue Feng NEGOTIATION
Ashley DoeAustraliaOnyama Limba NEW
Darci PoquetteSpainOnyama Limba NEGOTIATION
Kaitlin OstroskyUnited KingdomElwin Sharvill NEGOTIATION
Maisha RulapaughUnited KingdomAmy Elsner UNQUALIFIED
Deepesh ChuiUnited KingdomStephen Shaw RENEWAL
Cody SaylorsSpainElwin Sharvill RENEWAL
Leja CaldareraUnited KingdomAsiya Javayant RENEWAL
Maria MarrierSpainOnyama Limba NEGOTIATION
Silvio SlusarskiRussiaAnna Fali NEW
Aruna FigeroaAustraliaAnna 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>