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
Leon OldroydFranceStephen Shaw QUALIFIED
Arvin AlbaresBrazilElwin Sharvill UNQUALIFIED
Maisha RulapaughIndiaAsiya Javayant UNQUALIFIED
James ButtBrazilOnyama Limba RENEWAL
Aruna FigeroaArgentinaAsiya Javayant UNQUALIFIED
Smith GlickAustraliaAnna Fali UNQUALIFIED
Leja CaldareraFranceElwin Sharvill QUALIFIED
Smith GlickItalyAsiya Javayant RENEWAL
Kadeem FlosiSpainAsiya Javayant PROPOSAL
Isabel BowleyGermanyIoni Bowcher NEW
Misaki RoysterBrazilStephen Shaw NEGOTIATION
Aruna FigeroaBrazilElwin Sharvill PROPOSAL
Aruna FigeroaIndiaIoni Bowcher PROPOSAL
Francesco ShinkoCanadaAsiya Javayant NEGOTIATION
Emily WhobreyAustraliaBernardo Dominic RENEWAL
Munro FerenczSpainStephen Shaw PROPOSAL
Chavez BriddickGermanyAsiya Javayant RENEWAL
Mayumi KolmetzArgentinaElwin Sharvill RENEWAL
Emily WhobreySpainIoni Bowcher NEGOTIATION
Jefferson SchemmerAustraliaIvan Magalhaes RENEWAL
Salvatore StockhamItalyIvan Magalhaes NEGOTIATION
Costa DilliardUnited KingdomStephen Shaw RENEWAL
James ButtCanadaAnna Fali QUALIFIED
Stacey MacleadArgentinaXuxue Feng QUALIFIED
Ashley DoeJapanOnyama Limba RENEWAL
Mujtaba NickaUnited KingdomXuxue Feng UNQUALIFIED
Murillo MaletGermanyAsiya Javayant NEGOTIATION
Cody SaylorsSpainStephen Shaw UNQUALIFIED
Faith GillianUnited KingdomElwin Sharvill PROPOSAL
Juan WieserSpainAmy Elsner UNQUALIFIED
Smith GlickSpainBernardo Dominic NEGOTIATION
Murillo MaletItalyStephen Shaw UNQUALIFIED
Maria MarrierSpainElwin Sharvill PROPOSAL
Izzy GarufiIndiaIoni Bowcher QUALIFIED
Clifford RimGermanyAnna Fali NEW
Munro FerenczRussiaIvan Magalhaes NEGOTIATION
Leja CaldareraCanadaStephen Shaw UNQUALIFIED
Octavia MaletUnited KingdomAnna Fali RENEWAL
Aruna FigeroaGermanyBernardo Dominic NEW
Aruna FigeroaIndiaAsiya Javayant NEGOTIATION
Deepesh ChuiUnited KingdomIoni Bowcher NEW
Francesco ShinkoFranceAnna Fali UNQUALIFIED
Leja CaldareraBrazilIoni Bowcher RENEWAL
Greenwood BologniaUnited KingdomAnna Fali NEGOTIATION
Aika InouyeJapanAsiya Javayant QUALIFIED
Aika InouyeAustraliaAmy Elsner NEW
Kaitlin OstroskyBrazilElwin Sharvill NEGOTIATION
Aika InouyeRussiaStephen Shaw QUALIFIED
Wickens NestleAustraliaOnyama Limba NEW
Izzy GarufiGermanyIvan Magalhaes NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Emily WhobreyJapanAmy Elsner NEGOTIATION
Leon OldroydItalyIvan Magalhaes NEGOTIATION
Deepesh ChuiItalyBernardo Dominic NEW
Juan WieserSpainIvan Magalhaes NEW
Misaki RoysterJapanAmy Elsner RENEWAL
Adams MorascaIndiaElwin Sharvill QUALIFIED
Emily WhobreyItalyIvan Magalhaes NEW
Sinclair WaycottCanadaIoni Bowcher RENEWAL
Murillo MaletUnited KingdomElwin Sharvill QUALIFIED
Leon OldroydFranceAnna Fali NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Maria MarrierItaly2026-06-06Chemel, James L Cpa NEGOTIATION96Ivan Magalhaes
1001Arvin AlbaresAustralia2026-05-13Dorl, James J Esq UNQUALIFIED31Asiya Javayant
1002Johnson SergiGermany2026-06-06Feltz Printing Service NEGOTIATION41Bernardo Dominic
1003Francesco ShinkoUnited Kingdom2026-05-09Buckley Miller Wright NEGOTIATION1Stephen Shaw
1004James ButtItaly2026-06-06Buckley Miller Wright QUALIFIED89Onyama Limba
1005Costa DilliardSpain2026-05-25Benton, John B Jr RENEWAL73Xuxue Feng
1006Smith GlickItaly2026-05-08Chapman, Ross E Esq NEW51Onyama Limba
1007Rodrigues CampainUnited Kingdom2026-05-17Commercial Press PROPOSAL17Bernardo Dominic
1008Leon OldroydSpain2026-05-12Benton, John B Jr QUALIFIED89Onyama Limba
1009Mayumi KolmetzJapan2026-06-01Feltz Printing Service RENEWAL70Stephen Shaw
1010Wickens NestleGermany2026-05-30Rousseaux, Michael Esq QUALIFIED34Amy Elsner
1011Morrow RutaCanada2026-06-01Buckley Miller Wright QUALIFIED11Elwin Sharvill
1012David DarakjyUnited Kingdom2026-05-11Printing Dimensions RENEWAL77Onyama Limba
1013Mujtaba NickaBrazil2026-05-19King, Christopher A Esq PROPOSAL60Ioni Bowcher
1014Chavez BriddickJapan2026-06-02Morlong Associates PROPOSAL17Onyama Limba
1015Clifford RimArgentina2026-06-01Chemel, James L Cpa RENEWAL0Elwin Sharvill
1016Ashley DoeBrazil2026-06-06Dorl, James J Esq NEGOTIATION98Amy Elsner
1017Izzy GarufiCanada2026-05-21Chanay, Jeffrey A Esq UNQUALIFIED53Stephen Shaw
1018Wickens NestleRussia2026-06-03Chanay, Jeffrey A Esq RENEWAL41Elwin Sharvill
1019Silvio SlusarskiGermany2026-05-23Commercial Press NEW10Bernardo Dominic
1020Antonio CaudyBrazil2026-05-25Rousseaux, Michael Esq NEW35Ivan Magalhaes
1021Leja CaldareraIndia2026-05-23Feiner Bros UNQUALIFIED54Onyama Limba
1022Ivar PaprockiIndia2026-05-15Chanay, Jeffrey A Esq RENEWAL24Ivan Magalhaes
1023Octavia MaletItaly2026-05-23Morlong Associates PROPOSAL43Onyama Limba
1024Octavia MaletBrazil2026-05-11Morlong Associates PROPOSAL33Bernardo Dominic
1025Aika InouyeCanada2026-06-01Benton, John B Jr NEGOTIATION65Onyama Limba
1026Ivar PaprockiRussia2026-05-26King, Christopher A Esq QUALIFIED96Onyama Limba
1027Leja CaldareraArgentina2026-05-28Chemel, James L Cpa UNQUALIFIED26Xuxue Feng
1028Mayumi KolmetzGermany2026-05-24Chemel, James L Cpa NEW3Stephen Shaw
1029Juan WieserArgentina2026-06-01Chanay, Jeffrey A Esq PROPOSAL5Asiya Javayant
1030Izzy GarufiJapan2026-05-21Chemel, James L Cpa NEW57Stephen Shaw
1031Chavez BriddickRussia2026-05-16Buckley Miller Wright NEGOTIATION46Bernardo Dominic
1032Nicolas IturbideGermany2026-05-13Benton, John B Jr NEW1Xuxue Feng
1033Isabel BowleyFrance2026-05-29Buckley Miller Wright NEGOTIATION34Anna Fali
1034Julie StensethGermany2026-05-18Chanay, Jeffrey A Esq RENEWAL55Stephen Shaw
1035Kadeem FlosiFrance2026-05-12Morlong Associates PROPOSAL34Onyama Limba
1036Maisha RulapaughGermany2026-05-08Buckley Miller Wright NEW94Stephen Shaw
1037Jennifer AmigonSpain2026-06-04Chemel, James L Cpa QUALIFIED38Anna Fali
1038Jeanfrancois VenereItaly2026-06-04Chemel, James L Cpa NEW71Asiya Javayant
1039David DarakjyBrazil2026-05-13Benton, John B Jr NEGOTIATION5Stephen Shaw
1040Jennifer AmigonJapan2026-05-17Benton, John B Jr QUALIFIED74Elwin Sharvill
1041Clifford RimFrance2026-05-20Truhlar And Truhlar Attys UNQUALIFIED36Bernardo Dominic
1042Antonio CaudyArgentina2026-05-27Chemel, James L Cpa NEW92Bernardo Dominic
1043James ButtCanada2026-05-21Chanay, Jeffrey A Esq NEGOTIATION92Ivan Magalhaes
1044James ButtUnited Kingdom2026-05-28Rangoni Of Florence PROPOSAL49Elwin Sharvill
1045Stacey MacleadRussia2026-05-16Chapman, Ross E Esq UNQUALIFIED73Amy Elsner
1046Ashley DoeUnited Kingdom2026-05-18Chanay, Jeffrey A Esq NEW85Bernardo Dominic
1047Munro FerenczAustralia2026-05-25Feltz Printing Service NEGOTIATION81Ioni Bowcher
1048Juan WieserFrance2026-05-26Truhlar And Truhlar Attys UNQUALIFIED36Xuxue Feng
1049Aditya KuskoUnited Kingdom2026-05-09Buckley Miller Wright NEGOTIATION49Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Nicolas IturbideFranceBernardo Dominic QUALIFIED
Ricardo GauchoRussiaAnna Fali PROPOSAL
Leon OldroydJapanAnna Fali RENEWAL
Salvatore StockhamArgentinaIoni Bowcher PROPOSAL
Kaitlin OstroskyItalyAsiya Javayant UNQUALIFIED
Tony FollerGermanyIvan Magalhaes UNQUALIFIED
Juan WieserUnited KingdomStephen Shaw NEW
Leja CaldareraAustraliaAsiya Javayant UNQUALIFIED
Claire TollnerFranceOnyama Limba UNQUALIFIED
Faith GillianFranceBernardo Dominic UNQUALIFIED
Morrow RutaIndiaBernardo Dominic RENEWAL
David DarakjyUnited KingdomAnna Fali QUALIFIED
Tony FollerIndiaStephen Shaw QUALIFIED
Alejandro PerinRussiaAsiya Javayant NEW
Claire TollnerSpainElwin Sharvill NEGOTIATION
Munro FerenczSpainIvan Magalhaes QUALIFIED
Kadeem FlosiCanadaElwin Sharvill UNQUALIFIED
Ashley DoeJapanIoni Bowcher NEGOTIATION
Ivar PaprockiBrazilIvan Magalhaes UNQUALIFIED
James ButtSpainBernardo Dominic RENEWAL
Aditya KuskoBrazilStephen Shaw PROPOSAL
Kaitlin OstroskyCanadaIoni Bowcher NEW
Ricardo GauchoBrazilAmy Elsner RENEWAL
Chavez BriddickBrazilAnna Fali QUALIFIED
Stacey MacleadAustraliaXuxue Feng NEW
Morrow RutaGermanyAsiya Javayant RENEWAL
Ricardo GauchoSpainElwin Sharvill RENEWAL
Julie StensethFranceXuxue Feng NEGOTIATION
Aruna FigeroaArgentinaElwin Sharvill UNQUALIFIED
Misaki RoysterRussiaBernardo Dominic QUALIFIED
James ButtItalyStephen Shaw PROPOSAL
Kaitlin OstroskyGermanyAsiya Javayant UNQUALIFIED
Darci PoquetteFranceBernardo Dominic RENEWAL
Salvatore StockhamFranceAnna Fali NEGOTIATION
Costa DilliardBrazilAmy Elsner NEGOTIATION
Maria MarrierArgentinaBernardo Dominic NEGOTIATION
Isabel BowleyCanadaAsiya Javayant QUALIFIED
Kaitlin OstroskyUnited KingdomIvan Magalhaes PROPOSAL
Mujtaba NickaFranceIoni Bowcher UNQUALIFIED
Mayumi KolmetzCanadaIoni Bowcher QUALIFIED
Adams MorascaFranceIvan Magalhaes NEGOTIATION
Ricardo GauchoFranceElwin Sharvill NEGOTIATION
Claire TollnerCanadaAnna Fali UNQUALIFIED
Mayumi KolmetzRussiaAmy Elsner QUALIFIED
Jefferson SchemmerCanadaXuxue Feng PROPOSAL
Maria MarrierGermanyAnna Fali QUALIFIED
Mujtaba NickaFranceBernardo Dominic NEW
Antonio CaudyGermanyIvan Magalhaes PROPOSAL
James ButtRussiaOnyama Limba NEW
Kaitlin OstroskySpainOnyama Limba NEW
Frozen Columns
Name
David Darakjy
Alejandro Perin
Julie Stenseth
Octavia Malet
Claire Tollner
Tony Foller
Chavez Briddick
Aditya Kusko
Claire Tollner
Julie Stenseth
Clifford Rim
Wickens Nestle
Kadeem Flosi
Leja Caldarera
Ricardo Gaucho
Izzy Garufi
Murillo Malet
Arvin Albares
Kadeem Flosi
Izzy Garufi
Jones Vocelka
Sinclair Waycott
Tony Foller
Adams Morasca
Isabel Bowley
Stacey Maclead
Clifford Rim
Octavia Malet
Kaitlin Ostrosky
Aika Inouye
Aika Inouye
Arvin Albares
Deepesh Chui
James Butt
Salvatore Stockham
Greenwood Bolognia
Izzy Garufi
Greenwood Bolognia
Ashley Doe
Aruna Figeroa
Nicolas Iturbide
Ricardo Gaucho
Johnson Sergi
Chavez Briddick
Sinclair Waycott
Mayumi Kolmetz
Rodrigues Campain
Sinclair Waycott
Aditya Kusko
Rodrigues Campain
IdCountryDate
1000Spain2026-05-18
1001Russia2026-05-31
1002Russia2026-06-06
1003Germany2026-05-25
1004France2026-05-17
1005United Kingdom2026-06-03
1006India2026-05-21
1007Italy2026-05-10
1008Germany2026-05-12
1009Canada2026-05-09
1010United Kingdom2026-05-13
1011Brazil2026-05-10
1012France2026-06-06
1013Argentina2026-06-02
1014Brazil2026-05-31
1015Germany2026-05-29
1016Russia2026-05-13
1017Italy2026-05-23
1018Japan2026-05-15
1019Brazil2026-05-24
1020Russia2026-05-22
1021India2026-05-28
1022Japan2026-05-29
1023Argentina2026-05-20
1024Germany2026-06-05
1025United Kingdom2026-05-24
1026India2026-05-26
1027Italy2026-05-17
1028Canada2026-05-26
1029India2026-05-26
1030Brazil2026-06-01
1031Italy2026-06-06
1032France2026-05-31
1033Canada2026-05-30
1034Brazil2026-05-20
1035Italy2026-06-04
1036Russia2026-06-01
1037Canada2026-05-30
1038India2026-05-12
1039Russia2026-05-12
1040Russia2026-05-16
1041Australia2026-05-16
1042Spain2026-05-13
1043Japan2026-05-27
1044Italy2026-05-16
1045Germany2026-05-19
1046Italy2026-05-13
1047Brazil2026-05-09
1048Germany2026-06-06
1049Argentina2026-05-16

On-Demand Data

NameIdCountryDate
David Darakjy1000Australia2026-05-20
Deepesh Chui1001United Kingdom2026-05-13
Salvatore Stockham1002Japan2026-06-04
Wickens Nestle1003Japan2026-06-04
Mayumi Kolmetz1004India2026-05-09
Jeanfrancois Venere1005Russia2026-05-27
Morrow Ruta1006Germany2026-05-17
Juan Wieser1007Argentina2026-05-16
Johnson Sergi1008France2026-05-29
Sinclair Waycott1009United Kingdom2026-05-10
Tony Foller1010Australia2026-05-17
Aika Inouye1011Russia2026-06-01
Silvio Slusarski1012Argentina2026-06-06
Francesco Shinko1013Japan2026-05-22
Ashley Doe1014Germany2026-06-02
Jennifer Amigon1015France2026-05-08
Chavez Briddick1016India2026-05-28
Maisha Rulapaugh1017Russia2026-05-13
Jennifer Amigon1018Spain2026-05-22
Salvatore Stockham1019Canada2026-05-08
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Alejandro PerinRussiaBernardo Dominic QUALIFIED
Faith GillianItalyStephen Shaw NEGOTIATION
Stacey MacleadJapanIoni Bowcher PROPOSAL
Emily WhobreyCanadaIvan Magalhaes PROPOSAL
Faith GillianFranceXuxue Feng RENEWAL
Francesco ShinkoBrazilXuxue Feng QUALIFIED
Sinclair WaycottIndiaAnna Fali UNQUALIFIED
Jones VocelkaCanadaElwin Sharvill NEGOTIATION
Misaki RoysterFranceOnyama Limba NEW
Rodrigues CampainBrazilBernardo Dominic RENEWAL
Aruna FigeroaCanadaAnna Fali NEGOTIATION
Jennifer AmigonJapanAmy Elsner UNQUALIFIED
Emily WhobreyItalyOnyama Limba RENEWAL
Silvio SlusarskiCanadaXuxue Feng UNQUALIFIED
Deepesh ChuiRussiaAsiya Javayant PROPOSAL
Salvatore StockhamArgentinaIoni Bowcher NEGOTIATION
Ashley DoeSpainAmy Elsner UNQUALIFIED
Salvatore StockhamFranceStephen Shaw UNQUALIFIED
Jones VocelkaUnited KingdomOnyama Limba UNQUALIFIED
Nicolas IturbideFranceXuxue Feng UNQUALIFIED
Cody SaylorsSpainAmy Elsner NEW
Juan WieserUnited KingdomElwin Sharvill QUALIFIED
Aruna FigeroaSpainElwin Sharvill RENEWAL
Kadeem FlosiItalyXuxue Feng PROPOSAL
Jeanfrancois VenereSpainAsiya Javayant NEGOTIATION
Rodrigues CampainAustraliaAnna Fali PROPOSAL
Kadeem FlosiFranceElwin Sharvill NEGOTIATION
Aditya KuskoBrazilXuxue Feng NEW
James ButtBrazilXuxue Feng UNQUALIFIED
Arvin AlbaresArgentinaIvan Magalhaes QUALIFIED
David DarakjyItalyStephen Shaw QUALIFIED
Leja CaldareraSpainXuxue Feng PROPOSAL
Silvio SlusarskiRussiaIoni Bowcher PROPOSAL
Leon OldroydBrazilIoni Bowcher PROPOSAL
Isabel BowleyItalyStephen Shaw QUALIFIED
Rodrigues CampainIndiaStephen Shaw PROPOSAL
Maisha RulapaughUnited KingdomOnyama Limba NEGOTIATION
Deepesh ChuiIndiaStephen Shaw PROPOSAL
Munro FerenczAustraliaIvan Magalhaes RENEWAL
Antonio CaudyIndiaXuxue Feng 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>