api.getState()
Description
Gets the state object that stores current state of most DataGrid propertiesUsage
api.getState(): object;
Returns
The method returns an object with the following parameters:
{
columns: array, // an array with columns data
data: array, // an array with data for the table
dynamic: object, // an object with the number of rows in a dynamic dataset
editor: object,// an object with data for the open editor
filter: (obj: any) => boolean, // the filtering function; the filter-rows action handler
scroll: object, // on object with the scroll configuration
selectedRows: array, // an array with the ids of the selected rows
sizes: object, // an object with the table sizes configuration
sortMarks: object, // an object with the sorting configuration
split: number, // the number of frozen columns
tree: boolean, // tree structure state
history: object, // shows the number of operations for each undo/redo action
flatData: array // actual data;in case of the tree structure,it's a plain dataset with the "level" marker to specify each item's level in hierarchy
filterValues: object;
}
The Grid properties detailed description you can find here: Grid properties overview.
State-only properties
flatData
, filterValues
, sortMarks
, and history
are the state-only properties, which means that they cannot be provided with widgets properties
flatData
The flatData
parameters are the same as data
but in case of the tree structure it becomes a plain dataset with the next parameters to specify each item's level in hierarchy:
level
- an item's level in hierarchyparent
- an Id of the parent itemcount
- the number of child items inside the parent item (set to 0 in case of none)
filterValues
filterValues
is an object with the values of header filters. Its keys are column IDs and values are input values.
history
history
is an object with the number of operations for each undo/redo action:
history: {
undo: number,
redo: number,
};
Example
The example below shows how to output the selected rows' IDs by obtaining an array via the api.getState()
method:
<script>
import { Grid } from "wx-svelte-grid";
import { getData } from "./common/data";
const { data } = getData();
const columns = [
{ id: "id", width: 50 },
{ id: "city", header: "City", width: 160 },
{ id: "firstName", header: "First Name" },
{ id: "lastName", header: "Last Name" },
{ id: "companyName", header: "Company" },
];
let api = state();
const updateSelected = () => {
console.log(api.getState().selectedRows));
};
</script>
<div style="height: 415px; ">
<Grid {data} {columns} bind:this={api} onselectrow={updateSelected} />
</div>
Related articles: