Access slickgrid object by selector

How to access slickgrid object by selector after it has be initalized for example throught开发者_StackOverflow社区 selector #myGrid.

Thanks!

// init & store
grid = new Slick.Grid("#myGrid", data, columns, options);
$("#myGrid").data("gridInstance", grid);

// access later on
$("#myGrid").data("gridInstance").resizeCanvas();

You need to distinguish clearly between the JQuery object and the javascript grid object.

Your HTML markup should look look something like this:

<div id="myGrid" style="width:600px;height:500px"></div>

and your sctipt will look something like this.

var grid;
var columns = [ {... column stuff
var options = { ... grid options
var data = [ ... data for the grid

grid = new Slick.Grid("#myGrid", data, columns, options);

The JQuery selector $("#myGrid") will return a JQuery object wrapping the DOM element. Basically, this is giving you a reference to the <div> object on your page. It is just like any other element on your HTML page and has no functionality specific to the grid. It is a div, just like any other.

The grid variable in the JavaScript saves a reference to the newly created object (of type Slick.Grid). This is a custom object defined in the SlickGrid library which brings all the properties and methods needed to manipulate the grid. So for example if you want to call the resizeCanvas() method, you need to call this via the grid object, not the div element.

grid.resizeCanvas();