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
Maisha RulapaughItalyAsiya Javayant NEW
Octavia MaletBrazilAnna Fali UNQUALIFIED
Alejandro PerinCanadaOnyama Limba NEGOTIATION
Mayumi KolmetzUnited KingdomAmy Elsner PROPOSAL
Ricardo GauchoCanadaBernardo Dominic NEGOTIATION
Salvatore StockhamUnited KingdomIvan Magalhaes QUALIFIED
Clifford RimSpainOnyama Limba RENEWAL
Morrow RutaFranceIoni Bowcher NEW
Deepesh ChuiUnited KingdomBernardo Dominic UNQUALIFIED
Ashley DoeArgentinaAnna Fali NEW
Darci PoquetteItalyElwin Sharvill NEGOTIATION
Arvin AlbaresAustraliaAnna Fali NEGOTIATION
Leja CaldareraRussiaOnyama Limba UNQUALIFIED
Octavia MaletJapanIoni Bowcher RENEWAL
Darci PoquetteBrazilIvan Magalhaes NEGOTIATION
Chavez BriddickGermanyAmy Elsner NEGOTIATION
Sinclair WaycottItalyAsiya Javayant QUALIFIED
Arvin AlbaresCanadaXuxue Feng NEGOTIATION
Mayumi KolmetzRussiaXuxue Feng NEGOTIATION
Ivar PaprockiBrazilElwin Sharvill RENEWAL
Johnson SergiArgentinaAnna Fali NEW
Claire TollnerItalyIvan Magalhaes QUALIFIED
Claire TollnerRussiaXuxue Feng PROPOSAL
Morrow RutaArgentinaBernardo Dominic RENEWAL
Maisha RulapaughSpainIvan Magalhaes QUALIFIED
Leja CaldareraRussiaBernardo Dominic NEGOTIATION
Antonio CaudyCanadaAmy Elsner UNQUALIFIED
Izzy GarufiRussiaIoni Bowcher NEW
Tony FollerFranceElwin Sharvill NEGOTIATION
Morrow RutaFranceIvan Magalhaes NEGOTIATION
Murillo MaletArgentinaIoni Bowcher PROPOSAL
Arvin AlbaresBrazilOnyama Limba QUALIFIED
Ricardo GauchoAustraliaIoni Bowcher QUALIFIED
Mujtaba NickaGermanyXuxue Feng NEW
Darci PoquetteIndiaOnyama Limba NEGOTIATION
Mayumi KolmetzJapanAsiya Javayant QUALIFIED
Johnson SergiUnited KingdomAnna Fali NEGOTIATION
Stacey MacleadGermanyElwin Sharvill NEW
Jefferson SchemmerAustraliaIoni Bowcher UNQUALIFIED
Ashley DoeRussiaXuxue Feng PROPOSAL
Murillo MaletJapanElwin Sharvill RENEWAL
Aditya KuskoIndiaIvan Magalhaes RENEWAL
James ButtCanadaElwin Sharvill RENEWAL
Darci PoquetteArgentinaIoni Bowcher NEGOTIATION
Johnson SergiAustraliaAmy Elsner QUALIFIED
Leon OldroydSpainAnna Fali PROPOSAL
Isabel BowleyBrazilAmy Elsner NEW
Emily WhobreyGermanyXuxue Feng UNQUALIFIED
Jones VocelkaBrazilStephen Shaw PROPOSAL
Clifford RimBrazilBernardo Dominic RENEWAL
Horizontal
NameCountryRepresentativeStatus
Isabel BowleyIndiaAsiya Javayant PROPOSAL
Tony FollerSpainBernardo Dominic NEGOTIATION
Murillo MaletJapanBernardo Dominic NEGOTIATION
Octavia MaletIndiaElwin Sharvill NEW
Izzy GarufiAustraliaIoni Bowcher QUALIFIED
Mayumi KolmetzJapanIoni Bowcher PROPOSAL
Cody SaylorsGermanyXuxue Feng NEGOTIATION
Darci PoquetteIndiaXuxue Feng NEGOTIATION
Maisha RulapaughAustraliaXuxue Feng UNQUALIFIED
Ashley DoeGermanyXuxue Feng UNQUALIFIED
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Nicolas IturbideAustralia2025-08-12Feltz Printing Service PROPOSAL63Bernardo Dominic
1001Deepesh ChuiRussia2025-08-03Benton, John B Jr NEW98Anna Fali
1002Alejandro PerinArgentina2025-08-14Printing Dimensions PROPOSAL93Ioni Bowcher
1003Stacey MacleadUnited Kingdom2025-08-14Feltz Printing Service NEW26Amy Elsner
1004Jeanfrancois VenereCanada2025-08-24Rousseaux, Michael Esq UNQUALIFIED74Ivan Magalhaes
1005Cody SaylorsBrazil2025-08-06Rousseaux, Michael Esq PROPOSAL93Anna Fali
1006Deepesh ChuiUnited Kingdom2025-08-16Chapman, Ross E Esq UNQUALIFIED43Elwin Sharvill
1007Emily WhobreyIndia2025-08-22Benton, John B Jr QUALIFIED76Anna Fali
1008Jeanfrancois VenereCanada2025-08-13Dorl, James J Esq PROPOSAL70Elwin Sharvill
1009Izzy GarufiJapan2025-08-21Dorl, James J Esq NEGOTIATION78Stephen Shaw
1010Stacey MacleadJapan2025-08-02Feltz Printing Service UNQUALIFIED3Anna Fali
1011Leja CaldareraBrazil2025-07-29Feltz Printing Service NEW54Bernardo Dominic
1012Jones VocelkaAustralia2025-07-31Commercial Press RENEWAL71Ivan Magalhaes
1013Morrow RutaSpain2025-08-24King, Christopher A Esq UNQUALIFIED67Ivan Magalhaes
1014Jones VocelkaUnited Kingdom2025-08-14Chapman, Ross E Esq NEGOTIATION46Onyama Limba
1015James ButtSpain2025-07-29Rousseaux, Michael Esq NEGOTIATION9Elwin Sharvill
1016Mujtaba NickaAustralia2025-08-08Dorl, James J Esq QUALIFIED93Elwin Sharvill
1017Deepesh ChuiCanada2025-08-12Commercial Press NEGOTIATION85Amy Elsner
1018Johnson SergiRussia2025-08-04Chanay, Jeffrey A Esq UNQUALIFIED74Ivan Magalhaes
1019Deepesh ChuiArgentina2025-08-09Chemel, James L Cpa NEGOTIATION5Asiya Javayant
1020Emily WhobreyGermany2025-08-20King, Christopher A Esq PROPOSAL4Xuxue Feng
1021Silvio SlusarskiBrazil2025-08-18Rousseaux, Michael Esq NEGOTIATION37Ivan Magalhaes
1022Maria MarrierCanada2025-08-16Morlong Associates NEGOTIATION48Elwin Sharvill
1023Jeanfrancois VenereAustralia2025-08-14Chanay, Jeffrey A Esq UNQUALIFIED26Stephen Shaw
1024Rodrigues CampainAustralia2025-08-07Benton, John B Jr UNQUALIFIED80Anna Fali
1025Julie StensethIndia2025-08-03Truhlar And Truhlar Attys NEW22Bernardo Dominic
1026Leon OldroydRussia2025-08-24Morlong Associates NEW75Elwin Sharvill
1027Aika InouyeRussia2025-07-31King, Christopher A Esq RENEWAL51Amy Elsner
1028Adams MorascaArgentina2025-08-10Chemel, James L Cpa PROPOSAL83Anna Fali
1029Ashley DoeIndia2025-08-01Chanay, Jeffrey A Esq NEW76Asiya Javayant
1030Alejandro PerinUnited Kingdom2025-07-27Feiner Bros QUALIFIED18Stephen Shaw
1031Izzy GarufiGermany2025-08-20Benton, John B Jr NEW13Ivan Magalhaes
1032Chavez BriddickJapan2025-08-09Morlong Associates PROPOSAL0Onyama Limba
1033Aruna FigeroaAustralia2025-07-31Dorl, James J Esq PROPOSAL65Ivan Magalhaes
1034Faith GillianBrazil2025-08-17Commercial Press NEW95Asiya Javayant
1035Kaitlin OstroskyRussia2025-08-19Buckley Miller Wright RENEWAL58Amy Elsner
1036Nicolas IturbideJapan2025-08-09Truhlar And Truhlar Attys QUALIFIED48Asiya Javayant
1037Jefferson SchemmerItaly2025-07-27Printing Dimensions NEGOTIATION65Anna Fali
1038Octavia MaletUnited Kingdom2025-08-21Commercial Press QUALIFIED13Bernardo Dominic
1039Stacey MacleadJapan2025-08-06King, Christopher A Esq NEW7Stephen Shaw
1040Rodrigues CampainAustralia2025-08-18Benton, John B Jr QUALIFIED9Anna Fali
1041Jefferson SchemmerRussia2025-08-21Chemel, James L Cpa QUALIFIED14Xuxue Feng
1042Deepesh ChuiJapan2025-08-16Printing Dimensions RENEWAL5Xuxue Feng
1043Smith GlickGermany2025-08-11Truhlar And Truhlar Attys NEGOTIATION16Ivan Magalhaes
1044Arvin AlbaresCanada2025-08-06Chanay, Jeffrey A Esq NEW28Amy Elsner
1045Leja CaldareraSpain2025-08-15Benton, John B Jr NEGOTIATION10Ivan Magalhaes
1046Tony FollerBrazil2025-08-02Truhlar And Truhlar Attys RENEWAL53Asiya Javayant
1047Octavia MaletUnited Kingdom2025-08-16Feiner Bros NEGOTIATION67Ioni Bowcher
1048Juan WieserJapan2025-08-15Benton, John B Jr QUALIFIED22Bernardo Dominic
1049James ButtBrazil2025-08-09Printing Dimensions PROPOSAL44Ioni Bowcher
Frozen Rows
NameCountryRepresentativeStatus
Tony FollerUnited KingdomIvan Magalhaes NEW
Adams MorascaArgentinaElwin Sharvill NEW
Francesco ShinkoCanadaIvan Magalhaes RENEWAL
Aditya KuskoItalyIvan Magalhaes NEGOTIATION
Aika InouyeAustraliaAmy Elsner UNQUALIFIED
Johnson SergiIndiaIoni Bowcher PROPOSAL
Faith GillianUnited KingdomStephen Shaw RENEWAL
Ashley DoeIndiaStephen Shaw PROPOSAL
Jennifer AmigonItalyAmy Elsner QUALIFIED
Octavia MaletAustraliaIvan Magalhaes QUALIFIED
Johnson SergiAustraliaElwin Sharvill NEW
Greenwood BologniaBrazilAnna Fali QUALIFIED
Maisha RulapaughJapanAnna Fali RENEWAL
Alejandro PerinRussiaAnna Fali RENEWAL
Mujtaba NickaArgentinaOnyama Limba UNQUALIFIED
Rodrigues CampainSpainAmy Elsner NEW
Kaitlin OstroskyUnited KingdomOnyama Limba RENEWAL
Cody SaylorsUnited KingdomIoni Bowcher NEW
Stacey MacleadRussiaAnna Fali NEW
Kadeem FlosiBrazilElwin Sharvill UNQUALIFIED
Nicolas IturbideIndiaAmy Elsner PROPOSAL
Antonio CaudyFranceAnna Fali UNQUALIFIED
Jefferson SchemmerCanadaStephen Shaw QUALIFIED
Leon OldroydGermanyStephen Shaw NEGOTIATION
Salvatore StockhamArgentinaBernardo Dominic QUALIFIED
Maria MarrierUnited KingdomAsiya Javayant PROPOSAL
Salvatore StockhamBrazilAnna Fali PROPOSAL
Aditya KuskoJapanIoni Bowcher QUALIFIED
Smith GlickAustraliaIvan Magalhaes PROPOSAL
Ivar PaprockiAustraliaAmy Elsner RENEWAL
Adams MorascaFranceAmy Elsner PROPOSAL
Costa DilliardGermanyAsiya Javayant NEW
Octavia MaletAustraliaIvan Magalhaes NEGOTIATION
Smith GlickCanadaAnna Fali NEGOTIATION
Leja CaldareraUnited KingdomElwin Sharvill UNQUALIFIED
Claire TollnerCanadaElwin Sharvill PROPOSAL
Isabel BowleySpainIoni Bowcher NEW
Octavia MaletRussiaXuxue Feng PROPOSAL
Munro FerenczSpainElwin Sharvill QUALIFIED
Greenwood BologniaSpainIvan Magalhaes NEGOTIATION
Jones VocelkaAustraliaElwin Sharvill RENEWAL
James ButtUnited KingdomXuxue Feng PROPOSAL
Salvatore StockhamSpainXuxue Feng NEW
Kaitlin OstroskyGermanyAmy Elsner QUALIFIED
Leja CaldareraCanadaAsiya Javayant RENEWAL
Claire TollnerIndiaBernardo Dominic NEW
Francesco ShinkoCanadaStephen Shaw PROPOSAL
Aditya KuskoArgentinaBernardo Dominic NEGOTIATION
Jones VocelkaRussiaAmy Elsner QUALIFIED
Adams MorascaJapanElwin Sharvill NEGOTIATION
Frozen Columns
Name
Jeanfrancois Venere
Smith Glick
Izzy Garufi
Arvin Albares
Ashley Doe
Darci Poquette
Alejandro Perin
Clifford Rim
Izzy Garufi
Stacey Maclead
Darci Poquette
Darci Poquette
Izzy Garufi
Aditya Kusko
Kaitlin Ostrosky
Silvio Slusarski
Julie Stenseth
Antonio Caudy
Kadeem Flosi
Salvatore Stockham
Aruna Figeroa
Ashley Doe
Julie Stenseth
Mujtaba Nicka
Aruna Figeroa
Maisha Rulapaugh
Maisha Rulapaugh
Izzy Garufi
James Butt
Kaitlin Ostrosky
Francesco Shinko
Silvio Slusarski
Johnson Sergi
Jennifer Amigon
David Darakjy
Clifford Rim
Aditya Kusko
Rodrigues Campain
Salvatore Stockham
Aika Inouye
Smith Glick
Ricardo Gaucho
Stacey Maclead
Aika Inouye
Ashley Doe
Ricardo Gaucho
Leon Oldroyd
Aika Inouye
Jefferson Schemmer
Murillo Malet
IdCountryDate
1000Japan2025-08-23
1001United Kingdom2025-07-29
1002Argentina2025-08-20
1003Russia2025-08-22
1004United Kingdom2025-08-01
1005Canada2025-08-03
1006Canada2025-08-15
1007Russia2025-08-25
1008Brazil2025-08-21
1009Russia2025-08-22
1010Germany2025-07-30
1011India2025-07-29
1012India2025-08-21
1013United Kingdom2025-08-21
1014United Kingdom2025-08-07
1015Spain2025-08-25
1016Argentina2025-08-09
1017United Kingdom2025-07-30
1018France2025-08-08
1019Germany2025-08-11
1020Canada2025-08-19
1021Australia2025-08-16
1022Japan2025-08-25
1023India2025-08-15
1024Brazil2025-08-02
1025Germany2025-08-04
1026France2025-08-02
1027Australia2025-08-21
1028France2025-08-19
1029India2025-08-15
1030India2025-08-14
1031Russia2025-08-16
1032Spain2025-08-23
1033Brazil2025-07-28
1034Spain2025-08-07
1035Italy2025-08-18
1036Argentina2025-08-25
1037Canada2025-08-11
1038Canada2025-08-02
1039Canada2025-08-24
1040Argentina2025-08-15
1041Russia2025-07-28
1042Australia2025-07-29
1043Germany2025-08-25
1044Italy2025-07-27
1045United Kingdom2025-08-15
1046Spain2025-08-21
1047India2025-08-07
1048Argentina2025-08-16
1049Spain2025-08-12

On-Demand Data

NameIdCountryDate
Munro Ferencz1000Canada2025-08-21
Leon Oldroyd1001Argentina2025-08-20
Francesco Shinko1002France2025-07-30
Wickens Nestle1003Argentina2025-08-06
Murillo Malet1004Argentina2025-07-27
Cody Saylors1005France2025-08-01
Greenwood Bolognia1006Canada2025-07-27
Octavia Malet1007United Kingdom2025-07-28
Faith Gillian1008United Kingdom2025-08-21
Stacey Maclead1009Spain2025-08-14
David Darakjy1010United Kingdom2025-08-08
Deepesh Chui1011Argentina2025-08-10
Rodrigues Campain1012Italy2025-07-30
Jeanfrancois Venere1013United Kingdom2025-08-18
Morrow Ruta1014Argentina2025-08-21
David Darakjy1015Australia2025-08-16
Kaitlin Ostrosky1016Brazil2025-08-25
James Butt1017United Kingdom2025-08-21
Johnson Sergi1018Spain2025-08-25
Tony Foller1019Russia2025-08-24
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Mujtaba NickaBrazilStephen Shaw RENEWAL
Darci PoquetteBrazilIvan Magalhaes NEW
Jones VocelkaItalyAmy Elsner UNQUALIFIED
Salvatore StockhamGermanyOnyama Limba NEW
David DarakjyArgentinaAmy Elsner UNQUALIFIED
Octavia MaletGermanyOnyama Limba NEGOTIATION
Ricardo GauchoArgentinaStephen Shaw QUALIFIED
Jones VocelkaFranceAnna Fali QUALIFIED
Salvatore StockhamUnited KingdomIoni Bowcher NEGOTIATION
Mujtaba NickaCanadaStephen Shaw RENEWAL
Sinclair WaycottItalyAmy Elsner UNQUALIFIED
Antonio CaudyJapanAmy Elsner RENEWAL
Darci PoquetteGermanyAsiya Javayant NEGOTIATION
Ashley DoeBrazilElwin Sharvill QUALIFIED
Aika InouyeBrazilAnna Fali UNQUALIFIED
Munro FerenczRussiaIvan Magalhaes RENEWAL
Jones VocelkaRussiaIoni Bowcher RENEWAL
Tony FollerItalyAmy Elsner NEGOTIATION
Ivar PaprockiAustraliaStephen Shaw NEGOTIATION
Juan WieserCanadaXuxue Feng NEW
Maisha RulapaughSpainStephen Shaw RENEWAL
Johnson SergiBrazilOnyama Limba NEW
Johnson SergiAustraliaAsiya Javayant UNQUALIFIED
Aditya KuskoBrazilXuxue Feng UNQUALIFIED
Greenwood BologniaFranceAnna Fali UNQUALIFIED
Murillo MaletFranceAsiya Javayant UNQUALIFIED
David DarakjyBrazilIvan Magalhaes QUALIFIED
Ivar PaprockiItalyIvan Magalhaes NEGOTIATION
Darci PoquetteCanadaElwin Sharvill UNQUALIFIED
Aditya KuskoJapanIvan Magalhaes PROPOSAL
Nicolas IturbideUnited KingdomIoni Bowcher RENEWAL
Leon OldroydUnited KingdomAnna Fali PROPOSAL
Mujtaba NickaSpainOnyama Limba RENEWAL
Leon OldroydRussiaBernardo Dominic PROPOSAL
Wickens NestleIndiaXuxue Feng QUALIFIED
Nicolas IturbideFranceXuxue Feng RENEWAL
Isabel BowleyArgentinaAnna Fali NEW
Cody SaylorsBrazilIoni Bowcher UNQUALIFIED
Deepesh ChuiItalyXuxue Feng NEW
Jennifer AmigonGermanyAmy Elsner NEGOTIATION

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