CKEditor with JQuery UI Dialog - does not show up second time
I am trying to implement the CKEditor inside an JQuery UI Dialog, when the dialog opens first time it works perfect.
When I open the dialog the second time, the text area as as "style:hidden" and editor is not loaded?
Dialog
MyApp.Dialog = $('<div></div>');
MyApp.Dialog
.dialog({
modal: true,
autoOpen: false,
title: title,
width: width,
height: height,
close:function(){
$(this).find('textarea').ckeditorGet().destroy();
},
buttons: {
'OK': function() {
form = $(this).find('form');
if (form.validate().form() == true) {
MyApp.submitFormWithAjax(form, $(this));
} else {
return false;
}
},
Cancel: function() {
$(this).dialog('close');
}
}
});
MyApp.Dialog.load(url, function() {
EventManager.publish('showFormDialogLoaded');
});
MyApp.Dialog.dialog('open');
on my admin page I am waiting that the dialog is loaded..
$('.admin-create-article').click(function(event) {
MyApp.showFormDialog($(this).attr('href'), 'Neuer Artikel', 700, 630);开发者_运维问答
EventManager.subscribe('showFormDialogLoaded', function() {
$('.editor').ckeditor( function() {}, { skin : 'v2' } );
});
event.preventDefault();
});
I had the same problem, but now it works for me.
You must do that on each dialog construct (create and destroy the ckeditor):
if (CKEDITOR.instances.editorD != null && CKEDITOR.instances.editorD != 'undefined')
{
CKEDITOR.instances.editorD.destroy();
}
CKEDITOR.replace( 'editorD',
{
language : 'fr',
toolbar_Mytoolbardata :
[
['Bold','Italic','Underline','Strike'],
['FontName','FontSize'],
['TextColor']// No comma for the last row.
],
toolbar : 'Mytoolbardata',
skin: 'v2',
width : 403,
height : 25,
disableObjectResizing : true,
resize_enabled : false,
shiftEnterMode : CKEDITOR.ENTER_BR,
toolbarCanCollapse : false,
forcePasteAsPlainText : true
});
Script files are not loaded or conflict with some other scripts like jquery UI script.
精彩评论