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
Salvatore StockhamIndiaAmy Elsner NEGOTIATION
Jones VocelkaSpainStephen Shaw UNQUALIFIED
Leja CaldareraRussiaElwin Sharvill QUALIFIED
Silvio SlusarskiJapanElwin Sharvill QUALIFIED
Jones VocelkaGermanyElwin Sharvill UNQUALIFIED
Morrow RutaGermanyIoni Bowcher RENEWAL
Cody SaylorsItalyAsiya Javayant NEGOTIATION
Greenwood BologniaBrazilAsiya Javayant UNQUALIFIED
Misaki RoysterArgentinaAmy Elsner QUALIFIED
Misaki RoysterBrazilIvan Magalhaes RENEWAL
Antonio CaudyRussiaAnna Fali NEW
Chavez BriddickSpainAsiya Javayant RENEWAL
Antonio CaudyCanadaBernardo Dominic PROPOSAL
Leon OldroydCanadaIvan Magalhaes PROPOSAL
Sinclair WaycottCanadaIvan Magalhaes QUALIFIED
Smith GlickBrazilElwin Sharvill NEGOTIATION
Arvin AlbaresIndiaAnna Fali UNQUALIFIED
Aruna FigeroaJapanOnyama Limba NEW
Alejandro PerinItalyStephen Shaw PROPOSAL
Jeanfrancois VenereSpainStephen Shaw NEW
Arvin AlbaresRussiaBernardo Dominic NEGOTIATION
Costa DilliardUnited KingdomStephen Shaw NEW
Rodrigues CampainUnited KingdomStephen Shaw NEW
Faith GillianAustraliaAmy Elsner QUALIFIED
Julie StensethCanadaOnyama Limba QUALIFIED
Leja CaldareraAustraliaXuxue Feng UNQUALIFIED
Costa DilliardJapanOnyama Limba UNQUALIFIED
Jennifer AmigonFranceElwin Sharvill NEGOTIATION
Chavez BriddickAustraliaIvan Magalhaes NEGOTIATION
Chavez BriddickGermanyAsiya Javayant PROPOSAL
Stacey MacleadSpainXuxue Feng PROPOSAL
Darci PoquetteCanadaStephen Shaw PROPOSAL
Costa DilliardIndiaIoni Bowcher UNQUALIFIED
David DarakjyRussiaAnna Fali NEW
Juan WieserCanadaBernardo Dominic NEGOTIATION
Aika InouyeCanadaAnna Fali QUALIFIED
Aditya KuskoRussiaIoni Bowcher UNQUALIFIED
Kadeem FlosiSpainAmy Elsner NEW
Kaitlin OstroskyBrazilStephen Shaw UNQUALIFIED
Ashley DoeCanadaAnna Fali NEGOTIATION
Jefferson SchemmerBrazilAnna Fali PROPOSAL
Morrow RutaJapanStephen Shaw UNQUALIFIED
Aruna FigeroaSpainOnyama Limba QUALIFIED
Clifford RimUnited KingdomXuxue Feng NEGOTIATION
Salvatore StockhamArgentinaAnna Fali QUALIFIED
Jefferson SchemmerRussiaIvan Magalhaes UNQUALIFIED
Mujtaba NickaSpainBernardo Dominic RENEWAL
Wickens NestleUnited KingdomAnna Fali NEGOTIATION
Leja CaldareraIndiaOnyama Limba QUALIFIED
Ashley DoeSpainIoni Bowcher QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Jones VocelkaIndiaIoni Bowcher UNQUALIFIED
Kadeem FlosiRussiaIoni Bowcher QUALIFIED
David DarakjyUnited KingdomOnyama Limba NEGOTIATION
Rodrigues CampainFranceIvan Magalhaes RENEWAL
Jones VocelkaFranceAnna Fali NEW
Isabel BowleyAustraliaElwin Sharvill NEGOTIATION
Faith GillianFranceIvan Magalhaes RENEWAL
Costa DilliardFranceElwin Sharvill RENEWAL
Jones VocelkaRussiaBernardo Dominic NEW
Francesco ShinkoBrazilStephen Shaw QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Kaitlin OstroskyCanada2026-05-24Chanay, Jeffrey A Esq NEGOTIATION82Anna Fali
1001Maria MarrierAustralia2026-05-06Feiner Bros UNQUALIFIED82Stephen Shaw
1002Isabel BowleyUnited Kingdom2026-05-15Rousseaux, Michael Esq RENEWAL32Ivan Magalhaes
1003Clifford RimUnited Kingdom2026-05-15Morlong Associates NEW92Stephen Shaw
1004Alejandro PerinIndia2026-05-23Morlong Associates RENEWAL13Amy Elsner
1005Mujtaba NickaRussia2026-05-17Truhlar And Truhlar Attys PROPOSAL95Asiya Javayant
1006Jennifer AmigonFrance2026-05-13Commercial Press QUALIFIED50Elwin Sharvill
1007Aditya KuskoItaly2026-05-05Feltz Printing Service NEW14Ivan Magalhaes
1008Deepesh ChuiIndia2026-05-29Truhlar And Truhlar Attys PROPOSAL97Bernardo Dominic
1009Deepesh ChuiAustralia2026-05-05Chanay, Jeffrey A Esq RENEWAL61Elwin Sharvill
1010Arvin AlbaresJapan2026-05-26Feltz Printing Service RENEWAL62Bernardo Dominic
1011Antonio CaudyGermany2026-05-04Chapman, Ross E Esq NEGOTIATION21Elwin Sharvill
1012Silvio SlusarskiArgentina2026-05-03King, Christopher A Esq NEW43Elwin Sharvill
1013Jeanfrancois VenereBrazil2026-05-06Printing Dimensions QUALIFIED97Anna Fali
1014Aruna FigeroaAustralia2026-05-20King, Christopher A Esq UNQUALIFIED22Anna Fali
1015Leja CaldareraArgentina2026-05-12Morlong Associates NEGOTIATION64Bernardo Dominic
1016Faith GillianAustralia2026-05-04Commercial Press UNQUALIFIED39Stephen Shaw
1017Rodrigues CampainFrance2026-05-15Benton, John B Jr NEW97Asiya Javayant
1018Johnson SergiSpain2026-05-16King, Christopher A Esq NEW21Elwin Sharvill
1019Ashley DoeSpain2026-05-06Feiner Bros RENEWAL15Anna Fali
1020Kaitlin OstroskyItaly2026-05-10Feiner Bros PROPOSAL34Xuxue Feng
1021Adams MorascaUnited Kingdom2026-05-05Commercial Press UNQUALIFIED64Xuxue Feng
1022Ricardo GauchoSpain2026-05-24Feiner Bros QUALIFIED29Onyama Limba
1023Stacey MacleadIndia2026-05-29Printing Dimensions NEW11Xuxue Feng
1024Murillo MaletCanada2026-05-04Chemel, James L Cpa NEW44Stephen Shaw
1025James ButtAustralia2026-05-06Chemel, James L Cpa UNQUALIFIED37Anna Fali
1026Murillo MaletItaly2026-05-31Commercial Press NEGOTIATION73Onyama Limba
1027Emily WhobreyRussia2026-05-29Commercial Press UNQUALIFIED39Stephen Shaw
1028Ashley DoeJapan2026-05-21Feltz Printing Service NEW7Stephen Shaw
1029Juan WieserItaly2026-05-12Chapman, Ross E Esq QUALIFIED56Ivan Magalhaes
1030Murillo MaletJapan2026-05-08Chanay, Jeffrey A Esq NEGOTIATION39Asiya Javayant
1031David DarakjyArgentina2026-05-16Chemel, James L Cpa QUALIFIED83Elwin Sharvill
1032Kadeem FlosiCanada2026-05-21Printing Dimensions QUALIFIED59Onyama Limba
1033Francesco ShinkoGermany2026-05-11Dorl, James J Esq NEGOTIATION59Stephen Shaw
1034Morrow RutaGermany2026-05-05Rousseaux, Michael Esq RENEWAL88Asiya Javayant
1035Ricardo GauchoCanada2026-05-04Commercial Press NEGOTIATION73Stephen Shaw
1036Salvatore StockhamCanada2026-06-01Benton, John B Jr NEGOTIATION5Elwin Sharvill
1037Greenwood BologniaItaly2026-05-17Chemel, James L Cpa UNQUALIFIED42Ivan Magalhaes
1038David DarakjyCanada2026-05-17Rousseaux, Michael Esq RENEWAL94Ioni Bowcher
1039Adams MorascaCanada2026-05-22Dorl, James J Esq RENEWAL21Stephen Shaw
1040Ricardo GauchoUnited Kingdom2026-05-17Feltz Printing Service NEGOTIATION18Amy Elsner
1041Tony FollerItaly2026-05-05Buckley Miller Wright NEGOTIATION97Elwin Sharvill
1042Sinclair WaycottUnited Kingdom2026-05-31Printing Dimensions UNQUALIFIED92Ivan Magalhaes
1043James ButtBrazil2026-05-04Feltz Printing Service NEGOTIATION99Xuxue Feng
1044Clifford RimJapan2026-05-20Benton, John B Jr UNQUALIFIED95Asiya Javayant
1045Aruna FigeroaBrazil2026-05-21Feltz Printing Service RENEWAL53Ioni Bowcher
1046Tony FollerItaly2026-05-29Feltz Printing Service NEGOTIATION93Bernardo Dominic
1047Leja CaldareraCanada2026-05-13Chemel, James L Cpa RENEWAL78Asiya Javayant
1048Wickens NestleBrazil2026-05-17Benton, John B Jr QUALIFIED9Stephen Shaw
1049Mujtaba NickaFrance2026-05-21King, Christopher A Esq RENEWAL73Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Rodrigues CampainJapanBernardo Dominic RENEWAL
Faith GillianIndiaXuxue Feng PROPOSAL
Maisha RulapaughJapanAnna Fali UNQUALIFIED
Johnson SergiAustraliaBernardo Dominic RENEWAL
Smith GlickGermanyIoni Bowcher QUALIFIED
Darci PoquetteRussiaElwin Sharvill NEGOTIATION
Jennifer AmigonUnited KingdomAnna Fali NEGOTIATION
Darci PoquetteArgentinaAmy Elsner NEW
Aditya KuskoIndiaAsiya Javayant RENEWAL
Munro FerenczIndiaIvan Magalhaes RENEWAL
Morrow RutaSpainAnna Fali UNQUALIFIED
Juan WieserAustraliaOnyama Limba QUALIFIED
Antonio CaudyGermanyAnna Fali QUALIFIED
Wickens NestleSpainXuxue Feng UNQUALIFIED
Jeanfrancois VenereRussiaOnyama Limba NEGOTIATION
Clifford RimCanadaAmy Elsner UNQUALIFIED
Octavia MaletFranceAsiya Javayant NEGOTIATION
Juan WieserRussiaOnyama Limba NEGOTIATION
Johnson SergiAustraliaAnna Fali NEW
Kaitlin OstroskyArgentinaAnna Fali UNQUALIFIED
Nicolas IturbideArgentinaBernardo Dominic QUALIFIED
Isabel BowleyCanadaElwin Sharvill PROPOSAL
David DarakjyAustraliaIoni Bowcher QUALIFIED
Jeanfrancois VenereGermanyIvan Magalhaes NEW
Rodrigues CampainSpainBernardo Dominic QUALIFIED
Salvatore StockhamAustraliaOnyama Limba NEGOTIATION
Leon OldroydIndiaBernardo Dominic RENEWAL
Murillo MaletArgentinaAsiya Javayant NEW
Silvio SlusarskiUnited KingdomIoni Bowcher NEGOTIATION
Costa DilliardFranceStephen Shaw UNQUALIFIED
Ashley DoeRussiaAsiya Javayant NEGOTIATION
Darci PoquetteArgentinaOnyama Limba NEW
Francesco ShinkoIndiaOnyama Limba UNQUALIFIED
Leja CaldareraRussiaIoni Bowcher NEW
Stacey MacleadAustraliaIoni Bowcher NEGOTIATION
Arvin AlbaresCanadaElwin Sharvill NEW
Rodrigues CampainSpainElwin Sharvill UNQUALIFIED
Costa DilliardSpainIvan Magalhaes NEW
Jefferson SchemmerGermanyBernardo Dominic RENEWAL
Claire TollnerIndiaIvan Magalhaes NEGOTIATION
Ricardo GauchoUnited KingdomStephen Shaw PROPOSAL
Maria MarrierArgentinaBernardo Dominic QUALIFIED
Emily WhobreyFranceIoni Bowcher UNQUALIFIED
Ricardo GauchoUnited KingdomIoni Bowcher QUALIFIED
Sinclair WaycottUnited KingdomAnna Fali NEGOTIATION
Salvatore StockhamFranceElwin Sharvill UNQUALIFIED
Faith GillianBrazilXuxue Feng NEW
Emily WhobreyArgentinaBernardo Dominic RENEWAL
Aika InouyeItalyAmy Elsner PROPOSAL
Jones VocelkaFranceBernardo Dominic NEGOTIATION
Frozen Columns
Name
Adams Morasca
Tony Foller
Deepesh Chui
Jeanfrancois Venere
Salvatore Stockham
James Butt
Jones Vocelka
Francesco Shinko
Emily Whobrey
Chavez Briddick
Smith Glick
Murillo Malet
Isabel Bowley
Antonio Caudy
Chavez Briddick
Aruna Figeroa
Adams Morasca
Ivar Paprocki
Antonio Caudy
Nicolas Iturbide
Aika Inouye
Aditya Kusko
Antonio Caudy
Jones Vocelka
Mayumi Kolmetz
Octavia Malet
Leja Caldarera
Deepesh Chui
Nicolas Iturbide
Octavia Malet
Isabel Bowley
Jones Vocelka
Ashley Doe
Stacey Maclead
Aruna Figeroa
James Butt
Ivar Paprocki
Misaki Royster
Octavia Malet
Octavia Malet
Maisha Rulapaugh
Isabel Bowley
Wickens Nestle
Maria Marrier
Ashley Doe
Juan Wieser
Aika Inouye
Aditya Kusko
James Butt
Jennifer Amigon
IdCountryDate
1000Argentina2026-05-13
1001Argentina2026-05-08
1002Spain2026-05-10
1003Japan2026-05-14
1004Argentina2026-05-14
1005Brazil2026-05-14
1006Australia2026-05-31
1007Australia2026-05-03
1008Brazil2026-05-10
1009United Kingdom2026-05-09
1010Italy2026-05-15
1011Argentina2026-05-19
1012Germany2026-05-09
1013Russia2026-05-19
1014Australia2026-05-05
1015Brazil2026-05-23
1016France2026-05-27
1017Japan2026-05-10
1018Argentina2026-05-28
1019Australia2026-06-01
1020United Kingdom2026-05-07
1021Japan2026-05-11
1022Spain2026-05-27
1023France2026-05-21
1024Japan2026-05-13
1025Italy2026-05-19
1026Argentina2026-05-28
1027France2026-05-13
1028Germany2026-05-22
1029Brazil2026-05-22
1030France2026-05-21
1031Italy2026-05-13
1032Italy2026-05-23
1033Canada2026-05-20
1034France2026-05-10
1035Argentina2026-05-29
1036Germany2026-05-05
1037Germany2026-05-20
1038Spain2026-05-11
1039Australia2026-05-07
1040Argentina2026-05-09
1041Canada2026-05-06
1042France2026-05-20
1043Spain2026-05-26
1044Australia2026-05-17
1045Germany2026-05-16
1046Argentina2026-05-10
1047Japan2026-05-09
1048Japan2026-05-06
1049Germany2026-06-01

On-Demand Data

NameIdCountryDate
Rodrigues Campain1000Brazil2026-05-29
Cody Saylors1001Brazil2026-05-21
Silvio Slusarski1002France2026-05-15
Ivar Paprocki1003Japan2026-05-25
Chavez Briddick1004Argentina2026-05-28
Leon Oldroyd1005India2026-05-18
Ivar Paprocki1006Russia2026-05-14
Darci Poquette1007India2026-05-08
Juan Wieser1008Australia2026-05-15
Adams Morasca1009France2026-05-19
Faith Gillian1010Argentina2026-05-04
Kadeem Flosi1011Germany2026-05-27
Clifford Rim1012France2026-05-10
Murillo Malet1013Germany2026-05-11
Cody Saylors1014Russia2026-05-12
Tony Foller1015Italy2026-05-04
Murillo Malet1016Brazil2026-05-17
Cody Saylors1017India2026-05-06
Chavez Briddick1018United Kingdom2026-05-16
Costa Dilliard1019Germany2026-05-09
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Claire TollnerItalyStephen Shaw PROPOSAL
Adams MorascaIndiaIoni Bowcher NEW
Aruna FigeroaItalyOnyama Limba UNQUALIFIED
Kadeem FlosiJapanXuxue Feng NEW
Juan WieserSpainAnna Fali UNQUALIFIED
Darci PoquetteFranceBernardo Dominic PROPOSAL
Smith GlickIndiaAmy Elsner PROPOSAL
Aika InouyeRussiaIoni Bowcher PROPOSAL
Octavia MaletCanadaIoni Bowcher UNQUALIFIED
Morrow RutaJapanIvan Magalhaes NEGOTIATION
Ashley DoeIndiaAsiya Javayant NEGOTIATION
Stacey MacleadFranceAnna Fali PROPOSAL
Greenwood BologniaSpainOnyama Limba RENEWAL
Maria MarrierUnited KingdomXuxue Feng NEGOTIATION
Adams MorascaItalyAnna Fali PROPOSAL
Murillo MaletJapanAsiya Javayant NEW
Chavez BriddickItalyAnna Fali NEW
Jefferson SchemmerUnited KingdomXuxue Feng NEGOTIATION
Jeanfrancois VenereArgentinaIoni Bowcher NEGOTIATION
Aika InouyeGermanyAnna Fali UNQUALIFIED
Tony FollerIndiaOnyama Limba NEW
David DarakjyJapanAnna Fali RENEWAL
Jennifer AmigonFranceIoni Bowcher NEW
Rodrigues CampainFranceStephen Shaw QUALIFIED
Juan WieserBrazilAmy Elsner NEW
Ashley DoeJapanOnyama Limba NEGOTIATION
Salvatore StockhamCanadaAnna Fali UNQUALIFIED
Darci PoquetteArgentinaStephen Shaw NEGOTIATION
Aditya KuskoAustraliaIoni Bowcher NEGOTIATION
Claire TollnerUnited KingdomIvan Magalhaes UNQUALIFIED
Chavez BriddickSpainAmy Elsner PROPOSAL
Maisha RulapaughArgentinaXuxue Feng NEW
David DarakjyRussiaOnyama Limba QUALIFIED
Kaitlin OstroskyFranceOnyama Limba PROPOSAL
Sinclair WaycottBrazilOnyama Limba UNQUALIFIED
Kaitlin OstroskyCanadaAmy Elsner RENEWAL
Ashley DoeUnited KingdomIvan Magalhaes NEGOTIATION
Kadeem FlosiAustraliaAsiya Javayant QUALIFIED
Deepesh ChuiGermanyIoni Bowcher NEW
Juan WieserBrazilIvan Magalhaes 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>