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
Deepesh ChuiSpainBernardo Dominic UNQUALIFIED
Munro FerenczAustraliaIoni Bowcher NEGOTIATION
Ricardo GauchoUnited KingdomBernardo Dominic QUALIFIED
Smith GlickBrazilElwin Sharvill NEGOTIATION
Maria MarrierRussiaStephen Shaw PROPOSAL
Leon OldroydCanadaAnna Fali PROPOSAL
Adams MorascaArgentinaStephen Shaw NEW
Ashley DoeIndiaXuxue Feng NEGOTIATION
Rodrigues CampainIndiaIvan Magalhaes NEGOTIATION
Faith GillianBrazilStephen Shaw NEW
Maria MarrierArgentinaOnyama Limba QUALIFIED
Wickens NestleJapanXuxue Feng QUALIFIED
Aditya KuskoCanadaOnyama Limba PROPOSAL
David DarakjyUnited KingdomXuxue Feng RENEWAL
Jennifer AmigonRussiaIoni Bowcher QUALIFIED
Francesco ShinkoGermanyBernardo Dominic UNQUALIFIED
David DarakjySpainOnyama Limba NEGOTIATION
Emily WhobreyItalyElwin Sharvill NEW
Claire TollnerSpainAnna Fali RENEWAL
Leja CaldareraAustraliaIvan Magalhaes RENEWAL
Kadeem FlosiIndiaStephen Shaw NEGOTIATION
Greenwood BologniaJapanOnyama Limba NEGOTIATION
Jeanfrancois VenereUnited KingdomIvan Magalhaes RENEWAL
Aruna FigeroaAustraliaElwin Sharvill NEGOTIATION
Jennifer AmigonSpainStephen Shaw PROPOSAL
Alejandro PerinUnited KingdomAnna Fali UNQUALIFIED
Kadeem FlosiItalyElwin Sharvill PROPOSAL
Julie StensethArgentinaElwin Sharvill NEW
Costa DilliardAustraliaAmy Elsner UNQUALIFIED
Morrow RutaJapanAmy Elsner NEGOTIATION
Antonio CaudyUnited KingdomStephen Shaw QUALIFIED
Izzy GarufiSpainAsiya Javayant NEGOTIATION
Ivar PaprockiUnited KingdomOnyama Limba NEGOTIATION
Costa DilliardIndiaStephen Shaw NEGOTIATION
Jefferson SchemmerIndiaElwin Sharvill RENEWAL
Maisha RulapaughAustraliaAnna Fali NEW
Izzy GarufiRussiaIvan Magalhaes NEW
Ashley DoeJapanIvan Magalhaes QUALIFIED
Nicolas IturbideArgentinaAnna Fali PROPOSAL
Adams MorascaCanadaXuxue Feng UNQUALIFIED
David DarakjyBrazilAmy Elsner PROPOSAL
Nicolas IturbideGermanyXuxue Feng UNQUALIFIED
Greenwood BologniaUnited KingdomAmy Elsner RENEWAL
Adams MorascaFranceElwin Sharvill UNQUALIFIED
Ivar PaprockiBrazilAsiya Javayant RENEWAL
Adams MorascaUnited KingdomAnna Fali NEW
Rodrigues CampainFranceIoni Bowcher RENEWAL
Cody SaylorsArgentinaAnna Fali QUALIFIED
Rodrigues CampainIndiaAnna Fali NEGOTIATION
David DarakjyCanadaXuxue Feng PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Leon OldroydBrazilAsiya Javayant RENEWAL
Rodrigues CampainJapanXuxue Feng PROPOSAL
Maria MarrierBrazilBernardo Dominic UNQUALIFIED
Leon OldroydGermanyIvan Magalhaes NEW
Aruna FigeroaSpainStephen Shaw PROPOSAL
Ashley DoeGermanyOnyama Limba PROPOSAL
Sinclair WaycottSpainIoni Bowcher NEGOTIATION
Juan WieserFranceIvan Magalhaes PROPOSAL
Clifford RimItalyIoni Bowcher RENEWAL
Munro FerenczAustraliaAsiya Javayant NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Tony FollerSpain2026-05-27Commercial Press NEW7Amy Elsner
1001Ivar PaprockiAustralia2026-06-07Chapman, Ross E Esq PROPOSAL74Ioni Bowcher
1002Mayumi KolmetzRussia2026-06-08Chemel, James L Cpa QUALIFIED60Asiya Javayant
1003Julie StensethSpain2026-05-24Truhlar And Truhlar Attys NEW98Ioni Bowcher
1004Juan WieserAustralia2026-06-09Buckley Miller Wright UNQUALIFIED46Bernardo Dominic
1005Leja CaldareraAustralia2026-05-13Rangoni Of Florence RENEWAL52Asiya Javayant
1006Kadeem FlosiGermany2026-05-15Rousseaux, Michael Esq NEGOTIATION38Amy Elsner
1007Emily WhobreyJapan2026-05-30King, Christopher A Esq QUALIFIED10Ivan Magalhaes
1008Jeanfrancois VenereUnited Kingdom2026-06-07Morlong Associates NEW31Bernardo Dominic
1009Silvio SlusarskiBrazil2026-05-12Truhlar And Truhlar Attys NEGOTIATION73Elwin Sharvill
1010Smith GlickAustralia2026-06-05Commercial Press QUALIFIED52Stephen Shaw
1011Julie StensethAustralia2026-05-17Rangoni Of Florence QUALIFIED88Ivan Magalhaes
1012Mujtaba NickaRussia2026-05-19King, Christopher A Esq NEGOTIATION69Ioni Bowcher
1013Salvatore StockhamCanada2026-06-09Morlong Associates RENEWAL87Asiya Javayant
1014Izzy GarufiFrance2026-06-08Dorl, James J Esq NEGOTIATION1Stephen Shaw
1015Claire TollnerJapan2026-05-26Chanay, Jeffrey A Esq NEGOTIATION34Asiya Javayant
1016Aruna FigeroaItaly2026-05-21Benton, John B Jr RENEWAL1Asiya Javayant
1017Rodrigues CampainRussia2026-06-08Commercial Press RENEWAL89Stephen Shaw
1018Aditya KuskoRussia2026-06-08Rangoni Of Florence UNQUALIFIED48Stephen Shaw
1019Maria MarrierSpain2026-05-28King, Christopher A Esq RENEWAL23Xuxue Feng
1020Ricardo GauchoFrance2026-05-30Commercial Press NEW60Elwin Sharvill
1021Maria MarrierJapan2026-05-31Rangoni Of Florence NEW29Elwin Sharvill
1022Aika InouyeGermany2026-05-17Commercial Press NEW43Ioni Bowcher
1023Kaitlin OstroskyUnited Kingdom2026-05-26Truhlar And Truhlar Attys PROPOSAL29Xuxue Feng
1024Munro FerenczAustralia2026-06-03Chemel, James L Cpa UNQUALIFIED25Ioni Bowcher
1025Sinclair WaycottIndia2026-06-01Feltz Printing Service PROPOSAL98Ioni Bowcher
1026Chavez BriddickUnited Kingdom2026-05-25Benton, John B Jr NEGOTIATION56Asiya Javayant
1027Leon OldroydBrazil2026-05-18Chanay, Jeffrey A Esq NEW3Anna Fali
1028Maisha RulapaughRussia2026-06-05Feiner Bros QUALIFIED37Elwin Sharvill
1029Izzy GarufiUnited Kingdom2026-05-25Truhlar And Truhlar Attys UNQUALIFIED25Ioni Bowcher
1030Silvio SlusarskiUnited Kingdom2026-06-09Chemel, James L Cpa RENEWAL87Bernardo Dominic
1031Wickens NestleSpain2026-05-16Rangoni Of Florence RENEWAL72Xuxue Feng
1032Smith GlickCanada2026-05-27Rangoni Of Florence NEGOTIATION91Asiya Javayant
1033Jeanfrancois VenereItaly2026-05-11Benton, John B Jr RENEWAL16Bernardo Dominic
1034Greenwood BologniaSpain2026-06-08Chanay, Jeffrey A Esq NEW58Anna Fali
1035Claire TollnerJapan2026-05-15Buckley Miller Wright NEGOTIATION25Onyama Limba
1036Aruna FigeroaCanada2026-05-21Chanay, Jeffrey A Esq NEGOTIATION95Elwin Sharvill
1037Jefferson SchemmerRussia2026-06-09Truhlar And Truhlar Attys PROPOSAL33Elwin Sharvill
1038Smith GlickUnited Kingdom2026-05-12Feiner Bros NEGOTIATION45Xuxue Feng
1039Jones VocelkaBrazil2026-05-16Printing Dimensions QUALIFIED20Anna Fali
1040Isabel BowleyGermany2026-06-04Chapman, Ross E Esq UNQUALIFIED6Anna Fali
1041Jeanfrancois VenereJapan2026-06-06Dorl, James J Esq UNQUALIFIED94Bernardo Dominic
1042Claire TollnerSpain2026-06-04Printing Dimensions NEW70Amy Elsner
1043Aditya KuskoBrazil2026-05-29Printing Dimensions NEGOTIATION28Stephen Shaw
1044James ButtCanada2026-06-07King, Christopher A Esq QUALIFIED91Elwin Sharvill
1045Claire TollnerCanada2026-05-17Chapman, Ross E Esq QUALIFIED65Bernardo Dominic
1046Arvin AlbaresAustralia2026-05-12Morlong Associates PROPOSAL98Asiya Javayant
1047Tony FollerBrazil2026-05-31Morlong Associates NEGOTIATION36Onyama Limba
1048Darci PoquetteAustralia2026-06-08Rousseaux, Michael Esq PROPOSAL41Anna Fali
1049Juan WieserArgentina2026-06-07Benton, John B Jr NEW74Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
James ButtItalyStephen Shaw RENEWAL
David DarakjyUnited KingdomBernardo Dominic UNQUALIFIED
Leja CaldareraSpainOnyama Limba UNQUALIFIED
Wickens NestleUnited KingdomIvan Magalhaes PROPOSAL
Mayumi KolmetzAustraliaElwin Sharvill NEW
Misaki RoysterBrazilOnyama Limba RENEWAL
Chavez BriddickItalyIvan Magalhaes PROPOSAL
Francesco ShinkoJapanAmy Elsner QUALIFIED
Kadeem FlosiArgentinaAnna Fali UNQUALIFIED
Greenwood BologniaJapanBernardo Dominic UNQUALIFIED
Greenwood BologniaRussiaIoni Bowcher QUALIFIED
Clifford RimBrazilAnna Fali PROPOSAL
Maisha RulapaughAustraliaIoni Bowcher NEGOTIATION
Wickens NestleAustraliaAsiya Javayant NEGOTIATION
Claire TollnerGermanyAmy Elsner NEGOTIATION
Aruna FigeroaJapanXuxue Feng RENEWAL
Murillo MaletItalyAnna Fali NEW
Alejandro PerinBrazilElwin Sharvill PROPOSAL
Leja CaldareraRussiaIvan Magalhaes NEGOTIATION
Adams MorascaFranceBernardo Dominic NEGOTIATION
Sinclair WaycottBrazilIvan Magalhaes RENEWAL
Julie StensethCanadaXuxue Feng RENEWAL
James ButtItalyXuxue Feng PROPOSAL
Alejandro PerinJapanOnyama Limba RENEWAL
Aruna FigeroaGermanyElwin Sharvill NEW
Sinclair WaycottJapanXuxue Feng PROPOSAL
Stacey MacleadSpainBernardo Dominic RENEWAL
Tony FollerItalyXuxue Feng NEW
Aruna FigeroaItalyIoni Bowcher QUALIFIED
Antonio CaudyItalyIvan Magalhaes NEW
Antonio CaudyAustraliaAsiya Javayant PROPOSAL
Cody SaylorsGermanyOnyama Limba PROPOSAL
Wickens NestleCanadaIvan Magalhaes NEGOTIATION
Salvatore StockhamBrazilOnyama Limba QUALIFIED
Misaki RoysterFranceIoni Bowcher NEGOTIATION
Darci PoquetteUnited KingdomBernardo Dominic QUALIFIED
Greenwood BologniaAustraliaXuxue Feng NEGOTIATION
Maria MarrierRussiaIoni Bowcher NEGOTIATION
Chavez BriddickGermanyIvan Magalhaes RENEWAL
Aditya KuskoJapanElwin Sharvill QUALIFIED
Chavez BriddickArgentinaElwin Sharvill QUALIFIED
Tony FollerFranceAnna Fali UNQUALIFIED
Maria MarrierGermanyXuxue Feng NEGOTIATION
Claire TollnerGermanyAmy Elsner RENEWAL
Adams MorascaArgentinaStephen Shaw QUALIFIED
Nicolas IturbideFranceStephen Shaw QUALIFIED
Smith GlickBrazilBernardo Dominic RENEWAL
Isabel BowleyBrazilAmy Elsner PROPOSAL
Clifford RimBrazilStephen Shaw UNQUALIFIED
Jeanfrancois VenereFranceAmy Elsner RENEWAL
Frozen Columns
Name
Alejandro Perin
Ricardo Gaucho
Morrow Ruta
Silvio Slusarski
Ricardo Gaucho
Faith Gillian
Mayumi Kolmetz
Mujtaba Nicka
Darci Poquette
Sinclair Waycott
Jones Vocelka
Maisha Rulapaugh
David Darakjy
Jones Vocelka
Jones Vocelka
Morrow Ruta
Morrow Ruta
Morrow Ruta
David Darakjy
Munro Ferencz
Maria Marrier
Aditya Kusko
Faith Gillian
Chavez Briddick
Isabel Bowley
Julie Stenseth
Stacey Maclead
Ashley Doe
Cody Saylors
Aika Inouye
Ivar Paprocki
Juan Wieser
Izzy Garufi
James Butt
Mayumi Kolmetz
Isabel Bowley
Isabel Bowley
Smith Glick
David Darakjy
Claire Tollner
Jones Vocelka
Faith Gillian
Smith Glick
Julie Stenseth
Jefferson Schemmer
Octavia Malet
Kaitlin Ostrosky
Salvatore Stockham
Francesco Shinko
Alejandro Perin
IdCountryDate
1000Germany2026-05-28
1001Spain2026-05-26
1002Germany2026-05-20
1003Italy2026-06-05
1004France2026-06-06
1005Russia2026-05-25
1006Japan2026-05-11
1007Canada2026-06-03
1008Canada2026-05-21
1009Argentina2026-05-12
1010India2026-05-23
1011Brazil2026-05-13
1012United Kingdom2026-05-24
1013Canada2026-05-11
1014Canada2026-06-01
1015Canada2026-06-05
1016Italy2026-05-27
1017Russia2026-05-26
1018Japan2026-05-16
1019Canada2026-06-03
1020Australia2026-06-06
1021United Kingdom2026-05-18
1022Germany2026-05-14
1023Spain2026-05-19
1024India2026-05-26
1025France2026-05-26
1026United Kingdom2026-05-15
1027Australia2026-05-13
1028Italy2026-06-04
1029India2026-05-28
1030France2026-05-23
1031Canada2026-05-18
1032Canada2026-05-23
1033Germany2026-05-28
1034Russia2026-06-02
1035Japan2026-05-31
1036Russia2026-05-13
1037Australia2026-05-20
1038Australia2026-05-11
1039India2026-05-20
1040Brazil2026-05-23
1041Australia2026-05-31
1042Spain2026-05-21
1043France2026-05-31
1044Canada2026-05-13
1045Australia2026-06-05
1046Brazil2026-06-09
1047India2026-05-18
1048Canada2026-05-22
1049Italy2026-06-09

On-Demand Data

NameIdCountryDate
Arvin Albares1000France2026-05-28
Johnson Sergi1001United Kingdom2026-05-21
Greenwood Bolognia1002Canada2026-05-26
Smith Glick1003Japan2026-06-08
Jefferson Schemmer1004Germany2026-05-14
Murillo Malet1005Canada2026-05-24
Tony Foller1006Brazil2026-05-28
Morrow Ruta1007Australia2026-05-25
Claire Tollner1008Australia2026-05-14
Greenwood Bolognia1009India2026-05-22
Mayumi Kolmetz1010Italy2026-05-21
Isabel Bowley1011Italy2026-06-06
Chavez Briddick1012France2026-05-20
Ivar Paprocki1013Canada2026-05-23
Costa Dilliard1014Spain2026-05-15
Kaitlin Ostrosky1015Argentina2026-05-13
Isabel Bowley1016Argentina2026-05-25
Mujtaba Nicka1017Argentina2026-05-24
Antonio Caudy1018Argentina2026-05-23
Emily Whobrey1019Japan2026-05-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jeanfrancois VenereSpainIoni Bowcher UNQUALIFIED
Munro FerenczUnited KingdomBernardo Dominic NEW
Smith GlickIndiaElwin Sharvill NEW
Ivar PaprockiRussiaOnyama Limba PROPOSAL
Cody SaylorsBrazilBernardo Dominic UNQUALIFIED
Kadeem FlosiArgentinaIvan Magalhaes RENEWAL
Darci PoquetteIndiaAsiya Javayant NEGOTIATION
Silvio SlusarskiFranceIvan Magalhaes UNQUALIFIED
Johnson SergiItalyIoni Bowcher NEGOTIATION
Ashley DoeItalyOnyama Limba NEGOTIATION
Isabel BowleyGermanyBernardo Dominic RENEWAL
Greenwood BologniaItalyAmy Elsner NEGOTIATION
Stacey MacleadRussiaAmy Elsner QUALIFIED
Morrow RutaItalyAsiya Javayant RENEWAL
Aruna FigeroaBrazilAmy Elsner RENEWAL
Rodrigues CampainGermanyElwin Sharvill NEGOTIATION
Antonio CaudyArgentinaAnna Fali PROPOSAL
Chavez BriddickSpainIvan Magalhaes QUALIFIED
Kaitlin OstroskyArgentinaBernardo Dominic NEGOTIATION
Munro FerenczAustraliaXuxue Feng RENEWAL
Johnson SergiSpainXuxue Feng RENEWAL
Aruna FigeroaCanadaAmy Elsner NEW
Kaitlin OstroskyBrazilXuxue Feng PROPOSAL
Morrow RutaCanadaElwin Sharvill RENEWAL
Leja CaldareraUnited KingdomXuxue Feng RENEWAL
Aruna FigeroaCanadaStephen Shaw RENEWAL
Mayumi KolmetzAustraliaAmy Elsner UNQUALIFIED
Ricardo GauchoItalyBernardo Dominic UNQUALIFIED
Antonio CaudyCanadaIvan Magalhaes NEW
Arvin AlbaresUnited KingdomAnna Fali PROPOSAL
Murillo MaletCanadaIoni Bowcher NEGOTIATION
Mayumi KolmetzBrazilAmy Elsner RENEWAL
Faith GillianUnited KingdomAnna Fali NEGOTIATION
Greenwood BologniaArgentinaXuxue Feng UNQUALIFIED
Kaitlin OstroskyUnited KingdomOnyama Limba PROPOSAL
Darci PoquetteIndiaAsiya Javayant UNQUALIFIED
Salvatore StockhamItalyOnyama Limba PROPOSAL
Aika InouyeAustraliaAnna Fali QUALIFIED
Aditya KuskoCanadaElwin Sharvill QUALIFIED
Cody SaylorsFranceBernardo Dominic UNQUALIFIED

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