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
Jennifer P MaletBrazilAmy Elsner QUALIFIED
Deepesh N WaycottRussiaIoni Bowcher NEW
Maisha F BowleyAustraliaIvan Magalhaes QUALIFIED
Smith E ShinkoAustraliaIoni Bowcher NEW
Greenwood S GillianFranceOnyama Limba NEW
Murillo A MorascaJapanOnyama Limba PROPOSAL
Izzy S StockhamArgentinaAmy Elsner NEGOTIATION
Ashley U SlusarskiSpainIvan Magalhaes QUALIFIED
Emily D BowleyCanadaIoni Bowcher PROPOSAL
Jeanfrancois W NestleUnited KingdomXuxue Feng NEGOTIATION
Ashley Z DilliardFranceXuxue Feng NEW
Sinclair K AmigonArgentinaOnyama Limba NEGOTIATION
David D BologniaAustraliaElwin Sharvill QUALIFIED
Emily Q GillianSpainElwin Sharvill NEW
Costa K MaletIndiaElwin Sharvill PROPOSAL
Leon G FigeroaAustraliaIoni Bowcher NEW
Darci Y RutaUnited KingdomAsiya Javayant QUALIFIED
Wickens A RulapaughIndiaIoni Bowcher PROPOSAL
Claire R SergiAustraliaOnyama Limba NEW
Wickens K ChuiItalyXuxue Feng QUALIFIED
Morrow K WieserUnited KingdomAsiya Javayant NEW
Emily Q ShinkoCanadaXuxue Feng PROPOSAL
Leja J MacleadGermanyIvan Magalhaes UNQUALIFIED
Rodrigues X SergiUnited KingdomAsiya Javayant QUALIFIED
Tony X CaudyUnited KingdomElwin Sharvill NEGOTIATION
Misaki I GlickSpainAsiya Javayant NEW
Stacey X PoquetteAustraliaAmy Elsner RENEWAL
Jeanfrancois Q FerenczSpainIvan Magalhaes NEW
Darci Y MaletArgentinaXuxue Feng NEGOTIATION
Sinclair T MacleadJapanXuxue Feng PROPOSAL
Kadeem M MarrierItalyAsiya Javayant NEW
Clifford U GauchoFranceAmy Elsner PROPOSAL
Wickens E KuskoRussiaBernardo Dominic QUALIFIED
Jefferson A ChuiSpainAmy Elsner UNQUALIFIED
Ivar A ButtItalyBernardo Dominic NEW
Jefferson S GarufiGermanyBernardo Dominic NEW
Ricardo B SaylorsFranceAsiya Javayant UNQUALIFIED
Johnson A IturbideIndiaBernardo Dominic QUALIFIED
David M OstroskyRussiaStephen Shaw NEW
Jennifer J FigeroaIndiaXuxue Feng UNQUALIFIED
Salvatore E OldroydAustraliaOnyama Limba RENEWAL
Juan H MarrierCanadaBernardo Dominic NEGOTIATION
Ashley U RutaFranceXuxue Feng NEGOTIATION
Antonio J DilliardIndiaStephen Shaw PROPOSAL
Jeanfrancois E OstroskyItalyXuxue Feng QUALIFIED
Morrow I StensethAustraliaIoni Bowcher QUALIFIED
Jeanfrancois E GillianCanadaAnna Fali UNQUALIFIED
Aruna X WieserBrazilIoni Bowcher UNQUALIFIED
Greenwood L SlusarskiGermanyOnyama Limba QUALIFIED
Stacey R BologniaFranceAmy Elsner RENEWAL
Horizontal
NameCountryRepresentativeStatus
Nicolas D RimUnited KingdomIvan Magalhaes QUALIFIED
Jennifer G PerinGermanyAsiya Javayant QUALIFIED
Johnson L MorascaRussiaIvan Magalhaes UNQUALIFIED
Chavez H KuskoSpainAmy Elsner NEW
Murillo H FigeroaAustraliaAmy Elsner QUALIFIED
Smith K StensethAustraliaAsiya Javayant UNQUALIFIED
Juan G BowleyCanadaAnna Fali NEW
Deepesh P FigeroaRussiaAnna Fali NEW
Costa U AmigonFranceIoni Bowcher PROPOSAL
Munro D VocelkaJapanIvan Magalhaes QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000David D PerinArgentina2024-09-09Chapman, Ross E Esq NEW87Bernardo Dominic
1001Aika D DoeJapan2024-08-25Commercial Press NEW50Onyama Limba
1002David Z AlbaresGermany2024-08-24Buckley Miller Wright NEW67Stephen Shaw
1003Aruna G PaprockiBrazil2024-08-27Rangoni Of Florence NEGOTIATION48Ioni Bowcher
1004Ashley E CaudySpain2024-09-20Rangoni Of Florence QUALIFIED98Bernardo Dominic
1005Nicolas A RulapaughUnited Kingdom2024-08-30Printing Dimensions RENEWAL35Anna Fali
1006Silvio I OstroskyCanada2024-09-01Chapman, Ross E Esq NEGOTIATION29Ioni Bowcher
1007Francesco H DoeIndia2024-08-31Printing Dimensions QUALIFIED31Ioni Bowcher
1008Salvatore A DoeBrazil2024-09-19Morlong Associates RENEWAL77Asiya Javayant
1009Salvatore I StensethItaly2024-09-06Printing Dimensions PROPOSAL70Bernardo Dominic
1010Aditya V DilliardBrazil2024-09-19Feltz Printing Service PROPOSAL32Stephen Shaw
1011Deepesh F BriddickUnited Kingdom2024-09-02Rousseaux, Michael Esq NEGOTIATION11Onyama Limba
1012Misaki U AmigonJapan2024-09-02Truhlar And Truhlar Attys UNQUALIFIED70Anna Fali
1013Nicolas J DarakjyGermany2024-09-18Benton, John B Jr UNQUALIFIED24Stephen Shaw
1014Deepesh N AlbaresRussia2024-09-16Feltz Printing Service NEW51Asiya Javayant
1015Misaki Q WieserArgentina2024-09-17King, Christopher A Esq QUALIFIED39Ivan Magalhaes
1016Aika V KolmetzRussia2024-09-13Morlong Associates NEGOTIATION40Stephen Shaw
1017Chavez R CaldareraSpain2024-08-30Truhlar And Truhlar Attys RENEWAL47Xuxue Feng
1018Stacey I KolmetzSpain2024-09-15Chapman, Ross E Esq UNQUALIFIED88Anna Fali
1019Maisha I SlusarskiRussia2024-09-02Dorl, James J Esq UNQUALIFIED30Onyama Limba
1020Maisha L CampainJapan2024-09-14Feltz Printing Service UNQUALIFIED69Elwin Sharvill
1021Leon S StensethBrazil2024-08-28Chanay, Jeffrey A Esq PROPOSAL33Asiya Javayant
1022Kadeem J GauchoArgentina2024-09-08Dorl, James J Esq NEW24Stephen Shaw
1023Greenwood K AmigonFrance2024-09-01Morlong Associates RENEWAL71Asiya Javayant
1024Aditya A RulapaughFrance2024-09-01Rousseaux, Michael Esq UNQUALIFIED99Bernardo Dominic
1025Izzy G VocelkaCanada2024-09-03Feiner Bros NEW24Ivan Magalhaes
1026Leon U CaudyRussia2024-09-19Chanay, Jeffrey A Esq QUALIFIED22Amy Elsner
1027Claire E SaylorsArgentina2024-09-21Chanay, Jeffrey A Esq NEW95Asiya Javayant
1028Murillo X WaycottItaly2024-09-15Chanay, Jeffrey A Esq NEW95Anna Fali
1029Wickens H WhobreyJapan2024-09-08Chanay, Jeffrey A Esq NEGOTIATION3Amy Elsner
1030Ashley H FigeroaJapan2024-09-11Rousseaux, Michael Esq NEW98Anna Fali
1031Greenwood Z SlusarskiFrance2024-09-05Buckley Miller Wright NEW9Anna Fali
1032Johnson B BriddickUnited Kingdom2024-08-25Feltz Printing Service RENEWAL40Asiya Javayant
1033Antonio W MacleadIndia2024-08-26Truhlar And Truhlar Attys PROPOSAL46Onyama Limba
1034Leon I VocelkaIndia2024-09-15Rangoni Of Florence NEGOTIATION2Stephen Shaw
1035Morrow S StockhamJapan2024-09-17Chanay, Jeffrey A Esq NEW21Amy Elsner
1036Maria F GauchoArgentina2024-09-01Chanay, Jeffrey A Esq UNQUALIFIED36Elwin Sharvill
1037Mayumi A SlusarskiGermany2024-09-20Morlong Associates UNQUALIFIED82Ioni Bowcher
1038Wickens Y SchemmerRussia2024-09-12Morlong Associates QUALIFIED78Elwin Sharvill
1039Stacey R GarufiIndia2024-09-20Rangoni Of Florence NEGOTIATION51Elwin Sharvill
1040Isabel G PerinUnited Kingdom2024-08-27Chapman, Ross E Esq QUALIFIED15Ivan Magalhaes
1041Ashley H RoysterIndia2024-09-07Chapman, Ross E Esq UNQUALIFIED33Elwin Sharvill
1042David G DarakjyItaly2024-09-20Rangoni Of Florence UNQUALIFIED21Ioni Bowcher
1043Aditya U DilliardSpain2024-09-07Truhlar And Truhlar Attys NEGOTIATION96Ivan Magalhaes
1044Aika H PoquetteRussia2024-09-04Commercial Press NEW44Asiya Javayant
1045Deepesh H VenereRussia2024-09-03Morlong Associates RENEWAL47Stephen Shaw
1046Claire D GarufiFrance2024-09-22Rousseaux, Michael Esq QUALIFIED6Amy Elsner
1047Jones K MaletArgentina2024-09-01Feltz Printing Service UNQUALIFIED46Amy Elsner
1048Johnson X StensethSpain2024-09-06Feiner Bros NEW72Anna Fali
1049Smith Q FerenczItaly2024-09-02Chapman, Ross E Esq NEW14Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Nicolas B ShinkoUnited KingdomStephen Shaw NEW
Misaki D StensethFranceElwin Sharvill NEGOTIATION
Jeanfrancois B RulapaughSpainStephen Shaw PROPOSAL
Johnson W NestleIndiaAmy Elsner NEW
Deepesh K OstroskyCanadaStephen Shaw NEGOTIATION
Johnson D AlbaresAustraliaAsiya Javayant NEGOTIATION
Adams F MacleadIndiaAsiya Javayant UNQUALIFIED
Emily I RulapaughJapanAnna Fali UNQUALIFIED
Wickens B CampainArgentinaAsiya Javayant NEGOTIATION
Leja H ChuiSpainIvan Magalhaes UNQUALIFIED
Adams P StensethFranceIvan Magalhaes PROPOSAL
Chavez Z BriddickAustraliaIvan Magalhaes PROPOSAL
Murillo K WieserFranceAsiya Javayant NEGOTIATION
Tony T GauchoRussiaBernardo Dominic RENEWAL
Aditya C NickaItalyIvan Magalhaes PROPOSAL
Murillo B StockhamRussiaIoni Bowcher NEGOTIATION
David Y SchemmerJapanIoni Bowcher NEGOTIATION
Leon Y FerenczCanadaXuxue Feng NEW
Faith P RimJapanElwin Sharvill UNQUALIFIED
Aruna Y CaldareraUnited KingdomAsiya Javayant PROPOSAL
Mujtaba T AlbaresItalyElwin Sharvill PROPOSAL
Aika O AmigonCanadaElwin Sharvill QUALIFIED
Kadeem I MarrierItalyBernardo Dominic QUALIFIED
Alejandro B FerenczAustraliaAmy Elsner NEGOTIATION
Jefferson D KolmetzAustraliaIoni Bowcher QUALIFIED
Rodrigues T SergiRussiaAnna Fali UNQUALIFIED
Izzy K MarrierArgentinaAnna Fali NEGOTIATION
Deepesh I ChuiIndiaAnna Fali UNQUALIFIED
Tony E SchemmerArgentinaIvan Magalhaes RENEWAL
Silvio B ButtIndiaBernardo Dominic QUALIFIED
Aruna A SergiUnited KingdomStephen Shaw PROPOSAL
Jennifer U FerenczCanadaBernardo Dominic RENEWAL
David O MacleadFranceIoni Bowcher NEGOTIATION
Stacey R TollnerItalyAmy Elsner UNQUALIFIED
Jeanfrancois R WaycottRussiaAsiya Javayant NEW
Claire K GarufiSpainElwin Sharvill RENEWAL
Nicolas I BriddickArgentinaIoni Bowcher UNQUALIFIED
Alejandro Q RoysterArgentinaXuxue Feng QUALIFIED
Alejandro T TollnerSpainAsiya Javayant NEW
Alejandro P DoeIndiaXuxue Feng PROPOSAL
Ricardo W FerenczIndiaOnyama Limba NEGOTIATION
Misaki A BologniaArgentinaStephen Shaw NEW
Mujtaba Y TollnerJapanXuxue Feng PROPOSAL
Mayumi A KuskoUnited KingdomAmy Elsner NEW
Jones V VocelkaArgentinaBernardo Dominic QUALIFIED
Julie U FlosiCanadaOnyama Limba PROPOSAL
Kaitlin W KolmetzArgentinaElwin Sharvill NEW
Arvin I NickaIndiaIvan Magalhaes PROPOSAL
David Q GauchoAustraliaAsiya Javayant QUALIFIED
Maria P PaprockiIndiaAnna Fali RENEWAL
Frozen Columns
Name
Costa F Albares
Juan F Caldarera
Ricardo Y Venere
Octavia Q Ferencz
Smith K Caldarera
Alejandro M Nestle
Kadeem N Chui
Wickens O Garufi
Emily M Nestle
Misaki Q Royster
Jones O Malet
Ivar B Ferencz
Jennifer Z Briddick
Jennifer N Rim
Kaitlin X Schemmer
Misaki W Foller
Morrow W Ostrosky
Stacey Z Albares
Tony K Perin
Maria J Briddick
Rodrigues V Perin
James W Saylors
Tony D Figeroa
Stacey O Tollner
Mujtaba Y Tollner
Isabel L Schemmer
David R Whobrey
James P Stenseth
Misaki H Doe
Leja S Saylors
Maisha P Malet
Cody I Ostrosky
Aruna T Whobrey
Maria O Royster
Jefferson Z Bowley
Nicolas A Slusarski
Antonio A Amigon
Misaki L Whobrey
Chavez I Rim
Francesco R Nestle
Ricardo H Malet
Julie Z Stenseth
Sinclair Q Iturbide
Alejandro L Dilliard
Izzy S Gillian
Juan S Gillian
Arvin T Darakjy
Tony D Figeroa
Juan K Rulapaugh
Ivar W Butt
IdCountryDate
1000India2024-09-11
1001United Kingdom2024-08-31
1002Japan2024-08-29
1003Japan2024-09-11
1004Japan2024-09-10
1005Germany2024-09-21
1006Germany2024-09-10
1007Spain2024-09-08
1008Argentina2024-09-17
1009India2024-09-07
1010India2024-09-15
1011Canada2024-09-05
1012France2024-09-18
1013Spain2024-08-31
1014India2024-08-28
1015Argentina2024-09-04
1016Russia2024-08-31
1017Australia2024-09-20
1018Japan2024-09-21
1019India2024-09-21
1020Argentina2024-09-04
1021Germany2024-09-11
1022Japan2024-08-30
1023Japan2024-09-02
1024Spain2024-09-16
1025Argentina2024-08-26
1026Italy2024-09-06
1027Argentina2024-09-21
1028Germany2024-09-05
1029Australia2024-09-22
1030Australia2024-08-24
1031France2024-09-18
1032Germany2024-09-05
1033Italy2024-09-01
1034United Kingdom2024-08-25
1035France2024-09-18
1036Australia2024-09-04
1037Brazil2024-09-20
1038France2024-09-18
1039United Kingdom2024-09-09
1040Canada2024-09-08
1041United Kingdom2024-08-27
1042Germany2024-09-22
1043United Kingdom2024-08-31
1044Argentina2024-09-08
1045Russia2024-08-24
1046Argentina2024-08-30
1047Canada2024-09-19
1048Japan2024-09-15
1049Canada2024-09-16

On-Demand Data

NameIdCountryDate
Julie Z Maclead1000Spain2024-09-19
Silvio F Gaucho1001India2024-09-11
Munro W Rulapaugh1002Spain2024-09-22
Antonio H Whobrey1003Brazil2024-09-09
Isabel S Figeroa1004Germany2024-09-10
Aditya J Ferencz1005Australia2024-08-24
Faith T Briddick1006Germany2024-09-16
Darci O Inouye1007Spain2024-09-08
Stacey Y Gillian1008Japan2024-09-20
Aditya N Iturbide1009Brazil2024-09-21
Greenwood V Waycott1010Canada2024-09-12
Tony H Caldarera1011Germany2024-09-11
Wickens K Perin1012France2024-08-27
Aditya O Ferencz1013France2024-08-25
Misaki A Amigon1014United Kingdom2024-09-18
Jeanfrancois J Perin1015Germany2024-08-27
Mayumi G Kusko1016France2024-09-11
James R Ruta1017Spain2024-09-06
David P Gaucho1018Japan2024-09-16
Aditya C Amigon1019United Kingdom2024-09-15
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Tony C PerinIndiaOnyama Limba PROPOSAL
Maisha Z MaletSpainAmy Elsner QUALIFIED
Adams R StockhamBrazilXuxue Feng RENEWAL
Munro W FigeroaFranceIoni Bowcher PROPOSAL
Nicolas U InouyeItalyAnna Fali NEW
Greenwood P AlbaresCanadaAsiya Javayant PROPOSAL
Aruna O PoquetteJapanIoni Bowcher PROPOSAL
Morrow D FlosiJapanXuxue Feng NEGOTIATION
Mayumi E RutaAustraliaIoni Bowcher PROPOSAL
Jefferson R ChuiIndiaAmy Elsner UNQUALIFIED
Nicolas R OldroydItalyAsiya Javayant NEGOTIATION
Smith W WhobreyGermanyStephen Shaw RENEWAL
Ivar F RutaAustraliaIoni Bowcher NEW
Sinclair S BriddickArgentinaIoni Bowcher RENEWAL
Chavez L DoeJapanStephen Shaw NEW
Munro E GarufiFranceXuxue Feng RENEWAL
Mujtaba B KolmetzSpainAsiya Javayant NEGOTIATION
Maria O ChuiRussiaAmy Elsner UNQUALIFIED
Maisha Y GauchoSpainOnyama Limba UNQUALIFIED
Maria A CampainUnited KingdomAmy Elsner UNQUALIFIED
Misaki C WieserJapanStephen Shaw PROPOSAL
Isabel F SlusarskiBrazilStephen Shaw RENEWAL
David M DoeItalyAnna Fali RENEWAL
Jefferson R RulapaughSpainXuxue Feng NEGOTIATION
Ashley Q DoeUnited KingdomElwin Sharvill NEW
Jeanfrancois J MaletBrazilIoni Bowcher NEW
Wickens G OstroskySpainIvan Magalhaes NEGOTIATION
Adams C GlickBrazilXuxue Feng RENEWAL
Rodrigues G VenereItalyXuxue Feng UNQUALIFIED
Maisha H SergiFranceAnna Fali QUALIFIED
Greenwood X WaycottFranceAsiya Javayant PROPOSAL
Leja O OstroskyGermanyAmy Elsner UNQUALIFIED
Aditya B GillianRussiaAsiya Javayant UNQUALIFIED
Izzy W StensethGermanyBernardo Dominic PROPOSAL
Ricardo M CaldareraFranceAsiya Javayant NEW
Chavez D RutaArgentinaElwin Sharvill NEGOTIATION
Alejandro E OldroydGermanyAsiya Javayant QUALIFIED
Maisha D KuskoCanadaElwin Sharvill NEW
Tony H BriddickIndiaAnna Fali NEGOTIATION
Leon W GauchoRussiaXuxue Feng 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>