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
Tony L GarufiSpainXuxue Feng PROPOSAL
Cody O SchemmerCanadaStephen Shaw RENEWAL
Murillo A AlbaresAustraliaAsiya Javayant NEW
Tony X SchemmerSpainOnyama Limba NEGOTIATION
Maria Q FlosiSpainIoni Bowcher NEGOTIATION
Aditya L SlusarskiItalyElwin Sharvill NEW
Emily B MarrierUnited KingdomElwin Sharvill NEGOTIATION
Murillo W SchemmerGermanyStephen Shaw QUALIFIED
Greenwood B MorascaArgentinaXuxue Feng RENEWAL
Emily O RulapaughSpainStephen Shaw QUALIFIED
Stacey P WhobreyArgentinaOnyama Limba QUALIFIED
Rodrigues P RulapaughGermanyOnyama Limba QUALIFIED
Ashley B InouyeIndiaAmy Elsner UNQUALIFIED
Stacey H CampainCanadaOnyama Limba NEW
Aditya J MarrierAustraliaAsiya Javayant NEGOTIATION
James E GarufiFranceAmy Elsner RENEWAL
Sinclair E FollerUnited KingdomStephen Shaw RENEWAL
Smith E ShinkoSpainXuxue Feng NEGOTIATION
Izzy M NestleAustraliaAmy Elsner PROPOSAL
Cody A GillianRussiaAmy Elsner NEGOTIATION
Costa F MaletCanadaIoni Bowcher UNQUALIFIED
Sinclair T DilliardArgentinaAnna Fali NEGOTIATION
Johnson F BologniaUnited KingdomAmy Elsner NEW
Maisha T MaletGermanyStephen Shaw NEW
Emily L RulapaughArgentinaAnna Fali PROPOSAL
Mayumi E NickaFranceElwin Sharvill UNQUALIFIED
Rodrigues O GillianGermanyIvan Magalhaes PROPOSAL
Ricardo Q MarrierGermanyIoni Bowcher PROPOSAL
Smith J SaylorsSpainIvan Magalhaes UNQUALIFIED
Ashley R VocelkaSpainElwin Sharvill NEGOTIATION
Aditya N RutaJapanElwin Sharvill NEW
Murillo T RoysterUnited KingdomIvan Magalhaes UNQUALIFIED
Leon T BriddickArgentinaOnyama Limba QUALIFIED
Sinclair O RimSpainAnna Fali RENEWAL
Adams Z IturbideJapanAsiya Javayant NEW
Julie D BowleyBrazilOnyama Limba PROPOSAL
Claire J GarufiUnited KingdomElwin Sharvill NEGOTIATION
Stacey A RimSpainAmy Elsner RENEWAL
Maria V KolmetzJapanIoni Bowcher PROPOSAL
Deepesh L SchemmerJapanAsiya Javayant PROPOSAL
Claire N MaletUnited KingdomOnyama Limba UNQUALIFIED
Faith S AlbaresItalyIvan Magalhaes QUALIFIED
Clifford Q MaletAustraliaElwin Sharvill NEGOTIATION
Aruna I OldroydItalyBernardo Dominic RENEWAL
Leon A WhobreyJapanAnna Fali QUALIFIED
Kadeem S FollerItalyXuxue Feng PROPOSAL
Morrow J DilliardRussiaStephen Shaw RENEWAL
Leon K OstroskyIndiaIoni Bowcher RENEWAL
Deepesh V FollerAustraliaOnyama Limba NEW
Johnson A FerenczAustraliaAnna Fali NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Mujtaba R CaudyJapanIoni Bowcher NEW
Wickens C FigeroaJapanIoni Bowcher UNQUALIFIED
Jefferson D ButtItalyIoni Bowcher NEW
Octavia P VocelkaBrazilStephen Shaw PROPOSAL
Sinclair Y MaletGermanyIoni Bowcher UNQUALIFIED
Jones G PerinSpainAmy Elsner UNQUALIFIED
Leon Q GauchoGermanyOnyama Limba QUALIFIED
Salvatore F SchemmerBrazilBernardo Dominic PROPOSAL
Jefferson M StockhamIndiaStephen Shaw RENEWAL
Julie E OldroydItalyAsiya Javayant UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000James G MaletGermany2024-09-04Feiner Bros PROPOSAL79Bernardo Dominic
1001Aika Q ChuiItaly2024-09-05King, Christopher A Esq QUALIFIED15Ioni Bowcher
1002Aditya X FlosiUnited Kingdom2024-09-15Benton, John B Jr QUALIFIED58Anna Fali
1003Aika K SergiRussia2024-09-02Rousseaux, Michael Esq UNQUALIFIED83Asiya Javayant
1004Darci F KuskoSpain2024-08-29Morlong Associates UNQUALIFIED22Ivan Magalhaes
1005Misaki L ShinkoGermany2024-09-07Benton, John B Jr UNQUALIFIED70Ivan Magalhaes
1006Rodrigues C VocelkaJapan2024-09-10Feltz Printing Service QUALIFIED64Xuxue Feng
1007Antonio L FerenczRussia2024-09-01Feltz Printing Service PROPOSAL57Onyama Limba
1008Maisha M WhobreyArgentina2024-09-06Benton, John B Jr RENEWAL25Bernardo Dominic
1009Claire O SergiFrance2024-08-28Printing Dimensions QUALIFIED51Stephen Shaw
1010Francesco D VenereUnited Kingdom2024-09-03Rousseaux, Michael Esq NEW89Bernardo Dominic
1011Cody D AmigonGermany2024-09-02Chanay, Jeffrey A Esq NEW69Ivan Magalhaes
1012Alejandro Z CaldareraIndia2024-09-20Chemel, James L Cpa RENEWAL10Elwin Sharvill
1013Alejandro B DilliardSpain2024-08-28Feltz Printing Service RENEWAL81Onyama Limba
1014Stacey K CampainCanada2024-09-08Rousseaux, Michael Esq RENEWAL1Stephen Shaw
1015Francesco U KuskoItaly2024-08-24Benton, John B Jr QUALIFIED60Bernardo Dominic
1016Silvio N FigeroaUnited Kingdom2024-09-22Chemel, James L Cpa QUALIFIED63Xuxue Feng
1017Jeanfrancois U StensethRussia2024-09-08King, Christopher A Esq NEGOTIATION62Onyama Limba
1018Leja D WhobreyArgentina2024-09-21Chemel, James L Cpa NEGOTIATION19Ivan Magalhaes
1019Clifford G AmigonFrance2024-09-12Rangoni Of Florence PROPOSAL93Amy Elsner
1020Wickens C StensethItaly2024-08-28Chanay, Jeffrey A Esq UNQUALIFIED45Xuxue Feng
1021Izzy F WaycottCanada2024-09-17Chapman, Ross E Esq UNQUALIFIED8Anna Fali
1022Emily O StensethArgentina2024-09-14Benton, John B Jr PROPOSAL8Amy Elsner
1023Aruna H ShinkoArgentina2024-09-17Truhlar And Truhlar Attys PROPOSAL67Bernardo Dominic
1024Ashley S PaprockiUnited Kingdom2024-09-01Printing Dimensions NEGOTIATION54Anna Fali
1025Alejandro A KolmetzSpain2024-09-02Feiner Bros RENEWAL28Ioni Bowcher
1026Sinclair E MacleadJapan2024-08-31Truhlar And Truhlar Attys NEW43Amy Elsner
1027Costa R OstroskySpain2024-09-15Printing Dimensions PROPOSAL24Ivan Magalhaes
1028Clifford Q VocelkaBrazil2024-09-17Buckley Miller Wright NEW1Xuxue Feng
1029Deepesh R PerinItaly2024-09-21Dorl, James J Esq NEGOTIATION53Amy Elsner
1030Juan Q AlbaresIndia2024-09-04Commercial Press NEW58Ivan Magalhaes
1031Izzy H MorascaUnited Kingdom2024-09-17Morlong Associates NEGOTIATION58Xuxue Feng
1032Wickens Y FlosiItaly2024-09-14Buckley Miller Wright UNQUALIFIED16Ioni Bowcher
1033Maria O SlusarskiBrazil2024-09-20Buckley Miller Wright UNQUALIFIED13Ivan Magalhaes
1034Deepesh X TollnerBrazil2024-09-19Feiner Bros QUALIFIED72Xuxue Feng
1035Faith C BowleyAustralia2024-09-03Feltz Printing Service NEW3Ivan Magalhaes
1036Leja G GarufiItaly2024-09-22Benton, John B Jr PROPOSAL61Xuxue Feng
1037Rodrigues Z VenereBrazil2024-09-09Dorl, James J Esq QUALIFIED13Stephen Shaw
1038Jefferson M MaletFrance2024-08-30Morlong Associates UNQUALIFIED23Amy Elsner
1039Alejandro O CaudyFrance2024-09-06King, Christopher A Esq NEGOTIATION5Stephen Shaw
1040Francesco K KolmetzJapan2024-09-09Commercial Press RENEWAL30Amy Elsner
1041Greenwood R GarufiUnited Kingdom2024-09-18Rousseaux, Michael Esq UNQUALIFIED8Amy Elsner
1042Costa Q DarakjyJapan2024-09-21Buckley Miller Wright PROPOSAL37Anna Fali
1043Antonio R NickaAustralia2024-08-24Benton, John B Jr QUALIFIED75Ivan Magalhaes
1044Aruna M KuskoJapan2024-09-16Feltz Printing Service NEW1Elwin Sharvill
1045Leon K MaletIndia2024-08-30Rangoni Of Florence UNQUALIFIED74Elwin Sharvill
1046Wickens E InouyeJapan2024-09-12King, Christopher A Esq NEGOTIATION79Ioni Bowcher
1047Silvio J GlickIndia2024-09-09Rousseaux, Michael Esq RENEWAL70Stephen Shaw
1048Nicolas U VocelkaIndia2024-08-24Feltz Printing Service QUALIFIED63Bernardo Dominic
1049Antonio B ButtItaly2024-08-29King, Christopher A Esq RENEWAL23Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Kadeem M GarufiJapanBernardo Dominic PROPOSAL
Jones E RoysterCanadaIvan Magalhaes QUALIFIED
Morrow F RimRussiaXuxue Feng QUALIFIED
Wickens L AmigonSpainStephen Shaw NEGOTIATION
Deepesh N DilliardAustraliaIoni Bowcher NEGOTIATION
Ashley G FlosiSpainXuxue Feng RENEWAL
Morrow S TollnerBrazilAnna Fali UNQUALIFIED
Aditya J BowleyCanadaAmy Elsner QUALIFIED
David N StensethIndiaStephen Shaw PROPOSAL
Faith H PoquetteCanadaAsiya Javayant QUALIFIED
Misaki S SaylorsIndiaIoni Bowcher NEW
Adams L CaldareraJapanXuxue Feng RENEWAL
Salvatore X IturbideArgentinaOnyama Limba UNQUALIFIED
Salvatore L StensethJapanIoni Bowcher QUALIFIED
Stacey K BowleyAustraliaIvan Magalhaes NEW
Tony V InouyeArgentinaStephen Shaw PROPOSAL
Murillo Q PoquetteSpainXuxue Feng QUALIFIED
Mayumi M BriddickCanadaIvan Magalhaes NEW
Wickens E FigeroaIndiaOnyama Limba RENEWAL
Munro X TollnerRussiaAsiya Javayant NEW
Isabel J CaldareraUnited KingdomXuxue Feng NEW
Deepesh E RimRussiaAmy Elsner RENEWAL
Salvatore C StensethJapanStephen Shaw UNQUALIFIED
Ashley Y RimAustraliaAsiya Javayant PROPOSAL
Smith V ButtUnited KingdomOnyama Limba NEGOTIATION
Deepesh L CampainCanadaAsiya Javayant UNQUALIFIED
Claire X AlbaresSpainOnyama Limba NEW
Mayumi W MaletJapanAnna Fali RENEWAL
Arvin X OldroydJapanStephen Shaw NEW
Juan X NestleGermanyXuxue Feng UNQUALIFIED
Jones E DarakjyBrazilIoni Bowcher QUALIFIED
Juan Y SlusarskiItalyElwin Sharvill NEGOTIATION
Mujtaba S IturbideUnited KingdomIoni Bowcher QUALIFIED
Aruna I VenereGermanyIoni Bowcher NEGOTIATION
Francesco N DilliardSpainElwin Sharvill PROPOSAL
Misaki E OstroskyFranceAsiya Javayant PROPOSAL
Maisha D MaletItalyAmy Elsner NEW
Mayumi B KuskoRussiaBernardo Dominic UNQUALIFIED
Jefferson H VocelkaArgentinaBernardo Dominic PROPOSAL
Julie H CaldareraUnited KingdomElwin Sharvill NEW
Izzy Y GauchoFranceXuxue Feng NEGOTIATION
Isabel M WieserIndiaIvan Magalhaes QUALIFIED
Munro B OstroskyAustraliaOnyama Limba UNQUALIFIED
Leon T DoeArgentinaIoni Bowcher NEW
Julie B OldroydCanadaAsiya Javayant UNQUALIFIED
Misaki G RoysterFranceOnyama Limba QUALIFIED
Jones M ButtArgentinaAsiya Javayant RENEWAL
Faith S AmigonAustraliaIoni Bowcher NEGOTIATION
Jeanfrancois A CampainGermanyStephen Shaw QUALIFIED
Kadeem W GarufiBrazilIoni Bowcher QUALIFIED
Frozen Columns
Name
Stacey E Perin
Salvatore Y Amigon
Johnson A Poquette
Johnson Z Stockham
Emily E Ruta
Smith B Rim
Octavia O Briddick
Ivar Q Malet
Jeanfrancois M Caldarera
Maisha E Glick
David Y Wieser
Tony C Rim
Julie T Maclead
Alejandro M Malet
Maisha D Amigon
Mujtaba N Stockham
Francesco Y Malet
Isabel B Darakjy
Smith E Foller
Isabel B Briddick
Stacey I Venere
Julie U Malet
Ashley N Morasca
Murillo Q Wieser
Greenwood I Amigon
Deepesh B Slusarski
Leja P Gaucho
Isabel B Ostrosky
Sinclair W Perin
Leon Z Kusko
Ricardo W Stenseth
Mayumi E Kolmetz
Adams F Oldroyd
Mayumi Z Vocelka
Deepesh A Ferencz
Aika F Tollner
Claire M Wieser
Greenwood B Saylors
Clifford W Caudy
Aditya Z Ruta
Munro N Nicka
Julie R Perin
Chavez I Nicka
Maisha S Ostrosky
Faith H Vocelka
Costa X Slusarski
Silvio S Amigon
Johnson Y Wieser
Morrow T Flosi
Aditya D Morasca
IdCountryDate
1000Spain2024-08-24
1001Canada2024-09-04
1002Canada2024-08-27
1003Canada2024-09-05
1004France2024-08-27
1005Italy2024-08-25
1006Germany2024-08-27
1007United Kingdom2024-08-26
1008Argentina2024-09-01
1009India2024-09-16
1010Russia2024-09-07
1011France2024-09-10
1012Brazil2024-08-29
1013Russia2024-08-27
1014Spain2024-09-18
1015Spain2024-08-24
1016Italy2024-09-01
1017Italy2024-09-17
1018Argentina2024-09-17
1019Germany2024-09-13
1020Japan2024-09-02
1021Canada2024-09-21
1022Canada2024-09-09
1023Canada2024-08-24
1024Argentina2024-09-14
1025Germany2024-09-22
1026India2024-09-02
1027Argentina2024-08-28
1028Brazil2024-09-04
1029Australia2024-09-15
1030Germany2024-09-11
1031Italy2024-09-02
1032Argentina2024-09-05
1033Japan2024-09-08
1034Japan2024-09-14
1035Germany2024-09-02
1036Brazil2024-09-04
1037India2024-08-29
1038India2024-09-03
1039Russia2024-09-05
1040Argentina2024-09-19
1041Japan2024-08-31
1042Brazil2024-09-04
1043France2024-09-20
1044India2024-09-07
1045Germany2024-09-05
1046Argentina2024-09-16
1047Germany2024-09-12
1048United Kingdom2024-09-07
1049Germany2024-09-16

On-Demand Data

NameIdCountryDate
Ashley D Amigon1000Germany2024-09-14
Octavia O Maclead1001Russia2024-08-27
Claire Y Oldroyd1002Argentina2024-08-27
Misaki R Schemmer1003Argentina2024-08-25
Cody W Whobrey1004Russia2024-09-10
Wickens Z Albares1005Italy2024-09-08
Sinclair W Poquette1006United Kingdom2024-08-27
Smith S Wieser1007Argentina2024-09-17
Leon A Figeroa1008India2024-08-29
Arvin H Rulapaugh1009India2024-09-18
David J Foller1010Australia2024-09-04
Silvio C Shinko1011Germany2024-09-19
Aruna R Malet1012Argentina2024-09-13
Sinclair Z Slusarski1013Argentina2024-09-17
Aruna F Saylors1014Italy2024-09-19
Sinclair O Stenseth1015India2024-09-01
Isabel D Stenseth1016Germany2024-09-17
Jeanfrancois U Schemmer1017Japan2024-09-06
Deepesh K Glick1018Brazil2024-09-05
Clifford H Rim1019France2024-09-02
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Octavia Y StockhamSpainIoni Bowcher QUALIFIED
Salvatore J ButtJapanIvan Magalhaes NEW
Mayumi T BriddickAustraliaAnna Fali QUALIFIED
Kadeem K MaletArgentinaAnna Fali NEGOTIATION
Ricardo B CaudyUnited KingdomAnna Fali NEW
Mujtaba Y SaylorsUnited KingdomAnna Fali UNQUALIFIED
Juan R VocelkaCanadaStephen Shaw NEW
Rodrigues N CampainBrazilXuxue Feng PROPOSAL
Tony V SchemmerFranceAmy Elsner QUALIFIED
David Y OldroydArgentinaOnyama Limba UNQUALIFIED
Greenwood S SergiIndiaElwin Sharvill UNQUALIFIED
Claire R DoeCanadaAsiya Javayant NEGOTIATION
Maria E PaprockiAustraliaAnna Fali NEW
David Y MorascaJapanElwin Sharvill NEW
Clifford A RoysterRussiaAmy Elsner NEW
Kadeem T WhobreyJapanOnyama Limba UNQUALIFIED
Antonio U CampainJapanBernardo Dominic QUALIFIED
Tony D GillianArgentinaBernardo Dominic UNQUALIFIED
Arvin E OldroydRussiaElwin Sharvill NEGOTIATION
Jefferson R DoeCanadaStephen Shaw UNQUALIFIED
Julie V RimUnited KingdomElwin Sharvill NEGOTIATION
Munro I KuskoUnited KingdomXuxue Feng PROPOSAL
Morrow H RutaUnited KingdomXuxue Feng NEGOTIATION
Mujtaba B InouyeAustraliaIvan Magalhaes QUALIFIED
Jeanfrancois J RutaAustraliaIoni Bowcher NEGOTIATION
Emily H KuskoCanadaAsiya Javayant NEGOTIATION
Julie S FigeroaIndiaIvan Magalhaes NEW
Ivar T StockhamAustraliaIvan Magalhaes NEGOTIATION
Kaitlin J GillianCanadaIoni Bowcher RENEWAL
Munro C WaycottBrazilIvan Magalhaes QUALIFIED
Juan F OldroydSpainAmy Elsner NEGOTIATION
Maisha O DoeFranceAsiya Javayant NEW
Kadeem H BologniaRussiaIvan Magalhaes NEGOTIATION
Ashley E PerinCanadaStephen Shaw UNQUALIFIED
Jones J AmigonCanadaElwin Sharvill NEGOTIATION
Ashley W BologniaUnited KingdomAnna Fali PROPOSAL
Wickens I SlusarskiFranceXuxue Feng NEGOTIATION
Antonio N RulapaughUnited KingdomIvan Magalhaes NEGOTIATION
Nicolas S MarrierArgentinaStephen Shaw NEW
Jeanfrancois P MaletRussiaAnna Fali PROPOSAL

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