How to use onchange, onmouseup event in codemirror text editor


#1

0

I am using my text editor as codemirror. Normally when I try to use dom event like onmouseup, onchange, oninput in textarea it works, but after integrating the codemirror, it is not working. Please tell me the correct way to invoke these events in my text editor.

Without codemirror, it works.

<textarea id="editor" rows="30" cols="100" onchange="myFunction()" onmouseup="second();"></textarea>        
<div id="demo"></div>
<div id="second"></div> 
<script>
  function myFunction() {
       document.getElementById('demo').innerHTML="The onchange function..";}    
  function second() {
       document.getElementById('second').innerHTML="The mouseup function..";}
</script>       

On integrating codemirror text editor, it is not working. Here is a code:

<textarea id="editor" onchange="myFunction()" onmouseup="second();"></textarea>
<div id="demo"></div>
<div id="second"></div> 
<script>
    var editor = CodeMirror.fromTextArea
    (document.getElementById('editor'),{
            mode:"text/x-java",
            lineNumbers:true,
            autoCloseTags:true,
            tabSize:5       
    });
    editor.setSize("1000", "450");              
    </script>       
    <script>
    function myFunction() {
          document.getElementById('demo').innerHTML="The onchange function..";}         
    function second() {
         document.getElementById('second').innerHTML="The mouseup function..";}

    </script>

#2

Take a look at the manual, specifically the on method.