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
Sinclair WaycottRussiaXuxue Feng PROPOSAL
Jones VocelkaUnited KingdomStephen Shaw PROPOSAL
Mayumi KolmetzGermanyAnna Fali UNQUALIFIED
Costa DilliardArgentinaIvan Magalhaes RENEWAL
Ricardo GauchoItalyXuxue Feng UNQUALIFIED
Costa DilliardRussiaAmy Elsner NEW
Maria MarrierJapanAsiya Javayant RENEWAL
Tony FollerAustraliaElwin Sharvill NEW
Misaki RoysterUnited KingdomBernardo Dominic QUALIFIED
Claire TollnerAustraliaAnna Fali QUALIFIED
Emily WhobreyJapanIoni Bowcher NEGOTIATION
Johnson SergiIndiaIoni Bowcher QUALIFIED
Julie StensethSpainOnyama Limba PROPOSAL
Juan WieserIndiaIoni Bowcher NEGOTIATION
Isabel BowleyItalyIvan Magalhaes QUALIFIED
Johnson SergiJapanAnna Fali RENEWAL
Munro FerenczUnited KingdomElwin Sharvill NEW
Alejandro PerinFranceIoni Bowcher UNQUALIFIED
Arvin AlbaresUnited KingdomStephen Shaw QUALIFIED
David DarakjyArgentinaOnyama Limba NEW
Munro FerenczUnited KingdomAmy Elsner NEGOTIATION
Darci PoquetteBrazilAmy Elsner UNQUALIFIED
Faith GillianGermanyBernardo Dominic PROPOSAL
Misaki RoysterBrazilOnyama Limba NEGOTIATION
Tony FollerIndiaAsiya Javayant PROPOSAL
Misaki RoysterIndiaBernardo Dominic QUALIFIED
Cody SaylorsJapanXuxue Feng QUALIFIED
Leon OldroydArgentinaBernardo Dominic QUALIFIED
Silvio SlusarskiItalyXuxue Feng NEGOTIATION
Antonio CaudyAustraliaStephen Shaw NEGOTIATION
Juan WieserArgentinaIoni Bowcher QUALIFIED
Deepesh ChuiItalyAsiya Javayant NEGOTIATION
Francesco ShinkoCanadaAnna Fali UNQUALIFIED
Mayumi KolmetzRussiaAmy Elsner PROPOSAL
Cody SaylorsFranceElwin Sharvill NEW
Ricardo GauchoCanadaBernardo Dominic PROPOSAL
Costa DilliardUnited KingdomStephen Shaw UNQUALIFIED
Juan WieserGermanyIvan Magalhaes NEW
Kadeem FlosiIndiaAnna Fali RENEWAL
Silvio SlusarskiIndiaElwin Sharvill NEGOTIATION
Ivar PaprockiIndiaXuxue Feng UNQUALIFIED
Adams MorascaItalyIvan Magalhaes RENEWAL
Tony FollerArgentinaStephen Shaw PROPOSAL
Tony FollerCanadaBernardo Dominic UNQUALIFIED
Arvin AlbaresItalyAsiya Javayant RENEWAL
Costa DilliardAustraliaStephen Shaw NEGOTIATION
Salvatore StockhamFranceAmy Elsner NEW
Julie StensethRussiaOnyama Limba UNQUALIFIED
Jennifer AmigonRussiaXuxue Feng NEGOTIATION
Deepesh ChuiBrazilAnna Fali UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Arvin AlbaresRussiaOnyama Limba RENEWAL
Stacey MacleadItalyStephen Shaw PROPOSAL
Antonio CaudyItalyElwin Sharvill PROPOSAL
Sinclair WaycottFranceAnna Fali NEGOTIATION
Aditya KuskoCanadaAnna Fali PROPOSAL
Cody SaylorsCanadaAsiya Javayant NEW
Silvio SlusarskiJapanStephen Shaw UNQUALIFIED
Francesco ShinkoIndiaAmy Elsner PROPOSAL
Aditya KuskoRussiaAsiya Javayant RENEWAL
Kadeem FlosiBrazilIoni Bowcher NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Ashley DoeCanada2026-05-09Chemel, James L Cpa NEW68Stephen Shaw
1001Kadeem FlosiSpain2026-05-13Dorl, James J Esq NEW56Bernardo Dominic
1002Ashley DoeUnited Kingdom2026-05-17Commercial Press QUALIFIED85Onyama Limba
1003Ivar PaprockiUnited Kingdom2026-05-22Benton, John B Jr NEW49Amy Elsner
1004Salvatore StockhamItaly2026-05-17Feiner Bros NEW94Stephen Shaw
1005Antonio CaudyGermany2026-05-02Chemel, James L Cpa RENEWAL38Amy Elsner
1006Jefferson SchemmerJapan2026-05-26Chanay, Jeffrey A Esq RENEWAL0Anna Fali
1007Chavez BriddickAustralia2026-05-18Dorl, James J Esq PROPOSAL77Asiya Javayant
1008Julie StensethSpain2026-05-29Benton, John B Jr NEGOTIATION78Stephen Shaw
1009James ButtJapan2026-05-13Chapman, Ross E Esq PROPOSAL51Amy Elsner
1010Kadeem FlosiFrance2026-05-03Chapman, Ross E Esq UNQUALIFIED49Xuxue Feng
1011Cody SaylorsIndia2026-05-07Feltz Printing Service PROPOSAL9Elwin Sharvill
1012Claire TollnerUnited Kingdom2026-05-27Feltz Printing Service PROPOSAL60Anna Fali
1013Costa DilliardUnited Kingdom2026-05-07Dorl, James J Esq NEGOTIATION47Stephen Shaw
1014Faith GillianCanada2026-05-16Morlong Associates PROPOSAL36Bernardo Dominic
1015Juan WieserIndia2026-05-01King, Christopher A Esq PROPOSAL12Anna Fali
1016Clifford RimBrazil2026-05-11Chanay, Jeffrey A Esq NEGOTIATION59Elwin Sharvill
1017Jefferson SchemmerJapan2026-05-13Chemel, James L Cpa PROPOSAL70Onyama Limba
1018Octavia MaletIndia2026-05-03Feiner Bros QUALIFIED38Asiya Javayant
1019Antonio CaudyFrance2026-05-25Printing Dimensions RENEWAL86Ioni Bowcher
1020Wickens NestleRussia2026-05-13Feltz Printing Service QUALIFIED91Ivan Magalhaes
1021Jennifer AmigonItaly2026-05-16Printing Dimensions NEW59Amy Elsner
1022Jeanfrancois VenereBrazil2026-05-05Benton, John B Jr RENEWAL44Stephen Shaw
1023Julie StensethIndia2026-05-18Chemel, James L Cpa NEGOTIATION74Elwin Sharvill
1024Wickens NestleItaly2026-05-05Rangoni Of Florence QUALIFIED91Xuxue Feng
1025Izzy GarufiAustralia2026-05-11Rousseaux, Michael Esq PROPOSAL37Ioni Bowcher
1026Claire TollnerGermany2026-05-03Chapman, Ross E Esq NEGOTIATION76Ivan Magalhaes
1027Francesco ShinkoCanada2026-05-25Morlong Associates QUALIFIED86Xuxue Feng
1028Misaki RoysterJapan2026-05-21Benton, John B Jr PROPOSAL27Ioni Bowcher
1029Smith GlickJapan2026-05-30Chapman, Ross E Esq QUALIFIED46Bernardo Dominic
1030Emily WhobreyBrazil2026-05-25Buckley Miller Wright RENEWAL69Xuxue Feng
1031Kadeem FlosiIndia2026-05-12Benton, John B Jr QUALIFIED98Amy Elsner
1032Faith GillianRussia2026-05-19Printing Dimensions NEGOTIATION44Amy Elsner
1033Jennifer AmigonSpain2026-05-14Rousseaux, Michael Esq PROPOSAL53Xuxue Feng
1034Costa DilliardBrazil2026-05-06Truhlar And Truhlar Attys QUALIFIED0Anna Fali
1035Chavez BriddickFrance2026-05-25Feltz Printing Service PROPOSAL37Elwin Sharvill
1036Kadeem FlosiArgentina2026-05-30Chanay, Jeffrey A Esq NEGOTIATION58Elwin Sharvill
1037Rodrigues CampainJapan2026-05-09Rangoni Of Florence UNQUALIFIED41Onyama Limba
1038Faith GillianFrance2026-05-14Rangoni Of Florence UNQUALIFIED92Asiya Javayant
1039Faith GillianIndia2026-05-28Morlong Associates NEGOTIATION48Elwin Sharvill
1040Kaitlin OstroskyCanada2026-05-17Chapman, Ross E Esq NEW81Onyama Limba
1041Johnson SergiArgentina2026-05-17Feiner Bros RENEWAL47Onyama Limba
1042Morrow RutaFrance2026-05-03Truhlar And Truhlar Attys PROPOSAL82Ioni Bowcher
1043Mayumi KolmetzUnited Kingdom2026-05-15Printing Dimensions PROPOSAL68Asiya Javayant
1044Mujtaba NickaFrance2026-05-21Feltz Printing Service QUALIFIED10Elwin Sharvill
1045Murillo MaletItaly2026-05-08Printing Dimensions UNQUALIFIED44Ivan Magalhaes
1046Chavez BriddickGermany2026-05-29Truhlar And Truhlar Attys NEGOTIATION83Onyama Limba
1047Antonio CaudySpain2026-05-21Buckley Miller Wright NEGOTIATION50Onyama Limba
1048Izzy GarufiArgentina2026-05-05Dorl, James J Esq NEGOTIATION38Ivan Magalhaes
1049Octavia MaletCanada2026-05-14Morlong Associates NEGOTIATION84Elwin Sharvill
Frozen Rows
NameCountryRepresentativeStatus
Greenwood BologniaCanadaAnna Fali RENEWAL
Kaitlin OstroskyFranceAnna Fali RENEWAL
Francesco ShinkoGermanyOnyama Limba NEGOTIATION
Faith GillianJapanIoni Bowcher QUALIFIED
Julie StensethFranceXuxue Feng NEGOTIATION
Nicolas IturbideFranceAnna Fali NEGOTIATION
David DarakjySpainIoni Bowcher PROPOSAL
Salvatore StockhamArgentinaAmy Elsner UNQUALIFIED
David DarakjyAustraliaElwin Sharvill QUALIFIED
Maisha RulapaughArgentinaIoni Bowcher PROPOSAL
Chavez BriddickGermanyIoni Bowcher UNQUALIFIED
Antonio CaudyGermanyXuxue Feng PROPOSAL
Adams MorascaArgentinaXuxue Feng NEGOTIATION
Faith GillianCanadaXuxue Feng NEGOTIATION
Leon OldroydSpainElwin Sharvill PROPOSAL
Tony FollerFranceAnna Fali UNQUALIFIED
Sinclair WaycottJapanXuxue Feng UNQUALIFIED
Greenwood BologniaBrazilElwin Sharvill QUALIFIED
Murillo MaletIndiaAmy Elsner RENEWAL
Misaki RoysterArgentinaIvan Magalhaes NEGOTIATION
Morrow RutaCanadaIoni Bowcher RENEWAL
Greenwood BologniaCanadaOnyama Limba NEGOTIATION
Morrow RutaFranceAmy Elsner UNQUALIFIED
Murillo MaletUnited KingdomIoni Bowcher QUALIFIED
Ashley DoeArgentinaAnna Fali RENEWAL
Kaitlin OstroskyJapanBernardo Dominic NEW
Wickens NestleAustraliaAnna Fali UNQUALIFIED
Silvio SlusarskiAustraliaAmy Elsner NEGOTIATION
Emily WhobreyArgentinaAmy Elsner QUALIFIED
Morrow RutaSpainBernardo Dominic UNQUALIFIED
Jeanfrancois VenereSpainElwin Sharvill PROPOSAL
Jennifer AmigonCanadaAnna Fali NEW
Juan WieserJapanIoni Bowcher QUALIFIED
Jefferson SchemmerRussiaXuxue Feng QUALIFIED
Kaitlin OstroskySpainAnna Fali RENEWAL
James ButtSpainXuxue Feng QUALIFIED
Aditya KuskoGermanyIvan Magalhaes PROPOSAL
Munro FerenczGermanyBernardo Dominic QUALIFIED
Faith GillianJapanIvan Magalhaes RENEWAL
Nicolas IturbideCanadaAnna Fali NEW
Isabel BowleyAustraliaIvan Magalhaes RENEWAL
Francesco ShinkoArgentinaAsiya Javayant UNQUALIFIED
David DarakjyArgentinaStephen Shaw NEW
Salvatore StockhamFranceIvan Magalhaes QUALIFIED
Sinclair WaycottFranceIvan Magalhaes NEW
Tony FollerItalyIoni Bowcher RENEWAL
Chavez BriddickAustraliaAnna Fali PROPOSAL
Mayumi KolmetzItalyElwin Sharvill QUALIFIED
Stacey MacleadBrazilAnna Fali QUALIFIED
Octavia MaletFranceIoni Bowcher PROPOSAL
Frozen Columns
Name
Aditya Kusko
Francesco Shinko
Adams Morasca
Maria Marrier
Francesco Shinko
Jeanfrancois Venere
Jones Vocelka
Johnson Sergi
Clifford Rim
Juan Wieser
Ricardo Gaucho
Salvatore Stockham
Jennifer Amigon
Misaki Royster
David Darakjy
Mujtaba Nicka
Izzy Garufi
Morrow Ruta
Adams Morasca
Morrow Ruta
Francesco Shinko
Kaitlin Ostrosky
Morrow Ruta
Wickens Nestle
Nicolas Iturbide
Kadeem Flosi
Octavia Malet
Costa Dilliard
Nicolas Iturbide
Ricardo Gaucho
Silvio Slusarski
Misaki Royster
Rodrigues Campain
Julie Stenseth
Rodrigues Campain
Juan Wieser
Salvatore Stockham
Ivar Paprocki
Julie Stenseth
Murillo Malet
Faith Gillian
David Darakjy
Aruna Figeroa
Izzy Garufi
Isabel Bowley
Chavez Briddick
Nicolas Iturbide
Maisha Rulapaugh
Salvatore Stockham
Francesco Shinko
IdCountryDate
1000Brazil2026-05-04
1001India2026-05-26
1002Brazil2026-05-15
1003Russia2026-05-24
1004Italy2026-05-20
1005United Kingdom2026-05-09
1006Japan2026-05-08
1007India2026-05-14
1008Canada2026-05-25
1009Spain2026-05-16
1010Russia2026-05-23
1011France2026-05-30
1012Canada2026-05-18
1013United Kingdom2026-05-15
1014United Kingdom2026-05-29
1015Russia2026-05-17
1016Australia2026-05-19
1017Brazil2026-05-22
1018Italy2026-05-26
1019Argentina2026-05-29
1020Italy2026-05-13
1021Italy2026-05-18
1022Japan2026-05-14
1023Canada2026-05-30
1024Russia2026-05-06
1025Canada2026-05-16
1026Russia2026-05-10
1027United Kingdom2026-05-24
1028Russia2026-05-18
1029Argentina2026-05-05
1030Canada2026-05-02
1031Japan2026-05-22
1032Russia2026-05-18
1033United Kingdom2026-05-02
1034United Kingdom2026-05-19
1035Argentina2026-05-25
1036Italy2026-05-12
1037Japan2026-05-21
1038Italy2026-05-19
1039Spain2026-05-26
1040Canada2026-05-05
1041Spain2026-05-13
1042Argentina2026-05-06
1043United Kingdom2026-05-12
1044Germany2026-05-27
1045Japan2026-05-08
1046India2026-05-05
1047Argentina2026-05-25
1048Russia2026-05-21
1049India2026-05-25

On-Demand Data

NameIdCountryDate
Ricardo Gaucho1000Germany2026-05-20
Misaki Royster1001India2026-05-13
Aruna Figeroa1002Germany2026-05-09
David Darakjy1003India2026-05-19
Jones Vocelka1004India2026-05-04
Francesco Shinko1005India2026-05-15
Leon Oldroyd1006Argentina2026-05-09
Jones Vocelka1007Germany2026-05-07
Aditya Kusko1008United Kingdom2026-05-01
Ricardo Gaucho1009India2026-05-19
Stacey Maclead1010France2026-05-11
Tony Foller1011Argentina2026-05-13
Darci Poquette1012Japan2026-05-02
Claire Tollner1013Russia2026-05-14
Misaki Royster1014Australia2026-05-22
Francesco Shinko1015Brazil2026-05-02
Mayumi Kolmetz1016India2026-05-07
Chavez Briddick1017France2026-05-09
Aruna Figeroa1018Italy2026-05-02
Murillo Malet1019Japan2026-05-28
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Costa DilliardSpainAmy Elsner NEW
Aruna FigeroaArgentinaAsiya Javayant RENEWAL
Costa DilliardAustraliaBernardo Dominic RENEWAL
Mujtaba NickaCanadaOnyama Limba PROPOSAL
Salvatore StockhamAustraliaXuxue Feng UNQUALIFIED
Kadeem FlosiUnited KingdomXuxue Feng NEW
Ashley DoeFranceIoni Bowcher NEW
Francesco ShinkoIndiaAsiya Javayant QUALIFIED
Misaki RoysterSpainAmy Elsner QUALIFIED
Julie StensethGermanyStephen Shaw RENEWAL
Ricardo GauchoAustraliaStephen Shaw NEGOTIATION
Juan WieserCanadaIoni Bowcher RENEWAL
Francesco ShinkoGermanyStephen Shaw UNQUALIFIED
Isabel BowleyRussiaStephen Shaw RENEWAL
Smith GlickUnited KingdomIvan Magalhaes NEGOTIATION
Emily WhobreyIndiaAmy Elsner PROPOSAL
Antonio CaudyUnited KingdomBernardo Dominic QUALIFIED
Chavez BriddickItalyIvan Magalhaes QUALIFIED
Claire TollnerRussiaOnyama Limba UNQUALIFIED
Silvio SlusarskiFranceAnna Fali PROPOSAL
Johnson SergiUnited KingdomAmy Elsner PROPOSAL
Maisha RulapaughBrazilBernardo Dominic PROPOSAL
Johnson SergiJapanAsiya Javayant PROPOSAL
Claire TollnerIndiaIoni Bowcher RENEWAL
Morrow RutaArgentinaOnyama Limba PROPOSAL
Clifford RimBrazilStephen Shaw NEW
Morrow RutaJapanStephen Shaw PROPOSAL
David DarakjyUnited KingdomElwin Sharvill NEW
Stacey MacleadJapanBernardo Dominic QUALIFIED
Claire TollnerJapanStephen Shaw UNQUALIFIED
Alejandro PerinRussiaAnna Fali PROPOSAL
Aika InouyeFranceXuxue Feng UNQUALIFIED
David DarakjyFranceElwin Sharvill UNQUALIFIED
Clifford RimArgentinaAmy Elsner PROPOSAL
Leja CaldareraIndiaAnna Fali PROPOSAL
Leja CaldareraItalyBernardo Dominic RENEWAL
Chavez BriddickArgentinaElwin Sharvill NEW
Emily WhobreyGermanyAmy Elsner PROPOSAL
Munro FerenczSpainXuxue Feng RENEWAL
Deepesh ChuiGermanyIoni Bowcher 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>