Extension "editable", HTML-formatted values

[utilmind]

trafficstars

Description

Hello! Unfortunately "editable" extension doesn't allow displaying of HTML-formatted custom values. Here is the quick fix...

Original code in "bootstrap-table-editable.js":

               return "<a href=\"javascript:void(0)\"\n            data-name=\"".concat(column.field, "\"\n            data-pk=\"").concat(row[_this.options.idField], "\"\n            data-value=\"")
                    .concat(result, "\"\n            ")
                    .concat(editableDataMarkup.join(''), "></a>");

The fix is:

              return "<a href=\"javascript:void(0)\"\n            data-name=\"".concat(column.field, "\"\n            data-pk=\"").concat(row[_this.options.idField], "\"\n            data-value=\"")
                  .concat(undefined === value ? "" : value, "\"\n            ")
                  .concat(editableDataMarkup.join(''), ">"+result+"</a>");

Attention to the "result" and "value"!.. So after fix it displaying correct HTML-formatted result and still have correct value in the data-value attribute.

P.S. Also I wish I could set up all dataset dynamically from function (on each edit start), but looks like this is more complicated task, probably will require fixes in the main "bootstrap-table.js"...

[UtechtDustin]

Please provide us an example using our editor.

[utilmind]

Hi @UtechtDustin!

Here is example of my usage case: https://live.bootstrap-table.com/code/utilmind/12883

You see that the "Price" column has numeric values, but should display some HTML-formatted information additionally to the flat value (as formatter, see window.tablePrice() function).

Unfortunately HTML formatting appears broken in this example, because contain unescaped quotes within data-value="..." attribute

My fix suggested above fixes this issue. UPD. I have better fix already, see my pull request.

[utilmind]

Updated pull request also contains minor performance optimization to avoid usage of concat() method, that appearing upon translation from es6 to es5 syntax.