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
Kaitlin OstroskySpainAnna Fali QUALIFIED
Isabel BowleyUnited KingdomIoni Bowcher UNQUALIFIED
Murillo MaletArgentinaIoni Bowcher NEW
Aditya KuskoUnited KingdomXuxue Feng PROPOSAL
Arvin AlbaresGermanyElwin Sharvill NEW
Tony FollerUnited KingdomStephen Shaw NEGOTIATION
Greenwood BologniaIndiaOnyama Limba NEGOTIATION
Maria MarrierFranceElwin Sharvill RENEWAL
David DarakjySpainStephen Shaw RENEWAL
Rodrigues CampainBrazilIoni Bowcher UNQUALIFIED
Clifford RimUnited KingdomOnyama Limba NEW
Darci PoquetteArgentinaAnna Fali NEW
David DarakjyArgentinaAmy Elsner QUALIFIED
Arvin AlbaresUnited KingdomAsiya Javayant QUALIFIED
Jefferson SchemmerSpainBernardo Dominic QUALIFIED
Jefferson SchemmerUnited KingdomStephen Shaw QUALIFIED
Darci PoquetteRussiaBernardo Dominic UNQUALIFIED
Aruna FigeroaAustraliaStephen Shaw NEGOTIATION
Misaki RoysterBrazilXuxue Feng PROPOSAL
James ButtUnited KingdomIvan Magalhaes RENEWAL
Aika InouyeItalyXuxue Feng RENEWAL
Silvio SlusarskiIndiaIoni Bowcher NEGOTIATION
Mujtaba NickaAustraliaStephen Shaw PROPOSAL
Jennifer AmigonJapanStephen Shaw NEW
Jones VocelkaGermanyXuxue Feng NEW
Tony FollerFranceStephen Shaw NEGOTIATION
Claire TollnerJapanAsiya Javayant QUALIFIED
Morrow RutaFranceAsiya Javayant PROPOSAL
Isabel BowleyBrazilIoni Bowcher NEW
Ivar PaprockiCanadaXuxue Feng QUALIFIED
Ivar PaprockiCanadaXuxue Feng NEGOTIATION
Maisha RulapaughCanadaIvan Magalhaes NEW
Munro FerenczIndiaBernardo Dominic UNQUALIFIED
Stacey MacleadSpainAmy Elsner UNQUALIFIED
Jennifer AmigonSpainStephen Shaw PROPOSAL
Leja CaldareraIndiaStephen Shaw NEGOTIATION
Ricardo GauchoGermanyElwin Sharvill PROPOSAL
Stacey MacleadRussiaAnna Fali UNQUALIFIED
Nicolas IturbideArgentinaOnyama Limba UNQUALIFIED
Faith GillianJapanXuxue Feng PROPOSAL
Alejandro PerinRussiaOnyama Limba PROPOSAL
Nicolas IturbideItalyElwin Sharvill NEW
Murillo MaletItalyStephen Shaw RENEWAL
Johnson SergiRussiaAsiya Javayant NEGOTIATION
Juan WieserJapanBernardo Dominic PROPOSAL
Silvio SlusarskiItalyIvan Magalhaes PROPOSAL
Mujtaba NickaIndiaElwin Sharvill UNQUALIFIED
Francesco ShinkoItalyAnna Fali QUALIFIED
Darci PoquetteBrazilAnna Fali RENEWAL
Rodrigues CampainGermanyIvan Magalhaes UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Claire TollnerCanadaXuxue Feng NEGOTIATION
Alejandro PerinAustraliaAmy Elsner PROPOSAL
Misaki RoysterGermanyXuxue Feng UNQUALIFIED
Mayumi KolmetzGermanyIoni Bowcher QUALIFIED
Aditya KuskoGermanyAmy Elsner RENEWAL
James ButtIndiaBernardo Dominic RENEWAL
Jones VocelkaArgentinaOnyama Limba QUALIFIED
Juan WieserAustraliaOnyama Limba UNQUALIFIED
Misaki RoysterIndiaAnna Fali NEW
Antonio CaudyItalyIoni Bowcher UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Misaki RoysterArgentina2026-05-25Rousseaux, Michael Esq NEGOTIATION94Stephen Shaw
1001Aditya KuskoCanada2026-06-05Chemel, James L Cpa UNQUALIFIED19Onyama Limba
1002Clifford RimBrazil2026-05-21Chemel, James L Cpa PROPOSAL70Ioni Bowcher
1003Maria MarrierUnited Kingdom2026-05-11Buckley Miller Wright RENEWAL4Ivan Magalhaes
1004Salvatore StockhamCanada2026-05-22Rangoni Of Florence NEGOTIATION84Onyama Limba
1005Arvin AlbaresGermany2026-06-02Chanay, Jeffrey A Esq NEW21Anna Fali
1006Leon OldroydAustralia2026-05-13Morlong Associates UNQUALIFIED56Stephen Shaw
1007Deepesh ChuiArgentina2026-05-20Chemel, James L Cpa UNQUALIFIED74Anna Fali
1008Jefferson SchemmerIndia2026-05-11King, Christopher A Esq NEW73Onyama Limba
1009Kaitlin OstroskyRussia2026-05-30Commercial Press QUALIFIED3Asiya Javayant
1010Nicolas IturbideSpain2026-05-14Buckley Miller Wright NEW17Onyama Limba
1011Johnson SergiCanada2026-06-03Chemel, James L Cpa NEGOTIATION53Ioni Bowcher
1012Rodrigues CampainRussia2026-05-20Rangoni Of Florence RENEWAL94Bernardo Dominic
1013Maria MarrierBrazil2026-05-25Chemel, James L Cpa QUALIFIED12Amy Elsner
1014Arvin AlbaresFrance2026-05-08Buckley Miller Wright RENEWAL47Bernardo Dominic
1015Aruna FigeroaFrance2026-05-15Rangoni Of Florence UNQUALIFIED62Onyama Limba
1016Emily WhobreyGermany2026-06-03Dorl, James J Esq UNQUALIFIED16Onyama Limba
1017Aika InouyeGermany2026-05-11Buckley Miller Wright RENEWAL10Amy Elsner
1018Leja CaldareraBrazil2026-05-26Feiner Bros NEGOTIATION87Xuxue Feng
1019Arvin AlbaresArgentina2026-05-25Benton, John B Jr NEW81Bernardo Dominic
1020Wickens NestleCanada2026-05-12Rangoni Of Florence UNQUALIFIED81Ioni Bowcher
1021Costa DilliardRussia2026-05-12Commercial Press NEW38Anna Fali
1022Faith GillianRussia2026-05-27Rousseaux, Michael Esq RENEWAL24Amy Elsner
1023Sinclair WaycottFrance2026-05-26Commercial Press NEW88Elwin Sharvill
1024Tony FollerRussia2026-06-02Dorl, James J Esq NEGOTIATION67Stephen Shaw
1025Kaitlin OstroskyGermany2026-05-26Rangoni Of Florence NEW99Anna Fali
1026Sinclair WaycottCanada2026-05-23Chemel, James L Cpa NEW27Elwin Sharvill
1027Clifford RimCanada2026-06-01Feltz Printing Service PROPOSAL54Anna Fali
1028Ricardo GauchoSpain2026-05-22King, Christopher A Esq RENEWAL42Bernardo Dominic
1029Wickens NestleSpain2026-05-21Chemel, James L Cpa NEGOTIATION35Anna Fali
1030Ivar PaprockiSpain2026-05-16Buckley Miller Wright NEGOTIATION34Anna Fali
1031Darci PoquetteArgentina2026-05-17Buckley Miller Wright QUALIFIED22Onyama Limba
1032Adams MorascaUnited Kingdom2026-05-17Chemel, James L Cpa NEGOTIATION13Anna Fali
1033Julie StensethItaly2026-05-28Chanay, Jeffrey A Esq QUALIFIED84Xuxue Feng
1034Alejandro PerinRussia2026-05-28Feltz Printing Service QUALIFIED43Ioni Bowcher
1035Mujtaba NickaSpain2026-05-21Truhlar And Truhlar Attys QUALIFIED85Onyama Limba
1036Antonio CaudyIndia2026-05-25Truhlar And Truhlar Attys NEW55Onyama Limba
1037Greenwood BologniaAustralia2026-05-26Morlong Associates UNQUALIFIED66Asiya Javayant
1038Aika InouyeSpain2026-05-18Morlong Associates NEW17Xuxue Feng
1039Alejandro PerinSpain2026-05-13Benton, John B Jr NEW47Ivan Magalhaes
1040Misaki RoysterAustralia2026-05-08Feltz Printing Service RENEWAL67Stephen Shaw
1041Misaki RoysterCanada2026-05-18Chanay, Jeffrey A Esq QUALIFIED17Amy Elsner
1042Stacey MacleadGermany2026-05-08Feltz Printing Service UNQUALIFIED74Ivan Magalhaes
1043Misaki RoysterFrance2026-06-01Chanay, Jeffrey A Esq PROPOSAL31Bernardo Dominic
1044Ivar PaprockiItaly2026-05-11Rousseaux, Michael Esq NEGOTIATION43Ivan Magalhaes
1045Arvin AlbaresFrance2026-05-25Feiner Bros UNQUALIFIED7Elwin Sharvill
1046Ashley DoeIndia2026-05-23Chanay, Jeffrey A Esq QUALIFIED55Elwin Sharvill
1047Deepesh ChuiIndia2026-06-05Printing Dimensions PROPOSAL1Elwin Sharvill
1048Stacey MacleadIndia2026-06-02Benton, John B Jr NEW55Onyama Limba
1049Ivar PaprockiSpain2026-06-05Chemel, James L Cpa RENEWAL17Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Jennifer AmigonArgentinaIvan Magalhaes NEW
Jeanfrancois VenereJapanIoni Bowcher QUALIFIED
Misaki RoysterArgentinaIoni Bowcher RENEWAL
Faith GillianRussiaIvan Magalhaes NEGOTIATION
Misaki RoysterBrazilIoni Bowcher RENEWAL
Darci PoquetteBrazilXuxue Feng PROPOSAL
Jennifer AmigonSpainAmy Elsner NEW
Izzy GarufiSpainXuxue Feng NEW
Greenwood BologniaIndiaElwin Sharvill UNQUALIFIED
Greenwood BologniaJapanStephen Shaw NEGOTIATION
Greenwood BologniaUnited KingdomOnyama Limba NEW
Octavia MaletJapanIvan Magalhaes NEGOTIATION
James ButtIndiaBernardo Dominic NEW
Claire TollnerAustraliaOnyama Limba PROPOSAL
Jones VocelkaAustraliaBernardo Dominic PROPOSAL
Stacey MacleadArgentinaBernardo Dominic RENEWAL
Costa DilliardItalyXuxue Feng PROPOSAL
Johnson SergiRussiaOnyama Limba NEW
Jefferson SchemmerUnited KingdomIoni Bowcher UNQUALIFIED
Clifford RimFranceIoni Bowcher QUALIFIED
Isabel BowleyFranceXuxue Feng RENEWAL
David DarakjyJapanOnyama Limba PROPOSAL
Murillo MaletIndiaBernardo Dominic NEGOTIATION
Jeanfrancois VenereRussiaIvan Magalhaes PROPOSAL
Rodrigues CampainArgentinaBernardo Dominic NEW
David DarakjyIndiaAmy Elsner RENEWAL
Octavia MaletSpainXuxue Feng PROPOSAL
Adams MorascaRussiaElwin Sharvill RENEWAL
Kadeem FlosiBrazilIvan Magalhaes NEW
Isabel BowleySpainIvan Magalhaes RENEWAL
Clifford RimGermanyAsiya Javayant NEGOTIATION
Aika InouyeFranceElwin Sharvill NEGOTIATION
Clifford RimCanadaIoni Bowcher NEGOTIATION
Munro FerenczAustraliaBernardo Dominic RENEWAL
Adams MorascaSpainElwin Sharvill NEW
Munro FerenczItalyElwin Sharvill RENEWAL
Morrow RutaJapanElwin Sharvill PROPOSAL
Ivar PaprockiGermanyStephen Shaw PROPOSAL
Francesco ShinkoFranceAnna Fali UNQUALIFIED
James ButtUnited KingdomIoni Bowcher PROPOSAL
Nicolas IturbideFranceStephen Shaw RENEWAL
Antonio CaudyIndiaBernardo Dominic PROPOSAL
Ivar PaprockiSpainIoni Bowcher NEGOTIATION
Smith GlickIndiaElwin Sharvill QUALIFIED
Morrow RutaGermanyElwin Sharvill QUALIFIED
Leon OldroydBrazilAnna Fali RENEWAL
Leja CaldareraSpainIoni Bowcher NEGOTIATION
Faith GillianFranceAsiya Javayant PROPOSAL
Ivar PaprockiBrazilAnna Fali PROPOSAL
Jeanfrancois VenereBrazilAmy Elsner RENEWAL
Frozen Columns
Name
Silvio Slusarski
Jones Vocelka
Deepesh Chui
Mujtaba Nicka
Mujtaba Nicka
Emily Whobrey
Costa Dilliard
Aditya Kusko
Aruna Figeroa
Mayumi Kolmetz
Izzy Garufi
Darci Poquette
Rodrigues Campain
Murillo Malet
David Darakjy
Johnson Sergi
Jones Vocelka
Aika Inouye
Cody Saylors
Aditya Kusko
Tony Foller
Clifford Rim
Isabel Bowley
Arvin Albares
Wickens Nestle
Leja Caldarera
Kadeem Flosi
Juan Wieser
Greenwood Bolognia
Wickens Nestle
Jennifer Amigon
Tony Foller
James Butt
Munro Ferencz
Maria Marrier
Leja Caldarera
Tony Foller
Jones Vocelka
Jeanfrancois Venere
Leon Oldroyd
Costa Dilliard
Kadeem Flosi
Misaki Royster
Darci Poquette
Francesco Shinko
Misaki Royster
Arvin Albares
Cody Saylors
Stacey Maclead
Faith Gillian
IdCountryDate
1000Brazil2026-05-16
1001Russia2026-05-13
1002Japan2026-05-14
1003Australia2026-05-12
1004Japan2026-05-25
1005Canada2026-06-02
1006Russia2026-05-18
1007Australia2026-05-17
1008Russia2026-05-20
1009United Kingdom2026-06-04
1010Germany2026-05-28
1011France2026-05-24
1012Russia2026-05-31
1013Japan2026-05-30
1014Russia2026-06-04
1015Argentina2026-05-07
1016Argentina2026-06-03
1017Germany2026-05-29
1018Spain2026-05-07
1019Brazil2026-05-11
1020Australia2026-05-31
1021India2026-05-09
1022Canada2026-05-29
1023India2026-06-04
1024India2026-05-11
1025France2026-06-05
1026Italy2026-05-23
1027United Kingdom2026-05-12
1028Brazil2026-06-03
1029Germany2026-05-19
1030Brazil2026-05-31
1031Russia2026-05-22
1032Spain2026-05-29
1033Russia2026-05-12
1034Germany2026-05-30
1035Japan2026-05-30
1036Brazil2026-05-30
1037Spain2026-05-11
1038Brazil2026-05-29
1039Australia2026-06-04
1040Canada2026-05-11
1041United Kingdom2026-05-26
1042India2026-05-26
1043Italy2026-06-02
1044Australia2026-05-15
1045Canada2026-05-22
1046Argentina2026-06-01
1047Italy2026-05-26
1048Spain2026-05-23
1049Italy2026-05-23

On-Demand Data

NameIdCountryDate
Aditya Kusko1000Russia2026-05-23
Cody Saylors1001Spain2026-06-05
Rodrigues Campain1002Brazil2026-05-19
Aika Inouye1003Australia2026-05-28
Cody Saylors1004India2026-05-12
Octavia Malet1005Australia2026-05-15
Nicolas Iturbide1006Italy2026-05-13
Munro Ferencz1007France2026-05-20
Emily Whobrey1008Australia2026-05-24
Leon Oldroyd1009India2026-05-23
Julie Stenseth1010Brazil2026-06-05
Kaitlin Ostrosky1011France2026-05-17
Sinclair Waycott1012Japan2026-05-22
Ricardo Gaucho1013India2026-06-05
Ivar Paprocki1014Germany2026-06-02
Aruna Figeroa1015Argentina2026-05-09
Mayumi Kolmetz1016Canada2026-05-15
Adams Morasca1017Russia2026-05-18
Greenwood Bolognia1018Germany2026-06-02
Kadeem Flosi1019United Kingdom2026-05-11
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
David DarakjySpainXuxue Feng QUALIFIED
Maria MarrierBrazilOnyama Limba NEW
Francesco ShinkoUnited KingdomIoni Bowcher PROPOSAL
Antonio CaudyItalyIvan Magalhaes PROPOSAL
Rodrigues CampainCanadaOnyama Limba QUALIFIED
Leon OldroydBrazilIvan Magalhaes NEGOTIATION
Claire TollnerBrazilStephen Shaw NEGOTIATION
Clifford RimItalyAsiya Javayant NEGOTIATION
Greenwood BologniaUnited KingdomAnna Fali NEGOTIATION
Sinclair WaycottJapanIvan Magalhaes RENEWAL
Jeanfrancois VenereBrazilAnna Fali UNQUALIFIED
Sinclair WaycottIndiaAsiya Javayant PROPOSAL
Deepesh ChuiSpainAsiya Javayant PROPOSAL
Maria MarrierIndiaAmy Elsner PROPOSAL
Alejandro PerinIndiaOnyama Limba RENEWAL
Ivar PaprockiCanadaIoni Bowcher QUALIFIED
Clifford RimSpainAmy Elsner NEW
Jennifer AmigonGermanyAnna Fali PROPOSAL
Leon OldroydIndiaBernardo Dominic UNQUALIFIED
Johnson SergiCanadaBernardo Dominic QUALIFIED
James ButtUnited KingdomOnyama Limba UNQUALIFIED
Smith GlickAustraliaIvan Magalhaes QUALIFIED
Jennifer AmigonFranceOnyama Limba NEW
Smith GlickCanadaElwin Sharvill NEW
Johnson SergiCanadaIvan Magalhaes RENEWAL
Ricardo GauchoUnited KingdomIvan Magalhaes RENEWAL
Nicolas IturbideRussiaIoni Bowcher PROPOSAL
Stacey MacleadRussiaXuxue Feng RENEWAL
Arvin AlbaresFranceIoni Bowcher QUALIFIED
James ButtFranceBernardo Dominic QUALIFIED
Deepesh ChuiJapanAnna Fali QUALIFIED
Kaitlin OstroskyIndiaIvan Magalhaes NEW
Deepesh ChuiArgentinaIoni Bowcher UNQUALIFIED
Wickens NestleArgentinaAmy Elsner UNQUALIFIED
Chavez BriddickJapanIoni Bowcher QUALIFIED
Misaki RoysterCanadaXuxue Feng UNQUALIFIED
Morrow RutaArgentinaAnna Fali NEGOTIATION
Wickens NestleFranceXuxue Feng NEGOTIATION
Misaki RoysterFranceOnyama Limba UNQUALIFIED
Isabel BowleyGermanyAnna Fali 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.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>