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
Rodrigues CampainUnited KingdomIvan Magalhaes UNQUALIFIED
Silvio SlusarskiJapanOnyama Limba UNQUALIFIED
Clifford RimSpainIoni Bowcher UNQUALIFIED
Jefferson SchemmerFranceStephen Shaw QUALIFIED
Ivar PaprockiIndiaStephen Shaw PROPOSAL
Adams MorascaBrazilOnyama Limba UNQUALIFIED
Maisha RulapaughItalyStephen Shaw PROPOSAL
Jones VocelkaBrazilElwin Sharvill NEGOTIATION
Francesco ShinkoCanadaIvan Magalhaes UNQUALIFIED
Ashley DoeItalyAmy Elsner NEGOTIATION
Jones VocelkaFranceBernardo Dominic NEGOTIATION
Kaitlin OstroskyArgentinaXuxue Feng QUALIFIED
Leja CaldareraArgentinaOnyama Limba NEGOTIATION
Jones VocelkaBrazilOnyama Limba NEGOTIATION
Smith GlickFranceAmy Elsner NEGOTIATION
Mayumi KolmetzItalyAsiya Javayant UNQUALIFIED
Salvatore StockhamRussiaXuxue Feng QUALIFIED
Isabel BowleyItalyIoni Bowcher PROPOSAL
Jones VocelkaUnited KingdomAmy Elsner NEW
Rodrigues CampainRussiaAnna Fali QUALIFIED
Isabel BowleyBrazilAsiya Javayant RENEWAL
Kaitlin OstroskyIndiaAmy Elsner QUALIFIED
Leon OldroydIndiaElwin Sharvill NEW
Johnson SergiItalyOnyama Limba RENEWAL
Chavez BriddickJapanAnna Fali UNQUALIFIED
Mujtaba NickaJapanAsiya Javayant NEW
Juan WieserItalyOnyama Limba PROPOSAL
Greenwood BologniaFranceAmy Elsner RENEWAL
Francesco ShinkoJapanIvan Magalhaes RENEWAL
Kadeem FlosiJapanOnyama Limba PROPOSAL
Izzy GarufiGermanyAsiya Javayant NEW
David DarakjyRussiaAmy Elsner PROPOSAL
Isabel BowleyIndiaStephen Shaw NEGOTIATION
Leja CaldareraBrazilOnyama Limba NEW
Clifford RimIndiaIoni Bowcher QUALIFIED
Faith GillianItalyStephen Shaw NEGOTIATION
Mayumi KolmetzSpainStephen Shaw NEW
Leja CaldareraGermanyAsiya Javayant NEW
Antonio CaudyIndiaAsiya Javayant UNQUALIFIED
Salvatore StockhamAustraliaElwin Sharvill NEGOTIATION
Arvin AlbaresSpainStephen Shaw NEGOTIATION
Jones VocelkaCanadaAsiya Javayant RENEWAL
Johnson SergiFranceAnna Fali QUALIFIED
Antonio CaudyRussiaBernardo Dominic PROPOSAL
Ivar PaprockiAustraliaIoni Bowcher RENEWAL
Darci PoquetteJapanIvan Magalhaes QUALIFIED
Ashley DoeSpainAsiya Javayant NEW
Cody SaylorsCanadaStephen Shaw UNQUALIFIED
Greenwood BologniaUnited KingdomAsiya Javayant PROPOSAL
Smith GlickSpainElwin Sharvill NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Juan WieserIndiaIoni Bowcher NEW
Antonio CaudyItalyAsiya Javayant NEGOTIATION
Rodrigues CampainAustraliaStephen Shaw QUALIFIED
Stacey MacleadArgentinaAsiya Javayant RENEWAL
Octavia MaletRussiaStephen Shaw UNQUALIFIED
Antonio CaudyItalyIvan Magalhaes RENEWAL
Maisha RulapaughJapanAnna Fali RENEWAL
Juan WieserRussiaOnyama Limba NEGOTIATION
Aika InouyeBrazilAnna Fali QUALIFIED
Ivar PaprockiAustraliaIvan Magalhaes UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Leja CaldareraGermany2026-05-10Morlong Associates RENEWAL7Ivan Magalhaes
1001Mujtaba NickaIndia2026-05-13Rangoni Of Florence NEW97Ioni Bowcher
1002Adams MorascaArgentina2026-04-29Morlong Associates PROPOSAL43Asiya Javayant
1003Silvio SlusarskiItaly2026-05-14Buckley Miller Wright PROPOSAL54Amy Elsner
1004Isabel BowleyCanada2026-05-13Morlong Associates RENEWAL68Anna Fali
1005Leja CaldareraSpain2026-04-29Commercial Press NEW37Bernardo Dominic
1006Salvatore StockhamSpain2026-04-28Commercial Press UNQUALIFIED78Asiya Javayant
1007Wickens NestleCanada2026-04-29Chanay, Jeffrey A Esq NEGOTIATION35Xuxue Feng
1008Emily WhobreyIndia2026-05-05Feiner Bros RENEWAL67Bernardo Dominic
1009James ButtRussia2026-05-03Chemel, James L Cpa NEW90Stephen Shaw
1010Greenwood BologniaJapan2026-04-26Benton, John B Jr RENEWAL65Bernardo Dominic
1011Munro FerenczFrance2026-04-23Rangoni Of Florence NEW76Ivan Magalhaes
1012Aruna FigeroaBrazil2026-05-14Printing Dimensions RENEWAL30Xuxue Feng
1013Leon OldroydRussia2026-05-15King, Christopher A Esq PROPOSAL69Bernardo Dominic
1014Stacey MacleadSpain2026-04-22Chemel, James L Cpa UNQUALIFIED24Amy Elsner
1015Nicolas IturbideIndia2026-05-04Chapman, Ross E Esq UNQUALIFIED59Ioni Bowcher
1016Darci PoquetteCanada2026-04-19Dorl, James J Esq UNQUALIFIED51Ioni Bowcher
1017Emily WhobreyRussia2026-05-08Chapman, Ross E Esq PROPOSAL90Asiya Javayant
1018Greenwood BologniaJapan2026-04-22Chemel, James L Cpa NEW80Elwin Sharvill
1019Darci PoquetteCanada2026-04-29King, Christopher A Esq NEGOTIATION56Onyama Limba
1020Octavia MaletFrance2026-04-27Feiner Bros RENEWAL67Bernardo Dominic
1021Aruna FigeroaCanada2026-04-17Benton, John B Jr UNQUALIFIED3Ioni Bowcher
1022Octavia MaletIndia2026-04-26Rousseaux, Michael Esq RENEWAL24Anna Fali
1023Julie StensethItaly2026-04-19Feiner Bros PROPOSAL1Bernardo Dominic
1024Johnson SergiBrazil2026-05-15Rousseaux, Michael Esq RENEWAL61Stephen Shaw
1025Salvatore StockhamBrazil2026-04-20Feiner Bros QUALIFIED3Amy Elsner
1026Rodrigues CampainUnited Kingdom2026-04-20Rangoni Of Florence NEW4Stephen Shaw
1027Maisha RulapaughBrazil2026-04-24Rousseaux, Michael Esq RENEWAL17Ivan Magalhaes
1028Leja CaldareraBrazil2026-05-03Commercial Press PROPOSAL72Ivan Magalhaes
1029Stacey MacleadGermany2026-05-12Chanay, Jeffrey A Esq RENEWAL47Anna Fali
1030James ButtFrance2026-05-16Buckley Miller Wright UNQUALIFIED92Xuxue Feng
1031Arvin AlbaresGermany2026-05-11Chanay, Jeffrey A Esq UNQUALIFIED53Amy Elsner
1032Silvio SlusarskiSpain2026-05-02Benton, John B Jr NEW11Asiya Javayant
1033Clifford RimGermany2026-05-14Benton, John B Jr PROPOSAL27Elwin Sharvill
1034Julie StensethAustralia2026-04-17Morlong Associates UNQUALIFIED46Amy Elsner
1035Sinclair WaycottSpain2026-05-08Dorl, James J Esq RENEWAL17Asiya Javayant
1036Deepesh ChuiGermany2026-04-24Truhlar And Truhlar Attys PROPOSAL5Amy Elsner
1037Octavia MaletUnited Kingdom2026-05-02King, Christopher A Esq QUALIFIED46Stephen Shaw
1038Jefferson SchemmerIndia2026-04-25Buckley Miller Wright UNQUALIFIED15Amy Elsner
1039Ricardo GauchoBrazil2026-04-17King, Christopher A Esq NEW16Anna Fali
1040Aika InouyeBrazil2026-04-18Chapman, Ross E Esq NEW31Xuxue Feng
1041Aditya KuskoUnited Kingdom2026-04-23Rangoni Of Florence UNQUALIFIED91Asiya Javayant
1042Munro FerenczJapan2026-05-12Feltz Printing Service NEGOTIATION58Asiya Javayant
1043Octavia MaletFrance2026-05-05Chemel, James L Cpa NEGOTIATION57Ioni Bowcher
1044Octavia MaletFrance2026-04-22Benton, John B Jr RENEWAL95Ivan Magalhaes
1045Ashley DoeGermany2026-04-23Feltz Printing Service UNQUALIFIED38Asiya Javayant
1046Aditya KuskoIndia2026-04-18Chanay, Jeffrey A Esq NEW75Anna Fali
1047Clifford RimBrazil2026-04-30Dorl, James J Esq RENEWAL69Ioni Bowcher
1048Smith GlickArgentina2026-05-02Buckley Miller Wright PROPOSAL12Elwin Sharvill
1049Tony FollerUnited Kingdom2026-04-28Dorl, James J Esq RENEWAL91Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Aruna FigeroaArgentinaElwin Sharvill PROPOSAL
Francesco ShinkoFranceStephen Shaw RENEWAL
Leja CaldareraRussiaXuxue Feng PROPOSAL
Kaitlin OstroskySpainIvan Magalhaes QUALIFIED
Munro FerenczIndiaOnyama Limba QUALIFIED
Greenwood BologniaGermanyStephen Shaw QUALIFIED
James ButtJapanIvan Magalhaes NEW
Deepesh ChuiJapanXuxue Feng NEGOTIATION
Jefferson SchemmerFranceXuxue Feng NEW
Morrow RutaIndiaStephen Shaw NEGOTIATION
Julie StensethIndiaOnyama Limba QUALIFIED
Chavez BriddickIndiaOnyama Limba UNQUALIFIED
Mayumi KolmetzIndiaIoni Bowcher NEW
Alejandro PerinAustraliaBernardo Dominic NEGOTIATION
Aditya KuskoUnited KingdomIvan Magalhaes RENEWAL
Kaitlin OstroskyJapanBernardo Dominic NEGOTIATION
James ButtItalyStephen Shaw NEGOTIATION
Isabel BowleyCanadaStephen Shaw QUALIFIED
Leon OldroydGermanyXuxue Feng RENEWAL
Ashley DoeRussiaIoni Bowcher UNQUALIFIED
Smith GlickUnited KingdomIvan Magalhaes QUALIFIED
Alejandro PerinArgentinaAsiya Javayant QUALIFIED
Kaitlin OstroskyItalyIvan Magalhaes PROPOSAL
David DarakjyIndiaBernardo Dominic UNQUALIFIED
Silvio SlusarskiArgentinaIvan Magalhaes PROPOSAL
Sinclair WaycottIndiaAnna Fali NEW
Clifford RimJapanStephen Shaw QUALIFIED
Maria MarrierGermanyIoni Bowcher NEGOTIATION
Maisha RulapaughAustraliaXuxue Feng NEGOTIATION
Octavia MaletGermanyStephen Shaw RENEWAL
Leja CaldareraItalyAmy Elsner QUALIFIED
Jones VocelkaArgentinaAsiya Javayant UNQUALIFIED
Alejandro PerinSpainAsiya Javayant QUALIFIED
Jefferson SchemmerJapanStephen Shaw NEW
Salvatore StockhamJapanBernardo Dominic NEGOTIATION
Greenwood BologniaUnited KingdomElwin Sharvill PROPOSAL
Claire TollnerAustraliaAmy Elsner QUALIFIED
Leon OldroydCanadaIvan Magalhaes PROPOSAL
Costa DilliardGermanyStephen Shaw NEW
Silvio SlusarskiUnited KingdomAnna Fali NEGOTIATION
David DarakjyJapanStephen Shaw UNQUALIFIED
Leon OldroydAustraliaElwin Sharvill PROPOSAL
Salvatore StockhamRussiaBernardo Dominic QUALIFIED
Chavez BriddickAustraliaOnyama Limba UNQUALIFIED
Stacey MacleadArgentinaAmy Elsner NEGOTIATION
Murillo MaletAustraliaBernardo Dominic NEW
Adams MorascaUnited KingdomAnna Fali NEGOTIATION
Adams MorascaUnited KingdomElwin Sharvill UNQUALIFIED
Claire TollnerArgentinaXuxue Feng PROPOSAL
Kaitlin OstroskyArgentinaXuxue Feng NEW
Frozen Columns
Name
Johnson Sergi
Emily Whobrey
Emily Whobrey
Antonio Caudy
Claire Tollner
Julie Stenseth
Emily Whobrey
Maisha Rulapaugh
Aika Inouye
Izzy Garufi
Tony Foller
Mujtaba Nicka
Octavia Malet
Jennifer Amigon
Octavia Malet
Ashley Doe
Jeanfrancois Venere
Jennifer Amigon
Cody Saylors
Aika Inouye
Darci Poquette
Darci Poquette
Jennifer Amigon
Isabel Bowley
Jefferson Schemmer
David Darakjy
Mayumi Kolmetz
Jennifer Amigon
Rodrigues Campain
Sinclair Waycott
Sinclair Waycott
Julie Stenseth
Morrow Ruta
Leja Caldarera
Faith Gillian
Aika Inouye
Jeanfrancois Venere
Jennifer Amigon
Francesco Shinko
Rodrigues Campain
Ricardo Gaucho
Ivar Paprocki
Ashley Doe
Octavia Malet
Alejandro Perin
Cody Saylors
Morrow Ruta
Tony Foller
Morrow Ruta
Julie Stenseth
IdCountryDate
1000Spain2026-04-20
1001India2026-04-23
1002Germany2026-05-12
1003Italy2026-05-09
1004Italy2026-04-20
1005Australia2026-04-21
1006Germany2026-05-07
1007Germany2026-05-01
1008Argentina2026-05-04
1009Brazil2026-05-12
1010Germany2026-05-13
1011Italy2026-05-07
1012France2026-05-02
1013Russia2026-05-07
1014Spain2026-05-11
1015United Kingdom2026-04-23
1016Argentina2026-04-17
1017France2026-05-15
1018Spain2026-04-19
1019United Kingdom2026-05-01
1020India2026-05-15
1021Australia2026-04-23
1022Canada2026-05-14
1023Australia2026-05-15
1024United Kingdom2026-04-30
1025Spain2026-05-04
1026India2026-05-12
1027Brazil2026-05-02
1028Brazil2026-04-18
1029Spain2026-04-18
1030Germany2026-05-11
1031Canada2026-05-08
1032Germany2026-04-23
1033Russia2026-05-13
1034Australia2026-05-10
1035France2026-05-08
1036United Kingdom2026-05-02
1037Canada2026-04-29
1038Germany2026-05-02
1039France2026-05-05
1040Germany2026-05-08
1041France2026-04-25
1042Canada2026-04-24
1043Japan2026-04-29
1044Canada2026-04-26
1045France2026-05-05
1046Australia2026-04-24
1047Russia2026-05-09
1048Brazil2026-04-21
1049United Kingdom2026-05-05

On-Demand Data

NameIdCountryDate
Francesco Shinko1000Australia2026-04-18
Aditya Kusko1001Australia2026-05-12
Deepesh Chui1002Russia2026-04-17
Isabel Bowley1003Japan2026-05-10
James Butt1004Canada2026-05-12
Aditya Kusko1005Australia2026-05-06
Isabel Bowley1006Japan2026-04-30
Maria Marrier1007Japan2026-05-14
Kaitlin Ostrosky1008Italy2026-05-10
Juan Wieser1009Japan2026-04-23
Isabel Bowley1010Italy2026-04-26
Smith Glick1011Argentina2026-04-20
Leja Caldarera1012Canada2026-04-21
Greenwood Bolognia1013Germany2026-05-06
Wickens Nestle1014France2026-04-24
Julie Stenseth1015Germany2026-04-26
Greenwood Bolognia1016Canada2026-05-01
Julie Stenseth1017Australia2026-05-10
Isabel Bowley1018Australia2026-05-10
Munro Ferencz1019Germany2026-04-19
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Munro FerenczJapanXuxue Feng RENEWAL
Francesco ShinkoAustraliaIvan Magalhaes NEGOTIATION
Mujtaba NickaGermanyAsiya Javayant QUALIFIED
Julie StensethRussiaBernardo Dominic NEW
Izzy GarufiJapanIvan Magalhaes QUALIFIED
Sinclair WaycottAustraliaBernardo Dominic QUALIFIED
Maria MarrierCanadaAsiya Javayant NEW
Stacey MacleadIndiaBernardo Dominic NEW
Greenwood BologniaFranceIoni Bowcher UNQUALIFIED
Rodrigues CampainGermanyIoni Bowcher UNQUALIFIED
Francesco ShinkoCanadaOnyama Limba RENEWAL
Aika InouyeSpainAsiya Javayant NEW
Faith GillianAustraliaAmy Elsner QUALIFIED
Ivar PaprockiItalyElwin Sharvill PROPOSAL
Wickens NestleItalyAsiya Javayant PROPOSAL
Maisha RulapaughFranceAmy Elsner UNQUALIFIED
Jefferson SchemmerFranceIoni Bowcher RENEWAL
Cody SaylorsFranceIoni Bowcher UNQUALIFIED
Mujtaba NickaArgentinaAnna Fali NEGOTIATION
Jefferson SchemmerUnited KingdomBernardo Dominic RENEWAL
Rodrigues CampainJapanBernardo Dominic NEW
Jones VocelkaUnited KingdomBernardo Dominic NEGOTIATION
Deepesh ChuiSpainElwin Sharvill NEGOTIATION
Arvin AlbaresArgentinaAnna Fali NEW
Tony FollerCanadaIoni Bowcher UNQUALIFIED
Octavia MaletFranceAmy Elsner UNQUALIFIED
David DarakjyIndiaIoni Bowcher NEW
Arvin AlbaresFranceXuxue Feng PROPOSAL
Adams MorascaSpainOnyama Limba PROPOSAL
Ivar PaprockiCanadaAsiya Javayant UNQUALIFIED
Kadeem FlosiBrazilElwin Sharvill NEGOTIATION
Sinclair WaycottUnited KingdomXuxue Feng UNQUALIFIED
Rodrigues CampainSpainAsiya Javayant NEW
Nicolas IturbideIndiaStephen Shaw NEW
Murillo MaletAustraliaAmy Elsner RENEWAL
Alejandro PerinIndiaAmy Elsner QUALIFIED
David DarakjyItalyElwin Sharvill NEGOTIATION
Stacey MacleadBrazilIoni Bowcher UNQUALIFIED
Aika InouyeGermanyAnna Fali RENEWAL
James ButtAustraliaXuxue Feng UNQUALIFIED

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