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
Tony FollerArgentinaBernardo Dominic NEGOTIATION
Maisha RulapaughIndiaOnyama Limba PROPOSAL
Morrow RutaAustraliaIvan Magalhaes RENEWAL
Clifford RimItalyAmy Elsner NEW
Silvio SlusarskiAustraliaElwin Sharvill NEW
Darci PoquetteItalyBernardo Dominic QUALIFIED
Ricardo GauchoBrazilIoni Bowcher UNQUALIFIED
Claire TollnerBrazilXuxue Feng RENEWAL
Smith GlickIndiaXuxue Feng UNQUALIFIED
Francesco ShinkoAustraliaIoni Bowcher PROPOSAL
Claire TollnerBrazilAsiya Javayant NEGOTIATION
Deepesh ChuiIndiaElwin Sharvill RENEWAL
Aditya KuskoJapanOnyama Limba UNQUALIFIED
Johnson SergiSpainOnyama Limba NEGOTIATION
Ashley DoeItalyIvan Magalhaes PROPOSAL
Jeanfrancois VenereFranceIoni Bowcher RENEWAL
Octavia MaletAustraliaStephen Shaw UNQUALIFIED
Chavez BriddickIndiaOnyama Limba UNQUALIFIED
Tony FollerSpainIoni Bowcher NEW
Aika InouyeAustraliaAsiya Javayant RENEWAL
Deepesh ChuiIndiaIvan Magalhaes NEW
James ButtRussiaElwin Sharvill UNQUALIFIED
Jones VocelkaBrazilAmy Elsner QUALIFIED
Ashley DoeItalyAmy Elsner NEW
Wickens NestleFranceIvan Magalhaes UNQUALIFIED
Nicolas IturbideAustraliaIvan Magalhaes NEW
Ashley DoeRussiaStephen Shaw NEGOTIATION
Octavia MaletCanadaXuxue Feng PROPOSAL
Clifford RimCanadaAmy Elsner NEGOTIATION
Misaki RoysterIndiaElwin Sharvill NEGOTIATION
Ivar PaprockiArgentinaStephen Shaw PROPOSAL
Johnson SergiItalyAsiya Javayant RENEWAL
Ricardo GauchoJapanElwin Sharvill QUALIFIED
Jeanfrancois VenereUnited KingdomBernardo Dominic RENEWAL
Arvin AlbaresRussiaStephen Shaw PROPOSAL
James ButtGermanyAsiya Javayant QUALIFIED
Leja CaldareraItalyElwin Sharvill NEGOTIATION
Kaitlin OstroskyIndiaStephen Shaw NEW
Silvio SlusarskiJapanAnna Fali NEGOTIATION
Aditya KuskoIndiaAnna Fali QUALIFIED
Izzy GarufiGermanyXuxue Feng QUALIFIED
Ricardo GauchoIndiaAmy Elsner UNQUALIFIED
Wickens NestleGermanyStephen Shaw UNQUALIFIED
Darci PoquetteUnited KingdomBernardo Dominic PROPOSAL
Adams MorascaFranceOnyama Limba NEGOTIATION
James ButtUnited KingdomElwin Sharvill QUALIFIED
Aika InouyeUnited KingdomAnna Fali RENEWAL
Aika InouyeBrazilStephen Shaw RENEWAL
Ivar PaprockiGermanyBernardo Dominic NEGOTIATION
Silvio SlusarskiItalyXuxue Feng NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Munro FerenczGermanyAnna Fali NEW
Jeanfrancois VenereItalyOnyama Limba NEW
Maisha RulapaughGermanyAsiya Javayant UNQUALIFIED
Faith GillianSpainAnna Fali RENEWAL
Murillo MaletAustraliaAmy Elsner NEW
James ButtGermanyAnna Fali UNQUALIFIED
Mayumi KolmetzUnited KingdomIvan Magalhaes NEGOTIATION
Aruna FigeroaCanadaAnna Fali NEW
Salvatore StockhamArgentinaXuxue Feng UNQUALIFIED
Aditya KuskoIndiaOnyama Limba PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Salvatore StockhamSpain2026-05-28Truhlar And Truhlar Attys UNQUALIFIED2Ivan Magalhaes
1001Jones VocelkaBrazil2026-05-29Buckley Miller Wright QUALIFIED16Ivan Magalhaes
1002Octavia MaletSpain2026-06-01Rousseaux, Michael Esq RENEWAL19Elwin Sharvill
1003James ButtUnited Kingdom2026-06-01Benton, John B Jr RENEWAL84Elwin Sharvill
1004Jeanfrancois VenereBrazil2026-05-10King, Christopher A Esq NEGOTIATION44Ioni Bowcher
1005Julie StensethIndia2026-05-13Chanay, Jeffrey A Esq NEW16Xuxue Feng
1006Darci PoquetteJapan2026-05-18Chapman, Ross E Esq RENEWAL5Asiya Javayant
1007Kadeem FlosiBrazil2026-05-24Commercial Press RENEWAL86Bernardo Dominic
1008Salvatore StockhamSpain2026-05-31Chemel, James L Cpa NEGOTIATION87Ioni Bowcher
1009Aruna FigeroaCanada2026-05-27Chapman, Ross E Esq NEW29Amy Elsner
1010Tony FollerUnited Kingdom2026-05-20Chapman, Ross E Esq NEW37Ioni Bowcher
1011Stacey MacleadBrazil2026-05-24Printing Dimensions RENEWAL50Elwin Sharvill
1012Jennifer AmigonIndia2026-05-29Dorl, James J Esq UNQUALIFIED32Stephen Shaw
1013Clifford RimAustralia2026-05-11Feltz Printing Service NEW86Anna Fali
1014Adams MorascaIndia2026-06-03Commercial Press NEGOTIATION35Asiya Javayant
1015Jones VocelkaAustralia2026-05-05Feltz Printing Service PROPOSAL73Bernardo Dominic
1016James ButtItaly2026-05-06Truhlar And Truhlar Attys QUALIFIED82Asiya Javayant
1017Sinclair WaycottBrazil2026-05-07Chapman, Ross E Esq RENEWAL86Ioni Bowcher
1018Mayumi KolmetzItaly2026-05-11Benton, John B Jr NEGOTIATION10Amy Elsner
1019Mayumi KolmetzGermany2026-05-19Feiner Bros UNQUALIFIED93Bernardo Dominic
1020Mayumi KolmetzIndia2026-05-29Dorl, James J Esq QUALIFIED11Ivan Magalhaes
1021Greenwood BologniaAustralia2026-05-20Buckley Miller Wright NEW55Anna Fali
1022Misaki RoysterSpain2026-06-01Chapman, Ross E Esq RENEWAL20Ioni Bowcher
1023Cody SaylorsArgentina2026-05-25Dorl, James J Esq PROPOSAL20Anna Fali
1024Costa DilliardArgentina2026-05-24Printing Dimensions UNQUALIFIED3Onyama Limba
1025Stacey MacleadUnited Kingdom2026-05-15Morlong Associates QUALIFIED23Bernardo Dominic
1026Alejandro PerinJapan2026-05-07Printing Dimensions NEW29Amy Elsner
1027Arvin AlbaresUnited Kingdom2026-05-27Morlong Associates PROPOSAL57Onyama Limba
1028Tony FollerIndia2026-05-18Printing Dimensions NEW1Anna Fali
1029Faith GillianBrazil2026-05-29Dorl, James J Esq RENEWAL86Onyama Limba
1030Misaki RoysterUnited Kingdom2026-05-14Chemel, James L Cpa NEW12Asiya Javayant
1031Silvio SlusarskiBrazil2026-05-31Feiner Bros RENEWAL39Asiya Javayant
1032Jones VocelkaFrance2026-05-08King, Christopher A Esq NEW1Elwin Sharvill
1033Deepesh ChuiSpain2026-05-06Chemel, James L Cpa RENEWAL22Bernardo Dominic
1034Misaki RoysterJapan2026-05-09Benton, John B Jr RENEWAL61Ioni Bowcher
1035Mayumi KolmetzUnited Kingdom2026-05-20Feltz Printing Service NEW11Elwin Sharvill
1036Murillo MaletIndia2026-05-14Dorl, James J Esq NEW11Bernardo Dominic
1037Ivar PaprockiAustralia2026-05-19Chanay, Jeffrey A Esq QUALIFIED55Stephen Shaw
1038Izzy GarufiRussia2026-06-01King, Christopher A Esq RENEWAL87Elwin Sharvill
1039Silvio SlusarskiItaly2026-05-19Commercial Press RENEWAL73Asiya Javayant
1040Chavez BriddickAustralia2026-05-20Benton, John B Jr RENEWAL87Asiya Javayant
1041Sinclair WaycottSpain2026-06-03Rousseaux, Michael Esq RENEWAL7Amy Elsner
1042Silvio SlusarskiCanada2026-05-11King, Christopher A Esq RENEWAL33Ivan Magalhaes
1043Deepesh ChuiArgentina2026-06-03Rangoni Of Florence NEGOTIATION90Stephen Shaw
1044Faith GillianAustralia2026-05-17Morlong Associates PROPOSAL20Stephen Shaw
1045Aruna FigeroaGermany2026-05-31Commercial Press NEW74Amy Elsner
1046Juan WieserSpain2026-05-15Morlong Associates UNQUALIFIED24Bernardo Dominic
1047Jeanfrancois VenereAustralia2026-05-22Chemel, James L Cpa PROPOSAL61Anna Fali
1048Cody SaylorsArgentina2026-05-07King, Christopher A Esq NEW6Asiya Javayant
1049Maria MarrierBrazil2026-06-02Chanay, Jeffrey A Esq NEW64Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Wickens NestleCanadaAmy Elsner RENEWAL
Darci PoquetteUnited KingdomAmy Elsner QUALIFIED
Aika InouyeRussiaBernardo Dominic RENEWAL
Maria MarrierCanadaXuxue Feng NEGOTIATION
Mujtaba NickaSpainIvan Magalhaes RENEWAL
Antonio CaudyCanadaAmy Elsner PROPOSAL
Wickens NestleIndiaElwin Sharvill PROPOSAL
Julie StensethAustraliaStephen Shaw NEW
Kadeem FlosiItalyAsiya Javayant QUALIFIED
Aruna FigeroaItalyStephen Shaw UNQUALIFIED
Aika InouyeSpainAsiya Javayant RENEWAL
Maria MarrierBrazilBernardo Dominic NEW
Greenwood BologniaRussiaOnyama Limba PROPOSAL
Izzy GarufiCanadaAnna Fali RENEWAL
Adams MorascaArgentinaAmy Elsner UNQUALIFIED
Jones VocelkaBrazilAnna Fali UNQUALIFIED
Aruna FigeroaBrazilStephen Shaw PROPOSAL
Octavia MaletIndiaAmy Elsner UNQUALIFIED
Munro FerenczItalyAnna Fali NEW
Adams MorascaArgentinaIoni Bowcher NEW
Silvio SlusarskiArgentinaIvan Magalhaes RENEWAL
Johnson SergiUnited KingdomAsiya Javayant UNQUALIFIED
Adams MorascaIndiaStephen Shaw PROPOSAL
James ButtArgentinaStephen Shaw RENEWAL
Emily WhobreyIndiaAnna Fali PROPOSAL
Ricardo GauchoUnited KingdomOnyama Limba QUALIFIED
Jefferson SchemmerFranceBernardo Dominic PROPOSAL
Aika InouyeSpainIvan Magalhaes QUALIFIED
Wickens NestleUnited KingdomStephen Shaw NEW
Kaitlin OstroskyBrazilXuxue Feng NEW
Juan WieserJapanXuxue Feng NEGOTIATION
Clifford RimArgentinaOnyama Limba NEW
Rodrigues CampainSpainBernardo Dominic UNQUALIFIED
Aika InouyeCanadaIoni Bowcher NEGOTIATION
Morrow RutaFranceAsiya Javayant NEGOTIATION
Salvatore StockhamFranceAnna Fali RENEWAL
Antonio CaudySpainAnna Fali QUALIFIED
Ashley DoeFranceXuxue Feng QUALIFIED
Jefferson SchemmerUnited KingdomAsiya Javayant PROPOSAL
Ashley DoeJapanBernardo Dominic UNQUALIFIED
Adams MorascaSpainAsiya Javayant RENEWAL
Izzy GarufiFranceIoni Bowcher UNQUALIFIED
Leja CaldareraUnited KingdomIoni Bowcher RENEWAL
Faith GillianRussiaBernardo Dominic UNQUALIFIED
Ashley DoeFranceStephen Shaw NEW
Octavia MaletIndiaStephen Shaw NEW
Nicolas IturbideAustraliaIoni Bowcher UNQUALIFIED
Julie StensethUnited KingdomAmy Elsner NEGOTIATION
Antonio CaudyUnited KingdomAsiya Javayant PROPOSAL
Sinclair WaycottArgentinaElwin Sharvill UNQUALIFIED
Frozen Columns
Name
Silvio Slusarski
Aditya Kusko
David Darakjy
Emily Whobrey
Clifford Rim
Francesco Shinko
Rodrigues Campain
Jeanfrancois Venere
Jefferson Schemmer
Smith Glick
Leon Oldroyd
Jones Vocelka
Jennifer Amigon
Arvin Albares
Cody Saylors
Johnson Sergi
Misaki Royster
Mujtaba Nicka
Maisha Rulapaugh
Claire Tollner
Darci Poquette
David Darakjy
Arvin Albares
Aika Inouye
Emily Whobrey
Claire Tollner
Clifford Rim
Kaitlin Ostrosky
Mayumi Kolmetz
Mujtaba Nicka
Sinclair Waycott
Cody Saylors
Nicolas Iturbide
Smith Glick
Antonio Caudy
Misaki Royster
Alejandro Perin
Tony Foller
Jones Vocelka
Emily Whobrey
Sinclair Waycott
Misaki Royster
Smith Glick
Salvatore Stockham
Jefferson Schemmer
Tony Foller
Ashley Doe
Mayumi Kolmetz
Darci Poquette
Silvio Slusarski
IdCountryDate
1000Canada2026-06-02
1001Canada2026-05-20
1002Japan2026-05-31
1003India2026-05-20
1004Argentina2026-05-20
1005Japan2026-05-06
1006Australia2026-05-15
1007Australia2026-05-22
1008Canada2026-05-31
1009India2026-05-19
1010Argentina2026-05-17
1011Australia2026-06-01
1012Italy2026-05-29
1013Spain2026-05-21
1014India2026-05-27
1015Russia2026-05-30
1016Russia2026-05-21
1017Japan2026-05-23
1018Brazil2026-06-02
1019India2026-06-02
1020Brazil2026-05-22
1021Brazil2026-05-30
1022Japan2026-05-08
1023France2026-05-27
1024Japan2026-05-17
1025Italy2026-05-25
1026Australia2026-05-26
1027France2026-05-15
1028Italy2026-05-05
1029India2026-05-15
1030Canada2026-05-09
1031Japan2026-06-02
1032Canada2026-05-17
1033Italy2026-05-13
1034Spain2026-05-26
1035India2026-05-22
1036Brazil2026-05-16
1037Spain2026-06-01
1038Germany2026-05-22
1039Australia2026-05-12
1040Canada2026-06-02
1041United Kingdom2026-05-11
1042Australia2026-05-29
1043India2026-05-30
1044Russia2026-05-05
1045India2026-05-31
1046United Kingdom2026-05-19
1047Italy2026-05-09
1048Japan2026-05-09
1049Japan2026-06-01

On-Demand Data

NameIdCountryDate
Rodrigues Campain1000India2026-06-02
Morrow Ruta1001Japan2026-05-27
Isabel Bowley1002Italy2026-05-26
Salvatore Stockham1003Australia2026-05-14
Jeanfrancois Venere1004United Kingdom2026-05-25
Silvio Slusarski1005India2026-05-09
Aruna Figeroa1006Australia2026-05-15
Octavia Malet1007Brazil2026-05-10
Cody Saylors1008Germany2026-06-03
Morrow Ruta1009India2026-05-07
Salvatore Stockham1010Australia2026-05-21
Clifford Rim1011Brazil2026-05-14
Ashley Doe1012Russia2026-05-27
Aika Inouye1013United Kingdom2026-05-09
Aditya Kusko1014United Kingdom2026-05-09
Nicolas Iturbide1015Italy2026-05-05
Adams Morasca1016Germany2026-05-14
Ricardo Gaucho1017United Kingdom2026-05-31
Munro Ferencz1018Canada2026-05-25
Deepesh Chui1019Australia2026-05-05
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Emily WhobreyItalyBernardo Dominic UNQUALIFIED
Kaitlin OstroskyGermanyAmy Elsner NEGOTIATION
Salvatore StockhamSpainAsiya Javayant PROPOSAL
Ashley DoeAustraliaBernardo Dominic UNQUALIFIED
Aditya KuskoCanadaAnna Fali UNQUALIFIED
Kaitlin OstroskyJapanAmy Elsner RENEWAL
Nicolas IturbideItalyBernardo Dominic QUALIFIED
Kadeem FlosiUnited KingdomAsiya Javayant UNQUALIFIED
Munro FerenczRussiaAmy Elsner RENEWAL
Aditya KuskoJapanIvan Magalhaes NEW
Jefferson SchemmerArgentinaAsiya Javayant QUALIFIED
Claire TollnerSpainAmy Elsner PROPOSAL
Jeanfrancois VenereRussiaBernardo Dominic QUALIFIED
Aika InouyeAustraliaElwin Sharvill PROPOSAL
Aditya KuskoJapanIoni Bowcher NEGOTIATION
Ashley DoeCanadaIoni Bowcher PROPOSAL
Francesco ShinkoUnited KingdomIoni Bowcher RENEWAL
Darci PoquetteJapanIvan Magalhaes NEGOTIATION
Faith GillianAustraliaIvan Magalhaes NEGOTIATION
Claire TollnerIndiaBernardo Dominic QUALIFIED
Silvio SlusarskiUnited KingdomAnna Fali NEW
Ivar PaprockiIndiaStephen Shaw UNQUALIFIED
Aruna FigeroaIndiaBernardo Dominic RENEWAL
Julie StensethAustraliaBernardo Dominic NEGOTIATION
Emily WhobreyUnited KingdomAsiya Javayant PROPOSAL
James ButtAustraliaIvan Magalhaes NEW
Stacey MacleadCanadaElwin Sharvill RENEWAL
Silvio SlusarskiUnited KingdomElwin Sharvill RENEWAL
Aditya KuskoRussiaIvan Magalhaes PROPOSAL
James ButtJapanOnyama Limba NEW
Julie StensethCanadaAsiya Javayant NEW
Tony FollerRussiaAsiya Javayant QUALIFIED
Jones VocelkaFranceBernardo Dominic RENEWAL
Ashley DoeArgentinaBernardo Dominic PROPOSAL
Rodrigues CampainBrazilAnna Fali QUALIFIED
Ivar PaprockiGermanyXuxue Feng QUALIFIED
Juan WieserCanadaIoni Bowcher RENEWAL
Greenwood BologniaArgentinaAnna Fali NEW
Maria MarrierCanadaOnyama Limba PROPOSAL
Clifford RimCanadaAmy 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>