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
Smith GlickSpainElwin Sharvill UNQUALIFIED
Greenwood BologniaJapanIoni Bowcher PROPOSAL
Leon OldroydSpainXuxue Feng NEGOTIATION
Mujtaba NickaArgentinaIvan Magalhaes QUALIFIED
Juan WieserRussiaXuxue Feng PROPOSAL
Munro FerenczAustraliaStephen Shaw PROPOSAL
Aditya KuskoRussiaBernardo Dominic NEW
Sinclair WaycottGermanyAnna Fali RENEWAL
Cody SaylorsArgentinaAmy Elsner UNQUALIFIED
Johnson SergiAustraliaIvan Magalhaes QUALIFIED
Munro FerenczUnited KingdomStephen Shaw NEW
Kadeem FlosiGermanyBernardo Dominic NEW
Antonio CaudyAustraliaXuxue Feng NEW
David DarakjySpainOnyama Limba RENEWAL
Francesco ShinkoUnited KingdomIvan Magalhaes PROPOSAL
David DarakjyItalyOnyama Limba RENEWAL
Munro FerenczUnited KingdomIvan Magalhaes NEW
Smith GlickRussiaXuxue Feng NEGOTIATION
Munro FerenczItalyAnna Fali NEW
Antonio CaudyJapanIoni Bowcher RENEWAL
Costa DilliardFranceAnna Fali UNQUALIFIED
Mayumi KolmetzUnited KingdomIvan Magalhaes RENEWAL
David DarakjyFranceStephen Shaw UNQUALIFIED
Morrow RutaItalyIvan Magalhaes PROPOSAL
Salvatore StockhamIndiaIvan Magalhaes UNQUALIFIED
Munro FerenczRussiaAsiya Javayant UNQUALIFIED
Adams MorascaRussiaXuxue Feng PROPOSAL
Mujtaba NickaSpainAnna Fali NEW
Stacey MacleadAustraliaIoni Bowcher NEW
Jefferson SchemmerSpainOnyama Limba NEGOTIATION
Aditya KuskoIndiaAnna Fali PROPOSAL
Claire TollnerFranceAmy Elsner RENEWAL
Ricardo GauchoAustraliaIoni Bowcher PROPOSAL
Smith GlickArgentinaBernardo Dominic UNQUALIFIED
Sinclair WaycottFranceIoni Bowcher QUALIFIED
Maria MarrierJapanElwin Sharvill NEW
Murillo MaletItalyAnna Fali UNQUALIFIED
Juan WieserJapanAnna Fali PROPOSAL
Johnson SergiUnited KingdomXuxue Feng UNQUALIFIED
Chavez BriddickJapanAsiya Javayant QUALIFIED
Johnson SergiCanadaXuxue Feng RENEWAL
Jefferson SchemmerJapanOnyama Limba NEW
Juan WieserSpainOnyama Limba PROPOSAL
Mujtaba NickaAustraliaIoni Bowcher QUALIFIED
Smith GlickArgentinaIoni Bowcher PROPOSAL
James ButtItalyOnyama Limba PROPOSAL
James ButtAustraliaIvan Magalhaes NEGOTIATION
Maria MarrierAustraliaOnyama Limba PROPOSAL
Deepesh ChuiIndiaIvan Magalhaes RENEWAL
Leon OldroydFranceElwin Sharvill NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Johnson SergiIndiaIoni Bowcher UNQUALIFIED
Aika InouyeItalyStephen Shaw NEW
Sinclair WaycottItalyAsiya Javayant RENEWAL
Jennifer AmigonUnited KingdomAnna Fali NEGOTIATION
Deepesh ChuiIndiaXuxue Feng QUALIFIED
Nicolas IturbideGermanyIoni Bowcher QUALIFIED
Ashley DoeBrazilOnyama Limba NEW
Maisha RulapaughSpainAsiya Javayant UNQUALIFIED
Alejandro PerinFranceXuxue Feng UNQUALIFIED
Costa DilliardSpainIvan Magalhaes PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Ricardo GauchoBrazil2025-06-15Rangoni Of Florence QUALIFIED62Asiya Javayant
1001Greenwood BologniaCanada2025-06-22Benton, John B Jr NEW90Onyama Limba
1002Kadeem FlosiArgentina2025-06-04Benton, John B Jr NEW34Onyama Limba
1003Octavia MaletAustralia2025-06-01Rousseaux, Michael Esq NEW4Bernardo Dominic
1004Aditya KuskoItaly2025-06-12Truhlar And Truhlar Attys PROPOSAL59Xuxue Feng
1005Stacey MacleadIndia2025-06-13King, Christopher A Esq NEGOTIATION48Ivan Magalhaes
1006Jones VocelkaSpain2025-06-24Buckley Miller Wright NEW17Onyama Limba
1007Tony FollerItaly2025-06-18Buckley Miller Wright QUALIFIED30Bernardo Dominic
1008Octavia MaletItaly2025-06-08Feiner Bros RENEWAL8Ivan Magalhaes
1009Izzy GarufiRussia2025-06-08King, Christopher A Esq PROPOSAL66Asiya Javayant
1010Tony FollerUnited Kingdom2025-06-01Chapman, Ross E Esq PROPOSAL60Anna Fali
1011Johnson SergiAustralia2025-06-27Morlong Associates PROPOSAL45Ivan Magalhaes
1012Silvio SlusarskiJapan2025-06-30Feiner Bros RENEWAL79Anna Fali
1013Salvatore StockhamBrazil2025-06-13Chemel, James L Cpa RENEWAL30Bernardo Dominic
1014Leja CaldareraFrance2025-06-22Rousseaux, Michael Esq NEW88Amy Elsner
1015Ashley DoeRussia2025-06-28Feiner Bros PROPOSAL54Amy Elsner
1016Jeanfrancois VenereAustralia2025-06-06Feltz Printing Service PROPOSAL15Ivan Magalhaes
1017Ricardo GauchoGermany2025-06-08Chemel, James L Cpa PROPOSAL21Ivan Magalhaes
1018Leja CaldareraRussia2025-06-13Truhlar And Truhlar Attys PROPOSAL4Onyama Limba
1019Chavez BriddickCanada2025-06-23Chanay, Jeffrey A Esq RENEWAL54Bernardo Dominic
1020Wickens NestleArgentina2025-06-26Buckley Miller Wright NEGOTIATION13Ioni Bowcher
1021Octavia MaletRussia2025-06-11Feiner Bros PROPOSAL65Elwin Sharvill
1022Izzy GarufiUnited Kingdom2025-06-29Chanay, Jeffrey A Esq UNQUALIFIED87Asiya Javayant
1023Cody SaylorsBrazil2025-06-08Chemel, James L Cpa PROPOSAL7Ioni Bowcher
1024Wickens NestleUnited Kingdom2025-06-26King, Christopher A Esq UNQUALIFIED95Xuxue Feng
1025Costa DilliardUnited Kingdom2025-06-24Benton, John B Jr PROPOSAL28Xuxue Feng
1026Cody SaylorsUnited Kingdom2025-06-25Chanay, Jeffrey A Esq RENEWAL72Ioni Bowcher
1027Ivar PaprockiFrance2025-06-15Printing Dimensions NEW77Xuxue Feng
1028Octavia MaletJapan2025-06-06Dorl, James J Esq NEGOTIATION54Elwin Sharvill
1029Leja CaldareraSpain2025-06-05Rangoni Of Florence QUALIFIED33Bernardo Dominic
1030Greenwood BologniaArgentina2025-06-15Rangoni Of Florence PROPOSAL14Xuxue Feng
1031Francesco ShinkoSpain2025-06-06Feiner Bros PROPOSAL43Elwin Sharvill
1032Tony FollerBrazil2025-06-07Chapman, Ross E Esq RENEWAL77Stephen Shaw
1033Stacey MacleadCanada2025-06-14Truhlar And Truhlar Attys RENEWAL20Anna Fali
1034Aruna FigeroaGermany2025-06-09Benton, John B Jr NEW57Xuxue Feng
1035Smith GlickUnited Kingdom2025-06-14Chanay, Jeffrey A Esq PROPOSAL8Ioni Bowcher
1036James ButtUnited Kingdom2025-06-10Commercial Press PROPOSAL53Amy Elsner
1037Claire TollnerCanada2025-06-21Dorl, James J Esq NEW90Elwin Sharvill
1038Cody SaylorsIndia2025-06-04Chanay, Jeffrey A Esq PROPOSAL16Elwin Sharvill
1039Silvio SlusarskiSpain2025-06-22Printing Dimensions PROPOSAL87Elwin Sharvill
1040Morrow RutaAustralia2025-06-05Feltz Printing Service UNQUALIFIED21Stephen Shaw
1041Morrow RutaRussia2025-06-19Dorl, James J Esq UNQUALIFIED30Stephen Shaw
1042Misaki RoysterJapan2025-06-24Chemel, James L Cpa NEW43Ivan Magalhaes
1043Jones VocelkaRussia2025-06-08Chapman, Ross E Esq NEGOTIATION11Bernardo Dominic
1044Mayumi KolmetzJapan2025-06-24Benton, John B Jr PROPOSAL32Asiya Javayant
1045Stacey MacleadUnited Kingdom2025-06-20Chanay, Jeffrey A Esq NEW7Stephen Shaw
1046Izzy GarufiRussia2025-06-01Feiner Bros NEGOTIATION24Asiya Javayant
1047Johnson SergiFrance2025-06-16Chemel, James L Cpa QUALIFIED42Ioni Bowcher
1048Ivar PaprockiJapan2025-06-19Feiner Bros NEW7Asiya Javayant
1049Greenwood BologniaBrazil2025-06-02Benton, John B Jr RENEWAL43Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Sinclair WaycottIndiaAmy Elsner NEW
Julie StensethRussiaXuxue Feng RENEWAL
Izzy GarufiFranceOnyama Limba RENEWAL
Ricardo GauchoUnited KingdomIvan Magalhaes RENEWAL
Leon OldroydFranceAnna Fali NEW
David DarakjyIndiaStephen Shaw PROPOSAL
Murillo MaletItalyStephen Shaw RENEWAL
Ricardo GauchoIndiaAmy Elsner NEW
Francesco ShinkoBrazilStephen Shaw NEGOTIATION
Juan WieserItalyBernardo Dominic NEGOTIATION
Aditya KuskoBrazilBernardo Dominic QUALIFIED
Isabel BowleyUnited KingdomIvan Magalhaes NEGOTIATION
Aruna FigeroaAustraliaBernardo Dominic UNQUALIFIED
Sinclair WaycottFranceElwin Sharvill NEW
Stacey MacleadUnited KingdomIoni Bowcher PROPOSAL
Izzy GarufiUnited KingdomElwin Sharvill QUALIFIED
Rodrigues CampainSpainBernardo Dominic PROPOSAL
Ricardo GauchoAustraliaXuxue Feng RENEWAL
David DarakjyRussiaOnyama Limba NEGOTIATION
Silvio SlusarskiCanadaAmy Elsner QUALIFIED
Morrow RutaGermanyOnyama Limba UNQUALIFIED
Misaki RoysterIndiaAnna Fali UNQUALIFIED
Leon OldroydFranceIoni Bowcher RENEWAL
Wickens NestleGermanyElwin Sharvill RENEWAL
Ivar PaprockiItalyAnna Fali QUALIFIED
Costa DilliardUnited KingdomBernardo Dominic NEW
Octavia MaletCanadaElwin Sharvill NEGOTIATION
Aruna FigeroaArgentinaStephen Shaw PROPOSAL
Smith GlickFranceBernardo Dominic RENEWAL
Alejandro PerinAustraliaOnyama Limba NEW
Chavez BriddickFranceIvan Magalhaes UNQUALIFIED
Aruna FigeroaAustraliaAsiya Javayant UNQUALIFIED
Jones VocelkaGermanyXuxue Feng RENEWAL
Jeanfrancois VenereAustraliaIvan Magalhaes QUALIFIED
Chavez BriddickArgentinaStephen Shaw RENEWAL
Aditya KuskoAustraliaAmy Elsner NEW
Maisha RulapaughUnited KingdomAmy Elsner UNQUALIFIED
James ButtSpainElwin Sharvill NEW
Ivar PaprockiItalyStephen Shaw QUALIFIED
Murillo MaletFranceAnna Fali RENEWAL
Adams MorascaRussiaElwin Sharvill QUALIFIED
Greenwood BologniaAustraliaStephen Shaw NEW
Costa DilliardArgentinaAmy Elsner NEGOTIATION
Octavia MaletCanadaAsiya Javayant UNQUALIFIED
Mayumi KolmetzSpainElwin Sharvill UNQUALIFIED
Sinclair WaycottBrazilOnyama Limba NEGOTIATION
Johnson SergiFranceOnyama Limba UNQUALIFIED
Clifford RimUnited KingdomAsiya Javayant NEGOTIATION
Izzy GarufiBrazilElwin Sharvill QUALIFIED
Claire TollnerIndiaIvan Magalhaes QUALIFIED
Frozen Columns
Name
Jennifer Amigon
Mujtaba Nicka
Jefferson Schemmer
Claire Tollner
Johnson Sergi
Jefferson Schemmer
Cody Saylors
Faith Gillian
James Butt
Jefferson Schemmer
Kaitlin Ostrosky
Ricardo Gaucho
Faith Gillian
Octavia Malet
Salvatore Stockham
Salvatore Stockham
Costa Dilliard
Ashley Doe
Emily Whobrey
Tony Foller
Juan Wieser
Alejandro Perin
Rodrigues Campain
Aditya Kusko
Alejandro Perin
Aruna Figeroa
Julie Stenseth
Mujtaba Nicka
Sinclair Waycott
Mujtaba Nicka
Johnson Sergi
James Butt
Leon Oldroyd
Rodrigues Campain
Aruna Figeroa
Claire Tollner
Emily Whobrey
Octavia Malet
Francesco Shinko
Francesco Shinko
Morrow Ruta
Ricardo Gaucho
Maisha Rulapaugh
Wickens Nestle
Jones Vocelka
Julie Stenseth
Munro Ferencz
Claire Tollner
Jennifer Amigon
Kaitlin Ostrosky
IdCountryDate
1000India2025-06-07
1001Japan2025-06-12
1002Japan2025-06-11
1003India2025-06-28
1004Germany2025-06-29
1005United Kingdom2025-06-13
1006Italy2025-06-14
1007Russia2025-06-20
1008Russia2025-06-02
1009Canada2025-06-28
1010Spain2025-06-25
1011India2025-06-19
1012France2025-06-15
1013Russia2025-06-11
1014Italy2025-06-09
1015United Kingdom2025-06-03
1016Russia2025-06-04
1017United Kingdom2025-06-14
1018Argentina2025-06-06
1019Italy2025-06-05
1020Japan2025-06-15
1021Germany2025-06-17
1022United Kingdom2025-06-15
1023India2025-06-30
1024United Kingdom2025-06-08
1025United Kingdom2025-06-19
1026Argentina2025-06-27
1027Australia2025-06-25
1028Spain2025-06-19
1029Spain2025-06-05
1030Japan2025-06-10
1031Brazil2025-06-03
1032Spain2025-06-09
1033United Kingdom2025-06-26
1034Italy2025-06-17
1035India2025-06-15
1036Brazil2025-06-06
1037France2025-06-16
1038Italy2025-06-18
1039Canada2025-06-09
1040Australia2025-06-29
1041France2025-06-08
1042Brazil2025-06-16
1043Japan2025-06-02
1044India2025-06-04
1045Brazil2025-06-25
1046India2025-06-03
1047Japan2025-06-24
1048Russia2025-06-24
1049Japan2025-06-21

On-Demand Data

NameIdCountryDate
Misaki Royster1000Japan2025-06-27
Aika Inouye1001Italy2025-06-18
Kaitlin Ostrosky1002France2025-06-27
Stacey Maclead1003France2025-06-15
Juan Wieser1004India2025-06-01
Maria Marrier1005Italy2025-06-18
Izzy Garufi1006United Kingdom2025-06-21
Juan Wieser1007India2025-06-15
Murillo Malet1008Russia2025-06-13
Nicolas Iturbide1009Italy2025-06-18
Leon Oldroyd1010India2025-06-17
Aika Inouye1011India2025-06-09
Misaki Royster1012Japan2025-06-18
Leja Caldarera1013United Kingdom2025-06-21
Murillo Malet1014Canada2025-06-02
Adams Morasca1015United Kingdom2025-06-13
Emily Whobrey1016United Kingdom2025-06-14
Aika Inouye1017Spain2025-06-03
Murillo Malet1018India2025-06-19
Faith Gillian1019Argentina2025-06-16
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Costa DilliardUnited KingdomXuxue Feng NEGOTIATION
Juan WieserFranceOnyama Limba NEW
Misaki RoysterAustraliaXuxue Feng NEW
Jones VocelkaSpainXuxue Feng NEW
Clifford RimArgentinaElwin Sharvill UNQUALIFIED
Kadeem FlosiCanadaIvan Magalhaes NEW
Julie StensethItalyXuxue Feng UNQUALIFIED
Costa DilliardRussiaAmy Elsner NEW
Maisha RulapaughAustraliaElwin Sharvill RENEWAL
Jones VocelkaArgentinaBernardo Dominic PROPOSAL
Antonio CaudyGermanyAmy Elsner UNQUALIFIED
Jones VocelkaJapanOnyama Limba NEW
Jennifer AmigonRussiaXuxue Feng UNQUALIFIED
Misaki RoysterCanadaStephen Shaw NEGOTIATION
Clifford RimArgentinaIoni Bowcher NEW
Kadeem FlosiSpainAmy Elsner QUALIFIED
Morrow RutaAustraliaIoni Bowcher QUALIFIED
Clifford RimFranceStephen Shaw NEGOTIATION
Ashley DoeFranceAsiya Javayant NEGOTIATION
Tony FollerArgentinaAmy Elsner PROPOSAL
Sinclair WaycottGermanyXuxue Feng UNQUALIFIED
Aditya KuskoItalyAmy Elsner NEGOTIATION
Aditya KuskoFranceAnna Fali PROPOSAL
Wickens NestleIndiaAmy Elsner NEGOTIATION
Juan WieserUnited KingdomIvan Magalhaes NEW
Antonio CaudyItalyElwin Sharvill UNQUALIFIED
Faith GillianUnited KingdomAsiya Javayant UNQUALIFIED
Mujtaba NickaFranceIvan Magalhaes QUALIFIED
Misaki RoysterSpainIvan Magalhaes NEGOTIATION
Arvin AlbaresJapanIvan Magalhaes NEW
Jennifer AmigonUnited KingdomBernardo Dominic NEGOTIATION
Maria MarrierAustraliaIvan Magalhaes UNQUALIFIED
Alejandro PerinIndiaStephen Shaw PROPOSAL
Maisha RulapaughArgentinaIoni Bowcher PROPOSAL
Emily WhobreyBrazilXuxue Feng PROPOSAL
Nicolas IturbideGermanyBernardo Dominic RENEWAL
Ricardo GauchoCanadaAnna Fali UNQUALIFIED
Mayumi KolmetzIndiaXuxue Feng NEW
Maria MarrierCanadaAsiya Javayant NEGOTIATION
Misaki RoysterJapanAsiya Javayant 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>