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
Aditya Z KolmetzIndiaStephen Shaw NEGOTIATION
Claire A InouyeCanadaIvan Magalhaes PROPOSAL
Deepesh J RimSpainStephen Shaw QUALIFIED
Smith I BriddickArgentinaStephen Shaw NEW
Jefferson G RutaSpainAmy Elsner NEW
David B WhobreyBrazilElwin Sharvill UNQUALIFIED
Cody V NickaSpainIvan Magalhaes PROPOSAL
Aditya C MarrierBrazilIoni Bowcher RENEWAL
Smith B WieserGermanyOnyama Limba PROPOSAL
Maisha K InouyeIndiaElwin Sharvill NEGOTIATION
Jefferson G DilliardSpainBernardo Dominic PROPOSAL
Maisha V PaprockiAustraliaBernardo Dominic QUALIFIED
Cody Q StensethCanadaAnna Fali QUALIFIED
Clifford O FerenczRussiaIvan Magalhaes NEGOTIATION
David A StensethItalyXuxue Feng QUALIFIED
Maisha Y FlosiFranceIoni Bowcher RENEWAL
Greenwood Y VocelkaFranceStephen Shaw UNQUALIFIED
Nicolas Q DoeArgentinaStephen Shaw NEGOTIATION
Greenwood P NestleJapanBernardo Dominic RENEWAL
Jones N KolmetzFranceElwin Sharvill NEW
Munro W RoysterRussiaElwin Sharvill UNQUALIFIED
Maisha H WaycottUnited KingdomAnna Fali NEW
Aika K SchemmerGermanyAmy Elsner QUALIFIED
Aditya S MaletFranceOnyama Limba RENEWAL
Emily S SchemmerArgentinaAmy Elsner RENEWAL
Mayumi N RutaItalyElwin Sharvill NEW
Kadeem E DoeRussiaXuxue Feng QUALIFIED
Smith H GlickCanadaIoni Bowcher NEGOTIATION
Misaki E InouyeUnited KingdomXuxue Feng UNQUALIFIED
Deepesh H CampainAustraliaBernardo Dominic PROPOSAL
Morrow I RoysterSpainElwin Sharvill NEGOTIATION
Greenwood J ShinkoUnited KingdomIvan Magalhaes NEW
Jennifer T GauchoIndiaAsiya Javayant NEGOTIATION
Johnson X MorascaIndiaXuxue Feng NEGOTIATION
Deepesh H ButtRussiaAsiya Javayant NEW
Munro T ShinkoAustraliaXuxue Feng PROPOSAL
Arvin F CaldareraRussiaIoni Bowcher RENEWAL
Johnson Q BologniaUnited KingdomBernardo Dominic UNQUALIFIED
Stacey N InouyeGermanyBernardo Dominic PROPOSAL
David J PaprockiUnited KingdomAnna Fali NEW
Costa O RutaUnited KingdomOnyama Limba PROPOSAL
Adams S CaldareraJapanIoni Bowcher NEW
Alejandro H FigeroaGermanyAsiya Javayant NEGOTIATION
Faith Z GarufiArgentinaIoni Bowcher PROPOSAL
Deepesh D MaletRussiaIvan Magalhaes NEW
Ashley B MarrierIndiaIoni Bowcher RENEWAL
Faith Z VocelkaJapanAmy Elsner QUALIFIED
Isabel O WaycottItalyStephen Shaw RENEWAL
Wickens Q MarrierRussiaAsiya Javayant NEGOTIATION
Silvio M FerenczIndiaXuxue Feng QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Tony G OldroydAustraliaOnyama Limba RENEWAL
Julie N SchemmerJapanIvan Magalhaes UNQUALIFIED
Izzy T CampainSpainElwin Sharvill PROPOSAL
Darci A GauchoGermanyOnyama Limba RENEWAL
Kadeem V WaycottGermanyIvan Magalhaes UNQUALIFIED
Mayumi Q GarufiSpainStephen Shaw QUALIFIED
Leja G RulapaughAustraliaIoni Bowcher PROPOSAL
Adams S RimUnited KingdomXuxue Feng PROPOSAL
Johnson I GarufiRussiaIoni Bowcher UNQUALIFIED
Ivar C SergiCanadaAsiya Javayant QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Greenwood C ChuiArgentina2025-05-29Benton, John B Jr RENEWAL25Bernardo Dominic
1001Rodrigues D KuskoJapan2025-06-05Benton, John B Jr QUALIFIED48Asiya Javayant
1002David J ShinkoArgentina2025-06-12King, Christopher A Esq QUALIFIED44Stephen Shaw
1003Ashley E OldroydBrazil2025-05-16Benton, John B Jr RENEWAL10Elwin Sharvill
1004Munro C VenereRussia2025-05-30Rangoni Of Florence PROPOSAL74Stephen Shaw
1005Kadeem E MorascaUnited Kingdom2025-05-19Morlong Associates RENEWAL92Onyama Limba
1006Arvin U CaudyItaly2025-06-05Benton, John B Jr RENEWAL99Amy Elsner
1007Maisha M SchemmerAustralia2025-06-10Chemel, James L Cpa NEGOTIATION68Amy Elsner
1008Tony A CaldareraJapan2025-05-29Chapman, Ross E Esq UNQUALIFIED5Ivan Magalhaes
1009Darci U ButtItaly2025-05-24Dorl, James J Esq RENEWAL37Asiya Javayant
1010Nicolas N MaletUnited Kingdom2025-05-21Dorl, James J Esq PROPOSAL3Xuxue Feng
1011Kadeem A FollerJapan2025-05-25Chanay, Jeffrey A Esq UNQUALIFIED96Bernardo Dominic
1012Jefferson V FigeroaBrazil2025-05-28King, Christopher A Esq PROPOSAL91Bernardo Dominic
1013Silvio O ShinkoUnited Kingdom2025-05-16Printing Dimensions NEW60Onyama Limba
1014Emily U GauchoBrazil2025-05-25Printing Dimensions NEW88Onyama Limba
1015Clifford A FerenczArgentina2025-06-03Chapman, Ross E Esq PROPOSAL31Bernardo Dominic
1016Ivar S MorascaRussia2025-05-29Feltz Printing Service UNQUALIFIED64Asiya Javayant
1017Aditya A RulapaughIndia2025-06-01Chapman, Ross E Esq RENEWAL91Onyama Limba
1018Ashley R BowleyJapan2025-05-20Truhlar And Truhlar Attys QUALIFIED24Elwin Sharvill
1019Kaitlin G DarakjyArgentina2025-06-08Benton, John B Jr UNQUALIFIED78Elwin Sharvill
1020Juan A MorascaFrance2025-05-17King, Christopher A Esq RENEWAL94Ioni Bowcher
1021Jeanfrancois T DilliardJapan2025-06-04Feltz Printing Service NEGOTIATION40Bernardo Dominic
1022Greenwood H PaprockiBrazil2025-06-06Chemel, James L Cpa QUALIFIED28Asiya Javayant
1023Johnson I OldroydFrance2025-06-01King, Christopher A Esq NEW22Stephen Shaw
1024Emily T VenereFrance2025-06-06Chemel, James L Cpa RENEWAL20Onyama Limba
1025Aditya U GarufiRussia2025-05-27Rousseaux, Michael Esq UNQUALIFIED36Bernardo Dominic
1026Jefferson F BowleyIndia2025-05-23Buckley Miller Wright QUALIFIED54Anna Fali
1027Johnson O MaletSpain2025-06-04Chapman, Ross E Esq NEGOTIATION6Ivan Magalhaes
1028Faith W CampainSpain2025-06-02Commercial Press NEGOTIATION0Stephen Shaw
1029Silvio I ChuiRussia2025-05-17Benton, John B Jr QUALIFIED38Stephen Shaw
1030Leon N OstroskyCanada2025-05-24Feiner Bros QUALIFIED85Bernardo Dominic
1031Salvatore D PaprockiUnited Kingdom2025-05-20Benton, John B Jr UNQUALIFIED76Amy Elsner
1032Munro G SchemmerCanada2025-06-06Dorl, James J Esq QUALIFIED48Elwin Sharvill
1033Kadeem H AlbaresUnited Kingdom2025-06-03Buckley Miller Wright RENEWAL51Amy Elsner
1034Rodrigues S RoysterGermany2025-06-01Rousseaux, Michael Esq NEW84Bernardo Dominic
1035Cody V CampainSpain2025-05-26Dorl, James J Esq NEGOTIATION9Xuxue Feng
1036Cody T DarakjyGermany2025-05-22Rousseaux, Michael Esq PROPOSAL18Ivan Magalhaes
1037Octavia H DilliardJapan2025-06-05Rousseaux, Michael Esq NEW0Xuxue Feng
1038Aditya M ShinkoJapan2025-05-25Printing Dimensions NEGOTIATION73Stephen Shaw
1039Deepesh O ButtBrazil2025-05-30Chapman, Ross E Esq UNQUALIFIED45Bernardo Dominic
1040Jefferson M WieserItaly2025-05-27Benton, John B Jr NEGOTIATION54Stephen Shaw
1041Arvin O FollerArgentina2025-05-21Benton, John B Jr NEGOTIATION83Ioni Bowcher
1042Sinclair Y SergiJapan2025-06-01Buckley Miller Wright QUALIFIED5Onyama Limba
1043James Y FlosiArgentina2025-06-06Morlong Associates PROPOSAL32Anna Fali
1044Emily U WhobreySpain2025-05-30Benton, John B Jr NEGOTIATION37Elwin Sharvill
1045Aditya O CaldareraSpain2025-05-26Chanay, Jeffrey A Esq NEGOTIATION46Asiya Javayant
1046Misaki C GarufiItaly2025-05-23Benton, John B Jr NEW20Ioni Bowcher
1047Isabel N MorascaArgentina2025-05-30Morlong Associates QUALIFIED23Elwin Sharvill
1048James P ButtUnited Kingdom2025-06-13King, Christopher A Esq NEW69Ivan Magalhaes
1049Ashley V AmigonJapan2025-06-11Chapman, Ross E Esq UNQUALIFIED7Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Antonio M MorascaFranceOnyama Limba NEGOTIATION
Ricardo L WaycottGermanyIvan Magalhaes PROPOSAL
Silvio S MarrierBrazilAsiya Javayant QUALIFIED
Johnson H PaprockiGermanyElwin Sharvill QUALIFIED
Antonio H PoquetteBrazilAnna Fali NEGOTIATION
Tony B VenereArgentinaBernardo Dominic NEW
Murillo L NickaFranceBernardo Dominic NEGOTIATION
David Z GarufiGermanyElwin Sharvill NEGOTIATION
Julie L NestleFranceElwin Sharvill QUALIFIED
Wickens A BologniaArgentinaStephen Shaw UNQUALIFIED
Alejandro P CampainArgentinaIvan Magalhaes RENEWAL
Julie W DoeIndiaBernardo Dominic UNQUALIFIED
Julie G SergiItalyOnyama Limba QUALIFIED
Claire B RimItalyAsiya Javayant NEGOTIATION
Nicolas A FerenczIndiaIoni Bowcher PROPOSAL
Mayumi D BologniaFranceOnyama Limba PROPOSAL
Adams K TollnerUnited KingdomAnna Fali NEW
Nicolas L FigeroaUnited KingdomOnyama Limba QUALIFIED
David P RulapaughArgentinaAnna Fali UNQUALIFIED
Tony R BologniaCanadaAsiya Javayant NEGOTIATION
Claire L GlickItalyAsiya Javayant PROPOSAL
Izzy N FollerUnited KingdomXuxue Feng NEW
Adams U KolmetzFranceStephen Shaw NEW
Morrow K PaprockiUnited KingdomAsiya Javayant RENEWAL
Ashley U DilliardRussiaStephen Shaw NEW
Arvin N KolmetzIndiaIoni Bowcher NEGOTIATION
Jefferson F SchemmerArgentinaIoni Bowcher RENEWAL
Stacey I RimFranceIoni Bowcher NEW
Costa G DoeBrazilElwin Sharvill NEGOTIATION
Chavez O MaletIndiaOnyama Limba RENEWAL
Octavia C InouyeIndiaIoni Bowcher NEGOTIATION
Leon H BologniaCanadaIoni Bowcher QUALIFIED
Leja R GillianIndiaBernardo Dominic PROPOSAL
Clifford E RulapaughAustraliaElwin Sharvill NEGOTIATION
Rodrigues I KuskoBrazilStephen Shaw RENEWAL
Mujtaba B IturbideAustraliaElwin Sharvill QUALIFIED
Jeanfrancois S BologniaRussiaXuxue Feng PROPOSAL
Leon I OstroskyUnited KingdomIvan Magalhaes PROPOSAL
Leon S FollerJapanIoni Bowcher NEW
Silvio B KolmetzSpainIvan Magalhaes NEGOTIATION
Deepesh V PerinIndiaAsiya Javayant NEGOTIATION
Isabel F WieserAustraliaIvan Magalhaes UNQUALIFIED
Antonio C IturbideItalyStephen Shaw PROPOSAL
Cody G SergiCanadaIvan Magalhaes NEGOTIATION
Claire Z FigeroaCanadaIvan Magalhaes QUALIFIED
Claire G OstroskyJapanBernardo Dominic UNQUALIFIED
Juan R StockhamSpainXuxue Feng RENEWAL
Adams R StensethGermanyXuxue Feng NEGOTIATION
Ashley I RulapaughBrazilXuxue Feng NEW
Silvio H GillianGermanyAsiya Javayant RENEWAL
Frozen Columns
Name
Claire Q Ruta
Francesco P Albares
Leon C Iturbide
David Q Venere
Salvatore A Wieser
Aika T Saylors
Ashley G Rim
Darci K Stockham
Faith P Stenseth
Izzy N Figeroa
Emily S Nestle
Clifford G Garufi
Salvatore Z Vocelka
Adams L Albares
Izzy U Tollner
Johnson S Stenseth
Smith Y Gillian
Costa O Perin
Antonio S Foller
Salvatore X Morasca
Antonio Q Vocelka
Jefferson J Briddick
Kaitlin O Ferencz
Sinclair J Kolmetz
Cody Z Chui
Cody R Wieser
Izzy T Tollner
Aruna F Inouye
Clifford G Venere
Alejandro N Bolognia
Francesco U Stockham
Mujtaba I Butt
Julie T Stenseth
Ashley F Malet
Adams Q Oldroyd
Wickens U Kolmetz
Wickens F Dilliard
Jones K Butt
Sinclair J Kolmetz
Mujtaba I Nicka
Costa W Briddick
Alejandro E Perin
Ricardo G Figeroa
Costa X Garufi
Kadeem V Amigon
Darci S Darakjy
Morrow L Rulapaugh
Aruna N Inouye
Aika C Vocelka
Julie B Maclead
IdCountryDate
1000Russia2025-05-21
1001United Kingdom2025-06-11
1002Brazil2025-05-30
1003United Kingdom2025-05-19
1004Canada2025-05-19
1005Spain2025-06-01
1006Australia2025-05-26
1007Australia2025-06-05
1008Russia2025-05-30
1009Australia2025-06-05
1010India2025-05-27
1011Germany2025-06-11
1012Russia2025-05-31
1013Argentina2025-05-30
1014Italy2025-06-07
1015Australia2025-06-11
1016Canada2025-05-23
1017India2025-05-23
1018India2025-06-14
1019Australia2025-05-17
1020Canada2025-06-04
1021Spain2025-06-14
1022Japan2025-06-07
1023Spain2025-06-07
1024Spain2025-05-27
1025Germany2025-05-25
1026India2025-06-09
1027France2025-05-17
1028India2025-05-30
1029Spain2025-06-04
1030Japan2025-06-01
1031Argentina2025-05-24
1032Japan2025-05-23
1033Canada2025-06-12
1034Brazil2025-05-31
1035Argentina2025-05-23
1036Brazil2025-06-14
1037India2025-05-20
1038Brazil2025-05-31
1039United Kingdom2025-06-03
1040France2025-06-14
1041Canada2025-06-08
1042Australia2025-05-26
1043Brazil2025-05-17
1044Canada2025-06-09
1045Spain2025-06-04
1046Argentina2025-05-17
1047Italy2025-05-28
1048Spain2025-05-26
1049Japan2025-06-08

On-Demand Data

NameIdCountryDate
Kaitlin C Iturbide1000Australia2025-05-23
Chavez L Figeroa1001Spain2025-05-19
Silvio B Inouye1002India2025-05-17
Aruna M Ferencz1003Canada2025-05-25
Mujtaba N Caudy1004Italy2025-06-13
Clifford N Darakjy1005Argentina2025-05-25
Aika J Wieser1006Australia2025-05-19
Clifford V Butt1007Russia2025-05-29
Emily R Campain1008Italy2025-05-27
Isabel B Bowley1009Argentina2025-05-17
James W Poquette1010Italy2025-06-06
Leon L Flosi1011United Kingdom2025-06-08
Isabel N Albares1012Japan2025-05-20
Alejandro L Schemmer1013Brazil2025-06-08
Maisha U Marrier1014France2025-05-16
Darci V Shinko1015Spain2025-05-31
Isabel D Nicka1016Brazil2025-06-02
Antonio M Gaucho1017Spain2025-05-21
Darci Y Glick1018Spain2025-05-20
Maisha I Darakjy1019France2025-05-25
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Adams F ButtCanadaElwin Sharvill UNQUALIFIED
Misaki A SchemmerBrazilAsiya Javayant NEW
Alejandro C BriddickGermanyElwin Sharvill NEGOTIATION
Aruna C MaletUnited KingdomStephen Shaw QUALIFIED
Maisha I SchemmerCanadaIoni Bowcher NEGOTIATION
Mayumi Y PaprockiIndiaAnna Fali NEGOTIATION
Jefferson V CampainArgentinaIvan Magalhaes RENEWAL
Leon S CaudyRussiaIoni Bowcher PROPOSAL
Ricardo S OstroskyBrazilAmy Elsner RENEWAL
Julie E GillianBrazilIoni Bowcher PROPOSAL
Claire F RoysterArgentinaElwin Sharvill QUALIFIED
Morrow X AlbaresSpainIvan Magalhaes NEW
Munro F ButtSpainIvan Magalhaes PROPOSAL
Alejandro I SergiAustraliaIvan Magalhaes PROPOSAL
Aditya E BologniaIndiaAnna Fali PROPOSAL
Salvatore R BriddickIndiaIoni Bowcher RENEWAL
Octavia A SaylorsCanadaIoni Bowcher NEW
Mujtaba G MacleadCanadaXuxue Feng UNQUALIFIED
Morrow E RoysterAustraliaAnna Fali NEGOTIATION
Aditya U OldroydFranceAnna Fali NEGOTIATION
Murillo J CampainItalyXuxue Feng PROPOSAL
Rodrigues K InouyeAustraliaIvan Magalhaes NEGOTIATION
Aditya L MaletCanadaStephen Shaw PROPOSAL
Claire D InouyeIndiaIoni Bowcher NEGOTIATION
Leja M DilliardArgentinaXuxue Feng RENEWAL
Jefferson Z MaletRussiaElwin Sharvill NEGOTIATION
Nicolas N ShinkoBrazilIoni Bowcher QUALIFIED
Morrow L KuskoItalyAmy Elsner NEGOTIATION
Mayumi Z GauchoGermanyStephen Shaw NEGOTIATION
Greenwood S ChuiArgentinaXuxue Feng NEW
Cody U PaprockiGermanyXuxue Feng UNQUALIFIED
Jeanfrancois B DoeRussiaAsiya Javayant RENEWAL
David J MarrierGermanyIvan Magalhaes QUALIFIED
Leja F VocelkaSpainAmy Elsner NEGOTIATION
Ashley A FigeroaUnited KingdomIvan Magalhaes NEW
Jeanfrancois F NestleBrazilElwin Sharvill UNQUALIFIED
Izzy M RoysterItalyXuxue Feng RENEWAL
Arvin W BriddickArgentinaAmy Elsner PROPOSAL
Francesco Z KolmetzBrazilOnyama Limba NEGOTIATION
Alejandro X SlusarskiFranceAsiya Javayant UNQUALIFIED

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