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
Alejandro PerinUnited KingdomIoni Bowcher QUALIFIED
Jennifer AmigonIndiaIvan Magalhaes UNQUALIFIED
Murillo MaletSpainAmy Elsner PROPOSAL
Mujtaba NickaSpainAnna Fali UNQUALIFIED
Rodrigues CampainRussiaIoni Bowcher NEGOTIATION
Costa DilliardCanadaAmy Elsner UNQUALIFIED
Johnson SergiFranceOnyama Limba QUALIFIED
Emily WhobreyBrazilAnna Fali NEGOTIATION
Julie StensethArgentinaIvan Magalhaes RENEWAL
Izzy GarufiRussiaIoni Bowcher QUALIFIED
Kadeem FlosiFranceIvan Magalhaes PROPOSAL
Antonio CaudyCanadaAnna Fali NEGOTIATION
Leja CaldareraRussiaAnna Fali RENEWAL
Maria MarrierBrazilElwin Sharvill UNQUALIFIED
Maisha RulapaughBrazilIoni Bowcher PROPOSAL
Jones VocelkaItalyAnna Fali RENEWAL
David DarakjyAustraliaIvan Magalhaes RENEWAL
Aditya KuskoJapanBernardo Dominic PROPOSAL
Costa DilliardCanadaAmy Elsner NEW
Ivar PaprockiCanadaStephen Shaw QUALIFIED
Adams MorascaGermanyStephen Shaw UNQUALIFIED
Tony FollerFranceAnna Fali NEW
Maria MarrierUnited KingdomStephen Shaw PROPOSAL
Aditya KuskoFranceOnyama Limba NEGOTIATION
Greenwood BologniaRussiaAsiya Javayant NEGOTIATION
Nicolas IturbideIndiaIoni Bowcher NEW
Ivar PaprockiArgentinaAsiya Javayant QUALIFIED
Ivar PaprockiItalyAsiya Javayant UNQUALIFIED
Juan WieserFranceOnyama Limba UNQUALIFIED
David DarakjyCanadaElwin Sharvill PROPOSAL
Julie StensethArgentinaOnyama Limba PROPOSAL
Ivar PaprockiArgentinaElwin Sharvill NEW
Francesco ShinkoRussiaAnna Fali PROPOSAL
Leon OldroydBrazilStephen Shaw PROPOSAL
Antonio CaudyGermanyAnna Fali PROPOSAL
Alejandro PerinUnited KingdomElwin Sharvill RENEWAL
Octavia MaletFranceOnyama Limba NEW
Maisha RulapaughSpainStephen Shaw NEGOTIATION
Mayumi KolmetzUnited KingdomAnna Fali QUALIFIED
Tony FollerArgentinaElwin Sharvill PROPOSAL
Jennifer AmigonItalyXuxue Feng NEW
Clifford RimSpainBernardo Dominic UNQUALIFIED
Rodrigues CampainFranceAnna Fali RENEWAL
Chavez BriddickIndiaXuxue Feng NEGOTIATION
Rodrigues CampainRussiaBernardo Dominic UNQUALIFIED
Morrow RutaArgentinaIvan Magalhaes UNQUALIFIED
Murillo MaletJapanAnna Fali UNQUALIFIED
Leja CaldareraIndiaStephen Shaw UNQUALIFIED
Costa DilliardUnited KingdomIvan Magalhaes RENEWAL
Chavez BriddickFranceAmy Elsner QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Costa DilliardArgentinaAsiya Javayant NEGOTIATION
Deepesh ChuiSpainElwin Sharvill PROPOSAL
Misaki RoysterArgentinaAsiya Javayant RENEWAL
Morrow RutaIndiaAsiya Javayant NEGOTIATION
Clifford RimBrazilXuxue Feng UNQUALIFIED
Deepesh ChuiUnited KingdomOnyama Limba QUALIFIED
Johnson SergiCanadaOnyama Limba RENEWAL
Kaitlin OstroskyUnited KingdomXuxue Feng PROPOSAL
Jones VocelkaItalyAmy Elsner NEW
Aditya KuskoRussiaOnyama Limba NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Murillo MaletAustralia2026-04-23Truhlar And Truhlar Attys RENEWAL64Xuxue Feng
1001Cody SaylorsAustralia2026-04-27Feiner Bros RENEWAL55Anna Fali
1002Maria MarrierArgentina2026-05-14Rangoni Of Florence UNQUALIFIED59Amy Elsner
1003Mayumi KolmetzAustralia2026-04-25Commercial Press RENEWAL36Asiya Javayant
1004Ivar PaprockiRussia2026-04-30Dorl, James J Esq UNQUALIFIED20Stephen Shaw
1005Darci PoquetteItaly2026-05-10Dorl, James J Esq RENEWAL59Ivan Magalhaes
1006Leon OldroydArgentina2026-04-29Dorl, James J Esq PROPOSAL13Xuxue Feng
1007Mujtaba NickaSpain2026-04-18Rangoni Of Florence UNQUALIFIED1Ioni Bowcher
1008Arvin AlbaresItaly2026-04-16Feltz Printing Service PROPOSAL8Elwin Sharvill
1009Sinclair WaycottCanada2026-04-27Morlong Associates NEW47Anna Fali
1010Maisha RulapaughCanada2026-04-21Feltz Printing Service NEGOTIATION35Anna Fali
1011Aditya KuskoGermany2026-05-14Feltz Printing Service RENEWAL41Bernardo Dominic
1012Ricardo GauchoAustralia2026-05-12King, Christopher A Esq NEGOTIATION4Onyama Limba
1013Salvatore StockhamItaly2026-04-22Feiner Bros UNQUALIFIED38Elwin Sharvill
1014Ivar PaprockiJapan2026-05-04Truhlar And Truhlar Attys RENEWAL64Onyama Limba
1015Smith GlickSpain2026-04-26Morlong Associates NEW52Onyama Limba
1016Johnson SergiFrance2026-05-11Chemel, James L Cpa UNQUALIFIED25Ivan Magalhaes
1017Maria MarrierFrance2026-04-15Truhlar And Truhlar Attys PROPOSAL28Amy Elsner
1018Jeanfrancois VenereCanada2026-05-04Dorl, James J Esq QUALIFIED38Amy Elsner
1019Aditya KuskoAustralia2026-05-01Truhlar And Truhlar Attys PROPOSAL19Anna Fali
1020Jeanfrancois VenereIndia2026-04-28Chemel, James L Cpa NEW40Anna Fali
1021Munro FerenczIndia2026-04-26Printing Dimensions RENEWAL12Amy Elsner
1022Maria MarrierItaly2026-04-30Rousseaux, Michael Esq PROPOSAL80Anna Fali
1023Adams MorascaBrazil2026-05-07Chanay, Jeffrey A Esq UNQUALIFIED24Anna Fali
1024Aruna FigeroaAustralia2026-05-11Feiner Bros PROPOSAL98Asiya Javayant
1025Murillo MaletItaly2026-04-24Feiner Bros UNQUALIFIED70Asiya Javayant
1026Jeanfrancois VenereJapan2026-05-03Buckley Miller Wright UNQUALIFIED9Xuxue Feng
1027Mujtaba NickaIndia2026-04-29Benton, John B Jr UNQUALIFIED7Anna Fali
1028Ashley DoeJapan2026-04-18Chanay, Jeffrey A Esq NEGOTIATION64Amy Elsner
1029Maria MarrierBrazil2026-05-02Chemel, James L Cpa QUALIFIED28Elwin Sharvill
1030Kadeem FlosiAustralia2026-04-28Feiner Bros QUALIFIED85Amy Elsner
1031David DarakjyCanada2026-04-17Truhlar And Truhlar Attys PROPOSAL86Bernardo Dominic
1032Jennifer AmigonAustralia2026-04-19Chanay, Jeffrey A Esq RENEWAL17Ivan Magalhaes
1033Salvatore StockhamFrance2026-05-01Printing Dimensions PROPOSAL10Ivan Magalhaes
1034Julie StensethRussia2026-04-28Chapman, Ross E Esq UNQUALIFIED41Bernardo Dominic
1035Munro FerenczIndia2026-04-29Printing Dimensions NEGOTIATION73Stephen Shaw
1036Costa DilliardBrazil2026-05-12King, Christopher A Esq UNQUALIFIED95Ivan Magalhaes
1037Chavez BriddickSpain2026-05-12Dorl, James J Esq RENEWAL95Onyama Limba
1038Sinclair WaycottUnited Kingdom2026-04-30Feltz Printing Service PROPOSAL21Elwin Sharvill
1039Ivar PaprockiJapan2026-05-14Commercial Press NEW45Xuxue Feng
1040Adams MorascaItaly2026-04-28Feltz Printing Service QUALIFIED91Ivan Magalhaes
1041Juan WieserCanada2026-04-24Morlong Associates RENEWAL16Stephen Shaw
1042Faith GillianCanada2026-05-03Feiner Bros RENEWAL21Asiya Javayant
1043Aika InouyeSpain2026-04-15Chapman, Ross E Esq QUALIFIED42Stephen Shaw
1044Octavia MaletCanada2026-04-16King, Christopher A Esq PROPOSAL80Anna Fali
1045Ashley DoeBrazil2026-05-14Commercial Press NEGOTIATION36Stephen Shaw
1046Murillo MaletGermany2026-05-08Benton, John B Jr PROPOSAL48Anna Fali
1047Jeanfrancois VenereCanada2026-05-09Truhlar And Truhlar Attys UNQUALIFIED6Ioni Bowcher
1048James ButtFrance2026-04-26Benton, John B Jr QUALIFIED26Onyama Limba
1049Costa DilliardJapan2026-04-25Morlong Associates NEGOTIATION56Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Jeanfrancois VenereAustraliaAsiya Javayant UNQUALIFIED
Claire TollnerRussiaOnyama Limba PROPOSAL
Ashley DoeBrazilAnna Fali NEW
Silvio SlusarskiRussiaStephen Shaw PROPOSAL
Octavia MaletBrazilBernardo Dominic NEGOTIATION
David DarakjyFranceStephen Shaw NEW
Maria MarrierAustraliaIvan Magalhaes PROPOSAL
Claire TollnerItalyStephen Shaw NEGOTIATION
Aruna FigeroaIndiaStephen Shaw UNQUALIFIED
Wickens NestleJapanXuxue Feng NEGOTIATION
Jefferson SchemmerJapanElwin Sharvill QUALIFIED
Octavia MaletIndiaAmy Elsner UNQUALIFIED
Arvin AlbaresSpainXuxue Feng NEGOTIATION
Maisha RulapaughGermanyAmy Elsner NEGOTIATION
Leon OldroydFranceIoni Bowcher NEW
Stacey MacleadArgentinaBernardo Dominic UNQUALIFIED
Murillo MaletRussiaXuxue Feng PROPOSAL
Isabel BowleyIndiaAmy Elsner PROPOSAL
Aruna FigeroaJapanStephen Shaw PROPOSAL
Jefferson SchemmerCanadaAmy Elsner PROPOSAL
Tony FollerGermanyXuxue Feng QUALIFIED
Deepesh ChuiFranceAnna Fali PROPOSAL
Jeanfrancois VenereSpainBernardo Dominic QUALIFIED
Wickens NestleCanadaStephen Shaw RENEWAL
Murillo MaletGermanyIvan Magalhaes UNQUALIFIED
Julie StensethFranceAmy Elsner NEW
Costa DilliardIndiaBernardo Dominic NEGOTIATION
Deepesh ChuiArgentinaAmy Elsner NEW
Rodrigues CampainJapanOnyama Limba QUALIFIED
Aruna FigeroaArgentinaAnna Fali QUALIFIED
Mujtaba NickaItalyStephen Shaw QUALIFIED
Johnson SergiCanadaAsiya Javayant NEGOTIATION
Maria MarrierCanadaElwin Sharvill RENEWAL
Emily WhobreyArgentinaAmy Elsner QUALIFIED
Alejandro PerinAustraliaIvan Magalhaes NEGOTIATION
Adams MorascaCanadaAmy Elsner QUALIFIED
Maria MarrierCanadaIvan Magalhaes NEGOTIATION
Maisha RulapaughItalyIvan Magalhaes PROPOSAL
Antonio CaudyCanadaOnyama Limba RENEWAL
Arvin AlbaresArgentinaElwin Sharvill PROPOSAL
Rodrigues CampainRussiaStephen Shaw PROPOSAL
Mayumi KolmetzUnited KingdomElwin Sharvill NEW
Nicolas IturbideSpainAsiya Javayant NEW
Ivar PaprockiRussiaXuxue Feng PROPOSAL
Francesco ShinkoAustraliaAsiya Javayant NEGOTIATION
Julie StensethCanadaStephen Shaw NEW
Arvin AlbaresFranceElwin Sharvill UNQUALIFIED
Kaitlin OstroskyAustraliaAmy Elsner NEGOTIATION
Jones VocelkaBrazilXuxue Feng PROPOSAL
Silvio SlusarskiItalyAsiya Javayant RENEWAL
Frozen Columns
Name
Julie Stenseth
Leon Oldroyd
Salvatore Stockham
Darci Poquette
David Darakjy
Maria Marrier
Aditya Kusko
Sinclair Waycott
Clifford Rim
Leon Oldroyd
Mayumi Kolmetz
Jeanfrancois Venere
Kadeem Flosi
Clifford Rim
David Darakjy
Darci Poquette
Rodrigues Campain
Arvin Albares
Nicolas Iturbide
Clifford Rim
Munro Ferencz
Johnson Sergi
Ivar Paprocki
Julie Stenseth
Ivar Paprocki
Mayumi Kolmetz
Murillo Malet
Adams Morasca
Jones Vocelka
Antonio Caudy
Juan Wieser
Octavia Malet
Silvio Slusarski
Adams Morasca
Adams Morasca
Jefferson Schemmer
Smith Glick
Ashley Doe
Wickens Nestle
Faith Gillian
Adams Morasca
Antonio Caudy
Greenwood Bolognia
Ricardo Gaucho
Rodrigues Campain
Darci Poquette
Isabel Bowley
Chavez Briddick
Nicolas Iturbide
Arvin Albares
IdCountryDate
1000Spain2026-04-16
1001Brazil2026-04-27
1002Brazil2026-05-07
1003Australia2026-04-16
1004Australia2026-04-26
1005Russia2026-05-06
1006Spain2026-05-09
1007Canada2026-04-28
1008Australia2026-05-03
1009Japan2026-05-06
1010Brazil2026-05-02
1011Russia2026-05-07
1012Japan2026-04-30
1013Germany2026-04-17
1014Italy2026-04-26
1015France2026-05-05
1016Canada2026-05-12
1017Canada2026-04-22
1018Brazil2026-04-26
1019France2026-04-18
1020Australia2026-04-18
1021Brazil2026-05-04
1022United Kingdom2026-05-01
1023India2026-04-24
1024Italy2026-04-24
1025United Kingdom2026-05-03
1026Japan2026-05-03
1027Russia2026-04-18
1028Italy2026-04-24
1029France2026-04-28
1030Argentina2026-05-11
1031Canada2026-05-12
1032United Kingdom2026-04-17
1033Canada2026-04-19
1034Argentina2026-04-16
1035Japan2026-05-06
1036United Kingdom2026-05-08
1037Brazil2026-05-09
1038Brazil2026-05-07
1039Argentina2026-04-26
1040Japan2026-04-29
1041Russia2026-04-24
1042Australia2026-05-01
1043Argentina2026-04-18
1044Australia2026-05-12
1045Brazil2026-05-11
1046Canada2026-04-18
1047Japan2026-04-24
1048United Kingdom2026-04-27
1049Russia2026-05-06

On-Demand Data

NameIdCountryDate
Cody Saylors1000Australia2026-04-24
Misaki Royster1001Brazil2026-04-24
Emily Whobrey1002Italy2026-05-13
Salvatore Stockham1003Russia2026-05-10
Antonio Caudy1004Italy2026-04-27
Clifford Rim1005Japan2026-04-21
Misaki Royster1006Brazil2026-04-30
Stacey Maclead1007Japan2026-05-10
Jeanfrancois Venere1008India2026-04-15
Clifford Rim1009Spain2026-05-02
Silvio Slusarski1010Japan2026-04-27
James Butt1011Japan2026-05-14
Emily Whobrey1012Japan2026-05-01
David Darakjy1013United Kingdom2026-04-25
Wickens Nestle1014Italy2026-04-18
Leja Caldarera1015Argentina2026-04-18
Mayumi Kolmetz1016Brazil2026-05-10
Leon Oldroyd1017Brazil2026-05-07
Nicolas Iturbide1018Germany2026-04-16
Costa Dilliard1019Russia2026-05-02
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Kadeem FlosiIndiaElwin Sharvill UNQUALIFIED
Morrow RutaJapanIoni Bowcher QUALIFIED
Costa DilliardAustraliaAmy Elsner NEW
Darci PoquetteRussiaOnyama Limba PROPOSAL
Jefferson SchemmerArgentinaXuxue Feng NEGOTIATION
Leja CaldareraGermanyAmy Elsner QUALIFIED
Mujtaba NickaIndiaIoni Bowcher NEGOTIATION
Stacey MacleadCanadaOnyama Limba NEGOTIATION
Maisha RulapaughUnited KingdomIoni Bowcher NEGOTIATION
Cody SaylorsBrazilAmy Elsner QUALIFIED
Chavez BriddickItalyAnna Fali NEGOTIATION
Chavez BriddickItalyAnna Fali NEGOTIATION
Darci PoquetteCanadaAmy Elsner NEW
Alejandro PerinJapanAsiya Javayant RENEWAL
Jones VocelkaBrazilAsiya Javayant RENEWAL
Emily WhobreyBrazilElwin Sharvill RENEWAL
David DarakjyGermanyStephen Shaw PROPOSAL
Jennifer AmigonJapanStephen Shaw RENEWAL
Aika InouyeUnited KingdomOnyama Limba NEW
Francesco ShinkoJapanOnyama Limba NEW
Antonio CaudyArgentinaOnyama Limba PROPOSAL
Arvin AlbaresAustraliaStephen Shaw RENEWAL
Octavia MaletIndiaBernardo Dominic NEGOTIATION
Costa DilliardJapanAnna Fali UNQUALIFIED
Murillo MaletFranceOnyama Limba NEW
Misaki RoysterBrazilAnna Fali UNQUALIFIED
Aditya KuskoFranceBernardo Dominic PROPOSAL
Ricardo GauchoRussiaAsiya Javayant RENEWAL
Aditya KuskoIndiaAmy Elsner UNQUALIFIED
James ButtGermanyXuxue Feng RENEWAL
Antonio CaudyUnited KingdomAmy Elsner NEW
Kaitlin OstroskyBrazilAsiya Javayant QUALIFIED
Jeanfrancois VenereSpainOnyama Limba NEGOTIATION
Adams MorascaRussiaIvan Magalhaes QUALIFIED
Adams MorascaSpainOnyama Limba QUALIFIED
Ashley DoeRussiaOnyama Limba PROPOSAL
Rodrigues CampainRussiaBernardo Dominic NEW
Kaitlin OstroskyGermanyOnyama Limba RENEWAL
Rodrigues CampainRussiaXuxue Feng NEW
James ButtRussiaElwin Sharvill 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>