riktar / jkanban

Vanilla Javascript plugin for manage kanban boards
https://www.riccardotartaglia.it/jkanban/
Apache License 2.0
1.08k stars 300 forks source link

buttonContent only accepts text and not html #72

Closed zidarkstarz92 closed 4 years ago

zidarkstarz92 commented 4 years ago

As mentioned in the README for the 'buttonContent' attribute it allows 'text or html content of the board button'. However, when I tried to add html to this it displayed as text and I need to display html. The fix for the issue can be fixed by changing the jkanban.js file on line 245 from: var t = document.createTextNode(buttonContent); btn.setAttribute("class", "kanban-title-button btn btn-default btn-xs"); btn.appendChild(t); to btn.setAttribute("class", "kanban-title-button btn btn-default btn-xs"); btn.innerHTML = buttonContent;

marcosrocha85 commented 4 years ago

That's most because t is a textNode. Perhaps, using innerHTML is not a good pratice because when you append to (or otherwise modify) innerHTML, all the DOM nodes inside that element have to be re-parsed and recreated and will not automatically reattach event handlers to the new elements it creates, potentially creating a memory leak on some browsers.

I guess changing createTextNode buttonContent to other kind of node will help. But developer should keep in mind that the content of buttonContent will be placed inside a Button tag.

My workaround in a customer project was create my own button and css class in order to place my + button on right corner of every board like I did here.