Grid height - scrolling off end

Hi I have a single grid which uses a remote data model.

I am having problems with the height of the grid - when it loads the grid-canvas element.style height is set to 622px; and then when the rows have loaded it changes to 192500px. Thus when you scroll down through the wows you can scroll off the end of the grid.

I have tried setting the height for the datagrid and also the enclsing div and calling resizeCanvas(), but this makes no difference. I cannot see how to set the height.

If I manually change the height to say 400px; in Chrome - Inspect Element then it is OK.

Please help with what to set here

I have put the code which creates the grid into a jquery plugin so:

(function( $ ){

var methods = {

        create : function(pageid, editable, status, urlparams, gridmode) {

            editable == "true" ? editable = true : editable = false;
            currentpageid = pageid;
            currentgridmode = gridmode;
            loader = new Slick.Data.DartfireRemoteModel(currentpageid, status, urlparams);

            columns = [{id: "dummy", width: 0}];
            grid = new Slick.Grid("#datagrid", loader.data, columns, options);
            grid.setOptions({editable: editable});
            grid.setSelectionModel(new Slick.RowSelectionModel());

            console.log("Set height - does not work");
            $("#datagrid").height(400);
            grid.resizeCanvas();

            grid.setColumns([]);

            var vp = grid.getViewport();
            loader.ensureData(vp.top, vp.bottom);
            grid.render();  

            // load the first page
            grid.onViewportChanged.notify();

            //Event columns loaded
            loader.onColumnsLoaded.subscribe(function (e, cols) { 

                $("#grid-message  ....

The grid is created in a container where #datagrid is referenced in grid = new Slick.Grid("#datagrid", loader.data, columns, options);

mleibman / SlickGrid

Grid height - scrolling off end #761