Wednesday, 11 September 2013

Replace textfield with select CKEditor 4 image dialog box

Replace textfield with select CKEditor 4 image dialog box

I'm trying to replace the default text field for the URL with a select
drop down populated with images from a database; however I managed to get
everything working besides actually placing the image into the editor. I
wrote a little adaption that does the desired effect within the dialog
box, however when I press "OK" it still fails to place the image within
the textarea. Any ideas?
Current adaptation:
CKEDITOR.on("dialogDefinition", function(ev){
var d_name = ev.data.name, d_def = ev.data.definition, info = null,
preview = null;
if(d_name == "image") {
info = d_def.getContents("info");
info.remove("txtHSpace");
info.remove("txtVSpace");
info.remove("txtUrl");
info.add({
id: "txtUrl",
type: "select",
label: "Site Images",
items: images,
onChange: function(){
preview = $("#cke_66_previewImage"), val = this.getValue();
if(val) {
preview.attr("src", val).removeAttr("style");
} else {
preview.removeAttr("src").css("display", "none");
}
},
validate: function(){
val = this.getValue();
return(val != "" && val != null);
}
});
}
});

No comments:

Post a Comment