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
Cody SaylorsBrazilAnna Fali PROPOSAL
Jennifer AmigonGermanyAsiya Javayant PROPOSAL
Francesco ShinkoAustraliaAsiya Javayant UNQUALIFIED
Emily WhobreySpainIvan Magalhaes QUALIFIED
Cody SaylorsGermanyXuxue Feng UNQUALIFIED
Ashley DoeFranceAnna Fali PROPOSAL
Wickens NestleGermanyXuxue Feng RENEWAL
Rodrigues CampainCanadaIoni Bowcher QUALIFIED
Murillo MaletItalyOnyama Limba PROPOSAL
Maisha RulapaughIndiaAmy Elsner RENEWAL
Ivar PaprockiIndiaAsiya Javayant RENEWAL
Antonio CaudyJapanStephen Shaw NEW
Jennifer AmigonBrazilElwin Sharvill QUALIFIED
Alejandro PerinItalyOnyama Limba UNQUALIFIED
Leja CaldareraBrazilOnyama Limba RENEWAL
Nicolas IturbideIndiaAsiya Javayant PROPOSAL
Maria MarrierIndiaAsiya Javayant QUALIFIED
Ivar PaprockiIndiaAsiya Javayant QUALIFIED
David DarakjyCanadaOnyama Limba QUALIFIED
Deepesh ChuiAustraliaIvan Magalhaes UNQUALIFIED
Costa DilliardFranceOnyama Limba QUALIFIED
Leja CaldareraItalyElwin Sharvill QUALIFIED
Antonio CaudyBrazilBernardo Dominic RENEWAL
Francesco ShinkoUnited KingdomAsiya Javayant NEW
Leon OldroydArgentinaStephen Shaw NEW
Darci PoquetteArgentinaAsiya Javayant NEGOTIATION
Greenwood BologniaAustraliaOnyama Limba NEW
Maisha RulapaughAustraliaXuxue Feng NEW
Greenwood BologniaItalyXuxue Feng NEGOTIATION
Misaki RoysterGermanyIoni Bowcher NEGOTIATION
Rodrigues CampainGermanyElwin Sharvill NEGOTIATION
Ashley DoeArgentinaStephen Shaw RENEWAL
Leon OldroydIndiaXuxue Feng PROPOSAL
Jennifer AmigonUnited KingdomIoni Bowcher NEGOTIATION
Silvio SlusarskiItalyIvan Magalhaes QUALIFIED
Silvio SlusarskiIndiaOnyama Limba QUALIFIED
Tony FollerArgentinaStephen Shaw PROPOSAL
Wickens NestleUnited KingdomXuxue Feng RENEWAL
Ashley DoeBrazilIvan Magalhaes PROPOSAL
Aruna FigeroaSpainXuxue Feng NEGOTIATION
Greenwood BologniaCanadaStephen Shaw UNQUALIFIED
Rodrigues CampainBrazilAsiya Javayant UNQUALIFIED
Munro FerenczArgentinaIvan Magalhaes QUALIFIED
Arvin AlbaresItalyAmy Elsner PROPOSAL
Alejandro PerinJapanIoni Bowcher PROPOSAL
Stacey MacleadCanadaElwin Sharvill NEW
Jones VocelkaAustraliaAsiya Javayant NEGOTIATION
Tony FollerFranceAmy Elsner NEW
Francesco ShinkoIndiaElwin Sharvill NEGOTIATION
Tony FollerSpainAnna Fali NEW
Horizontal
NameCountryRepresentativeStatus
Jennifer AmigonCanadaAsiya Javayant RENEWAL
Johnson SergiFranceAsiya Javayant NEW
Maria MarrierAustraliaAsiya Javayant NEW
David DarakjyIndiaBernardo Dominic NEGOTIATION
Kaitlin OstroskyAustraliaIvan Magalhaes PROPOSAL
Johnson SergiItalyXuxue Feng UNQUALIFIED
Salvatore StockhamJapanOnyama Limba RENEWAL
James ButtAustraliaIoni Bowcher NEGOTIATION
Leja CaldareraAustraliaAsiya Javayant UNQUALIFIED
Adams MorascaGermanyOnyama Limba NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Nicolas IturbideAustralia2026-04-14Printing Dimensions PROPOSAL3Elwin Sharvill
1001Greenwood BologniaFrance2026-03-29Benton, John B Jr UNQUALIFIED12Ioni Bowcher
1002Wickens NestleUnited Kingdom2026-03-28Dorl, James J Esq RENEWAL99Onyama Limba
1003Adams MorascaGermany2026-04-02Morlong Associates NEGOTIATION91Onyama Limba
1004Leon OldroydIndia2026-04-26Benton, John B Jr RENEWAL21Asiya Javayant
1005Morrow RutaArgentina2026-04-07Chanay, Jeffrey A Esq UNQUALIFIED42Onyama Limba
1006Alejandro PerinAustralia2026-03-28King, Christopher A Esq PROPOSAL17Ioni Bowcher
1007Maisha RulapaughJapan2026-04-14Rousseaux, Michael Esq QUALIFIED45Ivan Magalhaes
1008Francesco ShinkoSpain2026-04-15Rousseaux, Michael Esq PROPOSAL60Asiya Javayant
1009Juan WieserBrazil2026-04-14Commercial Press NEGOTIATION65Asiya Javayant
1010Johnson SergiIndia2026-04-10Chemel, James L Cpa PROPOSAL5Asiya Javayant
1011Costa DilliardBrazil2026-04-18Feiner Bros RENEWAL37Asiya Javayant
1012Claire TollnerArgentina2026-04-10Chapman, Ross E Esq UNQUALIFIED38Ivan Magalhaes
1013Kadeem FlosiFrance2026-04-10Printing Dimensions NEW51Onyama Limba
1014Maria MarrierArgentina2026-04-08Printing Dimensions QUALIFIED30Ioni Bowcher
1015Costa DilliardUnited Kingdom2026-04-09Rangoni Of Florence NEW86Xuxue Feng
1016Mayumi KolmetzItaly2026-04-09Dorl, James J Esq QUALIFIED73Ivan Magalhaes
1017Chavez BriddickIndia2026-04-10Commercial Press PROPOSAL20Amy Elsner
1018Maisha RulapaughIndia2026-04-16Chanay, Jeffrey A Esq UNQUALIFIED98Ivan Magalhaes
1019Jones VocelkaUnited Kingdom2026-04-24King, Christopher A Esq PROPOSAL37Anna Fali
1020Kaitlin OstroskySpain2026-04-01Feltz Printing Service RENEWAL30Ivan Magalhaes
1021Johnson SergiItaly2026-04-16Truhlar And Truhlar Attys QUALIFIED2Elwin Sharvill
1022Cody SaylorsAustralia2026-04-25Morlong Associates NEW59Xuxue Feng
1023Cody SaylorsSpain2026-04-23Truhlar And Truhlar Attys QUALIFIED90Asiya Javayant
1024Tony FollerFrance2026-04-26King, Christopher A Esq NEW59Anna Fali
1025Kadeem FlosiGermany2026-04-03Chemel, James L Cpa NEGOTIATION63Xuxue Feng
1026Costa DilliardIndia2026-04-18Feltz Printing Service RENEWAL14Amy Elsner
1027Clifford RimJapan2026-04-15Buckley Miller Wright RENEWAL61Bernardo Dominic
1028Salvatore StockhamArgentina2026-04-15Commercial Press RENEWAL28Amy Elsner
1029Mujtaba NickaIndia2026-04-09Benton, John B Jr PROPOSAL62Xuxue Feng
1030Cody SaylorsCanada2026-03-31Chapman, Ross E Esq NEGOTIATION59Stephen Shaw
1031Jones VocelkaUnited Kingdom2026-04-18Chapman, Ross E Esq QUALIFIED52Anna Fali
1032Adams MorascaIndia2026-04-07Buckley Miller Wright QUALIFIED66Onyama Limba
1033Wickens NestleJapan2026-04-19Buckley Miller Wright NEGOTIATION50Amy Elsner
1034Leja CaldareraAustralia2026-04-22Rangoni Of Florence NEW24Asiya Javayant
1035Mujtaba NickaItaly2026-04-10Printing Dimensions UNQUALIFIED12Ioni Bowcher
1036Greenwood BologniaArgentina2026-03-29Truhlar And Truhlar Attys RENEWAL81Ivan Magalhaes
1037Isabel BowleyCanada2026-04-20Rousseaux, Michael Esq UNQUALIFIED93Xuxue Feng
1038Kadeem FlosiCanada2026-03-31Chanay, Jeffrey A Esq NEW45Ioni Bowcher
1039Kaitlin OstroskyItaly2026-04-15Truhlar And Truhlar Attys NEW58Xuxue Feng
1040Ivar PaprockiIndia2026-04-02Chanay, Jeffrey A Esq RENEWAL55Amy Elsner
1041Kadeem FlosiRussia2026-04-07Buckley Miller Wright PROPOSAL73Onyama Limba
1042Adams MorascaJapan2026-04-07Printing Dimensions UNQUALIFIED67Elwin Sharvill
1043Misaki RoysterItaly2026-04-21Feltz Printing Service UNQUALIFIED18Xuxue Feng
1044Leon OldroydBrazil2026-04-22Morlong Associates PROPOSAL33Bernardo Dominic
1045Salvatore StockhamGermany2026-03-28Chapman, Ross E Esq NEW15Anna Fali
1046Leon OldroydItaly2026-04-09Rousseaux, Michael Esq QUALIFIED99Anna Fali
1047Isabel BowleyIndia2026-04-11Chanay, Jeffrey A Esq RENEWAL21Stephen Shaw
1048Jones VocelkaFrance2026-03-29Morlong Associates UNQUALIFIED54Amy Elsner
1049Smith GlickUnited Kingdom2026-03-29Chanay, Jeffrey A Esq RENEWAL77Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Aditya KuskoSpainBernardo Dominic PROPOSAL
Maria MarrierBrazilAmy Elsner QUALIFIED
Chavez BriddickSpainAsiya Javayant NEW
Aika InouyeUnited KingdomAmy Elsner NEW
Emily WhobreyUnited KingdomIoni Bowcher PROPOSAL
Octavia MaletGermanyStephen Shaw PROPOSAL
Morrow RutaRussiaIvan Magalhaes QUALIFIED
Smith GlickItalyIvan Magalhaes PROPOSAL
Aruna FigeroaGermanyIvan Magalhaes QUALIFIED
Stacey MacleadItalyAsiya Javayant RENEWAL
Aditya KuskoArgentinaIvan Magalhaes QUALIFIED
Misaki RoysterSpainStephen Shaw NEW
Alejandro PerinUnited KingdomAsiya Javayant RENEWAL
Murillo MaletBrazilAnna Fali RENEWAL
Kaitlin OstroskyArgentinaBernardo Dominic NEGOTIATION
Izzy GarufiIndiaIvan Magalhaes QUALIFIED
Octavia MaletRussiaAmy Elsner QUALIFIED
Misaki RoysterJapanOnyama Limba NEGOTIATION
Cody SaylorsItalyIoni Bowcher QUALIFIED
Emily WhobreyCanadaBernardo Dominic NEGOTIATION
Munro FerenczIndiaAnna Fali NEW
Salvatore StockhamRussiaOnyama Limba NEGOTIATION
Darci PoquetteIndiaAsiya Javayant PROPOSAL
Smith GlickAustraliaBernardo Dominic QUALIFIED
Octavia MaletGermanyXuxue Feng QUALIFIED
Stacey MacleadUnited KingdomAsiya Javayant QUALIFIED
Darci PoquetteBrazilBernardo Dominic NEGOTIATION
Francesco ShinkoAustraliaAsiya Javayant QUALIFIED
Emily WhobreyIndiaIvan Magalhaes PROPOSAL
Salvatore StockhamArgentinaBernardo Dominic QUALIFIED
Clifford RimJapanAmy Elsner PROPOSAL
Aruna FigeroaGermanyStephen Shaw UNQUALIFIED
Misaki RoysterRussiaXuxue Feng QUALIFIED
Ivar PaprockiJapanAmy Elsner NEW
Aika InouyeBrazilAnna Fali NEW
Juan WieserIndiaXuxue Feng UNQUALIFIED
Cody SaylorsSpainIvan Magalhaes UNQUALIFIED
Adams MorascaArgentinaOnyama Limba RENEWAL
Morrow RutaFranceStephen Shaw PROPOSAL
David DarakjyRussiaStephen Shaw RENEWAL
Emily WhobreyGermanyOnyama Limba QUALIFIED
Wickens NestleAustraliaIvan Magalhaes QUALIFIED
Kaitlin OstroskyUnited KingdomAmy Elsner PROPOSAL
Faith GillianAustraliaAnna Fali UNQUALIFIED
Salvatore StockhamIndiaIoni Bowcher PROPOSAL
Ivar PaprockiAustraliaAsiya Javayant NEW
Julie StensethArgentinaIoni Bowcher NEW
Stacey MacleadIndiaBernardo Dominic NEW
David DarakjyCanadaBernardo Dominic RENEWAL
Mujtaba NickaCanadaIvan Magalhaes PROPOSAL
Frozen Columns
Name
Deepesh Chui
Arvin Albares
Julie Stenseth
Morrow Ruta
Alejandro Perin
Kaitlin Ostrosky
Maria Marrier
Murillo Malet
Alejandro Perin
Francesco Shinko
Leja Caldarera
Aditya Kusko
Rodrigues Campain
Smith Glick
Ricardo Gaucho
Francesco Shinko
Francesco Shinko
Emily Whobrey
Greenwood Bolognia
Leon Oldroyd
Wickens Nestle
Francesco Shinko
David Darakjy
Chavez Briddick
Octavia Malet
Costa Dilliard
Juan Wieser
Kaitlin Ostrosky
Emily Whobrey
Ricardo Gaucho
Leja Caldarera
Stacey Maclead
Costa Dilliard
Aruna Figeroa
Leja Caldarera
Tony Foller
Kaitlin Ostrosky
Costa Dilliard
Claire Tollner
Mujtaba Nicka
Adams Morasca
Deepesh Chui
Wickens Nestle
Aika Inouye
Cody Saylors
Salvatore Stockham
Emily Whobrey
Chavez Briddick
Mayumi Kolmetz
Emily Whobrey
IdCountryDate
1000France2026-04-26
1001United Kingdom2026-04-02
1002Germany2026-04-09
1003Russia2026-04-15
1004Canada2026-04-22
1005Argentina2026-04-03
1006France2026-04-20
1007Canada2026-04-03
1008India2026-04-03
1009Spain2026-04-13
1010India2026-03-30
1011Brazil2026-03-30
1012Italy2026-03-28
1013Spain2026-04-11
1014India2026-04-14
1015Germany2026-04-26
1016Japan2026-04-01
1017Germany2026-03-30
1018Australia2026-04-06
1019France2026-04-05
1020Argentina2026-04-06
1021Argentina2026-04-26
1022Argentina2026-04-11
1023Russia2026-04-17
1024Italy2026-04-14
1025Japan2026-04-07
1026Australia2026-04-25
1027Russia2026-04-09
1028Germany2026-04-16
1029Argentina2026-04-01
1030Spain2026-04-24
1031Argentina2026-04-12
1032Australia2026-04-10
1033Japan2026-04-13
1034India2026-04-22
1035Japan2026-04-26
1036Canada2026-04-24
1037Argentina2026-04-16
1038Canada2026-03-29
1039Italy2026-04-15
1040Germany2026-04-25
1041Japan2026-04-17
1042Spain2026-04-07
1043Australia2026-04-16
1044India2026-04-15
1045Japan2026-04-20
1046Spain2026-04-06
1047Russia2026-04-22
1048France2026-04-23
1049Australia2026-04-18

On-Demand Data

NameIdCountryDate
Aika Inouye1000Japan2026-04-11
Emily Whobrey1001Germany2026-04-08
Chavez Briddick1002Germany2026-03-28
Kadeem Flosi1003Russia2026-04-03
Johnson Sergi1004Spain2026-04-15
David Darakjy1005Japan2026-04-17
Smith Glick1006Germany2026-03-30
Maria Marrier1007Spain2026-04-11
James Butt1008France2026-04-10
Kadeem Flosi1009Brazil2026-04-09
Deepesh Chui1010India2026-04-01
Alejandro Perin1011Russia2026-04-04
Isabel Bowley1012Spain2026-04-23
Maria Marrier1013United Kingdom2026-03-30
Misaki Royster1014Russia2026-04-11
Aditya Kusko1015Italy2026-04-07
Kaitlin Ostrosky1016Russia2026-04-22
Murillo Malet1017Argentina2026-04-20
Maria Marrier1018France2026-04-18
Misaki Royster1019India2026-04-07
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Kaitlin OstroskyAustraliaIoni Bowcher NEGOTIATION
Misaki RoysterRussiaBernardo Dominic QUALIFIED
Munro FerenczItalyBernardo Dominic NEGOTIATION
Chavez BriddickCanadaStephen Shaw NEGOTIATION
Faith GillianJapanIvan Magalhaes NEGOTIATION
Izzy GarufiFranceAmy Elsner QUALIFIED
Johnson SergiJapanIoni Bowcher PROPOSAL
Stacey MacleadBrazilAmy Elsner PROPOSAL
Jennifer AmigonGermanyXuxue Feng QUALIFIED
Stacey MacleadItalyAsiya Javayant NEGOTIATION
Mujtaba NickaSpainStephen Shaw NEGOTIATION
Claire TollnerIndiaOnyama Limba RENEWAL
Costa DilliardAustraliaIoni Bowcher NEGOTIATION
Deepesh ChuiJapanStephen Shaw QUALIFIED
Deepesh ChuiBrazilAsiya Javayant NEW
Isabel BowleyAustraliaAsiya Javayant NEGOTIATION
Izzy GarufiGermanyElwin Sharvill NEW
Sinclair WaycottAustraliaOnyama Limba UNQUALIFIED
Ashley DoeFranceBernardo Dominic NEW
Emily WhobreyJapanAsiya Javayant NEGOTIATION
Aditya KuskoIndiaAmy Elsner RENEWAL
Rodrigues CampainBrazilAsiya Javayant NEW
Clifford RimIndiaXuxue Feng NEGOTIATION
Greenwood BologniaAustraliaIvan Magalhaes PROPOSAL
Leon OldroydRussiaAsiya Javayant PROPOSAL
Alejandro PerinJapanOnyama Limba NEW
Mayumi KolmetzAustraliaStephen Shaw QUALIFIED
Murillo MaletJapanElwin Sharvill QUALIFIED
Smith GlickJapanAmy Elsner NEGOTIATION
Aruna FigeroaFranceAnna Fali UNQUALIFIED
Johnson SergiUnited KingdomIvan Magalhaes UNQUALIFIED
Rodrigues CampainRussiaXuxue Feng RENEWAL
Salvatore StockhamRussiaXuxue Feng RENEWAL
Jones VocelkaArgentinaElwin Sharvill RENEWAL
Maisha RulapaughUnited KingdomAsiya Javayant QUALIFIED
Cody SaylorsGermanyElwin Sharvill PROPOSAL
Rodrigues CampainSpainIvan Magalhaes QUALIFIED
Ashley DoeJapanElwin Sharvill NEW
Maisha RulapaughGermanyIoni Bowcher NEW
Misaki RoysterFranceXuxue Feng RENEWAL

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