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
Clifford RimJapanAnna Fali UNQUALIFIED
Leja CaldareraUnited KingdomAnna Fali RENEWAL
Kadeem FlosiGermanyAnna Fali NEGOTIATION
Ashley DoeRussiaIvan Magalhaes NEGOTIATION
Silvio SlusarskiRussiaAnna Fali UNQUALIFIED
Francesco ShinkoArgentinaAmy Elsner NEGOTIATION
Munro FerenczAustraliaOnyama Limba UNQUALIFIED
Francesco ShinkoIndiaStephen Shaw QUALIFIED
Julie StensethBrazilElwin Sharvill NEGOTIATION
Ivar PaprockiGermanyElwin Sharvill PROPOSAL
Adams MorascaItalyIoni Bowcher PROPOSAL
Costa DilliardBrazilXuxue Feng NEW
Maria MarrierBrazilAsiya Javayant NEGOTIATION
Costa DilliardSpainIvan Magalhaes NEW
Jones VocelkaCanadaAnna Fali PROPOSAL
Alejandro PerinSpainAsiya Javayant UNQUALIFIED
Francesco ShinkoUnited KingdomAnna Fali QUALIFIED
Clifford RimBrazilAsiya Javayant NEGOTIATION
Kaitlin OstroskyItalyStephen Shaw PROPOSAL
Faith GillianJapanIvan Magalhaes RENEWAL
Morrow RutaRussiaElwin Sharvill PROPOSAL
Jennifer AmigonSpainIoni Bowcher RENEWAL
Octavia MaletJapanAmy Elsner QUALIFIED
Jennifer AmigonRussiaBernardo Dominic NEW
Jones VocelkaSpainBernardo Dominic UNQUALIFIED
Jefferson SchemmerRussiaStephen Shaw NEGOTIATION
Mayumi KolmetzRussiaStephen Shaw NEW
Stacey MacleadCanadaOnyama Limba NEGOTIATION
Mayumi KolmetzItalyXuxue Feng NEGOTIATION
Morrow RutaBrazilXuxue Feng RENEWAL
Ricardo GauchoFranceIoni Bowcher UNQUALIFIED
Alejandro PerinFranceAsiya Javayant QUALIFIED
Ricardo GauchoAustraliaAsiya Javayant QUALIFIED
Chavez BriddickGermanyAnna Fali NEGOTIATION
Aruna FigeroaUnited KingdomXuxue Feng UNQUALIFIED
Emily WhobreySpainAsiya Javayant RENEWAL
Deepesh ChuiIndiaBernardo Dominic UNQUALIFIED
Claire TollnerGermanyAsiya Javayant QUALIFIED
Aditya KuskoGermanyAnna Fali PROPOSAL
Faith GillianBrazilIvan Magalhaes NEGOTIATION
Alejandro PerinGermanyAsiya Javayant UNQUALIFIED
Ashley DoeCanadaIvan Magalhaes QUALIFIED
Wickens NestleItalyIoni Bowcher NEGOTIATION
Darci PoquetteJapanElwin Sharvill QUALIFIED
Julie StensethSpainStephen Shaw RENEWAL
Silvio SlusarskiJapanElwin Sharvill PROPOSAL
Jones VocelkaUnited KingdomAsiya Javayant RENEWAL
Greenwood BologniaIndiaAnna Fali PROPOSAL
Aditya KuskoUnited KingdomElwin Sharvill UNQUALIFIED
Jeanfrancois VenereAustraliaIoni Bowcher PROPOSAL
Horizontal
NameCountryRepresentativeStatus
Kaitlin OstroskyBrazilElwin Sharvill NEW
Ricardo GauchoArgentinaAsiya Javayant QUALIFIED
Costa DilliardArgentinaStephen Shaw UNQUALIFIED
Jeanfrancois VenereIndiaAnna Fali PROPOSAL
Clifford RimBrazilStephen Shaw PROPOSAL
Jefferson SchemmerRussiaElwin Sharvill NEGOTIATION
Rodrigues CampainRussiaAsiya Javayant QUALIFIED
Wickens NestleItalyXuxue Feng UNQUALIFIED
Jefferson SchemmerGermanyIvan Magalhaes QUALIFIED
David DarakjyUnited KingdomXuxue Feng NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Misaki RoysterIndia2025-07-15Chanay, Jeffrey A Esq NEW45Ivan Magalhaes
1001Tony FollerArgentina2025-07-14Buckley Miller Wright UNQUALIFIED4Xuxue Feng
1002Cody SaylorsAustralia2025-07-05Dorl, James J Esq NEW91Elwin Sharvill
1003Costa DilliardAustralia2025-07-09Printing Dimensions QUALIFIED17Elwin Sharvill
1004Kadeem FlosiItaly2025-07-15Buckley Miller Wright NEGOTIATION4Asiya Javayant
1005Jennifer AmigonArgentina2025-07-08King, Christopher A Esq NEGOTIATION78Ivan Magalhaes
1006David DarakjyRussia2025-07-06Dorl, James J Esq NEW21Ioni Bowcher
1007Francesco ShinkoUnited Kingdom2025-07-04Truhlar And Truhlar Attys RENEWAL43Asiya Javayant
1008Tony FollerJapan2025-07-29Truhlar And Truhlar Attys NEW73Amy Elsner
1009Cody SaylorsUnited Kingdom2025-07-08Commercial Press UNQUALIFIED92Amy Elsner
1010Aditya KuskoUnited Kingdom2025-07-30Rangoni Of Florence RENEWAL43Amy Elsner
1011Emily WhobreyRussia2025-07-27Feiner Bros UNQUALIFIED26Asiya Javayant
1012Smith GlickFrance2025-07-08Commercial Press NEW68Ivan Magalhaes
1013Octavia MaletAustralia2025-07-05Truhlar And Truhlar Attys NEGOTIATION20Amy Elsner
1014Clifford RimCanada2025-07-20Truhlar And Truhlar Attys QUALIFIED45Xuxue Feng
1015Maisha RulapaughJapan2025-07-14Dorl, James J Esq NEGOTIATION57Onyama Limba
1016Antonio CaudyJapan2025-07-17Benton, John B Jr UNQUALIFIED6Stephen Shaw
1017Maisha RulapaughJapan2025-07-11Commercial Press RENEWAL24Ivan Magalhaes
1018Ricardo GauchoCanada2025-07-18Printing Dimensions UNQUALIFIED62Anna Fali
1019Morrow RutaGermany2025-07-11Buckley Miller Wright UNQUALIFIED59Onyama Limba
1020David DarakjyBrazil2025-07-15Dorl, James J Esq PROPOSAL66Ivan Magalhaes
1021Nicolas IturbideItaly2025-07-05Buckley Miller Wright NEW88Ioni Bowcher
1022Jones VocelkaUnited Kingdom2025-07-03Truhlar And Truhlar Attys UNQUALIFIED56Amy Elsner
1023Sinclair WaycottCanada2025-07-10Morlong Associates UNQUALIFIED50Bernardo Dominic
1024Stacey MacleadAustralia2025-07-30Chapman, Ross E Esq UNQUALIFIED53Ioni Bowcher
1025Chavez BriddickRussia2025-07-27King, Christopher A Esq NEW15Stephen Shaw
1026Octavia MaletArgentina2025-07-07King, Christopher A Esq RENEWAL58Elwin Sharvill
1027Faith GillianArgentina2025-07-06Printing Dimensions UNQUALIFIED55Ioni Bowcher
1028Francesco ShinkoGermany2025-07-24Rousseaux, Michael Esq PROPOSAL4Stephen Shaw
1029James ButtGermany2025-07-31King, Christopher A Esq NEGOTIATION3Anna Fali
1030Chavez BriddickBrazil2025-07-10Commercial Press NEW7Bernardo Dominic
1031Kadeem FlosiJapan2025-08-01Dorl, James J Esq QUALIFIED18Ivan Magalhaes
1032Munro FerenczSpain2025-07-16Printing Dimensions NEW93Bernardo Dominic
1033Ashley DoeArgentina2025-07-15Buckley Miller Wright PROPOSAL96Onyama Limba
1034Murillo MaletGermany2025-07-06Chemel, James L Cpa PROPOSAL38Amy Elsner
1035Costa DilliardIndia2025-07-27Commercial Press NEGOTIATION48Asiya Javayant
1036Misaki RoysterBrazil2025-07-18Feiner Bros UNQUALIFIED72Xuxue Feng
1037Sinclair WaycottIndia2025-07-24Chanay, Jeffrey A Esq QUALIFIED75Onyama Limba
1038Jeanfrancois VenereSpain2025-07-28Rangoni Of Florence UNQUALIFIED53Ioni Bowcher
1039Greenwood BologniaAustralia2025-07-30Chapman, Ross E Esq PROPOSAL44Anna Fali
1040Tony FollerIndia2025-07-12Printing Dimensions NEGOTIATION14Amy Elsner
1041Faith GillianAustralia2025-07-31Rangoni Of Florence RENEWAL67Stephen Shaw
1042Adams MorascaUnited Kingdom2025-07-07Rousseaux, Michael Esq RENEWAL46Anna Fali
1043Greenwood BologniaBrazil2025-07-31Benton, John B Jr UNQUALIFIED56Anna Fali
1044Alejandro PerinRussia2025-08-01Printing Dimensions RENEWAL36Anna Fali
1045Greenwood BologniaFrance2025-07-18Morlong Associates NEGOTIATION61Xuxue Feng
1046Octavia MaletArgentina2025-07-06Feltz Printing Service NEGOTIATION94Asiya Javayant
1047Chavez BriddickUnited Kingdom2025-07-26King, Christopher A Esq QUALIFIED76Amy Elsner
1048Nicolas IturbideAustralia2025-07-23Rangoni Of Florence RENEWAL20Anna Fali
1049Jeanfrancois VenereSpain2025-07-18Rousseaux, Michael Esq UNQUALIFIED56Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Faith GillianIndiaStephen Shaw QUALIFIED
Costa DilliardCanadaAmy Elsner QUALIFIED
Claire TollnerFranceOnyama Limba UNQUALIFIED
Jones VocelkaUnited KingdomAnna Fali QUALIFIED
Isabel BowleyBrazilOnyama Limba PROPOSAL
Clifford RimRussiaOnyama Limba PROPOSAL
Misaki RoysterArgentinaBernardo Dominic PROPOSAL
Stacey MacleadBrazilAmy Elsner RENEWAL
Ashley DoeCanadaXuxue Feng PROPOSAL
Ivar PaprockiRussiaAsiya Javayant QUALIFIED
Morrow RutaJapanOnyama Limba NEGOTIATION
Sinclair WaycottIndiaBernardo Dominic RENEWAL
Morrow RutaRussiaStephen Shaw QUALIFIED
Maisha RulapaughSpainXuxue Feng PROPOSAL
Jefferson SchemmerArgentinaIoni Bowcher QUALIFIED
Jones VocelkaBrazilOnyama Limba RENEWAL
Smith GlickArgentinaIvan Magalhaes PROPOSAL
Wickens NestleFranceStephen Shaw QUALIFIED
Maria MarrierArgentinaBernardo Dominic RENEWAL
Silvio SlusarskiFranceElwin Sharvill PROPOSAL
Ivar PaprockiSpainStephen Shaw QUALIFIED
Adams MorascaArgentinaElwin Sharvill QUALIFIED
Chavez BriddickGermanyXuxue Feng QUALIFIED
Ashley DoeFranceOnyama Limba PROPOSAL
Nicolas IturbideJapanBernardo Dominic UNQUALIFIED
Izzy GarufiSpainElwin Sharvill NEGOTIATION
Sinclair WaycottIndiaIvan Magalhaes UNQUALIFIED
Ashley DoeUnited KingdomOnyama Limba QUALIFIED
Izzy GarufiAustraliaElwin Sharvill UNQUALIFIED
Tony FollerUnited KingdomElwin Sharvill NEGOTIATION
Johnson SergiItalyElwin Sharvill NEW
Faith GillianItalyOnyama Limba PROPOSAL
Isabel BowleyBrazilAsiya Javayant PROPOSAL
Arvin AlbaresUnited KingdomAmy Elsner QUALIFIED
Jefferson SchemmerUnited KingdomAmy Elsner NEGOTIATION
Claire TollnerIndiaAnna Fali QUALIFIED
Ivar PaprockiUnited KingdomIvan Magalhaes QUALIFIED
Morrow RutaSpainIoni Bowcher UNQUALIFIED
Isabel BowleyAustraliaOnyama Limba UNQUALIFIED
Leja CaldareraItalyAnna Fali PROPOSAL
Maria MarrierArgentinaIvan Magalhaes NEGOTIATION
Aruna FigeroaFranceOnyama Limba NEW
Cody SaylorsArgentinaStephen Shaw UNQUALIFIED
Jones VocelkaFranceAnna Fali QUALIFIED
Misaki RoysterArgentinaAsiya Javayant UNQUALIFIED
Claire TollnerRussiaAmy Elsner NEGOTIATION
Nicolas IturbideJapanElwin Sharvill RENEWAL
Jennifer AmigonArgentinaStephen Shaw QUALIFIED
Rodrigues CampainUnited KingdomIoni Bowcher PROPOSAL
Arvin AlbaresAustraliaOnyama Limba NEW
Frozen Columns
Name
Jones Vocelka
Rodrigues Campain
James Butt
Murillo Malet
Nicolas Iturbide
Leja Caldarera
Nicolas Iturbide
Tony Foller
David Darakjy
Johnson Sergi
Clifford Rim
Aditya Kusko
Leon Oldroyd
Jefferson Schemmer
Maisha Rulapaugh
Mayumi Kolmetz
Jefferson Schemmer
Ivar Paprocki
Maisha Rulapaugh
David Darakjy
Wickens Nestle
Cody Saylors
Leon Oldroyd
Kadeem Flosi
Faith Gillian
Adams Morasca
Jones Vocelka
Wickens Nestle
Cody Saylors
Jones Vocelka
Isabel Bowley
Adams Morasca
Ashley Doe
Silvio Slusarski
Greenwood Bolognia
Aruna Figeroa
Maria Marrier
Munro Ferencz
Cody Saylors
Aika Inouye
Ashley Doe
Emily Whobrey
Alejandro Perin
Wickens Nestle
Jeanfrancois Venere
Wickens Nestle
Mujtaba Nicka
Chavez Briddick
Alejandro Perin
Antonio Caudy
IdCountryDate
1000Australia2025-07-10
1001India2025-07-19
1002Canada2025-07-20
1003India2025-07-03
1004Spain2025-07-10
1005Canada2025-07-28
1006Russia2025-07-11
1007Australia2025-07-20
1008India2025-07-19
1009Germany2025-07-13
1010Spain2025-07-26
1011Italy2025-07-31
1012India2025-07-23
1013Russia2025-07-23
1014Italy2025-07-18
1015Spain2025-07-09
1016Argentina2025-07-11
1017Brazil2025-07-08
1018Brazil2025-08-01
1019Argentina2025-07-16
1020India2025-07-04
1021Brazil2025-07-05
1022France2025-07-13
1023United Kingdom2025-07-19
1024India2025-07-14
1025India2025-07-31
1026Brazil2025-07-16
1027Brazil2025-07-08
1028Brazil2025-07-29
1029India2025-08-01
1030Canada2025-07-14
1031France2025-07-13
1032Italy2025-07-17
1033Japan2025-07-21
1034Argentina2025-07-24
1035United Kingdom2025-07-23
1036Australia2025-07-21
1037Russia2025-07-20
1038Japan2025-07-06
1039France2025-07-09
1040Spain2025-07-20
1041France2025-07-05
1042Russia2025-07-12
1043Argentina2025-07-07
1044United Kingdom2025-07-12
1045Brazil2025-07-14
1046Japan2025-07-13
1047United Kingdom2025-07-19
1048Spain2025-07-23
1049Argentina2025-07-12

On-Demand Data

NameIdCountryDate
Aruna Figeroa1000Australia2025-07-12
Mayumi Kolmetz1001Argentina2025-07-15
Adams Morasca1002France2025-07-29
Darci Poquette1003Canada2025-08-01
Nicolas Iturbide1004Germany2025-07-16
Chavez Briddick1005Brazil2025-07-07
Aika Inouye1006France2025-07-28
Maisha Rulapaugh1007Germany2025-07-31
Jeanfrancois Venere1008Australia2025-07-04
Juan Wieser1009Australia2025-07-07
Jefferson Schemmer1010Russia2025-07-17
Adams Morasca1011Brazil2025-07-21
Johnson Sergi1012Japan2025-07-24
Clifford Rim1013Japan2025-07-12
Arvin Albares1014Spain2025-07-04
Murillo Malet1015Argentina2025-07-19
Isabel Bowley1016Japan2025-07-21
Ivar Paprocki1017Germany2025-07-25
Greenwood Bolognia1018Spain2025-07-31
Smith Glick1019Germany2025-07-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Izzy GarufiIndiaIvan Magalhaes QUALIFIED
Aditya KuskoCanadaAsiya Javayant UNQUALIFIED
Aditya KuskoSpainOnyama Limba UNQUALIFIED
Wickens NestleArgentinaAmy Elsner QUALIFIED
David DarakjyCanadaIoni Bowcher NEW
Greenwood BologniaArgentinaIoni Bowcher UNQUALIFIED
Deepesh ChuiRussiaOnyama Limba UNQUALIFIED
Antonio CaudyJapanBernardo Dominic NEGOTIATION
Johnson SergiItalyAsiya Javayant RENEWAL
Clifford RimRussiaAnna Fali NEGOTIATION
Maria MarrierGermanyAsiya Javayant PROPOSAL
Izzy GarufiCanadaStephen Shaw RENEWAL
Salvatore StockhamCanadaXuxue Feng PROPOSAL
David DarakjyArgentinaIoni Bowcher QUALIFIED
Julie StensethGermanyAmy Elsner NEW
Leja CaldareraAustraliaOnyama Limba UNQUALIFIED
Francesco ShinkoUnited KingdomBernardo Dominic PROPOSAL
Wickens NestleSpainXuxue Feng NEW
Juan WieserAustraliaIvan Magalhaes UNQUALIFIED
Deepesh ChuiItalyAsiya Javayant QUALIFIED
Chavez BriddickFranceBernardo Dominic UNQUALIFIED
Stacey MacleadItalyOnyama Limba RENEWAL
Juan WieserJapanElwin Sharvill PROPOSAL
Silvio SlusarskiSpainIvan Magalhaes UNQUALIFIED
Juan WieserBrazilAsiya Javayant NEGOTIATION
Claire TollnerItalyXuxue Feng NEGOTIATION
Salvatore StockhamIndiaIvan Magalhaes NEGOTIATION
Mujtaba NickaUnited KingdomAnna Fali NEW
Adams MorascaCanadaBernardo Dominic NEW
Ivar PaprockiSpainAmy Elsner NEW
Stacey MacleadItalyElwin Sharvill UNQUALIFIED
Tony FollerItalyOnyama Limba PROPOSAL
Arvin AlbaresUnited KingdomStephen Shaw RENEWAL
Alejandro PerinUnited KingdomXuxue Feng UNQUALIFIED
Wickens NestleGermanyElwin Sharvill NEGOTIATION
Francesco ShinkoBrazilStephen Shaw UNQUALIFIED
Stacey MacleadArgentinaOnyama Limba QUALIFIED
Antonio CaudyGermanyXuxue Feng PROPOSAL
Cody SaylorsItalyXuxue Feng RENEWAL
Deepesh ChuiAustraliaElwin Sharvill 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>