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 WhobreyBrazilStephen Shaw NEW
Jones VocelkaJapanBernardo Dominic QUALIFIED
Emily WhobreySpainBernardo Dominic NEW
Francesco ShinkoIndiaOnyama Limba QUALIFIED
Maisha RulapaughArgentinaStephen Shaw NEGOTIATION
Clifford RimBrazilIoni Bowcher RENEWAL
Aruna FigeroaSpainAsiya Javayant RENEWAL
Costa DilliardAustraliaAmy Elsner RENEWAL
Chavez BriddickItalyOnyama Limba RENEWAL
Munro FerenczCanadaIoni Bowcher RENEWAL
Mayumi KolmetzCanadaXuxue Feng NEGOTIATION
Nicolas IturbideBrazilAnna Fali NEGOTIATION
Jeanfrancois VenereIndiaIvan Magalhaes PROPOSAL
Tony FollerAustraliaXuxue Feng QUALIFIED
Darci PoquetteItalyIvan Magalhaes QUALIFIED
Leon OldroydUnited KingdomBernardo Dominic RENEWAL
Rodrigues CampainItalyAsiya Javayant RENEWAL
Isabel BowleyArgentinaAsiya Javayant PROPOSAL
Murillo MaletArgentinaIvan Magalhaes NEW
Deepesh ChuiUnited KingdomBernardo Dominic NEGOTIATION
Munro FerenczBrazilAmy Elsner NEGOTIATION
Jefferson SchemmerBrazilAmy Elsner NEGOTIATION
Aruna FigeroaGermanyIvan Magalhaes QUALIFIED
Silvio SlusarskiBrazilAnna Fali PROPOSAL
Ricardo GauchoUnited KingdomAmy Elsner NEW
James ButtUnited KingdomElwin Sharvill NEW
Claire TollnerIndiaStephen Shaw NEGOTIATION
Stacey MacleadJapanAmy Elsner QUALIFIED
Juan WieserIndiaBernardo Dominic NEGOTIATION
Jeanfrancois VenereArgentinaIoni Bowcher UNQUALIFIED
James ButtCanadaStephen Shaw QUALIFIED
Rodrigues CampainBrazilStephen Shaw PROPOSAL
Adams MorascaGermanyIvan Magalhaes NEGOTIATION
Johnson SergiIndiaElwin Sharvill NEGOTIATION
Rodrigues CampainSpainAsiya Javayant UNQUALIFIED
Cody SaylorsJapanOnyama Limba RENEWAL
Leon OldroydRussiaAsiya Javayant PROPOSAL
Maria MarrierArgentinaAmy Elsner NEW
Adams MorascaJapanElwin Sharvill NEW
Claire TollnerAustraliaStephen Shaw QUALIFIED
Maria MarrierFranceAnna Fali NEW
Deepesh ChuiSpainStephen Shaw RENEWAL
Morrow RutaCanadaXuxue Feng NEW
Murillo MaletBrazilAsiya Javayant QUALIFIED
Faith GillianGermanyBernardo Dominic QUALIFIED
James ButtCanadaOnyama Limba NEW
Greenwood BologniaCanadaElwin Sharvill NEGOTIATION
Alejandro PerinArgentinaIvan Magalhaes UNQUALIFIED
Salvatore StockhamRussiaAmy Elsner RENEWAL
Ricardo GauchoRussiaStephen Shaw UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Rodrigues CampainItalyIvan Magalhaes PROPOSAL
Silvio SlusarskiBrazilIvan Magalhaes RENEWAL
Emily WhobreyAustraliaBernardo Dominic UNQUALIFIED
Aika InouyeAustraliaStephen Shaw QUALIFIED
Adams MorascaJapanStephen Shaw PROPOSAL
Izzy GarufiJapanAsiya Javayant QUALIFIED
Adams MorascaRussiaBernardo Dominic QUALIFIED
Nicolas IturbideAustraliaBernardo Dominic RENEWAL
Izzy GarufiFranceStephen Shaw RENEWAL
Ivar PaprockiUnited KingdomAmy Elsner QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Antonio CaudyRussia2026-05-03Chanay, Jeffrey A Esq UNQUALIFIED7Stephen Shaw
1001Ashley DoeBrazil2026-05-16King, Christopher A Esq NEGOTIATION91Stephen Shaw
1002Aditya KuskoJapan2026-05-19Morlong Associates NEGOTIATION4Elwin Sharvill
1003Smith GlickAustralia2026-05-04Chapman, Ross E Esq NEGOTIATION23Ivan Magalhaes
1004Adams MorascaItaly2026-05-20Truhlar And Truhlar Attys UNQUALIFIED35Anna Fali
1005Isabel BowleyJapan2026-05-09Chapman, Ross E Esq PROPOSAL0Asiya Javayant
1006Juan WieserRussia2026-05-03Printing Dimensions QUALIFIED32Onyama Limba
1007Sinclair WaycottGermany2026-05-31Buckley Miller Wright RENEWAL99Stephen Shaw
1008Stacey MacleadFrance2026-05-10Chapman, Ross E Esq UNQUALIFIED0Elwin Sharvill
1009Mayumi KolmetzArgentina2026-05-04Truhlar And Truhlar Attys NEGOTIATION43Asiya Javayant
1010Johnson SergiArgentina2026-05-22Buckley Miller Wright RENEWAL23Onyama Limba
1011Tony FollerCanada2026-05-21King, Christopher A Esq QUALIFIED56Elwin Sharvill
1012Isabel BowleyUnited Kingdom2026-05-08Printing Dimensions NEW81Anna Fali
1013Silvio SlusarskiAustralia2026-05-04Chanay, Jeffrey A Esq QUALIFIED19Ivan Magalhaes
1014Silvio SlusarskiJapan2026-05-21King, Christopher A Esq PROPOSAL20Bernardo Dominic
1015Greenwood BologniaUnited Kingdom2026-06-01Benton, John B Jr RENEWAL64Stephen Shaw
1016Julie StensethSpain2026-05-07Buckley Miller Wright QUALIFIED2Ioni Bowcher
1017Clifford RimArgentina2026-05-27Chemel, James L Cpa NEW17Stephen Shaw
1018Octavia MaletJapan2026-05-13Chapman, Ross E Esq PROPOSAL38Asiya Javayant
1019Murillo MaletCanada2026-05-06Feiner Bros NEW22Amy Elsner
1020Maria MarrierUnited Kingdom2026-05-17Benton, John B Jr NEGOTIATION70Ioni Bowcher
1021Kaitlin OstroskySpain2026-05-11Chanay, Jeffrey A Esq UNQUALIFIED48Elwin Sharvill
1022Darci PoquetteRussia2026-05-28Chanay, Jeffrey A Esq QUALIFIED81Amy Elsner
1023Murillo MaletAustralia2026-05-21Rousseaux, Michael Esq NEW30Ivan Magalhaes
1024Alejandro PerinIndia2026-06-01Printing Dimensions PROPOSAL34Elwin Sharvill
1025Ivar PaprockiFrance2026-05-13Rousseaux, Michael Esq QUALIFIED92Onyama Limba
1026Kaitlin OstroskyItaly2026-05-31Rangoni Of Florence PROPOSAL10Bernardo Dominic
1027Izzy GarufiJapan2026-05-08Feiner Bros NEGOTIATION73Stephen Shaw
1028Claire TollnerItaly2026-05-30Rousseaux, Michael Esq QUALIFIED59Anna Fali
1029Sinclair WaycottUnited Kingdom2026-05-09Rangoni Of Florence RENEWAL10Ioni Bowcher
1030Jones VocelkaAustralia2026-05-21Dorl, James J Esq NEGOTIATION15Amy Elsner
1031Antonio CaudyArgentina2026-05-18Dorl, James J Esq NEGOTIATION0Onyama Limba
1032Munro FerenczSpain2026-05-31Rangoni Of Florence RENEWAL6Anna Fali
1033Rodrigues CampainArgentina2026-05-28Truhlar And Truhlar Attys UNQUALIFIED71Ioni Bowcher
1034Tony FollerCanada2026-05-21Printing Dimensions RENEWAL85Asiya Javayant
1035Jones VocelkaBrazil2026-05-26Rousseaux, Michael Esq QUALIFIED72Ioni Bowcher
1036Leja CaldareraBrazil2026-05-18King, Christopher A Esq NEGOTIATION82Ivan Magalhaes
1037Deepesh ChuiArgentina2026-05-27Dorl, James J Esq PROPOSAL25Xuxue Feng
1038Murillo MaletCanada2026-05-11Truhlar And Truhlar Attys UNQUALIFIED42Amy Elsner
1039Leja CaldareraGermany2026-05-17King, Christopher A Esq RENEWAL85Ivan Magalhaes
1040Jefferson SchemmerAustralia2026-05-21Truhlar And Truhlar Attys NEW57Amy Elsner
1041Arvin AlbaresJapan2026-05-27Chanay, Jeffrey A Esq UNQUALIFIED5Xuxue Feng
1042Munro FerenczJapan2026-06-01Chapman, Ross E Esq NEGOTIATION68Amy Elsner
1043Stacey MacleadSpain2026-05-11Rousseaux, Michael Esq NEW57Amy Elsner
1044Octavia MaletBrazil2026-05-22Morlong Associates PROPOSAL35Stephen Shaw
1045Ashley DoeCanada2026-05-07Buckley Miller Wright QUALIFIED77Anna Fali
1046Ivar PaprockiIndia2026-05-19Commercial Press RENEWAL29Anna Fali
1047Stacey MacleadUnited Kingdom2026-05-10Rousseaux, Michael Esq RENEWAL97Amy Elsner
1048Murillo MaletArgentina2026-05-04Feltz Printing Service QUALIFIED65Stephen Shaw
1049Alejandro PerinFrance2026-05-07Morlong Associates PROPOSAL81Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Adams MorascaGermanyOnyama Limba RENEWAL
Silvio SlusarskiIndiaIvan Magalhaes QUALIFIED
Munro FerenczItalyBernardo Dominic UNQUALIFIED
Johnson SergiRussiaAmy Elsner UNQUALIFIED
Murillo MaletGermanyElwin Sharvill NEGOTIATION
Adams MorascaIndiaAnna Fali QUALIFIED
Munro FerenczRussiaAmy Elsner NEW
Adams MorascaIndiaOnyama Limba NEGOTIATION
Jeanfrancois VenereBrazilElwin Sharvill PROPOSAL
Cody SaylorsRussiaAmy Elsner NEW
Alejandro PerinAustraliaIoni Bowcher QUALIFIED
Chavez BriddickArgentinaBernardo Dominic QUALIFIED
Adams MorascaItalyElwin Sharvill UNQUALIFIED
Morrow RutaBrazilIoni Bowcher UNQUALIFIED
Francesco ShinkoCanadaIoni Bowcher NEGOTIATION
Aika InouyeBrazilIvan Magalhaes PROPOSAL
Alejandro PerinFranceStephen Shaw NEGOTIATION
Kaitlin OstroskyBrazilBernardo Dominic NEW
Smith GlickFranceIoni Bowcher RENEWAL
Alejandro PerinJapanIoni Bowcher UNQUALIFIED
Jennifer AmigonBrazilAsiya Javayant UNQUALIFIED
Murillo MaletArgentinaAnna Fali RENEWAL
Maria MarrierArgentinaBernardo Dominic RENEWAL
Adams MorascaFranceElwin Sharvill NEGOTIATION
Aika InouyeCanadaIoni Bowcher UNQUALIFIED
Octavia MaletJapanIoni Bowcher PROPOSAL
Chavez BriddickUnited KingdomStephen Shaw RENEWAL
Faith GillianJapanAnna Fali QUALIFIED
Isabel BowleyFranceAnna Fali PROPOSAL
Stacey MacleadGermanyIvan Magalhaes NEGOTIATION
Costa DilliardSpainAsiya Javayant PROPOSAL
Izzy GarufiSpainIoni Bowcher QUALIFIED
Nicolas IturbideArgentinaAsiya Javayant RENEWAL
Morrow RutaItalyStephen Shaw UNQUALIFIED
Chavez BriddickIndiaAsiya Javayant UNQUALIFIED
Claire TollnerIndiaAnna Fali QUALIFIED
David DarakjyJapanElwin Sharvill PROPOSAL
Aika InouyeIndiaOnyama Limba PROPOSAL
Leja CaldareraFranceAmy Elsner NEGOTIATION
Aditya KuskoIndiaStephen Shaw QUALIFIED
Ashley DoeUnited KingdomAmy Elsner QUALIFIED
Johnson SergiGermanyIvan Magalhaes QUALIFIED
Misaki RoysterArgentinaBernardo Dominic RENEWAL
Kadeem FlosiCanadaStephen Shaw NEW
Maria MarrierSpainBernardo Dominic QUALIFIED
Cody SaylorsJapanXuxue Feng NEW
Nicolas IturbideGermanyXuxue Feng PROPOSAL
Izzy GarufiIndiaAmy Elsner NEW
Juan WieserJapanStephen Shaw RENEWAL
David DarakjyRussiaBernardo Dominic NEW
Frozen Columns
Name
Alejandro Perin
Leja Caldarera
Jennifer Amigon
Cody Saylors
Rodrigues Campain
Tony Foller
Deepesh Chui
Greenwood Bolognia
Salvatore Stockham
Darci Poquette
Francesco Shinko
Izzy Garufi
Jones Vocelka
Darci Poquette
Jefferson Schemmer
Mayumi Kolmetz
Wickens Nestle
Jeanfrancois Venere
Munro Ferencz
Silvio Slusarski
Murillo Malet
Costa Dilliard
Emily Whobrey
Julie Stenseth
Ricardo Gaucho
Leja Caldarera
Sinclair Waycott
Nicolas Iturbide
James Butt
Izzy Garufi
Greenwood Bolognia
Maria Marrier
Maria Marrier
Isabel Bowley
Izzy Garufi
David Darakjy
Ashley Doe
Chavez Briddick
Stacey Maclead
Alejandro Perin
Clifford Rim
Rodrigues Campain
Ashley Doe
Murillo Malet
Kadeem Flosi
Morrow Ruta
Wickens Nestle
Leon Oldroyd
Kadeem Flosi
Ricardo Gaucho
IdCountryDate
1000Brazil2026-05-14
1001Canada2026-05-21
1002Russia2026-05-05
1003Brazil2026-05-05
1004India2026-05-27
1005France2026-05-29
1006Australia2026-05-21
1007Argentina2026-06-01
1008Japan2026-05-09
1009Italy2026-05-14
1010Australia2026-05-28
1011Spain2026-05-30
1012India2026-05-17
1013Australia2026-05-30
1014France2026-05-20
1015Brazil2026-05-08
1016Japan2026-06-01
1017Russia2026-05-29
1018United Kingdom2026-05-11
1019Russia2026-05-04
1020India2026-05-16
1021Argentina2026-05-19
1022Germany2026-05-21
1023United Kingdom2026-05-05
1024Japan2026-05-30
1025Canada2026-05-28
1026Italy2026-05-14
1027France2026-05-19
1028Spain2026-05-04
1029France2026-05-04
1030Italy2026-05-14
1031Russia2026-05-15
1032Russia2026-05-20
1033Germany2026-05-31
1034Canada2026-05-14
1035India2026-05-12
1036India2026-06-01
1037Brazil2026-05-06
1038France2026-05-23
1039Canada2026-05-19
1040Spain2026-05-31
1041Brazil2026-05-19
1042United Kingdom2026-05-20
1043India2026-05-11
1044Italy2026-05-18
1045Brazil2026-05-14
1046Argentina2026-05-04
1047Italy2026-05-17
1048Argentina2026-05-05
1049Russia2026-05-12

On-Demand Data

NameIdCountryDate
Ivar Paprocki1000Japan2026-05-17
James Butt1001Japan2026-05-12
Morrow Ruta1002United Kingdom2026-05-25
Maisha Rulapaugh1003Spain2026-05-26
Adams Morasca1004Germany2026-05-13
Kaitlin Ostrosky1005Brazil2026-05-11
Jeanfrancois Venere1006Japan2026-05-14
Jefferson Schemmer1007India2026-05-31
Munro Ferencz1008Russia2026-05-11
Rodrigues Campain1009Germany2026-05-22
Jones Vocelka1010Russia2026-05-03
Rodrigues Campain1011Argentina2026-05-19
Sinclair Waycott1012United Kingdom2026-05-22
Claire Tollner1013Japan2026-05-11
Aruna Figeroa1014Argentina2026-05-14
Adams Morasca1015Argentina2026-05-18
Costa Dilliard1016Spain2026-05-21
Mayumi Kolmetz1017Japan2026-05-08
David Darakjy1018Canada2026-05-22
Francesco Shinko1019Russia2026-05-26
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Clifford RimItalyXuxue Feng NEW
Jefferson SchemmerCanadaIvan Magalhaes PROPOSAL
Tony FollerArgentinaBernardo Dominic NEGOTIATION
Maria MarrierGermanyBernardo Dominic UNQUALIFIED
Murillo MaletItalyAmy Elsner NEGOTIATION
Sinclair WaycottItalyAnna Fali QUALIFIED
Emily WhobreyArgentinaBernardo Dominic QUALIFIED
Octavia MaletSpainOnyama Limba NEGOTIATION
Leja CaldareraRussiaElwin Sharvill QUALIFIED
Alejandro PerinBrazilIvan Magalhaes UNQUALIFIED
Munro FerenczIndiaBernardo Dominic NEW
Jones VocelkaGermanyBernardo Dominic UNQUALIFIED
Leon OldroydIndiaStephen Shaw QUALIFIED
Francesco ShinkoGermanyXuxue Feng NEGOTIATION
Smith GlickUnited KingdomOnyama Limba RENEWAL
Sinclair WaycottBrazilIvan Magalhaes NEGOTIATION
James ButtUnited KingdomOnyama Limba RENEWAL
Mayumi KolmetzGermanyOnyama Limba UNQUALIFIED
Cody SaylorsIndiaOnyama Limba PROPOSAL
Izzy GarufiArgentinaAmy Elsner QUALIFIED
Octavia MaletGermanyXuxue Feng PROPOSAL
Misaki RoysterCanadaElwin Sharvill NEGOTIATION
Sinclair WaycottItalyAsiya Javayant RENEWAL
Leon OldroydArgentinaBernardo Dominic NEGOTIATION
Ivar PaprockiIndiaAsiya Javayant RENEWAL
Ivar PaprockiArgentinaBernardo Dominic NEW
Darci PoquetteBrazilElwin Sharvill NEW
Chavez BriddickIndiaAsiya Javayant RENEWAL
Costa DilliardJapanXuxue Feng NEGOTIATION
Leja CaldareraIndiaElwin Sharvill NEGOTIATION
David DarakjyGermanyIvan Magalhaes PROPOSAL
Wickens NestleJapanAnna Fali NEGOTIATION
Wickens NestleCanadaAmy Elsner RENEWAL
Ashley DoeJapanStephen Shaw QUALIFIED
David DarakjyUnited KingdomStephen Shaw QUALIFIED
Tony FollerGermanyBernardo Dominic NEW
Aruna FigeroaSpainAmy Elsner NEGOTIATION
Kaitlin OstroskyAustraliaIvan Magalhaes UNQUALIFIED
Octavia MaletBrazilIoni Bowcher QUALIFIED
Francesco ShinkoItalyAmy Elsner 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>