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
Murillo MaletCanadaOnyama Limba NEW
Ashley DoeItalyElwin Sharvill NEGOTIATION
Adams MorascaUnited KingdomElwin Sharvill RENEWAL
Wickens NestleBrazilOnyama Limba NEW
Jones VocelkaItalyAmy Elsner PROPOSAL
Ricardo GauchoGermanyAsiya Javayant PROPOSAL
Mayumi KolmetzIndiaAnna Fali RENEWAL
Jeanfrancois VenereFranceOnyama Limba QUALIFIED
Ricardo GauchoUnited KingdomOnyama Limba QUALIFIED
Alejandro PerinItalyBernardo Dominic PROPOSAL
James ButtIndiaStephen Shaw PROPOSAL
Jeanfrancois VenereAustraliaAmy Elsner QUALIFIED
Deepesh ChuiArgentinaAnna Fali NEW
Ashley DoeBrazilXuxue Feng RENEWAL
Claire TollnerItalyAnna Fali NEW
Clifford RimUnited KingdomAmy Elsner UNQUALIFIED
Johnson SergiItalyOnyama Limba RENEWAL
Jefferson SchemmerCanadaBernardo Dominic QUALIFIED
Emily WhobreyBrazilIvan Magalhaes UNQUALIFIED
Salvatore StockhamArgentinaAsiya Javayant PROPOSAL
Adams MorascaItalyBernardo Dominic RENEWAL
Izzy GarufiGermanyIoni Bowcher NEGOTIATION
Alejandro PerinUnited KingdomAmy Elsner UNQUALIFIED
Aika InouyeCanadaStephen Shaw NEGOTIATION
Alejandro PerinSpainElwin Sharvill PROPOSAL
Isabel BowleyUnited KingdomAmy Elsner QUALIFIED
Johnson SergiArgentinaOnyama Limba QUALIFIED
Clifford RimFranceBernardo Dominic RENEWAL
Julie StensethRussiaElwin Sharvill UNQUALIFIED
Tony FollerFranceXuxue Feng QUALIFIED
Jones VocelkaIndiaStephen Shaw NEW
Sinclair WaycottSpainAnna Fali QUALIFIED
Aditya KuskoIndiaAsiya Javayant UNQUALIFIED
Maria MarrierUnited KingdomAnna Fali RENEWAL
Leja CaldareraSpainBernardo Dominic QUALIFIED
Leja CaldareraSpainOnyama Limba NEGOTIATION
Misaki RoysterGermanyIoni Bowcher UNQUALIFIED
Cody SaylorsIndiaIoni Bowcher UNQUALIFIED
Darci PoquetteFranceAmy Elsner QUALIFIED
Leon OldroydFranceAmy Elsner RENEWAL
Aika InouyeIndiaIoni Bowcher NEW
Julie StensethBrazilXuxue Feng RENEWAL
Emily WhobreyIndiaAmy Elsner NEGOTIATION
Cody SaylorsUnited KingdomAnna Fali PROPOSAL
Alejandro PerinCanadaIoni Bowcher RENEWAL
Tony FollerItalyOnyama Limba NEGOTIATION
Arvin AlbaresArgentinaIoni Bowcher RENEWAL
Jennifer AmigonSpainStephen Shaw PROPOSAL
James ButtRussiaIvan Magalhaes NEW
Sinclair WaycottItalyAmy Elsner QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Salvatore StockhamGermanyAsiya Javayant UNQUALIFIED
Francesco ShinkoBrazilElwin Sharvill UNQUALIFIED
Claire TollnerSpainXuxue Feng NEGOTIATION
Arvin AlbaresArgentinaAnna Fali RENEWAL
Ricardo GauchoUnited KingdomXuxue Feng UNQUALIFIED
Leja CaldareraJapanBernardo Dominic QUALIFIED
Maisha RulapaughBrazilAmy Elsner PROPOSAL
Maisha RulapaughFranceStephen Shaw PROPOSAL
Adams MorascaArgentinaBernardo Dominic QUALIFIED
Arvin AlbaresArgentinaBernardo Dominic NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Greenwood BologniaJapan2026-06-04Feiner Bros UNQUALIFIED69Ivan Magalhaes
1001Greenwood BologniaArgentina2026-06-01Dorl, James J Esq UNQUALIFIED63Onyama Limba
1002Mayumi KolmetzJapan2026-05-28Feltz Printing Service QUALIFIED69Stephen Shaw
1003Darci PoquetteJapan2026-06-04Chemel, James L Cpa NEW86Onyama Limba
1004Kadeem FlosiIndia2026-06-14Printing Dimensions PROPOSAL60Ivan Magalhaes
1005Aditya KuskoBrazil2026-06-20Dorl, James J Esq RENEWAL36Amy Elsner
1006Octavia MaletItaly2026-05-24Rangoni Of Florence UNQUALIFIED59Stephen Shaw
1007Cody SaylorsGermany2026-06-05Feiner Bros QUALIFIED35Onyama Limba
1008Jefferson SchemmerUnited Kingdom2026-06-16King, Christopher A Esq UNQUALIFIED77Ioni Bowcher
1009Jones VocelkaSpain2026-06-12Truhlar And Truhlar Attys NEW16Onyama Limba
1010Tony FollerUnited Kingdom2026-06-04Chemel, James L Cpa NEGOTIATION79Amy Elsner
1011Johnson SergiItaly2026-06-05Commercial Press UNQUALIFIED33Stephen Shaw
1012Antonio CaudyItaly2026-06-06Rousseaux, Michael Esq NEGOTIATION68Onyama Limba
1013James ButtAustralia2026-06-17Morlong Associates PROPOSAL86Anna Fali
1014Leon OldroydFrance2026-06-03Commercial Press QUALIFIED88Ioni Bowcher
1015David DarakjyJapan2026-06-17King, Christopher A Esq RENEWAL48Elwin Sharvill
1016Misaki RoysterFrance2026-06-12Commercial Press RENEWAL85Bernardo Dominic
1017Tony FollerUnited Kingdom2026-06-02Chapman, Ross E Esq PROPOSAL10Ioni Bowcher
1018Salvatore StockhamIndia2026-05-28Truhlar And Truhlar Attys RENEWAL24Elwin Sharvill
1019Kadeem FlosiAustralia2026-06-04Commercial Press QUALIFIED61Stephen Shaw
1020Jones VocelkaGermany2026-05-25Truhlar And Truhlar Attys NEGOTIATION17Xuxue Feng
1021Octavia MaletArgentina2026-05-22Commercial Press QUALIFIED74Anna Fali
1022Mayumi KolmetzArgentina2026-06-07Commercial Press PROPOSAL59Onyama Limba
1023Salvatore StockhamItaly2026-06-15Benton, John B Jr NEGOTIATION31Ivan Magalhaes
1024Ashley DoeSpain2026-06-18Chemel, James L Cpa NEGOTIATION72Bernardo Dominic
1025James ButtSpain2026-06-19Truhlar And Truhlar Attys PROPOSAL52Elwin Sharvill
1026Juan WieserIndia2026-06-05Truhlar And Truhlar Attys PROPOSAL10Onyama Limba
1027Aika InouyeFrance2026-06-04Rousseaux, Michael Esq PROPOSAL56Amy Elsner
1028Octavia MaletItaly2026-05-26King, Christopher A Esq QUALIFIED64Ioni Bowcher
1029Leja CaldareraRussia2026-06-05Rousseaux, Michael Esq UNQUALIFIED16Xuxue Feng
1030Izzy GarufiRussia2026-05-24Buckley Miller Wright NEW73Ioni Bowcher
1031Sinclair WaycottUnited Kingdom2026-06-04Rousseaux, Michael Esq UNQUALIFIED40Elwin Sharvill
1032Claire TollnerIndia2026-06-08King, Christopher A Esq RENEWAL46Xuxue Feng
1033Clifford RimFrance2026-06-16Rangoni Of Florence NEW42Asiya Javayant
1034Alejandro PerinBrazil2026-06-15King, Christopher A Esq NEGOTIATION56Ioni Bowcher
1035James ButtAustralia2026-06-08Dorl, James J Esq NEW68Onyama Limba
1036Darci PoquetteGermany2026-06-19Buckley Miller Wright UNQUALIFIED24Asiya Javayant
1037Jennifer AmigonArgentina2026-06-17Chemel, James L Cpa QUALIFIED33Asiya Javayant
1038Claire TollnerFrance2026-05-25Buckley Miller Wright NEGOTIATION42Stephen Shaw
1039Emily WhobreyAustralia2026-06-03Benton, John B Jr RENEWAL21Amy Elsner
1040Jennifer AmigonCanada2026-06-15Morlong Associates PROPOSAL54Xuxue Feng
1041Maisha RulapaughAustralia2026-06-08Chanay, Jeffrey A Esq RENEWAL34Elwin Sharvill
1042Alejandro PerinCanada2026-05-31Buckley Miller Wright NEGOTIATION98Ivan Magalhaes
1043Jeanfrancois VenereIndia2026-05-30Commercial Press UNQUALIFIED28Ioni Bowcher
1044Francesco ShinkoIndia2026-06-13Morlong Associates UNQUALIFIED70Ivan Magalhaes
1045Greenwood BologniaFrance2026-06-03King, Christopher A Esq UNQUALIFIED46Anna Fali
1046Stacey MacleadUnited Kingdom2026-06-08Printing Dimensions NEGOTIATION33Bernardo Dominic
1047Tony FollerSpain2026-06-15Rangoni Of Florence NEGOTIATION17Bernardo Dominic
1048Alejandro PerinCanada2026-06-11Dorl, James J Esq RENEWAL21Ivan Magalhaes
1049Octavia MaletCanada2026-05-22Printing Dimensions QUALIFIED82Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Arvin AlbaresItalyStephen Shaw RENEWAL
James ButtFranceIoni Bowcher NEGOTIATION
Juan WieserArgentinaElwin Sharvill NEGOTIATION
Costa DilliardIndiaStephen Shaw QUALIFIED
Ricardo GauchoIndiaAsiya Javayant PROPOSAL
Francesco ShinkoBrazilIoni Bowcher RENEWAL
Darci PoquetteBrazilIvan Magalhaes PROPOSAL
Rodrigues CampainRussiaIvan Magalhaes RENEWAL
Kaitlin OstroskyIndiaIoni Bowcher RENEWAL
Nicolas IturbideSpainAnna Fali RENEWAL
Julie StensethFranceElwin Sharvill QUALIFIED
Jennifer AmigonJapanIoni Bowcher QUALIFIED
Ashley DoeUnited KingdomAmy Elsner NEGOTIATION
Sinclair WaycottCanadaIvan Magalhaes RENEWAL
Francesco ShinkoJapanIoni Bowcher QUALIFIED
Maria MarrierFranceAsiya Javayant NEW
Faith GillianIndiaIvan Magalhaes RENEWAL
Nicolas IturbideGermanyIvan Magalhaes RENEWAL
Sinclair WaycottAustraliaAmy Elsner UNQUALIFIED
Antonio CaudyAustraliaAsiya Javayant PROPOSAL
Alejandro PerinCanadaXuxue Feng PROPOSAL
Aruna FigeroaItalyElwin Sharvill PROPOSAL
Mayumi KolmetzUnited KingdomAmy Elsner QUALIFIED
Arvin AlbaresSpainOnyama Limba NEGOTIATION
Arvin AlbaresRussiaAmy Elsner QUALIFIED
Jeanfrancois VenereJapanAnna Fali UNQUALIFIED
Stacey MacleadArgentinaIoni Bowcher QUALIFIED
Faith GillianRussiaXuxue Feng QUALIFIED
Ivar PaprockiBrazilElwin Sharvill NEGOTIATION
Aika InouyeAustraliaOnyama Limba UNQUALIFIED
Kadeem FlosiJapanAsiya Javayant NEW
Kadeem FlosiCanadaOnyama Limba RENEWAL
James ButtIndiaAmy Elsner NEGOTIATION
Jefferson SchemmerBrazilBernardo Dominic NEGOTIATION
Adams MorascaBrazilOnyama Limba NEGOTIATION
Kadeem FlosiIndiaOnyama Limba RENEWAL
Faith GillianCanadaXuxue Feng PROPOSAL
Faith GillianGermanyOnyama Limba RENEWAL
Ivar PaprockiBrazilIvan Magalhaes QUALIFIED
Misaki RoysterJapanElwin Sharvill PROPOSAL
Leon OldroydRussiaIvan Magalhaes PROPOSAL
Darci PoquetteCanadaXuxue Feng QUALIFIED
Ricardo GauchoCanadaIvan Magalhaes PROPOSAL
Aika InouyeArgentinaOnyama Limba UNQUALIFIED
Smith GlickRussiaBernardo Dominic RENEWAL
Cody SaylorsRussiaXuxue Feng NEGOTIATION
Ashley DoeIndiaAsiya Javayant NEGOTIATION
Aika InouyeGermanyIoni Bowcher RENEWAL
Antonio CaudyUnited KingdomBernardo Dominic QUALIFIED
Arvin AlbaresBrazilAnna Fali QUALIFIED
Frozen Columns
Name
Ricardo Gaucho
Julie Stenseth
Nicolas Iturbide
Morrow Ruta
Antonio Caudy
Mujtaba Nicka
Maisha Rulapaugh
Misaki Royster
David Darakjy
Costa Dilliard
Wickens Nestle
Jeanfrancois Venere
Salvatore Stockham
Izzy Garufi
Rodrigues Campain
Francesco Shinko
Kaitlin Ostrosky
Jennifer Amigon
Leon Oldroyd
Aditya Kusko
Jeanfrancois Venere
Mayumi Kolmetz
Costa Dilliard
Rodrigues Campain
Francesco Shinko
Kaitlin Ostrosky
Cody Saylors
Misaki Royster
Wickens Nestle
Sinclair Waycott
Deepesh Chui
Jones Vocelka
Aditya Kusko
Ashley Doe
Claire Tollner
Morrow Ruta
Francesco Shinko
Claire Tollner
James Butt
Kadeem Flosi
Isabel Bowley
Stacey Maclead
Jeanfrancois Venere
Mayumi Kolmetz
Arvin Albares
David Darakjy
Chavez Briddick
Julie Stenseth
David Darakjy
Tony Foller
IdCountryDate
1000Germany2026-06-03
1001Australia2026-05-26
1002Canada2026-05-31
1003Canada2026-06-16
1004India2026-05-22
1005Japan2026-06-08
1006United Kingdom2026-06-04
1007Japan2026-06-06
1008France2026-06-11
1009Japan2026-06-05
1010Brazil2026-06-15
1011Italy2026-06-18
1012Australia2026-06-17
1013France2026-06-05
1014Russia2026-05-25
1015Germany2026-05-22
1016Italy2026-06-09
1017Brazil2026-06-10
1018Australia2026-05-22
1019Russia2026-06-03
1020United Kingdom2026-05-28
1021Russia2026-06-12
1022Argentina2026-06-13
1023India2026-05-28
1024India2026-06-18
1025Argentina2026-06-17
1026Spain2026-06-14
1027India2026-06-13
1028Italy2026-06-17
1029Russia2026-06-10
1030India2026-05-29
1031Germany2026-06-14
1032United Kingdom2026-05-26
1033Spain2026-06-14
1034Brazil2026-06-13
1035France2026-06-09
1036Italy2026-06-06
1037France2026-06-03
1038Canada2026-06-01
1039Japan2026-06-13
1040France2026-06-03
1041Brazil2026-06-02
1042Italy2026-06-16
1043United Kingdom2026-06-13
1044Japan2026-06-13
1045Brazil2026-06-17
1046United Kingdom2026-05-27
1047India2026-05-31
1048Russia2026-06-04
1049Australia2026-06-19

On-Demand Data

NameIdCountryDate
Murillo Malet1000France2026-06-09
Jennifer Amigon1001India2026-05-27
James Butt1002Canada2026-05-25
David Darakjy1003United Kingdom2026-06-02
Octavia Malet1004United Kingdom2026-06-07
Ivar Paprocki1005France2026-06-05
Arvin Albares1006Brazil2026-06-07
Chavez Briddick1007Italy2026-06-14
Morrow Ruta1008Australia2026-06-07
Murillo Malet1009Argentina2026-06-06
Antonio Caudy1010Spain2026-05-23
Arvin Albares1011Brazil2026-05-25
David Darakjy1012Argentina2026-06-11
Stacey Maclead1013Germany2026-06-16
Nicolas Iturbide1014United Kingdom2026-05-29
Jones Vocelka1015Argentina2026-05-30
Tony Foller1016Japan2026-06-06
Faith Gillian1017Japan2026-05-24
Izzy Garufi1018Brazil2026-06-06
Tony Foller1019Spain2026-05-24
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Darci PoquetteItalyAsiya Javayant QUALIFIED
Octavia MaletJapanStephen Shaw NEW
Morrow RutaSpainBernardo Dominic PROPOSAL
Mayumi KolmetzItalyIvan Magalhaes NEW
Clifford RimIndiaXuxue Feng RENEWAL
Sinclair WaycottAustraliaXuxue Feng UNQUALIFIED
Murillo MaletSpainIoni Bowcher PROPOSAL
Mayumi KolmetzFranceAsiya Javayant RENEWAL
Sinclair WaycottIndiaAmy Elsner QUALIFIED
Tony FollerItalyAmy Elsner NEW
Sinclair WaycottItalyAsiya Javayant NEW
Jones VocelkaItalyBernardo Dominic PROPOSAL
Stacey MacleadAustraliaOnyama Limba RENEWAL
James ButtArgentinaAsiya Javayant NEGOTIATION
Costa DilliardIndiaAsiya Javayant NEGOTIATION
Kaitlin OstroskyCanadaStephen Shaw PROPOSAL
Nicolas IturbideGermanyBernardo Dominic NEW
Jefferson SchemmerSpainAmy Elsner QUALIFIED
Darci PoquetteIndiaAnna Fali NEGOTIATION
Salvatore StockhamCanadaOnyama Limba PROPOSAL
Rodrigues CampainUnited KingdomBernardo Dominic QUALIFIED
Mujtaba NickaJapanElwin Sharvill NEGOTIATION
Kaitlin OstroskyRussiaXuxue Feng NEGOTIATION
Morrow RutaGermanyAnna Fali RENEWAL
Mujtaba NickaSpainStephen Shaw UNQUALIFIED
Chavez BriddickAustraliaBernardo Dominic NEGOTIATION
Silvio SlusarskiJapanAsiya Javayant NEW
Antonio CaudyBrazilXuxue Feng NEW
Salvatore StockhamUnited KingdomBernardo Dominic NEGOTIATION
Wickens NestleIndiaAmy Elsner NEGOTIATION
Misaki RoysterIndiaOnyama Limba QUALIFIED
David DarakjyAustraliaOnyama Limba PROPOSAL
Jefferson SchemmerItalyIoni Bowcher QUALIFIED
Cody SaylorsIndiaBernardo Dominic UNQUALIFIED
Aditya KuskoJapanBernardo Dominic NEW
Darci PoquetteCanadaIoni Bowcher UNQUALIFIED
Juan WieserUnited KingdomAnna Fali NEW
Silvio SlusarskiJapanElwin Sharvill QUALIFIED
Antonio CaudyGermanyOnyama Limba QUALIFIED
Julie StensethUnited KingdomAmy Elsner NEGOTIATION

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