I have a reporting tool, which is using CKeditor WYSIWYG (see attachment).
I want to add, after the CKEditor initialisation, an image which src is a data image.
This image is added in <p> tag, through javascript. I just pushed it in the HTML innerHTML.
My problem is, that after the image is inserted, I cannot double click on the image because CKEditor won't recognise it as an image.
If I save my report, and open it again. The CKEditor will re-initalise the html content and than I can double click that image an see the image properties. I've tried, on adding the image in javadcript, to fake the parent <span> over the image, which CKEditor puts over the image. But without any success.
What Can I do, so after the CKEditor initialisation, I can add an image in javascript to the content of CKEditor, and CKEditor will be able to work with this image so I can access the image properties and so on?
Inserting html
To insert any kind of html at the curent insertion point in a CK instance:
In this case we are assuming the command is executed in a window opened by the page being edited, if not then remove 'opener'
'editable' is the id of the text field being edited.
var image_tag="<img src='....'>";
var doctarget = opener.CKEDITOR.instances.editable;
doctarget.insertHtml(image_tag);
Doing it this way, CK recognises the change.
HTH.
position of image
Thanks for the feedback.
I have read about this already but my question is if you can determine the position of this image in the content of CKEditor?
Won't this code just put this image on the bottom of the DOM of CKEditor?
No, it places it wherever the
No, it places it wherever the editing insertion point is.