Create an instance of the grid.
Container node to create the grid in. This can be a DOM Element, a jQuery node, or a jQuery selector.
Databinding source. This can either be a regular JavaScript array or a custom object exposing getItem(index) and getLength() functions.
An array of column definition objects. See Column Options for a list of options that can be included on each column definition object.
Additional options. See Grid Options for a list of options that can be included.
Adds an "overlay" of CSS classes to cell DOM elements. SlickGrid can have many such overlays associated with different keys and they are frequently used by plugins. For example, SlickGrid uses this method internally to decorate selected cells with selectedCellCssClass (see options).
A unique key you can use in calls to setCellCssStyles and removeCellCssStyles. If a hash with that key has already been set, an exception will be thrown.
A hash of additional cell CSS classes keyed by row number and then by column id. Multiple CSS classes can be specified and separated by space.
Proportionately resizes all columns to fill available horizontal space. This does not take the cell contents into consideration.
Returns true if you can click on a given cell and make it the active focus.
A row index.
A column index.
boolean
Returns true if selecting the row causes this particular cell to have the selectedCellCssClass applied to it. A cell can be selected if it exists and if it isn't on an empty / "Add New" row and if it is not marked as "unselectable" in the column definition.
A row index.
A column index.
boolean
todo: no docs
Attempts to switch the active cell into edit mode. Will throw an error if the cell is set to be not editable. Uses the specified editor, otherwise defaults to any default editor for that given cell.
A SlickGrid editor (see examples in slick.editors.js).
Flashes the cell twice by toggling the CSS class 4 times.
A row index.
A column index.
(optional) - The milliseconds delay between the toggling calls. Defaults to 100 ms.
Returns an object representing the coordinates of the currently active cell:
Returns the DOM element containing the currently active cell. If no cell is active, null is returned.
HTMLElement
Returns an object representing information about the active cell's position. All coordinates are absolute and take into consideration the visibility and scrolling position of all ancestors.
HTMLCanvasElement
Accepts a key name, returns the group of CSS styles defined under that name. See setCellCssStyles for more info.
A string.
Returns the active cell editor. If there is no actively edited cell, null is returned.
Returns a hash containing row and cell indexes from a standard W3C/jQuery event.
A standard W3C/jQuery event.
Returns a hash containing row and cell indexes. Coordinates are relative to the top left corner of the grid beginning with the first row (not including the column headers).
An x coordinate.
A y coordinate.
Returns a DOM element containing a cell at a given row and cell.
A row index.
A column index.
HTMLElement
Returns an object representing information about a cell's position. All coordinates are absolute and take into consideration the visibility and scrolling position of all ancestors.
A row index.
A column index.
Returns the index of a column with a given id. Since columns can be reordered by the user, this can be used to get the column definition independent of the order:
A column id.
number
Returns an array of column definitions, containing the option settings for each individual column.
Column[]
Returns an array of every data object, unless you're using DataView in which case it returns a DataView object.
any
Returns the databinding item at a given position.
Item index.
T in Slick.Grid<T extends SlickData>
Returns the size of the databinding source.
number
todo: no docs
todo: no docs
HTMLElement
todo: no docs, return type is probably wrong -> "return $header && $header[0]"
Returns an object containing all of the Grid options set on the grid. See a list of Grid Options here.
Returns an array of row indices corresponding to the currently selected rows.
Array<number>
Returns the current SelectionModel. See here for more information about SelectionModels.
todo: no docs or comments available
Column[]
todo: no docs
HTMLElement
Accepts a row integer and a cell integer, scrolling the view to the row where row is its row index, and cell is its cell index. Optionally accepts a forceEdit boolean which, if true, will attempt to initiate the edit dialogue for the field in the specified cell. Unlike setActiveCell, this scrolls the row into the viewport and sets the keyboard focus.
A row index.
A column index.
If true, will attempt to initiate the edit dialogue for the field in the specified cell.
Initializes the grid. Called after plugins are registered. Normally, this is called by the constructor, so you don't need to call it. However, in certain cases you may need to delay the initialization until some other process has finished. In that case, set the explicitInitialization option to true and call the grid.init() manually.
Switches the active cell one row down skipping unselectable cells. Returns a boolean saying whether it was able to complete or not.
boolean
Switches the active cell one cell left skipping unselectable cells. Unline navigatePrev, navigateLeft stops at the first cell of the row. Returns a boolean saying whether it was able to complete or not.
boolean
Tabs over active cell to the next selectable cell. Returns a boolean saying whether it was able to complete or not.
boolean
Tabs over active cell to the previous selectable cell. Returns a boolean saying whether it was able to complete or not.
boolean
Switches the active cell one cell right skipping unselectable cells. Unline navigateNext, navigateRight stops at the last cell of the row. Returns a boolean saying whether it was able to complete or not.
boolean
Switches the active cell one row up skipping unselectable cells. Returns a boolean saying whether it was able to complete or not.
boolean
Removes an "overlay" of CSS classes from cell DOM elements. See setCellCssStyles for more.
A string key.
Resets active cell.
Sets an active cell.
A row index.
A column index.
Sets CSS classes to specific grid cells by calling removeCellCssStyles(key) followed by addCellCssStyles(key, hash). key is name for this set of styles so you can reference it later - to modify it or remove it, for example. hash is a per-row-index, per-column-name nested hash of CSS classes to apply. Suppose you have a grid with columns: ["login", "name", "birthday", "age", "likes_icecream", "favorite_cake"] ...and you'd like to highlight the "birthday" and "age" columns for people whose birthday is today, in this case, rows at index 0 and 9. (The first and tenth row in the grid).
A string key. Will overwrite any data already associated with this key.
A hash of additional cell CSS classes keyed by row number and then by column id. Multiple CSS classes can be specified and separated by space.
Sets grid columns. Column headers will be recreated and all rendered rows will be removed. To rerender the grid (if necessary), call render().
An array of column definitions.
Sets a new source for databinding and removes all rendered rows. Note that this doesn't render the new rows - you can follow it with a call to render() to do that.
New databinding source using a regular JavaScript array..
If true, the grid will reset the vertical scroll position to the top of the grid.
Sets a new source for databinding and removes all rendered rows. Note that this doesn't render the new rows - you can follow it with a call to render() to do that.
New databinding source using a custom object exposing getItem(index) and getLength() functions.
If true, the grid will reset the vertical scroll position to the top of the grid.
todo: no docs
Extends grid options with a given hash. If an there is an active edit, the grid will attempt to commit the changes and only continue if the attempt succeeds.
Accepts an array of row indices and applies the current selectedCellCssClass to the cells in the row, respecting whether cells have been flagged as selectable.
An array of row numbers.
Unregisters a current selection model and registers a new one. See the definition of SelectionModel for more information.
Accepts a columnId string and an ascending boolean. Applies a sort glyph in either ascending or descending form to the header of the column. Note that this does not actually sort the column. It only adds the sort glyph to the header.
Accepts an array of objects in the form [ { columnId: [string], sortAsc: [boolean] }, ... ]. When called, this will apply a sort glyph in either ascending or descending form to the header of each column specified in the array. Note that this does not actually sort the column. It only adds the sort glyph to the header
todo: no docs
Updates an existing column definition and a corresponding header DOM element with the new title and tooltip.
Column id.
New column name.
New column tooltip.