javascript - SlickGrid w/ DataView not immediately reflecting changes in underlying data -
i have following code builds grid using slickgrid.js.
var grid; var griddataview; var gridoptions = { enablecellnavigation: true, enablecolumnreorder: true, forcefitcolumns: false, toppanelheight: 25 }; function creategrid(data) { griddataview = new slick.data.dataview({ inlinefilters: true }); grid = new slick.grid("#grid", griddataview, data.columns, gridoptions); grid.setselectionmodel(new slick.rowselectionmodel()); var pager = new slick.controls.pager(griddataview, grid, $("#pager")); var columnpicker = new slick.controls.columnpicker(data.columns, grid, gridoptions); grid.onsort.subscribe(function (e, args) { sortdir = args.sortasc ? 1 : -1; sortcol = args.sortcol.field; // using native sort comparer // preferred method can slow in ie huge datasets griddataview.sort(comparer, args.sortasc); }); // if don't want items not visible (due being filtered out // or being on different page) stay selected, pass 'false' second arg griddataview.syncgridselection(grid, true); $("#gridcontainer").resizable(); }
i using knockout-js , create grid after user makes selection listbox, @ point fetch data rest service , build grid. each subsequent user selection not create grid, update data.
self.selectedinstrument.subscribe(function (newvalue) { $.getjson('/data/' + self.selectedcategory().id + '/' + newvalue.id, function (data) { self.cotdata(data); if (grid == null) { debugger; creategrid(data); } //griddataview.beginupdate(); griddataview.setitems(data.data); //griddataview.endupdate(); }); });
what's happening is: 1. when grid create, no data shown, column headers. if move re-order column header, data shown. 2. if sort column, sort not visibly reflected. if start scrolling, see sort being reflected. 3. if add grid.render() end of subscription handler above, see data immediately, i'm not able vertically scroll longer. things seem badly broken @ point.
any thoughts on may happening here? started happening after modified code create dataview rather loading data right grid immediately. need dataview because want allow sorting , later different types of aggregation , groupings.
is possibly related usage of slickgrid knockout js?
thanks much
not sure why yet, i'm still feeling way around slickgrid, had add following 2 subscriptions. first allowed grid display rows when new data loaded , second solved similar issue, when sorting:
// wire model events drive grid griddataview.onrowcountchanged.subscribe(function (e, args) { grid.updaterowcount(); grid.render(); }); griddataview.onrowschanged.subscribe(function (e, args) { grid.invalidaterows(args.rows); grid.render(); });
Comments
Post a Comment