'keyup' method not being called correctly with wysihtml.

[voog]

'keyup' method not being called correctly with wysihtml.

[kasoban]

I guess you figured this out yourself since you closed the ticket, but let's explain this for anyone stumbling upon this through a search:

The event handlers on the textbox will not get called due to wysihtml creating a contenteditable iframe copied from the textbox attributes and hiding the actual textbox, so there won't be actual user input to the textbox.

[jengel3]

I actually ended up submitting this to the wrong version of wysi, but they are fairly similar, and I'd be willing to use any version that I can get to work properly. How would I go about tracking user input instead of the way I'm doing it now?

[kasoban]

Well, you submitted it to Waxolunist/bootstrap3-wysihtml5-bower which is effectively based on this fork.
Anyway, to access the editor you can do the following:

After you initialized the editor on an element by calling element.wysihtml5(), the initialized editor is stored as a data field for that element. So you can get a hold of it through element.data('wysihtml5').editor for example, if you have jQuery available. From there on you could apply a listener like element.data('wysihtml5').editor.on('change', function() {doSomething;}) or the like.

Here is a list of events exposed by the editor:
https://github.com/xing/wysihtml5/wiki/Events
At the very bottom there is an example for a keydown listener.

[priithaamer]

The event system in wysihtml5x needs an overhaul as the change event does not work properly. Until then we're using a combination of change event listeners and mutation observers to get proper events about changes in editable element. Please note that the following works when using contentEditable version of wysihtml. I have not tested it with iframes:

var el = document.getElementById('editor'),
  editor = new wysihtml5.Editor(el, {});

var handleContentMutation = function(mutations) {
  var mutation = _.some(mutations, function(mutation) {
    return !(mutation.type == 'attributes' && mutation.target == el);
  });

  if (mutation) {
    // It is advised to defer the invocation of this method here, i.e. by
    // using _.defer() from Underscore
    handleContentChange();
  }
}

var handleContentChange = function() {
  // Well, content has been changed now...
};

el.addEventListener('input', handleContentChange);

// Listen for change events on editor in case MutationObserver is not present.
editor.addEventListener('change', handleContentChange);

if (window.MutationObserver) {
  var observer = new MutationObserver(handleContentMutation);
  observer.observe(el, {attributes: true, childList: true, characterData: true});
}