Диалоговое окно TinyMCE и JQuery: TinyMCE только для чтения, когда модальное: true в диалоговом окне

Я использую плагин TinyMCD в плагине Dialog.

Все работает нормально, пока я не установил для модального параметра диалога значение true. Когда я это делаю, текстовое поле TinyMCE работает нормально только при первом открытии диалогового окна, а затем становится доступным только для чтения.

Вот пример моего кода:

tinyMCE.init({ mode: 'none' });
        var dlgComments = $('#dlgInternalComments');
        if (dlgComments.length == 0)
        {
            dlgComments = $('<div/>').attr('id', 'dlgInternalComments'),
                txtAreaComments = $('<textarea/>').attr('id', 'txtInternalComments').appendTo(dlgComments);

            dlgComments.dialog({
                height: 300,
                width: 800,
                modal:true,
                open: function ()
                {
                    if ($('#txtInternalComments_parent', $(this)).length == 0)
                    {
                        var ddd = {mode:'none'}; //$.extend({}, Globals.RichTextBox, { mode: 'none' });
                        txtAreaComments.tinymce(ddd);
                    }
                },
                buttons: {
                    'Parse': function ()
                    {
                        processAuthorsParagraph();
                        $(this).dialog('close');
                    }
                }
            });
        }
        else
        {
            dlgComments.dialog('open');
        }

Я не знаю, как решить эту проблему. Я попробовал несколько предложений отсюда: http://www.codestumps.com/2011/05/adding-tinymce-into-a-jquery-ui-dialog/, но я не нашел решения.

Если вы можете мне помочь, большое спасибо.


person Milos Cuculovic    schedule 09.07.2012    source источник
comment
Также см. ответы в этой теме: stackoverflow.com /вопросы/10095696/   -  person Vitaly    schedule 28.04.2014


Ответы (1)


Проблема решена, вот полный рабочий код:

function removeTinyMCE () {
    tinyMCE.execCommand('mceFocus', false, 'dialog-modal');
    tinyMCE.execCommand('mceRemoveControl', false, 'dialog-modal');
}

function addTinyMCE() {
    jQuery('#dialog-modal').tinymce({
        script_url: '/js/tiny_mce_3.2.7_jquery/jscripts/tiny_mce/tiny_mce.js',
        width: "800px",
        mode: "textarea",
        theme : "simple",
    });
}

function addAuto()
{
    $('#dialog-modal').dialog({
        autoOpen: true,
        modal: true,
        title: "Email Dialog",
        open: addTinyMCE,
        close: function() {
            removeTinyMCE();
            $(this).dialog('destroy');
        },
        buttons:  {
            'Cancel': function() {
                processAuthorsParagraph();
                removeTinyMCE();
                $(this).dialog('destroy');   
            }
        }
    });
}

И html для диалога:

<div style="display: none"; id="dialog-modal" title="Basic modal dialog" style="display: none" ></div> 
person Miloš    schedule 09.07.2012
comment
Извините, но я не понимаю. С этим кодом выше есть только пустая страница и невидимый #dialog-modal Div. Как запустить? Как открыть диалог? добавитьАвто(); или addTinyMCE() только что вызвал ошибку: jQuery(...).tinymce не является функцией. Он также жалуется на тему. Я понял, что в версии 4.x нет тем, кроме современной темы. Но потом я попробовал его с версией 3.5, и он все еще жалуется. Не могли бы вы добавить остальную часть кода, если чего-то не хватает, или сказать мне, какие версии jQuery, jQuerUI и tinyMCE вы использовали? - person user2718671; 22.04.2014