Append returns "html" column to default

[Nonononoki]

I have an "html" type column in my table, which looks like this: <button class="btn" onClick="openModal(this)" val="[]"><i class="fa fa-edit"></i></button>

After modifying the "val" attribute to my preferred value, appending a row will reset all buttons to their default state.

EDIT: Removing a row has the same effect.

[crivadavi]

What do you mean by append a row? In which context? Can you post a sample code of what you are trying to do?

[Nonononoki]

@crivadavi

Example code:

var editable = new EditableGrid("editable_id");
editable.append(2, {"selected": false, "name": "", "btn":`<button class="btn" onClick="openModal(this)" id=${maxId_creator}><i class="fa fa-edit"></i></button>`});

Set a value or id for the html button:

function openModal(button) {
button.id = "button.id";
}

[crivadavi]

Did you do something on events "tableRendered" or "tableFiltered" that could cause a redraw of the table, resetting all the buttons?

[Nonononoki]

I actually do I think. I use these functions afterwards:

editable.load({"metadata": metadata "data": data});
editable.renderGrid(...);

But why are only the buttons resetted but boolean, integer and string cells unaffected? And what would be the alternative? Because I want the table to show newly added rows.

[crivadavi]

With the method

editable.load({"metadata": metadata, "data": data});

you are redrawing the table with the object "data" you put in. Are you sure that the variable data contains the updated values of the row you have modified? Check that value, or another solution could be to call method "refreshGrid". So, after you have appended a new row write only:

 editable.refreshGrid()