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
Wickens P ButtAustraliaStephen Shaw PROPOSAL
Emily H DarakjyBrazilBernardo Dominic NEGOTIATION
Clifford Q AlbaresIndiaElwin Sharvill QUALIFIED
James Z KolmetzCanadaIoni Bowcher QUALIFIED
Ricardo W WaycottSpainXuxue Feng QUALIFIED
Emily I SchemmerAustraliaAnna Fali RENEWAL
Antonio C SaylorsJapanIoni Bowcher QUALIFIED
Aditya Q AmigonFranceBernardo Dominic NEW
Costa A WieserBrazilBernardo Dominic RENEWAL
Leja O ChuiBrazilStephen Shaw UNQUALIFIED
Aika D SaylorsGermanyAsiya Javayant RENEWAL
Julie A PerinArgentinaAsiya Javayant PROPOSAL
Misaki E MorascaItalyXuxue Feng NEGOTIATION
David G MarrierFranceStephen Shaw QUALIFIED
Rodrigues R OstroskyBrazilIvan Magalhaes QUALIFIED
Leja S NickaRussiaAmy Elsner NEGOTIATION
Juan Q RulapaughArgentinaOnyama Limba NEGOTIATION
Aditya X WaycottCanadaAmy Elsner QUALIFIED
Aditya L GarufiArgentinaAnna Fali RENEWAL
Izzy L AmigonAustraliaIoni Bowcher PROPOSAL
Sinclair H OldroydUnited KingdomStephen Shaw PROPOSAL
Greenwood W AmigonIndiaAsiya Javayant PROPOSAL
Aditya F PaprockiIndiaStephen Shaw PROPOSAL
Jeanfrancois D GlickAustraliaElwin Sharvill NEGOTIATION
Claire Z CampainUnited KingdomAnna Fali RENEWAL
Costa Q SchemmerIndiaXuxue Feng RENEWAL
Izzy S CaldareraSpainOnyama Limba RENEWAL
Deepesh Y KuskoSpainAmy Elsner RENEWAL
Ivar G PaprockiFranceBernardo Dominic QUALIFIED
Maria H SlusarskiCanadaOnyama Limba NEGOTIATION
Ivar B ShinkoBrazilAsiya Javayant NEW
Misaki J SchemmerSpainOnyama Limba NEGOTIATION
Clifford C OldroydIndiaIvan Magalhaes QUALIFIED
Adams J FigeroaIndiaXuxue Feng UNQUALIFIED
Cody W SaylorsIndiaBernardo Dominic NEGOTIATION
Maisha O SaylorsAustraliaAmy Elsner QUALIFIED
Francesco J InouyeBrazilAsiya Javayant PROPOSAL
Jennifer B GauchoJapanStephen Shaw NEGOTIATION
Darci U WieserArgentinaAnna Fali NEW
Ashley L PaprockiJapanBernardo Dominic PROPOSAL
Juan H PerinUnited KingdomOnyama Limba RENEWAL
Silvio D FollerItalyOnyama Limba QUALIFIED
Julie N PaprockiFranceAsiya Javayant RENEWAL
Octavia L DarakjyJapanAmy Elsner QUALIFIED
James I InouyeItalyAnna Fali PROPOSAL
Jennifer Q NestleIndiaXuxue Feng PROPOSAL
Mujtaba X MaletFranceIvan Magalhaes RENEWAL
Leon Q OstroskyAustraliaXuxue Feng QUALIFIED
Antonio Q SchemmerGermanyAsiya Javayant QUALIFIED
Juan G MaletItalyAnna Fali UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Claire H WieserFranceStephen Shaw PROPOSAL
Faith I FlosiItalyIvan Magalhaes RENEWAL
Faith B CaudyFranceBernardo Dominic NEW
Wickens Z PerinSpainXuxue Feng NEGOTIATION
Arvin O NestleFranceIvan Magalhaes NEGOTIATION
Rodrigues Q SergiArgentinaAnna Fali PROPOSAL
Julie C StensethItalyStephen Shaw NEW
Claire H IturbideRussiaStephen Shaw PROPOSAL
Tony T ShinkoIndiaAnna Fali NEW
Octavia N CaldareraBrazilXuxue Feng RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Chavez W GauchoSpain2025-04-14Rangoni Of Florence RENEWAL69Anna Fali
1001Mujtaba Z ShinkoAustralia2025-04-21Benton, John B Jr UNQUALIFIED86Anna Fali
1002Kadeem A MarrierSpain2025-04-29Dorl, James J Esq UNQUALIFIED82Amy Elsner
1003Wickens V StensethCanada2025-04-28Rousseaux, Michael Esq NEW35Stephen Shaw
1004Kaitlin N WhobreyAustralia2025-03-31Feiner Bros PROPOSAL10Ivan Magalhaes
1005Kaitlin M MarrierRussia2025-04-08Benton, John B Jr UNQUALIFIED51Xuxue Feng
1006Salvatore S VocelkaItaly2025-04-27Commercial Press QUALIFIED11Onyama Limba
1007Aika B PaprockiSpain2025-04-10Buckley Miller Wright NEGOTIATION22Onyama Limba
1008Aruna I TollnerGermany2025-04-05Feltz Printing Service NEGOTIATION72Ioni Bowcher
1009Salvatore L GarufiAustralia2025-04-10Printing Dimensions NEW50Onyama Limba
1010Ivar T RulapaughUnited Kingdom2025-04-21Feiner Bros NEGOTIATION93Amy Elsner
1011Aditya G InouyeBrazil2025-04-09Feiner Bros PROPOSAL23Amy Elsner
1012Jeanfrancois F PerinAustralia2025-04-25Chanay, Jeffrey A Esq NEW83Stephen Shaw
1013Sinclair L CaudyIndia2025-04-18Benton, John B Jr UNQUALIFIED28Asiya Javayant
1014Silvio B CampainIndia2025-04-21Truhlar And Truhlar Attys PROPOSAL15Asiya Javayant
1015Mayumi E ChuiBrazil2025-04-18Truhlar And Truhlar Attys UNQUALIFIED58Bernardo Dominic
1016Ricardo C MacleadBrazil2025-04-12Dorl, James J Esq NEW16Amy Elsner
1017Francesco W NestleBrazil2025-04-13Morlong Associates RENEWAL3Xuxue Feng
1018Sinclair L WaycottJapan2025-04-21King, Christopher A Esq QUALIFIED44Elwin Sharvill
1019Antonio V KuskoJapan2025-04-28Benton, John B Jr NEGOTIATION45Asiya Javayant
1020Faith F AmigonRussia2025-04-15Printing Dimensions RENEWAL64Stephen Shaw
1021Morrow P WaycottIndia2025-04-25Chemel, James L Cpa NEW86Amy Elsner
1022Arvin P RulapaughCanada2025-04-21Chapman, Ross E Esq NEGOTIATION92Elwin Sharvill
1023Greenwood N AmigonRussia2025-04-22Rousseaux, Michael Esq RENEWAL71Xuxue Feng
1024Silvio Q FerenczCanada2025-04-13Benton, John B Jr NEW83Xuxue Feng
1025Silvio P NestleArgentina2025-04-14Truhlar And Truhlar Attys UNQUALIFIED32Anna Fali
1026Sinclair H TollnerIndia2025-04-21Morlong Associates UNQUALIFIED55Asiya Javayant
1027Wickens H CaudyArgentina2025-04-25Chapman, Ross E Esq NEW47Xuxue Feng
1028Alejandro P FigeroaSpain2025-04-07Rangoni Of Florence RENEWAL24Amy Elsner
1029Claire Q ShinkoGermany2025-04-10Truhlar And Truhlar Attys PROPOSAL8Ivan Magalhaes
1030Jennifer M GlickIndia2025-04-23Commercial Press UNQUALIFIED17Amy Elsner
1031Kaitlin I FigeroaIndia2025-04-18Rousseaux, Michael Esq RENEWAL57Stephen Shaw
1032Jennifer C BologniaRussia2025-04-05Chanay, Jeffrey A Esq RENEWAL40Asiya Javayant
1033Aika S NickaCanada2025-04-05Commercial Press PROPOSAL81Stephen Shaw
1034Leja Q VenereJapan2025-04-01Feltz Printing Service RENEWAL27Elwin Sharvill
1035Izzy U GlickGermany2025-03-31Printing Dimensions RENEWAL1Stephen Shaw
1036Salvatore T ButtUnited Kingdom2025-04-21Rangoni Of Florence RENEWAL89Amy Elsner
1037Leja O FlosiCanada2025-04-22Printing Dimensions QUALIFIED2Bernardo Dominic
1038Smith W GauchoGermany2025-04-03King, Christopher A Esq UNQUALIFIED69Bernardo Dominic
1039Rodrigues A DoeSpain2025-04-04Rangoni Of Florence NEW54Stephen Shaw
1040Leon C PaprockiUnited Kingdom2025-04-20Truhlar And Truhlar Attys RENEWAL88Amy Elsner
1041Greenwood H SchemmerBrazil2025-03-31Morlong Associates UNQUALIFIED29Ioni Bowcher
1042Maria G StensethGermany2025-04-16Rangoni Of Florence NEW90Onyama Limba
1043Juan Y BriddickCanada2025-04-11King, Christopher A Esq QUALIFIED5Ioni Bowcher
1044Leon V ShinkoUnited Kingdom2025-04-08Rangoni Of Florence PROPOSAL99Bernardo Dominic
1045Adams N CaldareraRussia2025-04-04Rangoni Of Florence RENEWAL16Ivan Magalhaes
1046Juan L PerinFrance2025-04-24Truhlar And Truhlar Attys NEW5Bernardo Dominic
1047Nicolas Z InouyeFrance2025-04-17Chemel, James L Cpa RENEWAL91Onyama Limba
1048Alejandro A NickaIndia2025-04-22Printing Dimensions RENEWAL37Amy Elsner
1049Rodrigues O MaletSpain2025-04-21Rangoni Of Florence QUALIFIED5Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Chavez A RoysterIndiaBernardo Dominic QUALIFIED
Wickens A SlusarskiGermanyBernardo Dominic PROPOSAL
James Z FigeroaAustraliaStephen Shaw NEGOTIATION
David R FollerBrazilAnna Fali QUALIFIED
Chavez M VocelkaIndiaAsiya Javayant NEW
Adams C CampainFranceBernardo Dominic NEGOTIATION
Sinclair Z ButtItalyAnna Fali QUALIFIED
Clifford F PerinBrazilIvan Magalhaes QUALIFIED
Arvin Z AmigonUnited KingdomIoni Bowcher RENEWAL
Deepesh Z ShinkoArgentinaXuxue Feng PROPOSAL
Leja S BowleyIndiaAmy Elsner RENEWAL
Nicolas W StockhamItalyXuxue Feng NEW
Mujtaba X GauchoIndiaAnna Fali QUALIFIED
Antonio G NestleAustraliaAsiya Javayant PROPOSAL
James G NestleAustraliaAsiya Javayant NEGOTIATION
Clifford Q BologniaGermanyAsiya Javayant QUALIFIED
Aruna O PoquetteBrazilOnyama Limba QUALIFIED
Aika P MorascaCanadaIvan Magalhaes QUALIFIED
Maria D FollerArgentinaAmy Elsner UNQUALIFIED
Greenwood N KolmetzGermanyIoni Bowcher RENEWAL
Sinclair K AlbaresJapanAmy Elsner RENEWAL
Ashley P GlickRussiaIoni Bowcher QUALIFIED
Rodrigues Y DarakjyJapanXuxue Feng PROPOSAL
Munro S KuskoJapanStephen Shaw QUALIFIED
Leon L TollnerRussiaAsiya Javayant NEGOTIATION
Francesco N VenereItalyStephen Shaw RENEWAL
Salvatore T FollerSpainOnyama Limba RENEWAL
Clifford U AmigonJapanXuxue Feng RENEWAL
Greenwood I MaletFranceStephen Shaw UNQUALIFIED
Aditya N VocelkaBrazilAsiya Javayant QUALIFIED
Mayumi H BologniaUnited KingdomAmy Elsner NEW
Jennifer A NestleGermanyOnyama Limba NEW
Leon F WhobreyArgentinaElwin Sharvill NEW
Cody P BologniaJapanIvan Magalhaes PROPOSAL
Jennifer U DilliardIndiaAmy Elsner NEGOTIATION
Mujtaba C WieserFranceAmy Elsner UNQUALIFIED
Misaki S GauchoBrazilOnyama Limba RENEWAL
Morrow K MorascaGermanyXuxue Feng QUALIFIED
Murillo D DarakjyJapanXuxue Feng RENEWAL
Wickens V BologniaGermanyIvan Magalhaes PROPOSAL
Jennifer C CaudyItalyAnna Fali RENEWAL
Antonio Q RulapaughSpainIoni Bowcher UNQUALIFIED
Leon F AlbaresJapanAsiya Javayant PROPOSAL
Stacey I BriddickUnited KingdomXuxue Feng RENEWAL
Costa J SergiCanadaXuxue Feng QUALIFIED
Mayumi X KuskoGermanyBernardo Dominic PROPOSAL
Arvin E OstroskyGermanyOnyama Limba NEGOTIATION
Munro P CampainArgentinaAnna Fali UNQUALIFIED
Stacey T GarufiArgentinaStephen Shaw NEGOTIATION
Claire P BologniaJapanStephen Shaw NEGOTIATION
Frozen Columns
Name
Misaki Y Tollner
Chavez O Chui
Munro F Malet
Octavia O Nicka
Greenwood P Kusko
Antonio H Rim
Sinclair T Tollner
Alejandro R Dilliard
Maria F Venere
Munro F Nicka
Octavia M Iturbide
Francesco V Bowley
David R Perin
Chavez E Royster
Maria K Campain
Chavez F Malet
Emily Q Saylors
Octavia D Stenseth
Tony D Darakjy
Tony B Chui
Greenwood U Briddick
Jefferson I Malet
Julie T Slusarski
Rodrigues Y Perin
Maria B Campain
Deepesh Y Kusko
Murillo W Amigon
Isabel P Kolmetz
Claire H Rim
Darci V Caldarera
Claire A Ruta
Costa O Royster
Rodrigues W Albares
Kadeem T Butt
Mujtaba T Kolmetz
Leja A Slusarski
Darci G Ferencz
Maisha W Caldarera
Leja W Whobrey
Octavia Y Chui
Antonio G Vocelka
Munro I Malet
Emily X Whobrey
Jones Z Ruta
Chavez B Foller
Alejandro N Gillian
Silvio K Gillian
Antonio D Caldarera
Emily E Shinko
David B Gillian
IdCountryDate
1000France2025-04-24
1001Japan2025-04-22
1002Italy2025-04-16
1003India2025-04-12
1004Argentina2025-04-29
1005Argentina2025-04-07
1006Canada2025-04-01
1007Brazil2025-04-01
1008Brazil2025-04-29
1009Canada2025-04-27
1010India2025-04-12
1011Italy2025-04-17
1012India2025-04-21
1013Russia2025-04-27
1014India2025-04-16
1015Italy2025-04-24
1016France2025-04-13
1017Argentina2025-04-02
1018Germany2025-04-01
1019Japan2025-04-08
1020Brazil2025-04-04
1021Germany2025-04-11
1022Spain2025-04-11
1023Canada2025-04-25
1024Spain2025-04-15
1025Russia2025-04-25
1026United Kingdom2025-04-07
1027Argentina2025-04-21
1028Spain2025-04-12
1029Canada2025-04-15
1030Brazil2025-04-05
1031Argentina2025-04-22
1032Argentina2025-04-14
1033Canada2025-04-22
1034Argentina2025-04-18
1035Australia2025-04-14
1036Italy2025-04-10
1037France2025-04-20
1038Canada2025-04-14
1039Italy2025-04-04
1040Spain2025-04-09
1041Germany2025-04-15
1042Brazil2025-04-19
1043Canada2025-04-01
1044India2025-04-23
1045United Kingdom2025-04-23
1046France2025-04-18
1047Russia2025-04-04
1048Canada2025-04-21
1049Brazil2025-04-02

On-Demand Data

NameIdCountryDate
Smith I Malet1000Australia2025-04-29
Costa C Butt1001Australia2025-04-29
Julie Z Dilliard1002United Kingdom2025-04-12
Kadeem I Stenseth1003France2025-04-29
Mayumi U Saylors1004Canada2025-04-05
Wickens J Maclead1005Italy2025-04-21
Tony T Tollner1006France2025-04-21
Chavez X Ostrosky1007Italy2025-04-13
Costa T Maclead1008Germany2025-04-03
Tony P Nicka1009Italy2025-04-19
Ricardo H Nestle1010Spain2025-04-16
Johnson U Marrier1011Germany2025-04-07
Murillo N Paprocki1012United Kingdom2025-03-31
Arvin O Briddick1013Argentina2025-04-01
Kaitlin M Venere1014France2025-04-20
Deepesh O Albares1015Argentina2025-04-16
Sinclair M Briddick1016Spain2025-04-22
Nicolas R Flosi1017United Kingdom2025-04-08
Sinclair Z Albares1018Italy2025-04-10
Munro B Bowley1019Germany2025-03-31
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Francesco H FerenczArgentinaAmy Elsner NEW
Greenwood J CaudyIndiaXuxue Feng UNQUALIFIED
Salvatore Y PerinBrazilXuxue Feng UNQUALIFIED
Wickens N AlbaresBrazilXuxue Feng PROPOSAL
Julie E WieserGermanyElwin Sharvill QUALIFIED
Kadeem Y ButtArgentinaBernardo Dominic QUALIFIED
Leja U GauchoItalyBernardo Dominic NEGOTIATION
Kaitlin R StockhamCanadaBernardo Dominic NEW
Aditya L RulapaughUnited KingdomAnna Fali NEW
Smith Y SlusarskiArgentinaIvan Magalhaes NEW
Darci H StockhamJapanIoni Bowcher QUALIFIED
Claire T BowleyGermanyElwin Sharvill NEGOTIATION
Leon E KolmetzSpainIvan Magalhaes QUALIFIED
Maria Q FigeroaUnited KingdomAsiya Javayant PROPOSAL
Leja D WaycottRussiaIvan Magalhaes RENEWAL
Cody K StockhamRussiaXuxue Feng NEGOTIATION
Wickens H StensethGermanyAnna Fali NEGOTIATION
Salvatore N MaletArgentinaBernardo Dominic NEGOTIATION
Sinclair W NestleIndiaIvan Magalhaes UNQUALIFIED
Aditya U KolmetzRussiaAsiya Javayant QUALIFIED
Murillo D RulapaughRussiaAmy Elsner PROPOSAL
Salvatore Z PerinJapanStephen Shaw NEW
Isabel K CaldareraUnited KingdomOnyama Limba NEGOTIATION
James F RutaAustraliaAmy Elsner UNQUALIFIED
Murillo D MarrierBrazilIvan Magalhaes QUALIFIED
Wickens B ShinkoCanadaXuxue Feng NEGOTIATION
Aruna F GlickArgentinaBernardo Dominic UNQUALIFIED
Ashley Z SchemmerBrazilOnyama Limba NEW
Salvatore B TollnerItalyAmy Elsner RENEWAL
Chavez X WaycottSpainIvan Magalhaes QUALIFIED
Jennifer Z GauchoIndiaXuxue Feng NEW
Stacey L WaycottFranceAsiya Javayant NEGOTIATION
Jones X StensethAustraliaBernardo Dominic PROPOSAL
Jennifer V WaycottSpainIoni Bowcher QUALIFIED
Adams R VocelkaRussiaAsiya Javayant PROPOSAL
Octavia K ChuiArgentinaBernardo Dominic UNQUALIFIED
Ivar S MacleadSpainBernardo Dominic RENEWAL
Aditya G SergiAustraliaAsiya Javayant UNQUALIFIED
Adams O SaylorsUnited KingdomIoni Bowcher UNQUALIFIED
Leja F ChuiIndiaStephen Shaw NEW

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