Summer Sale is here 🏖️ Get 50% off with code PRSM25 Learn More

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
Bangla
Bosnian
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
Uzbek
Vietnamese
Chinese
Chinese

Input Style

Themes

PrimeOne
Saga Blue Saga Blue
Vela Blue Vela Blue
Arya Blue Arya Blue
Bootstrap
Bootstrap Blue Light Bootstrap Blue Light
Bootstrap Purple Light Bootstrap Purple Light
Bootstrap Blue Dark Bootstrap Blue Dark
Bootstrap Purple Dark Bootstrap Purple Dark
Material Design
Material Indigo Light Material Indigo Light
Material Deep Purple Light Material Deep Purple Light
Material Indigo Dark Material Indigo Dark
Material Deep Purple Dark Material Deep Purple Dark
Material Design Compact
Material Compact Indigo Light Material Compact Indigo Light
Material Compact Deep Purple Light Material Compact Deep Purple Light
Material Compact Indigo Dark Material Compact Indigo Dark
Material Compact Deep Purple Dark Material Compact Deep Purple Dark
Legacy
Nova Light Nova Light
Nova Dark Nova Dark
Nova Colored Nova Colored
Luna Amber Luna Amber
Luna Blue Luna Blue
Luna Green Luna Green
Luna Pink Luna Pink

DataTable Scroll

Both vertical and horizontal scrolling of the data is supported with optional frozen rows-columns and on-demand loading features.

Vertical
NameCountryRepresentativeStatus
Octavia O DoeBrazilAnna Fali UNQUALIFIED
Adams Y OldroydSpainBernardo Dominic PROPOSAL
Octavia N FerenczRussiaStephen Shaw RENEWAL
Cody A VocelkaFranceOnyama Limba RENEWAL
Juan W RulapaughGermanyStephen Shaw NEW
Antonio W GlickAustraliaAnna Fali NEW
Mujtaba I IturbideGermanyStephen Shaw NEGOTIATION
Munro T InouyeJapanAmy Elsner UNQUALIFIED
Greenwood Y GauchoRussiaStephen Shaw RENEWAL
Izzy N GlickFranceIoni Bowcher RENEWAL
Alejandro F MaletFranceOnyama Limba UNQUALIFIED
Aika R RoysterGermanyStephen Shaw NEW
Maria K RoysterItalyStephen Shaw QUALIFIED
Ashley D RutaArgentinaOnyama Limba NEW
Smith F MorascaSpainAnna Fali PROPOSAL
Ashley B PerinUnited KingdomIoni Bowcher NEW
Maria A GlickItalyStephen Shaw NEGOTIATION
Isabel Y SergiBrazilElwin Sharvill PROPOSAL
Arvin P SergiAustraliaXuxue Feng PROPOSAL
Aika C AlbaresUnited KingdomAnna Fali QUALIFIED
Juan U DoeArgentinaIoni Bowcher RENEWAL
Aruna C PaprockiCanadaXuxue Feng NEGOTIATION
Maria T KuskoIndiaElwin Sharvill RENEWAL
Ivar R CaldareraFranceAsiya Javayant UNQUALIFIED
Chavez B NickaUnited KingdomBernardo Dominic RENEWAL
Aditya F MacleadCanadaBernardo Dominic RENEWAL
Deepesh J BowleyJapanIoni Bowcher PROPOSAL
Ricardo S FigeroaBrazilStephen Shaw PROPOSAL
Emily G WieserItalyIvan Magalhaes RENEWAL
Sinclair A BriddickSpainOnyama Limba QUALIFIED
Jeanfrancois A KuskoJapanOnyama Limba NEW
Isabel M NestleCanadaElwin Sharvill NEGOTIATION
David O FlosiAustraliaIoni Bowcher UNQUALIFIED
Ashley C CaudySpainAmy Elsner PROPOSAL
Emily M NickaUnited KingdomIoni Bowcher UNQUALIFIED
James V NestleIndiaAnna Fali NEGOTIATION
Salvatore D BologniaUnited KingdomAmy Elsner QUALIFIED
Faith Y RoysterCanadaAnna Fali NEGOTIATION
Sinclair N KuskoSpainIvan Magalhaes QUALIFIED
Nicolas I ShinkoBrazilIvan Magalhaes UNQUALIFIED
Jennifer F OldroydArgentinaAnna Fali RENEWAL
Ivar O ButtAustraliaElwin Sharvill NEGOTIATION
Isabel Z KolmetzItalyAsiya Javayant QUALIFIED
Ricardo M MacleadSpainIoni Bowcher RENEWAL
Morrow Y NickaArgentinaAnna Fali NEGOTIATION
Izzy W MorascaGermanyIvan Magalhaes QUALIFIED
Morrow C PerinCanadaAmy Elsner UNQUALIFIED
Leja E RimArgentinaOnyama Limba UNQUALIFIED
Emily J ButtRussiaElwin Sharvill QUALIFIED
Aditya Q GarufiSpainIvan Magalhaes PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Maisha V FlosiJapanXuxue Feng NEGOTIATION
Arvin A VocelkaItalyAnna Fali PROPOSAL
Munro K FollerItalyElwin Sharvill UNQUALIFIED
Smith G MorascaArgentinaStephen Shaw NEGOTIATION
Adams K FerenczArgentinaOnyama Limba NEGOTIATION
Arvin V GarufiArgentinaAsiya Javayant RENEWAL
Clifford J ChuiUnited KingdomAnna Fali NEGOTIATION
Chavez W GillianBrazilOnyama Limba NEW
Stacey P CaudyJapanElwin Sharvill NEW
Antonio B GarufiGermanyBernardo Dominic RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Maria X SchemmerIndia2025-08-01Commercial Press PROPOSAL56Ivan Magalhaes
1001Adams O StensethRussia2025-07-28Truhlar And Truhlar Attys NEGOTIATION45Bernardo Dominic
1002Costa F SchemmerRussia2025-07-23Morlong Associates UNQUALIFIED78Bernardo Dominic
1003Stacey I ButtJapan2025-07-11Buckley Miller Wright NEW81Amy Elsner
1004Jefferson E VenereBrazil2025-07-27Chapman, Ross E Esq NEGOTIATION90Onyama Limba
1005Isabel J PerinCanada2025-07-30Chanay, Jeffrey A Esq PROPOSAL61Elwin Sharvill
1006Julie W CaudyBrazil2025-07-12Truhlar And Truhlar Attys PROPOSAL73Stephen Shaw
1007Maisha Y AmigonJapan2025-07-24Feiner Bros RENEWAL0Ivan Magalhaes
1008Costa F KuskoItaly2025-07-13Printing Dimensions RENEWAL33Asiya Javayant
1009Wickens G SaylorsAustralia2025-08-01Buckley Miller Wright RENEWAL32Asiya Javayant
1010James A GillianIndia2025-07-19Chapman, Ross E Esq NEW47Onyama Limba
1011Leon S PaprockiUnited Kingdom2025-08-05Morlong Associates UNQUALIFIED72Asiya Javayant
1012Chavez N WhobreySpain2025-07-26Feltz Printing Service UNQUALIFIED94Onyama Limba
1013Faith T VocelkaGermany2025-07-18Dorl, James J Esq PROPOSAL59Stephen Shaw
1014Deepesh A KuskoJapan2025-07-14Commercial Press UNQUALIFIED83Asiya Javayant
1015Stacey E NickaAustralia2025-08-08Buckley Miller Wright QUALIFIED63Ivan Magalhaes
1016Maria X InouyeUnited Kingdom2025-07-18Morlong Associates PROPOSAL25Asiya Javayant
1017Maisha S MacleadSpain2025-08-07King, Christopher A Esq NEGOTIATION14Amy Elsner
1018Jeanfrancois C FerenczIndia2025-07-27Truhlar And Truhlar Attys PROPOSAL91Xuxue Feng
1019Tony Y GlickRussia2025-07-16Rangoni Of Florence NEW69Onyama Limba
1020Isabel O ButtUnited Kingdom2025-08-04King, Christopher A Esq QUALIFIED67Asiya Javayant
1021Leon C SlusarskiFrance2025-08-06Commercial Press PROPOSAL64Ioni Bowcher
1022Leja K IturbideRussia2025-07-21Buckley Miller Wright QUALIFIED89Bernardo Dominic
1023Maisha N DoeBrazil2025-08-06Rousseaux, Michael Esq QUALIFIED94Amy Elsner
1024Emily A StensethFrance2025-07-20Chapman, Ross E Esq RENEWAL63Anna Fali
1025Wickens G MorascaAustralia2025-08-06Rousseaux, Michael Esq PROPOSAL97Onyama Limba
1026Kadeem J CaldareraItaly2025-07-23Benton, John B Jr PROPOSAL81Ivan Magalhaes
1027Leja A GarufiCanada2025-07-26Morlong Associates RENEWAL95Bernardo Dominic
1028Aika S NestleGermany2025-07-13King, Christopher A Esq PROPOSAL33Ioni Bowcher
1029Tony G StockhamIndia2025-07-29Chanay, Jeffrey A Esq PROPOSAL66Xuxue Feng
1030Greenwood F GarufiIndia2025-07-29Rousseaux, Michael Esq QUALIFIED40Ivan Magalhaes
1031James J FlosiRussia2025-07-13Dorl, James J Esq PROPOSAL82Xuxue Feng
1032Stacey O MaletRussia2025-07-13King, Christopher A Esq PROPOSAL73Bernardo Dominic
1033Deepesh Y PerinCanada2025-08-06Buckley Miller Wright QUALIFIED17Xuxue Feng
1034James Z CaldareraUnited Kingdom2025-07-17Feltz Printing Service NEW75Anna Fali
1035Cody I NestleGermany2025-08-03Chapman, Ross E Esq NEGOTIATION96Xuxue Feng
1036Ivar W DilliardGermany2025-08-02Buckley Miller Wright QUALIFIED22Amy Elsner
1037Aruna J MorascaFrance2025-07-27Rangoni Of Florence PROPOSAL60Onyama Limba
1038Octavia W PaprockiBrazil2025-07-19Commercial Press NEGOTIATION44Ioni Bowcher
1039Jeanfrancois K SlusarskiSpain2025-08-01Feltz Printing Service NEW9Bernardo Dominic
1040Nicolas D KuskoFrance2025-07-31Morlong Associates NEW63Stephen Shaw
1041Maria I AlbaresItaly2025-08-08Commercial Press NEW69Asiya Javayant
1042Johnson Z FigeroaCanada2025-07-30Feltz Printing Service NEGOTIATION6Onyama Limba
1043Wickens C ShinkoJapan2025-08-01Printing Dimensions PROPOSAL57Onyama Limba
1044Adams C IturbideIndia2025-07-23Benton, John B Jr NEW70Bernardo Dominic
1045Deepesh S BowleyFrance2025-08-02Dorl, James J Esq UNQUALIFIED46Stephen Shaw
1046Faith N GlickAustralia2025-07-20Feiner Bros NEGOTIATION69Ioni Bowcher
1047Kadeem A KuskoJapan2025-07-11Printing Dimensions QUALIFIED43Onyama Limba
1048Munro F GillianSpain2025-07-13Benton, John B Jr UNQUALIFIED12Elwin Sharvill
1049Aditya Q CampainBrazil2025-07-19Commercial Press RENEWAL36Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Tony T AlbaresAustraliaIoni Bowcher PROPOSAL
Smith K SergiRussiaStephen Shaw NEW
Clifford N ChuiGermanyStephen Shaw UNQUALIFIED
Silvio C PaprockiArgentinaStephen Shaw RENEWAL
Adams D GillianItalyElwin Sharvill RENEWAL
Kaitlin Z WieserJapanIvan Magalhaes PROPOSAL
Greenwood E PoquetteAustraliaOnyama Limba NEGOTIATION
Ricardo E KolmetzItalyXuxue Feng NEGOTIATION
Stacey B DilliardArgentinaOnyama Limba PROPOSAL
Izzy F WaycottJapanXuxue Feng RENEWAL
Adams S GlickFranceAnna Fali UNQUALIFIED
Claire F VenereCanadaIvan Magalhaes QUALIFIED
Murillo Y VocelkaSpainIoni Bowcher RENEWAL
Ricardo V ButtBrazilAnna Fali PROPOSAL
Jones S ShinkoArgentinaAmy Elsner UNQUALIFIED
Cody N AlbaresCanadaBernardo Dominic NEW
Costa N CaudyCanadaAmy Elsner PROPOSAL
Izzy N PaprockiArgentinaAnna Fali PROPOSAL
Jeanfrancois F GarufiGermanyElwin Sharvill QUALIFIED
Darci E MorascaArgentinaAnna Fali RENEWAL
Ashley U PaprockiItalyBernardo Dominic UNQUALIFIED
Rodrigues I FollerGermanyOnyama Limba NEW
Leon Y CampainIndiaBernardo Dominic QUALIFIED
Faith H PaprockiItalyXuxue Feng NEW
David B NestleFranceBernardo Dominic NEW
Aditya Y FlosiUnited KingdomBernardo Dominic UNQUALIFIED
Aditya Q WaycottRussiaElwin Sharvill QUALIFIED
Cody J GarufiAustraliaBernardo Dominic NEW
Cody M ButtSpainAmy Elsner PROPOSAL
Chavez Z SaylorsItalyBernardo Dominic PROPOSAL
Silvio W SergiJapanAsiya Javayant NEGOTIATION
Leon Q InouyeArgentinaAsiya Javayant NEGOTIATION
Maria C CaudyAustraliaElwin Sharvill UNQUALIFIED
Rodrigues Z RulapaughRussiaIoni Bowcher UNQUALIFIED
Wickens Q FlosiAustraliaAmy Elsner UNQUALIFIED
Leja B KuskoCanadaIoni Bowcher NEW
James V DilliardCanadaBernardo Dominic QUALIFIED
Smith U WaycottItalyBernardo Dominic RENEWAL
Murillo G SlusarskiArgentinaIvan Magalhaes QUALIFIED
Aika K RutaUnited KingdomIvan Magalhaes NEGOTIATION
Johnson Y CampainGermanyStephen Shaw NEGOTIATION
Nicolas W DarakjyCanadaStephen Shaw NEGOTIATION
Ashley X MaletUnited KingdomBernardo Dominic PROPOSAL
Tony O GauchoCanadaOnyama Limba NEGOTIATION
Isabel Q SlusarskiSpainIoni Bowcher NEW
Adams C CaudyRussiaBernardo Dominic PROPOSAL
Johnson N DarakjyRussiaIoni Bowcher PROPOSAL
Emily R PaprockiGermanyElwin Sharvill QUALIFIED
Kadeem O KuskoSpainXuxue Feng RENEWAL
Adams Z NestleGermanyIvan Magalhaes PROPOSAL
Frozen Columns
Name
Murillo P Amigon
Morrow U Butt
Julie Z Rim
Smith T Royster
Costa J Ruta
Jones D Kusko
Smith G Ruta
Jones E Ruta
Leon L Bowley
Octavia E Royster
Johnson U Stenseth
Mayumi J Flosi
Aika M Sergi
Jones V Stenseth
Ivar Y Poquette
Aruna L Briddick
Silvio U Malet
Mayumi R Morasca
James Q Caudy
Izzy I Caudy
Deepesh K Stockham
Izzy V Glick
Darci X Caudy
Maria D Bolognia
Adams W Sergi
Adams C Campain
Nicolas R Darakjy
Aditya U Bowley
Misaki Q Venere
Johnson U Campain
Morrow C Chui
Cody R Schemmer
Jefferson Z Malet
Faith X Caldarera
Antonio P Oldroyd
Leja G Garufi
Maisha P Vocelka
Antonio B Glick
Izzy E Marrier
Cody G Bowley
Deepesh R Caudy
Alejandro M Shinko
Julie S Bolognia
Johnson U Slusarski
Jones F Shinko
Juan J Perin
Leon K Oldroyd
Emily L Shinko
Mujtaba M Poquette
Ashley L Amigon
IdCountryDate
1000Japan2025-07-10
1001Germany2025-08-07
1002Italy2025-07-17
1003Russia2025-07-17
1004Russia2025-07-20
1005Spain2025-07-26
1006Argentina2025-07-12
1007Australia2025-08-04
1008France2025-07-19
1009Japan2025-07-31
1010France2025-07-28
1011Spain2025-07-13
1012Australia2025-08-05
1013Canada2025-07-13
1014Canada2025-08-06
1015Spain2025-08-02
1016Spain2025-07-26
1017Spain2025-07-15
1018Japan2025-07-11
1019France2025-07-12
1020Canada2025-07-29
1021France2025-08-08
1022United Kingdom2025-07-21
1023India2025-07-29
1024United Kingdom2025-08-05
1025India2025-07-23
1026Brazil2025-07-12
1027Brazil2025-07-26
1028India2025-07-17
1029Argentina2025-07-18
1030Japan2025-08-04
1031Japan2025-08-06
1032Italy2025-07-24
1033United Kingdom2025-07-20
1034France2025-08-02
1035Brazil2025-07-24
1036Japan2025-07-12
1037Japan2025-07-11
1038India2025-07-16
1039Argentina2025-07-17
1040Australia2025-07-22
1041Russia2025-07-27
1042Italy2025-08-06
1043India2025-07-14
1044France2025-07-22
1045Spain2025-07-22
1046India2025-08-08
1047Japan2025-08-02
1048France2025-08-03
1049India2025-08-03

On-Demand Data

NameIdCountryDate
Isabel W Ruta1000Spain2025-08-01
Kadeem G Chui1001Japan2025-07-26
Smith D Morasca1002Germany2025-07-21
Morrow R Royster1003France2025-08-08
Alejandro F Foller1004Russia2025-07-23
Chavez V Morasca1005United Kingdom2025-08-07
Kaitlin W Perin1006India2025-07-31
Maria W Amigon1007Italy2025-07-26
Maisha H Dilliard1008France2025-08-03
Misaki N Nicka1009Japan2025-07-29
Salvatore W Ostrosky1010Germany2025-07-20
Adams B Marrier1011Brazil2025-07-15
Faith R Bowley1012Italy2025-07-29
Aruna H Bowley1013Brazil2025-08-04
Morrow R Nicka1014France2025-07-31
Izzy U Foller1015Spain2025-07-22
Clifford T Gaucho1016Germany2025-07-31
Juan N Butt1017Japan2025-07-25
Tony H Campain1018Germany2025-07-28
Aditya H Albares1019France2025-07-10
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jones S KuskoBrazilAmy Elsner UNQUALIFIED
Arvin O GarufiBrazilAmy Elsner PROPOSAL
Leon A VenereAustraliaStephen Shaw NEGOTIATION
Octavia N PoquetteCanadaBernardo Dominic NEW
James L SergiFranceIvan Magalhaes QUALIFIED
Aditya L WhobreyGermanyIvan Magalhaes NEGOTIATION
Maisha Q CaudyBrazilOnyama Limba QUALIFIED
Greenwood C BowleyAustraliaXuxue Feng QUALIFIED
Adams F GillianJapanOnyama Limba NEW
Smith Z GauchoIndiaAsiya Javayant UNQUALIFIED
Ashley X BologniaAustraliaAsiya Javayant QUALIFIED
Leon L MorascaGermanyIvan Magalhaes PROPOSAL
Jefferson D FerenczGermanyAmy Elsner NEW
Antonio S ChuiGermanyXuxue Feng QUALIFIED
Rodrigues K PerinAustraliaAsiya Javayant PROPOSAL
James R FerenczIndiaElwin Sharvill UNQUALIFIED
Cody D ChuiRussiaXuxue Feng PROPOSAL
Emily F RutaBrazilAmy Elsner UNQUALIFIED
Adams V PoquetteCanadaElwin Sharvill NEGOTIATION
Maisha C FollerRussiaAnna Fali RENEWAL
Leon T FigeroaItalyAmy Elsner RENEWAL
Wickens N WieserBrazilAmy Elsner QUALIFIED
Maria M SergiItalyIoni Bowcher UNQUALIFIED
Jennifer G IturbideCanadaIvan Magalhaes QUALIFIED
Claire G InouyeAustraliaAnna Fali NEW
Emily S FerenczAustraliaElwin Sharvill PROPOSAL
Octavia C CaudyRussiaStephen Shaw UNQUALIFIED
Jeanfrancois T NickaBrazilIoni Bowcher QUALIFIED
Aruna S MaletSpainBernardo Dominic UNQUALIFIED
Murillo K WaycottUnited KingdomBernardo Dominic PROPOSAL
Silvio U ShinkoUnited KingdomXuxue Feng NEGOTIATION
Mayumi X PaprockiCanadaAsiya Javayant NEW
Chavez Y AmigonUnited KingdomBernardo Dominic RENEWAL
Kadeem U OldroydArgentinaStephen Shaw NEGOTIATION
Arvin R SergiAustraliaElwin Sharvill PROPOSAL
Chavez M BowleyJapanXuxue Feng UNQUALIFIED
Jennifer U GlickArgentinaElwin Sharvill QUALIFIED
Alejandro D InouyeBrazilIvan Magalhaes RENEWAL
Silvio Z BowleyRussiaAnna Fali PROPOSAL
Julie T VenereJapanElwin Sharvill 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" frozenColumnsAlignment="left">
            <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>