Search code examples
javascriptjqueryhtmlmathquill

How to syncronize text field and formula field content in MathQuill 0.10?

So, what I'm trying to do is to get my formula WYSIWYGish input element

<span id="editable-math" class="mathquill-editable"></span>

and LaTeX input element

<textarea id="mathjaxSrc" rows="6" cols="60"></textarea>

work syncronously. My code is

var MQ = MathQuill.getInterface(2);
var mathField = MQ.MathField(latexMath, {
    spaceBehavesLikeTab: true,
    handlers: {
        edit: function() {
            latexSource.value = mathField.latex();
            jQuery(latexSource).change();
        }
    }
});
jQuery(latexSource).change(function(){
    mathField.latex(latexSource.value);
});

This mostly works: WYSIWYGish editor updates LaTeX input field, but LaTeX input field updates WYSIWYGish editor only after mouse click elsewhere (may be on blur).

My question is: how to make WYSIWYGish editor value updated without need to click elsewhere? What to add to the .change handler, I guess?

Solution

  • Ok, nevermind, it's not about MathQuill, but rather about what event handler to use. This behaviour is documented behaviour of change. To achieve what I need, I have to use keydown or keyup or keypress method (using or not using jQuery).