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
Ashley W FollerIndiaStephen Shaw NEGOTIATION
Tony U KuskoFranceElwin Sharvill PROPOSAL
Salvatore F NickaJapanXuxue Feng UNQUALIFIED
Aditya H RoysterGermanyOnyama Limba QUALIFIED
Sinclair C FerenczSpainXuxue Feng QUALIFIED
Aditya B ChuiAustraliaIoni Bowcher UNQUALIFIED
Faith K CampainRussiaIoni Bowcher QUALIFIED
Salvatore M PaprockiBrazilXuxue Feng QUALIFIED
Leja B DarakjyUnited KingdomElwin Sharvill PROPOSAL
Izzy K DoeSpainAsiya Javayant RENEWAL
Kadeem Y GauchoFranceIvan Magalhaes UNQUALIFIED
Morrow K FigeroaIndiaIvan Magalhaes PROPOSAL
Julie D FlosiItalyElwin Sharvill PROPOSAL
Jennifer Z DoeBrazilXuxue Feng UNQUALIFIED
Ivar U IturbideIndiaIoni Bowcher PROPOSAL
Isabel M VocelkaItalyElwin Sharvill PROPOSAL
Deepesh O MaletBrazilElwin Sharvill QUALIFIED
Aika T ChuiAustraliaXuxue Feng UNQUALIFIED
Nicolas U FollerCanadaBernardo Dominic RENEWAL
Sinclair Y AmigonCanadaElwin Sharvill NEGOTIATION
Emily X NickaUnited KingdomAnna Fali RENEWAL
Faith U OldroydFranceIoni Bowcher QUALIFIED
Silvio N SaylorsRussiaBernardo Dominic RENEWAL
Rodrigues N SaylorsAustraliaBernardo Dominic NEW
Jefferson E BowleyArgentinaIoni Bowcher RENEWAL
Greenwood B MaletBrazilIvan Magalhaes PROPOSAL
Costa J BriddickIndiaOnyama Limba QUALIFIED
Mujtaba J NickaBrazilAmy Elsner RENEWAL
Jennifer L CaudyIndiaAmy Elsner UNQUALIFIED
Ivar B CaudyUnited KingdomXuxue Feng UNQUALIFIED
Faith B ChuiCanadaBernardo Dominic PROPOSAL
Maisha Q WieserArgentinaAsiya Javayant NEW
James S FlosiBrazilAsiya Javayant QUALIFIED
Misaki G CaudyCanadaAsiya Javayant UNQUALIFIED
Ashley C GarufiIndiaElwin Sharvill NEGOTIATION
Costa M GillianJapanElwin Sharvill QUALIFIED
Leja O StensethItalyAmy Elsner NEW
Murillo Y SchemmerUnited KingdomAnna Fali PROPOSAL
Izzy J GillianGermanyAmy Elsner UNQUALIFIED
Murillo C FerenczRussiaAmy Elsner PROPOSAL
Silvio Z ShinkoGermanyAnna Fali NEGOTIATION
Claire Y SaylorsSpainIoni Bowcher UNQUALIFIED
Munro L RulapaughRussiaStephen Shaw NEGOTIATION
Aruna X WhobreyCanadaIoni Bowcher UNQUALIFIED
Aruna V CampainGermanyAnna Fali RENEWAL
Chavez N NickaBrazilAsiya Javayant QUALIFIED
Ricardo E SergiRussiaOnyama Limba NEGOTIATION
Maria I RimCanadaAsiya Javayant RENEWAL
Johnson Q VocelkaArgentinaXuxue Feng NEW
Mujtaba A MaletFranceAmy Elsner UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Salvatore Y RimFranceBernardo Dominic NEW
Cody C FigeroaCanadaIvan Magalhaes PROPOSAL
Francesco D DilliardRussiaIvan Magalhaes RENEWAL
Nicolas X MacleadArgentinaXuxue Feng UNQUALIFIED
Alejandro J AlbaresIndiaIoni Bowcher UNQUALIFIED
Murillo R DilliardAustraliaXuxue Feng RENEWAL
Maisha R GauchoRussiaAnna Fali NEW
Jones K SaylorsItalyXuxue Feng RENEWAL
Johnson I MaletFranceXuxue Feng QUALIFIED
Leon M AlbaresCanadaXuxue Feng NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Silvio W ShinkoArgentina2025-06-12Feiner Bros RENEWAL69Xuxue Feng
1001Smith W GauchoIndia2025-05-17Feltz Printing Service UNQUALIFIED38Ivan Magalhaes
1002Salvatore R KolmetzIndia2025-05-24Chapman, Ross E Esq RENEWAL41Onyama Limba
1003Maisha J PerinIndia2025-06-10King, Christopher A Esq RENEWAL55Xuxue Feng
1004Clifford H FlosiCanada2025-05-28Commercial Press UNQUALIFIED73Asiya Javayant
1005Stacey K FlosiGermany2025-05-22Chanay, Jeffrey A Esq NEW13Amy Elsner
1006Morrow G GauchoGermany2025-05-23Rousseaux, Michael Esq PROPOSAL53Ioni Bowcher
1007Tony H CampainFrance2025-05-23King, Christopher A Esq QUALIFIED23Amy Elsner
1008Mayumi F NestleAustralia2025-05-18Rousseaux, Michael Esq NEW55Amy Elsner
1009Leja K VenereJapan2025-05-24Benton, John B Jr NEGOTIATION44Stephen Shaw
1010Julie E DilliardUnited Kingdom2025-06-01Truhlar And Truhlar Attys UNQUALIFIED39Asiya Javayant
1011Adams S GarufiUnited Kingdom2025-06-04Printing Dimensions NEW11Onyama Limba
1012Smith Z DoeBrazil2025-05-31Chanay, Jeffrey A Esq PROPOSAL69Stephen Shaw
1013David S MacleadCanada2025-05-25Feltz Printing Service QUALIFIED7Elwin Sharvill
1014Maria B ChuiAustralia2025-05-21Feltz Printing Service QUALIFIED90Stephen Shaw
1015Deepesh G OstroskyUnited Kingdom2025-05-20Chanay, Jeffrey A Esq UNQUALIFIED75Amy Elsner
1016Sinclair V BriddickGermany2025-05-27Buckley Miller Wright PROPOSAL13Bernardo Dominic
1017Aika T FigeroaArgentina2025-06-04Benton, John B Jr RENEWAL83Elwin Sharvill
1018Kadeem W GauchoFrance2025-05-27Feltz Printing Service RENEWAL16Amy Elsner
1019Salvatore F RoysterBrazil2025-05-28Chanay, Jeffrey A Esq UNQUALIFIED27Elwin Sharvill
1020Alejandro U FerenczIndia2025-05-28Morlong Associates NEW92Elwin Sharvill
1021Octavia I KuskoUnited Kingdom2025-05-23Truhlar And Truhlar Attys NEGOTIATION59Bernardo Dominic
1022Deepesh C BologniaCanada2025-05-24Truhlar And Truhlar Attys RENEWAL50Xuxue Feng
1023Nicolas Q PerinBrazil2025-06-13Feiner Bros QUALIFIED62Ivan Magalhaes
1024Isabel F SchemmerGermany2025-06-05Benton, John B Jr UNQUALIFIED72Stephen Shaw
1025Nicolas Z FollerJapan2025-05-29Chapman, Ross E Esq NEGOTIATION75Stephen Shaw
1026Maisha F RutaCanada2025-05-30Feltz Printing Service NEGOTIATION36Xuxue Feng
1027Mayumi U AmigonItaly2025-06-11Morlong Associates UNQUALIFIED9Amy Elsner
1028Costa A CampainJapan2025-05-26Commercial Press UNQUALIFIED86Anna Fali
1029Octavia T DoeGermany2025-06-11Feltz Printing Service QUALIFIED12Elwin Sharvill
1030Ricardo H CaudyItaly2025-06-01Feltz Printing Service UNQUALIFIED60Amy Elsner
1031Maisha G KolmetzBrazil2025-06-01Commercial Press UNQUALIFIED62Amy Elsner
1032Emily S FigeroaJapan2025-05-28Chanay, Jeffrey A Esq QUALIFIED55Anna Fali
1033Izzy G RimUnited Kingdom2025-05-23Printing Dimensions RENEWAL17Stephen Shaw
1034Clifford C RoysterCanada2025-06-01Buckley Miller Wright QUALIFIED12Asiya Javayant
1035Aditya T FlosiSpain2025-06-09Feltz Printing Service NEW88Xuxue Feng
1036Silvio Q MorascaRussia2025-05-28Buckley Miller Wright NEGOTIATION52Stephen Shaw
1037Jones I NickaArgentina2025-05-26Chapman, Ross E Esq NEW0Elwin Sharvill
1038Ashley U ShinkoFrance2025-05-28Truhlar And Truhlar Attys PROPOSAL92Ivan Magalhaes
1039Octavia V NestleRussia2025-05-31Buckley Miller Wright NEW44Ivan Magalhaes
1040Tony L OldroydJapan2025-06-12Dorl, James J Esq QUALIFIED7Ioni Bowcher
1041Claire Y WhobreyAustralia2025-05-17Benton, John B Jr QUALIFIED23Elwin Sharvill
1042Mayumi C GauchoItaly2025-05-22Chapman, Ross E Esq UNQUALIFIED26Ioni Bowcher
1043Smith W RutaItaly2025-05-23Printing Dimensions UNQUALIFIED9Ivan Magalhaes
1044Kadeem Z WhobreyIndia2025-06-14Benton, John B Jr QUALIFIED50Ioni Bowcher
1045Johnson Z PaprockiAustralia2025-05-17Commercial Press RENEWAL23Xuxue Feng
1046Morrow E SaylorsSpain2025-06-07Printing Dimensions NEGOTIATION64Onyama Limba
1047Cody P DilliardJapan2025-06-08Dorl, James J Esq NEGOTIATION23Onyama Limba
1048Jones Y ChuiFrance2025-05-19Rousseaux, Michael Esq PROPOSAL52Asiya Javayant
1049Jeanfrancois W GauchoGermany2025-06-13King, Christopher A Esq NEGOTIATION96Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Darci R FlosiCanadaAnna Fali UNQUALIFIED
Octavia K BowleyFranceOnyama Limba RENEWAL
Deepesh D WhobreyFranceElwin Sharvill UNQUALIFIED
Sinclair B DilliardBrazilBernardo Dominic UNQUALIFIED
Jefferson X ChuiArgentinaIoni Bowcher UNQUALIFIED
Francesco T FollerArgentinaIoni Bowcher PROPOSAL
Stacey M GlickGermanyAmy Elsner UNQUALIFIED
Tony Q MarrierGermanyStephen Shaw QUALIFIED
Leja S MarrierArgentinaIvan Magalhaes UNQUALIFIED
Misaki R GlickJapanBernardo Dominic NEGOTIATION
Silvio D ChuiFranceAsiya Javayant RENEWAL
Isabel L DilliardJapanAnna Fali NEW
Aruna Q RoysterUnited KingdomIoni Bowcher RENEWAL
Faith J CaldareraSpainStephen Shaw PROPOSAL
Nicolas H BriddickIndiaAmy Elsner RENEWAL
Wickens A RimAustraliaIoni Bowcher RENEWAL
Kaitlin K IturbideFranceElwin Sharvill NEGOTIATION
Claire Z KuskoIndiaAmy Elsner NEW
Aika D AmigonBrazilAmy Elsner RENEWAL
James H RulapaughItalyIoni Bowcher NEGOTIATION
Isabel V SlusarskiJapanStephen Shaw UNQUALIFIED
Silvio Z BriddickBrazilAmy Elsner NEW
Octavia I StensethArgentinaAnna Fali RENEWAL
Nicolas Y MacleadCanadaIvan Magalhaes UNQUALIFIED
Octavia E FerenczIndiaIoni Bowcher RENEWAL
Julie L MacleadRussiaXuxue Feng QUALIFIED
Ashley Z ShinkoBrazilAsiya Javayant RENEWAL
Stacey E RimArgentinaIvan Magalhaes NEW
Leja F MaletArgentinaAmy Elsner RENEWAL
Stacey A OstroskyBrazilIoni Bowcher NEW
Stacey V DilliardCanadaAsiya Javayant NEGOTIATION
Francesco S GauchoGermanyAsiya Javayant RENEWAL
Jones L MacleadSpainAnna Fali UNQUALIFIED
Jefferson Z KolmetzRussiaStephen Shaw NEGOTIATION
Antonio I TollnerFranceStephen Shaw QUALIFIED
Julie J WieserJapanAmy Elsner UNQUALIFIED
Kadeem R WhobreyUnited KingdomIvan Magalhaes NEGOTIATION
Leon N TollnerBrazilAmy Elsner RENEWAL
Julie C FigeroaFranceElwin Sharvill NEGOTIATION
Ricardo V GillianItalyAnna Fali RENEWAL
Chavez E KolmetzGermanyXuxue Feng PROPOSAL
Johnson E MorascaGermanyStephen Shaw RENEWAL
Costa J AlbaresCanadaAmy Elsner PROPOSAL
Claire V GarufiRussiaXuxue Feng QUALIFIED
Deepesh G PoquetteSpainStephen Shaw QUALIFIED
James Y KuskoJapanAnna Fali UNQUALIFIED
Kaitlin H WaycottCanadaIvan Magalhaes QUALIFIED
Leon Q RutaBrazilAsiya Javayant RENEWAL
Mayumi L DilliardJapanXuxue Feng RENEWAL
Antonio J BologniaGermanyElwin Sharvill PROPOSAL
Frozen Columns
Name
James I Foller
Sinclair K Shinko
Maisha C Figeroa
Misaki D Saylors
Smith G Campain
Julie A Dilliard
Kadeem S Doe
Ashley E Royster
Jennifer U Iturbide
Faith P Saylors
Costa D Slusarski
Mujtaba A Campain
Darci D Foller
Arvin S Garufi
Mayumi C Slusarski
Costa V Maclead
Juan B Rim
Wickens K Gaucho
Cody P Rim
Jeanfrancois B Sergi
Smith T Tollner
Darci D Kusko
Clifford F Stenseth
David T Darakjy
Maisha K Venere
Clifford O Foller
Nicolas Z Gillian
Aruna S Briddick
Wickens A Stenseth
Nicolas B Doe
Francesco M Poquette
Smith L Glick
Jones N Tollner
Chavez F Wieser
Maisha H Gillian
Mayumi R Perin
Arvin I Kusko
Antonio F Morasca
Murillo H Shinko
Johnson C Royster
Emily R Saylors
Octavia F Flosi
Leon W Campain
Ivar Q Malet
Kaitlin C Campain
Francesco M Dilliard
Stacey X Kusko
Emily C Ferencz
Aika F Ferencz
Clifford J Vocelka
IdCountryDate
1000India2025-05-23
1001Argentina2025-06-12
1002Japan2025-06-05
1003Russia2025-05-25
1004United Kingdom2025-06-10
1005Australia2025-05-28
1006United Kingdom2025-06-05
1007United Kingdom2025-06-11
1008United Kingdom2025-06-09
1009Argentina2025-06-04
1010France2025-06-01
1011Italy2025-06-14
1012Australia2025-05-25
1013Italy2025-05-24
1014Italy2025-05-22
1015Japan2025-05-29
1016Canada2025-06-02
1017India2025-06-06
1018Italy2025-06-13
1019Brazil2025-06-11
1020France2025-05-27
1021Russia2025-05-22
1022Canada2025-06-09
1023Italy2025-05-22
1024Italy2025-05-31
1025Italy2025-06-08
1026Canada2025-05-23
1027Russia2025-06-14
1028Argentina2025-05-22
1029United Kingdom2025-05-21
1030India2025-05-20
1031Germany2025-06-05
1032Japan2025-05-23
1033Brazil2025-05-24
1034Brazil2025-05-17
1035Japan2025-05-28
1036Brazil2025-05-24
1037India2025-06-10
1038France2025-06-03
1039Italy2025-05-27
1040Russia2025-06-12
1041India2025-06-04
1042Brazil2025-05-30
1043Russia2025-05-25
1044France2025-06-14
1045Argentina2025-05-17
1046Argentina2025-05-28
1047Brazil2025-05-25
1048United Kingdom2025-05-30
1049Italy2025-06-01

On-Demand Data

NameIdCountryDate
Clifford U Marrier1000Canada2025-06-09
Juan F Foller1001Italy2025-06-03
Adams H Tollner1002France2025-05-28
Sinclair X Oldroyd1003United Kingdom2025-06-08
Leon L Malet1004Japan2025-05-25
Juan Q Ferencz1005Italy2025-06-11
Mayumi Q Maclead1006Argentina2025-06-13
Nicolas T Ruta1007India2025-06-08
Arvin A Royster1008Argentina2025-05-30
Ivar B Royster1009Spain2025-05-29
Mayumi C Saylors1010Brazil2025-06-10
Munro I Shinko1011Italy2025-05-24
David Z Vocelka1012Spain2025-06-02
Aruna B Marrier1013Italy2025-06-10
Mujtaba Q Gaucho1014India2025-06-02
Ricardo Z Glick1015Italy2025-05-29
Octavia Q Ferencz1016Italy2025-05-23
Alejandro U Ruta1017Germany2025-05-18
Claire W Garufi1018Brazil2025-05-25
Ricardo W Paprocki1019Spain2025-06-07
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Kadeem U RimGermanyXuxue Feng RENEWAL
Nicolas S CampainIndiaAsiya Javayant QUALIFIED
Isabel I WieserCanadaAsiya Javayant QUALIFIED
Stacey I RoysterFranceAsiya Javayant NEGOTIATION
Leja W SchemmerJapanAmy Elsner NEW
Julie V CampainBrazilElwin Sharvill NEW
Izzy Y WhobreyIndiaAnna Fali NEGOTIATION
Claire Z OldroydIndiaAnna Fali NEGOTIATION
Johnson O InouyeArgentinaIvan Magalhaes NEGOTIATION
Octavia Q NickaUnited KingdomXuxue Feng RENEWAL
Cody A KolmetzFranceStephen Shaw NEW
Emily R InouyeSpainIoni Bowcher NEW
James H AlbaresArgentinaElwin Sharvill NEGOTIATION
Tony N DoeSpainAmy Elsner NEW
Julie T RoysterIndiaBernardo Dominic NEGOTIATION
Deepesh Z FlosiJapanElwin Sharvill NEW
Murillo J RoysterGermanyBernardo Dominic PROPOSAL
Kaitlin Z TollnerRussiaElwin Sharvill PROPOSAL
Chavez P FlosiJapanAsiya Javayant NEGOTIATION
Arvin E SergiSpainOnyama Limba PROPOSAL
James Q RutaUnited KingdomAsiya Javayant NEW
Maria K MaletRussiaElwin Sharvill RENEWAL
Alejandro P WaycottUnited KingdomAmy Elsner PROPOSAL
Kaitlin M KolmetzGermanyElwin Sharvill UNQUALIFIED
Alejandro S WieserGermanyAsiya Javayant QUALIFIED
Aditya E AlbaresGermanyStephen Shaw QUALIFIED
Octavia W OstroskyCanadaElwin Sharvill UNQUALIFIED
Munro V IturbideItalyIvan Magalhaes PROPOSAL
Aika G PoquetteCanadaAsiya Javayant NEGOTIATION
Morrow V KolmetzJapanAsiya Javayant RENEWAL
Faith L InouyeAustraliaOnyama Limba UNQUALIFIED
Greenwood S RutaAustraliaElwin Sharvill PROPOSAL
Izzy Q FollerCanadaBernardo Dominic UNQUALIFIED
Ashley X MaletGermanyAsiya Javayant NEW
Ashley K ShinkoJapanAnna Fali RENEWAL
Greenwood M SlusarskiIndiaIvan Magalhaes RENEWAL
Chavez M IturbideGermanyBernardo Dominic QUALIFIED
Isabel I DarakjyAustraliaXuxue Feng UNQUALIFIED
Francesco U NickaIndiaAnna Fali UNQUALIFIED
Maisha X MacleadIndiaIvan 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>