Summer Sale is here 🏖️ Get 50% off with code PRSM25 Learn More

Locale

Change the locale of the datepicker, schedule and client side validation messages.

Language
English
English
English
French
German
German
German
Italian
Korean
Spanish
Catalan
Dutch
Portuguese
Portuguese
Arabic
Arabic
Bulgarian
Bangla
Bosnian
Czech
Greek
Persian
Finnish
Danish
Hindi
Indonesian
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

Themes

PrimeOne
Saga Blue Saga Blue
Vela Blue Vela Blue
Arya Blue Arya Blue
Bootstrap
Bootstrap Blue Light Bootstrap Blue Light
Bootstrap Purple Light Bootstrap Purple Light
Bootstrap Blue Dark Bootstrap Blue Dark
Bootstrap Purple Dark Bootstrap Purple Dark
Material Design
Material Indigo Light Material Indigo Light
Material Deep Purple Light Material Deep Purple Light
Material Indigo Dark Material Indigo Dark
Material Deep Purple Dark Material Deep Purple Dark
Material Design Compact
Material Compact Indigo Light Material Compact Indigo Light
Material Compact Deep Purple Light Material Compact Deep Purple Light
Material Compact Indigo Dark Material Compact Indigo Dark
Material Compact Deep Purple Dark Material Compact Deep Purple Dark
Legacy
Nova Light Nova Light
Nova Dark Nova Dark
Nova Colored Nova Colored
Luna Amber Luna Amber
Luna Blue Luna Blue
Luna Green Luna Green
Luna Pink Luna Pink

DataTable Scroll

Both vertical and horizontal scrolling of the data is supported with optional frozen rows-columns and on-demand loading features.

Vertical
NameCountryRepresentativeStatus
Mayumi C SaylorsGermanyAnna Fali NEW
Clifford T WhobreyBrazilIvan Magalhaes NEW
Salvatore B AmigonUnited KingdomElwin Sharvill NEGOTIATION
Nicolas T SchemmerArgentinaIoni Bowcher QUALIFIED
Aditya D FollerFranceStephen Shaw UNQUALIFIED
Ashley P MacleadBrazilOnyama Limba NEGOTIATION
Isabel O OstroskyItalyAnna Fali UNQUALIFIED
Julie D GauchoAustraliaElwin Sharvill PROPOSAL
Claire Y SlusarskiSpainElwin Sharvill NEW
David K MaletBrazilAnna Fali PROPOSAL
Kadeem H MarrierUnited KingdomElwin Sharvill PROPOSAL
Kaitlin J DarakjyArgentinaIoni Bowcher PROPOSAL
Antonio K SaylorsIndiaBernardo Dominic NEGOTIATION
Deepesh I StensethArgentinaXuxue Feng UNQUALIFIED
Aruna G RimItalyBernardo Dominic PROPOSAL
Johnson R FigeroaGermanyAnna Fali UNQUALIFIED
Alejandro X PoquetteArgentinaOnyama Limba QUALIFIED
Juan W WaycottSpainAsiya Javayant UNQUALIFIED
Rodrigues Z GillianAustraliaBernardo Dominic NEGOTIATION
Aruna I SaylorsFranceOnyama Limba NEW
Morrow X AlbaresCanadaXuxue Feng QUALIFIED
Nicolas D PerinIndiaIvan Magalhaes RENEWAL
James S GarufiAustraliaStephen Shaw QUALIFIED
Francesco V OstroskyGermanyAmy Elsner NEGOTIATION
Mujtaba Q AmigonGermanyIoni Bowcher NEW
Wickens G StensethBrazilBernardo Dominic RENEWAL
Costa E WieserItalyStephen Shaw QUALIFIED
Mujtaba X BriddickFranceAsiya Javayant UNQUALIFIED
Greenwood L CampainIndiaBernardo Dominic UNQUALIFIED
Faith Y CaudyUnited KingdomAmy Elsner NEGOTIATION
Ivar K DarakjyFranceIoni Bowcher NEW
Jones K FollerAustraliaStephen Shaw PROPOSAL
Chavez H NestleSpainOnyama Limba NEW
Jeanfrancois M RulapaughGermanyIoni Bowcher QUALIFIED
Mayumi C IturbideRussiaAsiya Javayant RENEWAL
Isabel Q AmigonUnited KingdomXuxue Feng NEW
Greenwood R NestleCanadaStephen Shaw NEGOTIATION
Johnson A NestleUnited KingdomXuxue Feng QUALIFIED
Faith Q WhobreyRussiaBernardo Dominic PROPOSAL
Tony P SchemmerFranceElwin Sharvill UNQUALIFIED
Mujtaba S MaletGermanyOnyama Limba RENEWAL
Munro V SchemmerGermanyAmy Elsner QUALIFIED
Ricardo O FerenczArgentinaAsiya Javayant RENEWAL
Misaki G GlickRussiaOnyama Limba PROPOSAL
Darci X WhobreyItalyIoni Bowcher PROPOSAL
Mujtaba A MaletBrazilXuxue Feng NEW
James L CaudyIndiaIvan Magalhaes NEGOTIATION
David I ShinkoItalyBernardo Dominic QUALIFIED
Chavez A SergiGermanyElwin Sharvill NEW
Johnson F PaprockiCanadaElwin Sharvill PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Aika S StockhamGermanyBernardo Dominic RENEWAL
Greenwood B BriddickCanadaBernardo Dominic PROPOSAL
Leon N FigeroaItalyElwin Sharvill NEGOTIATION
James U MarrierUnited KingdomStephen Shaw PROPOSAL
Morrow J NickaBrazilAnna Fali NEW
Clifford Q WaycottGermanyAnna Fali RENEWAL
Costa N GarufiCanadaBernardo Dominic NEGOTIATION
Misaki P AmigonAustraliaAnna Fali QUALIFIED
Mayumi G OstroskyRussiaStephen Shaw NEW
Leja B SergiFranceAmy Elsner NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Izzy E AmigonCanada2025-09-14Chapman, Ross E Esq PROPOSAL51Xuxue Feng
1001Mayumi E RutaItaly2025-10-01Printing Dimensions PROPOSAL98Xuxue Feng
1002Clifford G BriddickRussia2025-10-11Chapman, Ross E Esq RENEWAL11Amy Elsner
1003Izzy K ChuiGermany2025-09-22Benton, John B Jr PROPOSAL39Xuxue Feng
1004Nicolas R DoeUnited Kingdom2025-09-21Feiner Bros UNQUALIFIED47Asiya Javayant
1005Silvio Z SaylorsRussia2025-10-10Feiner Bros PROPOSAL97Amy Elsner
1006Juan C AmigonItaly2025-10-11Chapman, Ross E Esq RENEWAL96Anna Fali
1007Francesco K MorascaJapan2025-09-30Dorl, James J Esq NEGOTIATION1Xuxue Feng
1008Kaitlin V RoysterFrance2025-09-28Chemel, James L Cpa NEGOTIATION0Stephen Shaw
1009Jeanfrancois P OstroskyItaly2025-09-25Benton, John B Jr UNQUALIFIED21Anna Fali
1010Nicolas R FerenczGermany2025-09-21King, Christopher A Esq NEGOTIATION12Stephen Shaw
1011Isabel F GauchoCanada2025-10-06Commercial Press QUALIFIED35Asiya Javayant
1012David J BowleyGermany2025-09-20Commercial Press UNQUALIFIED70Onyama Limba
1013Tony A DarakjyArgentina2025-10-04Printing Dimensions UNQUALIFIED72Asiya Javayant
1014Faith N RulapaughArgentina2025-10-10Benton, John B Jr QUALIFIED57Asiya Javayant
1015David D TollnerItaly2025-09-17Benton, John B Jr RENEWAL66Ioni Bowcher
1016Salvatore F FerenczSpain2025-09-22Chemel, James L Cpa NEW66Asiya Javayant
1017Johnson M AlbaresArgentina2025-09-28Chemel, James L Cpa PROPOSAL59Xuxue Feng
1018Ashley S GillianGermany2025-10-07Chanay, Jeffrey A Esq UNQUALIFIED98Asiya Javayant
1019Aruna Z ChuiJapan2025-09-14Rangoni Of Florence UNQUALIFIED28Bernardo Dominic
1020Deepesh S PaprockiArgentina2025-10-02Feiner Bros NEGOTIATION45Ivan Magalhaes
1021Wickens L FlosiUnited Kingdom2025-10-01Printing Dimensions NEW2Elwin Sharvill
1022Clifford T MaletSpain2025-10-09Truhlar And Truhlar Attys NEGOTIATION54Elwin Sharvill
1023Antonio S DoeGermany2025-09-29Chemel, James L Cpa NEGOTIATION62Xuxue Feng
1024Alejandro S KuskoArgentina2025-10-06Chanay, Jeffrey A Esq QUALIFIED4Elwin Sharvill
1025Leja M ButtUnited Kingdom2025-09-29Printing Dimensions NEGOTIATION59Elwin Sharvill
1026James C GillianArgentina2025-09-21Rousseaux, Michael Esq UNQUALIFIED74Amy Elsner
1027Leon W FollerAustralia2025-10-12Truhlar And Truhlar Attys QUALIFIED62Stephen Shaw
1028Aruna O GillianJapan2025-09-17Truhlar And Truhlar Attys PROPOSAL43Onyama Limba
1029Kadeem L KuskoBrazil2025-09-21Commercial Press NEGOTIATION72Bernardo Dominic
1030Maria C SlusarskiJapan2025-10-12Truhlar And Truhlar Attys NEW90Ioni Bowcher
1031Claire T RulapaughSpain2025-09-18King, Christopher A Esq NEW85Stephen Shaw
1032Adams C InouyeItaly2025-09-26Feiner Bros UNQUALIFIED96Anna Fali
1033Octavia R SaylorsGermany2025-09-30Commercial Press UNQUALIFIED0Xuxue Feng
1034Arvin D WieserBrazil2025-09-29Commercial Press NEW11Ioni Bowcher
1035Chavez O SergiSpain2025-09-22Chanay, Jeffrey A Esq PROPOSAL44Ivan Magalhaes
1036Faith Y CaudyAustralia2025-09-14Rangoni Of Florence NEGOTIATION33Asiya Javayant
1037Adams N OldroydRussia2025-10-07Printing Dimensions PROPOSAL24Ioni Bowcher
1038Francesco N BologniaUnited Kingdom2025-09-30Dorl, James J Esq NEW95Asiya Javayant
1039Clifford M FlosiJapan2025-09-21Chemel, James L Cpa QUALIFIED55Ioni Bowcher
1040Wickens T AmigonFrance2025-09-27Chemel, James L Cpa NEGOTIATION10Bernardo Dominic
1041Kadeem D ButtIndia2025-09-20Commercial Press PROPOSAL96Ivan Magalhaes
1042Deepesh D DarakjySpain2025-09-21Benton, John B Jr UNQUALIFIED79Elwin Sharvill
1043Costa X MaletIndia2025-09-21Chapman, Ross E Esq NEW45Ivan Magalhaes
1044Maria Y SaylorsBrazil2025-10-08Rousseaux, Michael Esq QUALIFIED17Anna Fali
1045Greenwood P OstroskyUnited Kingdom2025-09-28Buckley Miller Wright NEW32Asiya Javayant
1046Silvio F FigeroaAustralia2025-09-30Benton, John B Jr NEGOTIATION88Onyama Limba
1047Maria R MaletFrance2025-09-13Dorl, James J Esq PROPOSAL56Bernardo Dominic
1048Leja S FollerJapan2025-09-19Rangoni Of Florence QUALIFIED95Onyama Limba
1049Morrow P WieserRussia2025-10-09Buckley Miller Wright NEGOTIATION7Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Mayumi Z VocelkaJapanIoni Bowcher PROPOSAL
Sinclair O FigeroaJapanIvan Magalhaes NEGOTIATION
Jefferson V NestleItalyOnyama Limba QUALIFIED
Octavia A RimUnited KingdomBernardo Dominic PROPOSAL
Claire J PoquetteUnited KingdomBernardo Dominic PROPOSAL
Chavez V BowleyCanadaOnyama Limba PROPOSAL
Julie I WhobreySpainAsiya Javayant QUALIFIED
Salvatore X StockhamBrazilStephen Shaw PROPOSAL
Kaitlin I KolmetzUnited KingdomBernardo Dominic QUALIFIED
Antonio L CaldareraUnited KingdomElwin Sharvill NEW
Ashley U FollerGermanyAmy Elsner NEW
Ashley Q SergiCanadaOnyama Limba QUALIFIED
Alejandro G WhobreyRussiaXuxue Feng PROPOSAL
Octavia R NestleBrazilOnyama Limba NEW
Faith A AmigonAustraliaBernardo Dominic UNQUALIFIED
Darci M RulapaughCanadaBernardo Dominic NEW
Darci N SaylorsItalyIvan Magalhaes NEW
Greenwood Y AlbaresIndiaStephen Shaw QUALIFIED
Salvatore N ChuiSpainIoni Bowcher RENEWAL
Ricardo Y BologniaCanadaAmy Elsner RENEWAL
Ashley P AlbaresUnited KingdomAmy Elsner RENEWAL
Cody O VocelkaArgentinaOnyama Limba NEW
Leja P StockhamUnited KingdomAnna Fali UNQUALIFIED
David W GauchoIndiaAnna Fali RENEWAL
Ivar I RutaGermanyIoni Bowcher UNQUALIFIED
Munro M WaycottArgentinaBernardo Dominic UNQUALIFIED
Maisha N FollerAustraliaAnna Fali QUALIFIED
James H PerinIndiaAsiya Javayant NEGOTIATION
Ashley F DilliardSpainIvan Magalhaes RENEWAL
Sinclair X SergiJapanAnna Fali NEW
Tony X FerenczJapanStephen Shaw NEGOTIATION
Juan T GauchoArgentinaIvan Magalhaes QUALIFIED
Antonio U ButtUnited KingdomStephen Shaw NEW
Rodrigues V KolmetzAustraliaIoni Bowcher NEW
Smith Q VocelkaJapanIoni Bowcher RENEWAL
Adams Y InouyeCanadaAmy Elsner PROPOSAL
Greenwood T WieserIndiaStephen Shaw NEW
Alejandro D BowleyFranceIvan Magalhaes RENEWAL
Leon J RulapaughBrazilIoni Bowcher RENEWAL
Julie W BologniaSpainAsiya Javayant RENEWAL
Jennifer G VenereIndiaOnyama Limba PROPOSAL
Smith A MaletJapanIoni Bowcher PROPOSAL
Ricardo T MaletArgentinaElwin Sharvill NEGOTIATION
Claire T AlbaresJapanIoni Bowcher QUALIFIED
Arvin K StockhamSpainXuxue Feng QUALIFIED
Arvin D GillianGermanyAmy Elsner UNQUALIFIED
Misaki A FollerCanadaOnyama Limba UNQUALIFIED
Juan W FollerArgentinaIvan Magalhaes NEGOTIATION
Wickens B KuskoIndiaOnyama Limba PROPOSAL
Maisha S RutaCanadaAsiya Javayant NEGOTIATION
Frozen Columns
Name
Greenwood Q Figeroa
Arvin F Figeroa
Jeanfrancois C Gillian
Aika T Oldroyd
Octavia J Gaucho
Leon T Schemmer
Wickens W Doe
Sinclair Y Dilliard
Mujtaba Z Briddick
Kaitlin R Shinko
Kaitlin U Campain
Jennifer M Malet
Smith Q Maclead
Clifford X Perin
Jones P Doe
Rodrigues F Ruta
James Q Royster
Izzy Y Gaucho
Maisha N Doe
Julie S Vocelka
Maisha O Paprocki
Aruna O Bolognia
Clifford L Ferencz
Leon J Rulapaugh
Deepesh W Shinko
Isabel K Perin
Mayumi P Chui
Leja L Waycott
Mayumi X Ruta
Kadeem A Ferencz
Rodrigues J Butt
Clifford O Saylors
Izzy O Waycott
Costa T Sergi
Nicolas Z Campain
Aditya A Caldarera
Leja F Saylors
Cody O Flosi
Darci B Bolognia
Misaki V Stockham
Murillo C Nestle
Mayumi Z Schemmer
Greenwood V Schemmer
Munro N Wieser
Jeanfrancois P Gillian
Jeanfrancois R Garufi
Salvatore C Ostrosky
Jefferson K Garufi
Alejandro B Kolmetz
Costa S Foller
IdCountryDate
1000Canada2025-10-03
1001Australia2025-09-17
1002India2025-10-08
1003Japan2025-10-07
1004United Kingdom2025-09-20
1005Germany2025-10-05
1006Italy2025-09-27
1007Canada2025-09-13
1008Spain2025-09-30
1009Argentina2025-09-21
1010Brazil2025-09-27
1011Brazil2025-10-02
1012Australia2025-09-23
1013Australia2025-09-24
1014Argentina2025-09-21
1015Brazil2025-09-26
1016Russia2025-10-11
1017France2025-09-15
1018Germany2025-10-06
1019Australia2025-09-20
1020Australia2025-09-24
1021Brazil2025-09-25
1022Russia2025-10-04
1023Argentina2025-10-07
1024United Kingdom2025-10-12
1025Japan2025-10-01
1026Brazil2025-10-04
1027Canada2025-10-09
1028France2025-10-05
1029Argentina2025-10-03
1030Brazil2025-09-17
1031India2025-09-13
1032France2025-10-08
1033Spain2025-09-14
1034Italy2025-10-03
1035Canada2025-09-18
1036Australia2025-10-01
1037France2025-09-26
1038Italy2025-09-17
1039United Kingdom2025-09-28
1040Japan2025-10-11
1041Australia2025-10-02
1042Argentina2025-10-12
1043Japan2025-09-14
1044Argentina2025-09-21
1045Germany2025-09-21
1046Canada2025-09-30
1047India2025-09-21
1048Australia2025-09-22
1049Japan2025-09-23

On-Demand Data

NameIdCountryDate
Ivar Z Tollner1000Spain2025-09-16
Arvin D Ferencz1001Russia2025-10-08
Darci I Morasca1002Italy2025-10-01
Mujtaba B Sergi1003Spain2025-09-22
Julie B Iturbide1004Spain2025-09-15
Antonio M Inouye1005Germany2025-09-26
Ivar J Stenseth1006Australia2025-09-20
Ashley B Ostrosky1007Italy2025-09-26
David N Gaucho1008Argentina2025-09-18
Alejandro E Flosi1009Russia2025-10-08
Morrow B Bolognia1010Canada2025-09-24
Claire B Bowley1011Australia2025-09-30
Ashley D Rulapaugh1012United Kingdom2025-10-05
Alejandro L Malet1013India2025-09-22
Chavez W Ostrosky1014Australia2025-09-28
Sinclair H Tollner1015France2025-10-02
Aruna G Whobrey1016Canada2025-10-06
Salvatore L Marrier1017Germany2025-09-20
Greenwood C Inouye1018United Kingdom2025-09-20
Jeanfrancois J Butt1019India2025-09-14
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Kadeem A OstroskyGermanyAmy Elsner NEGOTIATION
Mujtaba U VenereAustraliaIoni Bowcher RENEWAL
Arvin Q DarakjyCanadaOnyama Limba QUALIFIED
Ivar X RimAustraliaAmy Elsner UNQUALIFIED
Silvio S GauchoArgentinaAmy Elsner NEGOTIATION
Antonio C SlusarskiAustraliaIoni Bowcher QUALIFIED
Faith Z NestleItalyStephen Shaw PROPOSAL
Jones D OstroskyItalyIvan Magalhaes UNQUALIFIED
Kadeem M TollnerAustraliaOnyama Limba NEGOTIATION
Silvio C VenereFranceAmy Elsner QUALIFIED
Julie C RulapaughAustraliaOnyama Limba PROPOSAL
Alejandro L NestleRussiaAmy Elsner PROPOSAL
Ivar U StockhamArgentinaAsiya Javayant NEW
Jones S OstroskySpainAsiya Javayant NEW
Mujtaba I PoquetteSpainIoni Bowcher UNQUALIFIED
Johnson A IturbideBrazilBernardo Dominic NEGOTIATION
Faith U GauchoRussiaAsiya Javayant UNQUALIFIED
Isabel R SlusarskiSpainBernardo Dominic RENEWAL
James C RulapaughSpainElwin Sharvill RENEWAL
Julie Z SaylorsUnited KingdomStephen Shaw NEW
Misaki Q DarakjyFranceStephen Shaw NEW
Wickens E RulapaughItalyAmy Elsner NEW
Sinclair S VocelkaFranceOnyama Limba NEW
Ashley B OldroydItalyIvan Magalhaes NEW
Emily Y MaletItalyAnna Fali UNQUALIFIED
Francesco A SlusarskiFranceElwin Sharvill NEGOTIATION
Claire S MorascaGermanyAmy Elsner NEGOTIATION
Salvatore R AlbaresArgentinaElwin Sharvill NEW
Ricardo R VocelkaBrazilIoni Bowcher NEGOTIATION
Chavez W GlickGermanyStephen Shaw QUALIFIED
Aditya X MarrierUnited KingdomOnyama Limba QUALIFIED
Antonio W CampainSpainStephen Shaw UNQUALIFIED
Murillo O PoquetteUnited KingdomIvan Magalhaes UNQUALIFIED
Antonio O WhobreyCanadaXuxue Feng UNQUALIFIED
Nicolas K AmigonIndiaIvan Magalhaes PROPOSAL
Claire X MorascaItalyOnyama Limba UNQUALIFIED
Sinclair H BowleyArgentinaIvan Magalhaes QUALIFIED
Ricardo D SaylorsBrazilBernardo Dominic NEGOTIATION
Greenwood N GlickSpainAnna Fali PROPOSAL
Kaitlin N PoquetteAustraliaXuxue Feng 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.name().toLowerCase()}">#{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.name().toLowerCase()}">#{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.name().toLowerCase()}">#{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.name().toLowerCase()}">#{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" frozenColumnsAlignment="left">
            <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.name().toLowerCase()}">#{customer.status}</span>
            </p:column>
        </p:dataTable>
    </div>

</h:form>