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
Faith GillianFranceAsiya Javayant UNQUALIFIED
Ivar PaprockiRussiaAmy Elsner QUALIFIED
Sinclair WaycottCanadaAmy Elsner PROPOSAL
Deepesh ChuiBrazilBernardo Dominic PROPOSAL
Ivar PaprockiUnited KingdomAsiya Javayant RENEWAL
Jeanfrancois VenereAustraliaElwin Sharvill UNQUALIFIED
Maria MarrierCanadaBernardo Dominic QUALIFIED
Kaitlin OstroskyUnited KingdomBernardo Dominic UNQUALIFIED
Adams MorascaCanadaAnna Fali RENEWAL
Leon OldroydJapanAmy Elsner NEW
Jennifer AmigonIndiaAsiya Javayant RENEWAL
Costa DilliardRussiaOnyama Limba UNQUALIFIED
Stacey MacleadBrazilAmy Elsner UNQUALIFIED
Claire TollnerAustraliaIoni Bowcher QUALIFIED
Jeanfrancois VenereArgentinaIvan Magalhaes NEW
Jennifer AmigonItalyIoni Bowcher NEGOTIATION
Jones VocelkaJapanAnna Fali UNQUALIFIED
Maria MarrierRussiaIvan Magalhaes RENEWAL
Isabel BowleyRussiaIoni Bowcher NEGOTIATION
Rodrigues CampainBrazilElwin Sharvill PROPOSAL
Octavia MaletSpainAsiya Javayant QUALIFIED
Silvio SlusarskiUnited KingdomIoni Bowcher NEW
Antonio CaudyRussiaXuxue Feng NEGOTIATION
Johnson SergiSpainAmy Elsner RENEWAL
Aruna FigeroaBrazilElwin Sharvill NEGOTIATION
Leon OldroydCanadaAnna Fali UNQUALIFIED
Ashley DoeIndiaStephen Shaw NEGOTIATION
Smith GlickGermanyAsiya Javayant NEGOTIATION
Adams MorascaIndiaAnna Fali NEW
Julie StensethUnited KingdomIvan Magalhaes NEGOTIATION
Faith GillianJapanAnna Fali QUALIFIED
Arvin AlbaresBrazilStephen Shaw QUALIFIED
Sinclair WaycottIndiaStephen Shaw PROPOSAL
Rodrigues CampainFranceOnyama Limba NEGOTIATION
Jones VocelkaCanadaOnyama Limba UNQUALIFIED
Leon OldroydArgentinaBernardo Dominic PROPOSAL
Ivar PaprockiSpainIvan Magalhaes QUALIFIED
Jennifer AmigonRussiaXuxue Feng QUALIFIED
Aditya KuskoJapanStephen Shaw PROPOSAL
Aditya KuskoFranceStephen Shaw QUALIFIED
Arvin AlbaresAustraliaStephen Shaw QUALIFIED
Izzy GarufiAustraliaAnna Fali PROPOSAL
Kaitlin OstroskyJapanBernardo Dominic RENEWAL
Antonio CaudyJapanXuxue Feng QUALIFIED
Isabel BowleyGermanyAnna Fali RENEWAL
Costa DilliardJapanIoni Bowcher PROPOSAL
Greenwood BologniaBrazilElwin Sharvill RENEWAL
Leja CaldareraSpainOnyama Limba PROPOSAL
Isabel BowleyFranceElwin Sharvill UNQUALIFIED
Kadeem FlosiAustraliaBernardo Dominic UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Rodrigues CampainArgentinaBernardo Dominic PROPOSAL
Aditya KuskoGermanyXuxue Feng QUALIFIED
Antonio CaudyUnited KingdomStephen Shaw NEW
Leon OldroydBrazilIoni Bowcher UNQUALIFIED
Costa DilliardRussiaXuxue Feng RENEWAL
Mayumi KolmetzArgentinaBernardo Dominic RENEWAL
Morrow RutaItalyElwin Sharvill PROPOSAL
Murillo MaletItalyAmy Elsner NEW
Alejandro PerinFranceIoni Bowcher PROPOSAL
Smith GlickUnited KingdomStephen Shaw UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Smith GlickJapan2026-04-30Benton, John B Jr UNQUALIFIED52Amy Elsner
1001Silvio SlusarskiJapan2026-05-20Feltz Printing Service PROPOSAL58Anna Fali
1002Sinclair WaycottArgentina2026-05-16Chanay, Jeffrey A Esq NEW71Bernardo Dominic
1003Jones VocelkaArgentina2026-04-30Commercial Press PROPOSAL80Onyama Limba
1004Morrow RutaIndia2026-05-04Chapman, Ross E Esq RENEWAL36Amy Elsner
1005Chavez BriddickBrazil2026-05-18Morlong Associates UNQUALIFIED70Ioni Bowcher
1006Greenwood BologniaRussia2026-05-18Printing Dimensions UNQUALIFIED7Elwin Sharvill
1007Wickens NestleAustralia2026-05-18Commercial Press RENEWAL22Onyama Limba
1008Leon OldroydJapan2026-05-06Buckley Miller Wright NEW7Onyama Limba
1009Sinclair WaycottGermany2026-05-02Morlong Associates RENEWAL23Amy Elsner
1010Deepesh ChuiBrazil2026-04-28Rousseaux, Michael Esq RENEWAL87Anna Fali
1011Smith GlickArgentina2026-05-22Morlong Associates NEW18Elwin Sharvill
1012Arvin AlbaresBrazil2026-04-30Buckley Miller Wright NEGOTIATION56Ioni Bowcher
1013Jones VocelkaCanada2026-05-20Rousseaux, Michael Esq NEGOTIATION57Bernardo Dominic
1014Ivar PaprockiItaly2026-04-30Feiner Bros NEGOTIATION40Asiya Javayant
1015Misaki RoysterSpain2026-05-05Chapman, Ross E Esq UNQUALIFIED60Amy Elsner
1016Mayumi KolmetzAustralia2026-05-24Buckley Miller Wright RENEWAL84Bernardo Dominic
1017Deepesh ChuiSpain2026-05-07Morlong Associates UNQUALIFIED18Amy Elsner
1018Rodrigues CampainSpain2026-05-14Rousseaux, Michael Esq QUALIFIED12Ivan Magalhaes
1019Nicolas IturbideAustralia2026-05-04Commercial Press NEW43Ioni Bowcher
1020Smith GlickBrazil2026-05-20Chanay, Jeffrey A Esq UNQUALIFIED43Onyama Limba
1021Adams MorascaJapan2026-05-24Rousseaux, Michael Esq QUALIFIED27Xuxue Feng
1022Kadeem FlosiCanada2026-05-04Printing Dimensions UNQUALIFIED2Ivan Magalhaes
1023Darci PoquetteAustralia2026-05-20Commercial Press QUALIFIED7Xuxue Feng
1024Maria MarrierIndia2026-05-06Feiner Bros NEGOTIATION81Bernardo Dominic
1025Silvio SlusarskiFrance2026-04-26Benton, John B Jr QUALIFIED26Stephen Shaw
1026Leja CaldareraSpain2026-05-20Feltz Printing Service PROPOSAL28Xuxue Feng
1027Adams MorascaGermany2026-05-01Chemel, James L Cpa RENEWAL15Bernardo Dominic
1028Silvio SlusarskiArgentina2026-04-30Rangoni Of Florence NEW44Bernardo Dominic
1029Adams MorascaCanada2026-04-29Buckley Miller Wright NEW44Ioni Bowcher
1030Mayumi KolmetzRussia2026-05-25Feiner Bros PROPOSAL52Ivan Magalhaes
1031Chavez BriddickFrance2026-04-28Benton, John B Jr NEW97Anna Fali
1032Tony FollerFrance2026-05-06Chapman, Ross E Esq PROPOSAL62Stephen Shaw
1033Darci PoquetteItaly2026-05-11Benton, John B Jr PROPOSAL96Anna Fali
1034Isabel BowleyIndia2026-05-09Truhlar And Truhlar Attys QUALIFIED64Amy Elsner
1035Ashley DoeGermany2026-05-03Morlong Associates PROPOSAL25Stephen Shaw
1036Mayumi KolmetzArgentina2026-05-10Benton, John B Jr PROPOSAL16Elwin Sharvill
1037Munro FerenczArgentina2026-05-10Rousseaux, Michael Esq NEGOTIATION80Ioni Bowcher
1038Sinclair WaycottCanada2026-04-29Rangoni Of Florence PROPOSAL6Ioni Bowcher
1039Octavia MaletSpain2026-05-06Chanay, Jeffrey A Esq NEW92Asiya Javayant
1040Silvio SlusarskiJapan2026-05-06Chapman, Ross E Esq NEW48Asiya Javayant
1041Silvio SlusarskiGermany2026-05-12Morlong Associates NEW52Stephen Shaw
1042Chavez BriddickUnited Kingdom2026-05-03Truhlar And Truhlar Attys NEW35Anna Fali
1043Deepesh ChuiJapan2026-05-23Printing Dimensions RENEWAL29Amy Elsner
1044Arvin AlbaresFrance2026-05-01Chanay, Jeffrey A Esq UNQUALIFIED88Ioni Bowcher
1045Deepesh ChuiRussia2026-05-08Buckley Miller Wright PROPOSAL2Elwin Sharvill
1046Rodrigues CampainGermany2026-05-23Rangoni Of Florence NEW85Xuxue Feng
1047Juan WieserGermany2026-04-26Feltz Printing Service NEW12Xuxue Feng
1048Jefferson SchemmerAustralia2026-05-04Benton, John B Jr NEGOTIATION10Xuxue Feng
1049Morrow RutaAustralia2026-05-12Rangoni Of Florence UNQUALIFIED2Bernardo Dominic
Frozen Rows
NameCountryRepresentativeStatus
Leja CaldareraSpainBernardo Dominic QUALIFIED
Johnson SergiIndiaStephen Shaw PROPOSAL
Maria MarrierArgentinaIoni Bowcher RENEWAL
Maria MarrierCanadaElwin Sharvill RENEWAL
Kaitlin OstroskyJapanBernardo Dominic UNQUALIFIED
Ivar PaprockiArgentinaAnna Fali PROPOSAL
Ivar PaprockiUnited KingdomStephen Shaw PROPOSAL
Jennifer AmigonAustraliaOnyama Limba NEW
Costa DilliardIndiaAsiya Javayant UNQUALIFIED
Chavez BriddickGermanyXuxue Feng RENEWAL
Costa DilliardRussiaElwin Sharvill NEGOTIATION
Maria MarrierArgentinaXuxue Feng NEW
Juan WieserCanadaXuxue Feng RENEWAL
Emily WhobreyIndiaElwin Sharvill NEGOTIATION
Munro FerenczIndiaAnna Fali NEGOTIATION
Adams MorascaRussiaAnna Fali UNQUALIFIED
Sinclair WaycottRussiaAmy Elsner RENEWAL
Aruna FigeroaSpainXuxue Feng NEGOTIATION
Maisha RulapaughBrazilBernardo Dominic PROPOSAL
Jones VocelkaArgentinaAsiya Javayant UNQUALIFIED
Tony FollerSpainStephen Shaw UNQUALIFIED
Francesco ShinkoSpainAnna Fali QUALIFIED
Antonio CaudyArgentinaElwin Sharvill PROPOSAL
Morrow RutaArgentinaAmy Elsner PROPOSAL
Kaitlin OstroskySpainOnyama Limba RENEWAL
Francesco ShinkoGermanyAmy Elsner NEW
Jefferson SchemmerItalyAnna Fali QUALIFIED
Arvin AlbaresGermanyIvan Magalhaes QUALIFIED
Faith GillianUnited KingdomAsiya Javayant QUALIFIED
Greenwood BologniaIndiaAsiya Javayant NEW
Jennifer AmigonCanadaBernardo Dominic RENEWAL
Cody SaylorsBrazilAnna Fali NEGOTIATION
Silvio SlusarskiIndiaStephen Shaw RENEWAL
Greenwood BologniaBrazilIvan Magalhaes UNQUALIFIED
Kadeem FlosiFranceXuxue Feng RENEWAL
Emily WhobreyBrazilAsiya Javayant RENEWAL
Jeanfrancois VenereAustraliaBernardo Dominic PROPOSAL
Costa DilliardJapanOnyama Limba PROPOSAL
Maisha RulapaughRussiaXuxue Feng NEGOTIATION
Jennifer AmigonGermanyStephen Shaw RENEWAL
Tony FollerSpainAnna Fali PROPOSAL
Juan WieserSpainOnyama Limba NEGOTIATION
Sinclair WaycottArgentinaAmy Elsner NEGOTIATION
Francesco ShinkoBrazilElwin Sharvill RENEWAL
Izzy GarufiIndiaIoni Bowcher NEW
Faith GillianSpainAmy Elsner RENEWAL
Antonio CaudyBrazilOnyama Limba QUALIFIED
Juan WieserGermanyStephen Shaw QUALIFIED
James ButtIndiaStephen Shaw NEW
Greenwood BologniaFranceIvan Magalhaes NEW
Frozen Columns
Name
Chavez Briddick
Aika Inouye
Aruna Figeroa
Kadeem Flosi
Kadeem Flosi
Francesco Shinko
Kaitlin Ostrosky
Isabel Bowley
Maisha Rulapaugh
Alejandro Perin
Kaitlin Ostrosky
Jeanfrancois Venere
Cody Saylors
Kadeem Flosi
Maisha Rulapaugh
David Darakjy
Wickens Nestle
Octavia Malet
Maria Marrier
Smith Glick
Greenwood Bolognia
Stacey Maclead
Jefferson Schemmer
Juan Wieser
James Butt
Jeanfrancois Venere
Silvio Slusarski
Nicolas Iturbide
Ricardo Gaucho
Deepesh Chui
Jones Vocelka
Francesco Shinko
Morrow Ruta
Wickens Nestle
Adams Morasca
Jones Vocelka
Adams Morasca
Rodrigues Campain
Morrow Ruta
Chavez Briddick
Izzy Garufi
Ashley Doe
Deepesh Chui
Jones Vocelka
Stacey Maclead
Greenwood Bolognia
Francesco Shinko
Smith Glick
Emily Whobrey
Leja Caldarera
IdCountryDate
1000Japan2026-05-02
1001Germany2026-05-14
1002India2026-05-21
1003Russia2026-05-15
1004Italy2026-05-04
1005Germany2026-04-27
1006Russia2026-05-03
1007India2026-05-05
1008Argentina2026-05-06
1009Spain2026-05-20
1010Australia2026-04-28
1011Brazil2026-05-11
1012Spain2026-05-16
1013France2026-05-04
1014Brazil2026-05-18
1015India2026-05-18
1016Australia2026-05-25
1017Germany2026-05-04
1018Italy2026-05-09
1019India2026-04-28
1020India2026-05-09
1021Canada2026-05-22
1022Germany2026-05-25
1023Australia2026-05-17
1024France2026-05-20
1025Brazil2026-05-05
1026Russia2026-05-20
1027Argentina2026-05-17
1028Argentina2026-04-26
1029Australia2026-05-01
1030Italy2026-05-02
1031Russia2026-05-18
1032Italy2026-05-05
1033Argentina2026-05-21
1034United Kingdom2026-05-11
1035Canada2026-04-29
1036France2026-05-12
1037Spain2026-05-12
1038Italy2026-05-01
1039France2026-05-02
1040Brazil2026-05-23
1041Brazil2026-05-15
1042Italy2026-05-13
1043Germany2026-05-09
1044India2026-05-02
1045Spain2026-05-10
1046Japan2026-04-27
1047Russia2026-04-28
1048Canada2026-05-06
1049India2026-05-03

On-Demand Data

NameIdCountryDate
Misaki Royster1000Australia2026-05-22
Clifford Rim1001Argentina2026-04-26
Johnson Sergi1002United Kingdom2026-05-20
Francesco Shinko1003Spain2026-04-28
Claire Tollner1004Argentina2026-05-08
Misaki Royster1005Brazil2026-04-29
Antonio Caudy1006United Kingdom2026-04-27
Izzy Garufi1007France2026-05-08
Maria Marrier1008United Kingdom2026-04-29
Octavia Malet1009Brazil2026-05-01
David Darakjy1010Brazil2026-04-29
Costa Dilliard1011Italy2026-04-27
Costa Dilliard1012Canada2026-04-30
Antonio Caudy1013Australia2026-04-29
Kadeem Flosi1014Spain2026-04-30
Smith Glick1015Japan2026-05-23
Stacey Maclead1016Italy2026-05-01
Julie Stenseth1017Australia2026-05-04
Jefferson Schemmer1018Spain2026-05-10
Maria Marrier1019Canada2026-05-16
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Darci PoquetteIndiaBernardo Dominic NEW
Stacey MacleadJapanStephen Shaw NEGOTIATION
Mayumi KolmetzJapanAnna Fali QUALIFIED
Isabel BowleyItalyBernardo Dominic PROPOSAL
Juan WieserUnited KingdomAmy Elsner QUALIFIED
Mujtaba NickaJapanAnna Fali RENEWAL
James ButtJapanOnyama Limba QUALIFIED
Maria MarrierArgentinaXuxue Feng QUALIFIED
Ricardo GauchoArgentinaIvan Magalhaes UNQUALIFIED
Adams MorascaUnited KingdomXuxue Feng QUALIFIED
David DarakjyCanadaIvan Magalhaes RENEWAL
Maisha RulapaughJapanXuxue Feng QUALIFIED
Arvin AlbaresIndiaAmy Elsner NEW
Rodrigues CampainAustraliaBernardo Dominic QUALIFIED
Misaki RoysterIndiaOnyama Limba UNQUALIFIED
Wickens NestleUnited KingdomElwin Sharvill PROPOSAL
Aruna FigeroaCanadaAmy Elsner NEGOTIATION
Francesco ShinkoUnited KingdomAnna Fali RENEWAL
Kaitlin OstroskyAustraliaBernardo Dominic UNQUALIFIED
Kaitlin OstroskyCanadaAnna Fali NEW
Clifford RimSpainAsiya Javayant NEGOTIATION
Adams MorascaCanadaAsiya Javayant UNQUALIFIED
Aika InouyeBrazilOnyama Limba UNQUALIFIED
Arvin AlbaresUnited KingdomOnyama Limba NEW
Arvin AlbaresJapanIvan Magalhaes UNQUALIFIED
Francesco ShinkoAustraliaAmy Elsner RENEWAL
Murillo MaletArgentinaAsiya Javayant PROPOSAL
Aika InouyeFranceStephen Shaw RENEWAL
Julie StensethSpainStephen Shaw PROPOSAL
Costa DilliardJapanIvan Magalhaes NEGOTIATION
Kaitlin OstroskyCanadaAmy Elsner NEGOTIATION
Leja CaldareraItalyAsiya Javayant RENEWAL
Ricardo GauchoAustraliaIvan Magalhaes NEGOTIATION
Ivar PaprockiRussiaXuxue Feng PROPOSAL
Jefferson SchemmerSpainXuxue Feng UNQUALIFIED
Aika InouyeCanadaAnna Fali NEW
Ashley DoeRussiaAmy Elsner UNQUALIFIED
Maisha RulapaughUnited KingdomIoni Bowcher NEW
Stacey MacleadUnited KingdomIoni Bowcher UNQUALIFIED
Darci PoquetteFranceIoni Bowcher 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>