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
Ivar C WaycottSpainBernardo Dominic UNQUALIFIED
Cody N WaycottCanadaAmy Elsner NEGOTIATION
Adams F GarufiIndiaOnyama Limba PROPOSAL
Octavia J BologniaCanadaIvan Magalhaes NEGOTIATION
David Z RimJapanBernardo Dominic QUALIFIED
Maisha P IturbideSpainAsiya Javayant UNQUALIFIED
Morrow Q SergiSpainIvan Magalhaes NEW
Misaki B ChuiJapanElwin Sharvill NEGOTIATION
Mayumi N NickaSpainAsiya Javayant QUALIFIED
Wickens R GillianSpainAsiya Javayant QUALIFIED
Sinclair V FollerUnited KingdomXuxue Feng RENEWAL
Jeanfrancois B BriddickUnited KingdomAmy Elsner UNQUALIFIED
Chavez N SlusarskiIndiaAsiya Javayant RENEWAL
Greenwood O RimArgentinaElwin Sharvill PROPOSAL
Chavez H AmigonItalyAmy Elsner NEGOTIATION
Salvatore E MorascaGermanyIvan Magalhaes UNQUALIFIED
Antonio X InouyeItalyIoni Bowcher NEW
Leon H SchemmerBrazilElwin Sharvill PROPOSAL
Tony R AmigonIndiaAnna Fali PROPOSAL
Maisha B VenereGermanyIvan Magalhaes QUALIFIED
Wickens G WaycottArgentinaIoni Bowcher QUALIFIED
Darci B PerinIndiaOnyama Limba NEW
Jefferson L PoquetteRussiaAsiya Javayant PROPOSAL
Costa P CaudyAustraliaIvan Magalhaes NEGOTIATION
Deepesh L IturbideBrazilStephen Shaw QUALIFIED
Juan C PerinRussiaAmy Elsner UNQUALIFIED
James F PerinSpainXuxue Feng NEGOTIATION
Maisha G NickaItalyStephen Shaw QUALIFIED
Antonio O WieserFranceAmy Elsner UNQUALIFIED
Izzy K FlosiArgentinaXuxue Feng NEW
Wickens I DilliardBrazilAnna Fali NEW
Cody I ShinkoSpainBernardo Dominic RENEWAL
Kadeem E GillianIndiaBernardo Dominic RENEWAL
Alejandro A CampainJapanStephen Shaw PROPOSAL
Murillo F GauchoIndiaBernardo Dominic PROPOSAL
Deepesh V PerinCanadaStephen Shaw UNQUALIFIED
Leon W RimGermanyAmy Elsner NEW
Chavez O VenereUnited KingdomAsiya Javayant NEW
Tony U BologniaRussiaAsiya Javayant PROPOSAL
Silvio T VenereUnited KingdomAsiya Javayant UNQUALIFIED
Greenwood S NickaIndiaElwin Sharvill PROPOSAL
Mayumi N NestleUnited KingdomIoni Bowcher UNQUALIFIED
Adams Y SergiFranceStephen Shaw RENEWAL
Tony D RimBrazilIoni Bowcher QUALIFIED
Deepesh U FollerRussiaBernardo Dominic PROPOSAL
Aika C BologniaAustraliaStephen Shaw NEW
Misaki O NestleFranceAnna Fali QUALIFIED
Salvatore N GillianArgentinaAsiya Javayant NEW
Tony Y AlbaresItalyIvan Magalhaes QUALIFIED
Antonio T PoquetteIndiaStephen Shaw QUALIFIED
Horizontal
NameCountryRepresentativeStatus
James I KuskoCanadaStephen Shaw NEGOTIATION
Arvin Z CaudyItalyAnna Fali QUALIFIED
Deepesh N DoeGermanyElwin Sharvill QUALIFIED
Antonio Q RulapaughUnited KingdomBernardo Dominic RENEWAL
Izzy E InouyeArgentinaIvan Magalhaes NEW
Claire N StensethArgentinaIvan Magalhaes QUALIFIED
Adams O BriddickArgentinaIoni Bowcher RENEWAL
Antonio O KuskoIndiaBernardo Dominic PROPOSAL
Leja B OldroydGermanyXuxue Feng QUALIFIED
Alejandro V CaldareraUnited KingdomXuxue Feng NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Leon U CaldareraSpain2025-04-15Morlong Associates UNQUALIFIED7Ivan Magalhaes
1001Kaitlin K DarakjyBrazil2025-04-27Benton, John B Jr UNQUALIFIED73Onyama Limba
1002Chavez A AmigonCanada2025-04-02King, Christopher A Esq RENEWAL55Stephen Shaw
1003Leon F FigeroaFrance2025-04-29Feltz Printing Service NEW63Xuxue Feng
1004James H RoysterGermany2025-04-08Dorl, James J Esq PROPOSAL32Asiya Javayant
1005Julie G GillianIndia2025-03-31Printing Dimensions QUALIFIED40Bernardo Dominic
1006Izzy T NickaItaly2025-04-22Commercial Press UNQUALIFIED2Anna Fali
1007Alejandro Q RulapaughUnited Kingdom2025-04-09Rangoni Of Florence PROPOSAL25Asiya Javayant
1008Morrow V SlusarskiJapan2025-04-27Chanay, Jeffrey A Esq QUALIFIED45Anna Fali
1009Aditya P BriddickRussia2025-04-29Rangoni Of Florence UNQUALIFIED51Stephen Shaw
1010Emily R PaprockiJapan2025-04-26Feltz Printing Service NEW69Stephen Shaw
1011Misaki P BriddickGermany2025-04-01Chemel, James L Cpa RENEWAL89Asiya Javayant
1012Darci Q VenereBrazil2025-04-02King, Christopher A Esq RENEWAL15Ioni Bowcher
1013Aditya J MacleadFrance2025-04-12Morlong Associates NEW61Elwin Sharvill
1014Izzy Y IturbideIndia2025-04-10Printing Dimensions QUALIFIED10Bernardo Dominic
1015Clifford G RulapaughAustralia2025-04-11Rangoni Of Florence QUALIFIED48Xuxue Feng
1016Maria T WhobreyIndia2025-04-28Rangoni Of Florence NEGOTIATION56Onyama Limba
1017Arvin E ChuiJapan2025-03-31Truhlar And Truhlar Attys NEW19Ioni Bowcher
1018Adams S RulapaughGermany2025-04-29Morlong Associates NEGOTIATION23Ivan Magalhaes
1019Claire W CaldareraSpain2025-03-31Feiner Bros UNQUALIFIED84Amy Elsner
1020Cody Q ShinkoAustralia2025-04-09Benton, John B Jr NEGOTIATION83Amy Elsner
1021Costa M InouyeArgentina2025-04-05Benton, John B Jr UNQUALIFIED7Ioni Bowcher
1022Faith Y FlosiAustralia2025-04-07Feiner Bros UNQUALIFIED36Ivan Magalhaes
1023Sinclair R FollerJapan2025-04-25Morlong Associates NEW0Onyama Limba
1024Misaki X MaletCanada2025-04-03Chapman, Ross E Esq NEW11Ioni Bowcher
1025Claire Q FlosiArgentina2025-04-08Truhlar And Truhlar Attys UNQUALIFIED68Onyama Limba
1026Kadeem J BowleyGermany2025-04-13Feltz Printing Service UNQUALIFIED99Onyama Limba
1027Tony B CaldareraUnited Kingdom2025-04-26Chapman, Ross E Esq QUALIFIED45Ioni Bowcher
1028Costa P OstroskyIndia2025-04-01Printing Dimensions UNQUALIFIED3Onyama Limba
1029Jefferson V DoeSpain2025-04-18King, Christopher A Esq UNQUALIFIED43Amy Elsner
1030Johnson F PerinSpain2025-04-20Rangoni Of Florence NEW84Ivan Magalhaes
1031Rodrigues W BowleyIndia2025-04-07Chanay, Jeffrey A Esq NEGOTIATION31Stephen Shaw
1032Rodrigues P FlosiRussia2025-04-17Rangoni Of Florence NEGOTIATION72Asiya Javayant
1033David V MorascaUnited Kingdom2025-04-19Chanay, Jeffrey A Esq UNQUALIFIED64Elwin Sharvill
1034Kadeem N AlbaresArgentina2025-04-02Chapman, Ross E Esq PROPOSAL44Ioni Bowcher
1035Emily Z BriddickJapan2025-04-16Printing Dimensions UNQUALIFIED74Stephen Shaw
1036Darci V ChuiUnited Kingdom2025-04-03Printing Dimensions PROPOSAL44Elwin Sharvill
1037Emily D CaldareraSpain2025-04-22Feiner Bros PROPOSAL88Amy Elsner
1038Octavia B PaprockiItaly2025-03-31Commercial Press QUALIFIED72Bernardo Dominic
1039Claire U FlosiArgentina2025-04-15Feiner Bros UNQUALIFIED53Onyama Limba
1040Aika Z OldroydJapan2025-04-14Rousseaux, Michael Esq NEW20Onyama Limba
1041Tony M RulapaughRussia2025-04-07Feltz Printing Service RENEWAL67Asiya Javayant
1042Wickens S AmigonCanada2025-04-23Morlong Associates QUALIFIED59Stephen Shaw
1043Silvio K MarrierCanada2025-04-05Buckley Miller Wright UNQUALIFIED91Stephen Shaw
1044Murillo Q TollnerJapan2025-04-13Truhlar And Truhlar Attys UNQUALIFIED66Amy Elsner
1045Aditya S WaycottGermany2025-04-18Rangoni Of Florence RENEWAL67Onyama Limba
1046Maisha Q FlosiSpain2025-04-20Benton, John B Jr NEW45Stephen Shaw
1047Isabel D VenereBrazil2025-04-05Commercial Press QUALIFIED16Ivan Magalhaes
1048Aruna H GillianItaly2025-04-21Dorl, James J Esq NEW64Stephen Shaw
1049Faith G CaldareraArgentina2025-04-12Rousseaux, Michael Esq PROPOSAL81Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Murillo M SlusarskiAustraliaBernardo Dominic UNQUALIFIED
Izzy S BowleyRussiaOnyama Limba NEW
Nicolas J MorascaJapanAmy Elsner PROPOSAL
Jones R NestleAustraliaElwin Sharvill NEGOTIATION
David Q AlbaresBrazilIvan Magalhaes UNQUALIFIED
Leon C FlosiSpainStephen Shaw QUALIFIED
Alejandro M SlusarskiRussiaIvan Magalhaes PROPOSAL
Deepesh Q IturbideJapanStephen Shaw PROPOSAL
Deepesh L WieserAustraliaXuxue Feng QUALIFIED
Misaki O FerenczFranceIoni Bowcher QUALIFIED
Faith D GauchoSpainAmy Elsner NEW
Faith T MacleadIndiaAmy Elsner RENEWAL
Emily O BologniaIndiaIvan Magalhaes QUALIFIED
Misaki K VocelkaCanadaAnna Fali NEW
David U WhobreyUnited KingdomXuxue Feng RENEWAL
Kadeem D RulapaughArgentinaElwin Sharvill NEGOTIATION
Wickens Y OldroydRussiaIvan Magalhaes NEGOTIATION
Juan V SlusarskiArgentinaIvan Magalhaes UNQUALIFIED
Mujtaba J SergiItalyIvan Magalhaes UNQUALIFIED
Aditya D PaprockiFranceIoni Bowcher QUALIFIED
Silvio T StensethFranceAmy Elsner QUALIFIED
James A KolmetzItalyOnyama Limba PROPOSAL
Faith V GauchoIndiaBernardo Dominic NEW
Jennifer O InouyeJapanStephen Shaw NEW
Ricardo T MarrierBrazilIvan Magalhaes QUALIFIED
Emily B RoysterJapanAnna Fali NEGOTIATION
Claire X ChuiSpainIvan Magalhaes UNQUALIFIED
Salvatore J VocelkaFranceIoni Bowcher UNQUALIFIED
Deepesh D WaycottArgentinaAsiya Javayant PROPOSAL
Leja T ButtArgentinaOnyama Limba NEW
Chavez X StensethAustraliaAnna Fali QUALIFIED
Faith H SchemmerBrazilStephen Shaw QUALIFIED
Jennifer Y InouyeJapanAsiya Javayant UNQUALIFIED
Rodrigues N GlickAustraliaXuxue Feng NEW
Leon M GarufiArgentinaOnyama Limba UNQUALIFIED
Johnson Z InouyeArgentinaXuxue Feng RENEWAL
Murillo G KolmetzRussiaXuxue Feng QUALIFIED
Nicolas J OldroydJapanStephen Shaw RENEWAL
Octavia I GarufiIndiaOnyama Limba RENEWAL
James E ChuiItalyAnna Fali NEGOTIATION
Juan A FigeroaAustraliaIvan Magalhaes RENEWAL
Murillo P StockhamUnited KingdomIoni Bowcher NEGOTIATION
Stacey O BriddickFranceAnna Fali UNQUALIFIED
Darci W SchemmerItalyAsiya Javayant UNQUALIFIED
Deepesh B FlosiArgentinaIvan Magalhaes UNQUALIFIED
Stacey K DilliardAustraliaAnna Fali QUALIFIED
Greenwood J KolmetzAustraliaOnyama Limba NEW
Octavia P WieserArgentinaOnyama Limba UNQUALIFIED
Misaki L BologniaRussiaAnna Fali RENEWAL
Deepesh U OldroydIndiaBernardo Dominic PROPOSAL
Frozen Columns
Name
Emily I Morasca
Leja D Foller
Sinclair F Venere
Antonio D Nicka
Aruna M Dilliard
Stacey D Shinko
Juan L Garufi
Stacey T Briddick
Ricardo S Whobrey
Rodrigues G Stockham
Greenwood I Poquette
Deepesh M Glick
Kadeem H Paprocki
Mujtaba P Poquette
Kaitlin W Sergi
Stacey N Ferencz
Sinclair Y Iturbide
Morrow N Waycott
Ricardo M Rim
Claire X Glick
Leon C Nicka
Aruna Z Darakjy
Clifford U Bolognia
Aruna I Venere
Clifford B Oldroyd
Maria U Caudy
Mujtaba V Vocelka
Costa T Rim
Ashley A Darakjy
Ricardo J Schemmer
Morrow R Ostrosky
Kaitlin J Amigon
Emily X Kusko
Chavez F Paprocki
Ashley G Stenseth
Arvin F Rim
Antonio M Poquette
Nicolas M Slusarski
Rodrigues S Butt
David F Malet
Kaitlin W Iturbide
Munro Z Rulapaugh
Octavia L Saylors
Munro W Iturbide
Emily L Briddick
Kadeem V Amigon
Salvatore I Whobrey
Faith Q Stockham
Ivar Z Garufi
Adams G Caldarera
IdCountryDate
1000Germany2025-04-21
1001Brazil2025-04-13
1002United Kingdom2025-04-23
1003United Kingdom2025-04-21
1004Germany2025-04-18
1005France2025-04-16
1006Spain2025-04-04
1007India2025-04-22
1008India2025-04-06
1009Spain2025-04-16
1010India2025-04-01
1011Germany2025-04-19
1012Japan2025-04-01
1013Germany2025-04-19
1014Australia2025-03-31
1015Italy2025-04-06
1016United Kingdom2025-04-26
1017Russia2025-04-08
1018Spain2025-04-18
1019Italy2025-04-19
1020Germany2025-04-25
1021Russia2025-04-12
1022Russia2025-04-08
1023Canada2025-04-13
1024Japan2025-04-05
1025Canada2025-04-17
1026Australia2025-04-09
1027Spain2025-04-14
1028Germany2025-04-24
1029Germany2025-04-26
1030Japan2025-04-22
1031Russia2025-04-23
1032Brazil2025-04-22
1033United Kingdom2025-04-01
1034India2025-04-02
1035United Kingdom2025-04-16
1036Argentina2025-04-02
1037Brazil2025-04-25
1038France2025-04-13
1039France2025-04-15
1040Canada2025-04-09
1041France2025-04-26
1042Russia2025-04-20
1043Argentina2025-04-19
1044Spain2025-04-24
1045Italy2025-03-31
1046Japan2025-04-04
1047Russia2025-04-27
1048Brazil2025-04-11
1049Italy2025-04-26

On-Demand Data

NameIdCountryDate
Stacey M Chui1000Italy2025-04-10
Misaki D Malet1001Germany2025-04-19
Greenwood U Glick1002Spain2025-04-28
Murillo G Schemmer1003Japan2025-03-31
Mujtaba X Tollner1004France2025-03-31
Jones T Poquette1005Spain2025-04-12
Ivar C Shinko1006France2025-04-12
Jeanfrancois G Ruta1007Japan2025-04-02
Maria Q Nestle1008Japan2025-04-22
Mujtaba K Caldarera1009Brazil2025-04-22
Deepesh S Wieser1010Italy2025-04-08
Silvio F Nestle1011Canada2025-04-09
Juan Q Morasca1012Argentina2025-04-08
Silvio F Rulapaugh1013Italy2025-04-04
Jeanfrancois J Kolmetz1014United Kingdom2025-04-11
Mayumi B Glick1015Russia2025-04-08
Mayumi S Bowley1016Brazil2025-04-18
Claire C Schemmer1017France2025-04-26
Claire J Butt1018Germany2025-04-09
Jefferson V Albares1019Russia2025-04-05
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Morrow A SlusarskiBrazilBernardo Dominic NEGOTIATION
Maria P CaldareraArgentinaAnna Fali NEGOTIATION
Kaitlin T GauchoUnited KingdomAnna Fali NEW
Chavez O SaylorsArgentinaElwin Sharvill PROPOSAL
Alejandro Z WieserArgentinaBernardo Dominic RENEWAL
Aditya E FlosiArgentinaAmy Elsner UNQUALIFIED
Cody O PaprockiItalyOnyama Limba QUALIFIED
Darci I AlbaresJapanAsiya Javayant NEW
Francesco H VocelkaGermanyElwin Sharvill NEW
Maisha F AmigonRussiaAsiya Javayant RENEWAL
James S AmigonJapanXuxue Feng UNQUALIFIED
Ricardo Z GlickArgentinaIoni Bowcher RENEWAL
Darci V IturbideArgentinaOnyama Limba QUALIFIED
Emily I MaletIndiaXuxue Feng RENEWAL
Chavez P ChuiUnited KingdomIoni Bowcher UNQUALIFIED
Kaitlin Q KolmetzFranceElwin Sharvill UNQUALIFIED
Rodrigues N MaletRussiaAsiya Javayant QUALIFIED
Smith Y BriddickAustraliaBernardo Dominic RENEWAL
Arvin Q IturbideCanadaOnyama Limba NEW
James Z NestleGermanyAsiya Javayant NEGOTIATION
Ashley U ButtSpainOnyama Limba QUALIFIED
Ashley Q GarufiFranceIoni Bowcher NEW
Jefferson E FlosiJapanAsiya Javayant UNQUALIFIED
Alejandro W NestleRussiaBernardo Dominic UNQUALIFIED
Adams B PerinIndiaElwin Sharvill NEGOTIATION
Maisha W IturbideRussiaAmy Elsner PROPOSAL
Francesco D MacleadGermanyOnyama Limba RENEWAL
Kaitlin F RoysterIndiaBernardo Dominic NEW
Silvio O GarufiGermanyOnyama Limba PROPOSAL
Munro P InouyeBrazilIoni Bowcher NEW
Wickens M PerinItalyAsiya Javayant PROPOSAL
Chavez Y PerinFranceXuxue Feng NEGOTIATION
Adams T FlosiGermanyElwin Sharvill PROPOSAL
Greenwood X DilliardAustraliaAmy Elsner UNQUALIFIED
Cody H ShinkoArgentinaAmy Elsner RENEWAL
Ashley R OldroydArgentinaXuxue Feng QUALIFIED
Francesco Y DarakjyRussiaElwin Sharvill NEGOTIATION
Costa W IturbideUnited KingdomAnna Fali QUALIFIED
Faith S VenereItalyIvan Magalhaes PROPOSAL
Maisha E WieserGermanyElwin Sharvill 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>