diff --git a/api-generator/components/datatable.js b/api-generator/components/datatable.js
index 2146a6bcaf..0993462a38 100644
--- a/api-generator/components/datatable.js
+++ b/api-generator/components/datatable.js
@@ -318,6 +318,12 @@ const DataTableProps = [
default: 'null',
description: 'Value of the global filter to use in filtering.'
},
+ {
+ name: 'globalFilterMatchMode',
+ type: 'string',
+ default: 'contains',
+ description: 'Defines filterMatchMode; "startsWith", "contains", "endsWith", "equals", "notEquals", "in", "lt", "lte", "gt", "gte" and "custom".'
+ },
{
name: 'filterDelay',
type: 'number',
diff --git a/api-generator/components/treetable.js b/api-generator/components/treetable.js
index 9e160c9857..f405108d85 100644
--- a/api-generator/components/treetable.js
+++ b/api-generator/components/treetable.js
@@ -282,6 +282,12 @@ const TreeTableProps = [
default: 'null',
description: 'Value of the global filter to use in filtering.'
},
+ {
+ name: 'globalFilterMatchMode',
+ type: 'string',
+ default: 'contains',
+ description: 'Defines filterMatchMode; "startsWith", "contains", "endsWith", "equals", "notEquals", "in", "lt", "lte", "gt", "gte" and "custom".'
+ },
{
name: 'filterMode',
type: 'string',
diff --git a/components/doc/datatable/index.js b/components/doc/datatable/index.js
index 5ae7c4cb38..7625300f72 100644
--- a/components/doc/datatable/index.js
+++ b/components/doc/datatable/index.js
@@ -3353,12 +3353,6 @@ export const DataTableStateDemo = () => {
null |
An array of FilterMetadata objects to provide external filters. |
-
- globalFilter |
- any |
- null |
- Value of the global filter to use in filtering. |
-
filterDelay |
number |
@@ -3577,12 +3571,24 @@ export const DataTableStateDemo = () => {
pi pi-chevron-up |
Icon of the row toggler to display the row as collapsed. |
+
+ globalFilter |
+ any |
+ null |
+ Value of the global filter to use in filtering. |
+
globalFilterFields |
string[] |
null |
Define fields to be filtered globally. |
+
+ globalFilterMatchMode |
+ string |
+ contains |
+ Defines filterMatchMode; "startsWith", "contains", "endsWith", "equals", "notEquals", "in", "lt", "lte", "gt", "gte" and "custom". |
+
showSelectionElement |
function |
diff --git a/components/doc/treetable/index.js b/components/doc/treetable/index.js
index 3a0b11a01e..f4848c7086 100644
--- a/components/doc/treetable/index.js
+++ b/components/doc/treetable/index.js
@@ -1,9 +1,9 @@
-import React, { memo } from 'react';
import Link from 'next/link';
-import { TabView, TabPanel } from '../../lib/tabview/TabView';
-import { useLiveEditorTabs } from '../common/liveeditor';
+import React, { memo } from 'react';
+import { TabPanel, TabView } from '../../lib/tabview/TabView';
import { CodeHighlight } from '../common/codehighlight';
import { DevelopmentSection } from '../common/developmentsection';
+import { useLiveEditorTabs } from '../common/liveeditor';
const TreeTableDoc = memo(() => {
const sources = {
@@ -2430,6 +2430,12 @@ export const TreeTableResponsiveDemo = () => {
null |
Value of the global filter to use in filtering. |
+
+ globalFilterMatchMode |
+ string |
+ contains |
+ Defines filterMatchMode; "startsWith", "contains", "endsWith", "equals", "notEquals", "in", "lt", "lte", "gt", "gte" and "custom". |
+
filterMode |
string |
diff --git a/components/lib/datatable/DataTable.js b/components/lib/datatable/DataTable.js
index 9dac14ea3b..7dbf2ee342 100644
--- a/components/lib/datatable/DataTable.js
+++ b/components/lib/datatable/DataTable.js
@@ -1043,7 +1043,7 @@ export const DataTable = React.forwardRef((props, ref) => {
if (isGlobalFilter && !globalMatch && globalFilterFieldsArray) {
for (let j = 0; j < globalFilterFieldsArray.length; j++) {
let globalFilterField = globalFilterFieldsArray[j];
- let matchMode = filters['global'] ? filters['global'].matchMode : FilterMatchMode.CONTAINS;
+ let matchMode = filters['global'] ? filters['global'].matchMode : props.globalFilterMatchMode;
let value = filters['global'] ? filters['global'].value : props.globalFilter;
globalMatch = FilterService.filters[matchMode](ObjectUtils.resolveFieldData(data[i], globalFilterField), value, props.filterLocale);
@@ -1767,132 +1767,133 @@ export const DataTable = React.forwardRef((props, ref) => {
DataTable.displayName = 'DataTable';
DataTable.defaultProps = {
__TYPE: 'DataTable',
- id: null,
- value: null,
- header: null,
- footer: null,
- style: null,
- className: null,
- tableStyle: null,
- tableClassName: null,
- paginator: false,
- paginatorPosition: 'bottom',
alwaysShowPaginator: true,
- paginatorClassName: null,
- paginatorTemplate: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown',
- paginatorLeft: null,
- paginatorRight: null,
- paginatorDropdownAppendTo: null,
- pageLinkSize: 5,
- rowsPerPageOptions: null,
- currentPageReportTemplate: '({currentPage} of {totalPages})',
- first: 0,
- rows: null,
- totalRecords: null,
- lazy: false,
- sortField: null,
- sortOrder: null,
- multiSortMeta: null,
- sortMode: 'single',
- defaultSortOrder: 1,
- removableSort: false,
- emptyMessage: null,
- selectionMode: null,
- dragSelection: false,
+ autoLayout: false,
+ breakpoint: '960px',
+ cellClassName: null,
cellSelection: false,
- selection: null,
- selectionAriaLabel: null,
- onSelectionChange: null,
- contextMenuSelection: null,
- onContextMenuSelectionChange: null,
- compareSelectionBy: 'deepEquals',
- dataKey: null,
- metaKeySelection: true,
- selectOnEdit: true,
- selectionPageOnly: false,
- selectionAutoFocus: true,
- showSelectAll: true,
- selectAll: false,
- onSelectAllChange: null,
- headerColumnGroup: null,
- footerColumnGroup: null,
- rowExpansionTemplate: null,
- expandedRows: null,
- onRowToggle: null,
- resizableColumns: false,
+ className: null,
+ collapsedRowIcon: 'pi pi-chevron-right',
columnResizeMode: 'fit',
- reorderableColumns: false,
- reorderableRows: false,
- filters: null,
- globalFilter: null,
- filterDelay: 300,
- filterLocale: undefined,
- scrollable: false,
- scrollHeight: null,
- scrollDirection: 'vertical',
- virtualScrollerOptions: null,
- frozenWidth: null,
- frozenValue: null,
+ compareSelectionBy: 'deepEquals',
+ contextMenuSelection: null,
csvSeparator: ',',
- exportFilename: 'download',
- rowGroupMode: null,
- autoLayout: false,
- rowClassName: null,
- cellClassName: null,
- rowGroupHeaderTemplate: null,
- rowGroupFooterTemplate: null,
- loading: false,
- loadingIcon: 'pi pi-spinner',
- tabIndex: 0,
- stateKey: null,
- stateStorage: 'session',
- groupRowsBy: null,
+ currentPageReportTemplate: '({currentPage} of {totalPages})',
+ customRestoreState: null,
+ customSaveState: null,
+ dataKey: null,
+ defaultSortOrder: 1,
+ dragSelection: false,
editMode: 'cell',
editingRows: null,
+ emptyMessage: null,
expandableRowGroups: false,
- rowHover: false,
- showGridlines: false,
- stripedRows: false,
- size: 'normal',
- responsiveLayout: 'stack',
- breakpoint: '960px',
- filterDisplay: 'menu',
expandedRowIcon: 'pi pi-chevron-down',
- collapsedRowIcon: 'pi pi-chevron-right',
- onRowEditComplete: null,
+ expandedRows: null,
+ exportFilename: 'download',
+ exportFunction: null,
+ filterDelay: 300,
+ filterDisplay: 'menu',
+ filterLocale: undefined,
+ filters: null,
+ first: 0,
+ footer: null,
+ footerColumnGroup: null,
+ frozenValue: null,
+ frozenWidth: null,
+ globalFilter: null,
globalFilterFields: null,
- showSelectionElement: null,
- showRowReorderElement: null,
+ globalFilterMatchMode: FilterMatchMode.CONTAINS,
+ groupRowsBy: null,
+ header: null,
+ headerColumnGroup: null,
+ id: null,
isDataSelectable: null,
+ lazy: false,
+ loading: false,
+ loadingIcon: 'pi pi-spinner',
+ metaKeySelection: true,
+ multiSortMeta: null,
+ onAllRowsSelect: null,
+ onAllRowsUnselect: null,
+ onCellClick: null,
+ onCellSelect: null,
+ onCellUnselect: null,
+ onColReorder: null,
onColumnResizeEnd: null,
onColumnResizerClick: null,
onColumnResizerDoubleClick: null,
- onSort: null,
- onPage: null,
+ onContextMenu: null,
+ onContextMenuSelectionChange: null,
onFilter: null,
- onAllRowsSelect: null,
- onAllRowsUnselect: null,
+ onPage: null,
onRowClick: null,
+ onRowCollapse: null,
onRowDoubleClick: null,
- onRowSelect: null,
- onRowUnselect: null,
+ onRowEditCancel: null,
+ onRowEditChange: null,
+ onRowEditComplete: null,
+ onRowEditInit: null,
+ onRowEditSave: null,
onRowExpand: null,
- onRowCollapse: null,
- onContextMenu: null,
- onColReorder: null,
- onCellClick: null,
- onCellSelect: null,
- onCellUnselect: null,
onRowReorder: null,
+ onRowSelect: null,
+ onRowToggle: null,
+ onRowUnselect: null,
+ onSelectAllChange: null,
+ onSelectionChange: null,
+ onSort: null,
+ onStateRestore: null,
+ onStateSave: null,
onValueChange: null,
+ pageLinkSize: 5,
+ paginator: false,
+ paginatorClassName: null,
+ paginatorDropdownAppendTo: null,
+ paginatorLeft: null,
+ paginatorPosition: 'bottom',
+ paginatorRight: null,
+ paginatorTemplate: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown',
+ removableSort: false,
+ reorderableColumns: false,
+ reorderableRows: false,
+ resizableColumns: false,
+ responsiveLayout: 'stack',
+ rowClassName: null,
rowEditValidator: null,
- onRowEditInit: null,
- onRowEditSave: null,
- onRowEditCancel: null,
- onRowEditChange: null,
- exportFunction: null,
- customSaveState: null,
- customRestoreState: null,
- onStateSave: null,
- onStateRestore: null
+ rowExpansionTemplate: null,
+ rowGroupFooterTemplate: null,
+ rowGroupHeaderTemplate: null,
+ rowGroupMode: null,
+ rowHover: false,
+ rows: null,
+ rowsPerPageOptions: null,
+ scrollDirection: 'vertical',
+ scrollHeight: null,
+ scrollable: false,
+ selectAll: false,
+ selectOnEdit: true,
+ selection: null,
+ selectionAriaLabel: null,
+ selectionAutoFocus: true,
+ selectionMode: null,
+ selectionPageOnly: false,
+ showGridlines: false,
+ showRowReorderElement: null,
+ showSelectAll: true,
+ showSelectionElement: null,
+ size: 'normal',
+ sortField: null,
+ sortMode: 'single',
+ sortOrder: null,
+ stateKey: null,
+ stateStorage: 'session',
+ stripedRows: false,
+ style: null,
+ tabIndex: 0,
+ tableClassName: null,
+ tableStyle: null,
+ totalRecords: null,
+ value: null,
+ virtualScrollerOptions: null
};
diff --git a/components/lib/datatable/datatable.d.ts b/components/lib/datatable/datatable.d.ts
index e212ded119..b3430c6878 100644
--- a/components/lib/datatable/datatable.d.ts
+++ b/components/lib/datatable/datatable.d.ts
@@ -1,5 +1,5 @@
import * as React from 'react';
-import { Column } from '../column';
+import { Column, ColumnFilterMatchModeType } from '../column';
import { PaginatorTemplate } from '../paginator';
import { VirtualScroller, VirtualScrollerProps } from '../virtualscroller/virtualscroller';
@@ -268,6 +268,7 @@ export interface DataTableProps extends Omit {
let copyNodeForGlobal = { ...copyNode };
filterValue = props.globalFilter;
- filterConstraint = FilterService.filters['contains'];
+ filterConstraint = FilterService.filters[props.globalFilterMatchMode];
paramsWithoutNode = { filterField, filterValue, filterConstraint, isStrictMode };
if (
@@ -1004,79 +1004,80 @@ export const TreeTable = React.forwardRef((props, ref) => {
TreeTable.displayName = 'TreeTable';
TreeTable.defaultProps = {
__TYPE: 'TreeTable',
- id: null,
- value: null,
- header: null,
- footer: null,
- style: null,
+ alwaysShowPaginator: true,
+ autoLayout: false,
className: null,
- tableStyle: null,
- tableClassName: null,
+ columnResizeMode: 'fit',
+ contextMenuSelectionKey: null,
+ currentPageReportTemplate: '({currentPage} of {totalPages})',
+ defaultSortOrder: 1,
+ emptyMessage: null,
expandedKeys: null,
+ filterDelay: 300,
+ filterLocale: undefined,
+ filterMode: 'lenient',
+ filters: null,
+ first: null,
+ footer: null,
+ footerColumnGroup: null,
+ frozenFooterColumnGroup: null,
+ frozenHeaderColumnGroup: null,
+ frozenWidth: null,
+ globalFilter: null,
+ globalFilterMatchMode: FilterMatchMode.CONTAINS,
+ header: null,
+ headerColumnGroup: null,
+ id: null,
+ lazy: false,
+ loading: false,
+ loadingIcon: 'pi pi-spinner',
+ metaKeySelection: true,
+ multiSortMeta: null,
+ onColReorder: null,
+ onCollapse: null,
+ onColumnResizeEnd: null,
+ onContextMenu: null,
+ onContextMenuSelectionChange: null,
+ onExpand: null,
+ onFilter: null,
+ onPage: null,
+ onRowClick: null,
+ onSelect: null,
+ onSelectionChange: null,
+ onSort: null,
+ onToggle: null,
+ onUnselect: null,
+ pageLinkSize: 5,
paginator: false,
- paginatorPosition: 'bottom',
- alwaysShowPaginator: true,
paginatorClassName: null,
- paginatorTemplate: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown',
+ paginatorDropdownAppendTo: null,
paginatorLeft: null,
+ paginatorPosition: 'bottom',
paginatorRight: null,
- paginatorDropdownAppendTo: null,
- pageLinkSize: 5,
- rowsPerPageOptions: null,
- currentPageReportTemplate: '({currentPage} of {totalPages})',
- first: null,
- rows: null,
- totalRecords: null,
- lazy: false,
- sortField: null,
- sortOrder: null,
- multiSortMeta: null,
- sortMode: 'single',
- defaultSortOrder: 1,
- removableSort: false,
- selectionMode: null,
- selectionKeys: null,
- contextMenuSelectionKey: null,
- metaKeySelection: true,
- selectOnEdit: true,
- propagateSelectionUp: true,
+ paginatorTemplate: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown',
propagateSelectionDown: true,
- autoLayout: false,
- rowClassName: null,
- loading: false,
- loadingIcon: 'pi pi-spinner',
- tabIndex: 0,
- scrollable: false,
- scrollHeight: null,
+ propagateSelectionUp: true,
+ removableSort: false,
reorderableColumns: false,
- headerColumnGroup: null,
- footerColumnGroup: null,
- frozenHeaderColumnGroup: null,
- frozenFooterColumnGroup: null,
- frozenWidth: null,
resizableColumns: false,
- columnResizeMode: 'fit',
- emptyMessage: null,
- filters: null,
- globalFilter: null,
- filterMode: 'lenient',
- filterDelay: 300,
- filterLocale: undefined,
+ rowClassName: null,
rowHover: false,
+ rows: null,
+ rowsPerPageOptions: null,
+ scrollHeight: null,
+ scrollable: false,
+ selectOnEdit: true,
+ selectionKeys: null,
+ selectionMode: null,
showGridlines: false,
+ sortField: null,
+ sortMode: 'single',
+ sortOrder: null,
stripedRows: false,
- onFilter: null,
- onExpand: null,
- onCollapse: null,
- onToggle: null,
- onPage: null,
- onSort: null,
- onSelect: null,
- onUnselect: null,
- onRowClick: null,
- onSelectionChange: null,
- onContextMenuSelectionChange: null,
- onColumnResizeEnd: null,
- onColReorder: null,
- onContextMenu: null
+ style: null,
+ tabIndex: 0,
+ tableClassName: null,
+ tableStyle: null,
+ totalRecords: null,
+ value: null
};
diff --git a/components/lib/treetable/treetable.d.ts b/components/lib/treetable/treetable.d.ts
index cd6061e6a4..72ede4ac6c 100644
--- a/components/lib/treetable/treetable.d.ts
+++ b/components/lib/treetable/treetable.d.ts
@@ -1,5 +1,5 @@
import * as React from 'react';
-import { ColumnProps } from '../column';
+import { ColumnFilterMatchModeType, ColumnProps } from '../column';
import { PaginatorTemplate } from '../paginator';
import TreeNode from '../treenode';
@@ -96,82 +96,83 @@ interface TreeTableColReorderParams {
}
export interface TreeTableProps extends Omit, HTMLDivElement>, 'onContextMenu' | 'onSelect' | 'ref' | 'value'> {
- id?: string;
- value?: TreeNode[];
- header?: React.ReactNode;
- footer?: React.ReactNode;
- style?: object;
+ alwaysShowPaginator?: boolean;
+ autoLayout?: boolean;
+ children?: React.ReactNode;
className?: string;
- tableStyle?: object;
- tableClassName?: string;
+ columnResizeMode?: TreeTableColumnResizeModeType;
+ contextMenuSelectionKey?: string;
+ currentPageReportTemplate?: string;
+ defaultSortOrder?: TreeTableSortOrderType;
+ emptyMessage?: string;
expandedKeys?: TreeTableExpandedKeysType;
+ filterDelay?: number;
+ filterLocale?: string;
+ filterMode?: TreeTableFilterModeType;
+ filters?: TreeTableFilterMeta;
+ first?: number;
+ footer?: React.ReactNode;
+ footerColumnGroup?: React.ReactElement;
+ frozenFooterColumnGroup?: React.ReactElement;
+ frozenHeaderColumnGroup?: React.ReactElement;
+ frozenWidth?: string;
+ globalFilter?: TreeTableGlobalFilterType;
+ globalFilterMatchMode?: ColumnFilterMatchModeType;
+ header?: React.ReactNode;
+ headerColumnGroup?: React.ReactElement;
+ id?: string;
+ lazy?: boolean;
+ loading?: boolean;
+ loadingIcon?: string;
+ metaKeySelection?: boolean;
+ multiSortMeta?: TreeTableMultiSortMetaType;
+ pageLinkSize?: number;
paginator?: boolean;
- paginatorPosition?: TreeTablePaginatorPositionType;
- alwaysShowPaginator?: boolean;
paginatorClassName?: string;
- paginatorTemplate?: PaginatorTemplate;
+ paginatorDropdownAppendTo?: TreeTableAppendToType;
paginatorLeft?: React.ReactNode;
+ paginatorPosition?: TreeTablePaginatorPositionType;
paginatorRight?: React.ReactNode;
- pageLinkSize?: number;
- paginatorDropdownAppendTo?: TreeTableAppendToType;
- rowsPerPageOptions?: number[];
- currentPageReportTemplate?: string;
- first?: number;
- rows?: number;
- totalRecords?: number;
- lazy?: boolean;
- sortField?: string;
- sortOrder?: TreeTableSortOrderType;
- multiSortMeta?: TreeTableMultiSortMetaType;
- sortMode?: TreeTableSortModeType;
- defaultSortOrder?: TreeTableSortOrderType;
- removableSort?: boolean;
- selectionMode?: TreeTableSelectionModeType;
- selectionKeys?: TreeTableSelectionKeys;
- contextMenuSelectionKey?: string;
- metaKeySelection?: boolean;
- selectOnEdit?: boolean;
- propagateSelectionUp?: boolean;
+ paginatorTemplate?: PaginatorTemplate;
propagateSelectionDown?: boolean;
- autoLayout?: boolean;
- loading?: boolean;
- loadingIcon?: string;
- tabIndex?: number;
- scrollable?: boolean;
- scrollHeight?: string;
+ propagateSelectionUp?: boolean;
+ removableSort?: boolean;
reorderableColumns?: boolean;
- headerColumnGroup?: React.ReactElement;
- footerColumnGroup?: React.ReactElement;
- frozenHeaderColumnGroup?: React.ReactElement;
- frozenFooterColumnGroup?: React.ReactElement;
- frozenWidth?: string;
resizableColumns?: boolean;
- columnResizeMode?: TreeTableColumnResizeModeType;
- emptyMessage?: string;
- filters?: TreeTableFilterMeta;
- globalFilter?: TreeTableGlobalFilterType;
- filterMode?: TreeTableFilterModeType;
- filterDelay?: number;
- filterLocale?: string;
rowHover?: boolean;
+ rows?: number;
+ rowsPerPageOptions?: number[];
+ scrollHeight?: string;
+ scrollable?: boolean;
+ selectOnEdit?: boolean;
+ selectionKeys?: TreeTableSelectionKeys;
+ selectionMode?: TreeTableSelectionModeType;
showGridlines?: boolean;
+ sortField?: string;
+ sortMode?: TreeTableSortModeType;
+ sortOrder?: TreeTableSortOrderType;
stripedRows?: boolean;
- rowClassName?(data: TreeNode): object;
- onFilter?(filters: TreeTableFilterMeta[]): void;
- onExpand?(e: TreeTableEventParams): void;
+ style?: object;
+ tabIndex?: number;
+ tableClassName?: string;
+ tableStyle?: object;
+ totalRecords?: number;
+ value?: TreeNode[];
+ onColReorder?(e: TreeTableColReorderParams): void;
onCollapse?(e: TreeTableEventParams): void;
- onToggle?(e: TreeTableToggleParams): void;
+ onColumnResizeEnd?(e: TreeTableColumnResizeEndParams): void;
+ onContextMenu?(e: TreeTableEventParams): void;
+ onContextMenuSelectionChange?(e: TreeTableSelectionParams): void;
+ onExpand?(e: TreeTableEventParams): void;
+ onFilter?(filters: TreeTableFilterMeta[]): void;
onPage?(e: TreeTablePageParams): void;
- onSort?(e: TreeTableSortParams): void;
- onSelect?(e: TreeTableEventParams): void;
- onUnselect?(e: TreeTableEventParams): void;
onRowClick?(e: TreeTableEventParams): void;
+ onSelect?(e: TreeTableEventParams): void;
onSelectionChange?(e: TreeTableSelectionParams): void;
- onContextMenuSelectionChange?(e: TreeTableSelectionParams): void;
- onColumnResizeEnd?(e: TreeTableColumnResizeEndParams): void;
- onColReorder?(e: TreeTableColReorderParams): void;
- onContextMenu?(e: TreeTableEventParams): void;
- children?: React.ReactNode;
+ onSort?(e: TreeTableSortParams): void;
+ onToggle?(e: TreeTableToggleParams): void;
+ onUnselect?(e: TreeTableEventParams): void;
+ rowClassName?(data: TreeNode): object;
}
export declare class TreeTable extends React.Component {