HandsOnTable - destroy and recreate does not work after upgrading from 0.11.0 to 0.15.0-beta 2

Question

I have a code as below:

HTML

<div id="rangePricesGrid" class="handsontable" style="width: auto; overflow: auto"></div> 

Javascript:

  var rangePriceGrid = $('#rangePricesGrid').handsontable('getInstance'); if (rangePriceGrid != undefined) { rangePriceGrid.destroy(); if (setRangeGridOptions != undefined) rangePriceGrid = $('#rangePricesGrid').handsontable(setRangeGridOptions); } else { if (setRangeGridOptions != undefined) rangePriceGrid = $('#rangePricesGrid').handsontable(setRangeGridOptions); } 

On page load it works fine and paints HOT. But then when I update one of the properties (e.g. data and number of columns) of HOT, and then call the method above, it fails at below

 rangePriceGrid = $('#rangePricesGrid').handsontable(setRangeGridOptions); 

with an error

 Uncaught Error: This method cannot be called because this Handsontable instance has been destroyed 

What am I doing wrong here? I know the HOT table is corrupted, but I'm trying to restore it with updated parameters.

Please suggest

Answer 1

I think you understand that you are destroying an instance, but you do not understand how to recreate an instance. For starters, it would be helpful to see setRangeGridOptions and possibly also jsfiddle. If you back up using the jQuerySelector.handsontable (options) method, this may be the cause of your problems.

Do you consider manually deleting a link to a previous HOT instance so that you don't have this problem? Try creating an HOT instance as follows:

 var hot = new Handsontable($('#rangePricesGrid')[0], setRangeGridOptions) 

That way, you can destroy the hot instance, and your code should start working. To destroy a hot instance, you simply do:

 hot.destroy() 

And to recreate it, you again use the line above.

Answer 2

You can do it.

  // incorrect

 var rangePriceGrid = $ ('# rangePricesGrid'). handsontable ('getInstance');

 rangePriceGrid.destroy ();


 // correct

 $ ('# rangePricesGrid'). destroy ();