Updating data in CKEditor on IE 8 blanks out the data

[anandk]

The code we have works fine on Firefox. That said, it is weird on IE 8. On IE 9, it simply crashes the browser. Here is what we are doing: On a page with N CKEditor instances, we let the user enter some data in each of the N text areas. After this, the user can choose the kind of alignment she would like to have & it is expected that the data in each of those text areas would align themselves relative to the longest string of data (and some other rules). Hence, it is expected that the CKEditor instances will update themselves & render properly aligned data. Here are the high level steps we are executing:

1. Get the CKEditor instances & pass them to the alignment function (JS)
2. Remove all custom <span>s that we might have applied on each of the instances & simply work with the data
3. Compute the widest data amongst the instances
4. Add custom span to each CKEditor instance's data with a padding derived relative to widest piece of data
5. Call updateElement()

Typical sequence of functions called:

1. var initialHtml = this.getSnapshot();
2. Manipulate initialHtml into replacedHtml
3. this.loadSnapshot(replacedHtml);
4. this.updateElement();

With each of the editors, the sequence of function calls is as follows:

1. var html = this.getBody(); & var spanElement = $(html).find('.special_class');
2. Compute width & required padding
3. spanElement.replaceWith('blah')
4. this.updateElement();

Once again, this works fine on FF & then has erratic behaviour on IE 8. Sometimes the alignment goes through fine. Sometimes only some are aligned. Often all data gets cleared/blanked out. On IE 9 it simply crashes.

[Alfonso Martínez de Lizarrondo]

In order to understand your problem we will need a test page. It's almost impossible to create a test just from your description.

You should create a page as simple as possible with easy steps to reproduce and understand what's the probelm.