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
Leon E RimArgentinaOnyama Limba NEW
Juan P BologniaRussiaIvan Magalhaes NEGOTIATION
Tony H VenereUnited KingdomOnyama Limba NEW
Antonio E MaletBrazilAnna Fali NEW
Smith O RimIndiaAnna Fali NEW
Johnson N OstroskyItalyIoni Bowcher NEGOTIATION
Deepesh A PoquetteIndiaAmy Elsner QUALIFIED
Mayumi A GlickJapanBernardo Dominic QUALIFIED
Stacey A GillianSpainIvan Magalhaes NEGOTIATION
Smith K VocelkaIndiaBernardo Dominic PROPOSAL
Alejandro U WhobreyUnited KingdomAsiya Javayant QUALIFIED
Misaki O SaylorsFranceOnyama Limba PROPOSAL
Jeanfrancois D PerinAustraliaIvan Magalhaes NEGOTIATION
Francesco V VocelkaBrazilElwin Sharvill PROPOSAL
Ricardo T PoquetteJapanBernardo Dominic UNQUALIFIED
Cody L InouyeIndiaXuxue Feng PROPOSAL
Murillo M InouyeAustraliaStephen Shaw UNQUALIFIED
Jennifer X CaudySpainIoni Bowcher NEW
Silvio P ShinkoBrazilAnna Fali UNQUALIFIED
David T CampainItalyAnna Fali NEGOTIATION
Jones L GlickCanadaIoni Bowcher PROPOSAL
Aika K CampainItalyAnna Fali NEW
Aditya S ShinkoGermanyAmy Elsner RENEWAL
Chavez X WhobreyRussiaAsiya Javayant NEGOTIATION
Sinclair Q DilliardUnited KingdomElwin Sharvill NEW
David O InouyeFranceAsiya Javayant RENEWAL
Ricardo O ChuiAustraliaBernardo Dominic QUALIFIED
Izzy T CampainItalyAsiya Javayant NEGOTIATION
Chavez S OstroskyJapanIoni Bowcher NEGOTIATION
Misaki P FlosiBrazilBernardo Dominic UNQUALIFIED
Jeanfrancois F GauchoItalyAsiya Javayant UNQUALIFIED
Tony V FerenczArgentinaBernardo Dominic QUALIFIED
Faith M ShinkoRussiaIoni Bowcher PROPOSAL
Arvin Q CampainUnited KingdomElwin Sharvill UNQUALIFIED
Clifford Y DilliardUnited KingdomStephen Shaw UNQUALIFIED
Jennifer R KolmetzJapanAsiya Javayant NEW
Stacey K RimCanadaIvan Magalhaes QUALIFIED
Jennifer I DarakjyArgentinaOnyama Limba NEW
Jones E PaprockiBrazilStephen Shaw UNQUALIFIED
Jennifer S BologniaCanadaIoni Bowcher QUALIFIED
Ricardo Y AmigonGermanyElwin Sharvill RENEWAL
Munro O InouyeAustraliaAnna Fali UNQUALIFIED
David H RoysterArgentinaXuxue Feng QUALIFIED
Rodrigues A FollerFranceStephen Shaw NEGOTIATION
Mayumi E DilliardFranceAnna Fali PROPOSAL
Mayumi Y GillianArgentinaXuxue Feng UNQUALIFIED
Kadeem R NickaItalyBernardo Dominic NEGOTIATION
Costa X BologniaSpainAsiya Javayant QUALIFIED
Johnson A SaylorsItalyOnyama Limba QUALIFIED
Silvio U PaprockiSpainBernardo Dominic UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Stacey A BriddickRussiaStephen Shaw PROPOSAL
Deepesh U CaldareraJapanXuxue Feng NEW
Salvatore L PerinSpainAmy Elsner PROPOSAL
Clifford S MorascaCanadaIoni Bowcher QUALIFIED
Costa G PerinGermanyElwin Sharvill RENEWAL
Aditya A MarrierItalyAsiya Javayant QUALIFIED
Smith P ButtArgentinaElwin Sharvill QUALIFIED
Deepesh N RoysterBrazilAnna Fali QUALIFIED
Johnson V VocelkaCanadaElwin Sharvill QUALIFIED
Costa U InouyeCanadaAsiya Javayant NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Silvio B FollerFrance2025-04-12Commercial Press NEGOTIATION58Ivan Magalhaes
1001Aditya S RimFrance2025-04-01Feiner Bros UNQUALIFIED42Bernardo Dominic
1002Faith R PaprockiAustralia2025-04-11Rousseaux, Michael Esq NEW60Elwin Sharvill
1003Sinclair A AlbaresJapan2025-04-27Rangoni Of Florence PROPOSAL45Ivan Magalhaes
1004Murillo A DarakjyIndia2025-04-06Buckley Miller Wright PROPOSAL58Anna Fali
1005Smith S NickaGermany2025-04-27Feltz Printing Service NEW90Onyama Limba
1006Stacey R InouyeArgentina2025-04-02Truhlar And Truhlar Attys UNQUALIFIED16Amy Elsner
1007Ricardo J MorascaJapan2025-04-24Truhlar And Truhlar Attys NEGOTIATION19Ioni Bowcher
1008Sinclair R PaprockiJapan2025-04-14Morlong Associates PROPOSAL45Ivan Magalhaes
1009Deepesh Y InouyeBrazil2025-04-08Truhlar And Truhlar Attys QUALIFIED76Asiya Javayant
1010Francesco X PaprockiItaly2025-04-18Rangoni Of Florence NEGOTIATION68Stephen Shaw
1011Adams R GillianArgentina2025-04-01Benton, John B Jr UNQUALIFIED62Amy Elsner
1012Smith Q IturbideArgentina2025-04-12Benton, John B Jr RENEWAL89Anna Fali
1013Jeanfrancois Z RoysterAustralia2025-04-28Feiner Bros NEW25Elwin Sharvill
1014Kadeem I MarrierBrazil2025-04-20Benton, John B Jr NEW66Anna Fali
1015Stacey M DarakjyBrazil2025-04-27Rousseaux, Michael Esq QUALIFIED25Elwin Sharvill
1016Maisha P OstroskyFrance2025-04-19Feiner Bros RENEWAL31Elwin Sharvill
1017Faith N FlosiBrazil2025-04-25Truhlar And Truhlar Attys NEW44Amy Elsner
1018Smith L BologniaJapan2025-04-20Chanay, Jeffrey A Esq UNQUALIFIED71Elwin Sharvill
1019Rodrigues L BologniaFrance2025-04-07Commercial Press PROPOSAL19Onyama Limba
1020Tony V PerinJapan2025-04-27Chemel, James L Cpa NEGOTIATION18Anna Fali
1021James P InouyeCanada2025-04-26King, Christopher A Esq QUALIFIED83Bernardo Dominic
1022Kaitlin K MaletJapan2025-04-17Printing Dimensions QUALIFIED44Asiya Javayant
1023Cody T RoysterJapan2025-04-17Morlong Associates NEGOTIATION63Bernardo Dominic
1024Murillo K BowleyFrance2025-04-01Rousseaux, Michael Esq PROPOSAL21Bernardo Dominic
1025Deepesh T BriddickItaly2025-04-27Buckley Miller Wright NEGOTIATION11Amy Elsner
1026Silvio G MaletArgentina2025-04-02Chapman, Ross E Esq QUALIFIED97Anna Fali
1027Rodrigues R FlosiGermany2025-04-22Truhlar And Truhlar Attys QUALIFIED86Xuxue Feng
1028Ivar S BologniaUnited Kingdom2025-04-02Commercial Press RENEWAL36Elwin Sharvill
1029Ricardo E ShinkoItaly2025-04-15Rousseaux, Michael Esq QUALIFIED66Amy Elsner
1030Ashley L RutaSpain2025-04-08Rousseaux, Michael Esq PROPOSAL60Asiya Javayant
1031Salvatore Q StockhamCanada2025-04-03Truhlar And Truhlar Attys PROPOSAL25Bernardo Dominic
1032Leon H MacleadJapan2025-04-17Chapman, Ross E Esq PROPOSAL22Amy Elsner
1033Arvin O VenereBrazil2025-04-05Truhlar And Truhlar Attys PROPOSAL64Ivan Magalhaes
1034Aditya X NestleSpain2025-04-10Commercial Press QUALIFIED96Onyama Limba
1035Tony V BriddickGermany2025-04-14King, Christopher A Esq RENEWAL69Amy Elsner
1036Arvin F StockhamArgentina2025-04-28Truhlar And Truhlar Attys NEGOTIATION99Elwin Sharvill
1037Faith Q DarakjyAustralia2025-04-29Feiner Bros NEGOTIATION18Elwin Sharvill
1038Maria G SchemmerBrazil2025-04-20Dorl, James J Esq PROPOSAL40Onyama Limba
1039Nicolas A GauchoCanada2025-04-11Chemel, James L Cpa RENEWAL0Amy Elsner
1040Smith Y RoysterItaly2025-04-26Chanay, Jeffrey A Esq NEGOTIATION64Ioni Bowcher
1041Octavia S StockhamIndia2025-04-04Feiner Bros PROPOSAL90Asiya Javayant
1042Juan L IturbideCanada2025-04-20Rousseaux, Michael Esq NEGOTIATION0Xuxue Feng
1043Misaki O FlosiGermany2025-04-20Chemel, James L Cpa QUALIFIED96Asiya Javayant
1044Aika R RoysterJapan2025-04-21Printing Dimensions NEW7Onyama Limba
1045Jefferson E WhobreyJapan2025-04-24Feltz Printing Service UNQUALIFIED48Asiya Javayant
1046Greenwood E ChuiFrance2025-04-26Feltz Printing Service NEGOTIATION59Ioni Bowcher
1047Leja P SchemmerArgentina2025-04-15Feltz Printing Service NEGOTIATION51Onyama Limba
1048Clifford E MorascaAustralia2025-04-12Feiner Bros QUALIFIED38Amy Elsner
1049Julie E RimJapan2025-04-06Chanay, Jeffrey A Esq NEW79Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Johnson T VocelkaRussiaXuxue Feng NEGOTIATION
Munro S BowleyJapanXuxue Feng NEGOTIATION
Salvatore C GarufiAustraliaElwin Sharvill NEW
Aika O BologniaUnited KingdomBernardo Dominic QUALIFIED
Adams H SlusarskiItalyAnna Fali NEW
Chavez L ChuiAustraliaAsiya Javayant RENEWAL
Octavia Z ButtFranceAmy Elsner PROPOSAL
Morrow G WhobreyRussiaBernardo Dominic NEW
James S AlbaresItalyAnna Fali UNQUALIFIED
Antonio U ChuiBrazilElwin Sharvill RENEWAL
David P MaletItalyAnna Fali PROPOSAL
Isabel F ButtUnited KingdomAnna Fali UNQUALIFIED
Izzy X CaudyBrazilBernardo Dominic PROPOSAL
Misaki Y ButtGermanyAmy Elsner UNQUALIFIED
Leon U BowleyArgentinaIoni Bowcher QUALIFIED
Deepesh G WieserRussiaOnyama Limba NEW
Arvin G DarakjyJapanOnyama Limba NEGOTIATION
Cody K WieserAustraliaXuxue Feng RENEWAL
Aditya Q WaycottArgentinaAsiya Javayant UNQUALIFIED
Greenwood A GlickSpainIoni Bowcher QUALIFIED
Juan D VocelkaCanadaIoni Bowcher QUALIFIED
Juan E GlickBrazilOnyama Limba PROPOSAL
James Q VenereJapanAmy Elsner QUALIFIED
Izzy G RulapaughFranceBernardo Dominic PROPOSAL
Jefferson I FollerUnited KingdomAmy Elsner RENEWAL
Rodrigues V OstroskyArgentinaElwin Sharvill QUALIFIED
Johnson X BriddickUnited KingdomAsiya Javayant NEW
Aditya Y PerinItalyAmy Elsner PROPOSAL
Jeanfrancois I PerinAustraliaOnyama Limba NEW
James D OldroydRussiaAnna Fali RENEWAL
Claire B OldroydGermanyAsiya Javayant RENEWAL
Maisha H StockhamIndiaOnyama Limba NEW
Ivar Z GillianItalyXuxue Feng NEGOTIATION
Jefferson C VocelkaBrazilAmy Elsner NEGOTIATION
Chavez F WaycottUnited KingdomOnyama Limba NEW
Aditya A PoquetteGermanyAnna Fali RENEWAL
Isabel D MorascaCanadaXuxue Feng NEGOTIATION
Deepesh T SchemmerArgentinaXuxue Feng NEW
Misaki T IturbideBrazilIoni Bowcher UNQUALIFIED
Darci H RimSpainBernardo Dominic UNQUALIFIED
Emily E InouyeBrazilOnyama Limba NEW
Sinclair B PaprockiUnited KingdomStephen Shaw UNQUALIFIED
Misaki X OstroskyUnited KingdomBernardo Dominic UNQUALIFIED
Greenwood V OstroskyBrazilAmy Elsner PROPOSAL
Mujtaba P PoquetteJapanAnna Fali UNQUALIFIED
Maisha S MorascaUnited KingdomBernardo Dominic NEGOTIATION
Julie G FerenczArgentinaBernardo Dominic QUALIFIED
James H CaudyCanadaElwin Sharvill RENEWAL
Arvin B BriddickJapanAsiya Javayant QUALIFIED
Octavia V WieserGermanyAsiya Javayant NEW
Frozen Columns
Name
Nicolas H Chui
Greenwood E Saylors
Aika K Ruta
Greenwood C Amigon
Ivar M Vocelka
Deepesh P Garufi
Misaki O Campain
Clifford H Stockham
Aruna U Wieser
Aika H Kusko
Maria J Inouye
Julie Z Gaucho
Ashley J Campain
Munro N Shinko
Clifford I Glick
Isabel P Slusarski
Clifford P Poquette
Clifford K Wieser
Rodrigues P Marrier
Smith D Briddick
Silvio U Morasca
Arvin K Foller
Smith F Kusko
Misaki E Ferencz
Mujtaba W Dilliard
Kaitlin B Maclead
Antonio G Morasca
Alejandro K Caldarera
Ricardo W Waycott
Octavia D Caudy
Greenwood I Figeroa
Arvin O Morasca
Morrow Y Perin
Cody V Stockham
Darci D Garufi
Octavia M Wieser
Jennifer L Ostrosky
Chavez P Schemmer
Mayumi K Dilliard
Alejandro G Bolognia
Aditya M Saylors
Darci C Perin
Silvio L Rim
Smith Y Gaucho
Octavia S Poquette
Morrow E Shinko
Izzy I Oldroyd
Jeanfrancois U Gillian
Johnson Y Ruta
David H Perin
IdCountryDate
1000Germany2025-04-04
1001Japan2025-04-23
1002Argentina2025-04-20
1003France2025-04-16
1004Argentina2025-04-22
1005United Kingdom2025-04-19
1006United Kingdom2025-04-12
1007Russia2025-04-06
1008Japan2025-04-21
1009Argentina2025-04-14
1010Italy2025-04-27
1011Spain2025-04-29
1012India2025-04-02
1013Australia2025-04-22
1014Brazil2025-04-22
1015France2025-04-13
1016France2025-04-26
1017France2025-04-15
1018India2025-04-07
1019India2025-04-24
1020Russia2025-04-22
1021Italy2025-04-23
1022Canada2025-04-25
1023Argentina2025-04-26
1024Brazil2025-04-14
1025Australia2025-04-15
1026Brazil2025-04-13
1027Canada2025-04-09
1028Argentina2025-04-05
1029Argentina2025-04-28
1030Germany2025-04-19
1031Japan2025-04-16
1032Russia2025-04-18
1033Russia2025-04-26
1034Argentina2025-04-15
1035Canada2025-04-28
1036Spain2025-04-01
1037France2025-04-19
1038Germany2025-04-12
1039Canada2025-04-07
1040Italy2025-04-27
1041Russia2025-04-11
1042Germany2025-04-09
1043Spain2025-04-02
1044Spain2025-04-25
1045Australia2025-04-01
1046Australia2025-04-02
1047Argentina2025-04-29
1048United Kingdom2025-04-19
1049Australia2025-04-01

On-Demand Data

NameIdCountryDate
Munro F Morasca1000Australia2025-04-18
James P Perin1001Japan2025-04-04
Faith B Whobrey1002Australia2025-04-15
Juan M Figeroa1003Japan2025-04-12
Greenwood P Schemmer1004Australia2025-04-27
Mayumi P Maclead1005Canada2025-04-08
Murillo N Gaucho1006Spain2025-04-10
Adams T Rim1007France2025-04-18
Ashley Q Nicka1008France2025-04-30
Rodrigues H Oldroyd1009Russia2025-04-17
Jennifer G Kusko1010France2025-04-20
Greenwood S Iturbide1011Germany2025-04-09
Emily X Nestle1012Japan2025-04-24
Maisha A Foller1013Spain2025-04-09
Salvatore X Poquette1014India2025-04-30
Izzy Z Saylors1015Russia2025-04-11
Antonio Y Whobrey1016Canada2025-04-08
Jeanfrancois L Malet1017Spain2025-04-21
Isabel Q Nicka1018Australia2025-04-12
Chavez Y Stockham1019France2025-04-05
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Leja B PaprockiArgentinaAnna Fali PROPOSAL
Misaki G DilliardUnited KingdomStephen Shaw NEGOTIATION
Julie Q NickaAustraliaElwin Sharvill NEGOTIATION
Emily S RoysterJapanAmy Elsner NEW
Tony K SergiUnited KingdomOnyama Limba RENEWAL
Murillo E BologniaCanadaXuxue Feng RENEWAL
Kadeem R WaycottIndiaBernardo Dominic NEGOTIATION
Tony E PoquetteBrazilIvan Magalhaes NEW
Johnson L CaldareraAustraliaBernardo Dominic NEW
Munro A DilliardBrazilAnna Fali RENEWAL
Greenwood U NestleArgentinaXuxue Feng NEGOTIATION
Deepesh A CaudyJapanIoni Bowcher QUALIFIED
Greenwood U OldroydGermanyElwin Sharvill UNQUALIFIED
Misaki I SchemmerAustraliaXuxue Feng NEGOTIATION
Ivar C CampainSpainIvan Magalhaes RENEWAL
Sinclair D SchemmerUnited KingdomAmy Elsner QUALIFIED
Greenwood T MarrierJapanBernardo Dominic UNQUALIFIED
Antonio H SaylorsFranceStephen Shaw PROPOSAL
Ricardo C BowleyJapanIvan Magalhaes QUALIFIED
Wickens T OldroydArgentinaStephen Shaw NEW
Clifford J AmigonItalyBernardo Dominic QUALIFIED
Mujtaba R MorascaAustraliaAnna Fali PROPOSAL
Leon O BowleyBrazilElwin Sharvill UNQUALIFIED
Maria B BriddickItalyAnna Fali QUALIFIED
Costa V RimUnited KingdomBernardo Dominic PROPOSAL
Maisha J FerenczFranceAsiya Javayant PROPOSAL
Alejandro T RimBrazilIvan Magalhaes QUALIFIED
Nicolas P FerenczCanadaAmy Elsner RENEWAL
Smith I MorascaUnited KingdomBernardo Dominic NEW
Misaki H RulapaughIndiaAmy Elsner UNQUALIFIED
Chavez C DoeIndiaOnyama Limba UNQUALIFIED
Francesco O FlosiRussiaAmy Elsner PROPOSAL
Jefferson Q SergiArgentinaXuxue Feng PROPOSAL
Munro D OldroydItalyBernardo Dominic NEGOTIATION
Kaitlin R FlosiSpainIvan Magalhaes NEW
Mujtaba X CaldareraJapanElwin Sharvill PROPOSAL
Wickens P PoquetteAustraliaIvan Magalhaes QUALIFIED
Aruna V CaudyUnited KingdomXuxue Feng QUALIFIED
Maria C RutaSpainXuxue Feng UNQUALIFIED
Johnson B SergiFranceStephen Shaw QUALIFIED

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