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
Julie StensethUnited KingdomIvan Magalhaes NEGOTIATION
Faith GillianJapanOnyama Limba RENEWAL
Salvatore StockhamFranceIvan Magalhaes NEW
Antonio CaudyItalyAsiya Javayant UNQUALIFIED
Darci PoquetteSpainIvan Magalhaes RENEWAL
Wickens NestleIndiaIoni Bowcher RENEWAL
Aditya KuskoBrazilAnna Fali PROPOSAL
Smith GlickUnited KingdomAnna Fali UNQUALIFIED
Rodrigues CampainJapanElwin Sharvill UNQUALIFIED
Faith GillianItalyIoni Bowcher UNQUALIFIED
Aruna FigeroaIndiaIoni Bowcher NEGOTIATION
Aruna FigeroaArgentinaStephen Shaw RENEWAL
Ricardo GauchoRussiaAsiya Javayant QUALIFIED
Ashley DoeGermanyAmy Elsner NEW
Munro FerenczCanadaAsiya Javayant PROPOSAL
Stacey MacleadArgentinaOnyama Limba PROPOSAL
Morrow RutaRussiaStephen Shaw NEW
Misaki RoysterSpainAmy Elsner QUALIFIED
Jennifer AmigonCanadaAnna Fali NEGOTIATION
David DarakjyJapanIvan Magalhaes PROPOSAL
James ButtAustraliaBernardo Dominic NEW
Leon OldroydGermanyAmy Elsner QUALIFIED
Aditya KuskoCanadaIvan Magalhaes RENEWAL
Izzy GarufiUnited KingdomBernardo Dominic NEW
Aruna FigeroaSpainIvan Magalhaes QUALIFIED
Maria MarrierSpainElwin Sharvill NEW
Nicolas IturbideRussiaAsiya Javayant PROPOSAL
Johnson SergiRussiaAmy Elsner NEGOTIATION
Mayumi KolmetzUnited KingdomAnna Fali UNQUALIFIED
Murillo MaletItalyOnyama Limba RENEWAL
Mayumi KolmetzFranceAsiya Javayant NEW
Juan WieserJapanStephen Shaw NEGOTIATION
Francesco ShinkoArgentinaXuxue Feng UNQUALIFIED
Jeanfrancois VenereRussiaStephen Shaw NEGOTIATION
Tony FollerGermanyIvan Magalhaes QUALIFIED
Emily WhobreyFranceAmy Elsner NEW
Nicolas IturbideCanadaAmy Elsner PROPOSAL
Smith GlickUnited KingdomAnna Fali NEW
Adams MorascaUnited KingdomStephen Shaw UNQUALIFIED
Kadeem FlosiIndiaAsiya Javayant NEW
Mayumi KolmetzRussiaAnna Fali RENEWAL
Munro FerenczUnited KingdomOnyama Limba NEGOTIATION
Francesco ShinkoCanadaIvan Magalhaes NEW
Jefferson SchemmerUnited KingdomElwin Sharvill UNQUALIFIED
Rodrigues CampainAustraliaElwin Sharvill PROPOSAL
Deepesh ChuiGermanyAsiya Javayant NEW
Ivar PaprockiUnited KingdomIoni Bowcher RENEWAL
Jennifer AmigonJapanAnna Fali PROPOSAL
Wickens NestleBrazilIoni Bowcher NEGOTIATION
Adams MorascaJapanOnyama Limba NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Ashley DoeArgentinaAsiya Javayant PROPOSAL
Alejandro PerinArgentinaAmy Elsner PROPOSAL
Mujtaba NickaSpainStephen Shaw NEW
Aruna FigeroaIndiaStephen Shaw PROPOSAL
Aika InouyeGermanyIoni Bowcher RENEWAL
Munro FerenczFranceXuxue Feng NEGOTIATION
Antonio CaudyAustraliaStephen Shaw QUALIFIED
Stacey MacleadCanadaIvan Magalhaes PROPOSAL
Mujtaba NickaItalyXuxue Feng QUALIFIED
Adams MorascaAustraliaAnna Fali QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Ivar PaprockiAustralia2026-05-28Truhlar And Truhlar Attys QUALIFIED51Ioni Bowcher
1001Rodrigues CampainGermany2026-06-16Truhlar And Truhlar Attys NEGOTIATION65Xuxue Feng
1002James ButtUnited Kingdom2026-05-19Commercial Press QUALIFIED27Amy Elsner
1003Cody SaylorsItaly2026-06-11Chapman, Ross E Esq PROPOSAL59Amy Elsner
1004Aika InouyeItaly2026-06-10King, Christopher A Esq NEGOTIATION89Amy Elsner
1005Nicolas IturbideJapan2026-06-09Chanay, Jeffrey A Esq RENEWAL62Amy Elsner
1006Juan WieserSpain2026-05-27Chapman, Ross E Esq NEGOTIATION68Asiya Javayant
1007Jefferson SchemmerRussia2026-06-15Dorl, James J Esq NEW86Xuxue Feng
1008Tony FollerUnited Kingdom2026-05-20Buckley Miller Wright UNQUALIFIED7Ivan Magalhaes
1009Rodrigues CampainFrance2026-05-27Benton, John B Jr UNQUALIFIED57Stephen Shaw
1010Tony FollerRussia2026-06-04King, Christopher A Esq NEGOTIATION32Anna Fali
1011Adams MorascaIndia2026-05-22King, Christopher A Esq NEGOTIATION84Asiya Javayant
1012Stacey MacleadIndia2026-05-23Chemel, James L Cpa RENEWAL85Ioni Bowcher
1013Misaki RoysterCanada2026-06-10Morlong Associates UNQUALIFIED35Anna Fali
1014Chavez BriddickCanada2026-05-20Chanay, Jeffrey A Esq NEGOTIATION39Ivan Magalhaes
1015Clifford RimBrazil2026-06-12Printing Dimensions PROPOSAL99Xuxue Feng
1016Tony FollerUnited Kingdom2026-06-14Rousseaux, Michael Esq RENEWAL64Xuxue Feng
1017Wickens NestleBrazil2026-06-15Chapman, Ross E Esq QUALIFIED31Stephen Shaw
1018Mayumi KolmetzJapan2026-05-31Rousseaux, Michael Esq RENEWAL56Asiya Javayant
1019Murillo MaletUnited Kingdom2026-06-12Chemel, James L Cpa NEW2Onyama Limba
1020Clifford RimArgentina2026-05-29Chapman, Ross E Esq NEGOTIATION36Amy Elsner
1021Wickens NestleGermany2026-06-06Chemel, James L Cpa NEGOTIATION38Anna Fali
1022Leja CaldareraIndia2026-06-05Chemel, James L Cpa PROPOSAL57Asiya Javayant
1023Maria MarrierItaly2026-06-13Feltz Printing Service UNQUALIFIED4Asiya Javayant
1024Morrow RutaRussia2026-06-09Rangoni Of Florence RENEWAL41Bernardo Dominic
1025Adams MorascaGermany2026-06-03Feltz Printing Service RENEWAL24Bernardo Dominic
1026Darci PoquetteUnited Kingdom2026-05-24Dorl, James J Esq PROPOSAL7Xuxue Feng
1027Nicolas IturbideBrazil2026-05-26Rangoni Of Florence PROPOSAL45Asiya Javayant
1028Jefferson SchemmerCanada2026-05-28Morlong Associates UNQUALIFIED55Amy Elsner
1029Silvio SlusarskiBrazil2026-06-14Rousseaux, Michael Esq RENEWAL91Elwin Sharvill
1030Francesco ShinkoUnited Kingdom2026-06-10Rangoni Of Florence PROPOSAL79Ioni Bowcher
1031Ricardo GauchoFrance2026-05-22Rangoni Of Florence RENEWAL21Ioni Bowcher
1032Chavez BriddickSpain2026-06-08Feiner Bros RENEWAL52Anna Fali
1033Jennifer AmigonIndia2026-05-21Feiner Bros QUALIFIED99Stephen Shaw
1034Murillo MaletIndia2026-05-19Morlong Associates NEGOTIATION23Elwin Sharvill
1035Maria MarrierBrazil2026-06-08Feltz Printing Service RENEWAL43Ivan Magalhaes
1036Leja CaldareraAustralia2026-05-29Rousseaux, Michael Esq NEGOTIATION10Amy Elsner
1037Greenwood BologniaSpain2026-06-10King, Christopher A Esq UNQUALIFIED73Stephen Shaw
1038Leja CaldareraAustralia2026-06-13Feltz Printing Service NEW15Xuxue Feng
1039Costa DilliardRussia2026-06-14Truhlar And Truhlar Attys RENEWAL14Ioni Bowcher
1040Darci PoquetteAustralia2026-05-25Feiner Bros PROPOSAL40Elwin Sharvill
1041Johnson SergiCanada2026-05-19Dorl, James J Esq NEW16Ioni Bowcher
1042Deepesh ChuiArgentina2026-05-30Chemel, James L Cpa RENEWAL20Amy Elsner
1043David DarakjyJapan2026-06-16Printing Dimensions RENEWAL3Onyama Limba
1044Jones VocelkaRussia2026-06-14Buckley Miller Wright QUALIFIED76Onyama Limba
1045Morrow RutaGermany2026-06-15Feiner Bros PROPOSAL32Ioni Bowcher
1046Mayumi KolmetzSpain2026-06-09Printing Dimensions PROPOSAL25Amy Elsner
1047Antonio CaudyBrazil2026-06-04Feiner Bros NEGOTIATION14Onyama Limba
1048Julie StensethIndia2026-06-01Chapman, Ross E Esq RENEWAL46Bernardo Dominic
1049Jennifer AmigonIndia2026-06-11Truhlar And Truhlar Attys NEW30Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Smith GlickIndiaElwin Sharvill NEGOTIATION
Costa DilliardIndiaAnna Fali NEW
Ashley DoeJapanBernardo Dominic RENEWAL
Francesco ShinkoItalyXuxue Feng QUALIFIED
Aruna FigeroaJapanIvan Magalhaes UNQUALIFIED
Sinclair WaycottItalyIoni Bowcher QUALIFIED
Emily WhobreyGermanyXuxue Feng RENEWAL
Ivar PaprockiFranceElwin Sharvill NEGOTIATION
Aika InouyeFranceIvan Magalhaes RENEWAL
Maisha RulapaughCanadaAmy Elsner NEGOTIATION
Francesco ShinkoJapanOnyama Limba PROPOSAL
Tony FollerBrazilXuxue Feng RENEWAL
Nicolas IturbideRussiaXuxue Feng NEW
Chavez BriddickArgentinaXuxue Feng PROPOSAL
Francesco ShinkoArgentinaBernardo Dominic NEW
Stacey MacleadJapanElwin Sharvill NEGOTIATION
Kaitlin OstroskyItalyAmy Elsner NEGOTIATION
Jennifer AmigonAustraliaIoni Bowcher NEGOTIATION
David DarakjyCanadaAmy Elsner NEW
Izzy GarufiItalyAmy Elsner NEW
Misaki RoysterIndiaIvan Magalhaes PROPOSAL
Chavez BriddickArgentinaBernardo Dominic QUALIFIED
Juan WieserCanadaOnyama Limba UNQUALIFIED
Ashley DoeBrazilAnna Fali NEGOTIATION
David DarakjyGermanyAsiya Javayant QUALIFIED
Ricardo GauchoSpainAnna Fali NEW
Aditya KuskoRussiaAsiya Javayant NEGOTIATION
Chavez BriddickFranceBernardo Dominic RENEWAL
James ButtRussiaIoni Bowcher NEGOTIATION
Stacey MacleadAustraliaAnna Fali RENEWAL
Smith GlickArgentinaIoni Bowcher UNQUALIFIED
Tony FollerArgentinaAnna Fali NEGOTIATION
Francesco ShinkoArgentinaOnyama Limba NEGOTIATION
Cody SaylorsItalyXuxue Feng PROPOSAL
Salvatore StockhamSpainAnna Fali NEW
Jefferson SchemmerJapanElwin Sharvill NEGOTIATION
Juan WieserIndiaBernardo Dominic QUALIFIED
Antonio CaudyArgentinaAsiya Javayant NEGOTIATION
Aika InouyeUnited KingdomAnna Fali NEGOTIATION
Wickens NestleSpainAsiya Javayant RENEWAL
Maria MarrierAustraliaBernardo Dominic QUALIFIED
Mujtaba NickaBrazilAmy Elsner PROPOSAL
Clifford RimArgentinaIoni Bowcher UNQUALIFIED
Claire TollnerArgentinaIoni Bowcher PROPOSAL
Silvio SlusarskiAustraliaOnyama Limba PROPOSAL
Aika InouyeBrazilBernardo Dominic RENEWAL
Ashley DoeIndiaBernardo Dominic QUALIFIED
Costa DilliardSpainIvan Magalhaes NEGOTIATION
Chavez BriddickGermanyStephen Shaw UNQUALIFIED
Ivar PaprockiJapanAnna Fali NEW
Frozen Columns
Name
Aditya Kusko
Jennifer Amigon
Francesco Shinko
Isabel Bowley
Adams Morasca
Aruna Figeroa
Darci Poquette
Sinclair Waycott
Mayumi Kolmetz
Deepesh Chui
Jefferson Schemmer
Jefferson Schemmer
Darci Poquette
Johnson Sergi
Jefferson Schemmer
Greenwood Bolognia
Tony Foller
Morrow Ruta
Stacey Maclead
Wickens Nestle
Stacey Maclead
Adams Morasca
Morrow Ruta
Costa Dilliard
David Darakjy
Leon Oldroyd
Morrow Ruta
Juan Wieser
Jones Vocelka
Greenwood Bolognia
Nicolas Iturbide
Mujtaba Nicka
James Butt
Costa Dilliard
Ricardo Gaucho
James Butt
Jones Vocelka
Mayumi Kolmetz
Munro Ferencz
Darci Poquette
Kaitlin Ostrosky
James Butt
Leon Oldroyd
Rodrigues Campain
Aditya Kusko
Maria Marrier
Morrow Ruta
Juan Wieser
Juan Wieser
Stacey Maclead
IdCountryDate
1000Canada2026-06-04
1001Spain2026-06-11
1002Germany2026-06-02
1003Canada2026-05-31
1004Germany2026-06-11
1005Italy2026-06-05
1006Argentina2026-06-14
1007Russia2026-05-23
1008Brazil2026-05-21
1009Argentina2026-05-30
1010Australia2026-05-21
1011Japan2026-05-30
1012Brazil2026-05-24
1013Argentina2026-06-10
1014Brazil2026-06-06
1015Brazil2026-05-27
1016Russia2026-05-31
1017United Kingdom2026-05-24
1018United Kingdom2026-06-05
1019France2026-05-21
1020Australia2026-05-21
1021Italy2026-05-27
1022India2026-06-13
1023Brazil2026-06-01
1024Argentina2026-06-02
1025Russia2026-06-02
1026Brazil2026-05-22
1027Australia2026-06-09
1028India2026-05-25
1029Brazil2026-06-11
1030Australia2026-05-28
1031Italy2026-06-10
1032Brazil2026-05-20
1033Canada2026-05-26
1034Brazil2026-05-31
1035Germany2026-06-05
1036France2026-06-03
1037Canada2026-05-28
1038Canada2026-05-22
1039United Kingdom2026-06-14
1040Russia2026-05-25
1041Spain2026-06-11
1042Italy2026-06-03
1043United Kingdom2026-05-27
1044Australia2026-05-27
1045United Kingdom2026-06-03
1046Canada2026-06-01
1047Italy2026-06-08
1048Italy2026-06-06
1049Germany2026-06-05

On-Demand Data

NameIdCountryDate
Smith Glick1000Spain2026-05-20
Darci Poquette1001Spain2026-05-19
Greenwood Bolognia1002Spain2026-05-26
Antonio Caudy1003United Kingdom2026-06-15
Wickens Nestle1004Russia2026-06-10
Adams Morasca1005Australia2026-06-09
Antonio Caudy1006Canada2026-06-15
Chavez Briddick1007Russia2026-06-04
Antonio Caudy1008United Kingdom2026-05-31
Izzy Garufi1009Canada2026-05-21
Greenwood Bolognia1010Canada2026-06-04
Silvio Slusarski1011India2026-06-03
Alejandro Perin1012India2026-06-08
Jefferson Schemmer1013Brazil2026-06-11
Wickens Nestle1014Russia2026-06-10
Maisha Rulapaugh1015Japan2026-06-07
James Butt1016United Kingdom2026-05-19
Juan Wieser1017India2026-06-14
Stacey Maclead1018Italy2026-05-30
Jefferson Schemmer1019Japan2026-06-07
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Maria MarrierCanadaBernardo Dominic NEGOTIATION
Cody SaylorsUnited KingdomAmy Elsner UNQUALIFIED
David DarakjyFranceIoni Bowcher PROPOSAL
Rodrigues CampainSpainIvan Magalhaes RENEWAL
Johnson SergiBrazilBernardo Dominic RENEWAL
Cody SaylorsIndiaOnyama Limba RENEWAL
Leon OldroydRussiaAsiya Javayant NEGOTIATION
Silvio SlusarskiJapanStephen Shaw RENEWAL
Darci PoquetteCanadaElwin Sharvill PROPOSAL
Mayumi KolmetzGermanyXuxue Feng NEW
Aika InouyeJapanStephen Shaw PROPOSAL
Murillo MaletUnited KingdomXuxue Feng PROPOSAL
Jefferson SchemmerIndiaAmy Elsner PROPOSAL
Ivar PaprockiCanadaBernardo Dominic NEGOTIATION
Arvin AlbaresUnited KingdomAsiya Javayant UNQUALIFIED
Jennifer AmigonCanadaOnyama Limba UNQUALIFIED
Stacey MacleadCanadaElwin Sharvill UNQUALIFIED
Darci PoquetteUnited KingdomOnyama Limba UNQUALIFIED
Arvin AlbaresBrazilAnna Fali RENEWAL
Jeanfrancois VenereItalyBernardo Dominic NEW
Izzy GarufiBrazilStephen Shaw PROPOSAL
Aruna FigeroaJapanIoni Bowcher QUALIFIED
Salvatore StockhamGermanyIvan Magalhaes QUALIFIED
Wickens NestleIndiaElwin Sharvill NEGOTIATION
Leon OldroydSpainAmy Elsner UNQUALIFIED
Ashley DoeItalyAmy Elsner UNQUALIFIED
Maria MarrierGermanyBernardo Dominic UNQUALIFIED
Mayumi KolmetzArgentinaElwin Sharvill UNQUALIFIED
Chavez BriddickJapanXuxue Feng NEGOTIATION
Antonio CaudyFranceAnna Fali RENEWAL
Jefferson SchemmerRussiaAmy Elsner RENEWAL
David DarakjyAustraliaAmy Elsner UNQUALIFIED
Jefferson SchemmerItalyAsiya Javayant PROPOSAL
Maria MarrierJapanXuxue Feng NEW
Munro FerenczCanadaOnyama Limba UNQUALIFIED
Mujtaba NickaGermanyIvan Magalhaes PROPOSAL
Aika InouyeCanadaXuxue Feng RENEWAL
Maisha RulapaughCanadaAmy Elsner PROPOSAL
Deepesh ChuiBrazilOnyama Limba NEW
Kadeem FlosiUnited KingdomStephen Shaw 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>