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
Chavez BriddickIndiaAsiya Javayant NEGOTIATION
Jefferson SchemmerIndiaAnna Fali UNQUALIFIED
Jeanfrancois VenereRussiaAmy Elsner QUALIFIED
Faith GillianCanadaAnna Fali PROPOSAL
Maria MarrierJapanStephen Shaw PROPOSAL
Nicolas IturbideSpainAsiya Javayant RENEWAL
Ricardo GauchoCanadaXuxue Feng NEW
Stacey MacleadIndiaXuxue Feng NEW
Claire TollnerJapanElwin Sharvill UNQUALIFIED
David DarakjyBrazilBernardo Dominic NEW
Sinclair WaycottAustraliaIoni Bowcher NEGOTIATION
Rodrigues CampainAustraliaAnna Fali QUALIFIED
Wickens NestleIndiaBernardo Dominic PROPOSAL
Emily WhobreyUnited KingdomIoni Bowcher NEGOTIATION
Wickens NestleArgentinaOnyama Limba UNQUALIFIED
Aruna FigeroaRussiaBernardo Dominic UNQUALIFIED
Leja CaldareraJapanXuxue Feng RENEWAL
Jones VocelkaBrazilIoni Bowcher QUALIFIED
Wickens NestleUnited KingdomXuxue Feng NEGOTIATION
Misaki RoysterFranceAnna Fali RENEWAL
Darci PoquetteJapanStephen Shaw UNQUALIFIED
Faith GillianIndiaXuxue Feng NEGOTIATION
Francesco ShinkoIndiaIvan Magalhaes QUALIFIED
Claire TollnerAustraliaOnyama Limba NEGOTIATION
Mujtaba NickaIndiaAsiya Javayant QUALIFIED
Octavia MaletBrazilAsiya Javayant UNQUALIFIED
Deepesh ChuiSpainAmy Elsner RENEWAL
Kadeem FlosiCanadaAsiya Javayant RENEWAL
Leon OldroydRussiaOnyama Limba PROPOSAL
Darci PoquetteCanadaIvan Magalhaes NEW
Jones VocelkaJapanAsiya Javayant RENEWAL
Nicolas IturbideJapanElwin Sharvill RENEWAL
Julie StensethItalyAnna Fali QUALIFIED
Octavia MaletGermanyAnna Fali RENEWAL
Jones VocelkaSpainXuxue Feng NEGOTIATION
Deepesh ChuiAustraliaIoni Bowcher NEGOTIATION
Murillo MaletFranceAnna Fali UNQUALIFIED
Leja CaldareraUnited KingdomElwin Sharvill RENEWAL
Cody SaylorsFranceStephen Shaw RENEWAL
Kadeem FlosiRussiaIoni Bowcher RENEWAL
Jeanfrancois VenereSpainAmy Elsner NEW
James ButtJapanAnna Fali RENEWAL
Murillo MaletJapanAmy Elsner NEGOTIATION
Izzy GarufiSpainAmy Elsner PROPOSAL
James ButtSpainAmy Elsner RENEWAL
Sinclair WaycottItalyXuxue Feng QUALIFIED
Isabel BowleySpainAmy Elsner PROPOSAL
Darci PoquetteGermanyAnna Fali RENEWAL
Juan WieserBrazilXuxue Feng QUALIFIED
Greenwood BologniaGermanyIoni Bowcher RENEWAL
Horizontal
NameCountryRepresentativeStatus
James ButtCanadaBernardo Dominic UNQUALIFIED
Tony FollerFranceIvan Magalhaes QUALIFIED
Emily WhobreyIndiaIoni Bowcher UNQUALIFIED
Jefferson SchemmerGermanyAsiya Javayant RENEWAL
Ricardo GauchoAustraliaAsiya Javayant UNQUALIFIED
Aruna FigeroaSpainOnyama Limba NEW
Aditya KuskoSpainBernardo Dominic RENEWAL
Aruna FigeroaCanadaBernardo Dominic RENEWAL
Maisha RulapaughSpainBernardo Dominic QUALIFIED
Munro FerenczItalyXuxue Feng NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Greenwood BologniaGermany2026-05-07Rousseaux, Michael Esq UNQUALIFIED26Amy Elsner
1001Misaki RoysterUnited Kingdom2026-05-13Chapman, Ross E Esq UNQUALIFIED20Ivan Magalhaes
1002Smith GlickSpain2026-05-07Chanay, Jeffrey A Esq UNQUALIFIED96Asiya Javayant
1003Murillo MaletUnited Kingdom2026-05-03Rangoni Of Florence PROPOSAL1Onyama Limba
1004Leon OldroydBrazil2026-05-09Printing Dimensions UNQUALIFIED22Amy Elsner
1005James ButtJapan2026-05-02Benton, John B Jr RENEWAL64Ivan Magalhaes
1006Smith GlickJapan2026-05-11Rousseaux, Michael Esq NEW0Ioni Bowcher
1007David DarakjyArgentina2026-05-18King, Christopher A Esq UNQUALIFIED81Stephen Shaw
1008Mayumi KolmetzFrance2026-05-02Benton, John B Jr RENEWAL81Asiya Javayant
1009Darci PoquetteGermany2026-05-25Printing Dimensions QUALIFIED98Bernardo Dominic
1010Smith GlickIndia2026-04-26Chemel, James L Cpa NEW85Amy Elsner
1011Juan WieserSpain2026-05-15Morlong Associates NEW79Anna Fali
1012Maria MarrierCanada2026-04-30Rousseaux, Michael Esq UNQUALIFIED76Elwin Sharvill
1013Johnson SergiJapan2026-04-26Printing Dimensions NEW1Amy Elsner
1014Mujtaba NickaUnited Kingdom2026-05-25Chapman, Ross E Esq NEW9Anna Fali
1015Tony FollerRussia2026-05-02Chemel, James L Cpa NEW8Xuxue Feng
1016Nicolas IturbideItaly2026-05-12Commercial Press NEW92Xuxue Feng
1017Smith GlickSpain2026-05-19Chemel, James L Cpa QUALIFIED31Onyama Limba
1018Sinclair WaycottArgentina2026-04-26Rangoni Of Florence PROPOSAL90Asiya Javayant
1019Maisha RulapaughGermany2026-04-29Chemel, James L Cpa RENEWAL56Anna Fali
1020Stacey MacleadItaly2026-04-30Benton, John B Jr PROPOSAL93Stephen Shaw
1021Rodrigues CampainItaly2026-05-12Feltz Printing Service NEW82Ivan Magalhaes
1022Tony FollerGermany2026-05-23Feiner Bros NEW23Anna Fali
1023Kadeem FlosiCanada2026-05-03Dorl, James J Esq PROPOSAL74Asiya Javayant
1024Aditya KuskoFrance2026-05-15Rousseaux, Michael Esq NEW15Ivan Magalhaes
1025Izzy GarufiCanada2026-05-07Commercial Press NEGOTIATION89Asiya Javayant
1026Juan WieserRussia2026-04-26Morlong Associates NEGOTIATION16Asiya Javayant
1027Chavez BriddickArgentina2026-05-17Feiner Bros RENEWAL39Ivan Magalhaes
1028Munro FerenczRussia2026-04-29King, Christopher A Esq QUALIFIED88Amy Elsner
1029Misaki RoysterGermany2026-05-02Buckley Miller Wright PROPOSAL74Bernardo Dominic
1030Aika InouyeItaly2026-05-21Feltz Printing Service RENEWAL69Onyama Limba
1031Nicolas IturbideIndia2026-04-29Feiner Bros QUALIFIED18Ivan Magalhaes
1032Ricardo GauchoArgentina2026-05-20Feiner Bros NEW88Onyama Limba
1033Leon OldroydAustralia2026-05-06Dorl, James J Esq NEGOTIATION51Elwin Sharvill
1034Alejandro PerinCanada2026-04-30Commercial Press NEW69Ivan Magalhaes
1035Maisha RulapaughFrance2026-05-25Dorl, James J Esq NEW70Ivan Magalhaes
1036Murillo MaletCanada2026-05-14Truhlar And Truhlar Attys RENEWAL73Onyama Limba
1037Leja CaldareraJapan2026-05-14Truhlar And Truhlar Attys RENEWAL45Elwin Sharvill
1038Isabel BowleyAustralia2026-05-13Dorl, James J Esq NEGOTIATION87Anna Fali
1039Johnson SergiBrazil2026-05-20Feiner Bros NEGOTIATION15Amy Elsner
1040Arvin AlbaresJapan2026-05-21Dorl, James J Esq PROPOSAL99Ivan Magalhaes
1041Aditya KuskoGermany2026-05-03Truhlar And Truhlar Attys QUALIFIED4Ioni Bowcher
1042Maisha RulapaughSpain2026-05-11Feltz Printing Service NEW61Ivan Magalhaes
1043Arvin AlbaresBrazil2026-05-18Chapman, Ross E Esq UNQUALIFIED96Bernardo Dominic
1044Wickens NestleGermany2026-05-24Buckley Miller Wright NEW37Ivan Magalhaes
1045Leon OldroydUnited Kingdom2026-05-04Morlong Associates PROPOSAL74Anna Fali
1046Johnson SergiFrance2026-05-21Chemel, James L Cpa QUALIFIED10Stephen Shaw
1047Silvio SlusarskiItaly2026-04-30Benton, John B Jr NEW89Amy Elsner
1048Ricardo GauchoUnited Kingdom2026-05-12Chanay, Jeffrey A Esq PROPOSAL14Amy Elsner
1049Emily WhobreySpain2026-05-21Truhlar And Truhlar Attys RENEWAL78Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Claire TollnerFranceXuxue Feng UNQUALIFIED
Julie StensethUnited KingdomXuxue Feng PROPOSAL
Costa DilliardCanadaOnyama Limba NEGOTIATION
Antonio CaudyRussiaAsiya Javayant UNQUALIFIED
Kadeem FlosiArgentinaAmy Elsner NEW
James ButtCanadaAmy Elsner UNQUALIFIED
Emily WhobreyFranceElwin Sharvill RENEWAL
Jeanfrancois VenereGermanyIoni Bowcher RENEWAL
Kadeem FlosiCanadaAsiya Javayant PROPOSAL
Claire TollnerUnited KingdomOnyama Limba PROPOSAL
Cody SaylorsAustraliaAmy Elsner RENEWAL
Francesco ShinkoRussiaIvan Magalhaes RENEWAL
Munro FerenczFranceAsiya Javayant NEW
Ivar PaprockiSpainAsiya Javayant RENEWAL
Arvin AlbaresSpainBernardo Dominic PROPOSAL
Munro FerenczIndiaIoni Bowcher RENEWAL
Nicolas IturbideFranceStephen Shaw PROPOSAL
Julie StensethJapanOnyama Limba UNQUALIFIED
Clifford RimArgentinaAnna Fali NEW
Deepesh ChuiSpainOnyama Limba PROPOSAL
Arvin AlbaresAustraliaXuxue Feng NEGOTIATION
Julie StensethItalyXuxue Feng PROPOSAL
Aruna FigeroaUnited KingdomStephen Shaw PROPOSAL
Octavia MaletFranceStephen Shaw NEGOTIATION
Morrow RutaRussiaIoni Bowcher PROPOSAL
James ButtBrazilOnyama Limba NEW
Salvatore StockhamFranceElwin Sharvill NEW
Chavez BriddickSpainIvan Magalhaes NEW
Aika InouyeJapanAmy Elsner UNQUALIFIED
Isabel BowleyIndiaIvan Magalhaes NEGOTIATION
Cody SaylorsArgentinaOnyama Limba NEGOTIATION
Ricardo GauchoSpainElwin Sharvill PROPOSAL
Sinclair WaycottFranceAnna Fali UNQUALIFIED
Wickens NestleAustraliaElwin Sharvill NEW
Ricardo GauchoIndiaIoni Bowcher RENEWAL
Nicolas IturbideFranceIoni Bowcher NEW
Aruna FigeroaSpainIoni Bowcher RENEWAL
Ricardo GauchoRussiaAsiya Javayant NEGOTIATION
Faith GillianRussiaXuxue Feng QUALIFIED
Ricardo GauchoRussiaOnyama Limba QUALIFIED
Faith GillianFranceBernardo Dominic QUALIFIED
Faith GillianArgentinaAnna Fali RENEWAL
Izzy GarufiIndiaAmy Elsner NEGOTIATION
Faith GillianUnited KingdomAnna Fali NEGOTIATION
Faith GillianFranceStephen Shaw NEW
Maria MarrierFranceAmy Elsner RENEWAL
Octavia MaletRussiaStephen Shaw NEW
Jeanfrancois VenereSpainIoni Bowcher PROPOSAL
Deepesh ChuiSpainStephen Shaw UNQUALIFIED
Aika InouyeBrazilOnyama Limba PROPOSAL
Frozen Columns
Name
Aruna Figeroa
Costa Dilliard
Stacey Maclead
Ashley Doe
Jones Vocelka
Claire Tollner
Arvin Albares
Sinclair Waycott
Jefferson Schemmer
Munro Ferencz
Jeanfrancois Venere
Ashley Doe
Juan Wieser
Ricardo Gaucho
Maria Marrier
Juan Wieser
James Butt
Jeanfrancois Venere
Sinclair Waycott
Wickens Nestle
Juan Wieser
Salvatore Stockham
James Butt
Nicolas Iturbide
Costa Dilliard
James Butt
Kadeem Flosi
Misaki Royster
James Butt
Kadeem Flosi
Johnson Sergi
Alejandro Perin
Mujtaba Nicka
Kadeem Flosi
Aditya Kusko
David Darakjy
Aruna Figeroa
Aruna Figeroa
Cody Saylors
Silvio Slusarski
Francesco Shinko
Jennifer Amigon
David Darakjy
Ricardo Gaucho
Alejandro Perin
Isabel Bowley
Rodrigues Campain
James Butt
Cody Saylors
Murillo Malet
IdCountryDate
1000Japan2026-05-04
1001Russia2026-05-24
1002France2026-04-29
1003Canada2026-05-13
1004Russia2026-05-11
1005Australia2026-05-06
1006Brazil2026-05-17
1007Spain2026-05-24
1008Russia2026-05-03
1009Canada2026-05-23
1010France2026-05-23
1011Argentina2026-05-21
1012United Kingdom2026-04-26
1013Brazil2026-05-06
1014Japan2026-05-10
1015Argentina2026-04-27
1016Spain2026-05-05
1017Canada2026-05-08
1018Australia2026-04-28
1019Australia2026-05-05
1020Canada2026-05-25
1021Brazil2026-05-10
1022India2026-05-15
1023Australia2026-04-30
1024Germany2026-04-28
1025Argentina2026-05-20
1026India2026-04-26
1027Spain2026-05-20
1028Japan2026-05-18
1029India2026-05-12
1030Italy2026-04-28
1031India2026-05-13
1032Brazil2026-05-01
1033Russia2026-05-03
1034Australia2026-05-22
1035Japan2026-05-06
1036Italy2026-05-04
1037Italy2026-05-03
1038Australia2026-05-10
1039Argentina2026-05-16
1040France2026-05-01
1041Italy2026-04-26
1042Spain2026-04-30
1043Australia2026-04-29
1044Canada2026-05-19
1045France2026-05-12
1046Australia2026-05-16
1047United Kingdom2026-05-11
1048Brazil2026-05-01
1049Australia2026-05-25

On-Demand Data

NameIdCountryDate
Mayumi Kolmetz1000India2026-05-21
Alejandro Perin1001Australia2026-05-14
Emily Whobrey1002Argentina2026-05-20
Leja Caldarera1003Italy2026-05-03
James Butt1004Australia2026-05-12
Arvin Albares1005Italy2026-04-26
Alejandro Perin1006Japan2026-05-06
Deepesh Chui1007Spain2026-05-19
Faith Gillian1008France2026-05-18
Aditya Kusko1009Brazil2026-05-18
Ricardo Gaucho1010Argentina2026-05-10
Claire Tollner1011Spain2026-04-28
Murillo Malet1012India2026-05-02
Murillo Malet1013Canada2026-05-22
David Darakjy1014Brazil2026-05-12
Smith Glick1015United Kingdom2026-05-23
Mayumi Kolmetz1016Italy2026-05-07
Nicolas Iturbide1017Germany2026-05-14
Kaitlin Ostrosky1018Spain2026-05-07
Julie Stenseth1019Canada2026-05-10
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
James ButtJapanIoni Bowcher PROPOSAL
Silvio SlusarskiRussiaAmy Elsner PROPOSAL
Claire TollnerGermanyOnyama Limba NEW
Jeanfrancois VenereRussiaIoni Bowcher PROPOSAL
Misaki RoysterFranceElwin Sharvill NEGOTIATION
Leon OldroydJapanElwin Sharvill NEW
Leon OldroydGermanyAnna Fali NEW
Isabel BowleyUnited KingdomElwin Sharvill NEW
Aruna FigeroaUnited KingdomIoni Bowcher NEW
Faith GillianGermanyAsiya Javayant RENEWAL
Nicolas IturbideJapanStephen Shaw NEW
David DarakjyUnited KingdomIoni Bowcher RENEWAL
Stacey MacleadUnited KingdomStephen Shaw RENEWAL
Jennifer AmigonBrazilOnyama Limba NEW
David DarakjyUnited KingdomAnna Fali NEGOTIATION
Sinclair WaycottAustraliaAnna Fali QUALIFIED
Smith GlickCanadaBernardo Dominic RENEWAL
Nicolas IturbideBrazilBernardo Dominic NEGOTIATION
Claire TollnerUnited KingdomXuxue Feng QUALIFIED
Johnson SergiAustraliaAsiya Javayant NEGOTIATION
Costa DilliardIndiaAmy Elsner UNQUALIFIED
Murillo MaletGermanyElwin Sharvill QUALIFIED
Adams MorascaFranceXuxue Feng PROPOSAL
Maria MarrierCanadaBernardo Dominic RENEWAL
Smith GlickJapanIvan Magalhaes UNQUALIFIED
Jennifer AmigonArgentinaIoni Bowcher NEGOTIATION
Clifford RimItalyAsiya Javayant PROPOSAL
Silvio SlusarskiArgentinaIvan Magalhaes RENEWAL
Morrow RutaUnited KingdomAsiya Javayant QUALIFIED
Rodrigues CampainAustraliaAnna Fali NEW
Deepesh ChuiArgentinaElwin Sharvill PROPOSAL
Alejandro PerinRussiaBernardo Dominic RENEWAL
David DarakjyUnited KingdomElwin Sharvill NEGOTIATION
Cody SaylorsUnited KingdomStephen Shaw NEW
Izzy GarufiArgentinaIoni Bowcher QUALIFIED
Ashley DoeBrazilIvan Magalhaes UNQUALIFIED
Emily WhobreyJapanAsiya Javayant PROPOSAL
David DarakjyBrazilElwin Sharvill NEGOTIATION
Stacey MacleadIndiaElwin Sharvill RENEWAL
Clifford RimRussiaAsiya Javayant RENEWAL

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