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
Maisha RulapaughRussiaElwin Sharvill QUALIFIED
Sinclair WaycottSpainAnna Fali NEW
Juan WieserCanadaBernardo Dominic UNQUALIFIED
Izzy GarufiBrazilAsiya Javayant NEW
Octavia MaletCanadaAsiya Javayant NEW
Deepesh ChuiCanadaIoni Bowcher PROPOSAL
Aika InouyeRussiaXuxue Feng RENEWAL
Leja CaldareraFranceElwin Sharvill NEW
Francesco ShinkoJapanIoni Bowcher RENEWAL
Rodrigues CampainItalyIoni Bowcher NEGOTIATION
Tony FollerBrazilOnyama Limba RENEWAL
Darci PoquetteCanadaIoni Bowcher QUALIFIED
Deepesh ChuiBrazilBernardo Dominic PROPOSAL
Stacey MacleadFranceBernardo Dominic NEGOTIATION
Jefferson SchemmerArgentinaBernardo Dominic QUALIFIED
Ivar PaprockiItalyAsiya Javayant QUALIFIED
Aika InouyeItalyIoni Bowcher NEW
Johnson SergiIndiaAnna Fali NEW
Tony FollerCanadaAnna Fali PROPOSAL
Aditya KuskoRussiaAmy Elsner RENEWAL
David DarakjyFranceBernardo Dominic PROPOSAL
Mujtaba NickaUnited KingdomAmy Elsner RENEWAL
Jennifer AmigonItalyIoni Bowcher PROPOSAL
Morrow RutaItalyIoni Bowcher PROPOSAL
Kaitlin OstroskyArgentinaAmy Elsner PROPOSAL
Smith GlickFranceElwin Sharvill UNQUALIFIED
Deepesh ChuiUnited KingdomIoni Bowcher NEW
Deepesh ChuiAustraliaStephen Shaw QUALIFIED
Kaitlin OstroskyCanadaIoni Bowcher UNQUALIFIED
Murillo MaletAustraliaStephen Shaw NEGOTIATION
Nicolas IturbideBrazilAnna Fali UNQUALIFIED
Murillo MaletIndiaStephen Shaw PROPOSAL
Aditya KuskoJapanXuxue Feng NEGOTIATION
Jones VocelkaIndiaStephen Shaw QUALIFIED
Emily WhobreyFranceOnyama Limba NEW
Claire TollnerGermanyIvan Magalhaes QUALIFIED
Misaki RoysterBrazilXuxue Feng PROPOSAL
Mayumi KolmetzFranceXuxue Feng NEGOTIATION
Stacey MacleadGermanyAmy Elsner QUALIFIED
Aditya KuskoFranceIvan Magalhaes NEGOTIATION
Kaitlin OstroskyItalyOnyama Limba NEW
Ivar PaprockiRussiaIoni Bowcher QUALIFIED
Kadeem FlosiArgentinaStephen Shaw QUALIFIED
Tony FollerCanadaAsiya Javayant NEGOTIATION
David DarakjyGermanyIoni Bowcher NEGOTIATION
Cody SaylorsUnited KingdomAmy Elsner RENEWAL
Stacey MacleadSpainIoni Bowcher UNQUALIFIED
Rodrigues CampainSpainStephen Shaw NEW
Octavia MaletIndiaXuxue Feng UNQUALIFIED
Alejandro PerinArgentinaAnna Fali QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Smith GlickCanadaAmy Elsner NEW
Darci PoquetteCanadaAsiya Javayant UNQUALIFIED
Mujtaba NickaJapanBernardo Dominic NEGOTIATION
Salvatore StockhamFranceIoni Bowcher RENEWAL
Arvin AlbaresBrazilOnyama Limba RENEWAL
Cody SaylorsGermanyElwin Sharvill RENEWAL
Wickens NestleUnited KingdomBernardo Dominic RENEWAL
Costa DilliardItalyAmy Elsner UNQUALIFIED
Claire TollnerFranceBernardo Dominic UNQUALIFIED
Faith GillianSpainIoni Bowcher NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Maria MarrierIndia2026-06-05Morlong Associates NEW28Amy Elsner
1001Francesco ShinkoRussia2026-05-18Truhlar And Truhlar Attys NEGOTIATION89Amy Elsner
1002Adams MorascaAustralia2026-06-01Feiner Bros NEGOTIATION67Ioni Bowcher
1003Nicolas IturbideArgentina2026-06-08Morlong Associates RENEWAL59Amy Elsner
1004Francesco ShinkoAustralia2026-05-15Rousseaux, Michael Esq UNQUALIFIED47Amy Elsner
1005Leon OldroydArgentina2026-05-20Chapman, Ross E Esq PROPOSAL23Anna Fali
1006Nicolas IturbideItaly2026-05-24Rangoni Of Florence PROPOSAL41Ioni Bowcher
1007Adams MorascaIndia2026-05-28Dorl, James J Esq NEW29Ivan Magalhaes
1008Johnson SergiBrazil2026-05-18Chemel, James L Cpa PROPOSAL83Stephen Shaw
1009Emily WhobreyFrance2026-05-18Commercial Press RENEWAL35Bernardo Dominic
1010Aika InouyeBrazil2026-06-07Buckley Miller Wright RENEWAL55Ivan Magalhaes
1011Arvin AlbaresItaly2026-05-19Benton, John B Jr NEGOTIATION22Stephen Shaw
1012Munro FerenczAustralia2026-05-29Commercial Press NEW87Elwin Sharvill
1013Maria MarrierBrazil2026-05-23Buckley Miller Wright PROPOSAL82Onyama Limba
1014Greenwood BologniaCanada2026-05-25King, Christopher A Esq NEW89Xuxue Feng
1015Jennifer AmigonItaly2026-06-11Morlong Associates NEGOTIATION51Amy Elsner
1016Aika InouyeJapan2026-05-30King, Christopher A Esq NEW53Xuxue Feng
1017Chavez BriddickBrazil2026-05-28Benton, John B Jr QUALIFIED84Elwin Sharvill
1018Aruna FigeroaSpain2026-05-30Feiner Bros NEGOTIATION6Elwin Sharvill
1019Stacey MacleadFrance2026-05-21Feiner Bros NEW96Anna Fali
1020Aditya KuskoUnited Kingdom2026-05-17Benton, John B Jr NEGOTIATION94Onyama Limba
1021Mayumi KolmetzArgentina2026-05-30Chanay, Jeffrey A Esq NEW36Anna Fali
1022Leon OldroydGermany2026-05-27Rousseaux, Michael Esq QUALIFIED94Ioni Bowcher
1023Faith GillianAustralia2026-05-22King, Christopher A Esq PROPOSAL27Ioni Bowcher
1024Maria MarrierIndia2026-06-04Benton, John B Jr NEGOTIATION71Asiya Javayant
1025Greenwood BologniaRussia2026-05-23Dorl, James J Esq UNQUALIFIED88Asiya Javayant
1026Mayumi KolmetzBrazil2026-05-26Feiner Bros RENEWAL24Asiya Javayant
1027Emily WhobreyBrazil2026-05-16Feiner Bros NEGOTIATION23Anna Fali
1028Munro FerenczItaly2026-05-21Dorl, James J Esq NEW16Elwin Sharvill
1029Jeanfrancois VenereGermany2026-05-13Rangoni Of Florence RENEWAL96Elwin Sharvill
1030Emily WhobreyUnited Kingdom2026-06-04Commercial Press QUALIFIED71Ivan Magalhaes
1031Murillo MaletCanada2026-06-07Benton, John B Jr UNQUALIFIED81Ivan Magalhaes
1032Aruna FigeroaGermany2026-05-24Dorl, James J Esq RENEWAL38Ioni Bowcher
1033Claire TollnerJapan2026-05-23Morlong Associates NEGOTIATION55Anna Fali
1034Tony FollerCanada2026-05-31Rousseaux, Michael Esq NEW16Ivan Magalhaes
1035Silvio SlusarskiFrance2026-05-26Buckley Miller Wright UNQUALIFIED6Ivan Magalhaes
1036Misaki RoysterJapan2026-05-18Dorl, James J Esq UNQUALIFIED78Ioni Bowcher
1037Nicolas IturbideGermany2026-05-28Buckley Miller Wright UNQUALIFIED82Bernardo Dominic
1038Mayumi KolmetzSpain2026-05-29Chanay, Jeffrey A Esq RENEWAL96Anna Fali
1039Johnson SergiIndia2026-05-23Chapman, Ross E Esq RENEWAL30Ivan Magalhaes
1040Antonio CaudyUnited Kingdom2026-05-30Rousseaux, Michael Esq UNQUALIFIED10Amy Elsner
1041Arvin AlbaresSpain2026-05-22Chemel, James L Cpa RENEWAL78Anna Fali
1042Antonio CaudyIndia2026-05-16Feltz Printing Service QUALIFIED77Ioni Bowcher
1043Ricardo GauchoIndia2026-05-20Chapman, Ross E Esq PROPOSAL73Ivan Magalhaes
1044Maisha RulapaughJapan2026-06-03Printing Dimensions NEGOTIATION60Xuxue Feng
1045Clifford RimUnited Kingdom2026-05-22Rousseaux, Michael Esq PROPOSAL6Ivan Magalhaes
1046Alejandro PerinItaly2026-06-08Truhlar And Truhlar Attys NEW30Bernardo Dominic
1047James ButtJapan2026-05-16Printing Dimensions UNQUALIFIED72Stephen Shaw
1048Deepesh ChuiJapan2026-05-24Morlong Associates PROPOSAL72Onyama Limba
1049Maria MarrierUnited Kingdom2026-05-18Printing Dimensions UNQUALIFIED45Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Julie StensethIndiaIoni Bowcher NEW
Salvatore StockhamRussiaBernardo Dominic NEGOTIATION
Smith GlickSpainIoni Bowcher NEGOTIATION
Murillo MaletArgentinaIvan Magalhaes QUALIFIED
James ButtFranceOnyama Limba NEGOTIATION
Silvio SlusarskiFranceBernardo Dominic RENEWAL
Jones VocelkaUnited KingdomAsiya Javayant PROPOSAL
David DarakjyBrazilElwin Sharvill NEGOTIATION
Juan WieserSpainXuxue Feng NEW
Cody SaylorsFranceElwin Sharvill NEGOTIATION
Maria MarrierSpainXuxue Feng UNQUALIFIED
Aika InouyeItalyIoni Bowcher NEGOTIATION
Leon OldroydFranceAmy Elsner UNQUALIFIED
Rodrigues CampainBrazilStephen Shaw RENEWAL
Isabel BowleyItalyStephen Shaw QUALIFIED
Emily WhobreyFranceOnyama Limba QUALIFIED
Emily WhobreyJapanIvan Magalhaes NEGOTIATION
Ricardo GauchoItalyElwin Sharvill QUALIFIED
Darci PoquetteCanadaAsiya Javayant QUALIFIED
Mayumi KolmetzUnited KingdomXuxue Feng NEGOTIATION
Maisha RulapaughItalyStephen Shaw PROPOSAL
Salvatore StockhamUnited KingdomBernardo Dominic PROPOSAL
Izzy GarufiFranceIvan Magalhaes QUALIFIED
Aruna FigeroaAustraliaOnyama Limba NEW
Leja CaldareraItalyIvan Magalhaes PROPOSAL
James ButtItalyXuxue Feng NEW
Morrow RutaAustraliaAsiya Javayant RENEWAL
Antonio CaudyGermanyXuxue Feng RENEWAL
Stacey MacleadIndiaAsiya Javayant QUALIFIED
Sinclair WaycottCanadaAsiya Javayant UNQUALIFIED
Aika InouyeItalyIvan Magalhaes NEGOTIATION
Antonio CaudyAustraliaAnna Fali UNQUALIFIED
David DarakjyUnited KingdomIoni Bowcher RENEWAL
Alejandro PerinJapanIvan Magalhaes PROPOSAL
Chavez BriddickBrazilBernardo Dominic PROPOSAL
Mujtaba NickaFranceAnna Fali NEW
David DarakjyGermanyOnyama Limba UNQUALIFIED
Kaitlin OstroskyBrazilBernardo Dominic QUALIFIED
Leon OldroydItalyIvan Magalhaes UNQUALIFIED
Tony FollerSpainElwin Sharvill RENEWAL
Ricardo GauchoAustraliaAmy Elsner NEGOTIATION
Octavia MaletFranceOnyama Limba PROPOSAL
Francesco ShinkoItalyOnyama Limba QUALIFIED
Jones VocelkaAustraliaOnyama Limba RENEWAL
Izzy GarufiUnited KingdomAnna Fali PROPOSAL
Rodrigues CampainCanadaAmy Elsner QUALIFIED
Izzy GarufiAustraliaAmy Elsner UNQUALIFIED
Salvatore StockhamFranceXuxue Feng RENEWAL
Aruna FigeroaBrazilAnna Fali PROPOSAL
Sinclair WaycottItalyXuxue Feng NEGOTIATION
Frozen Columns
Name
Francesco Shinko
Leon Oldroyd
Greenwood Bolognia
Ricardo Gaucho
Costa Dilliard
Isabel Bowley
Claire Tollner
Arvin Albares
Cody Saylors
Morrow Ruta
Mayumi Kolmetz
Leon Oldroyd
Antonio Caudy
Tony Foller
Stacey Maclead
Aruna Figeroa
Juan Wieser
Leja Caldarera
Faith Gillian
Ricardo Gaucho
Juan Wieser
Izzy Garufi
Arvin Albares
Salvatore Stockham
Maisha Rulapaugh
Deepesh Chui
Salvatore Stockham
Deepesh Chui
Alejandro Perin
Wickens Nestle
Clifford Rim
Wickens Nestle
Johnson Sergi
Silvio Slusarski
Izzy Garufi
Claire Tollner
Jennifer Amigon
Kadeem Flosi
Costa Dilliard
Ivar Paprocki
Izzy Garufi
Francesco Shinko
Antonio Caudy
Ivar Paprocki
Sinclair Waycott
Julie Stenseth
Ricardo Gaucho
Mayumi Kolmetz
Julie Stenseth
Cody Saylors
IdCountryDate
1000Russia2026-05-15
1001Russia2026-06-10
1002Brazil2026-05-30
1003Brazil2026-06-08
1004France2026-05-18
1005United Kingdom2026-05-28
1006Germany2026-05-20
1007Germany2026-05-23
1008Germany2026-05-22
1009Japan2026-05-15
1010France2026-05-21
1011Spain2026-05-31
1012Japan2026-06-04
1013India2026-05-14
1014United Kingdom2026-06-05
1015Argentina2026-05-25
1016Russia2026-06-10
1017Russia2026-05-27
1018Canada2026-05-18
1019Germany2026-05-17
1020United Kingdom2026-05-30
1021Russia2026-05-27
1022Germany2026-05-23
1023Italy2026-05-13
1024Germany2026-05-27
1025Italy2026-06-10
1026Italy2026-05-24
1027Germany2026-05-24
1028Japan2026-06-09
1029France2026-05-25
1030Argentina2026-06-03
1031Germany2026-05-29
1032France2026-05-25
1033Argentina2026-05-15
1034Australia2026-05-28
1035France2026-05-30
1036Japan2026-06-08
1037India2026-06-03
1038Russia2026-05-18
1039United Kingdom2026-06-04
1040Australia2026-05-25
1041Spain2026-05-31
1042Spain2026-06-08
1043Russia2026-06-06
1044United Kingdom2026-06-10
1045United Kingdom2026-06-01
1046France2026-06-10
1047Australia2026-06-03
1048United Kingdom2026-05-22
1049France2026-05-25

On-Demand Data

NameIdCountryDate
Izzy Garufi1000Canada2026-06-08
Murillo Malet1001Spain2026-05-13
Juan Wieser1002Japan2026-05-30
Deepesh Chui1003India2026-05-15
Juan Wieser1004Canada2026-06-07
Kaitlin Ostrosky1005Australia2026-06-10
David Darakjy1006United Kingdom2026-05-30
Jones Vocelka1007Germany2026-05-16
Chavez Briddick1008United Kingdom2026-06-03
Arvin Albares1009Russia2026-06-01
Leja Caldarera1010Argentina2026-06-11
Morrow Ruta1011Japan2026-05-25
Maria Marrier1012France2026-05-17
Aika Inouye1013Russia2026-05-24
Misaki Royster1014Argentina2026-05-15
Alejandro Perin1015Italy2026-05-16
Nicolas Iturbide1016Japan2026-05-13
Tony Foller1017Australia2026-05-23
Cody Saylors1018India2026-06-02
Chavez Briddick1019France2026-06-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Silvio SlusarskiJapanStephen Shaw NEW
Munro FerenczFranceIvan Magalhaes QUALIFIED
David DarakjyBrazilOnyama Limba NEW
David DarakjyArgentinaAnna Fali UNQUALIFIED
Juan WieserGermanyAmy Elsner UNQUALIFIED
Adams MorascaFranceAsiya Javayant NEGOTIATION
Chavez BriddickBrazilElwin Sharvill QUALIFIED
Isabel BowleyIndiaXuxue Feng UNQUALIFIED
Aika InouyeItalyAmy Elsner NEW
Isabel BowleyJapanAmy Elsner NEW
Mujtaba NickaUnited KingdomXuxue Feng QUALIFIED
Isabel BowleyUnited KingdomElwin Sharvill QUALIFIED
David DarakjyRussiaIvan Magalhaes NEW
Adams MorascaIndiaAsiya Javayant NEGOTIATION
Claire TollnerJapanStephen Shaw NEW
Isabel BowleyItalyOnyama Limba RENEWAL
Aruna FigeroaCanadaElwin Sharvill NEGOTIATION
Clifford RimIndiaAsiya Javayant PROPOSAL
Aruna FigeroaAustraliaIoni Bowcher UNQUALIFIED
Juan WieserUnited KingdomIvan Magalhaes PROPOSAL
Murillo MaletGermanyAmy Elsner NEW
Jennifer AmigonFranceXuxue Feng QUALIFIED
Leja CaldareraItalyAnna Fali PROPOSAL
Costa DilliardUnited KingdomAsiya Javayant UNQUALIFIED
Chavez BriddickArgentinaOnyama Limba RENEWAL
Mujtaba NickaGermanyIvan Magalhaes RENEWAL
Nicolas IturbideGermanyAnna Fali NEGOTIATION
Murillo MaletUnited KingdomAnna Fali QUALIFIED
Francesco ShinkoCanadaIvan Magalhaes NEW
Juan WieserSpainBernardo Dominic NEGOTIATION
Maria MarrierItalyOnyama Limba NEW
Ashley DoeJapanOnyama Limba RENEWAL
Murillo MaletSpainIvan Magalhaes PROPOSAL
Octavia MaletUnited KingdomAmy Elsner RENEWAL
Emily WhobreyUnited KingdomElwin Sharvill RENEWAL
Rodrigues CampainJapanElwin Sharvill QUALIFIED
Munro FerenczFranceAmy Elsner NEGOTIATION
Mayumi KolmetzUnited KingdomXuxue Feng PROPOSAL
Rodrigues CampainUnited KingdomIvan Magalhaes RENEWAL
Deepesh ChuiCanadaOnyama Limba QUALIFIED

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