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
Maria Z ChuiIndiaAnna Fali NEW
Aika P GillianGermanyOnyama Limba NEGOTIATION
Cody E StockhamSpainBernardo Dominic PROPOSAL
Aruna G GillianUnited KingdomIvan Magalhaes RENEWAL
Ashley D SaylorsItalyOnyama Limba UNQUALIFIED
Leon T ChuiItalyAsiya Javayant PROPOSAL
Aika Z TollnerJapanAsiya Javayant QUALIFIED
Aika U GlickBrazilBernardo Dominic UNQUALIFIED
Kaitlin W MaletFranceIvan Magalhaes RENEWAL
Clifford F AmigonCanadaStephen Shaw PROPOSAL
Greenwood J TollnerUnited KingdomStephen Shaw PROPOSAL
Salvatore T FollerSpainAnna Fali PROPOSAL
Arvin L WaycottIndiaAsiya Javayant NEW
Nicolas H MaletUnited KingdomXuxue Feng NEW
Misaki M VenereSpainIoni Bowcher NEGOTIATION
Rodrigues V GauchoCanadaIoni Bowcher PROPOSAL
Munro H BowleyArgentinaOnyama Limba NEGOTIATION
Mayumi E ButtUnited KingdomAmy Elsner QUALIFIED
David Z PerinFranceStephen Shaw PROPOSAL
Alejandro E SchemmerBrazilAmy Elsner RENEWAL
Salvatore A MaletFranceXuxue Feng RENEWAL
Stacey V CaudyIndiaStephen Shaw NEW
Aditya I GlickBrazilXuxue Feng NEW
Aika Q MaletArgentinaIvan Magalhaes PROPOSAL
Izzy U GlickCanadaElwin Sharvill RENEWAL
Claire L SlusarskiArgentinaIoni Bowcher RENEWAL
Emily A StockhamAustraliaXuxue Feng NEGOTIATION
Costa J VocelkaFranceElwin Sharvill NEW
James X KuskoBrazilAsiya Javayant RENEWAL
Juan I WaycottAustraliaStephen Shaw PROPOSAL
Misaki V VocelkaRussiaAnna Fali UNQUALIFIED
Arvin F WaycottRussiaAsiya Javayant QUALIFIED
Mujtaba D SchemmerGermanyIvan Magalhaes UNQUALIFIED
Ricardo H DarakjyArgentinaElwin Sharvill NEW
Aika D BowleyUnited KingdomIoni Bowcher UNQUALIFIED
Aruna X WaycottJapanIoni Bowcher PROPOSAL
Jefferson K VenereBrazilIvan Magalhaes RENEWAL
Aika H FlosiUnited KingdomIvan Magalhaes UNQUALIFIED
Kadeem Z PerinAustraliaIoni Bowcher NEW
David S AmigonArgentinaBernardo Dominic RENEWAL
Kadeem R BriddickCanadaBernardo Dominic UNQUALIFIED
Sinclair Y GauchoBrazilElwin Sharvill QUALIFIED
Kaitlin L MaletRussiaIoni Bowcher RENEWAL
Jeanfrancois A GillianGermanyStephen Shaw PROPOSAL
Emily J DarakjyAustraliaXuxue Feng NEW
Clifford W StensethArgentinaIvan Magalhaes NEGOTIATION
Salvatore X MacleadUnited KingdomIvan Magalhaes RENEWAL
Maria S StensethArgentinaBernardo Dominic PROPOSAL
Sinclair K ButtArgentinaElwin Sharvill PROPOSAL
Murillo H CampainSpainStephen Shaw UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Deepesh P NestleFranceXuxue Feng NEGOTIATION
Ivar B OstroskySpainElwin Sharvill NEGOTIATION
Aditya H PoquetteArgentinaStephen Shaw QUALIFIED
Jefferson D SaylorsRussiaBernardo Dominic PROPOSAL
Alejandro A StensethCanadaAnna Fali NEGOTIATION
Stacey S SaylorsGermanyIvan Magalhaes UNQUALIFIED
Francesco S KuskoGermanyAsiya Javayant UNQUALIFIED
Munro M RulapaughItalyElwin Sharvill RENEWAL
Antonio N OstroskyArgentinaBernardo Dominic NEGOTIATION
Jeanfrancois V MorascaItalyXuxue Feng NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Tony C GarufiArgentina2025-05-08Chanay, Jeffrey A Esq NEGOTIATION95Bernardo Dominic
1001Antonio L InouyeAustralia2025-04-22Truhlar And Truhlar Attys NEW18Onyama Limba
1002David R FlosiJapan2025-04-17Truhlar And Truhlar Attys UNQUALIFIED30Ivan Magalhaes
1003Arvin L RoysterSpain2025-04-28Rousseaux, Michael Esq QUALIFIED55Stephen Shaw
1004Leon Z DilliardSpain2025-04-29Benton, John B Jr NEW93Onyama Limba
1005Jeanfrancois E MaletAustralia2025-04-25Chemel, James L Cpa NEGOTIATION53Ivan Magalhaes
1006Maisha T SlusarskiFrance2025-04-14Chanay, Jeffrey A Esq UNQUALIFIED71Stephen Shaw
1007David N WieserBrazil2025-04-24Chanay, Jeffrey A Esq RENEWAL28Elwin Sharvill
1008Julie J GarufiIndia2025-04-09Dorl, James J Esq RENEWAL62Xuxue Feng
1009Ashley Z GauchoArgentina2025-05-08Rangoni Of Florence NEW80Amy Elsner
1010Wickens G ButtItaly2025-04-20Buckley Miller Wright PROPOSAL81Elwin Sharvill
1011Mujtaba W AmigonArgentina2025-04-09Feltz Printing Service PROPOSAL47Ioni Bowcher
1012Munro D OstroskyIndia2025-04-24King, Christopher A Esq NEW55Asiya Javayant
1013Smith M RimJapan2025-05-02Chemel, James L Cpa UNQUALIFIED5Ivan Magalhaes
1014Emily J FollerUnited Kingdom2025-04-09Buckley Miller Wright UNQUALIFIED67Asiya Javayant
1015Stacey Q DoeCanada2025-05-05Benton, John B Jr RENEWAL28Onyama Limba
1016Isabel U CaldareraAustralia2025-04-25Chapman, Ross E Esq UNQUALIFIED23Xuxue Feng
1017Cody Y RoysterItaly2025-04-09Feiner Bros PROPOSAL82Asiya Javayant
1018Mujtaba U DoeGermany2025-05-01Buckley Miller Wright UNQUALIFIED6Elwin Sharvill
1019Silvio P PerinItaly2025-05-03Truhlar And Truhlar Attys PROPOSAL18Ivan Magalhaes
1020Morrow E SergiArgentina2025-04-15Dorl, James J Esq QUALIFIED99Elwin Sharvill
1021Aruna J GlickItaly2025-04-18Chapman, Ross E Esq UNQUALIFIED56Xuxue Feng
1022Tony A CaudyRussia2025-04-10Chanay, Jeffrey A Esq PROPOSAL66Ivan Magalhaes
1023Rodrigues K OldroydRussia2025-04-15Rangoni Of Florence PROPOSAL34Ivan Magalhaes
1024Jennifer W InouyeArgentina2025-05-07Chapman, Ross E Esq QUALIFIED45Bernardo Dominic
1025Chavez Y WaycottSpain2025-04-19Benton, John B Jr NEGOTIATION39Asiya Javayant
1026Kaitlin L DoeUnited Kingdom2025-04-27Chanay, Jeffrey A Esq NEGOTIATION21Stephen Shaw
1027Jeanfrancois C VocelkaSpain2025-05-04Feiner Bros PROPOSAL52Bernardo Dominic
1028Octavia M DarakjyArgentina2025-04-23Feltz Printing Service NEGOTIATION38Bernardo Dominic
1029Adams O TollnerBrazil2025-05-08Printing Dimensions QUALIFIED48Elwin Sharvill
1030Leja V InouyeAustralia2025-05-01Truhlar And Truhlar Attys QUALIFIED3Asiya Javayant
1031Stacey L DilliardUnited Kingdom2025-05-01Rousseaux, Michael Esq NEGOTIATION87Ioni Bowcher
1032Johnson Z NestleIndia2025-04-09Truhlar And Truhlar Attys QUALIFIED7Amy Elsner
1033Alejandro X ButtItaly2025-04-16Buckley Miller Wright NEW63Xuxue Feng
1034Kaitlin L MorascaJapan2025-04-20Morlong Associates NEW25Anna Fali
1035Darci A PerinArgentina2025-05-06Truhlar And Truhlar Attys RENEWAL74Ivan Magalhaes
1036Cody N NestleItaly2025-04-24Rousseaux, Michael Esq RENEWAL2Ivan Magalhaes
1037Jones M SchemmerIndia2025-04-18Truhlar And Truhlar Attys RENEWAL35Ivan Magalhaes
1038Kadeem H OstroskySpain2025-05-02King, Christopher A Esq UNQUALIFIED46Xuxue Feng
1039Maisha G CampainBrazil2025-04-26Feiner Bros NEGOTIATION55Onyama Limba
1040Wickens S SchemmerBrazil2025-05-02King, Christopher A Esq QUALIFIED97Ivan Magalhaes
1041Faith R DilliardSpain2025-04-23King, Christopher A Esq QUALIFIED40Asiya Javayant
1042Antonio L SaylorsIndia2025-04-11Chanay, Jeffrey A Esq PROPOSAL76Anna Fali
1043Stacey R MorascaIndia2025-04-18Commercial Press PROPOSAL87Onyama Limba
1044Francesco Y BologniaSpain2025-05-03Truhlar And Truhlar Attys PROPOSAL94Bernardo Dominic
1045Jefferson Y AlbaresGermany2025-04-24Rousseaux, Michael Esq QUALIFIED53Amy Elsner
1046Munro A VenereCanada2025-04-27Rangoni Of Florence UNQUALIFIED53Ioni Bowcher
1047Izzy C NickaCanada2025-04-10Morlong Associates RENEWAL45Amy Elsner
1048Kadeem A BologniaGermany2025-04-12Feltz Printing Service NEW23Ivan Magalhaes
1049Francesco D FlosiArgentina2025-05-07Printing Dimensions RENEWAL39Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Silvio K RimArgentinaIoni Bowcher QUALIFIED
Aruna G RutaItalyBernardo Dominic QUALIFIED
Nicolas S PaprockiCanadaAnna Fali PROPOSAL
Greenwood H GauchoRussiaXuxue Feng NEW
Mayumi V VenereGermanyXuxue Feng UNQUALIFIED
Salvatore E CampainFranceIvan Magalhaes QUALIFIED
Salvatore L FigeroaItalyStephen Shaw NEGOTIATION
Smith B ButtSpainXuxue Feng PROPOSAL
David R GauchoRussiaStephen Shaw NEGOTIATION
Faith Y InouyeCanadaIoni Bowcher NEGOTIATION
Sinclair T FerenczCanadaBernardo Dominic UNQUALIFIED
Aditya I MorascaCanadaXuxue Feng QUALIFIED
Morrow U PerinGermanyXuxue Feng RENEWAL
Wickens B MarrierUnited KingdomXuxue Feng PROPOSAL
Tony G RulapaughFranceElwin Sharvill NEGOTIATION
Misaki E ShinkoCanadaAnna Fali QUALIFIED
Kaitlin V GlickArgentinaOnyama Limba RENEWAL
Leja V BowleyRussiaAsiya Javayant PROPOSAL
Silvio L MaletFranceStephen Shaw PROPOSAL
Aruna I GillianAustraliaBernardo Dominic NEW
Cody E WieserUnited KingdomAmy Elsner PROPOSAL
Maisha R DarakjyUnited KingdomStephen Shaw UNQUALIFIED
Aditya J KolmetzCanadaAmy Elsner NEGOTIATION
Munro I OldroydGermanyAsiya Javayant PROPOSAL
Leja B PoquetteJapanOnyama Limba UNQUALIFIED
Mujtaba V SergiGermanyOnyama Limba PROPOSAL
Octavia W GillianSpainAmy Elsner PROPOSAL
Juan C CaudyRussiaIvan Magalhaes PROPOSAL
Antonio J ChuiAustraliaBernardo Dominic QUALIFIED
Greenwood H RulapaughCanadaIvan Magalhaes NEW
Wickens P SchemmerAustraliaElwin Sharvill PROPOSAL
Silvio Q SergiBrazilStephen Shaw RENEWAL
David E MorascaSpainAmy Elsner RENEWAL
Octavia I StockhamFranceIoni Bowcher QUALIFIED
Mayumi N MacleadSpainXuxue Feng NEGOTIATION
Arvin T NestleCanadaElwin Sharvill UNQUALIFIED
Deepesh E GlickRussiaStephen Shaw NEW
Isabel M FollerBrazilElwin Sharvill RENEWAL
Ivar U RutaSpainXuxue Feng UNQUALIFIED
David U DilliardGermanyAsiya Javayant RENEWAL
Antonio T FerenczGermanyOnyama Limba QUALIFIED
Salvatore H FlosiSpainElwin Sharvill UNQUALIFIED
Claire L RimAustraliaElwin Sharvill PROPOSAL
Ricardo A CaudyGermanyXuxue Feng NEW
Deepesh J TollnerFranceStephen Shaw NEGOTIATION
Maisha X InouyeBrazilAmy Elsner NEW
Kaitlin O BologniaArgentinaElwin Sharvill UNQUALIFIED
Maria D FlosiIndiaAmy Elsner NEW
Costa P TollnerArgentinaIoni Bowcher NEGOTIATION
Mujtaba Y OstroskyGermanyIvan Magalhaes UNQUALIFIED
Frozen Columns
Name
Aruna Q Perin
Arvin S Malet
Jennifer N Kolmetz
Jennifer P Foller
Sinclair Z Ferencz
Murillo X Dilliard
Juan R Perin
Deepesh A Slusarski
Nicolas M Butt
Wickens K Darakjy
Alejandro L Ostrosky
Greenwood G Malet
Costa N Bowley
Nicolas Y Rim
Sinclair S Ostrosky
Darci J Butt
Leja Y Wieser
Aruna F Campain
Mayumi W Wieser
Jones X Bolognia
Ashley Q Darakjy
Maria Q Butt
Julie K Perin
Isabel C Gillian
Kadeem B Marrier
Francesco T Saylors
Emily K Bowley
Claire C Malet
Aditya A Iturbide
Jeanfrancois V Vocelka
Alejandro A Garufi
Johnson O Bolognia
Juan O Nestle
Jennifer H Rulapaugh
Mujtaba A Malet
Julie F Butt
David W Glick
Antonio X Maclead
Clifford P Ferencz
Jeanfrancois Y Dilliard
Leon N Royster
Juan X Morasca
Cody M Inouye
Alejandro T Bowley
Darci K Royster
Darci U Saylors
Arvin J Rulapaugh
Octavia S Ruta
Misaki Z Schemmer
Clifford C Campain
IdCountryDate
1000Australia2025-05-01
1001Australia2025-05-08
1002United Kingdom2025-04-26
1003Russia2025-04-19
1004Spain2025-04-15
1005Brazil2025-04-24
1006Canada2025-05-08
1007Canada2025-04-28
1008Argentina2025-04-16
1009France2025-04-17
1010Russia2025-04-11
1011Canada2025-04-10
1012Brazil2025-04-24
1013Germany2025-04-26
1014United Kingdom2025-04-22
1015Italy2025-05-03
1016Japan2025-04-12
1017Japan2025-04-17
1018Germany2025-05-07
1019Russia2025-04-09
1020France2025-05-08
1021France2025-04-29
1022United Kingdom2025-04-15
1023Russia2025-04-11
1024Australia2025-05-04
1025Spain2025-04-22
1026France2025-04-17
1027Argentina2025-04-27
1028Canada2025-05-04
1029France2025-04-12
1030Australia2025-04-19
1031United Kingdom2025-04-11
1032Russia2025-04-19
1033India2025-05-05
1034Canada2025-04-16
1035United Kingdom2025-04-23
1036Spain2025-04-10
1037Canada2025-04-24
1038Argentina2025-04-14
1039Germany2025-04-28
1040United Kingdom2025-05-02
1041United Kingdom2025-04-25
1042Italy2025-05-05
1043France2025-04-25
1044Australia2025-04-20
1045Argentina2025-05-04
1046India2025-04-23
1047Australia2025-04-12
1048Canada2025-05-02
1049Italy2025-04-17

On-Demand Data

NameIdCountryDate
Wickens M Vocelka1000Germany2025-04-15
Leja J Sergi1001Australia2025-05-02
Smith A Albares1002Australia2025-05-08
Aditya P Morasca1003Russia2025-04-29
Cody S Wieser1004Canada2025-05-08
Smith C Stockham1005Japan2025-04-16
Clifford W Saylors1006Germany2025-05-02
Misaki I Gaucho1007Brazil2025-04-26
Jennifer M Royster1008Germany2025-05-05
Silvio X Paprocki1009Russia2025-04-10
Jones S Royster1010Germany2025-04-17
Juan B Garufi1011Argentina2025-04-26
Adams Z Waycott1012Russia2025-04-16
Wickens J Bowley1013Canada2025-04-11
James D Sergi1014Brazil2025-04-11
Deepesh C Dilliard1015Japan2025-04-09
Cody J Campain1016France2025-04-23
Aruna Y Maclead1017Argentina2025-04-09
Aika J Dilliard1018Japan2025-05-06
Misaki G Gillian1019Russia2025-04-27
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aika T NestleItalyBernardo Dominic NEGOTIATION
Maisha D AlbaresItalyOnyama Limba NEGOTIATION
Leon P RoysterAustraliaElwin Sharvill UNQUALIFIED
Smith D SchemmerIndiaAnna Fali RENEWAL
Maria Q StockhamAustraliaAmy Elsner UNQUALIFIED
Mayumi O MaletRussiaIvan Magalhaes QUALIFIED
Aruna V OstroskyAustraliaBernardo Dominic NEGOTIATION
Stacey W FigeroaBrazilAmy Elsner NEW
Smith P SchemmerItalyElwin Sharvill RENEWAL
Juan D WieserArgentinaElwin Sharvill QUALIFIED
Costa Y PerinBrazilIvan Magalhaes PROPOSAL
Stacey L FlosiCanadaIoni Bowcher RENEWAL
Octavia R CaudyItalyIoni Bowcher PROPOSAL
Silvio J FigeroaGermanyXuxue Feng RENEWAL
Greenwood M FlosiUnited KingdomIoni Bowcher UNQUALIFIED
Rodrigues F SaylorsSpainOnyama Limba QUALIFIED
Octavia R FerenczFranceAmy Elsner UNQUALIFIED
Wickens B BologniaArgentinaAmy Elsner PROPOSAL
Aditya P MacleadIndiaElwin Sharvill RENEWAL
Jones M BriddickGermanyStephen Shaw NEGOTIATION
Costa E TollnerBrazilXuxue Feng QUALIFIED
Maria W ShinkoIndiaOnyama Limba PROPOSAL
Jones J MorascaGermanyXuxue Feng QUALIFIED
Morrow G CaudyCanadaAmy Elsner NEGOTIATION
Jeanfrancois M MaletJapanXuxue Feng RENEWAL
Wickens J KuskoArgentinaAnna Fali QUALIFIED
Morrow B WieserJapanStephen Shaw PROPOSAL
Darci I VenereGermanyXuxue Feng RENEWAL
Izzy E OstroskyAustraliaOnyama Limba PROPOSAL
Murillo O SaylorsAustraliaAmy Elsner RENEWAL
Aruna A MarrierIndiaOnyama Limba NEGOTIATION
David V VocelkaAustraliaStephen Shaw RENEWAL
Murillo M RimUnited KingdomBernardo Dominic QUALIFIED
Leja S RulapaughArgentinaElwin Sharvill NEW
Octavia T WhobreyIndiaAmy Elsner RENEWAL
Juan A WieserCanadaStephen Shaw PROPOSAL
Leja Z ShinkoBrazilAsiya Javayant QUALIFIED
Greenwood W OstroskyRussiaBernardo Dominic QUALIFIED
Morrow W SlusarskiItalyElwin Sharvill RENEWAL
Alejandro R RutaSpainBernardo Dominic NEGOTIATION

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