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
Salvatore StockhamAustraliaAnna Fali QUALIFIED
Mujtaba NickaFranceAsiya Javayant RENEWAL
David DarakjyArgentinaIvan Magalhaes NEW
Jeanfrancois VenereJapanBernardo Dominic NEGOTIATION
Rodrigues CampainCanadaBernardo Dominic RENEWAL
Clifford RimRussiaIvan Magalhaes RENEWAL
David DarakjySpainAnna Fali UNQUALIFIED
Jones VocelkaCanadaBernardo Dominic UNQUALIFIED
Deepesh ChuiFranceAsiya Javayant RENEWAL
Ricardo GauchoRussiaAsiya Javayant UNQUALIFIED
Leon OldroydFranceAmy Elsner NEGOTIATION
Mayumi KolmetzBrazilXuxue Feng QUALIFIED
Emily WhobreyIndiaStephen Shaw UNQUALIFIED
Morrow RutaUnited KingdomAmy Elsner QUALIFIED
Jefferson SchemmerFranceIvan Magalhaes QUALIFIED
Cody SaylorsAustraliaBernardo Dominic NEGOTIATION
Izzy GarufiBrazilStephen Shaw RENEWAL
Juan WieserGermanyBernardo Dominic NEW
Kaitlin OstroskyItalyAsiya Javayant PROPOSAL
Mayumi KolmetzArgentinaAmy Elsner NEW
David DarakjySpainAmy Elsner RENEWAL
Aruna FigeroaArgentinaStephen Shaw RENEWAL
Jeanfrancois VenereUnited KingdomElwin Sharvill NEGOTIATION
Mujtaba NickaFranceOnyama Limba NEW
Leja CaldareraCanadaElwin Sharvill UNQUALIFIED
Silvio SlusarskiUnited KingdomIvan Magalhaes NEGOTIATION
Rodrigues CampainGermanyBernardo Dominic PROPOSAL
Arvin AlbaresRussiaAmy Elsner UNQUALIFIED
Jennifer AmigonUnited KingdomIvan Magalhaes NEW
Jeanfrancois VenereIndiaElwin Sharvill NEGOTIATION
Emily WhobreyJapanOnyama Limba RENEWAL
Mayumi KolmetzJapanElwin Sharvill NEGOTIATION
Aika InouyeUnited KingdomIoni Bowcher QUALIFIED
Misaki RoysterBrazilStephen Shaw NEW
Stacey MacleadItalyAmy Elsner NEW
Leon OldroydGermanyIoni Bowcher PROPOSAL
Julie StensethGermanyOnyama Limba QUALIFIED
Aika InouyeFranceIvan Magalhaes RENEWAL
Jones VocelkaSpainXuxue Feng QUALIFIED
Deepesh ChuiJapanElwin Sharvill NEGOTIATION
Ashley DoeIndiaIvan Magalhaes PROPOSAL
Morrow RutaCanadaBernardo Dominic RENEWAL
Mujtaba NickaAustraliaAmy Elsner RENEWAL
Aditya KuskoIndiaElwin Sharvill PROPOSAL
Aditya KuskoArgentinaIoni Bowcher RENEWAL
Silvio SlusarskiArgentinaIvan Magalhaes PROPOSAL
Francesco ShinkoRussiaIoni Bowcher PROPOSAL
Mayumi KolmetzFranceAmy Elsner NEW
Adams MorascaGermanyXuxue Feng UNQUALIFIED
Clifford RimFranceAnna Fali UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Deepesh ChuiSpainOnyama Limba PROPOSAL
Jeanfrancois VenereItalyIvan Magalhaes NEGOTIATION
Salvatore StockhamCanadaBernardo Dominic PROPOSAL
Adams MorascaUnited KingdomIoni Bowcher QUALIFIED
Smith GlickIndiaIoni Bowcher PROPOSAL
Mayumi KolmetzUnited KingdomAmy Elsner NEW
Claire TollnerIndiaAmy Elsner UNQUALIFIED
Ivar PaprockiCanadaXuxue Feng NEGOTIATION
David DarakjySpainElwin Sharvill UNQUALIFIED
Cody SaylorsBrazilAmy Elsner PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Murillo MaletFrance2026-05-01Commercial Press UNQUALIFIED40Ivan Magalhaes
1001Smith GlickBrazil2026-04-28Printing Dimensions UNQUALIFIED30Xuxue Feng
1002Octavia MaletSpain2026-05-09Commercial Press NEW93Xuxue Feng
1003Wickens NestleJapan2026-05-04King, Christopher A Esq QUALIFIED80Stephen Shaw
1004Adams MorascaAustralia2026-05-06Buckley Miller Wright RENEWAL78Ivan Magalhaes
1005Jefferson SchemmerCanada2026-05-20King, Christopher A Esq RENEWAL97Onyama Limba
1006Johnson SergiAustralia2026-05-01Printing Dimensions UNQUALIFIED94Bernardo Dominic
1007Isabel BowleyJapan2026-05-10Printing Dimensions NEGOTIATION69Asiya Javayant
1008Ivar PaprockiAustralia2026-05-20Printing Dimensions NEW61Ivan Magalhaes
1009Salvatore StockhamAustralia2026-05-11Chanay, Jeffrey A Esq QUALIFIED2Bernardo Dominic
1010Aditya KuskoRussia2026-05-23Chanay, Jeffrey A Esq UNQUALIFIED55Anna Fali
1011Clifford RimBrazil2026-04-27Feiner Bros RENEWAL72Amy Elsner
1012Emily WhobreyGermany2026-05-15Chemel, James L Cpa RENEWAL39Stephen Shaw
1013Tony FollerFrance2026-05-18Printing Dimensions NEGOTIATION71Stephen Shaw
1014Jennifer AmigonCanada2026-05-17Feiner Bros PROPOSAL98Elwin Sharvill
1015Alejandro PerinSpain2026-05-12Morlong Associates UNQUALIFIED35Amy Elsner
1016Mayumi KolmetzArgentina2026-05-02Rangoni Of Florence UNQUALIFIED16Asiya Javayant
1017Cody SaylorsItaly2026-05-14Rangoni Of Florence QUALIFIED38Amy Elsner
1018Aika InouyeUnited Kingdom2026-05-24Feltz Printing Service NEW79Anna Fali
1019Aruna FigeroaUnited Kingdom2026-05-11Benton, John B Jr RENEWAL65Onyama Limba
1020Isabel BowleyCanada2026-05-11Commercial Press NEW14Bernardo Dominic
1021Antonio CaudyGermany2026-05-26Truhlar And Truhlar Attys RENEWAL49Amy Elsner
1022James ButtJapan2026-05-01Rangoni Of Florence UNQUALIFIED16Ioni Bowcher
1023Darci PoquetteBrazil2026-05-08Printing Dimensions NEGOTIATION42Bernardo Dominic
1024Jennifer AmigonBrazil2026-05-04Printing Dimensions NEGOTIATION24Elwin Sharvill
1025Jefferson SchemmerSpain2026-04-29King, Christopher A Esq UNQUALIFIED95Stephen Shaw
1026Faith GillianArgentina2026-04-30Chapman, Ross E Esq QUALIFIED22Stephen Shaw
1027Rodrigues CampainSpain2026-05-20King, Christopher A Esq QUALIFIED76Xuxue Feng
1028James ButtRussia2026-05-16Feltz Printing Service NEW23Stephen Shaw
1029Maria MarrierSpain2026-05-25Chemel, James L Cpa NEW69Asiya Javayant
1030Aditya KuskoGermany2026-05-17Benton, John B Jr PROPOSAL68Ivan Magalhaes
1031Darci PoquetteUnited Kingdom2026-05-11Feiner Bros RENEWAL69Bernardo Dominic
1032Ashley DoeRussia2026-05-03Chemel, James L Cpa NEW50Anna Fali
1033James ButtCanada2026-04-29Chapman, Ross E Esq NEW96Elwin Sharvill
1034Deepesh ChuiArgentina2026-05-01Morlong Associates RENEWAL89Elwin Sharvill
1035Chavez BriddickFrance2026-05-16Chanay, Jeffrey A Esq QUALIFIED83Elwin Sharvill
1036Adams MorascaAustralia2026-05-22Dorl, James J Esq QUALIFIED62Asiya Javayant
1037Izzy GarufiAustralia2026-05-22Printing Dimensions NEGOTIATION21Ivan Magalhaes
1038Ivar PaprockiIndia2026-05-05Rangoni Of Florence UNQUALIFIED35Asiya Javayant
1039Silvio SlusarskiFrance2026-05-17King, Christopher A Esq NEGOTIATION53Xuxue Feng
1040Alejandro PerinFrance2026-05-23Morlong Associates QUALIFIED71Elwin Sharvill
1041Smith GlickUnited Kingdom2026-05-04Feiner Bros RENEWAL15Amy Elsner
1042Isabel BowleyUnited Kingdom2026-05-20Chemel, James L Cpa NEW98Bernardo Dominic
1043Salvatore StockhamJapan2026-05-18Benton, John B Jr NEGOTIATION90Stephen Shaw
1044Cody SaylorsFrance2026-05-03Truhlar And Truhlar Attys PROPOSAL11Ivan Magalhaes
1045Leja CaldareraItaly2026-05-26Chanay, Jeffrey A Esq QUALIFIED81Onyama Limba
1046Greenwood BologniaUnited Kingdom2026-05-12Rousseaux, Michael Esq RENEWAL21Onyama Limba
1047Costa DilliardSpain2026-05-16Dorl, James J Esq RENEWAL95Asiya Javayant
1048Julie StensethBrazil2026-05-05Truhlar And Truhlar Attys PROPOSAL88Elwin Sharvill
1049Misaki RoysterBrazil2026-05-01King, Christopher A Esq QUALIFIED59Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Octavia MaletUnited KingdomIvan Magalhaes PROPOSAL
Wickens NestleGermanyIvan Magalhaes RENEWAL
Wickens NestleItalyIvan Magalhaes NEGOTIATION
Misaki RoysterArgentinaOnyama Limba RENEWAL
Darci PoquetteRussiaIoni Bowcher NEW
Kaitlin OstroskyCanadaElwin Sharvill RENEWAL
Rodrigues CampainJapanStephen Shaw PROPOSAL
Jeanfrancois VenereIndiaStephen Shaw NEW
Salvatore StockhamUnited KingdomXuxue Feng UNQUALIFIED
David DarakjySpainElwin Sharvill NEW
Clifford RimItalyIoni Bowcher PROPOSAL
Mujtaba NickaFranceElwin Sharvill PROPOSAL
Salvatore StockhamBrazilAmy Elsner RENEWAL
Jeanfrancois VenereAustraliaBernardo Dominic PROPOSAL
Sinclair WaycottRussiaAnna Fali PROPOSAL
Cody SaylorsIndiaStephen Shaw UNQUALIFIED
Tony FollerJapanStephen Shaw QUALIFIED
Murillo MaletAustraliaBernardo Dominic PROPOSAL
Kadeem FlosiIndiaAsiya Javayant PROPOSAL
Rodrigues CampainUnited KingdomBernardo Dominic QUALIFIED
Aika InouyeRussiaAmy Elsner QUALIFIED
Claire TollnerFranceAsiya Javayant UNQUALIFIED
Smith GlickArgentinaElwin Sharvill QUALIFIED
Silvio SlusarskiAustraliaAmy Elsner NEGOTIATION
Greenwood BologniaArgentinaBernardo Dominic NEGOTIATION
Stacey MacleadFranceAmy Elsner PROPOSAL
Aruna FigeroaUnited KingdomIoni Bowcher RENEWAL
Leon OldroydUnited KingdomAsiya Javayant UNQUALIFIED
Faith GillianJapanAnna Fali UNQUALIFIED
Salvatore StockhamCanadaBernardo Dominic UNQUALIFIED
Aruna FigeroaIndiaAnna Fali NEGOTIATION
Rodrigues CampainFranceAmy Elsner RENEWAL
James ButtBrazilBernardo Dominic QUALIFIED
Rodrigues CampainBrazilBernardo Dominic QUALIFIED
Octavia MaletUnited KingdomOnyama Limba PROPOSAL
Arvin AlbaresGermanyAnna Fali QUALIFIED
Juan WieserRussiaAmy Elsner QUALIFIED
Deepesh ChuiIndiaIoni Bowcher RENEWAL
Ashley DoeAustraliaXuxue Feng QUALIFIED
Murillo MaletAustraliaIvan Magalhaes RENEWAL
Jennifer AmigonArgentinaBernardo Dominic PROPOSAL
James ButtItalyAmy Elsner RENEWAL
Nicolas IturbideJapanIvan Magalhaes NEGOTIATION
Ivar PaprockiItalyXuxue Feng UNQUALIFIED
Ivar PaprockiBrazilXuxue Feng PROPOSAL
Octavia MaletBrazilStephen Shaw UNQUALIFIED
Kadeem FlosiGermanyIoni Bowcher NEW
Izzy GarufiFranceIvan Magalhaes QUALIFIED
Jeanfrancois VenereSpainAsiya Javayant NEGOTIATION
Jefferson SchemmerRussiaStephen Shaw RENEWAL
Frozen Columns
Name
Kadeem Flosi
Maisha Rulapaugh
Ivar Paprocki
Jennifer Amigon
Tony Foller
Kadeem Flosi
Alejandro Perin
Ivar Paprocki
Sinclair Waycott
Deepesh Chui
Morrow Ruta
Johnson Sergi
Rodrigues Campain
Isabel Bowley
Claire Tollner
Wickens Nestle
Kadeem Flosi
Clifford Rim
Chavez Briddick
Jones Vocelka
Octavia Malet
Johnson Sergi
Izzy Garufi
Claire Tollner
Johnson Sergi
David Darakjy
Rodrigues Campain
Aika Inouye
Costa Dilliard
Rodrigues Campain
Munro Ferencz
Antonio Caudy
Clifford Rim
Maria Marrier
Tony Foller
Maria Marrier
Mayumi Kolmetz
Chavez Briddick
Faith Gillian
Salvatore Stockham
Munro Ferencz
Emily Whobrey
Munro Ferencz
Smith Glick
Jefferson Schemmer
Deepesh Chui
Jennifer Amigon
Rodrigues Campain
Jefferson Schemmer
Antonio Caudy
IdCountryDate
1000Japan2026-05-20
1001United Kingdom2026-05-23
1002Russia2026-04-27
1003Russia2026-05-05
1004India2026-05-26
1005France2026-05-18
1006Argentina2026-05-12
1007Argentina2026-05-23
1008Russia2026-05-14
1009Japan2026-04-28
1010Brazil2026-05-02
1011Russia2026-05-15
1012France2026-05-22
1013Germany2026-04-29
1014Canada2026-05-07
1015Spain2026-05-25
1016Argentina2026-05-07
1017Canada2026-05-13
1018Argentina2026-05-20
1019Canada2026-05-03
1020Brazil2026-05-12
1021Japan2026-05-17
1022United Kingdom2026-05-20
1023Italy2026-05-12
1024Argentina2026-05-22
1025Australia2026-05-24
1026France2026-05-22
1027Spain2026-05-08
1028Canada2026-05-22
1029United Kingdom2026-05-15
1030Japan2026-04-30
1031Canada2026-05-01
1032Australia2026-05-18
1033Australia2026-05-19
1034Spain2026-05-02
1035Spain2026-05-22
1036Italy2026-05-19
1037Japan2026-05-23
1038Spain2026-04-27
1039Canada2026-04-27
1040Russia2026-04-30
1041Russia2026-05-24
1042India2026-05-06
1043Germany2026-04-27
1044Japan2026-05-09
1045Argentina2026-04-28
1046United Kingdom2026-04-29
1047Brazil2026-04-27
1048United Kingdom2026-05-12
1049Brazil2026-05-01

On-Demand Data

NameIdCountryDate
David Darakjy1000Italy2026-05-25
Costa Dilliard1001Italy2026-05-03
Faith Gillian1002Spain2026-05-17
Francesco Shinko1003Brazil2026-05-14
Aditya Kusko1004Italy2026-05-08
Jones Vocelka1005United Kingdom2026-05-12
Murillo Malet1006Italy2026-05-22
Smith Glick1007United Kingdom2026-05-23
Maisha Rulapaugh1008Spain2026-05-08
Jefferson Schemmer1009France2026-05-03
Kadeem Flosi1010United Kingdom2026-05-24
Leon Oldroyd1011Japan2026-05-10
Juan Wieser1012Russia2026-05-19
Arvin Albares1013France2026-05-21
Johnson Sergi1014Australia2026-05-25
Clifford Rim1015France2026-05-26
David Darakjy1016Russia2026-05-08
Jennifer Amigon1017Germany2026-05-01
Maisha Rulapaugh1018Canada2026-05-21
Antonio Caudy1019Brazil2026-05-05
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Julie StensethGermanyStephen Shaw NEGOTIATION
Juan WieserArgentinaIvan Magalhaes NEGOTIATION
Nicolas IturbideBrazilElwin Sharvill PROPOSAL
Alejandro PerinBrazilAsiya Javayant UNQUALIFIED
Sinclair WaycottBrazilIvan Magalhaes QUALIFIED
Claire TollnerArgentinaAsiya Javayant NEW
Alejandro PerinGermanyAnna Fali NEGOTIATION
James ButtRussiaXuxue Feng UNQUALIFIED
Munro FerenczCanadaAnna Fali NEGOTIATION
Ashley DoeArgentinaStephen Shaw UNQUALIFIED
Chavez BriddickFranceIvan Magalhaes NEGOTIATION
Mayumi KolmetzItalyBernardo Dominic UNQUALIFIED
Aruna FigeroaCanadaAmy Elsner UNQUALIFIED
Francesco ShinkoArgentinaIvan Magalhaes QUALIFIED
Emily WhobreyFranceAnna Fali UNQUALIFIED
Aruna FigeroaBrazilIoni Bowcher QUALIFIED
Julie StensethJapanAsiya Javayant NEGOTIATION
Isabel BowleyFranceAsiya Javayant RENEWAL
James ButtBrazilStephen Shaw NEGOTIATION
Francesco ShinkoArgentinaBernardo Dominic QUALIFIED
Aika InouyeSpainIoni Bowcher PROPOSAL
Wickens NestleCanadaAsiya Javayant UNQUALIFIED
Johnson SergiSpainBernardo Dominic NEGOTIATION
Isabel BowleyIndiaIoni Bowcher UNQUALIFIED
Smith GlickJapanAmy Elsner RENEWAL
Aruna FigeroaJapanIvan Magalhaes QUALIFIED
Jones VocelkaFranceOnyama Limba RENEWAL
Murillo MaletArgentinaIvan Magalhaes NEGOTIATION
Izzy GarufiBrazilIvan Magalhaes NEW
Salvatore StockhamArgentinaIvan Magalhaes RENEWAL
Munro FerenczGermanyStephen Shaw PROPOSAL
Francesco ShinkoJapanBernardo Dominic PROPOSAL
Arvin AlbaresIndiaElwin Sharvill PROPOSAL
Aditya KuskoUnited KingdomOnyama Limba RENEWAL
Ivar PaprockiAustraliaIvan Magalhaes UNQUALIFIED
Ashley DoeAustraliaAmy Elsner NEW
Darci PoquetteRussiaXuxue Feng PROPOSAL
Emily WhobreyRussiaStephen Shaw NEW
Maisha RulapaughBrazilIvan Magalhaes RENEWAL
Jennifer AmigonRussiaIvan Magalhaes NEGOTIATION

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