javascript onkeydown doesn't work with "editor element"

Added by ----- -----. 11 months ago

I posted the topic in the wrong forum (elfinder, you can delete it).
If I try to use the onKeyDown event with the elrte editor element it's not working, however with all others it does.
What is the reason for it? (#editor is my elrte field)
I attached my complete elrte.php.

About support I would be really happy!

<script type="text/javascript">
        function countChanges (changes)
        {
            if ( changes > 5 )
                alert ('file is saved now');

            document.save.Changes.value = changes + 1;
            return true;
        }    
</script>

In #editor it's not working...

<form action="" method="post" name="save" id="save" >
        <input type="text" id="editor" onkeydown="countChanges(parseInt(document.save.Changes.value))" />
        <input type="text" name="Changes"  id="Changes" value="0" />
    </form>

but in #editor2 it does

<form action="" method="post" name="save" id="save" >
        <input type="text" id="editor2" name="editor2" onKeyDown="countChanges(parseInt(document.save.Changes.value))" />
        <input type="text" name="Changes"  id="Changes" value="0" />
    </form>

elrte.php - elrte.php (2.5 kB)


Replies (7)

RE: javascript onkeydown doesn't work with "editor element" - Added by Troex Nevelin 11 months ago

This will not work with elRTE. elRTE does not change your source textarea until save/submit/updateSource event.

I recommend you to use another approach:
set a time for 10-15 sec and than get editor contents to a variable and compare if it has changed, if changed you can then call template save method. How to get editor contents see JavaScript_API_EN

RE: javascript onkeydown doesn't work with "editor element" - Added by Dmitry Levashov 11 months ago

You are on wrong way. Let me explain:
When user edit document, texarea content not changed. Textarea updated only while switch into source mode or before save or get content.
If you will try to attach keydown listener to iframe and on every press update textarea - I think this break editor apart :)
Correct way is

setInterval(function() {
  var content = $('selector').elrte('val');
  //  compare or save using ajax
}, 5*60*1000)

RE: javascript onkeydown doesn't work with "editor element" - Added by ----- -----. 11 months ago

I will try it.
If I understood it, it won't be possible to notify the user about unsaved changes, either? (related to my question about such a plugin)

However it should be possible via compare, too, but I think, that it is less performant.

RE: javascript onkeydown doesn't work with "editor element" - Added by ----- -----. 11 months ago

I have tried for a long time but don't find the error, maybe you know it.
No matter, what content is written in the editor field, the alert('Auto saved'); appears every 4 seconds.
Also I tried the compare with a md5 hash, but the result is the same.
Apart from a CSS error there is nothing in the Firefox web console
I become desperate!

function autosaveContent( oldContent )
    {
        if ( oldContent != $('#editor').elrte('val') )
        {
            alert('Auto saved');
        }
        return $('#editor').elrte('val');
    }

    var Content = "aab";  
    Content = setInterval("autosaveContent( Content )", 4000 );

<form action="" method="post" name="save" id="save"  >
        <div id="editor">aab</div>
    </form>

RE: javascript onkeydown doesn't work with "editor element" - Added by Dmitry Levashov 11 months ago

// ater init elrte
var content = $(selector).elrte("val");

setInterval(function() {
  var current = $(selector).elrte("val");

  if (current != content) {
    alert('save');
  }

  content = current;

}, 4000)

RE: javascript onkeydown doesn't work with "editor element" - Added by ----- -----. 11 months ago

Your script seems to be working, but it at the start the alert('save'); appears one time automatically, also if I make no changes.
As test I let write the

$('#editor').elrte('val')

into an <input type="text" /> and first time it was always empty.

The correction of my code: (with the same problem like yours)

    setInterval("content = autosaveContent( content );", 3000 );

RE: javascript onkeydown doesn't work with "editor element" - Added by ----- -----. 11 months ago

FINAL SOLUTION:
The content for the editor is included at the end of the site, but content has been filled in the beginning so it had to be empty, because it was too fast.
Now I use

    window.setTimeout("content = $('#editor').elrte('val')", 1000);


and the content is not empty any more!
:)

--------
After moving

    var content = $('#editor').elrte('val');

from <head>
to <body>
I saw, that my elRTE toolbar is not "maxi".
Why that?

If I delete this code it's working again, crazy?

**
Today I could solve this problem, I just have placed the code at the bottom of the site and it's working, no idea why!
As I could see in Firebug the variable content was always empty at first time, after placing at the bottom it is filled.

(1-7/7)