I've built a placeholder system where it inserts many default paragraphs into the editor. If they select any paragraph that contains this placeholder data, then it'll select the entire paragraph. The code looks like this:
sel = editor.getSelection()
ranges = sel.getRanges()
isPlaceholder = false
for range in ranges
iterator = range.createIterator()
while (block = iterator.getNextParagraph())
if $(block.$).hasClass 'default-value'
isPlaceholder = true
range.enlarge(CKEDITOR.ENLARGE_BLOCK_CONTENTS)
if isPlaceholder
sel.selectRanges ranges
The line 'while (block = iterator.getNextParagraph())' is adding empty paragraph (p) elements to the content whenever I add an element to the content.
Before:
<h1>Content</h1>
<p id='about-to-add'>This is content</p>
Code:
$("#about-to-add").before("<p>More Content</p>")
After:
<h1>Content</h1>
<p></p>
<p>More Content</p>
<p id='about-to-add'>This is content</p>
Notice the empty 'p' element. I'm running CKEditor 4. If you look at http://docs.cksource.com/ckeditor_api/symbols/src/plugins_domiterator_plugin.js.html the offending line is line 284 (Although not the same source, it's similar enough to help you understand):
range.insertNode( block );
But I can't for the life of me figure out why it wants to add a 'p' element and how to prevent it. Any help would be appreciated.
For now my current fix is:
For now my current fix is:
sel = editor.getSelection()
ranges = sel.getRanges()
isPlaceholder = false
for range in ranges
iterator = range.createIterator()
while (block = iterator.getNextParagraph())
$("p:empty").remove() # Current fix
if $(block.$).hasClass 'default-value'
isPlaceholder = true
range.enlarge(CKEDITOR.ENLARGE_BLOCK_CONTENTS)
if isPlaceholder
sel.selectRanges ranges
But I don't like this fix.
Here's my code in javascript:
Here's my code in javascript:
var block, isPlaceholder, iterator, range, ranges, sel, _i, _len;
sel = editor.getSelection();
ranges = sel.getRanges();
isPlaceholder = false;
for (_i = 0, _len = ranges.length; _i < _len; _i++) {
range = ranges[_i];
iterator = range.createIterator();
while ((block = iterator.getNextParagraph())) {
$("p:empty").remove();
if ($(block.$).hasClass('default-value')) {
isPlaceholder = true;
range.enlarge(CKEDITOR.ENLARGE_BLOCK_CONTENTS);
}
}
}
if (isPlaceholder) {
sel.selectRanges(ranges);
}