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
Emily WhobreyCanadaAnna Fali PROPOSAL
Alejandro PerinAustraliaAsiya Javayant QUALIFIED
Misaki RoysterUnited KingdomAsiya Javayant UNQUALIFIED
Emily WhobreyFranceXuxue Feng NEGOTIATION
Mujtaba NickaGermanyElwin Sharvill UNQUALIFIED
Misaki RoysterUnited KingdomAnna Fali UNQUALIFIED
Adams MorascaGermanyOnyama Limba NEW
Aditya KuskoGermanyAmy Elsner UNQUALIFIED
Kaitlin OstroskyUnited KingdomAnna Fali RENEWAL
Cody SaylorsUnited KingdomIoni Bowcher NEGOTIATION
Aruna FigeroaAustraliaXuxue Feng PROPOSAL
Octavia MaletRussiaOnyama Limba RENEWAL
Munro FerenczArgentinaElwin Sharvill UNQUALIFIED
Isabel BowleyUnited KingdomStephen Shaw RENEWAL
Ivar PaprockiIndiaIoni Bowcher NEGOTIATION
Johnson SergiItalyOnyama Limba RENEWAL
Nicolas IturbideCanadaBernardo Dominic RENEWAL
Julie StensethBrazilIoni Bowcher PROPOSAL
Jennifer AmigonRussiaOnyama Limba PROPOSAL
Francesco ShinkoJapanOnyama Limba UNQUALIFIED
Wickens NestleArgentinaElwin Sharvill NEGOTIATION
Julie StensethGermanyAnna Fali QUALIFIED
Nicolas IturbideAustraliaElwin Sharvill PROPOSAL
Sinclair WaycottBrazilAmy Elsner NEGOTIATION
Maria MarrierArgentinaIvan Magalhaes PROPOSAL
Maria MarrierRussiaElwin Sharvill NEW
Emily WhobreyAustraliaElwin Sharvill NEGOTIATION
Emily WhobreyUnited KingdomBernardo Dominic NEW
Darci PoquetteSpainOnyama Limba NEW
Juan WieserItalyOnyama Limba UNQUALIFIED
Antonio CaudyCanadaAnna Fali RENEWAL
Julie StensethArgentinaAsiya Javayant PROPOSAL
Silvio SlusarskiArgentinaIoni Bowcher UNQUALIFIED
Izzy GarufiCanadaAsiya Javayant RENEWAL
Chavez BriddickGermanyStephen Shaw NEGOTIATION
Tony FollerJapanXuxue Feng NEW
Julie StensethFranceAmy Elsner NEGOTIATION
Ricardo GauchoRussiaBernardo Dominic UNQUALIFIED
Emily WhobreyIndiaAsiya Javayant NEW
Chavez BriddickFranceElwin Sharvill NEW
James ButtJapanIoni Bowcher PROPOSAL
Antonio CaudyFranceStephen Shaw RENEWAL
Ivar PaprockiIndiaIvan Magalhaes NEW
Tony FollerCanadaAsiya Javayant QUALIFIED
Juan WieserArgentinaBernardo Dominic NEGOTIATION
Misaki RoysterJapanOnyama Limba QUALIFIED
Maria MarrierGermanyElwin Sharvill QUALIFIED
Leja CaldareraRussiaElwin Sharvill QUALIFIED
Kaitlin OstroskyCanadaAmy Elsner UNQUALIFIED
Aditya KuskoAustraliaBernardo Dominic QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Julie StensethFranceAnna Fali RENEWAL
Juan WieserBrazilXuxue Feng UNQUALIFIED
Darci PoquetteRussiaBernardo Dominic NEW
Darci PoquetteItalyIvan Magalhaes UNQUALIFIED
Ricardo GauchoArgentinaElwin Sharvill NEW
Ricardo GauchoCanadaOnyama Limba QUALIFIED
David DarakjyJapanAmy Elsner UNQUALIFIED
Salvatore StockhamGermanyXuxue Feng NEW
Johnson SergiAustraliaElwin Sharvill PROPOSAL
Maisha RulapaughJapanOnyama Limba NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Kadeem FlosiBrazil2026-04-07Rangoni Of Florence QUALIFIED29Xuxue Feng
1001Misaki RoysterCanada2026-04-27Benton, John B Jr UNQUALIFIED15Ioni Bowcher
1002Juan WieserFrance2026-04-26Feltz Printing Service UNQUALIFIED34Asiya Javayant
1003Clifford RimBrazil2026-04-26Rousseaux, Michael Esq PROPOSAL24Bernardo Dominic
1004Adams MorascaSpain2026-04-08Morlong Associates UNQUALIFIED63Elwin Sharvill
1005Aika InouyeUnited Kingdom2026-04-08Truhlar And Truhlar Attys UNQUALIFIED78Onyama Limba
1006Alejandro PerinBrazil2026-04-14Feiner Bros PROPOSAL96Asiya Javayant
1007Ivar PaprockiBrazil2026-04-25Chemel, James L Cpa UNQUALIFIED69Onyama Limba
1008Aruna FigeroaFrance2026-04-30Rangoni Of Florence PROPOSAL14Amy Elsner
1009Arvin AlbaresUnited Kingdom2026-04-16Truhlar And Truhlar Attys NEW78Xuxue Feng
1010Maria MarrierCanada2026-04-13Chanay, Jeffrey A Esq QUALIFIED67Elwin Sharvill
1011Wickens NestleAustralia2026-04-06Buckley Miller Wright RENEWAL22Ivan Magalhaes
1012Wickens NestleFrance2026-04-18Chemel, James L Cpa QUALIFIED74Elwin Sharvill
1013Arvin AlbaresBrazil2026-04-22Rousseaux, Michael Esq PROPOSAL71Elwin Sharvill
1014Deepesh ChuiUnited Kingdom2026-04-11Dorl, James J Esq NEGOTIATION57Elwin Sharvill
1015Costa DilliardCanada2026-04-28King, Christopher A Esq RENEWAL72Elwin Sharvill
1016Arvin AlbaresItaly2026-05-03Chemel, James L Cpa UNQUALIFIED78Asiya Javayant
1017Isabel BowleyUnited Kingdom2026-04-10Benton, John B Jr QUALIFIED5Asiya Javayant
1018Isabel BowleyItaly2026-04-19Morlong Associates NEW40Ivan Magalhaes
1019Cody SaylorsIndia2026-04-05Morlong Associates NEGOTIATION58Onyama Limba
1020Silvio SlusarskiAustralia2026-04-09Chapman, Ross E Esq UNQUALIFIED40Bernardo Dominic
1021Adams MorascaBrazil2026-04-26Morlong Associates PROPOSAL12Stephen Shaw
1022Antonio CaudyArgentina2026-04-09Feiner Bros PROPOSAL68Xuxue Feng
1023Morrow RutaCanada2026-04-25Chemel, James L Cpa NEGOTIATION36Amy Elsner
1024Salvatore StockhamFrance2026-04-13Chapman, Ross E Esq NEGOTIATION13Ivan Magalhaes
1025Darci PoquetteJapan2026-04-23Rangoni Of Florence NEW62Ivan Magalhaes
1026Leon OldroydArgentina2026-04-13Morlong Associates NEW12Elwin Sharvill
1027Adams MorascaBrazil2026-04-22Chanay, Jeffrey A Esq QUALIFIED31Stephen Shaw
1028Octavia MaletRussia2026-04-06Rousseaux, Michael Esq QUALIFIED14Ivan Magalhaes
1029Isabel BowleyFrance2026-04-17Chanay, Jeffrey A Esq QUALIFIED54Xuxue Feng
1030Isabel BowleyJapan2026-04-27Chapman, Ross E Esq NEW71Asiya Javayant
1031Aditya KuskoCanada2026-04-27Chemel, James L Cpa QUALIFIED3Ivan Magalhaes
1032Leon OldroydFrance2026-04-27Dorl, James J Esq RENEWAL70Elwin Sharvill
1033Sinclair WaycottRussia2026-04-17Truhlar And Truhlar Attys PROPOSAL24Elwin Sharvill
1034Claire TollnerBrazil2026-04-08Rousseaux, Michael Esq PROPOSAL69Bernardo Dominic
1035Alejandro PerinJapan2026-04-06King, Christopher A Esq NEW87Onyama Limba
1036Adams MorascaSpain2026-04-27Buckley Miller Wright NEW98Bernardo Dominic
1037Jeanfrancois VenereSpain2026-04-24Feltz Printing Service NEGOTIATION25Stephen Shaw
1038Rodrigues CampainFrance2026-04-20Morlong Associates NEGOTIATION3Anna Fali
1039Julie StensethBrazil2026-04-17Rangoni Of Florence UNQUALIFIED68Amy Elsner
1040Jennifer AmigonAustralia2026-04-28Commercial Press NEW28Ioni Bowcher
1041Mayumi KolmetzRussia2026-04-29King, Christopher A Esq NEGOTIATION15Stephen Shaw
1042Ashley DoeCanada2026-05-02King, Christopher A Esq UNQUALIFIED53Elwin Sharvill
1043Darci PoquetteUnited Kingdom2026-04-26Buckley Miller Wright PROPOSAL91Onyama Limba
1044Silvio SlusarskiArgentina2026-04-14Commercial Press RENEWAL82Asiya Javayant
1045Deepesh ChuiAustralia2026-04-26Feltz Printing Service QUALIFIED24Asiya Javayant
1046Misaki RoysterItaly2026-04-25Rangoni Of Florence NEGOTIATION2Xuxue Feng
1047David DarakjyBrazil2026-04-08Morlong Associates QUALIFIED92Xuxue Feng
1048Aruna FigeroaArgentina2026-04-13Chanay, Jeffrey A Esq NEGOTIATION70Amy Elsner
1049Darci PoquetteFrance2026-04-10Chemel, James L Cpa RENEWAL94Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Adams MorascaArgentinaAmy Elsner PROPOSAL
Faith GillianArgentinaOnyama Limba RENEWAL
Aditya KuskoRussiaStephen Shaw PROPOSAL
Mujtaba NickaRussiaAsiya Javayant UNQUALIFIED
Kaitlin OstroskyIndiaOnyama Limba RENEWAL
Isabel BowleyIndiaElwin Sharvill QUALIFIED
Kaitlin OstroskySpainOnyama Limba NEW
Octavia MaletJapanStephen Shaw NEW
Deepesh ChuiAustraliaAsiya Javayant NEW
Izzy GarufiRussiaIvan Magalhaes QUALIFIED
Ashley DoeFranceAsiya Javayant UNQUALIFIED
Murillo MaletJapanIoni Bowcher UNQUALIFIED
Francesco ShinkoAustraliaAnna Fali NEGOTIATION
Jeanfrancois VenereBrazilElwin Sharvill QUALIFIED
Salvatore StockhamIndiaAnna Fali RENEWAL
Salvatore StockhamAustraliaXuxue Feng NEW
Munro FerenczGermanyAsiya Javayant NEW
Stacey MacleadAustraliaAnna Fali NEGOTIATION
Kaitlin OstroskyArgentinaBernardo Dominic NEGOTIATION
Rodrigues CampainJapanIvan Magalhaes NEGOTIATION
Ricardo GauchoItalyElwin Sharvill RENEWAL
Sinclair WaycottGermanyStephen Shaw PROPOSAL
Leja CaldareraRussiaAsiya Javayant NEGOTIATION
Murillo MaletRussiaBernardo Dominic NEW
Deepesh ChuiFranceIoni Bowcher NEGOTIATION
Rodrigues CampainFranceIvan Magalhaes PROPOSAL
Rodrigues CampainItalyOnyama Limba PROPOSAL
Morrow RutaUnited KingdomIoni Bowcher PROPOSAL
Aditya KuskoFranceBernardo Dominic PROPOSAL
Costa DilliardArgentinaElwin Sharvill UNQUALIFIED
Jones VocelkaItalyIvan Magalhaes NEGOTIATION
Costa DilliardSpainAnna Fali UNQUALIFIED
Deepesh ChuiCanadaOnyama Limba PROPOSAL
Chavez BriddickSpainElwin Sharvill NEW
Chavez BriddickItalyAnna Fali QUALIFIED
Aditya KuskoJapanStephen Shaw QUALIFIED
Leja CaldareraItalyOnyama Limba NEW
Jones VocelkaArgentinaBernardo Dominic UNQUALIFIED
Jones VocelkaBrazilXuxue Feng UNQUALIFIED
Julie StensethBrazilOnyama Limba QUALIFIED
Leja CaldareraCanadaAmy Elsner NEGOTIATION
Arvin AlbaresUnited KingdomIoni Bowcher RENEWAL
Morrow RutaIndiaElwin Sharvill RENEWAL
Faith GillianFranceIoni Bowcher QUALIFIED
Ivar PaprockiAustraliaAsiya Javayant PROPOSAL
Murillo MaletUnited KingdomIvan Magalhaes NEW
James ButtAustraliaBernardo Dominic NEW
Johnson SergiJapanStephen Shaw QUALIFIED
Stacey MacleadBrazilIvan Magalhaes NEW
Aruna FigeroaIndiaXuxue Feng RENEWAL
Frozen Columns
Name
Kadeem Flosi
Clifford Rim
Murillo Malet
Jennifer Amigon
Clifford Rim
Cody Saylors
Emily Whobrey
Ashley Doe
Munro Ferencz
Mujtaba Nicka
Chavez Briddick
Jennifer Amigon
Ricardo Gaucho
Emily Whobrey
Antonio Caudy
Isabel Bowley
Jeanfrancois Venere
Octavia Malet
Jeanfrancois Venere
Leja Caldarera
Wickens Nestle
Kadeem Flosi
Aditya Kusko
Tony Foller
Darci Poquette
Claire Tollner
Salvatore Stockham
Ivar Paprocki
Izzy Garufi
Antonio Caudy
Ricardo Gaucho
Adams Morasca
Costa Dilliard
Antonio Caudy
Juan Wieser
Clifford Rim
Mujtaba Nicka
Misaki Royster
Julie Stenseth
Clifford Rim
Nicolas Iturbide
Deepesh Chui
Juan Wieser
Aditya Kusko
Chavez Briddick
Stacey Maclead
Claire Tollner
Claire Tollner
Leja Caldarera
Mayumi Kolmetz
IdCountryDate
1000Canada2026-04-30
1001Germany2026-04-14
1002Russia2026-04-22
1003Spain2026-04-12
1004France2026-04-16
1005India2026-04-26
1006Spain2026-04-27
1007United Kingdom2026-05-01
1008Italy2026-05-04
1009India2026-05-03
1010Australia2026-04-26
1011Brazil2026-04-14
1012Brazil2026-04-13
1013Australia2026-04-13
1014Italy2026-04-26
1015Canada2026-04-22
1016Japan2026-04-06
1017Spain2026-04-19
1018France2026-04-29
1019Italy2026-04-12
1020Brazil2026-04-23
1021Russia2026-04-23
1022Brazil2026-04-18
1023Italy2026-04-10
1024Australia2026-04-12
1025France2026-04-11
1026Argentina2026-04-21
1027Australia2026-05-01
1028Italy2026-04-20
1029United Kingdom2026-04-25
1030United Kingdom2026-04-25
1031Brazil2026-04-26
1032India2026-04-29
1033Germany2026-04-08
1034Russia2026-04-23
1035India2026-04-13
1036Argentina2026-04-15
1037Canada2026-04-28
1038United Kingdom2026-04-10
1039Australia2026-05-03
1040Spain2026-04-16
1041Germany2026-04-30
1042Russia2026-04-21
1043Russia2026-05-02
1044France2026-04-19
1045Brazil2026-04-14
1046India2026-04-12
1047Russia2026-04-05
1048France2026-04-16
1049France2026-04-26

On-Demand Data

NameIdCountryDate
Julie Stenseth1000Italy2026-05-04
Jennifer Amigon1001Brazil2026-04-30
Munro Ferencz1002Germany2026-04-18
Sinclair Waycott1003France2026-04-28
Aruna Figeroa1004Canada2026-04-22
Smith Glick1005Argentina2026-04-10
Antonio Caudy1006France2026-04-08
Juan Wieser1007Brazil2026-04-17
Mujtaba Nicka1008Japan2026-04-12
Maria Marrier1009Germany2026-04-11
Octavia Malet1010Germany2026-04-16
Kaitlin Ostrosky1011Australia2026-04-08
Munro Ferencz1012Japan2026-04-22
Adams Morasca1013Spain2026-04-05
Faith Gillian1014Italy2026-04-18
Costa Dilliard1015Argentina2026-05-03
Chavez Briddick1016Italy2026-05-01
Leja Caldarera1017Germany2026-04-27
Wickens Nestle1018Canada2026-04-27
Maisha Rulapaugh1019Australia2026-04-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jeanfrancois VenereRussiaAnna Fali PROPOSAL
Darci PoquetteSpainAsiya Javayant UNQUALIFIED
Mujtaba NickaUnited KingdomOnyama Limba NEW
Jeanfrancois VenereFranceAsiya Javayant NEW
Izzy GarufiCanadaBernardo Dominic QUALIFIED
Aika InouyeRussiaAmy Elsner UNQUALIFIED
Jones VocelkaGermanyAmy Elsner NEGOTIATION
Misaki RoysterJapanBernardo Dominic QUALIFIED
Jeanfrancois VenereFranceXuxue Feng NEW
David DarakjyBrazilElwin Sharvill RENEWAL
Tony FollerCanadaOnyama Limba UNQUALIFIED
Claire TollnerFranceOnyama Limba QUALIFIED
Maisha RulapaughSpainIoni Bowcher RENEWAL
Mayumi KolmetzItalyAmy Elsner PROPOSAL
Juan WieserFranceAmy Elsner NEW
Mayumi KolmetzRussiaIvan Magalhaes UNQUALIFIED
Jones VocelkaRussiaIvan Magalhaes NEW
Aditya KuskoFranceOnyama Limba RENEWAL
Silvio SlusarskiGermanyIvan Magalhaes UNQUALIFIED
Emily WhobreyGermanyIoni Bowcher RENEWAL
Clifford RimUnited KingdomAsiya Javayant PROPOSAL
Kadeem FlosiCanadaXuxue Feng NEW
Munro FerenczRussiaStephen Shaw PROPOSAL
Silvio SlusarskiGermanyAsiya Javayant QUALIFIED
Kaitlin OstroskyCanadaElwin Sharvill NEGOTIATION
Silvio SlusarskiUnited KingdomAnna Fali RENEWAL
Leja CaldareraFranceAmy Elsner RENEWAL
Morrow RutaArgentinaOnyama Limba NEW
David DarakjyGermanyAmy Elsner NEGOTIATION
James ButtAustraliaAmy Elsner NEW
David DarakjyAustraliaIoni Bowcher PROPOSAL
Alejandro PerinSpainAsiya Javayant QUALIFIED
Clifford RimRussiaAsiya Javayant UNQUALIFIED
Antonio CaudyRussiaAsiya Javayant PROPOSAL
Aditya KuskoJapanAmy Elsner NEGOTIATION
Sinclair WaycottIndiaOnyama Limba NEGOTIATION
Jeanfrancois VenereBrazilAsiya Javayant RENEWAL
Francesco ShinkoJapanXuxue Feng RENEWAL
Aditya KuskoBrazilElwin Sharvill QUALIFIED
Leja CaldareraCanadaAmy Elsner 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>