Locale

Language
English
English
English
French
German
German
German
Italian
Korean
Spanish
Catalan
Dutch
Portuguese
Portuguese
Arabic
Arabic
Bulgarian
Bangla
Bosnian
Czech
Greek
Estonian
Persian
Finnish
Danish
Hindi
Indonesian
Icelandic
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

Free Themes

Built-in component themes created by the PrimeFaces Theme Designer.

Saga Saga
Vela Vela
Arya Arya

Legacy Free Themes

Luna Amber Luna Amber
Luna Blue Luna Blue
Luna Green Luna Green
Luna Pink Luna Pink
Nova Nova
Nova Nova Alt
Nova Nova Accent

DataTable Scroll

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

Vertical
NameCountryRepresentativeStatus
Mayumi KolmetzJapanXuxue Feng RENEWAL
Deepesh ChuiFranceAmy Elsner RENEWAL
Maisha RulapaughItalyElwin Sharvill PROPOSAL
Ivar PaprockiJapanIoni Bowcher NEGOTIATION
Kaitlin OstroskyJapanIoni Bowcher NEGOTIATION
Maisha RulapaughFranceIoni Bowcher UNQUALIFIED
Mujtaba NickaCanadaIoni Bowcher RENEWAL
Faith GillianGermanyAnna Fali PROPOSAL
Rodrigues CampainAustraliaIoni Bowcher RENEWAL
Maisha RulapaughUnited KingdomIoni Bowcher PROPOSAL
Aika InouyeUnited KingdomStephen Shaw NEW
Stacey MacleadArgentinaOnyama Limba NEW
Antonio CaudyAustraliaIvan Magalhaes UNQUALIFIED
Isabel BowleyFranceAmy Elsner RENEWAL
Clifford RimCanadaOnyama Limba NEGOTIATION
Antonio CaudyArgentinaIvan Magalhaes QUALIFIED
Maisha RulapaughBrazilBernardo Dominic RENEWAL
Antonio CaudyItalyAnna Fali NEGOTIATION
Leja CaldareraAustraliaAmy Elsner NEW
Claire TollnerJapanBernardo Dominic RENEWAL
Aruna FigeroaAustraliaXuxue Feng NEW
Jeanfrancois VenereBrazilAnna Fali UNQUALIFIED
David DarakjyUnited KingdomXuxue Feng QUALIFIED
Jennifer AmigonUnited KingdomElwin Sharvill UNQUALIFIED
Murillo MaletCanadaAmy Elsner NEGOTIATION
Deepesh ChuiBrazilIvan Magalhaes PROPOSAL
Julie StensethItalyIoni Bowcher NEGOTIATION
Jones VocelkaSpainAnna Fali QUALIFIED
Faith GillianUnited KingdomIoni Bowcher RENEWAL
Rodrigues CampainSpainOnyama Limba PROPOSAL
Emily WhobreyFranceAmy Elsner NEW
Wickens NestleBrazilAsiya Javayant NEGOTIATION
Rodrigues CampainItalyAmy Elsner RENEWAL
Emily WhobreyItalyElwin Sharvill QUALIFIED
Maria MarrierGermanyIvan Magalhaes PROPOSAL
Leon OldroydSpainAnna Fali NEGOTIATION
Aditya KuskoArgentinaAmy Elsner NEW
Morrow RutaGermanyXuxue Feng QUALIFIED
Ashley DoeSpainOnyama Limba QUALIFIED
Jennifer AmigonArgentinaStephen Shaw NEGOTIATION
Greenwood BologniaCanadaIvan Magalhaes NEGOTIATION
Nicolas IturbideRussiaAnna Fali QUALIFIED
Tony FollerFranceIvan Magalhaes NEW
Morrow RutaCanadaOnyama Limba RENEWAL
Chavez BriddickRussiaXuxue Feng NEGOTIATION
Adams MorascaArgentinaXuxue Feng UNQUALIFIED
Tony FollerBrazilAnna Fali QUALIFIED
Izzy GarufiJapanAnna Fali NEW
Octavia MaletItalyIoni Bowcher QUALIFIED
Greenwood BologniaBrazilXuxue Feng RENEWAL
Horizontal
NameCountryRepresentativeStatus
Ashley DoeUnited KingdomAsiya Javayant NEGOTIATION
Salvatore StockhamAustraliaBernardo Dominic QUALIFIED
Ashley DoeFranceOnyama Limba NEGOTIATION
Smith GlickRussiaBernardo Dominic PROPOSAL
James ButtBrazilOnyama Limba UNQUALIFIED
Stacey MacleadUnited KingdomXuxue Feng NEW
Smith GlickFranceXuxue Feng UNQUALIFIED
Jeanfrancois VenereGermanyAsiya Javayant NEGOTIATION
Costa DilliardUnited KingdomAmy Elsner UNQUALIFIED
Johnson SergiFranceAnna Fali NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Leon OldroydBrazil2026-05-19Dorl, James J Esq NEW99Asiya Javayant
1001Maria MarrierFrance2026-05-10Rangoni Of Florence RENEWAL80Amy Elsner
1002Isabel BowleyArgentina2026-05-22Chanay, Jeffrey A Esq QUALIFIED18Ivan Magalhaes
1003Jefferson SchemmerAustralia2026-05-13King, Christopher A Esq NEW69Onyama Limba
1004Ivar PaprockiAustralia2026-05-16Commercial Press UNQUALIFIED91Anna Fali
1005Faith GillianItaly2026-05-14Rousseaux, Michael Esq NEW82Asiya Javayant
1006Greenwood BologniaItaly2026-05-14Commercial Press NEW23Ivan Magalhaes
1007Ivar PaprockiRussia2026-05-13Feiner Bros NEGOTIATION96Ivan Magalhaes
1008Greenwood BologniaCanada2026-04-27King, Christopher A Esq RENEWAL55Bernardo Dominic
1009Jeanfrancois VenereCanada2026-05-22Truhlar And Truhlar Attys NEW19Amy Elsner
1010Claire TollnerCanada2026-05-11Chapman, Ross E Esq NEGOTIATION94Bernardo Dominic
1011Mujtaba NickaRussia2026-05-05Feltz Printing Service NEGOTIATION5Bernardo Dominic
1012Emily WhobreyGermany2026-04-26Feiner Bros QUALIFIED62Anna Fali
1013Misaki RoysterJapan2026-05-09Rangoni Of Florence NEGOTIATION80Stephen Shaw
1014Rodrigues CampainIndia2026-05-21Rousseaux, Michael Esq NEGOTIATION52Stephen Shaw
1015Isabel BowleyJapan2026-05-02Rangoni Of Florence RENEWAL25Bernardo Dominic
1016Munro FerenczJapan2026-05-02Truhlar And Truhlar Attys QUALIFIED43Elwin Sharvill
1017Darci PoquetteFrance2026-05-15Rousseaux, Michael Esq RENEWAL66Onyama Limba
1018David DarakjyItaly2026-04-23Chapman, Ross E Esq UNQUALIFIED99Amy Elsner
1019Faith GillianCanada2026-04-24Morlong Associates NEW98Elwin Sharvill
1020Isabel BowleySpain2026-05-01Benton, John B Jr PROPOSAL36Stephen Shaw
1021Morrow RutaSpain2026-05-04Chemel, James L Cpa RENEWAL46Anna Fali
1022Kaitlin OstroskyRussia2026-05-05Chapman, Ross E Esq PROPOSAL84Onyama Limba
1023Greenwood BologniaJapan2026-05-01Chapman, Ross E Esq UNQUALIFIED32Elwin Sharvill
1024Jones VocelkaItaly2026-04-30Buckley Miller Wright NEW37Stephen Shaw
1025Jones VocelkaBrazil2026-04-23Morlong Associates RENEWAL56Asiya Javayant
1026Mayumi KolmetzItaly2026-05-21Truhlar And Truhlar Attys QUALIFIED93Xuxue Feng
1027Jefferson SchemmerSpain2026-05-19Rangoni Of Florence NEGOTIATION90Onyama Limba
1028Clifford RimIndia2026-04-30Rousseaux, Michael Esq RENEWAL21Ivan Magalhaes
1029Clifford RimRussia2026-05-06Morlong Associates QUALIFIED62Ioni Bowcher
1030Johnson SergiJapan2026-05-21Printing Dimensions NEW10Bernardo Dominic
1031Nicolas IturbideGermany2026-04-24Rousseaux, Michael Esq PROPOSAL63Asiya Javayant
1032Salvatore StockhamUnited Kingdom2026-04-27Morlong Associates NEW53Bernardo Dominic
1033Smith GlickGermany2026-05-05Feltz Printing Service QUALIFIED65Anna Fali
1034Rodrigues CampainSpain2026-05-05Feltz Printing Service PROPOSAL43Amy Elsner
1035Alejandro PerinCanada2026-05-12Chapman, Ross E Esq RENEWAL54Elwin Sharvill
1036Murillo MaletUnited Kingdom2026-05-02Buckley Miller Wright QUALIFIED62Ivan Magalhaes
1037Tony FollerCanada2026-05-08Chanay, Jeffrey A Esq NEGOTIATION47Bernardo Dominic
1038Ricardo GauchoUnited Kingdom2026-05-01Buckley Miller Wright RENEWAL20Amy Elsner
1039Kadeem FlosiBrazil2026-04-29Feltz Printing Service RENEWAL82Onyama Limba
1040Tony FollerBrazil2026-05-11Chapman, Ross E Esq RENEWAL1Ivan Magalhaes
1041Ashley DoeGermany2026-05-02Rangoni Of Florence RENEWAL44Bernardo Dominic
1042Murillo MaletJapan2026-05-19Truhlar And Truhlar Attys NEGOTIATION45Anna Fali
1043Costa DilliardIndia2026-04-23Chapman, Ross E Esq PROPOSAL53Ioni Bowcher
1044Greenwood BologniaItaly2026-05-10Printing Dimensions QUALIFIED99Amy Elsner
1045Nicolas IturbideRussia2026-05-12Feltz Printing Service PROPOSAL23Elwin Sharvill
1046Jones VocelkaRussia2026-05-18Rangoni Of Florence NEGOTIATION26Amy Elsner
1047Darci PoquetteItaly2026-05-08Commercial Press PROPOSAL88Ivan Magalhaes
1048Misaki RoysterUnited Kingdom2026-04-24Benton, John B Jr RENEWAL35Onyama Limba
1049Silvio SlusarskiGermany2026-05-16Truhlar And Truhlar Attys PROPOSAL89Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Ashley DoeIndiaIoni Bowcher NEGOTIATION
Morrow RutaAustraliaBernardo Dominic RENEWAL
Jones VocelkaBrazilElwin Sharvill NEW
Jones VocelkaAustraliaAsiya Javayant QUALIFIED
David DarakjyFranceAnna Fali RENEWAL
Costa DilliardJapanElwin Sharvill NEGOTIATION
Mujtaba NickaGermanyBernardo Dominic PROPOSAL
Sinclair WaycottCanadaStephen Shaw NEW
Salvatore StockhamRussiaElwin Sharvill RENEWAL
Morrow RutaAustraliaAmy Elsner NEW
Aika InouyeItalyBernardo Dominic RENEWAL
Darci PoquetteJapanAsiya Javayant RENEWAL
Ricardo GauchoCanadaStephen Shaw RENEWAL
Ashley DoeAustraliaAsiya Javayant UNQUALIFIED
Morrow RutaFranceAsiya Javayant NEW
Mujtaba NickaItalyOnyama Limba UNQUALIFIED
Tony FollerUnited KingdomXuxue Feng NEW
Juan WieserGermanyAsiya Javayant NEGOTIATION
Mujtaba NickaCanadaXuxue Feng UNQUALIFIED
James ButtRussiaBernardo Dominic RENEWAL
Silvio SlusarskiRussiaAmy Elsner NEGOTIATION
Silvio SlusarskiAustraliaElwin Sharvill UNQUALIFIED
Mayumi KolmetzCanadaAmy Elsner PROPOSAL
Maisha RulapaughIndiaStephen Shaw PROPOSAL
Wickens NestleFranceBernardo Dominic QUALIFIED
Clifford RimAustraliaStephen Shaw NEGOTIATION
Sinclair WaycottGermanyElwin Sharvill UNQUALIFIED
Clifford RimArgentinaIvan Magalhaes RENEWAL
Alejandro PerinArgentinaAmy Elsner RENEWAL
Jennifer AmigonBrazilAmy Elsner QUALIFIED
Jeanfrancois VenereJapanStephen Shaw QUALIFIED
Antonio CaudyRussiaIoni Bowcher QUALIFIED
Aruna FigeroaFranceBernardo Dominic NEGOTIATION
Stacey MacleadIndiaOnyama Limba UNQUALIFIED
Claire TollnerArgentinaIoni Bowcher UNQUALIFIED
Leon OldroydItalyAnna Fali NEGOTIATION
Aditya KuskoIndiaElwin Sharvill NEW
Arvin AlbaresJapanAmy Elsner NEGOTIATION
Tony FollerArgentinaAmy Elsner NEGOTIATION
Jefferson SchemmerFranceXuxue Feng NEW
Jeanfrancois VenereAustraliaXuxue Feng NEGOTIATION
Greenwood BologniaRussiaOnyama Limba NEGOTIATION
Silvio SlusarskiJapanAmy Elsner NEGOTIATION
Jefferson SchemmerIndiaBernardo Dominic NEGOTIATION
Clifford RimIndiaIoni Bowcher NEW
Murillo MaletUnited KingdomStephen Shaw RENEWAL
Greenwood BologniaIndiaAmy Elsner QUALIFIED
Smith GlickJapanBernardo Dominic NEW
Isabel BowleyItalyAnna Fali UNQUALIFIED
Juan WieserSpainIoni Bowcher RENEWAL
Frozen Columns
Name
Murillo Malet
Murillo Malet
Isabel Bowley
Stacey Maclead
Salvatore Stockham
Misaki Royster
Johnson Sergi
Ricardo Gaucho
Ashley Doe
Aditya Kusko
Maisha Rulapaugh
Jones Vocelka
Adams Morasca
Leon Oldroyd
Murillo Malet
Salvatore Stockham
Johnson Sergi
Leon Oldroyd
Rodrigues Campain
Aditya Kusko
Darci Poquette
Adams Morasca
David Darakjy
Munro Ferencz
Nicolas Iturbide
Sinclair Waycott
Ivar Paprocki
Aika Inouye
Antonio Caudy
Misaki Royster
Leon Oldroyd
Juan Wieser
Sinclair Waycott
Aditya Kusko
Murillo Malet
Johnson Sergi
Julie Stenseth
Ashley Doe
David Darakjy
Maria Marrier
Deepesh Chui
Clifford Rim
Antonio Caudy
Nicolas Iturbide
Alejandro Perin
Maria Marrier
Wickens Nestle
Leon Oldroyd
Clifford Rim
Jones Vocelka
IdCountryDate
1000India2026-05-06
1001Australia2026-05-21
1002Spain2026-05-13
1003Brazil2026-05-15
1004Russia2026-04-26
1005Canada2026-05-11
1006Spain2026-05-16
1007Australia2026-05-04
1008Argentina2026-04-24
1009France2026-05-01
1010Russia2026-05-08
1011Germany2026-05-08
1012Australia2026-05-01
1013Russia2026-05-01
1014Spain2026-04-23
1015India2026-04-27
1016Japan2026-05-17
1017Germany2026-05-01
1018Spain2026-04-23
1019United Kingdom2026-05-10
1020Italy2026-05-14
1021Brazil2026-05-22
1022Brazil2026-05-22
1023Argentina2026-05-18
1024Argentina2026-05-20
1025Germany2026-05-12
1026Argentina2026-05-01
1027United Kingdom2026-05-22
1028Italy2026-04-25
1029France2026-05-19
1030Japan2026-05-06
1031Spain2026-05-16
1032Brazil2026-05-02
1033India2026-05-20
1034Germany2026-05-04
1035Australia2026-05-13
1036Spain2026-05-07
1037Argentina2026-04-30
1038Russia2026-05-22
1039United Kingdom2026-05-17
1040Australia2026-04-24
1041Australia2026-05-16
1042Canada2026-05-15
1043Germany2026-05-09
1044Canada2026-05-13
1045United Kingdom2026-05-15
1046France2026-05-15
1047Australia2026-05-21
1048United Kingdom2026-04-29
1049Brazil2026-05-11

On-Demand Data

NameIdCountryDate
Aika Inouye1000Brazil2026-05-07
Costa Dilliard1001Australia2026-05-07
Clifford Rim1002Germany2026-04-23
Kadeem Flosi1003Germany2026-05-07
Deepesh Chui1004Japan2026-05-03
Deepesh Chui1005Spain2026-05-07
Morrow Ruta1006Australia2026-04-23
Sinclair Waycott1007Spain2026-05-17
Faith Gillian1008Italy2026-05-08
Jennifer Amigon1009Italy2026-05-19
Greenwood Bolognia1010Russia2026-05-20
Munro Ferencz1011Canada2026-05-21
Aika Inouye1012Argentina2026-05-01
Misaki Royster1013United Kingdom2026-05-01
Tony Foller1014Brazil2026-05-18
Jennifer Amigon1015Australia2026-04-26
Kaitlin Ostrosky1016Argentina2026-05-12
Stacey Maclead1017Italy2026-05-16
Deepesh Chui1018Brazil2026-05-06
Clifford Rim1019Australia2026-05-19
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Francesco ShinkoFranceStephen Shaw PROPOSAL
Aruna FigeroaRussiaIvan Magalhaes PROPOSAL
Murillo MaletUnited KingdomAsiya Javayant NEGOTIATION
Alejandro PerinFranceAmy Elsner NEW
Johnson SergiItalyOnyama Limba NEW
Wickens NestleSpainAmy Elsner PROPOSAL
Silvio SlusarskiIndiaBernardo Dominic NEGOTIATION
Cody SaylorsArgentinaIoni Bowcher QUALIFIED
Ivar PaprockiSpainStephen Shaw QUALIFIED
Clifford RimUnited KingdomElwin Sharvill UNQUALIFIED
Jeanfrancois VenereUnited KingdomIoni Bowcher RENEWAL
Aditya KuskoBrazilAnna Fali PROPOSAL
Maria MarrierFranceXuxue Feng RENEWAL
Smith GlickGermanyOnyama Limba QUALIFIED
Faith GillianUnited KingdomAnna Fali RENEWAL
Mayumi KolmetzUnited KingdomAnna Fali NEW
Antonio CaudyItalyIvan Magalhaes NEGOTIATION
Kaitlin OstroskyFranceAnna Fali QUALIFIED
Alejandro PerinSpainAnna Fali NEGOTIATION
Maria MarrierJapanElwin Sharvill UNQUALIFIED
Munro FerenczUnited KingdomBernardo Dominic QUALIFIED
Chavez BriddickAustraliaXuxue Feng UNQUALIFIED
James ButtUnited KingdomIoni Bowcher NEGOTIATION
James ButtIndiaStephen Shaw NEW
Munro FerenczItalyAsiya Javayant NEW
Jones VocelkaSpainXuxue Feng NEW
Aruna FigeroaGermanyBernardo Dominic RENEWAL
Murillo MaletSpainStephen Shaw RENEWAL
Murillo MaletSpainStephen Shaw RENEWAL
Kadeem FlosiIndiaAmy Elsner RENEWAL
Jones VocelkaRussiaElwin Sharvill NEGOTIATION
Antonio CaudyItalyXuxue Feng RENEWAL
Cody SaylorsRussiaAsiya Javayant NEW
Tony FollerCanadaIvan Magalhaes UNQUALIFIED
Isabel BowleyItalyBernardo Dominic UNQUALIFIED
Tony FollerUnited KingdomIoni Bowcher QUALIFIED
Octavia MaletItalyAnna Fali UNQUALIFIED
Munro FerenczFranceAmy Elsner UNQUALIFIED
Wickens NestleUnited KingdomBernardo Dominic NEW
Murillo MaletRussiaIvan Magalhaes QUALIFIED

<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.statusName}">#{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.statusName}">#{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.statusName}">#{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.statusName}">#{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.statusName}">#{customer.status}</span>
            </p:column>
        </p:dataTable>
    </div>

</h:form>