slickgrid with sproutcore

gistfile1.js

SGUI.TableView = SC.CollectionView.extend({
  columns:[],
  options:{},

  reloadIfNeeded:function() {
    var options = this.get('options');
    var content = this.get('content');
    var columns = this.get('columns');

    function getItem(index) {
      var scobject = content.objectAt(index);
      var flatobject = {};
      columns.forEach(function(col) {
        flatobject[col.field] = scobject.get(col.field);
      });
      return flatobject;
    }
    function getLength() {
      return content.get('length');
    }

    var data = {getLength: getLength, getItem: getItem};
    if(!this._grid) {
      this._grid = new Slick.Grid(this.$(), data, columns, options);
    }
    else {
      this._grid.setData(data);
      this._grid.render();
    }
  }

});

Usage example:

table:SGUI.TableView.design({
  contentBinding:"Test.blsController.arrangedObjects",
  options:{
    enableCellNavigation:YES
  },
  columns:[
    {id:'name', name:'Name', field:'name'},
    {id:'street', name:'Street', field:'street'},
  ],
  layout:{width:500,height:500}
})

Hi,
I created my wrapper class same as above but im getting an error that SGUI is not defined.I have updated my build file as config :test, :required => [:slickgrid]. I feel im missing some basic step while integrating. Can anyone guide me through this.

Hi, I have created the wrapper class as above . but i am getting a error telling "SlickGrid requires a valid container, <$:sc1367>() does not exist in the DOM." Can anyone guide me through this.