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
Ivar PaprockiIndiaStephen Shaw PROPOSAL
Kadeem FlosiAustraliaBernardo Dominic UNQUALIFIED
Johnson SergiSpainStephen Shaw NEW
Cody SaylorsArgentinaOnyama Limba UNQUALIFIED
Johnson SergiItalyOnyama Limba NEGOTIATION
Tony FollerArgentinaXuxue Feng PROPOSAL
Murillo MaletAustraliaAsiya Javayant RENEWAL
Sinclair WaycottGermanyAnna Fali QUALIFIED
Francesco ShinkoSpainElwin Sharvill NEW
Tony FollerJapanAsiya Javayant NEW
Kaitlin OstroskyJapanXuxue Feng PROPOSAL
David DarakjyGermanyOnyama Limba QUALIFIED
Darci PoquetteFranceIvan Magalhaes PROPOSAL
Clifford RimItalyOnyama Limba PROPOSAL
Nicolas IturbideFranceOnyama Limba RENEWAL
Alejandro PerinJapanStephen Shaw UNQUALIFIED
Sinclair WaycottIndiaAmy Elsner RENEWAL
Ivar PaprockiSpainAnna Fali PROPOSAL
Cody SaylorsCanadaAnna Fali RENEWAL
Aika InouyeUnited KingdomAnna Fali RENEWAL
Aruna FigeroaFranceOnyama Limba PROPOSAL
Nicolas IturbideArgentinaElwin Sharvill QUALIFIED
James ButtFranceIoni Bowcher NEW
Costa DilliardUnited KingdomBernardo Dominic QUALIFIED
Adams MorascaIndiaXuxue Feng RENEWAL
Costa DilliardFranceXuxue Feng NEGOTIATION
Leon OldroydAustraliaElwin Sharvill PROPOSAL
Julie StensethItalyIoni Bowcher NEW
Isabel BowleyIndiaAsiya Javayant UNQUALIFIED
Leon OldroydUnited KingdomAnna Fali QUALIFIED
Salvatore StockhamRussiaIoni Bowcher PROPOSAL
Ivar PaprockiGermanyIvan Magalhaes NEGOTIATION
Leon OldroydArgentinaIvan Magalhaes QUALIFIED
Aruna FigeroaBrazilAmy Elsner NEGOTIATION
Salvatore StockhamArgentinaIoni Bowcher UNQUALIFIED
Clifford RimCanadaAnna Fali UNQUALIFIED
Jefferson SchemmerFranceXuxue Feng PROPOSAL
Alejandro PerinCanadaAmy Elsner UNQUALIFIED
Arvin AlbaresGermanyAsiya Javayant UNQUALIFIED
Kadeem FlosiCanadaAnna Fali QUALIFIED
Mujtaba NickaRussiaXuxue Feng UNQUALIFIED
Silvio SlusarskiArgentinaAmy Elsner PROPOSAL
Adams MorascaUnited KingdomAsiya Javayant UNQUALIFIED
Maisha RulapaughSpainAmy Elsner NEW
Aditya KuskoItalyOnyama Limba RENEWAL
Leon OldroydSpainStephen Shaw QUALIFIED
Cody SaylorsArgentinaIvan Magalhaes NEGOTIATION
Kaitlin OstroskyArgentinaAmy Elsner NEGOTIATION
Ivar PaprockiRussiaBernardo Dominic NEW
Deepesh ChuiIndiaIvan Magalhaes RENEWAL
Horizontal
NameCountryRepresentativeStatus
Leon OldroydAustraliaAnna Fali QUALIFIED
Adams MorascaRussiaIvan Magalhaes PROPOSAL
Ivar PaprockiJapanAmy Elsner RENEWAL
Juan WieserAustraliaAnna Fali QUALIFIED
Deepesh ChuiItalyIoni Bowcher UNQUALIFIED
Kaitlin OstroskyCanadaAsiya Javayant PROPOSAL
Julie StensethUnited KingdomIoni Bowcher PROPOSAL
Clifford RimIndiaAnna Fali NEW
Murillo MaletSpainAnna Fali NEGOTIATION
Francesco ShinkoArgentinaElwin Sharvill QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Francesco ShinkoFrance2026-05-27Truhlar And Truhlar Attys NEW86Stephen Shaw
1001Johnson SergiBrazil2026-05-16Chapman, Ross E Esq NEW31Ioni Bowcher
1002Mayumi KolmetzGermany2026-06-06Chapman, Ross E Esq UNQUALIFIED12Amy Elsner
1003Kadeem FlosiRussia2026-05-25King, Christopher A Esq UNQUALIFIED10Stephen Shaw
1004Arvin AlbaresCanada2026-06-03Morlong Associates RENEWAL45Xuxue Feng
1005Adams MorascaJapan2026-05-11Feiner Bros NEGOTIATION66Ivan Magalhaes
1006Mayumi KolmetzAustralia2026-05-10Buckley Miller Wright PROPOSAL66Asiya Javayant
1007Kadeem FlosiFrance2026-05-12Feiner Bros NEGOTIATION57Stephen Shaw
1008Morrow RutaIndia2026-05-27King, Christopher A Esq UNQUALIFIED12Bernardo Dominic
1009Rodrigues CampainJapan2026-05-17Feltz Printing Service NEW69Ivan Magalhaes
1010Costa DilliardBrazil2026-05-18Buckley Miller Wright PROPOSAL35Bernardo Dominic
1011Jeanfrancois VenereRussia2026-05-31Printing Dimensions UNQUALIFIED83Ioni Bowcher
1012Julie StensethIndia2026-05-13Chemel, James L Cpa RENEWAL76Ivan Magalhaes
1013Clifford RimUnited Kingdom2026-05-28Rousseaux, Michael Esq RENEWAL0Stephen Shaw
1014Leja CaldareraIndia2026-05-30Buckley Miller Wright QUALIFIED96Onyama Limba
1015Cody SaylorsJapan2026-05-17Chemel, James L Cpa UNQUALIFIED73Elwin Sharvill
1016Salvatore StockhamGermany2026-05-31Buckley Miller Wright QUALIFIED41Ioni Bowcher
1017Ricardo GauchoUnited Kingdom2026-05-12Rousseaux, Michael Esq NEW28Onyama Limba
1018Kaitlin OstroskyArgentina2026-05-31Rangoni Of Florence NEGOTIATION40Ioni Bowcher
1019Jones VocelkaArgentina2026-05-27Chemel, James L Cpa NEW72Xuxue Feng
1020Izzy GarufiJapan2026-05-16Chanay, Jeffrey A Esq RENEWAL74Onyama Limba
1021Chavez BriddickSpain2026-06-01Commercial Press UNQUALIFIED84Amy Elsner
1022Jeanfrancois VenereUnited Kingdom2026-05-20Chanay, Jeffrey A Esq NEGOTIATION36Elwin Sharvill
1023Cody SaylorsCanada2026-05-27Commercial Press NEW59Xuxue Feng
1024Ivar PaprockiItaly2026-05-22Rousseaux, Michael Esq UNQUALIFIED57Ioni Bowcher
1025Kaitlin OstroskyAustralia2026-05-11Rangoni Of Florence NEW91Bernardo Dominic
1026Tony FollerRussia2026-06-01Rangoni Of Florence NEW40Elwin Sharvill
1027Aditya KuskoSpain2026-06-03Morlong Associates NEW27Onyama Limba
1028David DarakjyUnited Kingdom2026-06-02Rangoni Of Florence RENEWAL7Elwin Sharvill
1029Emily WhobreyBrazil2026-05-21Chanay, Jeffrey A Esq PROPOSAL49Xuxue Feng
1030Johnson SergiSpain2026-06-04Benton, John B Jr PROPOSAL10Ivan Magalhaes
1031Jeanfrancois VenereFrance2026-05-17Benton, John B Jr PROPOSAL63Xuxue Feng
1032Ivar PaprockiItaly2026-05-22Chanay, Jeffrey A Esq UNQUALIFIED77Elwin Sharvill
1033Leon OldroydUnited Kingdom2026-05-30Benton, John B Jr NEGOTIATION94Amy Elsner
1034Leja CaldareraJapan2026-05-19Commercial Press RENEWAL49Amy Elsner
1035Smith GlickArgentina2026-05-22Printing Dimensions NEW72Elwin Sharvill
1036James ButtArgentina2026-06-05Feltz Printing Service QUALIFIED17Amy Elsner
1037Adams MorascaSpain2026-06-03Morlong Associates UNQUALIFIED45Xuxue Feng
1038Aditya KuskoSpain2026-06-06Rangoni Of Florence QUALIFIED86Asiya Javayant
1039Sinclair WaycottArgentina2026-05-12Feiner Bros RENEWAL66Anna Fali
1040Morrow RutaJapan2026-05-28Truhlar And Truhlar Attys UNQUALIFIED37Xuxue Feng
1041Wickens NestleAustralia2026-06-06Chanay, Jeffrey A Esq NEGOTIATION60Xuxue Feng
1042Kadeem FlosiAustralia2026-06-01Truhlar And Truhlar Attys UNQUALIFIED60Onyama Limba
1043Leon OldroydSpain2026-05-14Feiner Bros NEGOTIATION9Stephen Shaw
1044Rodrigues CampainJapan2026-05-29Chanay, Jeffrey A Esq UNQUALIFIED67Anna Fali
1045Smith GlickRussia2026-05-24Rousseaux, Michael Esq RENEWAL85Xuxue Feng
1046Smith GlickArgentina2026-06-03Feiner Bros RENEWAL81Elwin Sharvill
1047Jones VocelkaItaly2026-05-16Feiner Bros QUALIFIED40Ioni Bowcher
1048Adams MorascaCanada2026-05-15King, Christopher A Esq NEGOTIATION91Anna Fali
1049Ricardo GauchoGermany2026-05-26Feltz Printing Service QUALIFIED11Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Maria MarrierArgentinaOnyama Limba UNQUALIFIED
Adams MorascaBrazilAnna Fali QUALIFIED
Chavez BriddickArgentinaAsiya Javayant PROPOSAL
Aditya KuskoIndiaElwin Sharvill PROPOSAL
Mayumi KolmetzJapanAsiya Javayant RENEWAL
Leja CaldareraGermanyStephen Shaw RENEWAL
Darci PoquetteAustraliaStephen Shaw QUALIFIED
Leja CaldareraCanadaAmy Elsner QUALIFIED
Greenwood BologniaItalyAsiya Javayant PROPOSAL
Leja CaldareraArgentinaAnna Fali RENEWAL
Leon OldroydItalyOnyama Limba NEW
Murillo MaletJapanXuxue Feng NEW
Silvio SlusarskiJapanXuxue Feng NEGOTIATION
Jefferson SchemmerSpainXuxue Feng NEW
David DarakjyRussiaAnna Fali NEGOTIATION
Jones VocelkaBrazilAsiya Javayant RENEWAL
Jeanfrancois VenereArgentinaIvan Magalhaes QUALIFIED
Faith GillianArgentinaIvan Magalhaes QUALIFIED
Octavia MaletBrazilAnna Fali QUALIFIED
Nicolas IturbideRussiaAmy Elsner NEGOTIATION
Rodrigues CampainRussiaStephen Shaw NEGOTIATION
Aditya KuskoRussiaIoni Bowcher NEGOTIATION
Ashley DoeAustraliaIoni Bowcher PROPOSAL
James ButtSpainAmy Elsner PROPOSAL
Munro FerenczUnited KingdomOnyama Limba PROPOSAL
Faith GillianRussiaElwin Sharvill RENEWAL
Ricardo GauchoFranceStephen Shaw NEW
Isabel BowleyRussiaAnna Fali NEW
Mujtaba NickaBrazilStephen Shaw QUALIFIED
Ricardo GauchoJapanAmy Elsner RENEWAL
Greenwood BologniaAustraliaAmy Elsner NEGOTIATION
Juan WieserItalyOnyama Limba UNQUALIFIED
Stacey MacleadArgentinaAsiya Javayant QUALIFIED
Costa DilliardIndiaAmy Elsner PROPOSAL
Sinclair WaycottBrazilAsiya Javayant UNQUALIFIED
James ButtUnited KingdomAsiya Javayant QUALIFIED
Maisha RulapaughBrazilOnyama Limba NEGOTIATION
Octavia MaletGermanyIvan Magalhaes RENEWAL
James ButtAustraliaIvan Magalhaes UNQUALIFIED
Stacey MacleadFranceElwin Sharvill NEGOTIATION
Faith GillianJapanElwin Sharvill NEGOTIATION
Cody SaylorsItalyAmy Elsner QUALIFIED
Greenwood BologniaAustraliaAmy Elsner UNQUALIFIED
Mujtaba NickaFranceIoni Bowcher QUALIFIED
Johnson SergiRussiaBernardo Dominic UNQUALIFIED
Nicolas IturbideGermanyStephen Shaw PROPOSAL
Morrow RutaSpainIvan Magalhaes NEW
Costa DilliardAustraliaBernardo Dominic PROPOSAL
Jeanfrancois VenereFranceAsiya Javayant PROPOSAL
Aditya KuskoGermanyBernardo Dominic PROPOSAL
Frozen Columns
Name
Deepesh Chui
Greenwood Bolognia
Adams Morasca
Morrow Ruta
Jeanfrancois Venere
Mujtaba Nicka
Ivar Paprocki
Julie Stenseth
Maisha Rulapaugh
Ivar Paprocki
Julie Stenseth
Francesco Shinko
Jones Vocelka
Morrow Ruta
Johnson Sergi
David Darakjy
Costa Dilliard
Octavia Malet
Mayumi Kolmetz
Kaitlin Ostrosky
James Butt
Ricardo Gaucho
Nicolas Iturbide
Murillo Malet
Maisha Rulapaugh
Murillo Malet
Octavia Malet
Francesco Shinko
Silvio Slusarski
Alejandro Perin
Darci Poquette
Faith Gillian
Emily Whobrey
Murillo Malet
Jeanfrancois Venere
Jefferson Schemmer
Murillo Malet
Ivar Paprocki
Misaki Royster
Emily Whobrey
Silvio Slusarski
Maria Marrier
Alejandro Perin
Ashley Doe
Nicolas Iturbide
Mujtaba Nicka
Misaki Royster
Chavez Briddick
Tony Foller
Tony Foller
IdCountryDate
1000India2026-05-13
1001Spain2026-06-04
1002Germany2026-05-11
1003Japan2026-05-25
1004France2026-05-31
1005United Kingdom2026-06-03
1006France2026-05-19
1007Canada2026-05-13
1008India2026-06-06
1009Germany2026-05-15
1010Germany2026-06-01
1011United Kingdom2026-06-03
1012Germany2026-05-15
1013United Kingdom2026-05-20
1014Japan2026-05-09
1015Italy2026-06-05
1016Canada2026-05-18
1017France2026-05-23
1018Russia2026-05-22
1019Australia2026-05-28
1020Brazil2026-05-21
1021France2026-05-21
1022Italy2026-05-10
1023India2026-05-14
1024Germany2026-05-27
1025France2026-05-17
1026Germany2026-06-06
1027India2026-05-15
1028India2026-06-04
1029India2026-06-04
1030Germany2026-05-24
1031United Kingdom2026-06-02
1032France2026-05-10
1033Spain2026-05-24
1034France2026-05-12
1035Japan2026-06-01
1036Canada2026-05-14
1037India2026-05-15
1038Japan2026-06-06
1039Spain2026-06-03
1040Canada2026-05-17
1041India2026-05-13
1042Brazil2026-05-29
1043Argentina2026-05-25
1044India2026-06-04
1045United Kingdom2026-05-27
1046Brazil2026-05-17
1047Russia2026-05-11
1048Spain2026-06-02
1049India2026-05-27

On-Demand Data

NameIdCountryDate
Faith Gillian1000Germany2026-06-04
Salvatore Stockham1001Italy2026-05-30
Maisha Rulapaugh1002United Kingdom2026-05-24
Julie Stenseth1003Japan2026-05-23
Julie Stenseth1004Canada2026-06-05
Kaitlin Ostrosky1005United Kingdom2026-05-22
Kadeem Flosi1006Italy2026-05-30
Jeanfrancois Venere1007India2026-05-31
Wickens Nestle1008Japan2026-06-04
Ricardo Gaucho1009France2026-06-03
Wickens Nestle1010Argentina2026-05-09
Leja Caldarera1011Canada2026-06-01
Jones Vocelka1012United Kingdom2026-05-20
Antonio Caudy1013Japan2026-05-29
Smith Glick1014United Kingdom2026-05-26
James Butt1015Russia2026-06-01
Leja Caldarera1016Australia2026-05-12
Silvio Slusarski1017Argentina2026-06-03
Cody Saylors1018Italy2026-05-14
Wickens Nestle1019India2026-05-15
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jones VocelkaArgentinaAsiya Javayant NEW
Alejandro PerinJapanAnna Fali NEW
Alejandro PerinUnited KingdomIvan Magalhaes NEW
Leja CaldareraRussiaIvan Magalhaes NEW
Deepesh ChuiCanadaElwin Sharvill RENEWAL
Alejandro PerinArgentinaIoni Bowcher UNQUALIFIED
Silvio SlusarskiSpainStephen Shaw NEW
Munro FerenczIndiaXuxue Feng NEGOTIATION
Arvin AlbaresArgentinaAsiya Javayant UNQUALIFIED
Juan WieserFranceXuxue Feng UNQUALIFIED
Jones VocelkaGermanyAsiya Javayant NEW
Kadeem FlosiIndiaAsiya Javayant PROPOSAL
Chavez BriddickUnited KingdomAsiya Javayant NEGOTIATION
James ButtArgentinaOnyama Limba RENEWAL
Aika InouyeAustraliaIvan Magalhaes NEGOTIATION
Mujtaba NickaUnited KingdomBernardo Dominic NEW
Claire TollnerItalyIoni Bowcher UNQUALIFIED
Ashley DoeItalyAnna Fali QUALIFIED
Greenwood BologniaCanadaOnyama Limba QUALIFIED
Alejandro PerinGermanyStephen Shaw NEGOTIATION
Izzy GarufiGermanyAnna Fali NEGOTIATION
Julie StensethGermanyStephen Shaw NEW
Emily WhobreyAustraliaOnyama Limba RENEWAL
Jefferson SchemmerJapanIvan Magalhaes RENEWAL
Leja CaldareraAustraliaAnna Fali UNQUALIFIED
Kadeem FlosiCanadaOnyama Limba UNQUALIFIED
Munro FerenczJapanXuxue Feng NEGOTIATION
Kadeem FlosiAustraliaXuxue Feng NEW
Aruna FigeroaGermanyAmy Elsner UNQUALIFIED
Nicolas IturbideBrazilXuxue Feng UNQUALIFIED
Morrow RutaBrazilElwin Sharvill NEW
Darci PoquetteJapanAsiya Javayant UNQUALIFIED
Maisha RulapaughIndiaXuxue Feng QUALIFIED
Salvatore StockhamJapanBernardo Dominic NEW
Greenwood BologniaArgentinaIoni Bowcher QUALIFIED
Claire TollnerItalyAsiya Javayant PROPOSAL
Wickens NestleCanadaAsiya Javayant NEGOTIATION
Darci PoquetteItalyIvan Magalhaes NEW
Leja CaldareraSpainXuxue Feng QUALIFIED
Adams MorascaJapanOnyama Limba 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>