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
Jones VocelkaAustraliaBernardo Dominic PROPOSAL
Greenwood BologniaRussiaStephen Shaw NEGOTIATION
Salvatore StockhamJapanStephen Shaw RENEWAL
James ButtUnited KingdomOnyama Limba NEW
Leon OldroydRussiaXuxue Feng UNQUALIFIED
Alejandro PerinFranceOnyama Limba UNQUALIFIED
Silvio SlusarskiIndiaAmy Elsner NEGOTIATION
Tony FollerFranceXuxue Feng NEGOTIATION
Maria MarrierItalyAnna Fali PROPOSAL
Misaki RoysterSpainElwin Sharvill RENEWAL
Kadeem FlosiAustraliaAmy Elsner UNQUALIFIED
Alejandro PerinFranceAmy Elsner QUALIFIED
Juan WieserGermanyIoni Bowcher QUALIFIED
Darci PoquetteItalyIoni Bowcher NEW
Aruna FigeroaBrazilIoni Bowcher QUALIFIED
Deepesh ChuiJapanAsiya Javayant NEW
Ashley DoeIndiaIoni Bowcher NEW
Murillo MaletIndiaBernardo Dominic NEW
Adams MorascaUnited KingdomElwin Sharvill NEW
Sinclair WaycottCanadaBernardo Dominic PROPOSAL
Munro FerenczGermanyBernardo Dominic PROPOSAL
Isabel BowleySpainElwin Sharvill UNQUALIFIED
Leja CaldareraSpainOnyama Limba PROPOSAL
Jennifer AmigonItalyAnna Fali QUALIFIED
Francesco ShinkoCanadaElwin Sharvill UNQUALIFIED
Misaki RoysterGermanyBernardo Dominic NEGOTIATION
Ivar PaprockiFranceAnna Fali UNQUALIFIED
Kadeem FlosiRussiaAsiya Javayant UNQUALIFIED
Aruna FigeroaAustraliaXuxue Feng NEW
Aruna FigeroaAustraliaIvan Magalhaes NEGOTIATION
Chavez BriddickGermanyAsiya Javayant NEGOTIATION
Morrow RutaGermanyStephen Shaw UNQUALIFIED
Ivar PaprockiBrazilElwin Sharvill NEGOTIATION
Kadeem FlosiBrazilAnna Fali NEGOTIATION
Jeanfrancois VenereFranceOnyama Limba NEW
James ButtCanadaXuxue Feng NEGOTIATION
Jefferson SchemmerGermanyAsiya Javayant RENEWAL
Tony FollerFranceBernardo Dominic PROPOSAL
Kaitlin OstroskyFranceIvan Magalhaes NEW
James ButtItalyBernardo Dominic NEW
Darci PoquetteJapanBernardo Dominic PROPOSAL
Smith GlickCanadaAnna Fali NEW
Rodrigues CampainItalyOnyama Limba RENEWAL
Leja CaldareraJapanStephen Shaw QUALIFIED
Smith GlickBrazilAnna Fali QUALIFIED
Wickens NestleAustraliaBernardo Dominic RENEWAL
Arvin AlbaresRussiaAnna Fali PROPOSAL
Munro FerenczSpainElwin Sharvill RENEWAL
Aruna FigeroaBrazilAmy Elsner UNQUALIFIED
Aditya KuskoSpainIvan Magalhaes NEW
Horizontal
NameCountryRepresentativeStatus
Leja CaldareraRussiaIvan Magalhaes PROPOSAL
Adams MorascaUnited KingdomElwin Sharvill PROPOSAL
Ivar PaprockiBrazilStephen Shaw QUALIFIED
Faith GillianGermanyIoni Bowcher NEW
Izzy GarufiFranceAnna Fali RENEWAL
Deepesh ChuiItalyAmy Elsner PROPOSAL
Stacey MacleadJapanAmy Elsner PROPOSAL
Chavez BriddickRussiaXuxue Feng QUALIFIED
Mujtaba NickaJapanStephen Shaw NEW
Kadeem FlosiRussiaAnna Fali NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Clifford RimUnited Kingdom2026-05-22King, Christopher A Esq RENEWAL26Elwin Sharvill
1001Jones VocelkaGermany2026-05-20Chapman, Ross E Esq UNQUALIFIED91Stephen Shaw
1002Munro FerenczGermany2026-06-03Feltz Printing Service UNQUALIFIED60Ivan Magalhaes
1003Rodrigues CampainGermany2026-05-12Printing Dimensions NEW17Amy Elsner
1004Jennifer AmigonArgentina2026-05-29Chemel, James L Cpa RENEWAL13Xuxue Feng
1005Aika InouyeArgentina2026-05-13Printing Dimensions NEGOTIATION65Onyama Limba
1006Leja CaldareraUnited Kingdom2026-06-01Truhlar And Truhlar Attys UNQUALIFIED95Elwin Sharvill
1007Adams MorascaFrance2026-05-19King, Christopher A Esq QUALIFIED5Bernardo Dominic
1008Mayumi KolmetzFrance2026-06-05Rousseaux, Michael Esq RENEWAL56Stephen Shaw
1009Kadeem FlosiUnited Kingdom2026-06-08Feltz Printing Service RENEWAL7Elwin Sharvill
1010Deepesh ChuiJapan2026-06-04Buckley Miller Wright NEW14Ioni Bowcher
1011Costa DilliardFrance2026-05-26Chapman, Ross E Esq NEW89Onyama Limba
1012Chavez BriddickJapan2026-05-27Chanay, Jeffrey A Esq QUALIFIED60Stephen Shaw
1013Chavez BriddickIndia2026-05-21Chapman, Ross E Esq UNQUALIFIED89Elwin Sharvill
1014Jeanfrancois VenereBrazil2026-05-28Benton, John B Jr PROPOSAL80Ivan Magalhaes
1015Sinclair WaycottJapan2026-05-31Truhlar And Truhlar Attys NEGOTIATION57Stephen Shaw
1016Silvio SlusarskiJapan2026-05-25Commercial Press PROPOSAL46Asiya Javayant
1017Alejandro PerinRussia2026-05-12Chapman, Ross E Esq UNQUALIFIED95Ivan Magalhaes
1018Juan WieserUnited Kingdom2026-05-13Rangoni Of Florence QUALIFIED92Asiya Javayant
1019Salvatore StockhamAustralia2026-06-02Chapman, Ross E Esq NEW24Xuxue Feng
1020Adams MorascaAustralia2026-06-03Chapman, Ross E Esq QUALIFIED94Amy Elsner
1021Ricardo GauchoUnited Kingdom2026-05-25Chemel, James L Cpa UNQUALIFIED71Asiya Javayant
1022Morrow RutaAustralia2026-05-11Chanay, Jeffrey A Esq UNQUALIFIED21Amy Elsner
1023Mujtaba NickaBrazil2026-06-02King, Christopher A Esq QUALIFIED56Amy Elsner
1024Jeanfrancois VenereUnited Kingdom2026-05-17Benton, John B Jr UNQUALIFIED17Anna Fali
1025Maria MarrierSpain2026-05-16Chemel, James L Cpa QUALIFIED59Amy Elsner
1026Alejandro PerinAustralia2026-05-15Morlong Associates RENEWAL7Stephen Shaw
1027Antonio CaudyIndia2026-05-13Feltz Printing Service NEW93Bernardo Dominic
1028Alejandro PerinFrance2026-06-09Feiner Bros NEW31Asiya Javayant
1029Chavez BriddickArgentina2026-05-19Benton, John B Jr QUALIFIED73Onyama Limba
1030Kadeem FlosiFrance2026-06-08Printing Dimensions PROPOSAL40Asiya Javayant
1031Leja CaldareraUnited Kingdom2026-06-09Printing Dimensions UNQUALIFIED90Stephen Shaw
1032Alejandro PerinArgentina2026-05-16Benton, John B Jr PROPOSAL83Ivan Magalhaes
1033Chavez BriddickRussia2026-05-28Chapman, Ross E Esq PROPOSAL7Ivan Magalhaes
1034Kadeem FlosiBrazil2026-05-20Feiner Bros NEGOTIATION15Bernardo Dominic
1035Antonio CaudyBrazil2026-05-22Commercial Press QUALIFIED29Amy Elsner
1036Aika InouyeItaly2026-06-05Dorl, James J Esq PROPOSAL63Bernardo Dominic
1037Adams MorascaJapan2026-05-19Truhlar And Truhlar Attys NEGOTIATION37Ivan Magalhaes
1038Chavez BriddickJapan2026-06-08Printing Dimensions QUALIFIED19Amy Elsner
1039Kaitlin OstroskyCanada2026-06-06Dorl, James J Esq QUALIFIED88Stephen Shaw
1040James ButtIndia2026-05-11King, Christopher A Esq QUALIFIED71Elwin Sharvill
1041Antonio CaudyArgentina2026-05-30Commercial Press RENEWAL21Ivan Magalhaes
1042Misaki RoysterCanada2026-05-24Commercial Press UNQUALIFIED1Ivan Magalhaes
1043Cody SaylorsBrazil2026-06-07Truhlar And Truhlar Attys NEW22Elwin Sharvill
1044Ashley DoeItaly2026-05-17Dorl, James J Esq PROPOSAL64Onyama Limba
1045Izzy GarufiAustralia2026-05-16Truhlar And Truhlar Attys UNQUALIFIED86Elwin Sharvill
1046Greenwood BologniaFrance2026-05-20Dorl, James J Esq NEW15Anna Fali
1047Costa DilliardAustralia2026-06-04Chapman, Ross E Esq NEW52Stephen Shaw
1048Cody SaylorsSpain2026-05-30Benton, John B Jr NEW62Xuxue Feng
1049Jeanfrancois VenereFrance2026-06-06Printing Dimensions PROPOSAL32Xuxue Feng
Frozen Rows
NameCountryRepresentativeStatus
Kadeem FlosiRussiaBernardo Dominic QUALIFIED
Smith GlickSpainAsiya Javayant PROPOSAL
Costa DilliardBrazilStephen Shaw RENEWAL
Claire TollnerItalyElwin Sharvill UNQUALIFIED
Mayumi KolmetzSpainAnna Fali UNQUALIFIED
Aruna FigeroaSpainXuxue Feng QUALIFIED
Mayumi KolmetzRussiaAsiya Javayant NEW
Murillo MaletIndiaOnyama Limba QUALIFIED
Mujtaba NickaArgentinaAsiya Javayant NEW
Kadeem FlosiCanadaOnyama Limba RENEWAL
Aruna FigeroaJapanIoni Bowcher PROPOSAL
Clifford RimRussiaStephen Shaw RENEWAL
Johnson SergiItalyAnna Fali QUALIFIED
Alejandro PerinGermanyIvan Magalhaes NEGOTIATION
Clifford RimSpainXuxue Feng UNQUALIFIED
Stacey MacleadAustraliaIoni Bowcher RENEWAL
Jeanfrancois VenereUnited KingdomOnyama Limba NEGOTIATION
Morrow RutaUnited KingdomAnna Fali QUALIFIED
Juan WieserGermanyOnyama Limba NEW
Francesco ShinkoItalyAnna Fali RENEWAL
Mayumi KolmetzIndiaElwin Sharvill NEGOTIATION
Octavia MaletRussiaAsiya Javayant QUALIFIED
Deepesh ChuiRussiaIvan Magalhaes QUALIFIED
Aika InouyeItalyIoni Bowcher UNQUALIFIED
Ivar PaprockiAustraliaXuxue Feng PROPOSAL
Stacey MacleadBrazilXuxue Feng UNQUALIFIED
Jeanfrancois VenereIndiaOnyama Limba RENEWAL
Jennifer AmigonAustraliaOnyama Limba PROPOSAL
Stacey MacleadAustraliaAmy Elsner NEW
Smith GlickUnited KingdomXuxue Feng PROPOSAL
Leja CaldareraRussiaIoni Bowcher NEW
Adams MorascaIndiaOnyama Limba UNQUALIFIED
Chavez BriddickCanadaAnna Fali RENEWAL
Jones VocelkaItalyIoni Bowcher PROPOSAL
Kaitlin OstroskyArgentinaBernardo Dominic PROPOSAL
Morrow RutaBrazilIvan Magalhaes NEGOTIATION
Mayumi KolmetzGermanyStephen Shaw NEW
Leon OldroydGermanyBernardo Dominic UNQUALIFIED
Aika InouyeBrazilIvan Magalhaes QUALIFIED
Munro FerenczBrazilBernardo Dominic UNQUALIFIED
Chavez BriddickCanadaIoni Bowcher QUALIFIED
Kaitlin OstroskyArgentinaIvan Magalhaes RENEWAL
Leja CaldareraSpainOnyama Limba RENEWAL
Smith GlickCanadaIvan Magalhaes NEGOTIATION
Jefferson SchemmerArgentinaXuxue Feng UNQUALIFIED
Emily WhobreyItalyElwin Sharvill UNQUALIFIED
Kadeem FlosiSpainIoni Bowcher QUALIFIED
Munro FerenczBrazilIvan Magalhaes RENEWAL
Antonio CaudyAustraliaXuxue Feng RENEWAL
Deepesh ChuiAustraliaAmy Elsner QUALIFIED
Frozen Columns
Name
Francesco Shinko
Kadeem Flosi
Claire Tollner
Leja Caldarera
Ashley Doe
Johnson Sergi
Sinclair Waycott
Kaitlin Ostrosky
Morrow Ruta
Greenwood Bolognia
Ricardo Gaucho
Cody Saylors
Francesco Shinko
Darci Poquette
Munro Ferencz
Cody Saylors
Salvatore Stockham
Ashley Doe
Rodrigues Campain
Kaitlin Ostrosky
Silvio Slusarski
James Butt
Kadeem Flosi
Faith Gillian
Silvio Slusarski
Izzy Garufi
Aruna Figeroa
David Darakjy
James Butt
Salvatore Stockham
Leon Oldroyd
Juan Wieser
Octavia Malet
Smith Glick
Ashley Doe
Juan Wieser
Murillo Malet
Jeanfrancois Venere
Arvin Albares
Murillo Malet
Aditya Kusko
Antonio Caudy
Mujtaba Nicka
Silvio Slusarski
Leon Oldroyd
Sinclair Waycott
Faith Gillian
Leja Caldarera
Aruna Figeroa
Maria Marrier
IdCountryDate
1000France2026-05-18
1001Russia2026-06-08
1002France2026-05-31
1003Japan2026-06-03
1004Russia2026-06-07
1005India2026-06-03
1006Canada2026-05-13
1007France2026-05-21
1008Germany2026-05-26
1009United Kingdom2026-05-17
1010Canada2026-06-01
1011Canada2026-05-11
1012India2026-05-14
1013United Kingdom2026-05-17
1014Spain2026-05-21
1015Spain2026-05-21
1016Spain2026-05-31
1017Japan2026-06-04
1018France2026-05-23
1019Germany2026-06-01
1020France2026-06-08
1021Spain2026-05-27
1022United Kingdom2026-05-11
1023Argentina2026-05-18
1024Russia2026-06-04
1025Brazil2026-05-29
1026Japan2026-05-20
1027Australia2026-05-11
1028Australia2026-05-12
1029United Kingdom2026-06-02
1030Argentina2026-05-15
1031Germany2026-06-03
1032Australia2026-05-20
1033Argentina2026-06-09
1034Canada2026-05-28
1035Germany2026-05-20
1036France2026-05-23
1037Argentina2026-05-28
1038Canada2026-05-13
1039Germany2026-06-03
1040Japan2026-05-24
1041India2026-05-13
1042Japan2026-06-01
1043Argentina2026-06-05
1044Canada2026-05-14
1045Argentina2026-05-14
1046Brazil2026-05-11
1047United Kingdom2026-06-09
1048Spain2026-06-06
1049Australia2026-05-19

On-Demand Data

NameIdCountryDate
Francesco Shinko1000Argentina2026-05-13
Octavia Malet1001Canada2026-05-27
Aditya Kusko1002Canada2026-05-30
Ricardo Gaucho1003Italy2026-05-27
Emily Whobrey1004Japan2026-05-26
Sinclair Waycott1005Canada2026-05-26
Darci Poquette1006Spain2026-06-08
Claire Tollner1007Japan2026-05-27
Maisha Rulapaugh1008Russia2026-06-08
Antonio Caudy1009Spain2026-06-07
Sinclair Waycott1010India2026-05-27
Claire Tollner1011Japan2026-06-03
Kaitlin Ostrosky1012India2026-06-07
Adams Morasca1013Australia2026-05-17
Adams Morasca1014Australia2026-05-28
Jennifer Amigon1015Germany2026-05-19
Ricardo Gaucho1016Australia2026-05-12
Morrow Ruta1017Australia2026-05-16
Ashley Doe1018India2026-05-14
Leon Oldroyd1019Canada2026-05-28
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Isabel BowleySpainBernardo Dominic QUALIFIED
Aditya KuskoArgentinaAmy Elsner QUALIFIED
Misaki RoysterFranceIoni Bowcher PROPOSAL
Silvio SlusarskiAustraliaIvan Magalhaes NEW
Murillo MaletCanadaIvan Magalhaes UNQUALIFIED
Isabel BowleyCanadaAnna Fali RENEWAL
Chavez BriddickCanadaAmy Elsner RENEWAL
Alejandro PerinIndiaIoni Bowcher UNQUALIFIED
Tony FollerAustraliaIoni Bowcher NEW
Ivar PaprockiUnited KingdomIvan Magalhaes RENEWAL
Juan WieserArgentinaXuxue Feng QUALIFIED
Claire TollnerAustraliaIvan Magalhaes PROPOSAL
Leja CaldareraUnited KingdomOnyama Limba NEW
Jeanfrancois VenereArgentinaBernardo Dominic NEW
Cody SaylorsUnited KingdomIoni Bowcher NEGOTIATION
Julie StensethBrazilElwin Sharvill NEW
Octavia MaletRussiaXuxue Feng PROPOSAL
Stacey MacleadAustraliaXuxue Feng UNQUALIFIED
Mujtaba NickaJapanAsiya Javayant PROPOSAL
Ivar PaprockiIndiaIvan Magalhaes NEGOTIATION
Ivar PaprockiIndiaElwin Sharvill NEW
Silvio SlusarskiJapanAmy Elsner RENEWAL
Kaitlin OstroskyItalyElwin Sharvill RENEWAL
Misaki RoysterRussiaXuxue Feng UNQUALIFIED
Wickens NestleBrazilIoni Bowcher PROPOSAL
Leon OldroydSpainIvan Magalhaes UNQUALIFIED
Antonio CaudyRussiaAsiya Javayant PROPOSAL
Aika InouyeCanadaBernardo Dominic PROPOSAL
Rodrigues CampainFranceIoni Bowcher NEGOTIATION
James ButtRussiaStephen Shaw NEGOTIATION
Ashley DoeJapanOnyama Limba RENEWAL
Chavez BriddickItalyIvan Magalhaes PROPOSAL
Mujtaba NickaUnited KingdomOnyama Limba PROPOSAL
Octavia MaletAustraliaIvan Magalhaes NEW
Deepesh ChuiUnited KingdomAmy Elsner NEW
Leon OldroydUnited KingdomStephen Shaw PROPOSAL
Sinclair WaycottRussiaBernardo Dominic RENEWAL
Morrow RutaIndiaAsiya Javayant NEW
Murillo MaletUnited KingdomElwin Sharvill PROPOSAL
Kaitlin OstroskyArgentinaXuxue Feng 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>