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
Stacey MacleadItalyBernardo Dominic PROPOSAL
Costa DilliardSpainAsiya Javayant UNQUALIFIED
Chavez BriddickCanadaIoni Bowcher NEW
Mujtaba NickaSpainStephen Shaw RENEWAL
Francesco ShinkoGermanyOnyama Limba QUALIFIED
Antonio CaudyUnited KingdomElwin Sharvill NEW
Leja CaldareraBrazilOnyama Limba NEGOTIATION
Octavia MaletRussiaXuxue Feng NEGOTIATION
David DarakjyRussiaStephen Shaw UNQUALIFIED
Sinclair WaycottRussiaBernardo Dominic NEGOTIATION
Antonio CaudyArgentinaIvan Magalhaes QUALIFIED
Ivar PaprockiGermanyIvan Magalhaes UNQUALIFIED
Tony FollerCanadaBernardo Dominic NEGOTIATION
Ivar PaprockiFranceOnyama Limba QUALIFIED
Aditya KuskoIndiaIvan Magalhaes NEW
Nicolas IturbideArgentinaAnna Fali NEW
Kadeem FlosiRussiaAsiya Javayant QUALIFIED
Salvatore StockhamSpainStephen Shaw UNQUALIFIED
Johnson SergiFranceAnna Fali PROPOSAL
Jefferson SchemmerArgentinaIoni Bowcher NEW
Greenwood BologniaFranceXuxue Feng UNQUALIFIED
Juan WieserSpainOnyama Limba PROPOSAL
Jennifer AmigonUnited KingdomOnyama Limba RENEWAL
Alejandro PerinUnited KingdomBernardo Dominic RENEWAL
Izzy GarufiGermanyIvan Magalhaes PROPOSAL
Murillo MaletRussiaIvan Magalhaes QUALIFIED
Jefferson SchemmerArgentinaStephen Shaw QUALIFIED
Tony FollerFranceXuxue Feng NEW
Smith GlickRussiaAmy Elsner NEGOTIATION
David DarakjyAustraliaAsiya Javayant UNQUALIFIED
Jennifer AmigonCanadaIoni Bowcher NEW
Chavez BriddickJapanStephen Shaw NEW
Tony FollerIndiaBernardo Dominic NEGOTIATION
Johnson SergiUnited KingdomIvan Magalhaes PROPOSAL
Misaki RoysterItalyStephen Shaw NEW
James ButtBrazilOnyama Limba RENEWAL
Misaki RoysterCanadaElwin Sharvill RENEWAL
Deepesh ChuiGermanyIvan Magalhaes RENEWAL
Ricardo GauchoBrazilElwin Sharvill RENEWAL
Kaitlin OstroskyFranceAmy Elsner QUALIFIED
David DarakjyFranceAsiya Javayant PROPOSAL
Alejandro PerinArgentinaAsiya Javayant UNQUALIFIED
Jeanfrancois VenereUnited KingdomIvan Magalhaes NEW
Arvin AlbaresCanadaAmy Elsner PROPOSAL
Maria MarrierItalyOnyama Limba UNQUALIFIED
Nicolas IturbideRussiaOnyama Limba NEGOTIATION
Jennifer AmigonArgentinaAnna Fali NEGOTIATION
Misaki RoysterGermanyXuxue Feng NEGOTIATION
Emily WhobreyArgentinaXuxue Feng RENEWAL
Stacey MacleadJapanAnna Fali RENEWAL
Horizontal
NameCountryRepresentativeStatus
Kadeem FlosiAustraliaOnyama Limba PROPOSAL
Maria MarrierBrazilAmy Elsner NEGOTIATION
Mayumi KolmetzArgentinaIvan Magalhaes NEGOTIATION
Jennifer AmigonGermanyStephen Shaw UNQUALIFIED
Ricardo GauchoBrazilOnyama Limba QUALIFIED
Maria MarrierCanadaXuxue Feng PROPOSAL
Leon OldroydFranceAsiya Javayant UNQUALIFIED
Aruna FigeroaRussiaBernardo Dominic UNQUALIFIED
Wickens NestleJapanOnyama Limba UNQUALIFIED
Adams MorascaItalyAnna Fali PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Murillo MaletItaly2025-07-20Chemel, James L Cpa NEGOTIATION15Bernardo Dominic
1001Aika InouyeArgentina2025-08-04Dorl, James J Esq RENEWAL0Asiya Javayant
1002Faith GillianBrazil2025-07-24Truhlar And Truhlar Attys UNQUALIFIED30Ivan Magalhaes
1003Izzy GarufiBrazil2025-07-23Feiner Bros RENEWAL76Amy Elsner
1004Ivar PaprockiJapan2025-07-20Truhlar And Truhlar Attys PROPOSAL94Stephen Shaw
1005Claire TollnerBrazil2025-08-06Rousseaux, Michael Esq NEGOTIATION8Elwin Sharvill
1006Maisha RulapaughSpain2025-08-04Benton, John B Jr RENEWAL21Asiya Javayant
1007Morrow RutaCanada2025-07-21Buckley Miller Wright UNQUALIFIED65Onyama Limba
1008Ashley DoeGermany2025-07-13Dorl, James J Esq QUALIFIED56Elwin Sharvill
1009James ButtIndia2025-07-15Feiner Bros QUALIFIED93Anna Fali
1010Juan WieserArgentina2025-07-13Chanay, Jeffrey A Esq PROPOSAL77Xuxue Feng
1011Deepesh ChuiItaly2025-07-20Buckley Miller Wright PROPOSAL29Onyama Limba
1012Izzy GarufiFrance2025-07-26Chemel, James L Cpa UNQUALIFIED55Onyama Limba
1013Adams MorascaJapan2025-08-01King, Christopher A Esq NEW89Bernardo Dominic
1014Maisha RulapaughAustralia2025-07-22Chapman, Ross E Esq UNQUALIFIED31Elwin Sharvill
1015Ivar PaprockiArgentina2025-07-23Printing Dimensions RENEWAL30Anna Fali
1016Chavez BriddickJapan2025-07-13Chanay, Jeffrey A Esq NEW35Bernardo Dominic
1017Deepesh ChuiUnited Kingdom2025-07-10Chapman, Ross E Esq UNQUALIFIED80Amy Elsner
1018Maria MarrierIndia2025-07-17Feiner Bros QUALIFIED96Elwin Sharvill
1019Murillo MaletItaly2025-08-06Feltz Printing Service NEGOTIATION24Bernardo Dominic
1020Darci PoquetteRussia2025-08-02Chanay, Jeffrey A Esq UNQUALIFIED71Bernardo Dominic
1021Francesco ShinkoJapan2025-07-24Benton, John B Jr PROPOSAL99Xuxue Feng
1022Jeanfrancois VenereCanada2025-07-19Buckley Miller Wright RENEWAL95Bernardo Dominic
1023Greenwood BologniaBrazil2025-08-04King, Christopher A Esq PROPOSAL23Ioni Bowcher
1024Greenwood BologniaAustralia2025-07-14Chemel, James L Cpa UNQUALIFIED59Onyama Limba
1025David DarakjyItaly2025-07-13Morlong Associates NEGOTIATION70Bernardo Dominic
1026Darci PoquetteCanada2025-07-11Chapman, Ross E Esq QUALIFIED61Xuxue Feng
1027Adams MorascaCanada2025-07-18Chanay, Jeffrey A Esq QUALIFIED41Anna Fali
1028Juan WieserCanada2025-07-18Rangoni Of Florence PROPOSAL64Xuxue Feng
1029Stacey MacleadBrazil2025-08-04Printing Dimensions NEW48Asiya Javayant
1030Mujtaba NickaUnited Kingdom2025-07-26Benton, John B Jr UNQUALIFIED27Asiya Javayant
1031Claire TollnerSpain2025-08-04Buckley Miller Wright PROPOSAL97Ioni Bowcher
1032Julie StensethSpain2025-07-29Chapman, Ross E Esq QUALIFIED15Onyama Limba
1033Antonio CaudyJapan2025-07-30Feltz Printing Service NEW62Elwin Sharvill
1034Cody SaylorsUnited Kingdom2025-07-26Buckley Miller Wright PROPOSAL42Onyama Limba
1035Mujtaba NickaGermany2025-07-15Dorl, James J Esq RENEWAL5Elwin Sharvill
1036Johnson SergiSpain2025-08-02Dorl, James J Esq PROPOSAL57Asiya Javayant
1037Clifford RimFrance2025-08-03Benton, John B Jr NEGOTIATION25Onyama Limba
1038Morrow RutaJapan2025-07-27King, Christopher A Esq UNQUALIFIED29Xuxue Feng
1039Morrow RutaAustralia2025-07-21Chemel, James L Cpa RENEWAL91Asiya Javayant
1040Aika InouyeBrazil2025-08-05Morlong Associates NEGOTIATION56Bernardo Dominic
1041Cody SaylorsUnited Kingdom2025-07-22Chemel, James L Cpa NEW30Ivan Magalhaes
1042James ButtBrazil2025-07-26Commercial Press NEGOTIATION78Amy Elsner
1043Johnson SergiUnited Kingdom2025-08-01Rangoni Of Florence PROPOSAL6Ioni Bowcher
1044Claire TollnerIndia2025-07-27Dorl, James J Esq UNQUALIFIED61Asiya Javayant
1045Francesco ShinkoIndia2025-07-31Chapman, Ross E Esq UNQUALIFIED50Onyama Limba
1046Aruna FigeroaBrazil2025-07-12Truhlar And Truhlar Attys NEW41Asiya Javayant
1047Jefferson SchemmerFrance2025-07-17Dorl, James J Esq UNQUALIFIED11Xuxue Feng
1048Jeanfrancois VenereRussia2025-08-03Benton, John B Jr NEW53Ivan Magalhaes
1049Costa DilliardSpain2025-07-29Feltz Printing Service NEGOTIATION70Asiya Javayant
Frozen Rows
NameCountryRepresentativeStatus
Izzy GarufiCanadaElwin Sharvill QUALIFIED
Chavez BriddickJapanOnyama Limba NEW
Francesco ShinkoJapanXuxue Feng UNQUALIFIED
Claire TollnerUnited KingdomIoni Bowcher UNQUALIFIED
Mujtaba NickaGermanyIvan Magalhaes PROPOSAL
Wickens NestleUnited KingdomAsiya Javayant UNQUALIFIED
David DarakjyRussiaXuxue Feng NEW
Sinclair WaycottIndiaOnyama Limba NEGOTIATION
Chavez BriddickSpainElwin Sharvill NEW
Jefferson SchemmerRussiaBernardo Dominic QUALIFIED
Mujtaba NickaArgentinaIoni Bowcher QUALIFIED
Greenwood BologniaGermanyIoni Bowcher RENEWAL
Sinclair WaycottJapanXuxue Feng RENEWAL
Rodrigues CampainCanadaBernardo Dominic RENEWAL
Adams MorascaBrazilElwin Sharvill NEW
Aika InouyeItalyStephen Shaw RENEWAL
Misaki RoysterGermanyBernardo Dominic RENEWAL
Ricardo GauchoCanadaIoni Bowcher QUALIFIED
Morrow RutaItalyBernardo Dominic NEGOTIATION
Maria MarrierSpainIoni Bowcher NEW
Aruna FigeroaRussiaAmy Elsner RENEWAL
Costa DilliardGermanyIoni Bowcher QUALIFIED
Chavez BriddickBrazilOnyama Limba UNQUALIFIED
Arvin AlbaresBrazilXuxue Feng NEGOTIATION
Leon OldroydCanadaIvan Magalhaes QUALIFIED
Misaki RoysterSpainElwin Sharvill UNQUALIFIED
Jefferson SchemmerItalyXuxue Feng RENEWAL
Jeanfrancois VenereFranceBernardo Dominic NEGOTIATION
Murillo MaletFranceElwin Sharvill RENEWAL
Munro FerenczSpainIvan Magalhaes NEGOTIATION
Juan WieserGermanyAnna Fali RENEWAL
Kaitlin OstroskyCanadaBernardo Dominic RENEWAL
Aditya KuskoCanadaAmy Elsner RENEWAL
Maisha RulapaughItalyElwin Sharvill PROPOSAL
Arvin AlbaresBrazilOnyama Limba QUALIFIED
Darci PoquetteItalyAmy Elsner PROPOSAL
Silvio SlusarskiItalyElwin Sharvill NEW
Izzy GarufiRussiaBernardo Dominic UNQUALIFIED
Adams MorascaArgentinaAsiya Javayant UNQUALIFIED
Nicolas IturbideItalyBernardo Dominic NEW
Aditya KuskoSpainIvan Magalhaes NEGOTIATION
Deepesh ChuiFranceElwin Sharvill RENEWAL
Arvin AlbaresJapanElwin Sharvill PROPOSAL
Alejandro PerinUnited KingdomOnyama Limba QUALIFIED
Jeanfrancois VenereUnited KingdomOnyama Limba QUALIFIED
Izzy GarufiRussiaElwin Sharvill UNQUALIFIED
Alejandro PerinGermanyXuxue Feng PROPOSAL
Kaitlin OstroskyIndiaBernardo Dominic NEW
Francesco ShinkoArgentinaAmy Elsner PROPOSAL
Jennifer AmigonAustraliaIvan Magalhaes UNQUALIFIED
Frozen Columns
Name
Jeanfrancois Venere
David Darakjy
James Butt
Rodrigues Campain
Izzy Garufi
Jefferson Schemmer
Claire Tollner
Juan Wieser
Morrow Ruta
Deepesh Chui
Mayumi Kolmetz
Darci Poquette
Tony Foller
Aditya Kusko
Arvin Albares
Jefferson Schemmer
Maria Marrier
Costa Dilliard
Jones Vocelka
Cody Saylors
Mayumi Kolmetz
Tony Foller
Octavia Malet
Nicolas Iturbide
Nicolas Iturbide
Wickens Nestle
Stacey Maclead
Alejandro Perin
Costa Dilliard
Chavez Briddick
Arvin Albares
Adams Morasca
Jeanfrancois Venere
Murillo Malet
Aruna Figeroa
Smith Glick
Julie Stenseth
Claire Tollner
Juan Wieser
Leja Caldarera
Leon Oldroyd
Smith Glick
Isabel Bowley
David Darakjy
Emily Whobrey
Johnson Sergi
Murillo Malet
Greenwood Bolognia
Sinclair Waycott
Murillo Malet
IdCountryDate
1000United Kingdom2025-07-27
1001Germany2025-07-31
1002Spain2025-07-25
1003Canada2025-08-04
1004India2025-07-30
1005United Kingdom2025-07-28
1006Germany2025-07-10
1007Spain2025-07-28
1008Canada2025-08-07
1009Russia2025-08-08
1010Russia2025-07-14
1011Canada2025-08-02
1012Russia2025-07-13
1013Argentina2025-07-20
1014United Kingdom2025-08-08
1015Russia2025-07-17
1016Australia2025-08-04
1017Russia2025-07-25
1018Italy2025-07-12
1019Canada2025-07-13
1020Japan2025-07-29
1021Spain2025-07-10
1022India2025-07-30
1023France2025-07-17
1024United Kingdom2025-07-25
1025Brazil2025-08-08
1026Brazil2025-08-03
1027France2025-07-20
1028Spain2025-08-01
1029Argentina2025-07-30
1030Canada2025-08-07
1031Brazil2025-07-31
1032Spain2025-07-18
1033Canada2025-07-20
1034Australia2025-07-22
1035Germany2025-08-04
1036Brazil2025-07-10
1037Italy2025-07-17
1038Russia2025-07-20
1039France2025-07-15
1040Brazil2025-07-15
1041Spain2025-07-31
1042Canada2025-07-15
1043Spain2025-07-10
1044Australia2025-07-23
1045France2025-07-11
1046Germany2025-07-20
1047Germany2025-08-06
1048Germany2025-08-04
1049Japan2025-07-20

On-Demand Data

NameIdCountryDate
Arvin Albares1000France2025-07-26
Ricardo Gaucho1001Brazil2025-07-10
Aika Inouye1002Brazil2025-08-05
Faith Gillian1003Brazil2025-08-07
Leja Caldarera1004Australia2025-07-14
Darci Poquette1005Canada2025-08-03
Octavia Malet1006Argentina2025-07-31
Mayumi Kolmetz1007United Kingdom2025-07-29
Jones Vocelka1008Spain2025-07-10
Sinclair Waycott1009Russia2025-07-28
Chavez Briddick1010Japan2025-07-15
Ricardo Gaucho1011United Kingdom2025-07-29
Antonio Caudy1012Russia2025-07-30
Aika Inouye1013France2025-07-23
Emily Whobrey1014Australia2025-08-01
Silvio Slusarski1015United Kingdom2025-08-01
Maria Marrier1016Italy2025-07-13
Alejandro Perin1017United Kingdom2025-07-30
James Butt1018France2025-08-06
David Darakjy1019India2025-07-28
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Rodrigues CampainFranceAsiya Javayant RENEWAL
Morrow RutaUnited KingdomXuxue Feng NEW
Clifford RimBrazilAnna Fali UNQUALIFIED
Jones VocelkaJapanElwin Sharvill PROPOSAL
Alejandro PerinUnited KingdomStephen Shaw NEGOTIATION
Clifford RimJapanIoni Bowcher PROPOSAL
Ricardo GauchoSpainAnna Fali RENEWAL
Faith GillianRussiaXuxue Feng PROPOSAL
Leja CaldareraItalyBernardo Dominic PROPOSAL
Smith GlickCanadaAmy Elsner NEW
Claire TollnerRussiaIoni Bowcher NEW
Arvin AlbaresGermanyAsiya Javayant PROPOSAL
Deepesh ChuiSpainOnyama Limba UNQUALIFIED
Costa DilliardArgentinaBernardo Dominic NEW
Jefferson SchemmerRussiaBernardo Dominic UNQUALIFIED
Kadeem FlosiAustraliaStephen Shaw NEGOTIATION
Jeanfrancois VenereCanadaAnna Fali UNQUALIFIED
Johnson SergiIndiaAsiya Javayant PROPOSAL
Kaitlin OstroskyIndiaElwin Sharvill PROPOSAL
Jones VocelkaFranceAnna Fali NEGOTIATION
Jefferson SchemmerJapanStephen Shaw UNQUALIFIED
Salvatore StockhamItalyAnna Fali PROPOSAL
Morrow RutaBrazilIoni Bowcher RENEWAL
Emily WhobreyAustraliaAnna Fali PROPOSAL
Nicolas IturbideUnited KingdomStephen Shaw NEW
Sinclair WaycottSpainStephen Shaw QUALIFIED
Clifford RimIndiaIoni Bowcher NEW
Murillo MaletFranceBernardo Dominic QUALIFIED
Smith GlickRussiaStephen Shaw QUALIFIED
Tony FollerCanadaAnna Fali RENEWAL
Julie StensethCanadaIoni Bowcher PROPOSAL
Isabel BowleyCanadaXuxue Feng NEW
Maisha RulapaughCanadaElwin Sharvill PROPOSAL
Isabel BowleyGermanyStephen Shaw RENEWAL
Adams MorascaCanadaOnyama Limba NEW
Chavez BriddickAustraliaElwin Sharvill NEGOTIATION
Mayumi KolmetzFranceElwin Sharvill UNQUALIFIED
Cody SaylorsGermanyXuxue Feng RENEWAL
Antonio CaudyAustraliaStephen Shaw NEGOTIATION
Sinclair WaycottSpainBernardo 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>