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
Aditya KuskoJapanIvan Magalhaes UNQUALIFIED
Maisha RulapaughSpainAnna Fali RENEWAL
Jones VocelkaItalyAsiya Javayant RENEWAL
Julie StensethCanadaAnna Fali RENEWAL
Silvio SlusarskiRussiaIoni Bowcher NEGOTIATION
Aruna FigeroaJapanBernardo Dominic NEW
Ricardo GauchoSpainAnna Fali NEW
Sinclair WaycottGermanyAsiya Javayant NEW
Sinclair WaycottJapanElwin Sharvill NEGOTIATION
Deepesh ChuiAustraliaIoni Bowcher RENEWAL
Clifford RimJapanXuxue Feng PROPOSAL
Stacey MacleadAustraliaAsiya Javayant UNQUALIFIED
Emily WhobreyItalyIoni Bowcher NEGOTIATION
Alejandro PerinGermanyIvan Magalhaes UNQUALIFIED
Kadeem FlosiSpainBernardo Dominic QUALIFIED
Murillo MaletArgentinaIvan Magalhaes NEGOTIATION
Murillo MaletFranceAsiya Javayant NEGOTIATION
Munro FerenczAustraliaXuxue Feng NEGOTIATION
Emily WhobreyBrazilIvan Magalhaes NEGOTIATION
Murillo MaletIndiaBernardo Dominic QUALIFIED
Morrow RutaIndiaAmy Elsner NEGOTIATION
Johnson SergiJapanAmy Elsner UNQUALIFIED
Leon OldroydAustraliaAnna Fali NEW
Jefferson SchemmerUnited KingdomElwin Sharvill UNQUALIFIED
Aruna FigeroaSpainOnyama Limba QUALIFIED
Mayumi KolmetzJapanAmy Elsner UNQUALIFIED
Jennifer AmigonBrazilXuxue Feng NEGOTIATION
Greenwood BologniaArgentinaOnyama Limba UNQUALIFIED
Misaki RoysterFranceElwin Sharvill NEW
Jennifer AmigonJapanStephen Shaw UNQUALIFIED
Smith GlickGermanyElwin Sharvill NEW
Clifford RimJapanOnyama Limba UNQUALIFIED
Smith GlickItalyElwin Sharvill NEGOTIATION
Stacey MacleadArgentinaElwin Sharvill NEW
Aditya KuskoBrazilElwin Sharvill RENEWAL
Deepesh ChuiBrazilStephen Shaw QUALIFIED
Francesco ShinkoUnited KingdomOnyama Limba UNQUALIFIED
Wickens NestleArgentinaIvan Magalhaes NEW
Jones VocelkaCanadaIvan Magalhaes QUALIFIED
Aruna FigeroaSpainXuxue Feng PROPOSAL
Aditya KuskoJapanIoni Bowcher UNQUALIFIED
Mujtaba NickaFranceAsiya Javayant QUALIFIED
Munro FerenczAustraliaXuxue Feng NEGOTIATION
Maria MarrierJapanAmy Elsner QUALIFIED
Claire TollnerBrazilOnyama Limba RENEWAL
Mayumi KolmetzGermanyElwin Sharvill QUALIFIED
Deepesh ChuiIndiaAsiya Javayant NEW
Munro FerenczArgentinaIoni Bowcher PROPOSAL
Ashley DoeRussiaStephen Shaw NEGOTIATION
Aruna FigeroaItalyIvan Magalhaes UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Isabel BowleyRussiaBernardo Dominic NEGOTIATION
Alejandro PerinJapanIvan Magalhaes PROPOSAL
Wickens NestleJapanXuxue Feng UNQUALIFIED
Faith GillianJapanAsiya Javayant UNQUALIFIED
Jefferson SchemmerArgentinaAsiya Javayant PROPOSAL
Stacey MacleadUnited KingdomXuxue Feng NEW
Tony FollerCanadaStephen Shaw PROPOSAL
Tony FollerIndiaAsiya Javayant NEGOTIATION
Ivar PaprockiCanadaXuxue Feng RENEWAL
Mayumi KolmetzJapanXuxue Feng NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Jefferson SchemmerAustralia2026-05-24Feiner Bros NEW43Ioni Bowcher
1001Mujtaba NickaRussia2026-05-16Truhlar And Truhlar Attys RENEWAL4Ivan Magalhaes
1002Faith GillianGermany2026-05-12Rousseaux, Michael Esq QUALIFIED72Elwin Sharvill
1003Maria MarrierItaly2026-06-07Printing Dimensions PROPOSAL97Ioni Bowcher
1004Sinclair WaycottJapan2026-05-19Printing Dimensions PROPOSAL22Stephen Shaw
1005Chavez BriddickSpain2026-05-09Buckley Miller Wright PROPOSAL0Ivan Magalhaes
1006Greenwood BologniaCanada2026-05-09Feiner Bros UNQUALIFIED36Elwin Sharvill
1007Jeanfrancois VenereIndia2026-05-24Printing Dimensions RENEWAL24Amy Elsner
1008Silvio SlusarskiUnited Kingdom2026-05-27Feiner Bros UNQUALIFIED40Elwin Sharvill
1009Morrow RutaJapan2026-05-09Rousseaux, Michael Esq NEW7Xuxue Feng
1010Arvin AlbaresItaly2026-05-19Chemel, James L Cpa UNQUALIFIED12Onyama Limba
1011Isabel BowleyGermany2026-05-15Benton, John B Jr NEGOTIATION98Bernardo Dominic
1012Sinclair WaycottGermany2026-05-31Printing Dimensions NEGOTIATION18Onyama Limba
1013Munro FerenczItaly2026-05-10Rangoni Of Florence PROPOSAL9Xuxue Feng
1014Murillo MaletArgentina2026-05-30Morlong Associates PROPOSAL68Elwin Sharvill
1015Faith GillianFrance2026-06-04Feltz Printing Service RENEWAL76Amy Elsner
1016Leon OldroydItaly2026-05-29Morlong Associates RENEWAL80Onyama Limba
1017Emily WhobreyJapan2026-05-24King, Christopher A Esq QUALIFIED66Amy Elsner
1018Kaitlin OstroskyUnited Kingdom2026-05-28Feiner Bros QUALIFIED85Ivan Magalhaes
1019Stacey MacleadItaly2026-05-19Dorl, James J Esq NEGOTIATION8Elwin Sharvill
1020David DarakjyFrance2026-06-05Feiner Bros NEW74Asiya Javayant
1021Jeanfrancois VenereGermany2026-06-01Feltz Printing Service UNQUALIFIED27Ivan Magalhaes
1022Adams MorascaRussia2026-05-17Printing Dimensions UNQUALIFIED53Xuxue Feng
1023Stacey MacleadItaly2026-05-23Dorl, James J Esq QUALIFIED42Elwin Sharvill
1024Alejandro PerinItaly2026-05-13Feiner Bros RENEWAL43Ioni Bowcher
1025Izzy GarufiRussia2026-05-30Chapman, Ross E Esq PROPOSAL41Anna Fali
1026Mujtaba NickaAustralia2026-05-21Chanay, Jeffrey A Esq PROPOSAL33Ioni Bowcher
1027Munro FerenczItaly2026-05-28Buckley Miller Wright QUALIFIED70Asiya Javayant
1028Jeanfrancois VenereGermany2026-05-26Commercial Press UNQUALIFIED26Bernardo Dominic
1029David DarakjyFrance2026-06-02Rousseaux, Michael Esq UNQUALIFIED11Anna Fali
1030Chavez BriddickAustralia2026-05-17Benton, John B Jr UNQUALIFIED13Stephen Shaw
1031Kaitlin OstroskyAustralia2026-05-20Rousseaux, Michael Esq NEW79Amy Elsner
1032Juan WieserAustralia2026-05-19Feiner Bros NEW54Ivan Magalhaes
1033Murillo MaletSpain2026-05-10Feiner Bros QUALIFIED88Ioni Bowcher
1034Johnson SergiItaly2026-05-24Morlong Associates PROPOSAL95Ioni Bowcher
1035Ashley DoeItaly2026-06-01Printing Dimensions PROPOSAL94Elwin Sharvill
1036Deepesh ChuiArgentina2026-05-21Benton, John B Jr NEW71Ioni Bowcher
1037Jennifer AmigonRussia2026-05-20Chanay, Jeffrey A Esq NEW97Amy Elsner
1038Cody SaylorsCanada2026-06-03King, Christopher A Esq RENEWAL34Elwin Sharvill
1039Ashley DoeBrazil2026-05-27Buckley Miller Wright PROPOSAL14Stephen Shaw
1040Faith GillianGermany2026-05-15Printing Dimensions PROPOSAL88Elwin Sharvill
1041Claire TollnerSpain2026-05-31Chapman, Ross E Esq QUALIFIED16Anna Fali
1042James ButtGermany2026-06-03Buckley Miller Wright NEGOTIATION48Bernardo Dominic
1043Tony FollerJapan2026-06-07Feiner Bros RENEWAL10Anna Fali
1044James ButtArgentina2026-06-04Morlong Associates NEGOTIATION33Amy Elsner
1045Aruna FigeroaFrance2026-05-11Printing Dimensions NEGOTIATION48Ivan Magalhaes
1046Munro FerenczIndia2026-05-11King, Christopher A Esq NEGOTIATION55Ivan Magalhaes
1047Alejandro PerinJapan2026-05-14Morlong Associates UNQUALIFIED52Bernardo Dominic
1048Ricardo GauchoJapan2026-06-01Truhlar And Truhlar Attys NEW97Ioni Bowcher
1049Silvio SlusarskiIndia2026-06-06Feltz Printing Service NEGOTIATION66Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Aika InouyeUnited KingdomAmy Elsner NEGOTIATION
Francesco ShinkoJapanAnna Fali NEGOTIATION
Smith GlickFranceStephen Shaw NEGOTIATION
Clifford RimArgentinaBernardo Dominic UNQUALIFIED
Ricardo GauchoCanadaBernardo Dominic NEGOTIATION
Rodrigues CampainGermanyOnyama Limba NEGOTIATION
Ivar PaprockiIndiaXuxue Feng PROPOSAL
Greenwood BologniaJapanXuxue Feng RENEWAL
Aditya KuskoCanadaStephen Shaw QUALIFIED
Leon OldroydUnited KingdomOnyama Limba UNQUALIFIED
Aika InouyeAustraliaXuxue Feng UNQUALIFIED
Munro FerenczRussiaAmy Elsner PROPOSAL
Aruna FigeroaJapanIvan Magalhaes PROPOSAL
Arvin AlbaresItalyOnyama Limba PROPOSAL
Francesco ShinkoItalyStephen Shaw NEW
Murillo MaletGermanyBernardo Dominic QUALIFIED
Julie StensethCanadaXuxue Feng NEGOTIATION
Chavez BriddickAustraliaIvan Magalhaes NEW
Mayumi KolmetzIndiaXuxue Feng PROPOSAL
Chavez BriddickUnited KingdomElwin Sharvill UNQUALIFIED
Murillo MaletJapanXuxue Feng UNQUALIFIED
Claire TollnerCanadaAsiya Javayant NEW
Adams MorascaUnited KingdomXuxue Feng RENEWAL
Maisha RulapaughFranceAmy Elsner QUALIFIED
Adams MorascaGermanyAnna Fali PROPOSAL
Deepesh ChuiRussiaIvan Magalhaes NEW
Isabel BowleyArgentinaAmy Elsner NEW
Jefferson SchemmerGermanyStephen Shaw RENEWAL
Alejandro PerinJapanIoni Bowcher PROPOSAL
Greenwood BologniaItalyAnna Fali UNQUALIFIED
Emily WhobreyItalyBernardo Dominic NEGOTIATION
Morrow RutaCanadaStephen Shaw QUALIFIED
Jefferson SchemmerGermanyOnyama Limba NEW
Johnson SergiBrazilIoni Bowcher NEGOTIATION
Jennifer AmigonRussiaStephen Shaw UNQUALIFIED
Ricardo GauchoJapanXuxue Feng NEW
Jones VocelkaRussiaAmy Elsner QUALIFIED
Sinclair WaycottUnited KingdomOnyama Limba PROPOSAL
Maria MarrierFranceIvan Magalhaes QUALIFIED
Octavia MaletFranceElwin Sharvill PROPOSAL
Ivar PaprockiAustraliaIoni Bowcher NEW
Tony FollerItalyElwin Sharvill UNQUALIFIED
Kaitlin OstroskyJapanIvan Magalhaes UNQUALIFIED
Jones VocelkaSpainStephen Shaw UNQUALIFIED
Kadeem FlosiFranceElwin Sharvill QUALIFIED
Stacey MacleadGermanyStephen Shaw UNQUALIFIED
Morrow RutaGermanyElwin Sharvill QUALIFIED
Ivar PaprockiFranceIvan Magalhaes NEGOTIATION
Jones VocelkaBrazilIvan Magalhaes PROPOSAL
Faith GillianGermanyAsiya Javayant NEGOTIATION
Frozen Columns
Name
Izzy Garufi
Jennifer Amigon
Julie Stenseth
Jeanfrancois Venere
Antonio Caudy
Deepesh Chui
Murillo Malet
Mayumi Kolmetz
Mayumi Kolmetz
Johnson Sergi
Emily Whobrey
Antonio Caudy
Faith Gillian
Wickens Nestle
Julie Stenseth
Smith Glick
Chavez Briddick
Munro Ferencz
Aika Inouye
Stacey Maclead
Deepesh Chui
Antonio Caudy
Leon Oldroyd
Greenwood Bolognia
Antonio Caudy
Jones Vocelka
Leja Caldarera
Tony Foller
Deepesh Chui
Arvin Albares
Ricardo Gaucho
Octavia Malet
Juan Wieser
Jennifer Amigon
Maria Marrier
Jones Vocelka
Arvin Albares
Costa Dilliard
Francesco Shinko
Murillo Malet
Faith Gillian
Isabel Bowley
Tony Foller
Darci Poquette
Isabel Bowley
Ashley Doe
Leja Caldarera
Clifford Rim
Silvio Slusarski
Juan Wieser
IdCountryDate
1000Germany2026-05-16
1001United Kingdom2026-06-01
1002Germany2026-06-07
1003India2026-05-25
1004Italy2026-05-12
1005Japan2026-05-11
1006Australia2026-05-20
1007Italy2026-05-23
1008United Kingdom2026-05-11
1009Australia2026-05-19
1010France2026-05-24
1011Italy2026-05-25
1012Canada2026-05-25
1013Australia2026-06-03
1014India2026-05-17
1015Spain2026-05-21
1016Japan2026-05-29
1017India2026-06-04
1018Australia2026-05-23
1019Japan2026-05-18
1020India2026-05-26
1021Russia2026-05-14
1022Italy2026-05-18
1023United Kingdom2026-05-17
1024Germany2026-05-16
1025Italy2026-05-22
1026Canada2026-05-16
1027Argentina2026-05-31
1028Argentina2026-05-15
1029Argentina2026-06-07
1030Spain2026-06-03
1031Germany2026-05-23
1032Japan2026-05-16
1033France2026-05-12
1034Russia2026-05-21
1035Japan2026-06-06
1036Canada2026-05-31
1037Germany2026-05-14
1038Canada2026-05-21
1039Germany2026-05-27
1040Australia2026-05-29
1041Spain2026-05-25
1042Australia2026-05-21
1043Australia2026-06-06
1044Italy2026-05-31
1045United Kingdom2026-05-26
1046Germany2026-05-29
1047Canada2026-06-07
1048Argentina2026-05-16
1049Italy2026-05-09

On-Demand Data

NameIdCountryDate
Kaitlin Ostrosky1000Germany2026-06-01
Cody Saylors1001Brazil2026-05-25
Izzy Garufi1002Australia2026-05-27
Rodrigues Campain1003United Kingdom2026-06-01
Isabel Bowley1004Spain2026-05-29
Mujtaba Nicka1005Argentina2026-05-28
Antonio Caudy1006Russia2026-05-18
Greenwood Bolognia1007Italy2026-05-19
Aruna Figeroa1008Brazil2026-06-01
Juan Wieser1009Spain2026-06-03
Misaki Royster1010United Kingdom2026-05-12
Francesco Shinko1011Brazil2026-06-07
Darci Poquette1012Canada2026-06-07
Maria Marrier1013Germany2026-05-23
James Butt1014India2026-05-27
Mayumi Kolmetz1015Germany2026-06-01
Julie Stenseth1016France2026-05-21
Clifford Rim1017Australia2026-05-25
Leon Oldroyd1018Italy2026-05-10
Faith Gillian1019Italy2026-06-01
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Mayumi KolmetzJapanStephen Shaw NEW
Mujtaba NickaBrazilIoni Bowcher NEW
Faith GillianCanadaIvan Magalhaes NEGOTIATION
Ashley DoeItalyOnyama Limba PROPOSAL
Leja CaldareraItalyElwin Sharvill PROPOSAL
Nicolas IturbideUnited KingdomElwin Sharvill NEW
Kaitlin OstroskyGermanyIvan Magalhaes RENEWAL
Isabel BowleyFranceOnyama Limba NEGOTIATION
Ivar PaprockiUnited KingdomBernardo Dominic UNQUALIFIED
Deepesh ChuiSpainAmy Elsner RENEWAL
Ashley DoeRussiaOnyama Limba NEW
Cody SaylorsItalyAnna Fali RENEWAL
Claire TollnerBrazilBernardo Dominic QUALIFIED
Silvio SlusarskiAustraliaIvan Magalhaes RENEWAL
Isabel BowleyCanadaOnyama Limba NEW
Stacey MacleadIndiaElwin Sharvill NEGOTIATION
Jones VocelkaAustraliaAsiya Javayant RENEWAL
Maisha RulapaughSpainElwin Sharvill NEGOTIATION
Leon OldroydRussiaAnna Fali RENEWAL
Maria MarrierIndiaIvan Magalhaes NEGOTIATION
Nicolas IturbideAustraliaOnyama Limba PROPOSAL
Johnson SergiFranceAmy Elsner NEGOTIATION
Jefferson SchemmerSpainIoni Bowcher PROPOSAL
Darci PoquetteArgentinaBernardo Dominic RENEWAL
Maria MarrierSpainIvan Magalhaes QUALIFIED
Juan WieserAustraliaAnna Fali NEGOTIATION
Ivar PaprockiGermanyIoni Bowcher UNQUALIFIED
Chavez BriddickUnited KingdomElwin Sharvill RENEWAL
David DarakjyUnited KingdomBernardo Dominic QUALIFIED
Johnson SergiGermanyXuxue Feng NEW
Antonio CaudySpainAsiya Javayant NEGOTIATION
Aruna FigeroaFranceStephen Shaw RENEWAL
Greenwood BologniaSpainBernardo Dominic RENEWAL
Julie StensethSpainAsiya Javayant RENEWAL
Mayumi KolmetzJapanElwin Sharvill NEGOTIATION
Jones VocelkaRussiaBernardo Dominic QUALIFIED
Darci PoquetteAustraliaOnyama Limba RENEWAL
Murillo MaletUnited KingdomAmy Elsner QUALIFIED
Claire TollnerRussiaAsiya Javayant RENEWAL
Chavez BriddickIndiaOnyama Limba 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>