The table is growing up when I edit a cell

Tags: #<Tag:0x00007efc64de6bf8>

Hi,

I am using handsontable and I would like to edit a cell in my table.
But when I dblClick in a cell, the table is growing up like this in steps :

Step 1:

Step 2 :

Step 3 :

Step 4 :

Etc …

The only way I found to solve it is to say :

var h = (3 lines + 1 header) * 25 (the aproximate line height);
HOT.height = h;

It’s not precise, and if I need to add a line dynamically, I have to edit the height of the entire table :confused:

Can you help me and say me how I can repair that please ?
Thanks a lot.
Antoine Duval.

Hey @duval.antoine

can I ask you to create a demo where I will be able to replicate this behavior?
I saw a similar issue here https://github.com/handsontable/handsontable/issues/3433 but you did not mention anything about resizing the browser.

Hi @aleksandra_budnik,

Thanks for your help.
That’s a demo : https://jsfiddle.net/vfdhqy1e/7/

To reproduce the bug, you’ve got to :

  • Grow up the result view of JSFiddle to have more space to see the bug.
  • And edit some cells.

Thanks again,
Antoine Duval.

The issue is gone when you set a fixed height for the table

https://jsfiddle.net/of3zhstw/

CSS part lines 8-10. I took 200px as you have it in the .modal-body class.

Thanks for your help @aleksandra_budnik

I appreciate your speed.

But, if I undertsant. You say me to set the height of the table in pixels. So, if I need to add a line dynamicaly, I’ll also have to grow up the table height. Right ?

Thanks again,
Antoine Duval.

Unfortunately yes. Otherwise you’ll get a scrollbar.
I have tried to use other ways but Handsontable does not feel well in a modal window.

Hm… I think that you can try to load the table after a couple of milliseconds after the modal opens but this is only a theory.

Thanks, but I already done that with :

$('#MyModal').on('shown.bs.modal', function (e) { " MY CODE TO INIT HOT HERE " }); 

Have a nice day :slight_smile:

1 Like