{hero}

rowGroup.dataSrc

Since: RowGroup 1.0.0

Set the data point to use as the grouping data source.
Please note - this property requires the RowGroup extension for DataTables.

Description

When using RowGroup you are very likely to wish to set this parameter as it provides the software with the information needed to find the data by which to group the rows in the table.

It is important to note that if you are using objects as a data source for the table, this property should be set to a string (the value being the property name for the grouping data), while if you are using arrays, it should be an index matching the column index for the grouping data.

When using objects it is not required that the data used for grouping be used in a column (unless you wish to be able to order the table by that data as well).

The data source for grouping can be dynamically altered using the rowGroup().dataSrc() method, after the table has been initialised.

Types

number|string

Description:

If your table is using array based data, this should be the column index that contains the data you want to use to group the table. For object-based data sources, it should be the property name in the data source object.

array

Description:

As of RowGroup 1.1.0 it is possible to nest multiple levels of data by providing this parameter as an array of values. The values can be numbers or strings as defined above. The top level of nesting is array index 0, and progressively gets deeper with the array indexes.

function dataSrc( rowData, level )

Description:

As a function this option provides the ability to customise the grouping logic using the data from each row. The function is called in order for the rows being displayed in the table.

Parameters:
Returns:

The group name that this row should fall into.

Default

  • Value: 0

Examples

Set an object property name as the data source for grouping information:

new DataTable('#myTable', {
	rowGroup: {
		dataSrc: 'group'
	}
});

Nested data:

new DataTable('#myTable', {
	rowGroup: {
		dataSrc: ['group', 'date']
	}
});