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
Nicolas IturbideCanadaStephen Shaw RENEWAL
Munro FerenczIndiaElwin Sharvill NEGOTIATION
Alejandro PerinArgentinaAnna Fali PROPOSAL
Munro FerenczSpainAnna Fali NEGOTIATION
Kaitlin OstroskyGermanyBernardo Dominic PROPOSAL
Kadeem FlosiCanadaAsiya Javayant RENEWAL
Cody SaylorsArgentinaAnna Fali UNQUALIFIED
Misaki RoysterUnited KingdomXuxue Feng PROPOSAL
Stacey MacleadRussiaOnyama Limba QUALIFIED
Rodrigues CampainCanadaIoni Bowcher RENEWAL
Octavia MaletCanadaAmy Elsner RENEWAL
Julie StensethItalyAnna Fali UNQUALIFIED
Silvio SlusarskiUnited KingdomAnna Fali UNQUALIFIED
Ashley DoeAustraliaAsiya Javayant UNQUALIFIED
Maria MarrierAustraliaIoni Bowcher PROPOSAL
Jones VocelkaAustraliaAnna Fali PROPOSAL
Kaitlin OstroskyBrazilIoni Bowcher QUALIFIED
Ricardo GauchoIndiaAnna Fali NEW
Faith GillianSpainElwin Sharvill NEW
Nicolas IturbideGermanyAnna Fali NEW
Jennifer AmigonGermanyAnna Fali NEW
Alejandro PerinItalyElwin Sharvill QUALIFIED
Isabel BowleyGermanyStephen Shaw NEW
David DarakjyAustraliaOnyama Limba NEGOTIATION
Darci PoquetteGermanyAmy Elsner NEGOTIATION
Jefferson SchemmerSpainAsiya Javayant QUALIFIED
David DarakjyAustraliaOnyama Limba UNQUALIFIED
Jefferson SchemmerRussiaOnyama Limba PROPOSAL
Octavia MaletArgentinaAnna Fali RENEWAL
Leon OldroydFranceBernardo Dominic RENEWAL
Aika InouyeItalyOnyama Limba UNQUALIFIED
Greenwood BologniaUnited KingdomOnyama Limba PROPOSAL
Darci PoquetteUnited KingdomIvan Magalhaes RENEWAL
Jefferson SchemmerItalyIvan Magalhaes RENEWAL
Munro FerenczItalyAsiya Javayant UNQUALIFIED
Chavez BriddickArgentinaElwin Sharvill QUALIFIED
Salvatore StockhamBrazilAnna Fali NEGOTIATION
Silvio SlusarskiItalyBernardo Dominic PROPOSAL
Francesco ShinkoFranceOnyama Limba NEW
Darci PoquetteUnited KingdomBernardo Dominic NEW
Greenwood BologniaRussiaElwin Sharvill PROPOSAL
Stacey MacleadCanadaOnyama Limba QUALIFIED
Maria MarrierFranceBernardo Dominic PROPOSAL
Isabel BowleyRussiaAsiya Javayant RENEWAL
Stacey MacleadAustraliaBernardo Dominic RENEWAL
Sinclair WaycottIndiaBernardo Dominic NEW
Sinclair WaycottFranceAsiya Javayant UNQUALIFIED
Julie StensethAustraliaStephen Shaw NEGOTIATION
Aika InouyeGermanyOnyama Limba RENEWAL
Octavia MaletUnited KingdomAsiya Javayant NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Octavia MaletFranceXuxue Feng QUALIFIED
Julie StensethSpainBernardo Dominic UNQUALIFIED
Smith GlickItalyBernardo Dominic QUALIFIED
Mujtaba NickaFranceOnyama Limba RENEWAL
Morrow RutaFranceAnna Fali QUALIFIED
James ButtAustraliaAsiya Javayant RENEWAL
Aditya KuskoArgentinaAmy Elsner QUALIFIED
Cody SaylorsUnited KingdomBernardo Dominic UNQUALIFIED
Claire TollnerCanadaOnyama Limba NEGOTIATION
Mayumi KolmetzArgentinaAnna Fali QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Stacey MacleadFrance2025-10-12Truhlar And Truhlar Attys NEW18Elwin Sharvill
1001Leon OldroydAustralia2025-09-17Rousseaux, Michael Esq NEW93Ivan Magalhaes
1002Emily WhobreyIndia2025-10-03King, Christopher A Esq QUALIFIED22Ioni Bowcher
1003Francesco ShinkoCanada2025-09-20Chanay, Jeffrey A Esq UNQUALIFIED59Ioni Bowcher
1004Tony FollerUnited Kingdom2025-09-24Printing Dimensions NEGOTIATION7Bernardo Dominic
1005Izzy GarufiUnited Kingdom2025-09-22Commercial Press QUALIFIED90Anna Fali
1006Arvin AlbaresBrazil2025-10-14Morlong Associates NEGOTIATION37Onyama Limba
1007Isabel BowleyGermany2025-10-07Feltz Printing Service UNQUALIFIED98Bernardo Dominic
1008Claire TollnerCanada2025-10-12Truhlar And Truhlar Attys PROPOSAL69Elwin Sharvill
1009Antonio CaudyBrazil2025-09-22Commercial Press UNQUALIFIED98Ivan Magalhaes
1010Octavia MaletGermany2025-10-03Commercial Press PROPOSAL53Ioni Bowcher
1011Costa DilliardSpain2025-10-05Chapman, Ross E Esq PROPOSAL23Amy Elsner
1012Cody SaylorsSpain2025-09-20Feltz Printing Service NEGOTIATION94Ioni Bowcher
1013Kadeem FlosiAustralia2025-10-09King, Christopher A Esq NEW33Ioni Bowcher
1014David DarakjyUnited Kingdom2025-09-20Chanay, Jeffrey A Esq QUALIFIED10Amy Elsner
1015Claire TollnerCanada2025-09-17King, Christopher A Esq NEW24Ioni Bowcher
1016Julie StensethAustralia2025-10-05Commercial Press QUALIFIED60Onyama Limba
1017Morrow RutaItaly2025-10-10Benton, John B Jr NEGOTIATION30Ivan Magalhaes
1018Leja CaldareraFrance2025-10-05Chanay, Jeffrey A Esq NEGOTIATION11Ivan Magalhaes
1019Maria MarrierBrazil2025-10-06King, Christopher A Esq UNQUALIFIED89Amy Elsner
1020Chavez BriddickRussia2025-09-20Rangoni Of Florence UNQUALIFIED45Onyama Limba
1021Clifford RimItaly2025-09-17Chemel, James L Cpa QUALIFIED60Onyama Limba
1022Sinclair WaycottItaly2025-10-13Benton, John B Jr RENEWAL96Bernardo Dominic
1023Aditya KuskoIndia2025-10-07Feltz Printing Service QUALIFIED76Elwin Sharvill
1024Jefferson SchemmerBrazil2025-09-30Chapman, Ross E Esq PROPOSAL61Anna Fali
1025Ivar PaprockiSpain2025-10-07King, Christopher A Esq RENEWAL3Stephen Shaw
1026Nicolas IturbideSpain2025-09-29Benton, John B Jr UNQUALIFIED98Amy Elsner
1027Jennifer AmigonSpain2025-09-25Chemel, James L Cpa PROPOSAL39Xuxue Feng
1028Aditya KuskoAustralia2025-10-05Feltz Printing Service QUALIFIED86Ioni Bowcher
1029Ashley DoeBrazil2025-09-25Truhlar And Truhlar Attys NEGOTIATION8Ivan Magalhaes
1030Jeanfrancois VenereCanada2025-10-08Chapman, Ross E Esq UNQUALIFIED93Stephen Shaw
1031Ivar PaprockiUnited Kingdom2025-10-05Rangoni Of Florence PROPOSAL29Anna Fali
1032Morrow RutaFrance2025-09-21King, Christopher A Esq NEGOTIATION18Ivan Magalhaes
1033Darci PoquetteAustralia2025-10-06Morlong Associates PROPOSAL90Stephen Shaw
1034Kaitlin OstroskySpain2025-09-22Truhlar And Truhlar Attys NEGOTIATION7Xuxue Feng
1035Smith GlickRussia2025-09-19Benton, John B Jr RENEWAL38Ioni Bowcher
1036Ricardo GauchoJapan2025-10-09Feltz Printing Service NEGOTIATION91Anna Fali
1037Juan WieserRussia2025-09-24Rousseaux, Michael Esq NEW62Xuxue Feng
1038Misaki RoysterItaly2025-10-16Truhlar And Truhlar Attys NEW19Anna Fali
1039Ivar PaprockiFrance2025-09-21Truhlar And Truhlar Attys NEW23Anna Fali
1040Mujtaba NickaCanada2025-09-26Morlong Associates NEW84Ioni Bowcher
1041Ashley DoeRussia2025-10-14Benton, John B Jr PROPOSAL55Xuxue Feng
1042Jefferson SchemmerIndia2025-09-21Chapman, Ross E Esq RENEWAL62Asiya Javayant
1043Adams MorascaIndia2025-09-18Truhlar And Truhlar Attys NEGOTIATION62Asiya Javayant
1044Jones VocelkaItaly2025-10-04Printing Dimensions QUALIFIED12Ioni Bowcher
1045Smith GlickSpain2025-09-18King, Christopher A Esq UNQUALIFIED73Ioni Bowcher
1046Jefferson SchemmerBrazil2025-09-19Feiner Bros QUALIFIED7Onyama Limba
1047Costa DilliardGermany2025-09-17Rangoni Of Florence QUALIFIED0Asiya Javayant
1048Silvio SlusarskiAustralia2025-10-07Rousseaux, Michael Esq PROPOSAL57Stephen Shaw
1049Leon OldroydGermany2025-10-09Rousseaux, Michael Esq NEW45Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Darci PoquetteIndiaIoni Bowcher PROPOSAL
Wickens NestleRussiaOnyama Limba RENEWAL
Misaki RoysterCanadaStephen Shaw UNQUALIFIED
Silvio SlusarskiUnited KingdomXuxue Feng QUALIFIED
Aditya KuskoUnited KingdomOnyama Limba NEGOTIATION
Nicolas IturbideCanadaAnna Fali UNQUALIFIED
Jennifer AmigonRussiaIvan Magalhaes PROPOSAL
Emily WhobreyItalyIvan Magalhaes QUALIFIED
Tony FollerIndiaAnna Fali NEW
Francesco ShinkoIndiaBernardo Dominic NEGOTIATION
David DarakjyJapanIvan Magalhaes UNQUALIFIED
Nicolas IturbideRussiaIoni Bowcher UNQUALIFIED
Leja CaldareraGermanyAnna Fali UNQUALIFIED
Morrow RutaSpainAsiya Javayant QUALIFIED
Isabel BowleyArgentinaAmy Elsner NEGOTIATION
Rodrigues CampainGermanyStephen Shaw UNQUALIFIED
Ashley DoeFranceStephen Shaw QUALIFIED
Munro FerenczIndiaXuxue Feng QUALIFIED
James ButtRussiaIoni Bowcher NEW
David DarakjyJapanIvan Magalhaes QUALIFIED
Antonio CaudyUnited KingdomIoni Bowcher NEW
Darci PoquetteGermanyIvan Magalhaes NEW
Silvio SlusarskiAustraliaOnyama Limba PROPOSAL
Nicolas IturbideGermanyAsiya Javayant UNQUALIFIED
Claire TollnerArgentinaOnyama Limba RENEWAL
Mujtaba NickaCanadaAsiya Javayant PROPOSAL
Alejandro PerinIndiaIoni Bowcher PROPOSAL
Smith GlickSpainAnna Fali UNQUALIFIED
Ashley DoeUnited KingdomAsiya Javayant UNQUALIFIED
Adams MorascaAustraliaIvan Magalhaes UNQUALIFIED
Misaki RoysterRussiaElwin Sharvill UNQUALIFIED
Isabel BowleyArgentinaXuxue Feng UNQUALIFIED
Kadeem FlosiFranceStephen Shaw QUALIFIED
Wickens NestleFranceAmy Elsner NEW
Rodrigues CampainJapanAsiya Javayant RENEWAL
Juan WieserItalyOnyama Limba NEW
Faith GillianSpainAmy Elsner UNQUALIFIED
Wickens NestleUnited KingdomBernardo Dominic UNQUALIFIED
Rodrigues CampainArgentinaIvan Magalhaes NEGOTIATION
Aika InouyeIndiaAsiya Javayant NEW
Francesco ShinkoGermanyAmy Elsner QUALIFIED
Ivar PaprockiCanadaBernardo Dominic NEGOTIATION
Chavez BriddickBrazilIvan Magalhaes NEGOTIATION
Antonio CaudyArgentinaStephen Shaw QUALIFIED
Antonio CaudyItalyXuxue Feng PROPOSAL
Johnson SergiGermanyOnyama Limba RENEWAL
Munro FerenczGermanyAmy Elsner NEW
Maisha RulapaughRussiaAsiya Javayant RENEWAL
Aika InouyeJapanIvan Magalhaes RENEWAL
Claire TollnerJapanXuxue Feng RENEWAL
Frozen Columns
Name
Alejandro Perin
Alejandro Perin
Kadeem Flosi
Leon Oldroyd
Greenwood Bolognia
Isabel Bowley
Kadeem Flosi
Deepesh Chui
Jennifer Amigon
Jefferson Schemmer
Jones Vocelka
Leja Caldarera
Octavia Malet
Julie Stenseth
Aika Inouye
Murillo Malet
Mayumi Kolmetz
Munro Ferencz
Jefferson Schemmer
Jeanfrancois Venere
Arvin Albares
Maisha Rulapaugh
Adams Morasca
Kadeem Flosi
Nicolas Iturbide
James Butt
Mayumi Kolmetz
Ricardo Gaucho
Jeanfrancois Venere
Kaitlin Ostrosky
Silvio Slusarski
Emily Whobrey
Aika Inouye
Salvatore Stockham
James Butt
Maisha Rulapaugh
Silvio Slusarski
Leon Oldroyd
Jefferson Schemmer
Jefferson Schemmer
Antonio Caudy
Salvatore Stockham
Deepesh Chui
Octavia Malet
Ashley Doe
Wickens Nestle
Leja Caldarera
Costa Dilliard
Octavia Malet
Kadeem Flosi
IdCountryDate
1000Brazil2025-09-21
1001Australia2025-09-20
1002France2025-10-11
1003Brazil2025-10-05
1004India2025-10-09
1005Australia2025-10-14
1006France2025-10-05
1007Japan2025-09-30
1008Argentina2025-10-06
1009India2025-10-02
1010Germany2025-10-14
1011Australia2025-10-03
1012Brazil2025-09-22
1013France2025-10-06
1014Germany2025-10-01
1015Germany2025-09-18
1016Russia2025-10-06
1017United Kingdom2025-09-24
1018India2025-09-30
1019India2025-09-29
1020France2025-10-02
1021Australia2025-10-16
1022Australia2025-09-26
1023Italy2025-10-09
1024India2025-09-19
1025United Kingdom2025-10-13
1026Brazil2025-09-20
1027Italy2025-10-09
1028United Kingdom2025-09-22
1029United Kingdom2025-10-12
1030Brazil2025-09-20
1031Argentina2025-10-15
1032Germany2025-10-11
1033United Kingdom2025-10-05
1034Canada2025-09-17
1035France2025-10-09
1036Germany2025-09-27
1037Italy2025-09-17
1038Spain2025-09-27
1039United Kingdom2025-10-09
1040Brazil2025-09-19
1041France2025-10-14
1042France2025-09-24
1043Italy2025-10-14
1044Italy2025-09-17
1045United Kingdom2025-10-13
1046Japan2025-09-24
1047Canada2025-09-20
1048Japan2025-09-19
1049Spain2025-10-11

On-Demand Data

NameIdCountryDate
Ricardo Gaucho1000Spain2025-10-09
Aruna Figeroa1001Japan2025-09-17
Leja Caldarera1002Japan2025-10-14
Juan Wieser1003Italy2025-10-11
Jefferson Schemmer1004Brazil2025-10-12
Wickens Nestle1005Brazil2025-10-01
Murillo Malet1006Argentina2025-10-11
David Darakjy1007Brazil2025-10-16
Tony Foller1008Spain2025-10-07
Aditya Kusko1009India2025-10-08
Kaitlin Ostrosky1010Australia2025-09-30
Alejandro Perin1011Italy2025-10-08
Ivar Paprocki1012Canada2025-09-21
Salvatore Stockham1013Argentina2025-09-24
Izzy Garufi1014Italy2025-10-13
Cody Saylors1015India2025-10-05
Cody Saylors1016Germany2025-09-22
Clifford Rim1017France2025-10-04
Juan Wieser1018Australia2025-09-27
Maria Marrier1019Japan2025-09-18
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Sinclair WaycottGermanyStephen Shaw QUALIFIED
Aruna FigeroaCanadaBernardo Dominic UNQUALIFIED
Sinclair WaycottUnited KingdomIoni Bowcher RENEWAL
Costa DilliardItalyBernardo Dominic RENEWAL
James ButtItalyBernardo Dominic NEW
Antonio CaudyJapanElwin Sharvill NEW
Wickens NestleGermanyAsiya Javayant UNQUALIFIED
Jeanfrancois VenereArgentinaAsiya Javayant QUALIFIED
Leon OldroydJapanIoni Bowcher QUALIFIED
Arvin AlbaresIndiaStephen Shaw PROPOSAL
Costa DilliardBrazilStephen Shaw RENEWAL
Jefferson SchemmerArgentinaIvan Magalhaes PROPOSAL
Jeanfrancois VenereRussiaIoni Bowcher NEGOTIATION
Deepesh ChuiCanadaOnyama Limba QUALIFIED
Stacey MacleadJapanStephen Shaw RENEWAL
Misaki RoysterUnited KingdomOnyama Limba RENEWAL
Costa DilliardSpainIoni Bowcher PROPOSAL
Francesco ShinkoArgentinaAnna Fali UNQUALIFIED
Darci PoquetteAustraliaAmy Elsner NEW
Jefferson SchemmerCanadaAsiya Javayant QUALIFIED
Francesco ShinkoGermanyXuxue Feng RENEWAL
Rodrigues CampainRussiaBernardo Dominic RENEWAL
Aruna FigeroaSpainXuxue Feng NEGOTIATION
Faith GillianArgentinaBernardo Dominic NEW
Faith GillianJapanOnyama Limba NEGOTIATION
Tony FollerArgentinaIoni Bowcher RENEWAL
Mujtaba NickaIndiaIvan Magalhaes NEGOTIATION
Jones VocelkaBrazilXuxue Feng UNQUALIFIED
Darci PoquetteItalyStephen Shaw QUALIFIED
Jeanfrancois VenereArgentinaXuxue Feng RENEWAL
Aditya KuskoCanadaStephen Shaw QUALIFIED
Ivar PaprockiUnited KingdomIvan Magalhaes QUALIFIED
Mujtaba NickaArgentinaAmy Elsner NEW
Johnson SergiFranceAmy Elsner NEGOTIATION
James ButtFranceStephen Shaw NEW
Mayumi KolmetzArgentinaXuxue Feng QUALIFIED
Izzy GarufiAustraliaElwin Sharvill QUALIFIED
Jones VocelkaCanadaBernardo Dominic PROPOSAL
Izzy GarufiSpainAnna Fali NEW
David DarakjyGermanyAsiya Javayant 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>