How to replace old table with new one in Handsontable?

Question

I have an interface that allows users to type in MySQL queries and click a button to execute the queries. Then the result of the queries is displayed in a table created by Handsontable. I do it with the following code:

var output = document.getElementById("output");
var hot = new Handsontable(output, table_setting);

The problem now is, every time the button is clicked, it creates a new table over the old one. I would like the new one to replace the old one. I tried using output.innerHTML = ""; before var hot = new Handsontable(output, table_setting); to get rid of the old table. This seems to get rid of the old table, but the new table does not appear anymore. What is the best way to do this?

Thank you!

Answer 1

You want to first do hot.destroy() and THEN create a new hot instance.