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 N GillianArgentinaAsiya Javayant PROPOSAL
Faith J GauchoSpainXuxue Feng NEW
Francesco A AlbaresFranceAnna Fali PROPOSAL
Aditya Y GauchoBrazilAsiya Javayant NEGOTIATION
Juan Q RutaItalyIoni Bowcher NEGOTIATION
Aruna R VenereCanadaBernardo Dominic UNQUALIFIED
Misaki B GlickFranceIoni Bowcher NEW
Cody D MacleadArgentinaAnna Fali NEGOTIATION
Johnson B MacleadItalyStephen Shaw NEGOTIATION
Ivar M KolmetzFranceXuxue Feng RENEWAL
Ashley X VocelkaGermanyOnyama Limba QUALIFIED
Chavez J OldroydGermanyXuxue Feng UNQUALIFIED
Rodrigues W ChuiFranceBernardo Dominic NEGOTIATION
Mayumi T RutaUnited KingdomIvan Magalhaes QUALIFIED
Ricardo M CaldareraFranceOnyama Limba PROPOSAL
Chavez B GarufiCanadaAmy Elsner NEGOTIATION
Ricardo W TollnerJapanIoni Bowcher PROPOSAL
Ashley J WieserJapanAmy Elsner RENEWAL
Deepesh C OldroydAustraliaAmy Elsner QUALIFIED
Silvio P SchemmerJapanAnna Fali NEGOTIATION
Izzy W BriddickJapanBernardo Dominic NEGOTIATION
Maria Y MaletBrazilIvan Magalhaes QUALIFIED
Maria E DilliardArgentinaBernardo Dominic QUALIFIED
Claire B SergiUnited KingdomElwin Sharvill QUALIFIED
Octavia E BowleyUnited KingdomAsiya Javayant QUALIFIED
Nicolas G OldroydArgentinaAsiya Javayant NEW
Jennifer U ButtGermanyElwin Sharvill UNQUALIFIED
Octavia B RulapaughItalyAmy Elsner NEGOTIATION
Mujtaba E GillianBrazilXuxue Feng QUALIFIED
Nicolas V RoysterBrazilAmy Elsner NEW
Arvin G RutaGermanyBernardo Dominic NEGOTIATION
Jeanfrancois W PaprockiIndiaStephen Shaw UNQUALIFIED
Clifford K IturbideItalyBernardo Dominic NEW
Aditya X FollerBrazilXuxue Feng NEGOTIATION
Octavia C VocelkaCanadaIvan Magalhaes UNQUALIFIED
Kadeem P VocelkaFranceAnna Fali RENEWAL
Adams P GlickAustraliaAnna Fali NEGOTIATION
Isabel J IturbideFranceBernardo Dominic UNQUALIFIED
Maisha V GauchoFranceAsiya Javayant UNQUALIFIED
Aditya W SchemmerItalyBernardo Dominic QUALIFIED
James K WieserIndiaAmy Elsner UNQUALIFIED
Stacey J PoquetteIndiaAsiya Javayant RENEWAL
Cody E WhobreyBrazilXuxue Feng NEW
Jefferson X ChuiBrazilAsiya Javayant NEW
Claire G CampainAustraliaAsiya Javayant RENEWAL
Izzy U GauchoFranceStephen Shaw RENEWAL
Adams I SaylorsCanadaStephen Shaw NEW
Antonio S FigeroaAustraliaAsiya Javayant QUALIFIED
Murillo Q PoquetteAustraliaStephen Shaw UNQUALIFIED
Alejandro N SlusarskiGermanyElwin Sharvill NEW
Horizontal
NameCountryRepresentativeStatus
Greenwood S ShinkoItalyIvan Magalhaes RENEWAL
Greenwood G GauchoUnited KingdomIvan Magalhaes UNQUALIFIED
Wickens I WaycottBrazilAsiya Javayant NEW
Wickens J DarakjyIndiaAsiya Javayant UNQUALIFIED
Maisha Z NickaBrazilAnna Fali NEGOTIATION
Silvio P WhobreyCanadaElwin Sharvill PROPOSAL
Darci M ChuiRussiaIoni Bowcher PROPOSAL
Deepesh B WieserAustraliaBernardo Dominic NEW
Salvatore A RoysterSpainXuxue Feng NEGOTIATION
Jefferson I BriddickIndiaElwin Sharvill RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Smith Q VocelkaArgentina2024-06-06Buckley Miller Wright QUALIFIED61Onyama Limba
1001Morrow O OldroydJapan2024-05-27Feltz Printing Service RENEWAL93Ivan Magalhaes
1002Julie H CaudyIndia2024-06-09Dorl, James J Esq QUALIFIED81Stephen Shaw
1003Jefferson B MaletCanada2024-06-01Morlong Associates UNQUALIFIED70Ioni Bowcher
1004Sinclair Y StockhamUnited Kingdom2024-05-19Chemel, James L Cpa PROPOSAL68Asiya Javayant
1005Murillo Q FigeroaIndia2024-06-03Chemel, James L Cpa UNQUALIFIED27Elwin Sharvill
1006Murillo F AmigonArgentina2024-06-09Morlong Associates UNQUALIFIED8Asiya Javayant
1007Maisha R FollerItaly2024-06-13Commercial Press UNQUALIFIED51Bernardo Dominic
1008Murillo D KolmetzFrance2024-06-01Feltz Printing Service NEGOTIATION17Ivan Magalhaes
1009Johnson X BriddickJapan2024-05-30King, Christopher A Esq NEW72Elwin Sharvill
1010Claire F DilliardCanada2024-05-29Rangoni Of Florence RENEWAL7Stephen Shaw
1011Kaitlin U BologniaBrazil2024-06-14Truhlar And Truhlar Attys PROPOSAL45Amy Elsner
1012Leon B FlosiSpain2024-05-24Feiner Bros PROPOSAL16Onyama Limba
1013Octavia E ChuiFrance2024-06-11Buckley Miller Wright NEW68Stephen Shaw
1014Ricardo K DoeBrazil2024-06-05Printing Dimensions QUALIFIED23Ivan Magalhaes
1015Tony V OldroydUnited Kingdom2024-05-25Truhlar And Truhlar Attys NEW98Bernardo Dominic
1016Costa X MaletGermany2024-05-23Buckley Miller Wright PROPOSAL87Anna Fali
1017Maria W MorascaSpain2024-05-18Chapman, Ross E Esq NEGOTIATION60Onyama Limba
1018Wickens M GillianSpain2024-06-11Feiner Bros UNQUALIFIED14Ioni Bowcher
1019Aditya T KuskoFrance2024-05-30Chapman, Ross E Esq PROPOSAL6Asiya Javayant
1020Faith A NestleItaly2024-06-07Feiner Bros PROPOSAL50Stephen Shaw
1021Aika X InouyeRussia2024-05-30Commercial Press PROPOSAL51Anna Fali
1022Juan O OldroydUnited Kingdom2024-06-08Feltz Printing Service PROPOSAL55Bernardo Dominic
1023Darci C WieserIndia2024-06-14Chapman, Ross E Esq NEGOTIATION72Xuxue Feng
1024Smith U WieserUnited Kingdom2024-06-13Benton, John B Jr UNQUALIFIED14Xuxue Feng
1025Julie E ButtFrance2024-06-02Feiner Bros RENEWAL63Ioni Bowcher
1026James J WhobreyIndia2024-06-14Commercial Press QUALIFIED61Bernardo Dominic
1027Aditya T WhobreyCanada2024-06-10Chanay, Jeffrey A Esq NEGOTIATION45Xuxue Feng
1028Salvatore K VocelkaSpain2024-05-21Morlong Associates RENEWAL16Onyama Limba
1029Jefferson H SlusarskiArgentina2024-05-28Rousseaux, Michael Esq UNQUALIFIED63Anna Fali
1030Stacey D FollerIndia2024-06-12Chapman, Ross E Esq PROPOSAL35Onyama Limba
1031Leja V GauchoUnited Kingdom2024-06-08Feiner Bros UNQUALIFIED41Bernardo Dominic
1032Juan T FigeroaArgentina2024-05-26Feltz Printing Service NEGOTIATION2Elwin Sharvill
1033Chavez E OldroydFrance2024-06-07Dorl, James J Esq RENEWAL1Amy Elsner
1034Kaitlin U GarufiGermany2024-05-29Printing Dimensions NEW39Bernardo Dominic
1035Murillo F BriddickUnited Kingdom2024-05-19Benton, John B Jr NEW59Elwin Sharvill
1036Kaitlin S OstroskyCanada2024-05-27Morlong Associates RENEWAL0Onyama Limba
1037Costa L SchemmerBrazil2024-05-31Feiner Bros UNQUALIFIED34Ioni Bowcher
1038Clifford S CaldareraJapan2024-05-22Chanay, Jeffrey A Esq NEW13Stephen Shaw
1039Salvatore G CaldareraRussia2024-05-20Chemel, James L Cpa RENEWAL21Ivan Magalhaes
1040Murillo Z ChuiSpain2024-06-03Dorl, James J Esq UNQUALIFIED69Ivan Magalhaes
1041James J DoeRussia2024-05-18Feltz Printing Service UNQUALIFIED14Bernardo Dominic
1042Mayumi A BowleySpain2024-06-12Feiner Bros RENEWAL43Bernardo Dominic
1043Aditya V FlosiIndia2024-05-27Morlong Associates PROPOSAL2Ivan Magalhaes
1044James C PerinRussia2024-05-23Feiner Bros NEGOTIATION84Xuxue Feng
1045Adams N StensethAustralia2024-06-15King, Christopher A Esq UNQUALIFIED99Anna Fali
1046Cody C DilliardItaly2024-05-22Feltz Printing Service NEW93Onyama Limba
1047Nicolas Q KolmetzRussia2024-05-24Feltz Printing Service UNQUALIFIED7Onyama Limba
1048Salvatore P TollnerCanada2024-05-24Morlong Associates RENEWAL87Bernardo Dominic
1049Adams Z MorascaJapan2024-06-06Chapman, Ross E Esq PROPOSAL26Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Misaki Z StensethArgentinaAnna Fali QUALIFIED
Jeanfrancois S MacleadItalyXuxue Feng NEW
Cody U DilliardGermanyXuxue Feng NEGOTIATION
Tony U InouyeAustraliaElwin Sharvill RENEWAL
Sinclair X MaletIndiaAmy Elsner QUALIFIED
Rodrigues C NestleCanadaAmy Elsner NEGOTIATION
Nicolas R NestleGermanyAnna Fali PROPOSAL
Costa U FerenczItalyBernardo Dominic UNQUALIFIED
Tony Y KuskoItalyIvan Magalhaes QUALIFIED
Wickens O GlickArgentinaAnna Fali QUALIFIED
Emily W AlbaresRussiaAsiya Javayant UNQUALIFIED
Claire F OldroydAustraliaAsiya Javayant NEW
Kaitlin J StockhamRussiaIvan Magalhaes UNQUALIFIED
Wickens X RimRussiaElwin Sharvill RENEWAL
Arvin K VenereUnited KingdomAmy Elsner NEW
Munro W GillianRussiaIvan Magalhaes UNQUALIFIED
Stacey J VenereUnited KingdomElwin Sharvill UNQUALIFIED
Clifford A MorascaFranceIoni Bowcher NEW
Ashley I SergiArgentinaAnna Fali PROPOSAL
Arvin J RimUnited KingdomAsiya Javayant NEGOTIATION
Julie C NickaGermanyElwin Sharvill NEGOTIATION
Rodrigues N RoysterCanadaAsiya Javayant QUALIFIED
Misaki S WaycottGermanyBernardo Dominic PROPOSAL
Sinclair Y MarrierBrazilAsiya Javayant PROPOSAL
Leon V RutaRussiaXuxue Feng QUALIFIED
Leja X CampainArgentinaIoni Bowcher UNQUALIFIED
Leon H MorascaSpainStephen Shaw RENEWAL
Antonio Y RimJapanOnyama Limba RENEWAL
Alejandro W MarrierRussiaElwin Sharvill RENEWAL
Mujtaba B GarufiArgentinaAmy Elsner QUALIFIED
Isabel J MaletJapanIvan Magalhaes NEGOTIATION
Maisha Y VocelkaFranceIvan Magalhaes NEW
Sinclair H MaletAustraliaAsiya Javayant NEGOTIATION
Johnson T CaudyItalyStephen Shaw QUALIFIED
Aditya J WaycottJapanAsiya Javayant PROPOSAL
Aika E AlbaresCanadaIoni Bowcher UNQUALIFIED
Sinclair L FollerRussiaElwin Sharvill QUALIFIED
Deepesh A PerinRussiaElwin Sharvill QUALIFIED
Aika E NestleAustraliaXuxue Feng QUALIFIED
Murillo J StockhamJapanAmy Elsner RENEWAL
Sinclair B TollnerAustraliaXuxue Feng UNQUALIFIED
Munro K PoquetteGermanyIvan Magalhaes UNQUALIFIED
James K KuskoSpainBernardo Dominic NEGOTIATION
Jones M SchemmerUnited KingdomElwin Sharvill RENEWAL
Ivar C WaycottSpainIvan Magalhaes PROPOSAL
Salvatore Q OldroydFranceBernardo Dominic NEGOTIATION
Ricardo G DarakjyGermanyAmy Elsner NEGOTIATION
Claire J FlosiSpainElwin Sharvill PROPOSAL
Izzy A MarrierAustraliaStephen Shaw RENEWAL
Rodrigues E RulapaughGermanyXuxue Feng NEGOTIATION
Frozen Columns
Name
Ashley M Albares
Rodrigues B Waycott
Adams O Stenseth
Aditya X Doe
Aditya I Darakjy
Sinclair X Nicka
Morrow X Stenseth
Leja I Saylors
Smith F Bowley
Mujtaba Q Ferencz
Octavia R Chui
Misaki T Vocelka
Aika A Whobrey
Darci T Rulapaugh
Johnson F Morasca
Juan L Butt
Morrow V Shinko
Isabel Z Malet
Murillo Y Stockham
Cody E Dilliard
Wickens P Inouye
Smith A Nestle
Jeanfrancois Z Flosi
Claire B Ostrosky
Clifford L Waycott
Antonio L Malet
Juan W Paprocki
James C Ruta
Kadeem I Rulapaugh
Cody W Oldroyd
Alejandro A Nestle
Aika E Gillian
Kaitlin X Rulapaugh
Silvio Z Kolmetz
Kadeem L Whobrey
Misaki K Slusarski
Juan W Stockham
Maisha W Kusko
Aditya Z Nestle
Misaki G Paprocki
Cody K Albares
Arvin O Paprocki
Tony D Sergi
Arvin U Whobrey
Deepesh T Whobrey
Darci J Whobrey
Smith K Ostrosky
Juan B Malet
Kaitlin F Vocelka
Darci Q Kusko
IdCountryDate
1000India2024-06-02
1001Brazil2024-05-20
1002Argentina2024-06-08
1003Australia2024-05-18
1004India2024-05-21
1005Japan2024-06-02
1006Germany2024-05-23
1007Italy2024-06-13
1008Argentina2024-06-15
1009Canada2024-05-22
1010Australia2024-06-12
1011Russia2024-05-23
1012United Kingdom2024-06-10
1013United Kingdom2024-05-19
1014Argentina2024-05-23
1015Australia2024-05-19
1016Canada2024-06-07
1017United Kingdom2024-05-19
1018Italy2024-05-26
1019Brazil2024-05-24
1020Brazil2024-06-05
1021Russia2024-05-26
1022Germany2024-05-31
1023Spain2024-05-20
1024Italy2024-06-15
1025Italy2024-05-27
1026Argentina2024-05-26
1027Argentina2024-06-11
1028Canada2024-05-17
1029Brazil2024-05-19
1030Germany2024-05-30
1031Russia2024-06-10
1032Spain2024-06-02
1033United Kingdom2024-06-08
1034Germany2024-06-04
1035Canada2024-05-24
1036India2024-06-02
1037India2024-06-14
1038Italy2024-05-31
1039Italy2024-05-24
1040France2024-06-03
1041Russia2024-06-04
1042India2024-06-04
1043Japan2024-05-28
1044Brazil2024-05-25
1045Russia2024-06-06
1046France2024-05-24
1047Italy2024-06-01
1048Germany2024-05-29
1049Canada2024-06-11

On-Demand Data

NameIdCountryDate
Cody A Bolognia1000Spain2024-06-07
Adams C Maclead1001Italy2024-06-05
Aditya I Ruta1002Australia2024-05-23
Clifford S Figeroa1003Russia2024-05-17
Murillo M Ferencz1004Italy2024-05-20
Maisha A Paprocki1005Argentina2024-05-17
Jefferson N Flosi1006Australia2024-05-23
Costa K Figeroa1007Australia2024-05-18
Cody Z Kolmetz1008India2024-06-02
Kaitlin H Caldarera1009Argentina2024-06-10
Kaitlin W Waycott1010France2024-06-11
Misaki A Albares1011Argentina2024-05-28
Nicolas V Glick1012Australia2024-05-31
Kaitlin G Perin1013Germany2024-06-03
Emily E Bolognia1014Canada2024-06-12
Clifford S Nicka1015France2024-05-24
Aruna F Tollner1016Brazil2024-06-11
Jones W Poquette1017Australia2024-05-21
Ivar J Inouye1018Australia2024-05-26
Jones D Garufi1019Brazil2024-06-02
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Mujtaba B FigeroaBrazilOnyama Limba UNQUALIFIED
Leja R DarakjySpainAsiya Javayant NEW
Jefferson N SaylorsIndiaStephen Shaw NEW
Costa G MarrierItalyBernardo Dominic RENEWAL
Kaitlin S GlickCanadaIoni Bowcher NEW
Faith P FlosiIndiaXuxue Feng QUALIFIED
Izzy M DoeSpainIoni Bowcher UNQUALIFIED
Ricardo O WieserGermanyBernardo Dominic NEW
Jennifer E MorascaBrazilBernardo Dominic PROPOSAL
Francesco A DarakjyFranceAmy Elsner RENEWAL
Rodrigues J PoquetteItalyAsiya Javayant QUALIFIED
Nicolas N NickaJapanXuxue Feng NEW
Leja N WhobreySpainXuxue Feng QUALIFIED
Claire D PoquetteItalyAnna Fali QUALIFIED
Stacey E PerinIndiaStephen Shaw QUALIFIED
Izzy Y OstroskyCanadaAnna Fali RENEWAL
Johnson G GlickFranceBernardo Dominic NEW
Aruna U RimItalyAsiya Javayant PROPOSAL
Claire R BologniaCanadaAsiya Javayant RENEWAL
Jones L BowleyUnited KingdomStephen Shaw PROPOSAL
Arvin K WieserItalyAsiya Javayant QUALIFIED
Adams H PerinJapanOnyama Limba UNQUALIFIED
Jennifer J BologniaGermanyIvan Magalhaes NEW
Greenwood Q SlusarskiSpainAnna Fali NEGOTIATION
Cody V MacleadBrazilXuxue Feng UNQUALIFIED
Nicolas I MaletUnited KingdomXuxue Feng NEGOTIATION
Emily E RimRussiaIvan Magalhaes PROPOSAL
Darci A MarrierArgentinaAsiya Javayant QUALIFIED
Tony S NickaUnited KingdomIvan Magalhaes QUALIFIED
Greenwood L AmigonBrazilElwin Sharvill PROPOSAL
Johnson N AmigonItalyElwin Sharvill PROPOSAL
Clifford U BowleyCanadaXuxue Feng UNQUALIFIED
Julie E AlbaresIndiaAnna Fali UNQUALIFIED
Mayumi C StensethJapanXuxue Feng NEW
Smith P MacleadUnited KingdomElwin Sharvill UNQUALIFIED
Adams Q VocelkaCanadaElwin Sharvill QUALIFIED
Munro J WaycottAustraliaElwin Sharvill RENEWAL
Leja G SchemmerAustraliaAmy Elsner RENEWAL
Izzy Y MarrierFranceIvan Magalhaes NEGOTIATION
Aika S PerinJapanOnyama Limba 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>