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
Murillo S RimIndiaAsiya Javayant UNQUALIFIED
Jennifer T BowleyFranceAmy Elsner QUALIFIED
Ricardo Y SergiArgentinaAsiya Javayant RENEWAL
Aruna G MarrierRussiaIoni Bowcher RENEWAL
Ricardo Z KolmetzRussiaXuxue Feng UNQUALIFIED
Nicolas D CaldareraJapanBernardo Dominic NEW
Kadeem Y MaletAustraliaAsiya Javayant NEW
Smith H DarakjySpainElwin Sharvill PROPOSAL
Jeanfrancois J AlbaresRussiaXuxue Feng QUALIFIED
Julie O AmigonItalyXuxue Feng NEW
Leon O CampainGermanyIvan Magalhaes QUALIFIED
Aika M PoquetteAustraliaXuxue Feng RENEWAL
Jones U IturbideAustraliaAnna Fali RENEWAL
Nicolas O KolmetzUnited KingdomElwin Sharvill NEGOTIATION
Arvin A CaldareraItalyIoni Bowcher NEW
Izzy Q DarakjyRussiaIoni Bowcher PROPOSAL
Johnson O BriddickSpainAmy Elsner QUALIFIED
Silvio T FlosiSpainOnyama Limba RENEWAL
Leja J MacleadJapanStephen Shaw NEGOTIATION
Aditya R TollnerArgentinaIoni Bowcher RENEWAL
Stacey X NestleItalyIoni Bowcher UNQUALIFIED
Misaki S KuskoSpainAmy Elsner UNQUALIFIED
Aditya O SchemmerUnited KingdomElwin Sharvill NEGOTIATION
Morrow I MacleadBrazilOnyama Limba NEGOTIATION
Juan U ButtAustraliaIvan Magalhaes NEW
Wickens Y WhobreyJapanBernardo Dominic NEGOTIATION
Ashley A GauchoAustraliaStephen Shaw RENEWAL
Aditya N KuskoArgentinaIvan Magalhaes NEGOTIATION
David U NestleFranceAsiya Javayant UNQUALIFIED
Maria K PoquetteRussiaStephen Shaw RENEWAL
Mayumi E DilliardRussiaIvan Magalhaes NEGOTIATION
Aika T SergiGermanyIvan Magalhaes NEGOTIATION
Murillo P PaprockiSpainBernardo Dominic UNQUALIFIED
Jones S FlosiBrazilOnyama Limba NEW
Cody I BologniaBrazilIvan Magalhaes PROPOSAL
Deepesh W StockhamSpainIvan Magalhaes UNQUALIFIED
Silvio R MaletJapanAmy Elsner RENEWAL
Kaitlin J VocelkaUnited KingdomElwin Sharvill QUALIFIED
Murillo H PaprockiSpainElwin Sharvill NEGOTIATION
Maisha W MaletArgentinaAmy Elsner PROPOSAL
Mujtaba Q PaprockiFranceOnyama Limba RENEWAL
Morrow C RulapaughRussiaStephen Shaw QUALIFIED
Sinclair H MorascaArgentinaOnyama Limba QUALIFIED
Jefferson J MaletJapanStephen Shaw PROPOSAL
Deepesh X ShinkoCanadaAnna Fali NEW
Nicolas N RutaUnited KingdomBernardo Dominic NEGOTIATION
Mayumi E AlbaresBrazilIoni Bowcher PROPOSAL
Leja E PerinUnited KingdomAnna Fali PROPOSAL
Emily Z FerenczSpainIvan Magalhaes PROPOSAL
Isabel A PaprockiUnited KingdomBernardo Dominic RENEWAL
Horizontal
NameCountryRepresentativeStatus
Munro K DarakjyFranceIoni Bowcher NEGOTIATION
Jeanfrancois T GauchoSpainElwin Sharvill PROPOSAL
Greenwood O BriddickUnited KingdomAnna Fali NEW
Mayumi L StensethIndiaAnna Fali RENEWAL
David B ChuiIndiaAnna Fali PROPOSAL
Maria F RutaItalyIvan Magalhaes NEGOTIATION
Francesco C StockhamSpainAnna Fali PROPOSAL
Nicolas B ShinkoIndiaAsiya Javayant QUALIFIED
Sinclair I SaylorsArgentinaStephen Shaw UNQUALIFIED
Ivar P WieserBrazilAnna Fali RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Mujtaba C DoeItaly2024-09-02Rousseaux, Michael Esq UNQUALIFIED72Asiya Javayant
1001Ricardo F NestleRussia2024-08-25Chanay, Jeffrey A Esq RENEWAL72Anna Fali
1002Cody H PaprockiUnited Kingdom2024-09-08Morlong Associates RENEWAL35Stephen Shaw
1003Ashley I SaylorsSpain2024-09-09Rangoni Of Florence PROPOSAL45Ioni Bowcher
1004Chavez X RutaBrazil2024-09-16Benton, John B Jr NEGOTIATION49Onyama Limba
1005Sinclair K WhobreySpain2024-09-10Chapman, Ross E Esq PROPOSAL88Ivan Magalhaes
1006Francesco X RoysterFrance2024-09-03Printing Dimensions RENEWAL48Anna Fali
1007Alejandro H BologniaItaly2024-09-06Buckley Miller Wright RENEWAL83Onyama Limba
1008Alejandro L RoysterUnited Kingdom2024-08-30Commercial Press RENEWAL82Anna Fali
1009Morrow V DarakjyUnited Kingdom2024-09-06Chapman, Ross E Esq NEGOTIATION55Asiya Javayant
1010Costa M PerinRussia2024-09-02Chemel, James L Cpa NEW83Xuxue Feng
1011Isabel G GlickRussia2024-09-13Chanay, Jeffrey A Esq PROPOSAL40Stephen Shaw
1012Ivar O KuskoAustralia2024-09-04Rousseaux, Michael Esq PROPOSAL49Amy Elsner
1013Aditya Y PaprockiSpain2024-09-09Printing Dimensions RENEWAL60Onyama Limba
1014Mujtaba N CaldareraIndia2024-08-24Commercial Press UNQUALIFIED55Ioni Bowcher
1015Jennifer P AmigonCanada2024-08-28Benton, John B Jr NEGOTIATION23Anna Fali
1016Alejandro V GauchoSpain2024-09-19Chapman, Ross E Esq UNQUALIFIED92Stephen Shaw
1017Arvin I CaudyArgentina2024-09-01Chapman, Ross E Esq QUALIFIED74Xuxue Feng
1018Clifford H PaprockiJapan2024-08-30Chapman, Ross E Esq UNQUALIFIED74Elwin Sharvill
1019Leja W CampainFrance2024-08-27King, Christopher A Esq UNQUALIFIED4Onyama Limba
1020Ashley I SlusarskiArgentina2024-09-09Chemel, James L Cpa NEW91Anna Fali
1021Maisha G OstroskyCanada2024-09-19Feltz Printing Service PROPOSAL72Ioni Bowcher
1022Sinclair G ButtArgentina2024-09-21Printing Dimensions RENEWAL51Onyama Limba
1023Leon Y TollnerAustralia2024-09-07Rangoni Of Florence RENEWAL36Ioni Bowcher
1024Sinclair X OldroydBrazil2024-08-31Benton, John B Jr NEGOTIATION35Ioni Bowcher
1025Kadeem Y KuskoItaly2024-09-15Feltz Printing Service PROPOSAL34Stephen Shaw
1026Morrow K RimBrazil2024-09-03Rangoni Of Florence NEW69Xuxue Feng
1027Munro K ButtRussia2024-09-10Feltz Printing Service NEW47Onyama Limba
1028Costa N VenereItaly2024-09-10Rousseaux, Michael Esq UNQUALIFIED47Bernardo Dominic
1029Jones L MorascaFrance2024-08-25Feiner Bros UNQUALIFIED62Ioni Bowcher
1030Francesco R CampainFrance2024-09-04Commercial Press NEGOTIATION74Amy Elsner
1031Adams N GillianArgentina2024-09-17Buckley Miller Wright QUALIFIED83Xuxue Feng
1032Deepesh R SchemmerJapan2024-08-31Dorl, James J Esq QUALIFIED94Ivan Magalhaes
1033Mujtaba V SlusarskiArgentina2024-08-29Truhlar And Truhlar Attys QUALIFIED95Anna Fali
1034Jefferson I AlbaresUnited Kingdom2024-09-22Chemel, James L Cpa QUALIFIED22Ivan Magalhaes
1035Maisha D StensethJapan2024-09-15Chanay, Jeffrey A Esq RENEWAL1Asiya Javayant
1036Emily M SergiAustralia2024-09-13Chapman, Ross E Esq RENEWAL11Anna Fali
1037Munro D OldroydArgentina2024-09-19Commercial Press NEGOTIATION48Ivan Magalhaes
1038Maisha Q MarrierItaly2024-09-20Rousseaux, Michael Esq UNQUALIFIED14Ioni Bowcher
1039Jones M DilliardJapan2024-09-07Benton, John B Jr QUALIFIED79Elwin Sharvill
1040Clifford O FlosiArgentina2024-08-30Printing Dimensions QUALIFIED13Elwin Sharvill
1041James N CampainUnited Kingdom2024-09-13Morlong Associates QUALIFIED89Bernardo Dominic
1042Octavia S AmigonIndia2024-09-22Chanay, Jeffrey A Esq PROPOSAL61Bernardo Dominic
1043James C MaletBrazil2024-08-30Chemel, James L Cpa PROPOSAL20Asiya Javayant
1044Faith R PaprockiUnited Kingdom2024-09-01Commercial Press PROPOSAL32Ioni Bowcher
1045Ivar J TollnerUnited Kingdom2024-09-07Commercial Press PROPOSAL4Stephen Shaw
1046Costa L SchemmerAustralia2024-08-25Rousseaux, Michael Esq NEGOTIATION85Bernardo Dominic
1047Greenwood H DoeItaly2024-08-30King, Christopher A Esq UNQUALIFIED56Onyama Limba
1048Deepesh P GlickSpain2024-09-04Printing Dimensions QUALIFIED45Ivan Magalhaes
1049Aika F CaudyGermany2024-08-30Rousseaux, Michael Esq NEW98Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Misaki B BowleyIndiaIvan Magalhaes UNQUALIFIED
Greenwood A SaylorsAustraliaBernardo Dominic RENEWAL
Leja J BowleyJapanElwin Sharvill UNQUALIFIED
Kaitlin H ButtBrazilAsiya Javayant UNQUALIFIED
Octavia J PoquetteJapanAsiya Javayant RENEWAL
Darci Y GlickAustraliaAsiya Javayant NEW
Adams E MorascaBrazilElwin Sharvill NEW
Stacey M GarufiBrazilOnyama Limba UNQUALIFIED
Ashley G DarakjyRussiaIvan Magalhaes UNQUALIFIED
Isabel C SergiRussiaStephen Shaw PROPOSAL
Aditya G FlosiFranceAmy Elsner UNQUALIFIED
Clifford O KuskoJapanAsiya Javayant NEGOTIATION
David H GauchoArgentinaAnna Fali NEGOTIATION
Emily F MorascaBrazilOnyama Limba NEGOTIATION
Emily A GauchoSpainStephen Shaw RENEWAL
Sinclair F VocelkaArgentinaAmy Elsner RENEWAL
Leon E AlbaresUnited KingdomIoni Bowcher QUALIFIED
Salvatore S ShinkoGermanyElwin Sharvill UNQUALIFIED
Rodrigues I ChuiJapanBernardo Dominic NEW
Johnson P RimIndiaElwin Sharvill PROPOSAL
Julie L MaletArgentinaAmy Elsner PROPOSAL
Antonio F CampainRussiaStephen Shaw UNQUALIFIED
Morrow R WaycottBrazilBernardo Dominic RENEWAL
Morrow V KuskoIndiaXuxue Feng PROPOSAL
Jones Q NickaGermanyAnna Fali NEW
Ashley C CaldareraAustraliaBernardo Dominic QUALIFIED
Francesco W RulapaughArgentinaElwin Sharvill RENEWAL
Ashley Z MaletSpainOnyama Limba RENEWAL
Misaki L ButtUnited KingdomAmy Elsner NEW
Greenwood M FollerItalyStephen Shaw NEW
Claire B MaletBrazilStephen Shaw PROPOSAL
Maisha M SergiArgentinaIvan Magalhaes NEW
Clifford D NestleCanadaOnyama Limba QUALIFIED
Emily K BowleyArgentinaAsiya Javayant NEGOTIATION
Salvatore Z AlbaresFranceBernardo Dominic UNQUALIFIED
Aruna Z SergiUnited KingdomAsiya Javayant UNQUALIFIED
Mujtaba F OstroskyUnited KingdomElwin Sharvill PROPOSAL
Mayumi H GillianSpainOnyama Limba QUALIFIED
Maria C PoquetteFranceElwin Sharvill NEW
Octavia D ChuiItalyBernardo Dominic QUALIFIED
Cody O PerinIndiaBernardo Dominic NEGOTIATION
Juan N WaycottAustraliaElwin Sharvill RENEWAL
Kadeem A MacleadIndiaIoni Bowcher NEW
Cody H GlickItalyOnyama Limba NEW
Murillo I DoeBrazilAnna Fali QUALIFIED
Arvin T AmigonCanadaElwin Sharvill PROPOSAL
Claire K RutaSpainAnna Fali RENEWAL
Mayumi F InouyeRussiaAnna Fali RENEWAL
Darci O PerinArgentinaAmy Elsner PROPOSAL
Munro Z KolmetzRussiaOnyama Limba NEW
Frozen Columns
Name
Morrow K Gillian
Cody M Caudy
Morrow R Darakjy
Clifford O Ruta
Isabel Z Venere
Stacey M Perin
Johnson L Figeroa
Maisha F Gillian
Julie T Flosi
Tony Q Kusko
Salvatore E Briddick
Ivar R Stenseth
Maisha W Saylors
Octavia G Briddick
Salvatore I Malet
Leja O Gillian
Sinclair I Chui
Chavez G Caudy
Kaitlin N Darakjy
Wickens C Wieser
Morrow Q Gillian
David A Slusarski
Stacey N Dilliard
Nicolas M Venere
Smith Z Stenseth
Jeanfrancois R Perin
James U Slusarski
Octavia L Saylors
Sinclair Y Briddick
Cody B Sergi
Kadeem R Morasca
Chavez U Campain
Greenwood R Bolognia
Misaki H Ruta
Misaki V Campain
Mujtaba D Caudy
Tony D Doe
Salvatore F Oldroyd
Jones U Bowley
Stacey H Doe
James R Tollner
Sinclair D Poquette
Misaki G Caldarera
Mujtaba Q Stockham
Wickens X Inouye
Sinclair B Iturbide
Adams Z Inouye
Clifford O Whobrey
Emily P Caudy
Julie X Rulapaugh
IdCountryDate
1000United Kingdom2024-09-21
1001Australia2024-08-24
1002France2024-09-01
1003India2024-08-30
1004France2024-09-16
1005Germany2024-09-16
1006Brazil2024-09-02
1007Canada2024-09-12
1008Germany2024-09-18
1009Australia2024-09-09
1010Germany2024-09-06
1011Australia2024-09-14
1012France2024-09-07
1013France2024-08-31
1014Russia2024-09-02
1015United Kingdom2024-09-11
1016Japan2024-09-05
1017France2024-08-25
1018Canada2024-09-10
1019Italy2024-09-06
1020Japan2024-09-05
1021Japan2024-09-20
1022Canada2024-08-25
1023France2024-09-13
1024Russia2024-09-21
1025France2024-08-31
1026India2024-09-16
1027Spain2024-09-18
1028Argentina2024-09-08
1029Argentina2024-09-21
1030Russia2024-09-03
1031Italy2024-09-04
1032Canada2024-09-05
1033Argentina2024-08-29
1034Russia2024-09-01
1035Spain2024-09-01
1036France2024-08-26
1037India2024-09-04
1038India2024-08-26
1039Brazil2024-09-07
1040Russia2024-09-01
1041United Kingdom2024-08-26
1042Australia2024-08-30
1043Germany2024-09-03
1044Russia2024-08-28
1045United Kingdom2024-09-05
1046Canada2024-09-07
1047Japan2024-08-30
1048Spain2024-08-25
1049France2024-09-09

On-Demand Data

NameIdCountryDate
Sinclair Z Figeroa1000Italy2024-08-24
Izzy P Bowley1001Italy2024-09-03
Deepesh Q Shinko1002Germany2024-08-26
Stacey E Venere1003India2024-09-17
Isabel K Whobrey1004Argentina2024-08-27
Adams D Slusarski1005Brazil2024-08-27
Murillo D Doe1006Australia2024-09-01
Tony Q Amigon1007Italy2024-09-13
Ivar E Gillian1008Australia2024-08-30
Munro B Ruta1009Russia2024-08-29
Misaki Y Albares1010Canada2024-09-09
Nicolas U Venere1011Japan2024-09-20
Misaki C Caudy1012Australia2024-09-04
Julie R Figeroa1013India2024-09-03
Silvio A Darakjy1014Germany2024-09-04
Tony K Chui1015Argentina2024-09-05
Jefferson N Caudy1016Canada2024-09-16
Izzy H Caldarera1017Brazil2024-09-05
Jeanfrancois U Morasca1018Canada2024-09-12
Clifford S Maclead1019Italy2024-09-03
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Tony R FollerJapanIoni Bowcher PROPOSAL
Chavez B DoeGermanyAnna Fali PROPOSAL
Adams M WhobreyItalyOnyama Limba UNQUALIFIED
Aika Z BowleyFranceAnna Fali QUALIFIED
James I WaycottJapanIvan Magalhaes QUALIFIED
Clifford N MorascaFranceOnyama Limba RENEWAL
Rodrigues P GarufiRussiaStephen Shaw PROPOSAL
Aika D RulapaughIndiaIoni Bowcher RENEWAL
Tony C WieserJapanIvan Magalhaes PROPOSAL
Maisha A WhobreySpainIoni Bowcher UNQUALIFIED
Cody Y NestleArgentinaBernardo Dominic UNQUALIFIED
Leja Q TollnerSpainIoni Bowcher UNQUALIFIED
Greenwood I ChuiBrazilOnyama Limba NEGOTIATION
Smith C VenereIndiaAnna Fali PROPOSAL
Smith O ChuiFranceIvan Magalhaes PROPOSAL
Octavia I KolmetzItalyIoni Bowcher PROPOSAL
Deepesh H DarakjyRussiaStephen Shaw RENEWAL
Munro X WieserArgentinaAmy Elsner PROPOSAL
Francesco E BriddickArgentinaBernardo Dominic RENEWAL
Kadeem Y RimGermanyIoni Bowcher UNQUALIFIED
Greenwood R MaletItalyOnyama Limba PROPOSAL
Mujtaba W KuskoUnited KingdomOnyama Limba PROPOSAL
Leja G GarufiIndiaAmy Elsner RENEWAL
Tony T KuskoItalyBernardo Dominic QUALIFIED
Rodrigues Y VenereJapanElwin Sharvill QUALIFIED
Clifford I DilliardRussiaIvan Magalhaes PROPOSAL
Silvio R StensethFranceBernardo Dominic NEW
Emily X AlbaresSpainAmy Elsner RENEWAL
Kaitlin D MaletAustraliaAmy Elsner NEGOTIATION
Aditya K FlosiIndiaBernardo Dominic NEGOTIATION
Claire E MorascaBrazilIoni Bowcher QUALIFIED
Munro Q PoquetteArgentinaAsiya Javayant NEW
Rodrigues F OldroydSpainIoni Bowcher NEW
Jennifer Q FollerArgentinaStephen Shaw UNQUALIFIED
Wickens F DarakjyFranceOnyama Limba UNQUALIFIED
Juan S MaletFranceXuxue Feng NEGOTIATION
Johnson P WaycottIndiaXuxue Feng UNQUALIFIED
David K KuskoJapanXuxue Feng UNQUALIFIED
Leja T AmigonRussiaStephen Shaw PROPOSAL
Rodrigues N FerenczArgentinaIvan 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.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>