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 V DoeSpainBernardo Dominic QUALIFIED
Alejandro S MorascaIndiaIoni Bowcher QUALIFIED
Jones C StensethAustraliaElwin Sharvill PROPOSAL
David Q NestleIndiaBernardo Dominic NEGOTIATION
Tony R AlbaresCanadaOnyama Limba RENEWAL
Clifford Y WaycottArgentinaAmy Elsner NEGOTIATION
Misaki P MorascaCanadaAsiya Javayant PROPOSAL
Chavez Q FlosiGermanyElwin Sharvill NEGOTIATION
Misaki C StockhamAustraliaStephen Shaw NEGOTIATION
Aditya O BologniaAustraliaBernardo Dominic PROPOSAL
Jennifer O NestleAustraliaBernardo Dominic RENEWAL
Wickens L GauchoSpainBernardo Dominic RENEWAL
Mujtaba Q MorascaBrazilElwin Sharvill NEW
Wickens V InouyeAustraliaStephen Shaw PROPOSAL
Jones R GlickUnited KingdomIoni Bowcher UNQUALIFIED
Maria W MaletJapanAsiya Javayant QUALIFIED
Jones A GillianUnited KingdomAsiya Javayant PROPOSAL
Wickens N RulapaughRussiaOnyama Limba UNQUALIFIED
Octavia Y GlickArgentinaAmy Elsner RENEWAL
Maisha D AmigonIndiaXuxue Feng QUALIFIED
Julie J PaprockiCanadaElwin Sharvill PROPOSAL
Clifford X FerenczUnited KingdomXuxue Feng RENEWAL
Arvin P PerinGermanyElwin Sharvill QUALIFIED
Adams Z MaletBrazilStephen Shaw PROPOSAL
Izzy U MaletBrazilIoni Bowcher NEW
Morrow F FollerUnited KingdomIvan Magalhaes RENEWAL
Munro X RutaSpainElwin Sharvill NEGOTIATION
Octavia V SergiCanadaXuxue Feng RENEWAL
Kadeem S GillianGermanyIoni Bowcher PROPOSAL
Octavia I MacleadSpainAsiya Javayant NEGOTIATION
Isabel W WieserIndiaStephen Shaw QUALIFIED
Kaitlin K CaldareraSpainAnna Fali PROPOSAL
Isabel N FlosiGermanyAnna Fali UNQUALIFIED
Mayumi Z RoysterFranceElwin Sharvill UNQUALIFIED
Aruna C WhobreyJapanBernardo Dominic RENEWAL
Salvatore S IturbideCanadaBernardo Dominic NEGOTIATION
Faith O IturbideFranceAmy Elsner NEW
Stacey N IturbideGermanyAnna Fali QUALIFIED
Mujtaba P DarakjyRussiaAsiya Javayant NEGOTIATION
David Y CaudySpainIvan Magalhaes QUALIFIED
Adams Y CampainItalyAsiya Javayant NEGOTIATION
Arvin N MaletItalyIvan Magalhaes PROPOSAL
Alejandro J KolmetzItalyIvan Magalhaes QUALIFIED
Rodrigues A WaycottAustraliaElwin Sharvill NEW
Greenwood E MarrierArgentinaStephen Shaw NEW
Arvin O PoquetteSpainElwin Sharvill RENEWAL
Jefferson L RoysterItalyAmy Elsner NEW
James S FigeroaAustraliaStephen Shaw QUALIFIED
Jeanfrancois U BologniaAustraliaAsiya Javayant UNQUALIFIED
Darci A BologniaUnited KingdomElwin Sharvill PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Rodrigues B RimRussiaAnna Fali NEGOTIATION
Smith T BriddickRussiaAnna Fali UNQUALIFIED
Maria W GauchoItalyBernardo Dominic NEW
Claire H ChuiFranceXuxue Feng NEW
Sinclair Y ChuiBrazilAmy Elsner QUALIFIED
Kaitlin R SergiAustraliaIvan Magalhaes UNQUALIFIED
Deepesh B RimGermanyAsiya Javayant NEGOTIATION
Murillo Y TollnerGermanyXuxue Feng PROPOSAL
Silvio G FlosiGermanyIoni Bowcher NEGOTIATION
Greenwood B GauchoSpainIoni Bowcher UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Morrow R NickaItaly2024-09-22Printing Dimensions RENEWAL37Anna Fali
1001Antonio C KolmetzUnited Kingdom2024-09-03Printing Dimensions PROPOSAL72Xuxue Feng
1002Emily F MorascaSpain2024-09-21Chanay, Jeffrey A Esq NEGOTIATION1Stephen Shaw
1003Greenwood S WieserCanada2024-09-11Dorl, James J Esq QUALIFIED39Onyama Limba
1004Kadeem X NestleSpain2024-09-02Truhlar And Truhlar Attys QUALIFIED64Xuxue Feng
1005Smith S MacleadAustralia2024-09-06Commercial Press NEW89Ioni Bowcher
1006Jefferson Y GarufiRussia2024-09-23Buckley Miller Wright UNQUALIFIED79Anna Fali
1007Munro N OldroydUnited Kingdom2024-09-07Chapman, Ross E Esq UNQUALIFIED64Amy Elsner
1008Jennifer M WhobreyBrazil2024-09-03Truhlar And Truhlar Attys UNQUALIFIED62Elwin Sharvill
1009Juan N TollnerCanada2024-09-01King, Christopher A Esq PROPOSAL76Amy Elsner
1010Octavia Q SchemmerSpain2024-09-15Rangoni Of Florence NEW88Elwin Sharvill
1011Rodrigues B OstroskyGermany2024-09-10Buckley Miller Wright RENEWAL82Anna Fali
1012Aika Y DilliardCanada2024-09-10Chanay, Jeffrey A Esq UNQUALIFIED63Asiya Javayant
1013Mayumi L MarrierUnited Kingdom2024-09-08Chapman, Ross E Esq PROPOSAL62Bernardo Dominic
1014Francesco X CaudyCanada2024-09-10Dorl, James J Esq PROPOSAL69Xuxue Feng
1015Julie N SergiFrance2024-08-30King, Christopher A Esq PROPOSAL6Amy Elsner
1016Antonio T DarakjyGermany2024-09-04Chemel, James L Cpa PROPOSAL56Xuxue Feng
1017Sinclair N GlickRussia2024-09-19Truhlar And Truhlar Attys QUALIFIED24Amy Elsner
1018Tony T MaletRussia2024-09-06Printing Dimensions PROPOSAL25Asiya Javayant
1019Clifford I ChuiGermany2024-09-03Printing Dimensions PROPOSAL59Elwin Sharvill
1020Salvatore S VocelkaFrance2024-09-05Buckley Miller Wright NEGOTIATION5Stephen Shaw
1021Isabel Y FollerItaly2024-08-31Chanay, Jeffrey A Esq NEW15Stephen Shaw
1022Nicolas R DoeFrance2024-09-08Feltz Printing Service UNQUALIFIED3Asiya Javayant
1023Ivar E RutaCanada2024-09-17Buckley Miller Wright PROPOSAL73Onyama Limba
1024Nicolas C VocelkaBrazil2024-08-27Commercial Press NEW4Asiya Javayant
1025Jefferson J CaudySpain2024-09-20Rousseaux, Michael Esq NEW70Amy Elsner
1026Costa J WhobreyUnited Kingdom2024-09-07Chemel, James L Cpa PROPOSAL33Onyama Limba
1027Salvatore V GauchoAustralia2024-09-07Commercial Press UNQUALIFIED6Elwin Sharvill
1028Jefferson V ShinkoIndia2024-09-13Printing Dimensions PROPOSAL84Onyama Limba
1029Isabel Z PerinCanada2024-09-12Printing Dimensions UNQUALIFIED69Elwin Sharvill
1030Faith S MacleadAustralia2024-08-25Benton, John B Jr QUALIFIED30Anna Fali
1031Aika H WieserJapan2024-08-31Rangoni Of Florence QUALIFIED78Onyama Limba
1032Costa W GarufiUnited Kingdom2024-09-10Rousseaux, Michael Esq NEW17Stephen Shaw
1033Silvio D PerinBrazil2024-09-14Rousseaux, Michael Esq QUALIFIED40Stephen Shaw
1034Juan Y MacleadSpain2024-09-13Chemel, James L Cpa QUALIFIED7Stephen Shaw
1035Ashley B BowleyJapan2024-08-28Benton, John B Jr RENEWAL47Asiya Javayant
1036Jennifer B SaylorsIndia2024-09-20Morlong Associates UNQUALIFIED31Asiya Javayant
1037Rodrigues N RimBrazil2024-09-12Dorl, James J Esq NEW86Anna Fali
1038Wickens G KuskoAustralia2024-09-11Chanay, Jeffrey A Esq PROPOSAL32Ivan Magalhaes
1039Misaki W OstroskySpain2024-09-16Commercial Press QUALIFIED76Anna Fali
1040Arvin U MarrierCanada2024-08-26Feiner Bros QUALIFIED87Amy Elsner
1041Leja E RulapaughAustralia2024-09-14Commercial Press NEGOTIATION66Ivan Magalhaes
1042Ivar H PaprockiAustralia2024-09-19King, Christopher A Esq NEGOTIATION4Stephen Shaw
1043Maisha W SergiItaly2024-08-29Feiner Bros NEW12Xuxue Feng
1044Costa Z CaudySpain2024-08-31Printing Dimensions NEGOTIATION60Ivan Magalhaes
1045Claire X MaletArgentina2024-09-23Dorl, James J Esq UNQUALIFIED18Bernardo Dominic
1046Stacey E ButtArgentina2024-08-28Rousseaux, Michael Esq PROPOSAL22Xuxue Feng
1047Murillo U ChuiSpain2024-09-21Feltz Printing Service QUALIFIED82Xuxue Feng
1048Aruna S KuskoFrance2024-08-25Truhlar And Truhlar Attys NEW2Asiya Javayant
1049Deepesh Y MaletItaly2024-09-12Buckley Miller Wright QUALIFIED87Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Stacey S DoeCanadaAnna Fali UNQUALIFIED
David D DilliardItalyElwin Sharvill PROPOSAL
Maria D ButtJapanAmy Elsner QUALIFIED
Octavia J MaletRussiaAmy Elsner QUALIFIED
Faith U BologniaArgentinaAsiya Javayant PROPOSAL
Mayumi D GillianArgentinaAsiya Javayant PROPOSAL
Smith X TollnerBrazilOnyama Limba PROPOSAL
Silvio Y MaletGermanyStephen Shaw NEW
Clifford V FlosiJapanBernardo Dominic NEW
Murillo Y SergiAustraliaIvan Magalhaes NEGOTIATION
Francesco E WieserAustraliaElwin Sharvill RENEWAL
Leon Y InouyeIndiaIvan Magalhaes UNQUALIFIED
Antonio O PerinSpainAmy Elsner RENEWAL
Greenwood O GillianGermanyIoni Bowcher QUALIFIED
Juan J SlusarskiUnited KingdomAmy Elsner PROPOSAL
Clifford G DoeBrazilIvan Magalhaes QUALIFIED
Arvin V BowleyBrazilStephen Shaw UNQUALIFIED
Jeanfrancois Y KuskoGermanyIvan Magalhaes PROPOSAL
Arvin Y MarrierSpainElwin Sharvill QUALIFIED
Silvio L PerinIndiaIoni Bowcher NEW
Mayumi M GlickGermanyElwin Sharvill NEW
Silvio Q StockhamUnited KingdomIoni Bowcher NEGOTIATION
Ivar D SchemmerJapanIvan Magalhaes RENEWAL
Misaki L IturbideRussiaElwin Sharvill QUALIFIED
Munro Q OldroydBrazilAmy Elsner UNQUALIFIED
Cody H GlickUnited KingdomAnna Fali UNQUALIFIED
Leon G BowleyCanadaBernardo Dominic NEGOTIATION
Adams R NickaGermanyAsiya Javayant NEW
Misaki O DoeRussiaStephen Shaw NEGOTIATION
Antonio R VocelkaCanadaOnyama Limba QUALIFIED
Julie V MaletArgentinaBernardo Dominic RENEWAL
Mayumi P RimAustraliaBernardo Dominic NEGOTIATION
Emily Y ShinkoFranceIoni Bowcher NEW
Murillo B StockhamIndiaIoni Bowcher NEGOTIATION
Aditya G VenereFranceOnyama Limba PROPOSAL
Alejandro P StockhamFranceElwin Sharvill RENEWAL
Salvatore X BologniaArgentinaIoni Bowcher NEW
Maisha U RoysterJapanAmy Elsner NEW
Darci I VenereRussiaAsiya Javayant UNQUALIFIED
Ricardo K SchemmerItalyBernardo Dominic UNQUALIFIED
David X AmigonUnited KingdomAsiya Javayant PROPOSAL
Isabel A RutaFranceIoni Bowcher PROPOSAL
Munro X FigeroaJapanStephen Shaw UNQUALIFIED
Leon X DoeFranceAsiya Javayant QUALIFIED
Darci K SergiFranceAnna Fali PROPOSAL
Antonio V MaletFranceXuxue Feng NEW
Mayumi X MorascaFranceIvan Magalhaes RENEWAL
Leja L RimFranceOnyama Limba QUALIFIED
Aditya R PoquetteRussiaElwin Sharvill QUALIFIED
Octavia F TollnerArgentinaIvan Magalhaes QUALIFIED
Frozen Columns
Name
Stacey Q Darakjy
Chavez W Wieser
Jennifer G Marrier
Isabel H Malet
Julie I Saylors
Silvio E Schemmer
Wickens T Perin
Jefferson G Shinko
Smith E Glick
Juan N Iturbide
Antonio P Caldarera
Aditya E Royster
James R Bolognia
Julie Q Wieser
Nicolas C Gaucho
Leja R Foller
Jones F Foller
Francesco N Malet
Silvio H Figeroa
Salvatore R Doe
Maria L Venere
Johnson S Briddick
Rodrigues A Vocelka
Murillo K Flosi
Mayumi S Ruta
Octavia U Schemmer
Julie D Rulapaugh
Antonio T Gillian
Faith X Wieser
Leon D Garufi
Murillo H Inouye
Isabel I Gaucho
Clifford F Royster
Alejandro C Malet
Faith Q Schemmer
Chavez C Bowley
Faith O Tollner
Ivar P Maclead
Aika E Stockham
Mujtaba E Waycott
Jeanfrancois U Waycott
Aditya Q Gaucho
Adams B Oldroyd
Jeanfrancois J Gillian
Jennifer K Caldarera
Ricardo I Inouye
Murillo S Oldroyd
Chavez Q Whobrey
Jefferson B Gillian
Arvin Q Oldroyd
IdCountryDate
1000Spain2024-09-02
1001Australia2024-09-07
1002India2024-09-11
1003Germany2024-09-06
1004Australia2024-09-07
1005Brazil2024-09-14
1006France2024-09-12
1007Brazil2024-09-14
1008Japan2024-09-17
1009Argentina2024-09-17
1010France2024-08-25
1011Argentina2024-08-25
1012Italy2024-09-12
1013United Kingdom2024-09-22
1014India2024-08-26
1015United Kingdom2024-09-02
1016France2024-09-15
1017Russia2024-08-30
1018Russia2024-09-12
1019United Kingdom2024-09-05
1020United Kingdom2024-09-07
1021Japan2024-09-21
1022Germany2024-09-03
1023Japan2024-09-04
1024Spain2024-09-12
1025Canada2024-09-16
1026Germany2024-09-01
1027Russia2024-09-19
1028Canada2024-08-29
1029Australia2024-09-08
1030Spain2024-08-31
1031Australia2024-09-13
1032India2024-09-09
1033Russia2024-09-12
1034United Kingdom2024-09-04
1035India2024-09-01
1036India2024-09-11
1037Japan2024-09-23
1038Brazil2024-09-01
1039Argentina2024-09-06
1040Argentina2024-08-31
1041Japan2024-09-11
1042Spain2024-09-02
1043Brazil2024-09-10
1044Spain2024-08-27
1045Argentina2024-08-26
1046Brazil2024-09-09
1047United Kingdom2024-09-01
1048India2024-09-19
1049Argentina2024-09-22

On-Demand Data

NameIdCountryDate
Kaitlin N Morasca1000Italy2024-09-02
Greenwood E Gillian1001Russia2024-09-06
Murillo N Caudy1002Japan2024-09-06
Kadeem V Chui1003Canada2024-08-27
Nicolas D Royster1004Australia2024-09-06
Costa J Dilliard1005Argentina2024-09-06
Julie Y Gaucho1006Italy2024-09-03
Kadeem B Chui1007Russia2024-09-14
Claire X Saylors1008France2024-09-02
Maisha R Gaucho1009Italy2024-09-07
Maria Y Saylors1010India2024-09-15
Greenwood N Oldroyd1011India2024-09-11
Jefferson C Nicka1012Canada2024-09-20
Clifford W Kusko1013Russia2024-09-20
Tony F Glick1014United Kingdom2024-09-03
Darci P Foller1015Argentina2024-09-07
Aditya M Morasca1016Russia2024-08-28
Arvin I Kolmetz1017Canada2024-09-12
Chavez U Doe1018Italy2024-09-03
Sinclair C Garufi1019France2024-09-11
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Stacey G RulapaughBrazilOnyama Limba QUALIFIED
Claire P PoquetteSpainAsiya Javayant NEGOTIATION
Nicolas N BriddickArgentinaAmy Elsner PROPOSAL
Clifford E CampainSpainAmy Elsner NEW
James B BriddickItalyIvan Magalhaes RENEWAL
Jefferson U IturbideArgentinaIvan Magalhaes PROPOSAL
Mayumi E FollerCanadaOnyama Limba QUALIFIED
Julie P NickaSpainAsiya Javayant UNQUALIFIED
Jennifer X SlusarskiBrazilAsiya Javayant PROPOSAL
Octavia Z MaletCanadaAmy Elsner QUALIFIED
Smith M DoeGermanyElwin Sharvill QUALIFIED
James Y GillianRussiaXuxue Feng PROPOSAL
Aika N ShinkoFranceXuxue Feng NEW
Kadeem V PerinRussiaStephen Shaw NEGOTIATION
Leon K BologniaItalyAmy Elsner QUALIFIED
Clifford B GlickRussiaIoni Bowcher RENEWAL
Claire J SlusarskiAustraliaIoni Bowcher RENEWAL
Octavia G IturbideAustraliaXuxue Feng NEGOTIATION
Mujtaba R FigeroaSpainOnyama Limba UNQUALIFIED
Greenwood E CampainCanadaXuxue Feng QUALIFIED
Mayumi I AmigonCanadaStephen Shaw RENEWAL
Morrow O RimSpainAnna Fali QUALIFIED
Arvin X CaldareraRussiaIvan Magalhaes RENEWAL
Jennifer Z ShinkoIndiaAsiya Javayant PROPOSAL
Claire H MarrierJapanAmy Elsner RENEWAL
Claire M BologniaIndiaXuxue Feng PROPOSAL
Ashley I PaprockiItalyElwin Sharvill RENEWAL
Tony C InouyeBrazilElwin Sharvill PROPOSAL
Kaitlin L SaylorsSpainXuxue Feng PROPOSAL
Mujtaba M CampainBrazilAsiya Javayant RENEWAL
Izzy A CampainArgentinaIvan Magalhaes NEGOTIATION
Costa F SergiArgentinaAsiya Javayant NEW
Aika F InouyeJapanIoni Bowcher UNQUALIFIED
Greenwood S DarakjyCanadaXuxue Feng QUALIFIED
Johnson K CampainGermanyAnna Fali NEW
Antonio O CampainCanadaIoni Bowcher NEGOTIATION
Costa O MorascaFranceXuxue Feng PROPOSAL
Emily X FerenczSpainStephen Shaw PROPOSAL
David E GlickItalyBernardo Dominic PROPOSAL
Murillo I CaudyRussiaOnyama Limba PROPOSAL

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