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
Aditya KuskoSpainStephen Shaw PROPOSAL
Arvin AlbaresFranceXuxue Feng PROPOSAL
Ivar PaprockiAustraliaIoni Bowcher PROPOSAL
Wickens NestleBrazilBernardo Dominic QUALIFIED
Jennifer AmigonUnited KingdomBernardo Dominic QUALIFIED
Ivar PaprockiBrazilElwin Sharvill NEGOTIATION
Alejandro PerinRussiaOnyama Limba UNQUALIFIED
Juan WieserIndiaIoni Bowcher UNQUALIFIED
Wickens NestleJapanIvan Magalhaes NEGOTIATION
Francesco ShinkoFranceStephen Shaw RENEWAL
Arvin AlbaresAustraliaAsiya Javayant PROPOSAL
Jones VocelkaJapanIvan Magalhaes UNQUALIFIED
Juan WieserAustraliaIvan Magalhaes UNQUALIFIED
Nicolas IturbideCanadaIvan Magalhaes NEGOTIATION
Ivar PaprockiIndiaElwin Sharvill PROPOSAL
Greenwood BologniaFranceXuxue Feng QUALIFIED
Chavez BriddickUnited KingdomAnna Fali NEW
Jones VocelkaCanadaBernardo Dominic NEGOTIATION
Maisha RulapaughCanadaAmy Elsner NEW
Cody SaylorsFranceOnyama Limba NEW
Octavia MaletSpainAsiya Javayant NEW
Aditya KuskoGermanyAnna Fali QUALIFIED
Arvin AlbaresUnited KingdomElwin Sharvill QUALIFIED
Jefferson SchemmerCanadaIvan Magalhaes NEW
Cody SaylorsJapanAnna Fali NEGOTIATION
Ashley DoeRussiaOnyama Limba UNQUALIFIED
Murillo MaletJapanXuxue Feng RENEWAL
Nicolas IturbideArgentinaAnna Fali PROPOSAL
Chavez BriddickGermanyIoni Bowcher NEW
Nicolas IturbideBrazilXuxue Feng NEW
Sinclair WaycottRussiaIoni Bowcher NEGOTIATION
Cody SaylorsSpainIoni Bowcher NEW
Emily WhobreyFranceOnyama Limba RENEWAL
Ashley DoeJapanIoni Bowcher QUALIFIED
Faith GillianBrazilIoni Bowcher UNQUALIFIED
Silvio SlusarskiCanadaOnyama Limba UNQUALIFIED
Aika InouyeCanadaOnyama Limba PROPOSAL
Julie StensethAustraliaStephen Shaw QUALIFIED
Silvio SlusarskiSpainIvan Magalhaes RENEWAL
Jeanfrancois VenereJapanXuxue Feng PROPOSAL
Johnson SergiFranceStephen Shaw PROPOSAL
Murillo MaletAustraliaIvan Magalhaes RENEWAL
Smith GlickIndiaXuxue Feng PROPOSAL
Sinclair WaycottBrazilXuxue Feng NEW
Leon OldroydBrazilBernardo Dominic PROPOSAL
Ricardo GauchoCanadaAsiya Javayant PROPOSAL
James ButtIndiaBernardo Dominic RENEWAL
Misaki RoysterCanadaAmy Elsner QUALIFIED
Leja CaldareraJapanAmy Elsner UNQUALIFIED
Greenwood BologniaIndiaStephen Shaw QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Faith GillianFranceAsiya Javayant PROPOSAL
Leja CaldareraGermanyStephen Shaw NEW
Cody SaylorsIndiaIoni Bowcher NEW
Octavia MaletJapanAmy Elsner NEW
David DarakjyBrazilAmy Elsner NEW
Octavia MaletUnited KingdomStephen Shaw UNQUALIFIED
Izzy GarufiSpainStephen Shaw UNQUALIFIED
Smith GlickCanadaElwin Sharvill QUALIFIED
Aruna FigeroaRussiaXuxue Feng RENEWAL
Cody SaylorsFranceAmy Elsner PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Stacey MacleadUnited Kingdom2026-06-08Chemel, James L Cpa UNQUALIFIED51Elwin Sharvill
1001Jones VocelkaRussia2026-06-02Rousseaux, Michael Esq PROPOSAL75Ivan Magalhaes
1002Johnson SergiArgentina2026-05-28Rousseaux, Michael Esq UNQUALIFIED64Elwin Sharvill
1003Darci PoquetteJapan2026-06-13Chemel, James L Cpa NEGOTIATION14Bernardo Dominic
1004Octavia MaletGermany2026-06-10Rangoni Of Florence NEGOTIATION23Elwin Sharvill
1005Adams MorascaIndia2026-05-24Chemel, James L Cpa PROPOSAL86Anna Fali
1006Antonio CaudyFrance2026-05-28Chapman, Ross E Esq UNQUALIFIED61Elwin Sharvill
1007Costa DilliardBrazil2026-05-25Buckley Miller Wright PROPOSAL63Ivan Magalhaes
1008Leon OldroydCanada2026-06-17Rousseaux, Michael Esq RENEWAL95Xuxue Feng
1009Darci PoquetteUnited Kingdom2026-06-07Commercial Press QUALIFIED44Amy Elsner
1010Mujtaba NickaArgentina2026-06-15Commercial Press RENEWAL70Ioni Bowcher
1011Morrow RutaRussia2026-06-03Benton, John B Jr NEGOTIATION63Elwin Sharvill
1012Jones VocelkaAustralia2026-06-15Dorl, James J Esq QUALIFIED81Ivan Magalhaes
1013Morrow RutaUnited Kingdom2026-06-06Commercial Press QUALIFIED3Xuxue Feng
1014Emily WhobreyRussia2026-06-01Commercial Press UNQUALIFIED99Anna Fali
1015Jones VocelkaBrazil2026-05-23Rangoni Of Florence UNQUALIFIED18Bernardo Dominic
1016Costa DilliardBrazil2026-05-31Commercial Press QUALIFIED31Ivan Magalhaes
1017Murillo MaletSpain2026-05-28Commercial Press NEGOTIATION23Onyama Limba
1018Julie StensethBrazil2026-05-25Feltz Printing Service QUALIFIED91Anna Fali
1019Kaitlin OstroskyItaly2026-06-03Benton, John B Jr QUALIFIED71Ioni Bowcher
1020Octavia MaletJapan2026-05-26Benton, John B Jr QUALIFIED35Asiya Javayant
1021Emily WhobreyBrazil2026-06-07Dorl, James J Esq RENEWAL24Amy Elsner
1022Claire TollnerFrance2026-06-17Rangoni Of Florence UNQUALIFIED56Onyama Limba
1023Leja CaldareraRussia2026-05-25Chapman, Ross E Esq RENEWAL80Bernardo Dominic
1024Darci PoquetteCanada2026-06-18Rousseaux, Michael Esq QUALIFIED96Onyama Limba
1025David DarakjySpain2026-06-04Rangoni Of Florence NEW50Onyama Limba
1026Aika InouyeItaly2026-05-21Feltz Printing Service NEGOTIATION8Ivan Magalhaes
1027Jefferson SchemmerCanada2026-06-16Dorl, James J Esq UNQUALIFIED17Amy Elsner
1028Stacey MacleadCanada2026-05-22Feltz Printing Service NEW8Xuxue Feng
1029Deepesh ChuiSpain2026-06-04Rousseaux, Michael Esq QUALIFIED69Stephen Shaw
1030Arvin AlbaresFrance2026-06-04Morlong Associates RENEWAL15Xuxue Feng
1031Maria MarrierSpain2026-05-31Rousseaux, Michael Esq NEGOTIATION99Stephen Shaw
1032Kaitlin OstroskyArgentina2026-06-04Commercial Press UNQUALIFIED42Ivan Magalhaes
1033Darci PoquetteBrazil2026-06-16Commercial Press NEW26Amy Elsner
1034Ashley DoeSpain2026-06-06Printing Dimensions UNQUALIFIED84Elwin Sharvill
1035Salvatore StockhamFrance2026-06-06Feltz Printing Service RENEWAL79Xuxue Feng
1036Arvin AlbaresGermany2026-06-01Benton, John B Jr PROPOSAL10Bernardo Dominic
1037Chavez BriddickItaly2026-05-21Morlong Associates RENEWAL25Asiya Javayant
1038Ivar PaprockiGermany2026-06-09Rousseaux, Michael Esq RENEWAL73Anna Fali
1039Johnson SergiArgentina2026-06-01Dorl, James J Esq QUALIFIED20Ioni Bowcher
1040Tony FollerArgentina2026-05-26Truhlar And Truhlar Attys NEW7Ivan Magalhaes
1041Arvin AlbaresJapan2026-06-12Feltz Printing Service NEGOTIATION80Asiya Javayant
1042Darci PoquetteIndia2026-05-31Rangoni Of Florence UNQUALIFIED74Elwin Sharvill
1043Rodrigues CampainIndia2026-05-26Chemel, James L Cpa QUALIFIED31Ivan Magalhaes
1044Rodrigues CampainRussia2026-06-13Buckley Miller Wright RENEWAL82Amy Elsner
1045Jeanfrancois VenereGermany2026-05-26Benton, John B Jr PROPOSAL62Onyama Limba
1046Julie StensethRussia2026-06-03Rousseaux, Michael Esq QUALIFIED69Onyama Limba
1047Juan WieserFrance2026-06-17King, Christopher A Esq QUALIFIED20Xuxue Feng
1048Kaitlin OstroskyFrance2026-05-28King, Christopher A Esq QUALIFIED10Xuxue Feng
1049Costa DilliardFrance2026-05-27Chanay, Jeffrey A Esq PROPOSAL14Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Nicolas IturbideUnited KingdomStephen Shaw RENEWAL
Faith GillianItalyStephen Shaw UNQUALIFIED
Tony FollerSpainAnna Fali RENEWAL
Greenwood BologniaBrazilAsiya Javayant PROPOSAL
Mujtaba NickaItalyXuxue Feng QUALIFIED
Juan WieserSpainIvan Magalhaes NEGOTIATION
Aika InouyeSpainBernardo Dominic UNQUALIFIED
Antonio CaudyArgentinaIoni Bowcher NEGOTIATION
Stacey MacleadIndiaOnyama Limba NEGOTIATION
Julie StensethGermanyAsiya Javayant RENEWAL
Ivar PaprockiRussiaStephen Shaw PROPOSAL
Leja CaldareraFranceAsiya Javayant UNQUALIFIED
Izzy GarufiCanadaOnyama Limba QUALIFIED
Ashley DoeItalyAmy Elsner UNQUALIFIED
Mayumi KolmetzJapanIvan Magalhaes PROPOSAL
Johnson SergiUnited KingdomStephen Shaw NEGOTIATION
Jones VocelkaItalyIvan Magalhaes NEGOTIATION
Silvio SlusarskiUnited KingdomStephen Shaw NEGOTIATION
Julie StensethGermanyAsiya Javayant NEGOTIATION
Juan WieserUnited KingdomAsiya Javayant NEGOTIATION
Salvatore StockhamArgentinaXuxue Feng NEGOTIATION
Emily WhobreyGermanyIvan Magalhaes NEGOTIATION
James ButtItalyAnna Fali RENEWAL
Adams MorascaCanadaStephen Shaw PROPOSAL
Kadeem FlosiIndiaIoni Bowcher UNQUALIFIED
Mayumi KolmetzSpainIvan Magalhaes NEGOTIATION
Murillo MaletArgentinaElwin Sharvill NEW
Stacey MacleadSpainAmy Elsner RENEWAL
Alejandro PerinAustraliaAmy Elsner QUALIFIED
Morrow RutaItalyIoni Bowcher RENEWAL
Salvatore StockhamCanadaXuxue Feng QUALIFIED
Johnson SergiGermanyXuxue Feng NEGOTIATION
Emily WhobreyRussiaIvan Magalhaes NEW
Smith GlickGermanyIoni Bowcher RENEWAL
Aika InouyeUnited KingdomBernardo Dominic PROPOSAL
Claire TollnerIndiaIoni Bowcher NEGOTIATION
Leon OldroydSpainAnna Fali NEGOTIATION
Leja CaldareraFranceXuxue Feng PROPOSAL
Ivar PaprockiArgentinaBernardo Dominic PROPOSAL
Claire TollnerFranceAnna Fali NEGOTIATION
Faith GillianFranceXuxue Feng PROPOSAL
Costa DilliardArgentinaStephen Shaw RENEWAL
Ashley DoeItalyAnna Fali NEW
Stacey MacleadIndiaOnyama Limba UNQUALIFIED
Smith GlickItalyIoni Bowcher NEW
Aruna FigeroaRussiaAmy Elsner NEW
Octavia MaletSpainElwin Sharvill PROPOSAL
Mayumi KolmetzCanadaXuxue Feng NEW
Morrow RutaBrazilElwin Sharvill NEGOTIATION
Arvin AlbaresArgentinaElwin Sharvill PROPOSAL
Frozen Columns
Name
Leja Caldarera
Antonio Caudy
Kaitlin Ostrosky
Misaki Royster
Ivar Paprocki
Jeanfrancois Venere
Jefferson Schemmer
Salvatore Stockham
Johnson Sergi
Sinclair Waycott
Johnson Sergi
Aditya Kusko
Francesco Shinko
Silvio Slusarski
Mujtaba Nicka
Julie Stenseth
Salvatore Stockham
David Darakjy
Stacey Maclead
Juan Wieser
Johnson Sergi
Alejandro Perin
Deepesh Chui
James Butt
Maisha Rulapaugh
Leja Caldarera
Claire Tollner
Izzy Garufi
Stacey Maclead
Wickens Nestle
Wickens Nestle
Morrow Ruta
Chavez Briddick
Leja Caldarera
Mujtaba Nicka
Leja Caldarera
Leja Caldarera
Jefferson Schemmer
Jones Vocelka
Greenwood Bolognia
Jeanfrancois Venere
Mayumi Kolmetz
Jeanfrancois Venere
Greenwood Bolognia
Izzy Garufi
Darci Poquette
James Butt
Leon Oldroyd
Kaitlin Ostrosky
Aditya Kusko
IdCountryDate
1000France2026-05-29
1001Italy2026-06-06
1002Italy2026-06-10
1003Spain2026-06-13
1004Spain2026-05-29
1005France2026-06-11
1006Brazil2026-05-25
1007Japan2026-06-12
1008Canada2026-06-04
1009India2026-05-21
1010Canada2026-05-26
1011Germany2026-06-14
1012United Kingdom2026-05-21
1013France2026-05-21
1014India2026-06-08
1015Canada2026-05-30
1016United Kingdom2026-06-06
1017France2026-06-08
1018India2026-05-25
1019United Kingdom2026-06-04
1020Russia2026-06-02
1021India2026-06-03
1022Argentina2026-05-21
1023Spain2026-05-27
1024Spain2026-06-03
1025Spain2026-06-15
1026Brazil2026-05-25
1027Argentina2026-06-12
1028Australia2026-05-25
1029Australia2026-05-28
1030Germany2026-06-05
1031Germany2026-05-29
1032United Kingdom2026-06-03
1033Canada2026-05-31
1034Australia2026-05-21
1035Italy2026-06-15
1036Canada2026-06-07
1037United Kingdom2026-05-22
1038France2026-06-18
1039Canada2026-05-31
1040Spain2026-05-24
1041Italy2026-05-22
1042Brazil2026-05-22
1043Japan2026-06-02
1044Italy2026-06-09
1045Spain2026-06-07
1046Australia2026-06-07
1047Italy2026-06-16
1048Brazil2026-06-05
1049Canada2026-06-01

On-Demand Data

NameIdCountryDate
Ashley Doe1000India2026-06-10
Jennifer Amigon1001Canada2026-06-06
Ivar Paprocki1002Spain2026-06-11
Isabel Bowley1003Japan2026-05-27
Francesco Shinko1004France2026-06-03
Deepesh Chui1005Canada2026-06-04
Isabel Bowley1006Australia2026-06-05
Juan Wieser1007Australia2026-06-19
Deepesh Chui1008United Kingdom2026-06-06
Salvatore Stockham1009Japan2026-05-30
Izzy Garufi1010Germany2026-06-03
Stacey Maclead1011Argentina2026-06-15
Izzy Garufi1012Spain2026-05-28
Munro Ferencz1013Brazil2026-05-27
Maria Marrier1014Australia2026-06-17
James Butt1015Brazil2026-06-04
Sinclair Waycott1016Spain2026-06-06
Johnson Sergi1017United Kingdom2026-06-09
Aditya Kusko1018Italy2026-05-22
Claire Tollner1019Canada2026-06-12
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jennifer AmigonFranceStephen Shaw UNQUALIFIED
Arvin AlbaresJapanAsiya Javayant NEGOTIATION
Clifford RimSpainAnna Fali NEGOTIATION
James ButtAustraliaXuxue Feng RENEWAL
Tony FollerIndiaBernardo Dominic RENEWAL
Emily WhobreyRussiaAsiya Javayant NEW
Nicolas IturbideJapanAsiya Javayant NEGOTIATION
Ivar PaprockiItalyAsiya Javayant UNQUALIFIED
Mujtaba NickaAustraliaAnna Fali QUALIFIED
Darci PoquetteUnited KingdomAsiya Javayant RENEWAL
Aruna FigeroaRussiaBernardo Dominic PROPOSAL
Rodrigues CampainAustraliaAmy Elsner PROPOSAL
Jeanfrancois VenereCanadaBernardo Dominic QUALIFIED
Jeanfrancois VenereJapanStephen Shaw UNQUALIFIED
Ashley DoeRussiaIoni Bowcher NEGOTIATION
Jennifer AmigonGermanyIoni Bowcher UNQUALIFIED
David DarakjyJapanStephen Shaw RENEWAL
Misaki RoysterArgentinaAmy Elsner RENEWAL
Francesco ShinkoJapanIvan Magalhaes PROPOSAL
Silvio SlusarskiBrazilBernardo Dominic UNQUALIFIED
Izzy GarufiArgentinaBernardo Dominic RENEWAL
Leja CaldareraGermanyElwin Sharvill PROPOSAL
Maisha RulapaughRussiaIvan Magalhaes QUALIFIED
Alejandro PerinGermanyAmy Elsner RENEWAL
Leon OldroydFranceBernardo Dominic PROPOSAL
Murillo MaletBrazilAmy Elsner RENEWAL
Ivar PaprockiCanadaElwin Sharvill NEGOTIATION
Misaki RoysterFranceAsiya Javayant PROPOSAL
Arvin AlbaresSpainOnyama Limba NEGOTIATION
Leja CaldareraSpainStephen Shaw NEGOTIATION
Morrow RutaUnited KingdomAsiya Javayant PROPOSAL
Maisha RulapaughBrazilAmy Elsner UNQUALIFIED
Ashley DoeSpainOnyama Limba QUALIFIED
Greenwood BologniaSpainAnna Fali RENEWAL
Ricardo GauchoBrazilOnyama Limba NEW
Silvio SlusarskiAustraliaIvan Magalhaes NEGOTIATION
Tony FollerCanadaAsiya Javayant NEGOTIATION
Leon OldroydBrazilIvan Magalhaes QUALIFIED
Mayumi KolmetzUnited KingdomAnna Fali QUALIFIED
Rodrigues CampainJapanXuxue Feng PROPOSAL

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