• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Clear/Replace redactor content programmatically

#1
Hello,

I want to insert some content to the redactor editor programmatically. The content should be replace the existing content in the editor. I found a solution for inserting new content but this append the content instead of replace. Is there a way to clear the redactor content first or replace content with other content. I couldn't find a possibilty to do that. Does anyone know how I can clear or replace the redactor content?
 
#2
I have found this solution but it's not working at all:

$('iframe').contents().find('body').html('');

At tinyMCE there was a possibilty to set new content to the editor with this code:

tinyMCE.activeEditor.setContent('new content');

This replaced the old content and set the new one instead. Is there any similar possibilty for redactor to do that?
 
#4
Which selector has "$editor" in your example? If I use $('textarea.BbCodeWysiwygEditor').selectionAll().selectionRemove(); I get the error message TypeError: $(...).selectionAll is not a function.
 

Jeremy

Well-known member
#5
Looks like .selectionAll() and .selectionRemove() are Redactor 9 API functions. Some work got me this to clear the editor:
Code:
var $form = $('#QuickReply')
  , ed = XenForo.getEditorInForm($form);

if(!ed) {
  // no editor found
  return false;
}

if(ed.$editor) {
  // redactor
  ed.$editor.html('');
} else {
  // BBCode editor
  ed.val('');
}
 
#6
There is one problem with this solution, the same problem like the the solution with:

$('iframe').contents().find('body').html('');

Write something in the editor, clear the content with your code snipped and then refresh the page. You will see that the old content is still in the editor although the editor was cleared. Do you have any idea why?
 

Jeremy

Well-known member
#7
You are hitting the draft save. The saveDraft() function of XenForo.BbCodeWysiwygEditor is what you need, but I'm having trouble instantiating it properly.
 
#8
I have found a solution based on your code snipped:

Code:
var $form = $('#QuickReply')
  , ed = XenForo.getEditorInForm($form);

if(!ed) {
  // no editor found
  return false;
}
if(ed.$editor) {
  // redactor
  ed.$editor.html('');
  ed.$el.val(''); // The  new line
} else {
  // BBCode editor
  ed.val('');
}
Thank you for your help!
 

Chris D

XenForo developer
Staff member
#9
I used the code snippets here to clear the editor in my add-on, but I noticed today (Thanks @Brogan) that although the content was being cleared and the editor losing focus, the editor wasn't returning back to its normal state.

This is how it is done after a post is created:

Code:
                        var $textarea = $('#CommentForm').find('textarea');
                        $textarea.val('');
                        var ed = $textarea.data('XenForo.BbCodeWysiwygEditor');
                        if (ed)
                        {
                            ed.resetEditor();
                        }
This handles the basic text area and the rich text editor.