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
Sinclair WaycottItalyIvan Magalhaes UNQUALIFIED
Costa DilliardJapanIvan Magalhaes NEW
Jeanfrancois VenereItalyIoni Bowcher PROPOSAL
Silvio SlusarskiUnited KingdomXuxue Feng RENEWAL
David DarakjyArgentinaStephen Shaw UNQUALIFIED
Izzy GarufiGermanyXuxue Feng PROPOSAL
Smith GlickCanadaIoni Bowcher NEGOTIATION
Cody SaylorsGermanyStephen Shaw PROPOSAL
Chavez BriddickBrazilElwin Sharvill NEGOTIATION
Aruna FigeroaItalyAsiya Javayant NEGOTIATION
Aditya KuskoItalyStephen Shaw RENEWAL
Ricardo GauchoArgentinaAnna Fali UNQUALIFIED
Kaitlin OstroskyCanadaXuxue Feng NEW
Emily WhobreyFranceStephen Shaw NEW
David DarakjyRussiaAsiya Javayant QUALIFIED
Sinclair WaycottRussiaIoni Bowcher QUALIFIED
Claire TollnerGermanyStephen Shaw RENEWAL
Misaki RoysterAustraliaBernardo Dominic NEGOTIATION
Deepesh ChuiRussiaIvan Magalhaes UNQUALIFIED
Jeanfrancois VenereJapanElwin Sharvill NEW
Silvio SlusarskiArgentinaAnna Fali NEGOTIATION
Misaki RoysterIndiaXuxue Feng UNQUALIFIED
Misaki RoysterCanadaBernardo Dominic PROPOSAL
Stacey MacleadFranceOnyama Limba PROPOSAL
Sinclair WaycottJapanStephen Shaw RENEWAL
Antonio CaudyFranceXuxue Feng QUALIFIED
Cody SaylorsSpainXuxue Feng QUALIFIED
Mayumi KolmetzIndiaAsiya Javayant PROPOSAL
Salvatore StockhamCanadaIoni Bowcher UNQUALIFIED
Leon OldroydCanadaElwin Sharvill UNQUALIFIED
Aditya KuskoCanadaStephen Shaw RENEWAL
Maisha RulapaughUnited KingdomStephen Shaw QUALIFIED
Arvin AlbaresAustraliaIoni Bowcher QUALIFIED
Isabel BowleyJapanAnna Fali RENEWAL
Clifford RimCanadaAsiya Javayant QUALIFIED
Leja CaldareraFranceIoni Bowcher QUALIFIED
Munro FerenczJapanStephen Shaw NEW
Darci PoquetteAustraliaBernardo Dominic QUALIFIED
Johnson SergiAustraliaAmy Elsner UNQUALIFIED
Emily WhobreyBrazilElwin Sharvill PROPOSAL
Octavia MaletGermanyIvan Magalhaes NEGOTIATION
Aruna FigeroaRussiaIoni Bowcher PROPOSAL
Isabel BowleyBrazilIoni Bowcher UNQUALIFIED
Jefferson SchemmerArgentinaStephen Shaw QUALIFIED
Stacey MacleadItalyElwin Sharvill NEGOTIATION
Leja CaldareraSpainElwin Sharvill QUALIFIED
Silvio SlusarskiAustraliaIoni Bowcher NEGOTIATION
Greenwood BologniaIndiaOnyama Limba NEGOTIATION
Ivar PaprockiCanadaIvan Magalhaes UNQUALIFIED
Jennifer AmigonCanadaXuxue Feng NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Nicolas IturbideBrazilAnna Fali RENEWAL
Wickens NestleArgentinaAsiya Javayant NEGOTIATION
Rodrigues CampainJapanIoni Bowcher NEGOTIATION
Alejandro PerinUnited KingdomIoni Bowcher RENEWAL
Johnson SergiCanadaAmy Elsner NEW
Salvatore StockhamAustraliaAnna Fali RENEWAL
Arvin AlbaresSpainIvan Magalhaes PROPOSAL
Isabel BowleyRussiaAnna Fali PROPOSAL
Stacey MacleadIndiaAmy Elsner PROPOSAL
Misaki RoysterFranceStephen Shaw UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Mujtaba NickaUnited Kingdom2026-04-04Feltz Printing Service PROPOSAL9Onyama Limba
1001Jeanfrancois VenereRussia2026-03-31Commercial Press UNQUALIFIED48Xuxue Feng
1002Kaitlin OstroskySpain2026-04-04Commercial Press NEW27Bernardo Dominic
1003Cody SaylorsCanada2026-04-19Dorl, James J Esq NEW30Amy Elsner
1004Jones VocelkaArgentina2026-04-26Buckley Miller Wright NEW74Amy Elsner
1005Johnson SergiFrance2026-04-14Chemel, James L Cpa NEW97Ioni Bowcher
1006Silvio SlusarskiBrazil2026-04-04Chapman, Ross E Esq PROPOSAL48Elwin Sharvill
1007Wickens NestleSpain2026-04-11Printing Dimensions PROPOSAL14Xuxue Feng
1008Antonio CaudyRussia2026-04-11King, Christopher A Esq QUALIFIED63Stephen Shaw
1009Stacey MacleadRussia2026-04-20Truhlar And Truhlar Attys UNQUALIFIED93Bernardo Dominic
1010Silvio SlusarskiRussia2026-04-23Chapman, Ross E Esq UNQUALIFIED0Ioni Bowcher
1011Darci PoquetteSpain2026-03-31Chapman, Ross E Esq NEW74Xuxue Feng
1012Tony FollerCanada2026-04-23Printing Dimensions RENEWAL93Xuxue Feng
1013Faith GillianAustralia2026-04-12Feltz Printing Service NEGOTIATION35Onyama Limba
1014Alejandro PerinItaly2026-04-09Feltz Printing Service NEGOTIATION6Amy Elsner
1015Nicolas IturbideArgentina2026-04-18Feiner Bros NEW53Bernardo Dominic
1016Juan WieserArgentina2026-04-16Dorl, James J Esq QUALIFIED38Stephen Shaw
1017Faith GillianGermany2026-04-13Feltz Printing Service NEW97Elwin Sharvill
1018Arvin AlbaresArgentina2026-04-27King, Christopher A Esq UNQUALIFIED13Ivan Magalhaes
1019Arvin AlbaresIndia2026-04-17King, Christopher A Esq RENEWAL57Amy Elsner
1020Greenwood BologniaRussia2026-04-19Commercial Press NEW76Elwin Sharvill
1021Sinclair WaycottAustralia2026-04-17Chapman, Ross E Esq UNQUALIFIED80Asiya Javayant
1022Morrow RutaJapan2026-04-17Rangoni Of Florence PROPOSAL59Bernardo Dominic
1023Smith GlickIndia2026-03-29Feltz Printing Service PROPOSAL6Amy Elsner
1024Sinclair WaycottCanada2026-04-20Rangoni Of Florence PROPOSAL78Elwin Sharvill
1025Murillo MaletFrance2026-04-01Chapman, Ross E Esq PROPOSAL86Asiya Javayant
1026Misaki RoysterGermany2026-04-10Rousseaux, Michael Esq PROPOSAL55Xuxue Feng
1027Costa DilliardUnited Kingdom2026-04-08Printing Dimensions PROPOSAL66Asiya Javayant
1028Kadeem FlosiGermany2026-04-14King, Christopher A Esq QUALIFIED54Ivan Magalhaes
1029James ButtBrazil2026-04-25Buckley Miller Wright QUALIFIED8Asiya Javayant
1030Murillo MaletAustralia2026-04-15Chapman, Ross E Esq RENEWAL38Amy Elsner
1031Emily WhobreyFrance2026-04-03Chemel, James L Cpa RENEWAL76Ioni Bowcher
1032Silvio SlusarskiAustralia2026-03-31Printing Dimensions QUALIFIED64Bernardo Dominic
1033Stacey MacleadArgentina2026-04-16Feiner Bros NEGOTIATION48Amy Elsner
1034James ButtBrazil2026-04-16King, Christopher A Esq NEW19Xuxue Feng
1035Claire TollnerFrance2026-04-08King, Christopher A Esq UNQUALIFIED9Onyama Limba
1036Darci PoquetteArgentina2026-04-14Rousseaux, Michael Esq RENEWAL76Ioni Bowcher
1037Arvin AlbaresAustralia2026-04-02Chemel, James L Cpa UNQUALIFIED69Ioni Bowcher
1038Mayumi KolmetzCanada2026-04-19Truhlar And Truhlar Attys RENEWAL85Onyama Limba
1039Claire TollnerRussia2026-04-02Morlong Associates UNQUALIFIED53Asiya Javayant
1040Ricardo GauchoAustralia2026-04-10Morlong Associates NEGOTIATION52Elwin Sharvill
1041Leon OldroydUnited Kingdom2026-04-12Rousseaux, Michael Esq UNQUALIFIED60Ivan Magalhaes
1042Jeanfrancois VenereFrance2026-04-17Rousseaux, Michael Esq PROPOSAL57Stephen Shaw
1043Ricardo GauchoFrance2026-04-05Feiner Bros PROPOSAL70Ivan Magalhaes
1044Ricardo GauchoIndia2026-04-15Feltz Printing Service UNQUALIFIED81Amy Elsner
1045Jennifer AmigonUnited Kingdom2026-04-20Feiner Bros PROPOSAL18Bernardo Dominic
1046Ricardo GauchoCanada2026-04-26Feiner Bros PROPOSAL12Xuxue Feng
1047Silvio SlusarskiGermany2026-03-30Feiner Bros QUALIFIED20Onyama Limba
1048Emily WhobreySpain2026-03-29Feltz Printing Service UNQUALIFIED64Ivan Magalhaes
1049Smith GlickBrazil2026-04-02Morlong Associates QUALIFIED51Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Adams MorascaIndiaBernardo Dominic PROPOSAL
Rodrigues CampainJapanOnyama Limba RENEWAL
Isabel BowleySpainAsiya Javayant NEGOTIATION
Morrow RutaArgentinaAsiya Javayant NEW
Izzy GarufiFranceAsiya Javayant UNQUALIFIED
Aruna FigeroaUnited KingdomXuxue Feng PROPOSAL
Leon OldroydCanadaXuxue Feng PROPOSAL
Aditya KuskoBrazilIoni Bowcher NEGOTIATION
Jeanfrancois VenereBrazilIoni Bowcher UNQUALIFIED
Faith GillianIndiaIoni Bowcher UNQUALIFIED
Adams MorascaIndiaElwin Sharvill UNQUALIFIED
Alejandro PerinItalyAnna Fali PROPOSAL
Smith GlickSpainIvan Magalhaes QUALIFIED
Silvio SlusarskiRussiaStephen Shaw RENEWAL
Aika InouyeIndiaBernardo Dominic QUALIFIED
Francesco ShinkoJapanAsiya Javayant PROPOSAL
Aruna FigeroaGermanyAmy Elsner QUALIFIED
Salvatore StockhamBrazilIvan Magalhaes NEGOTIATION
Smith GlickBrazilIoni Bowcher NEGOTIATION
Darci PoquetteBrazilStephen Shaw NEGOTIATION
Claire TollnerUnited KingdomStephen Shaw PROPOSAL
Mujtaba NickaSpainStephen Shaw NEW
Jennifer AmigonSpainAnna Fali PROPOSAL
Jennifer AmigonArgentinaBernardo Dominic RENEWAL
Cody SaylorsCanadaIoni Bowcher NEW
Nicolas IturbideAustraliaAnna Fali NEGOTIATION
Izzy GarufiUnited KingdomElwin Sharvill RENEWAL
Darci PoquetteBrazilElwin Sharvill RENEWAL
Izzy GarufiFranceBernardo Dominic NEGOTIATION
Clifford RimJapanStephen Shaw QUALIFIED
Adams MorascaAustraliaAsiya Javayant RENEWAL
Salvatore StockhamBrazilXuxue Feng NEW
Alejandro PerinGermanyAmy Elsner QUALIFIED
Jones VocelkaItalyIvan Magalhaes NEW
Faith GillianItalyElwin Sharvill PROPOSAL
Rodrigues CampainUnited KingdomElwin Sharvill QUALIFIED
Ricardo GauchoAustraliaOnyama Limba NEW
Smith GlickSpainOnyama Limba PROPOSAL
Mujtaba NickaGermanyOnyama Limba RENEWAL
Darci PoquetteBrazilIvan Magalhaes PROPOSAL
Wickens NestleRussiaAsiya Javayant PROPOSAL
Aika InouyeBrazilXuxue Feng RENEWAL
Octavia MaletBrazilIvan Magalhaes RENEWAL
Faith GillianAustraliaElwin Sharvill NEW
Johnson SergiArgentinaBernardo Dominic QUALIFIED
Silvio SlusarskiJapanIoni Bowcher UNQUALIFIED
Nicolas IturbideUnited KingdomIoni Bowcher UNQUALIFIED
Silvio SlusarskiBrazilAnna Fali NEW
Murillo MaletRussiaStephen Shaw NEGOTIATION
Juan WieserBrazilBernardo Dominic RENEWAL
Frozen Columns
Name
Aruna Figeroa
Jones Vocelka
Murillo Malet
Mayumi Kolmetz
Arvin Albares
Rodrigues Campain
Jefferson Schemmer
Rodrigues Campain
Deepesh Chui
Salvatore Stockham
Darci Poquette
Aika Inouye
Cody Saylors
Smith Glick
Jennifer Amigon
Morrow Ruta
Claire Tollner
Nicolas Iturbide
Murillo Malet
Johnson Sergi
Izzy Garufi
Silvio Slusarski
Stacey Maclead
Tony Foller
Mujtaba Nicka
Ivar Paprocki
Greenwood Bolognia
Salvatore Stockham
Jones Vocelka
Johnson Sergi
Maria Marrier
Stacey Maclead
Juan Wieser
Clifford Rim
Alejandro Perin
Nicolas Iturbide
Maisha Rulapaugh
Julie Stenseth
Jeanfrancois Venere
Kadeem Flosi
Kaitlin Ostrosky
Wickens Nestle
Nicolas Iturbide
Adams Morasca
Juan Wieser
Jones Vocelka
Claire Tollner
Kadeem Flosi
Juan Wieser
Ivar Paprocki
IdCountryDate
1000Argentina2026-04-09
1001Spain2026-04-27
1002Brazil2026-04-22
1003United Kingdom2026-04-06
1004Brazil2026-04-12
1005Argentina2026-04-04
1006United Kingdom2026-04-15
1007Canada2026-04-12
1008Spain2026-04-09
1009Germany2026-04-21
1010Australia2026-04-17
1011Italy2026-04-12
1012Germany2026-04-26
1013Italy2026-04-05
1014France2026-04-10
1015Germany2026-04-21
1016Russia2026-04-16
1017France2026-04-10
1018United Kingdom2026-04-14
1019United Kingdom2026-03-29
1020France2026-04-19
1021Canada2026-04-13
1022Japan2026-04-17
1023Brazil2026-04-22
1024Italy2026-04-12
1025Germany2026-04-14
1026Germany2026-04-12
1027India2026-04-04
1028France2026-04-02
1029India2026-04-11
1030Japan2026-04-22
1031Italy2026-04-02
1032Brazil2026-04-22
1033Japan2026-03-29
1034Germany2026-04-26
1035India2026-04-05
1036Brazil2026-04-01
1037Germany2026-04-06
1038United Kingdom2026-04-19
1039France2026-04-13
1040Germany2026-04-05
1041France2026-04-19
1042Argentina2026-04-02
1043Germany2026-04-25
1044Canada2026-04-08
1045Australia2026-04-25
1046Japan2026-04-05
1047Brazil2026-04-07
1048France2026-04-20
1049Brazil2026-03-31

On-Demand Data

NameIdCountryDate
Octavia Malet1000Italy2026-04-14
Darci Poquette1001Spain2026-04-23
Francesco Shinko1002Italy2026-04-10
Wickens Nestle1003France2026-04-24
Adams Morasca1004Russia2026-03-31
Silvio Slusarski1005Spain2026-04-15
Deepesh Chui1006Spain2026-04-25
Salvatore Stockham1007Argentina2026-04-23
Izzy Garufi1008Italy2026-03-31
Mayumi Kolmetz1009Australia2026-04-26
Stacey Maclead1010Japan2026-04-06
Deepesh Chui1011Russia2026-04-23
Ashley Doe1012France2026-04-19
Jennifer Amigon1013Argentina2026-04-07
Claire Tollner1014Italy2026-04-04
Ricardo Gaucho1015Argentina2026-04-11
Clifford Rim1016Russia2026-04-02
Aika Inouye1017India2026-04-02
Wickens Nestle1018United Kingdom2026-04-04
Aditya Kusko1019France2026-04-12
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Ivar PaprockiGermanyAnna Fali UNQUALIFIED
Jeanfrancois VenereJapanXuxue Feng QUALIFIED
Maisha RulapaughAustraliaElwin Sharvill RENEWAL
Julie StensethGermanyStephen Shaw RENEWAL
Antonio CaudyArgentinaAsiya Javayant NEW
Maisha RulapaughUnited KingdomAmy Elsner UNQUALIFIED
Tony FollerAustraliaStephen Shaw NEW
Mujtaba NickaArgentinaBernardo Dominic PROPOSAL
Maisha RulapaughBrazilElwin Sharvill RENEWAL
Stacey MacleadSpainXuxue Feng PROPOSAL
Smith GlickUnited KingdomIvan Magalhaes RENEWAL
Misaki RoysterCanadaXuxue Feng RENEWAL
Mujtaba NickaItalyAnna Fali RENEWAL
Morrow RutaUnited KingdomStephen Shaw PROPOSAL
Kaitlin OstroskyAustraliaAnna Fali NEW
Aditya KuskoFranceStephen Shaw QUALIFIED
Julie StensethAustraliaStephen Shaw RENEWAL
Ivar PaprockiItalyOnyama Limba PROPOSAL
Sinclair WaycottAustraliaStephen Shaw QUALIFIED
Jones VocelkaFranceOnyama Limba PROPOSAL
Jennifer AmigonBrazilOnyama Limba QUALIFIED
Darci PoquetteCanadaBernardo Dominic NEGOTIATION
Morrow RutaCanadaIvan Magalhaes PROPOSAL
Ashley DoeSpainOnyama Limba PROPOSAL
Julie StensethItalyElwin Sharvill NEW
Faith GillianCanadaXuxue Feng UNQUALIFIED
Antonio CaudyAustraliaElwin Sharvill PROPOSAL
Sinclair WaycottUnited KingdomStephen Shaw RENEWAL
Ricardo GauchoBrazilXuxue Feng UNQUALIFIED
Misaki RoysterJapanBernardo Dominic UNQUALIFIED
Ivar PaprockiUnited KingdomBernardo Dominic NEW
Murillo MaletArgentinaStephen Shaw UNQUALIFIED
Francesco ShinkoArgentinaAsiya Javayant NEW
Emily WhobreyAustraliaIvan Magalhaes RENEWAL
Chavez BriddickAustraliaBernardo Dominic UNQUALIFIED
Rodrigues CampainArgentinaAsiya Javayant QUALIFIED
Leon OldroydBrazilStephen Shaw QUALIFIED
Francesco ShinkoSpainAsiya Javayant NEGOTIATION
Aika InouyeSpainStephen Shaw NEW
Maria MarrierIndiaOnyama Limba 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>