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
Maria MarrierCanadaBernardo Dominic QUALIFIED
Sinclair WaycottRussiaStephen Shaw PROPOSAL
Aditya KuskoItalyAmy Elsner QUALIFIED
Arvin AlbaresRussiaIvan Magalhaes PROPOSAL
Maisha RulapaughSpainAmy Elsner PROPOSAL
Misaki RoysterSpainAnna Fali QUALIFIED
Aruna FigeroaUnited KingdomIoni Bowcher PROPOSAL
Tony FollerIndiaBernardo Dominic NEGOTIATION
Greenwood BologniaCanadaIoni Bowcher RENEWAL
Aika InouyeCanadaAnna Fali NEW
Mayumi KolmetzFranceElwin Sharvill RENEWAL
Francesco ShinkoSpainStephen Shaw UNQUALIFIED
Juan WieserIndiaStephen Shaw RENEWAL
Darci PoquetteCanadaElwin Sharvill NEGOTIATION
Ivar PaprockiUnited KingdomBernardo Dominic UNQUALIFIED
Aruna FigeroaSpainXuxue Feng PROPOSAL
Aditya KuskoFranceIvan Magalhaes QUALIFIED
Silvio SlusarskiCanadaStephen Shaw UNQUALIFIED
James ButtSpainElwin Sharvill NEW
Silvio SlusarskiSpainBernardo Dominic NEGOTIATION
Jeanfrancois VenereBrazilAmy Elsner RENEWAL
Kaitlin OstroskyRussiaStephen Shaw UNQUALIFIED
Jones VocelkaBrazilAsiya Javayant NEGOTIATION
Faith GillianIndiaXuxue Feng UNQUALIFIED
Kadeem FlosiRussiaBernardo Dominic QUALIFIED
Leja CaldareraFranceXuxue Feng QUALIFIED
Mujtaba NickaSpainAmy Elsner UNQUALIFIED
Stacey MacleadIndiaOnyama Limba NEGOTIATION
Aika InouyeBrazilOnyama Limba PROPOSAL
Tony FollerSpainAsiya Javayant NEW
Aruna FigeroaFranceIoni Bowcher QUALIFIED
Leon OldroydSpainElwin Sharvill PROPOSAL
Aditya KuskoItalyBernardo Dominic NEGOTIATION
Mayumi KolmetzGermanyIvan Magalhaes QUALIFIED
Silvio SlusarskiGermanyIvan Magalhaes PROPOSAL
Kaitlin OstroskyGermanyOnyama Limba NEGOTIATION
Greenwood BologniaItalyOnyama Limba NEGOTIATION
Kadeem FlosiAustraliaAsiya Javayant QUALIFIED
Silvio SlusarskiRussiaIoni Bowcher UNQUALIFIED
Izzy GarufiGermanyBernardo Dominic UNQUALIFIED
Maria MarrierUnited KingdomXuxue Feng PROPOSAL
Misaki RoysterArgentinaBernardo Dominic PROPOSAL
Francesco ShinkoBrazilXuxue Feng NEGOTIATION
Deepesh ChuiBrazilOnyama Limba NEW
Adams MorascaIndiaAsiya Javayant QUALIFIED
Antonio CaudyArgentinaXuxue Feng NEW
Isabel BowleyUnited KingdomOnyama Limba PROPOSAL
Jefferson SchemmerCanadaAnna Fali NEW
Izzy GarufiGermanyXuxue Feng UNQUALIFIED
Julie StensethItalyElwin Sharvill RENEWAL
Horizontal
NameCountryRepresentativeStatus
Francesco ShinkoJapanXuxue Feng UNQUALIFIED
Aika InouyeRussiaXuxue Feng PROPOSAL
James ButtGermanyElwin Sharvill QUALIFIED
Alejandro PerinUnited KingdomOnyama Limba UNQUALIFIED
Juan WieserSpainAmy Elsner NEW
Jefferson SchemmerIndiaAnna Fali QUALIFIED
Octavia MaletUnited KingdomAmy Elsner RENEWAL
Aika InouyeFranceXuxue Feng NEGOTIATION
Jefferson SchemmerRussiaAnna Fali QUALIFIED
Tony FollerJapanAsiya Javayant NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Wickens NestleItaly2026-04-19Rousseaux, Michael Esq NEGOTIATION15Onyama Limba
1001Cody SaylorsCanada2026-05-03Chanay, Jeffrey A Esq RENEWAL58Ivan Magalhaes
1002Aika InouyeIndia2026-05-06Truhlar And Truhlar Attys NEW2Ivan Magalhaes
1003Aika InouyeArgentina2026-05-02Chapman, Ross E Esq NEW27Onyama Limba
1004Johnson SergiJapan2026-04-22Morlong Associates PROPOSAL60Amy Elsner
1005Jefferson SchemmerIndia2026-05-09Dorl, James J Esq PROPOSAL92Anna Fali
1006Julie StensethBrazil2026-05-09Chemel, James L Cpa NEW94Amy Elsner
1007Stacey MacleadAustralia2026-04-22Chanay, Jeffrey A Esq NEGOTIATION74Stephen Shaw
1008Ivar PaprockiGermany2026-04-24Printing Dimensions NEGOTIATION81Elwin Sharvill
1009Johnson SergiCanada2026-05-10Chemel, James L Cpa QUALIFIED36Amy Elsner
1010Jennifer AmigonArgentina2026-04-19Morlong Associates NEGOTIATION19Stephen Shaw
1011David DarakjyJapan2026-05-14Dorl, James J Esq UNQUALIFIED45Xuxue Feng
1012Jeanfrancois VenereIndia2026-04-18Printing Dimensions QUALIFIED84Asiya Javayant
1013Greenwood BologniaCanada2026-05-10Printing Dimensions NEGOTIATION16Bernardo Dominic
1014Tony FollerItaly2026-04-26Feiner Bros NEW64Stephen Shaw
1015Wickens NestleUnited Kingdom2026-04-30King, Christopher A Esq NEGOTIATION82Xuxue Feng
1016Darci PoquetteFrance2026-04-29Chapman, Ross E Esq UNQUALIFIED54Ioni Bowcher
1017David DarakjyArgentina2026-04-23Dorl, James J Esq UNQUALIFIED66Asiya Javayant
1018Jeanfrancois VenereRussia2026-04-17Chanay, Jeffrey A Esq RENEWAL60Bernardo Dominic
1019Antonio CaudyItaly2026-05-03Feltz Printing Service RENEWAL37Bernardo Dominic
1020Rodrigues CampainJapan2026-05-02Truhlar And Truhlar Attys UNQUALIFIED75Ivan Magalhaes
1021Mayumi KolmetzFrance2026-04-20Printing Dimensions NEW47Amy Elsner
1022David DarakjyRussia2026-04-19Feiner Bros PROPOSAL30Amy Elsner
1023Julie StensethJapan2026-04-15Rangoni Of Florence QUALIFIED80Amy Elsner
1024Wickens NestleCanada2026-05-10Chapman, Ross E Esq NEGOTIATION20Ioni Bowcher
1025Arvin AlbaresGermany2026-05-12Commercial Press PROPOSAL35Bernardo Dominic
1026Morrow RutaItaly2026-04-18Benton, John B Jr NEGOTIATION38Asiya Javayant
1027Ashley DoeCanada2026-05-07Rangoni Of Florence QUALIFIED37Ivan Magalhaes
1028Murillo MaletItaly2026-04-20Benton, John B Jr QUALIFIED9Onyama Limba
1029Rodrigues CampainUnited Kingdom2026-05-04King, Christopher A Esq NEGOTIATION30Ivan Magalhaes
1030Ricardo GauchoRussia2026-05-08Chemel, James L Cpa UNQUALIFIED11Xuxue Feng
1031Antonio CaudyRussia2026-04-18Truhlar And Truhlar Attys UNQUALIFIED25Anna Fali
1032Julie StensethJapan2026-04-26King, Christopher A Esq PROPOSAL74Anna Fali
1033Murillo MaletFrance2026-05-14Commercial Press QUALIFIED18Stephen Shaw
1034Kadeem FlosiBrazil2026-04-21Printing Dimensions NEW63Asiya Javayant
1035Jeanfrancois VenereFrance2026-05-14Rangoni Of Florence QUALIFIED0Anna Fali
1036Adams MorascaArgentina2026-05-08Benton, John B Jr NEGOTIATION18Asiya Javayant
1037Silvio SlusarskiBrazil2026-05-03Rousseaux, Michael Esq NEW0Amy Elsner
1038Faith GillianItaly2026-05-03Dorl, James J Esq PROPOSAL11Anna Fali
1039Deepesh ChuiBrazil2026-05-01Chapman, Ross E Esq QUALIFIED51Ioni Bowcher
1040Mujtaba NickaGermany2026-04-20Truhlar And Truhlar Attys UNQUALIFIED63Ioni Bowcher
1041Morrow RutaUnited Kingdom2026-04-24Morlong Associates RENEWAL34Anna Fali
1042Maisha RulapaughSpain2026-05-11Rousseaux, Michael Esq QUALIFIED84Amy Elsner
1043Jones VocelkaJapan2026-04-15Rangoni Of Florence UNQUALIFIED22Amy Elsner
1044Clifford RimRussia2026-05-05Rousseaux, Michael Esq RENEWAL31Stephen Shaw
1045Mujtaba NickaItaly2026-04-24Chemel, James L Cpa QUALIFIED55Anna Fali
1046Murillo MaletBrazil2026-04-27Commercial Press QUALIFIED36Xuxue Feng
1047Nicolas IturbideArgentina2026-04-26Feltz Printing Service NEW65Bernardo Dominic
1048Alejandro PerinUnited Kingdom2026-04-28Chapman, Ross E Esq NEGOTIATION8Bernardo Dominic
1049Isabel BowleyArgentina2026-04-24Rousseaux, Michael Esq NEW78Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Ashley DoeBrazilIoni Bowcher RENEWAL
Silvio SlusarskiFranceAmy Elsner QUALIFIED
Tony FollerUnited KingdomIoni Bowcher RENEWAL
Sinclair WaycottRussiaOnyama Limba NEGOTIATION
Mayumi KolmetzAustraliaOnyama Limba NEGOTIATION
Mayumi KolmetzCanadaAmy Elsner NEW
Darci PoquetteSpainBernardo Dominic NEGOTIATION
Claire TollnerIndiaAnna Fali PROPOSAL
Octavia MaletRussiaAmy Elsner QUALIFIED
Maria MarrierJapanXuxue Feng QUALIFIED
Stacey MacleadGermanyAnna Fali UNQUALIFIED
Leja CaldareraRussiaIvan Magalhaes RENEWAL
Deepesh ChuiSpainBernardo Dominic RENEWAL
Deepesh ChuiArgentinaIvan Magalhaes UNQUALIFIED
Murillo MaletBrazilBernardo Dominic UNQUALIFIED
Isabel BowleyGermanyAnna Fali NEW
Aditya KuskoIndiaOnyama Limba NEW
Arvin AlbaresGermanyBernardo Dominic RENEWAL
Emily WhobreyFranceAsiya Javayant RENEWAL
Kaitlin OstroskyJapanAnna Fali QUALIFIED
Alejandro PerinAustraliaElwin Sharvill NEGOTIATION
Ivar PaprockiGermanyIvan Magalhaes UNQUALIFIED
Izzy GarufiSpainAnna Fali UNQUALIFIED
Claire TollnerBrazilXuxue Feng RENEWAL
Emily WhobreyIndiaIvan Magalhaes PROPOSAL
Emily WhobreyAustraliaAmy Elsner NEW
Murillo MaletJapanXuxue Feng QUALIFIED
James ButtUnited KingdomXuxue Feng UNQUALIFIED
Emily WhobreySpainStephen Shaw NEGOTIATION
Ivar PaprockiIndiaIoni Bowcher NEGOTIATION
Clifford RimJapanAsiya Javayant UNQUALIFIED
Maria MarrierFranceOnyama Limba NEGOTIATION
Nicolas IturbideAustraliaStephen Shaw PROPOSAL
Adams MorascaCanadaAsiya Javayant NEW
Leja CaldareraFranceElwin Sharvill PROPOSAL
Greenwood BologniaRussiaAnna Fali UNQUALIFIED
Francesco ShinkoFranceAmy Elsner PROPOSAL
Isabel BowleyGermanyXuxue Feng NEW
Kaitlin OstroskyBrazilAmy Elsner RENEWAL
Aditya KuskoFranceIoni Bowcher NEW
Rodrigues CampainItalyElwin Sharvill RENEWAL
Munro FerenczAustraliaAnna Fali PROPOSAL
Costa DilliardFranceOnyama Limba PROPOSAL
Faith GillianItalyIvan Magalhaes NEW
Francesco ShinkoJapanBernardo Dominic NEW
Aruna FigeroaJapanAsiya Javayant PROPOSAL
Faith GillianCanadaOnyama Limba QUALIFIED
Jennifer AmigonCanadaIvan Magalhaes NEGOTIATION
Mujtaba NickaCanadaAmy Elsner PROPOSAL
Mayumi KolmetzUnited KingdomOnyama Limba PROPOSAL
Frozen Columns
Name
Chavez Briddick
Kaitlin Ostrosky
Izzy Garufi
Tony Foller
Silvio Slusarski
Rodrigues Campain
Claire Tollner
Jones Vocelka
Maisha Rulapaugh
Aditya Kusko
Maria Marrier
Clifford Rim
Maria Marrier
Claire Tollner
Leon Oldroyd
Leon Oldroyd
Maria Marrier
Claire Tollner
Antonio Caudy
Ricardo Gaucho
Isabel Bowley
Jennifer Amigon
Jennifer Amigon
Nicolas Iturbide
Silvio Slusarski
Johnson Sergi
Aika Inouye
Silvio Slusarski
Silvio Slusarski
Isabel Bowley
Jefferson Schemmer
Arvin Albares
Nicolas Iturbide
Faith Gillian
Stacey Maclead
Greenwood Bolognia
Maria Marrier
Misaki Royster
Silvio Slusarski
Adams Morasca
Greenwood Bolognia
Jones Vocelka
Costa Dilliard
Mayumi Kolmetz
Arvin Albares
Silvio Slusarski
Jeanfrancois Venere
Jeanfrancois Venere
Faith Gillian
Salvatore Stockham
IdCountryDate
1000Russia2026-04-23
1001Spain2026-04-25
1002Brazil2026-05-12
1003France2026-05-07
1004India2026-05-07
1005Russia2026-04-27
1006France2026-05-02
1007Brazil2026-04-25
1008Germany2026-04-21
1009Germany2026-05-10
1010France2026-05-13
1011Germany2026-05-04
1012United Kingdom2026-04-25
1013Brazil2026-05-10
1014Italy2026-04-21
1015Italy2026-05-12
1016Germany2026-04-23
1017Russia2026-04-22
1018Australia2026-04-16
1019Germany2026-04-18
1020Germany2026-05-01
1021France2026-05-12
1022United Kingdom2026-04-30
1023India2026-05-11
1024Brazil2026-05-06
1025Russia2026-04-28
1026Russia2026-04-28
1027Brazil2026-05-01
1028Japan2026-04-29
1029Germany2026-05-14
1030Argentina2026-04-15
1031Japan2026-04-21
1032France2026-04-23
1033France2026-05-05
1034Germany2026-05-10
1035France2026-04-17
1036Canada2026-04-26
1037France2026-05-08
1038Australia2026-04-30
1039France2026-05-04
1040India2026-04-18
1041Germany2026-04-24
1042Australia2026-04-24
1043Japan2026-05-05
1044Canada2026-05-01
1045Japan2026-05-07
1046Argentina2026-05-01
1047Argentina2026-04-25
1048Brazil2026-05-03
1049Spain2026-04-21

On-Demand Data

NameIdCountryDate
Chavez Briddick1000Italy2026-04-15
Leja Caldarera1001Russia2026-04-21
Johnson Sergi1002Australia2026-05-11
Cody Saylors1003Canada2026-04-20
Silvio Slusarski1004United Kingdom2026-04-27
Antonio Caudy1005Italy2026-04-23
Tony Foller1006Italy2026-05-09
Rodrigues Campain1007Canada2026-04-21
Smith Glick1008Italy2026-04-18
Rodrigues Campain1009Italy2026-04-28
Arvin Albares1010Germany2026-04-18
Leon Oldroyd1011Italy2026-04-17
Octavia Malet1012Australia2026-05-09
Rodrigues Campain1013Spain2026-05-11
Clifford Rim1014Germany2026-04-20
Adams Morasca1015Canada2026-04-16
Maisha Rulapaugh1016Australia2026-05-02
Salvatore Stockham1017Spain2026-04-16
Wickens Nestle1018Spain2026-05-11
Jennifer Amigon1019France2026-04-28
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Clifford RimAustraliaXuxue Feng UNQUALIFIED
Ashley DoeGermanyAsiya Javayant PROPOSAL
Maria MarrierIndiaAnna Fali NEW
Maisha RulapaughUnited KingdomAnna Fali RENEWAL
Antonio CaudyFranceOnyama Limba NEGOTIATION
Maisha RulapaughUnited KingdomStephen Shaw PROPOSAL
Costa DilliardArgentinaElwin Sharvill NEW
Ashley DoeFranceXuxue Feng NEGOTIATION
Maria MarrierGermanyOnyama Limba NEW
Sinclair WaycottSpainXuxue Feng QUALIFIED
Jones VocelkaCanadaAmy Elsner PROPOSAL
Alejandro PerinArgentinaElwin Sharvill NEW
Darci PoquetteBrazilIvan Magalhaes NEW
Octavia MaletAustraliaIoni Bowcher UNQUALIFIED
Kadeem FlosiAustraliaAnna Fali NEGOTIATION
Aruna FigeroaItalyAnna Fali PROPOSAL
Jones VocelkaSpainAsiya Javayant PROPOSAL
Juan WieserArgentinaIvan Magalhaes NEGOTIATION
Darci PoquetteSpainAmy Elsner PROPOSAL
Misaki RoysterItalyXuxue Feng NEW
Arvin AlbaresGermanyOnyama Limba NEW
James ButtCanadaIoni Bowcher UNQUALIFIED
Maisha RulapaughFranceStephen Shaw RENEWAL
Salvatore StockhamItalyOnyama Limba NEW
Aika InouyeArgentinaStephen Shaw PROPOSAL
Leon OldroydIndiaIoni Bowcher NEW
Misaki RoysterFranceAnna Fali RENEWAL
Isabel BowleyCanadaBernardo Dominic UNQUALIFIED
David DarakjyArgentinaAmy Elsner PROPOSAL
Greenwood BologniaSpainIvan Magalhaes UNQUALIFIED
Jones VocelkaIndiaStephen Shaw NEGOTIATION
Maisha RulapaughIndiaOnyama Limba NEW
Murillo MaletArgentinaAnna Fali PROPOSAL
Johnson SergiFranceOnyama Limba RENEWAL
Octavia MaletIndiaStephen Shaw UNQUALIFIED
Izzy GarufiUnited KingdomElwin Sharvill RENEWAL
Arvin AlbaresJapanAsiya Javayant NEGOTIATION
Greenwood BologniaGermanyBernardo Dominic NEW
Morrow RutaBrazilAnna Fali NEGOTIATION
Johnson SergiFranceAsiya Javayant PROPOSAL

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