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 MaletRussiaAnna Fali PROPOSAL
Misaki RoysterUnited KingdomOnyama Limba UNQUALIFIED
Ashley DoeGermanyStephen Shaw NEW
Tony FollerItalyOnyama Limba PROPOSAL
Jefferson SchemmerGermanyElwin Sharvill UNQUALIFIED
Jones VocelkaIndiaAsiya Javayant NEW
Wickens NestleUnited KingdomStephen Shaw QUALIFIED
Johnson SergiFranceAmy Elsner PROPOSAL
Sinclair WaycottGermanyIoni Bowcher NEW
Jennifer AmigonBrazilIvan Magalhaes PROPOSAL
Costa DilliardJapanXuxue Feng QUALIFIED
David DarakjyBrazilOnyama Limba QUALIFIED
Mayumi KolmetzCanadaAmy Elsner PROPOSAL
Morrow RutaIndiaXuxue Feng UNQUALIFIED
Mayumi KolmetzCanadaAsiya Javayant RENEWAL
Adams MorascaIndiaIoni Bowcher PROPOSAL
Ivar PaprockiRussiaAsiya Javayant NEGOTIATION
Aruna FigeroaGermanyBernardo Dominic QUALIFIED
Wickens NestleUnited KingdomXuxue Feng NEGOTIATION
Munro FerenczCanadaIvan Magalhaes QUALIFIED
Emily WhobreyGermanyBernardo Dominic PROPOSAL
Claire TollnerBrazilAmy Elsner UNQUALIFIED
Jones VocelkaSpainAmy Elsner NEW
Deepesh ChuiUnited KingdomStephen Shaw QUALIFIED
Clifford RimRussiaIvan Magalhaes PROPOSAL
Kaitlin OstroskyBrazilAmy Elsner QUALIFIED
Aditya KuskoUnited KingdomStephen Shaw RENEWAL
Aditya KuskoSpainXuxue Feng UNQUALIFIED
Rodrigues CampainSpainAnna Fali NEGOTIATION
Johnson SergiFranceXuxue Feng PROPOSAL
Jeanfrancois VenereRussiaIvan Magalhaes PROPOSAL
Juan WieserIndiaIoni Bowcher RENEWAL
David DarakjyCanadaAsiya Javayant NEGOTIATION
Murillo MaletRussiaXuxue Feng UNQUALIFIED
James ButtItalyElwin Sharvill NEGOTIATION
Ricardo GauchoIndiaIoni Bowcher PROPOSAL
Salvatore StockhamArgentinaIvan Magalhaes QUALIFIED
James ButtArgentinaAmy Elsner NEW
Johnson SergiCanadaOnyama Limba PROPOSAL
Salvatore StockhamFranceAnna Fali QUALIFIED
Juan WieserUnited KingdomOnyama Limba QUALIFIED
Antonio CaudySpainAmy Elsner UNQUALIFIED
Aika InouyeGermanyAsiya Javayant UNQUALIFIED
Ashley DoeGermanyBernardo Dominic NEW
Maisha RulapaughRussiaAsiya Javayant UNQUALIFIED
Sinclair WaycottAustraliaOnyama Limba RENEWAL
Misaki RoysterItalyXuxue Feng NEW
David DarakjyAustraliaBernardo Dominic QUALIFIED
Jennifer AmigonSpainStephen Shaw UNQUALIFIED
Ashley DoeItalyAmy Elsner UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Ivar PaprockiSpainAsiya Javayant NEGOTIATION
Johnson SergiUnited KingdomOnyama Limba PROPOSAL
David DarakjyRussiaAmy Elsner UNQUALIFIED
Maria MarrierCanadaElwin Sharvill QUALIFIED
Claire TollnerItalyAnna Fali RENEWAL
Kadeem FlosiJapanIvan Magalhaes PROPOSAL
Alejandro PerinIndiaBernardo Dominic UNQUALIFIED
Isabel BowleyIndiaElwin Sharvill NEW
Isabel BowleyBrazilAsiya Javayant NEW
Nicolas IturbideUnited KingdomXuxue Feng UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Emily WhobreyItaly2025-08-06Commercial Press QUALIFIED0Xuxue Feng
1001Jefferson SchemmerGermany2025-07-30Rangoni Of Florence NEW45Onyama Limba
1002Faith GillianArgentina2025-08-12Truhlar And Truhlar Attys QUALIFIED68Asiya Javayant
1003Kadeem FlosiJapan2025-08-07Chemel, James L Cpa PROPOSAL62Anna Fali
1004David DarakjyBrazil2025-08-02Morlong Associates NEGOTIATION6Onyama Limba
1005Munro FerenczIndia2025-08-06Chapman, Ross E Esq PROPOSAL30Ivan Magalhaes
1006Sinclair WaycottIndia2025-08-02Truhlar And Truhlar Attys UNQUALIFIED10Asiya Javayant
1007Silvio SlusarskiUnited Kingdom2025-08-07Dorl, James J Esq QUALIFIED79Asiya Javayant
1008Aditya KuskoJapan2025-07-26Feiner Bros NEGOTIATION84Anna Fali
1009Murillo MaletItaly2025-07-23Dorl, James J Esq RENEWAL25Stephen Shaw
1010Jeanfrancois VenereUnited Kingdom2025-07-20Chanay, Jeffrey A Esq QUALIFIED64Asiya Javayant
1011Rodrigues CampainUnited Kingdom2025-08-17Feltz Printing Service QUALIFIED56Asiya Javayant
1012Isabel BowleyItaly2025-07-28Commercial Press QUALIFIED61Asiya Javayant
1013Costa DilliardGermany2025-07-22Buckley Miller Wright UNQUALIFIED52Stephen Shaw
1014Greenwood BologniaSpain2025-08-11Rousseaux, Michael Esq UNQUALIFIED51Elwin Sharvill
1015Aika InouyeGermany2025-08-11Rousseaux, Michael Esq QUALIFIED98Amy Elsner
1016Jennifer AmigonItaly2025-07-31Buckley Miller Wright NEW97Bernardo Dominic
1017Antonio CaudyRussia2025-07-26Printing Dimensions NEGOTIATION91Onyama Limba
1018Salvatore StockhamBrazil2025-07-30Rousseaux, Michael Esq NEW23Ioni Bowcher
1019Tony FollerRussia2025-08-01Feltz Printing Service UNQUALIFIED94Anna Fali
1020Jones VocelkaItaly2025-08-10Rousseaux, Michael Esq NEGOTIATION83Anna Fali
1021Munro FerenczItaly2025-08-17Truhlar And Truhlar Attys PROPOSAL50Anna Fali
1022Munro FerenczRussia2025-07-28Rousseaux, Michael Esq UNQUALIFIED23Onyama Limba
1023David DarakjyBrazil2025-07-30Benton, John B Jr QUALIFIED95Xuxue Feng
1024Nicolas IturbideCanada2025-08-01Morlong Associates PROPOSAL27Ioni Bowcher
1025Maisha RulapaughIndia2025-08-16Rousseaux, Michael Esq NEW66Onyama Limba
1026Antonio CaudyCanada2025-08-12Truhlar And Truhlar Attys UNQUALIFIED16Bernardo Dominic
1027Aruna FigeroaJapan2025-08-01Rousseaux, Michael Esq RENEWAL59Bernardo Dominic
1028Kadeem FlosiCanada2025-07-23Dorl, James J Esq PROPOSAL3Asiya Javayant
1029Emily WhobreyCanada2025-08-17Benton, John B Jr PROPOSAL9Stephen Shaw
1030Morrow RutaFrance2025-07-31Buckley Miller Wright QUALIFIED63Ioni Bowcher
1031Rodrigues CampainAustralia2025-08-12Chanay, Jeffrey A Esq NEGOTIATION82Ivan Magalhaes
1032Darci PoquetteRussia2025-08-06Commercial Press UNQUALIFIED89Anna Fali
1033Maria MarrierCanada2025-07-27Feltz Printing Service PROPOSAL30Ivan Magalhaes
1034Murillo MaletUnited Kingdom2025-08-14Morlong Associates NEGOTIATION74Amy Elsner
1035Jeanfrancois VenereFrance2025-07-20Benton, John B Jr NEGOTIATION59Asiya Javayant
1036Costa DilliardJapan2025-07-28Commercial Press RENEWAL44Anna Fali
1037Silvio SlusarskiUnited Kingdom2025-07-31Morlong Associates RENEWAL33Ioni Bowcher
1038Costa DilliardRussia2025-08-09Truhlar And Truhlar Attys RENEWAL4Ioni Bowcher
1039Smith GlickCanada2025-07-24Feiner Bros QUALIFIED14Xuxue Feng
1040Misaki RoysterArgentina2025-08-14Chemel, James L Cpa NEGOTIATION27Asiya Javayant
1041Faith GillianCanada2025-07-23Feiner Bros NEGOTIATION61Asiya Javayant
1042David DarakjyCanada2025-08-07Printing Dimensions PROPOSAL47Asiya Javayant
1043Ricardo GauchoRussia2025-08-02Chanay, Jeffrey A Esq QUALIFIED81Ivan Magalhaes
1044Maria MarrierItaly2025-08-15Chemel, James L Cpa UNQUALIFIED69Elwin Sharvill
1045Jeanfrancois VenereBrazil2025-07-30Printing Dimensions QUALIFIED46Elwin Sharvill
1046Salvatore StockhamCanada2025-07-30Rousseaux, Michael Esq UNQUALIFIED86Stephen Shaw
1047Isabel BowleyGermany2025-07-29King, Christopher A Esq QUALIFIED22Onyama Limba
1048Maria MarrierSpain2025-07-29Buckley Miller Wright QUALIFIED99Ivan Magalhaes
1049Octavia MaletGermany2025-07-29Commercial Press QUALIFIED30Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
David DarakjyJapanAsiya Javayant UNQUALIFIED
Munro FerenczJapanAsiya Javayant PROPOSAL
Misaki RoysterIndiaIoni Bowcher UNQUALIFIED
Greenwood BologniaSpainElwin Sharvill RENEWAL
Mayumi KolmetzFranceOnyama Limba NEW
David DarakjySpainIoni Bowcher NEW
Cody SaylorsRussiaStephen Shaw NEW
Deepesh ChuiIndiaIvan Magalhaes UNQUALIFIED
Clifford RimBrazilAsiya Javayant NEGOTIATION
Juan WieserFranceStephen Shaw RENEWAL
Leon OldroydItalyAnna Fali UNQUALIFIED
Morrow RutaRussiaAmy Elsner QUALIFIED
Adams MorascaBrazilAsiya Javayant PROPOSAL
Isabel BowleyRussiaIoni Bowcher NEGOTIATION
Deepesh ChuiCanadaElwin Sharvill PROPOSAL
David DarakjyAustraliaAnna Fali PROPOSAL
Aditya KuskoSpainBernardo Dominic NEGOTIATION
Johnson SergiFranceAsiya Javayant QUALIFIED
Arvin AlbaresSpainAnna Fali PROPOSAL
Murillo MaletUnited KingdomIoni Bowcher QUALIFIED
Mujtaba NickaSpainOnyama Limba NEGOTIATION
Leon OldroydUnited KingdomXuxue Feng RENEWAL
Morrow RutaFranceIvan Magalhaes NEGOTIATION
Costa DilliardBrazilOnyama Limba QUALIFIED
Mujtaba NickaArgentinaIoni Bowcher UNQUALIFIED
Rodrigues CampainArgentinaOnyama Limba UNQUALIFIED
Darci PoquetteItalyElwin Sharvill PROPOSAL
Aditya KuskoArgentinaAsiya Javayant UNQUALIFIED
Wickens NestleRussiaXuxue Feng RENEWAL
Silvio SlusarskiAustraliaAnna Fali PROPOSAL
Maisha RulapaughJapanIoni Bowcher UNQUALIFIED
Tony FollerRussiaAmy Elsner QUALIFIED
Johnson SergiUnited KingdomAsiya Javayant UNQUALIFIED
Mayumi KolmetzGermanyIoni Bowcher QUALIFIED
Jones VocelkaIndiaAnna Fali UNQUALIFIED
Ivar PaprockiUnited KingdomAsiya Javayant NEW
Alejandro PerinIndiaAmy Elsner NEGOTIATION
Octavia MaletRussiaAmy Elsner PROPOSAL
Ashley DoeGermanyAmy Elsner RENEWAL
Cody SaylorsIndiaAnna Fali NEGOTIATION
Tony FollerArgentinaElwin Sharvill NEW
David DarakjyGermanyAmy Elsner RENEWAL
Aika InouyeSpainIvan Magalhaes QUALIFIED
Munro FerenczJapanIoni Bowcher NEGOTIATION
Adams MorascaIndiaStephen Shaw UNQUALIFIED
Kadeem FlosiJapanAsiya Javayant RENEWAL
Jennifer AmigonJapanStephen Shaw PROPOSAL
Jones VocelkaItalyAmy Elsner NEW
Silvio SlusarskiFranceElwin Sharvill NEGOTIATION
Jennifer AmigonAustraliaIvan Magalhaes PROPOSAL
Frozen Columns
Name
Murillo Malet
Kaitlin Ostrosky
Rodrigues Campain
Ashley Doe
Johnson Sergi
Leja Caldarera
Sinclair Waycott
Kaitlin Ostrosky
Chavez Briddick
Nicolas Iturbide
Jennifer Amigon
Emily Whobrey
Johnson Sergi
Maisha Rulapaugh
Cody Saylors
Leja Caldarera
Aruna Figeroa
Emily Whobrey
Morrow Ruta
Kadeem Flosi
Leon Oldroyd
Silvio Slusarski
Arvin Albares
Chavez Briddick
Maisha Rulapaugh
Alejandro Perin
Kaitlin Ostrosky
Smith Glick
Sinclair Waycott
Isabel Bowley
Wickens Nestle
Murillo Malet
Smith Glick
Mayumi Kolmetz
Faith Gillian
Maisha Rulapaugh
Deepesh Chui
Aika Inouye
Ricardo Gaucho
Kaitlin Ostrosky
Darci Poquette
Jones Vocelka
Ricardo Gaucho
Cody Saylors
Sinclair Waycott
Ashley Doe
Aika Inouye
Darci Poquette
Jennifer Amigon
Deepesh Chui
IdCountryDate
1000Japan2025-08-07
1001Argentina2025-08-14
1002Germany2025-08-16
1003Japan2025-07-28
1004Spain2025-07-31
1005Japan2025-07-26
1006Germany2025-08-06
1007Argentina2025-08-05
1008Canada2025-08-15
1009Brazil2025-08-14
1010Brazil2025-08-01
1011Australia2025-08-14
1012India2025-07-25
1013France2025-08-15
1014Brazil2025-08-09
1015Spain2025-08-10
1016Spain2025-08-07
1017Italy2025-07-20
1018United Kingdom2025-07-31
1019Argentina2025-07-30
1020Germany2025-07-25
1021Italy2025-08-02
1022Brazil2025-07-29
1023United Kingdom2025-08-03
1024Russia2025-08-03
1025Australia2025-08-07
1026Australia2025-08-01
1027India2025-08-08
1028Russia2025-07-23
1029Japan2025-08-01
1030United Kingdom2025-08-17
1031United Kingdom2025-07-21
1032Russia2025-08-04
1033United Kingdom2025-07-30
1034Japan2025-08-16
1035India2025-07-31
1036France2025-07-24
1037United Kingdom2025-08-11
1038Russia2025-07-26
1039India2025-07-31
1040Brazil2025-07-22
1041Canada2025-08-15
1042India2025-08-07
1043United Kingdom2025-07-29
1044France2025-08-05
1045Spain2025-07-21
1046United Kingdom2025-08-01
1047Japan2025-08-03
1048Spain2025-08-06
1049Russia2025-08-04

On-Demand Data

NameIdCountryDate
Leja Caldarera1000Russia2025-07-24
Ashley Doe1001India2025-08-12
Antonio Caudy1002Argentina2025-07-22
Ivar Paprocki1003Australia2025-07-30
Jefferson Schemmer1004India2025-07-26
Aika Inouye1005United Kingdom2025-08-09
Salvatore Stockham1006India2025-08-08
Chavez Briddick1007Japan2025-08-07
Greenwood Bolognia1008Italy2025-07-29
Cody Saylors1009Russia2025-07-20
Costa Dilliard1010France2025-08-06
Johnson Sergi1011Argentina2025-08-03
Jeanfrancois Venere1012India2025-08-09
David Darakjy1013India2025-08-11
Kadeem Flosi1014France2025-07-28
Costa Dilliard1015Argentina2025-08-01
Maisha Rulapaugh1016Germany2025-07-22
Mujtaba Nicka1017Japan2025-08-03
Aditya Kusko1018United Kingdom2025-08-18
Sinclair Waycott1019Argentina2025-08-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Isabel BowleySpainElwin Sharvill QUALIFIED
Kadeem FlosiRussiaIvan Magalhaes QUALIFIED
Clifford RimJapanXuxue Feng RENEWAL
Wickens NestleSpainAsiya Javayant PROPOSAL
Adams MorascaArgentinaAmy Elsner NEW
Misaki RoysterBrazilAmy Elsner PROPOSAL
Ricardo GauchoAustraliaXuxue Feng NEW
Francesco ShinkoArgentinaIoni Bowcher UNQUALIFIED
Stacey MacleadRussiaAsiya Javayant QUALIFIED
Aika InouyeAustraliaOnyama Limba NEGOTIATION
Ivar PaprockiArgentinaElwin Sharvill NEW
Kaitlin OstroskyArgentinaElwin Sharvill RENEWAL
Faith GillianArgentinaOnyama Limba NEW
Maria MarrierRussiaElwin Sharvill NEW
Rodrigues CampainAustraliaStephen Shaw NEGOTIATION
Munro FerenczUnited KingdomIoni Bowcher PROPOSAL
Misaki RoysterCanadaStephen Shaw NEGOTIATION
Darci PoquetteArgentinaAsiya Javayant QUALIFIED
Mujtaba NickaGermanyElwin Sharvill UNQUALIFIED
Misaki RoysterFranceIvan Magalhaes NEGOTIATION
Darci PoquetteFranceIoni Bowcher PROPOSAL
Tony FollerAustraliaOnyama Limba RENEWAL
Mayumi KolmetzUnited KingdomBernardo Dominic NEGOTIATION
David DarakjyJapanBernardo Dominic RENEWAL
Wickens NestleAustraliaAmy Elsner UNQUALIFIED
Maisha RulapaughIndiaBernardo Dominic PROPOSAL
Maisha RulapaughGermanyIoni Bowcher PROPOSAL
Maisha RulapaughGermanyBernardo Dominic PROPOSAL
Ivar PaprockiFranceIvan Magalhaes QUALIFIED
Tony FollerSpainIvan Magalhaes PROPOSAL
Clifford RimCanadaStephen Shaw NEGOTIATION
Salvatore StockhamArgentinaXuxue Feng QUALIFIED
Tony FollerArgentinaBernardo Dominic PROPOSAL
Salvatore StockhamGermanyIvan Magalhaes RENEWAL
Kadeem FlosiFranceAsiya Javayant QUALIFIED
Jones VocelkaItalyAsiya Javayant RENEWAL
Aruna FigeroaRussiaBernardo Dominic UNQUALIFIED
Isabel BowleyGermanyAnna Fali UNQUALIFIED
Smith GlickGermanyStephen Shaw RENEWAL
Octavia MaletIndiaAmy 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>