Usage with backbone.js / spine.js - creation of new Items

[thomasf1]

The combination of Hansometable with a backend framework is awesome!

I´m trying to use Handometable together with spine.js (similar to backbone.js).

Setting it up and mapping data (dataSchema & columns) to the spine objects has worked really well and the data is displayed nicely.

There is one thing I haven´t figured out though:
When creating a new column, handsome uses the dataSchema object to create a new Object. I´d want it to create a new Spine Object though.

What I´ve tried so far:
Tried to assign dataSchema a function that returns a new Object each time. It seems getSchema only gets called twice though, independent of how many rows are added.

    getSchema: function () {
      if (priv.settings.dataSchema && typeof priv.settings.dataSchema === "function") {
        return priv.settings.dataSchema();
      }
      return priv.settings.dataSchema || priv.duckDataSchema;
    },

[thomasf1]

I´ve figured out how to do it... If the functionality is relevant for you, feel free to include it (maybe there´s even a better way of doing it)....

I´ve introduced a newObject setting and added the following code:

//unchanged, for reference
getSchema: function () {
  return priv.settings.dataSchema || priv.duckDataSchema;
},

//new function, using the newObject if available
getNewObject: function () {
  if (priv.settings.newObject && typeof priv.settings.newObject === "function") {
    return priv.settings.newObject();
  }
  else {
    datamap.getSchema()
  }
},

/**
 * Creates row at the bottom of the data array
 * @param {Object} [coords] Optional. Coords of the cell before which the new row will be inserted
 */
createRow: function (coords) {
  var row;
  if (priv.dataType === 'array') {
    row = [];
    for (var c = 0; c < self.colCount; c++) {
      row.push(null);
    }
  }
  else {
    //changed: one line using getNewObject instead of getSchema
    row = datamap.getNewObject()
  }
  if (!coords || coords.row >= self.rowCount) {
    priv.settings.data.push(row);
  }
  else {
    priv.settings.data.splice(coords.row, 0, row);
  }
},

Here is how I use it (coffeescript):

dataSchema = {}
for i, col of @table.columns
    dataSchema[col.id] = null

@data = @allData = @table.all()

@el.handsontable
    data: @data
    dataSchema: dataSchema
    #The new line in configuration, delivering a new Item back. It also keeps track of new Items.
    newObject: => 
        newItem = new @table()
        @newItems.push newItem
        return newItem
    startRows: 5
    startCols: 4
    rowHeaders: true
    colHeaders: (col.name for id, col of @table.columns)
    columns: ({data: col.id} for id, col of @table.columns)
    minSpareRows: 1

[warpech]

I mark this as a feature request - would anyone like to create a Backbone.js integration example in the demo/ dir?

[warpech]

Now with version 0.8.14 we made a lot of progress towards the integration with functions as data sources. I believe this issue can now be closed.

The new features are now described at those 2 pages:

• http://handsontable.com/demo/backbone.html
• http://handsontable.com/demo/datasources.html

Thanks guys for your input!

@thomasf1 would you care to update your code to 0.8.14 and share your thoughts? A demo for integration with Spine.js would be also largely appreciated!