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 S BowleyGermanyIoni Bowcher RENEWAL
Claire X SchemmerGermanyStephen Shaw PROPOSAL
Kaitlin W AlbaresCanadaBernardo Dominic NEGOTIATION
Nicolas M PerinGermanyIvan Magalhaes RENEWAL
Jeanfrancois K ChuiUnited KingdomBernardo Dominic NEW
Kadeem I StensethArgentinaBernardo Dominic PROPOSAL
Ashley Q SchemmerItalyElwin Sharvill QUALIFIED
Sinclair K GarufiBrazilStephen Shaw NEGOTIATION
Isabel G InouyeUnited KingdomIoni Bowcher QUALIFIED
Francesco G VocelkaJapanStephen Shaw NEW
Emily E ShinkoItalyIvan Magalhaes PROPOSAL
Maisha Z KuskoItalyStephen Shaw UNQUALIFIED
Cody R KolmetzSpainAsiya Javayant NEGOTIATION
Maisha X GlickSpainElwin Sharvill PROPOSAL
Aditya I WaycottCanadaElwin Sharvill PROPOSAL
Sinclair J MacleadItalyAmy Elsner UNQUALIFIED
Ricardo V OstroskyBrazilAmy Elsner NEW
Silvio V FigeroaSpainBernardo Dominic QUALIFIED
Maria K AlbaresFranceStephen Shaw UNQUALIFIED
Ivar Q StensethCanadaStephen Shaw PROPOSAL
Kaitlin L CampainCanadaXuxue Feng NEW
Stacey B SchemmerBrazilAnna Fali RENEWAL
Octavia Z FlosiArgentinaAnna Fali QUALIFIED
Maisha H MorascaJapanIvan Magalhaes QUALIFIED
Ivar Q MaletIndiaElwin Sharvill QUALIFIED
Stacey L ButtUnited KingdomStephen Shaw RENEWAL
Izzy J SaylorsSpainStephen Shaw PROPOSAL
Greenwood C SaylorsBrazilIoni Bowcher NEGOTIATION
Darci T TollnerFranceAsiya Javayant NEGOTIATION
Aditya P GarufiFranceStephen Shaw NEGOTIATION
James Y MaletGermanyXuxue Feng NEGOTIATION
Ricardo H MaletRussiaOnyama Limba QUALIFIED
Maria U FigeroaItalyAnna Fali NEW
Tony X ShinkoItalyIvan Magalhaes UNQUALIFIED
Tony T DoeSpainIvan Magalhaes NEW
Maria I PerinSpainAsiya Javayant QUALIFIED
Claire D FollerItalyStephen Shaw NEW
Deepesh X NestleRussiaStephen Shaw QUALIFIED
Leon I NestleItalyIoni Bowcher RENEWAL
Francesco E AlbaresSpainXuxue Feng QUALIFIED
Misaki N FigeroaRussiaBernardo Dominic QUALIFIED
Adams V SchemmerItalyAnna Fali NEW
Aditya N FollerUnited KingdomIoni Bowcher RENEWAL
Wickens U VenereAustraliaAnna Fali UNQUALIFIED
Silvio B PaprockiUnited KingdomAmy Elsner QUALIFIED
Aruna F KolmetzSpainAnna Fali UNQUALIFIED
Julie E OstroskyRussiaIvan Magalhaes NEW
Jones E VocelkaSpainIvan Magalhaes PROPOSAL
Tony X NickaSpainXuxue Feng PROPOSAL
Aditya N MaletFranceIvan Magalhaes RENEWAL
Horizontal
NameCountryRepresentativeStatus
Alejandro H StockhamItalyStephen Shaw NEW
Johnson Y NestleSpainElwin Sharvill UNQUALIFIED
Octavia P SaylorsAustraliaAmy Elsner UNQUALIFIED
Sinclair K SaylorsBrazilAnna Fali RENEWAL
Aditya K OldroydBrazilElwin Sharvill RENEWAL
Julie I ShinkoArgentinaAnna Fali RENEWAL
Maisha J SaylorsItalyOnyama Limba NEW
Darci N MorascaIndiaElwin Sharvill PROPOSAL
Morrow U SlusarskiSpainStephen Shaw RENEWAL
Salvatore G WieserSpainXuxue Feng NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Greenwood X MacleadItaly2024-09-09King, Christopher A Esq QUALIFIED37Xuxue Feng
1001Arvin G PoquetteGermany2024-09-25Chanay, Jeffrey A Esq UNQUALIFIED25Onyama Limba
1002Silvio L KuskoJapan2024-09-07Printing Dimensions QUALIFIED98Onyama Limba
1003Alejandro L FigeroaFrance2024-09-22Buckley Miller Wright PROPOSAL51Amy Elsner
1004Alejandro E GauchoItaly2024-09-10Morlong Associates PROPOSAL32Onyama Limba
1005Claire K FigeroaAustralia2024-09-10Feltz Printing Service NEGOTIATION55Anna Fali
1006James J CampainRussia2024-08-30Rousseaux, Michael Esq NEGOTIATION0Elwin Sharvill
1007Emily B TollnerBrazil2024-09-20King, Christopher A Esq NEW93Anna Fali
1008David O ShinkoUnited Kingdom2024-09-11Buckley Miller Wright PROPOSAL53Asiya Javayant
1009Maria J WaycottFrance2024-09-13Rangoni Of Florence RENEWAL96Asiya Javayant
1010Francesco B RimGermany2024-09-15King, Christopher A Esq UNQUALIFIED98Onyama Limba
1011Arvin M CampainRussia2024-09-12Truhlar And Truhlar Attys PROPOSAL78Stephen Shaw
1012Jones D WieserArgentina2024-09-04Truhlar And Truhlar Attys QUALIFIED63Elwin Sharvill
1013Francesco W FigeroaGermany2024-09-13Truhlar And Truhlar Attys RENEWAL29Stephen Shaw
1014Arvin E StensethFrance2024-09-03Printing Dimensions QUALIFIED28Bernardo Dominic
1015Jeanfrancois S PerinArgentina2024-09-23Morlong Associates PROPOSAL68Ivan Magalhaes
1016Jennifer J ChuiBrazil2024-08-29Feiner Bros PROPOSAL62Bernardo Dominic
1017Francesco X StockhamGermany2024-08-30Feiner Bros PROPOSAL63Asiya Javayant
1018Jones P FigeroaArgentina2024-09-22Morlong Associates QUALIFIED60Ivan Magalhaes
1019Kaitlin A ButtSpain2024-09-12Buckley Miller Wright NEW89Bernardo Dominic
1020Claire C WaycottAustralia2024-09-19Morlong Associates RENEWAL26Asiya Javayant
1021Deepesh Y AlbaresArgentina2024-09-20Rangoni Of Florence NEGOTIATION31Onyama Limba
1022Leon C RoysterSpain2024-09-20Feltz Printing Service NEGOTIATION64Asiya Javayant
1023Wickens G MacleadArgentina2024-09-01Rangoni Of Florence RENEWAL84Anna Fali
1024Munro X DilliardItaly2024-09-07Truhlar And Truhlar Attys QUALIFIED56Ivan Magalhaes
1025Ivar A MaletCanada2024-09-16King, Christopher A Esq PROPOSAL52Anna Fali
1026Cody Y PoquetteCanada2024-09-04Chapman, Ross E Esq NEW60Amy Elsner
1027Murillo N ChuiJapan2024-09-13Benton, John B Jr RENEWAL38Xuxue Feng
1028Ashley Y AmigonCanada2024-09-12King, Christopher A Esq PROPOSAL24Onyama Limba
1029Octavia L AlbaresCanada2024-09-15Truhlar And Truhlar Attys UNQUALIFIED12Ivan Magalhaes
1030Claire M PaprockiAustralia2024-09-07Rousseaux, Michael Esq NEW43Onyama Limba
1031Aditya T OstroskyBrazil2024-09-15Feltz Printing Service NEGOTIATION70Asiya Javayant
1032Alejandro T VocelkaCanada2024-08-31Chemel, James L Cpa NEGOTIATION94Onyama Limba
1033Aika D ButtBrazil2024-09-01Dorl, James J Esq PROPOSAL31Ivan Magalhaes
1034Morrow Y ShinkoRussia2024-09-04Printing Dimensions NEGOTIATION19Ioni Bowcher
1035Stacey T OstroskyCanada2024-09-18Truhlar And Truhlar Attys QUALIFIED64Stephen Shaw
1036Greenwood L MarrierSpain2024-09-23King, Christopher A Esq RENEWAL21Bernardo Dominic
1037Adams K WhobreyAustralia2024-09-21Morlong Associates NEW40Elwin Sharvill
1038James L BologniaAustralia2024-09-23Feiner Bros RENEWAL17Xuxue Feng
1039Deepesh R MaletJapan2024-09-24Feiner Bros UNQUALIFIED53Stephen Shaw
1040Francesco P GarufiRussia2024-08-31Buckley Miller Wright RENEWAL78Ioni Bowcher
1041Jennifer X MacleadUnited Kingdom2024-09-07Buckley Miller Wright NEW51Elwin Sharvill
1042Kadeem O ShinkoGermany2024-09-22Dorl, James J Esq NEW9Ioni Bowcher
1043Alejandro C OldroydArgentina2024-09-11Printing Dimensions NEGOTIATION55Amy Elsner
1044Rodrigues S BologniaItaly2024-09-24Printing Dimensions NEW40Stephen Shaw
1045Izzy W GillianAustralia2024-09-14Chapman, Ross E Esq UNQUALIFIED63Stephen Shaw
1046Mujtaba R DarakjyJapan2024-09-21Chemel, James L Cpa PROPOSAL47Amy Elsner
1047Ricardo D SlusarskiUnited Kingdom2024-09-01Truhlar And Truhlar Attys NEW10Amy Elsner
1048Silvio X SergiCanada2024-09-10Feiner Bros NEW70Elwin Sharvill
1049Stacey X SlusarskiGermany2024-08-29Printing Dimensions NEW70Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Greenwood L WaycottAustraliaOnyama Limba UNQUALIFIED
Izzy Q GauchoJapanIoni Bowcher NEGOTIATION
Greenwood Y SergiAustraliaAnna Fali UNQUALIFIED
Morrow M KuskoUnited KingdomIvan Magalhaes RENEWAL
Deepesh H WieserRussiaStephen Shaw RENEWAL
Jennifer R RimGermanyOnyama Limba NEW
Francesco E PerinBrazilOnyama Limba PROPOSAL
Faith V RulapaughJapanStephen Shaw QUALIFIED
Wickens M FerenczIndiaAmy Elsner UNQUALIFIED
Jones K BriddickUnited KingdomAsiya Javayant UNQUALIFIED
Mayumi T TollnerJapanIvan Magalhaes NEW
Claire H StensethAustraliaIvan Magalhaes PROPOSAL
Misaki D DoeIndiaIoni Bowcher NEGOTIATION
Jefferson Y DilliardUnited KingdomAsiya Javayant PROPOSAL
Maisha X WaycottJapanAnna Fali NEGOTIATION
Antonio I ChuiJapanIvan Magalhaes NEW
Ricardo E SaylorsIndiaAmy Elsner NEGOTIATION
Chavez N FlosiGermanyOnyama Limba QUALIFIED
Darci P MaletArgentinaStephen Shaw NEGOTIATION
Tony U MarrierAustraliaOnyama Limba QUALIFIED
Johnson Y KuskoJapanAmy Elsner NEGOTIATION
Maisha U SergiUnited KingdomOnyama Limba PROPOSAL
Emily C RimItalyIvan Magalhaes NEGOTIATION
Salvatore S ChuiIndiaBernardo Dominic NEW
Jeanfrancois C StockhamUnited KingdomElwin Sharvill RENEWAL
Alejandro U OldroydBrazilXuxue Feng QUALIFIED
Wickens M FerenczIndiaIoni Bowcher RENEWAL
Misaki I SergiArgentinaIvan Magalhaes PROPOSAL
Claire R MacleadCanadaIvan Magalhaes QUALIFIED
Morrow X DoeBrazilBernardo Dominic QUALIFIED
Antonio D RulapaughAustraliaIvan Magalhaes NEW
Smith C RoysterFranceAsiya Javayant NEGOTIATION
Alejandro L WieserIndiaElwin Sharvill NEW
Costa D PoquetteGermanyOnyama Limba RENEWAL
Francesco F ButtAustraliaAnna Fali NEGOTIATION
Kadeem A WieserBrazilXuxue Feng UNQUALIFIED
Nicolas B MacleadAustraliaIvan Magalhaes QUALIFIED
Leja Z MaletJapanIoni Bowcher RENEWAL
Salvatore U DoeIndiaOnyama Limba RENEWAL
Tony A CaldareraUnited KingdomIoni Bowcher PROPOSAL
Cody Y RimSpainBernardo Dominic NEGOTIATION
Arvin T FlosiItalyStephen Shaw RENEWAL
Jennifer F RutaJapanIoni Bowcher PROPOSAL
Ricardo R AlbaresIndiaAsiya Javayant NEGOTIATION
Francesco E GillianUnited KingdomStephen Shaw UNQUALIFIED
Leja P SchemmerUnited KingdomElwin Sharvill NEGOTIATION
Morrow X PaprockiArgentinaAnna Fali RENEWAL
Jefferson U DoeAustraliaAmy Elsner RENEWAL
Ricardo W PaprockiGermanyAsiya Javayant NEGOTIATION
Aruna G BologniaGermanyOnyama Limba QUALIFIED
Frozen Columns
Name
Johnson G Ferencz
Clifford F Chui
Aika K Rim
Darci T Ferencz
Juan X Rim
Costa E Ostrosky
Jennifer S Darakjy
Arvin X Caldarera
Jennifer B Whobrey
Deepesh D Venere
Emily H Nicka
Ricardo O Caldarera
Ricardo K Stenseth
Darci H Malet
Ivar J Butt
Munro T Stockham
Johnson I Ostrosky
Cody F Oldroyd
Mujtaba X Ferencz
Salvatore C Caudy
Adams L Wieser
Murillo Z Dilliard
Jeanfrancois S Chui
Misaki Y Malet
Adams V Whobrey
Jefferson V Butt
Tony K Rulapaugh
Aruna H Tollner
Arvin A Campain
Wickens S Whobrey
Claire H Bowley
Aika S Caldarera
Leon T Figeroa
Leja B Oldroyd
Mujtaba C Dilliard
Faith L Marrier
Mayumi T Doe
Morrow N Sergi
Maisha D Rim
Mujtaba R Shinko
Nicolas N Whobrey
Cody E Perin
Kaitlin E Wieser
David I Foller
Jefferson F Tollner
Maisha A Iturbide
Murillo P Wieser
James F Oldroyd
Sinclair W Kolmetz
Faith Z Bowley
IdCountryDate
1000Brazil2024-09-06
1001Japan2024-09-12
1002Germany2024-09-24
1003United Kingdom2024-09-20
1004Canada2024-09-06
1005Japan2024-09-17
1006Japan2024-09-15
1007Spain2024-09-16
1008Spain2024-08-28
1009Australia2024-09-23
1010Japan2024-09-20
1011Spain2024-09-01
1012France2024-08-31
1013Argentina2024-09-17
1014Canada2024-09-26
1015India2024-09-13
1016United Kingdom2024-09-06
1017Germany2024-09-10
1018India2024-09-23
1019Germany2024-09-24
1020India2024-09-12
1021Japan2024-09-10
1022Japan2024-09-26
1023Germany2024-09-15
1024Russia2024-09-18
1025Japan2024-09-09
1026Canada2024-09-25
1027Russia2024-09-02
1028Argentina2024-09-07
1029Argentina2024-09-22
1030Brazil2024-09-24
1031Italy2024-09-19
1032Italy2024-09-18
1033India2024-09-03
1034Australia2024-09-15
1035Russia2024-09-18
1036India2024-09-11
1037France2024-09-15
1038Argentina2024-09-13
1039India2024-09-24
1040Russia2024-09-05
1041Brazil2024-09-04
1042United Kingdom2024-09-26
1043Brazil2024-09-09
1044Russia2024-09-19
1045United Kingdom2024-09-22
1046Italy2024-09-15
1047Argentina2024-09-16
1048Italy2024-09-12
1049Germany2024-09-21

On-Demand Data

NameIdCountryDate
Nicolas M Nestle1000Japan2024-09-02
Izzy D Schemmer1001Brazil2024-09-26
Jefferson Q Rim1002Australia2024-09-24
Mayumi U Slusarski1003India2024-08-29
Juan U Wieser1004Canada2024-09-20
Costa V Stenseth1005United Kingdom2024-09-02
Adams W Caldarera1006France2024-09-22
Ivar M Garufi1007Germany2024-09-12
Leon J Schemmer1008United Kingdom2024-09-03
Greenwood V Perin1009Japan2024-09-18
Aika G Paprocki1010Russia2024-09-22
Deepesh B Morasca1011Spain2024-09-25
Clifford T Whobrey1012Japan2024-09-08
James N Paprocki1013Italy2024-09-17
Antonio G Garufi1014Australia2024-09-20
Munro S Amigon1015Canada2024-09-19
Greenwood A Ruta1016India2024-08-29
Aruna N Glick1017Brazil2024-09-11
Kadeem I Tollner1018United Kingdom2024-09-25
Smith E Sergi1019Italy2024-09-12
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Wickens F MarrierRussiaElwin Sharvill UNQUALIFIED
Arvin C InouyeRussiaBernardo Dominic UNQUALIFIED
Aika S BologniaGermanyAsiya Javayant QUALIFIED
Ivar I PaprockiItalyAsiya Javayant UNQUALIFIED
Stacey T RutaCanadaAnna Fali UNQUALIFIED
Wickens I WhobreyRussiaAsiya Javayant PROPOSAL
Jeanfrancois S MarrierGermanyIoni Bowcher RENEWAL
Tony N PaprockiUnited KingdomIoni Bowcher NEGOTIATION
Ricardo U InouyeGermanyIoni Bowcher PROPOSAL
Silvio G DilliardArgentinaAmy Elsner RENEWAL
Mayumi K StockhamJapanBernardo Dominic PROPOSAL
Darci F NestleAustraliaIoni Bowcher NEW
Jeanfrancois G SaylorsAustraliaIoni Bowcher PROPOSAL
Aditya U RoysterGermanyElwin Sharvill PROPOSAL
Salvatore P SergiSpainBernardo Dominic RENEWAL
Sinclair R VocelkaAustraliaIvan Magalhaes PROPOSAL
Antonio A OstroskySpainIoni Bowcher NEW
Jeanfrancois N VenereRussiaElwin Sharvill UNQUALIFIED
Emily X AlbaresGermanyAmy Elsner NEW
Leja L WieserIndiaStephen Shaw UNQUALIFIED
Misaki T RutaArgentinaOnyama Limba RENEWAL
Aditya W SergiBrazilAsiya Javayant PROPOSAL
Leja R WaycottArgentinaElwin Sharvill QUALIFIED
Cody J StockhamBrazilAsiya Javayant RENEWAL
Stacey C CaudyBrazilXuxue Feng NEGOTIATION
Ashley C SaylorsJapanElwin Sharvill NEGOTIATION
Darci N WaycottIndiaAnna Fali PROPOSAL
Jeanfrancois G AmigonIndiaBernardo Dominic NEW
Adams E WieserSpainXuxue Feng RENEWAL
Aditya B FerenczItalyOnyama Limba RENEWAL
Octavia Y ShinkoBrazilBernardo Dominic NEW
Adams O CampainJapanOnyama Limba NEW
Jefferson A SlusarskiFranceBernardo Dominic UNQUALIFIED
Clifford Q CaudyIndiaAsiya Javayant PROPOSAL
Darci J MaletItalyIoni Bowcher NEGOTIATION
Nicolas D CampainGermanyIoni Bowcher QUALIFIED
Maria G CaudyUnited KingdomAmy Elsner UNQUALIFIED
Aditya Y OstroskyAustraliaElwin Sharvill NEW
Mujtaba Z BologniaUnited KingdomIvan Magalhaes NEGOTIATION
David S FerenczArgentinaOnyama Limba 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>