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
Jones Y GarufiArgentinaStephen Shaw RENEWAL
Claire O RoysterFranceElwin Sharvill RENEWAL
Chavez Z VenereIndiaOnyama Limba NEW
Darci T ChuiUnited KingdomIvan Magalhaes QUALIFIED
Arvin Q DarakjyJapanAnna Fali RENEWAL
Greenwood W IturbideJapanIvan Magalhaes NEW
Aditya L FerenczBrazilXuxue Feng PROPOSAL
Silvio T FerenczFranceStephen Shaw QUALIFIED
Morrow O SchemmerAustraliaAsiya Javayant NEGOTIATION
Costa Q KuskoItalyAsiya Javayant NEW
Octavia U FigeroaRussiaIvan Magalhaes QUALIFIED
Salvatore J ChuiUnited KingdomAsiya Javayant QUALIFIED
Murillo R FlosiAustraliaOnyama Limba NEGOTIATION
Arvin M PaprockiBrazilXuxue Feng PROPOSAL
Cody A MarrierRussiaElwin Sharvill NEW
Costa U ShinkoFranceIoni Bowcher RENEWAL
Nicolas D RutaArgentinaIoni Bowcher NEW
Chavez G DilliardGermanyAmy Elsner NEGOTIATION
Octavia S SchemmerBrazilAnna Fali UNQUALIFIED
Francesco F SlusarskiCanadaElwin Sharvill PROPOSAL
Alejandro J FlosiIndiaAsiya Javayant UNQUALIFIED
Mujtaba P KolmetzCanadaOnyama Limba PROPOSAL
Johnson W MarrierRussiaBernardo Dominic UNQUALIFIED
Tony I VocelkaCanadaAmy Elsner NEGOTIATION
Adams A NickaJapanOnyama Limba QUALIFIED
Aika S FlosiItalyAsiya Javayant NEW
Misaki L FlosiIndiaStephen Shaw UNQUALIFIED
Chavez H FerenczJapanIvan Magalhaes PROPOSAL
Adams W KuskoJapanElwin Sharvill UNQUALIFIED
Claire K PoquetteArgentinaAsiya Javayant PROPOSAL
Izzy O AlbaresRussiaBernardo Dominic RENEWAL
Mujtaba O VenereIndiaOnyama Limba UNQUALIFIED
Deepesh J DarakjyCanadaAmy Elsner NEGOTIATION
Faith U MaletRussiaElwin Sharvill RENEWAL
Izzy X RoysterSpainStephen Shaw RENEWAL
Ashley Y VenereSpainBernardo Dominic PROPOSAL
Johnson J WaycottItalyAnna Fali NEGOTIATION
Costa Z ChuiFranceBernardo Dominic RENEWAL
Jones L GauchoJapanIvan Magalhaes NEW
Emily R CaldareraIndiaXuxue Feng NEW
Leon W GlickSpainBernardo Dominic PROPOSAL
Izzy P SlusarskiUnited KingdomOnyama Limba NEW
Arvin N PoquetteUnited KingdomBernardo Dominic QUALIFIED
Tony Y SergiFranceBernardo Dominic RENEWAL
Deepesh X GarufiJapanAnna Fali RENEWAL
Ashley Y MaletRussiaStephen Shaw UNQUALIFIED
Deepesh I WaycottIndiaAsiya Javayant UNQUALIFIED
Mujtaba T KolmetzItalyAnna Fali RENEWAL
Julie W SaylorsArgentinaIoni Bowcher UNQUALIFIED
David M GarufiJapanStephen Shaw RENEWAL
Horizontal
NameCountryRepresentativeStatus
Rodrigues P BriddickBrazilIoni Bowcher RENEWAL
Wickens B CampainSpainStephen Shaw QUALIFIED
Emily K VocelkaSpainBernardo Dominic RENEWAL
Ivar R AmigonBrazilAnna Fali UNQUALIFIED
Kadeem H MorascaSpainAsiya Javayant UNQUALIFIED
Julie W ChuiIndiaAnna Fali NEW
Adams A CaudyRussiaElwin Sharvill PROPOSAL
Claire X CaldareraRussiaAsiya Javayant QUALIFIED
Ivar H PaprockiFranceStephen Shaw PROPOSAL
Kaitlin C RoysterCanadaIvan Magalhaes PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Salvatore U FerenczFrance2025-04-30Chapman, Ross E Esq PROPOSAL80Xuxue Feng
1001Smith F MaletRussia2025-04-24King, Christopher A Esq NEW74Stephen Shaw
1002Julie H KolmetzArgentina2025-04-28Morlong Associates QUALIFIED60Elwin Sharvill
1003Julie T VenereRussia2025-04-22Feiner Bros NEW66Xuxue Feng
1004Alejandro U BologniaArgentina2025-04-09Feiner Bros RENEWAL94Amy Elsner
1005Darci V CaldareraRussia2025-04-10Commercial Press RENEWAL57Xuxue Feng
1006Mujtaba C RoysterBrazil2025-04-01Printing Dimensions NEW4Elwin Sharvill
1007James K RulapaughItaly2025-04-05Benton, John B Jr PROPOSAL5Ioni Bowcher
1008James T OldroydCanada2025-04-19Commercial Press RENEWAL42Anna Fali
1009Smith Z FerenczArgentina2025-04-22Benton, John B Jr QUALIFIED72Stephen Shaw
1010Kaitlin W VocelkaIndia2025-04-26Truhlar And Truhlar Attys RENEWAL30Amy Elsner
1011Morrow I GillianUnited Kingdom2025-04-24Chanay, Jeffrey A Esq QUALIFIED34Xuxue Feng
1012Clifford X IturbideUnited Kingdom2025-04-09Benton, John B Jr NEW19Onyama Limba
1013Arvin J IturbideSpain2025-04-26Chapman, Ross E Esq PROPOSAL13Stephen Shaw
1014Izzy H KolmetzFrance2025-04-03Feltz Printing Service NEGOTIATION9Anna Fali
1015Nicolas P RutaCanada2025-04-26Rangoni Of Florence RENEWAL50Ivan Magalhaes
1016Kadeem X KuskoIndia2025-04-12Chemel, James L Cpa PROPOSAL98Anna Fali
1017Julie U RoysterGermany2025-04-09Buckley Miller Wright NEW71Onyama Limba
1018Nicolas I MaletIndia2025-04-11Rousseaux, Michael Esq PROPOSAL35Stephen Shaw
1019Cody B StensethGermany2025-04-19Chemel, James L Cpa QUALIFIED66Onyama Limba
1020Emily R MarrierRussia2025-04-22Buckley Miller Wright UNQUALIFIED82Xuxue Feng
1021Jefferson Z FigeroaJapan2025-04-19Benton, John B Jr QUALIFIED2Stephen Shaw
1022Smith F SchemmerFrance2025-04-04Commercial Press NEW23Ivan Magalhaes
1023Leja N MaletRussia2025-04-14Rousseaux, Michael Esq NEW11Anna Fali
1024Nicolas F FerenczItaly2025-04-30Buckley Miller Wright NEW60Stephen Shaw
1025Greenwood G PoquetteArgentina2025-04-05Feiner Bros UNQUALIFIED14Ivan Magalhaes
1026Aditya V KolmetzIndia2025-04-14Rangoni Of Florence QUALIFIED42Anna Fali
1027Morrow U OstroskyAustralia2025-04-16Rousseaux, Michael Esq RENEWAL1Ioni Bowcher
1028Stacey T GauchoSpain2025-04-26Rangoni Of Florence QUALIFIED55Bernardo Dominic
1029Sinclair E NickaGermany2025-04-15Commercial Press NEGOTIATION15Stephen Shaw
1030Claire O BologniaAustralia2025-04-25King, Christopher A Esq QUALIFIED48Ioni Bowcher
1031Clifford M GauchoSpain2025-04-25Rousseaux, Michael Esq NEW51Ioni Bowcher
1032Deepesh M OstroskyIndia2025-04-09Feiner Bros QUALIFIED84Anna Fali
1033Aruna J VenereUnited Kingdom2025-04-29King, Christopher A Esq QUALIFIED31Onyama Limba
1034Maria Z RutaAustralia2025-04-17Rangoni Of Florence UNQUALIFIED81Bernardo Dominic
1035Ashley E GillianIndia2025-04-11Benton, John B Jr NEW93Ivan Magalhaes
1036Chavez V StockhamUnited Kingdom2025-04-06Truhlar And Truhlar Attys PROPOSAL64Ivan Magalhaes
1037Ashley M GauchoIndia2025-04-30Chapman, Ross E Esq PROPOSAL7Bernardo Dominic
1038Aruna O IturbideBrazil2025-04-17Chapman, Ross E Esq UNQUALIFIED19Amy Elsner
1039Sinclair P SaylorsCanada2025-04-13Rousseaux, Michael Esq NEGOTIATION6Xuxue Feng
1040Deepesh H AlbaresAustralia2025-04-14Rousseaux, Michael Esq RENEWAL36Ivan Magalhaes
1041Silvio B InouyeIndia2025-04-29Benton, John B Jr QUALIFIED51Bernardo Dominic
1042Juan M OstroskyRussia2025-04-23Dorl, James J Esq NEGOTIATION49Asiya Javayant
1043Kaitlin S CampainSpain2025-04-29Buckley Miller Wright RENEWAL27Bernardo Dominic
1044Ashley K GillianIndia2025-04-22Chanay, Jeffrey A Esq PROPOSAL53Ivan Magalhaes
1045Emily J MarrierIndia2025-04-17King, Christopher A Esq UNQUALIFIED91Ioni Bowcher
1046Costa W VocelkaGermany2025-04-07Rangoni Of Florence UNQUALIFIED21Onyama Limba
1047Ricardo U RimArgentina2025-04-24Chemel, James L Cpa NEW29Onyama Limba
1048Leon Z BriddickUnited Kingdom2025-04-05Feltz Printing Service NEGOTIATION78Elwin Sharvill
1049Mujtaba X GauchoGermany2025-04-11Feiner Bros NEGOTIATION74Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Smith F WaycottBrazilAmy Elsner NEW
Mujtaba P TollnerCanadaIoni Bowcher RENEWAL
Stacey V BologniaItalyStephen Shaw RENEWAL
Johnson X GlickFranceIvan Magalhaes QUALIFIED
Isabel R ButtFranceAmy Elsner RENEWAL
Izzy J OldroydFranceBernardo Dominic NEW
Izzy P StockhamSpainAmy Elsner NEW
Ivar M StockhamItalyElwin Sharvill UNQUALIFIED
Ricardo U CaudyFranceBernardo Dominic UNQUALIFIED
Deepesh D GlickBrazilAsiya Javayant NEW
Aruna X WhobreyUnited KingdomIoni Bowcher NEW
Sinclair M BologniaFranceOnyama Limba QUALIFIED
Cody V CaldareraRussiaElwin Sharvill PROPOSAL
Aruna P GillianGermanyAsiya Javayant PROPOSAL
Kadeem U CaldareraJapanAnna Fali RENEWAL
Mujtaba F RoysterSpainXuxue Feng QUALIFIED
Aditya V WaycottAustraliaIoni Bowcher NEGOTIATION
Greenwood M MaletIndiaStephen Shaw QUALIFIED
Jefferson X FigeroaRussiaXuxue Feng QUALIFIED
Izzy X VenereCanadaAnna Fali RENEWAL
Faith P ButtBrazilAmy Elsner NEW
Francesco E VocelkaFranceIvan Magalhaes NEW
Aika N GarufiSpainStephen Shaw PROPOSAL
James Y MaletItalyXuxue Feng UNQUALIFIED
Faith J VenereSpainElwin Sharvill NEW
Misaki U OstroskyBrazilIoni Bowcher UNQUALIFIED
Aruna Z AlbaresGermanyXuxue Feng UNQUALIFIED
Sinclair M FerenczCanadaOnyama Limba QUALIFIED
Munro X BriddickFranceAsiya Javayant RENEWAL
Nicolas O InouyeArgentinaAmy Elsner UNQUALIFIED
Aruna Q WhobreySpainAsiya Javayant NEGOTIATION
Morrow O RulapaughRussiaIoni Bowcher UNQUALIFIED
Aruna Y GarufiCanadaElwin Sharvill NEW
Antonio Z StockhamFranceIoni Bowcher PROPOSAL
Maria G KuskoUnited KingdomXuxue Feng NEW
Kadeem D WaycottIndiaBernardo Dominic PROPOSAL
Aditya N SchemmerArgentinaElwin Sharvill PROPOSAL
Clifford E OldroydJapanAnna Fali NEW
Julie I CampainIndiaElwin Sharvill PROPOSAL
Smith Z GlickUnited KingdomAmy Elsner NEW
Izzy J KuskoUnited KingdomStephen Shaw NEGOTIATION
Misaki F CaudyArgentinaBernardo Dominic UNQUALIFIED
Julie P RutaIndiaBernardo Dominic NEW
Rodrigues C GauchoRussiaIoni Bowcher UNQUALIFIED
Smith P DilliardIndiaAmy Elsner RENEWAL
Francesco E MaletSpainIvan Magalhaes PROPOSAL
Ricardo P FerenczBrazilBernardo Dominic PROPOSAL
Kaitlin D InouyeIndiaElwin Sharvill PROPOSAL
Aruna T SchemmerItalyElwin Sharvill NEW
Wickens E SaylorsBrazilAnna Fali UNQUALIFIED
Frozen Columns
Name
Leja A Tollner
Johnson K Paprocki
Jennifer P Paprocki
Ivar M Stenseth
Maria B Garufi
Chavez N Flosi
Maria Z Oldroyd
Antonio I Dilliard
Aika N Vocelka
Julie D Albares
Maria Y Paprocki
Misaki S Marrier
Greenwood Y Venere
Cody S Tollner
Silvio L Darakjy
Jones A Foller
Jennifer Z Paprocki
Aika K Iturbide
Leon J Glick
Salvatore N Perin
Darci C Garufi
Silvio C Marrier
Mayumi B Glick
Mayumi C Kusko
Maria Z Albares
Isabel T Inouye
Claire S Figeroa
Isabel U Flosi
Mujtaba Z Sergi
Clifford S Flosi
Rodrigues I Royster
Aruna A Shinko
James P Glick
Arvin F Whobrey
Misaki R Marrier
Cody V Kolmetz
Clifford Y Saylors
Darci T Stenseth
Murillo G Ferencz
Deepesh M Stenseth
Morrow I Poquette
Ricardo V Sergi
Misaki U Bowley
Ashley U Poquette
Ivar G Garufi
Misaki C Chui
Clifford D Dilliard
Kaitlin C Kolmetz
James S Flosi
Jones W Stockham
IdCountryDate
1000Canada2025-04-06
1001Russia2025-04-29
1002Argentina2025-04-17
1003Brazil2025-04-25
1004Japan2025-04-25
1005Italy2025-04-09
1006Spain2025-04-21
1007Spain2025-04-09
1008Canada2025-04-17
1009Brazil2025-04-11
1010Argentina2025-04-25
1011United Kingdom2025-04-19
1012Japan2025-04-22
1013India2025-04-03
1014Canada2025-04-04
1015Russia2025-04-19
1016Argentina2025-04-22
1017United Kingdom2025-04-23
1018France2025-04-11
1019Italy2025-04-01
1020France2025-04-12
1021Canada2025-04-18
1022Spain2025-04-22
1023Russia2025-04-17
1024Russia2025-04-01
1025United Kingdom2025-04-29
1026Italy2025-04-22
1027Italy2025-04-13
1028Germany2025-04-05
1029United Kingdom2025-04-19
1030United Kingdom2025-04-30
1031Brazil2025-04-17
1032United Kingdom2025-04-27
1033United Kingdom2025-04-28
1034Germany2025-04-22
1035Japan2025-04-11
1036Australia2025-04-09
1037Brazil2025-04-09
1038India2025-04-09
1039Australia2025-04-07
1040Japan2025-04-17
1041Japan2025-04-07
1042Argentina2025-04-01
1043Italy2025-04-28
1044Japan2025-04-17
1045Argentina2025-04-16
1046Germany2025-04-07
1047France2025-04-03
1048India2025-04-30
1049Italy2025-04-04

On-Demand Data

NameIdCountryDate
Arvin A Whobrey1000Germany2025-04-05
Adams P Saylors1001United Kingdom2025-04-26
Chavez L Dilliard1002Argentina2025-04-20
Clifford S Oldroyd1003Germany2025-04-14
Arvin T Amigon1004Australia2025-04-29
Jennifer O Inouye1005France2025-04-11
Aika U Waycott1006India2025-04-05
Morrow Q Campain1007Brazil2025-04-24
Ricardo T Schemmer1008Australia2025-04-10
Ivar Z Kusko1009United Kingdom2025-04-06
Arvin I Kolmetz1010Brazil2025-04-07
Sinclair E Stenseth1011Italy2025-04-24
Kadeem J Stenseth1012Russia2025-04-03
Costa X Glick1013Japan2025-04-20
Jefferson S Slusarski1014Italy2025-04-27
Kadeem K Venere1015Argentina2025-04-16
Antonio T Ostrosky1016Argentina2025-04-09
Stacey Y Darakjy1017Russia2025-04-05
Mujtaba C Bolognia1018Argentina2025-04-22
Ashley I Darakjy1019Russia2025-04-15
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Aruna K VocelkaCanadaAnna Fali PROPOSAL
Morrow D VenereJapanBernardo Dominic NEW
Kadeem J TollnerAustraliaAsiya Javayant RENEWAL
Ashley C RulapaughSpainIoni Bowcher PROPOSAL
Mujtaba Z CaudyFranceAmy Elsner NEW
Leja G GauchoSpainAmy Elsner NEGOTIATION
Mayumi K TollnerFranceBernardo Dominic UNQUALIFIED
Murillo L BowleyArgentinaAnna Fali QUALIFIED
Darci R AmigonArgentinaBernardo Dominic UNQUALIFIED
Darci H IturbideSpainIvan Magalhaes UNQUALIFIED
Francesco U MacleadArgentinaXuxue Feng UNQUALIFIED
Francesco X SergiIndiaOnyama Limba UNQUALIFIED
Julie M PaprockiRussiaAsiya Javayant RENEWAL
Izzy B DoeUnited KingdomOnyama Limba NEGOTIATION
Adams E WieserFranceAmy Elsner PROPOSAL
Misaki M ShinkoArgentinaOnyama Limba UNQUALIFIED
Aika X KolmetzBrazilAnna Fali PROPOSAL
Maisha O DoeArgentinaIoni Bowcher QUALIFIED
Mayumi F ChuiUnited KingdomIoni Bowcher UNQUALIFIED
Francesco Y SergiCanadaAnna Fali QUALIFIED
Greenwood H SergiJapanXuxue Feng UNQUALIFIED
Clifford V GlickSpainIvan Magalhaes PROPOSAL
Smith X DilliardJapanXuxue Feng UNQUALIFIED
Isabel F GauchoUnited KingdomIvan Magalhaes PROPOSAL
Ivar E StensethArgentinaAnna Fali QUALIFIED
Aruna D AmigonGermanyOnyama Limba PROPOSAL
Silvio X NickaUnited KingdomAmy Elsner NEGOTIATION
Nicolas Y GillianRussiaAmy Elsner NEGOTIATION
David H TollnerRussiaIoni Bowcher NEGOTIATION
Rodrigues P MacleadCanadaBernardo Dominic PROPOSAL
Francesco P RoysterBrazilStephen Shaw RENEWAL
Deepesh D CaldareraBrazilXuxue Feng NEGOTIATION
Johnson B VenereItalyIoni Bowcher NEGOTIATION
Leon A FerenczAustraliaOnyama Limba NEW
Antonio J BriddickJapanAmy Elsner QUALIFIED
Francesco K SaylorsCanadaIvan Magalhaes QUALIFIED
Jeanfrancois W MacleadUnited KingdomXuxue Feng UNQUALIFIED
Rodrigues S WhobreyJapanElwin Sharvill UNQUALIFIED
Cody T StockhamIndiaIvan Magalhaes UNQUALIFIED
Tony R RoysterItalyStephen Shaw 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>