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
Aruna FigeroaBrazilAmy Elsner QUALIFIED
Maisha RulapaughRussiaAmy Elsner NEW
Leja CaldareraUnited KingdomXuxue Feng NEW
Johnson SergiUnited KingdomAmy Elsner RENEWAL
James ButtUnited KingdomAsiya Javayant QUALIFIED
Murillo MaletItalyStephen Shaw NEW
Ivar PaprockiIndiaElwin Sharvill NEGOTIATION
Ricardo GauchoUnited KingdomStephen Shaw UNQUALIFIED
Ivar PaprockiSpainAnna Fali PROPOSAL
Emily WhobreyItalyBernardo Dominic RENEWAL
Alejandro PerinSpainBernardo Dominic RENEWAL
Mayumi KolmetzBrazilIvan Magalhaes NEW
Octavia MaletCanadaIvan Magalhaes UNQUALIFIED
Deepesh ChuiGermanyAsiya Javayant RENEWAL
Maisha RulapaughFranceOnyama Limba UNQUALIFIED
Kadeem FlosiCanadaBernardo Dominic NEGOTIATION
Sinclair WaycottAustraliaIvan Magalhaes NEGOTIATION
Arvin AlbaresFranceAsiya Javayant NEW
Johnson SergiFranceOnyama Limba NEW
Silvio SlusarskiUnited KingdomOnyama Limba QUALIFIED
Nicolas IturbideFranceAsiya Javayant UNQUALIFIED
Maisha RulapaughFranceAmy Elsner NEGOTIATION
Francesco ShinkoArgentinaIvan Magalhaes PROPOSAL
Aditya KuskoBrazilStephen Shaw NEGOTIATION
Clifford RimItalyAnna Fali UNQUALIFIED
Mayumi KolmetzAustraliaIvan Magalhaes PROPOSAL
Cody SaylorsCanadaAnna Fali PROPOSAL
Johnson SergiSpainAnna Fali NEW
Emily WhobreyJapanAnna Fali UNQUALIFIED
Aruna FigeroaAustraliaIvan Magalhaes QUALIFIED
Antonio CaudyGermanyAnna Fali NEW
Munro FerenczSpainIvan Magalhaes UNQUALIFIED
James ButtRussiaOnyama Limba RENEWAL
Murillo MaletCanadaAmy Elsner UNQUALIFIED
Alejandro PerinAustraliaIvan Magalhaes UNQUALIFIED
Francesco ShinkoIndiaAsiya Javayant RENEWAL
Adams MorascaRussiaOnyama Limba QUALIFIED
Julie StensethCanadaAsiya Javayant NEW
Johnson SergiRussiaAsiya Javayant QUALIFIED
Aika InouyeFranceIvan Magalhaes QUALIFIED
Silvio SlusarskiUnited KingdomAnna Fali NEW
Mayumi KolmetzRussiaXuxue Feng PROPOSAL
Alejandro PerinCanadaAmy Elsner RENEWAL
Nicolas IturbideArgentinaAmy Elsner NEGOTIATION
Kaitlin OstroskyRussiaStephen Shaw PROPOSAL
Morrow RutaItalyXuxue Feng PROPOSAL
Morrow RutaGermanyAmy Elsner UNQUALIFIED
Isabel BowleyAustraliaIoni Bowcher QUALIFIED
Deepesh ChuiBrazilAnna Fali NEW
Costa DilliardItalyElwin Sharvill NEW
Horizontal
NameCountryRepresentativeStatus
Jefferson SchemmerCanadaStephen Shaw NEW
Morrow RutaArgentinaBernardo Dominic QUALIFIED
Kadeem FlosiFranceIoni Bowcher UNQUALIFIED
Jones VocelkaArgentinaStephen Shaw NEGOTIATION
Alejandro PerinGermanyAnna Fali PROPOSAL
James ButtBrazilIvan Magalhaes QUALIFIED
Johnson SergiIndiaXuxue Feng NEW
Smith GlickGermanyBernardo Dominic UNQUALIFIED
Izzy GarufiBrazilIvan Magalhaes PROPOSAL
Morrow RutaSpainAsiya Javayant RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Leon OldroydBrazil2025-09-03Chapman, Ross E Esq RENEWAL77Stephen Shaw
1001Maisha RulapaughAustralia2025-09-14Rousseaux, Michael Esq QUALIFIED68Stephen Shaw
1002Aruna FigeroaIndia2025-09-15Rangoni Of Florence NEGOTIATION84Ivan Magalhaes
1003Mujtaba NickaBrazil2025-09-01Rousseaux, Michael Esq NEGOTIATION99Onyama Limba
1004Cody SaylorsRussia2025-09-02Feiner Bros NEW95Elwin Sharvill
1005Chavez BriddickSpain2025-09-23Chapman, Ross E Esq QUALIFIED62Onyama Limba
1006Nicolas IturbideArgentina2025-09-11King, Christopher A Esq UNQUALIFIED10Xuxue Feng
1007Ivar PaprockiIndia2025-09-08Buckley Miller Wright UNQUALIFIED92Bernardo Dominic
1008Kaitlin OstroskyIndia2025-09-28Chemel, James L Cpa NEGOTIATION39Anna Fali
1009Aruna FigeroaCanada2025-09-02Benton, John B Jr UNQUALIFIED36Onyama Limba
1010Smith GlickCanada2025-09-25Benton, John B Jr QUALIFIED39Anna Fali
1011Nicolas IturbideGermany2025-09-16Chapman, Ross E Esq UNQUALIFIED26Bernardo Dominic
1012Johnson SergiSpain2025-09-22Feltz Printing Service RENEWAL19Asiya Javayant
1013Sinclair WaycottFrance2025-09-07Dorl, James J Esq UNQUALIFIED81Amy Elsner
1014Antonio CaudyFrance2025-09-24Chapman, Ross E Esq QUALIFIED30Asiya Javayant
1015Ashley DoeItaly2025-09-04Rangoni Of Florence RENEWAL88Onyama Limba
1016Morrow RutaRussia2025-09-28Feiner Bros UNQUALIFIED39Anna Fali
1017Costa DilliardFrance2025-09-17Chemel, James L Cpa NEW22Stephen Shaw
1018Costa DilliardJapan2025-09-19Morlong Associates QUALIFIED44Anna Fali
1019Munro FerenczJapan2025-09-16Chemel, James L Cpa NEW80Bernardo Dominic
1020Antonio CaudyAustralia2025-09-02Chapman, Ross E Esq NEW79Amy Elsner
1021Adams MorascaSpain2025-09-13Chemel, James L Cpa RENEWAL50Bernardo Dominic
1022Izzy GarufiBrazil2025-09-02Rousseaux, Michael Esq PROPOSAL37Stephen Shaw
1023Ashley DoeRussia2025-09-22Feltz Printing Service NEW84Stephen Shaw
1024James ButtBrazil2025-08-31Feiner Bros QUALIFIED1Asiya Javayant
1025Stacey MacleadItaly2025-09-07Chemel, James L Cpa NEW80Asiya Javayant
1026Chavez BriddickJapan2025-09-16Feltz Printing Service PROPOSAL78Anna Fali
1027Mayumi KolmetzIndia2025-09-18Chapman, Ross E Esq PROPOSAL34Asiya Javayant
1028Murillo MaletAustralia2025-09-01Feiner Bros RENEWAL30Ivan Magalhaes
1029Emily WhobreyJapan2025-09-12King, Christopher A Esq RENEWAL0Elwin Sharvill
1030Juan WieserFrance2025-09-07Chapman, Ross E Esq UNQUALIFIED9Ivan Magalhaes
1031Stacey MacleadFrance2025-09-03Truhlar And Truhlar Attys NEW97Bernardo Dominic
1032Mujtaba NickaBrazil2025-09-09Printing Dimensions PROPOSAL28Bernardo Dominic
1033Smith GlickUnited Kingdom2025-09-05King, Christopher A Esq NEGOTIATION25Asiya Javayant
1034Mayumi KolmetzAustralia2025-09-04King, Christopher A Esq UNQUALIFIED98Asiya Javayant
1035Munro FerenczSpain2025-09-24Feltz Printing Service UNQUALIFIED93Stephen Shaw
1036Antonio CaudyItaly2025-09-05Commercial Press NEGOTIATION49Stephen Shaw
1037Jeanfrancois VenereUnited Kingdom2025-09-11Chapman, Ross E Esq UNQUALIFIED44Stephen Shaw
1038Maria MarrierRussia2025-08-31Rousseaux, Michael Esq RENEWAL41Xuxue Feng
1039Jones VocelkaBrazil2025-09-09Chapman, Ross E Esq NEW39Bernardo Dominic
1040Antonio CaudySpain2025-09-18Chapman, Ross E Esq QUALIFIED22Amy Elsner
1041Aditya KuskoAustralia2025-09-13Chanay, Jeffrey A Esq RENEWAL67Ioni Bowcher
1042Isabel BowleyJapan2025-09-28King, Christopher A Esq PROPOSAL46Bernardo Dominic
1043Jeanfrancois VenereBrazil2025-09-10Feiner Bros QUALIFIED21Ivan Magalhaes
1044Greenwood BologniaBrazil2025-09-14Rousseaux, Michael Esq NEGOTIATION9Ioni Bowcher
1045Wickens NestleGermany2025-09-25King, Christopher A Esq NEW63Asiya Javayant
1046Cody SaylorsUnited Kingdom2025-09-24Printing Dimensions PROPOSAL70Anna Fali
1047David DarakjyItaly2025-09-23Rousseaux, Michael Esq NEW33Ioni Bowcher
1048Ivar PaprockiUnited Kingdom2025-09-16Chapman, Ross E Esq QUALIFIED19Anna Fali
1049Murillo MaletRussia2025-09-15Truhlar And Truhlar Attys QUALIFIED61Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
James ButtItalyOnyama Limba NEW
Francesco ShinkoItalyElwin Sharvill RENEWAL
Aika InouyeIndiaIoni Bowcher RENEWAL
Rodrigues CampainJapanAmy Elsner NEGOTIATION
Deepesh ChuiArgentinaElwin Sharvill UNQUALIFIED
Mayumi KolmetzSpainAsiya Javayant UNQUALIFIED
Emily WhobreyCanadaAmy Elsner QUALIFIED
Mayumi KolmetzRussiaAsiya Javayant UNQUALIFIED
James ButtIndiaOnyama Limba RENEWAL
Johnson SergiItalyXuxue Feng QUALIFIED
Nicolas IturbideRussiaElwin Sharvill QUALIFIED
Murillo MaletSpainElwin Sharvill PROPOSAL
Wickens NestleSpainStephen Shaw PROPOSAL
Izzy GarufiJapanElwin Sharvill PROPOSAL
Tony FollerBrazilBernardo Dominic QUALIFIED
Francesco ShinkoAustraliaIvan Magalhaes PROPOSAL
Silvio SlusarskiGermanyStephen Shaw NEW
Misaki RoysterFranceOnyama Limba PROPOSAL
Aditya KuskoItalyElwin Sharvill PROPOSAL
Wickens NestleUnited KingdomStephen Shaw RENEWAL
James ButtGermanyBernardo Dominic NEGOTIATION
Faith GillianRussiaElwin Sharvill PROPOSAL
Nicolas IturbideJapanIoni Bowcher PROPOSAL
Alejandro PerinCanadaIoni Bowcher UNQUALIFIED
Jennifer AmigonArgentinaOnyama Limba QUALIFIED
Ivar PaprockiBrazilBernardo Dominic NEGOTIATION
Mayumi KolmetzIndiaStephen Shaw NEW
Juan WieserJapanIoni Bowcher RENEWAL
Ashley DoeSpainOnyama Limba NEGOTIATION
Morrow RutaFranceIoni Bowcher NEW
Kaitlin OstroskyArgentinaIoni Bowcher RENEWAL
Sinclair WaycottIndiaAsiya Javayant QUALIFIED
James ButtFranceStephen Shaw QUALIFIED
Aika InouyeFranceXuxue Feng UNQUALIFIED
Alejandro PerinFranceXuxue Feng UNQUALIFIED
Isabel BowleyJapanElwin Sharvill QUALIFIED
Munro FerenczFranceStephen Shaw NEGOTIATION
Aruna FigeroaAustraliaOnyama Limba PROPOSAL
Kadeem FlosiFranceXuxue Feng PROPOSAL
Alejandro PerinGermanyAsiya Javayant NEW
Ricardo GauchoSpainOnyama Limba QUALIFIED
Aruna FigeroaJapanBernardo Dominic RENEWAL
Clifford RimUnited KingdomAsiya Javayant UNQUALIFIED
Jones VocelkaCanadaAnna Fali PROPOSAL
Emily WhobreyGermanyBernardo Dominic NEW
Maria MarrierUnited KingdomXuxue Feng PROPOSAL
Salvatore StockhamIndiaAmy Elsner NEW
Antonio CaudyJapanStephen Shaw NEW
Antonio CaudyGermanyIoni Bowcher UNQUALIFIED
Munro FerenczUnited KingdomOnyama Limba PROPOSAL
Frozen Columns
Name
Rodrigues Campain
Aditya Kusko
Isabel Bowley
Smith Glick
Sinclair Waycott
Smith Glick
Salvatore Stockham
Emily Whobrey
Julie Stenseth
Jones Vocelka
Smith Glick
Smith Glick
Arvin Albares
Morrow Ruta
Darci Poquette
Ivar Paprocki
Silvio Slusarski
Wickens Nestle
Aruna Figeroa
Nicolas Iturbide
Juan Wieser
Arvin Albares
Francesco Shinko
Rodrigues Campain
Darci Poquette
Ivar Paprocki
Darci Poquette
Antonio Caudy
Cody Saylors
Munro Ferencz
Mujtaba Nicka
Darci Poquette
Ashley Doe
Alejandro Perin
Izzy Garufi
Leja Caldarera
Nicolas Iturbide
Jeanfrancois Venere
Costa Dilliard
Leja Caldarera
Jones Vocelka
Chavez Briddick
David Darakjy
Alejandro Perin
Silvio Slusarski
Leja Caldarera
Aruna Figeroa
Darci Poquette
Stacey Maclead
Tony Foller
IdCountryDate
1000Russia2025-09-13
1001Russia2025-09-18
1002Canada2025-09-26
1003France2025-09-28
1004United Kingdom2025-09-16
1005India2025-09-24
1006Canada2025-09-09
1007Australia2025-09-16
1008Australia2025-09-02
1009India2025-09-25
1010India2025-09-16
1011Spain2025-09-12
1012Australia2025-09-03
1013Japan2025-09-16
1014Canada2025-09-19
1015Canada2025-09-15
1016Japan2025-09-01
1017United Kingdom2025-09-15
1018United Kingdom2025-09-25
1019Australia2025-09-13
1020Italy2025-09-07
1021United Kingdom2025-09-12
1022France2025-09-19
1023Canada2025-09-23
1024Germany2025-09-18
1025Germany2025-09-10
1026Canada2025-09-13
1027Brazil2025-09-18
1028Japan2025-09-20
1029Brazil2025-09-18
1030United Kingdom2025-09-13
1031Argentina2025-08-31
1032Canada2025-09-17
1033India2025-09-14
1034Germany2025-09-26
1035Germany2025-09-04
1036Australia2025-09-16
1037Spain2025-09-15
1038Brazil2025-09-22
1039Argentina2025-09-02
1040Germany2025-09-15
1041Australia2025-09-22
1042Russia2025-09-10
1043Canada2025-09-10
1044Russia2025-09-18
1045United Kingdom2025-09-02
1046Italy2025-09-05
1047United Kingdom2025-09-15
1048France2025-09-29
1049Argentina2025-09-27

On-Demand Data

NameIdCountryDate
Cody Saylors1000Japan2025-09-27
Alejandro Perin1001France2025-09-06
Ricardo Gaucho1002France2025-09-29
James Butt1003Spain2025-09-08
Cody Saylors1004Italy2025-09-13
Emily Whobrey1005France2025-08-31
Ivar Paprocki1006India2025-09-27
Johnson Sergi1007Japan2025-08-31
Mujtaba Nicka1008Germany2025-09-25
Leja Caldarera1009Argentina2025-09-09
Jeanfrancois Venere1010Russia2025-09-28
Claire Tollner1011Canada2025-09-04
Salvatore Stockham1012Brazil2025-09-10
Sinclair Waycott1013Argentina2025-09-01
Mayumi Kolmetz1014France2025-09-12
Wickens Nestle1015Japan2025-09-06
Darci Poquette1016Germany2025-09-09
Johnson Sergi1017Italy2025-09-12
Jennifer Amigon1018Germany2025-09-01
Wickens Nestle1019United Kingdom2025-09-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Adams MorascaJapanAnna Fali NEGOTIATION
Munro FerenczCanadaIoni Bowcher RENEWAL
Jennifer AmigonGermanyXuxue Feng QUALIFIED
Maria MarrierFranceIvan Magalhaes NEW
Octavia MaletIndiaIoni Bowcher RENEWAL
Leon OldroydUnited KingdomIoni Bowcher RENEWAL
Mujtaba NickaJapanAsiya Javayant NEW
Murillo MaletUnited KingdomOnyama Limba NEGOTIATION
Ashley DoeBrazilAmy Elsner UNQUALIFIED
Jones VocelkaAustraliaStephen Shaw NEW
Stacey MacleadItalyIoni Bowcher RENEWAL
Aika InouyeAustraliaAmy Elsner QUALIFIED
Izzy GarufiRussiaElwin Sharvill QUALIFIED
Mujtaba NickaUnited KingdomBernardo Dominic NEW
Aruna FigeroaItalyAsiya Javayant NEW
Antonio CaudyItalyIoni Bowcher QUALIFIED
Ivar PaprockiIndiaXuxue Feng QUALIFIED
Antonio CaudyRussiaIoni Bowcher PROPOSAL
Stacey MacleadAustraliaOnyama Limba PROPOSAL
Ashley DoeSpainIoni Bowcher QUALIFIED
Jones VocelkaFranceElwin Sharvill NEGOTIATION
Mayumi KolmetzFranceAmy Elsner NEW
Wickens NestleCanadaAsiya Javayant NEW
Kaitlin OstroskyIndiaAnna Fali RENEWAL
Emily WhobreyGermanyIvan Magalhaes UNQUALIFIED
Mayumi KolmetzUnited KingdomIoni Bowcher UNQUALIFIED
Francesco ShinkoBrazilStephen Shaw RENEWAL
Clifford RimIndiaIvan Magalhaes NEGOTIATION
Jefferson SchemmerCanadaElwin Sharvill NEGOTIATION
Leja CaldareraIndiaXuxue Feng QUALIFIED
Maisha RulapaughArgentinaBernardo Dominic NEW
Kadeem FlosiBrazilAsiya Javayant PROPOSAL
Jones VocelkaBrazilStephen Shaw RENEWAL
Isabel BowleyGermanyBernardo Dominic PROPOSAL
Johnson SergiAustraliaAnna Fali UNQUALIFIED
Nicolas IturbideAustraliaAmy Elsner UNQUALIFIED
Jones VocelkaCanadaElwin Sharvill UNQUALIFIED
Jones VocelkaItalyIoni Bowcher NEW
Maisha RulapaughBrazilOnyama Limba QUALIFIED
Rodrigues CampainUnited KingdomElwin Sharvill 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>