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
Mayumi KolmetzBrazilAsiya Javayant PROPOSAL
Emily WhobreyFranceIoni Bowcher NEGOTIATION
Antonio CaudyGermanyOnyama Limba UNQUALIFIED
James ButtGermanyAnna Fali UNQUALIFIED
Jones VocelkaItalyElwin Sharvill RENEWAL
Antonio CaudyGermanyIvan Magalhaes RENEWAL
Murillo MaletIndiaIoni Bowcher NEGOTIATION
Juan WieserJapanIvan Magalhaes NEW
Mayumi KolmetzIndiaElwin Sharvill UNQUALIFIED
Octavia MaletUnited KingdomAnna Fali NEW
Ricardo GauchoSpainXuxue Feng QUALIFIED
Ricardo GauchoArgentinaIvan Magalhaes PROPOSAL
Munro FerenczJapanXuxue Feng NEW
Wickens NestleFranceAnna Fali RENEWAL
Nicolas IturbideSpainIoni Bowcher RENEWAL
Stacey MacleadArgentinaXuxue Feng NEW
Sinclair WaycottRussiaAnna Fali NEGOTIATION
Silvio SlusarskiBrazilElwin Sharvill UNQUALIFIED
Rodrigues CampainArgentinaIoni Bowcher QUALIFIED
Nicolas IturbideIndiaAmy Elsner PROPOSAL
Kadeem FlosiIndiaStephen Shaw UNQUALIFIED
Ricardo GauchoCanadaElwin Sharvill UNQUALIFIED
Mujtaba NickaSpainIvan Magalhaes QUALIFIED
Izzy GarufiGermanyIvan Magalhaes QUALIFIED
Ivar PaprockiUnited KingdomAmy Elsner UNQUALIFIED
Leon OldroydItalyElwin Sharvill UNQUALIFIED
Chavez BriddickArgentinaElwin Sharvill QUALIFIED
Mujtaba NickaArgentinaAsiya Javayant NEGOTIATION
Morrow RutaAustraliaIoni Bowcher NEGOTIATION
Maria MarrierUnited KingdomAmy Elsner NEGOTIATION
Nicolas IturbideBrazilOnyama Limba QUALIFIED
Smith GlickItalyAmy Elsner QUALIFIED
Silvio SlusarskiJapanBernardo Dominic QUALIFIED
Jones VocelkaRussiaOnyama Limba QUALIFIED
Sinclair WaycottSpainIvan Magalhaes NEGOTIATION
Misaki RoysterCanadaAnna Fali PROPOSAL
Alejandro PerinBrazilIoni Bowcher RENEWAL
Kadeem FlosiArgentinaBernardo Dominic NEW
Sinclair WaycottJapanIoni Bowcher UNQUALIFIED
Leja CaldareraJapanAmy Elsner NEGOTIATION
Izzy GarufiCanadaOnyama Limba PROPOSAL
Adams MorascaItalyAmy Elsner NEW
Chavez BriddickBrazilAnna Fali RENEWAL
Aditya KuskoIndiaStephen Shaw QUALIFIED
Silvio SlusarskiIndiaAsiya Javayant QUALIFIED
Antonio CaudyItalyAmy Elsner RENEWAL
Cody SaylorsBrazilIvan Magalhaes NEW
Johnson SergiRussiaBernardo Dominic QUALIFIED
Aditya KuskoIndiaAnna Fali NEW
Jones VocelkaIndiaAnna Fali PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Jefferson SchemmerAustraliaElwin Sharvill RENEWAL
Jennifer AmigonFranceIvan Magalhaes QUALIFIED
Chavez BriddickIndiaAsiya Javayant QUALIFIED
Chavez BriddickBrazilElwin Sharvill PROPOSAL
Salvatore StockhamJapanStephen Shaw RENEWAL
Octavia MaletAustraliaOnyama Limba UNQUALIFIED
Julie StensethFranceXuxue Feng QUALIFIED
Jennifer AmigonRussiaIoni Bowcher RENEWAL
Mayumi KolmetzRussiaXuxue Feng NEGOTIATION
Costa DilliardJapanXuxue Feng QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Sinclair WaycottItaly2026-04-11Feltz Printing Service NEGOTIATION20Xuxue Feng
1001Cody SaylorsCanada2026-04-08Chanay, Jeffrey A Esq NEGOTIATION33Ioni Bowcher
1002Adams MorascaFrance2026-04-22Feiner Bros UNQUALIFIED87Anna Fali
1003Maria MarrierJapan2026-04-17Rangoni Of Florence QUALIFIED82Xuxue Feng
1004Ashley DoeRussia2026-04-14Feltz Printing Service UNQUALIFIED92Asiya Javayant
1005Salvatore StockhamAustralia2026-04-05Rangoni Of Florence UNQUALIFIED19Onyama Limba
1006Adams MorascaCanada2026-04-21Benton, John B Jr QUALIFIED65Xuxue Feng
1007Arvin AlbaresGermany2026-04-30Rangoni Of Florence PROPOSAL88Stephen Shaw
1008Leja CaldareraCanada2026-04-10Chemel, James L Cpa QUALIFIED46Ioni Bowcher
1009Maisha RulapaughAustralia2026-04-08Buckley Miller Wright QUALIFIED48Ioni Bowcher
1010Adams MorascaCanada2026-04-09Commercial Press NEGOTIATION53Anna Fali
1011David DarakjyJapan2026-04-26Feltz Printing Service PROPOSAL52Stephen Shaw
1012Silvio SlusarskiItaly2026-04-27Feltz Printing Service RENEWAL71Asiya Javayant
1013Morrow RutaCanada2026-04-15Morlong Associates RENEWAL70Onyama Limba
1014Sinclair WaycottJapan2026-04-09Printing Dimensions UNQUALIFIED56Anna Fali
1015Jefferson SchemmerJapan2026-04-06Rangoni Of Florence NEW1Anna Fali
1016Greenwood BologniaSpain2026-04-08Benton, John B Jr UNQUALIFIED28Bernardo Dominic
1017Claire TollnerJapan2026-04-11Chemel, James L Cpa NEW19Asiya Javayant
1018Arvin AlbaresIndia2026-04-22Morlong Associates PROPOSAL41Anna Fali
1019Jennifer AmigonAustralia2026-04-12Feiner Bros NEGOTIATION29Elwin Sharvill
1020Murillo MaletJapan2026-04-30Buckley Miller Wright QUALIFIED5Amy Elsner
1021Murillo MaletFrance2026-04-20Rangoni Of Florence NEW29Bernardo Dominic
1022Jefferson SchemmerAustralia2026-04-06Chanay, Jeffrey A Esq RENEWAL86Anna Fali
1023Aditya KuskoBrazil2026-04-29Rousseaux, Michael Esq QUALIFIED85Amy Elsner
1024Morrow RutaRussia2026-04-03Dorl, James J Esq NEGOTIATION82Asiya Javayant
1025Misaki RoysterSpain2026-04-28Morlong Associates NEW59Ioni Bowcher
1026Cody SaylorsSpain2026-05-02Truhlar And Truhlar Attys PROPOSAL56Elwin Sharvill
1027Sinclair WaycottItaly2026-05-01Rousseaux, Michael Esq RENEWAL88Onyama Limba
1028Smith GlickBrazil2026-04-03Truhlar And Truhlar Attys RENEWAL20Asiya Javayant
1029Stacey MacleadBrazil2026-04-15Truhlar And Truhlar Attys PROPOSAL11Ioni Bowcher
1030Jefferson SchemmerGermany2026-04-08Chemel, James L Cpa UNQUALIFIED28Onyama Limba
1031Wickens NestleFrance2026-04-19Morlong Associates UNQUALIFIED31Stephen Shaw
1032Johnson SergiItaly2026-04-11Feiner Bros NEGOTIATION15Xuxue Feng
1033Jefferson SchemmerIndia2026-04-12Rangoni Of Florence UNQUALIFIED52Ioni Bowcher
1034Adams MorascaRussia2026-04-15Feiner Bros UNQUALIFIED46Stephen Shaw
1035Greenwood BologniaAustralia2026-04-21Rangoni Of Florence UNQUALIFIED32Xuxue Feng
1036Julie StensethItaly2026-04-24Chanay, Jeffrey A Esq QUALIFIED48Ioni Bowcher
1037Julie StensethItaly2026-04-30Chanay, Jeffrey A Esq PROPOSAL18Anna Fali
1038Clifford RimRussia2026-04-10Feltz Printing Service UNQUALIFIED53Ivan Magalhaes
1039Cody SaylorsItaly2026-04-04Chanay, Jeffrey A Esq PROPOSAL98Stephen Shaw
1040James ButtSpain2026-04-05Chapman, Ross E Esq NEW51Onyama Limba
1041Stacey MacleadGermany2026-04-21Rousseaux, Michael Esq UNQUALIFIED68Bernardo Dominic
1042David DarakjyRussia2026-04-19King, Christopher A Esq NEGOTIATION5Asiya Javayant
1043Kadeem FlosiSpain2026-05-01Feiner Bros UNQUALIFIED14Onyama Limba
1044Aruna FigeroaCanada2026-05-02Commercial Press UNQUALIFIED57Asiya Javayant
1045Francesco ShinkoArgentina2026-04-21Chemel, James L Cpa NEW71Bernardo Dominic
1046Maisha RulapaughItaly2026-04-18King, Christopher A Esq PROPOSAL40Onyama Limba
1047Jennifer AmigonItaly2026-04-08Rousseaux, Michael Esq UNQUALIFIED41Ioni Bowcher
1048Clifford RimSpain2026-04-09Morlong Associates PROPOSAL7Ivan Magalhaes
1049Claire TollnerArgentina2026-04-23King, Christopher A Esq NEGOTIATION75Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Adams MorascaCanadaAnna Fali NEW
Aruna FigeroaFranceBernardo Dominic RENEWAL
Aditya KuskoFranceElwin Sharvill NEW
Deepesh ChuiJapanOnyama Limba NEGOTIATION
Nicolas IturbideBrazilXuxue Feng NEW
Wickens NestleFranceIvan Magalhaes RENEWAL
Adams MorascaRussiaStephen Shaw PROPOSAL
Kaitlin OstroskyRussiaAmy Elsner NEGOTIATION
Johnson SergiIndiaIoni Bowcher PROPOSAL
Maria MarrierCanadaAnna Fali PROPOSAL
Leon OldroydJapanStephen Shaw QUALIFIED
Murillo MaletArgentinaXuxue Feng NEGOTIATION
Rodrigues CampainRussiaOnyama Limba PROPOSAL
Sinclair WaycottItalyAnna Fali RENEWAL
Aditya KuskoArgentinaAnna Fali RENEWAL
Deepesh ChuiIndiaAsiya Javayant UNQUALIFIED
Morrow RutaIndiaIvan Magalhaes UNQUALIFIED
Jeanfrancois VenereCanadaIoni Bowcher NEW
Ashley DoeJapanAmy Elsner PROPOSAL
Darci PoquetteGermanyAnna Fali NEGOTIATION
Costa DilliardItalyElwin Sharvill RENEWAL
Aika InouyeGermanyAnna Fali PROPOSAL
Silvio SlusarskiSpainBernardo Dominic NEW
Jones VocelkaJapanXuxue Feng NEGOTIATION
Ricardo GauchoFranceOnyama Limba QUALIFIED
Rodrigues CampainArgentinaXuxue Feng NEW
Claire TollnerBrazilIvan Magalhaes QUALIFIED
Ricardo GauchoAustraliaElwin Sharvill RENEWAL
Maria MarrierRussiaIoni Bowcher RENEWAL
Munro FerenczSpainXuxue Feng RENEWAL
Ivar PaprockiAustraliaAsiya Javayant UNQUALIFIED
Clifford RimAustraliaAnna Fali NEGOTIATION
Aika InouyeIndiaElwin Sharvill PROPOSAL
Aruna FigeroaUnited KingdomOnyama Limba UNQUALIFIED
Smith GlickSpainStephen Shaw NEW
Aika InouyeIndiaAsiya Javayant PROPOSAL
Darci PoquetteArgentinaStephen Shaw PROPOSAL
Arvin AlbaresArgentinaStephen Shaw QUALIFIED
James ButtArgentinaXuxue Feng UNQUALIFIED
Darci PoquetteGermanyAsiya Javayant RENEWAL
Chavez BriddickJapanAmy Elsner NEGOTIATION
Jeanfrancois VenereSpainBernardo Dominic QUALIFIED
Ricardo GauchoSpainXuxue Feng QUALIFIED
Jones VocelkaArgentinaOnyama Limba PROPOSAL
Alejandro PerinCanadaAmy Elsner PROPOSAL
Sinclair WaycottSpainIvan Magalhaes UNQUALIFIED
David DarakjyIndiaStephen Shaw NEGOTIATION
Francesco ShinkoBrazilIoni Bowcher QUALIFIED
Nicolas IturbideItalyAnna Fali QUALIFIED
Darci PoquetteAustraliaIoni Bowcher NEW
Frozen Columns
Name
Nicolas Iturbide
Nicolas Iturbide
Juan Wieser
Octavia Malet
Morrow Ruta
Jones Vocelka
Cody Saylors
Mayumi Kolmetz
Ricardo Gaucho
Nicolas Iturbide
Emily Whobrey
Jefferson Schemmer
Kadeem Flosi
Munro Ferencz
Morrow Ruta
Morrow Ruta
Izzy Garufi
Costa Dilliard
Misaki Royster
Ashley Doe
Julie Stenseth
Nicolas Iturbide
Greenwood Bolognia
Leon Oldroyd
Jefferson Schemmer
Maisha Rulapaugh
Murillo Malet
Maria Marrier
Maria Marrier
Cody Saylors
Chavez Briddick
Murillo Malet
Isabel Bowley
Ashley Doe
Darci Poquette
Murillo Malet
Isabel Bowley
Murillo Malet
Rodrigues Campain
Kaitlin Ostrosky
Clifford Rim
Leon Oldroyd
Stacey Maclead
Juan Wieser
Izzy Garufi
Aditya Kusko
Jennifer Amigon
Wickens Nestle
Adams Morasca
Aruna Figeroa
IdCountryDate
1000India2026-04-24
1001Italy2026-04-12
1002Argentina2026-05-02
1003Australia2026-05-02
1004Germany2026-04-11
1005Canada2026-04-28
1006Brazil2026-04-15
1007Germany2026-04-08
1008Argentina2026-04-17
1009Australia2026-04-14
1010Australia2026-04-27
1011Canada2026-04-25
1012Canada2026-04-24
1013Japan2026-04-28
1014Canada2026-04-11
1015India2026-04-06
1016Australia2026-04-28
1017France2026-04-13
1018Argentina2026-04-12
1019Brazil2026-04-07
1020Australia2026-04-13
1021United Kingdom2026-04-21
1022Brazil2026-04-08
1023Japan2026-04-29
1024India2026-04-12
1025France2026-04-28
1026Australia2026-04-16
1027India2026-04-07
1028France2026-04-28
1029Argentina2026-04-10
1030Canada2026-04-27
1031Brazil2026-04-22
1032Brazil2026-04-28
1033Russia2026-04-03
1034India2026-04-25
1035India2026-04-21
1036Australia2026-04-21
1037Spain2026-04-04
1038United Kingdom2026-04-06
1039Brazil2026-04-15
1040Germany2026-04-27
1041Russia2026-04-05
1042United Kingdom2026-04-29
1043India2026-04-15
1044Germany2026-04-22
1045Argentina2026-04-20
1046Italy2026-04-13
1047Spain2026-04-15
1048Brazil2026-04-08
1049Germany2026-04-28

On-Demand Data

NameIdCountryDate
James Butt1000Brazil2026-04-25
James Butt1001France2026-04-27
Antonio Caudy1002United Kingdom2026-04-20
Alejandro Perin1003Italy2026-04-08
Alejandro Perin1004Japan2026-04-29
Salvatore Stockham1005India2026-04-23
Mayumi Kolmetz1006Australia2026-04-04
Jeanfrancois Venere1007India2026-04-18
Arvin Albares1008France2026-04-09
Johnson Sergi1009Italy2026-04-13
Costa Dilliard1010Germany2026-04-26
Silvio Slusarski1011Brazil2026-04-29
Francesco Shinko1012France2026-04-08
Kadeem Flosi1013Spain2026-04-28
Johnson Sergi1014United Kingdom2026-04-10
Ashley Doe1015Germany2026-04-23
Sinclair Waycott1016Russia2026-04-18
Chavez Briddick1017India2026-04-10
Aruna Figeroa1018India2026-04-23
Kaitlin Ostrosky1019Germany2026-04-21
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Izzy GarufiArgentinaAmy Elsner RENEWAL
Costa DilliardBrazilAsiya Javayant RENEWAL
Leja CaldareraGermanyAnna Fali NEGOTIATION
Rodrigues CampainSpainStephen Shaw NEGOTIATION
Jefferson SchemmerCanadaStephen Shaw UNQUALIFIED
Leon OldroydItalyBernardo Dominic QUALIFIED
Munro FerenczFranceBernardo Dominic QUALIFIED
Julie StensethCanadaStephen Shaw RENEWAL
Aruna FigeroaAustraliaAsiya Javayant NEGOTIATION
Ashley DoeFranceXuxue Feng RENEWAL
Costa DilliardCanadaStephen Shaw NEGOTIATION
Mujtaba NickaUnited KingdomOnyama Limba QUALIFIED
Rodrigues CampainAustraliaOnyama Limba NEGOTIATION
Munro FerenczRussiaXuxue Feng RENEWAL
Misaki RoysterUnited KingdomXuxue Feng QUALIFIED
Aruna FigeroaAustraliaElwin Sharvill QUALIFIED
David DarakjyItalyStephen Shaw NEGOTIATION
Maisha RulapaughUnited KingdomStephen Shaw PROPOSAL
Murillo MaletJapanAnna Fali UNQUALIFIED
Misaki RoysterBrazilAsiya Javayant RENEWAL
Jennifer AmigonFranceXuxue Feng PROPOSAL
Mujtaba NickaItalyXuxue Feng NEGOTIATION
Kaitlin OstroskyFranceElwin Sharvill UNQUALIFIED
Emily WhobreyArgentinaAmy Elsner QUALIFIED
Costa DilliardBrazilOnyama Limba PROPOSAL
Kadeem FlosiSpainAsiya Javayant PROPOSAL
Salvatore StockhamGermanyElwin Sharvill RENEWAL
Leon OldroydRussiaXuxue Feng PROPOSAL
Octavia MaletGermanyXuxue Feng NEW
Juan WieserArgentinaXuxue Feng NEGOTIATION
Maisha RulapaughRussiaIoni Bowcher RENEWAL
Emily WhobreyRussiaIoni Bowcher RENEWAL
Johnson SergiIndiaAmy Elsner PROPOSAL
Octavia MaletBrazilStephen Shaw NEW
Costa DilliardCanadaElwin Sharvill NEW
Chavez BriddickAustraliaIoni Bowcher UNQUALIFIED
Nicolas IturbideIndiaElwin Sharvill RENEWAL
Francesco ShinkoFranceAnna Fali PROPOSAL
Mujtaba NickaArgentinaStephen Shaw QUALIFIED
Mujtaba NickaBrazilIoni Bowcher 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>