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
Salvatore StockhamBrazilStephen Shaw NEGOTIATION
Smith GlickJapanAnna Fali UNQUALIFIED
Jones VocelkaIndiaOnyama Limba QUALIFIED
Maria MarrierSpainAnna Fali UNQUALIFIED
Silvio SlusarskiGermanyOnyama Limba PROPOSAL
Mujtaba NickaSpainIoni Bowcher QUALIFIED
James ButtUnited KingdomXuxue Feng QUALIFIED
Ashley DoeIndiaElwin Sharvill RENEWAL
Leja CaldareraFranceIvan Magalhaes NEGOTIATION
Mayumi KolmetzBrazilElwin Sharvill NEGOTIATION
Leon OldroydAustraliaAnna Fali QUALIFIED
Tony FollerSpainAmy Elsner UNQUALIFIED
Aruna FigeroaIndiaBernardo Dominic RENEWAL
Faith GillianAustraliaOnyama Limba UNQUALIFIED
Morrow RutaArgentinaAmy Elsner QUALIFIED
Juan WieserAustraliaAnna Fali PROPOSAL
Antonio CaudyItalyXuxue Feng RENEWAL
James ButtBrazilElwin Sharvill NEGOTIATION
Izzy GarufiGermanyStephen Shaw NEGOTIATION
Nicolas IturbideCanadaElwin Sharvill PROPOSAL
Rodrigues CampainFranceOnyama Limba PROPOSAL
Nicolas IturbideAustraliaBernardo Dominic NEW
Leon OldroydFranceStephen Shaw RENEWAL
Kaitlin OstroskyArgentinaAmy Elsner NEW
Alejandro PerinJapanAsiya Javayant NEGOTIATION
Leja CaldareraAustraliaAmy Elsner NEGOTIATION
Rodrigues CampainJapanAsiya Javayant UNQUALIFIED
Adams MorascaSpainAsiya Javayant QUALIFIED
Mujtaba NickaGermanyIoni Bowcher NEW
Adams MorascaUnited KingdomStephen Shaw UNQUALIFIED
Clifford RimRussiaAsiya Javayant NEW
Greenwood BologniaArgentinaIoni Bowcher RENEWAL
Salvatore StockhamSpainXuxue Feng PROPOSAL
Johnson SergiFranceAmy Elsner RENEWAL
Ivar PaprockiJapanAsiya Javayant UNQUALIFIED
Kadeem FlosiJapanAnna Fali NEW
Ricardo GauchoBrazilElwin Sharvill UNQUALIFIED
Claire TollnerSpainStephen Shaw PROPOSAL
Mayumi KolmetzJapanAsiya Javayant NEGOTIATION
Ricardo GauchoIndiaAmy Elsner QUALIFIED
Antonio CaudyCanadaOnyama Limba NEW
Ashley DoeCanadaXuxue Feng QUALIFIED
Munro FerenczGermanyIvan Magalhaes QUALIFIED
Faith GillianArgentinaAsiya Javayant UNQUALIFIED
Cody SaylorsBrazilStephen Shaw UNQUALIFIED
Costa DilliardAustraliaOnyama Limba PROPOSAL
Morrow RutaArgentinaXuxue Feng PROPOSAL
Wickens NestleIndiaStephen Shaw NEGOTIATION
Alejandro PerinGermanyAnna Fali QUALIFIED
Jennifer AmigonArgentinaIvan Magalhaes RENEWAL
Horizontal
NameCountryRepresentativeStatus
Greenwood BologniaUnited KingdomXuxue Feng PROPOSAL
Adams MorascaArgentinaBernardo Dominic RENEWAL
Stacey MacleadCanadaAnna Fali PROPOSAL
Morrow RutaRussiaElwin Sharvill RENEWAL
Mujtaba NickaItalyIvan Magalhaes RENEWAL
Alejandro PerinRussiaIoni Bowcher QUALIFIED
Kadeem FlosiItalyBernardo Dominic RENEWAL
Morrow RutaSpainOnyama Limba RENEWAL
Antonio CaudySpainBernardo Dominic NEGOTIATION
Morrow RutaIndiaBernardo Dominic RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Maria MarrierUnited Kingdom2026-05-07Feiner Bros PROPOSAL7Stephen Shaw
1001Jennifer AmigonRussia2026-05-11Printing Dimensions NEW68Bernardo Dominic
1002Isabel BowleyCanada2026-04-16King, Christopher A Esq NEW90Ioni Bowcher
1003Ashley DoeItaly2026-04-15Chanay, Jeffrey A Esq PROPOSAL59Amy Elsner
1004Mujtaba NickaSpain2026-05-13Buckley Miller Wright PROPOSAL66Ivan Magalhaes
1005Wickens NestleArgentina2026-04-24Feltz Printing Service PROPOSAL98Stephen Shaw
1006Aika InouyeBrazil2026-04-16Rousseaux, Michael Esq UNQUALIFIED61Onyama Limba
1007Morrow RutaRussia2026-05-11Buckley Miller Wright UNQUALIFIED85Bernardo Dominic
1008Octavia MaletAustralia2026-04-22Rangoni Of Florence UNQUALIFIED42Xuxue Feng
1009Aditya KuskoGermany2026-05-08Printing Dimensions QUALIFIED29Amy Elsner
1010Juan WieserUnited Kingdom2026-05-04Benton, John B Jr RENEWAL25Asiya Javayant
1011Nicolas IturbideGermany2026-05-08King, Christopher A Esq QUALIFIED5Amy Elsner
1012Murillo MaletGermany2026-04-28Chanay, Jeffrey A Esq UNQUALIFIED81Xuxue Feng
1013Morrow RutaIndia2026-05-01Truhlar And Truhlar Attys NEGOTIATION69Ioni Bowcher
1014Jeanfrancois VenereJapan2026-04-27Morlong Associates UNQUALIFIED69Elwin Sharvill
1015Alejandro PerinGermany2026-05-12Dorl, James J Esq RENEWAL43Stephen Shaw
1016Kaitlin OstroskyAustralia2026-05-09King, Christopher A Esq PROPOSAL28Anna Fali
1017Silvio SlusarskiSpain2026-05-08King, Christopher A Esq RENEWAL51Amy Elsner
1018Nicolas IturbideArgentina2026-04-29Chapman, Ross E Esq QUALIFIED0Onyama Limba
1019Greenwood BologniaJapan2026-04-21Truhlar And Truhlar Attys QUALIFIED91Bernardo Dominic
1020Nicolas IturbideItaly2026-04-30King, Christopher A Esq RENEWAL46Elwin Sharvill
1021Clifford RimSpain2026-05-11Chemel, James L Cpa NEW86Asiya Javayant
1022Adams MorascaSpain2026-04-22Feltz Printing Service NEGOTIATION87Elwin Sharvill
1023Octavia MaletFrance2026-04-25Chapman, Ross E Esq RENEWAL51Xuxue Feng
1024Stacey MacleadAustralia2026-04-30Rousseaux, Michael Esq RENEWAL15Bernardo Dominic
1025James ButtAustralia2026-04-27Dorl, James J Esq PROPOSAL37Amy Elsner
1026Johnson SergiUnited Kingdom2026-05-09Morlong Associates UNQUALIFIED40Bernardo Dominic
1027Julie StensethItaly2026-04-25King, Christopher A Esq NEW83Amy Elsner
1028Leon OldroydRussia2026-04-26Feltz Printing Service NEGOTIATION89Ioni Bowcher
1029Silvio SlusarskiJapan2026-04-25Chapman, Ross E Esq RENEWAL91Xuxue Feng
1030Chavez BriddickCanada2026-05-12Chanay, Jeffrey A Esq QUALIFIED71Ivan Magalhaes
1031Misaki RoysterAustralia2026-04-20Chemel, James L Cpa QUALIFIED25Bernardo Dominic
1032Maisha RulapaughRussia2026-04-25Morlong Associates QUALIFIED3Onyama Limba
1033David DarakjyGermany2026-05-12Printing Dimensions UNQUALIFIED79Asiya Javayant
1034Aruna FigeroaItaly2026-04-22Printing Dimensions NEW60Ioni Bowcher
1035Tony FollerGermany2026-04-30Morlong Associates UNQUALIFIED3Xuxue Feng
1036Clifford RimCanada2026-04-27Printing Dimensions QUALIFIED54Anna Fali
1037Nicolas IturbideUnited Kingdom2026-04-29Rousseaux, Michael Esq NEGOTIATION24Amy Elsner
1038Clifford RimFrance2026-04-30Benton, John B Jr QUALIFIED49Onyama Limba
1039David DarakjyCanada2026-04-24Benton, John B Jr QUALIFIED13Ioni Bowcher
1040Juan WieserBrazil2026-05-02King, Christopher A Esq PROPOSAL96Ivan Magalhaes
1041Octavia MaletUnited Kingdom2026-04-28Buckley Miller Wright UNQUALIFIED79Bernardo Dominic
1042David DarakjyCanada2026-04-21Buckley Miller Wright PROPOSAL63Amy Elsner
1043Ricardo GauchoBrazil2026-04-28Feltz Printing Service NEGOTIATION96Asiya Javayant
1044Mayumi KolmetzGermany2026-04-30Morlong Associates NEGOTIATION38Asiya Javayant
1045Salvatore StockhamGermany2026-04-14Chapman, Ross E Esq PROPOSAL59Amy Elsner
1046Tony FollerGermany2026-04-26Printing Dimensions PROPOSAL45Ioni Bowcher
1047David DarakjyRussia2026-04-27Benton, John B Jr UNQUALIFIED97Xuxue Feng
1048Chavez BriddickIndia2026-04-15King, Christopher A Esq QUALIFIED37Onyama Limba
1049Chavez BriddickSpain2026-04-30Truhlar And Truhlar Attys UNQUALIFIED18Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Tony FollerFranceIoni Bowcher NEW
Sinclair WaycottAustraliaXuxue Feng QUALIFIED
Johnson SergiRussiaOnyama Limba NEW
Alejandro PerinIndiaAsiya Javayant QUALIFIED
Maisha RulapaughArgentinaBernardo Dominic RENEWAL
Maisha RulapaughFranceStephen Shaw RENEWAL
Cody SaylorsGermanyAmy Elsner QUALIFIED
Johnson SergiUnited KingdomOnyama Limba QUALIFIED
Jennifer AmigonJapanIvan Magalhaes NEGOTIATION
Jones VocelkaIndiaStephen Shaw QUALIFIED
Darci PoquetteFranceIvan Magalhaes UNQUALIFIED
Octavia MaletIndiaAsiya Javayant PROPOSAL
Aika InouyeAustraliaOnyama Limba UNQUALIFIED
Ashley DoeFranceIoni Bowcher QUALIFIED
Emily WhobreyRussiaOnyama Limba NEGOTIATION
Johnson SergiSpainXuxue Feng PROPOSAL
Ashley DoeItalyIvan Magalhaes NEW
James ButtFranceIoni Bowcher NEW
James ButtIndiaAmy Elsner NEGOTIATION
Johnson SergiArgentinaAmy Elsner UNQUALIFIED
Aruna FigeroaCanadaBernardo Dominic QUALIFIED
Alejandro PerinRussiaAsiya Javayant QUALIFIED
Mayumi KolmetzIndiaAsiya Javayant PROPOSAL
Octavia MaletItalyAmy Elsner NEW
Aruna FigeroaUnited KingdomBernardo Dominic NEGOTIATION
Mayumi KolmetzIndiaStephen Shaw PROPOSAL
Aditya KuskoCanadaAmy Elsner UNQUALIFIED
Ashley DoeGermanyAnna Fali RENEWAL
Ashley DoeJapanAnna Fali NEW
Maisha RulapaughFranceOnyama Limba NEW
Rodrigues CampainArgentinaOnyama Limba UNQUALIFIED
Misaki RoysterJapanAsiya Javayant RENEWAL
Alejandro PerinAustraliaIvan Magalhaes NEW
Costa DilliardFranceXuxue Feng UNQUALIFIED
Sinclair WaycottCanadaAsiya Javayant QUALIFIED
Faith GillianJapanXuxue Feng NEW
Claire TollnerArgentinaAnna Fali UNQUALIFIED
Jeanfrancois VenereCanadaAmy Elsner NEW
Rodrigues CampainArgentinaElwin Sharvill UNQUALIFIED
Isabel BowleyIndiaBernardo Dominic QUALIFIED
Nicolas IturbideItalyOnyama Limba NEW
Darci PoquetteCanadaAsiya Javayant RENEWAL
Jennifer AmigonGermanyIoni Bowcher UNQUALIFIED
Ashley DoeFranceStephen Shaw NEW
Aditya KuskoArgentinaOnyama Limba RENEWAL
Jeanfrancois VenereRussiaStephen Shaw UNQUALIFIED
Cody SaylorsJapanBernardo Dominic RENEWAL
Mayumi KolmetzItalyXuxue Feng PROPOSAL
Maisha RulapaughFranceAnna Fali UNQUALIFIED
Jefferson SchemmerIndiaElwin Sharvill UNQUALIFIED
Frozen Columns
Name
Silvio Slusarski
Alejandro Perin
Alejandro Perin
Murillo Malet
Izzy Garufi
Aditya Kusko
Ricardo Gaucho
Aruna Figeroa
Darci Poquette
Darci Poquette
Silvio Slusarski
Claire Tollner
Misaki Royster
James Butt
Chavez Briddick
Alejandro Perin
Deepesh Chui
Claire Tollner
Kadeem Flosi
Jeanfrancois Venere
Aruna Figeroa
Wickens Nestle
Leon Oldroyd
Izzy Garufi
Ashley Doe
Mayumi Kolmetz
Ricardo Gaucho
Aditya Kusko
Murillo Malet
Aika Inouye
Faith Gillian
Emily Whobrey
Isabel Bowley
Wickens Nestle
Leon Oldroyd
Leon Oldroyd
Juan Wieser
Ivar Paprocki
Chavez Briddick
Jennifer Amigon
David Darakjy
Julie Stenseth
Stacey Maclead
Sinclair Waycott
Aditya Kusko
Francesco Shinko
James Butt
Claire Tollner
Chavez Briddick
Costa Dilliard
IdCountryDate
1000Japan2026-04-14
1001Australia2026-04-20
1002Argentina2026-05-13
1003Russia2026-04-24
1004Spain2026-05-03
1005France2026-04-26
1006India2026-05-08
1007Argentina2026-04-25
1008Argentina2026-05-11
1009Argentina2026-05-12
1010Brazil2026-04-23
1011Japan2026-05-11
1012Japan2026-04-29
1013Italy2026-04-30
1014Brazil2026-05-10
1015Russia2026-05-10
1016Russia2026-04-30
1017Spain2026-04-23
1018Russia2026-05-09
1019Brazil2026-05-01
1020Spain2026-04-18
1021Russia2026-05-07
1022Argentina2026-04-22
1023Russia2026-04-18
1024France2026-04-24
1025Russia2026-05-01
1026France2026-05-06
1027Spain2026-04-18
1028India2026-05-11
1029Russia2026-04-21
1030United Kingdom2026-05-01
1031Russia2026-04-25
1032France2026-04-15
1033Russia2026-04-18
1034United Kingdom2026-04-15
1035Spain2026-04-20
1036Australia2026-05-06
1037Italy2026-04-25
1038Italy2026-04-20
1039Australia2026-05-11
1040Germany2026-04-17
1041Japan2026-04-26
1042Brazil2026-05-06
1043Brazil2026-04-16
1044Brazil2026-05-08
1045United Kingdom2026-04-20
1046Canada2026-04-19
1047Japan2026-04-19
1048Brazil2026-05-09
1049Italy2026-05-01

On-Demand Data

NameIdCountryDate
Maria Marrier1000Brazil2026-04-19
Greenwood Bolognia1001France2026-04-27
Jeanfrancois Venere1002Russia2026-04-15
Jeanfrancois Venere1003United Kingdom2026-05-02
Aditya Kusko1004Germany2026-05-04
Silvio Slusarski1005France2026-04-22
Wickens Nestle1006United Kingdom2026-05-13
Juan Wieser1007Australia2026-04-28
Antonio Caudy1008Brazil2026-04-29
Izzy Garufi1009Russia2026-04-14
Tony Foller1010United Kingdom2026-04-18
Francesco Shinko1011Germany2026-04-18
Cody Saylors1012Russia2026-05-04
Octavia Malet1013France2026-05-05
Deepesh Chui1014Brazil2026-05-12
Antonio Caudy1015Canada2026-04-17
Johnson Sergi1016Canada2026-04-27
Julie Stenseth1017Germany2026-04-30
Mayumi Kolmetz1018Italy2026-05-04
Arvin Albares1019Japan2026-05-02
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Sinclair WaycottGermanyAnna Fali UNQUALIFIED
Darci PoquetteIndiaAmy Elsner NEW
Kaitlin OstroskyAustraliaAnna Fali UNQUALIFIED
Isabel BowleySpainIoni Bowcher QUALIFIED
Cody SaylorsCanadaIoni Bowcher PROPOSAL
Kaitlin OstroskyAustraliaIvan Magalhaes UNQUALIFIED
Kaitlin OstroskyJapanIoni Bowcher UNQUALIFIED
Juan WieserBrazilIoni Bowcher QUALIFIED
Johnson SergiFranceXuxue Feng UNQUALIFIED
David DarakjySpainAnna Fali NEGOTIATION
Francesco ShinkoCanadaElwin Sharvill NEGOTIATION
Antonio CaudyGermanyIoni Bowcher NEW
Adams MorascaUnited KingdomAnna Fali NEGOTIATION
Izzy GarufiUnited KingdomElwin Sharvill PROPOSAL
Jones VocelkaSpainXuxue Feng NEW
Emily WhobreyCanadaIvan Magalhaes UNQUALIFIED
Aika InouyeGermanyStephen Shaw RENEWAL
Leon OldroydUnited KingdomStephen Shaw PROPOSAL
Emily WhobreyAustraliaStephen Shaw NEW
Aditya KuskoBrazilOnyama Limba NEGOTIATION
Jefferson SchemmerAustraliaXuxue Feng NEW
Jones VocelkaBrazilElwin Sharvill NEGOTIATION
Izzy GarufiCanadaBernardo Dominic RENEWAL
Jeanfrancois VenereJapanAmy Elsner PROPOSAL
Arvin AlbaresFranceIoni Bowcher PROPOSAL
Greenwood BologniaUnited KingdomAmy Elsner NEW
Sinclair WaycottRussiaAmy Elsner UNQUALIFIED
Kaitlin OstroskyArgentinaIoni Bowcher NEW
Arvin AlbaresItalyOnyama Limba NEW
Darci PoquetteJapanAmy Elsner NEGOTIATION
Faith GillianGermanyBernardo Dominic NEW
Maria MarrierJapanAsiya Javayant NEGOTIATION
Johnson SergiArgentinaIoni Bowcher PROPOSAL
Johnson SergiCanadaAnna Fali NEW
Jefferson SchemmerJapanAsiya Javayant NEW
Ivar PaprockiAustraliaXuxue Feng QUALIFIED
Claire TollnerFranceAmy Elsner QUALIFIED
Clifford RimJapanBernardo Dominic RENEWAL
Izzy GarufiGermanyOnyama Limba RENEWAL
David DarakjyGermanyAmy Elsner UNQUALIFIED

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