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
Jennifer AmigonJapanIvan Magalhaes PROPOSAL
Rodrigues CampainIndiaIvan Magalhaes UNQUALIFIED
Silvio SlusarskiArgentinaStephen Shaw NEGOTIATION
Juan WieserFranceIoni Bowcher PROPOSAL
Sinclair WaycottUnited KingdomIvan Magalhaes NEGOTIATION
Juan WieserArgentinaOnyama Limba NEGOTIATION
Arvin AlbaresAustraliaStephen Shaw PROPOSAL
Leja CaldareraUnited KingdomXuxue Feng PROPOSAL
Ashley DoeArgentinaXuxue Feng PROPOSAL
Mayumi KolmetzGermanyXuxue Feng RENEWAL
David DarakjyBrazilBernardo Dominic QUALIFIED
Emily WhobreySpainXuxue Feng NEGOTIATION
Faith GillianRussiaAsiya Javayant PROPOSAL
Mayumi KolmetzBrazilOnyama Limba NEW
Munro FerenczCanadaOnyama Limba UNQUALIFIED
Izzy GarufiRussiaOnyama Limba RENEWAL
Leja CaldareraAustraliaElwin Sharvill NEW
Costa DilliardRussiaOnyama Limba NEGOTIATION
Munro FerenczItalyElwin Sharvill QUALIFIED
Octavia MaletJapanIoni Bowcher UNQUALIFIED
Misaki RoysterArgentinaBernardo Dominic QUALIFIED
Darci PoquetteFranceElwin Sharvill QUALIFIED
Salvatore StockhamAustraliaOnyama Limba NEW
Ashley DoeArgentinaXuxue Feng NEW
Clifford RimArgentinaIoni Bowcher QUALIFIED
Darci PoquetteJapanStephen Shaw NEW
Chavez BriddickCanadaElwin Sharvill PROPOSAL
James ButtSpainAmy Elsner NEGOTIATION
Darci PoquetteFranceIvan Magalhaes RENEWAL
Chavez BriddickArgentinaIvan Magalhaes UNQUALIFIED
Kaitlin OstroskyAustraliaIoni Bowcher QUALIFIED
Johnson SergiAustraliaAmy Elsner RENEWAL
Sinclair WaycottAustraliaAnna Fali QUALIFIED
Rodrigues CampainUnited KingdomBernardo Dominic RENEWAL
Murillo MaletRussiaAsiya Javayant NEW
James ButtRussiaOnyama Limba QUALIFIED
Adams MorascaCanadaIoni Bowcher PROPOSAL
Aruna FigeroaArgentinaXuxue Feng NEW
Mayumi KolmetzIndiaIoni Bowcher QUALIFIED
Antonio CaudyArgentinaAmy Elsner NEGOTIATION
Ashley DoeGermanyIvan Magalhaes RENEWAL
Deepesh ChuiAustraliaOnyama Limba NEW
Emily WhobreyBrazilIvan Magalhaes NEGOTIATION
Johnson SergiBrazilIvan Magalhaes PROPOSAL
Isabel BowleyJapanAnna Fali QUALIFIED
Octavia MaletGermanyAsiya Javayant RENEWAL
Mayumi KolmetzFranceOnyama Limba PROPOSAL
Emily WhobreyIndiaStephen Shaw NEW
Stacey MacleadIndiaBernardo Dominic NEW
Salvatore StockhamAustraliaAnna Fali QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Cody SaylorsItalyIvan Magalhaes UNQUALIFIED
Maria MarrierAustraliaElwin Sharvill NEGOTIATION
Faith GillianRussiaStephen Shaw RENEWAL
Jeanfrancois VenereSpainStephen Shaw PROPOSAL
Juan WieserRussiaElwin Sharvill RENEWAL
Aditya KuskoBrazilOnyama Limba QUALIFIED
Leja CaldareraArgentinaOnyama Limba UNQUALIFIED
Aruna FigeroaGermanyAmy Elsner NEGOTIATION
Ashley DoeCanadaAnna Fali PROPOSAL
Costa DilliardCanadaXuxue Feng UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Leon OldroydSpain2026-06-13Feltz Printing Service PROPOSAL31Amy Elsner
1001Chavez BriddickIndia2026-05-30Chemel, James L Cpa QUALIFIED41Amy Elsner
1002Jeanfrancois VenereAustralia2026-06-07Printing Dimensions NEW8Onyama Limba
1003Adams MorascaJapan2026-06-16Chanay, Jeffrey A Esq NEW75Elwin Sharvill
1004Salvatore StockhamUnited Kingdom2026-06-09Printing Dimensions RENEWAL3Stephen Shaw
1005Octavia MaletFrance2026-05-23King, Christopher A Esq QUALIFIED36Amy Elsner
1006Mujtaba NickaIndia2026-06-10Printing Dimensions PROPOSAL65Ivan Magalhaes
1007Ricardo GauchoIndia2026-05-26Chanay, Jeffrey A Esq QUALIFIED46Xuxue Feng
1008Costa DilliardArgentina2026-05-22Rousseaux, Michael Esq RENEWAL64Bernardo Dominic
1009Maisha RulapaughUnited Kingdom2026-06-12Buckley Miller Wright RENEWAL61Ioni Bowcher
1010Francesco ShinkoJapan2026-05-27Rangoni Of Florence PROPOSAL0Ioni Bowcher
1011Johnson SergiAustralia2026-06-02Rangoni Of Florence PROPOSAL72Amy Elsner
1012Ivar PaprockiArgentina2026-06-02Chapman, Ross E Esq UNQUALIFIED15Onyama Limba
1013Murillo MaletRussia2026-06-08Truhlar And Truhlar Attys NEW37Onyama Limba
1014Maria MarrierJapan2026-05-21King, Christopher A Esq PROPOSAL57Elwin Sharvill
1015Adams MorascaBrazil2026-06-01Chapman, Ross E Esq PROPOSAL97Xuxue Feng
1016Juan WieserAustralia2026-06-14Feiner Bros PROPOSAL59Onyama Limba
1017Silvio SlusarskiGermany2026-06-15Feltz Printing Service RENEWAL35Asiya Javayant
1018Ashley DoeRussia2026-05-24Rangoni Of Florence QUALIFIED77Bernardo Dominic
1019Aika InouyeSpain2026-05-23Morlong Associates RENEWAL58Onyama Limba
1020Ricardo GauchoSpain2026-05-25Feltz Printing Service QUALIFIED34Bernardo Dominic
1021Silvio SlusarskiItaly2026-05-24Chapman, Ross E Esq NEW29Bernardo Dominic
1022Tony FollerItaly2026-06-02Rousseaux, Michael Esq NEGOTIATION49Asiya Javayant
1023Kadeem FlosiUnited Kingdom2026-05-20Printing Dimensions QUALIFIED39Amy Elsner
1024Isabel BowleyItaly2026-06-08Truhlar And Truhlar Attys NEW45Amy Elsner
1025Maisha RulapaughFrance2026-06-09Chanay, Jeffrey A Esq RENEWAL60Ioni Bowcher
1026Darci PoquetteSpain2026-06-03King, Christopher A Esq NEGOTIATION22Asiya Javayant
1027Isabel BowleyUnited Kingdom2026-06-05Benton, John B Jr NEW75Elwin Sharvill
1028Francesco ShinkoItaly2026-06-16Rousseaux, Michael Esq UNQUALIFIED49Ioni Bowcher
1029Tony FollerGermany2026-06-12Dorl, James J Esq NEW42Onyama Limba
1030Costa DilliardRussia2026-06-02Rangoni Of Florence QUALIFIED64Xuxue Feng
1031Faith GillianRussia2026-06-02Chanay, Jeffrey A Esq RENEWAL12Onyama Limba
1032Maria MarrierSpain2026-05-18Buckley Miller Wright QUALIFIED62Bernardo Dominic
1033James ButtCanada2026-06-06Chanay, Jeffrey A Esq RENEWAL21Onyama Limba
1034Darci PoquetteSpain2026-06-12Rousseaux, Michael Esq NEGOTIATION67Elwin Sharvill
1035Arvin AlbaresItaly2026-05-31Truhlar And Truhlar Attys QUALIFIED40Stephen Shaw
1036Aruna FigeroaAustralia2026-06-03King, Christopher A Esq QUALIFIED96Asiya Javayant
1037Claire TollnerSpain2026-06-07Feltz Printing Service NEW49Elwin Sharvill
1038Chavez BriddickFrance2026-06-06Commercial Press NEW46Anna Fali
1039Mayumi KolmetzArgentina2026-05-25Feltz Printing Service UNQUALIFIED89Amy Elsner
1040Leja CaldareraCanada2026-05-26Truhlar And Truhlar Attys NEGOTIATION63Ivan Magalhaes
1041Maria MarrierSpain2026-05-28Chanay, Jeffrey A Esq NEW75Elwin Sharvill
1042Stacey MacleadBrazil2026-05-25Morlong Associates PROPOSAL48Stephen Shaw
1043Clifford RimCanada2026-06-13King, Christopher A Esq UNQUALIFIED71Asiya Javayant
1044Mayumi KolmetzFrance2026-06-16Buckley Miller Wright RENEWAL27Elwin Sharvill
1045Faith GillianGermany2026-06-10Chemel, James L Cpa PROPOSAL88Xuxue Feng
1046Chavez BriddickUnited Kingdom2026-06-10Feltz Printing Service NEGOTIATION4Onyama Limba
1047Jones VocelkaUnited Kingdom2026-06-04Dorl, James J Esq PROPOSAL60Xuxue Feng
1048Ricardo GauchoArgentina2026-06-04Feltz Printing Service QUALIFIED3Xuxue Feng
1049Ivar PaprockiCanada2026-06-03Rangoni Of Florence PROPOSAL7Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Stacey MacleadSpainAmy Elsner RENEWAL
Clifford RimArgentinaIvan Magalhaes NEGOTIATION
Leon OldroydRussiaIvan Magalhaes QUALIFIED
Deepesh ChuiArgentinaAmy Elsner RENEWAL
Izzy GarufiFranceXuxue Feng UNQUALIFIED
Arvin AlbaresAustraliaAsiya Javayant QUALIFIED
Juan WieserCanadaStephen Shaw NEGOTIATION
Arvin AlbaresAustraliaIvan Magalhaes NEW
Darci PoquetteCanadaBernardo Dominic QUALIFIED
Aditya KuskoAustraliaAnna Fali RENEWAL
Leja CaldareraSpainStephen Shaw RENEWAL
Francesco ShinkoArgentinaOnyama Limba PROPOSAL
Aditya KuskoRussiaElwin Sharvill PROPOSAL
Jefferson SchemmerCanadaBernardo Dominic PROPOSAL
Morrow RutaRussiaXuxue Feng NEGOTIATION
Munro FerenczRussiaElwin Sharvill NEGOTIATION
Misaki RoysterFranceOnyama Limba UNQUALIFIED
Jeanfrancois VenereJapanOnyama Limba NEW
David DarakjySpainStephen Shaw QUALIFIED
Cody SaylorsArgentinaStephen Shaw PROPOSAL
Faith GillianIndiaAmy Elsner PROPOSAL
Costa DilliardItalyElwin Sharvill NEW
Maria MarrierBrazilAmy Elsner PROPOSAL
Alejandro PerinJapanAmy Elsner QUALIFIED
Ashley DoeItalyBernardo Dominic NEW
Chavez BriddickGermanyIoni Bowcher QUALIFIED
David DarakjyCanadaAmy Elsner UNQUALIFIED
Morrow RutaItalyIvan Magalhaes PROPOSAL
Kadeem FlosiGermanyStephen Shaw RENEWAL
Smith GlickFranceOnyama Limba RENEWAL
Maria MarrierSpainOnyama Limba RENEWAL
Jennifer AmigonBrazilOnyama Limba UNQUALIFIED
Munro FerenczBrazilAnna Fali NEGOTIATION
Stacey MacleadFranceIoni Bowcher PROPOSAL
James ButtSpainStephen Shaw RENEWAL
Tony FollerBrazilXuxue Feng NEGOTIATION
Deepesh ChuiItalyIvan Magalhaes PROPOSAL
Rodrigues CampainSpainXuxue Feng UNQUALIFIED
Aditya KuskoCanadaOnyama Limba PROPOSAL
Octavia MaletCanadaAmy Elsner UNQUALIFIED
Maisha RulapaughBrazilIoni Bowcher NEGOTIATION
Rodrigues CampainSpainStephen Shaw NEW
Jefferson SchemmerRussiaAnna Fali PROPOSAL
Jeanfrancois VenereSpainElwin Sharvill PROPOSAL
Wickens NestleRussiaStephen Shaw PROPOSAL
Claire TollnerCanadaBernardo Dominic UNQUALIFIED
Jones VocelkaFranceAnna Fali UNQUALIFIED
Leja CaldareraArgentinaBernardo Dominic NEGOTIATION
Antonio CaudyRussiaAmy Elsner RENEWAL
Morrow RutaAustraliaElwin Sharvill UNQUALIFIED
Frozen Columns
Name
Chavez Briddick
Arvin Albares
Rodrigues Campain
Greenwood Bolognia
Kadeem Flosi
Misaki Royster
Mujtaba Nicka
Juan Wieser
Smith Glick
Izzy Garufi
Faith Gillian
Julie Stenseth
Aruna Figeroa
Misaki Royster
Faith Gillian
Emily Whobrey
Costa Dilliard
Emily Whobrey
Alejandro Perin
Murillo Malet
Deepesh Chui
Emily Whobrey
Costa Dilliard
Clifford Rim
Faith Gillian
Smith Glick
Ashley Doe
Leja Caldarera
Kadeem Flosi
Aruna Figeroa
Adams Morasca
David Darakjy
Ivar Paprocki
Faith Gillian
Isabel Bowley
Salvatore Stockham
Murillo Malet
Alejandro Perin
Misaki Royster
Morrow Ruta
Greenwood Bolognia
Izzy Garufi
Deepesh Chui
Wickens Nestle
Cody Saylors
James Butt
Ricardo Gaucho
Aruna Figeroa
Mayumi Kolmetz
Julie Stenseth
IdCountryDate
1000Italy2026-06-09
1001Germany2026-06-10
1002Japan2026-05-24
1003Germany2026-05-19
1004Italy2026-05-20
1005France2026-05-18
1006United Kingdom2026-06-05
1007Japan2026-06-15
1008Argentina2026-05-24
1009Spain2026-06-02
1010United Kingdom2026-05-28
1011Russia2026-05-25
1012Australia2026-06-14
1013Canada2026-06-08
1014France2026-05-18
1015Germany2026-05-25
1016Japan2026-06-16
1017Italy2026-05-30
1018Japan2026-06-05
1019Germany2026-06-11
1020United Kingdom2026-06-09
1021Brazil2026-05-26
1022Germany2026-06-09
1023Spain2026-06-03
1024Brazil2026-06-10
1025Spain2026-06-08
1026Argentina2026-06-13
1027France2026-05-19
1028Australia2026-05-18
1029Italy2026-06-03
1030Japan2026-06-02
1031India2026-05-31
1032France2026-06-09
1033India2026-06-07
1034Germany2026-05-28
1035India2026-05-25
1036Brazil2026-05-31
1037Germany2026-05-22
1038Germany2026-05-27
1039India2026-05-25
1040Italy2026-06-16
1041France2026-05-28
1042Germany2026-06-12
1043Japan2026-05-18
1044Canada2026-05-22
1045Russia2026-06-01
1046Australia2026-05-30
1047United Kingdom2026-05-28
1048Russia2026-06-13
1049Spain2026-06-04

On-Demand Data

NameIdCountryDate
Kadeem Flosi1000Argentina2026-06-08
Greenwood Bolognia1001United Kingdom2026-06-04
Isabel Bowley1002Russia2026-05-27
Arvin Albares1003Canada2026-05-21
Jones Vocelka1004Spain2026-06-09
Mayumi Kolmetz1005Australia2026-05-28
Ricardo Gaucho1006France2026-05-31
Juan Wieser1007Italy2026-06-03
Stacey Maclead1008Australia2026-05-19
David Darakjy1009Germany2026-05-21
Smith Glick1010Germany2026-06-12
Sinclair Waycott1011Argentina2026-05-23
Jones Vocelka1012Argentina2026-06-15
Isabel Bowley1013Brazil2026-06-03
Costa Dilliard1014United Kingdom2026-06-11
Stacey Maclead1015Argentina2026-05-23
Deepesh Chui1016Brazil2026-05-20
Ivar Paprocki1017Japan2026-06-14
Greenwood Bolognia1018Canada2026-06-09
Mayumi Kolmetz1019Japan2026-06-16
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Tony FollerIndiaOnyama Limba NEGOTIATION
Aruna FigeroaCanadaOnyama Limba UNQUALIFIED
Ashley DoeItalyBernardo Dominic PROPOSAL
Chavez BriddickArgentinaBernardo Dominic UNQUALIFIED
Aika InouyeGermanyAnna Fali NEW
Leja CaldareraUnited KingdomElwin Sharvill QUALIFIED
Darci PoquetteFranceAnna Fali RENEWAL
Tony FollerArgentinaOnyama Limba PROPOSAL
Darci PoquetteUnited KingdomOnyama Limba QUALIFIED
Kaitlin OstroskyRussiaAmy Elsner NEW
Smith GlickSpainIoni Bowcher NEGOTIATION
Mujtaba NickaCanadaIoni Bowcher UNQUALIFIED
Silvio SlusarskiIndiaBernardo Dominic QUALIFIED
Silvio SlusarskiItalyStephen Shaw NEGOTIATION
Adams MorascaCanadaAsiya Javayant NEW
Mujtaba NickaUnited KingdomOnyama Limba RENEWAL
Ashley DoeFranceAnna Fali QUALIFIED
Chavez BriddickCanadaIvan Magalhaes NEGOTIATION
Murillo MaletIndiaElwin Sharvill RENEWAL
Murillo MaletRussiaIvan Magalhaes NEGOTIATION
Chavez BriddickSpainElwin Sharvill QUALIFIED
Julie StensethBrazilXuxue Feng UNQUALIFIED
Wickens NestleItalyIvan Magalhaes PROPOSAL
Stacey MacleadIndiaStephen Shaw NEW
Sinclair WaycottItalyBernardo Dominic NEW
Rodrigues CampainFranceBernardo Dominic NEGOTIATION
Leja CaldareraBrazilXuxue Feng RENEWAL
Jeanfrancois VenereJapanXuxue Feng QUALIFIED
Octavia MaletSpainStephen Shaw UNQUALIFIED
Darci PoquetteBrazilIoni Bowcher NEW
Juan WieserJapanIoni Bowcher NEW
Munro FerenczItalyAmy Elsner NEGOTIATION
Wickens NestleUnited KingdomOnyama Limba NEGOTIATION
Emily WhobreyGermanyAsiya Javayant QUALIFIED
Salvatore StockhamAustraliaXuxue Feng NEGOTIATION
Murillo MaletArgentinaAmy Elsner QUALIFIED
Kaitlin OstroskyJapanXuxue Feng QUALIFIED
Nicolas IturbideUnited KingdomAnna Fali NEGOTIATION
Deepesh ChuiJapanElwin Sharvill UNQUALIFIED
Salvatore StockhamGermanyAmy Elsner 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>