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
Aruna FigeroaGermanyIoni Bowcher UNQUALIFIED
Tony FollerSpainXuxue Feng UNQUALIFIED
Maria MarrierJapanXuxue Feng NEGOTIATION
Aruna FigeroaAustraliaAnna Fali RENEWAL
Rodrigues CampainJapanElwin Sharvill RENEWAL
Kadeem FlosiGermanyAmy Elsner NEGOTIATION
Greenwood BologniaCanadaAnna Fali QUALIFIED
Izzy GarufiItalyElwin Sharvill PROPOSAL
Sinclair WaycottRussiaAnna Fali NEW
Johnson SergiUnited KingdomBernardo Dominic NEGOTIATION
Clifford RimJapanElwin Sharvill UNQUALIFIED
David DarakjyItalyIvan Magalhaes NEGOTIATION
Julie StensethBrazilXuxue Feng NEGOTIATION
Aditya KuskoUnited KingdomAsiya Javayant NEW
Octavia MaletItalyXuxue Feng UNQUALIFIED
Salvatore StockhamUnited KingdomStephen Shaw NEGOTIATION
Antonio CaudyUnited KingdomOnyama Limba PROPOSAL
Aika InouyeCanadaBernardo Dominic RENEWAL
Sinclair WaycottItalyAnna Fali NEW
Arvin AlbaresCanadaXuxue Feng NEGOTIATION
Costa DilliardItalyAnna Fali PROPOSAL
Ashley DoeRussiaOnyama Limba UNQUALIFIED
Emily WhobreyJapanAnna Fali NEGOTIATION
Maria MarrierCanadaIoni Bowcher RENEWAL
Isabel BowleyAustraliaXuxue Feng NEGOTIATION
Alejandro PerinSpainIoni Bowcher NEGOTIATION
Leon OldroydBrazilStephen Shaw PROPOSAL
Juan WieserItalyStephen Shaw NEGOTIATION
Silvio SlusarskiFranceIoni Bowcher NEGOTIATION
Smith GlickCanadaAmy Elsner NEGOTIATION
Misaki RoysterFranceBernardo Dominic QUALIFIED
Aruna FigeroaBrazilIvan Magalhaes RENEWAL
Alejandro PerinItalyAmy Elsner NEGOTIATION
Arvin AlbaresGermanyAnna Fali UNQUALIFIED
Julie StensethUnited KingdomIvan Magalhaes QUALIFIED
Rodrigues CampainArgentinaStephen Shaw NEGOTIATION
Octavia MaletItalyStephen Shaw RENEWAL
Emily WhobreySpainIoni Bowcher NEGOTIATION
Munro FerenczFranceElwin Sharvill UNQUALIFIED
Adams MorascaBrazilOnyama Limba QUALIFIED
Wickens NestleSpainXuxue Feng PROPOSAL
Aditya KuskoIndiaElwin Sharvill RENEWAL
Emily WhobreyAustraliaElwin Sharvill UNQUALIFIED
Greenwood BologniaArgentinaOnyama Limba PROPOSAL
Francesco ShinkoAustraliaOnyama Limba PROPOSAL
Jefferson SchemmerCanadaStephen Shaw NEGOTIATION
Mayumi KolmetzBrazilStephen Shaw UNQUALIFIED
Maria MarrierSpainAnna Fali NEW
Julie StensethBrazilAsiya Javayant NEGOTIATION
Faith GillianCanadaAsiya Javayant NEW
Horizontal
NameCountryRepresentativeStatus
Smith GlickIndiaAmy Elsner NEGOTIATION
Faith GillianGermanyBernardo Dominic UNQUALIFIED
Leon OldroydRussiaAsiya Javayant NEW
Juan WieserCanadaAsiya Javayant QUALIFIED
Arvin AlbaresIndiaAmy Elsner NEW
Chavez BriddickItalyIvan Magalhaes PROPOSAL
Greenwood BologniaJapanAnna Fali UNQUALIFIED
Rodrigues CampainSpainElwin Sharvill NEGOTIATION
Maisha RulapaughAustraliaIvan Magalhaes RENEWAL
Cody SaylorsCanadaXuxue Feng QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Antonio CaudyIndia2026-05-03Buckley Miller Wright NEW73Ioni Bowcher
1001Leon OldroydGermany2026-05-08Chanay, Jeffrey A Esq PROPOSAL87Xuxue Feng
1002Isabel BowleyJapan2026-04-25Printing Dimensions NEW7Stephen Shaw
1003Deepesh ChuiGermany2026-04-27Feltz Printing Service UNQUALIFIED5Amy Elsner
1004Munro FerenczIndia2026-05-07Rousseaux, Michael Esq QUALIFIED72Onyama Limba
1005Tony FollerCanada2026-04-21Chanay, Jeffrey A Esq RENEWAL49Ivan Magalhaes
1006Arvin AlbaresCanada2026-04-21Commercial Press NEGOTIATION66Xuxue Feng
1007Adams MorascaBrazil2026-05-02Buckley Miller Wright PROPOSAL86Ivan Magalhaes
1008Ivar PaprockiGermany2026-04-19Buckley Miller Wright QUALIFIED33Anna Fali
1009Aruna FigeroaRussia2026-05-09King, Christopher A Esq NEW95Elwin Sharvill
1010Aika InouyeUnited Kingdom2026-04-21Feiner Bros RENEWAL18Asiya Javayant
1011Leja CaldareraBrazil2026-04-16Benton, John B Jr PROPOSAL91Elwin Sharvill
1012Leja CaldareraBrazil2026-04-14Chemel, James L Cpa NEGOTIATION33Stephen Shaw
1013Aika InouyeSpain2026-04-28Buckley Miller Wright NEW72Xuxue Feng
1014Ricardo GauchoRussia2026-04-17Benton, John B Jr PROPOSAL81Bernardo Dominic
1015Aika InouyeAustralia2026-04-21Truhlar And Truhlar Attys QUALIFIED26Anna Fali
1016Stacey MacleadAustralia2026-05-10King, Christopher A Esq NEGOTIATION80Ioni Bowcher
1017Salvatore StockhamCanada2026-05-05Buckley Miller Wright QUALIFIED86Elwin Sharvill
1018Nicolas IturbideSpain2026-04-22Truhlar And Truhlar Attys QUALIFIED74Elwin Sharvill
1019Deepesh ChuiArgentina2026-05-11King, Christopher A Esq PROPOSAL0Ioni Bowcher
1020Claire TollnerSpain2026-04-29Dorl, James J Esq RENEWAL4Stephen Shaw
1021Stacey MacleadItaly2026-04-30Truhlar And Truhlar Attys NEGOTIATION88Elwin Sharvill
1022Silvio SlusarskiBrazil2026-04-13Morlong Associates NEW85Stephen Shaw
1023Misaki RoysterCanada2026-05-02Buckley Miller Wright NEW87Stephen Shaw
1024Julie StensethBrazil2026-05-12King, Christopher A Esq NEGOTIATION27Asiya Javayant
1025Munro FerenczItaly2026-05-07Morlong Associates NEGOTIATION93Amy Elsner
1026Kaitlin OstroskyArgentina2026-04-30Buckley Miller Wright QUALIFIED26Amy Elsner
1027Greenwood BologniaUnited Kingdom2026-05-01Chanay, Jeffrey A Esq UNQUALIFIED18Amy Elsner
1028Aditya KuskoAustralia2026-05-08Morlong Associates PROPOSAL68Asiya Javayant
1029Rodrigues CampainAustralia2026-04-29Rousseaux, Michael Esq PROPOSAL0Bernardo Dominic
1030Maisha RulapaughAustralia2026-04-18Commercial Press NEW35Onyama Limba
1031Tony FollerItaly2026-05-10Morlong Associates QUALIFIED96Elwin Sharvill
1032Misaki RoysterRussia2026-04-27Chapman, Ross E Esq RENEWAL54Onyama Limba
1033Costa DilliardSpain2026-04-25Chanay, Jeffrey A Esq PROPOSAL88Onyama Limba
1034David DarakjyItaly2026-04-19Feiner Bros RENEWAL49Asiya Javayant
1035Adams MorascaRussia2026-04-14Rousseaux, Michael Esq QUALIFIED15Ioni Bowcher
1036Jefferson SchemmerFrance2026-04-29Benton, John B Jr QUALIFIED37Elwin Sharvill
1037Deepesh ChuiArgentina2026-04-15Buckley Miller Wright NEW34Ioni Bowcher
1038Kaitlin OstroskyRussia2026-04-14Feiner Bros NEW3Ivan Magalhaes
1039Greenwood BologniaArgentina2026-05-11Truhlar And Truhlar Attys RENEWAL4Elwin Sharvill
1040Morrow RutaJapan2026-05-01Chapman, Ross E Esq RENEWAL41Asiya Javayant
1041Octavia MaletItaly2026-04-13Morlong Associates PROPOSAL48Xuxue Feng
1042Salvatore StockhamJapan2026-05-02Chanay, Jeffrey A Esq NEW48Elwin Sharvill
1043Arvin AlbaresItaly2026-04-24Feltz Printing Service PROPOSAL57Ioni Bowcher
1044Claire TollnerAustralia2026-05-05Truhlar And Truhlar Attys PROPOSAL71Ivan Magalhaes
1045Maisha RulapaughJapan2026-04-25Dorl, James J Esq RENEWAL58Ivan Magalhaes
1046Smith GlickFrance2026-05-04King, Christopher A Esq UNQUALIFIED96Ivan Magalhaes
1047Greenwood BologniaSpain2026-04-30Truhlar And Truhlar Attys NEGOTIATION96Amy Elsner
1048Arvin AlbaresItaly2026-04-20King, Christopher A Esq PROPOSAL77Asiya Javayant
1049Jones VocelkaCanada2026-04-22Dorl, James J Esq NEW86Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Jeanfrancois VenereBrazilIoni Bowcher NEW
Jeanfrancois VenereBrazilStephen Shaw NEW
Octavia MaletBrazilXuxue Feng RENEWAL
Ivar PaprockiBrazilStephen Shaw QUALIFIED
Costa DilliardJapanAmy Elsner QUALIFIED
Darci PoquetteAustraliaIoni Bowcher RENEWAL
Darci PoquetteGermanyAmy Elsner NEW
Wickens NestleSpainStephen Shaw NEW
Cody SaylorsArgentinaStephen Shaw NEW
Costa DilliardJapanBernardo Dominic UNQUALIFIED
Clifford RimSpainElwin Sharvill NEGOTIATION
Aika InouyeCanadaIvan Magalhaes RENEWAL
David DarakjySpainAsiya Javayant UNQUALIFIED
Faith GillianCanadaIvan Magalhaes PROPOSAL
Cody SaylorsArgentinaBernardo Dominic NEGOTIATION
Juan WieserBrazilAsiya Javayant UNQUALIFIED
Maisha RulapaughJapanAnna Fali QUALIFIED
Leon OldroydGermanyXuxue Feng RENEWAL
Tony FollerGermanyIoni Bowcher RENEWAL
Leja CaldareraRussiaElwin Sharvill RENEWAL
Maria MarrierUnited KingdomStephen Shaw RENEWAL
Kaitlin OstroskyItalyOnyama Limba PROPOSAL
Kaitlin OstroskyAustraliaIvan Magalhaes NEW
Jeanfrancois VenereJapanIvan Magalhaes UNQUALIFIED
Maisha RulapaughGermanyAnna Fali QUALIFIED
Leon OldroydIndiaAnna Fali NEGOTIATION
Leon OldroydJapanBernardo Dominic QUALIFIED
Deepesh ChuiAustraliaBernardo Dominic PROPOSAL
Kadeem FlosiItalyIvan Magalhaes QUALIFIED
James ButtCanadaAmy Elsner QUALIFIED
Julie StensethSpainAmy Elsner QUALIFIED
Jennifer AmigonArgentinaIoni Bowcher NEW
Julie StensethSpainAmy Elsner QUALIFIED
Leon OldroydIndiaXuxue Feng QUALIFIED
Salvatore StockhamAustraliaIoni Bowcher UNQUALIFIED
Aditya KuskoUnited KingdomStephen Shaw RENEWAL
Jeanfrancois VenereRussiaIvan Magalhaes UNQUALIFIED
Maisha RulapaughUnited KingdomBernardo Dominic NEGOTIATION
Stacey MacleadFranceIvan Magalhaes RENEWAL
Nicolas IturbideArgentinaAsiya Javayant NEGOTIATION
Silvio SlusarskiSpainAmy Elsner NEGOTIATION
Greenwood BologniaSpainIoni Bowcher UNQUALIFIED
Leon OldroydCanadaBernardo Dominic PROPOSAL
Kadeem FlosiBrazilIoni Bowcher NEGOTIATION
Maisha RulapaughFranceAmy Elsner RENEWAL
Salvatore StockhamBrazilStephen Shaw NEGOTIATION
Costa DilliardIndiaIvan Magalhaes PROPOSAL
Alejandro PerinArgentinaAmy Elsner UNQUALIFIED
Cody SaylorsSpainAsiya Javayant NEW
Ashley DoeUnited KingdomElwin Sharvill PROPOSAL
Frozen Columns
Name
Sinclair Waycott
Morrow Ruta
Wickens Nestle
Jeanfrancois Venere
Morrow Ruta
Salvatore Stockham
Leon Oldroyd
Kaitlin Ostrosky
Silvio Slusarski
Arvin Albares
Greenwood Bolognia
Clifford Rim
Deepesh Chui
Jefferson Schemmer
Ricardo Gaucho
Cody Saylors
Faith Gillian
Johnson Sergi
Stacey Maclead
Adams Morasca
Jones Vocelka
Clifford Rim
Leja Caldarera
Kaitlin Ostrosky
Arvin Albares
Chavez Briddick
Greenwood Bolognia
Adams Morasca
Arvin Albares
Silvio Slusarski
Jeanfrancois Venere
Juan Wieser
Darci Poquette
Aika Inouye
Cody Saylors
Munro Ferencz
James Butt
Morrow Ruta
Juan Wieser
Tony Foller
Francesco Shinko
Alejandro Perin
Rodrigues Campain
Nicolas Iturbide
Isabel Bowley
Silvio Slusarski
Jones Vocelka
Chavez Briddick
Leja Caldarera
Cody Saylors
IdCountryDate
1000France2026-04-20
1001Spain2026-04-29
1002Argentina2026-05-03
1003United Kingdom2026-05-07
1004Russia2026-04-23
1005Russia2026-04-19
1006Australia2026-05-03
1007India2026-04-27
1008Germany2026-05-04
1009Italy2026-04-26
1010Germany2026-04-27
1011Germany2026-04-19
1012Russia2026-04-13
1013Australia2026-04-26
1014Japan2026-05-02
1015Germany2026-04-21
1016Brazil2026-04-24
1017Russia2026-04-21
1018France2026-04-13
1019Russia2026-04-23
1020Italy2026-04-30
1021Canada2026-04-28
1022Germany2026-04-21
1023India2026-04-16
1024France2026-05-09
1025Russia2026-04-18
1026Japan2026-05-01
1027Spain2026-05-03
1028Argentina2026-05-10
1029Italy2026-04-24
1030Argentina2026-04-17
1031Argentina2026-05-05
1032United Kingdom2026-04-18
1033India2026-05-01
1034Russia2026-05-12
1035France2026-05-12
1036India2026-04-20
1037Italy2026-04-24
1038Germany2026-04-28
1039Japan2026-05-05
1040Brazil2026-05-07
1041Russia2026-04-24
1042United Kingdom2026-04-21
1043Germany2026-04-24
1044France2026-05-12
1045Germany2026-04-13
1046Japan2026-04-23
1047Japan2026-05-12
1048France2026-05-08
1049United Kingdom2026-05-08

On-Demand Data

NameIdCountryDate
Ricardo Gaucho1000France2026-04-16
David Darakjy1001Argentina2026-04-20
Salvatore Stockham1002Russia2026-04-30
Smith Glick1003Japan2026-04-26
Deepesh Chui1004Japan2026-05-05
Octavia Malet1005Australia2026-04-15
Kaitlin Ostrosky1006Argentina2026-04-13
Stacey Maclead1007Canada2026-04-25
Costa Dilliard1008Russia2026-04-30
Silvio Slusarski1009Canada2026-04-23
Tony Foller1010Brazil2026-04-27
Chavez Briddick1011France2026-05-09
Alejandro Perin1012Spain2026-04-29
Jones Vocelka1013France2026-04-14
Clifford Rim1014France2026-04-27
Jefferson Schemmer1015Australia2026-04-20
Jefferson Schemmer1016United Kingdom2026-04-29
Ivar Paprocki1017Italy2026-04-13
Izzy Garufi1018Brazil2026-05-09
Faith Gillian1019Japan2026-04-16
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jones VocelkaFranceAmy Elsner UNQUALIFIED
Rodrigues CampainArgentinaBernardo Dominic NEW
Jeanfrancois VenereItalyElwin Sharvill NEW
Wickens NestleRussiaAnna Fali NEW
Stacey MacleadRussiaXuxue Feng NEGOTIATION
Ivar PaprockiGermanyAnna Fali UNQUALIFIED
Arvin AlbaresSpainIoni Bowcher NEGOTIATION
Deepesh ChuiItalyOnyama Limba NEGOTIATION
Arvin AlbaresBrazilElwin Sharvill PROPOSAL
Smith GlickBrazilIvan Magalhaes RENEWAL
Ashley DoeJapanBernardo Dominic QUALIFIED
Maisha RulapaughArgentinaXuxue Feng PROPOSAL
Chavez BriddickUnited KingdomXuxue Feng QUALIFIED
Ricardo GauchoBrazilIvan Magalhaes UNQUALIFIED
Costa DilliardRussiaElwin Sharvill QUALIFIED
Antonio CaudySpainBernardo Dominic RENEWAL
Salvatore StockhamGermanyOnyama Limba RENEWAL
Emily WhobreyJapanOnyama Limba NEW
Julie StensethGermanyBernardo Dominic RENEWAL
Nicolas IturbideCanadaXuxue Feng NEW
Tony FollerGermanyOnyama Limba QUALIFIED
Kadeem FlosiAustraliaElwin Sharvill UNQUALIFIED
Stacey MacleadUnited KingdomAnna Fali UNQUALIFIED
Nicolas IturbideIndiaAsiya Javayant UNQUALIFIED
Izzy GarufiUnited KingdomStephen Shaw QUALIFIED
Johnson SergiItalyIoni Bowcher NEW
Johnson SergiSpainIvan Magalhaes NEGOTIATION
Arvin AlbaresJapanAsiya Javayant NEGOTIATION
Emily WhobreyArgentinaAnna Fali UNQUALIFIED
Costa DilliardIndiaIvan Magalhaes PROPOSAL
Maisha RulapaughCanadaAmy Elsner QUALIFIED
Aika InouyeArgentinaAsiya Javayant PROPOSAL
Emily WhobreyAustraliaAsiya Javayant PROPOSAL
Darci PoquetteUnited KingdomBernardo Dominic QUALIFIED
Izzy GarufiCanadaIoni Bowcher NEW
Kadeem FlosiGermanyAmy Elsner RENEWAL
Kadeem FlosiCanadaStephen Shaw PROPOSAL
Ricardo GauchoCanadaAsiya Javayant UNQUALIFIED
Munro FerenczSpainIoni Bowcher QUALIFIED
Leon OldroydArgentinaStephen Shaw NEGOTIATION

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