Skip to main content

api.getState()

Description

Gets the state object that stores current state of most DataGrid properties

Usage

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 hierarchy
  • parent - an Id of the parent item
  • count - 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: