Hi,
I would like to update a div on keyup, but I'm struggling to get the following to work(update) on every char which is entered:
Until now I have modified the api.html example as follows:
Could someone give me a hint on how to do this in a reasonable way?
Thank you for your help.
I would like to update a div on keyup, but I'm struggling to get the following to work(update) on every char which is entered:
Until now I have modified the api.html example as follows:
- I added a
<div "testcontent">
- At the moment, the function GetContents is triggered by this button:
<input onclick="GetContents();" type="button" value="Get Editor Contents (XHTML)" />- but this should happen on the keyup event.
- I have these functions in the script area in my php file:
CKEDITOR.on( 'instanceReady', function( ev )
{
// Show the editor name and description in the browser status bar.
document.getElementById( 'eMessage' ).innerHTML = '<p>Instance "' + ev.editor.name + '" loaded.<\/p>';
// Show this sample buttons.
document.getElementById( 'eButtons' ).style.visibility = '';
});
function GetContents()
{
// Get the editor instance that we want to interact with.
var oEditor = CKEDITOR.instances.editor1;
var content = oEditor.getData();
document.getElementById( 'contentdiv' ).innerHTML = '<div style="border: 1px solid black">The Content: <br><br>' + content + '</div>';
}
Could someone give me a hint on how to do this in a reasonable way?
Thank you for your help.

Re: Update div on keyup
$('#editor').ckeditor(init_ckeditor, ckconfig); var editor = $('#editor').ckeditorGet(); editor.on('key', function(ev){ GetContents(); });Re: Update div on keyup
As it seems, this replaces the editor
but where to add this?:
$('#editor').ckeditor(init_ckeditor, ckconfig); var editor = $('#editor').ckeditorGet(); editor.on('key', function(ev){ GetContents(); });Can someone explain how this piece of code should be used?
Re: Update div on keyup SOLVED
<script type="text/javascript"> //<![CDATA[ var editor = CKEDITOR.replace( 'editor' ); editor.on('key', function(ev){ GetContents(); }); //]]> </script>