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
Misaki RoysterGermanyIoni Bowcher UNQUALIFIED
Maria MarrierFranceAsiya Javayant NEGOTIATION
Aika InouyeArgentinaOnyama Limba RENEWAL
Mayumi KolmetzUnited KingdomXuxue Feng PROPOSAL
Izzy GarufiBrazilStephen Shaw RENEWAL
Clifford RimItalyIoni Bowcher UNQUALIFIED
Maisha RulapaughAustraliaIoni Bowcher NEGOTIATION
Jeanfrancois VenereRussiaElwin Sharvill UNQUALIFIED
Francesco ShinkoFranceIoni Bowcher RENEWAL
Ivar PaprockiFranceAnna Fali RENEWAL
Wickens NestleArgentinaBernardo Dominic RENEWAL
Mujtaba NickaIndiaBernardo Dominic NEW
Kadeem FlosiCanadaIvan Magalhaes NEW
Rodrigues CampainJapanBernardo Dominic NEGOTIATION
Kaitlin OstroskyItalyBernardo Dominic PROPOSAL
Maria MarrierCanadaStephen Shaw QUALIFIED
Rodrigues CampainIndiaAmy Elsner QUALIFIED
Munro FerenczSpainElwin Sharvill QUALIFIED
James ButtIndiaIoni Bowcher NEW
Maisha RulapaughCanadaIvan Magalhaes QUALIFIED
Clifford RimAustraliaStephen Shaw PROPOSAL
Smith GlickGermanyAmy Elsner NEGOTIATION
Mujtaba NickaRussiaIvan Magalhaes NEGOTIATION
Mujtaba NickaJapanOnyama Limba NEGOTIATION
Costa DilliardBrazilAnna Fali RENEWAL
Tony FollerArgentinaElwin Sharvill QUALIFIED
Misaki RoysterBrazilXuxue Feng NEGOTIATION
Ashley DoeFranceOnyama Limba UNQUALIFIED
Ricardo GauchoJapanAmy Elsner QUALIFIED
Octavia MaletCanadaXuxue Feng RENEWAL
Emily WhobreyGermanyXuxue Feng NEW
Clifford RimGermanyElwin Sharvill QUALIFIED
Izzy GarufiAustraliaOnyama Limba RENEWAL
Julie StensethRussiaAnna Fali UNQUALIFIED
Julie StensethIndiaAsiya Javayant NEW
Maria MarrierJapanStephen Shaw PROPOSAL
Jones VocelkaAustraliaBernardo Dominic QUALIFIED
Maisha RulapaughJapanXuxue Feng UNQUALIFIED
Arvin AlbaresGermanyOnyama Limba PROPOSAL
Juan WieserIndiaOnyama Limba QUALIFIED
Leon OldroydBrazilOnyama Limba NEW
Jefferson SchemmerJapanAmy Elsner UNQUALIFIED
Murillo MaletJapanOnyama Limba NEGOTIATION
Ricardo GauchoArgentinaOnyama Limba QUALIFIED
Francesco ShinkoItalyOnyama Limba PROPOSAL
Tony FollerSpainElwin Sharvill RENEWAL
Kaitlin OstroskyBrazilStephen Shaw PROPOSAL
James ButtGermanyBernardo Dominic NEGOTIATION
Alejandro PerinIndiaXuxue Feng NEGOTIATION
Juan WieserAustraliaBernardo Dominic NEGOTIATION
Horizontal
NameCountryRepresentativeStatus
Faith GillianIndiaIvan Magalhaes RENEWAL
Deepesh ChuiUnited KingdomElwin Sharvill QUALIFIED
Sinclair WaycottCanadaIvan Magalhaes NEGOTIATION
Leon OldroydUnited KingdomAmy Elsner NEGOTIATION
Jefferson SchemmerGermanyOnyama Limba QUALIFIED
Ricardo GauchoUnited KingdomOnyama Limba QUALIFIED
Kaitlin OstroskyUnited KingdomElwin Sharvill NEGOTIATION
Clifford RimIndiaAsiya Javayant NEGOTIATION
Francesco ShinkoCanadaAnna Fali RENEWAL
Darci PoquetteJapanBernardo Dominic NEW
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Costa DilliardCanada2025-08-10Dorl, James J Esq PROPOSAL1Ioni Bowcher
1001David DarakjySpain2025-08-03Benton, John B Jr UNQUALIFIED92Asiya Javayant
1002Sinclair WaycottAustralia2025-08-04Buckley Miller Wright NEW98Ivan Magalhaes
1003Juan WieserBrazil2025-08-04Truhlar And Truhlar Attys UNQUALIFIED90Amy Elsner
1004Aika InouyeSpain2025-08-01Dorl, James J Esq QUALIFIED36Ivan Magalhaes
1005Smith GlickIndia2025-08-13Feiner Bros NEW77Amy Elsner
1006Faith GillianArgentina2025-08-04Rousseaux, Michael Esq NEGOTIATION44Anna Fali
1007Jones VocelkaCanada2025-08-03Chanay, Jeffrey A Esq PROPOSAL14Onyama Limba
1008Munro FerenczRussia2025-08-11Dorl, James J Esq UNQUALIFIED34Stephen Shaw
1009Kadeem FlosiJapan2025-08-17Morlong Associates NEGOTIATION36Amy Elsner
1010Costa DilliardJapan2025-07-23Feiner Bros NEW31Elwin Sharvill
1011Cody SaylorsFrance2025-08-04Morlong Associates NEGOTIATION43Amy Elsner
1012Octavia MaletGermany2025-08-16Feltz Printing Service PROPOSAL74Anna Fali
1013Jones VocelkaIndia2025-07-30Chapman, Ross E Esq PROPOSAL45Onyama Limba
1014Tony FollerAustralia2025-07-29King, Christopher A Esq NEGOTIATION63Elwin Sharvill
1015Morrow RutaUnited Kingdom2025-08-03Feltz Printing Service RENEWAL76Onyama Limba
1016Ivar PaprockiIndia2025-08-15Morlong Associates NEGOTIATION59Amy Elsner
1017Claire TollnerAustralia2025-08-17King, Christopher A Esq PROPOSAL8Onyama Limba
1018Octavia MaletBrazil2025-08-16Commercial Press PROPOSAL32Anna Fali
1019Murillo MaletSpain2025-07-27Printing Dimensions RENEWAL55Onyama Limba
1020Isabel BowleyItaly2025-07-28King, Christopher A Esq UNQUALIFIED34Onyama Limba
1021Claire TollnerFrance2025-08-09Buckley Miller Wright RENEWAL56Anna Fali
1022Salvatore StockhamCanada2025-08-14Rousseaux, Michael Esq UNQUALIFIED40Stephen Shaw
1023Claire TollnerArgentina2025-08-02Chapman, Ross E Esq NEGOTIATION60Xuxue Feng
1024Jones VocelkaGermany2025-08-09Dorl, James J Esq RENEWAL82Xuxue Feng
1025Johnson SergiGermany2025-08-05Chapman, Ross E Esq QUALIFIED52Amy Elsner
1026Greenwood BologniaBrazil2025-07-23Benton, John B Jr PROPOSAL47Stephen Shaw
1027Jefferson SchemmerJapan2025-08-10Truhlar And Truhlar Attys UNQUALIFIED35Ioni Bowcher
1028Ivar PaprockiArgentina2025-07-27Buckley Miller Wright NEW36Amy Elsner
1029Smith GlickFrance2025-08-17Truhlar And Truhlar Attys NEGOTIATION18Anna Fali
1030Jefferson SchemmerIndia2025-08-15Feltz Printing Service UNQUALIFIED41Ioni Bowcher
1031Silvio SlusarskiCanada2025-07-29Chemel, James L Cpa RENEWAL3Onyama Limba
1032Maria MarrierGermany2025-07-30Dorl, James J Esq NEGOTIATION99Ivan Magalhaes
1033Tony FollerFrance2025-07-30Benton, John B Jr NEW92Bernardo Dominic
1034Leon OldroydItaly2025-07-24Morlong Associates NEGOTIATION12Anna Fali
1035Aditya KuskoUnited Kingdom2025-07-28Benton, John B Jr PROPOSAL13Bernardo Dominic
1036Ricardo GauchoGermany2025-07-25Rousseaux, Michael Esq RENEWAL13Elwin Sharvill
1037Sinclair WaycottAustralia2025-08-04Commercial Press UNQUALIFIED13Onyama Limba
1038Kaitlin OstroskyArgentina2025-08-01Feltz Printing Service QUALIFIED40Elwin Sharvill
1039Mujtaba NickaAustralia2025-08-10Rousseaux, Michael Esq NEGOTIATION87Bernardo Dominic
1040Mujtaba NickaJapan2025-07-20Chapman, Ross E Esq NEGOTIATION31Amy Elsner
1041Ricardo GauchoItaly2025-08-08Chemel, James L Cpa QUALIFIED74Xuxue Feng
1042Misaki RoysterFrance2025-07-26King, Christopher A Esq PROPOSAL62Amy Elsner
1043Silvio SlusarskiAustralia2025-07-20Benton, John B Jr PROPOSAL82Elwin Sharvill
1044Ricardo GauchoUnited Kingdom2025-08-05Feltz Printing Service PROPOSAL72Xuxue Feng
1045Sinclair WaycottBrazil2025-08-06Dorl, James J Esq PROPOSAL81Anna Fali
1046Maisha RulapaughArgentina2025-08-12Buckley Miller Wright UNQUALIFIED83Elwin Sharvill
1047Darci PoquetteIndia2025-07-26Morlong Associates NEW13Asiya Javayant
1048Francesco ShinkoJapan2025-08-09Buckley Miller Wright RENEWAL57Anna Fali
1049Arvin AlbaresAustralia2025-07-26Chemel, James L Cpa NEW35Stephen Shaw
Frozen Rows
NameCountryRepresentativeStatus
Rodrigues CampainAustraliaIvan Magalhaes QUALIFIED
Antonio CaudyItalyOnyama Limba UNQUALIFIED
Jennifer AmigonCanadaXuxue Feng PROPOSAL
Misaki RoysterSpainElwin Sharvill NEW
Arvin AlbaresSpainAnna Fali UNQUALIFIED
Francesco ShinkoItalyAsiya Javayant UNQUALIFIED
Aditya KuskoUnited KingdomIoni Bowcher RENEWAL
Rodrigues CampainArgentinaIoni Bowcher QUALIFIED
Francesco ShinkoJapanIoni Bowcher PROPOSAL
Johnson SergiAustraliaIoni Bowcher NEW
Silvio SlusarskiCanadaAsiya Javayant NEGOTIATION
Mujtaba NickaArgentinaBernardo Dominic NEW
Izzy GarufiAustraliaOnyama Limba QUALIFIED
Aruna FigeroaBrazilIoni Bowcher NEGOTIATION
Mayumi KolmetzIndiaAmy Elsner RENEWAL
Murillo MaletJapanAmy Elsner QUALIFIED
Murillo MaletAustraliaAsiya Javayant NEGOTIATION
Munro FerenczSpainBernardo Dominic NEGOTIATION
Maisha RulapaughRussiaIvan Magalhaes UNQUALIFIED
Jefferson SchemmerGermanyOnyama Limba QUALIFIED
Sinclair WaycottGermanyXuxue Feng RENEWAL
Ivar PaprockiIndiaOnyama Limba PROPOSAL
Octavia MaletCanadaIvan Magalhaes UNQUALIFIED
Leja CaldareraBrazilIvan Magalhaes QUALIFIED
Kadeem FlosiUnited KingdomAsiya Javayant NEGOTIATION
Adams MorascaAustraliaXuxue Feng UNQUALIFIED
Tony FollerJapanElwin Sharvill PROPOSAL
Ivar PaprockiFranceIoni Bowcher RENEWAL
Mujtaba NickaIndiaBernardo Dominic NEGOTIATION
Jefferson SchemmerAustraliaBernardo Dominic NEW
Salvatore StockhamJapanAmy Elsner NEW
Tony FollerBrazilXuxue Feng RENEWAL
Clifford RimSpainElwin Sharvill UNQUALIFIED
Darci PoquetteAustraliaStephen Shaw QUALIFIED
Munro FerenczRussiaIoni Bowcher UNQUALIFIED
Tony FollerArgentinaIvan Magalhaes PROPOSAL
Maisha RulapaughAustraliaIoni Bowcher UNQUALIFIED
Francesco ShinkoSpainAnna Fali UNQUALIFIED
Munro FerenczSpainStephen Shaw QUALIFIED
Maisha RulapaughArgentinaOnyama Limba NEGOTIATION
Ashley DoeRussiaXuxue Feng QUALIFIED
Aika InouyeCanadaStephen Shaw NEW
Rodrigues CampainFranceStephen Shaw PROPOSAL
Juan WieserFranceAnna Fali PROPOSAL
Ivar PaprockiBrazilBernardo Dominic PROPOSAL
Morrow RutaAustraliaBernardo Dominic RENEWAL
Salvatore StockhamUnited KingdomBernardo Dominic UNQUALIFIED
Izzy GarufiIndiaBernardo Dominic NEGOTIATION
Leon OldroydArgentinaAmy Elsner UNQUALIFIED
Sinclair WaycottArgentinaXuxue Feng QUALIFIED
Frozen Columns
Name
Costa Dilliard
Wickens Nestle
Cody Saylors
Jefferson Schemmer
Francesco Shinko
Johnson Sergi
Jeanfrancois Venere
Smith Glick
Munro Ferencz
Murillo Malet
Leon Oldroyd
Aditya Kusko
Rodrigues Campain
Morrow Ruta
Maria Marrier
Kadeem Flosi
Jefferson Schemmer
James Butt
Tony Foller
Leja Caldarera
Jefferson Schemmer
Aditya Kusko
Jones Vocelka
Emily Whobrey
Misaki Royster
Smith Glick
Octavia Malet
Aika Inouye
Chavez Briddick
Wickens Nestle
Clifford Rim
Isabel Bowley
Wickens Nestle
Antonio Caudy
Julie Stenseth
Nicolas Iturbide
Ashley Doe
Alejandro Perin
Jones Vocelka
Izzy Garufi
Cody Saylors
Juan Wieser
Chavez Briddick
James Butt
Salvatore Stockham
Murillo Malet
Johnson Sergi
Julie Stenseth
Munro Ferencz
Leja Caldarera
IdCountryDate
1000Germany2025-08-05
1001Italy2025-08-03
1002Australia2025-08-03
1003Australia2025-08-17
1004Australia2025-08-10
1005Brazil2025-08-17
1006Germany2025-08-18
1007Russia2025-08-10
1008Spain2025-07-22
1009Italy2025-08-12
1010United Kingdom2025-07-27
1011France2025-08-09
1012Italy2025-08-18
1013France2025-07-25
1014Russia2025-08-16
1015United Kingdom2025-07-25
1016Argentina2025-08-14
1017Argentina2025-08-02
1018Brazil2025-08-12
1019United Kingdom2025-07-23
1020United Kingdom2025-07-27
1021Spain2025-08-03
1022Spain2025-08-03
1023India2025-07-23
1024Spain2025-08-12
1025Argentina2025-08-04
1026Australia2025-08-17
1027Japan2025-08-13
1028Spain2025-08-06
1029Brazil2025-07-20
1030India2025-08-12
1031France2025-08-04
1032Argentina2025-07-31
1033Canada2025-07-27
1034Japan2025-08-18
1035Australia2025-08-10
1036Brazil2025-08-12
1037Argentina2025-07-28
1038Canada2025-08-11
1039India2025-07-21
1040Argentina2025-07-28
1041Australia2025-08-09
1042Argentina2025-08-09
1043Argentina2025-07-22
1044Australia2025-07-27
1045Russia2025-08-17
1046Australia2025-08-02
1047Russia2025-08-06
1048France2025-08-11
1049Canada2025-07-26

On-Demand Data

NameIdCountryDate
Emily Whobrey1000France2025-08-14
Jennifer Amigon1001Japan2025-08-07
Salvatore Stockham1002United Kingdom2025-07-27
Julie Stenseth1003Japan2025-08-06
Jefferson Schemmer1004Germany2025-08-18
Ivar Paprocki1005Russia2025-07-24
Francesco Shinko1006France2025-08-14
Nicolas Iturbide1007Germany2025-08-09
Ricardo Gaucho1008Australia2025-08-17
James Butt1009France2025-07-26
Cody Saylors1010India2025-08-02
David Darakjy1011Germany2025-08-08
Kaitlin Ostrosky1012Japan2025-08-16
Aruna Figeroa1013Russia2025-07-25
Johnson Sergi1014Russia2025-08-07
Maisha Rulapaugh1015Spain2025-08-17
Isabel Bowley1016Germany2025-08-12
Aruna Figeroa1017Spain2025-07-24
Costa Dilliard1018Germany2025-08-10
Nicolas Iturbide1019Germany2025-07-30
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Jennifer AmigonGermanyXuxue Feng QUALIFIED
Ivar PaprockiBrazilXuxue Feng NEGOTIATION
Isabel BowleyArgentinaBernardo Dominic NEW
Maisha RulapaughSpainIvan Magalhaes UNQUALIFIED
Sinclair WaycottAustraliaAnna Fali UNQUALIFIED
Jefferson SchemmerBrazilAmy Elsner UNQUALIFIED
Antonio CaudyFranceBernardo Dominic RENEWAL
Adams MorascaFranceStephen Shaw QUALIFIED
Wickens NestleSpainAsiya Javayant NEW
Arvin AlbaresBrazilIvan Magalhaes PROPOSAL
Aditya KuskoSpainAnna Fali UNQUALIFIED
Clifford RimGermanyIvan Magalhaes NEW
Morrow RutaItalyStephen Shaw NEW
Kaitlin OstroskyJapanXuxue Feng PROPOSAL
Sinclair WaycottIndiaAnna Fali NEW
Mujtaba NickaRussiaAsiya Javayant NEGOTIATION
Alejandro PerinFranceXuxue Feng RENEWAL
Claire TollnerRussiaIvan Magalhaes QUALIFIED
Morrow RutaFranceXuxue Feng PROPOSAL
Morrow RutaAustraliaIoni Bowcher PROPOSAL
Juan WieserGermanyIvan Magalhaes PROPOSAL
Jennifer AmigonBrazilIvan Magalhaes QUALIFIED
Wickens NestleGermanyAmy Elsner QUALIFIED
Aditya KuskoRussiaIvan Magalhaes QUALIFIED
Aika InouyeJapanIoni Bowcher QUALIFIED
James ButtIndiaStephen Shaw NEGOTIATION
Cody SaylorsIndiaAsiya Javayant UNQUALIFIED
Deepesh ChuiFranceIvan Magalhaes NEGOTIATION
Darci PoquetteArgentinaIvan Magalhaes RENEWAL
Kadeem FlosiGermanyIvan Magalhaes UNQUALIFIED
Silvio SlusarskiAustraliaStephen Shaw RENEWAL
Leon OldroydSpainIoni Bowcher NEGOTIATION
Francesco ShinkoItalyElwin Sharvill RENEWAL
Claire TollnerUnited KingdomBernardo Dominic RENEWAL
Isabel BowleyCanadaAsiya Javayant NEW
Murillo MaletUnited KingdomAmy Elsner QUALIFIED
Kaitlin OstroskyItalyAmy Elsner NEW
Kadeem FlosiAustraliaAnna Fali QUALIFIED
Silvio SlusarskiItalyStephen Shaw QUALIFIED
Izzy GarufiJapanAmy Elsner 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>