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
Jefferson SchemmerIndiaIvan Magalhaes PROPOSAL
Leja CaldareraGermanyAnna Fali RENEWAL
Arvin AlbaresRussiaStephen Shaw RENEWAL
Misaki RoysterSpainStephen Shaw NEW
Leon OldroydFranceBernardo Dominic NEW
Wickens NestleCanadaAsiya Javayant PROPOSAL
Leon OldroydRussiaAnna Fali NEGOTIATION
Aika InouyeFranceElwin Sharvill RENEWAL
Arvin AlbaresGermanyElwin Sharvill UNQUALIFIED
Aditya KuskoFranceXuxue Feng NEW
Emily WhobreyArgentinaElwin Sharvill PROPOSAL
Aruna FigeroaItalyElwin Sharvill UNQUALIFIED
Juan WieserJapanIoni Bowcher NEGOTIATION
Adams MorascaCanadaStephen Shaw QUALIFIED
Mayumi KolmetzCanadaAnna Fali RENEWAL
Faith GillianItalyAsiya Javayant NEW
Maria MarrierBrazilAnna Fali NEW
Jeanfrancois VenereJapanElwin Sharvill RENEWAL
Greenwood BologniaIndiaElwin Sharvill QUALIFIED
Silvio SlusarskiSpainAnna Fali NEGOTIATION
Jefferson SchemmerAustraliaElwin Sharvill RENEWAL
Antonio CaudyUnited KingdomElwin Sharvill QUALIFIED
Leon OldroydBrazilIvan Magalhaes PROPOSAL
Jennifer AmigonItalyElwin Sharvill UNQUALIFIED
Jeanfrancois VenereIndiaElwin Sharvill RENEWAL
Jeanfrancois VenereJapanBernardo Dominic NEW
Antonio CaudySpainElwin Sharvill UNQUALIFIED
Octavia MaletCanadaOnyama Limba RENEWAL
Julie StensethAustraliaAmy Elsner QUALIFIED
Leja CaldareraIndiaStephen Shaw QUALIFIED
Sinclair WaycottAustraliaElwin Sharvill QUALIFIED
Chavez BriddickAustraliaXuxue Feng RENEWAL
Aruna FigeroaAustraliaElwin Sharvill RENEWAL
Aruna FigeroaFranceStephen Shaw PROPOSAL
Izzy GarufiJapanIvan Magalhaes NEGOTIATION
Antonio CaudyArgentinaElwin Sharvill QUALIFIED
Morrow RutaItalyIoni Bowcher NEGOTIATION
Ivar PaprockiCanadaIoni Bowcher NEW
Kadeem FlosiUnited KingdomIoni Bowcher UNQUALIFIED
David DarakjyUnited KingdomOnyama Limba NEGOTIATION
Arvin AlbaresIndiaXuxue Feng PROPOSAL
Jeanfrancois VenereCanadaOnyama Limba UNQUALIFIED
Jefferson SchemmerFranceAsiya Javayant NEGOTIATION
Juan WieserAustraliaStephen Shaw NEW
Kaitlin OstroskyGermanyElwin Sharvill PROPOSAL
Clifford RimGermanyOnyama Limba QUALIFIED
Stacey MacleadFranceStephen Shaw UNQUALIFIED
Aruna FigeroaGermanyOnyama Limba NEGOTIATION
Maria MarrierBrazilAmy Elsner UNQUALIFIED
Smith GlickItalyAnna Fali NEW
Horizontal
NameCountryRepresentativeStatus
Ricardo GauchoGermanyAmy Elsner RENEWAL
Rodrigues CampainCanadaIvan Magalhaes PROPOSAL
Johnson SergiJapanElwin Sharvill NEW
Isabel BowleyGermanyAnna Fali NEW
Nicolas IturbideRussiaElwin Sharvill NEGOTIATION
Salvatore StockhamBrazilIvan Magalhaes PROPOSAL
Jones VocelkaRussiaIoni Bowcher QUALIFIED
Aruna FigeroaUnited KingdomXuxue Feng PROPOSAL
Adams MorascaIndiaAnna Fali QUALIFIED
Claire TollnerArgentinaElwin Sharvill PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Izzy GarufiBrazil2025-10-13Feltz Printing Service NEW3Ivan Magalhaes
1001Chavez BriddickFrance2025-10-04Benton, John B Jr PROPOSAL99Elwin Sharvill
1002Kaitlin OstroskyCanada2025-09-27Rangoni Of Florence UNQUALIFIED56Ioni Bowcher
1003Sinclair WaycottItaly2025-10-11Printing Dimensions NEW30Elwin Sharvill
1004Aruna FigeroaJapan2025-10-17Benton, John B Jr NEW49Stephen Shaw
1005Aditya KuskoArgentina2025-10-19Chapman, Ross E Esq NEGOTIATION44Bernardo Dominic
1006David DarakjyArgentina2025-09-23Commercial Press RENEWAL10Stephen Shaw
1007Maisha RulapaughGermany2025-10-11Truhlar And Truhlar Attys PROPOSAL1Ioni Bowcher
1008Ricardo GauchoBrazil2025-10-17Commercial Press UNQUALIFIED48Amy Elsner
1009Adams MorascaIndia2025-09-25Truhlar And Truhlar Attys NEGOTIATION28Onyama Limba
1010Silvio SlusarskiRussia2025-10-13Morlong Associates PROPOSAL59Ioni Bowcher
1011Claire TollnerCanada2025-10-11Feltz Printing Service PROPOSAL90Amy Elsner
1012Sinclair WaycottSpain2025-10-18Benton, John B Jr RENEWAL12Amy Elsner
1013Francesco ShinkoIndia2025-10-08Commercial Press PROPOSAL30Amy Elsner
1014Faith GillianUnited Kingdom2025-09-29King, Christopher A Esq RENEWAL5Stephen Shaw
1015Clifford RimSpain2025-09-29Printing Dimensions RENEWAL0Amy Elsner
1016Aruna FigeroaCanada2025-09-25Truhlar And Truhlar Attys QUALIFIED77Asiya Javayant
1017Mayumi KolmetzJapan2025-10-12Benton, John B Jr RENEWAL87Bernardo Dominic
1018Jeanfrancois VenereIndia2025-10-13Chanay, Jeffrey A Esq NEGOTIATION92Onyama Limba
1019Kadeem FlosiIndia2025-10-14Buckley Miller Wright UNQUALIFIED94Asiya Javayant
1020Stacey MacleadUnited Kingdom2025-10-04Dorl, James J Esq NEW92Elwin Sharvill
1021Deepesh ChuiSpain2025-10-10Chapman, Ross E Esq QUALIFIED15Asiya Javayant
1022Ricardo GauchoArgentina2025-10-09Buckley Miller Wright NEGOTIATION41Xuxue Feng
1023Mujtaba NickaSpain2025-10-14Buckley Miller Wright QUALIFIED85Amy Elsner
1024Maria MarrierGermany2025-09-27Printing Dimensions QUALIFIED8Xuxue Feng
1025Claire TollnerAustralia2025-10-05King, Christopher A Esq NEGOTIATION61Asiya Javayant
1026Salvatore StockhamBrazil2025-10-04Commercial Press RENEWAL52Ivan Magalhaes
1027Johnson SergiFrance2025-10-12Rousseaux, Michael Esq QUALIFIED59Amy Elsner
1028David DarakjyFrance2025-09-22King, Christopher A Esq PROPOSAL67Ioni Bowcher
1029Jennifer AmigonRussia2025-10-08Feltz Printing Service QUALIFIED12Ioni Bowcher
1030Kaitlin OstroskyItaly2025-10-19Feltz Printing Service UNQUALIFIED29Elwin Sharvill
1031Clifford RimSpain2025-10-17King, Christopher A Esq NEW6Amy Elsner
1032Leon OldroydSpain2025-10-02Chapman, Ross E Esq RENEWAL71Elwin Sharvill
1033Tony FollerRussia2025-10-01Feltz Printing Service UNQUALIFIED81Elwin Sharvill
1034Jefferson SchemmerRussia2025-10-13King, Christopher A Esq NEW33Ioni Bowcher
1035Juan WieserAustralia2025-09-25Rousseaux, Michael Esq UNQUALIFIED9Asiya Javayant
1036Mujtaba NickaUnited Kingdom2025-10-02Benton, John B Jr NEW43Ioni Bowcher
1037Jeanfrancois VenereCanada2025-10-17Chanay, Jeffrey A Esq UNQUALIFIED42Ioni Bowcher
1038Ashley DoeAustralia2025-09-29Truhlar And Truhlar Attys NEW75Onyama Limba
1039Alejandro PerinRussia2025-10-16Feltz Printing Service NEW7Amy Elsner
1040Greenwood BologniaArgentina2025-10-05Dorl, James J Esq PROPOSAL23Amy Elsner
1041Alejandro PerinGermany2025-10-18Truhlar And Truhlar Attys NEW95Ivan Magalhaes
1042Deepesh ChuiUnited Kingdom2025-10-04Morlong Associates NEGOTIATION80Amy Elsner
1043Octavia MaletFrance2025-10-04Buckley Miller Wright NEW27Ivan Magalhaes
1044Leon OldroydIndia2025-10-09Buckley Miller Wright NEGOTIATION48Onyama Limba
1045Mujtaba NickaAustralia2025-09-26Buckley Miller Wright RENEWAL26Asiya Javayant
1046Darci PoquetteBrazil2025-10-05Rousseaux, Michael Esq PROPOSAL15Ivan Magalhaes
1047Maria MarrierRussia2025-09-25Rousseaux, Michael Esq NEW46Bernardo Dominic
1048Misaki RoysterSpain2025-09-22Chemel, James L Cpa PROPOSAL42Elwin Sharvill
1049Maria MarrierAustralia2025-09-28Commercial Press NEGOTIATION2Onyama Limba
Frozen Rows
NameCountryRepresentativeStatus
Kaitlin OstroskyGermanyAsiya Javayant RENEWAL
Izzy GarufiGermanyStephen Shaw NEGOTIATION
Clifford RimGermanyAmy Elsner QUALIFIED
Mayumi KolmetzUnited KingdomElwin Sharvill NEW
Claire TollnerJapanAsiya Javayant QUALIFIED
Jefferson SchemmerCanadaIvan Magalhaes RENEWAL
Emily WhobreyJapanElwin Sharvill PROPOSAL
Clifford RimBrazilStephen Shaw PROPOSAL
James ButtUnited KingdomXuxue Feng UNQUALIFIED
Isabel BowleyRussiaOnyama Limba QUALIFIED
Misaki RoysterFranceIvan Magalhaes QUALIFIED
Aika InouyeJapanAsiya Javayant NEGOTIATION
Rodrigues CampainRussiaAsiya Javayant QUALIFIED
Salvatore StockhamItalyAnna Fali RENEWAL
Jones VocelkaJapanBernardo Dominic UNQUALIFIED
Francesco ShinkoSpainBernardo Dominic RENEWAL
Cody SaylorsIndiaIoni Bowcher NEW
Maria MarrierArgentinaAnna Fali RENEWAL
Nicolas IturbideFranceAsiya Javayant NEW
Kaitlin OstroskyArgentinaAnna Fali QUALIFIED
Jefferson SchemmerRussiaAnna Fali RENEWAL
Aditya KuskoCanadaAsiya Javayant RENEWAL
Darci PoquetteArgentinaXuxue Feng QUALIFIED
Murillo MaletFranceOnyama Limba UNQUALIFIED
Misaki RoysterRussiaIvan Magalhaes QUALIFIED
Deepesh ChuiIndiaXuxue Feng PROPOSAL
Sinclair WaycottIndiaXuxue Feng NEGOTIATION
Jones VocelkaJapanIvan Magalhaes NEGOTIATION
Chavez BriddickBrazilElwin Sharvill PROPOSAL
Sinclair WaycottItalyAnna Fali NEGOTIATION
Greenwood BologniaItalyXuxue Feng PROPOSAL
Jeanfrancois VenereUnited KingdomIoni Bowcher NEGOTIATION
Jennifer AmigonBrazilIvan Magalhaes NEGOTIATION
Rodrigues CampainJapanStephen Shaw NEGOTIATION
Leja CaldareraArgentinaOnyama Limba PROPOSAL
Ricardo GauchoSpainIvan Magalhaes RENEWAL
Sinclair WaycottGermanyAmy Elsner NEW
Ricardo GauchoUnited KingdomElwin Sharvill UNQUALIFIED
Antonio CaudySpainOnyama Limba NEW
Leja CaldareraItalyAsiya Javayant NEGOTIATION
Ashley DoeRussiaIoni Bowcher UNQUALIFIED
Jennifer AmigonIndiaBernardo Dominic QUALIFIED
Wickens NestleItalyOnyama Limba QUALIFIED
Alejandro PerinUnited KingdomXuxue Feng NEW
Jones VocelkaRussiaStephen Shaw QUALIFIED
Claire TollnerIndiaElwin Sharvill NEGOTIATION
Mujtaba NickaUnited KingdomIoni Bowcher NEW
Kaitlin OstroskyIndiaBernardo Dominic NEGOTIATION
Alejandro PerinArgentinaBernardo Dominic RENEWAL
Aika InouyeIndiaIoni Bowcher NEGOTIATION
Frozen Columns
Name
Jones Vocelka
Misaki Royster
Johnson Sergi
Claire Tollner
Francesco Shinko
Antonio Caudy
Adams Morasca
Darci Poquette
Kaitlin Ostrosky
Salvatore Stockham
Leon Oldroyd
Misaki Royster
Antonio Caudy
Rodrigues Campain
Costa Dilliard
Maria Marrier
Mujtaba Nicka
Chavez Briddick
Ashley Doe
Smith Glick
Jefferson Schemmer
Maisha Rulapaugh
Ashley Doe
Maria Marrier
Johnson Sergi
Aditya Kusko
Claire Tollner
Francesco Shinko
Juan Wieser
Maisha Rulapaugh
Aika Inouye
Johnson Sergi
Aditya Kusko
Misaki Royster
Antonio Caudy
Johnson Sergi
Maisha Rulapaugh
Jennifer Amigon
James Butt
Nicolas Iturbide
Octavia Malet
Mayumi Kolmetz
Alejandro Perin
Antonio Caudy
Izzy Garufi
Juan Wieser
Ricardo Gaucho
Jefferson Schemmer
Jones Vocelka
Julie Stenseth
IdCountryDate
1000Germany2025-10-08
1001India2025-10-12
1002India2025-10-13
1003France2025-10-10
1004France2025-09-21
1005Canada2025-09-24
1006Brazil2025-09-29
1007Japan2025-09-27
1008India2025-10-19
1009Brazil2025-09-28
1010Germany2025-10-17
1011Japan2025-09-27
1012Russia2025-09-20
1013Italy2025-09-21
1014France2025-09-24
1015India2025-10-11
1016Brazil2025-10-07
1017France2025-09-30
1018India2025-10-07
1019Italy2025-10-14
1020Spain2025-10-15
1021Brazil2025-10-19
1022India2025-10-13
1023Germany2025-10-07
1024Australia2025-10-03
1025Italy2025-10-05
1026Australia2025-10-01
1027Germany2025-10-10
1028Italy2025-10-06
1029France2025-09-23
1030France2025-10-08
1031Argentina2025-10-16
1032Argentina2025-09-27
1033Argentina2025-09-21
1034France2025-09-29
1035Italy2025-09-23
1036Brazil2025-09-21
1037Italy2025-10-18
1038Brazil2025-10-16
1039Argentina2025-10-03
1040Canada2025-10-06
1041Canada2025-10-17
1042Argentina2025-09-23
1043Germany2025-10-04
1044France2025-10-18
1045India2025-10-18
1046Russia2025-10-17
1047Russia2025-09-28
1048Canada2025-09-25
1049Brazil2025-10-13

On-Demand Data

NameIdCountryDate
Jones Vocelka1000Spain2025-09-23
Morrow Ruta1001Italy2025-10-15
Sinclair Waycott1002Italy2025-09-26
Maria Marrier1003Japan2025-09-24
Leon Oldroyd1004Spain2025-10-08
Rodrigues Campain1005Argentina2025-09-29
Leon Oldroyd1006India2025-10-14
Jeanfrancois Venere1007Brazil2025-10-08
Aditya Kusko1008France2025-09-25
Maisha Rulapaugh1009Brazil2025-10-03
Cody Saylors1010Germany2025-09-25
Leja Caldarera1011Russia2025-10-11
Salvatore Stockham1012Germany2025-09-22
Nicolas Iturbide1013Germany2025-09-29
Mujtaba Nicka1014Brazil2025-09-20
Greenwood Bolognia1015Italy2025-10-04
Isabel Bowley1016Russia2025-09-23
Rodrigues Campain1017Japan2025-09-24
Ashley Doe1018Argentina2025-09-30
Tony Foller1019Brazil2025-09-20
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Cody SaylorsUnited KingdomAnna Fali NEGOTIATION
Smith GlickSpainAmy Elsner PROPOSAL
Darci PoquetteUnited KingdomAnna Fali NEW
Sinclair WaycottAustraliaBernardo Dominic RENEWAL
Salvatore StockhamIndiaAsiya Javayant NEW
Aika InouyeUnited KingdomXuxue Feng QUALIFIED
Deepesh ChuiUnited KingdomElwin Sharvill UNQUALIFIED
Jennifer AmigonJapanAsiya Javayant QUALIFIED
Aruna FigeroaUnited KingdomXuxue Feng PROPOSAL
James ButtSpainBernardo Dominic UNQUALIFIED
Antonio CaudyCanadaElwin Sharvill NEW
Johnson SergiAustraliaAsiya Javayant NEGOTIATION
Leon OldroydFranceOnyama Limba QUALIFIED
Claire TollnerFranceAsiya Javayant UNQUALIFIED
Mayumi KolmetzGermanyOnyama Limba QUALIFIED
Jefferson SchemmerItalyStephen Shaw PROPOSAL
Jennifer AmigonAustraliaElwin Sharvill NEGOTIATION
Jones VocelkaSpainAsiya Javayant QUALIFIED
Johnson SergiGermanyIvan Magalhaes UNQUALIFIED
Chavez BriddickAustraliaStephen Shaw UNQUALIFIED
Kadeem FlosiCanadaIoni Bowcher NEW
Cody SaylorsUnited KingdomElwin Sharvill RENEWAL
David DarakjyGermanyIvan Magalhaes QUALIFIED
Mayumi KolmetzItalyOnyama Limba NEGOTIATION
Rodrigues CampainCanadaOnyama Limba RENEWAL
Antonio CaudyItalyStephen Shaw RENEWAL
Chavez BriddickIndiaStephen Shaw PROPOSAL
Munro FerenczRussiaAsiya Javayant NEGOTIATION
Leon OldroydFranceIoni Bowcher QUALIFIED
Octavia MaletRussiaAmy Elsner UNQUALIFIED
Antonio CaudySpainXuxue Feng NEGOTIATION
Octavia MaletArgentinaAmy Elsner UNQUALIFIED
Ivar PaprockiFranceElwin Sharvill UNQUALIFIED
Deepesh ChuiItalyAnna Fali UNQUALIFIED
Jefferson SchemmerCanadaBernardo Dominic PROPOSAL
Claire TollnerIndiaXuxue Feng UNQUALIFIED
Maisha RulapaughArgentinaOnyama Limba QUALIFIED
Aruna FigeroaSpainBernardo Dominic RENEWAL
James ButtRussiaAmy Elsner QUALIFIED
Mujtaba NickaArgentinaBernardo Dominic RENEWAL

<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>