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
David I KuskoBrazilOnyama Limba PROPOSAL
Antonio F DarakjyFranceOnyama Limba PROPOSAL
Francesco R CaudyBrazilIoni Bowcher NEGOTIATION
Ricardo J SaylorsUnited KingdomBernardo Dominic PROPOSAL
Silvio B SlusarskiItalyBernardo Dominic UNQUALIFIED
Faith Q MacleadIndiaXuxue Feng RENEWAL
Aditya G GlickFranceXuxue Feng PROPOSAL
Salvatore G GlickRussiaIvan Magalhaes NEW
Faith K GarufiItalyIoni Bowcher QUALIFIED
Jeanfrancois T PoquetteArgentinaAmy Elsner PROPOSAL
Ivar J FigeroaSpainOnyama Limba NEW
Tony B SergiBrazilAnna Fali QUALIFIED
Ashley T SlusarskiFranceAsiya Javayant RENEWAL
Claire O GarufiRussiaXuxue Feng PROPOSAL
Aika I CaudyArgentinaAsiya Javayant NEGOTIATION
Murillo B MaletArgentinaIvan Magalhaes RENEWAL
Arvin H PaprockiArgentinaIvan Magalhaes UNQUALIFIED
Ricardo D RulapaughUnited KingdomIoni Bowcher RENEWAL
Claire T ShinkoItalyStephen Shaw NEGOTIATION
Juan W ButtSpainElwin Sharvill NEGOTIATION
Francesco J MacleadJapanAmy Elsner PROPOSAL
Ivar M DoeFranceAmy Elsner RENEWAL
Tony C MaletAustraliaXuxue Feng NEW
Darci O IturbideBrazilAmy Elsner NEGOTIATION
James C WhobreyBrazilAmy Elsner UNQUALIFIED
Sinclair C BologniaFranceAmy Elsner UNQUALIFIED
Francesco D MaletItalyAsiya Javayant UNQUALIFIED
Kadeem F SaylorsFranceIvan Magalhaes NEW
Izzy Y SergiUnited KingdomAnna Fali NEW
Emily V CampainJapanAnna Fali NEGOTIATION
Alejandro C PoquetteFranceStephen Shaw RENEWAL
Francesco T AlbaresArgentinaAnna Fali NEW
Leon W MaletBrazilBernardo Dominic RENEWAL
Costa O MorascaAustraliaAmy Elsner NEW
Claire N OldroydIndiaAsiya Javayant UNQUALIFIED
Tony Q KolmetzRussiaElwin Sharvill RENEWAL
Adams N CampainAustraliaOnyama Limba NEGOTIATION
Juan Z SchemmerItalyIvan Magalhaes UNQUALIFIED
Deepesh W NickaSpainIvan Magalhaes PROPOSAL
Octavia P ShinkoBrazilBernardo Dominic UNQUALIFIED
Kaitlin A PoquetteIndiaXuxue Feng QUALIFIED
Jeanfrancois A CaudyCanadaElwin Sharvill NEGOTIATION
Mujtaba W FlosiBrazilIoni Bowcher QUALIFIED
Ivar U FigeroaFranceElwin Sharvill QUALIFIED
Maisha E FigeroaAustraliaStephen Shaw QUALIFIED
Aditya L OldroydGermanyAsiya Javayant UNQUALIFIED
Aditya Z MorascaBrazilElwin Sharvill UNQUALIFIED
Chavez N BologniaUnited KingdomIoni Bowcher RENEWAL
Silvio K DoeCanadaOnyama Limba NEW
Arvin E IturbideGermanyAnna Fali RENEWAL
Horizontal
NameCountryRepresentativeStatus
Alejandro R FigeroaBrazilAnna Fali QUALIFIED
Misaki E VocelkaItalyOnyama Limba UNQUALIFIED
Juan R NickaItalyBernardo Dominic NEGOTIATION
Stacey F AlbaresGermanyIvan Magalhaes QUALIFIED
Munro O NestleCanadaOnyama Limba NEW
Mujtaba W RulapaughFranceIvan Magalhaes NEW
Costa E AlbaresSpainBernardo Dominic NEGOTIATION
Clifford J BologniaBrazilBernardo Dominic NEW
Stacey A StensethArgentinaBernardo Dominic RENEWAL
Alejandro B OstroskySpainIvan Magalhaes NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Tony F PerinAustralia2025-06-06Benton, John B Jr RENEWAL25Xuxue Feng
1001Aika D CaldareraAustralia2025-05-26Rangoni Of Florence NEW99Ivan Magalhaes
1002Morrow B IturbideGermany2025-06-11Morlong Associates NEW90Xuxue Feng
1003Munro U NestleItaly2025-05-20Benton, John B Jr PROPOSAL4Stephen Shaw
1004James C CampainItaly2025-05-25Rousseaux, Michael Esq QUALIFIED93Ioni Bowcher
1005Claire V IturbideFrance2025-05-21Printing Dimensions NEW36Onyama Limba
1006Ricardo D SchemmerGermany2025-05-21Feiner Bros QUALIFIED99Bernardo Dominic
1007Jones U SaylorsSpain2025-06-10Rangoni Of Florence PROPOSAL41Anna Fali
1008Leja X OldroydUnited Kingdom2025-06-12Printing Dimensions PROPOSAL23Elwin Sharvill
1009Arvin O FollerJapan2025-06-16Rousseaux, Michael Esq NEW44Asiya Javayant
1010Octavia X RulapaughItaly2025-05-26Benton, John B Jr NEGOTIATION93Ivan Magalhaes
1011Octavia Z BologniaGermany2025-05-31Truhlar And Truhlar Attys RENEWAL63Bernardo Dominic
1012Costa N VocelkaCanada2025-06-16Rangoni Of Florence QUALIFIED36Elwin Sharvill
1013Costa U FigeroaIndia2025-06-15Buckley Miller Wright RENEWAL74Onyama Limba
1014Ivar E AlbaresGermany2025-06-13Feiner Bros PROPOSAL12Bernardo Dominic
1015Jones G KuskoItaly2025-05-30Dorl, James J Esq NEW46Elwin Sharvill
1016David N BriddickJapan2025-05-31Feiner Bros NEGOTIATION96Xuxue Feng
1017Julie Z FigeroaUnited Kingdom2025-06-05Commercial Press UNQUALIFIED20Ioni Bowcher
1018Ashley K SaylorsJapan2025-06-03Benton, John B Jr PROPOSAL23Xuxue Feng
1019Costa Z VenereFrance2025-06-05Printing Dimensions NEW77Elwin Sharvill
1020Mujtaba I SergiCanada2025-05-20Buckley Miller Wright RENEWAL6Xuxue Feng
1021Murillo T DoeRussia2025-06-14Chapman, Ross E Esq RENEWAL51Stephen Shaw
1022Clifford O MaletFrance2025-05-25Chemel, James L Cpa UNQUALIFIED23Ivan Magalhaes
1023Deepesh S GauchoJapan2025-05-24Morlong Associates UNQUALIFIED90Amy Elsner
1024Rodrigues V NickaUnited Kingdom2025-06-16Truhlar And Truhlar Attys NEGOTIATION8Ivan Magalhaes
1025Aika G SergiJapan2025-06-16Buckley Miller Wright NEW96Amy Elsner
1026Mujtaba X FlosiBrazil2025-06-12Truhlar And Truhlar Attys PROPOSAL69Stephen Shaw
1027Ashley I GillianItaly2025-06-10Commercial Press NEGOTIATION5Bernardo Dominic
1028Francesco N SaylorsArgentina2025-06-11Commercial Press PROPOSAL45Amy Elsner
1029Faith L DoeFrance2025-06-01Benton, John B Jr NEW76Ivan Magalhaes
1030Julie O SchemmerRussia2025-06-07Chanay, Jeffrey A Esq UNQUALIFIED8Elwin Sharvill
1031Jennifer M SchemmerItaly2025-05-25Rangoni Of Florence QUALIFIED89Asiya Javayant
1032Octavia Y GauchoCanada2025-06-03Dorl, James J Esq RENEWAL86Amy Elsner
1033Silvio Z PaprockiCanada2025-06-04Rousseaux, Michael Esq RENEWAL30Ivan Magalhaes
1034Johnson O NestleSpain2025-06-06Chanay, Jeffrey A Esq NEGOTIATION41Amy Elsner
1035Ashley X PerinFrance2025-05-25Morlong Associates NEW46Ivan Magalhaes
1036Arvin Q MarrierJapan2025-05-19Rangoni Of Florence QUALIFIED85Ioni Bowcher
1037Kaitlin Q MaletUnited Kingdom2025-05-29Chapman, Ross E Esq NEW44Asiya Javayant
1038Maisha F RimAustralia2025-05-27Commercial Press QUALIFIED9Anna Fali
1039Silvio N ChuiRussia2025-06-10Rangoni Of Florence QUALIFIED56Amy Elsner
1040Jones X RimFrance2025-06-13Feiner Bros PROPOSAL41Elwin Sharvill
1041Jeanfrancois E VenereUnited Kingdom2025-05-26Feiner Bros NEW69Stephen Shaw
1042Morrow Q BriddickGermany2025-06-02Feiner Bros NEGOTIATION74Xuxue Feng
1043Smith L SchemmerGermany2025-05-26Commercial Press NEGOTIATION7Anna Fali
1044Mujtaba Q FollerItaly2025-05-25King, Christopher A Esq UNQUALIFIED47Ivan Magalhaes
1045Aditya A FerenczBrazil2025-06-09Rousseaux, Michael Esq PROPOSAL3Elwin Sharvill
1046Greenwood E GlickBrazil2025-06-15Chanay, Jeffrey A Esq PROPOSAL5Amy Elsner
1047Ivar K KolmetzItaly2025-05-20Feltz Printing Service QUALIFIED0Elwin Sharvill
1048Smith R WaycottItaly2025-06-01Chemel, James L Cpa QUALIFIED28Ioni Bowcher
1049Ashley J ChuiGermany2025-06-01Dorl, James J Esq RENEWAL92Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Claire Z VocelkaBrazilIvan Magalhaes UNQUALIFIED
Ricardo M DoeCanadaStephen Shaw PROPOSAL
Rodrigues V WieserSpainElwin Sharvill UNQUALIFIED
Sinclair F GlickUnited KingdomIoni Bowcher RENEWAL
Arvin L DilliardCanadaAsiya Javayant NEGOTIATION
Costa Q GarufiFranceAsiya Javayant QUALIFIED
Leja X FollerIndiaAnna Fali PROPOSAL
Costa M MacleadGermanyOnyama Limba NEGOTIATION
Maisha Q MaletCanadaElwin Sharvill NEW
Costa E BowleyUnited KingdomBernardo Dominic QUALIFIED
Murillo V PoquetteItalyIvan Magalhaes UNQUALIFIED
Clifford W MarrierGermanyAmy Elsner NEGOTIATION
Nicolas E WaycottSpainIoni Bowcher UNQUALIFIED
Isabel X RoysterItalyElwin Sharvill NEW
Adams F VenereBrazilAsiya Javayant NEW
Jefferson W MarrierIndiaAnna Fali RENEWAL
Jefferson P StensethFranceElwin Sharvill QUALIFIED
Ricardo Q FerenczBrazilStephen Shaw RENEWAL
Jennifer A CampainArgentinaAsiya Javayant QUALIFIED
Munro F WieserAustraliaOnyama Limba NEGOTIATION
Izzy S OstroskyGermanyAnna Fali NEW
Costa G InouyeRussiaAsiya Javayant QUALIFIED
Adams T StockhamFranceAmy Elsner RENEWAL
Aruna Z ShinkoGermanyAsiya Javayant NEGOTIATION
Tony F KuskoRussiaOnyama Limba NEW
Octavia F MacleadRussiaXuxue Feng RENEWAL
Claire D WieserSpainAnna Fali PROPOSAL
Nicolas I FollerItalyElwin Sharvill QUALIFIED
Isabel T ShinkoCanadaIoni Bowcher UNQUALIFIED
Rodrigues T RutaArgentinaBernardo Dominic UNQUALIFIED
Maisha I CampainGermanyBernardo Dominic PROPOSAL
Maisha E RutaItalyIoni Bowcher QUALIFIED
Munro J RimCanadaIvan Magalhaes NEGOTIATION
Jennifer Y WieserUnited KingdomElwin Sharvill PROPOSAL
Isabel C GlickRussiaBernardo Dominic RENEWAL
Aruna T ButtAustraliaAsiya Javayant UNQUALIFIED
Maisha G SaylorsIndiaStephen Shaw PROPOSAL
Wickens P RulapaughGermanyBernardo Dominic NEW
Aruna C MacleadItalyStephen Shaw NEGOTIATION
Sinclair R DilliardItalyAmy Elsner NEGOTIATION
Ivar H PoquetteJapanIoni Bowcher QUALIFIED
Johnson W OldroydIndiaAmy Elsner QUALIFIED
Darci A DilliardItalyAsiya Javayant QUALIFIED
Maisha Z MacleadGermanyBernardo Dominic PROPOSAL
Darci P MarrierGermanyIvan Magalhaes NEW
Salvatore G DoeCanadaOnyama Limba RENEWAL
Costa Z RimRussiaElwin Sharvill NEW
Clifford A SlusarskiGermanyAnna Fali RENEWAL
Smith B PoquetteUnited KingdomXuxue Feng UNQUALIFIED
Ashley A AmigonJapanElwin Sharvill RENEWAL
Frozen Columns
Name
Johnson T Bowley
Emily P Rulapaugh
Julie W Morasca
Silvio D Shinko
Antonio M Dilliard
Julie N Malet
Isabel Q Kolmetz
Jennifer K Iturbide
Smith P Rim
Jefferson E Rim
Deepesh F Nestle
Darci R Foller
Salvatore N Gaucho
Juan O Darakjy
Smith P Gillian
Arvin M Venere
Leja M Ruta
Leja C Caudy
James B Tollner
Antonio L Tollner
Mayumi X Glick
Wickens A Nestle
Isabel B Ruta
Costa M Rim
Munro U Sergi
Faith Q Vocelka
Ricardo G Bowley
Nicolas I Kusko
Aika N Glick
Rodrigues P Stenseth
Kadeem M Oldroyd
Morrow T Wieser
Octavia C Bowley
Ricardo Q Butt
Jefferson W Wieser
Kaitlin I Sergi
Murillo B Wieser
Cody C Flosi
Claire X Saylors
Silvio G Albares
Mayumi G Saylors
Murillo R Inouye
Morrow A Kusko
Ricardo Z Tollner
Alejandro R Amigon
Jeanfrancois B Albares
Emily Q Ferencz
Ricardo T Vocelka
Alejandro Z Tollner
Faith R Royster
IdCountryDate
1000India2025-05-22
1001United Kingdom2025-05-31
1002France2025-05-27
1003Russia2025-06-04
1004United Kingdom2025-05-18
1005Australia2025-05-18
1006Canada2025-05-19
1007Russia2025-05-20
1008Spain2025-05-19
1009Spain2025-05-28
1010Australia2025-06-09
1011Germany2025-06-16
1012Argentina2025-05-28
1013India2025-06-07
1014Canada2025-06-02
1015Spain2025-06-11
1016Spain2025-06-01
1017Spain2025-05-24
1018Japan2025-05-22
1019Canada2025-06-02
1020Japan2025-06-02
1021Germany2025-06-09
1022Japan2025-06-13
1023Australia2025-06-10
1024Russia2025-05-27
1025Australia2025-06-11
1026France2025-06-07
1027Australia2025-05-19
1028Spain2025-05-30
1029Spain2025-05-25
1030Canada2025-05-29
1031Japan2025-06-06
1032Canada2025-05-25
1033United Kingdom2025-05-29
1034Spain2025-06-01
1035Argentina2025-05-29
1036United Kingdom2025-05-26
1037Canada2025-06-16
1038Germany2025-06-10
1039Brazil2025-05-22
1040Canada2025-05-28
1041Canada2025-05-27
1042Canada2025-05-21
1043Spain2025-05-23
1044Argentina2025-06-09
1045Japan2025-06-08
1046Argentina2025-06-15
1047Germany2025-06-15
1048India2025-05-28
1049India2025-06-11

On-Demand Data

NameIdCountryDate
Leon G Kusko1000France2025-05-22
Misaki V Albares1001Australia2025-06-03
Jeanfrancois Z Nicka1002Germany2025-06-16
Emily E Darakjy1003Italy2025-05-19
Mayumi M Campain1004Canada2025-06-12
Mujtaba H Doe1005Australia2025-05-27
Deepesh H Darakjy1006Italy2025-06-16
Silvio M Kolmetz1007Japan2025-06-07
Cody D Briddick1008Spain2025-05-20
Salvatore Z Chui1009Brazil2025-06-08
Alejandro G Perin1010India2025-05-24
Mayumi K Ruta1011Russia2025-06-04
Salvatore Q Albares1012India2025-06-02
Ricardo Y Caldarera1013India2025-05-27
Aditya G Slusarski1014Argentina2025-06-13
David K Malet1015Germany2025-06-16
Aruna T Shinko1016Canada2025-05-23
Chavez S Stenseth1017Brazil2025-05-26
Kadeem V Malet1018Spain2025-06-10
Stacey G Wieser1019Australia2025-05-26
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Claire E DoeBrazilElwin Sharvill RENEWAL
Ricardo K MacleadJapanIoni Bowcher NEGOTIATION
Claire E NestleArgentinaXuxue Feng NEGOTIATION
Adams A CampainBrazilIoni Bowcher UNQUALIFIED
Aika P FerenczSpainIvan Magalhaes NEGOTIATION
Arvin M NickaBrazilXuxue Feng NEGOTIATION
Ivar U FerenczIndiaElwin Sharvill NEGOTIATION
Julie N MarrierAustraliaIoni Bowcher QUALIFIED
Aika V TollnerArgentinaAsiya Javayant QUALIFIED
Smith X GillianArgentinaAnna Fali QUALIFIED
Alejandro U RulapaughUnited KingdomAmy Elsner QUALIFIED
Juan R FollerFranceAsiya Javayant PROPOSAL
Stacey Z CampainUnited KingdomAnna Fali QUALIFIED
Adams D DarakjyArgentinaStephen Shaw PROPOSAL
Jones D FlosiItalyOnyama Limba QUALIFIED
Kadeem Y CampainBrazilStephen Shaw UNQUALIFIED
Mujtaba S PoquetteGermanyAsiya Javayant NEGOTIATION
Isabel D AmigonIndiaOnyama Limba RENEWAL
Stacey A FlosiBrazilAsiya Javayant PROPOSAL
Maisha V WhobreyUnited KingdomOnyama Limba UNQUALIFIED
Aruna H DilliardCanadaAnna Fali QUALIFIED
Silvio Y MarrierUnited KingdomAnna Fali NEW
Rodrigues L FerenczJapanAsiya Javayant NEGOTIATION
Smith L VenereCanadaXuxue Feng RENEWAL
Claire Q OldroydItalyXuxue Feng UNQUALIFIED
Aditya U MacleadCanadaBernardo Dominic NEW
Francesco D RutaJapanElwin Sharvill QUALIFIED
Jennifer I GlickUnited KingdomIvan Magalhaes NEW
Alejandro U MarrierCanadaAnna Fali UNQUALIFIED
Adams D MaletAustraliaAnna Fali NEGOTIATION
Deepesh K FollerSpainIvan Magalhaes NEGOTIATION
Maisha I OstroskyFranceIoni Bowcher UNQUALIFIED
Aika Z InouyeAustraliaAsiya Javayant RENEWAL
Faith F FerenczArgentinaXuxue Feng UNQUALIFIED
Stacey J FigeroaBrazilIoni Bowcher PROPOSAL
Nicolas A AlbaresGermanyAsiya Javayant PROPOSAL
Kadeem N WieserGermanyXuxue Feng NEW
Smith W SchemmerBrazilAmy Elsner NEW
Ivar H ButtBrazilXuxue Feng PROPOSAL
Sinclair R WhobreyGermanyOnyama Limba 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>