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
Izzy GarufiSpainAnna Fali PROPOSAL
Arvin AlbaresCanadaStephen Shaw QUALIFIED
Adams MorascaGermanyOnyama Limba NEGOTIATION
Clifford RimJapanOnyama Limba PROPOSAL
Julie StensethAustraliaIoni Bowcher QUALIFIED
Antonio CaudyRussiaOnyama Limba UNQUALIFIED
Wickens NestleArgentinaElwin Sharvill NEW
Jeanfrancois VenereGermanyOnyama Limba QUALIFIED
Ricardo GauchoFranceXuxue Feng PROPOSAL
Adams MorascaArgentinaAnna Fali UNQUALIFIED
Mujtaba NickaGermanyAnna Fali RENEWAL
James ButtArgentinaIoni Bowcher NEGOTIATION
David DarakjyAustraliaIvan Magalhaes UNQUALIFIED
Claire TollnerBrazilBernardo Dominic UNQUALIFIED
Julie StensethJapanAnna Fali NEGOTIATION
Arvin AlbaresAustraliaStephen Shaw UNQUALIFIED
Claire TollnerJapanIvan Magalhaes NEW
Jefferson SchemmerJapanOnyama Limba NEGOTIATION
Antonio CaudyGermanyAsiya Javayant NEW
Tony FollerSpainAmy Elsner QUALIFIED
Deepesh ChuiAustraliaBernardo Dominic PROPOSAL
Ashley DoeUnited KingdomAsiya Javayant RENEWAL
Aruna FigeroaArgentinaAmy Elsner PROPOSAL
Aruna FigeroaArgentinaIoni Bowcher NEGOTIATION
Francesco ShinkoBrazilStephen Shaw RENEWAL
Emily WhobreyAustraliaOnyama Limba NEW
Deepesh ChuiSpainBernardo Dominic PROPOSAL
Clifford RimArgentinaAmy Elsner PROPOSAL
Misaki RoysterCanadaAsiya Javayant PROPOSAL
Mujtaba NickaAustraliaAmy Elsner UNQUALIFIED
Deepesh ChuiCanadaAmy Elsner QUALIFIED
Izzy GarufiGermanyAsiya Javayant NEW
Mujtaba NickaAustraliaElwin Sharvill UNQUALIFIED
Francesco ShinkoRussiaAnna Fali RENEWAL
Francesco ShinkoBrazilStephen Shaw NEGOTIATION
Faith GillianBrazilAnna Fali NEGOTIATION
Adams MorascaArgentinaAsiya Javayant NEGOTIATION
Isabel BowleyArgentinaAsiya Javayant NEW
Jones VocelkaBrazilAnna Fali RENEWAL
Wickens NestleRussiaIoni Bowcher NEW
Jones VocelkaCanadaXuxue Feng RENEWAL
Rodrigues CampainArgentinaBernardo Dominic NEW
David DarakjyIndiaAsiya Javayant NEW
Izzy GarufiArgentinaAnna Fali NEW
Costa DilliardJapanAnna Fali RENEWAL
Costa DilliardFranceXuxue Feng QUALIFIED
Rodrigues CampainUnited KingdomAnna Fali NEW
Jennifer AmigonItalyXuxue Feng PROPOSAL
Kadeem FlosiItalyIoni Bowcher NEGOTIATION
Emily WhobreyItalyStephen Shaw NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Leon OldroydItalyAsiya Javayant PROPOSAL
Ivar PaprockiArgentinaElwin Sharvill NEGOTIATION
Juan WieserUnited KingdomIvan Magalhaes NEGOTIATION
Ashley DoeIndiaAmy Elsner NEGOTIATION
Greenwood BologniaRussiaAnna Fali NEW
Wickens NestleItalyOnyama Limba NEW
Clifford RimArgentinaElwin Sharvill PROPOSAL
Jennifer AmigonCanadaXuxue Feng PROPOSAL
David DarakjyGermanyOnyama Limba NEGOTIATION
Clifford RimFranceXuxue Feng NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Silvio SlusarskiJapan2025-09-03Truhlar And Truhlar Attys NEW69Asiya Javayant
1001Clifford RimCanada2025-09-27Printing Dimensions PROPOSAL87Ioni Bowcher
1002Munro FerenczGermany2025-09-24Rousseaux, Michael Esq UNQUALIFIED99Anna Fali
1003Mujtaba NickaCanada2025-09-02Printing Dimensions NEGOTIATION97Asiya Javayant
1004Ashley DoeItaly2025-09-11Dorl, James J Esq NEGOTIATION1Bernardo Dominic
1005Deepesh ChuiRussia2025-09-22Rangoni Of Florence NEW55Onyama Limba
1006Stacey MacleadArgentina2025-09-20King, Christopher A Esq NEGOTIATION73Elwin Sharvill
1007Silvio SlusarskiSpain2025-09-18Dorl, James J Esq NEGOTIATION3Bernardo Dominic
1008Izzy GarufiItaly2025-09-03Commercial Press UNQUALIFIED26Stephen Shaw
1009Alejandro PerinUnited Kingdom2025-09-29Buckley Miller Wright PROPOSAL52Asiya Javayant
1010Murillo MaletGermany2025-09-13Buckley Miller Wright PROPOSAL0Amy Elsner
1011Clifford RimRussia2025-09-12Dorl, James J Esq NEW34Amy Elsner
1012Morrow RutaAustralia2025-09-16Commercial Press UNQUALIFIED2Ivan Magalhaes
1013Munro FerenczArgentina2025-09-10Rangoni Of Florence PROPOSAL57Amy Elsner
1014Sinclair WaycottCanada2025-09-03Chapman, Ross E Esq UNQUALIFIED22Amy Elsner
1015Ricardo GauchoFrance2025-09-09Feiner Bros RENEWAL55Asiya Javayant
1016Alejandro PerinIndia2025-09-24Chemel, James L Cpa PROPOSAL12Asiya Javayant
1017Adams MorascaArgentina2025-09-09Truhlar And Truhlar Attys RENEWAL44Ioni Bowcher
1018Deepesh ChuiArgentina2025-09-17Rousseaux, Michael Esq UNQUALIFIED64Ioni Bowcher
1019Faith GillianAustralia2025-09-26Truhlar And Truhlar Attys PROPOSAL52Xuxue Feng
1020Isabel BowleyIndia2025-09-23Feiner Bros NEGOTIATION89Amy Elsner
1021Mujtaba NickaAustralia2025-09-06King, Christopher A Esq NEW39Amy Elsner
1022James ButtRussia2025-09-05King, Christopher A Esq NEGOTIATION51Elwin Sharvill
1023Izzy GarufiUnited Kingdom2025-09-23Commercial Press NEGOTIATION54Ivan Magalhaes
1024Greenwood BologniaAustralia2025-09-14Truhlar And Truhlar Attys PROPOSAL89Bernardo Dominic
1025Tony FollerGermany2025-09-22Feltz Printing Service NEW89Anna Fali
1026Rodrigues CampainRussia2025-09-15Buckley Miller Wright NEGOTIATION49Ivan Magalhaes
1027Smith GlickGermany2025-09-28Commercial Press UNQUALIFIED31Anna Fali
1028Antonio CaudyGermany2025-09-19Buckley Miller Wright UNQUALIFIED63Asiya Javayant
1029Mujtaba NickaGermany2025-09-12Truhlar And Truhlar Attys NEGOTIATION64Anna Fali
1030Smith GlickAustralia2025-09-13Chanay, Jeffrey A Esq QUALIFIED43Ivan Magalhaes
1031Kadeem FlosiBrazil2025-09-15Morlong Associates UNQUALIFIED61Anna Fali
1032Ivar PaprockiRussia2025-09-20Benton, John B Jr NEW97Xuxue Feng
1033Silvio SlusarskiUnited Kingdom2025-09-20Rangoni Of Florence RENEWAL86Ioni Bowcher
1034Jeanfrancois VenereCanada2025-09-16Benton, John B Jr UNQUALIFIED55Anna Fali
1035Jennifer AmigonGermany2025-09-24Benton, John B Jr PROPOSAL99Stephen Shaw
1036Nicolas IturbideSpain2025-09-12Commercial Press RENEWAL12Elwin Sharvill
1037Tony FollerJapan2025-09-28Printing Dimensions NEW13Asiya Javayant
1038Octavia MaletJapan2025-09-04Chanay, Jeffrey A Esq UNQUALIFIED61Anna Fali
1039Isabel BowleyFrance2025-09-22Buckley Miller Wright NEW70Asiya Javayant
1040Misaki RoysterItaly2025-09-13Feltz Printing Service RENEWAL56Elwin Sharvill
1041Alejandro PerinBrazil2025-09-17Rangoni Of Florence NEW96Anna Fali
1042Jones VocelkaFrance2025-09-04Chapman, Ross E Esq RENEWAL64Amy Elsner
1043Jeanfrancois VenereBrazil2025-09-13Chanay, Jeffrey A Esq NEGOTIATION68Amy Elsner
1044Jeanfrancois VenereIndia2025-09-20Chemel, James L Cpa UNQUALIFIED7Stephen Shaw
1045Izzy GarufiIndia2025-09-05Morlong Associates RENEWAL49Xuxue Feng
1046Clifford RimGermany2025-09-12Feltz Printing Service UNQUALIFIED87Ioni Bowcher
1047Aruna FigeroaArgentina2025-09-19Chanay, Jeffrey A Esq PROPOSAL93Onyama Limba
1048Aika InouyeGermany2025-09-29Chemel, James L Cpa QUALIFIED54Asiya Javayant
1049Kadeem FlosiSpain2025-09-27Morlong Associates QUALIFIED3Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Kadeem FlosiJapanAnna Fali QUALIFIED
Smith GlickGermanyIvan Magalhaes NEW
Izzy GarufiUnited KingdomAnna Fali QUALIFIED
Antonio CaudyFranceAmy Elsner NEW
Julie StensethBrazilOnyama Limba NEGOTIATION
Aditya KuskoBrazilAmy Elsner PROPOSAL
Johnson SergiUnited KingdomElwin Sharvill PROPOSAL
Kaitlin OstroskyGermanyElwin Sharvill UNQUALIFIED
Murillo MaletCanadaOnyama Limba QUALIFIED
Greenwood BologniaUnited KingdomStephen Shaw QUALIFIED
Greenwood BologniaCanadaAnna Fali UNQUALIFIED
Isabel BowleyIndiaIoni Bowcher RENEWAL
Octavia MaletRussiaAnna Fali PROPOSAL
Maisha RulapaughArgentinaIoni Bowcher QUALIFIED
Isabel BowleyGermanyIoni Bowcher RENEWAL
Jennifer AmigonAustraliaAsiya Javayant NEW
Cody SaylorsAustraliaXuxue Feng QUALIFIED
Aditya KuskoItalyAmy Elsner RENEWAL
Tony FollerIndiaElwin Sharvill NEW
Silvio SlusarskiUnited KingdomAsiya Javayant PROPOSAL
Smith GlickGermanyStephen Shaw QUALIFIED
Rodrigues CampainFranceAmy Elsner NEW
Kadeem FlosiUnited KingdomXuxue Feng UNQUALIFIED
Maria MarrierAustraliaElwin Sharvill PROPOSAL
Greenwood BologniaItalyIoni Bowcher NEW
Arvin AlbaresFranceStephen Shaw NEW
Jeanfrancois VenereRussiaOnyama Limba RENEWAL
David DarakjySpainAmy Elsner UNQUALIFIED
Francesco ShinkoFranceAnna Fali RENEWAL
David DarakjyGermanyIoni Bowcher RENEWAL
Wickens NestleAustraliaAnna Fali NEGOTIATION
Ashley DoeUnited KingdomOnyama Limba PROPOSAL
Adams MorascaUnited KingdomXuxue Feng NEGOTIATION
Rodrigues CampainUnited KingdomIvan Magalhaes UNQUALIFIED
Misaki RoysterBrazilElwin Sharvill NEGOTIATION
Mujtaba NickaSpainIvan Magalhaes NEW
Misaki RoysterItalyElwin Sharvill NEGOTIATION
Alejandro PerinBrazilAsiya Javayant RENEWAL
Aditya KuskoGermanyIoni Bowcher QUALIFIED
Octavia MaletAustraliaAmy Elsner NEW
Murillo MaletAustraliaBernardo Dominic PROPOSAL
Aruna FigeroaBrazilBernardo Dominic NEW
Ashley DoeAustraliaIvan Magalhaes NEW
Deepesh ChuiFranceAmy Elsner PROPOSAL
Misaki RoysterRussiaIvan Magalhaes UNQUALIFIED
Smith GlickIndiaOnyama Limba QUALIFIED
Claire TollnerSpainIoni Bowcher NEW
Smith GlickCanadaIvan Magalhaes RENEWAL
Leja CaldareraCanadaIoni Bowcher UNQUALIFIED
Kaitlin OstroskyBrazilOnyama Limba QUALIFIED
Frozen Columns
Name
Juan Wieser
Juan Wieser
Leja Caldarera
Claire Tollner
Adams Morasca
Munro Ferencz
Antonio Caudy
Costa Dilliard
Deepesh Chui
Ivar Paprocki
Leon Oldroyd
David Darakjy
Izzy Garufi
Smith Glick
Clifford Rim
Rodrigues Campain
Isabel Bowley
Nicolas Iturbide
Johnson Sergi
Morrow Ruta
Kadeem Flosi
Aruna Figeroa
Izzy Garufi
Munro Ferencz
Aika Inouye
Alejandro Perin
Wickens Nestle
Sinclair Waycott
Francesco Shinko
Francesco Shinko
Darci Poquette
Adams Morasca
Cody Saylors
Salvatore Stockham
Mujtaba Nicka
Murillo Malet
Leon Oldroyd
Smith Glick
Jennifer Amigon
Julie Stenseth
Stacey Maclead
Aditya Kusko
Salvatore Stockham
James Butt
Johnson Sergi
David Darakjy
Maisha Rulapaugh
Greenwood Bolognia
Julie Stenseth
Faith Gillian
IdCountryDate
1000United Kingdom2025-09-09
1001Russia2025-09-16
1002Germany2025-09-24
1003Italy2025-09-09
1004United Kingdom2025-09-14
1005Italy2025-09-18
1006India2025-09-25
1007Australia2025-09-06
1008Germany2025-09-25
1009Italy2025-09-08
1010Australia2025-09-01
1011Spain2025-08-31
1012Spain2025-08-31
1013France2025-09-25
1014Germany2025-09-29
1015India2025-09-06
1016Argentina2025-09-25
1017Germany2025-09-23
1018France2025-09-15
1019Italy2025-09-09
1020Spain2025-09-15
1021Japan2025-09-10
1022Germany2025-09-01
1023Germany2025-09-04
1024Canada2025-09-21
1025Canada2025-09-28
1026Brazil2025-09-28
1027India2025-09-28
1028Russia2025-09-25
1029Japan2025-09-08
1030India2025-09-21
1031Canada2025-09-02
1032Russia2025-09-23
1033Australia2025-09-05
1034Brazil2025-09-27
1035Spain2025-08-31
1036France2025-08-31
1037France2025-09-09
1038Japan2025-09-27
1039Russia2025-09-26
1040Brazil2025-09-05
1041Spain2025-09-19
1042Argentina2025-09-19
1043India2025-09-14
1044Argentina2025-09-18
1045India2025-09-04
1046Japan2025-09-29
1047Russia2025-09-22
1048United Kingdom2025-09-06
1049Japan2025-09-27

On-Demand Data

NameIdCountryDate
Adams Morasca1000Russia2025-09-02
Tony Foller1001United Kingdom2025-09-28
Izzy Garufi1002Argentina2025-09-09
Salvatore Stockham1003Brazil2025-09-07
Jeanfrancois Venere1004Italy2025-09-20
James Butt1005Russia2025-09-05
Greenwood Bolognia1006Spain2025-09-22
Kaitlin Ostrosky1007France2025-09-25
Deepesh Chui1008Australia2025-09-10
Adams Morasca1009France2025-09-23
Chavez Briddick1010Brazil2025-09-08
Aruna Figeroa1011Argentina2025-09-29
Aika Inouye1012Russia2025-09-22
Nicolas Iturbide1013Argentina2025-09-17
Wickens Nestle1014Japan2025-09-01
Johnson Sergi1015Argentina2025-09-25
Mujtaba Nicka1016Japan2025-09-24
Mujtaba Nicka1017Spain2025-09-06
Cody Saylors1018Brazil2025-09-17
Cody Saylors1019Canada2025-09-16
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Juan WieserCanadaAnna Fali QUALIFIED
Costa DilliardSpainBernardo Dominic QUALIFIED
Ashley DoeFranceXuxue Feng UNQUALIFIED
Claire TollnerAustraliaAmy Elsner NEGOTIATION
Aika InouyeBrazilAsiya Javayant RENEWAL
Misaki RoysterGermanyAnna Fali RENEWAL
Adams MorascaGermanyStephen Shaw NEGOTIATION
Smith GlickSpainStephen Shaw NEW
Chavez BriddickBrazilAmy Elsner QUALIFIED
Morrow RutaRussiaStephen Shaw NEW
Kadeem FlosiCanadaXuxue Feng QUALIFIED
Smith GlickUnited KingdomAmy Elsner UNQUALIFIED
Julie StensethItalyAnna Fali NEGOTIATION
Adams MorascaArgentinaOnyama Limba RENEWAL
Darci PoquetteSpainAsiya Javayant PROPOSAL
Alejandro PerinUnited KingdomBernardo Dominic NEW
Clifford RimArgentinaElwin Sharvill NEW
Emily WhobreyItalyAnna Fali NEGOTIATION
Nicolas IturbideRussiaStephen Shaw NEGOTIATION
Izzy GarufiGermanyXuxue Feng UNQUALIFIED
Mayumi KolmetzUnited KingdomAsiya Javayant NEGOTIATION
Kaitlin OstroskySpainAmy Elsner PROPOSAL
Aruna FigeroaSpainOnyama Limba QUALIFIED
Morrow RutaUnited KingdomAsiya Javayant NEGOTIATION
Chavez BriddickAustraliaBernardo Dominic UNQUALIFIED
Emily WhobreyBrazilIvan Magalhaes UNQUALIFIED
Leon OldroydUnited KingdomStephen Shaw UNQUALIFIED
Morrow RutaUnited KingdomAmy Elsner PROPOSAL
Aika InouyeGermanyAmy Elsner RENEWAL
Tony FollerGermanyBernardo Dominic QUALIFIED
Antonio CaudyGermanyIvan Magalhaes RENEWAL
Johnson SergiIndiaIoni Bowcher NEW
Jones VocelkaIndiaElwin Sharvill UNQUALIFIED
Stacey MacleadIndiaOnyama Limba NEW
David DarakjyCanadaElwin Sharvill NEGOTIATION
Aruna FigeroaCanadaStephen Shaw QUALIFIED
Alejandro PerinJapanAmy Elsner PROPOSAL
Isabel BowleyItalyXuxue Feng PROPOSAL
Rodrigues CampainGermanyElwin Sharvill NEGOTIATION
Maria MarrierFranceElwin Sharvill QUALIFIED

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