Search code examples
edit-in-placehallo-js

Apply HalloJS to elements created after initialization


I recently replaced Aloha editor with HalloJS in my CMS for several reasons, the most important of which are HalloJS being more leightweight and a lot easier to customize. A severe problem I have however run into is that it doesn't seem possible to init the HalloJS toolbar to elements that are dynamically added to the DOM after initial initialization of Hallo.

Judging from the source, something is definitlety happening, since a div#hallojstoolbar appears upon clicking the newly created editable in the DOM, but it isn't visible and its widgets, controls & dialogs aren't to be found anywhere.


Solution

  • Ok, I feel slightly silly now. After sifting through heaps of 'foo is not a function' notices in the console before posting this question I found out that it wouldn't work because several of the options set in initialization weren't read/set (anymore).

    After manually setting some of the vars at the point they were supposed to be used but missing, I discovered that HalloJS was using all the plugin's default options, such as the contextualToolbar (where I am using the static one) and, more importantly, an empty plugin list. I find this weird, bacause after dynamically adding my new element I tried calling HalloJS with all options set, to no result.

    However, if you copy all your prefered option settings (including all plugin references!) into the jQuery.widget('IKS.hallo') settings in the hallo.js file, everything works as expected.

    I chose to post this on here anyway since there isn't a single reference to any problem remotely related to this anywhere on the netz. So I figured this could save someone googling the same issue in the future the time it took me to figure this out.