AutoTable
You can gain access to the underlying Insight Table object and from that the DataTable object too.
Method summary
name | description |
---|---|
destroy | Destroy the AutoTable instance. This will destroy the underlying DataTable and remove any DOM from within the table. |
onDataSaved | Attach a data saved callback. |
Constructor
Create a new AutoTable instance using table referenced with passed in id.
Parameters:
Name | Type | Description |
---|---|---|
config |
type
AutoTable~Config |
Members
-
table - {
typeTable }
-
The underlying Insight Table object.details
Methods
- destroy ( remove )
-
Destroy the AutoTable instance. This will destroy the underlying DataTable and remove any DOM from within the table.
Parameters:
paramsName Type Argument Default Description remove typebooleanoptional false Whether to remove the table element or just remove AutoTable handlers. If destroy is called before an update (to refresh the table data) you probably want to omit this parameter or set it to false. details - onDataSaved ( callback )
-
Attach a callback that will be called on save of any element associated with this AutoTable instance.
Parameters:
paramsName Type Description callback typeAutoTable~DataSavedCallbackCalled when an entity has been successfully updated detailsExample
examples
Back to Topvar table = new insight.components.AutoTable(...); table.onDataSaved(function(scenario, entity, value) { console.log('table 1 data saved: ' + scenario.getId() + ' - ' + entity.getName() + ' - ', value); });
Type Definitions
- Add ( autotable ) → {boolean}
-
Callback function for AutoTable-Add. Overriding this behaviour will make it your responsibility to add the DOM elements representing the row to the AutoTable.
Parameters:
paramsName Type Description autotable typeAutoTableTable to which rows are to be added detailsReturns:returns tableType Description typebooleanReturn true if the row was successfully added -
ColumnOptions - {
typeObject }
-
Data structure passed to AutoTable.details
Properties:
propertiesName Type Argument Default Description name typestringName of the entity to use for this column scenario typeScenariooptional The scenario to use for this column. Falls back to the default scenario assigned to the table filters typeAutoTable~ColumnOptions~Filteroptional A map of index entity name to fixed (filtered) value(s). If this column has more indices than the column with the least number of indices then you must give fixed values for the extra indices. sortByFormatted typebooleanoptional false Use formatted values for sorting. This is ignored if you supply your own render function. filterByFormatted typebooleanoptional Use formatted values for filtering. This defaults to false unless the entity has a label in which case the default is true. This is ignored if you supply your own render function. title typestringoptional Title for the table column. Defaults to entity alias then entity name width typestringoptional CSS width value visible typebooleanoptional true Show or hide the column. Defaults to visible. style typestringoptional Element class for the column render typeTable~RenderCallbackoptional Callback to custom render the cell. Overrides any default entity rendering. editable typebooleanoptional false Whether cells in this column are editable or not editorOptionsSet typestringoptional Name of a set entity to use for select options. This will display labels if a labels entity is defined against this set. editorOptions typeTable~EditorOptionsCallbackoptional A function that returns either an array of primitive values to display or a map object of values and display text to use for the select options. selectNull typebooleanoptional false Enables array elements to be removed using a blank option added to the top of the select input checkedValue type*optional The value to set the cell data to if input type is checkbox and it is checked uncheckedValue type*optional The value to set the cell data to if input type is checkbox and it is not checked editorValidate typeAutoTable~EditorValidateCallbackoptional A callback to validate each cell edit in this column editorType typeTable.EditorTypeoptional The editor type to use, in edit mode, for cells in this column. If not specified then it will be autodetected based on entity type. -
Config - {
typeobject }
-
Configuration object parameter for AutoTable.details
Properties:
propertiesName Type Argument Default Description tableId typestringDOM id of table element scenario typeScenarioThe default scenario for all bound entities in the table selectionAndNavigation typebooleanoptional true Enable/disable table navigation, selection and clipboard alwaysShowSelection typebooleanoptional false Whether to display selection on inactive tables. addRemoveRow typeboolean | stringoptional false Enable the add/remove row feature. If you set this value to be the string 'addrow-autoinc' it will switch the behaviour to allow new index values to be created, incrementing from the highest value in the set. columnOptions typeArray.<AutoTable~ColumnOptions>optional indicesOptions typeObject.<string, (AutoTable~IndicesOptions|Array.<AutoTable~IndicesOptions>)>optional Map of set name to indices options overrides typeObject.<string, *>optional key-value pairs that are pass into the DataTables library, DataTables options reference Properties
propertiesName Type Argument Default Description columnFilter typebooleanoptional false Triggers column filters to be added to the table addRow typeAutoTable~Addoptional Hook for replacement of entire functionality to add a row deleteRow typeAutoTable~Removeoptional Hook for replacement of entire functionality to remove row preAdd typeAutoTable~RowCallbackoptional Hook for validation or other actions prior to adding a row preRemove typeAutoTable~RowCallbackoptional Hook for validation or other actions prior to removing a row postAdd typeAutoTable~RowCallbackoptional Hook for notification after a row has been added postRemove typeAutoTable~RowCallbackoptional Hook for notification after a row has been removed onDataSaved typeAutoTable~DataSavedCallbackoptional Hook for notification after data has been saved rowFilter typeAutoTable~RowFilterCallbackoptional Called for each row in the table to determine whether it should be kept or discarded saveState typebooleanoptional true Save table state in user's browser session so that user settings (e.g. page, sorting and search) are preserved if table data is reloaded. - DataSavedCallback ( scenario, entity, value )
-
Callback for AutoTable#onDataSaved.
Parameters:
paramsName Type Description scenario typeScenarioThe table column scenario entity typeModelEntityThe table column entity. Passes undefined if it is an Insight Parameter type value typestring | objectEither a single value string or a composite key-value pair, in the case of an array) for the value saved. If removal of an array element then the value will be an empty string details - EditorValidateCallback ( value, row, key ) → {Result}
-
Callback function for cell validation.
Parameters:
paramsName Type Description value typePrimitiveTypeThe new value from the edit. row typeArray.<PrimitiveType>An array of the underlying data from the row. key typeArray.<PrimitiveType>The row index tuple (ordered list of index sets values). detailsReturns:returns tableType Description typeResultThe validation result as a validation object. Example
examples
Back to Topfunction array1Validation(value, row, key) { var array2value = row[1]; var result = new insight.validation.Result(true); if(value < 100 && array2value === 'STRICT') { result.isValid = false; result.errorMessage = 'Must be less that 100 if corresponding Array2 is set to STRICT'; } // Build up a insight.validation.Result object with the validation outcome return result; } var table = new insight.components.AutoTable({ tableId: 'table-1', columnOptions: [ {name: 'Array1', editorValidate: array1Validation}, {name: 'Array2'}, ] });
-
IndicesOptions - {
typeObject }
-
Configuration for each Index set column AutoTable.details
Properties:
propertiesName Type Argument Default Description title typestringoptional Custom title for the index column. style typestringoptional Apply one or more css classes to the index column. render typeTable~RenderCallbackoptional Callback to custom render the cell. Overrides any default entity rendering. width typewidthoptional Specify the index column width rather than using auto width calculation. visible typebooleanoptional true Show or hide the column. Defaults to visible. sortByFormatted typebooleanoptional false Use formatted values for sorting. This is ignored if you supply your own render function. filterByFormatted typebooleanoptional Use formatted values for filtering. This defaults to false unless the entity has a label in which case the default is true. This is ignored if you supply your own render function. format typestringoptional Format string. - Remove ( rows )
-
Callback function for AutoTable-Remove. Overriding this behaviour will make it your responsibility to remove the row(s) from the AutoTable, this can be done using the DataTables API.
Parameters:
paramsName Type Argument Description rows typeDataTable.Apioptional Rows to be removed from the table details - RowCallback ( rowData ) → {boolean}
-
Callback function for pre- and post- Add/Remove row hooks.
Parameters:
paramsName Type Description rowData typeArray.<PrimitiveType>An array of the underlying data from the row detailsReturns:returns tableType Description typebooleanfalse if the operation to be aborted. Ignored for postAdd and postRemove actions. Example
examples
Back to Topfunction preAddCallback(rowData) { // Don't allow a row with indices 1,2,3 to be added return rowData[0] !== 1 || rowData[1] !== 2 || rowData[2] !== 3; } function preRemoveCallback(rowData) { // Don't allow a row with indices 9,9,9 to be removed return rowData[0] !== 9 || rowData[1] !== 9 || rowData[2] !== 9; } function addRemoveNotify(action, rowData) { alert('row ' + action + '. ' + rowData.join(','); } var table = new insight.components.AutoTable({ tableId: 'table-1', ..., preAdd: preAddCallback, preRemove: preRemoveCallback, postAdd: addRemoveNotify.bind(table, 'add'), postRemove: addRemoveNotify.bind(table, 'remove') });
- RowFilterCallback ( rowData, indices ) → {boolean}
-
Callback function to filter table rows. Called for each row in the table. The return value determines whether a given row should be kept or discarded.
Parameters:
paramsName Type Description rowData typeArray.<PrimitiveType>Values for all cells within the row indices typeArray.<PrimitiveType>The indices of the row detailsReturns:returns tableType Description typebooleantrue to keep the row, false to discard it Example
examples
Back to Top// Only show rows where data adds up to 100 or more. function rowsGreaterEqual100(rowData, indices) { // Only add up the data cells, omitting the indices var total = rowData.slice(indices.length).reduce(function(memo, value) { return memo + value; }, 0); return total >= 100; } var table = new insight.components.AutoTable({ tableId: 'table-1', ..., rowFilter: rowsGreaterEqual100 });