CODEWITHSUNDEEP
javascriptjqueryhandsontable
nicegonice
nicegonice

Reputation: 11

Handsontable, how to insert row with data?

Screenshot:

enter image description here

Two Puzzles:

One: I want to insert row with data.

Two: This data based on selected row's data,and I want to modify it with AJAX request response.Then insert it.

I read handsontable's docs, can't find suitable event

I found this method, but I do not know how to implement it

var container = document.getElementById('table');
var hot = new Handsontable(container, {
  data: gridata,//Table's data
  rowHeaders: true,
  stretchH: 'all',
  fixedColumnsLeft: 2,
  contextMenu: true
});
var indexArr = hot.getSelected();//get selected row's index
var selectedData = hot.getDataAtRow(indexArr[0]);//selected row's data
//then insert it

Upvotes: 0

Views: 6620

Answers (1)

Joakim Si Ali
Joakim Si Ali

Reputation: 502

You can use the context callbacks like my example in JSFiddle :

contextMenu: {
  callback: function(key, options) {
    if (key == 'row_below') {
      var indexArr = hot.getSelected();
      var selectedData = hot.getDataAtRow(indexArr[0]);

      hot.populateFromArray(indexArr[2]+1, 0, [selectedData]);
    } else if (key == 'row_above') {
      var indexArr = hot.getSelected();
      var selectedData = hot.getDataAtRow(indexArr[0]);

      hot.populateFromArray(indexArr[2]-1, 0, [selectedData]);
    }
  }
}

Upvotes: 1

Related Questions