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
Adams MorascaJapanBernardo Dominic RENEWAL
Jeanfrancois VenereCanadaIoni Bowcher PROPOSAL
Jones VocelkaGermanyAmy Elsner NEGOTIATION
Francesco ShinkoGermanyBernardo Dominic RENEWAL
Jones VocelkaGermanyBernardo Dominic PROPOSAL
Murillo MaletIndiaAmy Elsner RENEWAL
Antonio CaudyCanadaAsiya Javayant RENEWAL
Silvio SlusarskiJapanOnyama Limba QUALIFIED
Jefferson SchemmerFranceElwin Sharvill NEGOTIATION
Jones VocelkaJapanElwin Sharvill PROPOSAL
Ashley DoeFranceAnna Fali PROPOSAL
Costa DilliardIndiaIoni Bowcher UNQUALIFIED
Jones VocelkaSpainAsiya Javayant RENEWAL
Adams MorascaCanadaStephen Shaw NEW
Ashley DoeRussiaAmy Elsner NEGOTIATION
Nicolas IturbideIndiaXuxue Feng UNQUALIFIED
Johnson SergiJapanBernardo Dominic NEW
Mujtaba NickaSpainElwin Sharvill RENEWAL
Stacey MacleadSpainAsiya Javayant RENEWAL
Jeanfrancois VenereUnited KingdomOnyama Limba UNQUALIFIED
Julie StensethSpainOnyama Limba RENEWAL
Faith GillianCanadaAnna Fali UNQUALIFIED
David DarakjyCanadaBernardo Dominic NEGOTIATION
Alejandro PerinAustraliaXuxue Feng UNQUALIFIED
Munro FerenczArgentinaIvan Magalhaes PROPOSAL
Maisha RulapaughItalyIoni Bowcher UNQUALIFIED
Deepesh ChuiCanadaIoni Bowcher RENEWAL
Maisha RulapaughCanadaAsiya Javayant RENEWAL
Rodrigues CampainGermanyAnna Fali NEW
Mujtaba NickaUnited KingdomAnna Fali NEGOTIATION
Izzy GarufiJapanBernardo Dominic NEGOTIATION
Silvio SlusarskiItalyElwin Sharvill QUALIFIED
Maisha RulapaughBrazilElwin Sharvill RENEWAL
Julie StensethAustraliaXuxue Feng UNQUALIFIED
Aika InouyeSpainStephen Shaw QUALIFIED
Ivar PaprockiGermanyOnyama Limba NEGOTIATION
Aditya KuskoFranceIoni Bowcher NEGOTIATION
Antonio CaudyAustraliaElwin Sharvill NEGOTIATION
Leja CaldareraItalyXuxue Feng NEGOTIATION
Jones VocelkaAustraliaAmy Elsner RENEWAL
Sinclair WaycottArgentinaStephen Shaw NEW
Mayumi KolmetzItalyAsiya Javayant NEGOTIATION
Chavez BriddickFranceIoni Bowcher NEW
Ashley DoeArgentinaOnyama Limba NEGOTIATION
Julie StensethUnited KingdomElwin Sharvill PROPOSAL
Kadeem FlosiIndiaBernardo Dominic RENEWAL
Julie StensethSpainOnyama Limba QUALIFIED
Clifford RimIndiaXuxue Feng PROPOSAL
Juan WieserArgentinaAsiya Javayant PROPOSAL
Munro FerenczJapanAsiya Javayant QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Ivar PaprockiArgentinaOnyama Limba PROPOSAL
Deepesh ChuiFranceAmy Elsner NEW
Mayumi KolmetzJapanBernardo Dominic UNQUALIFIED
Octavia MaletItalyAsiya Javayant PROPOSAL
Faith GillianItalyElwin Sharvill NEGOTIATION
Claire TollnerBrazilIvan Magalhaes NEGOTIATION
Emily WhobreyFranceAnna Fali PROPOSAL
Kadeem FlosiGermanyOnyama Limba UNQUALIFIED
Isabel BowleyIndiaBernardo Dominic UNQUALIFIED
Stacey MacleadItalyStephen Shaw PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Juan WieserArgentina2025-10-01Truhlar And Truhlar Attys NEW95Ivan Magalhaes
1001Alejandro PerinBrazil2025-09-23Chemel, James L Cpa NEGOTIATION59Ioni Bowcher
1002Kaitlin OstroskyFrance2025-09-26Chemel, James L Cpa PROPOSAL5Ioni Bowcher
1003Johnson SergiItaly2025-09-19Dorl, James J Esq NEW27Amy Elsner
1004Jones VocelkaSpain2025-10-03Chanay, Jeffrey A Esq PROPOSAL79Ivan Magalhaes
1005Morrow RutaFrance2025-10-05Chanay, Jeffrey A Esq PROPOSAL90Stephen Shaw
1006Jones VocelkaJapan2025-10-11King, Christopher A Esq PROPOSAL94Xuxue Feng
1007Juan WieserSpain2025-09-24Chanay, Jeffrey A Esq PROPOSAL58Asiya Javayant
1008Jefferson SchemmerSpain2025-09-23Feltz Printing Service NEW2Anna Fali
1009Costa DilliardRussia2025-09-24Benton, John B Jr QUALIFIED58Anna Fali
1010Misaki RoysterJapan2025-09-26Truhlar And Truhlar Attys QUALIFIED80Asiya Javayant
1011Isabel BowleyAustralia2025-09-15Buckley Miller Wright RENEWAL21Amy Elsner
1012Arvin AlbaresJapan2025-10-06Chanay, Jeffrey A Esq NEGOTIATION18Ioni Bowcher
1013Cody SaylorsRussia2025-10-07Dorl, James J Esq RENEWAL52Ioni Bowcher
1014Jennifer AmigonCanada2025-10-06King, Christopher A Esq NEGOTIATION5Asiya Javayant
1015Johnson SergiUnited Kingdom2025-10-08Rangoni Of Florence QUALIFIED66Xuxue Feng
1016Leon OldroydAustralia2025-09-13Rangoni Of Florence NEW55Bernardo Dominic
1017Juan WieserUnited Kingdom2025-09-23Printing Dimensions RENEWAL62Amy Elsner
1018Adams MorascaItaly2025-09-27Chapman, Ross E Esq QUALIFIED45Elwin Sharvill
1019Claire TollnerIndia2025-09-14Truhlar And Truhlar Attys QUALIFIED10Stephen Shaw
1020Juan WieserSpain2025-10-04Chapman, Ross E Esq UNQUALIFIED12Asiya Javayant
1021Sinclair WaycottItaly2025-09-29Rousseaux, Michael Esq NEW50Xuxue Feng
1022Tony FollerGermany2025-09-17Feiner Bros RENEWAL89Bernardo Dominic
1023Morrow RutaGermany2025-10-01Chapman, Ross E Esq NEW96Xuxue Feng
1024Jefferson SchemmerUnited Kingdom2025-09-21Rousseaux, Michael Esq RENEWAL40Ivan Magalhaes
1025James ButtFrance2025-10-02Rousseaux, Michael Esq NEW57Amy Elsner
1026Cody SaylorsArgentina2025-09-27Feltz Printing Service QUALIFIED43Bernardo Dominic
1027Octavia MaletGermany2025-10-05Dorl, James J Esq NEGOTIATION2Asiya Javayant
1028Smith GlickGermany2025-10-09Rangoni Of Florence NEW79Elwin Sharvill
1029Rodrigues CampainBrazil2025-09-17King, Christopher A Esq UNQUALIFIED30Bernardo Dominic
1030Misaki RoysterGermany2025-09-14Truhlar And Truhlar Attys NEGOTIATION5Xuxue Feng
1031Aika InouyeAustralia2025-10-09Chapman, Ross E Esq NEW83Onyama Limba
1032Kaitlin OstroskyAustralia2025-09-30King, Christopher A Esq QUALIFIED60Stephen Shaw
1033Arvin AlbaresAustralia2025-09-23Feiner Bros NEGOTIATION67Asiya Javayant
1034Jeanfrancois VenereRussia2025-09-12King, Christopher A Esq PROPOSAL7Anna Fali
1035Nicolas IturbideArgentina2025-09-23Chanay, Jeffrey A Esq NEW26Onyama Limba
1036Chavez BriddickSpain2025-09-16Morlong Associates NEGOTIATION89Bernardo Dominic
1037Jeanfrancois VenereArgentina2025-09-29Rousseaux, Michael Esq RENEWAL46Amy Elsner
1038Kadeem FlosiUnited Kingdom2025-09-26Truhlar And Truhlar Attys UNQUALIFIED20Bernardo Dominic
1039Sinclair WaycottSpain2025-09-24Chanay, Jeffrey A Esq RENEWAL1Ivan Magalhaes
1040Sinclair WaycottFrance2025-09-30Printing Dimensions RENEWAL48Ioni Bowcher
1041Juan WieserArgentina2025-09-19Feiner Bros NEW42Amy Elsner
1042Aditya KuskoItaly2025-09-28Chapman, Ross E Esq UNQUALIFIED41Stephen Shaw
1043Jones VocelkaFrance2025-10-05Morlong Associates QUALIFIED5Onyama Limba
1044David DarakjyBrazil2025-09-20Buckley Miller Wright PROPOSAL15Xuxue Feng
1045James ButtArgentina2025-09-24Chemel, James L Cpa RENEWAL88Elwin Sharvill
1046Morrow RutaSpain2025-10-10Printing Dimensions PROPOSAL47Onyama Limba
1047Costa DilliardBrazil2025-10-03Feltz Printing Service NEW1Elwin Sharvill
1048Morrow RutaItaly2025-09-12Benton, John B Jr NEGOTIATION37Ioni Bowcher
1049Jeanfrancois VenereJapan2025-10-03Chanay, Jeffrey A Esq NEW62Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Julie StensethItalyElwin Sharvill RENEWAL
Aruna FigeroaSpainIvan Magalhaes UNQUALIFIED
Emily WhobreyArgentinaIoni Bowcher PROPOSAL
Darci PoquetteItalyAmy Elsner UNQUALIFIED
Misaki RoysterItalyBernardo Dominic RENEWAL
Tony FollerGermanyAsiya Javayant PROPOSAL
Francesco ShinkoFranceAsiya Javayant PROPOSAL
Silvio SlusarskiItalyAsiya Javayant RENEWAL
Costa DilliardSpainIoni Bowcher QUALIFIED
Aditya KuskoBrazilAnna Fali RENEWAL
Cody SaylorsUnited KingdomAmy Elsner QUALIFIED
Cody SaylorsSpainOnyama Limba NEGOTIATION
Silvio SlusarskiIndiaIoni Bowcher UNQUALIFIED
Aditya KuskoJapanIvan Magalhaes NEGOTIATION
Aditya KuskoArgentinaAnna Fali NEGOTIATION
Chavez BriddickBrazilOnyama Limba UNQUALIFIED
Sinclair WaycottSpainIoni Bowcher UNQUALIFIED
Chavez BriddickSpainStephen Shaw UNQUALIFIED
Munro FerenczCanadaAmy Elsner NEW
Adams MorascaJapanAsiya Javayant NEGOTIATION
Tony FollerSpainAmy Elsner QUALIFIED
Juan WieserUnited KingdomStephen Shaw UNQUALIFIED
Julie StensethAustraliaAsiya Javayant PROPOSAL
Smith GlickIndiaOnyama Limba PROPOSAL
Chavez BriddickJapanAmy Elsner NEW
Ivar PaprockiFranceOnyama Limba UNQUALIFIED
Maisha RulapaughJapanAsiya Javayant PROPOSAL
James ButtBrazilAsiya Javayant UNQUALIFIED
Ivar PaprockiBrazilStephen Shaw PROPOSAL
Isabel BowleyArgentinaXuxue Feng NEGOTIATION
Cody SaylorsSpainBernardo Dominic QUALIFIED
Darci PoquetteAustraliaIoni Bowcher QUALIFIED
Kadeem FlosiAustraliaElwin Sharvill QUALIFIED
Ivar PaprockiIndiaXuxue Feng NEGOTIATION
Jeanfrancois VenereJapanIoni Bowcher NEGOTIATION
Sinclair WaycottGermanyAmy Elsner PROPOSAL
Jefferson SchemmerSpainAmy Elsner NEGOTIATION
Stacey MacleadJapanIoni Bowcher NEW
Munro FerenczCanadaXuxue Feng NEGOTIATION
David DarakjyUnited KingdomElwin Sharvill PROPOSAL
Greenwood BologniaFranceStephen Shaw PROPOSAL
Deepesh ChuiCanadaIoni Bowcher UNQUALIFIED
Francesco ShinkoRussiaIoni Bowcher RENEWAL
Ashley DoeBrazilXuxue Feng QUALIFIED
Kadeem FlosiGermanyStephen Shaw QUALIFIED
Deepesh ChuiCanadaIvan Magalhaes NEW
Clifford RimCanadaIoni Bowcher UNQUALIFIED
Misaki RoysterUnited KingdomAmy Elsner QUALIFIED
Mayumi KolmetzArgentinaAmy Elsner RENEWAL
Misaki RoysterGermanyOnyama Limba NEGOTIATION
Frozen Columns
Name
Salvatore Stockham
Sinclair Waycott
Maisha Rulapaugh
Leon Oldroyd
Misaki Royster
Leon Oldroyd
Jeanfrancois Venere
Ricardo Gaucho
Stacey Maclead
Silvio Slusarski
Wickens Nestle
Chavez Briddick
Johnson Sergi
Aruna Figeroa
Cody Saylors
Nicolas Iturbide
Francesco Shinko
Kadeem Flosi
Silvio Slusarski
Antonio Caudy
Sinclair Waycott
Sinclair Waycott
Morrow Ruta
Rodrigues Campain
Aditya Kusko
Misaki Royster
Murillo Malet
Munro Ferencz
Smith Glick
Leja Caldarera
Mujtaba Nicka
Izzy Garufi
Cody Saylors
Rodrigues Campain
Maria Marrier
Ricardo Gaucho
Chavez Briddick
Leon Oldroyd
Kadeem Flosi
Maisha Rulapaugh
Deepesh Chui
Kadeem Flosi
Aditya Kusko
Maisha Rulapaugh
Ashley Doe
Greenwood Bolognia
Sinclair Waycott
Jennifer Amigon
Faith Gillian
Chavez Briddick
IdCountryDate
1000Japan2025-10-10
1001Italy2025-09-24
1002United Kingdom2025-10-02
1003France2025-09-15
1004Italy2025-10-01
1005Australia2025-09-17
1006Japan2025-10-04
1007United Kingdom2025-10-01
1008Brazil2025-10-02
1009India2025-10-10
1010France2025-10-04
1011Australia2025-09-14
1012Canada2025-09-29
1013Russia2025-09-30
1014India2025-09-12
1015Germany2025-09-14
1016Canada2025-09-12
1017Brazil2025-09-26
1018Brazil2025-09-24
1019United Kingdom2025-10-10
1020Italy2025-09-20
1021Australia2025-09-14
1022Argentina2025-09-23
1023France2025-09-24
1024United Kingdom2025-09-18
1025Italy2025-10-10
1026Japan2025-09-24
1027Japan2025-09-18
1028Japan2025-10-08
1029India2025-09-12
1030Russia2025-09-18
1031Australia2025-10-03
1032Germany2025-09-22
1033Japan2025-10-05
1034Italy2025-09-22
1035Canada2025-09-24
1036France2025-09-16
1037France2025-09-24
1038India2025-09-23
1039Brazil2025-10-04
1040Australia2025-10-05
1041India2025-09-30
1042Canada2025-10-05
1043Canada2025-09-27
1044India2025-10-02
1045Brazil2025-10-06
1046Russia2025-09-30
1047Italy2025-09-15
1048Japan2025-10-11
1049France2025-10-03

On-Demand Data

NameIdCountryDate
Johnson Sergi1000Canada2025-10-10
Leja Caldarera1001Russia2025-09-14
Stacey Maclead1002India2025-09-26
Ashley Doe1003Brazil2025-10-03
Johnson Sergi1004Russia2025-10-09
Octavia Malet1005Australia2025-09-17
Antonio Caudy1006Italy2025-10-08
Munro Ferencz1007France2025-10-02
Faith Gillian1008Russia2025-09-20
Emily Whobrey1009Japan2025-09-17
Emily Whobrey1010Italy2025-10-02
Ricardo Gaucho1011Italy2025-09-15
Maisha Rulapaugh1012Japan2025-09-30
Emily Whobrey1013Canada2025-09-26
Aika Inouye1014India2025-10-11
Ivar Paprocki1015Russia2025-10-07
Ricardo Gaucho1016Australia2025-10-05
Kaitlin Ostrosky1017Japan2025-09-14
Smith Glick1018Japan2025-09-16
Chavez Briddick1019Australia2025-10-11
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Faith GillianBrazilElwin Sharvill RENEWAL
Adams MorascaJapanAmy Elsner UNQUALIFIED
Morrow RutaUnited KingdomOnyama Limba NEGOTIATION
Ashley DoeGermanyAsiya Javayant RENEWAL
Aditya KuskoItalyXuxue Feng NEW
Claire TollnerItalyStephen Shaw UNQUALIFIED
Jeanfrancois VenereFranceAnna Fali PROPOSAL
Arvin AlbaresUnited KingdomOnyama Limba RENEWAL
Adams MorascaArgentinaIoni Bowcher NEGOTIATION
Leja CaldareraFranceIvan Magalhaes NEW
Jennifer AmigonRussiaIvan Magalhaes QUALIFIED
Leon OldroydUnited KingdomXuxue Feng RENEWAL
Kadeem FlosiBrazilIoni Bowcher RENEWAL
Kadeem FlosiGermanyElwin Sharvill UNQUALIFIED
Munro FerenczUnited KingdomXuxue Feng QUALIFIED
Claire TollnerUnited KingdomStephen Shaw NEGOTIATION
Isabel BowleyGermanyXuxue Feng NEGOTIATION
Leja CaldareraRussiaAsiya Javayant NEGOTIATION
Maisha RulapaughArgentinaBernardo Dominic PROPOSAL
Jefferson SchemmerGermanyStephen Shaw PROPOSAL
Mujtaba NickaIndiaAsiya Javayant QUALIFIED
Murillo MaletCanadaStephen Shaw QUALIFIED
Mujtaba NickaItalyElwin Sharvill QUALIFIED
Rodrigues CampainIndiaIvan Magalhaes NEGOTIATION
Murillo MaletUnited KingdomElwin Sharvill NEW
Julie StensethCanadaAnna Fali RENEWAL
Smith GlickItalyOnyama Limba PROPOSAL
Morrow RutaArgentinaElwin Sharvill QUALIFIED
Antonio CaudyCanadaElwin Sharvill NEGOTIATION
Mujtaba NickaFranceIvan Magalhaes NEGOTIATION
Greenwood BologniaRussiaAmy Elsner UNQUALIFIED
Morrow RutaJapanIoni Bowcher PROPOSAL
Nicolas IturbideJapanAmy Elsner UNQUALIFIED
Aruna FigeroaSpainBernardo Dominic PROPOSAL
Mujtaba NickaUnited KingdomXuxue Feng NEGOTIATION
Chavez BriddickCanadaAmy Elsner NEW
Jennifer AmigonJapanAmy Elsner NEW
Antonio CaudyItalyIvan Magalhaes UNQUALIFIED
Aruna FigeroaIndiaIoni Bowcher RENEWAL
Silvio SlusarskiGermanyIvan Magalhaes 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>