Как я могу удалить tinyMCE и затем добавить его? - PullRequest
Новая
       12

Как я могу удалить tinyMCE и затем добавить его?

34 голосов
/ 11 января 2011

Я пытаюсь добавить редактор tinyMCE на свою страницу, удалить его, затем добавить снова, но получаю ошибки.

Когда я запускаю часть A, затем часть B, затем снова часть A, я получаю сообщение об ошибке: 

Error: g.win.document is null
Source File: tiny_mce/tiny_mce.js Line: 1

Часть A 

        js += "            tinyMCE.init({ ";
        js += "                'mode' : 'exact', \n";
        js += "                'elements' : '" + ctrl.ID + "Editor', \n";
        js += "                'plugins' : 'insertdatetime,TVCMSLink,TVCMSImage',\n";
        js += "                'theme' : 'advanced',\n";
        js += "                'theme_advanced_layout_manager' : 'SimpleLayout',\n";
        js += "                'theme_advanced_buttons1' : 'backcolor, forecolor, |, bold, underline, strikethrough, |, numlist, bullist, charmap, |, undo, redo, |, anchor, link, tvlink, unlink',\n";
        js += "                'theme_advanced_buttons2' : '',\n";
        js += "                'theme_advanced_buttons3' : ''\n";
        js += "            });\n";

Часть B 

        js += "                        tinyMCE.getInstanceById('" + ctrl.ID + "Editor').remove();\n";

Edit:

Выше приведены бэкэнды, которые создают JavaScript ... ниже приведена полная функция JavaScript. Первый раз через него открывается диалог и работает, содержимое находится в редакторе и ошибки нет. Когда я нажимаю кнопку закрытия, диалоговое окно закрывается. Когда я снова запускаю эту функцию, появляется диалоговое окно, но редактор пуст и появляется указанная выше ошибка. 

function show_HP1B0() {
$('.EditLink').hide();
$.ajax({
    type: 'post',
    url: 'genericHandler.ashx',
    data: 'cmd=select&tableName=ExtraBlocks&id=4',
    dataType: 'json',
    success: function(data) {
        $('#HP1B0Editor').html(data['rows'][0]['Content']);
        alert($('#HP1B0Editor').html());
        tinyMCE.init({                 'mode' : 'exact', 
            'elements' : 'HP1B0Editor', 
            'plugins' : 'insertdatetime,Link,Image',
            'theme' : 'advanced',
            'theme_advanced_layout_manager' : 'SimpleLayout',
            'theme_advanced_buttons1' : 'backcolor, forecolor, |, bold, underline, strikethrough, |, numlist, bullist, charmap, |, undo, redo, |, anchor, link, tvlink, unlink',
            'theme_advanced_buttons2' : '',
            'theme_advanced_buttons3' : ''
        });
        var dlg = $('#ctl00_EXTRA_HTML_0_HP1B0Editor').dialog({
            modal: false,
            draggable: false,
            position: 'center',
            zIndex: 99999,  // Above the overlay
            width: 370,
            title: 'Content Block Editor',
            closeText: '',
            open: function () {
                $('body').css('overflow', 'hidden');
                if ($.browser.msie) { $('html').css('overflow', 'hidden'); } $('<div>').attr('id', 'loader').appendTo('body').show();
            },
            close: function () { $('body').css('overflow', 'auto'); if ($.browser.msie) { $('html').css('overflow', 'auto'); } $('#loader').remove(); },
            buttons: {
                'Save': function () {
                    tinyMCE.getInstanceById('HP1B0Editor').remove();
                    $('.EditLink').show();
                    $(this).dialog('close');
                },
                'Cancel': function () {
        alert('HP1B0Editor');
                    tinyMCE.getInstanceById('HP1B0Editor').remove();
                    $('.EditLink').show();
                    $(this).dialog('close');
                }
            }
        }).parent();
        dlg.appendTo(jQuery('form:first'));
    },
    error: function(data) {
        $('.EditLink').show();
        $('#HP1B0Editor').html('Error');
    }
});
}

Ответы [ 14 ]

0 голосов
/ 11 ноября 2018 
// Remove all editors bound to divs
tinymce.remove('div');

// Remove all editors bound to textareas
tinymce.remove('textarea');

// Remove all editors
tinymce.remove();

// Remove specific instance by id
tinymce.remove('#id');

из документации Tinymce

0 голосов
/ 25 августа 2017

В начале я использовал: 

tinymce.execCommand('mceRemoveEditor', true, id);
tinymce.execCommand('mceAddEditor', true, id);

Но эти команды выполняются асинхронно, поэтому команда add часто терпит неудачу. В качестве обходного пути я бы: 

tinymce.execCommand('mceRemoveEditor', true, id);
setTimeout(function() {
    tinymce.execCommand('mceAddEditor', true, id);
}, 500);

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

Сейчас я использую: 

tinymce.remove(id);
tinymce.init({
    selector: id
});

Я не уверен, почему это работает, но это работает, и у этого кода нет никаких асинхронных проблем, которые имел старый использованный код.

Попробуйте здесь: https://jsfiddle.net/g0u059au/

0 голосов
/ 10 декабря 2015

Для чего это стоило, я закончил тем, что сделал:

  1. Попробуйте удалить редактор прямо перед тем, как добавить его на страницу (это работает для chrome)
  2. Прежде чем яудалить редактор, вызвать сохранение.По какой-то причине это было важно для Firefox.

Вот как выглядело это добавить редактор: 

  $(function() {
    tinymce.EditorManager.execCommand('mceRemoveEditor',true, 'fred');
    #{tinymce_javascript(:simple_editor, {height: 150, :selector => 'fred'})}
  });

  $(document).on('click', '.tinyMCE-save', function(event) {
    tinyMCE.triggerSave();
    return true;
  });

У меня был явный щелчок, который удалил редактор: 

<a href="#" class="tinyMCE-save cool-js-click-handler">Cancel</a>
0 голосов
/ 03 ноября 2015

Все вышеперечисленные решения не сработали для меня ... Это нормально работало в моем закрытии всплывающего окна 

var editor = tinyMCE.get('txtMailingText');
if (editor!=null) {
    editor.destroy();
}
Страница:
...