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
Kadeem Z TollnerIndiaAsiya Javayant PROPOSAL
Clifford R GarufiIndiaIoni Bowcher PROPOSAL
Alejandro S BriddickFranceAmy Elsner UNQUALIFIED
Johnson E AmigonAustraliaAnna Fali RENEWAL
Alejandro T GarufiBrazilAnna Fali NEW
Smith Z AlbaresUnited KingdomAnna Fali NEW
Costa A PerinArgentinaXuxue Feng QUALIFIED
James J WhobreyJapanElwin Sharvill PROPOSAL
Aika C PoquetteIndiaBernardo Dominic PROPOSAL
Antonio I SchemmerAustraliaElwin Sharvill NEW
Arvin D MarrierRussiaBernardo Dominic NEW
Isabel C CaudySpainElwin Sharvill PROPOSAL
Deepesh M IturbideArgentinaIvan Magalhaes PROPOSAL
Juan K NickaFranceOnyama Limba NEW
Claire U IturbideCanadaStephen Shaw RENEWAL
Antonio E WaycottJapanIvan Magalhaes RENEWAL
Kadeem Q DilliardItalyAsiya Javayant NEGOTIATION
Smith P PaprockiCanadaOnyama Limba RENEWAL
Juan K GauchoFranceOnyama Limba QUALIFIED
Mujtaba G IturbideBrazilIvan Magalhaes QUALIFIED
Aruna S BologniaAustraliaStephen Shaw RENEWAL
Jennifer G ShinkoAustraliaIoni Bowcher RENEWAL
Johnson H BriddickFranceAnna Fali QUALIFIED
Antonio H BriddickBrazilAnna Fali UNQUALIFIED
Ivar S BologniaFranceStephen Shaw PROPOSAL
Aruna E NestleIndiaBernardo Dominic PROPOSAL
Antonio C GillianArgentinaAnna Fali RENEWAL
Costa R GillianSpainIoni Bowcher UNQUALIFIED
Emily Z WhobreyAustraliaStephen Shaw PROPOSAL
Misaki C NestleSpainAmy Elsner NEGOTIATION
Darci O PerinArgentinaElwin Sharvill NEW
David S DarakjySpainElwin Sharvill QUALIFIED
Aika B VocelkaAustraliaStephen Shaw RENEWAL
Kaitlin I FollerAustraliaElwin Sharvill NEW
Juan K AlbaresRussiaStephen Shaw RENEWAL
Emily B ShinkoSpainXuxue Feng NEW
Mayumi U GauchoIndiaAsiya Javayant PROPOSAL
Isabel I CampainJapanAmy Elsner RENEWAL
Izzy N WhobreyBrazilIvan Magalhaes NEW
Adams T WieserGermanyBernardo Dominic RENEWAL
Greenwood Z FlosiGermanyBernardo Dominic UNQUALIFIED
Wickens A BologniaRussiaIvan Magalhaes PROPOSAL
Maisha B OldroydBrazilOnyama Limba PROPOSAL
Deepesh L FollerCanadaIvan Magalhaes PROPOSAL
Nicolas W RoysterGermanyIoni Bowcher NEW
Nicolas P DilliardGermanyIoni Bowcher UNQUALIFIED
Leon X SchemmerFranceAmy Elsner RENEWAL
Arvin O CaudyCanadaAnna Fali UNQUALIFIED
Silvio U GauchoGermanyElwin Sharvill NEGOTIATION
David V RutaSpainBernardo Dominic NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Darci P DoeJapanXuxue Feng NEGOTIATION
Jefferson H RoysterIndiaXuxue Feng UNQUALIFIED
Wickens G PoquetteBrazilStephen Shaw UNQUALIFIED
Leon Z PaprockiItalyXuxue Feng UNQUALIFIED
Chavez J BologniaArgentinaBernardo Dominic NEGOTIATION
Ricardo L BologniaJapanAmy Elsner QUALIFIED
Costa H FlosiFranceIoni Bowcher UNQUALIFIED
Jennifer L BologniaJapanIvan Magalhaes NEGOTIATION
Sinclair Z TollnerSpainElwin Sharvill RENEWAL
Murillo I MaletFranceBernardo Dominic UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Silvio K GauchoSpain2024-09-14King, Christopher A Esq RENEWAL71Elwin Sharvill
1001Rodrigues L GlickArgentina2024-09-12Buckley Miller Wright UNQUALIFIED81Ivan Magalhaes
1002Maria X MaletSpain2024-09-03Truhlar And Truhlar Attys RENEWAL79Amy Elsner
1003Johnson U TollnerSpain2024-09-18Rousseaux, Michael Esq PROPOSAL54Bernardo Dominic
1004Smith T ChuiBrazil2024-08-23Dorl, James J Esq QUALIFIED99Onyama Limba
1005Aditya H RimItaly2024-09-17Benton, John B Jr QUALIFIED4Amy Elsner
1006Aika P VenereFrance2024-09-16Printing Dimensions QUALIFIED16Stephen Shaw
1007Maria B GillianFrance2024-09-17Printing Dimensions QUALIFIED59Bernardo Dominic
1008Smith Q NestleSpain2024-08-22Commercial Press RENEWAL91Asiya Javayant
1009Kaitlin E BowleyJapan2024-09-06Dorl, James J Esq UNQUALIFIED6Asiya Javayant
1010Arvin D WaycottCanada2024-08-30Rousseaux, Michael Esq NEGOTIATION74Ivan Magalhaes
1011Adams T MaletRussia2024-09-06Truhlar And Truhlar Attys RENEWAL1Elwin Sharvill
1012Greenwood F NickaCanada2024-09-04Dorl, James J Esq RENEWAL37Ivan Magalhaes
1013Jefferson Z AlbaresIndia2024-09-10King, Christopher A Esq NEGOTIATION58Anna Fali
1014Arvin N MacleadSpain2024-09-06Chanay, Jeffrey A Esq QUALIFIED76Xuxue Feng
1015Murillo C IturbideUnited Kingdom2024-09-10Chemel, James L Cpa NEGOTIATION7Ivan Magalhaes
1016Faith F MacleadSpain2024-09-03Printing Dimensions PROPOSAL73Ivan Magalhaes
1017Mujtaba N OldroydBrazil2024-09-15Chanay, Jeffrey A Esq QUALIFIED74Asiya Javayant
1018James S DarakjyBrazil2024-09-07Feiner Bros RENEWAL3Xuxue Feng
1019Munro U OstroskyAustralia2024-09-16Benton, John B Jr NEW59Anna Fali
1020Faith P CampainCanada2024-08-22Feiner Bros NEW2Asiya Javayant
1021Nicolas J NestleCanada2024-08-31Feltz Printing Service QUALIFIED7Ivan Magalhaes
1022Isabel S WieserUnited Kingdom2024-09-18King, Christopher A Esq RENEWAL40Amy Elsner
1023Smith T WhobreyIndia2024-08-23Printing Dimensions PROPOSAL64Stephen Shaw
1024Clifford K SlusarskiBrazil2024-09-07Feltz Printing Service NEW26Anna Fali
1025Morrow B MacleadSpain2024-09-04Printing Dimensions QUALIFIED91Stephen Shaw
1026Greenwood C DarakjySpain2024-09-13Buckley Miller Wright NEW9Asiya Javayant
1027Rodrigues V KolmetzIndia2024-08-28King, Christopher A Esq NEGOTIATION85Anna Fali
1028Ashley I ShinkoJapan2024-09-17Rangoni Of Florence NEW55Amy Elsner
1029Greenwood Q NestleArgentina2024-08-25Rousseaux, Michael Esq PROPOSAL28Elwin Sharvill
1030Adams X MorascaBrazil2024-09-12Feiner Bros UNQUALIFIED84Amy Elsner
1031Chavez P NestleGermany2024-09-14Dorl, James J Esq NEW96Xuxue Feng
1032Misaki X CaudyItaly2024-09-06Feltz Printing Service NEGOTIATION97Ivan Magalhaes
1033Izzy H FerenczArgentina2024-08-25Truhlar And Truhlar Attys PROPOSAL68Stephen Shaw
1034David M CaudyCanada2024-09-01King, Christopher A Esq NEW56Asiya Javayant
1035Morrow Q DarakjyUnited Kingdom2024-08-29Dorl, James J Esq UNQUALIFIED47Xuxue Feng
1036Maria I BriddickFrance2024-08-21King, Christopher A Esq UNQUALIFIED65Bernardo Dominic
1037Aditya K ChuiUnited Kingdom2024-09-07Dorl, James J Esq UNQUALIFIED18Ioni Bowcher
1038Aruna D DoeUnited Kingdom2024-09-19Rangoni Of Florence NEGOTIATION98Amy Elsner
1039Jennifer U MorascaBrazil2024-09-04Feiner Bros NEGOTIATION93Asiya Javayant
1040Sinclair S AlbaresSpain2024-09-08Printing Dimensions NEGOTIATION53Ioni Bowcher
1041Francesco C RutaRussia2024-09-01Commercial Press QUALIFIED26Amy Elsner
1042Salvatore J SergiGermany2024-09-10Buckley Miller Wright PROPOSAL35Anna Fali
1043Jefferson Q SergiCanada2024-09-09King, Christopher A Esq UNQUALIFIED65Amy Elsner
1044Cody K WaycottCanada2024-08-29Chanay, Jeffrey A Esq PROPOSAL32Asiya Javayant
1045Faith U VocelkaGermany2024-08-31Buckley Miller Wright QUALIFIED55Xuxue Feng
1046Munro K StensethCanada2024-08-30Feiner Bros NEW85Anna Fali
1047Alejandro Z PaprockiIndia2024-08-31Commercial Press PROPOSAL88Anna Fali
1048Rodrigues O MaletJapan2024-09-03Dorl, James J Esq PROPOSAL37Asiya Javayant
1049Leon N ShinkoJapan2024-08-26Commercial Press QUALIFIED31Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Greenwood E CaudyIndiaIvan Magalhaes PROPOSAL
Johnson Y ButtArgentinaOnyama Limba PROPOSAL
Sinclair A DarakjyArgentinaAsiya Javayant NEW
Silvio L ButtGermanyAnna Fali QUALIFIED
Misaki J VenereGermanyAmy Elsner NEGOTIATION
Munro W DilliardIndiaBernardo Dominic RENEWAL
Octavia M GlickRussiaIoni Bowcher NEGOTIATION
Kadeem S SchemmerItalyAmy Elsner RENEWAL
Juan W MaletSpainOnyama Limba NEGOTIATION
Aruna Y MarrierUnited KingdomIoni Bowcher QUALIFIED
Kadeem H SlusarskiGermanyStephen Shaw NEW
Mayumi J CaldareraBrazilAnna Fali QUALIFIED
Adams J DoeBrazilElwin Sharvill PROPOSAL
Faith D ShinkoRussiaAsiya Javayant NEW
Claire G GillianJapanXuxue Feng NEGOTIATION
Aika B DilliardGermanyBernardo Dominic QUALIFIED
Ricardo S SlusarskiBrazilAmy Elsner UNQUALIFIED
Leon E KuskoRussiaBernardo Dominic PROPOSAL
Jennifer L PaprockiGermanyOnyama Limba NEGOTIATION
Morrow F OstroskyRussiaAnna Fali PROPOSAL
Darci S NestleArgentinaXuxue Feng PROPOSAL
Chavez A NestleArgentinaAsiya Javayant RENEWAL
David X RoysterGermanyXuxue Feng QUALIFIED
Francesco Z RutaIndiaAmy Elsner PROPOSAL
Aditya F NestleBrazilAnna Fali UNQUALIFIED
Silvio O MarrierGermanyXuxue Feng NEW
Leja U OldroydUnited KingdomBernardo Dominic RENEWAL
Rodrigues W ButtGermanyBernardo Dominic QUALIFIED
Faith Y RoysterGermanyOnyama Limba NEGOTIATION
Morrow I NestleAustraliaXuxue Feng PROPOSAL
Chavez B RutaIndiaAsiya Javayant QUALIFIED
Kaitlin X PaprockiJapanElwin Sharvill UNQUALIFIED
Aika R SaylorsGermanyXuxue Feng NEW
Octavia K RulapaughSpainAnna Fali NEW
Salvatore L FlosiGermanyAmy Elsner UNQUALIFIED
Murillo D BowleyJapanOnyama Limba UNQUALIFIED
Kaitlin M KolmetzCanadaIvan Magalhaes NEW
Antonio S DarakjyIndiaElwin Sharvill RENEWAL
Emily M ButtJapanOnyama Limba NEW
Chavez Z MacleadJapanIvan Magalhaes UNQUALIFIED
Claire A BowleyCanadaAsiya Javayant QUALIFIED
Kaitlin U OldroydSpainAmy Elsner UNQUALIFIED
Octavia J MarrierCanadaXuxue Feng PROPOSAL
Francesco U KolmetzAustraliaBernardo Dominic NEGOTIATION
Stacey I WaycottRussiaElwin Sharvill PROPOSAL
Jennifer J NestleUnited KingdomIoni Bowcher UNQUALIFIED
Mujtaba A CaldareraFranceBernardo Dominic QUALIFIED
Emily I WaycottItalyIvan Magalhaes NEGOTIATION
Morrow Y NestleBrazilStephen Shaw NEGOTIATION
Leon H SchemmerUnited KingdomStephen Shaw PROPOSAL
Frozen Columns
Name
Ivar Q Stockham
Julie F Poquette
Wickens T Ruta
Aditya Y Bowley
Sinclair O Nestle
Mayumi P Perin
Faith V Paprocki
Antonio H Figeroa
Ivar Q Rim
Mayumi G Wieser
Aruna O Doe
Emily J Maclead
Izzy Q Wieser
Costa G Garufi
Ricardo X Oldroyd
Misaki C Chui
Faith C Caudy
Ivar Z Iturbide
Morrow V Shinko
Silvio N Butt
Smith R Foller
Emily X Chui
Jefferson L Briddick
Jones N Rulapaugh
Juan O Inouye
Julie N Maclead
Wickens W Amigon
Alejandro E Paprocki
Kadeem W Poquette
Jeanfrancois P Bolognia
Morrow C Paprocki
Arvin J Ostrosky
Smith K Darakjy
Octavia E Chui
Claire G Ferencz
Julie E Flosi
Jeanfrancois O Briddick
Misaki A Stockham
Cody O Darakjy
Maria X Stockham
Jefferson G Ruta
Arvin P Flosi
Octavia H Vocelka
Juan F Amigon
Salvatore K Stockham
Maria W Saylors
Aditya Q Bolognia
Tony R Paprocki
Johnson G Marrier
Leja V Nestle
IdCountryDate
1000Argentina2024-09-17
1001France2024-09-08
1002Germany2024-08-24
1003Canada2024-09-04
1004France2024-09-19
1005Brazil2024-09-08
1006Spain2024-09-11
1007Argentina2024-08-22
1008Italy2024-08-29
1009Russia2024-09-11
1010Australia2024-09-04
1011India2024-09-06
1012Canada2024-08-24
1013Japan2024-09-13
1014Japan2024-09-11
1015Germany2024-09-02
1016Argentina2024-09-13
1017India2024-09-04
1018United Kingdom2024-09-01
1019Germany2024-08-22
1020Russia2024-09-09
1021India2024-08-30
1022France2024-09-16
1023Germany2024-08-31
1024France2024-08-23
1025United Kingdom2024-09-11
1026Brazil2024-09-02
1027France2024-09-03
1028Italy2024-09-09
1029United Kingdom2024-09-07
1030Russia2024-09-14
1031Russia2024-08-25
1032Russia2024-08-27
1033Germany2024-08-22
1034Russia2024-09-10
1035Italy2024-09-11
1036Germany2024-09-18
1037Argentina2024-09-16
1038France2024-09-14
1039Germany2024-09-15
1040Italy2024-09-03
1041Australia2024-09-07
1042France2024-08-29
1043Italy2024-08-31
1044Italy2024-08-24
1045Spain2024-09-13
1046United Kingdom2024-08-30
1047Italy2024-09-03
1048Germany2024-08-30
1049Canada2024-08-26

On-Demand Data

NameIdCountryDate
Johnson A Venere1000Australia2024-08-22
Darci Q Kolmetz1001Canada2024-08-27
Munro K Whobrey1002Canada2024-09-10
Salvatore H Venere1003Spain2024-09-11
Antonio Z Waycott1004Russia2024-08-25
Isabel D Briddick1005Australia2024-09-05
Cody U Saylors1006Canada2024-08-31
Aruna X Dilliard1007India2024-09-19
Wickens J Wieser1008Japan2024-08-23
Jeanfrancois N Chui1009Germany2024-09-11
Kadeem P Poquette1010Italy2024-09-11
Adams V Caudy1011Russia2024-08-24
Emily E Schemmer1012Italy2024-09-12
Mujtaba B Nicka1013Japan2024-08-26
Juan F Inouye1014United Kingdom2024-09-01
Darci T Glick1015Germany2024-09-19
Mayumi Q Poquette1016Argentina2024-09-08
Jeanfrancois B Chui1017Italy2024-09-19
Nicolas M Glick1018Spain2024-09-13
Stacey I Ruta1019Brazil2024-09-08
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Antonio E StockhamJapanOnyama Limba QUALIFIED
Cody F WaycottItalyXuxue Feng UNQUALIFIED
Mujtaba K SergiCanadaAmy Elsner UNQUALIFIED
Nicolas J PerinIndiaElwin Sharvill UNQUALIFIED
Mayumi E SchemmerFranceIoni Bowcher RENEWAL
Izzy K RoysterJapanOnyama Limba QUALIFIED
Cody P KuskoUnited KingdomAnna Fali NEGOTIATION
Munro C StensethJapanXuxue Feng UNQUALIFIED
Cody Y ChuiSpainIvan Magalhaes UNQUALIFIED
Mayumi L PaprockiGermanyAmy Elsner QUALIFIED
Arvin R WieserFranceBernardo Dominic QUALIFIED
Jeanfrancois C KolmetzCanadaXuxue Feng PROPOSAL
Mujtaba O AlbaresItalyIoni Bowcher PROPOSAL
Rodrigues X KolmetzCanadaIoni Bowcher NEGOTIATION
Alejandro Q VenereItalyAsiya Javayant NEGOTIATION
Kadeem S PaprockiCanadaXuxue Feng PROPOSAL
Sinclair L MacleadItalyAnna Fali QUALIFIED
Sinclair I MacleadIndiaElwin Sharvill UNQUALIFIED
Ivar V BologniaItalyXuxue Feng NEGOTIATION
James C MorascaGermanyIvan Magalhaes NEW
Arvin E PoquetteIndiaXuxue Feng RENEWAL
Leja Z BriddickArgentinaElwin Sharvill QUALIFIED
Juan V SaylorsCanadaAmy Elsner NEGOTIATION
Greenwood E MaletGermanyAnna Fali NEGOTIATION
Nicolas X FollerSpainOnyama Limba UNQUALIFIED
Jefferson G BowleyArgentinaIoni Bowcher UNQUALIFIED
Claire O IturbideIndiaIvan Magalhaes NEW
Francesco Y OstroskyRussiaElwin Sharvill NEGOTIATION
Francesco B GarufiCanadaAsiya Javayant PROPOSAL
Tony P SchemmerAustraliaElwin Sharvill NEW
Octavia I CampainIndiaStephen Shaw UNQUALIFIED
Izzy V FlosiJapanAnna Fali RENEWAL
Sinclair G ButtBrazilIoni Bowcher QUALIFIED
Adams V FlosiJapanAsiya Javayant PROPOSAL
Jennifer V RulapaughJapanStephen Shaw RENEWAL
Misaki K ButtItalyOnyama Limba RENEWAL
Deepesh H FlosiGermanyIoni Bowcher QUALIFIED
Emily V SlusarskiUnited KingdomElwin Sharvill NEW
Murillo F GlickSpainIoni Bowcher NEGOTIATION
Costa R SchemmerItalyOnyama Limba NEW

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