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
Maisha O KolmetzRussiaElwin Sharvill PROPOSAL
Juan B NickaAustraliaAsiya Javayant PROPOSAL
Francesco N ShinkoJapanAnna Fali NEW
Ivar U RulapaughGermanyStephen Shaw NEW
Rodrigues H SchemmerFranceAmy Elsner NEGOTIATION
Jefferson B MaletRussiaAnna Fali UNQUALIFIED
Jefferson O MaletCanadaStephen Shaw RENEWAL
Jennifer F SlusarskiItalyStephen Shaw NEW
Mayumi E RutaFranceIoni Bowcher RENEWAL
Costa V AlbaresUnited KingdomIvan Magalhaes RENEWAL
Darci Y SlusarskiUnited KingdomStephen Shaw UNQUALIFIED
Ricardo Z SlusarskiCanadaIoni Bowcher NEGOTIATION
Jefferson W RulapaughIndiaBernardo Dominic PROPOSAL
Tony K ShinkoJapanXuxue Feng NEGOTIATION
Wickens O MarrierUnited KingdomIoni Bowcher PROPOSAL
Aruna J CaldareraFranceIvan Magalhaes PROPOSAL
Mayumi K SlusarskiJapanAnna Fali QUALIFIED
Claire O PoquetteIndiaBernardo Dominic NEGOTIATION
Arvin R AlbaresUnited KingdomAsiya Javayant PROPOSAL
Sinclair R DilliardIndiaIvan Magalhaes PROPOSAL
Greenwood V WieserJapanAnna Fali PROPOSAL
Sinclair K RulapaughArgentinaAmy Elsner NEGOTIATION
Jeanfrancois D GlickIndiaAnna Fali UNQUALIFIED
Jennifer R SaylorsUnited KingdomAsiya Javayant RENEWAL
Greenwood M KuskoCanadaAsiya Javayant NEW
Murillo L MaletGermanyIvan Magalhaes NEW
Leja D OldroydCanadaStephen Shaw NEGOTIATION
Adams U StockhamFranceAmy Elsner RENEWAL
Ashley F WhobreyUnited KingdomBernardo Dominic RENEWAL
Silvio W MaletCanadaIvan Magalhaes UNQUALIFIED
Izzy N CaudyArgentinaAsiya Javayant UNQUALIFIED
Murillo U OstroskyIndiaAnna Fali QUALIFIED
Darci P WaycottAustraliaElwin Sharvill RENEWAL
Morrow L WaycottAustraliaAmy Elsner NEW
Munro Z DilliardFranceElwin Sharvill QUALIFIED
Jefferson J OstroskyArgentinaIoni Bowcher NEGOTIATION
Clifford G WieserGermanyElwin Sharvill PROPOSAL
Aika C TollnerGermanyAnna Fali NEW
Aika G RulapaughFranceXuxue Feng NEW
Maisha B CaldareraIndiaAsiya Javayant QUALIFIED
Mayumi N ButtCanadaAnna Fali NEW
Morrow Z RimGermanyElwin Sharvill NEGOTIATION
Wickens N FerenczFranceElwin Sharvill QUALIFIED
Misaki Z WieserCanadaElwin Sharvill NEGOTIATION
Wickens E NickaArgentinaAnna Fali QUALIFIED
Adams I MarrierArgentinaAsiya Javayant NEGOTIATION
Adams L NickaGermanyStephen Shaw RENEWAL
Jefferson W VocelkaCanadaXuxue Feng PROPOSAL
Jefferson O CampainCanadaBernardo Dominic PROPOSAL
Leja F RimRussiaOnyama Limba NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Murillo Y GillianItalyIoni Bowcher RENEWAL
Leja H DilliardItalyAmy Elsner NEW
Ashley M VocelkaItalyIoni Bowcher NEW
Sinclair R IturbideFranceIvan Magalhaes NEGOTIATION
Maisha T CaldareraBrazilIoni Bowcher NEGOTIATION
Nicolas V CaudyAustraliaBernardo Dominic UNQUALIFIED
Salvatore R NickaUnited KingdomBernardo Dominic QUALIFIED
Ricardo U FerenczBrazilIoni Bowcher QUALIFIED
Morrow L KuskoArgentinaAmy Elsner QUALIFIED
Francesco L ChuiJapanAnna Fali QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Cody M CaudySpain2025-04-12Printing Dimensions RENEWAL48Ivan Magalhaes
1001Munro Z AlbaresBrazil2025-04-20Benton, John B Jr NEW88Asiya Javayant
1002Aruna H StensethArgentina2025-04-16Printing Dimensions UNQUALIFIED5Elwin Sharvill
1003Maria B RutaItaly2025-04-07Chapman, Ross E Esq NEGOTIATION80Xuxue Feng
1004Emily V KuskoBrazil2025-04-17Feiner Bros QUALIFIED51Xuxue Feng
1005Wickens J PoquetteIndia2025-04-01Buckley Miller Wright NEGOTIATION64Ivan Magalhaes
1006Deepesh M FigeroaFrance2025-04-30Rousseaux, Michael Esq PROPOSAL98Bernardo Dominic
1007Juan Y ShinkoItaly2025-04-16Truhlar And Truhlar Attys NEW61Asiya Javayant
1008Sinclair I DoeCanada2025-04-05Chemel, James L Cpa RENEWAL30Ivan Magalhaes
1009Jefferson M BowleyFrance2025-04-09Printing Dimensions PROPOSAL6Elwin Sharvill
1010Costa B SaylorsRussia2025-04-08Benton, John B Jr RENEWAL65Amy Elsner
1011Maisha T FlosiFrance2025-04-11Truhlar And Truhlar Attys PROPOSAL58Stephen Shaw
1012Ricardo Z BriddickUnited Kingdom2025-04-25Buckley Miller Wright RENEWAL31Elwin Sharvill
1013Jones L CampainItaly2025-04-25Rousseaux, Michael Esq NEW29Asiya Javayant
1014Chavez C OldroydGermany2025-04-12Morlong Associates PROPOSAL4Asiya Javayant
1015Ashley U MorascaRussia2025-04-26Chanay, Jeffrey A Esq NEGOTIATION98Onyama Limba
1016Jennifer X PoquetteUnited Kingdom2025-04-02Feiner Bros QUALIFIED49Elwin Sharvill
1017Sinclair G MaletGermany2025-04-28Printing Dimensions UNQUALIFIED78Xuxue Feng
1018Julie O MacleadAustralia2025-04-30Chemel, James L Cpa UNQUALIFIED18Amy Elsner
1019Alejandro N RoysterAustralia2025-04-19Truhlar And Truhlar Attys NEW53Onyama Limba
1020James A RimAustralia2025-04-19Chemel, James L Cpa QUALIFIED21Ivan Magalhaes
1021Maria L DilliardCanada2025-04-07Chapman, Ross E Esq QUALIFIED95Elwin Sharvill
1022Ashley N BologniaIndia2025-04-02Rangoni Of Florence UNQUALIFIED15Onyama Limba
1023Cody N MorascaAustralia2025-04-19Buckley Miller Wright RENEWAL36Onyama Limba
1024Jefferson F GillianBrazil2025-04-19Truhlar And Truhlar Attys RENEWAL58Bernardo Dominic
1025Silvio Z GlickArgentina2025-04-04Morlong Associates NEGOTIATION30Anna Fali
1026Maria X FlosiArgentina2025-04-29King, Christopher A Esq NEGOTIATION38Ivan Magalhaes
1027Ivar I InouyeAustralia2025-04-14King, Christopher A Esq UNQUALIFIED51Elwin Sharvill
1028Darci Y StockhamFrance2025-04-24Truhlar And Truhlar Attys PROPOSAL70Asiya Javayant
1029Morrow C CaldareraSpain2025-04-25Benton, John B Jr NEGOTIATION79Ioni Bowcher
1030Juan G PerinAustralia2025-04-18Printing Dimensions QUALIFIED28Stephen Shaw
1031Maria S SaylorsItaly2025-04-28Commercial Press PROPOSAL8Amy Elsner
1032Aruna L SlusarskiArgentina2025-04-12Truhlar And Truhlar Attys QUALIFIED30Stephen Shaw
1033Mayumi P VocelkaRussia2025-04-06Rangoni Of Florence UNQUALIFIED62Bernardo Dominic
1034Julie X SaylorsGermany2025-04-22Truhlar And Truhlar Attys RENEWAL9Ioni Bowcher
1035Alejandro B NestleSpain2025-04-17Rousseaux, Michael Esq NEW20Elwin Sharvill
1036Murillo O CampainItaly2025-04-29Morlong Associates NEGOTIATION85Ioni Bowcher
1037Isabel O RoysterBrazil2025-04-15Rousseaux, Michael Esq PROPOSAL76Xuxue Feng
1038Clifford G WaycottArgentina2025-04-27Feiner Bros NEGOTIATION85Onyama Limba
1039Jones B BowleyGermany2025-04-17Rangoni Of Florence RENEWAL78Xuxue Feng
1040Adams W KolmetzSpain2025-04-07Benton, John B Jr PROPOSAL79Stephen Shaw
1041Ricardo K BriddickBrazil2025-04-25Buckley Miller Wright UNQUALIFIED40Stephen Shaw
1042Chavez K StensethFrance2025-04-27Truhlar And Truhlar Attys UNQUALIFIED26Xuxue Feng
1043Sinclair C ShinkoJapan2025-04-21King, Christopher A Esq NEGOTIATION82Amy Elsner
1044Kadeem A SchemmerGermany2025-04-10Feltz Printing Service UNQUALIFIED31Xuxue Feng
1045Stacey W SlusarskiSpain2025-04-23Chemel, James L Cpa RENEWAL32Ioni Bowcher
1046Isabel R MarrierJapan2025-04-13Feiner Bros PROPOSAL20Onyama Limba
1047Wickens F BologniaJapan2025-04-19Chanay, Jeffrey A Esq NEW87Asiya Javayant
1048Jones X DarakjyItaly2025-04-12Rangoni Of Florence QUALIFIED63Anna Fali
1049Jennifer N CampainFrance2025-04-07Printing Dimensions QUALIFIED2Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Ivar V StensethBrazilBernardo Dominic NEGOTIATION
James D WieserGermanyIvan Magalhaes QUALIFIED
Adams G NestleFranceIoni Bowcher RENEWAL
Aditya H RimItalyStephen Shaw RENEWAL
Arvin A MaletUnited KingdomOnyama Limba PROPOSAL
Tony L SaylorsRussiaAnna Fali NEGOTIATION
Maisha B AlbaresAustraliaBernardo Dominic NEGOTIATION
Emily V BologniaItalyIoni Bowcher NEGOTIATION
Kadeem W CaldareraBrazilElwin Sharvill RENEWAL
Arvin B StensethSpainBernardo Dominic PROPOSAL
Deepesh R TollnerIndiaBernardo Dominic NEGOTIATION
Munro W GillianUnited KingdomStephen Shaw RENEWAL
Rodrigues S MaletAustraliaStephen Shaw PROPOSAL
Munro W BriddickItalyIvan Magalhaes NEGOTIATION
Jefferson M NestleBrazilAnna Fali NEW
Darci W StensethUnited KingdomIvan Magalhaes QUALIFIED
Octavia Y WieserArgentinaOnyama Limba UNQUALIFIED
Kaitlin H TollnerFranceOnyama Limba UNQUALIFIED
Isabel D DarakjyItalyIvan Magalhaes NEW
Salvatore R FollerJapanIoni Bowcher PROPOSAL
Clifford B WieserArgentinaElwin Sharvill UNQUALIFIED
Sinclair O MorascaIndiaIvan Magalhaes UNQUALIFIED
Juan Z StensethFranceIvan Magalhaes QUALIFIED
Deepesh J ChuiItalyAnna Fali NEGOTIATION
Octavia O NestleUnited KingdomXuxue Feng NEGOTIATION
Adams H BriddickFranceAnna Fali PROPOSAL
Jefferson I TollnerItalyElwin Sharvill QUALIFIED
Murillo V InouyeRussiaElwin Sharvill UNQUALIFIED
Misaki V WaycottJapanBernardo Dominic QUALIFIED
Francesco Y WhobreyArgentinaAsiya Javayant PROPOSAL
Ashley O FigeroaArgentinaIvan Magalhaes UNQUALIFIED
Nicolas O NestleArgentinaAnna Fali NEW
Alejandro D FollerBrazilBernardo Dominic RENEWAL
Jennifer E WieserItalyAsiya Javayant NEW
Deepesh J FlosiRussiaAnna Fali UNQUALIFIED
Emily B MaletUnited KingdomAnna Fali PROPOSAL
Antonio Z DoeSpainAnna Fali QUALIFIED
Aditya R PerinGermanyOnyama Limba UNQUALIFIED
Johnson B ShinkoFranceElwin Sharvill NEW
Kadeem S DarakjyUnited KingdomAnna Fali QUALIFIED
Octavia Z DarakjyIndiaStephen Shaw NEGOTIATION
Claire C OldroydBrazilAnna Fali NEGOTIATION
Deepesh L PaprockiRussiaStephen Shaw NEGOTIATION
Jones W RutaJapanXuxue Feng NEGOTIATION
Deepesh I FerenczSpainXuxue Feng RENEWAL
Maisha T DarakjyAustraliaElwin Sharvill NEGOTIATION
Misaki P MacleadSpainElwin Sharvill NEGOTIATION
Ricardo Y CaudyJapanStephen Shaw PROPOSAL
Maisha H ButtItalyAnna Fali NEGOTIATION
Ivar V GillianJapanXuxue Feng QUALIFIED
Frozen Columns
Name
Ivar V Chui
Jones M Ferencz
Misaki K Waycott
Stacey L Inouye
Mujtaba E Slusarski
Darci Z Bowley
Murillo R Caudy
Adams R Amigon
Aruna D Chui
Mujtaba D Caldarera
Adams G Poquette
Juan Y Whobrey
Stacey Z Gaucho
Morrow P Sergi
Stacey R Ruta
Smith I Wieser
Darci H Poquette
Greenwood B Slusarski
Claire S Doe
Mujtaba J Stenseth
Costa P Campain
Sinclair T Malet
James T Bowley
Aditya G Briddick
Claire T Perin
Ivar Q Poquette
Clifford K Kusko
Chavez E Campain
Emily N Morasca
Chavez V Flosi
Kaitlin L Rulapaugh
Salvatore W Foller
Kaitlin Z Ostrosky
Mujtaba J Bowley
Claire E Nestle
Jeanfrancois A Oldroyd
Aika R Maclead
Maisha T Perin
Claire F Rulapaugh
Leon U Inouye
Izzy F Flosi
Maisha W Tollner
Izzy G Morasca
Juan F Stockham
Jefferson J Glick
Izzy H Morasca
Greenwood X Doe
Tony H Ferencz
Alejandro O Slusarski
Nicolas Q Amigon
IdCountryDate
1000France2025-04-18
1001Canada2025-04-21
1002Brazil2025-04-18
1003Italy2025-04-02
1004Russia2025-04-27
1005India2025-04-10
1006Brazil2025-04-17
1007Russia2025-04-13
1008Argentina2025-04-06
1009Russia2025-04-05
1010Canada2025-04-16
1011Australia2025-04-26
1012United Kingdom2025-04-25
1013Brazil2025-04-08
1014India2025-04-18
1015Australia2025-04-07
1016India2025-04-21
1017Canada2025-04-04
1018France2025-04-14
1019France2025-04-07
1020United Kingdom2025-04-26
1021Italy2025-04-16
1022Russia2025-04-21
1023France2025-04-12
1024Spain2025-04-01
1025Spain2025-04-24
1026Australia2025-04-03
1027United Kingdom2025-04-19
1028Germany2025-04-26
1029Argentina2025-04-10
1030Brazil2025-04-05
1031Spain2025-04-08
1032Brazil2025-04-15
1033Spain2025-04-25
1034Germany2025-04-09
1035Russia2025-04-19
1036Russia2025-04-21
1037France2025-04-23
1038United Kingdom2025-04-13
1039Australia2025-04-27
1040Brazil2025-04-08
1041United Kingdom2025-04-29
1042Canada2025-04-11
1043United Kingdom2025-04-24
1044Brazil2025-04-08
1045Russia2025-04-26
1046Australia2025-04-04
1047Spain2025-04-27
1048Japan2025-04-22
1049United Kingdom2025-04-02

On-Demand Data

NameIdCountryDate
Aika K Campain1000Italy2025-04-21
Morrow L Stenseth1001Germany2025-04-14
Salvatore R Bolognia1002Argentina2025-04-13
Antonio O Doe1003Australia2025-04-06
Tony C Kolmetz1004Italy2025-04-18
Juan D Oldroyd1005Italy2025-04-24
Smith Y Dilliard1006Germany2025-04-25
Misaki C Malet1007Italy2025-04-10
Izzy C Flosi1008Japan2025-04-27
Silvio L Darakjy1009Russia2025-04-08
Rodrigues Q Amigon1010Spain2025-04-11
Juan V Bowley1011Japan2025-04-28
Munro W Caldarera1012Spain2025-04-25
Sinclair J Ostrosky1013Italy2025-04-16
Francesco U Amigon1014Canada2025-04-10
Darci S Malet1015Germany2025-04-07
Aditya Y Oldroyd1016France2025-04-05
Deepesh X Albares1017Canada2025-04-18
Isabel L Marrier1018Japan2025-04-17
Sinclair E Figeroa1019Italy2025-04-04
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Costa T StensethIndiaElwin Sharvill PROPOSAL
David C SergiBrazilAnna Fali PROPOSAL
Jeanfrancois N WaycottSpainAnna Fali QUALIFIED
Jefferson T CaldareraIndiaBernardo Dominic PROPOSAL
Adams R MarrierFranceAnna Fali NEGOTIATION
Maria V IturbideGermanyXuxue Feng QUALIFIED
Nicolas O FollerArgentinaXuxue Feng RENEWAL
Cody N SaylorsGermanyOnyama Limba RENEWAL
Alejandro Z ButtJapanAmy Elsner RENEWAL
Emily A KolmetzRussiaXuxue Feng QUALIFIED
Antonio R FlosiFranceAnna Fali UNQUALIFIED
Kaitlin U WaycottFranceAnna Fali QUALIFIED
Jones G ChuiBrazilIvan Magalhaes RENEWAL
Maisha S SaylorsRussiaAnna Fali UNQUALIFIED
Munro S AmigonFranceAmy Elsner NEGOTIATION
Leja W CaudyJapanBernardo Dominic PROPOSAL
Octavia R MaletBrazilXuxue Feng NEW
Salvatore D InouyeFranceElwin Sharvill QUALIFIED
Tony O PerinArgentinaAsiya Javayant RENEWAL
Aika Q IturbideBrazilAnna Fali PROPOSAL
Rodrigues Q DoeGermanyStephen Shaw RENEWAL
Deepesh Y BologniaFranceStephen Shaw NEGOTIATION
Clifford Q PaprockiUnited KingdomAsiya Javayant NEW
Cody M AmigonItalyAsiya Javayant NEGOTIATION
Ricardo Z PerinItalyOnyama Limba NEW
Julie J ButtAustraliaAnna Fali QUALIFIED
Ricardo H PerinIndiaAnna Fali UNQUALIFIED
Greenwood M RoysterItalyOnyama Limba NEW
Sinclair M DarakjyCanadaAnna Fali RENEWAL
Octavia S NickaAustraliaOnyama Limba NEW
Alejandro I StockhamUnited KingdomIvan Magalhaes PROPOSAL
Arvin H SchemmerSpainIoni Bowcher NEW
Chavez D CaudyCanadaIvan Magalhaes NEW
Leja R SlusarskiCanadaAmy Elsner UNQUALIFIED
David A FlosiRussiaIvan Magalhaes NEW
Chavez W StockhamJapanAmy Elsner QUALIFIED
Salvatore H CaldareraIndiaXuxue Feng PROPOSAL
David Q GarufiFranceAmy Elsner RENEWAL
Maria N BowleyCanadaIoni Bowcher QUALIFIED
Jones O DilliardGermanyIvan Magalhaes NEGOTIATION

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