Hi all-- i'm having issues with modifying selected text and images in CKEditor-- here is the code that i use to get a selection, and then wrap it in a link. Btw, i am doing this from a dialog on top of the ckeditor.
Overall, it seems like i can't select html items in the WYSYWIG and then wrap them in link tags consistently across browsers. Does anyone have experience with accomplishing this?
/* the base script for ckeditor selection actions, like inserting links/images */ (function(){ var editor=editor||CKEDITOR.instances[parent.$('#WYSIWYGwrapper textarea').attr('id')]; if(CKEDITOR.env.ie){CKEDITOR.dialog.getCurrent().hide();} var selection=editor.getSelection(), element=editor.document.createElement('a'), text="", ranges=selection.getRanges(), range={}, isWebkitShouldExtract=false, clone={}, ShouldExtractWebkit=function(nodes) { var nodelen=nodes.length, i=0; for(;i<nodelen;i+=1) { if(nodes[i].nodeName==="IMG") return true; } return false; }; this.insertMode=true; element.setAttribute("href","www.google.com"); element.setAttribute("target","main"); if(CKEDITOR.env.ie){text=editor.document.$.selection.createRange().htmlText;element.setHtml(text);editor.insertElement(element);} else{ if(ranges.length>0){ range=ranges[0]; clone=range.cloneContents(); if(CKEDITOR.env.webkit){isWebkitShouldExtract=ShouldExtractWebkit(clone.$.childNodes);} element.append(clone); if(!CKEDITOR.env.webkit || isWebkitShouldExtract){range.extractContents();} editor.insertElement(element); } } if(!CKEDITOR.env.ie){CKEDITOR.dialog.getCurrent().hide();} }());
Overall, it seems like i can't select html items in the WYSYWIG and then wrap them in link tags consistently across browsers. Does anyone have experience with accomplishing this?
Re: Modify Selected Text
See http://allampersandall.blogspot.com/2011/11/ckeditor-selection-range.html for how i fixed it