Parsing a string returned from ckeditor using javascript string methods

Question

I am trying to get a certain area of data out from ckeditor. In order to do that I use the following code

function get_body_html(){
    var email = CKEDITOR.instances['message'].getData();
    var before_body = header_to + to + to_subject + subject + subject_body;
    var s_index = email.indexOf(before_body)+before_body.length;
    var e_index = email.indexOf(body_footer);
    return email.substring(s_index,e_index);
}

For some reason that works when I do this on page load

CKEDITOR.instances.message.setData(header_to + to + to_subject+ 
subject + subject_body + body_text + body_footer);
get_body_html();

it works correctly and gives me the same string that is contained in body_text.

But when I do this

body_text = get_body_html();
CKEDITOR.instances.message.setData(header_to + to + to_subject + subject + 
subject_body + body_text + body_footer);

in an onclick function it gets the wrong indexs somehow. Sometimes it can't find the string and returns -1 other times it just gets a weird index that doesn't make sense. These index variations only happen when my code is changed to tackle the problem a different way. So if it is the wrong indices like -5 and 2 then those would continue to be the wrong indices until I made a code change.

Answer 1

There are two facts that you should know about editor.setData.

1. In some cases it is asynchronous (it depends on the type of editor). That's why it also accepts a callback. Therefore any code that is meant to be executed after setData() should be executed in that callback.
2. It never is asynchronous before editor is ready. In this period (between editor initialization and instanceReady event) it works in a different mode - it just caches the set value and on getData() it returns exactly that value.

So, as I see on page load you call synchronously setData() and getData() - your function works because you get the value you're expecting to get.

But then, when you try to getData() when editor is already ready you get the HTML parsed, fixed, processed and perhaps differently formatted by CKEditor. I guess that your indexOf() checks are not enough to handle this. You have to rethink your function - e.g. regexp can help.

What also can help is removing htmlwriter plugin, which formats HTML in a way which may make it harder for you to work with it. E.g.:

config.removePlugins = 'htmlwriter';

Answer 2

I was able to get it to work. So the htmlwriter was one of the problems because it must add spaces in between by HTML tags. The other issue I found is that it strips some of the semicolons out in some of the style attributes. Overall CKEditor does a lot of formatting of the source which makes it very hard to index correctly but it's pretty much a trial and error thing. I ended up using the search JavaScript method for strings which can take a regular expression but I used it the same way indexOf would be used so I don't really know if that made a difference or not.