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
Isabel BowleyBrazilAnna Fali RENEWAL
Morrow RutaIndiaElwin Sharvill RENEWAL
Aruna FigeroaJapanAmy Elsner NEGOTIATION
Leon OldroydSpainAsiya Javayant UNQUALIFIED
Smith GlickArgentinaAsiya Javayant NEGOTIATION
Leon OldroydGermanyOnyama Limba QUALIFIED
Ashley DoeUnited KingdomAsiya Javayant QUALIFIED
Alejandro PerinGermanyElwin Sharvill RENEWAL
Salvatore StockhamRussiaElwin Sharvill NEGOTIATION
Maria MarrierFranceXuxue Feng NEW
Misaki RoysterIndiaOnyama Limba NEW
David DarakjyFranceOnyama Limba UNQUALIFIED
Tony FollerJapanStephen Shaw UNQUALIFIED
Salvatore StockhamItalyAmy Elsner QUALIFIED
Jones VocelkaFranceAnna Fali PROPOSAL
Misaki RoysterGermanyBernardo Dominic NEGOTIATION
Leon OldroydGermanyBernardo Dominic NEGOTIATION
Izzy GarufiGermanyIvan Magalhaes QUALIFIED
David DarakjyUnited KingdomAnna Fali RENEWAL
Alejandro PerinArgentinaBernardo Dominic QUALIFIED
Wickens NestleUnited KingdomAnna Fali PROPOSAL
Alejandro PerinGermanyElwin Sharvill PROPOSAL
Antonio CaudyGermanyAsiya Javayant UNQUALIFIED
Deepesh ChuiGermanyXuxue Feng UNQUALIFIED
Murillo MaletBrazilAmy Elsner UNQUALIFIED
Jones VocelkaAustraliaAmy Elsner NEW
Adams MorascaRussiaIvan Magalhaes UNQUALIFIED
Octavia MaletSpainOnyama Limba UNQUALIFIED
Leon OldroydItalyStephen Shaw NEW
Sinclair WaycottItalyIvan Magalhaes NEGOTIATION
Chavez BriddickFranceIvan Magalhaes QUALIFIED
Ricardo GauchoIndiaIoni Bowcher UNQUALIFIED
Kaitlin OstroskyGermanyElwin Sharvill NEGOTIATION
James ButtCanadaIvan Magalhaes NEGOTIATION
Antonio CaudyIndiaAsiya Javayant PROPOSAL
Silvio SlusarskiCanadaElwin Sharvill NEW
Octavia MaletIndiaOnyama Limba PROPOSAL
Juan WieserSpainAsiya Javayant RENEWAL
Jefferson SchemmerBrazilBernardo Dominic RENEWAL
Darci PoquetteRussiaXuxue Feng QUALIFIED
Isabel BowleyJapanXuxue Feng NEW
Alejandro PerinJapanOnyama Limba NEW
Aika InouyeArgentinaAsiya Javayant QUALIFIED
David DarakjyUnited KingdomOnyama Limba UNQUALIFIED
Julie StensethFranceStephen Shaw NEW
Morrow RutaSpainXuxue Feng UNQUALIFIED
Aika InouyeFranceAnna Fali QUALIFIED
Octavia MaletCanadaXuxue Feng NEGOTIATION
Stacey MacleadCanadaXuxue Feng NEGOTIATION
Julie StensethIndiaIoni Bowcher UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Maisha RulapaughCanadaXuxue Feng UNQUALIFIED
Aditya KuskoRussiaIvan Magalhaes UNQUALIFIED
Leon OldroydAustraliaAmy Elsner RENEWAL
Antonio CaudyCanadaIvan Magalhaes NEGOTIATION
Nicolas IturbideCanadaIoni Bowcher NEW
Tony FollerGermanyIoni Bowcher NEW
Stacey MacleadArgentinaElwin Sharvill NEGOTIATION
Isabel BowleyItalyXuxue Feng NEGOTIATION
Kaitlin OstroskyArgentinaAmy Elsner NEGOTIATION
Jefferson SchemmerAustraliaAnna Fali PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Tony FollerRussia2025-10-18Rangoni Of Florence PROPOSAL62Stephen Shaw
1001Aditya KuskoFrance2025-10-15Printing Dimensions QUALIFIED94Stephen Shaw
1002Costa DilliardRussia2025-09-23Rousseaux, Michael Esq QUALIFIED89Bernardo Dominic
1003Tony FollerFrance2025-09-28Feltz Printing Service QUALIFIED49Onyama Limba
1004Morrow RutaRussia2025-10-10Buckley Miller Wright RENEWAL35Stephen Shaw
1005Julie StensethIndia2025-09-28Printing Dimensions RENEWAL59Stephen Shaw
1006Murillo MaletRussia2025-09-29Truhlar And Truhlar Attys NEW20Elwin Sharvill
1007Johnson SergiAustralia2025-10-03Chapman, Ross E Esq NEGOTIATION78Stephen Shaw
1008Kadeem FlosiIndia2025-10-19Rousseaux, Michael Esq QUALIFIED43Stephen Shaw
1009Leja CaldareraAustralia2025-10-09Rangoni Of Florence UNQUALIFIED55Anna Fali
1010Stacey MacleadAustralia2025-10-04Commercial Press PROPOSAL6Bernardo Dominic
1011Sinclair WaycottGermany2025-10-09Feltz Printing Service QUALIFIED93Xuxue Feng
1012Kadeem FlosiSpain2025-10-05Benton, John B Jr NEGOTIATION30Stephen Shaw
1013Darci PoquetteBrazil2025-10-10Dorl, James J Esq NEGOTIATION51Ivan Magalhaes
1014Julie StensethArgentina2025-10-19Chanay, Jeffrey A Esq UNQUALIFIED48Amy Elsner
1015Kaitlin OstroskyBrazil2025-10-19Truhlar And Truhlar Attys PROPOSAL44Asiya Javayant
1016Mujtaba NickaAustralia2025-10-21Rangoni Of Florence NEW40Ioni Bowcher
1017Kaitlin OstroskyArgentina2025-10-13Morlong Associates UNQUALIFIED73Ivan Magalhaes
1018Antonio CaudyIndia2025-10-05Rangoni Of Florence QUALIFIED92Ivan Magalhaes
1019Misaki RoysterGermany2025-10-21Truhlar And Truhlar Attys QUALIFIED66Anna Fali
1020Isabel BowleyCanada2025-09-28Printing Dimensions NEGOTIATION37Anna Fali
1021Silvio SlusarskiUnited Kingdom2025-10-13Chemel, James L Cpa QUALIFIED45Ivan Magalhaes
1022Salvatore StockhamJapan2025-09-30Commercial Press NEW45Ioni Bowcher
1023Chavez BriddickArgentina2025-10-13Printing Dimensions RENEWAL92Ivan Magalhaes
1024Emily WhobreySpain2025-10-03Commercial Press NEGOTIATION36Amy Elsner
1025Ashley DoeUnited Kingdom2025-10-07Chapman, Ross E Esq PROPOSAL18Asiya Javayant
1026Maisha RulapaughItaly2025-09-29Benton, John B Jr QUALIFIED24Onyama Limba
1027Tony FollerBrazil2025-09-26Chapman, Ross E Esq RENEWAL36Amy Elsner
1028Aika InouyeArgentina2025-09-29Chapman, Ross E Esq RENEWAL76Ivan Magalhaes
1029David DarakjyUnited Kingdom2025-09-24Commercial Press QUALIFIED10Ioni Bowcher
1030Aika InouyeSpain2025-10-15Dorl, James J Esq PROPOSAL17Amy Elsner
1031David DarakjyIndia2025-10-07Rangoni Of Florence QUALIFIED68Amy Elsner
1032Mayumi KolmetzJapan2025-10-14Rousseaux, Michael Esq UNQUALIFIED10Xuxue Feng
1033Emily WhobreyFrance2025-10-05Rangoni Of Florence NEGOTIATION6Asiya Javayant
1034Octavia MaletArgentina2025-10-07Buckley Miller Wright PROPOSAL17Onyama Limba
1035Tony FollerFrance2025-10-03King, Christopher A Esq PROPOSAL19Anna Fali
1036Darci PoquetteIndia2025-10-05Morlong Associates NEW12Asiya Javayant
1037Antonio CaudyJapan2025-10-15Truhlar And Truhlar Attys QUALIFIED0Ivan Magalhaes
1038Claire TollnerAustralia2025-10-13Chemel, James L Cpa RENEWAL77Ivan Magalhaes
1039James ButtFrance2025-10-02Rousseaux, Michael Esq QUALIFIED30Ivan Magalhaes
1040Claire TollnerFrance2025-10-15Truhlar And Truhlar Attys PROPOSAL7Onyama Limba
1041Antonio CaudySpain2025-10-08Benton, John B Jr UNQUALIFIED48Bernardo Dominic
1042Izzy GarufiGermany2025-09-27Chapman, Ross E Esq UNQUALIFIED19Ivan Magalhaes
1043Izzy GarufiArgentina2025-10-14Rousseaux, Michael Esq QUALIFIED76Ivan Magalhaes
1044James ButtGermany2025-10-02Rousseaux, Michael Esq QUALIFIED64Ioni Bowcher
1045Darci PoquetteGermany2025-10-10Benton, John B Jr RENEWAL19Onyama Limba
1046Kadeem FlosiAustralia2025-10-01Chemel, James L Cpa PROPOSAL27Ivan Magalhaes
1047Leja CaldareraUnited Kingdom2025-10-07Feiner Bros PROPOSAL31Onyama Limba
1048Maria MarrierIndia2025-09-24Dorl, James J Esq RENEWAL39Asiya Javayant
1049James ButtArgentina2025-09-27Dorl, James J Esq NEW37Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Sinclair WaycottRussiaAmy Elsner NEW
Mayumi KolmetzArgentinaIoni Bowcher QUALIFIED
Isabel BowleyJapanAnna Fali RENEWAL
Stacey MacleadUnited KingdomBernardo Dominic PROPOSAL
Costa DilliardSpainAsiya Javayant NEW
Jennifer AmigonJapanXuxue Feng NEW
Johnson SergiItalyAsiya Javayant UNQUALIFIED
Adams MorascaGermanyBernardo Dominic RENEWAL
Adams MorascaItalyAsiya Javayant QUALIFIED
Isabel BowleyBrazilElwin Sharvill NEW
Claire TollnerFranceElwin Sharvill RENEWAL
Alejandro PerinUnited KingdomElwin Sharvill RENEWAL
Ivar PaprockiAustraliaStephen Shaw QUALIFIED
Sinclair WaycottAustraliaStephen Shaw QUALIFIED
Murillo MaletArgentinaBernardo Dominic PROPOSAL
Tony FollerGermanyAsiya Javayant RENEWAL
Francesco ShinkoUnited KingdomBernardo Dominic NEW
Faith GillianFranceAnna Fali QUALIFIED
Alejandro PerinJapanAmy Elsner NEW
Alejandro PerinUnited KingdomXuxue Feng NEW
Izzy GarufiRussiaIoni Bowcher UNQUALIFIED
Smith GlickItalyAnna Fali PROPOSAL
Darci PoquetteGermanyIvan Magalhaes RENEWAL
Silvio SlusarskiFranceXuxue Feng NEGOTIATION
Adams MorascaJapanAsiya Javayant NEGOTIATION
Octavia MaletJapanBernardo Dominic NEGOTIATION
Murillo MaletSpainAnna Fali NEGOTIATION
Salvatore StockhamUnited KingdomXuxue Feng RENEWAL
Johnson SergiJapanAnna Fali QUALIFIED
Jefferson SchemmerArgentinaAmy Elsner NEGOTIATION
Cody SaylorsAustraliaOnyama Limba NEW
Silvio SlusarskiFranceAmy Elsner NEW
Faith GillianIndiaIoni Bowcher UNQUALIFIED
Clifford RimArgentinaBernardo Dominic UNQUALIFIED
Ricardo GauchoSpainIvan Magalhaes NEGOTIATION
Misaki RoysterCanadaAsiya Javayant PROPOSAL
Antonio CaudyJapanOnyama Limba UNQUALIFIED
Ricardo GauchoIndiaXuxue Feng NEGOTIATION
Stacey MacleadFranceBernardo Dominic UNQUALIFIED
Stacey MacleadUnited KingdomIoni Bowcher RENEWAL
Jennifer AmigonSpainBernardo Dominic UNQUALIFIED
Francesco ShinkoIndiaAnna Fali UNQUALIFIED
Deepesh ChuiFranceBernardo Dominic UNQUALIFIED
Ashley DoeBrazilIoni Bowcher RENEWAL
Ricardo GauchoBrazilStephen Shaw RENEWAL
Isabel BowleyBrazilAmy Elsner QUALIFIED
Clifford RimUnited KingdomAmy Elsner NEGOTIATION
Maria MarrierRussiaAnna Fali NEGOTIATION
Johnson SergiAustraliaOnyama Limba NEGOTIATION
Greenwood BologniaFranceAnna Fali PROPOSAL
Frozen Columns
Name
Munro Ferencz
Nicolas Iturbide
Emily Whobrey
Maisha Rulapaugh
Sinclair Waycott
Deepesh Chui
Adams Morasca
Faith Gillian
Smith Glick
Cody Saylors
Jefferson Schemmer
Juan Wieser
Jefferson Schemmer
Ricardo Gaucho
Murillo Malet
Antonio Caudy
Salvatore Stockham
Darci Poquette
Jones Vocelka
Tony Foller
Ivar Paprocki
Leon Oldroyd
Maria Marrier
Jefferson Schemmer
Maria Marrier
Leja Caldarera
Emily Whobrey
Aditya Kusko
Greenwood Bolognia
Maria Marrier
Jennifer Amigon
Jefferson Schemmer
Silvio Slusarski
Izzy Garufi
Jefferson Schemmer
Adams Morasca
David Darakjy
Tony Foller
James Butt
Antonio Caudy
Costa Dilliard
Stacey Maclead
Chavez Briddick
Jennifer Amigon
Maria Marrier
Faith Gillian
Jennifer Amigon
Adams Morasca
Nicolas Iturbide
Julie Stenseth
IdCountryDate
1000Spain2025-09-29
1001Russia2025-10-16
1002Japan2025-10-20
1003Spain2025-09-25
1004Canada2025-09-24
1005Germany2025-10-17
1006Australia2025-09-24
1007Canada2025-10-02
1008Brazil2025-10-18
1009India2025-09-24
1010India2025-10-10
1011Australia2025-10-20
1012India2025-09-26
1013Italy2025-10-13
1014Japan2025-10-17
1015United Kingdom2025-10-07
1016India2025-09-30
1017Germany2025-10-15
1018United Kingdom2025-09-23
1019Russia2025-09-29
1020United Kingdom2025-10-04
1021Japan2025-10-06
1022Japan2025-10-05
1023Spain2025-10-18
1024Canada2025-10-18
1025Japan2025-10-18
1026Japan2025-10-18
1027India2025-09-22
1028Italy2025-09-23
1029Spain2025-10-01
1030United Kingdom2025-10-04
1031Spain2025-10-17
1032Spain2025-10-02
1033India2025-09-25
1034Russia2025-10-04
1035Japan2025-10-03
1036Japan2025-10-20
1037United Kingdom2025-10-18
1038India2025-10-07
1039France2025-10-20
1040United Kingdom2025-10-05
1041India2025-10-08
1042United Kingdom2025-10-14
1043Germany2025-10-17
1044France2025-10-03
1045United Kingdom2025-09-23
1046Japan2025-09-29
1047Australia2025-10-12
1048United Kingdom2025-09-26
1049United Kingdom2025-10-15

On-Demand Data

NameIdCountryDate
Darci Poquette1000Argentina2025-10-08
Costa Dilliard1001Russia2025-10-03
Morrow Ruta1002India2025-10-10
Murillo Malet1003France2025-10-12
Juan Wieser1004Brazil2025-10-01
Maisha Rulapaugh1005Russia2025-10-12
Chavez Briddick1006France2025-10-13
Claire Tollner1007United Kingdom2025-10-09
Salvatore Stockham1008Japan2025-10-16
Ashley Doe1009Spain2025-09-25
Faith Gillian1010Russia2025-10-14
Costa Dilliard1011Germany2025-10-08
Ricardo Gaucho1012Russia2025-09-27
Julie Stenseth1013Spain2025-10-09
Stacey Maclead1014Australia2025-09-28
Francesco Shinko1015India2025-09-22
Jefferson Schemmer1016India2025-10-07
Johnson Sergi1017United Kingdom2025-10-13
Morrow Ruta1018France2025-09-22
Munro Ferencz1019Brazil2025-09-28
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Deepesh ChuiIndiaXuxue Feng NEGOTIATION
Ricardo GauchoBrazilOnyama Limba RENEWAL
Emily WhobreyBrazilIoni Bowcher PROPOSAL
Leon OldroydFranceBernardo Dominic NEGOTIATION
Jeanfrancois VenereFranceAmy Elsner QUALIFIED
Tony FollerRussiaAmy Elsner QUALIFIED
Jones VocelkaRussiaAmy Elsner QUALIFIED
Antonio CaudyFranceAnna Fali QUALIFIED
Adams MorascaCanadaOnyama Limba NEGOTIATION
Morrow RutaCanadaIvan Magalhaes UNQUALIFIED
Antonio CaudyCanadaStephen Shaw NEW
Salvatore StockhamSpainXuxue Feng NEGOTIATION
Leja CaldareraRussiaAmy Elsner NEGOTIATION
Jeanfrancois VenereArgentinaXuxue Feng RENEWAL
Rodrigues CampainUnited KingdomIoni Bowcher RENEWAL
Costa DilliardJapanOnyama Limba NEW
Cody SaylorsUnited KingdomIoni Bowcher UNQUALIFIED
Cody SaylorsUnited KingdomAsiya Javayant QUALIFIED
Costa DilliardBrazilXuxue Feng UNQUALIFIED
Emily WhobreyItalyBernardo Dominic PROPOSAL
Emily WhobreyItalyAnna Fali UNQUALIFIED
Murillo MaletIndiaBernardo Dominic PROPOSAL
Ivar PaprockiAustraliaAnna Fali UNQUALIFIED
Leja CaldareraAustraliaElwin Sharvill QUALIFIED
Izzy GarufiIndiaXuxue Feng NEW
Cody SaylorsItalyAsiya Javayant NEW
Kaitlin OstroskyFranceIoni Bowcher UNQUALIFIED
Mayumi KolmetzBrazilAnna Fali RENEWAL
Johnson SergiItalyIvan Magalhaes NEW
Kadeem FlosiBrazilIvan Magalhaes NEW
Mujtaba NickaFranceBernardo Dominic RENEWAL
Adams MorascaAustraliaStephen Shaw NEGOTIATION
Johnson SergiGermanyAnna Fali PROPOSAL
Wickens NestleJapanElwin Sharvill QUALIFIED
Morrow RutaJapanElwin Sharvill PROPOSAL
Juan WieserGermanyElwin Sharvill NEW
Salvatore StockhamUnited KingdomElwin Sharvill UNQUALIFIED
Aika InouyeCanadaElwin Sharvill QUALIFIED
Kadeem FlosiIndiaAnna Fali QUALIFIED
Jones VocelkaAustraliaIvan Magalhaes 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>