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
Silvio SlusarskiUnited KingdomBernardo Dominic NEW
Aditya KuskoSpainAnna Fali QUALIFIED
Arvin AlbaresJapanXuxue Feng QUALIFIED
Smith GlickAustraliaStephen Shaw QUALIFIED
Ashley DoeJapanStephen Shaw RENEWAL
Arvin AlbaresAustraliaAmy Elsner NEGOTIATION
Jeanfrancois VenereCanadaIoni Bowcher PROPOSAL
Emily WhobreyBrazilAsiya Javayant RENEWAL
Ashley DoeJapanIvan Magalhaes QUALIFIED
Misaki RoysterJapanOnyama Limba PROPOSAL
Cody SaylorsFranceOnyama Limba PROPOSAL
Aruna FigeroaJapanAsiya Javayant UNQUALIFIED
Ricardo GauchoIndiaStephen Shaw PROPOSAL
James ButtUnited KingdomBernardo Dominic RENEWAL
Ivar PaprockiUnited KingdomAmy Elsner PROPOSAL
Kadeem FlosiUnited KingdomXuxue Feng NEW
Johnson SergiGermanyAnna Fali UNQUALIFIED
Clifford RimJapanElwin Sharvill NEGOTIATION
Antonio CaudyUnited KingdomIoni Bowcher QUALIFIED
Emily WhobreyFranceIoni Bowcher NEW
Chavez BriddickSpainAnna Fali PROPOSAL
Salvatore StockhamRussiaElwin Sharvill NEGOTIATION
Johnson SergiIndiaXuxue Feng PROPOSAL
Misaki RoysterGermanyIoni Bowcher QUALIFIED
Adams MorascaUnited KingdomIvan Magalhaes NEGOTIATION
Murillo MaletFranceBernardo Dominic NEGOTIATION
Claire TollnerArgentinaIvan Magalhaes NEGOTIATION
Kadeem FlosiGermanyElwin Sharvill NEGOTIATION
Ashley DoeSpainAnna Fali PROPOSAL
Clifford RimJapanElwin Sharvill UNQUALIFIED
Mayumi KolmetzAustraliaAnna Fali UNQUALIFIED
Sinclair WaycottRussiaStephen Shaw RENEWAL
Mujtaba NickaRussiaXuxue Feng QUALIFIED
James ButtIndiaIvan Magalhaes UNQUALIFIED
Izzy GarufiUnited KingdomIoni Bowcher NEGOTIATION
Silvio SlusarskiGermanyOnyama Limba PROPOSAL
Darci PoquetteSpainAmy Elsner QUALIFIED
Stacey MacleadJapanOnyama Limba NEGOTIATION
Kadeem FlosiFranceOnyama Limba UNQUALIFIED
Ashley DoeGermanyOnyama Limba NEGOTIATION
Silvio SlusarskiJapanAmy Elsner PROPOSAL
Kaitlin OstroskySpainOnyama Limba RENEWAL
James ButtJapanIoni Bowcher NEW
Stacey MacleadRussiaStephen Shaw NEW
Francesco ShinkoJapanXuxue Feng NEGOTIATION
Kadeem FlosiItalyIoni Bowcher QUALIFIED
Jefferson SchemmerRussiaAnna Fali NEW
Julie StensethCanadaIvan Magalhaes RENEWAL
Arvin AlbaresCanadaIoni Bowcher NEW
Antonio CaudyCanadaAmy Elsner UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Costa DilliardGermanyOnyama Limba QUALIFIED
Alejandro PerinGermanyBernardo Dominic QUALIFIED
Jones VocelkaBrazilElwin Sharvill RENEWAL
Darci PoquetteGermanyBernardo Dominic UNQUALIFIED
Adams MorascaUnited KingdomIvan Magalhaes PROPOSAL
Silvio SlusarskiIndiaStephen Shaw NEGOTIATION
Aika InouyeGermanyAnna Fali NEGOTIATION
David DarakjyFranceIvan Magalhaes NEGOTIATION
Morrow RutaIndiaIvan Magalhaes PROPOSAL
Silvio SlusarskiFranceAsiya Javayant NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Sinclair WaycottBrazil2026-05-30Chanay, Jeffrey A Esq NEW90Ioni Bowcher
1001Rodrigues CampainItaly2026-06-05Chanay, Jeffrey A Esq NEGOTIATION92Ioni Bowcher
1002Octavia MaletBrazil2026-06-05Printing Dimensions NEGOTIATION36Amy Elsner
1003Octavia MaletSpain2026-05-11Morlong Associates NEGOTIATION8Stephen Shaw
1004Cody SaylorsSpain2026-05-29Morlong Associates RENEWAL21Ioni Bowcher
1005Misaki RoysterSpain2026-05-31Chanay, Jeffrey A Esq UNQUALIFIED91Onyama Limba
1006Francesco ShinkoAustralia2026-05-20Chapman, Ross E Esq NEW67Anna Fali
1007Ricardo GauchoIndia2026-05-12Chanay, Jeffrey A Esq QUALIFIED96Elwin Sharvill
1008Jennifer AmigonCanada2026-05-13Feltz Printing Service QUALIFIED38Ioni Bowcher
1009Jennifer AmigonRussia2026-05-15Dorl, James J Esq RENEWAL43Ioni Bowcher
1010Mujtaba NickaArgentina2026-05-29Chapman, Ross E Esq NEGOTIATION11Anna Fali
1011Johnson SergiRussia2026-05-21Rangoni Of Florence RENEWAL96Amy Elsner
1012Morrow RutaUnited Kingdom2026-06-05Chapman, Ross E Esq NEGOTIATION46Ioni Bowcher
1013Faith GillianRussia2026-06-03Chanay, Jeffrey A Esq NEW90Amy Elsner
1014Morrow RutaCanada2026-05-27Truhlar And Truhlar Attys QUALIFIED35Amy Elsner
1015Chavez BriddickCanada2026-05-24Rangoni Of Florence QUALIFIED31Asiya Javayant
1016Silvio SlusarskiJapan2026-06-02Chemel, James L Cpa QUALIFIED91Ivan Magalhaes
1017Jefferson SchemmerGermany2026-05-24Rangoni Of Florence RENEWAL88Bernardo Dominic
1018David DarakjyJapan2026-06-01Morlong Associates PROPOSAL48Anna Fali
1019Murillo MaletRussia2026-06-03Dorl, James J Esq NEGOTIATION82Stephen Shaw
1020David DarakjySpain2026-05-22Dorl, James J Esq NEGOTIATION8Stephen Shaw
1021Darci PoquetteFrance2026-05-11Printing Dimensions QUALIFIED14Ioni Bowcher
1022Isabel BowleyItaly2026-06-07Commercial Press UNQUALIFIED35Elwin Sharvill
1023Salvatore StockhamGermany2026-05-14Truhlar And Truhlar Attys QUALIFIED32Anna Fali
1024James ButtItaly2026-05-31Chapman, Ross E Esq RENEWAL91Bernardo Dominic
1025Smith GlickArgentina2026-05-14Feiner Bros NEGOTIATION66Xuxue Feng
1026Munro FerenczBrazil2026-05-22Truhlar And Truhlar Attys PROPOSAL54Anna Fali
1027Darci PoquetteGermany2026-06-06Feiner Bros RENEWAL16Stephen Shaw
1028James ButtIndia2026-05-20King, Christopher A Esq NEW10Ivan Magalhaes
1029Stacey MacleadRussia2026-05-19Printing Dimensions NEW46Xuxue Feng
1030Morrow RutaRussia2026-06-01Feiner Bros QUALIFIED9Anna Fali
1031Ricardo GauchoAustralia2026-06-01Chapman, Ross E Esq PROPOSAL44Amy Elsner
1032Salvatore StockhamCanada2026-05-11Benton, John B Jr NEW1Amy Elsner
1033Adams MorascaBrazil2026-05-12Chemel, James L Cpa PROPOSAL63Stephen Shaw
1034David DarakjyGermany2026-05-19Truhlar And Truhlar Attys NEW56Ivan Magalhaes
1035Sinclair WaycottFrance2026-05-24Printing Dimensions QUALIFIED14Anna Fali
1036Darci PoquetteBrazil2026-06-08Printing Dimensions QUALIFIED44Amy Elsner
1037Leja CaldareraAustralia2026-05-26Printing Dimensions RENEWAL46Asiya Javayant
1038Ricardo GauchoSpain2026-05-19Benton, John B Jr QUALIFIED61Xuxue Feng
1039Rodrigues CampainGermany2026-05-18Morlong Associates NEGOTIATION38Elwin Sharvill
1040Julie StensethIndia2026-05-22Buckley Miller Wright NEW21Elwin Sharvill
1041Faith GillianGermany2026-05-16Feltz Printing Service NEGOTIATION27Ivan Magalhaes
1042Costa DilliardIndia2026-05-20Rangoni Of Florence UNQUALIFIED35Asiya Javayant
1043Arvin AlbaresItaly2026-06-08Feltz Printing Service NEGOTIATION67Ioni Bowcher
1044Ashley DoeJapan2026-05-17Rangoni Of Florence QUALIFIED70Asiya Javayant
1045Misaki RoysterRussia2026-05-21Morlong Associates PROPOSAL34Elwin Sharvill
1046Darci PoquetteSpain2026-05-14Dorl, James J Esq PROPOSAL76Ioni Bowcher
1047Aruna FigeroaArgentina2026-06-09Chemel, James L Cpa QUALIFIED76Xuxue Feng
1048Mayumi KolmetzCanada2026-05-31Feiner Bros UNQUALIFIED95Ivan Magalhaes
1049Nicolas IturbideSpain2026-05-17Chemel, James L Cpa PROPOSAL68Amy Elsner
Frozen Rows
NameCountryRepresentativeStatus
Mujtaba NickaIndiaXuxue Feng QUALIFIED
Cody SaylorsFranceAsiya Javayant NEW
Salvatore StockhamArgentinaOnyama Limba RENEWAL
Emily WhobreyArgentinaIoni Bowcher QUALIFIED
Jeanfrancois VenereCanadaIvan Magalhaes NEW
Costa DilliardJapanAmy Elsner PROPOSAL
Salvatore StockhamJapanAnna Fali NEGOTIATION
Misaki RoysterAustraliaBernardo Dominic NEW
Leon OldroydGermanyAsiya Javayant NEGOTIATION
Jennifer AmigonAustraliaStephen Shaw PROPOSAL
Kaitlin OstroskyFranceBernardo Dominic NEGOTIATION
Ivar PaprockiSpainAnna Fali NEGOTIATION
Chavez BriddickSpainOnyama Limba RENEWAL
Leja CaldareraItalyElwin Sharvill UNQUALIFIED
Maria MarrierItalyAmy Elsner NEW
Claire TollnerItalyAnna Fali PROPOSAL
Jones VocelkaCanadaBernardo Dominic PROPOSAL
Faith GillianIndiaOnyama Limba RENEWAL
Munro FerenczUnited KingdomAsiya Javayant NEW
David DarakjyArgentinaAmy Elsner RENEWAL
Chavez BriddickSpainIoni Bowcher UNQUALIFIED
Stacey MacleadCanadaIoni Bowcher QUALIFIED
Izzy GarufiFranceOnyama Limba NEGOTIATION
Salvatore StockhamItalyXuxue Feng NEW
Claire TollnerItalyOnyama Limba NEGOTIATION
Silvio SlusarskiJapanIvan Magalhaes NEGOTIATION
Cody SaylorsArgentinaAnna Fali QUALIFIED
Silvio SlusarskiUnited KingdomBernardo Dominic NEW
Mujtaba NickaCanadaAsiya Javayant NEGOTIATION
Smith GlickItalyOnyama Limba NEGOTIATION
Kaitlin OstroskyArgentinaIoni Bowcher PROPOSAL
Claire TollnerAustraliaIoni Bowcher UNQUALIFIED
Aditya KuskoRussiaIoni Bowcher QUALIFIED
Silvio SlusarskiCanadaXuxue Feng NEGOTIATION
David DarakjyBrazilIvan Magalhaes NEW
Julie StensethArgentinaBernardo Dominic RENEWAL
Mujtaba NickaBrazilAnna Fali NEW
Aditya KuskoFranceStephen Shaw UNQUALIFIED
Deepesh ChuiGermanyBernardo Dominic NEW
Izzy GarufiIndiaIvan Magalhaes NEGOTIATION
Misaki RoysterIndiaXuxue Feng UNQUALIFIED
Leja CaldareraRussiaOnyama Limba QUALIFIED
Francesco ShinkoUnited KingdomOnyama Limba UNQUALIFIED
Juan WieserIndiaElwin Sharvill NEGOTIATION
Izzy GarufiRussiaAmy Elsner NEW
Izzy GarufiGermanyAsiya Javayant RENEWAL
Aruna FigeroaUnited KingdomStephen Shaw QUALIFIED
Alejandro PerinAustraliaIvan Magalhaes UNQUALIFIED
Maisha RulapaughCanadaAnna Fali RENEWAL
Aditya KuskoFranceAmy Elsner PROPOSAL
Frozen Columns
Name
Wickens Nestle
Kaitlin Ostrosky
Maria Marrier
Octavia Malet
Maisha Rulapaugh
Izzy Garufi
Emily Whobrey
Morrow Ruta
Maria Marrier
James Butt
David Darakjy
James Butt
Jones Vocelka
Antonio Caudy
Mayumi Kolmetz
Rodrigues Campain
Smith Glick
Aika Inouye
Kaitlin Ostrosky
Morrow Ruta
Darci Poquette
Octavia Malet
Leon Oldroyd
Sinclair Waycott
Octavia Malet
Maisha Rulapaugh
Misaki Royster
Jones Vocelka
Jefferson Schemmer
Claire Tollner
Antonio Caudy
Emily Whobrey
Sinclair Waycott
Ricardo Gaucho
Silvio Slusarski
Smith Glick
Jeanfrancois Venere
Kadeem Flosi
Alejandro Perin
Maria Marrier
Deepesh Chui
Emily Whobrey
Aruna Figeroa
Jennifer Amigon
Mujtaba Nicka
Mayumi Kolmetz
Mayumi Kolmetz
Costa Dilliard
Clifford Rim
Kadeem Flosi
IdCountryDate
1000Japan2026-06-06
1001Germany2026-06-09
1002Germany2026-05-14
1003Japan2026-05-20
1004Australia2026-06-07
1005Australia2026-05-16
1006United Kingdom2026-06-03
1007United Kingdom2026-05-11
1008Argentina2026-05-23
1009Argentina2026-06-06
1010Italy2026-05-31
1011Italy2026-05-15
1012Spain2026-05-26
1013Russia2026-05-25
1014Brazil2026-05-15
1015Argentina2026-05-22
1016Argentina2026-05-23
1017Canada2026-05-27
1018India2026-06-06
1019Japan2026-05-19
1020Argentina2026-05-23
1021Canada2026-06-01
1022Argentina2026-05-24
1023India2026-05-28
1024Canada2026-06-09
1025Japan2026-05-11
1026Spain2026-05-22
1027Brazil2026-05-31
1028Canada2026-05-24
1029France2026-05-25
1030United Kingdom2026-05-25
1031Canada2026-05-22
1032Russia2026-05-14
1033Russia2026-05-13
1034France2026-06-09
1035Italy2026-05-25
1036Canada2026-05-21
1037France2026-05-20
1038United Kingdom2026-06-01
1039Germany2026-06-07
1040Italy2026-05-11
1041Argentina2026-05-19
1042Brazil2026-06-08
1043Brazil2026-06-09
1044Italy2026-05-27
1045Italy2026-05-25
1046France2026-05-26
1047Australia2026-05-23
1048France2026-06-05
1049Japan2026-05-15

On-Demand Data

NameIdCountryDate
Juan Wieser1000Italy2026-06-03
Munro Ferencz1001France2026-05-12
Juan Wieser1002Brazil2026-06-02
Costa Dilliard1003Australia2026-05-30
Murillo Malet1004Spain2026-05-23
Maisha Rulapaugh1005Argentina2026-05-13
Alejandro Perin1006Germany2026-05-29
Rodrigues Campain1007Argentina2026-05-18
Leja Caldarera1008Spain2026-05-16
Nicolas Iturbide1009Russia2026-05-31
Leon Oldroyd1010Australia2026-05-19
Adams Morasca1011Argentina2026-06-05
Maisha Rulapaugh1012Japan2026-06-01
Stacey Maclead1013Spain2026-05-25
Maisha Rulapaugh1014Brazil2026-06-08
Antonio Caudy1015Germany2026-05-18
Nicolas Iturbide1016Italy2026-05-29
Morrow Ruta1017Japan2026-05-31
Deepesh Chui1018Spain2026-06-09
Julie Stenseth1019Argentina2026-05-11
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Darci PoquetteCanadaOnyama Limba PROPOSAL
Alejandro PerinFranceElwin Sharvill QUALIFIED
Jones VocelkaIndiaAsiya Javayant UNQUALIFIED
Izzy GarufiUnited KingdomIoni Bowcher PROPOSAL
Alejandro PerinIndiaAsiya Javayant NEGOTIATION
Clifford RimArgentinaBernardo Dominic QUALIFIED
Silvio SlusarskiJapanXuxue Feng RENEWAL
Kaitlin OstroskyArgentinaIoni Bowcher RENEWAL
Jones VocelkaGermanyIoni Bowcher NEW
Isabel BowleyCanadaAsiya Javayant RENEWAL
Misaki RoysterJapanAmy Elsner QUALIFIED
Leon OldroydCanadaAnna Fali PROPOSAL
Deepesh ChuiIndiaIoni Bowcher QUALIFIED
Rodrigues CampainJapanAsiya Javayant QUALIFIED
Nicolas IturbideAustraliaIoni Bowcher NEGOTIATION
Smith GlickItalyElwin Sharvill RENEWAL
Silvio SlusarskiIndiaAsiya Javayant NEGOTIATION
Jennifer AmigonIndiaAmy Elsner NEGOTIATION
Cody SaylorsRussiaElwin Sharvill QUALIFIED
Aditya KuskoCanadaIoni Bowcher RENEWAL
Emily WhobreyJapanXuxue Feng UNQUALIFIED
Ashley DoeIndiaAmy Elsner PROPOSAL
Tony FollerArgentinaAmy Elsner NEW
Costa DilliardBrazilAsiya Javayant NEGOTIATION
Antonio CaudyIndiaAmy Elsner RENEWAL
Ashley DoeAustraliaAnna Fali PROPOSAL
David DarakjyRussiaOnyama Limba NEW
Maisha RulapaughGermanyIoni Bowcher RENEWAL
Sinclair WaycottFranceIoni Bowcher NEW
Leja CaldareraItalyAmy Elsner QUALIFIED
Johnson SergiJapanStephen Shaw NEGOTIATION
Deepesh ChuiArgentinaAsiya Javayant PROPOSAL
Ivar PaprockiSpainStephen Shaw QUALIFIED
Octavia MaletGermanyAnna Fali NEW
Antonio CaudySpainAnna Fali NEGOTIATION
Deepesh ChuiArgentinaXuxue Feng NEGOTIATION
Misaki RoysterJapanIoni Bowcher UNQUALIFIED
Juan WieserIndiaStephen Shaw NEGOTIATION
Aika InouyeSpainOnyama Limba PROPOSAL
Maria MarrierCanadaAnna Fali 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>