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
Faith GillianBrazilElwin Sharvill PROPOSAL
Wickens NestleIndiaAnna Fali NEGOTIATION
Leon OldroydJapanIvan Magalhaes RENEWAL
Jennifer AmigonUnited KingdomElwin Sharvill NEW
Cody SaylorsUnited KingdomXuxue Feng NEW
Mayumi KolmetzIndiaBernardo Dominic UNQUALIFIED
Leja CaldareraCanadaElwin Sharvill PROPOSAL
Mayumi KolmetzAustraliaIoni Bowcher NEGOTIATION
Smith GlickArgentinaXuxue Feng RENEWAL
Salvatore StockhamFranceAnna Fali NEGOTIATION
Sinclair WaycottGermanyAnna Fali NEGOTIATION
Jones VocelkaJapanIoni Bowcher QUALIFIED
Chavez BriddickRussiaStephen Shaw NEGOTIATION
Maisha RulapaughGermanyAsiya Javayant NEGOTIATION
Jennifer AmigonCanadaOnyama Limba RENEWAL
Juan WieserSpainAsiya Javayant QUALIFIED
Tony FollerSpainBernardo Dominic NEGOTIATION
Antonio CaudyUnited KingdomAsiya Javayant RENEWAL
Salvatore StockhamRussiaOnyama Limba UNQUALIFIED
Tony FollerArgentinaStephen Shaw UNQUALIFIED
Wickens NestleBrazilAsiya Javayant UNQUALIFIED
Claire TollnerCanadaAmy Elsner RENEWAL
Maria MarrierAustraliaStephen Shaw RENEWAL
David DarakjyCanadaStephen Shaw RENEWAL
Ivar PaprockiGermanyXuxue Feng RENEWAL
Stacey MacleadGermanyIvan Magalhaes RENEWAL
Ashley DoeRussiaAsiya Javayant QUALIFIED
Izzy GarufiGermanyElwin Sharvill NEGOTIATION
Deepesh ChuiBrazilAmy Elsner NEW
Adams MorascaAustraliaXuxue Feng PROPOSAL
Silvio SlusarskiFranceElwin Sharvill RENEWAL
Antonio CaudyJapanAnna Fali NEW
Jeanfrancois VenereItalyXuxue Feng RENEWAL
Deepesh ChuiBrazilOnyama Limba NEGOTIATION
Aika InouyeJapanIoni Bowcher RENEWAL
Munro FerenczSpainStephen Shaw RENEWAL
Nicolas IturbideItalyIvan Magalhaes NEW
Mujtaba NickaItalyAmy Elsner QUALIFIED
Murillo MaletUnited KingdomAsiya Javayant UNQUALIFIED
Alejandro PerinIndiaIvan Magalhaes NEGOTIATION
Salvatore StockhamJapanBernardo Dominic NEGOTIATION
Maisha RulapaughRussiaElwin Sharvill QUALIFIED
Isabel BowleyAustraliaIoni Bowcher RENEWAL
Smith GlickCanadaBernardo Dominic RENEWAL
Rodrigues CampainCanadaBernardo Dominic NEGOTIATION
Chavez BriddickAustraliaAsiya Javayant RENEWAL
Ivar PaprockiSpainXuxue Feng UNQUALIFIED
Francesco ShinkoCanadaAnna Fali NEGOTIATION
Alejandro PerinArgentinaBernardo Dominic RENEWAL
Clifford RimArgentinaAsiya Javayant UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Mujtaba NickaRussiaBernardo Dominic QUALIFIED
Rodrigues CampainCanadaAsiya Javayant RENEWAL
David DarakjyGermanyXuxue Feng NEGOTIATION
Ivar PaprockiJapanXuxue Feng NEGOTIATION
Aruna FigeroaAustraliaAnna Fali QUALIFIED
Adams MorascaAustraliaAnna Fali NEW
Octavia MaletIndiaXuxue Feng NEW
Sinclair WaycottArgentinaBernardo Dominic PROPOSAL
Aditya KuskoBrazilOnyama Limba PROPOSAL
Octavia MaletCanadaAmy Elsner QUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Jefferson SchemmerAustralia2026-04-22Feiner Bros PROPOSAL35Stephen Shaw
1001Aruna FigeroaBrazil2026-04-15King, Christopher A Esq QUALIFIED26Stephen Shaw
1002Mujtaba NickaFrance2026-04-30Chanay, Jeffrey A Esq QUALIFIED57Amy Elsner
1003Stacey MacleadGermany2026-05-06Feiner Bros PROPOSAL44Ivan Magalhaes
1004Munro FerenczItaly2026-05-07Truhlar And Truhlar Attys NEGOTIATION95Onyama Limba
1005Izzy GarufiArgentina2026-05-01Chanay, Jeffrey A Esq RENEWAL80Asiya Javayant
1006Rodrigues CampainArgentina2026-05-09Buckley Miller Wright QUALIFIED56Xuxue Feng
1007Jones VocelkaAustralia2026-05-10Feiner Bros QUALIFIED48Xuxue Feng
1008Izzy GarufiFrance2026-04-14Chapman, Ross E Esq NEW25Ioni Bowcher
1009Ricardo GauchoRussia2026-05-10Chemel, James L Cpa NEGOTIATION92Amy Elsner
1010Ivar PaprockiRussia2026-05-05Feltz Printing Service NEGOTIATION59Anna Fali
1011Izzy GarufiUnited Kingdom2026-04-20Chapman, Ross E Esq QUALIFIED11Amy Elsner
1012Juan WieserItaly2026-04-29Chemel, James L Cpa NEW58Amy Elsner
1013Francesco ShinkoBrazil2026-04-21Rousseaux, Michael Esq QUALIFIED19Anna Fali
1014Faith GillianUnited Kingdom2026-05-10Buckley Miller Wright NEW33Elwin Sharvill
1015Darci PoquetteJapan2026-04-25Chanay, Jeffrey A Esq RENEWAL81Xuxue Feng
1016Munro FerenczGermany2026-05-03Feiner Bros QUALIFIED51Ioni Bowcher
1017Maria MarrierCanada2026-05-11Chanay, Jeffrey A Esq NEGOTIATION24Bernardo Dominic
1018Leon OldroydFrance2026-04-16Buckley Miller Wright QUALIFIED14Bernardo Dominic
1019Wickens NestleFrance2026-04-28Rangoni Of Florence QUALIFIED80Bernardo Dominic
1020Leja CaldareraUnited Kingdom2026-05-08Chapman, Ross E Esq UNQUALIFIED99Asiya Javayant
1021Johnson SergiFrance2026-05-08Printing Dimensions NEGOTIATION45Asiya Javayant
1022Emily WhobreyIndia2026-05-11Feiner Bros PROPOSAL67Xuxue Feng
1023Francesco ShinkoArgentina2026-04-15Feltz Printing Service UNQUALIFIED37Bernardo Dominic
1024Claire TollnerFrance2026-05-04Benton, John B Jr RENEWAL86Ioni Bowcher
1025Morrow RutaRussia2026-04-25Feltz Printing Service QUALIFIED71Ivan Magalhaes
1026Johnson SergiJapan2026-04-15Rousseaux, Michael Esq QUALIFIED89Onyama Limba
1027Octavia MaletFrance2026-04-24Benton, John B Jr NEW64Bernardo Dominic
1028Greenwood BologniaFrance2026-04-24Morlong Associates NEW39Ivan Magalhaes
1029Aruna FigeroaRussia2026-04-19Printing Dimensions PROPOSAL79Asiya Javayant
1030Chavez BriddickItaly2026-04-22Dorl, James J Esq UNQUALIFIED67Bernardo Dominic
1031Julie StensethIndia2026-04-16Feiner Bros RENEWAL78Asiya Javayant
1032Izzy GarufiIndia2026-04-26Chemel, James L Cpa PROPOSAL12Onyama Limba
1033Francesco ShinkoFrance2026-04-21Commercial Press NEGOTIATION50Elwin Sharvill
1034Claire TollnerJapan2026-04-27Dorl, James J Esq NEGOTIATION43Onyama Limba
1035Aruna FigeroaFrance2026-05-06Truhlar And Truhlar Attys PROPOSAL24Amy Elsner
1036Leja CaldareraIndia2026-04-24Truhlar And Truhlar Attys PROPOSAL92Xuxue Feng
1037Leon OldroydUnited Kingdom2026-05-10Truhlar And Truhlar Attys NEGOTIATION21Asiya Javayant
1038Aruna FigeroaCanada2026-04-26Feiner Bros NEGOTIATION50Bernardo Dominic
1039Greenwood BologniaBrazil2026-04-25Rangoni Of Florence RENEWAL4Bernardo Dominic
1040Julie StensethBrazil2026-04-28Truhlar And Truhlar Attys NEW37Xuxue Feng
1041Cody SaylorsJapan2026-04-29Feiner Bros UNQUALIFIED23Ivan Magalhaes
1042Leja CaldareraFrance2026-04-18King, Christopher A Esq PROPOSAL7Onyama Limba
1043Rodrigues CampainSpain2026-04-19Commercial Press QUALIFIED51Bernardo Dominic
1044Rodrigues CampainUnited Kingdom2026-05-07Chapman, Ross E Esq NEW56Stephen Shaw
1045Ricardo GauchoItaly2026-04-21Dorl, James J Esq PROPOSAL86Anna Fali
1046Aruna FigeroaFrance2026-05-03Buckley Miller Wright NEW44Ivan Magalhaes
1047Leon OldroydFrance2026-04-24Dorl, James J Esq QUALIFIED81Ivan Magalhaes
1048Misaki RoysterAustralia2026-05-01Morlong Associates PROPOSAL48Anna Fali
1049Aruna FigeroaArgentina2026-04-30Chemel, James L Cpa RENEWAL6Anna Fali
Frozen Rows
NameCountryRepresentativeStatus
Mayumi KolmetzCanadaElwin Sharvill NEW
Kadeem FlosiJapanIoni Bowcher RENEWAL
Clifford RimGermanyAsiya Javayant NEGOTIATION
Maisha RulapaughItalyOnyama Limba QUALIFIED
Ricardo GauchoCanadaAmy Elsner RENEWAL
Claire TollnerGermanyElwin Sharvill NEGOTIATION
Claire TollnerSpainElwin Sharvill RENEWAL
Leja CaldareraItalyIvan Magalhaes QUALIFIED
Greenwood BologniaFranceBernardo Dominic NEGOTIATION
James ButtBrazilBernardo Dominic NEW
Jefferson SchemmerIndiaAnna Fali NEGOTIATION
Ashley DoeCanadaAnna Fali UNQUALIFIED
Maisha RulapaughFranceBernardo Dominic NEW
Claire TollnerFranceAmy Elsner UNQUALIFIED
Emily WhobreyUnited KingdomIoni Bowcher NEGOTIATION
Jeanfrancois VenereCanadaAsiya Javayant QUALIFIED
Morrow RutaArgentinaAsiya Javayant PROPOSAL
Kaitlin OstroskyJapanBernardo Dominic UNQUALIFIED
Nicolas IturbideAustraliaXuxue Feng NEGOTIATION
Tony FollerItalyAnna Fali QUALIFIED
Isabel BowleyArgentinaOnyama Limba QUALIFIED
Munro FerenczRussiaAsiya Javayant RENEWAL
Aditya KuskoIndiaAmy Elsner QUALIFIED
Deepesh ChuiCanadaAmy Elsner NEGOTIATION
Kaitlin OstroskyBrazilOnyama Limba NEW
Leja CaldareraArgentinaBernardo Dominic PROPOSAL
Mayumi KolmetzArgentinaXuxue Feng NEGOTIATION
Munro FerenczCanadaAsiya Javayant NEW
Clifford RimArgentinaAmy Elsner NEW
Alejandro PerinSpainAnna Fali QUALIFIED
Francesco ShinkoJapanStephen Shaw PROPOSAL
Faith GillianJapanXuxue Feng NEW
Francesco ShinkoJapanIoni Bowcher PROPOSAL
David DarakjyRussiaOnyama Limba RENEWAL
Murillo MaletArgentinaIvan Magalhaes RENEWAL
Leon OldroydFranceIvan Magalhaes NEGOTIATION
Aditya KuskoUnited KingdomElwin Sharvill UNQUALIFIED
Kaitlin OstroskySpainStephen Shaw PROPOSAL
Claire TollnerRussiaIoni Bowcher RENEWAL
Cody SaylorsUnited KingdomIvan Magalhaes RENEWAL
Francesco ShinkoArgentinaAmy Elsner RENEWAL
Ricardo GauchoItalyIoni Bowcher NEGOTIATION
Leon OldroydItalyXuxue Feng UNQUALIFIED
Emily WhobreyGermanyBernardo Dominic PROPOSAL
David DarakjySpainAnna Fali PROPOSAL
Jennifer AmigonJapanIvan Magalhaes QUALIFIED
Chavez BriddickBrazilAnna Fali RENEWAL
Cody SaylorsGermanyAsiya Javayant PROPOSAL
Ricardo GauchoCanadaOnyama Limba QUALIFIED
Aruna FigeroaSpainOnyama Limba UNQUALIFIED
Frozen Columns
Name
Maria Marrier
Johnson Sergi
Arvin Albares
Maria Marrier
Francesco Shinko
Greenwood Bolognia
Tony Foller
Smith Glick
Leja Caldarera
Ricardo Gaucho
Maria Marrier
Salvatore Stockham
Mujtaba Nicka
Jones Vocelka
Claire Tollner
Ivar Paprocki
Misaki Royster
Munro Ferencz
Stacey Maclead
Morrow Ruta
Aditya Kusko
David Darakjy
Chavez Briddick
Smith Glick
Isabel Bowley
Jefferson Schemmer
Chavez Briddick
David Darakjy
Julie Stenseth
Deepesh Chui
Chavez Briddick
Smith Glick
Aditya Kusko
Leon Oldroyd
Aika Inouye
Greenwood Bolognia
Jefferson Schemmer
Claire Tollner
Clifford Rim
Wickens Nestle
Munro Ferencz
Greenwood Bolognia
Darci Poquette
Silvio Slusarski
Maria Marrier
Tony Foller
Clifford Rim
Ashley Doe
Wickens Nestle
Jennifer Amigon
IdCountryDate
1000India2026-05-09
1001Brazil2026-04-22
1002Brazil2026-04-18
1003Spain2026-05-11
1004India2026-04-14
1005Australia2026-05-02
1006Australia2026-05-02
1007France2026-04-14
1008United Kingdom2026-04-30
1009France2026-04-16
1010Spain2026-04-25
1011Canada2026-05-10
1012Russia2026-04-22
1013France2026-05-01
1014India2026-05-01
1015United Kingdom2026-05-04
1016India2026-05-07
1017India2026-04-29
1018Spain2026-04-23
1019France2026-04-17
1020Russia2026-04-28
1021Japan2026-04-22
1022Italy2026-04-27
1023France2026-04-23
1024Japan2026-04-14
1025France2026-05-10
1026Italy2026-04-13
1027Spain2026-04-18
1028Argentina2026-04-22
1029France2026-04-16
1030Russia2026-05-06
1031United Kingdom2026-05-07
1032Brazil2026-04-30
1033Australia2026-04-26
1034Argentina2026-04-28
1035Australia2026-04-15
1036Japan2026-05-12
1037India2026-04-24
1038Russia2026-05-01
1039Australia2026-05-10
1040Brazil2026-05-11
1041Russia2026-04-17
1042Argentina2026-04-15
1043Italy2026-05-10
1044Canada2026-05-09
1045Australia2026-04-30
1046Germany2026-05-01
1047India2026-05-10
1048Japan2026-04-19
1049Japan2026-05-12

On-Demand Data

NameIdCountryDate
David Darakjy1000France2026-05-11
Francesco Shinko1001Germany2026-04-13
Munro Ferencz1002Australia2026-04-28
Jefferson Schemmer1003Italy2026-04-22
Costa Dilliard1004Russia2026-04-27
Jennifer Amigon1005Germany2026-05-12
Emily Whobrey1006Russia2026-04-23
Maisha Rulapaugh1007Canada2026-05-11
Tony Foller1008Germany2026-04-19
Leja Caldarera1009Australia2026-05-02
Aruna Figeroa1010Argentina2026-05-08
Kadeem Flosi1011Canada2026-04-15
Rodrigues Campain1012Spain2026-04-14
Munro Ferencz1013India2026-04-26
Mujtaba Nicka1014Canada2026-04-24
Johnson Sergi1015Brazil2026-05-09
Rodrigues Campain1016India2026-05-06
Izzy Garufi1017Canada2026-05-12
Wickens Nestle1018United Kingdom2026-05-01
Ivar Paprocki1019Brazil2026-05-06
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Nicolas IturbideIndiaXuxue Feng PROPOSAL
Cody SaylorsFranceIoni Bowcher NEW
Mayumi KolmetzCanadaElwin Sharvill NEW
Stacey MacleadIndiaXuxue Feng UNQUALIFIED
Stacey MacleadAustraliaBernardo Dominic RENEWAL
Chavez BriddickJapanBernardo Dominic NEW
Arvin AlbaresGermanyXuxue Feng NEW
Izzy GarufiGermanyAnna Fali PROPOSAL
Julie StensethSpainIvan Magalhaes RENEWAL
Darci PoquetteGermanyIoni Bowcher NEGOTIATION
Smith GlickGermanyBernardo Dominic PROPOSAL
Salvatore StockhamRussiaAsiya Javayant NEGOTIATION
Costa DilliardCanadaIoni Bowcher NEW
Murillo MaletBrazilBernardo Dominic RENEWAL
Silvio SlusarskiItalyOnyama Limba QUALIFIED
Misaki RoysterArgentinaIvan Magalhaes NEW
Juan WieserJapanAmy Elsner RENEWAL
Clifford RimGermanyXuxue Feng NEW
Tony FollerGermanyXuxue Feng NEW
Wickens NestleGermanyElwin Sharvill NEGOTIATION
Aika InouyeFranceOnyama Limba NEGOTIATION
James ButtItalyAmy Elsner QUALIFIED
Isabel BowleyArgentinaIoni Bowcher QUALIFIED
Antonio CaudyFranceOnyama Limba PROPOSAL
Leon OldroydAustraliaOnyama Limba QUALIFIED
Clifford RimFranceIvan Magalhaes QUALIFIED
Ivar PaprockiRussiaXuxue Feng UNQUALIFIED
Jefferson SchemmerFranceIvan Magalhaes UNQUALIFIED
Emily WhobreyJapanIvan Magalhaes NEGOTIATION
Francesco ShinkoUnited KingdomXuxue Feng QUALIFIED
Misaki RoysterAustraliaAmy Elsner QUALIFIED
Juan WieserSpainAmy Elsner QUALIFIED
David DarakjyFranceOnyama Limba NEW
Arvin AlbaresJapanIoni Bowcher RENEWAL
Leon OldroydSpainAsiya Javayant QUALIFIED
Aruna FigeroaGermanyOnyama Limba NEW
Rodrigues CampainUnited KingdomElwin Sharvill QUALIFIED
Francesco ShinkoBrazilBernardo Dominic QUALIFIED
Emily WhobreyFranceAsiya Javayant QUALIFIED
Alejandro PerinBrazilXuxue Feng 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>