• Settings
    • Locale
    • Change the locale of the datepicker, schedule and client side validation messages.

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

DataTable Scroll

Both vertical and horizontal scrolling of the data is supported with optional frozen rows-columns and on-demand loading features.

DataTable Tag Documentation

DataTable is an enhanced version of the standard Datatable that provides built-in solutions to many commons use cases like paging, sorting, selection, lazy loading, filtering and more.

NameTypeRequiredDefaultDescription
id String false generated Unique identifier of the component in a namingContainer.
rendered boolean false true Boolean value to specify the rendering of the component, when set to false component will not be rendered.
binding UIComponent false generated An EL expression referring to a server side UIComponent instance in a backing bean.
widgetVar String false generated ('widget_' + componentClientId) Name of the client side widget.
allowUnsorting boolean false false Defines whether columns are allowed to be unsorted.
ariaRowLabel String false Label to read by screen readers on checkbox and radio selection.
cellEditMode String false eager Defines the cell edit behavior, valid values are "eager" and "lazy".
cellNavigation boolean false true Enables cell navigation with the keyboard for WCAG and screen reader compliance.
cellSeparator String false Separator text to use in output mode of editable cells with multiple components.
clientCache boolean false false Caches the next page asynchronously.
currentPageReportTemplate String false ({currentPage} of {totalPages}) Template of the currentPageReport UI.
dataLocale Object false The view locale Locale to be used in features such as sorting.
dir String false ltr Defines text direction, valid values are ltr and rtl.
disableContextMenuIfEmpty boolean false false Decides whether to disable context menu or not if a table has no records.
draggableColumns boolean false false Decides whether datatable columns can be reordered using dragdrop.
draggableRows boolean false false When enabled, rows can be reordered using dragdrop.
draggableRowsFunction MethodExpression false Method expression to execute after dragging row.
editInitEvent String false click Defines a client side event to open cell on editable table.
editMode String false row Defines edit mode, valid values are "row" and "cell".
editable boolean false false Controls incell editing.
editingRow boolean false false Defines if cell editors of row should be displayed as editable or not. False means display mode.
emptyMessage String false i18n Text to display when there is no data to display.
escapeText boolean false true Defines if headerText and footerText values on columns are escaped or not.
expandedRow boolean false false Defines if row should be rendered as expanded by default.
exportRowTag String false If XML data exporter in use, this allows customization of the row tag in the XML.
exportTag String false If XML data exporter in use, this allows customization of the document tag in the XML.
filterBy Object false Property to be used for filtering.
filterDelay int false 300 Delay to wait in milliseconds before sending each filter query.
filterEvent String false keyup Client side event to invoke filtering. If "enter" it will only filter after ENTER key is pressed.
filterNormalize boolean false false Defines if filtering would be done using normalized values (accents will be removed from characters).
filteredValue Object false List to keep the filtered data if filtering is enabled.
first int false 0 Index of the first data to display.
frozenColumns int false 0 Number of columns to freeze
frozenColumnsAlignment String false left Defines the alignment of frozen columns, valid values are 'left' and 'right'.
frozenRows int false 0 Number of rows to freeze starting from the beginning.
globalFilter String false Value of the global filter to use when filtering by default.
globalFilterFunction MethodExpression false Custom implementation to globally filter a value against a constraint.
globalFilterOnly boolean false false When true this will hide all column filters and allow all columns to be filtered by global filter only.
lazy boolean false True, if the value-binding is instance of LazyDataModel. Defines if lazy loading is enabled for the data component.
liveResize boolean false false Columns are resized live in this mode without using a resize helper.
liveScroll boolean false false Enables live scrolling.
liveScrollBuffer int false 0 Percentage height of the buffer between the bottom of the page and the scroll position to initiate the load for the new chunk. Value is defined in integer.
multiViewState boolean false false Whether to keep component state across views.
nativeElements boolean false false In native mode, treetable uses native checkboxes.
onExpandStart String false Client side callback to execute before row expansion.
onRowClick String false Client side callback to execute after clicking row.
pageLinks int false 10 Maximum number of page links to display.
paginator boolean false false Enables pagination.
paginatorAlwaysVisible boolean false true Defines if paginator should be hidden if total data count is less than number of rows per page.
paginatorPosition String false bottom Position of the paginator.
paginatorTemplate String false {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown} Template of the paginator.
partialUpdate boolean false true When disabled, it updates the whole table instead of updating a specific field such as body element in the client requests of the dataTable.
reflow boolean false false Reflow mode is a responsive mode to display columns as stacked depending on screen size.
renderEmptyFacets boolean false false Render facets even if their children are not rendered.
resizableColumns boolean false false Decides whether datatable columns are resizable or not.
resizeMode String false fit Defines the resize behavior, valid values are "fit" and expand.
rowDragSelector String false td,span:not(.ui-c) Defines the element used to reorder rows using dragdrop.
rowEditMode String false eager Defines the row edit behavior, valid values are "eager" and "lazy".
rowExpandMode String false multiple Defines row expand mode, valid values are "single" and "multiple".
rowHover boolean false false Adds hover effect to rows, default is false. Hover is always on when selection is enabled.
rowIndexVar String false Name of iterator to refer each row index.
rowKey String false Unique identifier of row data.
rowSelector String false Client side check if rowclick triggered row click event not a clickable element in row content.
rowStatePreserved boolean false false Keeps state of its children on a per-row basis.
rowStyleClass String false Style class for each row.
rowTitle String false Title for each row.
rows int false 0 Number of rows to display per page. Default value is 0 meaning to display all data available.
rowsPerPageTemplate String false Template of the rowsPerPage dropdown.
saveOnCellBlur boolean false true Saves the changes in cell editing on blur, when set to false changes are discarded.
scrollHeight String false Height for scrollable data.
scrollRows int false 0 Number of rows to display in virtual scrolling mode.
scrollWidth String false Width for scrollable data.
scrollable boolean false false Makes data scrollable with fixed header.
selectAllFilteredOnly boolean false false When enabled, toggle select will only apply on filtered items.
selection Object false Reference to the selection data.
selectionDisabled boolean false false Disables row selection when true.
selectionMode String false Detected though the "selection" value expression. Enables data selection, valid values are "single" and "multiple".
selectionPageOnly boolean false true When using paginator and checkbox selection mode the select all checkbox in header will select the current page if true or all rows if false. When false, individual row unselections after 'select all' are preserved even across page navigation.
selectionRowMode String false new Indicates how rows of a DataTable may be selected, when clicking on the row itself (not the checkbox / radiobutton from p:column). The value `new` always unselects other rows, `add` preserves the currently selected rows, and `none` disables row selection.
selectionTextDisabled boolean false true Disables text selection on row click.
showGridlines boolean false false When enables, cell borders are displayed.
showSelectAll boolean false true Whether to show the select all checkbox inside the column's header.
size String false regular Size of the table content, valid values are "small", "regular" and "large".
skipChildren boolean false false Ignores processing of children during lifecycle, improves performance if table only has output components.
sortBy Object false Property to be used for sorting.
sortMode String false multiple Defines sorting mode, valid values are "single" and "multiple".
stickyHeader boolean false false Sticky header stays in window viewport during scrolling.
stickyTopAt String false Selector to position on the page according to other fixing elements on the top of the table.
stripedRows boolean false false Whether to display striped rows to visually separate content.
style String false Inline style of the component.
styleClass String false Style class of the component.
summary String false Summary attribute for WCAG.
tabindex String false 0 Position of the element in the tabbing order.
tableStyle String false Inline style of the table element.
tableStyleClass String false Style class of the table element.
touchable Boolean false Enable touch if supported by device. NULL uses global default or primefaces.TOUCHABLE. Default: globally enabled.
value Object true Datasource of the component.
var String true Name of the iterator variable that references each element in the data set.
virtualScroll boolean false false Loads data on demand as the scrollbar gets close to the bottom.
Loading...
Tag DocumentationNew DocumentationNew Documentation JSDoc Basic ColumnToggler ContextMenu Crud DisplayPriority Dynamic Columns Edit Facets Field Filter Gridlines Group Lazy MultiViewState Paginator Reorder Resize Responsive RowAdd RowColor RowExpansion RowGroup RowTitle RTL Scroll Selection Size Sort StickyHeader StripedRows SubTable
Vertical
NameCountryRepresentativeStatus
Jefferson D GillianSpainIoni Bowcher PROPOSAL
Maria K PerinGermanyAmy Elsner QUALIFIED
Rodrigues B WhobreyFranceAsiya Javayant PROPOSAL
Isabel B OstroskyIndiaElwin Sharvill UNQUALIFIED
Salvatore P GauchoFranceBernardo Dominic NEW
Rodrigues P OldroydUnited KingdomBernardo Dominic RENEWAL
Isabel Z BriddickItalyElwin Sharvill PROPOSAL
David N StockhamGermanyIvan Magalhaes PROPOSAL
Antonio V BowleyJapanIoni Bowcher UNQUALIFIED
Johnson L WieserJapanOnyama Limba QUALIFIED
Jefferson E RutaSpainOnyama Limba NEGOTIATION
James P SlusarskiAustraliaIoni Bowcher NEW
Kaitlin F NickaItalyAmy Elsner UNQUALIFIED
Juan K AlbaresBrazilIvan Magalhaes NEW
Jennifer B TollnerFranceBernardo Dominic NEW
Izzy M WhobreyFranceAnna Fali QUALIFIED
David C CaudyGermanyXuxue Feng NEW
Adams J RimArgentinaIvan Magalhaes RENEWAL
Izzy W MarrierBrazilXuxue Feng NEW
Juan F SaylorsArgentinaXuxue Feng RENEWAL
Ricardo G BriddickItalyBernardo Dominic UNQUALIFIED
Rodrigues B RutaJapanXuxue Feng NEGOTIATION
Arvin L NickaItalyAsiya Javayant QUALIFIED
Costa N OstroskyArgentinaStephen Shaw PROPOSAL
Kaitlin T FerenczFranceAsiya Javayant QUALIFIED
Izzy G StockhamRussiaBernardo Dominic NEGOTIATION
James S BriddickCanadaOnyama Limba PROPOSAL
Chavez S ChuiFranceStephen Shaw NEW
Jennifer C RimRussiaBernardo Dominic QUALIFIED
Cody J FerenczBrazilIvan Magalhaes NEGOTIATION
Claire X RulapaughBrazilIoni Bowcher RENEWAL
Ivar C MacleadRussiaXuxue Feng RENEWAL
Aika K TollnerSpainXuxue Feng QUALIFIED
Julie M RutaRussiaBernardo Dominic NEW
Murillo M RoysterItalyIvan Magalhaes NEW
Ivar Y MaletUnited KingdomXuxue Feng UNQUALIFIED
Nicolas Z SergiItalyIvan Magalhaes QUALIFIED
Chavez L RoysterBrazilBernardo Dominic UNQUALIFIED
Aditya H RutaJapanAsiya Javayant QUALIFIED
Jennifer I KolmetzRussiaXuxue Feng NEGOTIATION
Ashley I GauchoRussiaIoni Bowcher UNQUALIFIED
Jefferson Y NickaFranceOnyama Limba QUALIFIED
Aruna J OldroydFranceAnna Fali NEW
Arvin I DilliardArgentinaBernardo Dominic PROPOSAL
Faith F WieserArgentinaElwin Sharvill NEW
Juan W DoeArgentinaStephen Shaw QUALIFIED
Johnson V InouyeRussiaAsiya Javayant PROPOSAL
Isabel K RoysterSpainAnna Fali RENEWAL
Kaitlin W NickaRussiaIvan Magalhaes UNQUALIFIED
Arvin E PerinIndiaBernardo Dominic UNQUALIFIED
Horizontal
NameCountryRepresentativeStatus
Kaitlin H FlosiArgentinaBernardo Dominic UNQUALIFIED
Octavia C DilliardJapanXuxue Feng UNQUALIFIED
Smith M PerinJapanElwin Sharvill PROPOSAL
Clifford F BriddickRussiaIoni Bowcher NEGOTIATION
Salvatore W WaycottGermanyIoni Bowcher RENEWAL
Arvin B FollerSpainElwin Sharvill RENEWAL
Emily G SaylorsAustraliaXuxue Feng RENEWAL
Julie K GarufiArgentinaAnna Fali UNQUALIFIED
Deepesh Q OstroskyUnited KingdomXuxue Feng NEW
Deepesh M PerinBrazilBernardo Dominic NEGOTIATION
Horizontal and Vertical
IdNameCountryDateCompanyStatusActivityRepresentative
1000Chavez L MarrierIndia2026-09-29Rangoni Of Florence NEW15Onyama Limba
1001Smith Z GillianFrance2026-10-05Rousseaux, Michael Esq PROPOSAL75Asiya Javayant
1002Maria T FlosiArgentina2026-10-21Chemel, James L Cpa NEW1Bernardo Dominic
1003Maisha T StensethUnited Kingdom2026-10-09Rousseaux, Michael Esq PROPOSAL35Ivan Magalhaes
1004Emily G DilliardJapan2026-10-10Rousseaux, Michael Esq QUALIFIED45Ioni Bowcher
1005Juan H InouyeArgentina2026-10-08Printing Dimensions QUALIFIED2Stephen Shaw
1006Leon U InouyeJapan2026-10-13Dorl, James J Esq UNQUALIFIED14Onyama Limba
1007Costa K SchemmerBrazil2026-09-25Morlong Associates NEGOTIATION82Ioni Bowcher
1008Tony I SchemmerAustralia2026-09-22Chemel, James L Cpa PROPOSAL94Amy Elsner
1009Maria N FigeroaBrazil2026-10-15Feiner Bros NEGOTIATION5Anna Fali
1010Clifford A GarufiCanada2026-10-10Rangoni Of Florence RENEWAL72Ioni Bowcher
1011Kaitlin E MaletFrance2026-09-23Printing Dimensions RENEWAL25Ioni Bowcher
1012Stacey P BriddickBrazil2026-10-10Chemel, James L Cpa NEW42Ioni Bowcher
1013Aika I SaylorsBrazil2026-10-21Benton, John B Jr NEW56Anna Fali
1014Mujtaba S MorascaJapan2026-09-28Dorl, James J Esq UNQUALIFIED20Onyama Limba
1015Alejandro W FerenczCanada2026-10-02Chapman, Ross E Esq RENEWAL17Bernardo Dominic
1016Jennifer K GlickSpain2026-10-02Commercial Press RENEWAL81Ivan Magalhaes
1017Murillo F ChuiUnited Kingdom2026-10-21Morlong Associates NEGOTIATION97Xuxue Feng
1018Ricardo M CaldareraAustralia2026-10-03Commercial Press NEW79Elwin Sharvill
1019Adams U OstroskyAustralia2026-10-15Feltz Printing Service NEGOTIATION6Amy Elsner
1020Nicolas X VocelkaArgentina2026-09-22Chemel, James L Cpa NEGOTIATION80Asiya Javayant
1021Jeanfrancois O GlickJapan2026-10-16Rangoni Of Florence RENEWAL72Bernardo Dominic
1022Leon C WaycottArgentina2026-10-10Feltz Printing Service PROPOSAL11Xuxue Feng
1023Greenwood G FerenczIndia2026-10-11Buckley Miller Wright UNQUALIFIED1Xuxue Feng
1024Arvin K MacleadItaly2026-09-30King, Christopher A Esq PROPOSAL92Stephen Shaw
1025Alejandro J RulapaughUnited Kingdom2026-09-30Buckley Miller Wright RENEWAL94Xuxue Feng
1026Salvatore H FlosiItaly2026-10-05Chapman, Ross E Esq NEGOTIATION32Amy Elsner
1027Tony U CaudyGermany2026-10-21Feltz Printing Service RENEWAL30Elwin Sharvill
1028Arvin S SergiIndia2026-09-30Printing Dimensions RENEWAL92Amy Elsner
1029Misaki F BriddickFrance2026-10-07Feltz Printing Service QUALIFIED60Xuxue Feng
1030Antonio C MaletItaly2026-09-26Commercial Press NEGOTIATION40Elwin Sharvill
1031Kadeem W SaylorsCanada2026-10-01Rousseaux, Michael Esq PROPOSAL27Ivan Magalhaes
1032Kadeem S StensethBrazil2026-09-22Printing Dimensions RENEWAL55Stephen Shaw
1033Jones A GarufiAustralia2026-10-18Chemel, James L Cpa UNQUALIFIED75Amy Elsner
1034Adams Z RoysterSpain2026-09-24Benton, John B Jr QUALIFIED61Anna Fali
1035Aruna T RulapaughFrance2026-10-12King, Christopher A Esq NEW66Ioni Bowcher
1036James L StensethItaly2026-09-29Morlong Associates QUALIFIED51Elwin Sharvill
1037Francesco V PaprockiArgentina2026-10-07Buckley Miller Wright RENEWAL76Bernardo Dominic
1038Antonio F KuskoFrance2026-10-07Chanay, Jeffrey A Esq RENEWAL3Ivan Magalhaes
1039Aruna Q BologniaGermany2026-09-30Feiner Bros RENEWAL35Bernardo Dominic
1040Emily C SlusarskiArgentina2026-10-17Chapman, Ross E Esq NEW11Onyama Limba
1041Johnson D AmigonItaly2026-10-08Buckley Miller Wright RENEWAL85Stephen Shaw
1042Cody S WieserIndia2026-10-06Commercial Press QUALIFIED9Asiya Javayant
1043Costa V InouyeFrance2026-09-23Dorl, James J Esq QUALIFIED67Ivan Magalhaes
1044Aruna D RutaSpain2026-10-19Morlong Associates RENEWAL79Ioni Bowcher
1045Ricardo B MarrierJapan2026-10-15Buckley Miller Wright QUALIFIED24Anna Fali
1046Stacey R MacleadArgentina2026-10-18Feltz Printing Service PROPOSAL98Anna Fali
1047Misaki Y CaldareraUnited Kingdom2026-09-23Chapman, Ross E Esq QUALIFIED15Bernardo Dominic
1048Maisha E WaycottGermany2026-10-16Benton, John B Jr NEGOTIATION39Amy Elsner
1049Jones Z ButtSpain2026-09-24Dorl, James J Esq NEW42Ivan Magalhaes
Frozen Rows
NameCountryRepresentativeStatus
Claire O MaletJapanXuxue Feng PROPOSAL
Sinclair Z FigeroaCanadaXuxue Feng QUALIFIED
Kaitlin D SlusarskiRussiaBernardo Dominic RENEWAL
Jefferson P GillianFranceAnna Fali NEW
Mujtaba F SergiUnited KingdomAnna Fali PROPOSAL
Mujtaba N BologniaGermanyOnyama Limba NEGOTIATION
Tony U BologniaIndiaXuxue Feng RENEWAL
Aruna B KolmetzAustraliaIvan Magalhaes NEGOTIATION
Smith L WhobreyFranceBernardo Dominic QUALIFIED
Emily H BowleyArgentinaAsiya Javayant NEGOTIATION
Salvatore N IturbideJapanXuxue Feng QUALIFIED
Tony V MaletUnited KingdomOnyama Limba NEW
Aruna C VocelkaIndiaOnyama Limba NEGOTIATION
Antonio T GillianGermanyStephen Shaw QUALIFIED
Johnson U PerinArgentinaElwin Sharvill NEW
Mujtaba O DilliardBrazilElwin Sharvill NEGOTIATION
Claire J RimArgentinaIoni Bowcher QUALIFIED
Ivar L FigeroaAustraliaAmy Elsner NEW
Claire V WaycottIndiaAmy Elsner NEW
Juan X AlbaresSpainOnyama Limba QUALIFIED
Misaki Y GlickUnited KingdomBernardo Dominic RENEWAL
Ivar H BowleyGermanyStephen Shaw NEW
James G VocelkaUnited KingdomAmy Elsner QUALIFIED
Isabel S StensethFranceBernardo Dominic NEGOTIATION
Murillo Z CampainArgentinaElwin Sharvill PROPOSAL
Isabel H FigeroaBrazilElwin Sharvill UNQUALIFIED
David Z StensethItalyElwin Sharvill NEW
Leon O MaletJapanOnyama Limba PROPOSAL
Costa Q ShinkoItalyElwin Sharvill NEW
Francesco O StensethBrazilBernardo Dominic NEW
Jones M ShinkoUnited KingdomAnna Fali PROPOSAL
Francesco F ButtAustraliaBernardo Dominic QUALIFIED
Jefferson M FigeroaArgentinaBernardo Dominic PROPOSAL
Johnson P FlosiUnited KingdomBernardo Dominic NEGOTIATION
Arvin N RoysterCanadaIvan Magalhaes UNQUALIFIED
Emily W RutaRussiaXuxue Feng PROPOSAL
Clifford Y ShinkoAustraliaOnyama Limba RENEWAL
Aika A MacleadAustraliaAnna Fali RENEWAL
Costa P CampainUnited KingdomBernardo Dominic NEGOTIATION
Ashley I ChuiJapanIvan Magalhaes NEGOTIATION
Deepesh J IturbideUnited KingdomAmy Elsner PROPOSAL
Rodrigues L NestleItalyAsiya Javayant QUALIFIED
Kaitlin E ButtSpainAmy Elsner RENEWAL
Nicolas I ChuiBrazilAsiya Javayant UNQUALIFIED
Jefferson G NickaJapanOnyama Limba RENEWAL
James I CaldareraAustraliaElwin Sharvill QUALIFIED
Nicolas Q BologniaUnited KingdomElwin Sharvill RENEWAL
Darci W NestleItalyXuxue Feng QUALIFIED
Chavez Q BowleyRussiaAmy Elsner RENEWAL
Octavia D BriddickIndiaElwin Sharvill RENEWAL
Frozen Columns
Name
Chavez G Stockham
Silvio T Bolognia
Nicolas U Gaucho
David H Vocelka
Maria Y Foller
Emily M Caudy
Ricardo R Nestle
Aika W Stockham
Jeanfrancois Y Waycott
Leja U Malet
Octavia I Paprocki
Sinclair C Wieser
Smith A Nicka
Stacey G Schemmer
Silvio D Amigon
Jeanfrancois V Doe
Wickens L Caudy
Kadeem H Gaucho
Mujtaba J Gillian
Kadeem U Paprocki
Nicolas H Amigon
Juan H Slusarski
Jefferson T Maclead
Tony E Stenseth
Jefferson P Malet
Emily N Ruta
Aika O Glick
Kaitlin C Bolognia
Emily B Iturbide
Cody B Tollner
James X Malet
Murillo R Saylors
Maisha B Caldarera
Jefferson S Saylors
Morrow S Morasca
Johnson O Whobrey
Darci H Ruta
Stacey S Perin
Jennifer H Gaucho
Ashley I Venere
Morrow B Caudy
Maisha B Foller
Antonio B Figeroa
Misaki T Kolmetz
Kaitlin Y Whobrey
Nicolas J Flosi
Kadeem H Perin
Rodrigues G Dilliard
Morrow D Kolmetz
Munro R Nestle
IdCountryDate
1000Spain2026-10-05
1001Russia2026-10-07
1002France2026-10-13
1003Russia2026-09-30
1004Australia2026-09-30
1005Japan2026-10-19
1006Argentina2026-10-01
1007Brazil2026-10-14
1008France2026-09-25
1009Germany2026-10-12
1010France2026-10-17
1011United Kingdom2026-10-06
1012Brazil2026-10-10
1013Italy2026-10-16
1014Canada2026-10-07
1015United Kingdom2026-09-22
1016Germany2026-10-08
1017Italy2026-09-26
1018India2026-09-25
1019Germany2026-10-06
1020France2026-09-22
1021Russia2026-09-24
1022Russia2026-09-27
1023Spain2026-10-10
1024United Kingdom2026-09-24
1025Argentina2026-09-22
1026Russia2026-10-02
1027Australia2026-10-14
1028Italy2026-10-11
1029Italy2026-09-22
1030France2026-10-12
1031Russia2026-09-25
1032United Kingdom2026-10-05
1033United Kingdom2026-09-29
1034Russia2026-10-05
1035Italy2026-09-24
1036Argentina2026-10-03
1037Russia2026-10-16
1038Spain2026-10-19
1039Russia2026-10-09
1040France2026-09-22
1041Japan2026-10-05
1042France2026-10-20
1043India2026-10-14
1044Canada2026-09-22
1045Russia2026-10-15
1046Argentina2026-10-12
1047Germany2026-10-15
1048France2026-09-28
1049Russia2026-10-14

On-Demand Data

NameIdCountryDate
Julie Q Gillian1000Canada2026-10-07
Aika X Gillian1001Italy2026-10-12
Adams Q Briddick1002Australia2026-10-18
Juan E Briddick1003India2026-09-26
Adams S Iturbide1004Spain2026-10-06
Antonio Y Rim1005Canada2026-10-03
Julie C Tollner1006Japan2026-10-01
Morrow I Campain1007Japan2026-09-30
Aruna X Ferencz1008Argentina2026-10-20
Juan W Morasca1009Russia2026-10-03
David G Kusko1010United Kingdom2026-10-14
Darci A Poquette1011Japan2026-10-13
Misaki C Inouye1012India2026-09-29
Isabel H Darakjy1013India2026-10-06
Rodrigues R Ferencz1014India2026-10-08
Salvatore P Sergi1015Italy2026-09-26
Juan Z Kusko1016Germany2026-09-30
Nicolas H Ostrosky1017Brazil2026-10-17
Deepesh I Doe1018Australia2026-09-24
Chavez M Saylors1019Russia2026-10-16
Virtual Scrolling - 20000 Rows
NameCountryRepresentativeStatus
Sinclair W FollerCanadaAmy Elsner PROPOSAL
Julie G MorascaFranceOnyama Limba QUALIFIED
Aruna N BriddickItalyOnyama Limba NEGOTIATION
Juan F PerinIndiaOnyama Limba NEGOTIATION
David Q RimIndiaBernardo Dominic QUALIFIED
James G GauchoGermanyElwin Sharvill RENEWAL
Francesco X CaudyItalyIoni Bowcher PROPOSAL
Arvin A InouyeArgentinaAnna Fali NEW
Salvatore H SchemmerJapanXuxue Feng QUALIFIED
Clifford K MorascaGermanyXuxue Feng QUALIFIED
Salvatore I KolmetzCanadaAnna Fali UNQUALIFIED
Maisha R OldroydItalyAsiya Javayant QUALIFIED
Aika U SlusarskiUnited KingdomIoni Bowcher RENEWAL
Leja K SlusarskiSpainElwin Sharvill NEGOTIATION
Wickens A WaycottFranceStephen Shaw QUALIFIED
James V NickaRussiaOnyama Limba NEW
Wickens E FigeroaJapanAmy Elsner NEGOTIATION
Ivar N MorascaSpainXuxue Feng NEGOTIATION
Juan D PaprockiUnited KingdomIoni Bowcher NEGOTIATION
David W VenereItalyAsiya Javayant QUALIFIED
Darci J OstroskySpainBernardo Dominic RENEWAL
Maisha K DarakjySpainAmy Elsner NEGOTIATION
Salvatore R AlbaresAustraliaAnna Fali NEW
Aditya R CaldareraGermanyStephen Shaw QUALIFIED
Juan X GauchoAustraliaXuxue Feng UNQUALIFIED
Johnson Q RimGermanyIoni Bowcher NEW
Morrow G FollerCanadaOnyama Limba RENEWAL
Maisha N GarufiJapanStephen Shaw UNQUALIFIED
James F StensethUnited KingdomOnyama Limba NEW
Jones B KuskoUnited KingdomAnna Fali NEW
Aditya Y PoquetteSpainAmy Elsner UNQUALIFIED
Aika P MaletFranceAmy Elsner UNQUALIFIED
Claire R VenereRussiaAsiya Javayant PROPOSAL
Octavia Z BriddickArgentinaElwin Sharvill RENEWAL
Rodrigues K BowleyAustraliaBernardo Dominic UNQUALIFIED
Munro T SchemmerJapanIoni Bowcher NEW
Maria Z SaylorsRussiaElwin Sharvill QUALIFIED
Alejandro U BowleyBrazilBernardo Dominic UNQUALIFIED
Emily H NickaCanadaAnna Fali NEW
Jefferson P WaycottUnited KingdomXuxue Feng NEW

Usage


<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.name().toLowerCase()}">#{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.name().toLowerCase()}">#{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.name().toLowerCase()}">#{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.name().toLowerCase()}">#{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" frozenColumnsAlignment="left">
            <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.name().toLowerCase()}">#{customer.status}</span>
            </p:column>
        </p:dataTable>
    </div>

</h:form>