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
Smith U StockhamIndiaAnna Fali NEW
Faith D PaprockiJapanAmy Elsner QUALIFIED
Kadeem O PoquetteSpainOnyama Limba QUALIFIED
Adams E IturbideGermanyElwin Sharvill NEGOTIATION
Morrow V KolmetzItalyIvan Magalhaes UNQUALIFIED
Jennifer L RulapaughCanadaIvan Magalhaes NEW
Greenwood Z MorascaBrazilAmy Elsner UNQUALIFIED
Rodrigues V FollerGermanyOnyama Limba RENEWAL
Ivar Q FerenczFranceAmy Elsner NEW
James B FerenczItalyXuxue Feng NEGOTIATION
David X GlickUnited KingdomBernardo Dominic UNQUALIFIED
Murillo N IturbideGermanyIvan Magalhaes NEGOTIATION
Jennifer Z GauchoFranceAsiya Javayant PROPOSAL
Misaki H DilliardGermanyXuxue Feng UNQUALIFIED
Aditya X WhobreyJapanIvan Magalhaes NEW
Nicolas J WaycottUnited KingdomXuxue Feng QUALIFIED
Aruna Q SergiGermanyXuxue Feng RENEWAL
Ricardo T StockhamArgentinaXuxue Feng PROPOSAL
Misaki B NickaAustraliaAsiya Javayant NEW
Chavez H GillianIndiaAmy Elsner NEW
Ivar P MorascaIndiaAmy Elsner RENEWAL
Jones E VocelkaSpainElwin Sharvill RENEWAL
Smith T IturbideRussiaAsiya Javayant QUALIFIED
Mayumi F BologniaRussiaIoni Bowcher NEW
Claire W SergiFranceElwin Sharvill RENEWAL
James S MaletUnited KingdomAsiya Javayant RENEWAL
Salvatore R AlbaresItalyAnna Fali RENEWAL
Jennifer Z BologniaSpainXuxue Feng QUALIFIED
Mayumi X MaletItalyOnyama Limba UNQUALIFIED
Aditya B BowleyRussiaIoni Bowcher NEW
Faith X PerinItalyAsiya Javayant NEW
Aditya T GillianUnited KingdomAmy Elsner UNQUALIFIED
Maria T IturbideGermanyAsiya Javayant NEW
Chavez R VocelkaJapanAnna Fali UNQUALIFIED
Faith I TollnerSpainXuxue Feng PROPOSAL
Nicolas V TollnerCanadaStephen Shaw NEGOTIATION
Arvin W GillianFranceOnyama Limba NEW
Mayumi T AlbaresUnited KingdomElwin Sharvill NEW
Juan W RoysterBrazilAsiya Javayant NEGOTIATION
Julie F ShinkoGermanyStephen Shaw RENEWAL
Izzy X MorascaFranceOnyama Limba UNQUALIFIED
Morrow O RulapaughArgentinaIoni Bowcher QUALIFIED
Salvatore M VenereJapanXuxue Feng RENEWAL
Isabel S AmigonSpainBernardo Dominic PROPOSAL
Greenwood M MaletCanadaXuxue Feng NEGOTIATION
Jefferson E GarufiFranceAsiya Javayant QUALIFIED
Cody C NickaCanadaOnyama Limba UNQUALIFIED
Costa Z GlickRussiaOnyama Limba PROPOSAL
Silvio N FlosiBrazilBernardo Dominic NEGOTIATION
Emily Y PoquetteArgentinaAsiya Javayant RENEWAL
Horizontal
NameCountryRepresentativeStatus
Isabel N VenereIndiaOnyama Limba NEW
Kadeem I KuskoFranceElwin Sharvill PROPOSAL
Juan L DilliardFranceIvan Magalhaes UNQUALIFIED
Cody X ChuiRussiaIoni Bowcher NEW
James D RulapaughIndiaXuxue Feng NEGOTIATION
Salvatore C BriddickIndiaXuxue Feng RENEWAL
Tony J AmigonAustraliaElwin Sharvill PROPOSAL
Costa J WieserGermanyIoni Bowcher QUALIFIED
Salvatore O TollnerItalyAmy Elsner PROPOSAL
Julie K NestleJapanAmy Elsner PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Johnson M VocelkaCanada2025-04-18Chemel, James L Cpa NEW67Xuxue Feng
1001Murillo Z NestleGermany2025-04-24Printing Dimensions UNQUALIFIED88Asiya Javayant
1002Misaki J GillianBrazil2025-04-06Truhlar And Truhlar Attys UNQUALIFIED42Ivan Magalhaes
1003Cody K WaycottRussia2025-04-03Commercial Press RENEWAL64Ivan Magalhaes
1004Faith M CampainGermany2025-03-31Rangoni Of Florence NEGOTIATION68Xuxue Feng
1005Faith F SlusarskiUnited Kingdom2025-04-19Chemel, James L Cpa NEW15Asiya Javayant
1006Sinclair G KolmetzFrance2025-04-24Morlong Associates RENEWAL42Amy Elsner
1007Kadeem H SchemmerCanada2025-04-08Benton, John B Jr NEGOTIATION89Elwin Sharvill
1008Mujtaba T FlosiCanada2025-04-09Chemel, James L Cpa UNQUALIFIED20Stephen Shaw
1009Salvatore R AmigonUnited Kingdom2025-04-25Chapman, Ross E Esq NEW66Xuxue Feng
1010David C BriddickIndia2025-04-14Rangoni Of Florence QUALIFIED28Amy Elsner
1011Johnson B OstroskySpain2025-04-21Chemel, James L Cpa PROPOSAL64Ioni Bowcher
1012Maria W VocelkaArgentina2025-04-23Dorl, James J Esq QUALIFIED42Anna Fali
1013James F BologniaFrance2025-04-01Commercial Press PROPOSAL7Ivan Magalhaes
1014Julie F ShinkoUnited Kingdom2025-04-10Buckley Miller Wright NEW24Xuxue Feng
1015Jennifer O TollnerRussia2025-04-10Chapman, Ross E Esq PROPOSAL38Onyama Limba
1016Sinclair R RulapaughItaly2025-03-31Rangoni Of Florence NEW14Amy Elsner
1017Ricardo R SergiSpain2025-04-25Commercial Press PROPOSAL39Stephen Shaw
1018Munro J FlosiGermany2025-04-06Dorl, James J Esq NEW57Ivan Magalhaes
1019Mayumi X MaletItaly2025-04-05Buckley Miller Wright QUALIFIED57Asiya Javayant
1020Arvin T FlosiSpain2025-04-12Printing Dimensions NEW27Asiya Javayant
1021Jefferson X ShinkoRussia2025-04-14Chapman, Ross E Esq NEW84Bernardo Dominic
1022Cody B GauchoRussia2025-04-01Printing Dimensions PROPOSAL52Elwin Sharvill
1023Jones L RutaSpain2025-04-02Commercial Press NEW87Amy Elsner
1024Aditya Z IturbideItaly2025-04-09Printing Dimensions UNQUALIFIED46Elwin Sharvill
1025Cody G PerinIndia2025-04-11Dorl, James J Esq NEW83Anna Fali
1026Octavia S StockhamIndia2025-03-31King, Christopher A Esq NEW37Stephen Shaw
1027Leon E IturbideBrazil2025-04-16Chanay, Jeffrey A Esq UNQUALIFIED27Ivan Magalhaes
1028Kaitlin N GillianSpain2025-04-24Feiner Bros UNQUALIFIED27Stephen Shaw
1029Wickens O VocelkaUnited Kingdom2025-04-06Rangoni Of Florence NEGOTIATION59Xuxue Feng
1030Jennifer R GillianGermany2025-04-28Chapman, Ross E Esq PROPOSAL78Amy Elsner
1031Sinclair X RoysterSpain2025-04-07Rangoni Of Florence PROPOSAL56Ivan Magalhaes
1032Jeanfrancois Q VocelkaUnited Kingdom2025-04-26Benton, John B Jr PROPOSAL9Ioni Bowcher
1033Smith T WieserBrazil2025-04-24Benton, John B Jr NEGOTIATION44Bernardo Dominic
1034Smith R IturbideCanada2025-04-19Rousseaux, Michael Esq UNQUALIFIED53Bernardo Dominic
1035Kadeem T SaylorsSpain2025-04-29Truhlar And Truhlar Attys RENEWAL8Amy Elsner
1036James G RoysterIndia2025-04-28Feiner Bros QUALIFIED21Ivan Magalhaes
1037Chavez M GauchoRussia2025-03-31Commercial Press UNQUALIFIED64Bernardo Dominic
1038Cody S PaprockiCanada2025-04-01Printing Dimensions QUALIFIED19Ivan Magalhaes
1039Jennifer V MorascaGermany2025-04-15Rousseaux, Michael Esq NEGOTIATION82Asiya Javayant
1040Salvatore S WhobreyBrazil2025-04-19Benton, John B Jr RENEWAL82Anna Fali
1041Aika F RulapaughSpain2025-04-27Rangoni Of Florence QUALIFIED62Anna Fali
1042Munro L KuskoArgentina2025-04-22Feiner Bros UNQUALIFIED23Onyama Limba
1043Greenwood D GillianArgentina2025-04-06Feiner Bros UNQUALIFIED24Anna Fali
1044Kadeem L FerenczItaly2025-04-06King, Christopher A Esq RENEWAL28Bernardo Dominic
1045Salvatore N AlbaresUnited Kingdom2025-04-10Rangoni Of Florence PROPOSAL90Onyama Limba
1046Arvin Q AmigonJapan2025-04-29Rangoni Of Florence NEW17Stephen Shaw
1047Juan M WaycottUnited Kingdom2025-04-22Chemel, James L Cpa QUALIFIED51Stephen Shaw
1048James L KolmetzCanada2025-04-16Printing Dimensions NEGOTIATION94Stephen Shaw
1049Isabel M RulapaughFrance2025-04-12Printing Dimensions QUALIFIED24Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Francesco O BowleyIndiaOnyama Limba UNQUALIFIED
Wickens X KuskoArgentinaElwin Sharvill QUALIFIED
Tony I SaylorsUnited KingdomAmy Elsner QUALIFIED
Murillo U SaylorsSpainBernardo Dominic NEW
Morrow S OldroydIndiaBernardo Dominic NEW
Maria L VenereFranceBernardo Dominic NEW
Morrow T GlickGermanyBernardo Dominic UNQUALIFIED
Adams H FollerIndiaXuxue Feng QUALIFIED
Clifford F CaudyBrazilXuxue Feng NEW
Salvatore Y DilliardGermanyAmy Elsner PROPOSAL
Adams N ShinkoBrazilStephen Shaw RENEWAL
Mayumi X NestleSpainXuxue Feng NEW
Cody B WieserCanadaIvan Magalhaes RENEWAL
Leja F RulapaughJapanXuxue Feng NEW
Maria S NickaItalyIoni Bowcher NEW
Jeanfrancois I PoquetteUnited KingdomXuxue Feng RENEWAL
Faith V AlbaresGermanyIvan Magalhaes RENEWAL
Claire C PaprockiArgentinaAmy Elsner NEW
Alejandro X FollerGermanyAnna Fali NEGOTIATION
Aditya A TollnerSpainIoni Bowcher PROPOSAL
Claire P PerinBrazilIoni Bowcher QUALIFIED
Maisha J ButtGermanyXuxue Feng UNQUALIFIED
Leja U FollerItalyElwin Sharvill NEW
Munro V AmigonJapanStephen Shaw QUALIFIED
Misaki E PerinAustraliaBernardo Dominic RENEWAL
Arvin Z FerenczIndiaAnna Fali PROPOSAL
Misaki G DilliardItalyAnna Fali RENEWAL
James C CampainUnited KingdomElwin Sharvill UNQUALIFIED
Jeanfrancois Z FollerJapanOnyama Limba RENEWAL
Izzy I MarrierGermanyOnyama Limba QUALIFIED
Darci T MaletSpainOnyama Limba QUALIFIED
Ashley I BriddickFranceIvan Magalhaes RENEWAL
Aruna L AmigonUnited KingdomAnna Fali UNQUALIFIED
Leon A OldroydIndiaAmy Elsner NEW
Costa O SergiJapanAsiya Javayant PROPOSAL
Jones R AmigonUnited KingdomAmy Elsner NEW
Juan G MacleadJapanAnna Fali QUALIFIED
Arvin C BriddickUnited KingdomAsiya Javayant NEW
Antonio V ButtSpainIvan Magalhaes QUALIFIED
Salvatore A PerinRussiaXuxue Feng RENEWAL
Deepesh T MorascaCanadaIoni Bowcher PROPOSAL
Ricardo M MarrierSpainElwin Sharvill NEW
Morrow F RoysterItalyIvan Magalhaes NEGOTIATION
Rodrigues X AlbaresJapanXuxue Feng NEW
Clifford S RoysterSpainStephen Shaw NEGOTIATION
Greenwood E VenereCanadaOnyama Limba QUALIFIED
Isabel F WhobreyCanadaXuxue Feng NEGOTIATION
Jennifer Y KuskoRussiaIoni Bowcher RENEWAL
Juan A GauchoBrazilBernardo Dominic NEW
Maisha L IturbideGermanyAnna Fali NEGOTIATION
Frozen Columns
Name
Isabel K Nicka
Isabel W Rim
Arvin M Shinko
Adams K Saylors
Clifford F Darakjy
Sinclair O Schemmer
Salvatore Z Shinko
Murillo F Paprocki
Stacey P Ruta
Nicolas S Foller
Alejandro V Bolognia
Silvio W Inouye
Jeanfrancois K Waycott
Adams I Shinko
Morrow R Schemmer
Julie D Kusko
Cody W Bowley
Nicolas E Inouye
Octavia Q Stenseth
Mujtaba U Bowley
Nicolas Q Ruta
Misaki V Schemmer
Kadeem K Nicka
Jefferson N Glick
Greenwood U Ostrosky
Leon T Stenseth
Arvin E Tollner
Chavez N Vocelka
Adams U Perin
Chavez C Saylors
Aika I Figeroa
David F Oldroyd
Mayumi Q Malet
Rodrigues S Campain
Francesco Q Campain
Julie A Tollner
Aruna E Figeroa
Emily J Saylors
Johnson R Campain
Alejandro P Wieser
Antonio R Inouye
Wickens Y Bolognia
Julie B Bowley
Misaki Z Garufi
Cody K Caldarera
Juan Q Whobrey
Silvio G Perin
Faith I Nestle
Juan D Ostrosky
Costa O Darakjy
IdCountryDate
1000Russia2025-04-03
1001Spain2025-04-27
1002Spain2025-04-01
1003Italy2025-04-28
1004Brazil2025-04-10
1005Canada2025-04-06
1006India2025-04-13
1007Argentina2025-04-03
1008Argentina2025-04-01
1009Canada2025-04-12
1010Canada2025-04-05
1011United Kingdom2025-04-25
1012Argentina2025-04-15
1013Argentina2025-04-01
1014Russia2025-04-16
1015Canada2025-04-27
1016Brazil2025-04-05
1017Brazil2025-04-23
1018France2025-04-18
1019Argentina2025-04-26
1020Russia2025-04-06
1021Brazil2025-04-01
1022Germany2025-04-23
1023France2025-04-05
1024Canada2025-04-19
1025Canada2025-04-16
1026Japan2025-04-18
1027Italy2025-04-09
1028Germany2025-04-25
1029Argentina2025-03-31
1030Russia2025-04-01
1031Japan2025-04-21
1032India2025-03-31
1033Australia2025-04-02
1034Brazil2025-04-14
1035Japan2025-04-03
1036Japan2025-04-04
1037France2025-04-15
1038France2025-04-28
1039Brazil2025-04-24
1040India2025-04-14
1041Italy2025-04-01
1042United Kingdom2025-04-24
1043Argentina2025-04-08
1044Brazil2025-04-22
1045Brazil2025-04-29
1046India2025-04-24
1047Brazil2025-04-11
1048Australia2025-04-19
1049United Kingdom2025-04-07

On-Demand Data

NameIdCountryDate
Darci K Poquette1000Spain2025-04-15
Sinclair X Bowley1001Argentina2025-04-08
Leja J Nestle1002Brazil2025-04-09
Ricardo D Gillian1003France2025-04-25
Misaki K Darakjy1004Brazil2025-04-12
Juan K Saylors1005Japan2025-04-03
Arvin Y Gaucho1006Italy2025-04-07
Jeanfrancois V Vocelka1007Germany2025-04-10
Deepesh L Marrier1008Russia2025-04-14
Johnson N Campain1009Japan2025-04-13
Jennifer F Briddick1010Russia2025-04-08
Aika N Tollner1011Russia2025-04-16
Kadeem H Slusarski1012Argentina2025-03-31
Morrow I Garufi1013Brazil2025-04-26
Aika R Kolmetz1014France2025-04-17
Emily I Maclead1015Italy2025-04-21
Rodrigues R Garufi1016France2025-04-10
Morrow U Inouye1017Spain2025-04-10
Johnson Z Ferencz1018Spain2025-04-27
Faith B Saylors1019Russia2025-04-10
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Julie Y MacleadJapanElwin Sharvill RENEWAL
Faith P StockhamSpainXuxue Feng QUALIFIED
Maisha T FlosiAustraliaAnna Fali PROPOSAL
Silvio B WaycottJapanAnna Fali NEGOTIATION
Costa D PerinCanadaElwin Sharvill UNQUALIFIED
Wickens F CaudyArgentinaElwin Sharvill PROPOSAL
Jefferson S RutaBrazilAnna Fali PROPOSAL
Misaki X AlbaresCanadaXuxue Feng PROPOSAL
Jennifer H FlosiJapanBernardo Dominic PROPOSAL
Francesco R DarakjyAustraliaIoni Bowcher QUALIFIED
Tony F FigeroaRussiaOnyama Limba QUALIFIED
Mayumi H SergiGermanyBernardo Dominic NEGOTIATION
Adams R FlosiUnited KingdomElwin Sharvill PROPOSAL
Ashley P MaletUnited KingdomBernardo Dominic NEGOTIATION
Juan S SchemmerAustraliaOnyama Limba NEGOTIATION
Stacey D MaletRussiaXuxue Feng UNQUALIFIED
Faith A PaprockiJapanAmy Elsner QUALIFIED
Salvatore M InouyeAustraliaIoni Bowcher RENEWAL
Tony I ButtAustraliaXuxue Feng NEGOTIATION
Morrow K MaletGermanyOnyama Limba NEGOTIATION
Mujtaba V MarrierBrazilXuxue Feng UNQUALIFIED
Wickens B BowleySpainStephen Shaw NEW
Johnson M MaletJapanBernardo Dominic QUALIFIED
Stacey M RulapaughSpainXuxue Feng NEW
Antonio A CaldareraArgentinaBernardo Dominic UNQUALIFIED
Jones M TollnerBrazilIvan Magalhaes PROPOSAL
Deepesh R StensethIndiaOnyama Limba UNQUALIFIED
Faith A IturbideFranceIoni Bowcher QUALIFIED
Maisha S SlusarskiArgentinaBernardo Dominic QUALIFIED
Mayumi H StockhamArgentinaIvan Magalhaes RENEWAL
Francesco H BowleyGermanyIoni Bowcher NEW
Octavia O MorascaFranceIvan Magalhaes NEGOTIATION
Aditya N KuskoAustraliaStephen Shaw NEW
Darci M RulapaughRussiaStephen Shaw PROPOSAL
Jennifer O NickaBrazilIoni Bowcher NEW
Ivar J VenereItalyIvan Magalhaes NEGOTIATION
Antonio Z PaprockiIndiaXuxue Feng QUALIFIED
Jeanfrancois F StensethArgentinaIoni Bowcher RENEWAL
Faith U IturbideGermanyIoni Bowcher QUALIFIED
Julie P NestleAustraliaIvan Magalhaes RENEWAL

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