Экземпляр CKEditor в диалоговом окне jQuery

Я использую jQuery для открытия диалогового окна с textarea, преобразованным в экземпляр CKEditor. Я использую адаптер jQuery, предоставленный командой CKEditor, но когда открывается диалоговое окно, я не могу взаимодействовать с редактором (он создан, но "null" написан в пространстве содержимого, и я не могу ничего щелкнуть или изменить содержимое).

этот отчет об ошибке кажется, говорят, что с помощью исправления при условии, что проблема исправлена, но, похоже, не работает для меня...

вот мой код (возможно, я сделал что-то неправильно программно):

HTML:

<div id="ad_div" title="Analyse documentaire">
<textarea id="ad_content" name="ad_content"></textarea>
</div>

My включает (все включено правильно, но, возможно, это проблема с включением заказа?):

<script type="text/javascript" src="includes/ckeditor/ckeditor.js"></script>
<link rel="stylesheet" type="text/css" href="includes/jquery/css/custom-theme/jquery-ui-1.7.2.custom.css" />
<script type="text/javascript" src="includes/jquery/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="includes/jquery/js/jquery-ui-1.7.2.custom.min.js"></script>
<script type="text/javascript" src="includes/jquery/plugins/dialog-patch.js"></script>
<script type="text/javascript" src="includes/ckeditor/adapters/jquery.js"></script>

Javascript:

$('#ad_content').ckeditor();

/* snip */

$('#ad_div').dialog(
{
    modal: true,
    resizable: false,
    draggable: false,
    position: ['center','center'],
    width: 600,
    height: 500,
    hide: 'slide',
    show: 'slide',
    closeOnEscape: true,
    autoOpen: false
});

$('.analyse_cell').click(function(){
    $('#ad_div').dialog('open');
});

Edit: после некоторого дальнейшего тестирования я заметил, что нажатие на кнопки панели инструментов дало мне эту ошибку:

ошибка: этот.документ.getWindow().$ есть неопределенный исходный файл: включает/с CKEditor/с CKEditor.линия js: 82

6
ckeditor jquery jquery-dialog

11 ответов

я использовал функцию обратного вызова с опцией " show: "для задержки создания экземпляра CKEditor до завершения анимации" show". Я обнаружил, что всего 50 миллисекунд будет делать трюк.

modal: true,
show: {
    effect: "drop",
    complete: function() {
        setTimeout(function(){
            $( "#selector" ).ckeditor();
        },50);
    }
},
hide: "drop",

надеюсь, что это помогает.

3
$('.analyse_cell').click(function(){
    $('#ad_div').dialog({
        modal: true,
        resizable: false,
        draggable: false,
        position: ['center','center'],
        width: 600,
        height: 500,
        hide: 'slide',
        show: 'slide',
        closeOnEscape: true,
        autoOpen: false,
        open: function(event,ui) {
            $('#ad_content').ckeditor();
        },
        close: function(event,ui) {
            CKEDITOR.remove($("#ad_content").ckeditorGet());
        }
    });
});
2

используйте последнюю версию CKEditor. Решил за меня. Версия 3.4.2

2

просто добавьте этот фрагмент в свой документ, и проблема будет решена!

$(document).on('focusin', function(e) {
     e.stopImmediatePropagation();
});
1

попробуйте положить ниже адаптера. Исправление переопределяет адаптер.

0

ну по какой-то причине я не мог заставить его работать, но сумел получить тот же эффект, реализовав ту же функциональность вручную.

0

я столкнулся с той же проблемой, и по какой-то причине я обнаружил, что ввод текста в textarea перед открытием диалога может сделать трюк. Не настоящее решение, но работает на меня.

$('#ad_content').ckeditor();

/* snip */

$('#ad_div').dialog(
{
    modal: true,
    /* Your options here. */
});

$('.analyse_cell').click(function(){
    // Add some content into textarea.
    $('#ad_content').val("Enter content here.");
    $('#ad_div').dialog('open');
});
0

Я решил это, просто добавив zIndex=-1 в конструкторе диалогового окна jQuery UI так

$('#modalWindow').dialog({ autoOpen: false, modal: true, zIndex : -1});
0

Я использую jQuery для открытия диалогового окна с textarea, преобразованным в экземпляр CKEditor. Я использую адаптер jQuery, предоставляемый CKEditor команда, но когда открывается диалоговое окно, я не могу взаимодействовать с редактором (он создан, но null написано в пространстве содержимого, и я не могу ничего щелкнуть или изменить содержимое).

ошибка: этот.документ.getWindow().$ - неопределенный исходный файл: включает/ckeditor / ckeditor.js
Линия: 129

Я использую версию 3.6.2

0

просто решил ту же проблему, отключив эффект jQuery UI во всплывающем диалоговом окне (опция show).

мне потребовалась вечность, чтобы понять это. Теперь редактор ведет себя так, как и ожидалось.

0

мистику, но это помогло мне. Перед созданием диалога я принудительно устанавливаю пустые данные

CKEDITOR.instances['email_text_of_message'].setData('')

и ckeditor ("ckeditor", "~> 3.4") в диалоговом окне работает нормально.

$("#create_email").click(function(event){

CKEDITOR.instances['email_text_of_message'].setData('')

$("#email_body").dialog({    modal: true,
                             minHeight: 720,
                             minWidth: 900,
                             buttons: [
                            {
                             id: "button_create_email",
                             text: $('#inv_notice16').text(),
                             click: function() {
                                    $("#email_body").dialog('close')
                           }
                            }]}); 
    return false;       
})
0