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
Maisha RulapaughArgentinaAsiya Javayant UNQUALIFIED
Darci PoquetteGermanyIvan Magalhaes PROPOSAL
Sinclair WaycottJapanAmy Elsner NEGOTIATION
Maria MarrierRussiaAmy Elsner NEW
Jennifer AmigonJapanIvan Magalhaes QUALIFIED
Johnson SergiCanadaStephen Shaw UNQUALIFIED
Mayumi KolmetzCanadaAnna Fali RENEWAL
Tony FollerRussiaXuxue Feng RENEWAL
James ButtItalyStephen Shaw PROPOSAL
Jefferson SchemmerIndiaBernardo Dominic NEGOTIATION
Faith GillianRussiaStephen Shaw UNQUALIFIED
James ButtAustraliaIvan Magalhaes QUALIFIED
Juan WieserGermanyStephen Shaw NEGOTIATION
Morrow RutaArgentinaStephen Shaw NEGOTIATION
Sinclair WaycottIndiaIoni Bowcher UNQUALIFIED
Smith GlickJapanBernardo Dominic UNQUALIFIED
Kaitlin OstroskySpainOnyama Limba RENEWAL
Octavia MaletRussiaStephen Shaw NEW
Clifford RimJapanOnyama Limba RENEWAL
David DarakjyFranceIoni Bowcher RENEWAL
Jeanfrancois VenereBrazilAsiya Javayant RENEWAL
Mayumi KolmetzUnited KingdomXuxue Feng NEW
Antonio CaudyAustraliaElwin Sharvill NEGOTIATION
Smith GlickIndiaStephen Shaw NEGOTIATION
Ashley DoeFranceXuxue Feng NEGOTIATION
Jeanfrancois VenereJapanStephen Shaw PROPOSAL
Jeanfrancois VenereCanadaStephen Shaw RENEWAL
Ricardo GauchoItalyIoni Bowcher PROPOSAL
Francesco ShinkoGermanyOnyama Limba PROPOSAL
Wickens NestleRussiaIvan Magalhaes UNQUALIFIED
Morrow RutaSpainStephen Shaw QUALIFIED
Leon OldroydItalyXuxue Feng UNQUALIFIED
Ivar PaprockiBrazilAmy Elsner PROPOSAL
Arvin AlbaresFranceIvan Magalhaes NEW
Leja CaldareraSpainOnyama Limba QUALIFIED
Alejandro PerinBrazilAsiya Javayant QUALIFIED
Costa DilliardItalyAmy Elsner UNQUALIFIED
Costa DilliardJapanStephen Shaw QUALIFIED
Deepesh ChuiJapanAmy Elsner QUALIFIED
Maria MarrierSpainAsiya Javayant QUALIFIED
Rodrigues CampainGermanyStephen Shaw QUALIFIED
Jennifer AmigonArgentinaStephen Shaw RENEWAL
Arvin AlbaresSpainOnyama Limba UNQUALIFIED
Juan WieserArgentinaXuxue Feng PROPOSAL
James ButtItalyElwin Sharvill NEGOTIATION
Izzy GarufiRussiaAnna Fali UNQUALIFIED
Misaki RoysterRussiaOnyama Limba QUALIFIED
Octavia MaletBrazilXuxue Feng UNQUALIFIED
Aruna FigeroaSpainAnna Fali NEGOTIATION
Kaitlin OstroskyAustraliaStephen Shaw UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Munro FerenczRussiaIvan Magalhaes NEW
Juan WieserItalyXuxue Feng NEW
Julie StensethSpainXuxue Feng NEW
Morrow RutaIndiaOnyama Limba RENEWAL
Morrow RutaIndiaIoni Bowcher NEGOTIATION
Nicolas IturbideUnited KingdomIvan Magalhaes RENEWAL
Jefferson SchemmerItalyOnyama Limba UNQUALIFIED
David DarakjyBrazilAnna Fali RENEWAL
Murillo MaletUnited KingdomIvan Magalhaes QUALIFIED
Munro FerenczJapanAnna Fali RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Clifford RimArgentina2026-04-30Rangoni Of Florence NEGOTIATION21Elwin Sharvill
1001Silvio SlusarskiRussia2026-05-01Buckley Miller Wright QUALIFIED73Onyama Limba
1002Munro FerenczCanada2026-04-09Rousseaux, Michael Esq NEW69Amy Elsner
1003Jones VocelkaCanada2026-05-04Rousseaux, Michael Esq QUALIFIED37Ivan Magalhaes
1004Murillo MaletRussia2026-04-17Benton, John B Jr QUALIFIED81Asiya Javayant
1005Claire TollnerItaly2026-05-06Rangoni Of Florence PROPOSAL31Asiya Javayant
1006David DarakjyBrazil2026-05-05Commercial Press QUALIFIED79Anna Fali
1007Jones VocelkaArgentina2026-04-18Benton, John B Jr NEW3Anna Fali
1008Johnson SergiUnited Kingdom2026-04-29Rousseaux, Michael Esq NEW67Xuxue Feng
1009Aika InouyeBrazil2026-05-07Dorl, James J Esq UNQUALIFIED56Elwin Sharvill
1010Tony FollerAustralia2026-04-22Morlong Associates NEW89Xuxue Feng
1011Aditya KuskoGermany2026-05-05Buckley Miller Wright QUALIFIED85Ivan Magalhaes
1012Misaki RoysterGermany2026-04-10Truhlar And Truhlar Attys QUALIFIED73Onyama Limba
1013Antonio CaudyBrazil2026-04-22Feiner Bros RENEWAL2Stephen Shaw
1014Wickens NestleAustralia2026-04-27Printing Dimensions NEW34Xuxue Feng
1015Nicolas IturbideArgentina2026-04-15Rousseaux, Michael Esq RENEWAL37Onyama Limba
1016Morrow RutaRussia2026-04-27Feltz Printing Service NEGOTIATION18Ioni Bowcher
1017Stacey MacleadCanada2026-04-21Dorl, James J Esq QUALIFIED31Asiya Javayant
1018Rodrigues CampainFrance2026-05-08Rangoni Of Florence RENEWAL58Anna Fali
1019Smith GlickAustralia2026-04-11Buckley Miller Wright PROPOSAL2Ioni Bowcher
1020Aika InouyeIndia2026-04-15Feiner Bros NEGOTIATION89Xuxue Feng
1021Smith GlickCanada2026-04-24Rangoni Of Florence NEGOTIATION96Ivan Magalhaes
1022Morrow RutaJapan2026-05-08Chemel, James L Cpa NEGOTIATION72Amy Elsner
1023Francesco ShinkoItaly2026-04-28Commercial Press NEW58Ioni Bowcher
1024Darci PoquetteGermany2026-04-25Truhlar And Truhlar Attys UNQUALIFIED88Elwin Sharvill
1025Munro FerenczCanada2026-04-10Buckley Miller Wright QUALIFIED75Onyama Limba
1026Chavez BriddickAustralia2026-04-28Feltz Printing Service RENEWAL33Stephen Shaw
1027Antonio CaudyFrance2026-05-04Chanay, Jeffrey A Esq NEW56Elwin Sharvill
1028Ricardo GauchoAustralia2026-04-17Feltz Printing Service PROPOSAL4Ivan Magalhaes
1029Chavez BriddickCanada2026-04-27Chapman, Ross E Esq NEGOTIATION16Amy Elsner
1030Emily WhobreyIndia2026-04-30Printing Dimensions NEGOTIATION78Asiya Javayant
1031Adams MorascaArgentina2026-05-03Truhlar And Truhlar Attys QUALIFIED61Ioni Bowcher
1032Antonio CaudySpain2026-04-30Morlong Associates RENEWAL54Onyama Limba
1033Jennifer AmigonBrazil2026-04-25Feltz Printing Service NEW74Ioni Bowcher
1034Aika InouyeArgentina2026-04-29Feltz Printing Service UNQUALIFIED59Stephen Shaw
1035Juan WieserIndia2026-04-22Dorl, James J Esq NEW5Amy Elsner
1036Darci PoquetteFrance2026-04-13Feltz Printing Service PROPOSAL48Stephen Shaw
1037Jennifer AmigonIndia2026-04-09Chanay, Jeffrey A Esq PROPOSAL77Anna Fali
1038Alejandro PerinItaly2026-04-26Feiner Bros NEW66Ioni Bowcher
1039Kadeem FlosiRussia2026-04-18Chemel, James L Cpa PROPOSAL91Onyama Limba
1040Jennifer AmigonUnited Kingdom2026-04-30Rangoni Of Florence QUALIFIED39Ioni Bowcher
1041Wickens NestleItaly2026-04-28Chapman, Ross E Esq PROPOSAL21Bernardo Dominic
1042Maria MarrierSpain2026-04-23Morlong Associates NEW58Elwin Sharvill
1043Leon OldroydUnited Kingdom2026-04-29Chanay, Jeffrey A Esq UNQUALIFIED34Onyama Limba
1044Costa DilliardArgentina2026-04-22Buckley Miller Wright UNQUALIFIED7Bernardo Dominic
1045Ashley DoeCanada2026-04-25Chanay, Jeffrey A Esq PROPOSAL21Ioni Bowcher
1046Clifford RimArgentina2026-04-15Buckley Miller Wright RENEWAL81Stephen Shaw
1047Antonio CaudyRussia2026-04-28Rousseaux, Michael Esq NEGOTIATION20Elwin Sharvill
1048Ivar PaprockiCanada2026-04-25Chapman, Ross E Esq UNQUALIFIED65Xuxue Feng
1049Adams MorascaFrance2026-04-19Chemel, James L Cpa NEGOTIATION63Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Faith GillianJapanElwin Sharvill PROPOSAL
Claire TollnerCanadaAnna Fali RENEWAL
Chavez BriddickJapanAmy Elsner PROPOSAL
Tony FollerUnited KingdomIoni Bowcher UNQUALIFIED
Ricardo GauchoGermanyXuxue Feng PROPOSAL
Aika InouyeJapanOnyama Limba PROPOSAL
Greenwood BologniaAustraliaIoni Bowcher PROPOSAL
Ivar PaprockiAustraliaOnyama Limba RENEWAL
Isabel BowleySpainIoni Bowcher PROPOSAL
Tony FollerFranceIvan Magalhaes RENEWAL
Nicolas IturbideCanadaOnyama Limba RENEWAL
Munro FerenczItalyIoni Bowcher NEGOTIATION
Jennifer AmigonRussiaElwin Sharvill UNQUALIFIED
Johnson SergiArgentinaElwin Sharvill RENEWAL
Ashley DoeUnited KingdomXuxue Feng NEW
Francesco ShinkoGermanyXuxue Feng UNQUALIFIED
Mayumi KolmetzGermanyAnna Fali NEW
Rodrigues CampainCanadaIoni Bowcher NEW
Arvin AlbaresAustraliaAmy Elsner PROPOSAL
Juan WieserBrazilStephen Shaw UNQUALIFIED
Faith GillianCanadaXuxue Feng QUALIFIED
Morrow RutaAustraliaAnna Fali RENEWAL
Jefferson SchemmerIndiaAmy Elsner NEGOTIATION
Faith GillianRussiaAsiya Javayant RENEWAL
Ricardo GauchoCanadaBernardo Dominic UNQUALIFIED
Faith GillianRussiaIoni Bowcher NEW
Emily WhobreyArgentinaBernardo Dominic NEW
Ivar PaprockiUnited KingdomStephen Shaw UNQUALIFIED
Aika InouyeJapanElwin Sharvill NEW
Ashley DoeCanadaAmy Elsner NEGOTIATION
Smith GlickArgentinaStephen Shaw NEGOTIATION
Ashley DoeBrazilAsiya Javayant NEGOTIATION
Maisha RulapaughArgentinaAnna Fali QUALIFIED
Cody SaylorsAustraliaOnyama Limba PROPOSAL
Greenwood BologniaGermanyAsiya Javayant PROPOSAL
Ivar PaprockiItalyXuxue Feng RENEWAL
Tony FollerUnited KingdomStephen Shaw RENEWAL
Stacey MacleadCanadaElwin Sharvill NEW
Stacey MacleadCanadaAnna Fali NEW
Arvin AlbaresRussiaXuxue Feng RENEWAL
Silvio SlusarskiCanadaStephen Shaw QUALIFIED
Aditya KuskoSpainAsiya Javayant QUALIFIED
Ricardo GauchoIndiaXuxue Feng PROPOSAL
Julie StensethArgentinaIoni Bowcher QUALIFIED
Jones VocelkaJapanAsiya Javayant NEW
Juan WieserCanadaIoni Bowcher PROPOSAL
Julie StensethRussiaOnyama Limba NEGOTIATION
Stacey MacleadIndiaAnna Fali NEW
Maria MarrierAustraliaOnyama Limba RENEWAL
Salvatore StockhamSpainXuxue Feng RENEWAL
Frozen Columns
Name
Greenwood Bolognia
Ricardo Gaucho
Arvin Albares
Aditya Kusko
Jefferson Schemmer
Francesco Shinko
Greenwood Bolognia
Silvio Slusarski
Costa Dilliard
Smith Glick
Francesco Shinko
Salvatore Stockham
Ricardo Gaucho
Kadeem Flosi
Jefferson Schemmer
Murillo Malet
Julie Stenseth
Maria Marrier
Arvin Albares
Arvin Albares
Ivar Paprocki
Aruna Figeroa
Costa Dilliard
Julie Stenseth
Chavez Briddick
Jennifer Amigon
Kaitlin Ostrosky
Wickens Nestle
Ashley Doe
Ricardo Gaucho
Claire Tollner
Kadeem Flosi
Aika Inouye
Mayumi Kolmetz
Izzy Garufi
Costa Dilliard
Maria Marrier
Jennifer Amigon
Chavez Briddick
Smith Glick
Darci Poquette
Deepesh Chui
Izzy Garufi
Misaki Royster
Darci Poquette
Arvin Albares
Greenwood Bolognia
Leja Caldarera
Costa Dilliard
Ashley Doe
IdCountryDate
1000Russia2026-04-16
1001Japan2026-04-09
1002Italy2026-05-08
1003Spain2026-05-04
1004Russia2026-04-16
1005Brazil2026-04-27
1006Canada2026-05-03
1007Spain2026-04-13
1008Brazil2026-04-17
1009Italy2026-04-18
1010Spain2026-04-20
1011Russia2026-04-28
1012Brazil2026-04-25
1013United Kingdom2026-05-07
1014Russia2026-04-20
1015Japan2026-04-11
1016Japan2026-04-10
1017Italy2026-04-11
1018Canada2026-04-14
1019Canada2026-04-22
1020Japan2026-04-19
1021Brazil2026-04-30
1022Canada2026-05-05
1023Argentina2026-05-06
1024Japan2026-05-04
1025Australia2026-05-03
1026Japan2026-04-19
1027France2026-05-01
1028Russia2026-05-06
1029France2026-04-29
1030France2026-05-07
1031Italy2026-04-13
1032Australia2026-04-14
1033United Kingdom2026-04-22
1034India2026-04-12
1035Spain2026-05-07
1036France2026-04-24
1037India2026-05-04
1038Argentina2026-04-18
1039India2026-05-04
1040Germany2026-04-10
1041Japan2026-04-29
1042India2026-04-23
1043Canada2026-04-14
1044France2026-05-02
1045Japan2026-04-12
1046Argentina2026-04-21
1047Japan2026-04-19
1048France2026-04-14
1049Italy2026-04-26

On-Demand Data

NameIdCountryDate
Cody Saylors1000India2026-04-11
Arvin Albares1001Russia2026-04-27
Johnson Sergi1002Argentina2026-04-23
Smith Glick1003Argentina2026-04-24
Morrow Ruta1004Japan2026-04-12
Stacey Maclead1005Italy2026-04-11
Ivar Paprocki1006United Kingdom2026-05-06
Greenwood Bolognia1007Russia2026-04-22
Misaki Royster1008Germany2026-04-12
Cody Saylors1009France2026-04-24
Francesco Shinko1010Japan2026-04-20
Tony Foller1011Spain2026-04-21
Nicolas Iturbide1012Brazil2026-04-13
Mayumi Kolmetz1013Spain2026-04-25
Wickens Nestle1014Spain2026-04-12
Deepesh Chui1015France2026-04-27
Juan Wieser1016France2026-04-25
James Butt1017Russia2026-04-19
Tony Foller1018Italy2026-04-17
Emily Whobrey1019France2026-04-09
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Ashley DoeItalyXuxue Feng QUALIFIED
Mujtaba NickaBrazilAmy Elsner NEGOTIATION
Cody SaylorsItalyAsiya Javayant NEGOTIATION
Murillo MaletRussiaXuxue Feng QUALIFIED
Nicolas IturbideSpainBernardo Dominic QUALIFIED
Isabel BowleySpainStephen Shaw UNQUALIFIED
Tony FollerGermanyElwin Sharvill RENEWAL
Rodrigues CampainBrazilAmy Elsner UNQUALIFIED
Munro FerenczRussiaStephen Shaw RENEWAL
Kadeem FlosiAustraliaAsiya Javayant RENEWAL
Izzy GarufiUnited KingdomAnna Fali UNQUALIFIED
Leja CaldareraCanadaAnna Fali QUALIFIED
Morrow RutaJapanElwin Sharvill RENEWAL
Johnson SergiJapanElwin Sharvill UNQUALIFIED
Octavia MaletArgentinaXuxue Feng NEGOTIATION
Faith GillianUnited KingdomXuxue Feng RENEWAL
Ricardo GauchoIndiaStephen Shaw NEW
Faith GillianIndiaAmy Elsner NEW
Misaki RoysterAustraliaIoni Bowcher RENEWAL
Silvio SlusarskiFranceOnyama Limba UNQUALIFIED
Izzy GarufiSpainAnna Fali RENEWAL
Kaitlin OstroskySpainIoni Bowcher NEGOTIATION
Nicolas IturbideGermanyStephen Shaw QUALIFIED
Stacey MacleadFranceIoni Bowcher RENEWAL
Jones VocelkaItalyIoni Bowcher UNQUALIFIED
Leon OldroydUnited KingdomAnna Fali NEGOTIATION
Julie StensethUnited KingdomAnna Fali PROPOSAL
Wickens NestleJapanIoni Bowcher QUALIFIED
Sinclair WaycottUnited KingdomIoni Bowcher NEW
Johnson SergiJapanAmy Elsner QUALIFIED
Ashley DoeFranceAnna Fali PROPOSAL
Emily WhobreyCanadaAsiya Javayant NEGOTIATION
Jennifer AmigonItalyBernardo Dominic NEW
Claire TollnerFranceIvan Magalhaes UNQUALIFIED
Johnson SergiIndiaXuxue Feng RENEWAL
Misaki RoysterSpainOnyama Limba NEW
Cody SaylorsAustraliaIoni Bowcher RENEWAL
Izzy GarufiBrazilXuxue Feng PROPOSAL
Julie StensethBrazilStephen Shaw QUALIFIED
Greenwood BologniaUnited KingdomBernardo Dominic 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>