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
Johnson SergiUnited KingdomElwin Sharvill RENEWAL
Isabel BowleyJapanXuxue Feng NEGOTIATION
Ricardo GauchoItalyXuxue Feng UNQUALIFIED
Mujtaba NickaJapanXuxue Feng UNQUALIFIED
Maria MarrierSpainAnna Fali QUALIFIED
Octavia MaletBrazilStephen Shaw UNQUALIFIED
Mujtaba NickaGermanyElwin Sharvill NEW
Munro FerenczBrazilStephen Shaw PROPOSAL
Kaitlin OstroskyAustraliaIoni Bowcher QUALIFIED
Chavez BriddickBrazilStephen Shaw PROPOSAL
Johnson SergiUnited KingdomBernardo Dominic NEW
Costa DilliardGermanyXuxue Feng RENEWAL
Aruna FigeroaItalyAmy Elsner PROPOSAL
Misaki RoysterItalyAsiya Javayant NEW
Deepesh ChuiItalyBernardo Dominic PROPOSAL
Alejandro PerinIndiaXuxue Feng NEW
Jefferson SchemmerFranceIoni Bowcher NEGOTIATION
Isabel BowleyItalyAsiya Javayant NEGOTIATION
Silvio SlusarskiSpainStephen Shaw NEGOTIATION
Mujtaba NickaBrazilAsiya Javayant UNQUALIFIED
Arvin AlbaresGermanyIvan Magalhaes NEW
Octavia MaletFranceBernardo Dominic RENEWAL
Emily WhobreyArgentinaXuxue Feng NEGOTIATION
Kadeem FlosiIndiaIoni Bowcher PROPOSAL
Salvatore StockhamAustraliaAnna Fali NEGOTIATION
Ricardo GauchoAustraliaIoni Bowcher NEGOTIATION
Aruna FigeroaGermanyAsiya Javayant NEGOTIATION
Antonio CaudyItalyElwin Sharvill NEW
Adams MorascaBrazilElwin Sharvill QUALIFIED
Johnson SergiItalyStephen Shaw RENEWAL
Maisha RulapaughCanadaStephen Shaw NEGOTIATION
Maisha RulapaughRussiaAsiya Javayant NEGOTIATION
Alejandro PerinArgentinaAnna Fali PROPOSAL
Wickens NestleCanadaStephen Shaw NEGOTIATION
Jeanfrancois VenereBrazilIoni Bowcher QUALIFIED
Claire TollnerBrazilAnna Fali NEGOTIATION
Ashley DoeAustraliaElwin Sharvill UNQUALIFIED
Rodrigues CampainUnited KingdomAmy Elsner QUALIFIED
Jennifer AmigonUnited KingdomElwin Sharvill UNQUALIFIED
Darci PoquetteJapanElwin Sharvill NEW
Rodrigues CampainJapanAnna Fali NEW
Adams MorascaRussiaStephen Shaw RENEWAL
Greenwood BologniaIndiaAmy Elsner PROPOSAL
Costa DilliardBrazilIoni Bowcher NEW
Arvin AlbaresBrazilStephen Shaw NEGOTIATION
Ashley DoeUnited KingdomBernardo Dominic RENEWAL
Kadeem FlosiUnited KingdomIoni Bowcher UNQUALIFIED
Isabel BowleyItalyIoni Bowcher UNQUALIFIED
Misaki RoysterUnited KingdomElwin Sharvill QUALIFIED
Maria MarrierFranceStephen Shaw NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
James ButtAustraliaIvan Magalhaes QUALIFIED
Mujtaba NickaAustraliaIvan Magalhaes UNQUALIFIED
Nicolas IturbideArgentinaAsiya Javayant PROPOSAL
Adams MorascaSpainIoni Bowcher NEGOTIATION
Leja CaldareraJapanIvan Magalhaes NEW
Misaki RoysterFranceOnyama Limba RENEWAL
Maria MarrierUnited KingdomStephen Shaw PROPOSAL
Rodrigues CampainAustraliaElwin Sharvill PROPOSAL
Smith GlickRussiaXuxue Feng PROPOSAL
Jeanfrancois VenereUnited KingdomStephen Shaw PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Antonio CaudyCanada2026-06-14Chapman, Ross E Esq NEGOTIATION24Bernardo Dominic
1001Misaki RoysterArgentina2026-05-29Buckley Miller Wright NEW67Bernardo Dominic
1002Aika InouyeUnited Kingdom2026-06-09Chanay, Jeffrey A Esq QUALIFIED49Ioni Bowcher
1003Ashley DoeFrance2026-05-31Feltz Printing Service RENEWAL74Stephen Shaw
1004Aika InouyeFrance2026-05-28Morlong Associates NEGOTIATION0Elwin Sharvill
1005Nicolas IturbideSpain2026-06-11Commercial Press QUALIFIED83Ivan Magalhaes
1006Munro FerenczCanada2026-06-02Benton, John B Jr UNQUALIFIED8Ioni Bowcher
1007Nicolas IturbideUnited Kingdom2026-06-04King, Christopher A Esq NEW22Amy Elsner
1008Misaki RoysterCanada2026-06-13Feltz Printing Service NEGOTIATION94Asiya Javayant
1009Leon OldroydGermany2026-06-07Feiner Bros NEGOTIATION64Ioni Bowcher
1010Aditya KuskoFrance2026-06-19Benton, John B Jr QUALIFIED97Stephen Shaw
1011Smith GlickItaly2026-06-11Chemel, James L Cpa NEW53Ivan Magalhaes
1012Mayumi KolmetzIndia2026-06-04Commercial Press UNQUALIFIED87Onyama Limba
1013Aditya KuskoItaly2026-05-31Commercial Press NEW91Ivan Magalhaes
1014Chavez BriddickCanada2026-06-04Chapman, Ross E Esq NEGOTIATION60Ivan Magalhaes
1015Deepesh ChuiAustralia2026-05-25Dorl, James J Esq QUALIFIED18Amy Elsner
1016Wickens NestleAustralia2026-05-26Chemel, James L Cpa RENEWAL6Ioni Bowcher
1017Julie StensethSpain2026-06-01Truhlar And Truhlar Attys RENEWAL33Amy Elsner
1018Maria MarrierFrance2026-06-14Commercial Press PROPOSAL88Ioni Bowcher
1019Ricardo GauchoJapan2026-05-24Rangoni Of Florence RENEWAL46Onyama Limba
1020Morrow RutaArgentina2026-05-30Chanay, Jeffrey A Esq NEGOTIATION65Xuxue Feng
1021Alejandro PerinIndia2026-05-31Benton, John B Jr NEGOTIATION69Amy Elsner
1022Arvin AlbaresRussia2026-06-18Feiner Bros PROPOSAL75Amy Elsner
1023Julie StensethSpain2026-06-18Feiner Bros QUALIFIED17Xuxue Feng
1024Julie StensethBrazil2026-06-01Morlong Associates UNQUALIFIED44Asiya Javayant
1025Salvatore StockhamBrazil2026-06-03Morlong Associates RENEWAL93Stephen Shaw
1026Aruna FigeroaItaly2026-05-26Benton, John B Jr UNQUALIFIED46Bernardo Dominic
1027Smith GlickArgentina2026-05-24Buckley Miller Wright QUALIFIED79Ioni Bowcher
1028Mujtaba NickaFrance2026-06-10Rangoni Of Florence NEGOTIATION18Ioni Bowcher
1029Juan WieserFrance2026-06-16Chapman, Ross E Esq NEGOTIATION46Ioni Bowcher
1030Wickens NestleItaly2026-06-15Rousseaux, Michael Esq NEGOTIATION15Ivan Magalhaes
1031Maisha RulapaughItaly2026-06-20Feltz Printing Service PROPOSAL59Bernardo Dominic
1032Arvin AlbaresAustralia2026-06-05Benton, John B Jr QUALIFIED23Elwin Sharvill
1033Greenwood BologniaRussia2026-05-25Commercial Press QUALIFIED73Xuxue Feng
1034Leon OldroydSpain2026-06-21Dorl, James J Esq NEGOTIATION65Elwin Sharvill
1035Munro FerenczSpain2026-06-13Feltz Printing Service NEGOTIATION69Stephen Shaw
1036Maria MarrierItaly2026-05-30Rousseaux, Michael Esq NEGOTIATION35Stephen Shaw
1037Morrow RutaUnited Kingdom2026-05-24Feltz Printing Service RENEWAL42Ivan Magalhaes
1038Faith GillianArgentina2026-06-16Chapman, Ross E Esq NEGOTIATION85Amy Elsner
1039Misaki RoysterUnited Kingdom2026-06-07Feltz Printing Service UNQUALIFIED51Anna Fali
1040Silvio SlusarskiSpain2026-06-02Dorl, James J Esq NEGOTIATION77Ivan Magalhaes
1041Rodrigues CampainGermany2026-06-11Rangoni Of Florence RENEWAL41Anna Fali
1042Misaki RoysterAustralia2026-06-05Chapman, Ross E Esq NEW35Ivan Magalhaes
1043Costa DilliardFrance2026-06-07Benton, John B Jr NEW86Amy Elsner
1044Stacey MacleadAustralia2026-05-28Feltz Printing Service UNQUALIFIED99Elwin Sharvill
1045Smith GlickArgentina2026-05-25Chemel, James L Cpa NEGOTIATION11Asiya Javayant
1046Smith GlickItaly2026-06-16Truhlar And Truhlar Attys NEGOTIATION56Ivan Magalhaes
1047Johnson SergiFrance2026-05-25Truhlar And Truhlar Attys PROPOSAL18Asiya Javayant
1048Emily WhobreyCanada2026-06-14Benton, John B Jr NEW10Ioni Bowcher
1049Isabel BowleyArgentina2026-06-18Printing Dimensions QUALIFIED24Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Julie StensethJapanIvan Magalhaes NEGOTIATION
Munro FerenczGermanyOnyama Limba NEW
Francesco ShinkoArgentinaAnna Fali NEGOTIATION
Costa DilliardFranceOnyama Limba NEGOTIATION
Chavez BriddickArgentinaOnyama Limba PROPOSAL
David DarakjyIndiaAnna Fali UNQUALIFIED
Alejandro PerinBrazilAsiya Javayant UNQUALIFIED
Octavia MaletArgentinaIvan Magalhaes NEGOTIATION
Chavez BriddickRussiaIoni Bowcher PROPOSAL
Misaki RoysterGermanyStephen Shaw NEGOTIATION
Emily WhobreyRussiaIoni Bowcher UNQUALIFIED
Salvatore StockhamCanadaIoni Bowcher RENEWAL
Leon OldroydCanadaXuxue Feng PROPOSAL
Morrow RutaArgentinaAsiya Javayant NEW
Antonio CaudyItalyIoni Bowcher NEGOTIATION
Jones VocelkaJapanOnyama Limba RENEWAL
Emily WhobreyIndiaOnyama Limba NEGOTIATION
Leon OldroydGermanyElwin Sharvill NEW
Munro FerenczArgentinaIoni Bowcher NEGOTIATION
Morrow RutaIndiaAnna Fali QUALIFIED
Munro FerenczArgentinaBernardo Dominic PROPOSAL
Stacey MacleadJapanElwin Sharvill PROPOSAL
Jennifer AmigonJapanIvan Magalhaes NEW
Ivar PaprockiAustraliaElwin Sharvill RENEWAL
Morrow RutaBrazilAmy Elsner NEW
Aditya KuskoSpainElwin Sharvill UNQUALIFIED
Leon OldroydBrazilOnyama Limba RENEWAL
Murillo MaletFranceXuxue Feng QUALIFIED
Izzy GarufiItalyStephen Shaw QUALIFIED
Leja CaldareraArgentinaBernardo Dominic NEGOTIATION
Munro FerenczBrazilBernardo Dominic QUALIFIED
Kaitlin OstroskyIndiaXuxue Feng NEW
Jeanfrancois VenereAustraliaAnna Fali NEW
Rodrigues CampainSpainXuxue Feng UNQUALIFIED
Smith GlickGermanyAnna Fali UNQUALIFIED
Leon OldroydUnited KingdomElwin Sharvill NEW
Aruna FigeroaAustraliaOnyama Limba RENEWAL
Aruna FigeroaBrazilAsiya Javayant RENEWAL
Aika InouyeItalyElwin Sharvill PROPOSAL
Antonio CaudyFranceIoni Bowcher NEGOTIATION
Rodrigues CampainRussiaAnna Fali PROPOSAL
David DarakjyAustraliaAsiya Javayant NEGOTIATION
Tony FollerCanadaOnyama Limba NEGOTIATION
Alejandro PerinFranceAmy Elsner QUALIFIED
Leja CaldareraIndiaStephen Shaw NEGOTIATION
Kaitlin OstroskyJapanXuxue Feng PROPOSAL
Aditya KuskoRussiaAsiya Javayant NEW
Ivar PaprockiIndiaBernardo Dominic NEW
Deepesh ChuiItalyElwin Sharvill QUALIFIED
Kadeem FlosiArgentinaAnna Fali PROPOSAL
Frozen Columns
Name
Jeanfrancois Venere
Deepesh Chui
Munro Ferencz
Maria Marrier
Ashley Doe
Izzy Garufi
Francesco Shinko
Rodrigues Campain
Ashley Doe
Ivar Paprocki
Aruna Figeroa
Emily Whobrey
Octavia Malet
Jeanfrancois Venere
David Darakjy
Leon Oldroyd
Isabel Bowley
Greenwood Bolognia
Izzy Garufi
Silvio Slusarski
Silvio Slusarski
Julie Stenseth
Murillo Malet
Leja Caldarera
Nicolas Iturbide
Mujtaba Nicka
Isabel Bowley
Ashley Doe
Ashley Doe
Ivar Paprocki
Ricardo Gaucho
Misaki Royster
Kaitlin Ostrosky
Arvin Albares
Silvio Slusarski
Jennifer Amigon
Chavez Briddick
Clifford Rim
Ivar Paprocki
Jennifer Amigon
Antonio Caudy
Clifford Rim
Deepesh Chui
Leja Caldarera
Sinclair Waycott
Aruna Figeroa
Maisha Rulapaugh
Misaki Royster
David Darakjy
Mujtaba Nicka
IdCountryDate
1000Brazil2026-05-26
1001Japan2026-06-13
1002Russia2026-06-04
1003Russia2026-05-31
1004Brazil2026-06-09
1005Argentina2026-06-17
1006Brazil2026-06-11
1007Japan2026-06-21
1008Australia2026-05-23
1009Russia2026-06-11
1010Russia2026-06-07
1011Russia2026-06-06
1012Italy2026-06-16
1013Canada2026-06-20
1014Australia2026-06-02
1015Argentina2026-06-02
1016Canada2026-06-14
1017Italy2026-06-19
1018Italy2026-05-25
1019Spain2026-06-03
1020Spain2026-06-12
1021Japan2026-06-01
1022India2026-06-16
1023Russia2026-06-14
1024Russia2026-06-14
1025Japan2026-06-19
1026France2026-05-25
1027Italy2026-06-20
1028Argentina2026-06-11
1029Canada2026-06-03
1030Brazil2026-06-15
1031Germany2026-06-14
1032India2026-05-30
1033Argentina2026-06-12
1034Australia2026-06-03
1035Russia2026-06-18
1036India2026-06-05
1037India2026-06-08
1038Japan2026-06-12
1039Canada2026-06-15
1040United Kingdom2026-06-19
1041Italy2026-06-15
1042United Kingdom2026-06-01
1043Australia2026-06-04
1044United Kingdom2026-06-07
1045United Kingdom2026-06-04
1046Germany2026-06-06
1047France2026-06-10
1048United Kingdom2026-05-24
1049Argentina2026-06-20

On-Demand Data

NameIdCountryDate
Mayumi Kolmetz1000Japan2026-06-09
Arvin Albares1001Italy2026-05-26
Rodrigues Campain1002Germany2026-05-23
Cody Saylors1003France2026-06-08
Johnson Sergi1004France2026-06-02
Smith Glick1005Italy2026-06-21
Kadeem Flosi1006Brazil2026-06-05
Ricardo Gaucho1007Germany2026-06-18
Morrow Ruta1008France2026-06-06
Antonio Caudy1009France2026-05-26
Wickens Nestle1010Spain2026-05-26
Arvin Albares1011India2026-06-09
Rodrigues Campain1012Argentina2026-05-30
Johnson Sergi1013Italy2026-06-01
Maria Marrier1014Argentina2026-05-25
Maria Marrier1015Russia2026-06-04
Aruna Figeroa1016Japan2026-06-14
Greenwood Bolognia1017Japan2026-06-04
Isabel Bowley1018Spain2026-06-01
Jefferson Schemmer1019India2026-05-26
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
David DarakjyIndiaAsiya Javayant NEW
Smith GlickFranceStephen Shaw QUALIFIED
Juan WieserSpainElwin Sharvill NEW
Claire TollnerArgentinaXuxue Feng NEGOTIATION
Leja CaldareraItalyAmy Elsner PROPOSAL
James ButtItalyOnyama Limba PROPOSAL
Adams MorascaArgentinaBernardo Dominic QUALIFIED
Jones VocelkaAustraliaAmy Elsner QUALIFIED
Greenwood BologniaItalyIoni Bowcher NEGOTIATION
Maisha RulapaughSpainOnyama Limba QUALIFIED
Kadeem FlosiIndiaAsiya Javayant QUALIFIED
Kaitlin OstroskyItalyAnna Fali PROPOSAL
Jeanfrancois VenereUnited KingdomIoni Bowcher QUALIFIED
Ricardo GauchoCanadaIvan Magalhaes RENEWAL
Aditya KuskoGermanyBernardo Dominic NEGOTIATION
Aditya KuskoIndiaIoni Bowcher PROPOSAL
Greenwood BologniaItalyIvan Magalhaes UNQUALIFIED
Claire TollnerIndiaAmy Elsner PROPOSAL
Aruna FigeroaRussiaAsiya Javayant PROPOSAL
Cody SaylorsArgentinaAsiya Javayant NEW
Murillo MaletJapanBernardo Dominic NEGOTIATION
Silvio SlusarskiItalyIoni Bowcher UNQUALIFIED
Aruna FigeroaFranceAmy Elsner PROPOSAL
Costa DilliardRussiaXuxue Feng UNQUALIFIED
Jones VocelkaFranceElwin Sharvill NEW
Costa DilliardItalyAmy Elsner PROPOSAL
Ivar PaprockiSpainElwin Sharvill UNQUALIFIED
Aika InouyeFranceStephen Shaw NEGOTIATION
Clifford RimCanadaAsiya Javayant RENEWAL
Rodrigues CampainBrazilXuxue Feng RENEWAL
Rodrigues CampainRussiaAmy Elsner RENEWAL
Francesco ShinkoUnited KingdomAnna Fali NEW
Alejandro PerinCanadaAnna Fali RENEWAL
Murillo MaletSpainXuxue Feng PROPOSAL
Aika InouyeRussiaElwin Sharvill NEGOTIATION
Leon OldroydItalyAnna Fali QUALIFIED
Aruna FigeroaUnited KingdomOnyama Limba NEW
Ricardo GauchoRussiaIvan Magalhaes UNQUALIFIED
Kadeem FlosiIndiaStephen Shaw QUALIFIED
Stacey MacleadArgentinaOnyama Limba QUALIFIED

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