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
Misaki RoysterArgentinaAsiya Javayant PROPOSAL
Adams MorascaFranceStephen Shaw RENEWAL
Jones VocelkaRussiaStephen Shaw RENEWAL
Juan WieserJapanAnna Fali QUALIFIED
Claire TollnerFranceAnna Fali NEW
Cody SaylorsUnited KingdomAsiya Javayant RENEWAL
Murillo MaletJapanAnna Fali NEW
Smith GlickRussiaBernardo Dominic RENEWAL
Greenwood BologniaIndiaIvan Magalhaes NEW
Cody SaylorsJapanElwin Sharvill PROPOSAL
Arvin AlbaresJapanIvan Magalhaes NEGOTIATION
Jones VocelkaSpainStephen Shaw UNQUALIFIED
Costa DilliardArgentinaOnyama Limba QUALIFIED
Izzy GarufiSpainBernardo Dominic RENEWAL
Juan WieserItalyAmy Elsner QUALIFIED
Antonio CaudyGermanyStephen Shaw RENEWAL
Adams MorascaIndiaBernardo Dominic QUALIFIED
Mayumi KolmetzGermanyAnna Fali NEW
Darci PoquetteCanadaElwin Sharvill NEW
Ashley DoeFranceIvan Magalhaes UNQUALIFIED
Leja CaldareraGermanyXuxue Feng NEGOTIATION
Nicolas IturbideArgentinaAmy Elsner NEGOTIATION
Sinclair WaycottGermanyAsiya Javayant NEW
Stacey MacleadJapanAmy Elsner RENEWAL
Murillo MaletAustraliaXuxue Feng NEW
James ButtAustraliaElwin Sharvill NEW
Darci PoquetteArgentinaElwin Sharvill RENEWAL
Faith GillianCanadaAmy Elsner PROPOSAL
Clifford RimItalyIoni Bowcher NEGOTIATION
Leon OldroydSpainOnyama Limba UNQUALIFIED
Ivar PaprockiArgentinaAsiya Javayant UNQUALIFIED
Munro FerenczFranceBernardo Dominic PROPOSAL
Antonio CaudyBrazilAsiya Javayant RENEWAL
Jennifer AmigonRussiaIoni Bowcher QUALIFIED
Faith GillianGermanyIvan Magalhaes NEW
Salvatore StockhamJapanAnna Fali NEGOTIATION
Murillo MaletIndiaAmy Elsner NEGOTIATION
Jennifer AmigonIndiaElwin Sharvill RENEWAL
Munro FerenczAustraliaOnyama Limba NEW
Aruna FigeroaUnited KingdomElwin Sharvill NEW
Leja CaldareraGermanyAmy Elsner UNQUALIFIED
Arvin AlbaresSpainBernardo Dominic RENEWAL
Ivar PaprockiSpainAnna Fali NEGOTIATION
Francesco ShinkoCanadaBernardo Dominic NEGOTIATION
Emily WhobreyIndiaAsiya Javayant QUALIFIED
Mujtaba NickaItalyBernardo Dominic NEGOTIATION
Antonio CaudyAustraliaBernardo Dominic NEW
Smith GlickCanadaAnna Fali UNQUALIFIED
Kadeem FlosiArgentinaIoni Bowcher PROPOSAL
Emily WhobreyAustraliaElwin Sharvill NEW
Horizontal
NameCountryRepresentativeStatus
Juan WieserGermanyAmy Elsner QUALIFIED
Ivar PaprockiUnited KingdomAnna Fali NEGOTIATION
Alejandro PerinBrazilStephen Shaw NEGOTIATION
Juan WieserFranceIoni Bowcher NEGOTIATION
Leon OldroydAustraliaElwin Sharvill RENEWAL
Mujtaba NickaFranceAsiya Javayant UNQUALIFIED
James ButtItalyAnna Fali UNQUALIFIED
Octavia MaletSpainIvan Magalhaes PROPOSAL
Wickens NestleBrazilBernardo Dominic UNQUALIFIED
Nicolas IturbideFranceIoni Bowcher UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Stacey MacleadSpain2025-08-23Chapman, Ross E Esq NEW51Anna Fali
1001Cody SaylorsSpain2025-08-29Feltz Printing Service PROPOSAL19Elwin Sharvill
1002Chavez BriddickArgentina2025-08-31King, Christopher A Esq NEW93Ivan Magalhaes
1003Isabel BowleyCanada2025-09-05Dorl, James J Esq RENEWAL10Ioni Bowcher
1004Tony FollerIndia2025-08-22Chemel, James L Cpa UNQUALIFIED41Asiya Javayant
1005Arvin AlbaresJapan2025-09-12Feiner Bros RENEWAL27Bernardo Dominic
1006Deepesh ChuiIndia2025-08-30Benton, John B Jr NEW11Bernardo Dominic
1007Nicolas IturbideItaly2025-08-31Chapman, Ross E Esq RENEWAL36Xuxue Feng
1008Faith GillianBrazil2025-09-10Buckley Miller Wright QUALIFIED20Amy Elsner
1009Jeanfrancois VenereIndia2025-08-23Chanay, Jeffrey A Esq NEGOTIATION50Asiya Javayant
1010Jennifer AmigonIndia2025-09-12Feiner Bros PROPOSAL96Asiya Javayant
1011Aruna FigeroaAustralia2025-08-26Morlong Associates PROPOSAL54Elwin Sharvill
1012Alejandro PerinArgentina2025-09-09Chemel, James L Cpa PROPOSAL97Xuxue Feng
1013Clifford RimRussia2025-09-14Commercial Press RENEWAL66Amy Elsner
1014Francesco ShinkoFrance2025-08-19Chemel, James L Cpa NEW60Ioni Bowcher
1015Ashley DoeUnited Kingdom2025-08-25Chemel, James L Cpa NEGOTIATION67Xuxue Feng
1016Faith GillianJapan2025-08-31Benton, John B Jr QUALIFIED98Ioni Bowcher
1017Jeanfrancois VenereCanada2025-08-29Truhlar And Truhlar Attys NEW60Stephen Shaw
1018Jones VocelkaUnited Kingdom2025-09-11Chanay, Jeffrey A Esq RENEWAL38Ivan Magalhaes
1019Rodrigues CampainCanada2025-08-16Benton, John B Jr NEGOTIATION89Anna Fali
1020Mayumi KolmetzItaly2025-08-16Morlong Associates UNQUALIFIED74Ioni Bowcher
1021Sinclair WaycottUnited Kingdom2025-09-01Morlong Associates NEGOTIATION16Elwin Sharvill
1022Nicolas IturbideFrance2025-08-22Chanay, Jeffrey A Esq RENEWAL38Bernardo Dominic
1023Nicolas IturbideBrazil2025-09-09Benton, John B Jr QUALIFIED31Onyama Limba
1024Jeanfrancois VenereAustralia2025-09-01Morlong Associates RENEWAL3Bernardo Dominic
1025Darci PoquetteArgentina2025-08-23Buckley Miller Wright NEW45Ioni Bowcher
1026Greenwood BologniaFrance2025-08-23Buckley Miller Wright RENEWAL30Bernardo Dominic
1027Mujtaba NickaUnited Kingdom2025-08-30Feltz Printing Service RENEWAL48Bernardo Dominic
1028Maria MarrierSpain2025-08-24Truhlar And Truhlar Attys PROPOSAL61Amy Elsner
1029Aruna FigeroaFrance2025-09-13Chanay, Jeffrey A Esq NEGOTIATION99Ivan Magalhaes
1030Deepesh ChuiCanada2025-08-17Chapman, Ross E Esq PROPOSAL0Onyama Limba
1031Nicolas IturbideIndia2025-09-06Commercial Press PROPOSAL47Ivan Magalhaes
1032Greenwood BologniaSpain2025-08-20Chanay, Jeffrey A Esq NEW22Bernardo Dominic
1033Nicolas IturbideBrazil2025-09-02Chanay, Jeffrey A Esq UNQUALIFIED9Xuxue Feng
1034Aditya KuskoRussia2025-09-13Benton, John B Jr RENEWAL94Stephen Shaw
1035Clifford RimBrazil2025-08-28Chapman, Ross E Esq NEW21Asiya Javayant
1036Francesco ShinkoIndia2025-09-09Truhlar And Truhlar Attys RENEWAL65Bernardo Dominic
1037Wickens NestleItaly2025-09-12Chapman, Ross E Esq UNQUALIFIED53Ioni Bowcher
1038Morrow RutaBrazil2025-09-03Rangoni Of Florence RENEWAL47Onyama Limba
1039Faith GillianItaly2025-08-16Rangoni Of Florence RENEWAL38Elwin Sharvill
1040Mayumi KolmetzGermany2025-08-22King, Christopher A Esq PROPOSAL63Asiya Javayant
1041Antonio CaudyAustralia2025-08-16Rousseaux, Michael Esq RENEWAL40Anna Fali
1042Emily WhobreyGermany2025-08-23Benton, John B Jr UNQUALIFIED47Onyama Limba
1043Mujtaba NickaUnited Kingdom2025-09-11Chapman, Ross E Esq UNQUALIFIED34Stephen Shaw
1044Morrow RutaRussia2025-08-31Commercial Press UNQUALIFIED58Anna Fali
1045Morrow RutaRussia2025-09-03Benton, John B Jr NEGOTIATION55Ioni Bowcher
1046Aika InouyeJapan2025-09-01Chanay, Jeffrey A Esq UNQUALIFIED12Xuxue Feng
1047Sinclair WaycottJapan2025-08-20Feltz Printing Service NEW57Stephen Shaw
1048Deepesh ChuiAustralia2025-09-09Morlong Associates RENEWAL38Xuxue Feng
1049Octavia MaletCanada2025-09-07Commercial Press UNQUALIFIED48Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Wickens NestleBrazilBernardo Dominic NEW
Ivar PaprockiJapanStephen Shaw PROPOSAL
Kadeem FlosiItalyIvan Magalhaes QUALIFIED
Greenwood BologniaGermanyAmy Elsner NEGOTIATION
Claire TollnerIndiaAnna Fali UNQUALIFIED
Kadeem FlosiIndiaBernardo Dominic NEW
Nicolas IturbideJapanAsiya Javayant NEW
Kaitlin OstroskySpainXuxue Feng NEGOTIATION
Maisha RulapaughAustraliaBernardo Dominic RENEWAL
Silvio SlusarskiBrazilStephen Shaw RENEWAL
Arvin AlbaresJapanAmy Elsner UNQUALIFIED
Mujtaba NickaAustraliaAsiya Javayant QUALIFIED
Alejandro PerinFranceElwin Sharvill NEW
Salvatore StockhamBrazilIvan Magalhaes QUALIFIED
Isabel BowleyArgentinaBernardo Dominic QUALIFIED
Wickens NestleSpainAsiya Javayant UNQUALIFIED
Cody SaylorsGermanyAnna Fali NEGOTIATION
Morrow RutaJapanStephen Shaw RENEWAL
James ButtAustraliaAmy Elsner NEW
Smith GlickCanadaOnyama Limba RENEWAL
Rodrigues CampainItalyAsiya Javayant QUALIFIED
Sinclair WaycottCanadaIoni Bowcher QUALIFIED
Adams MorascaBrazilOnyama Limba NEW
Kadeem FlosiSpainAsiya Javayant NEGOTIATION
Tony FollerSpainBernardo Dominic UNQUALIFIED
Aruna FigeroaSpainOnyama Limba UNQUALIFIED
Munro FerenczIndiaIoni Bowcher NEGOTIATION
Misaki RoysterArgentinaIoni Bowcher QUALIFIED
Aika InouyeSpainOnyama Limba QUALIFIED
Arvin AlbaresAustraliaIvan Magalhaes NEGOTIATION
Salvatore StockhamJapanIvan Magalhaes NEW
Clifford RimCanadaAsiya Javayant PROPOSAL
Octavia MaletGermanyAsiya Javayant RENEWAL
Chavez BriddickAustraliaIvan Magalhaes RENEWAL
Isabel BowleyGermanyXuxue Feng NEGOTIATION
Salvatore StockhamIndiaStephen Shaw QUALIFIED
Leja CaldareraArgentinaAnna Fali NEW
Ashley DoeJapanAnna Fali RENEWAL
Faith GillianAustraliaAnna Fali NEGOTIATION
Leon OldroydCanadaIvan Magalhaes RENEWAL
Mayumi KolmetzCanadaBernardo Dominic UNQUALIFIED
Murillo MaletUnited KingdomStephen Shaw QUALIFIED
Jennifer AmigonCanadaBernardo Dominic PROPOSAL
Adams MorascaRussiaAnna Fali NEW
Silvio SlusarskiFranceAmy Elsner RENEWAL
Jennifer AmigonArgentinaIvan Magalhaes UNQUALIFIED
Tony FollerUnited KingdomOnyama Limba NEW
Kaitlin OstroskyIndiaAnna Fali RENEWAL
Mujtaba NickaSpainBernardo Dominic QUALIFIED
Aika InouyeSpainAnna Fali NEW
Frozen Columns
Name
Jeanfrancois Venere
David Darakjy
Mujtaba Nicka
Jennifer Amigon
Claire Tollner
Rodrigues Campain
Adams Morasca
Jefferson Schemmer
Silvio Slusarski
Mayumi Kolmetz
Claire Tollner
Francesco Shinko
Leja Caldarera
Adams Morasca
Adams Morasca
Clifford Rim
Smith Glick
Cody Saylors
Antonio Caudy
Julie Stenseth
Kadeem Flosi
Wickens Nestle
Maisha Rulapaugh
Emily Whobrey
Smith Glick
Sinclair Waycott
Julie Stenseth
Wickens Nestle
Johnson Sergi
Aika Inouye
Ricardo Gaucho
Clifford Rim
Cody Saylors
Julie Stenseth
Morrow Ruta
Ashley Doe
Ivar Paprocki
Kadeem Flosi
Stacey Maclead
Alejandro Perin
Clifford Rim
Antonio Caudy
Jones Vocelka
Mujtaba Nicka
Aruna Figeroa
Adams Morasca
Ivar Paprocki
Jennifer Amigon
Isabel Bowley
Johnson Sergi
IdCountryDate
1000Australia2025-08-19
1001Spain2025-09-07
1002Germany2025-09-04
1003Russia2025-09-05
1004Spain2025-09-01
1005Japan2025-08-28
1006India2025-09-08
1007Argentina2025-09-13
1008France2025-08-26
1009Russia2025-08-23
1010Germany2025-08-29
1011Brazil2025-09-13
1012Canada2025-09-12
1013Argentina2025-09-02
1014Italy2025-09-05
1015Italy2025-09-14
1016Canada2025-09-08
1017Australia2025-08-24
1018Germany2025-09-03
1019France2025-09-07
1020Australia2025-08-22
1021Argentina2025-08-22
1022Australia2025-08-28
1023Japan2025-08-30
1024Germany2025-09-13
1025Australia2025-08-23
1026Italy2025-09-03
1027Italy2025-08-20
1028France2025-09-07
1029Australia2025-09-11
1030Germany2025-08-22
1031Italy2025-09-06
1032Russia2025-09-07
1033India2025-09-01
1034Japan2025-09-05
1035Italy2025-09-02
1036Brazil2025-09-01
1037Italy2025-08-30
1038Argentina2025-09-04
1039Spain2025-08-22
1040Argentina2025-08-23
1041Italy2025-09-04
1042Brazil2025-08-25
1043Russia2025-09-08
1044Australia2025-09-07
1045India2025-08-27
1046Italy2025-09-09
1047Japan2025-08-17
1048Brazil2025-08-28
1049Germany2025-09-14

On-Demand Data

NameIdCountryDate
Misaki Royster1000United Kingdom2025-09-14
Antonio Caudy1001India2025-08-18
Kaitlin Ostrosky1002Spain2025-09-06
Kadeem Flosi1003United Kingdom2025-08-30
Darci Poquette1004Russia2025-09-12
Adams Morasca1005France2025-09-12
Jeanfrancois Venere1006United Kingdom2025-09-05
Jeanfrancois Venere1007Italy2025-09-03
Arvin Albares1008Italy2025-08-31
Kaitlin Ostrosky1009Spain2025-09-06
Nicolas Iturbide1010United Kingdom2025-08-31
Munro Ferencz1011India2025-08-22
Costa Dilliard1012Argentina2025-08-19
Jones Vocelka1013Brazil2025-08-31
James Butt1014Australia2025-09-14
Alejandro Perin1015Japan2025-09-08
Smith Glick1016France2025-08-18
Aika Inouye1017Australia2025-08-19
Julie Stenseth1018Argentina2025-08-30
Misaki Royster1019Japan2025-08-28
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Ricardo GauchoFranceAmy Elsner NEGOTIATION
Darci PoquetteUnited KingdomAsiya Javayant NEW
Chavez BriddickBrazilIvan Magalhaes UNQUALIFIED
Wickens NestleRussiaBernardo Dominic NEW
Alejandro PerinGermanyBernardo Dominic NEW
Greenwood BologniaUnited KingdomAnna Fali RENEWAL
Leja CaldareraItalyElwin Sharvill NEGOTIATION
Jefferson SchemmerJapanAnna Fali UNQUALIFIED
Sinclair WaycottJapanBernardo Dominic NEGOTIATION
Aruna FigeroaBrazilXuxue Feng NEGOTIATION
Emily WhobreyUnited KingdomOnyama Limba NEW
Arvin AlbaresArgentinaXuxue Feng NEGOTIATION
Morrow RutaCanadaStephen Shaw PROPOSAL
Leon OldroydCanadaBernardo Dominic NEW
Mayumi KolmetzSpainAmy Elsner NEGOTIATION
Greenwood BologniaItalyAsiya Javayant NEGOTIATION
Silvio SlusarskiRussiaAsiya Javayant NEW
Isabel BowleyUnited KingdomBernardo Dominic NEGOTIATION
Silvio SlusarskiAustraliaAnna Fali UNQUALIFIED
Mayumi KolmetzAustraliaAsiya Javayant QUALIFIED
Jennifer AmigonFranceStephen Shaw QUALIFIED
Aika InouyeItalyElwin Sharvill PROPOSAL
Kaitlin OstroskySpainOnyama Limba UNQUALIFIED
Chavez BriddickIndiaBernardo Dominic UNQUALIFIED
Greenwood BologniaAustraliaAsiya Javayant NEW
Rodrigues CampainIndiaElwin Sharvill QUALIFIED
Smith GlickItalyElwin Sharvill NEW
Morrow RutaItalyBernardo Dominic RENEWAL
Ricardo GauchoArgentinaAmy Elsner RENEWAL
Smith GlickItalyIvan Magalhaes RENEWAL
Kadeem FlosiUnited KingdomAmy Elsner QUALIFIED
Sinclair WaycottGermanyAnna Fali NEW
Ashley DoeAustraliaAsiya Javayant NEW
Mayumi KolmetzBrazilAmy Elsner NEGOTIATION
Jeanfrancois VenereUnited KingdomIoni Bowcher RENEWAL
Aika InouyeRussiaOnyama Limba RENEWAL
Rodrigues CampainFranceXuxue Feng QUALIFIED
Alejandro PerinSpainAmy Elsner QUALIFIED
Misaki RoysterCanadaOnyama Limba QUALIFIED
Aruna FigeroaGermanyOnyama 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>