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
Murillo MaletItalyAsiya Javayant UNQUALIFIED
Alejandro PerinJapanIoni Bowcher NEGOTIATION
Izzy GarufiGermanyAmy Elsner PROPOSAL
Claire TollnerArgentinaAsiya Javayant UNQUALIFIED
Jones VocelkaItalyElwin Sharvill UNQUALIFIED
Izzy GarufiIndiaAsiya Javayant UNQUALIFIED
Octavia MaletItalyIoni Bowcher PROPOSAL
Juan WieserBrazilIvan Magalhaes NEW
Juan WieserItalyXuxue Feng RENEWAL
Jones VocelkaCanadaXuxue Feng RENEWAL
Morrow RutaArgentinaStephen Shaw NEGOTIATION
Antonio CaudyJapanAnna Fali UNQUALIFIED
Maria MarrierJapanAsiya Javayant UNQUALIFIED
Aruna FigeroaFranceStephen Shaw RENEWAL
Jennifer AmigonBrazilIvan Magalhaes QUALIFIED
Deepesh ChuiUnited KingdomOnyama Limba NEGOTIATION
Rodrigues CampainBrazilXuxue Feng RENEWAL
Smith GlickCanadaOnyama Limba RENEWAL
James ButtRussiaAmy Elsner NEGOTIATION
Mujtaba NickaRussiaElwin Sharvill NEGOTIATION
Chavez BriddickBrazilAsiya Javayant PROPOSAL
Smith GlickRussiaXuxue Feng RENEWAL
Munro FerenczItalyAnna Fali QUALIFIED
Maria MarrierArgentinaAnna Fali UNQUALIFIED
Nicolas IturbideGermanyIvan Magalhaes PROPOSAL
Antonio CaudyAustraliaXuxue Feng NEW
Murillo MaletIndiaAnna Fali NEW
Johnson SergiRussiaAsiya Javayant NEW
Misaki RoysterRussiaIvan Magalhaes RENEWAL
Sinclair WaycottArgentinaBernardo Dominic NEW
Adams MorascaUnited KingdomIvan Magalhaes NEW
Ashley DoeAustraliaIvan Magalhaes NEW
Leja CaldareraItalyIvan Magalhaes PROPOSAL
Emily WhobreyItalyElwin Sharvill PROPOSAL
Jeanfrancois VenereArgentinaAmy Elsner RENEWAL
Deepesh ChuiCanadaOnyama Limba PROPOSAL
Clifford RimAustraliaIoni Bowcher UNQUALIFIED
Arvin AlbaresAustraliaIoni Bowcher QUALIFIED
Aditya KuskoItalyAmy Elsner UNQUALIFIED
Mujtaba NickaSpainBernardo Dominic QUALIFIED
Jeanfrancois VenereGermanyIvan Magalhaes NEW
Kadeem FlosiRussiaXuxue Feng RENEWAL
Ricardo GauchoGermanyAsiya Javayant PROPOSAL
Smith GlickUnited KingdomIoni Bowcher NEGOTIATION
Francesco ShinkoUnited KingdomElwin Sharvill PROPOSAL
David DarakjyUnited KingdomStephen Shaw NEGOTIATION
Murillo MaletJapanAmy Elsner QUALIFIED
Cody SaylorsCanadaXuxue Feng NEGOTIATION
Adams MorascaIndiaElwin Sharvill NEW
Ashley DoeGermanyIvan Magalhaes NEW
Horizontal
NameCountryRepresentativeStatus
Kaitlin OstroskyUnited KingdomXuxue Feng NEW
Faith GillianGermanyOnyama Limba RENEWAL
Francesco ShinkoArgentinaAnna Fali NEGOTIATION
Kadeem FlosiIndiaOnyama Limba NEGOTIATION
Johnson SergiUnited KingdomStephen Shaw RENEWAL
James ButtIndiaAmy Elsner UNQUALIFIED
Costa DilliardBrazilStephen Shaw RENEWAL
Morrow RutaItalyAsiya Javayant QUALIFIED
Johnson SergiGermanyAsiya Javayant RENEWAL
Francesco ShinkoJapanOnyama Limba UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Clifford RimItaly2026-04-03Rangoni Of Florence PROPOSAL42Amy Elsner
1001Aika InouyeBrazil2026-04-03Morlong Associates NEW63Asiya Javayant
1002Jefferson SchemmerGermany2026-04-21Buckley Miller Wright RENEWAL66Xuxue Feng
1003Greenwood BologniaAustralia2026-04-05Benton, John B Jr UNQUALIFIED10Asiya Javayant
1004Aditya KuskoSpain2026-04-21Buckley Miller Wright QUALIFIED19Anna Fali
1005Chavez BriddickJapan2026-04-27Feiner Bros RENEWAL30Ioni Bowcher
1006Octavia MaletItaly2026-04-06Feiner Bros NEW6Xuxue Feng
1007Antonio CaudyUnited Kingdom2026-04-16Chemel, James L Cpa UNQUALIFIED56Stephen Shaw
1008Juan WieserAustralia2026-04-14Rangoni Of Florence UNQUALIFIED54Asiya Javayant
1009Izzy GarufiBrazil2026-04-21Truhlar And Truhlar Attys RENEWAL85Onyama Limba
1010Darci PoquetteRussia2026-04-07Truhlar And Truhlar Attys NEW73Amy Elsner
1011Stacey MacleadItaly2026-04-21Printing Dimensions RENEWAL22Onyama Limba
1012David DarakjyIndia2026-04-16Commercial Press QUALIFIED48Asiya Javayant
1013Darci PoquetteRussia2026-04-25King, Christopher A Esq PROPOSAL29Onyama Limba
1014Deepesh ChuiBrazil2026-04-16Rangoni Of Florence UNQUALIFIED87Ivan Magalhaes
1015Smith GlickArgentina2026-04-17Chanay, Jeffrey A Esq QUALIFIED64Xuxue Feng
1016Kadeem FlosiFrance2026-04-24Feltz Printing Service PROPOSAL30Stephen Shaw
1017Misaki RoysterUnited Kingdom2026-04-23Morlong Associates NEW30Amy Elsner
1018Cody SaylorsItaly2026-05-02Chanay, Jeffrey A Esq PROPOSAL17Amy Elsner
1019Arvin AlbaresGermany2026-04-23Benton, John B Jr NEW51Asiya Javayant
1020Mujtaba NickaSpain2026-04-18Feltz Printing Service NEGOTIATION27Onyama Limba
1021Mujtaba NickaItaly2026-04-22Rangoni Of Florence UNQUALIFIED30Elwin Sharvill
1022Ashley DoeSpain2026-04-13Rangoni Of Florence UNQUALIFIED8Onyama Limba
1023Smith GlickItaly2026-04-10Truhlar And Truhlar Attys QUALIFIED46Stephen Shaw
1024Juan WieserBrazil2026-04-30Chapman, Ross E Esq PROPOSAL84Elwin Sharvill
1025Kadeem FlosiBrazil2026-04-27Benton, John B Jr NEGOTIATION80Amy Elsner
1026Isabel BowleyJapan2026-05-01Chapman, Ross E Esq UNQUALIFIED2Amy Elsner
1027Ashley DoeItaly2026-04-23Dorl, James J Esq RENEWAL56Bernardo Dominic
1028Maria MarrierRussia2026-04-21Rangoni Of Florence UNQUALIFIED82Stephen Shaw
1029Greenwood BologniaAustralia2026-05-01Commercial Press PROPOSAL99Anna Fali
1030Misaki RoysterCanada2026-04-24Truhlar And Truhlar Attys PROPOSAL77Amy Elsner
1031David DarakjyJapan2026-05-02Benton, John B Jr QUALIFIED2Asiya Javayant
1032Rodrigues CampainAustralia2026-04-27Rangoni Of Florence PROPOSAL48Ioni Bowcher
1033Smith GlickBrazil2026-05-02Feiner Bros NEW26Amy Elsner
1034Antonio CaudyFrance2026-04-19Morlong Associates UNQUALIFIED42Ivan Magalhaes
1035Ashley DoeJapan2026-04-12King, Christopher A Esq NEGOTIATION11Ioni Bowcher
1036Kaitlin OstroskyAustralia2026-04-27Chemel, James L Cpa NEW75Stephen Shaw
1037Leon OldroydFrance2026-04-21Chanay, Jeffrey A Esq UNQUALIFIED67Stephen Shaw
1038Nicolas IturbideBrazil2026-04-16Feiner Bros RENEWAL74Asiya Javayant
1039Maria MarrierGermany2026-04-10Rangoni Of Florence RENEWAL81Ivan Magalhaes
1040Kadeem FlosiRussia2026-04-12Chemel, James L Cpa UNQUALIFIED89Stephen Shaw
1041Aruna FigeroaFrance2026-04-04Morlong Associates UNQUALIFIED13Anna Fali
1042Jeanfrancois VenereSpain2026-04-30King, Christopher A Esq RENEWAL1Bernardo Dominic
1043Cody SaylorsFrance2026-05-02Commercial Press QUALIFIED85Elwin Sharvill
1044Juan WieserItaly2026-04-15Chanay, Jeffrey A Esq UNQUALIFIED49Elwin Sharvill
1045Clifford RimSpain2026-04-30Chapman, Ross E Esq UNQUALIFIED27Xuxue Feng
1046Darci PoquetteBrazil2026-04-28Buckley Miller Wright UNQUALIFIED75Elwin Sharvill
1047David DarakjyGermany2026-04-08Rousseaux, Michael Esq UNQUALIFIED75Ivan Magalhaes
1048Jeanfrancois VenereRussia2026-04-19Morlong Associates NEW82Ivan Magalhaes
1049Juan WieserItaly2026-04-14Feiner Bros UNQUALIFIED93Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Emily WhobreyArgentinaIoni Bowcher UNQUALIFIED
Munro FerenczJapanStephen Shaw PROPOSAL
Chavez BriddickUnited KingdomElwin Sharvill QUALIFIED
Morrow RutaAustraliaElwin Sharvill QUALIFIED
Chavez BriddickRussiaStephen Shaw UNQUALIFIED
Clifford RimAustraliaAnna Fali PROPOSAL
Clifford RimRussiaAsiya Javayant UNQUALIFIED
Claire TollnerAustraliaElwin Sharvill QUALIFIED
Arvin AlbaresBrazilIoni Bowcher RENEWAL
Jones VocelkaGermanyElwin Sharvill PROPOSAL
Ricardo GauchoCanadaBernardo Dominic NEW
Smith GlickCanadaStephen Shaw RENEWAL
Costa DilliardFranceOnyama Limba NEGOTIATION
Francesco ShinkoIndiaIoni Bowcher NEGOTIATION
Aditya KuskoGermanyAnna Fali QUALIFIED
Francesco ShinkoCanadaAmy Elsner PROPOSAL
Francesco ShinkoIndiaAmy Elsner NEW
Kaitlin OstroskyUnited KingdomOnyama Limba NEW
Costa DilliardItalyAsiya Javayant NEGOTIATION
Julie StensethIndiaAnna Fali NEW
Aika InouyeCanadaAsiya Javayant NEW
Deepesh ChuiArgentinaXuxue Feng PROPOSAL
Wickens NestleItalyXuxue Feng PROPOSAL
Darci PoquetteItalyAsiya Javayant UNQUALIFIED
Juan WieserItalyAmy Elsner UNQUALIFIED
Costa DilliardSpainOnyama Limba RENEWAL
Greenwood BologniaBrazilOnyama Limba NEGOTIATION
Nicolas IturbideItalyStephen Shaw QUALIFIED
Silvio SlusarskiRussiaOnyama Limba RENEWAL
Wickens NestleFranceIvan Magalhaes UNQUALIFIED
Deepesh ChuiCanadaIvan Magalhaes QUALIFIED
Wickens NestleFranceAnna Fali NEGOTIATION
Misaki RoysterCanadaAmy Elsner UNQUALIFIED
Mayumi KolmetzAustraliaOnyama Limba UNQUALIFIED
Jones VocelkaIndiaIoni Bowcher QUALIFIED
Ashley DoeAustraliaElwin Sharvill RENEWAL
Greenwood BologniaIndiaAnna Fali RENEWAL
Kaitlin OstroskySpainBernardo Dominic PROPOSAL
David DarakjyCanadaAmy Elsner PROPOSAL
Maisha RulapaughIndiaElwin Sharvill NEW
Aruna FigeroaGermanyBernardo Dominic NEW
Kadeem FlosiGermanyIoni Bowcher PROPOSAL
Emily WhobreyJapanStephen Shaw RENEWAL
Jefferson SchemmerSpainBernardo Dominic RENEWAL
Mujtaba NickaAustraliaBernardo Dominic NEGOTIATION
Alejandro PerinAustraliaXuxue Feng QUALIFIED
Adams MorascaGermanyXuxue Feng QUALIFIED
Emily WhobreyItalyIvan Magalhaes NEGOTIATION
Faith GillianAustraliaAmy Elsner PROPOSAL
Costa DilliardArgentinaIvan Magalhaes NEGOTIATION
Frozen Columns
Name
Izzy Garufi
Costa Dilliard
Julie Stenseth
Arvin Albares
Leon Oldroyd
Jennifer Amigon
Leon Oldroyd
Isabel Bowley
Aika Inouye
James Butt
Izzy Garufi
David Darakjy
Alejandro Perin
Alejandro Perin
James Butt
Kadeem Flosi
Mayumi Kolmetz
Cody Saylors
Silvio Slusarski
Mujtaba Nicka
Smith Glick
Octavia Malet
Greenwood Bolognia
Greenwood Bolognia
Isabel Bowley
Kadeem Flosi
Aditya Kusko
Johnson Sergi
Darci Poquette
Silvio Slusarski
Antonio Caudy
Ivar Paprocki
Adams Morasca
Munro Ferencz
Nicolas Iturbide
Aruna Figeroa
Sinclair Waycott
Tony Foller
Francesco Shinko
Darci Poquette
Mayumi Kolmetz
Ricardo Gaucho
Jones Vocelka
Mujtaba Nicka
Ricardo Gaucho
Aditya Kusko
Clifford Rim
Leja Caldarera
Darci Poquette
Isabel Bowley
IdCountryDate
1000Australia2026-04-05
1001India2026-04-15
1002India2026-04-16
1003France2026-04-08
1004Italy2026-04-23
1005United Kingdom2026-05-01
1006Brazil2026-04-22
1007Argentina2026-04-29
1008Japan2026-04-17
1009Russia2026-04-15
1010Japan2026-04-09
1011Germany2026-04-16
1012Japan2026-04-08
1013Argentina2026-04-19
1014Italy2026-04-29
1015France2026-04-13
1016Spain2026-04-19
1017Japan2026-04-30
1018Germany2026-04-13
1019Australia2026-04-29
1020India2026-04-23
1021Russia2026-04-03
1022India2026-04-15
1023Russia2026-04-06
1024Argentina2026-04-25
1025Spain2026-05-02
1026Japan2026-04-25
1027India2026-04-07
1028Australia2026-04-07
1029Japan2026-04-22
1030United Kingdom2026-04-03
1031Italy2026-04-25
1032Brazil2026-04-03
1033India2026-04-17
1034Canada2026-04-07
1035United Kingdom2026-04-22
1036Germany2026-04-06
1037India2026-04-09
1038Germany2026-04-12
1039Spain2026-04-04
1040Germany2026-04-11
1041France2026-04-30
1042Italy2026-04-09
1043Germany2026-05-02
1044Germany2026-04-20
1045Germany2026-04-14
1046France2026-04-23
1047Italy2026-04-24
1048United Kingdom2026-04-23
1049Canada2026-04-19

On-Demand Data

NameIdCountryDate
David Darakjy1000United Kingdom2026-04-20
Jones Vocelka1001Japan2026-04-16
Clifford Rim1002Argentina2026-04-17
Jennifer Amigon1003Australia2026-04-06
Clifford Rim1004Australia2026-04-17
Ivar Paprocki1005India2026-04-12
Arvin Albares1006Japan2026-04-13
Nicolas Iturbide1007Spain2026-04-24
Maria Marrier1008Argentina2026-04-22
Jeanfrancois Venere1009Japan2026-04-16
Maria Marrier1010Canada2026-04-21
Tony Foller1011Canada2026-04-10
Ricardo Gaucho1012Spain2026-04-24
Kadeem Flosi1013Australia2026-04-12
Kaitlin Ostrosky1014Brazil2026-04-25
Misaki Royster1015Argentina2026-04-11
Faith Gillian1016Canada2026-04-30
Juan Wieser1017Brazil2026-04-22
Clifford Rim1018India2026-04-06
Antonio Caudy1019Australia2026-04-11
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Salvatore StockhamJapanStephen Shaw NEGOTIATION
Claire TollnerCanadaStephen Shaw NEGOTIATION
Jennifer AmigonGermanyElwin Sharvill PROPOSAL
Juan WieserArgentinaIvan Magalhaes NEGOTIATION
Misaki RoysterBrazilOnyama Limba RENEWAL
Ricardo GauchoArgentinaBernardo Dominic PROPOSAL
Ashley DoeJapanAsiya Javayant RENEWAL
Greenwood BologniaRussiaBernardo Dominic UNQUALIFIED
Francesco ShinkoJapanIvan Magalhaes UNQUALIFIED
Adams MorascaArgentinaElwin Sharvill PROPOSAL
Chavez BriddickAustraliaAmy Elsner PROPOSAL
Smith GlickArgentinaAnna Fali QUALIFIED
Ashley DoeIndiaIoni Bowcher RENEWAL
Munro FerenczJapanIvan Magalhaes PROPOSAL
Juan WieserGermanyAsiya Javayant UNQUALIFIED
Mayumi KolmetzJapanElwin Sharvill RENEWAL
Aika InouyeArgentinaOnyama Limba NEGOTIATION
Rodrigues CampainRussiaBernardo Dominic QUALIFIED
David DarakjyRussiaOnyama Limba QUALIFIED
Ivar PaprockiJapanAnna Fali RENEWAL
Isabel BowleyIndiaOnyama Limba RENEWAL
Morrow RutaJapanElwin Sharvill NEGOTIATION
Jennifer AmigonBrazilBernardo Dominic NEW
Mayumi KolmetzRussiaIoni Bowcher NEGOTIATION
Munro FerenczIndiaAnna Fali RENEWAL
Aruna FigeroaItalyAmy Elsner PROPOSAL
Cody SaylorsRussiaAmy Elsner QUALIFIED
Jones VocelkaBrazilStephen Shaw NEGOTIATION
Mayumi KolmetzGermanyBernardo Dominic RENEWAL
Clifford RimAustraliaAmy Elsner QUALIFIED
Kadeem FlosiJapanAnna Fali PROPOSAL
Maisha RulapaughAustraliaAsiya Javayant NEGOTIATION
Ashley DoeFranceAmy Elsner NEGOTIATION
Claire TollnerItalyElwin Sharvill QUALIFIED
Arvin AlbaresSpainAmy Elsner QUALIFIED
Jones VocelkaCanadaAsiya Javayant NEW
Isabel BowleySpainXuxue Feng QUALIFIED
Emily WhobreyIndiaOnyama Limba NEGOTIATION
Leja CaldareraGermanyBernardo Dominic NEGOTIATION
Arvin AlbaresArgentinaElwin Sharvill NEW

<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>