I have a handsontable table which is dynamic, meaning data can be added after initiation. The problem is, however, that new rows can be added to the table when dragging down while clicking the corner of a cell. How would I prevent users from expanding the table while making sure I can still add new rows if one would interact with a button for example.

I tried using

afterCreateRow: function(index, amount){ data.splice(index, amount) },

but that prevents me from adding new rows using the alter function. If this question was rather vague: See the link below for a default jsfiddle with handsontable. Click the corner of a cell and drag down, you'll see.

/

TL;DR: Disable row creation when dragging cells, allow row creation using (in code) handsontable.alter('insert_row');

Thanks in advance.

I have a handsontable table which is dynamic, meaning data can be added after initiation. The problem is, however, that new rows can be added to the table when dragging down while clicking the corner of a cell. How would I prevent users from expanding the table while making sure I can still add new rows if one would interact with a button for example.

I tried using

afterCreateRow: function(index, amount){ data.splice(index, amount) },

but that prevents me from adding new rows using the alter function. If this question was rather vague: See the link below for a default jsfiddle with handsontable. Click the corner of a cell and drag down, you'll see.

http://jsfiddle/warpech/hU6Kz/

TL;DR: Disable row creation when dragging cells, allow row creation using (in code) handsontable.alter('insert_row');

Thanks in advance.

• javascript
• jquery
• handsontable

3 Answers 3

You can add this code to prevent row creation when you are dragging cells :

fillHandle: {
    autoInsertRow: false,
},

EDIT: Check out this fiddle.

So I added this

fillHandle: {
    autoInsertRow: false
}

and removed minSpareRows: 1.

This gives you the drag functionality without the automatic creation of rows.

To test:

If you right-click and manually insert a row (Insert row below), and then click and drag some value into the new row using the fill handle, it should paste the value in without creating a new row underneath.

Note: If you need the same functionality horizontally (aka, being able to drag values horizontally without auto-creating new columns) remove minSparecols: 1

Hope this is what you're looking for!

Add the fillHandle: false option to your current options.

This removes the ability to drag and create new rows, but still leaves you with the ability to add new rows via the context menu (contextMenu: true) and the minimum spare rows option (minSpareRows: 1).

I understand your problem, I was in same situation.

I have solved with this:

maxRows: getFixedNumberOfRows(),
minRows: getFixedNumberOfRows(),

With this solution you can keep drag and drop for easy fill cells, and avoid add rows at the end

If anyone knows a better solution is wele