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
Munro FerenczFranceStephen Shaw RENEWAL
Aditya KuskoJapanOnyama Limba PROPOSAL
Mujtaba NickaArgentinaAnna Fali RENEWAL
Wickens NestleGermanyOnyama Limba UNQUALIFIED
Kaitlin OstroskyArgentinaBernardo Dominic NEW
Stacey MacleadItalyIoni Bowcher UNQUALIFIED
Smith GlickUnited KingdomAmy Elsner RENEWAL
Faith GillianCanadaOnyama Limba NEW
Nicolas IturbideArgentinaXuxue Feng PROPOSAL
David DarakjyBrazilAsiya Javayant NEW
Mayumi KolmetzArgentinaBernardo Dominic UNQUALIFIED
Johnson SergiIndiaBernardo Dominic RENEWAL
Smith GlickSpainBernardo Dominic QUALIFIED
Leon OldroydFranceIoni Bowcher QUALIFIED
Murillo MaletBrazilStephen Shaw QUALIFIED
Misaki RoysterGermanyXuxue Feng NEW
Arvin AlbaresAustraliaStephen Shaw PROPOSAL
Maisha RulapaughFranceAmy Elsner PROPOSAL
Nicolas IturbideAustraliaIvan Magalhaes RENEWAL
Wickens NestleRussiaIoni Bowcher PROPOSAL
Silvio SlusarskiIndiaAnna Fali NEW
Jennifer AmigonItalyOnyama Limba RENEWAL
Morrow RutaIndiaElwin Sharvill UNQUALIFIED
Smith GlickUnited KingdomStephen Shaw NEW
Greenwood BologniaCanadaIoni Bowcher PROPOSAL
Ashley DoeArgentinaBernardo Dominic QUALIFIED
Morrow RutaArgentinaIvan Magalhaes QUALIFIED
Greenwood BologniaCanadaElwin Sharvill RENEWAL
Stacey MacleadAustraliaAsiya Javayant NEGOTIATION
Deepesh ChuiItalyOnyama Limba NEGOTIATION
Sinclair WaycottSpainIvan Magalhaes PROPOSAL
Aruna FigeroaRussiaXuxue Feng UNQUALIFIED
Jennifer AmigonUnited KingdomXuxue Feng NEW
Deepesh ChuiBrazilAsiya Javayant UNQUALIFIED
Wickens NestleJapanBernardo Dominic QUALIFIED
Antonio CaudyRussiaAmy Elsner RENEWAL
Mayumi KolmetzSpainXuxue Feng NEGOTIATION
Morrow RutaAustraliaIoni Bowcher RENEWAL
Stacey MacleadGermanyOnyama Limba RENEWAL
Kadeem FlosiCanadaAsiya Javayant NEW
Silvio SlusarskiItalyOnyama Limba NEW
Francesco ShinkoSpainIvan Magalhaes RENEWAL
Smith GlickUnited KingdomAnna Fali PROPOSAL
Aika InouyeArgentinaIvan Magalhaes NEGOTIATION
Maisha RulapaughUnited KingdomAsiya Javayant NEW
Kaitlin OstroskyUnited KingdomOnyama Limba RENEWAL
Stacey MacleadUnited KingdomAsiya Javayant NEW
Johnson SergiSpainAsiya Javayant QUALIFIED
Kaitlin OstroskyBrazilIvan Magalhaes PROPOSAL
Antonio CaudyJapanAnna Fali UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Maria MarrierJapanElwin Sharvill RENEWAL
Isabel BowleyItalyIoni Bowcher UNQUALIFIED
David DarakjyItalyAsiya Javayant NEGOTIATION
James ButtItalyBernardo Dominic QUALIFIED
Kaitlin OstroskyUnited KingdomBernardo Dominic RENEWAL
Silvio SlusarskiIndiaXuxue Feng RENEWAL
Maisha RulapaughGermanyBernardo Dominic QUALIFIED
Silvio SlusarskiBrazilAmy Elsner NEW
Adams MorascaArgentinaIoni Bowcher UNQUALIFIED
Ricardo GauchoAustraliaBernardo Dominic RENEWAL
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Cody SaylorsCanada2026-05-24Printing Dimensions QUALIFIED46Anna Fali
1001Octavia MaletBrazil2026-05-05Morlong Associates QUALIFIED60Asiya Javayant
1002Misaki RoysterArgentina2026-05-18Buckley Miller Wright UNQUALIFIED50Anna Fali
1003Isabel BowleyUnited Kingdom2026-05-09Feiner Bros RENEWAL12Onyama Limba
1004Silvio SlusarskiArgentina2026-05-13Commercial Press QUALIFIED76Bernardo Dominic
1005Smith GlickAustralia2026-05-02Chemel, James L Cpa NEGOTIATION0Anna Fali
1006Kadeem FlosiRussia2026-05-15Feltz Printing Service PROPOSAL76Onyama Limba
1007Wickens NestleAustralia2026-05-15Rousseaux, Michael Esq RENEWAL64Ivan Magalhaes
1008Arvin AlbaresAustralia2026-05-14Dorl, James J Esq UNQUALIFIED33Onyama Limba
1009Maria MarrierFrance2026-05-17Buckley Miller Wright NEW38Amy Elsner
1010Rodrigues CampainGermany2026-05-23Chapman, Ross E Esq QUALIFIED65Stephen Shaw
1011Morrow RutaItaly2026-05-16Commercial Press NEGOTIATION63Stephen Shaw
1012Jeanfrancois VenereFrance2026-05-14Chemel, James L Cpa NEGOTIATION47Onyama Limba
1013Nicolas IturbideCanada2026-05-15Buckley Miller Wright PROPOSAL39Bernardo Dominic
1014Ricardo GauchoArgentina2026-05-27King, Christopher A Esq NEW50Anna Fali
1015Ivar PaprockiArgentina2026-05-14Chapman, Ross E Esq NEGOTIATION93Bernardo Dominic
1016Misaki RoysterCanada2026-05-02Printing Dimensions NEW69Ioni Bowcher
1017Misaki RoysterIndia2026-05-23Chapman, Ross E Esq PROPOSAL82Onyama Limba
1018Ashley DoeRussia2026-05-06Commercial Press QUALIFIED25Anna Fali
1019Darci PoquetteJapan2026-05-17Feiner Bros UNQUALIFIED69Elwin Sharvill
1020Kadeem FlosiUnited Kingdom2026-05-16Truhlar And Truhlar Attys QUALIFIED60Anna Fali
1021Murillo MaletItaly2026-04-30King, Christopher A Esq PROPOSAL89Anna Fali
1022Francesco ShinkoUnited Kingdom2026-05-04Dorl, James J Esq PROPOSAL69Stephen Shaw
1023Ashley DoeAustralia2026-05-08Buckley Miller Wright NEGOTIATION44Amy Elsner
1024Greenwood BologniaUnited Kingdom2026-05-28Chemel, James L Cpa PROPOSAL24Onyama Limba
1025Cody SaylorsIndia2026-05-29King, Christopher A Esq PROPOSAL92Elwin Sharvill
1026James ButtRussia2026-05-15Chapman, Ross E Esq PROPOSAL5Ivan Magalhaes
1027Leon OldroydFrance2026-05-28Benton, John B Jr QUALIFIED48Onyama Limba
1028Jeanfrancois VenereRussia2026-05-08Commercial Press PROPOSAL38Asiya Javayant
1029Silvio SlusarskiUnited Kingdom2026-05-05Buckley Miller Wright NEW20Onyama Limba
1030David DarakjyUnited Kingdom2026-05-27Benton, John B Jr QUALIFIED94Onyama Limba
1031Greenwood BologniaGermany2026-05-04Commercial Press NEGOTIATION38Anna Fali
1032Sinclair WaycottCanada2026-05-03King, Christopher A Esq RENEWAL43Ioni Bowcher
1033Silvio SlusarskiArgentina2026-05-14Chanay, Jeffrey A Esq PROPOSAL55Bernardo Dominic
1034David DarakjyJapan2026-05-28Commercial Press PROPOSAL59Amy Elsner
1035Ashley DoeAustralia2026-05-05Commercial Press RENEWAL63Anna Fali
1036Darci PoquetteJapan2026-05-28Rangoni Of Florence PROPOSAL63Ivan Magalhaes
1037Mayumi KolmetzIndia2026-05-14King, Christopher A Esq NEGOTIATION54Ioni Bowcher
1038Leja CaldareraCanada2026-05-05Dorl, James J Esq QUALIFIED5Onyama Limba
1039Izzy GarufiGermany2026-05-24Rousseaux, Michael Esq QUALIFIED58Amy Elsner
1040Tony FollerJapan2026-05-24Rangoni Of Florence NEGOTIATION22Xuxue Feng
1041Rodrigues CampainArgentina2026-05-20Feiner Bros UNQUALIFIED56Onyama Limba
1042Cody SaylorsSpain2026-05-23Chemel, James L Cpa PROPOSAL18Bernardo Dominic
1043Kaitlin OstroskyJapan2026-05-05Dorl, James J Esq PROPOSAL28Stephen Shaw
1044Salvatore StockhamUnited Kingdom2026-05-17Chanay, Jeffrey A Esq QUALIFIED24Onyama Limba
1045Jennifer AmigonAustralia2026-05-07King, Christopher A Esq PROPOSAL75Ivan Magalhaes
1046Octavia MaletFrance2026-05-23Printing Dimensions NEW98Ivan Magalhaes
1047David DarakjyRussia2026-05-21Commercial Press RENEWAL41Ivan Magalhaes
1048Jones VocelkaRussia2026-05-19Printing Dimensions UNQUALIFIED78Stephen Shaw
1049Nicolas IturbideItaly2026-05-23Feiner Bros PROPOSAL75Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Aditya KuskoIndiaOnyama Limba PROPOSAL
Isabel BowleyBrazilXuxue Feng PROPOSAL
Antonio CaudyCanadaElwin Sharvill QUALIFIED
Munro FerenczIndiaOnyama Limba UNQUALIFIED
Adams MorascaCanadaBernardo Dominic NEGOTIATION
Jones VocelkaCanadaElwin Sharvill QUALIFIED
James ButtItalyOnyama Limba UNQUALIFIED
Leja CaldareraUnited KingdomIvan Magalhaes RENEWAL
Emily WhobreyBrazilStephen Shaw NEGOTIATION
Munro FerenczCanadaIvan Magalhaes RENEWAL
Stacey MacleadUnited KingdomBernardo Dominic NEGOTIATION
Maria MarrierGermanyOnyama Limba QUALIFIED
Stacey MacleadJapanAsiya Javayant PROPOSAL
Smith GlickArgentinaOnyama Limba RENEWAL
Isabel BowleySpainElwin Sharvill QUALIFIED
Deepesh ChuiSpainIoni Bowcher QUALIFIED
David DarakjyFranceIvan Magalhaes NEGOTIATION
Jeanfrancois VenereCanadaIoni Bowcher NEW
Clifford RimRussiaElwin Sharvill NEW
Izzy GarufiSpainAnna Fali UNQUALIFIED
Kadeem FlosiUnited KingdomOnyama Limba RENEWAL
Kaitlin OstroskyItalyOnyama Limba NEW
Sinclair WaycottRussiaXuxue Feng PROPOSAL
Nicolas IturbideArgentinaOnyama Limba NEW
Murillo MaletGermanyAmy Elsner QUALIFIED
Kadeem FlosiBrazilBernardo Dominic UNQUALIFIED
Julie StensethFranceAsiya Javayant UNQUALIFIED
Aditya KuskoArgentinaOnyama Limba PROPOSAL
Greenwood BologniaArgentinaAsiya Javayant RENEWAL
Alejandro PerinIndiaIvan Magalhaes QUALIFIED
Emily WhobreyJapanStephen Shaw PROPOSAL
Emily WhobreyAustraliaAmy Elsner QUALIFIED
James ButtIndiaElwin Sharvill UNQUALIFIED
Costa DilliardJapanXuxue Feng RENEWAL
Kadeem FlosiBrazilAnna Fali RENEWAL
Faith GillianUnited KingdomAmy Elsner PROPOSAL
Alejandro PerinSpainXuxue Feng NEW
Claire TollnerJapanStephen Shaw QUALIFIED
Murillo MaletGermanyAnna Fali RENEWAL
Ashley DoeBrazilAmy Elsner NEGOTIATION
James ButtBrazilElwin Sharvill RENEWAL
Octavia MaletArgentinaXuxue Feng QUALIFIED
Johnson SergiBrazilXuxue Feng PROPOSAL
Mayumi KolmetzFranceBernardo Dominic NEW
Leon OldroydAustraliaOnyama Limba QUALIFIED
Jefferson SchemmerRussiaElwin Sharvill NEGOTIATION
Greenwood BologniaRussiaOnyama Limba NEGOTIATION
Aditya KuskoFranceAmy Elsner UNQUALIFIED
Nicolas IturbideIndiaAmy Elsner PROPOSAL
Chavez BriddickAustraliaIvan Magalhaes QUALIFIED
Frozen Columns
Name
Cody Saylors
Arvin Albares
David Darakjy
Ivar Paprocki
Sinclair Waycott
Emily Whobrey
Ashley Doe
Jennifer Amigon
Kaitlin Ostrosky
Clifford Rim
Jefferson Schemmer
Greenwood Bolognia
Ashley Doe
Aditya Kusko
Claire Tollner
Mayumi Kolmetz
Jones Vocelka
Faith Gillian
James Butt
Claire Tollner
Leja Caldarera
Rodrigues Campain
Morrow Ruta
Deepesh Chui
Maria Marrier
Morrow Ruta
Kaitlin Ostrosky
Leja Caldarera
Munro Ferencz
Deepesh Chui
Izzy Garufi
Murillo Malet
Ricardo Gaucho
Emily Whobrey
Leja Caldarera
Smith Glick
Chavez Briddick
Kadeem Flosi
James Butt
Jennifer Amigon
Antonio Caudy
Deepesh Chui
Jennifer Amigon
Faith Gillian
Ricardo Gaucho
Mayumi Kolmetz
Tony Foller
Alejandro Perin
Emily Whobrey
Arvin Albares
IdCountryDate
1000Japan2026-05-06
1001Japan2026-04-30
1002India2026-05-18
1003Japan2026-05-06
1004Russia2026-05-01
1005Brazil2026-05-21
1006Russia2026-05-05
1007Canada2026-05-13
1008Spain2026-05-25
1009Canada2026-05-11
1010Japan2026-05-06
1011Russia2026-05-01
1012Brazil2026-05-05
1013India2026-05-29
1014Italy2026-05-15
1015Spain2026-05-13
1016Italy2026-05-07
1017Canada2026-05-16
1018Canada2026-05-24
1019Germany2026-05-02
1020India2026-05-02
1021Canada2026-05-28
1022Canada2026-05-01
1023Brazil2026-04-30
1024Spain2026-05-24
1025Japan2026-05-29
1026India2026-05-29
1027Italy2026-05-11
1028Spain2026-05-08
1029Germany2026-05-25
1030Argentina2026-05-17
1031Brazil2026-05-03
1032Brazil2026-05-14
1033Italy2026-05-24
1034United Kingdom2026-05-15
1035France2026-05-15
1036Italy2026-05-07
1037Spain2026-05-13
1038Italy2026-05-17
1039Argentina2026-05-24
1040United Kingdom2026-05-18
1041United Kingdom2026-05-05
1042Argentina2026-05-03
1043Italy2026-05-24
1044France2026-05-07
1045United Kingdom2026-05-21
1046India2026-05-27
1047Argentina2026-05-15
1048Argentina2026-05-29
1049Australia2026-04-30

On-Demand Data

NameIdCountryDate
Ashley Doe1000France2026-05-17
Silvio Slusarski1001Germany2026-05-18
Maria Marrier1002Canada2026-05-20
Wickens Nestle1003United Kingdom2026-05-20
Francesco Shinko1004France2026-05-25
Maria Marrier1005Italy2026-05-26
Isabel Bowley1006Spain2026-05-09
Aruna Figeroa1007Argentina2026-05-02
Mujtaba Nicka1008Japan2026-05-05
Aditya Kusko1009Germany2026-05-22
Jennifer Amigon1010Japan2026-05-06
Julie Stenseth1011Spain2026-05-11
Rodrigues Campain1012Brazil2026-05-12
Adams Morasca1013France2026-05-13
Johnson Sergi1014India2026-05-09
Izzy Garufi1015Argentina2026-05-25
Aruna Figeroa1016United Kingdom2026-05-08
Alejandro Perin1017Brazil2026-05-23
Chavez Briddick1018Italy2026-05-17
Munro Ferencz1019United Kingdom2026-05-14
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Sinclair WaycottBrazilBernardo Dominic RENEWAL
Wickens NestleAustraliaElwin Sharvill NEGOTIATION
Faith GillianFranceBernardo Dominic QUALIFIED
Claire TollnerAustraliaIoni Bowcher PROPOSAL
Chavez BriddickUnited KingdomAmy Elsner NEW
Leja CaldareraJapanIoni Bowcher NEGOTIATION
Aruna FigeroaCanadaAsiya Javayant QUALIFIED
Aruna FigeroaUnited KingdomAsiya Javayant UNQUALIFIED
Jennifer AmigonBrazilAsiya Javayant RENEWAL
Aditya KuskoItalyElwin Sharvill UNQUALIFIED
Leja CaldareraBrazilOnyama Limba NEGOTIATION
Aruna FigeroaBrazilOnyama Limba PROPOSAL
Sinclair WaycottGermanyBernardo Dominic PROPOSAL
Misaki RoysterSpainXuxue Feng NEW
Clifford RimJapanBernardo Dominic NEGOTIATION
Munro FerenczArgentinaXuxue Feng PROPOSAL
Aditya KuskoGermanyXuxue Feng QUALIFIED
Deepesh ChuiIndiaAmy Elsner NEGOTIATION
Leja CaldareraArgentinaStephen Shaw NEGOTIATION
Chavez BriddickArgentinaAsiya Javayant QUALIFIED
Aruna FigeroaSpainIvan Magalhaes QUALIFIED
Julie StensethGermanyIvan Magalhaes UNQUALIFIED
Emily WhobreyGermanyAnna Fali QUALIFIED
Isabel BowleyItalyBernardo Dominic RENEWAL
Jones VocelkaGermanyIvan Magalhaes QUALIFIED
Silvio SlusarskiRussiaXuxue Feng NEW
Maria MarrierArgentinaAmy Elsner UNQUALIFIED
Murillo MaletSpainBernardo Dominic NEW
Clifford RimSpainStephen Shaw NEGOTIATION
Misaki RoysterSpainIoni Bowcher RENEWAL
Ivar PaprockiSpainElwin Sharvill PROPOSAL
Antonio CaudyIndiaXuxue Feng RENEWAL
David DarakjyUnited KingdomIvan Magalhaes PROPOSAL
Alejandro PerinArgentinaAnna Fali PROPOSAL
Deepesh ChuiUnited KingdomOnyama Limba NEW
Murillo MaletCanadaAsiya Javayant NEW
Morrow RutaBrazilAmy Elsner UNQUALIFIED
Morrow RutaAustraliaBernardo Dominic NEGOTIATION
Kadeem FlosiCanadaBernardo Dominic PROPOSAL
Jennifer AmigonArgentinaStephen Shaw 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>