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
Mujtaba NickaFranceXuxue Feng NEGOTIATION
Aruna FigeroaArgentinaAsiya Javayant NEGOTIATION
Munro FerenczGermanyAsiya Javayant QUALIFIED
Aika InouyeUnited KingdomIvan Magalhaes UNQUALIFIED
Smith GlickItalyOnyama Limba NEGOTIATION
Costa DilliardGermanyStephen Shaw RENEWAL
Chavez BriddickRussiaBernardo Dominic UNQUALIFIED
Jeanfrancois VenereArgentinaAsiya Javayant UNQUALIFIED
Jeanfrancois VenereRussiaIoni Bowcher PROPOSAL
Adams MorascaRussiaOnyama Limba NEW
Misaki RoysterGermanyIvan Magalhaes RENEWAL
Sinclair WaycottItalyXuxue Feng RENEWAL
Aditya KuskoBrazilAsiya Javayant RENEWAL
James ButtArgentinaElwin Sharvill PROPOSAL
Kadeem FlosiItalyBernardo Dominic UNQUALIFIED
Isabel BowleyFranceAmy Elsner PROPOSAL
Sinclair WaycottGermanyStephen Shaw NEW
Alejandro PerinBrazilAnna Fali PROPOSAL
Isabel BowleyUnited KingdomXuxue Feng PROPOSAL
Mujtaba NickaUnited KingdomAmy Elsner QUALIFIED
Johnson SergiSpainAnna Fali NEGOTIATION
Antonio CaudyRussiaStephen Shaw UNQUALIFIED
James ButtFranceXuxue Feng UNQUALIFIED
Chavez BriddickRussiaIvan Magalhaes NEGOTIATION
Aditya KuskoArgentinaElwin Sharvill NEGOTIATION
Octavia MaletAustraliaAmy Elsner PROPOSAL
Silvio SlusarskiJapanIoni Bowcher RENEWAL
Emily WhobreySpainXuxue Feng UNQUALIFIED
Greenwood BologniaCanadaElwin Sharvill UNQUALIFIED
Aruna FigeroaUnited KingdomIoni Bowcher NEW
Morrow RutaSpainXuxue Feng QUALIFIED
Mujtaba NickaArgentinaBernardo Dominic NEW
Mujtaba NickaGermanyOnyama Limba QUALIFIED
Isabel BowleyAustraliaAnna Fali QUALIFIED
Stacey MacleadJapanAnna Fali QUALIFIED
Mayumi KolmetzItalyAsiya Javayant NEGOTIATION
Tony FollerFranceIvan Magalhaes PROPOSAL
Julie StensethJapanAnna Fali PROPOSAL
Maisha RulapaughArgentinaElwin Sharvill RENEWAL
Rodrigues CampainFranceAsiya Javayant NEGOTIATION
James ButtGermanyStephen Shaw PROPOSAL
Jennifer AmigonCanadaAnna Fali RENEWAL
Silvio SlusarskiUnited KingdomOnyama Limba NEW
Octavia MaletSpainAmy Elsner PROPOSAL
Arvin AlbaresRussiaElwin Sharvill RENEWAL
Juan WieserAustraliaAnna Fali QUALIFIED
Julie StensethCanadaAmy Elsner QUALIFIED
Cody SaylorsBrazilAsiya Javayant NEW
Mayumi KolmetzCanadaStephen Shaw PROPOSAL
Antonio CaudyIndiaIoni Bowcher UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Maria MarrierJapanIoni Bowcher RENEWAL
Aika InouyeArgentinaOnyama Limba NEGOTIATION
Clifford RimItalyAsiya Javayant PROPOSAL
Mayumi KolmetzItalyAmy Elsner QUALIFIED
Maria MarrierUnited KingdomIvan Magalhaes NEGOTIATION
Darci PoquetteItalyBernardo Dominic RENEWAL
Jones VocelkaUnited KingdomIvan Magalhaes UNQUALIFIED
Nicolas IturbideAustraliaStephen Shaw UNQUALIFIED
Adams MorascaBrazilStephen Shaw PROPOSAL
Mayumi KolmetzSpainXuxue Feng NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Murillo MaletGermany2026-04-17Buckley Miller Wright UNQUALIFIED10Amy Elsner
1001Rodrigues CampainItaly2026-04-19Buckley Miller Wright NEW96Ioni Bowcher
1002Salvatore StockhamItaly2026-04-03Commercial Press NEW34Amy Elsner
1003Darci PoquetteAustralia2026-04-15Buckley Miller Wright UNQUALIFIED41Onyama Limba
1004Mujtaba NickaAustralia2026-04-28Morlong Associates NEGOTIATION57Bernardo Dominic
1005Jones VocelkaArgentina2026-03-30Buckley Miller Wright NEGOTIATION82Asiya Javayant
1006Murillo MaletItaly2026-04-14Feiner Bros QUALIFIED11Anna Fali
1007Leja CaldareraSpain2026-04-09King, Christopher A Esq PROPOSAL33Xuxue Feng
1008Ivar PaprockiItaly2026-04-17Rangoni Of Florence QUALIFIED78Asiya Javayant
1009Chavez BriddickCanada2026-04-20Feiner Bros NEW71Bernardo Dominic
1010Deepesh ChuiRussia2026-04-06Feiner Bros UNQUALIFIED18Asiya Javayant
1011Ashley DoeCanada2026-04-20Buckley Miller Wright NEGOTIATION56Anna Fali
1012Izzy GarufiSpain2026-04-06Printing Dimensions NEW66Onyama Limba
1013David DarakjyCanada2026-04-24Feiner Bros RENEWAL92Ivan Magalhaes
1014Kaitlin OstroskyItaly2026-04-10Chemel, James L Cpa QUALIFIED79Ivan Magalhaes
1015Claire TollnerUnited Kingdom2026-04-05Feiner Bros NEW82Ioni Bowcher
1016Kadeem FlosiIndia2026-04-20Chemel, James L Cpa PROPOSAL21Amy Elsner
1017Octavia MaletGermany2026-04-19Benton, John B Jr UNQUALIFIED84Bernardo Dominic
1018Antonio CaudyAustralia2026-04-28Buckley Miller Wright NEW21Anna Fali
1019Costa DilliardBrazil2026-04-20Commercial Press NEW77Ioni Bowcher
1020Cody SaylorsJapan2026-04-26Chapman, Ross E Esq NEW66Bernardo Dominic
1021Julie StensethIndia2026-04-02Benton, John B Jr RENEWAL77Ioni Bowcher
1022David DarakjyAustralia2026-04-10Truhlar And Truhlar Attys NEW32Onyama Limba
1023Darci PoquetteIndia2026-04-01Dorl, James J Esq QUALIFIED67Anna Fali
1024Adams MorascaRussia2026-04-10Feiner Bros UNQUALIFIED33Onyama Limba
1025Silvio SlusarskiIndia2026-04-13Rousseaux, Michael Esq NEGOTIATION78Onyama Limba
1026Leon OldroydFrance2026-04-17Feltz Printing Service PROPOSAL41Asiya Javayant
1027Munro FerenczIndia2026-04-05Feltz Printing Service UNQUALIFIED65Elwin Sharvill
1028Stacey MacleadArgentina2026-04-02Chanay, Jeffrey A Esq QUALIFIED17Stephen Shaw
1029Emily WhobreyIndia2026-04-02Rousseaux, Michael Esq PROPOSAL23Elwin Sharvill
1030Aika InouyeAustralia2026-03-30King, Christopher A Esq PROPOSAL64Xuxue Feng
1031Aika InouyeUnited Kingdom2026-04-19King, Christopher A Esq NEGOTIATION50Amy Elsner
1032Isabel BowleySpain2026-04-27Feltz Printing Service UNQUALIFIED7Stephen Shaw
1033Izzy GarufiRussia2026-04-19Feiner Bros QUALIFIED92Bernardo Dominic
1034Emily WhobreyAustralia2026-04-14Rousseaux, Michael Esq QUALIFIED92Bernardo Dominic
1035Morrow RutaSpain2026-04-28Benton, John B Jr RENEWAL70Anna Fali
1036Julie StensethFrance2026-04-01Buckley Miller Wright PROPOSAL17Stephen Shaw
1037Jones VocelkaArgentina2026-04-16Rousseaux, Michael Esq RENEWAL89Amy Elsner
1038Stacey MacleadUnited Kingdom2026-04-13Truhlar And Truhlar Attys QUALIFIED24Asiya Javayant
1039Ashley DoeFrance2026-04-13Printing Dimensions PROPOSAL99Ivan Magalhaes
1040Jennifer AmigonSpain2026-04-01Benton, John B Jr UNQUALIFIED52Ivan Magalhaes
1041Deepesh ChuiCanada2026-04-12Feltz Printing Service QUALIFIED23Anna Fali
1042Ashley DoeJapan2026-04-19Feltz Printing Service UNQUALIFIED66Stephen Shaw
1043Jeanfrancois VenereArgentina2026-04-11Feiner Bros NEW73Bernardo Dominic
1044Darci PoquetteUnited Kingdom2026-03-31Chemel, James L Cpa UNQUALIFIED80Xuxue Feng
1045Cody SaylorsJapan2026-04-13Feiner Bros UNQUALIFIED46Stephen Shaw
1046James ButtIndia2026-04-24Truhlar And Truhlar Attys NEGOTIATION77Stephen Shaw
1047Tony FollerAustralia2026-04-22Rousseaux, Michael Esq RENEWAL48Onyama Limba
1048Kadeem FlosiAustralia2026-04-05Feiner Bros UNQUALIFIED85Ivan Magalhaes
1049Juan WieserBrazil2026-04-27Rangoni Of Florence RENEWAL27Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Greenwood BologniaFranceStephen Shaw UNQUALIFIED
Leja CaldareraSpainIoni Bowcher QUALIFIED
Chavez BriddickGermanyBernardo Dominic PROPOSAL
Misaki RoysterArgentinaIvan Magalhaes UNQUALIFIED
Tony FollerJapanXuxue Feng UNQUALIFIED
Johnson SergiFranceBernardo Dominic RENEWAL
Claire TollnerRussiaElwin Sharvill RENEWAL
Misaki RoysterJapanOnyama Limba RENEWAL
Jones VocelkaArgentinaIoni Bowcher PROPOSAL
Jeanfrancois VenereItalyStephen Shaw UNQUALIFIED
Jeanfrancois VenereArgentinaXuxue Feng PROPOSAL
Ivar PaprockiFranceOnyama Limba PROPOSAL
Silvio SlusarskiIndiaAsiya Javayant PROPOSAL
David DarakjyUnited KingdomAnna Fali NEGOTIATION
Munro FerenczBrazilAmy Elsner NEW
Ashley DoeFranceOnyama Limba PROPOSAL
Faith GillianIndiaIvan Magalhaes UNQUALIFIED
Aditya KuskoRussiaIoni Bowcher NEW
Juan WieserFranceAnna Fali QUALIFIED
Arvin AlbaresAustraliaAmy Elsner NEGOTIATION
Tony FollerItalyAmy Elsner QUALIFIED
Claire TollnerFranceXuxue Feng NEW
Johnson SergiSpainBernardo Dominic QUALIFIED
Jennifer AmigonAustraliaIvan Magalhaes PROPOSAL
Leon OldroydItalyOnyama Limba NEGOTIATION
James ButtBrazilElwin Sharvill NEGOTIATION
Greenwood BologniaArgentinaStephen Shaw NEGOTIATION
Tony FollerArgentinaBernardo Dominic QUALIFIED
Arvin AlbaresArgentinaIoni Bowcher RENEWAL
Maria MarrierItalyAsiya Javayant QUALIFIED
Sinclair WaycottIndiaAmy Elsner QUALIFIED
Maisha RulapaughItalyOnyama Limba NEGOTIATION
Maisha RulapaughUnited KingdomAnna Fali NEW
Tony FollerUnited KingdomAsiya Javayant NEW
Nicolas IturbideIndiaOnyama Limba RENEWAL
Isabel BowleyBrazilElwin Sharvill QUALIFIED
Adams MorascaSpainBernardo Dominic QUALIFIED
Morrow RutaAustraliaBernardo Dominic RENEWAL
Francesco ShinkoGermanyElwin Sharvill PROPOSAL
Juan WieserFranceAmy Elsner NEW
David DarakjyUnited KingdomStephen Shaw NEW
Maria MarrierJapanIoni Bowcher NEW
Ricardo GauchoIndiaAnna Fali PROPOSAL
Mayumi KolmetzItalyOnyama Limba QUALIFIED
Kaitlin OstroskyBrazilBernardo Dominic PROPOSAL
Costa DilliardGermanyAnna Fali RENEWAL
Isabel BowleyArgentinaIvan Magalhaes UNQUALIFIED
Deepesh ChuiUnited KingdomOnyama Limba QUALIFIED
Isabel BowleyJapanBernardo Dominic QUALIFIED
Arvin AlbaresJapanStephen Shaw UNQUALIFIED
Frozen Columns
Name
Tony Foller
Aika Inouye
Aika Inouye
Cody Saylors
Emily Whobrey
Jeanfrancois Venere
David Darakjy
Morrow Ruta
Leja Caldarera
Darci Poquette
Nicolas Iturbide
Jeanfrancois Venere
Costa Dilliard
Cody Saylors
Antonio Caudy
Salvatore Stockham
Aditya Kusko
Jeanfrancois Venere
Nicolas Iturbide
Clifford Rim
Salvatore Stockham
Emily Whobrey
Morrow Ruta
Leja Caldarera
Alejandro Perin
Tony Foller
Rodrigues Campain
Murillo Malet
Aruna Figeroa
Darci Poquette
Ricardo Gaucho
Mujtaba Nicka
Nicolas Iturbide
Faith Gillian
Isabel Bowley
Morrow Ruta
Aika Inouye
Johnson Sergi
Morrow Ruta
Clifford Rim
Deepesh Chui
Mujtaba Nicka
Izzy Garufi
Nicolas Iturbide
Johnson Sergi
Smith Glick
Octavia Malet
Johnson Sergi
Deepesh Chui
Darci Poquette
IdCountryDate
1000Spain2026-04-23
1001Argentina2026-04-09
1002Canada2026-04-02
1003Spain2026-04-24
1004India2026-03-31
1005Spain2026-04-07
1006Argentina2026-04-06
1007Canada2026-04-18
1008Italy2026-04-19
1009Japan2026-04-10
1010United Kingdom2026-04-24
1011Brazil2026-04-20
1012United Kingdom2026-04-15
1013United Kingdom2026-04-15
1014Russia2026-04-25
1015Germany2026-04-18
1016Canada2026-04-02
1017Germany2026-04-25
1018Canada2026-04-21
1019Spain2026-04-07
1020Spain2026-04-05
1021Italy2026-04-03
1022United Kingdom2026-04-06
1023Brazil2026-04-18
1024Australia2026-04-22
1025India2026-04-09
1026France2026-04-17
1027Argentina2026-04-28
1028Canada2026-04-13
1029Italy2026-04-02
1030Japan2026-04-27
1031Russia2026-04-20
1032Spain2026-04-09
1033Argentina2026-04-26
1034United Kingdom2026-04-22
1035France2026-04-01
1036United Kingdom2026-04-01
1037Spain2026-04-18
1038Japan2026-04-05
1039Argentina2026-04-13
1040Brazil2026-04-01
1041Italy2026-04-09
1042Germany2026-04-26
1043India2026-04-25
1044Japan2026-04-20
1045Brazil2026-04-16
1046United Kingdom2026-04-09
1047Canada2026-04-08
1048France2026-03-30
1049Australia2026-04-21

On-Demand Data

NameIdCountryDate
Claire Tollner1000United Kingdom2026-04-06
Juan Wieser1001United Kingdom2026-04-19
Greenwood Bolognia1002Italy2026-04-20
Emily Whobrey1003India2026-04-23
Jones Vocelka1004Italy2026-04-25
Jones Vocelka1005India2026-04-23
Greenwood Bolognia1006Germany2026-04-16
Clifford Rim1007Brazil2026-04-27
Leon Oldroyd1008India2026-04-18
Darci Poquette1009Russia2026-04-13
Munro Ferencz1010Canada2026-04-05
Julie Stenseth1011Japan2026-04-08
Aika Inouye1012India2026-04-16
Jennifer Amigon1013Japan2026-04-12
Wickens Nestle1014India2026-04-23
Ricardo Gaucho1015Argentina2026-03-31
Aditya Kusko1016Germany2026-04-10
Nicolas Iturbide1017United Kingdom2026-04-24
Deepesh Chui1018Canada2026-04-03
Sinclair Waycott1019Argentina2026-04-24
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Silvio SlusarskiGermanyElwin Sharvill PROPOSAL
Isabel BowleyJapanXuxue Feng UNQUALIFIED
Leja CaldareraCanadaIoni Bowcher NEW
Maisha RulapaughFranceXuxue Feng UNQUALIFIED
Nicolas IturbideFranceStephen Shaw UNQUALIFIED
Munro FerenczRussiaIoni Bowcher PROPOSAL
Faith GillianRussiaIvan Magalhaes NEGOTIATION
Clifford RimIndiaElwin Sharvill NEGOTIATION
Stacey MacleadAustraliaAsiya Javayant QUALIFIED
Isabel BowleyArgentinaStephen Shaw NEGOTIATION
Jefferson SchemmerIndiaAnna Fali QUALIFIED
Antonio CaudyGermanyAmy Elsner RENEWAL
Stacey MacleadRussiaAnna Fali RENEWAL
Ashley DoeBrazilOnyama Limba PROPOSAL
Clifford RimItalyIvan Magalhaes NEGOTIATION
Salvatore StockhamIndiaOnyama Limba NEGOTIATION
Tony FollerItalyAnna Fali NEW
Murillo MaletSpainStephen Shaw PROPOSAL
Maisha RulapaughUnited KingdomOnyama Limba QUALIFIED
Chavez BriddickJapanIvan Magalhaes UNQUALIFIED
Emily WhobreyIndiaBernardo Dominic NEGOTIATION
Greenwood BologniaFranceOnyama Limba PROPOSAL
Rodrigues CampainFranceIoni Bowcher RENEWAL
Kadeem FlosiAustraliaIvan Magalhaes QUALIFIED
Julie StensethCanadaIvan Magalhaes PROPOSAL
Morrow RutaGermanyOnyama Limba QUALIFIED
Sinclair WaycottGermanyBernardo Dominic NEW
Kadeem FlosiSpainStephen Shaw RENEWAL
Morrow RutaBrazilAmy Elsner NEW
Munro FerenczUnited KingdomAnna Fali NEW
Salvatore StockhamBrazilStephen Shaw NEW
Ivar PaprockiIndiaElwin Sharvill QUALIFIED
Juan WieserRussiaXuxue Feng QUALIFIED
Izzy GarufiJapanIoni Bowcher UNQUALIFIED
Antonio CaudyItalyIvan Magalhaes NEW
Ashley DoeAustraliaElwin Sharvill UNQUALIFIED
Murillo MaletBrazilIvan Magalhaes NEGOTIATION
Johnson SergiCanadaOnyama Limba PROPOSAL
Wickens NestleCanadaXuxue Feng NEGOTIATION
Alejandro PerinAustraliaIvan Magalhaes 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>