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
Alejandro Q NickaAustraliaXuxue Feng RENEWAL
Kaitlin A CaldareraUnited KingdomIvan Magalhaes NEGOTIATION
David C StockhamJapanIoni Bowcher NEGOTIATION
Claire J CaudyIndiaElwin Sharvill NEW
Morrow Q FollerArgentinaXuxue Feng QUALIFIED
Silvio E DoeItalyIoni Bowcher NEW
Morrow C DilliardSpainIoni Bowcher PROPOSAL
Sinclair N KolmetzGermanyAmy Elsner PROPOSAL
Arvin U WaycottJapanElwin Sharvill QUALIFIED
Faith N FlosiRussiaAsiya Javayant UNQUALIFIED
Wickens D IturbideFranceAnna Fali PROPOSAL
James Z ChuiUnited KingdomXuxue Feng RENEWAL
Chavez A RoysterFranceIoni Bowcher PROPOSAL
Jefferson A BowleyGermanyBernardo Dominic RENEWAL
Jennifer L RutaBrazilIoni Bowcher RENEWAL
Alejandro B CaudyUnited KingdomElwin Sharvill PROPOSAL
Claire O DilliardJapanIoni Bowcher QUALIFIED
David G MorascaFranceBernardo Dominic PROPOSAL
Jeanfrancois C GlickUnited KingdomBernardo Dominic UNQUALIFIED
Juan S StensethUnited KingdomBernardo Dominic NEGOTIATION
Sinclair P IturbideArgentinaStephen Shaw QUALIFIED
Leon R SergiAustraliaBernardo Dominic QUALIFIED
Antonio T IturbideGermanyBernardo Dominic UNQUALIFIED
Tony Z DoeUnited KingdomOnyama Limba UNQUALIFIED
Ashley K CampainSpainElwin Sharvill QUALIFIED
Jones A MaletJapanAmy Elsner PROPOSAL
Ricardo J VocelkaJapanXuxue Feng RENEWAL
Claire N BologniaArgentinaOnyama Limba UNQUALIFIED
Leon T RulapaughJapanAmy Elsner NEGOTIATION
Maria H CaudyUnited KingdomAsiya Javayant RENEWAL
Jeanfrancois H GillianJapanAmy Elsner QUALIFIED
Ivar Y TollnerItalyElwin Sharvill UNQUALIFIED
Mujtaba Z MarrierSpainAmy Elsner NEW
Ivar L FerenczBrazilAsiya Javayant UNQUALIFIED
Aditya G DoeBrazilStephen Shaw PROPOSAL
Arvin Q FlosiBrazilAmy Elsner NEGOTIATION
Silvio Y RutaArgentinaElwin Sharvill NEGOTIATION
Salvatore W MarrierBrazilAsiya Javayant PROPOSAL
Maria I BowleyFranceIvan Magalhaes NEGOTIATION
Ricardo N MorascaBrazilOnyama Limba NEGOTIATION
Nicolas M WaycottFranceStephen Shaw NEW
Ricardo N MaletIndiaElwin Sharvill QUALIFIED
Claire Z MaletFranceElwin Sharvill NEGOTIATION
Claire J MaletGermanyAmy Elsner NEW
Johnson R SchemmerJapanIvan Magalhaes NEW
Smith X TollnerUnited KingdomIoni Bowcher NEGOTIATION
Leon Q DoeJapanXuxue Feng NEW
Maria D PaprockiItalyBernardo Dominic NEGOTIATION
Aditya H SergiJapanAnna Fali NEGOTIATION
Cody O StockhamCanadaXuxue Feng QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Cody O VocelkaFranceElwin Sharvill NEW
David X OldroydIndiaStephen Shaw NEW
Kaitlin L StockhamIndiaIvan Magalhaes PROPOSAL
Murillo S FollerIndiaBernardo Dominic RENEWAL
Costa E PaprockiFranceXuxue Feng UNQUALIFIED
Jeanfrancois L WieserAustraliaStephen Shaw NEGOTIATION
Ricardo D ChuiCanadaElwin Sharvill RENEWAL
Nicolas B FlosiSpainStephen Shaw QUALIFIED
Clifford O FerenczRussiaAmy Elsner NEGOTIATION
James Q VenereCanadaXuxue Feng QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Wickens V MacleadCanada2024-08-30Truhlar And Truhlar Attys NEGOTIATION6Asiya Javayant
1001Kadeem I VocelkaIndia2024-09-06Commercial Press NEW62Ivan Magalhaes
1002Antonio G CampainUnited Kingdom2024-09-21Feiner Bros UNQUALIFIED41Bernardo Dominic
1003Tony A GarufiJapan2024-09-19Rousseaux, Michael Esq NEW20Anna Fali
1004David U ButtUnited Kingdom2024-09-15Chemel, James L Cpa PROPOSAL59Stephen Shaw
1005Jeanfrancois M MaletSpain2024-09-22Chemel, James L Cpa NEGOTIATION47Xuxue Feng
1006Misaki P FerenczCanada2024-09-09Rangoni Of Florence PROPOSAL92Amy Elsner
1007Murillo S DarakjyItaly2024-09-03Chemel, James L Cpa UNQUALIFIED0Ivan Magalhaes
1008Aruna U FerenczFrance2024-09-10Truhlar And Truhlar Attys RENEWAL61Asiya Javayant
1009Stacey G MorascaSpain2024-09-23Rousseaux, Michael Esq RENEWAL74Xuxue Feng
1010Deepesh U SlusarskiFrance2024-09-18Chanay, Jeffrey A Esq RENEWAL10Elwin Sharvill
1011Darci Q CaldareraAustralia2024-09-06Morlong Associates PROPOSAL2Stephen Shaw
1012Wickens P SlusarskiItaly2024-09-22Truhlar And Truhlar Attys RENEWAL80Elwin Sharvill
1013Darci T AlbaresBrazil2024-09-24Chapman, Ross E Esq NEGOTIATION88Asiya Javayant
1014Aruna B NickaSpain2024-09-08Morlong Associates QUALIFIED85Amy Elsner
1015Deepesh N CaldareraItaly2024-09-22Buckley Miller Wright NEGOTIATION45Elwin Sharvill
1016Arvin S StensethCanada2024-08-28Dorl, James J Esq NEW80Elwin Sharvill
1017Claire G AmigonRussia2024-09-13Rousseaux, Michael Esq RENEWAL6Ioni Bowcher
1018Murillo D VenereIndia2024-08-31Chapman, Ross E Esq RENEWAL24Anna Fali
1019Greenwood C OldroydCanada2024-08-31Rangoni Of Florence RENEWAL52Ioni Bowcher
1020Deepesh J FigeroaArgentina2024-09-15Rousseaux, Michael Esq UNQUALIFIED19Onyama Limba
1021Kadeem J StockhamGermany2024-09-16Chanay, Jeffrey A Esq RENEWAL71Amy Elsner
1022Johnson N CampainUnited Kingdom2024-09-19Rousseaux, Michael Esq NEGOTIATION26Bernardo Dominic
1023Izzy I SaylorsArgentina2024-09-09Feiner Bros NEGOTIATION94Onyama Limba
1024Ivar L GillianRussia2024-09-07Benton, John B Jr UNQUALIFIED75Asiya Javayant
1025Murillo W MorascaBrazil2024-08-29Feiner Bros QUALIFIED89Bernardo Dominic
1026Jennifer V SchemmerArgentina2024-09-03Feltz Printing Service NEW50Ioni Bowcher
1027Johnson T TollnerSpain2024-09-17Buckley Miller Wright NEW60Asiya Javayant
1028Misaki J DoeSpain2024-09-19Dorl, James J Esq PROPOSAL87Anna Fali
1029Adams P StockhamJapan2024-09-15King, Christopher A Esq NEGOTIATION17Stephen Shaw
1030James S MacleadItaly2024-09-07Chanay, Jeffrey A Esq NEGOTIATION0Anna Fali
1031Johnson M SlusarskiSpain2024-09-24Rangoni Of Florence UNQUALIFIED32Xuxue Feng
1032Silvio E NestleAustralia2024-09-24Rangoni Of Florence NEGOTIATION52Xuxue Feng
1033David T NickaFrance2024-09-09Chemel, James L Cpa PROPOSAL48Asiya Javayant
1034Sinclair D ChuiIndia2024-09-12Commercial Press RENEWAL46Elwin Sharvill
1035Emily L RutaSpain2024-09-08Printing Dimensions RENEWAL68Bernardo Dominic
1036Mujtaba Z RimArgentina2024-09-15Feiner Bros RENEWAL55Asiya Javayant
1037Morrow G InouyeCanada2024-09-01Rangoni Of Florence NEW7Ivan Magalhaes
1038Wickens K BologniaCanada2024-09-05Chemel, James L Cpa NEW90Xuxue Feng
1039Aruna M GillianUnited Kingdom2024-09-05Chapman, Ross E Esq QUALIFIED98Ivan Magalhaes
1040Tony B BriddickFrance2024-08-28King, Christopher A Esq NEW10Bernardo Dominic
1041Stacey W PaprockiSpain2024-09-25Morlong Associates QUALIFIED7Ivan Magalhaes
1042Faith G DilliardCanada2024-09-09Truhlar And Truhlar Attys PROPOSAL72Bernardo Dominic
1043Adams O GillianItaly2024-08-31Chanay, Jeffrey A Esq RENEWAL13Stephen Shaw
1044Aika V CaudySpain2024-08-30Rangoni Of Florence QUALIFIED50Ivan Magalhaes
1045Murillo C SchemmerBrazil2024-09-18Feiner Bros NEGOTIATION67Amy Elsner
1046James L AlbaresItaly2024-09-23Chapman, Ross E Esq PROPOSAL58Amy Elsner
1047Arvin O BowleyIndia2024-09-23Commercial Press QUALIFIED93Ivan Magalhaes
1048Munro L SergiUnited Kingdom2024-09-23Rousseaux, Michael Esq UNQUALIFIED85Anna Fali
1049Salvatore X RulapaughIndia2024-09-26Printing Dimensions UNQUALIFIED84Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Adams L SaylorsCanadaOnyama Limba UNQUALIFIED
Aditya O DilliardRussiaElwin Sharvill RENEWAL
Francesco K AlbaresCanadaAmy Elsner UNQUALIFIED
Claire B MaletGermanyStephen Shaw RENEWAL
Johnson M NickaJapanOnyama Limba UNQUALIFIED
Izzy Y SergiSpainStephen Shaw NEW
Jefferson A FerenczBrazilElwin Sharvill NEGOTIATION
Stacey M KuskoArgentinaIvan Magalhaes PROPOSAL
Chavez P RoysterSpainXuxue Feng NEW
Misaki W IturbideJapanXuxue Feng NEW
Faith J WhobreyItalyXuxue Feng QUALIFIED
Wickens N KuskoItalyAnna Fali NEW
Leon V PaprockiBrazilBernardo Dominic PROPOSAL
Julie R KolmetzAustraliaOnyama Limba PROPOSAL
David N WhobreyArgentinaIoni Bowcher UNQUALIFIED
Misaki S NestleUnited KingdomOnyama Limba RENEWAL
Morrow Y GlickCanadaElwin Sharvill NEGOTIATION
Sinclair Z ChuiItalyAsiya Javayant UNQUALIFIED
Ivar E RutaIndiaAmy Elsner PROPOSAL
Silvio X GillianBrazilOnyama Limba QUALIFIED
Costa O GarufiArgentinaStephen Shaw QUALIFIED
Sinclair E BologniaUnited KingdomXuxue Feng NEW
Aika R GlickRussiaXuxue Feng RENEWAL
Sinclair M ChuiAustraliaIoni Bowcher RENEWAL
Ashley S MorascaAustraliaElwin Sharvill UNQUALIFIED
Alejandro X IturbideItalyAnna Fali NEW
Antonio A SlusarskiBrazilOnyama Limba RENEWAL
Francesco Y NickaUnited KingdomIvan Magalhaes UNQUALIFIED
Nicolas Y CaldareraItalyStephen Shaw QUALIFIED
Adams W OstroskyJapanStephen Shaw NEGOTIATION
Aditya Y FerenczBrazilAmy Elsner UNQUALIFIED
Jones E SlusarskiFranceElwin Sharvill QUALIFIED
Octavia N GauchoUnited KingdomElwin Sharvill QUALIFIED
Maisha Y StensethItalyIoni Bowcher RENEWAL
Juan E CampainRussiaAsiya Javayant PROPOSAL
Maisha Y DilliardUnited KingdomBernardo Dominic UNQUALIFIED
Silvio Q FlosiBrazilIvan Magalhaes UNQUALIFIED
Kadeem R FollerCanadaAsiya Javayant UNQUALIFIED
Murillo Y DarakjyArgentinaAnna Fali NEGOTIATION
Leja X PoquetteItalyStephen Shaw UNQUALIFIED
Nicolas O VenereCanadaOnyama Limba RENEWAL
Costa R MorascaArgentinaOnyama Limba NEGOTIATION
Jefferson H FollerItalyAnna Fali QUALIFIED
Antonio W DarakjyGermanyXuxue Feng NEGOTIATION
Silvio W RimCanadaBernardo Dominic UNQUALIFIED
Isabel Q StockhamIndiaXuxue Feng NEW
Stacey Q DoeFranceXuxue Feng QUALIFIED
Ivar V DarakjyRussiaElwin Sharvill PROPOSAL
Alejandro N PerinBrazilIvan Magalhaes PROPOSAL
Emily U RoysterJapanOnyama Limba RENEWAL
Frozen Columns
Name
Ashley F Foller
Arvin D Poquette
Claire J Iturbide
Jennifer Q Glick
David Y Briddick
Cody C Marrier
Misaki D Rim
Ricardo D Malet
Aditya F Whobrey
Juan Y Kusko
Darci E Kusko
Wickens U Kolmetz
Deepesh D Garufi
Leja D Sergi
Faith E Stockham
Emily W Kusko
Greenwood I Ferencz
Deepesh I Figeroa
Ashley G Venere
David Y Rim
Claire K Briddick
Salvatore L Vocelka
Cody I Paprocki
Cody W Briddick
Jeanfrancois Q Foller
Greenwood R Butt
Darci Q Caldarera
Jeanfrancois C Paprocki
Emily N Flosi
Kaitlin U Campain
Salvatore S Caldarera
Ricardo A Bolognia
Antonio I Chui
Deepesh H Butt
Octavia G Butt
Adams J Tollner
Emily M Iturbide
Maria F Doe
Isabel I Paprocki
Adams B Albares
Wickens I Whobrey
Johnson Y Shinko
Octavia P Venere
Morrow B Stockham
Octavia J Vocelka
Costa H Shinko
Sinclair R Caudy
Octavia I Venere
Morrow T Campain
Kaitlin Y Gillian
IdCountryDate
1000United Kingdom2024-08-30
1001Germany2024-09-03
1002Argentina2024-09-07
1003France2024-09-05
1004Argentina2024-09-04
1005Russia2024-09-24
1006Spain2024-09-21
1007Germany2024-09-12
1008France2024-09-01
1009United Kingdom2024-09-22
1010Australia2024-09-24
1011Germany2024-09-12
1012Germany2024-08-29
1013Japan2024-09-09
1014Argentina2024-09-05
1015Germany2024-09-24
1016Russia2024-09-13
1017Germany2024-09-17
1018Germany2024-08-29
1019Brazil2024-09-07
1020Italy2024-09-14
1021Argentina2024-09-06
1022Australia2024-09-21
1023Russia2024-09-14
1024Canada2024-09-03
1025Brazil2024-09-23
1026Canada2024-09-16
1027Spain2024-09-26
1028Germany2024-08-28
1029India2024-09-23
1030Spain2024-08-30
1031Germany2024-09-21
1032Brazil2024-09-24
1033Russia2024-09-01
1034Canada2024-09-24
1035Japan2024-09-07
1036Australia2024-09-21
1037Germany2024-09-01
1038Canada2024-09-01
1039Spain2024-09-15
1040India2024-09-08
1041Brazil2024-09-17
1042Spain2024-09-15
1043United Kingdom2024-08-28
1044Spain2024-09-14
1045Canada2024-09-02
1046Spain2024-09-25
1047Canada2024-09-06
1048Spain2024-09-19
1049United Kingdom2024-09-09

On-Demand Data

NameIdCountryDate
Mujtaba D Darakjy1000Spain2024-08-30
Antonio V Stockham1001Russia2024-09-15
Mayumi Y Marrier1002India2024-09-03
Octavia J Darakjy1003Australia2024-09-17
Emily U Dilliard1004United Kingdom2024-09-11
Ashley Z Inouye1005Australia2024-09-05
Faith F Nestle1006France2024-09-21
David T Royster1007Italy2024-08-28
Mujtaba G Schemmer1008Japan2024-09-08
Ivar N Schemmer1009United Kingdom2024-08-28
Mujtaba H Foller1010United Kingdom2024-09-11
Leon G Ferencz1011Germany2024-09-09
Jeanfrancois I Dilliard1012France2024-08-29
Stacey W Malet1013Germany2024-09-02
Clifford I Sergi1014Spain2024-09-04
Jones I Saylors1015France2024-09-02
Maisha R Oldroyd1016Argentina2024-09-24
Murillo D Bolognia1017Italy2024-09-08
Clifford U Bolognia1018Argentina2024-09-23
Aditya J Vocelka1019Germany2024-09-16
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Adams W SlusarskiJapanAmy Elsner NEW
Kadeem H CaudyFranceAsiya Javayant NEW
Silvio A GlickIndiaStephen Shaw RENEWAL
Stacey A KolmetzSpainXuxue Feng PROPOSAL
Antonio O PerinRussiaXuxue Feng UNQUALIFIED
Darci F SchemmerSpainXuxue Feng NEGOTIATION
Mujtaba X WhobreyBrazilIoni Bowcher UNQUALIFIED
Darci M MaletAustraliaAnna Fali NEGOTIATION
Kaitlin T VocelkaBrazilXuxue Feng QUALIFIED
Kadeem L PaprockiArgentinaIvan Magalhaes QUALIFIED
Aruna D DoeBrazilXuxue Feng NEW
Mayumi M WaycottBrazilXuxue Feng UNQUALIFIED
Greenwood F BriddickSpainElwin Sharvill NEW
Costa N FollerBrazilAnna Fali QUALIFIED
Maria Y VenereBrazilOnyama Limba RENEWAL
Silvio J MorascaBrazilAmy Elsner PROPOSAL
Sinclair C StensethJapanIoni Bowcher NEW
Nicolas A GlickBrazilAnna Fali NEGOTIATION
Isabel X NestleBrazilBernardo Dominic PROPOSAL
Julie C WaycottFranceXuxue Feng UNQUALIFIED
Jennifer W WieserItalyIoni Bowcher UNQUALIFIED
Aruna T PaprockiRussiaStephen Shaw UNQUALIFIED
Murillo Z SlusarskiUnited KingdomXuxue Feng PROPOSAL
Izzy A CampainFranceIoni Bowcher PROPOSAL
Darci K FlosiAustraliaBernardo Dominic QUALIFIED
Jennifer J CaldareraRussiaOnyama Limba NEGOTIATION
Deepesh R CaldareraIndiaOnyama Limba PROPOSAL
Isabel G GlickGermanyAmy Elsner PROPOSAL
Aika L IturbideFranceAmy Elsner NEW
David F KuskoItalyOnyama Limba QUALIFIED
Arvin Y DilliardCanadaXuxue Feng UNQUALIFIED
Johnson X RutaGermanyXuxue Feng PROPOSAL
Sinclair K BriddickSpainAsiya Javayant QUALIFIED
Octavia A CampainItalyAsiya Javayant NEW
Aruna K DarakjyJapanOnyama Limba UNQUALIFIED
Morrow D TollnerArgentinaElwin Sharvill UNQUALIFIED
Francesco X ChuiCanadaOnyama Limba UNQUALIFIED
Ashley M IturbideUnited KingdomAsiya Javayant QUALIFIED
Aditya L DilliardIndiaAsiya Javayant QUALIFIED
Cody Z OldroydSpainAnna Fali 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>