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
Aruna E DoeAustraliaIvan Magalhaes PROPOSAL
Deepesh T FerenczFranceBernardo Dominic UNQUALIFIED
Jeanfrancois E NestleBrazilIvan Magalhaes NEGOTIATION
Antonio V RoysterUnited KingdomAmy Elsner QUALIFIED
Rodrigues S StensethArgentinaElwin Sharvill NEW
Greenwood R RulapaughIndiaBernardo Dominic NEW
David D MarrierArgentinaStephen Shaw UNQUALIFIED
Aika U GillianItalyAnna Fali RENEWAL
Costa O DoeUnited KingdomIoni Bowcher QUALIFIED
Mayumi Y MaletJapanXuxue Feng UNQUALIFIED
Claire X OstroskySpainAmy Elsner QUALIFIED
Wickens D FollerUnited KingdomAsiya Javayant RENEWAL
Clifford R CampainJapanIoni Bowcher RENEWAL
Kadeem A RutaUnited KingdomBernardo Dominic RENEWAL
Francesco V InouyeRussiaStephen Shaw QUALIFIED
Francesco O KolmetzItalyStephen Shaw PROPOSAL
Jones U RulapaughBrazilIoni Bowcher RENEWAL
Salvatore E StensethRussiaXuxue Feng UNQUALIFIED
Adams B BologniaItalyIoni Bowcher NEGOTIATION
Maria A DarakjyJapanStephen Shaw NEGOTIATION
Deepesh H RimRussiaAsiya Javayant UNQUALIFIED
Morrow H DoeUnited KingdomXuxue Feng PROPOSAL
Adams S SaylorsUnited KingdomOnyama Limba NEW
Murillo U VocelkaBrazilIvan Magalhaes NEW
Kadeem W KuskoItalyIvan Magalhaes NEGOTIATION
Izzy U FlosiArgentinaBernardo Dominic QUALIFIED
Antonio V BowleySpainElwin Sharvill RENEWAL
Deepesh Y SergiRussiaStephen Shaw NEGOTIATION
Cody E NestleBrazilOnyama Limba RENEWAL
Antonio D RutaRussiaElwin Sharvill QUALIFIED
Munro A StensethGermanyAsiya Javayant QUALIFIED
Clifford Z WaycottAustraliaStephen Shaw QUALIFIED
Adams N FlosiCanadaAmy Elsner PROPOSAL
Jeanfrancois E MaletFranceXuxue Feng QUALIFIED
Aruna X SlusarskiArgentinaOnyama Limba QUALIFIED
Kaitlin D RoysterJapanStephen Shaw RENEWAL
Maisha Z InouyeBrazilBernardo Dominic UNQUALIFIED
Ricardo L AmigonFranceAsiya Javayant QUALIFIED
Leja R VenereGermanyIvan Magalhaes UNQUALIFIED
Tony X ButtRussiaStephen Shaw NEGOTIATION
Ashley W SchemmerFranceElwin Sharvill PROPOSAL
Claire O SlusarskiRussiaXuxue Feng QUALIFIED
Claire S PerinItalyAnna Fali UNQUALIFIED
Mayumi Z CampainSpainStephen Shaw RENEWAL
Juan O BriddickAustraliaAsiya Javayant PROPOSAL
Aruna N ShinkoFranceElwin Sharvill QUALIFIED
Maria N PaprockiSpainAnna Fali NEW
Arvin C MaletRussiaIoni Bowcher UNQUALIFIED
Alejandro W WieserJapanElwin Sharvill PROPOSAL
Stacey M ButtIndiaOnyama Limba PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Silvio B CaudyFranceStephen Shaw PROPOSAL
Emily J RulapaughAustraliaIvan Magalhaes PROPOSAL
Leja P GillianIndiaAnna Fali PROPOSAL
Smith R MaletGermanyIvan Magalhaes PROPOSAL
Maisha C ChuiGermanyStephen Shaw NEW
Munro A MorascaSpainOnyama Limba QUALIFIED
Wickens X KuskoUnited KingdomElwin Sharvill NEGOTIATION
Murillo A SergiGermanyOnyama Limba NEW
Munro V VocelkaGermanyAsiya Javayant QUALIFIED
Leja H FerenczAustraliaAnna Fali PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000James N FollerIndia2025-05-28Rangoni Of Florence NEGOTIATION32Ioni Bowcher
1001Aditya H MaletFrance2025-06-03King, Christopher A Esq UNQUALIFIED48Onyama Limba
1002Octavia J RoysterBrazil2025-05-23Feltz Printing Service PROPOSAL17Stephen Shaw
1003Costa V ShinkoFrance2025-05-12Feiner Bros QUALIFIED1Bernardo Dominic
1004Murillo F PerinUnited Kingdom2025-05-31Commercial Press RENEWAL49Stephen Shaw
1005Leon O CampainGermany2025-05-21Chapman, Ross E Esq NEGOTIATION57Anna Fali
1006Maisha N InouyeBrazil2025-06-05King, Christopher A Esq PROPOSAL2Onyama Limba
1007David G MacleadIndia2025-05-27Rousseaux, Michael Esq PROPOSAL86Onyama Limba
1008Alejandro C RoysterSpain2025-06-01King, Christopher A Esq PROPOSAL12Anna Fali
1009Faith W WieserJapan2025-05-19Chapman, Ross E Esq UNQUALIFIED6Onyama Limba
1010Izzy S GauchoFrance2025-06-02Benton, John B Jr NEGOTIATION88Bernardo Dominic
1011Misaki M ButtIndia2025-05-25Printing Dimensions NEW68Bernardo Dominic
1012Leon T NestleUnited Kingdom2025-05-12Truhlar And Truhlar Attys UNQUALIFIED80Amy Elsner
1013Emily U SergiUnited Kingdom2025-05-22Chapman, Ross E Esq RENEWAL93Elwin Sharvill
1014Octavia B WaycottItaly2025-05-11Feltz Printing Service NEGOTIATION65Onyama Limba
1015Kaitlin H RoysterGermany2025-06-01Feiner Bros QUALIFIED44Xuxue Feng
1016David E FerenczSpain2025-05-11Chapman, Ross E Esq UNQUALIFIED9Asiya Javayant
1017Aditya R DoeRussia2025-05-24Chapman, Ross E Esq UNQUALIFIED58Ivan Magalhaes
1018Julie V SchemmerRussia2025-05-15Buckley Miller Wright QUALIFIED70Ivan Magalhaes
1019Maria T ShinkoRussia2025-05-12Chemel, James L Cpa PROPOSAL8Stephen Shaw
1020David D RulapaughUnited Kingdom2025-05-10Rousseaux, Michael Esq NEW12Onyama Limba
1021Mayumi U SergiSpain2025-05-23Benton, John B Jr QUALIFIED91Elwin Sharvill
1022Munro L MacleadFrance2025-05-28Chapman, Ross E Esq UNQUALIFIED65Asiya Javayant
1023Ricardo L DilliardFrance2025-05-22Dorl, James J Esq UNQUALIFIED74Ivan Magalhaes
1024Kaitlin L OstroskyCanada2025-05-21Chapman, Ross E Esq PROPOSAL26Bernardo Dominic
1025Sinclair G WaycottCanada2025-06-03Morlong Associates NEGOTIATION3Ioni Bowcher
1026Claire N VenereArgentina2025-05-29Buckley Miller Wright QUALIFIED93Ivan Magalhaes
1027Morrow R WhobreyCanada2025-05-27Buckley Miller Wright RENEWAL11Asiya Javayant
1028Leja S RulapaughUnited Kingdom2025-05-31Chapman, Ross E Esq QUALIFIED3Anna Fali
1029Rodrigues D CampainArgentina2025-05-31Chanay, Jeffrey A Esq NEW55Amy Elsner
1030Greenwood E BologniaBrazil2025-05-24Chemel, James L Cpa NEW91Amy Elsner
1031Sinclair V InouyeGermany2025-05-19Rousseaux, Michael Esq UNQUALIFIED30Ivan Magalhaes
1032Julie Y KolmetzItaly2025-05-30Buckley Miller Wright PROPOSAL57Bernardo Dominic
1033Ricardo Y GarufiUnited Kingdom2025-05-17Dorl, James J Esq NEW32Bernardo Dominic
1034Maisha T DarakjyRussia2025-05-29Buckley Miller Wright QUALIFIED19Ioni Bowcher
1035Aditya L WaycottSpain2025-05-27Rousseaux, Michael Esq QUALIFIED32Ivan Magalhaes
1036Clifford Q RulapaughSpain2025-05-18Truhlar And Truhlar Attys PROPOSAL91Xuxue Feng
1037Ivar I DoeIndia2025-05-26Rangoni Of Florence NEGOTIATION54Ioni Bowcher
1038Cody W FigeroaJapan2025-06-04Chanay, Jeffrey A Esq QUALIFIED29Onyama Limba
1039Nicolas O KolmetzCanada2025-05-31Chanay, Jeffrey A Esq PROPOSAL47Stephen Shaw
1040Arvin M CaldareraItaly2025-06-08Benton, John B Jr QUALIFIED35Anna Fali
1041Darci H NickaFrance2025-05-20Morlong Associates NEGOTIATION65Bernardo Dominic
1042Aditya M ChuiGermany2025-05-14Feiner Bros NEGOTIATION28Bernardo Dominic
1043Sinclair X MarrierUnited Kingdom2025-05-27King, Christopher A Esq QUALIFIED35Asiya Javayant
1044Rodrigues H BowleyGermany2025-05-30Commercial Press UNQUALIFIED61Amy Elsner
1045Faith H StockhamRussia2025-05-30Commercial Press QUALIFIED37Elwin Sharvill
1046Claire P RulapaughItaly2025-05-20Printing Dimensions NEGOTIATION58Stephen Shaw
1047Claire Y RoysterSpain2025-06-05Feiner Bros RENEWAL47Bernardo Dominic
1048Juan B AmigonGermany2025-05-14Feiner Bros NEGOTIATION49Stephen Shaw
1049Smith A DoeRussia2025-05-24Truhlar And Truhlar Attys UNQUALIFIED46Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Murillo N AmigonCanadaElwin Sharvill NEW
Adams X WaycottJapanAnna Fali RENEWAL
Jennifer L TollnerIndiaStephen Shaw NEW
Misaki P SlusarskiRussiaAsiya Javayant QUALIFIED
Isabel N RimRussiaOnyama Limba QUALIFIED
Munro O WhobreyUnited KingdomIvan Magalhaes RENEWAL
Aika F VocelkaArgentinaAmy Elsner QUALIFIED
Julie R GlickItalyStephen Shaw RENEWAL
Leon G FlosiUnited KingdomOnyama Limba RENEWAL
Leja N KuskoRussiaElwin Sharvill NEGOTIATION
Aditya B FlosiGermanyIvan Magalhaes NEW
James E SaylorsSpainBernardo Dominic NEGOTIATION
Morrow F NickaBrazilOnyama Limba NEGOTIATION
Leon H AmigonItalyIoni Bowcher QUALIFIED
Darci U RimBrazilXuxue Feng NEGOTIATION
David C BriddickRussiaAsiya Javayant PROPOSAL
Ricardo Y InouyeFranceBernardo Dominic QUALIFIED
Leon Z FerenczAustraliaIoni Bowcher UNQUALIFIED
Johnson X PoquetteBrazilStephen Shaw RENEWAL
Leja D MaletRussiaBernardo Dominic PROPOSAL
Kaitlin V CampainIndiaAmy Elsner UNQUALIFIED
Aika R BowleyUnited KingdomBernardo Dominic RENEWAL
Mayumi P ButtJapanAsiya Javayant NEW
Aditya F OstroskyAustraliaAmy Elsner RENEWAL
Murillo G BriddickAustraliaBernardo Dominic UNQUALIFIED
Maria C GauchoArgentinaIoni Bowcher NEW
Morrow Q RulapaughFranceStephen Shaw NEGOTIATION
Aruna D DilliardFranceIoni Bowcher RENEWAL
Juan T FigeroaArgentinaBernardo Dominic NEW
Arvin S FerenczBrazilIvan Magalhaes RENEWAL
Costa I SchemmerFranceElwin Sharvill PROPOSAL
Morrow K FollerArgentinaElwin Sharvill NEW
Misaki M CaldareraItalyAsiya Javayant QUALIFIED
Kadeem X DarakjyUnited KingdomXuxue Feng RENEWAL
Izzy K PaprockiBrazilXuxue Feng QUALIFIED
Chavez B GarufiFranceStephen Shaw PROPOSAL
Rodrigues E DilliardJapanElwin Sharvill NEGOTIATION
Greenwood Q CaudyUnited KingdomStephen Shaw RENEWAL
James C GillianUnited KingdomAmy Elsner RENEWAL
Greenwood B BologniaSpainIoni Bowcher NEGOTIATION
Smith A BowleyAustraliaIoni Bowcher PROPOSAL
Deepesh Q FollerItalyXuxue Feng PROPOSAL
Emily Y WieserItalyElwin Sharvill NEGOTIATION
Francesco M FerenczFranceElwin Sharvill RENEWAL
Mujtaba W SergiUnited KingdomOnyama Limba NEGOTIATION
Aruna B FigeroaGermanyOnyama Limba NEGOTIATION
Jennifer O GarufiIndiaIvan Magalhaes UNQUALIFIED
Wickens L DarakjyRussiaAsiya Javayant RENEWAL
Murillo W GillianJapanAmy Elsner RENEWAL
Aruna C RoysterItalyBernardo Dominic NEW
Frozen Columns
Name
Antonio D Slusarski
Aika L Marrier
Aditya P Garufi
Wickens U Ostrosky
Wickens N Nestle
Munro O Gaucho
Aditya M Doe
Munro E Glick
James V Campain
Jennifer Z Caudy
Francesco T Glick
Tony D Chui
Greenwood U Nicka
Adams O Saylors
Ricardo E Slusarski
Jennifer G Gaucho
Greenwood U Garufi
Jefferson V Maclead
Rodrigues O Perin
Izzy W Bowley
Costa W Kusko
Sinclair D Kusko
Rodrigues A Morasca
Jeanfrancois M Ferencz
Costa B Stenseth
Wickens B Stockham
Francesco A Nicka
Antonio R Inouye
Misaki L Ostrosky
Stacey B Butt
Adams X Schemmer
Leja D Saylors
Clifford V Kusko
Johnson S Venere
Maisha A Kolmetz
Rodrigues U Amigon
Ivar D Schemmer
Ivar R Nestle
David F Gaucho
Deepesh U Garufi
Greenwood E Ruta
Jennifer A Maclead
Nicolas L Morasca
Tony G Bolognia
Maisha E Stockham
Jones C Rim
Maisha P Paprocki
Leja Z Nestle
Maisha Z Schemmer
Octavia O Dilliard
IdCountryDate
1000Germany2025-06-05
1001India2025-06-04
1002Brazil2025-05-27
1003Japan2025-05-26
1004India2025-05-11
1005Canada2025-05-22
1006Spain2025-06-06
1007India2025-05-21
1008India2025-06-06
1009Italy2025-05-18
1010Brazil2025-05-22
1011United Kingdom2025-05-17
1012France2025-05-26
1013United Kingdom2025-05-26
1014Germany2025-05-29
1015Spain2025-05-29
1016Spain2025-05-23
1017United Kingdom2025-05-12
1018Russia2025-05-30
1019Australia2025-05-13
1020Brazil2025-06-01
1021Argentina2025-05-25
1022Japan2025-05-24
1023Brazil2025-06-07
1024India2025-05-31
1025Australia2025-05-24
1026Spain2025-05-18
1027Canada2025-05-26
1028Spain2025-05-11
1029India2025-05-10
1030Italy2025-05-18
1031Japan2025-06-08
1032Brazil2025-05-21
1033Japan2025-05-31
1034India2025-05-10
1035Brazil2025-06-06
1036Germany2025-06-01
1037Argentina2025-05-27
1038Italy2025-05-15
1039Australia2025-05-27
1040Spain2025-05-22
1041Brazil2025-05-24
1042Russia2025-06-03
1043Brazil2025-05-27
1044Russia2025-06-08
1045India2025-06-05
1046Australia2025-05-10
1047Germany2025-05-29
1048Italy2025-05-13
1049Russia2025-05-13

On-Demand Data

NameIdCountryDate
Morrow D Nestle1000Argentina2025-05-12
Alejandro L Schemmer1001Argentina2025-05-30
Ashley U Marrier1002United Kingdom2025-05-21
Kadeem O Iturbide1003Italy2025-06-03
Antonio G Schemmer1004India2025-05-28
Greenwood K Ferencz1005Russia2025-05-27
Cody D Shinko1006Australia2025-06-04
Jefferson D Stockham1007Italy2025-05-26
Adams L Garufi1008Italy2025-05-19
Darci B Nicka1009Germany2025-05-21
Isabel K Venere1010Germany2025-05-25
Kadeem W Rulapaugh1011Japan2025-05-14
Leon S Nestle1012France2025-05-11
Leja T Campain1013Spain2025-05-16
Antonio O Ostrosky1014United Kingdom2025-05-23
Stacey T Tollner1015France2025-05-10
Alejandro E Shinko1016Germany2025-05-19
Maisha U Flosi1017France2025-05-17
Ivar N Paprocki1018India2025-05-26
Isabel O Shinko1019Canada2025-05-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Mujtaba Z IturbideFranceIoni Bowcher RENEWAL
Aika W PaprockiSpainIoni Bowcher NEW
Maisha D AlbaresFranceStephen Shaw UNQUALIFIED
Claire X MarrierRussiaOnyama Limba QUALIFIED
Antonio O WaycottCanadaOnyama Limba UNQUALIFIED
Mujtaba U RutaItalyStephen Shaw UNQUALIFIED
James N TollnerIndiaIvan Magalhaes NEGOTIATION
Johnson T WieserArgentinaOnyama Limba PROPOSAL
James P DoeBrazilXuxue Feng QUALIFIED
Leja M BowleyBrazilAnna Fali RENEWAL
Octavia N FigeroaIndiaXuxue Feng NEGOTIATION
Nicolas O VocelkaCanadaAsiya Javayant QUALIFIED
Tony V IturbideCanadaElwin Sharvill UNQUALIFIED
Cody Z AmigonIndiaAnna Fali PROPOSAL
Izzy N MaletJapanIvan Magalhaes UNQUALIFIED
Antonio H RoysterArgentinaIvan Magalhaes QUALIFIED
Mujtaba J MaletBrazilAsiya Javayant RENEWAL
Claire O SaylorsAustraliaXuxue Feng PROPOSAL
Ricardo V BriddickGermanyStephen Shaw NEGOTIATION
Salvatore X MacleadUnited KingdomIvan Magalhaes PROPOSAL
Isabel E MarrierIndiaOnyama Limba NEW
Aditya D GlickItalyStephen Shaw QUALIFIED
Costa T SaylorsUnited KingdomBernardo Dominic QUALIFIED
Mujtaba Z KuskoJapanXuxue Feng QUALIFIED
Mayumi X CampainArgentinaOnyama Limba UNQUALIFIED
Smith V MaletBrazilAmy Elsner NEW
Tony A NestleSpainIoni Bowcher NEGOTIATION
Antonio U FlosiCanadaAnna Fali PROPOSAL
Antonio Q FollerAustraliaStephen Shaw QUALIFIED
Alejandro J BologniaJapanAmy Elsner NEGOTIATION
Morrow O BriddickGermanyBernardo Dominic UNQUALIFIED
Johnson D NestleAustraliaElwin Sharvill PROPOSAL
Stacey Y NestleRussiaBernardo Dominic NEW
Wickens K StensethIndiaStephen Shaw NEGOTIATION
Antonio W RoysterAustraliaStephen Shaw RENEWAL
Kadeem D CaldareraSpainOnyama Limba QUALIFIED
Leja I WhobreyArgentinaOnyama Limba NEW
Leja V NestleArgentinaAnna Fali NEGOTIATION
Jefferson A PerinFranceAmy Elsner NEGOTIATION
Francesco V RoysterJapanXuxue Feng RENEWAL

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