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

Input Style

Themes

PrimeOne
Saga Saga
Vela Vela
Arya Arya
Bootstrap
bootstrap4-blue-light Bootstrap Blue
bootstrap4-purple-light Bootstrap Purple
bootstrap4-blue-dark Bootstrap Blue
bootstrap4-purple-dark Bootstrap Purple
Material Design
material-indigo-light Indigo
material-deeppurple-light' Deep Purple
material-indigo-dark Indigo
material-deeppurple-dark' Deep Purple
Material Design Compact
material-indigo-light Indigo
material-deeppurple-light' Deep Purple
material-indigo-dark Indigo
material-deeppurple-dark' Deep Purple

DataTable Scroll

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

Vertical
NameCountryRepresentativeStatus
Sinclair L BriddickJapanBernardo Dominic PROPOSAL
Silvio D PoquetteRussiaIoni Bowcher RENEWAL
Tony D ChuiSpainAsiya Javayant QUALIFIED
Smith A RimRussiaAnna Fali NEW
Izzy Z SaylorsJapanAmy Elsner QUALIFIED
Clifford N FerenczAustraliaOnyama Limba PROPOSAL
Maria S NickaRussiaIoni Bowcher PROPOSAL
Sinclair A WaycottCanadaAsiya Javayant RENEWAL
Isabel T MorascaJapanElwin Sharvill QUALIFIED
Julie W FlosiFranceElwin Sharvill NEW
Jefferson E WaycottArgentinaElwin Sharvill RENEWAL
Ivar M KuskoRussiaXuxue Feng NEW
Greenwood R StensethUnited KingdomIoni Bowcher NEGOTIATION
Greenwood U DoeRussiaElwin Sharvill PROPOSAL
David A VenereAustraliaIoni Bowcher QUALIFIED
Tony Z GillianAustraliaXuxue Feng NEW
Faith Q StensethGermanyElwin Sharvill QUALIFIED
Francesco H WaycottSpainAmy Elsner NEW
Rodrigues Y BologniaCanadaBernardo Dominic NEGOTIATION
Isabel M RoysterItalyOnyama Limba QUALIFIED
Juan N FollerRussiaAmy Elsner QUALIFIED
Sinclair M MorascaJapanStephen Shaw PROPOSAL
Aruna K CaldareraAustraliaOnyama Limba UNQUALIFIED
Mujtaba W CampainItalyBernardo Dominic NEGOTIATION
Ashley U FigeroaJapanAsiya Javayant UNQUALIFIED
Juan U CampainJapanAnna Fali NEGOTIATION
Smith D SaylorsJapanStephen Shaw RENEWAL
Adams B MorascaAustraliaIvan Magalhaes RENEWAL
Salvatore Y VocelkaArgentinaIoni Bowcher NEGOTIATION
Clifford S VenereBrazilIoni Bowcher NEW
Isabel X ShinkoFranceElwin Sharvill QUALIFIED
Murillo B SchemmerBrazilIoni Bowcher NEGOTIATION
Mayumi K FerenczCanadaOnyama Limba PROPOSAL
David X RoysterIndiaAnna Fali NEW
Jeanfrancois E MarrierArgentinaXuxue Feng QUALIFIED
Silvio B OstroskyUnited KingdomIvan Magalhaes NEW
Tony E CaldareraItalyOnyama Limba QUALIFIED
Jefferson S GillianUnited KingdomAsiya Javayant NEW
Smith T WaycottRussiaOnyama Limba RENEWAL
Arvin B CaudyJapanIoni Bowcher UNQUALIFIED
Morrow V RulapaughSpainXuxue Feng QUALIFIED
Maria O MacleadRussiaOnyama Limba NEW
Costa U MorascaArgentinaIoni Bowcher NEW
Tony B GauchoItalyIvan Magalhaes QUALIFIED
Aditya R TollnerRussiaBernardo Dominic NEW
Salvatore W PoquetteArgentinaElwin Sharvill RENEWAL
Isabel T DarakjyRussiaIvan Magalhaes UNQUALIFIED
Leja Z DoeJapanAmy Elsner NEGOTIATION
Kadeem Y MacleadIndiaAmy Elsner UNQUALIFIED
Morrow I BologniaAustraliaAnna Fali UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Maria W ButtRussiaStephen Shaw PROPOSAL
Rodrigues E MarrierGermanyStephen Shaw NEW
Silvio C MaletBrazilAmy Elsner NEGOTIATION
Maisha D CaldareraJapanIoni Bowcher NEGOTIATION
Rodrigues V PaprockiCanadaElwin Sharvill QUALIFIED
Leja R CampainIndiaIvan Magalhaes UNQUALIFIED
Ricardo J WaycottGermanyBernardo Dominic RENEWAL
James P RulapaughBrazilAnna Fali RENEWAL
Maisha T InouyeFranceOnyama Limba PROPOSAL
Isabel U PoquetteIndiaAmy Elsner QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Arvin U RoysterArgentina2025-06-03Commercial Press NEW47Amy Elsner
1001Mujtaba Q SchemmerSpain2025-05-21Morlong Associates QUALIFIED74Ivan Magalhaes
1002Rodrigues H NickaBrazil2025-05-18Morlong Associates PROPOSAL37Amy Elsner
1003Izzy J GauchoFrance2025-06-01Feltz Printing Service NEGOTIATION4Amy Elsner
1004Juan L ChuiRussia2025-05-23Rousseaux, Michael Esq NEGOTIATION11Bernardo Dominic
1005Deepesh Q MaletUnited Kingdom2025-06-02Feiner Bros NEW2Stephen Shaw
1006Aditya T NestleFrance2025-05-16Chanay, Jeffrey A Esq NEGOTIATION65Asiya Javayant
1007Octavia Z StensethGermany2025-05-18Printing Dimensions NEW97Amy Elsner
1008Ricardo D RoysterGermany2025-05-18Rangoni Of Florence UNQUALIFIED84Ivan Magalhaes
1009Leja A PerinAustralia2025-06-11Dorl, James J Esq PROPOSAL89Asiya Javayant
1010Alejandro R StensethIndia2025-06-10Truhlar And Truhlar Attys UNQUALIFIED70Xuxue Feng
1011Tony C TollnerBrazil2025-05-29Truhlar And Truhlar Attys NEW15Ivan Magalhaes
1012Ashley S WhobreyItaly2025-05-21Feiner Bros PROPOSAL8Amy Elsner
1013Maisha S WieserSpain2025-05-17Rangoni Of Florence NEGOTIATION2Amy Elsner
1014Sinclair R KuskoIndia2025-06-10Benton, John B Jr PROPOSAL18Elwin Sharvill
1015Chavez H IturbideSpain2025-06-03Chemel, James L Cpa QUALIFIED14Stephen Shaw
1016Munro Z StensethFrance2025-05-31Benton, John B Jr UNQUALIFIED92Stephen Shaw
1017Sinclair E SchemmerArgentina2025-05-28Truhlar And Truhlar Attys UNQUALIFIED98Ioni Bowcher
1018Cody U PoquetteIndia2025-05-31Commercial Press NEGOTIATION52Ioni Bowcher
1019Deepesh X NestleIndia2025-05-20Rousseaux, Michael Esq NEW39Asiya Javayant
1020Murillo M RutaFrance2025-05-23Chanay, Jeffrey A Esq NEGOTIATION65Anna Fali
1021Misaki R BologniaAustralia2025-06-05Feltz Printing Service UNQUALIFIED99Ioni Bowcher
1022Juan R FerenczGermany2025-05-18Chemel, James L Cpa NEGOTIATION37Amy Elsner
1023Octavia Z SchemmerIndia2025-06-10Rangoni Of Florence PROPOSAL50Onyama Limba
1024Wickens U AmigonUnited Kingdom2025-06-07Morlong Associates NEW90Amy Elsner
1025Wickens Y PoquetteUnited Kingdom2025-05-29Feltz Printing Service NEGOTIATION11Asiya Javayant
1026Julie V WaycottBrazil2025-05-26Buckley Miller Wright NEGOTIATION23Ivan Magalhaes
1027Nicolas S DarakjyRussia2025-05-23Feltz Printing Service NEW42Ivan Magalhaes
1028Maisha J BriddickFrance2025-06-09Feiner Bros QUALIFIED5Xuxue Feng
1029Darci E CaldareraCanada2025-05-26Truhlar And Truhlar Attys QUALIFIED95Bernardo Dominic
1030Mayumi C BriddickFrance2025-06-02Dorl, James J Esq NEW19Xuxue Feng
1031Emily I CampainIndia2025-06-07Chanay, Jeffrey A Esq NEW79Anna Fali
1032Jeanfrancois T DoeSpain2025-06-14Rangoni Of Florence RENEWAL93Stephen Shaw
1033Octavia K KuskoGermany2025-06-06Rousseaux, Michael Esq PROPOSAL61Ioni Bowcher
1034Rodrigues L SaylorsUnited Kingdom2025-06-05Printing Dimensions RENEWAL3Amy Elsner
1035Mujtaba A GauchoSpain2025-05-16Rangoni Of Florence QUALIFIED78Ivan Magalhaes
1036Kadeem M SergiBrazil2025-05-26Morlong Associates NEW96Elwin Sharvill
1037Tony N BowleyCanada2025-06-09Rangoni Of Florence RENEWAL63Elwin Sharvill
1038Faith T GauchoUnited Kingdom2025-05-23Rangoni Of Florence PROPOSAL16Elwin Sharvill
1039Chavez F ChuiAustralia2025-05-23Morlong Associates NEW2Onyama Limba
1040Morrow U SaylorsSpain2025-05-29Truhlar And Truhlar Attys NEW22Elwin Sharvill
1041Stacey M OldroydArgentina2025-06-10Chapman, Ross E Esq NEW0Xuxue Feng
1042Claire M PaprockiRussia2025-06-13Chapman, Ross E Esq QUALIFIED22Onyama Limba
1043Tony F CaudyRussia2025-06-09Morlong Associates UNQUALIFIED36Xuxue Feng
1044Salvatore E MaletAustralia2025-06-06Feiner Bros NEW28Anna Fali
1045Claire O MorascaSpain2025-05-19Dorl, James J Esq QUALIFIED80Stephen Shaw
1046Faith N SergiJapan2025-06-02Feltz Printing Service PROPOSAL39Amy Elsner
1047Jones O OldroydBrazil2025-05-23Rangoni Of Florence RENEWAL53Onyama Limba
1048Antonio V MaletUnited Kingdom2025-05-22Buckley Miller Wright QUALIFIED67Anna Fali
1049Jones J MorascaRussia2025-05-27Feltz Printing Service RENEWAL14Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Deepesh K OldroydRussiaAmy Elsner NEGOTIATION
Cody P KuskoIndiaIvan Magalhaes UNQUALIFIED
Julie M SchemmerFranceAsiya Javayant PROPOSAL
Emily K MaletUnited KingdomElwin Sharvill UNQUALIFIED
Morrow U OldroydArgentinaXuxue Feng PROPOSAL
Ricardo W FerenczIndiaBernardo Dominic UNQUALIFIED
Emily O BologniaIndiaAsiya Javayant RENEWAL
Mayumi L RulapaughRussiaElwin Sharvill RENEWAL
Deepesh B CaudyRussiaElwin Sharvill NEW
Emily U OldroydSpainAsiya Javayant PROPOSAL
Aruna T PerinUnited KingdomOnyama Limba NEGOTIATION
Smith T DarakjyAustraliaBernardo Dominic NEW
Juan R FigeroaRussiaXuxue Feng QUALIFIED
Isabel N RimUnited KingdomBernardo Dominic UNQUALIFIED
Ricardo L MaletJapanAmy Elsner UNQUALIFIED
Arvin Y PoquetteCanadaElwin Sharvill NEW
Misaki X CaldareraBrazilElwin Sharvill PROPOSAL
Cody C MarrierItalyAsiya Javayant PROPOSAL
Jefferson R DoeJapanBernardo Dominic PROPOSAL
Salvatore P DilliardSpainStephen Shaw PROPOSAL
Wickens E WieserItalyAnna Fali RENEWAL
Claire M PoquetteBrazilAnna Fali RENEWAL
Tony G MarrierSpainXuxue Feng RENEWAL
Greenwood X DoeUnited KingdomStephen Shaw RENEWAL
Murillo R SchemmerAustraliaAsiya Javayant NEW
Arvin I IturbideJapanStephen Shaw RENEWAL
Sinclair J WhobreyFranceOnyama Limba UNQUALIFIED
Octavia J AmigonBrazilAmy Elsner UNQUALIFIED
Jones R MaletFranceAmy Elsner NEW
Tony V StensethBrazilAmy Elsner NEW
Ashley N CampainRussiaStephen Shaw NEW
Leja G OstroskySpainAsiya Javayant QUALIFIED
Mujtaba I StockhamJapanIoni Bowcher PROPOSAL
Morrow F MaletJapanAnna Fali RENEWAL
Octavia L DoeArgentinaAmy Elsner NEW
Mayumi M GillianArgentinaAmy Elsner NEGOTIATION
Aika C PaprockiUnited KingdomBernardo Dominic NEGOTIATION
Octavia S StensethSpainAsiya Javayant PROPOSAL
Cody T RimJapanIvan Magalhaes NEGOTIATION
Clifford C WaycottCanadaIvan Magalhaes NEW
Faith A FollerSpainAmy Elsner NEW
Jennifer A BologniaCanadaIvan Magalhaes NEW
Silvio P MacleadFranceStephen Shaw PROPOSAL
Jennifer I MarrierIndiaIoni Bowcher QUALIFIED
Maria Y BologniaCanadaElwin Sharvill QUALIFIED
Cody X MacleadFranceIoni Bowcher NEW
Antonio V VenereSpainIvan Magalhaes PROPOSAL
Cody P KuskoCanadaAnna Fali RENEWAL
Darci L CampainSpainStephen Shaw NEW
Johnson B CampainUnited KingdomAnna Fali NEW
Frozen Columns
Name
Deepesh Y Saylors
Jennifer K Stenseth
Johnson K Slusarski
Leon L Butt
Munro J Foller
Greenwood W Bowley
Jefferson S Campain
Clifford T Garufi
Nicolas E Perin
Aruna G Nestle
Adams Y Caudy
Jefferson Z Tollner
Rodrigues O Kusko
Antonio O Bowley
Jeanfrancois G Malet
Wickens S Whobrey
Isabel C Tollner
Jefferson X Caudy
Jefferson I Bowley
Salvatore B Oldroyd
Munro R Royster
Ivar F Darakjy
Octavia L Flosi
James X Doe
Wickens Y Shinko
Greenwood K Nestle
Johnson O Malet
Aditya I Ostrosky
Chavez N Darakjy
Mayumi F Darakjy
Jefferson Q Maclead
Alejandro Y Stenseth
Arvin I Bolognia
David S Stenseth
Mujtaba S Campain
Mayumi W Gillian
Smith V Malet
Johnson E Chui
Salvatore I Stockham
Faith Z Morasca
Jennifer N Albares
Maisha B Waycott
Julie M Caldarera
Costa I Oldroyd
Johnson G Shinko
Stacey H Shinko
Aditya C Kusko
Johnson H Iturbide
Misaki W Briddick
Salvatore Z Campain
IdCountryDate
1000Spain2025-05-28
1001Spain2025-06-02
1002Spain2025-06-14
1003Argentina2025-05-17
1004Australia2025-05-29
1005Canada2025-06-11
1006Spain2025-06-08
1007United Kingdom2025-05-22
1008India2025-05-16
1009India2025-06-12
1010France2025-06-02
1011Canada2025-05-25
1012United Kingdom2025-05-23
1013Argentina2025-06-04
1014Argentina2025-05-29
1015Brazil2025-05-19
1016India2025-05-29
1017Australia2025-05-25
1018Japan2025-05-28
1019India2025-06-01
1020India2025-06-02
1021Canada2025-05-18
1022Italy2025-06-04
1023Australia2025-05-21
1024Germany2025-06-13
1025Australia2025-06-14
1026Spain2025-05-30
1027Japan2025-06-06
1028Brazil2025-05-23
1029Germany2025-05-31
1030United Kingdom2025-05-30
1031Argentina2025-06-01
1032Germany2025-05-30
1033Spain2025-06-04
1034Canada2025-05-21
1035India2025-06-12
1036United Kingdom2025-05-20
1037India2025-05-23
1038Canada2025-06-03
1039United Kingdom2025-06-04
1040Japan2025-05-20
1041Australia2025-05-22
1042Canada2025-06-09
1043France2025-05-19
1044United Kingdom2025-05-30
1045Italy2025-05-22
1046United Kingdom2025-05-26
1047Argentina2025-05-20
1048Germany2025-05-20
1049Russia2025-06-04

On-Demand Data

NameIdCountryDate
Cody D Doe1000Brazil2025-06-01
Munro R Doe1001United Kingdom2025-06-02
Murillo P Amigon1002Russia2025-06-08
Darci J Glick1003Germany2025-05-26
Munro X Bowley1004France2025-06-01
Clifford I Rulapaugh1005India2025-06-14
Claire B Marrier1006Italy2025-05-29
Misaki G Sergi1007Germany2025-05-24
Emily W Oldroyd1008United Kingdom2025-06-02
Faith O Malet1009India2025-06-12
Isabel F Saylors1010Argentina2025-05-30
Ivar F Rulapaugh1011Brazil2025-05-23
Leja V Royster1012Australia2025-05-27
Antonio Y Shinko1013France2025-05-29
Claire H Malet1014India2025-06-02
Juan D Oldroyd1015United Kingdom2025-05-17
Greenwood K Bolognia1016Brazil2025-05-17
Isabel W Nicka1017Germany2025-06-03
Aruna F Ostrosky1018Canada2025-06-14
Jefferson J Darakjy1019Canada2025-06-07
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Rodrigues X OldroydRussiaIoni Bowcher PROPOSAL
Morrow U FlosiBrazilAnna Fali NEW
Izzy F WhobreyIndiaAnna Fali QUALIFIED
Jennifer W MacleadIndiaBernardo Dominic PROPOSAL
Cody N KolmetzAustraliaIoni Bowcher NEGOTIATION
Jones X StockhamIndiaStephen Shaw PROPOSAL
Sinclair N CaudyJapanIvan Magalhaes NEGOTIATION
Ashley Q FerenczFranceIvan Magalhaes NEGOTIATION
Sinclair B AlbaresArgentinaIvan Magalhaes RENEWAL
Jefferson Q ShinkoArgentinaElwin Sharvill PROPOSAL
Ricardo Y FlosiItalyElwin Sharvill PROPOSAL
Munro I TollnerSpainElwin Sharvill NEW
Maria R MaletItalyElwin Sharvill PROPOSAL
Chavez K RutaFranceIoni Bowcher NEGOTIATION
Jefferson Z ButtUnited KingdomXuxue Feng NEW
Greenwood K MarrierIndiaIoni Bowcher RENEWAL
Jones F MaletAustraliaXuxue Feng PROPOSAL
Emily V KolmetzGermanyIoni Bowcher QUALIFIED
Misaki D AlbaresAustraliaAnna Fali NEW
Antonio B CaudyFranceElwin Sharvill UNQUALIFIED
Darci X NickaSpainAmy Elsner RENEWAL
Salvatore X StensethIndiaAsiya Javayant NEGOTIATION
Chavez I GarufiUnited KingdomIvan Magalhaes RENEWAL
Misaki K WieserAustraliaIvan Magalhaes QUALIFIED
Claire B MarrierAustraliaAsiya Javayant NEGOTIATION
Ivar C ShinkoAustraliaStephen Shaw RENEWAL
Smith Y VocelkaSpainOnyama Limba PROPOSAL
Mujtaba R FerenczArgentinaOnyama Limba NEGOTIATION
Jefferson T MarrierItalyBernardo Dominic RENEWAL
Smith U AlbaresItalyAsiya Javayant NEW
James B MacleadBrazilAnna Fali RENEWAL
Aditya J SaylorsCanadaBernardo Dominic QUALIFIED
Deepesh L AlbaresRussiaIvan Magalhaes RENEWAL
Murillo R PerinFranceAsiya Javayant NEW
James U RoysterSpainAsiya Javayant RENEWAL
Julie F GarufiJapanBernardo Dominic RENEWAL
Darci X FerenczItalyXuxue Feng QUALIFIED
Deepesh B GlickIndiaIvan Magalhaes UNQUALIFIED
Francesco K OstroskyCanadaAnna Fali UNQUALIFIED
Darci H FlosiUnited KingdomIoni Bowcher NEW

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