Stop CKeditor from adding/removing DIVs

Why you want to do this???

The editor contents are written out every time you switch mode, so what you want to do could likely break the editor because it is invalid HTML.

Thanks,
Zanpakutō

Short answer : You can't.
Loading invalid HTML markup into CKEditor will only result in Ckeditor correcting that invalid markup. It is a WYSIWYG HTML editor and in order to process HTML, that HTML must be valid so that erroneous problems do not occur.

I suggest you entirely rethink your method. One way may be to only load the individual DIV tag into the editor, which you want to edit.

Thanks,
Zanpakutō

try in config.js maybe ?

config.enterMode = CKEDITOR.ENTER_BR;

Short answer : You can't.
Loading invalid HTML markup into CKEditor will only result in Ckeditor correcting that invalid markup. It is a WYSIWYG HTML editor and in order to process HTML, that HTML must be valid so that erroneous problems do not occur.

Given the number of complaints from people having issues with the various ways that CKEditor "mangles" the inputted source to make it valid (adding </div>'s, etc.) or prettier (adding line breaks or spacing), and the opposing yet totally understandable need for valid html for CKEditor to process, is there any way that CKEditor could somehow "flag" or "remember" the changes that it makes to the entered html to make it valid / pretty, and then provide a way for programmers to access just the "raw" html that doesn't include those changes? That would be a HUGE step in making CKEditor usable in situations that it currently doesn't handle very well, like the one described above.

I've been fighting with the editor for longer than I care to admit over all of this. I've even gone so far as to surround my unmatched DIVs with [[ ]] "fake tags" (e.g. [[<div id=content>]], and then setting the protectedSource config variable inline with

CKEDITOR.config.protectedSource.push('\[\[.*\]\]');

but that didn't seem to work as expected. The <div> tag was still recognized as such, processed with line breaks and got a closing </div> stuck into the bottom of the source file. Perhaps if protectedSource stuff was completely ignored and not processed as it still appears to be, that fact could be used by individuals like myself to make things work the way we need them to.

CKEditor is a great tool, but this is the one place where I have to admit it isn't working for me and I currently don't know how to change that. From what I can tell the only solutions are to create a custom dataprocessor / html writer (something that is way over my head) or switch to a different online editor .. and switching away is likely less time & effort for me and thus less expense for my company, so I'm afraid that is the direction they're going to make me take.

Ok, like I mentioned, digging into things like Javascript are over my head .. I'm not a javascript programmer but CKEditor is going to force me to become one, it seems. Oddly enough, I thought I'd be able to avoid that by using CKEditor .. sigh ..

So I realize that my setting of the protectedSource property above is wrong, and it should probably be:

CKEDITOR.config.protectedSource.push(/\[\[.*\]\]/);

However, that still doesn't work. When I have an editor instance and I type (in source mode)

[[div id="basic"]][[<table align="center" cellspacing="0" style="background: none repeat scroll 0% 0% rgb(191, 191, 191);">]][[<tbody>]][[<tr>]][[<td>]]

and then toggle out of Source mode and back into it, I get:

[[
<div id="basic">]][[]][[]][[]][[
<table align="center" cellspacing="0" style="background: none repeat scroll 0% 0% rgb(191, 191, 191);">
<tbody>
<tr>
<td>]]</td>
</tr>
</tbody>
</table>
</div>

It appears that the protectedSource functionality isn't working, either because I've messed up the regex, or something else is wrong. Can I get any help here? If we can get this to work, my problem (and that of the original poster) can be solved by surrounding unmatched tags with [[ ]] and then stripping those square brackets off outside of CKEditor.

Good luck finding a browser based WYSIWYG that handles malformed HTML.

Load this sample inyour browser and check how the browser has closed the span and changed the attributes

<!doctype html>
<html>
  <head>
</head>
<body>
<div id="content">
   <span Class="myClass" myProperty="true" style="background:#f00;">non closed span
</div>

<textarea id="out" cols=80 rows=6></textarea>
<script type="text/javascript">
var div =document.getElementById("content");

document.getElementById("out").value = div.innerHTML;
</script>
</body>
</html>

Load this sample inyour browser and check how the browser has closed the span and changed the attributes

Nice .. I looked at it in FireFox and see that it changed the html, then looked in IE (the bane of my existence) and it did NOT. Wow, that's a first .. IE works BETTER than Firefox. Great ..

Thanks for this test, it really clarifies things.