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
Wickens NestleGermanyAnna Fali QUALIFIED
Alejandro PerinSpainElwin Sharvill NEW
Faith GillianJapanIoni Bowcher PROPOSAL
Kaitlin OstroskyGermanyOnyama Limba QUALIFIED
Octavia MaletUnited KingdomIvan Magalhaes PROPOSAL
Cody SaylorsIndiaIvan Magalhaes NEGOTIATION
Sinclair WaycottJapanStephen Shaw UNQUALIFIED
Johnson SergiRussiaAmy Elsner QUALIFIED
Munro FerenczAustraliaXuxue Feng NEGOTIATION
David DarakjyAustraliaIoni Bowcher NEGOTIATION
Silvio SlusarskiBrazilIoni Bowcher UNQUALIFIED
Antonio CaudyRussiaStephen Shaw NEW
Ricardo GauchoArgentinaAmy Elsner RENEWAL
Maisha RulapaughArgentinaBernardo Dominic PROPOSAL
Stacey MacleadJapanXuxue Feng NEGOTIATION
Tony FollerItalyStephen Shaw UNQUALIFIED
Kaitlin OstroskyRussiaAsiya Javayant PROPOSAL
Claire TollnerBrazilOnyama Limba PROPOSAL
Antonio CaudyArgentinaAsiya Javayant NEW
Johnson SergiItalyIvan Magalhaes NEGOTIATION
Aruna FigeroaFranceXuxue Feng PROPOSAL
Ivar PaprockiBrazilAsiya Javayant NEGOTIATION
Arvin AlbaresJapanAnna Fali PROPOSAL
Mayumi KolmetzAustraliaStephen Shaw UNQUALIFIED
Misaki RoysterArgentinaIoni Bowcher UNQUALIFIED
Ivar PaprockiGermanyIvan Magalhaes NEW
Mayumi KolmetzRussiaBernardo Dominic UNQUALIFIED
Costa DilliardBrazilElwin Sharvill NEGOTIATION
Maisha RulapaughBrazilStephen Shaw PROPOSAL
Cody SaylorsItalyIvan Magalhaes NEW
Emily WhobreySpainXuxue Feng UNQUALIFIED
Jeanfrancois VenereItalyIoni Bowcher PROPOSAL
Stacey MacleadGermanyAsiya Javayant RENEWAL
Deepesh ChuiJapanAsiya Javayant PROPOSAL
Morrow RutaArgentinaAsiya Javayant PROPOSAL
Misaki RoysterItalyAsiya Javayant NEGOTIATION
Isabel BowleyGermanyIvan Magalhaes PROPOSAL
Salvatore StockhamIndiaXuxue Feng NEGOTIATION
Kaitlin OstroskyArgentinaAsiya Javayant NEW
Emily WhobreyUnited KingdomAmy Elsner NEW
Aditya KuskoItalyAsiya Javayant NEW
Kadeem FlosiUnited KingdomOnyama Limba QUALIFIED
Cody SaylorsFranceAmy Elsner NEGOTIATION
Smith GlickCanadaOnyama Limba QUALIFIED
Aika InouyeUnited KingdomIoni Bowcher NEGOTIATION
Leon OldroydArgentinaBernardo Dominic RENEWAL
Mujtaba NickaBrazilXuxue Feng RENEWAL
Jeanfrancois VenereUnited KingdomIoni Bowcher NEGOTIATION
Stacey MacleadSpainAmy Elsner PROPOSAL
Nicolas IturbideIndiaXuxue Feng UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Jennifer AmigonIndiaIoni Bowcher NEW
Leja CaldareraAustraliaIvan Magalhaes QUALIFIED
Ashley DoeGermanyOnyama Limba PROPOSAL
Darci PoquetteIndiaAsiya Javayant UNQUALIFIED
Isabel BowleyUnited KingdomXuxue Feng NEGOTIATION
Cody SaylorsUnited KingdomIoni Bowcher RENEWAL
Kadeem FlosiBrazilOnyama Limba NEGOTIATION
Arvin AlbaresIndiaIvan Magalhaes PROPOSAL
Costa DilliardIndiaAsiya Javayant QUALIFIED
Tony FollerSpainIvan Magalhaes NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Stacey MacleadJapan2026-06-09Chanay, Jeffrey A Esq QUALIFIED72Ioni Bowcher
1001Jones VocelkaUnited Kingdom2026-06-07Dorl, James J Esq PROPOSAL46Onyama Limba
1002Leon OldroydIndia2026-05-28Rangoni Of Florence NEW59Asiya Javayant
1003Jennifer AmigonIndia2026-06-06Rousseaux, Michael Esq NEGOTIATION88Elwin Sharvill
1004Silvio SlusarskiBrazil2026-06-04Feltz Printing Service RENEWAL82Ivan Magalhaes
1005Silvio SlusarskiItaly2026-06-01Chemel, James L Cpa UNQUALIFIED3Ioni Bowcher
1006Deepesh ChuiAustralia2026-06-09Dorl, James J Esq QUALIFIED70Stephen Shaw
1007Kadeem FlosiRussia2026-06-19Truhlar And Truhlar Attys PROPOSAL90Amy Elsner
1008Leja CaldareraItaly2026-05-25Chemel, James L Cpa RENEWAL10Stephen Shaw
1009Octavia MaletJapan2026-06-12Feiner Bros RENEWAL28Onyama Limba
1010Rodrigues CampainItaly2026-06-18Benton, John B Jr NEW99Anna Fali
1011Francesco ShinkoRussia2026-06-16Chemel, James L Cpa UNQUALIFIED91Xuxue Feng
1012Maria MarrierAustralia2026-05-28Chapman, Ross E Esq UNQUALIFIED0Bernardo Dominic
1013Leja CaldareraIndia2026-06-10King, Christopher A Esq QUALIFIED51Ioni Bowcher
1014James ButtFrance2026-06-15Rousseaux, Michael Esq NEGOTIATION92Onyama Limba
1015Leon OldroydItaly2026-06-11Dorl, James J Esq NEGOTIATION33Bernardo Dominic
1016Maisha RulapaughUnited Kingdom2026-06-03Dorl, James J Esq RENEWAL6Anna Fali
1017Ashley DoeRussia2026-06-18Feiner Bros RENEWAL8Onyama Limba
1018Jefferson SchemmerItaly2026-06-07Rangoni Of Florence UNQUALIFIED64Ioni Bowcher
1019Stacey MacleadCanada2026-06-10Feltz Printing Service QUALIFIED62Onyama Limba
1020Alejandro PerinBrazil2026-06-14Truhlar And Truhlar Attys NEW56Ioni Bowcher
1021Julie StensethSpain2026-05-23Printing Dimensions RENEWAL1Xuxue Feng
1022Chavez BriddickCanada2026-06-07Chemel, James L Cpa UNQUALIFIED94Amy Elsner
1023Nicolas IturbideBrazil2026-06-10Feiner Bros RENEWAL25Onyama Limba
1024Ivar PaprockiGermany2026-05-30Buckley Miller Wright NEW3Anna Fali
1025Mujtaba NickaJapan2026-05-28Chanay, Jeffrey A Esq PROPOSAL76Ioni Bowcher
1026Nicolas IturbideRussia2026-05-25Dorl, James J Esq RENEWAL12Bernardo Dominic
1027Francesco ShinkoJapan2026-05-30Rousseaux, Michael Esq QUALIFIED52Amy Elsner
1028Antonio CaudyArgentina2026-06-09King, Christopher A Esq PROPOSAL67Anna Fali
1029Jefferson SchemmerFrance2026-05-30Chapman, Ross E Esq NEGOTIATION5Bernardo Dominic
1030Jones VocelkaAustralia2026-06-06Rangoni Of Florence RENEWAL63Stephen Shaw
1031Salvatore StockhamAustralia2026-06-19Commercial Press NEW38Stephen Shaw
1032Jones VocelkaJapan2026-06-07Commercial Press PROPOSAL45Anna Fali
1033Antonio CaudyFrance2026-05-28Rangoni Of Florence PROPOSAL92Ivan Magalhaes
1034Tony FollerFrance2026-06-09Benton, John B Jr QUALIFIED21Bernardo Dominic
1035Leja CaldareraIndia2026-06-11Truhlar And Truhlar Attys RENEWAL89Asiya Javayant
1036Munro FerenczAustralia2026-06-13Feiner Bros RENEWAL54Anna Fali
1037Rodrigues CampainCanada2026-06-18Truhlar And Truhlar Attys PROPOSAL62Asiya Javayant
1038Claire TollnerBrazil2026-05-30King, Christopher A Esq RENEWAL42Anna Fali
1039Antonio CaudySpain2026-06-06Chapman, Ross E Esq UNQUALIFIED36Bernardo Dominic
1040Mayumi KolmetzIndia2026-06-10Chemel, James L Cpa NEGOTIATION96Ioni Bowcher
1041Salvatore StockhamUnited Kingdom2026-05-22King, Christopher A Esq NEW11Ioni Bowcher
1042Isabel BowleyAustralia2026-05-24Benton, John B Jr PROPOSAL22Onyama Limba
1043Adams MorascaJapan2026-06-02Truhlar And Truhlar Attys RENEWAL21Xuxue Feng
1044Jones VocelkaCanada2026-06-02Feiner Bros RENEWAL60Bernardo Dominic
1045Alejandro PerinItaly2026-06-17Chapman, Ross E Esq NEGOTIATION71Amy Elsner
1046Tony FollerFrance2026-06-06Truhlar And Truhlar Attys NEW98Anna Fali
1047Jones VocelkaCanada2026-05-31Feiner Bros UNQUALIFIED60Ioni Bowcher
1048Ricardo GauchoArgentina2026-06-03Buckley Miller Wright UNQUALIFIED9Anna Fali
1049Kaitlin OstroskyIndia2026-05-25Chanay, Jeffrey A Esq UNQUALIFIED7Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Nicolas IturbideJapanIvan Magalhaes PROPOSAL
Jefferson SchemmerSpainAsiya Javayant NEW
Adams MorascaJapanIoni Bowcher UNQUALIFIED
Johnson SergiSpainBernardo Dominic NEW
Maria MarrierItalyStephen Shaw NEW
Ashley DoeArgentinaAnna Fali RENEWAL
Alejandro PerinItalyAmy Elsner QUALIFIED
Sinclair WaycottArgentinaElwin Sharvill NEW
Tony FollerItalyElwin Sharvill UNQUALIFIED
Ivar PaprockiItalyXuxue Feng NEGOTIATION
Jennifer AmigonGermanyStephen Shaw NEW
Mayumi KolmetzIndiaIoni Bowcher NEGOTIATION
Salvatore StockhamRussiaBernardo Dominic NEW
Jones VocelkaArgentinaAnna Fali PROPOSAL
Silvio SlusarskiFranceAnna Fali RENEWAL
Emily WhobreyUnited KingdomIvan Magalhaes PROPOSAL
Morrow RutaArgentinaXuxue Feng QUALIFIED
Jefferson SchemmerJapanElwin Sharvill PROPOSAL
Alejandro PerinIndiaBernardo Dominic UNQUALIFIED
Octavia MaletItalyAsiya Javayant QUALIFIED
Isabel BowleyFranceAsiya Javayant RENEWAL
Chavez BriddickUnited KingdomElwin Sharvill RENEWAL
Greenwood BologniaSpainXuxue Feng PROPOSAL
Adams MorascaArgentinaAnna Fali PROPOSAL
Jennifer AmigonArgentinaAsiya Javayant PROPOSAL
Nicolas IturbideItalyBernardo Dominic NEW
Deepesh ChuiBrazilAmy Elsner RENEWAL
Costa DilliardArgentinaAmy Elsner UNQUALIFIED
Maisha RulapaughIndiaStephen Shaw NEGOTIATION
Juan WieserAustraliaOnyama Limba NEGOTIATION
Mujtaba NickaArgentinaStephen Shaw QUALIFIED
Wickens NestleFranceIoni Bowcher QUALIFIED
Deepesh ChuiArgentinaIvan Magalhaes PROPOSAL
Jefferson SchemmerRussiaAmy Elsner UNQUALIFIED
Greenwood BologniaAustraliaElwin Sharvill UNQUALIFIED
Isabel BowleyIndiaAnna Fali PROPOSAL
Octavia MaletJapanXuxue Feng RENEWAL
Adams MorascaAustraliaAsiya Javayant NEW
Jennifer AmigonRussiaAsiya Javayant UNQUALIFIED
Adams MorascaAustraliaStephen Shaw NEW
Misaki RoysterIndiaStephen Shaw QUALIFIED
Mujtaba NickaItalyXuxue Feng NEW
Aruna FigeroaAustraliaStephen Shaw RENEWAL
Ricardo GauchoIndiaElwin Sharvill UNQUALIFIED
Emily WhobreyFranceStephen Shaw QUALIFIED
Johnson SergiAustraliaOnyama Limba NEW
Octavia MaletFranceBernardo Dominic NEGOTIATION
Murillo MaletAustraliaOnyama Limba RENEWAL
Wickens NestleItalyAmy Elsner NEW
Arvin AlbaresIndiaXuxue Feng NEW
Frozen Columns
Name
Juan Wieser
Claire Tollner
Octavia Malet
Greenwood Bolognia
Jones Vocelka
Leon Oldroyd
Emily Whobrey
Julie Stenseth
Aruna Figeroa
Nicolas Iturbide
Mujtaba Nicka
Arvin Albares
Adams Morasca
David Darakjy
Octavia Malet
Greenwood Bolognia
Alejandro Perin
Jeanfrancois Venere
Deepesh Chui
Adams Morasca
Darci Poquette
Emily Whobrey
David Darakjy
Francesco Shinko
David Darakjy
Julie Stenseth
Nicolas Iturbide
Francesco Shinko
Salvatore Stockham
Ashley Doe
Munro Ferencz
Aika Inouye
Murillo Malet
Darci Poquette
Jefferson Schemmer
Mujtaba Nicka
Maria Marrier
Aditya Kusko
Wickens Nestle
Ricardo Gaucho
Aruna Figeroa
Jeanfrancois Venere
Cody Saylors
Cody Saylors
Antonio Caudy
Munro Ferencz
Deepesh Chui
Aditya Kusko
Kadeem Flosi
Antonio Caudy
IdCountryDate
1000United Kingdom2026-06-06
1001France2026-06-13
1002France2026-06-12
1003Australia2026-06-08
1004Canada2026-06-15
1005France2026-05-28
1006Italy2026-06-15
1007Australia2026-06-19
1008Australia2026-05-26
1009France2026-06-06
1010Australia2026-05-27
1011Italy2026-05-22
1012Spain2026-06-07
1013Australia2026-06-03
1014Argentina2026-06-12
1015India2026-05-27
1016Argentina2026-06-03
1017Canada2026-06-20
1018Spain2026-06-10
1019Brazil2026-06-11
1020Argentina2026-06-15
1021Australia2026-06-18
1022Italy2026-06-20
1023Spain2026-05-23
1024Argentina2026-06-08
1025India2026-06-20
1026Germany2026-05-25
1027Germany2026-06-05
1028Japan2026-06-11
1029Brazil2026-06-09
1030Italy2026-06-09
1031Spain2026-05-26
1032Argentina2026-06-06
1033Japan2026-06-12
1034Spain2026-06-03
1035India2026-06-02
1036Italy2026-06-02
1037India2026-06-13
1038Australia2026-05-29
1039Canada2026-05-30
1040Brazil2026-06-03
1041India2026-06-05
1042Russia2026-06-19
1043Italy2026-06-13
1044Italy2026-06-09
1045Germany2026-06-05
1046Spain2026-06-06
1047Australia2026-05-24
1048United Kingdom2026-06-05
1049Canada2026-06-13

On-Demand Data

NameIdCountryDate
David Darakjy1000Japan2026-05-26
Mayumi Kolmetz1001Australia2026-06-12
Nicolas Iturbide1002Russia2026-06-16
Izzy Garufi1003Canada2026-05-26
Leon Oldroyd1004France2026-05-30
Stacey Maclead1005Canada2026-05-22
Mayumi Kolmetz1006Brazil2026-06-16
Sinclair Waycott1007India2026-05-31
Greenwood Bolognia1008Italy2026-06-06
Johnson Sergi1009Russia2026-06-13
Sinclair Waycott1010Japan2026-06-05
Aruna Figeroa1011India2026-05-22
Antonio Caudy1012Russia2026-05-23
Nicolas Iturbide1013Japan2026-05-22
Maisha Rulapaugh1014Brazil2026-06-14
Tony Foller1015Argentina2026-06-16
Chavez Briddick1016United Kingdom2026-06-07
Munro Ferencz1017United Kingdom2026-06-18
Jones Vocelka1018France2026-06-09
Aditya Kusko1019Russia2026-06-05
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Costa DilliardCanadaOnyama Limba PROPOSAL
Morrow RutaJapanStephen Shaw PROPOSAL
Salvatore StockhamSpainXuxue Feng QUALIFIED
Izzy GarufiJapanBernardo Dominic PROPOSAL
Ricardo GauchoGermanyIoni Bowcher RENEWAL
Misaki RoysterRussiaStephen Shaw PROPOSAL
Cody SaylorsArgentinaXuxue Feng NEW
Darci PoquetteCanadaOnyama Limba PROPOSAL
Jefferson SchemmerAustraliaAsiya Javayant NEW
Maisha RulapaughCanadaAnna Fali RENEWAL
Juan WieserUnited KingdomAnna Fali NEGOTIATION
Jennifer AmigonSpainXuxue Feng NEGOTIATION
Alejandro PerinAustraliaElwin Sharvill NEW
Emily WhobreySpainXuxue Feng UNQUALIFIED
Sinclair WaycottItalyIoni Bowcher NEGOTIATION
Kadeem FlosiItalyBernardo Dominic NEW
David DarakjyAustraliaAnna Fali PROPOSAL
Leja CaldareraGermanyIvan Magalhaes NEW
Mujtaba NickaJapanXuxue Feng UNQUALIFIED
Aditya KuskoIndiaIoni Bowcher QUALIFIED
Tony FollerSpainElwin Sharvill QUALIFIED
Costa DilliardArgentinaAsiya Javayant NEW
Greenwood BologniaSpainElwin Sharvill NEW
Nicolas IturbideRussiaAnna Fali PROPOSAL
Darci PoquetteAustraliaElwin Sharvill NEGOTIATION
Juan WieserRussiaStephen Shaw NEGOTIATION
Aditya KuskoJapanAsiya Javayant NEGOTIATION
Claire TollnerCanadaAsiya Javayant UNQUALIFIED
Kaitlin OstroskyGermanyElwin Sharvill PROPOSAL
Aika InouyeAustraliaXuxue Feng RENEWAL
Smith GlickArgentinaStephen Shaw RENEWAL
Tony FollerArgentinaXuxue Feng UNQUALIFIED
Clifford RimArgentinaAsiya Javayant QUALIFIED
Nicolas IturbideFranceBernardo Dominic QUALIFIED
Johnson SergiIndiaOnyama Limba UNQUALIFIED
Wickens NestleRussiaAnna Fali UNQUALIFIED
Silvio SlusarskiFranceAmy Elsner UNQUALIFIED
Isabel BowleyItalyStephen Shaw RENEWAL
Wickens NestleGermanyOnyama Limba UNQUALIFIED
Maisha RulapaughItalyIvan Magalhaes NEW

<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>