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 OldroydUnited KingdomXuxue Feng PROPOSAL
Arvin AlbaresJapanIvan Magalhaes NEGOTIATION
Adams MorascaBrazilIoni Bowcher NEGOTIATION
David DarakjyItalyBernardo Dominic UNQUALIFIED
Claire TollnerBrazilOnyama Limba UNQUALIFIED
Aruna FigeroaGermanyIoni Bowcher NEGOTIATION
Rodrigues CampainItalyOnyama Limba NEW
Salvatore StockhamRussiaBernardo Dominic NEW
Greenwood BologniaArgentinaOnyama Limba PROPOSAL
Smith GlickUnited KingdomIoni Bowcher PROPOSAL
Francesco ShinkoIndiaAmy Elsner NEW
Isabel BowleyBrazilElwin Sharvill QUALIFIED
Tony FollerGermanyElwin Sharvill NEGOTIATION
Arvin AlbaresFranceElwin Sharvill NEW
Johnson SergiBrazilIoni Bowcher NEW
Munro FerenczArgentinaElwin Sharvill NEGOTIATION
Emily WhobreyRussiaBernardo Dominic QUALIFIED
Ashley DoeArgentinaElwin Sharvill PROPOSAL
Clifford RimSpainAnna Fali PROPOSAL
Adams MorascaItalyXuxue Feng NEGOTIATION
Cody SaylorsItalyBernardo Dominic NEW
Mayumi KolmetzUnited KingdomElwin Sharvill RENEWAL
Costa DilliardRussiaAsiya Javayant NEW
Misaki RoysterAustraliaAsiya Javayant QUALIFIED
Faith GillianGermanyIoni Bowcher NEGOTIATION
Tony FollerSpainStephen Shaw QUALIFIED
Alejandro PerinBrazilIoni Bowcher UNQUALIFIED
Maria MarrierArgentinaOnyama Limba UNQUALIFIED
Greenwood BologniaBrazilAsiya Javayant QUALIFIED
Kaitlin OstroskyAustraliaAmy Elsner QUALIFIED
Wickens NestleJapanAnna Fali QUALIFIED
David DarakjyCanadaStephen Shaw PROPOSAL
Misaki RoysterFranceIoni Bowcher QUALIFIED
Misaki RoysterCanadaIvan Magalhaes UNQUALIFIED
Leja CaldareraSpainAsiya Javayant UNQUALIFIED
Jones VocelkaJapanAnna Fali NEGOTIATION
Cody SaylorsRussiaAnna Fali UNQUALIFIED
Deepesh ChuiFranceXuxue Feng UNQUALIFIED
Mujtaba NickaGermanyStephen Shaw UNQUALIFIED
David DarakjyBrazilIvan Magalhaes RENEWAL
Ricardo GauchoGermanyBernardo Dominic UNQUALIFIED
Mujtaba NickaIndiaXuxue Feng NEW
Izzy GarufiIndiaAsiya Javayant NEW
David DarakjyIndiaOnyama Limba UNQUALIFIED
Clifford RimCanadaAsiya Javayant PROPOSAL
Murillo MaletRussiaIoni Bowcher NEGOTIATION
Jones VocelkaAustraliaStephen Shaw UNQUALIFIED
Nicolas IturbideItalyXuxue Feng NEW
Adams MorascaJapanBernardo Dominic PROPOSAL
Claire TollnerItalyAnna Fali QUALIFIED
Horizontal
NameCountryRepresentativeStatus
Aditya KuskoRussiaIvan Magalhaes NEW
Sinclair WaycottSpainIoni Bowcher NEGOTIATION
Greenwood BologniaRussiaStephen Shaw NEW
Maisha RulapaughRussiaIvan Magalhaes PROPOSAL
Maisha RulapaughCanadaIoni Bowcher QUALIFIED
Ivar PaprockiArgentinaXuxue Feng NEW
James ButtIndiaElwin Sharvill UNQUALIFIED
Francesco ShinkoUnited KingdomElwin Sharvill PROPOSAL
James ButtCanadaBernardo Dominic PROPOSAL
Claire TollnerUnited KingdomIvan Magalhaes PROPOSAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Silvio SlusarskiUnited Kingdom2026-05-31Benton, John B Jr QUALIFIED41Ivan Magalhaes
1001Aika InouyeUnited Kingdom2026-05-31King, Christopher A Esq UNQUALIFIED79Bernardo Dominic
1002Morrow RutaFrance2026-06-01Chemel, James L Cpa NEW98Onyama Limba
1003Smith GlickSpain2026-06-03Dorl, James J Esq UNQUALIFIED64Anna Fali
1004Faith GillianCanada2026-05-17Feiner Bros QUALIFIED71Bernardo Dominic
1005Sinclair WaycottArgentina2026-05-13Morlong Associates NEW8Elwin Sharvill
1006Claire TollnerFrance2026-05-30Rousseaux, Michael Esq NEW36Bernardo Dominic
1007Francesco ShinkoBrazil2026-05-14Feltz Printing Service RENEWAL17Asiya Javayant
1008Greenwood BologniaIndia2026-06-02Buckley Miller Wright PROPOSAL12Onyama Limba
1009Smith GlickCanada2026-05-26Dorl, James J Esq UNQUALIFIED89Xuxue Feng
1010Salvatore StockhamRussia2026-05-21Commercial Press RENEWAL90Asiya Javayant
1011Cody SaylorsIndia2026-05-23Rousseaux, Michael Esq PROPOSAL10Elwin Sharvill
1012Arvin AlbaresAustralia2026-05-14Dorl, James J Esq NEGOTIATION30Asiya Javayant
1013Antonio CaudyItaly2026-05-16Dorl, James J Esq QUALIFIED74Elwin Sharvill
1014Costa DilliardIndia2026-05-29Feltz Printing Service NEW45Elwin Sharvill
1015Arvin AlbaresBrazil2026-05-28Chanay, Jeffrey A Esq NEGOTIATION9Stephen Shaw
1016Cody SaylorsItaly2026-05-21Morlong Associates QUALIFIED83Ivan Magalhaes
1017Silvio SlusarskiGermany2026-06-05Rangoni Of Florence NEGOTIATION75Bernardo Dominic
1018Darci PoquetteRussia2026-05-09Chemel, James L Cpa UNQUALIFIED38Onyama Limba
1019Kaitlin OstroskyJapan2026-05-13Feiner Bros NEW84Onyama Limba
1020Stacey MacleadJapan2026-05-12Printing Dimensions NEGOTIATION71Bernardo Dominic
1021Octavia MaletSpain2026-05-20Dorl, James J Esq UNQUALIFIED12Onyama Limba
1022Maisha RulapaughCanada2026-05-14Rousseaux, Michael Esq NEGOTIATION71Amy Elsner
1023Costa DilliardBrazil2026-05-23Morlong Associates PROPOSAL11Amy Elsner
1024Murillo MaletSpain2026-06-06Commercial Press NEGOTIATION18Xuxue Feng
1025Munro FerenczBrazil2026-05-15Truhlar And Truhlar Attys UNQUALIFIED40Onyama Limba
1026Deepesh ChuiGermany2026-06-04Feiner Bros NEW99Elwin Sharvill
1027Misaki RoysterJapan2026-06-05Chanay, Jeffrey A Esq PROPOSAL75Elwin Sharvill
1028Stacey MacleadBrazil2026-05-21Rousseaux, Michael Esq NEGOTIATION69Bernardo Dominic
1029Jennifer AmigonCanada2026-05-12Dorl, James J Esq UNQUALIFIED63Xuxue Feng
1030Clifford RimAustralia2026-05-23Commercial Press QUALIFIED25Bernardo Dominic
1031James ButtAustralia2026-06-03Chanay, Jeffrey A Esq NEW23Amy Elsner
1032Nicolas IturbideUnited Kingdom2026-06-03Buckley Miller Wright QUALIFIED60Amy Elsner
1033Faith GillianBrazil2026-05-10Buckley Miller Wright QUALIFIED95Ivan Magalhaes
1034Kaitlin OstroskyBrazil2026-05-31Rousseaux, Michael Esq PROPOSAL9Elwin Sharvill
1035Smith GlickIndia2026-06-01Rangoni Of Florence RENEWAL46Bernardo Dominic
1036Chavez BriddickUnited Kingdom2026-05-17Rangoni Of Florence UNQUALIFIED98Stephen Shaw
1037Rodrigues CampainJapan2026-06-07Chemel, James L Cpa UNQUALIFIED88Elwin Sharvill
1038Smith GlickGermany2026-05-12Feiner Bros NEW18Xuxue Feng
1039Arvin AlbaresGermany2026-05-12Buckley Miller Wright UNQUALIFIED25Onyama Limba
1040Aditya KuskoIndia2026-06-06King, Christopher A Esq RENEWAL21Ioni Bowcher
1041Salvatore StockhamItaly2026-05-09Buckley Miller Wright NEW66Onyama Limba
1042Aditya KuskoGermany2026-05-17Truhlar And Truhlar Attys UNQUALIFIED99Bernardo Dominic
1043Adams MorascaUnited Kingdom2026-05-16King, Christopher A Esq QUALIFIED97Stephen Shaw
1044James ButtFrance2026-05-14Benton, John B Jr NEGOTIATION23Amy Elsner
1045Salvatore StockhamJapan2026-05-19Buckley Miller Wright NEW19Amy Elsner
1046Isabel BowleyIndia2026-05-19Chanay, Jeffrey A Esq PROPOSAL8Onyama Limba
1047Mayumi KolmetzFrance2026-05-21Chapman, Ross E Esq QUALIFIED56Xuxue Feng
1048Kadeem FlosiIndia2026-05-30Feiner Bros QUALIFIED51Onyama Limba
1049Ashley DoeItaly2026-05-25Chanay, Jeffrey A Esq UNQUALIFIED4Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Johnson SergiAustraliaAnna Fali NEW
Aruna FigeroaSpainBernardo Dominic PROPOSAL
Arvin AlbaresUnited KingdomXuxue Feng PROPOSAL
Murillo MaletRussiaXuxue Feng UNQUALIFIED
Antonio CaudyRussiaIvan Magalhaes QUALIFIED
Adams MorascaAustraliaStephen Shaw PROPOSAL
Aruna FigeroaRussiaOnyama Limba NEGOTIATION
Jones VocelkaUnited KingdomAnna Fali UNQUALIFIED
Maisha RulapaughSpainIvan Magalhaes PROPOSAL
Misaki RoysterUnited KingdomAmy Elsner NEGOTIATION
Jefferson SchemmerItalyElwin Sharvill RENEWAL
Murillo MaletGermanyElwin Sharvill NEW
Antonio CaudySpainAsiya Javayant RENEWAL
Juan WieserSpainIvan Magalhaes NEW
Morrow RutaAustraliaIvan Magalhaes UNQUALIFIED
Mayumi KolmetzUnited KingdomXuxue Feng UNQUALIFIED
Nicolas IturbideItalyElwin Sharvill NEGOTIATION
Emily WhobreyFranceBernardo Dominic NEGOTIATION
Morrow RutaItalyAnna Fali QUALIFIED
Faith GillianBrazilAnna Fali UNQUALIFIED
Juan WieserRussiaOnyama Limba RENEWAL
Rodrigues CampainJapanAmy Elsner NEGOTIATION
Ricardo GauchoGermanyXuxue Feng UNQUALIFIED
Faith GillianSpainElwin Sharvill NEW
Ricardo GauchoFranceXuxue Feng NEGOTIATION
Murillo MaletItalyIvan Magalhaes QUALIFIED
Izzy GarufiGermanyAnna Fali QUALIFIED
Misaki RoysterJapanIoni Bowcher NEGOTIATION
David DarakjyItalyAnna Fali UNQUALIFIED
Aditya KuskoArgentinaAsiya Javayant RENEWAL
Rodrigues CampainUnited KingdomAsiya Javayant NEW
Sinclair WaycottRussiaStephen Shaw RENEWAL
Adams MorascaFranceOnyama Limba UNQUALIFIED
Octavia MaletAustraliaAnna Fali RENEWAL
Chavez BriddickRussiaAmy Elsner RENEWAL
Johnson SergiFranceIvan Magalhaes RENEWAL
Jones VocelkaAustraliaStephen Shaw QUALIFIED
Munro FerenczRussiaAmy Elsner RENEWAL
Deepesh ChuiIndiaAsiya Javayant PROPOSAL
Silvio SlusarskiFranceIvan Magalhaes PROPOSAL
Ashley DoeAustraliaAnna Fali NEW
Antonio CaudyAustraliaOnyama Limba QUALIFIED
Johnson SergiRussiaAnna Fali UNQUALIFIED
Kaitlin OstroskySpainXuxue Feng RENEWAL
Murillo MaletBrazilElwin Sharvill NEW
Juan WieserIndiaAmy Elsner QUALIFIED
Jennifer AmigonAustraliaAmy Elsner QUALIFIED
Mayumi KolmetzSpainElwin Sharvill NEGOTIATION
Cody SaylorsGermanyIoni Bowcher NEW
Claire TollnerGermanyAmy Elsner QUALIFIED
Frozen Columns
Name
Maria Marrier
Tony Foller
Faith Gillian
Costa Dilliard
Murillo Malet
Claire Tollner
Kaitlin Ostrosky
Murillo Malet
Leja Caldarera
James Butt
Jones Vocelka
Izzy Garufi
Tony Foller
Aika Inouye
Aditya Kusko
Wickens Nestle
Arvin Albares
Antonio Caudy
Aruna Figeroa
Jeanfrancois Venere
Emily Whobrey
Emily Whobrey
Claire Tollner
Maisha Rulapaugh
Munro Ferencz
Izzy Garufi
Izzy Garufi
David Darakjy
Alejandro Perin
Aditya Kusko
Nicolas Iturbide
Darci Poquette
Tony Foller
Munro Ferencz
Juan Wieser
Ricardo Gaucho
Johnson Sergi
James Butt
Ashley Doe
Maisha Rulapaugh
Arvin Albares
Morrow Ruta
Clifford Rim
Murillo Malet
Wickens Nestle
Kadeem Flosi
Morrow Ruta
Arvin Albares
Izzy Garufi
Misaki Royster
IdCountryDate
1000Brazil2026-06-04
1001Italy2026-06-07
1002India2026-05-09
1003Russia2026-05-16
1004United Kingdom2026-05-16
1005France2026-05-26
1006Japan2026-05-21
1007Canada2026-05-28
1008Germany2026-05-27
1009Argentina2026-05-29
1010Spain2026-05-24
1011Brazil2026-06-05
1012India2026-06-02
1013Japan2026-06-01
1014Russia2026-05-28
1015United Kingdom2026-05-10
1016Australia2026-06-05
1017Japan2026-05-09
1018Japan2026-05-23
1019France2026-05-14
1020United Kingdom2026-05-20
1021India2026-05-23
1022Canada2026-05-22
1023India2026-05-22
1024India2026-05-20
1025Spain2026-05-12
1026Brazil2026-05-09
1027Australia2026-05-22
1028France2026-05-29
1029Germany2026-05-23
1030Brazil2026-05-20
1031Australia2026-05-28
1032India2026-06-01
1033Italy2026-05-12
1034Canada2026-05-10
1035Australia2026-05-14
1036Italy2026-05-24
1037Argentina2026-05-26
1038Brazil2026-05-13
1039Canada2026-06-01
1040Spain2026-06-06
1041Brazil2026-05-20
1042France2026-05-16
1043Japan2026-05-16
1044Japan2026-05-20
1045France2026-06-04
1046Canada2026-05-14
1047Russia2026-05-31
1048France2026-05-17
1049Argentina2026-05-10

On-Demand Data

NameIdCountryDate
Leon Oldroyd1000Japan2026-05-24
Maria Marrier1001Spain2026-06-04
Rodrigues Campain1002France2026-05-23
Aditya Kusko1003Japan2026-05-15
Alejandro Perin1004Argentina2026-05-21
Ivar Paprocki1005Canada2026-06-04
Sinclair Waycott1006India2026-05-16
Arvin Albares1007Russia2026-05-16
Kadeem Flosi1008Germany2026-05-22
Smith Glick1009Argentina2026-05-20
Johnson Sergi1010India2026-05-13
James Butt1011Argentina2026-06-03
Clifford Rim1012Germany2026-05-24
David Darakjy1013Canada2026-05-29
Maria Marrier1014United Kingdom2026-05-15
Mayumi Kolmetz1015Canada2026-05-20
Chavez Briddick1016Japan2026-05-13
Tony Foller1017United Kingdom2026-05-17
Stacey Maclead1018India2026-05-13
Sinclair Waycott1019France2026-05-11
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Arvin AlbaresItalyStephen Shaw QUALIFIED
Octavia MaletRussiaBernardo Dominic PROPOSAL
Johnson SergiRussiaElwin Sharvill PROPOSAL
Isabel BowleyItalyElwin Sharvill NEGOTIATION
Aditya KuskoIndiaAmy Elsner PROPOSAL
Greenwood BologniaFranceElwin Sharvill QUALIFIED
Silvio SlusarskiArgentinaBernardo Dominic RENEWAL
Stacey MacleadSpainAmy Elsner NEGOTIATION
Aika InouyeCanadaAsiya Javayant RENEWAL
Ricardo GauchoArgentinaBernardo Dominic PROPOSAL
Maisha RulapaughJapanAnna Fali PROPOSAL
Silvio SlusarskiAustraliaStephen Shaw NEW
Arvin AlbaresArgentinaElwin Sharvill PROPOSAL
Murillo MaletJapanAnna Fali RENEWAL
Izzy GarufiAustraliaAmy Elsner RENEWAL
Chavez BriddickUnited KingdomBernardo Dominic QUALIFIED
Emily WhobreyItalyBernardo Dominic NEGOTIATION
Arvin AlbaresGermanyBernardo Dominic NEGOTIATION
Jennifer AmigonJapanXuxue Feng PROPOSAL
Adams MorascaCanadaAsiya Javayant PROPOSAL
Munro FerenczIndiaElwin Sharvill PROPOSAL
Claire TollnerBrazilStephen Shaw NEGOTIATION
Chavez BriddickJapanIoni Bowcher UNQUALIFIED
Salvatore StockhamRussiaBernardo Dominic UNQUALIFIED
Deepesh ChuiArgentinaIoni Bowcher NEGOTIATION
Munro FerenczIndiaAmy Elsner PROPOSAL
Jennifer AmigonItalyIoni Bowcher QUALIFIED
Costa DilliardBrazilBernardo Dominic QUALIFIED
Mujtaba NickaCanadaAsiya Javayant UNQUALIFIED
Salvatore StockhamRussiaStephen Shaw NEGOTIATION
Smith GlickUnited KingdomIoni Bowcher NEGOTIATION
Ricardo GauchoUnited KingdomAnna Fali QUALIFIED
Chavez BriddickFranceIoni Bowcher NEGOTIATION
Mujtaba NickaFranceStephen Shaw RENEWAL
Francesco ShinkoAustraliaXuxue Feng NEGOTIATION
Kadeem FlosiRussiaAnna Fali QUALIFIED
Sinclair WaycottGermanyAmy Elsner UNQUALIFIED
Clifford RimCanadaElwin Sharvill QUALIFIED
Leja CaldareraJapanAsiya Javayant NEGOTIATION
Julie StensethBrazilElwin Sharvill 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>