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
Misaki RoysterRussiaIoni Bowcher PROPOSAL
Juan WieserGermanyAmy Elsner PROPOSAL
Mayumi KolmetzIndiaAsiya Javayant RENEWAL
Greenwood BologniaArgentinaAsiya Javayant UNQUALIFIED
Francesco ShinkoGermanyAsiya Javayant PROPOSAL
Chavez BriddickGermanyIvan Magalhaes QUALIFIED
Jeanfrancois VenereSpainXuxue Feng PROPOSAL
Maria MarrierIndiaAsiya Javayant NEW
Salvatore StockhamItalyBernardo Dominic UNQUALIFIED
Isabel BowleyBrazilBernardo Dominic QUALIFIED
Adams MorascaItalyAsiya Javayant UNQUALIFIED
Jeanfrancois VenereFranceOnyama Limba RENEWAL
Jefferson SchemmerJapanAsiya Javayant RENEWAL
Johnson SergiUnited KingdomAsiya Javayant UNQUALIFIED
Smith GlickFranceIoni Bowcher NEGOTIATION
Johnson SergiIndiaAsiya Javayant QUALIFIED
Wickens NestleUnited KingdomBernardo Dominic NEGOTIATION
Adams MorascaJapanIvan Magalhaes RENEWAL
Aditya KuskoIndiaElwin Sharvill QUALIFIED
Smith GlickAustraliaIvan Magalhaes UNQUALIFIED
Ricardo GauchoBrazilAsiya Javayant RENEWAL
Aika InouyeUnited KingdomBernardo Dominic NEGOTIATION
Leon OldroydItalyBernardo Dominic QUALIFIED
Wickens NestleSpainAsiya Javayant RENEWAL
Jeanfrancois VenereUnited KingdomAmy Elsner RENEWAL
Faith GillianJapanIvan Magalhaes UNQUALIFIED
Aruna FigeroaSpainAmy Elsner QUALIFIED
Jefferson SchemmerItalyAsiya Javayant PROPOSAL
Ivar PaprockiFranceAsiya Javayant PROPOSAL
Jefferson SchemmerFranceBernardo Dominic PROPOSAL
Maria MarrierFranceAmy Elsner PROPOSAL
Tony FollerCanadaIoni Bowcher PROPOSAL
Izzy GarufiFranceAsiya Javayant PROPOSAL
Jennifer AmigonCanadaOnyama Limba PROPOSAL
Ricardo GauchoItalyXuxue Feng PROPOSAL
Costa DilliardRussiaIvan Magalhaes UNQUALIFIED
Izzy GarufiJapanIoni Bowcher RENEWAL
Claire TollnerRussiaOnyama Limba NEW
Munro FerenczItalyAnna Fali RENEWAL
Izzy GarufiBrazilStephen Shaw QUALIFIED
Aditya KuskoArgentinaXuxue Feng NEW
Francesco ShinkoCanadaAmy Elsner UNQUALIFIED
Nicolas IturbideJapanElwin Sharvill QUALIFIED
Darci PoquetteIndiaIvan Magalhaes UNQUALIFIED
David DarakjyGermanyElwin Sharvill PROPOSAL
Wickens NestleAustraliaAsiya Javayant NEGOTIATION
Antonio CaudyAustraliaAmy Elsner RENEWAL
Sinclair WaycottIndiaElwin Sharvill NEGOTIATION
Izzy GarufiBrazilAmy Elsner RENEWAL
Leon OldroydCanadaOnyama Limba PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Chavez BriddickGermanyAnna Fali PROPOSAL
Arvin AlbaresIndiaAsiya Javayant UNQUALIFIED
Mayumi KolmetzRussiaOnyama Limba RENEWAL
Claire TollnerJapanAsiya Javayant RENEWAL
Rodrigues CampainAustraliaAnna Fali UNQUALIFIED
Francesco ShinkoRussiaIoni Bowcher RENEWAL
Claire TollnerAustraliaStephen Shaw PROPOSAL
Octavia MaletArgentinaIvan Magalhaes RENEWAL
Alejandro PerinCanadaElwin Sharvill NEW
Costa DilliardAustraliaBernardo Dominic NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Rodrigues CampainArgentina2026-04-23Rousseaux, Michael Esq UNQUALIFIED61Onyama Limba
1001Costa DilliardAustralia2026-04-26Chanay, Jeffrey A Esq NEW0Xuxue Feng
1002Jeanfrancois VenereFrance2026-05-10Feltz Printing Service PROPOSAL50Ivan Magalhaes
1003Izzy GarufiFrance2026-05-08King, Christopher A Esq RENEWAL50Asiya Javayant
1004Leon OldroydItaly2026-05-10Dorl, James J Esq NEGOTIATION71Xuxue Feng
1005Juan WieserRussia2026-05-14Commercial Press PROPOSAL58Xuxue Feng
1006Misaki RoysterArgentina2026-05-09Feiner Bros PROPOSAL15Asiya Javayant
1007Francesco ShinkoAustralia2026-05-19Printing Dimensions PROPOSAL50Xuxue Feng
1008Francesco ShinkoAustralia2026-04-28Printing Dimensions NEW83Ioni Bowcher
1009Juan WieserBrazil2026-05-05Feiner Bros NEW31Stephen Shaw
1010Nicolas IturbideRussia2026-05-06Truhlar And Truhlar Attys PROPOSAL70Stephen Shaw
1011Jones VocelkaAustralia2026-04-22Chapman, Ross E Esq UNQUALIFIED50Bernardo Dominic
1012Mayumi KolmetzFrance2026-04-28King, Christopher A Esq NEW97Ivan Magalhaes
1013Ivar PaprockiBrazil2026-05-14Rangoni Of Florence NEW2Ivan Magalhaes
1014Adams MorascaIndia2026-05-17Feltz Printing Service PROPOSAL80Elwin Sharvill
1015Jones VocelkaCanada2026-05-12Benton, John B Jr UNQUALIFIED9Amy Elsner
1016Aruna FigeroaAustralia2026-05-17Rangoni Of Florence UNQUALIFIED8Anna Fali
1017Aditya KuskoFrance2026-05-20Feltz Printing Service NEW58Stephen Shaw
1018Rodrigues CampainItaly2026-04-29Rousseaux, Michael Esq NEW72Anna Fali
1019Antonio CaudyBrazil2026-05-13Buckley Miller Wright QUALIFIED36Bernardo Dominic
1020Darci PoquetteJapan2026-05-04Morlong Associates PROPOSAL54Xuxue Feng
1021Leja CaldareraJapan2026-05-04Printing Dimensions NEGOTIATION6Bernardo Dominic
1022Mayumi KolmetzRussia2026-05-15Chanay, Jeffrey A Esq NEGOTIATION7Amy Elsner
1023Wickens NestleIndia2026-05-15Feltz Printing Service NEGOTIATION72Bernardo Dominic
1024Smith GlickBrazil2026-04-30Commercial Press QUALIFIED13Asiya Javayant
1025Ricardo GauchoRussia2026-04-24Feltz Printing Service NEW54Anna Fali
1026Jennifer AmigonBrazil2026-05-14Rangoni Of Florence NEGOTIATION50Asiya Javayant
1027Jones VocelkaCanada2026-04-29Dorl, James J Esq RENEWAL1Xuxue Feng
1028Isabel BowleyJapan2026-05-05Buckley Miller Wright UNQUALIFIED49Anna Fali
1029Costa DilliardJapan2026-05-02Dorl, James J Esq NEGOTIATION72Asiya Javayant
1030Jones VocelkaUnited Kingdom2026-05-12Chanay, Jeffrey A Esq RENEWAL60Ivan Magalhaes
1031Darci PoquetteUnited Kingdom2026-05-09Truhlar And Truhlar Attys RENEWAL66Xuxue Feng
1032Greenwood BologniaArgentina2026-05-14Printing Dimensions PROPOSAL11Ivan Magalhaes
1033Tony FollerBrazil2026-04-28Benton, John B Jr QUALIFIED48Ioni Bowcher
1034Adams MorascaIndia2026-05-08Feiner Bros PROPOSAL82Anna Fali
1035Claire TollnerJapan2026-05-08Chapman, Ross E Esq PROPOSAL38Onyama Limba
1036Deepesh ChuiRussia2026-05-09Commercial Press NEGOTIATION7Bernardo Dominic
1037Octavia MaletUnited Kingdom2026-05-10Commercial Press RENEWAL77Bernardo Dominic
1038Juan WieserJapan2026-05-19Commercial Press UNQUALIFIED57Bernardo Dominic
1039David DarakjyFrance2026-05-06Feltz Printing Service NEGOTIATION38Onyama Limba
1040Francesco ShinkoGermany2026-05-01Feiner Bros NEGOTIATION55Ioni Bowcher
1041Sinclair WaycottIndia2026-04-21Printing Dimensions RENEWAL61Ivan Magalhaes
1042Morrow RutaCanada2026-04-26King, Christopher A Esq NEGOTIATION78Amy Elsner
1043Johnson SergiSpain2026-05-02Printing Dimensions NEW63Stephen Shaw
1044Morrow RutaJapan2026-04-29Printing Dimensions QUALIFIED92Amy Elsner
1045Francesco ShinkoUnited Kingdom2026-05-01Morlong Associates NEGOTIATION64Onyama Limba
1046Deepesh ChuiAustralia2026-05-15Commercial Press NEGOTIATION95Ioni Bowcher
1047Kadeem FlosiGermany2026-05-09Morlong Associates QUALIFIED37Bernardo Dominic
1048Cody SaylorsItaly2026-04-25Benton, John B Jr RENEWAL16Ioni Bowcher
1049Jones VocelkaJapan2026-05-17Feltz Printing Service RENEWAL72Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Mujtaba NickaItalyBernardo Dominic NEW
Francesco ShinkoRussiaXuxue Feng QUALIFIED
Clifford RimGermanyXuxue Feng NEGOTIATION
Isabel BowleyFranceAnna Fali PROPOSAL
Juan WieserItalyElwin Sharvill UNQUALIFIED
Murillo MaletFranceXuxue Feng RENEWAL
Chavez BriddickUnited KingdomElwin Sharvill QUALIFIED
Arvin AlbaresBrazilOnyama Limba QUALIFIED
Alejandro PerinGermanyAsiya Javayant UNQUALIFIED
Antonio CaudyCanadaIvan Magalhaes NEW
Mujtaba NickaUnited KingdomOnyama Limba PROPOSAL
Adams MorascaUnited KingdomXuxue Feng NEW
Greenwood BologniaBrazilAmy Elsner NEW
Francesco ShinkoAustraliaOnyama Limba NEGOTIATION
Faith GillianItalyIoni Bowcher UNQUALIFIED
Isabel BowleyUnited KingdomIvan Magalhaes NEGOTIATION
Ivar PaprockiCanadaElwin Sharvill NEW
Ashley DoeGermanyIoni Bowcher UNQUALIFIED
Arvin AlbaresIndiaAsiya Javayant PROPOSAL
Costa DilliardItalyIvan Magalhaes QUALIFIED
Deepesh ChuiArgentinaElwin Sharvill UNQUALIFIED
Deepesh ChuiAustraliaElwin Sharvill QUALIFIED
Jones VocelkaBrazilElwin Sharvill QUALIFIED
Leja CaldareraUnited KingdomIoni Bowcher PROPOSAL
Ivar PaprockiGermanyIvan Magalhaes PROPOSAL
Salvatore StockhamJapanIoni Bowcher RENEWAL
Johnson SergiJapanIvan Magalhaes PROPOSAL
Aditya KuskoJapanStephen Shaw UNQUALIFIED
Ivar PaprockiIndiaAsiya Javayant UNQUALIFIED
Misaki RoysterRussiaStephen Shaw PROPOSAL
Deepesh ChuiUnited KingdomIvan Magalhaes NEW
Murillo MaletSpainIvan Magalhaes UNQUALIFIED
Maria MarrierCanadaAmy Elsner NEW
Faith GillianRussiaBernardo Dominic NEW
Munro FerenczItalyAmy Elsner QUALIFIED
Jones VocelkaArgentinaIvan Magalhaes NEGOTIATION
Clifford RimFranceElwin Sharvill NEGOTIATION
Francesco ShinkoIndiaStephen Shaw PROPOSAL
David DarakjyRussiaXuxue Feng NEGOTIATION
Tony FollerSpainOnyama Limba PROPOSAL
Kaitlin OstroskyIndiaStephen Shaw PROPOSAL
David DarakjyBrazilBernardo Dominic PROPOSAL
Jennifer AmigonJapanStephen Shaw NEW
Kaitlin OstroskyUnited KingdomIoni Bowcher NEW
Faith GillianJapanOnyama Limba RENEWAL
Kadeem FlosiBrazilAmy Elsner RENEWAL
Greenwood BologniaCanadaStephen Shaw QUALIFIED
Deepesh ChuiRussiaAnna Fali PROPOSAL
Aruna FigeroaIndiaIvan Magalhaes PROPOSAL
Silvio SlusarskiUnited KingdomAnna Fali NEW
Frozen Columns
Name
Morrow Ruta
Faith Gillian
Nicolas Iturbide
Faith Gillian
Adams Morasca
Claire Tollner
Julie Stenseth
Jennifer Amigon
Darci Poquette
James Butt
Kaitlin Ostrosky
Cody Saylors
Morrow Ruta
Clifford Rim
Salvatore Stockham
Darci Poquette
Tony Foller
Emily Whobrey
Kadeem Flosi
Claire Tollner
Deepesh Chui
Morrow Ruta
Murillo Malet
Faith Gillian
Darci Poquette
Izzy Garufi
David Darakjy
Jones Vocelka
Deepesh Chui
Mayumi Kolmetz
Francesco Shinko
Rodrigues Campain
Ivar Paprocki
Leja Caldarera
Maria Marrier
Ivar Paprocki
Izzy Garufi
Julie Stenseth
Antonio Caudy
Jefferson Schemmer
Aditya Kusko
Kadeem Flosi
Costa Dilliard
Rodrigues Campain
Aditya Kusko
Ashley Doe
Darci Poquette
Mujtaba Nicka
Greenwood Bolognia
Jefferson Schemmer
IdCountryDate
1000Italy2026-05-17
1001United Kingdom2026-04-24
1002Italy2026-05-11
1003United Kingdom2026-05-11
1004India2026-05-16
1005Brazil2026-05-15
1006India2026-04-27
1007Argentina2026-05-11
1008Argentina2026-04-30
1009Italy2026-05-06
1010Brazil2026-05-05
1011Brazil2026-05-09
1012Italy2026-04-25
1013Japan2026-04-28
1014Canada2026-05-17
1015Brazil2026-05-13
1016Spain2026-04-26
1017Spain2026-05-10
1018Spain2026-05-01
1019Italy2026-05-01
1020India2026-05-16
1021India2026-05-08
1022India2026-05-09
1023Japan2026-04-23
1024United Kingdom2026-05-08
1025Canada2026-05-03
1026Argentina2026-04-25
1027India2026-05-15
1028Canada2026-05-14
1029Brazil2026-05-06
1030Australia2026-05-06
1031France2026-05-16
1032Argentina2026-04-25
1033Russia2026-04-30
1034France2026-04-22
1035Spain2026-05-16
1036Germany2026-05-16
1037Russia2026-04-26
1038France2026-04-25
1039Brazil2026-04-21
1040Argentina2026-05-05
1041France2026-04-28
1042Australia2026-04-29
1043Spain2026-04-21
1044Italy2026-04-26
1045Brazil2026-05-03
1046Brazil2026-05-08
1047Brazil2026-05-08
1048Italy2026-05-13
1049India2026-04-30

On-Demand Data

NameIdCountryDate
Alejandro Perin1000India2026-05-20
Claire Tollner1001Japan2026-05-20
Adams Morasca1002Japan2026-05-18
Deepesh Chui1003France2026-05-16
Emily Whobrey1004France2026-04-22
Salvatore Stockham1005Germany2026-05-20
Ricardo Gaucho1006France2026-04-24
Stacey Maclead1007Argentina2026-05-09
Ivar Paprocki1008Brazil2026-04-28
Jennifer Amigon1009Spain2026-05-07
Murillo Malet1010Australia2026-05-04
Salvatore Stockham1011Brazil2026-05-02
Ricardo Gaucho1012Australia2026-05-20
Julie Stenseth1013Germany2026-05-04
Johnson Sergi1014Argentina2026-05-13
Kaitlin Ostrosky1015United Kingdom2026-05-10
Aditya Kusko1016Germany2026-05-17
Tony Foller1017Brazil2026-05-04
Morrow Ruta1018Italy2026-05-19
Emily Whobrey1019Italy2026-05-09
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Johnson SergiGermanyAsiya Javayant QUALIFIED
Arvin AlbaresIndiaOnyama Limba NEGOTIATION
Sinclair WaycottIndiaXuxue Feng PROPOSAL
Aruna FigeroaCanadaAmy Elsner QUALIFIED
Clifford RimBrazilAmy Elsner NEGOTIATION
Jones VocelkaUnited KingdomIoni Bowcher PROPOSAL
Maisha RulapaughJapanXuxue Feng NEW
Clifford RimFranceIoni Bowcher NEW
Aditya KuskoCanadaOnyama Limba NEGOTIATION
Johnson SergiArgentinaElwin Sharvill PROPOSAL
Morrow RutaGermanyStephen Shaw RENEWAL
Adams MorascaRussiaOnyama Limba RENEWAL
Ivar PaprockiUnited KingdomElwin Sharvill NEW
Claire TollnerSpainStephen Shaw UNQUALIFIED
Nicolas IturbideGermanyXuxue Feng NEW
Kadeem FlosiBrazilXuxue Feng QUALIFIED
Aditya KuskoAustraliaOnyama Limba RENEWAL
Aika InouyeUnited KingdomOnyama Limba UNQUALIFIED
Ashley DoeUnited KingdomAsiya Javayant NEGOTIATION
Clifford RimGermanyAsiya Javayant RENEWAL
Jennifer AmigonBrazilAsiya Javayant NEW
Jennifer AmigonItalyAmy Elsner PROPOSAL
Darci PoquetteUnited KingdomOnyama Limba QUALIFIED
Clifford RimItalyIvan Magalhaes UNQUALIFIED
Octavia MaletRussiaAnna Fali QUALIFIED
Julie StensethAustraliaAmy Elsner UNQUALIFIED
Morrow RutaBrazilXuxue Feng RENEWAL
Isabel BowleyUnited KingdomAsiya Javayant UNQUALIFIED
Mujtaba NickaJapanAsiya Javayant NEW
Clifford RimArgentinaOnyama Limba UNQUALIFIED
Claire TollnerIndiaIoni Bowcher QUALIFIED
Maisha RulapaughArgentinaStephen Shaw PROPOSAL
David DarakjyRussiaAmy Elsner NEGOTIATION
Mayumi KolmetzIndiaIvan Magalhaes UNQUALIFIED
Izzy GarufiBrazilXuxue Feng NEW
Mujtaba NickaIndiaAsiya Javayant NEW
Jefferson SchemmerJapanOnyama Limba NEW
Octavia MaletAustraliaAmy Elsner RENEWAL
Maisha RulapaughItalyStephen Shaw NEW
Misaki RoysterFranceStephen Shaw 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>