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
Chavez D NestleCanadaAnna Fali NEGOTIATION
Jones L FigeroaUnited KingdomElwin Sharvill RENEWAL
Maria P StensethUnited KingdomAnna Fali NEW
Juan H SlusarskiItalyIoni Bowcher NEGOTIATION
Cody F CampainRussiaAnna Fali RENEWAL
Mujtaba H DoeAustraliaElwin Sharvill NEGOTIATION
Silvio W VocelkaIndiaIoni Bowcher PROPOSAL
Stacey T CampainSpainElwin Sharvill NEGOTIATION
Isabel J FlosiAustraliaStephen Shaw NEGOTIATION
Misaki F BologniaCanadaIvan Magalhaes QUALIFIED
Johnson Z MaletSpainIvan Magalhaes RENEWAL
Izzy D FigeroaSpainIvan Magalhaes UNQUALIFIED
Morrow P OldroydGermanyElwin Sharvill NEGOTIATION
Misaki P VocelkaCanadaBernardo Dominic NEW
Jennifer X SlusarskiItalyAmy Elsner NEW
Izzy Z RulapaughItalyXuxue Feng UNQUALIFIED
Adams C AlbaresCanadaAmy Elsner NEW
Silvio V ShinkoRussiaAmy Elsner NEGOTIATION
Tony D StensethFranceBernardo Dominic NEGOTIATION
Octavia I ChuiGermanyAsiya Javayant QUALIFIED
Claire D SlusarskiArgentinaAsiya Javayant NEW
Munro J DoeIndiaBernardo Dominic QUALIFIED
Munro A VenereUnited KingdomBernardo Dominic QUALIFIED
Kaitlin R DarakjyGermanyOnyama Limba NEW
Murillo N AmigonUnited KingdomAmy Elsner PROPOSAL
Cody V MacleadGermanyBernardo Dominic RENEWAL
Emily C AlbaresCanadaIvan Magalhaes PROPOSAL
Jones Q InouyeAustraliaIoni Bowcher UNQUALIFIED
Octavia J CaldareraGermanyAsiya Javayant QUALIFIED
Octavia P MaletIndiaAmy Elsner QUALIFIED
Ashley V BologniaArgentinaAsiya Javayant RENEWAL
Costa Z CaldareraArgentinaXuxue Feng PROPOSAL
David P MorascaAustraliaAsiya Javayant QUALIFIED
Ricardo F OldroydFranceOnyama Limba QUALIFIED
Ivar B RoysterIndiaAsiya Javayant RENEWAL
Kadeem W RulapaughIndiaIvan Magalhaes NEGOTIATION
Emily Y CaudyBrazilAsiya Javayant PROPOSAL
Smith V MorascaRussiaStephen Shaw UNQUALIFIED
Antonio T InouyeSpainIoni Bowcher QUALIFIED
Mayumi X TollnerGermanyElwin Sharvill QUALIFIED
Julie C BologniaArgentinaAsiya Javayant UNQUALIFIED
Emily F MaletIndiaAnna Fali PROPOSAL
Johnson W SergiBrazilBernardo Dominic PROPOSAL
Morrow Z SlusarskiRussiaStephen Shaw UNQUALIFIED
Nicolas C GauchoItalyIvan Magalhaes RENEWAL
Kadeem V InouyeArgentinaAmy Elsner RENEWAL
Deepesh K PaprockiJapanBernardo Dominic RENEWAL
Greenwood V RimItalyAmy Elsner NEGOTIATION
Sinclair C KuskoItalyOnyama Limba QUALIFIED
Octavia D SchemmerAustraliaElwin Sharvill RENEWAL
Horizontal
NameCountryRepresentativeStatus
Alejandro A ButtIndiaBernardo Dominic NEGOTIATION
Darci R NickaBrazilElwin Sharvill UNQUALIFIED
Emily O FerenczCanadaIvan Magalhaes UNQUALIFIED
Chavez L MacleadSpainStephen Shaw QUALIFIED
Munro H BriddickItalyAnna Fali NEGOTIATION
Maisha N GlickArgentinaBernardo Dominic QUALIFIED
Octavia F OstroskyArgentinaBernardo Dominic NEW
Cody T IturbideSpainIoni Bowcher PROPOSAL
Mujtaba M AlbaresCanadaIvan Magalhaes QUALIFIED
Antonio Q SaylorsFranceBernardo Dominic PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Aditya X BologniaBrazil2024-09-11Printing Dimensions PROPOSAL8Elwin Sharvill
1001Jefferson R StensethUnited Kingdom2024-09-17Chanay, Jeffrey A Esq UNQUALIFIED71Ioni Bowcher
1002Cody D GlickItaly2024-08-22King, Christopher A Esq NEGOTIATION18Asiya Javayant
1003James J OldroydItaly2024-08-27Benton, John B Jr PROPOSAL91Xuxue Feng
1004Isabel Z CaudyArgentina2024-08-26Truhlar And Truhlar Attys NEW98Elwin Sharvill
1005Murillo E MaletUnited Kingdom2024-09-07Benton, John B Jr UNQUALIFIED70Amy Elsner
1006Tony M RutaIndia2024-08-24Benton, John B Jr NEW83Amy Elsner
1007Arvin Z GauchoUnited Kingdom2024-09-12Morlong Associates RENEWAL47Amy Elsner
1008Morrow N FollerSpain2024-09-03Chemel, James L Cpa RENEWAL92Asiya Javayant
1009Kaitlin N RoysterRussia2024-08-30Feiner Bros RENEWAL72Ioni Bowcher
1010Smith Y BologniaArgentina2024-08-27Chemel, James L Cpa UNQUALIFIED37Amy Elsner
1011Juan C GlickRussia2024-08-30Chapman, Ross E Esq QUALIFIED32Bernardo Dominic
1012Izzy H CaudyFrance2024-08-27Chanay, Jeffrey A Esq NEGOTIATION48Onyama Limba
1013Claire R PaprockiUnited Kingdom2024-09-01King, Christopher A Esq PROPOSAL35Ioni Bowcher
1014Cody X SlusarskiCanada2024-09-13King, Christopher A Esq RENEWAL74Xuxue Feng
1015Claire T IturbideJapan2024-09-05Rousseaux, Michael Esq NEW63Xuxue Feng
1016Sinclair O RimUnited Kingdom2024-09-19Benton, John B Jr PROPOSAL70Ivan Magalhaes
1017Morrow I MarrierCanada2024-08-29Feiner Bros UNQUALIFIED44Bernardo Dominic
1018Arvin I FollerRussia2024-09-17King, Christopher A Esq RENEWAL57Bernardo Dominic
1019Sinclair N FigeroaBrazil2024-09-17Buckley Miller Wright RENEWAL0Bernardo Dominic
1020Silvio P CaudyFrance2024-09-18Feltz Printing Service NEW52Onyama Limba
1021Octavia E IturbideItaly2024-08-26Chemel, James L Cpa NEGOTIATION51Stephen Shaw
1022Julie P SaylorsFrance2024-08-31Chemel, James L Cpa UNQUALIFIED70Bernardo Dominic
1023Leon W GarufiUnited Kingdom2024-08-21Dorl, James J Esq RENEWAL49Amy Elsner
1024Aruna T CaudyAustralia2024-08-31Feltz Printing Service NEGOTIATION28Elwin Sharvill
1025Juan V FlosiRussia2024-09-04Buckley Miller Wright NEW19Xuxue Feng
1026Munro V DarakjyIndia2024-09-18Feiner Bros UNQUALIFIED6Ioni Bowcher
1027Murillo B IturbideBrazil2024-09-16Rousseaux, Michael Esq RENEWAL47Xuxue Feng
1028Sinclair K MaletAustralia2024-08-30Feltz Printing Service QUALIFIED96Xuxue Feng
1029Leon K KuskoUnited Kingdom2024-09-19Chanay, Jeffrey A Esq NEGOTIATION70Stephen Shaw
1030Silvio U IturbideCanada2024-08-31Chanay, Jeffrey A Esq NEW24Elwin Sharvill
1031Maria C DoeItaly2024-08-23Feiner Bros NEGOTIATION16Stephen Shaw
1032Leon S MacleadFrance2024-08-29Chemel, James L Cpa NEGOTIATION12Ioni Bowcher
1033Sinclair G DoeGermany2024-09-16Printing Dimensions UNQUALIFIED61Asiya Javayant
1034Leon T GauchoArgentina2024-08-28Truhlar And Truhlar Attys RENEWAL75Xuxue Feng
1035Tony X InouyeGermany2024-08-27Chanay, Jeffrey A Esq QUALIFIED75Stephen Shaw
1036Aditya U MaletCanada2024-09-07King, Christopher A Esq UNQUALIFIED1Anna Fali
1037Ricardo C VocelkaIndia2024-09-18Feiner Bros NEW96Anna Fali
1038Darci U SchemmerRussia2024-09-08Benton, John B Jr NEGOTIATION71Elwin Sharvill
1039Murillo S WieserItaly2024-08-28Commercial Press PROPOSAL33Elwin Sharvill
1040Costa G CaldareraUnited Kingdom2024-09-01Chapman, Ross E Esq PROPOSAL9Elwin Sharvill
1041Aruna Y StockhamUnited Kingdom2024-08-21Feltz Printing Service PROPOSAL96Onyama Limba
1042Alejandro X DilliardBrazil2024-08-25Truhlar And Truhlar Attys NEGOTIATION82Xuxue Feng
1043Francesco L DilliardUnited Kingdom2024-08-26Printing Dimensions RENEWAL30Xuxue Feng
1044Rodrigues U TollnerItaly2024-08-26Chapman, Ross E Esq UNQUALIFIED71Elwin Sharvill
1045Francesco V BologniaIndia2024-09-05Chemel, James L Cpa QUALIFIED54Onyama Limba
1046Alejandro I TollnerFrance2024-09-09Truhlar And Truhlar Attys QUALIFIED35Ioni Bowcher
1047Maria X DoeItaly2024-09-06Chanay, Jeffrey A Esq RENEWAL8Asiya Javayant
1048Aika T PerinItaly2024-09-15Chapman, Ross E Esq RENEWAL42Stephen Shaw
1049Mujtaba J CaldareraIndia2024-09-04Dorl, James J Esq NEW21Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Ashley O NickaBrazilIoni Bowcher UNQUALIFIED
Ashley V KuskoJapanOnyama Limba QUALIFIED
Mayumi X StockhamArgentinaOnyama Limba UNQUALIFIED
Greenwood A InouyeCanadaOnyama Limba QUALIFIED
Cody G PaprockiItalyAsiya Javayant NEGOTIATION
Claire M FerenczGermanyXuxue Feng QUALIFIED
Arvin R MacleadArgentinaIvan Magalhaes RENEWAL
Francesco B FlosiFranceXuxue Feng NEGOTIATION
Ashley J DoeFranceIvan Magalhaes QUALIFIED
Rodrigues L BriddickUnited KingdomXuxue Feng PROPOSAL
Costa Y MaletItalyElwin Sharvill QUALIFIED
Kaitlin Z CaldareraFranceStephen Shaw NEW
Deepesh K SergiItalyAnna Fali QUALIFIED
Silvio C WieserArgentinaAsiya Javayant NEW
Murillo D SchemmerIndiaBernardo Dominic QUALIFIED
Alejandro O MaletUnited KingdomIoni Bowcher QUALIFIED
Francesco B BriddickGermanyOnyama Limba NEGOTIATION
Arvin L AlbaresIndiaAmy Elsner NEGOTIATION
Greenwood I ChuiGermanyIvan Magalhaes UNQUALIFIED
Juan A CaudyJapanIoni Bowcher QUALIFIED
Wickens V InouyeRussiaBernardo Dominic UNQUALIFIED
Munro E VocelkaGermanyStephen Shaw RENEWAL
Julie S OstroskyAustraliaXuxue Feng PROPOSAL
Cody C CaldareraSpainElwin Sharvill UNQUALIFIED
Jennifer Y ShinkoFranceAmy Elsner NEW
Kaitlin J GauchoJapanBernardo Dominic RENEWAL
Ivar J BologniaItalyIvan Magalhaes NEGOTIATION
James T WaycottUnited KingdomAsiya Javayant UNQUALIFIED
Darci R GillianSpainAsiya Javayant UNQUALIFIED
Claire T FlosiFranceElwin Sharvill NEW
Maria A RimUnited KingdomBernardo Dominic QUALIFIED
Morrow K DarakjyArgentinaAmy Elsner RENEWAL
Greenwood T PerinJapanAmy Elsner UNQUALIFIED
Costa B ButtGermanyIvan Magalhaes QUALIFIED
Costa D FigeroaArgentinaAnna Fali NEW
Rodrigues S KolmetzIndiaElwin Sharvill PROPOSAL
Costa F FollerSpainAsiya Javayant RENEWAL
Jefferson L InouyeItalyIvan Magalhaes UNQUALIFIED
Alejandro H SergiAustraliaAmy Elsner NEGOTIATION
Arvin Q StockhamItalyXuxue Feng QUALIFIED
Rodrigues B ChuiAustraliaElwin Sharvill NEGOTIATION
Ashley P FlosiGermanyOnyama Limba QUALIFIED
Tony T GlickBrazilAnna Fali UNQUALIFIED
Clifford E MacleadItalyAsiya Javayant RENEWAL
Ivar V PaprockiBrazilAnna Fali NEGOTIATION
Tony B WhobreyFranceIvan Magalhaes PROPOSAL
Claire H StensethJapanElwin Sharvill QUALIFIED
Murillo P PerinUnited KingdomAsiya Javayant RENEWAL
Rodrigues A FollerArgentinaStephen Shaw UNQUALIFIED
Aruna C InouyeJapanXuxue Feng NEGOTIATION
Frozen Columns
Name
Alejandro V Perin
Alejandro J Waycott
Antonio O Waycott
Isabel B Bowley
Antonio E Slusarski
Emily O Royster
Juan N Malet
Isabel X Paprocki
Morrow K Stenseth
Leon A Shinko
Johnson J Schemmer
Tony S Campain
Aditya S Darakjy
Tony K Rulapaugh
Octavia Z Foller
Mujtaba D Malet
David B Ruta
Ivar P Stockham
Ivar Y Campain
Darci U Vocelka
Arvin O Stockham
Juan M Paprocki
Alejandro J Royster
Aditya J Paprocki
James S Darakjy
Aditya F Iturbide
Julie B Perin
Ivar R Stockham
Tony L Bolognia
Isabel Z Albares
Nicolas I Ferencz
Emily O Figeroa
Antonio V Ferencz
Wickens W Bowley
Tony V Briddick
Arvin C Saylors
Arvin K Figeroa
Jennifer X Caldarera
Aditya V Wieser
Ashley U Malet
Izzy C Dilliard
Francesco S Gillian
Wickens Y Foller
Rodrigues D Nicka
Ivar C Morasca
Leon S Ruta
Aruna R Darakjy
Chavez L Rim
Alejandro Q Maclead
Morrow W Flosi
IdCountryDate
1000Argentina2024-08-26
1001Spain2024-09-08
1002Russia2024-09-13
1003Canada2024-08-25
1004India2024-09-04
1005Spain2024-08-25
1006France2024-08-29
1007France2024-08-29
1008Spain2024-09-02
1009France2024-09-18
1010India2024-09-04
1011India2024-08-29
1012Japan2024-09-06
1013Brazil2024-08-21
1014Argentina2024-09-10
1015Russia2024-09-02
1016Italy2024-08-21
1017Spain2024-09-16
1018Spain2024-09-16
1019Brazil2024-09-08
1020Spain2024-09-01
1021Italy2024-09-19
1022Japan2024-09-13
1023Italy2024-09-08
1024Germany2024-09-18
1025France2024-09-11
1026Italy2024-08-26
1027Australia2024-09-11
1028Australia2024-09-13
1029France2024-09-09
1030Canada2024-09-10
1031France2024-09-11
1032Germany2024-09-04
1033Spain2024-09-10
1034Australia2024-09-15
1035Australia2024-08-28
1036Canada2024-08-25
1037Germany2024-09-14
1038Canada2024-08-27
1039United Kingdom2024-09-16
1040Brazil2024-08-22
1041France2024-09-19
1042Spain2024-08-25
1043Canada2024-08-26
1044Japan2024-08-28
1045Germany2024-09-07
1046Brazil2024-09-05
1047United Kingdom2024-09-19
1048India2024-09-19
1049Italy2024-08-26

On-Demand Data

NameIdCountryDate
Ivar W Ferencz1000Brazil2024-09-12
Aruna X Chui1001Japan2024-09-01
Cody I Campain1002India2024-08-28
Morrow R Malet1003Italy2024-09-03
Ivar V Sergi1004Spain2024-09-19
Misaki I Dilliard1005Germany2024-09-16
James E Malet1006Argentina2024-09-19
Wickens M Iturbide1007Germany2024-09-06
Salvatore B Inouye1008Spain2024-09-04
Leon W Morasca1009Canada2024-09-15
Faith E Ruta1010Japan2024-09-02
Tony P Chui1011Canada2024-09-17
Aditya I Dilliard1012France2024-09-06
Leon Z Perin1013France2024-09-09
Isabel N Paprocki1014United Kingdom2024-09-18
Wickens J Caudy1015Brazil2024-09-10
Jefferson W Darakjy1016United Kingdom2024-09-12
James X Venere1017France2024-09-15
Kadeem G Waycott1018France2024-09-03
Octavia Z Wieser1019Russia2024-09-04
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
David K MacleadRussiaAnna Fali NEGOTIATION
Murillo S VocelkaAustraliaElwin Sharvill RENEWAL
Emily F SaylorsSpainAnna Fali QUALIFIED
Julie S NickaCanadaIvan Magalhaes PROPOSAL
Darci H WaycottFranceXuxue Feng NEW
Costa O VenereGermanyXuxue Feng UNQUALIFIED
Costa D TollnerAustraliaStephen Shaw NEGOTIATION
Tony D ChuiGermanyElwin Sharvill QUALIFIED
Faith H WhobreyItalyXuxue Feng NEGOTIATION
David D RoysterIndiaAmy Elsner RENEWAL
Jefferson X ShinkoAustraliaIoni Bowcher NEW
Francesco A ChuiBrazilXuxue Feng RENEWAL
Leon O WhobreyIndiaAnna Fali UNQUALIFIED
Salvatore D RimFranceIvan Magalhaes PROPOSAL
Deepesh O BologniaGermanyIvan Magalhaes NEGOTIATION
Mujtaba S MorascaJapanIoni Bowcher RENEWAL
Octavia Q PaprockiFranceAmy Elsner UNQUALIFIED
Darci P StockhamUnited KingdomOnyama Limba PROPOSAL
Antonio J DilliardRussiaOnyama Limba PROPOSAL
Leon V CaudyJapanAsiya Javayant UNQUALIFIED
Leon H RulapaughAustraliaOnyama Limba PROPOSAL
Johnson A SergiIndiaElwin Sharvill UNQUALIFIED
Adams D GarufiGermanyElwin Sharvill NEW
Kaitlin P GillianBrazilStephen Shaw RENEWAL
Claire H ChuiIndiaStephen Shaw NEGOTIATION
Alejandro L NestleIndiaBernardo Dominic PROPOSAL
Alejandro E BologniaJapanXuxue Feng NEGOTIATION
Francesco X SlusarskiGermanyOnyama Limba NEGOTIATION
Deepesh D WhobreyFranceAnna Fali QUALIFIED
Alejandro R GauchoArgentinaBernardo Dominic RENEWAL
Claire B ButtFranceBernardo Dominic NEGOTIATION
Francesco B GarufiJapanIoni Bowcher UNQUALIFIED
Tony V KolmetzArgentinaAmy Elsner QUALIFIED
Isabel V RimItalyIoni Bowcher RENEWAL
Juan T TollnerUnited KingdomAmy Elsner UNQUALIFIED
Chavez O KolmetzAustraliaXuxue Feng RENEWAL
Izzy Z CampainBrazilIoni Bowcher NEW
Izzy X ShinkoAustraliaOnyama Limba RENEWAL
Costa K RulapaughArgentinaElwin Sharvill NEW
Sinclair G ShinkoIndiaAsiya Javayant 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>