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
Clifford G DarakjyBrazilXuxue Feng NEW
Misaki D KolmetzItalyXuxue Feng PROPOSAL
Alejandro S NestleBrazilAmy Elsner PROPOSAL
Leja O RutaRussiaIoni Bowcher NEGOTIATION
Juan A StensethItalyOnyama Limba RENEWAL
Murillo C IturbideItalyIoni Bowcher NEW
Emily P TollnerFranceAsiya Javayant NEGOTIATION
Ashley G RulapaughRussiaAmy Elsner NEW
Mujtaba B FigeroaBrazilAnna Fali UNQUALIFIED
Mayumi O StockhamItalyXuxue Feng NEW
David S CaldareraAustraliaBernardo Dominic NEW
Mayumi C KolmetzIndiaStephen Shaw NEW
Alejandro Q FerenczBrazilIoni Bowcher RENEWAL
Alejandro K BowleyBrazilOnyama Limba NEGOTIATION
Mujtaba K RimUnited KingdomIoni Bowcher QUALIFIED
Tony E SchemmerFranceAnna Fali PROPOSAL
Murillo X RimArgentinaAsiya Javayant NEW
Cody R DoeArgentinaXuxue Feng NEGOTIATION
Kadeem H StockhamArgentinaElwin Sharvill NEGOTIATION
Ashley J RutaBrazilOnyama Limba QUALIFIED
Morrow E DarakjyCanadaIvan Magalhaes NEGOTIATION
Jeanfrancois R CaldareraArgentinaOnyama Limba PROPOSAL
Chavez H GillianGermanyIoni Bowcher NEGOTIATION
Emily O TollnerBrazilBernardo Dominic NEW
Deepesh O DoeIndiaAmy Elsner NEGOTIATION
Izzy Y InouyeSpainXuxue Feng PROPOSAL
Emily D StensethCanadaElwin Sharvill NEGOTIATION
Octavia A GarufiArgentinaBernardo Dominic NEW
Rodrigues O BriddickAustraliaIvan Magalhaes NEGOTIATION
Smith Q StockhamUnited KingdomOnyama Limba NEGOTIATION
Claire Q SlusarskiBrazilIvan Magalhaes PROPOSAL
Antonio B NickaRussiaAnna Fali RENEWAL
Julie Q KuskoJapanAnna Fali UNQUALIFIED
David W MaletRussiaBernardo Dominic QUALIFIED
Munro Z PaprockiGermanyAnna Fali QUALIFIED
Munro S DoeFranceAnna Fali UNQUALIFIED
Ivar Q MorascaFranceAnna Fali UNQUALIFIED
Aika Q FerenczIndiaStephen Shaw RENEWAL
Jennifer P RulapaughAustraliaXuxue Feng UNQUALIFIED
Salvatore W BriddickArgentinaAmy Elsner UNQUALIFIED
Greenwood S GillianUnited KingdomXuxue Feng PROPOSAL
Faith F GillianJapanOnyama Limba NEGOTIATION
David J RimJapanAsiya Javayant NEW
Smith T RutaGermanyElwin Sharvill UNQUALIFIED
Sinclair A AlbaresCanadaAsiya Javayant NEGOTIATION
Julie J MaletItalyIvan Magalhaes NEW
Salvatore I ShinkoFranceIoni Bowcher PROPOSAL
Tony P MarrierSpainAmy Elsner RENEWAL
Mujtaba T KolmetzSpainAnna Fali NEGOTIATION
Sinclair D FigeroaBrazilAmy Elsner NEW
Horizontal
NameCountryRepresentativeStatus
Izzy L FerenczCanadaAnna Fali UNQUALIFIED
Salvatore Z InouyeAustraliaStephen Shaw RENEWAL
Aruna M BriddickAustraliaAmy Elsner PROPOSAL
Clifford Z GauchoCanadaElwin Sharvill QUALIFIED
Nicolas P AlbaresUnited KingdomAmy Elsner NEW
Maria Y MacleadUnited KingdomBernardo Dominic QUALIFIED
Isabel J BriddickRussiaXuxue Feng PROPOSAL
Francesco O RulapaughIndiaStephen Shaw NEGOTIATION
Claire X ShinkoFranceStephen Shaw RENEWAL
Jefferson F DilliardItalyBernardo Dominic NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Rodrigues M NestleJapan2025-04-27Benton, John B Jr UNQUALIFIED76Asiya Javayant
1001Silvio F NestleAustralia2025-04-01Morlong Associates RENEWAL0Asiya Javayant
1002Kadeem T NestleBrazil2025-04-27Truhlar And Truhlar Attys PROPOSAL95Amy Elsner
1003Jones L TollnerAustralia2025-04-19Printing Dimensions NEGOTIATION30Elwin Sharvill
1004Munro B GlickUnited Kingdom2025-04-13Feltz Printing Service UNQUALIFIED77Ivan Magalhaes
1005Jeanfrancois B NestleIndia2025-04-24Rousseaux, Michael Esq NEW48Ioni Bowcher
1006Chavez N CaldareraUnited Kingdom2025-04-09Feiner Bros RENEWAL50Asiya Javayant
1007Smith I BriddickUnited Kingdom2025-04-28Rousseaux, Michael Esq NEGOTIATION95Onyama Limba
1008Clifford U RutaSpain2025-04-03Chemel, James L Cpa QUALIFIED98Ioni Bowcher
1009Jeanfrancois X CaudyItaly2025-04-17Rangoni Of Florence RENEWAL28Amy Elsner
1010Maisha D PaprockiJapan2025-04-20Dorl, James J Esq NEW73Bernardo Dominic
1011Ricardo X WaycottSpain2025-04-06Chapman, Ross E Esq PROPOSAL34Anna Fali
1012Maisha U BowleyRussia2025-04-22Feiner Bros RENEWAL85Amy Elsner
1013Nicolas T DoeUnited Kingdom2025-04-06Dorl, James J Esq NEW50Stephen Shaw
1014Francesco V ButtSpain2025-04-01Commercial Press QUALIFIED75Onyama Limba
1015Julie H FerenczAustralia2025-04-15Benton, John B Jr NEW68Amy Elsner
1016Adams W SaylorsArgentina2025-04-24Commercial Press QUALIFIED7Ioni Bowcher
1017Silvio O StensethUnited Kingdom2025-04-29Commercial Press NEGOTIATION15Amy Elsner
1018Wickens P AlbaresFrance2025-04-15Benton, John B Jr UNQUALIFIED8Elwin Sharvill
1019Aika B NestleIndia2025-04-12King, Christopher A Esq QUALIFIED60Onyama Limba
1020Wickens K CampainIndia2025-04-22Commercial Press NEGOTIATION68Xuxue Feng
1021Ashley F WaycottGermany2025-04-24Truhlar And Truhlar Attys UNQUALIFIED28Ivan Magalhaes
1022Morrow E KolmetzJapan2025-04-13Feltz Printing Service PROPOSAL34Bernardo Dominic
1023Isabel L ShinkoJapan2025-04-24Feltz Printing Service RENEWAL44Elwin Sharvill
1024Maisha H OldroydArgentina2025-04-26Dorl, James J Esq QUALIFIED76Elwin Sharvill
1025Rodrigues R OldroydIndia2025-04-13Dorl, James J Esq PROPOSAL99Elwin Sharvill
1026Kadeem E CaudyUnited Kingdom2025-04-01Chemel, James L Cpa PROPOSAL5Anna Fali
1027Arvin F MaletFrance2025-04-04Buckley Miller Wright QUALIFIED84Ioni Bowcher
1028James R RoysterCanada2025-04-17Rousseaux, Michael Esq QUALIFIED75Ivan Magalhaes
1029Francesco Z MarrierGermany2025-04-20King, Christopher A Esq RENEWAL20Ioni Bowcher
1030Costa N MacleadIndia2025-04-13Printing Dimensions QUALIFIED6Xuxue Feng
1031Chavez T WhobreyJapan2025-04-18Buckley Miller Wright PROPOSAL90Onyama Limba
1032Emily T KuskoUnited Kingdom2025-04-18Chapman, Ross E Esq NEGOTIATION92Stephen Shaw
1033James D MarrierBrazil2025-04-13Commercial Press PROPOSAL46Amy Elsner
1034Ashley E SlusarskiSpain2025-04-28Truhlar And Truhlar Attys UNQUALIFIED6Stephen Shaw
1035Nicolas W RoysterBrazil2025-04-15Dorl, James J Esq PROPOSAL24Ivan Magalhaes
1036Silvio O GarufiArgentina2025-04-01Benton, John B Jr PROPOSAL29Ivan Magalhaes
1037Maisha B PaprockiCanada2025-04-20King, Christopher A Esq RENEWAL75Anna Fali
1038Ashley Y MorascaCanada2025-04-18Chemel, James L Cpa RENEWAL67Stephen Shaw
1039Smith I GillianItaly2025-04-19Chapman, Ross E Esq NEGOTIATION88Ioni Bowcher
1040Wickens S StockhamItaly2025-04-16Printing Dimensions RENEWAL62Ioni Bowcher
1041Leon U InouyeCanada2025-04-30Rousseaux, Michael Esq RENEWAL71Xuxue Feng
1042Adams T MaletUnited Kingdom2025-04-05Rangoni Of Florence NEGOTIATION53Anna Fali
1043Nicolas Z PaprockiIndia2025-04-27Feltz Printing Service NEGOTIATION29Onyama Limba
1044Silvio T MaletArgentina2025-04-08Rousseaux, Michael Esq RENEWAL32Amy Elsner
1045Claire C DarakjyFrance2025-04-30Feltz Printing Service PROPOSAL55Xuxue Feng
1046Jeanfrancois E PoquetteJapan2025-04-04Commercial Press UNQUALIFIED16Elwin Sharvill
1047Aruna V OldroydCanada2025-04-10Truhlar And Truhlar Attys RENEWAL29Anna Fali
1048Adams Q VenereFrance2025-04-02Chapman, Ross E Esq NEW99Elwin Sharvill
1049Emily D DarakjyFrance2025-04-25Chapman, Ross E Esq NEW16Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Claire Z WaycottArgentinaStephen Shaw PROPOSAL
Ashley O ButtUnited KingdomOnyama Limba RENEWAL
Sinclair V CaudyJapanIoni Bowcher NEGOTIATION
Adams M BologniaArgentinaXuxue Feng NEW
Salvatore E BologniaBrazilXuxue Feng UNQUALIFIED
Aika L PaprockiUnited KingdomXuxue Feng RENEWAL
Maisha M DilliardCanadaElwin Sharvill QUALIFIED
Morrow B FollerGermanyXuxue Feng QUALIFIED
Mujtaba M BriddickIndiaAnna Fali NEGOTIATION
Darci P CaudyGermanyIoni Bowcher RENEWAL
Aruna V MarrierBrazilAmy Elsner NEW
Cody K SaylorsRussiaOnyama Limba NEGOTIATION
Kaitlin Y ChuiSpainElwin Sharvill NEW
Aika O RoysterArgentinaXuxue Feng PROPOSAL
Silvio Q GlickItalyStephen Shaw UNQUALIFIED
David H BriddickRussiaAmy Elsner RENEWAL
Francesco R MacleadIndiaIoni Bowcher RENEWAL
Emily W PaprockiGermanyXuxue Feng PROPOSAL
Maria Z WaycottBrazilAnna Fali QUALIFIED
Tony O NestleFranceIvan Magalhaes PROPOSAL
David F RoysterAustraliaIoni Bowcher NEW
Smith R CaldareraArgentinaAmy Elsner QUALIFIED
Kaitlin V OldroydRussiaXuxue Feng NEW
Mayumi V MacleadJapanAmy Elsner UNQUALIFIED
Maria Q BologniaSpainIoni Bowcher QUALIFIED
Munro T RutaCanadaBernardo Dominic UNQUALIFIED
Silvio N WaycottGermanyXuxue Feng UNQUALIFIED
Jennifer P FigeroaAustraliaOnyama Limba RENEWAL
Smith D RoysterAustraliaOnyama Limba QUALIFIED
Silvio L PaprockiAustraliaIoni Bowcher NEW
Morrow B RulapaughArgentinaElwin Sharvill PROPOSAL
Nicolas B FigeroaItalyAnna Fali QUALIFIED
David W MaletUnited KingdomAsiya Javayant UNQUALIFIED
Claire S SaylorsGermanyStephen Shaw NEW
Stacey D IturbideItalyElwin Sharvill NEGOTIATION
Mujtaba P WhobreyGermanyElwin Sharvill UNQUALIFIED
Arvin A GauchoUnited KingdomIvan Magalhaes PROPOSAL
Johnson A FollerArgentinaIvan Magalhaes QUALIFIED
Aditya M ButtSpainIoni Bowcher PROPOSAL
Mujtaba J DilliardIndiaIoni Bowcher UNQUALIFIED
Salvatore U KuskoCanadaAsiya Javayant NEW
Ivar R MacleadUnited KingdomAnna Fali PROPOSAL
Aditya U StockhamSpainAsiya Javayant PROPOSAL
Jones P CaudyAustraliaElwin Sharvill NEGOTIATION
David E IturbideRussiaOnyama Limba PROPOSAL
Aruna M ChuiBrazilElwin Sharvill NEGOTIATION
Leon B SergiFranceElwin Sharvill NEGOTIATION
Antonio L StockhamArgentinaIvan Magalhaes PROPOSAL
Kadeem N FollerFranceIvan Magalhaes QUALIFIED
Jeanfrancois D ChuiGermanyIoni Bowcher QUALIFIED
Frozen Columns
Name
Wickens P Nestle
Stacey Q Foller
Clifford O Rim
James S Amigon
Cody W Wieser
Claire W Nicka
Ricardo K Schemmer
Claire T Rulapaugh
Alejandro E Kusko
Alejandro M Saylors
Maisha N Albares
Claire T Inouye
Cody W Chui
Isabel S Maclead
Smith I Rulapaugh
James Z Darakjy
Emily U Schemmer
Murillo K Kusko
Stacey N Sergi
Sinclair P Caudy
Ivar Y Perin
Misaki Z Morasca
Munro I Vocelka
Stacey A Royster
Ivar E Ruta
Chavez F Wieser
Misaki G Stockham
Sinclair G Stenseth
Ivar M Ostrosky
Munro I Morasca
Kaitlin M Inouye
Kadeem I Stockham
Greenwood Q Glick
Antonio M Stenseth
Wickens H Gaucho
Aruna U Darakjy
Sinclair W Butt
Costa Y Butt
Mujtaba N Dilliard
Chavez T Caudy
Maria R Waycott
Juan O Morasca
Wickens Z Ferencz
Nicolas I Inouye
Juan G Slusarski
Octavia Y Ostrosky
Tony K Stockham
Octavia W Vocelka
Tony Y Malet
Ricardo L Oldroyd
IdCountryDate
1000Germany2025-04-16
1001United Kingdom2025-04-15
1002Italy2025-04-18
1003Japan2025-04-29
1004Australia2025-04-20
1005Germany2025-04-10
1006United Kingdom2025-04-20
1007Japan2025-04-10
1008Canada2025-04-25
1009France2025-04-11
1010United Kingdom2025-04-13
1011Australia2025-04-27
1012Brazil2025-04-30
1013Germany2025-04-29
1014Spain2025-04-11
1015Canada2025-04-09
1016Russia2025-04-15
1017Australia2025-04-16
1018Spain2025-04-01
1019United Kingdom2025-04-03
1020Canada2025-04-09
1021Japan2025-04-18
1022Italy2025-04-09
1023Spain2025-04-02
1024Spain2025-04-05
1025Spain2025-04-04
1026Japan2025-04-29
1027Russia2025-04-28
1028Spain2025-04-16
1029Germany2025-04-30
1030Australia2025-04-23
1031Russia2025-04-28
1032Brazil2025-04-16
1033Canada2025-04-15
1034France2025-04-15
1035France2025-04-09
1036Australia2025-04-08
1037Japan2025-04-07
1038Canada2025-04-03
1039France2025-04-11
1040Japan2025-04-18
1041France2025-04-13
1042Germany2025-04-28
1043Spain2025-04-08
1044Spain2025-04-07
1045Australia2025-04-19
1046Brazil2025-04-23
1047Brazil2025-04-14
1048India2025-04-03
1049Russia2025-04-20

On-Demand Data

NameIdCountryDate
Ricardo A Iturbide1000Italy2025-04-26
Francesco G Doe1001Australia2025-04-15
Sinclair C Nicka1002Italy2025-04-10
Johnson W Oldroyd1003Italy2025-04-30
Kaitlin X Rim1004Italy2025-04-22
Costa V Marrier1005Japan2025-04-29
Rodrigues D Malet1006India2025-04-21
Alejandro V Paprocki1007Germany2025-04-29
Kaitlin M Maclead1008Canada2025-04-24
Stacey Z Darakjy1009France2025-04-17
Morrow R Malet1010Brazil2025-04-18
Francesco Q Kolmetz1011Italy2025-04-22
Julie U Inouye1012United Kingdom2025-04-29
Smith J Dilliard1013Germany2025-04-25
Faith X Rim1014Canada2025-04-03
Isabel G Marrier1015United Kingdom2025-04-04
Aruna F Butt1016France2025-04-20
Johnson J Nestle1017Italy2025-04-06
Ricardo S Kusko1018Australia2025-04-22
David Z Perin1019France2025-04-30
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aditya X BowleyIndiaAsiya Javayant NEGOTIATION
Mujtaba M GauchoCanadaAnna Fali PROPOSAL
Emily P AlbaresUnited KingdomBernardo Dominic NEW
Aruna B VenereJapanAsiya Javayant NEW
Morrow O GlickSpainBernardo Dominic RENEWAL
Morrow H RoysterIndiaOnyama Limba RENEWAL
Johnson C RutaGermanyStephen Shaw UNQUALIFIED
Sinclair Y CaldareraUnited KingdomStephen Shaw NEGOTIATION
Nicolas T BriddickArgentinaAmy Elsner RENEWAL
Cody U AlbaresFranceAsiya Javayant RENEWAL
Wickens H WaycottAustraliaIoni Bowcher NEW
Leon T CaldareraFranceAnna Fali PROPOSAL
Kaitlin F PoquetteIndiaAnna Fali RENEWAL
Alejandro Q AlbaresAustraliaIoni Bowcher QUALIFIED
Salvatore J DarakjyIndiaIoni Bowcher PROPOSAL
David U RutaFranceStephen Shaw NEGOTIATION
Mujtaba X CampainUnited KingdomOnyama Limba RENEWAL
Jeanfrancois Y ChuiSpainXuxue Feng PROPOSAL
Ivar R GillianArgentinaXuxue Feng UNQUALIFIED
Munro S FollerBrazilIoni Bowcher NEW
Nicolas A GauchoFranceIoni Bowcher NEW
Faith Y MaletSpainStephen Shaw NEW
Alejandro A NickaArgentinaXuxue Feng QUALIFIED
Morrow L OstroskyIndiaElwin Sharvill QUALIFIED
James D PaprockiCanadaIoni Bowcher NEGOTIATION
Clifford F DilliardRussiaAnna Fali NEW
David R IturbideArgentinaXuxue Feng RENEWAL
James H SchemmerCanadaXuxue Feng RENEWAL
Maisha N PaprockiAustraliaElwin Sharvill RENEWAL
Maria B CampainJapanXuxue Feng PROPOSAL
Ivar F CampainRussiaStephen Shaw PROPOSAL
Nicolas C GillianRussiaXuxue Feng NEW
Adams G MaletCanadaIoni Bowcher RENEWAL
Juan P RulapaughJapanStephen Shaw RENEWAL
Salvatore V FerenczFranceXuxue Feng PROPOSAL
Misaki K GillianCanadaIvan Magalhaes UNQUALIFIED
Aditya G NestleJapanOnyama Limba PROPOSAL
Costa J CaldareraSpainXuxue Feng RENEWAL
Leon S SergiItalyBernardo Dominic NEW
Faith I GauchoItalyElwin Sharvill QUALIFIED

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