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
Leja O KolmetzCanadaOnyama Limba NEGOTIATION
Deepesh I DoeArgentinaBernardo Dominic RENEWAL
Smith E MaletItalyOnyama Limba PROPOSAL
Cody O AlbaresUnited KingdomAsiya Javayant PROPOSAL
James M CaudyArgentinaOnyama Limba NEGOTIATION
Antonio G ChuiIndiaIoni Bowcher RENEWAL
Tony C WaycottBrazilAmy Elsner NEW
Octavia X KuskoGermanyXuxue Feng QUALIFIED
Greenwood Y StockhamRussiaIvan Magalhaes QUALIFIED
Morrow B CampainIndiaIvan Magalhaes NEW
Deepesh F WieserJapanElwin Sharvill PROPOSAL
Izzy M WhobreyCanadaStephen Shaw NEGOTIATION
Rodrigues U WaycottBrazilOnyama Limba NEGOTIATION
Murillo W MarrierJapanAmy Elsner NEGOTIATION
Salvatore Z BologniaFranceXuxue Feng PROPOSAL
Ashley S BologniaGermanyOnyama Limba QUALIFIED
Leon D InouyeArgentinaStephen Shaw UNQUALIFIED
Maria L KuskoAustraliaIvan Magalhaes RENEWAL
Mujtaba Z StockhamBrazilAsiya Javayant RENEWAL
Mayumi A AlbaresCanadaIvan Magalhaes NEGOTIATION
Leon R SchemmerAustraliaAmy Elsner RENEWAL
Maisha H FlosiSpainIvan Magalhaes PROPOSAL
Johnson U VocelkaBrazilElwin Sharvill RENEWAL
Tony V AlbaresItalyIoni Bowcher NEW
Aika D KuskoSpainAmy Elsner UNQUALIFIED
Claire Z BologniaJapanIoni Bowcher PROPOSAL
Munro J MorascaIndiaIoni Bowcher RENEWAL
Juan L GarufiRussiaElwin Sharvill PROPOSAL
Aditya J AmigonAustraliaOnyama Limba NEGOTIATION
Aruna U RoysterArgentinaIoni Bowcher NEW
Salvatore W DilliardAustraliaIvan Magalhaes PROPOSAL
James D SchemmerUnited KingdomOnyama Limba PROPOSAL
James E TollnerSpainOnyama Limba RENEWAL
Tony Z BologniaCanadaIvan Magalhaes PROPOSAL
David X FollerFranceIoni Bowcher PROPOSAL
Rodrigues R WhobreyBrazilAnna Fali UNQUALIFIED
Silvio V SlusarskiIndiaStephen Shaw QUALIFIED
Cody T AlbaresIndiaAmy Elsner NEW
Johnson U WaycottRussiaStephen Shaw NEW
Claire Y FigeroaAustraliaBernardo Dominic PROPOSAL
Murillo O MaletAustraliaElwin Sharvill QUALIFIED
Silvio M FigeroaBrazilIoni Bowcher QUALIFIED
Claire W OstroskyArgentinaBernardo Dominic PROPOSAL
Jones E OldroydSpainXuxue Feng PROPOSAL
Morrow W MacleadAustraliaBernardo Dominic NEGOTIATION
Aruna Y GarufiGermanyIoni Bowcher PROPOSAL
Izzy A TollnerBrazilXuxue Feng NEGOTIATION
Izzy M BologniaJapanElwin Sharvill NEW
Misaki Z BriddickFranceIoni Bowcher PROPOSAL
Isabel K PerinRussiaStephen Shaw RENEWAL
Horizontal
NameCountryRepresentativeStatus
Ricardo Z MaletRussiaAmy Elsner PROPOSAL
Isabel I GlickBrazilOnyama Limba RENEWAL
Julie O FollerArgentinaElwin Sharvill QUALIFIED
Leon P CaudyArgentinaElwin Sharvill UNQUALIFIED
Rodrigues L TollnerUnited KingdomStephen Shaw NEGOTIATION
Leja F FlosiCanadaElwin Sharvill RENEWAL
Ricardo A PaprockiArgentinaElwin Sharvill RENEWAL
Faith K OstroskyUnited KingdomIvan Magalhaes QUALIFIED
Maria W CaudyRussiaElwin Sharvill RENEWAL
Mujtaba Q MarrierItalyXuxue Feng PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Smith I WaycottJapan2025-04-07Chemel, James L Cpa QUALIFIED95Asiya Javayant
1001Ivar P DarakjyItaly2025-04-03Chemel, James L Cpa RENEWAL65Amy Elsner
1002Smith R StensethAustralia2025-04-22Feltz Printing Service QUALIFIED30Ivan Magalhaes
1003Jeanfrancois T GlickJapan2025-04-20Morlong Associates NEGOTIATION27Anna Fali
1004Aruna Q StockhamBrazil2025-04-17Commercial Press UNQUALIFIED27Anna Fali
1005Morrow A BologniaItaly2025-04-28Feiner Bros PROPOSAL63Ioni Bowcher
1006Clifford S CampainJapan2025-04-09Truhlar And Truhlar Attys UNQUALIFIED37Bernardo Dominic
1007Maria Q FlosiIndia2025-04-24Chanay, Jeffrey A Esq QUALIFIED22Amy Elsner
1008Mayumi I MacleadBrazil2025-04-04Benton, John B Jr NEW33Ivan Magalhaes
1009Rodrigues L RulapaughAustralia2025-04-26Truhlar And Truhlar Attys QUALIFIED24Ioni Bowcher
1010Jones I PerinCanada2025-04-11Benton, John B Jr QUALIFIED96Amy Elsner
1011Ashley Z TollnerItaly2025-04-05Benton, John B Jr NEGOTIATION7Anna Fali
1012Mujtaba R PaprockiRussia2025-04-07Chapman, Ross E Esq QUALIFIED37Ioni Bowcher
1013Kaitlin B SergiIndia2025-04-28Feiner Bros PROPOSAL5Ivan Magalhaes
1014Ashley K RoysterRussia2025-04-14Printing Dimensions PROPOSAL46Ioni Bowcher
1015Jennifer G MarrierCanada2025-04-02Feiner Bros NEW60Stephen Shaw
1016Adams S PerinJapan2025-04-26Feltz Printing Service NEW62Bernardo Dominic
1017Kadeem F PerinItaly2025-04-30Printing Dimensions NEW24Asiya Javayant
1018Nicolas M PerinFrance2025-04-03Buckley Miller Wright PROPOSAL37Stephen Shaw
1019Johnson I SergiItaly2025-04-18Rousseaux, Michael Esq PROPOSAL34Stephen Shaw
1020James H CaldareraRussia2025-04-24King, Christopher A Esq QUALIFIED5Amy Elsner
1021Cody X NickaFrance2025-04-19Truhlar And Truhlar Attys NEGOTIATION40Amy Elsner
1022Kadeem V OstroskySpain2025-04-21Benton, John B Jr RENEWAL25Ioni Bowcher
1023Octavia Y GauchoAustralia2025-04-29Buckley Miller Wright RENEWAL92Elwin Sharvill
1024Stacey R BologniaBrazil2025-04-30Printing Dimensions QUALIFIED0Bernardo Dominic
1025Maria K WaycottItaly2025-04-19Feiner Bros NEGOTIATION34Onyama Limba
1026Octavia E RimSpain2025-04-09Benton, John B Jr NEW72Anna Fali
1027Claire I ButtArgentina2025-04-24Dorl, James J Esq PROPOSAL22Bernardo Dominic
1028Claire E CaudyUnited Kingdom2025-04-22Truhlar And Truhlar Attys NEGOTIATION6Onyama Limba
1029Jefferson G RutaUnited Kingdom2025-04-22Rangoni Of Florence RENEWAL4Amy Elsner
1030Darci Q BologniaSpain2025-04-23Morlong Associates RENEWAL32Elwin Sharvill
1031Juan V DilliardItaly2025-04-28Buckley Miller Wright RENEWAL39Onyama Limba
1032Mujtaba C MaletGermany2025-04-01Feltz Printing Service NEW46Elwin Sharvill
1033Aruna I SlusarskiSpain2025-04-01Rangoni Of Florence UNQUALIFIED71Xuxue Feng
1034Jones D DarakjyArgentina2025-04-24Commercial Press NEW8Asiya Javayant
1035Mayumi R VenereUnited Kingdom2025-04-01Dorl, James J Esq QUALIFIED64Ioni Bowcher
1036Kaitlin D NickaAustralia2025-04-12Feltz Printing Service NEGOTIATION23Amy Elsner
1037Clifford L MarrierAustralia2025-04-25Commercial Press UNQUALIFIED26Elwin Sharvill
1038Misaki G VocelkaFrance2025-04-11Feiner Bros NEW9Stephen Shaw
1039Izzy I AlbaresArgentina2025-04-26Rousseaux, Michael Esq NEGOTIATION76Anna Fali
1040Izzy A PoquetteBrazil2025-04-18Rousseaux, Michael Esq QUALIFIED42Ioni Bowcher
1041Kadeem O MarrierItaly2025-04-26King, Christopher A Esq QUALIFIED89Elwin Sharvill
1042Wickens P SchemmerGermany2025-04-30Morlong Associates NEGOTIATION2Ioni Bowcher
1043Ricardo X DilliardRussia2025-04-23Commercial Press QUALIFIED83Onyama Limba
1044Chavez S VenereIndia2025-04-07Buckley Miller Wright RENEWAL34Ioni Bowcher
1045Kaitlin B NestleUnited Kingdom2025-04-13Chemel, James L Cpa NEW71Anna Fali
1046Aditya L RutaGermany2025-04-09King, Christopher A Esq QUALIFIED23Amy Elsner
1047Nicolas U AlbaresArgentina2025-04-16Feiner Bros RENEWAL44Elwin Sharvill
1048Ashley V FollerSpain2025-04-07Morlong Associates QUALIFIED35Elwin Sharvill
1049Juan N GauchoUnited Kingdom2025-04-06Chapman, Ross E Esq PROPOSAL16Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Jones T GlickSpainIvan Magalhaes NEGOTIATION
Arvin A MaletBrazilAmy Elsner RENEWAL
Leja R PaprockiCanadaIvan Magalhaes RENEWAL
Mayumi E DilliardUnited KingdomAmy Elsner QUALIFIED
Kadeem X NickaUnited KingdomXuxue Feng PROPOSAL
Julie V InouyeBrazilXuxue Feng RENEWAL
Rodrigues C CaudyCanadaAnna Fali NEGOTIATION
Adams U MacleadRussiaBernardo Dominic NEGOTIATION
Octavia W MaletJapanIvan Magalhaes UNQUALIFIED
Murillo S GillianSpainOnyama Limba RENEWAL
Mayumi G MaletItalyBernardo Dominic RENEWAL
Misaki B PaprockiArgentinaElwin Sharvill NEW
Darci Z NestleBrazilIvan Magalhaes QUALIFIED
Jennifer N WaycottCanadaAmy Elsner NEW
Adams F NestleAustraliaOnyama Limba NEW
Aruna X NestleAustraliaAsiya Javayant UNQUALIFIED
Emily M BriddickArgentinaIvan Magalhaes RENEWAL
Stacey M DilliardSpainAmy Elsner PROPOSAL
Kaitlin C GarufiBrazilXuxue Feng NEGOTIATION
Izzy B RoysterJapanAnna Fali PROPOSAL
Chavez V CaldareraUnited KingdomStephen Shaw RENEWAL
Alejandro P GlickIndiaIoni Bowcher RENEWAL
Smith C GauchoIndiaStephen Shaw NEGOTIATION
Octavia V KolmetzIndiaBernardo Dominic NEGOTIATION
Kaitlin C DarakjyRussiaStephen Shaw PROPOSAL
Johnson V AlbaresUnited KingdomAsiya Javayant NEW
Aika E DarakjySpainIoni Bowcher PROPOSAL
Clifford J MorascaJapanElwin Sharvill PROPOSAL
Alejandro M ButtArgentinaIvan Magalhaes PROPOSAL
Arvin B WhobreyRussiaElwin Sharvill QUALIFIED
Ashley V VenereJapanOnyama Limba PROPOSAL
Chavez V FlosiIndiaAmy Elsner RENEWAL
Maisha B DarakjyArgentinaAnna Fali NEGOTIATION
Smith B SaylorsIndiaBernardo Dominic PROPOSAL
Chavez Q PoquetteRussiaElwin Sharvill PROPOSAL
Emily L ShinkoAustraliaBernardo Dominic RENEWAL
Adams T WhobreyCanadaAnna Fali UNQUALIFIED
Faith U WhobreyJapanStephen Shaw UNQUALIFIED
Isabel K ButtAustraliaElwin Sharvill PROPOSAL
Mayumi A FigeroaBrazilStephen Shaw UNQUALIFIED
David O NickaUnited KingdomElwin Sharvill PROPOSAL
Greenwood X FollerAustraliaElwin Sharvill UNQUALIFIED
Rodrigues N PaprockiSpainAsiya Javayant QUALIFIED
Silvio X WaycottJapanBernardo Dominic NEGOTIATION
Aditya Z RoysterCanadaElwin Sharvill PROPOSAL
Darci B DilliardIndiaStephen Shaw UNQUALIFIED
Aika J OstroskyFranceIvan Magalhaes QUALIFIED
Aika V NickaIndiaAmy Elsner NEGOTIATION
Ricardo Y RimRussiaOnyama Limba UNQUALIFIED
Izzy U ChuiAustraliaAmy Elsner UNQUALIFIED
Frozen Columns
Name
Chavez O Nicka
Nicolas A Royster
Mujtaba F Garufi
Jones U Ruta
Leja I Gillian
Murillo I Shinko
Adams P Caudy
Jennifer Y Figeroa
Jeanfrancois Q Paprocki
Cody W Chui
Misaki S Caudy
Antonio B Chui
Sinclair A Iturbide
Maisha C Ruta
Ashley K Nicka
Mayumi U Chui
Antonio N Chui
Alejandro E Ferencz
Maria X Schemmer
Octavia E Morasca
Rodrigues W Slusarski
Silvio U Albares
Smith T Rulapaugh
Mujtaba N Flosi
Aruna E Stockham
Misaki X Rulapaugh
Clifford J Darakjy
Ricardo I Stockham
Arvin N Tollner
Arvin M Royster
Octavia U Schemmer
Octavia D Doe
Tony O Briddick
Jones C Malet
Morrow Y Flosi
David R Shinko
Juan J Maclead
Munro L Doe
Maisha B Maclead
Costa J Briddick
Aditya R Gaucho
Ashley N Oldroyd
Adams W Ostrosky
Chavez Y Nicka
Stacey C Foller
Tony Q Shinko
Antonio A Kolmetz
Aditya Y Sergi
Cody Y Tollner
Deepesh M Stockham
IdCountryDate
1000Argentina2025-04-29
1001United Kingdom2025-04-14
1002Russia2025-04-16
1003France2025-04-10
1004Australia2025-04-19
1005Spain2025-04-14
1006Australia2025-04-16
1007United Kingdom2025-04-14
1008Germany2025-04-13
1009Canada2025-04-15
1010Canada2025-04-01
1011Argentina2025-04-14
1012Italy2025-04-22
1013Brazil2025-04-27
1014Spain2025-04-02
1015Japan2025-04-05
1016Canada2025-04-07
1017Canada2025-04-21
1018Spain2025-04-21
1019India2025-04-19
1020Canada2025-04-12
1021Russia2025-04-30
1022Spain2025-04-26
1023Canada2025-04-27
1024Australia2025-04-03
1025Italy2025-04-15
1026Brazil2025-04-17
1027Japan2025-04-11
1028India2025-04-03
1029Australia2025-04-23
1030Argentina2025-04-18
1031France2025-04-28
1032France2025-04-08
1033Spain2025-04-13
1034India2025-04-16
1035Italy2025-04-28
1036Italy2025-04-20
1037Canada2025-04-27
1038Brazil2025-04-18
1039France2025-04-10
1040France2025-04-15
1041Russia2025-04-29
1042Japan2025-04-06
1043Germany2025-04-07
1044Canada2025-04-29
1045Spain2025-04-26
1046Russia2025-04-03
1047Brazil2025-04-12
1048India2025-04-03
1049Germany2025-04-17

On-Demand Data

NameIdCountryDate
Mayumi X Campain1000Italy2025-04-26
Julie O Maclead1001Germany2025-04-11
Maisha L Kolmetz1002France2025-04-28
David O Whobrey1003France2025-04-30
Rodrigues P Inouye1004Germany2025-04-24
Chavez R Oldroyd1005Argentina2025-04-05
Greenwood X Shinko1006Japan2025-04-30
Julie C Foller1007Brazil2025-04-19
Jeanfrancois D Malet1008Brazil2025-04-01
Leja X Bolognia1009Japan2025-04-13
Ricardo Y Bowley1010Japan2025-04-30
Faith X Shinko1011Spain2025-04-28
Adams C Vocelka1012Australia2025-04-24
Antonio C Darakjy1013Italy2025-04-01
Clifford B Briddick1014Spain2025-04-20
Ricardo N Paprocki1015Brazil2025-04-02
Morrow N Waycott1016United Kingdom2025-04-21
Salvatore K Garufi1017United Kingdom2025-04-10
Greenwood O Iturbide1018Japan2025-04-04
Jennifer R Glick1019United Kingdom2025-04-28
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Ashley I RimAustraliaStephen Shaw QUALIFIED
Ricardo H OstroskyCanadaAmy Elsner UNQUALIFIED
Octavia T FerenczUnited KingdomStephen Shaw QUALIFIED
Kadeem Y SergiArgentinaStephen Shaw QUALIFIED
James Q InouyeRussiaIvan Magalhaes RENEWAL
Clifford A TollnerAustraliaIvan Magalhaes UNQUALIFIED
Deepesh H PaprockiUnited KingdomAsiya Javayant QUALIFIED
Cody D FlosiAustraliaOnyama Limba QUALIFIED
Rodrigues X OldroydUnited KingdomAmy Elsner RENEWAL
Emily R BowleyItalyBernardo Dominic RENEWAL
James C ButtSpainBernardo Dominic RENEWAL
Murillo V VenereRussiaAmy Elsner QUALIFIED
Johnson I DoeRussiaStephen Shaw UNQUALIFIED
Jones V StockhamFranceXuxue Feng PROPOSAL
Ashley W OldroydUnited KingdomAsiya Javayant NEGOTIATION
Johnson C NickaUnited KingdomIoni Bowcher NEGOTIATION
Claire X KolmetzIndiaStephen Shaw QUALIFIED
Maisha J DoeJapanXuxue Feng QUALIFIED
Greenwood B NickaIndiaIvan Magalhaes NEW
Isabel H MarrierItalyBernardo Dominic QUALIFIED
Jones T SlusarskiFranceAnna Fali NEW
Wickens O CaldareraCanadaIvan Magalhaes PROPOSAL
Antonio Y MarrierSpainStephen Shaw NEGOTIATION
Kadeem E FerenczAustraliaElwin Sharvill NEW
James O ShinkoFranceIvan Magalhaes PROPOSAL
Stacey C OldroydBrazilBernardo Dominic NEGOTIATION
Misaki V DarakjyBrazilBernardo Dominic PROPOSAL
Emily J CampainAustraliaStephen Shaw NEGOTIATION
Jennifer T StensethCanadaXuxue Feng NEW
Jennifer Q MorascaBrazilOnyama Limba PROPOSAL
Emily F WieserSpainStephen Shaw QUALIFIED
Murillo H FlosiRussiaAnna Fali QUALIFIED
Deepesh Q AmigonAustraliaElwin Sharvill PROPOSAL
Greenwood T DilliardItalyIvan Magalhaes RENEWAL
Stacey V SchemmerBrazilAsiya Javayant RENEWAL
Rodrigues Y MacleadCanadaStephen Shaw NEGOTIATION
Deepesh X SergiCanadaAnna Fali UNQUALIFIED
Maria U InouyeGermanyXuxue Feng PROPOSAL
Stacey S PerinUnited KingdomXuxue Feng RENEWAL
Greenwood R CaudyFranceBernardo Dominic 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>