Как избежать смерти экземпляра CKEditor после узла подкачки? - PullRequest
Новая
       8

Как избежать смерти экземпляра CKEditor после узла подкачки?

0 голосов
/ 07 мая 2018

У меня есть HTML-таблица с одним экземпляром CKEditor на каждую строку, все работает нормально, пока я не поменяю местами между 2 строками.После перестановки значения не отображаются, и любое использование метода setData заканчивается ошибкой JS.

Базовая структура: 

<tr id=1>
  <td>...</td>
  <td>ckeditor1</td>
</tr>
.
.
<tr id=n>
  <td>...</td>
  <td>ckeditorn</td>
</tr>

Метод, используемый для перестановки узлов, 

Node.prototype.swapNode = function (node) {
        var nextSibling = this.nextSibling;
        var parentNode = this.parentNode;
        node.parentNode.replaceChild(this, node);
        parentNode.insertBefore(node, nextSibling);  
    };

Итак, я вызываю Node1.swapNode(Node2), CKEditor теряет свое значение, затем снова пытается принудительно установить значения в экземпляре CKEditor через CKEditor.instances[1].setData(data,{});

Этот вызов заканчивается в этой трассировке стека: 

   TypeError: this.document.getWindow(...).$ is undefined  ckeditor.js:427:29
        CKEDITOR.dom.selection.prototype.getNative http://localhost/js/packages/ckeditor/ckeditor.js:427:29
        CKEDITOR.dom.selection http://localhost/js/packages/ckeditor/ckeditor.js:425:54
        CKEDITOR.editor.prototype.getSelection http://localhost/js/packages/ckeditor/ckeditor.js:422:319
        CKEDITOR.plugins.undo.Image http://localhost/js/packages/ckeditor/ckeditor.js:1077:358
        b.prototype.save http://localhost/js/packages/ckeditor/ckeditor.js:1072:24
        .init/< http://localhost/js/packages/ckeditor/ckeditor.js:1068:269
        h http://localhost/js/packages/ckeditor/ckeditor.js:10:68
        CKEDITOR.event.prototype</<.fire</< http://localhost/js/packages/ckeditor/ckeditor.js:11:428
        CKEDITOR.editor.prototype.fire http://localhost/js/packages/ckeditor/ckeditor.js:13:67
        .setData http://localhost/js/packages/ckeditor/ckeditor.js:261:79

Протестировано на FF 52, Opera 52, Chrome 61 @OpenSuse 42.3

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

С уважением

Фрагмент:

Node.prototype.swapNode = function (node) {
            var nextSibling = this.nextSibling;
            var parentNode = this.parentNode;
            node.parentNode.replaceChild(this, node);
            parentNode.insertBefore(node, nextSibling);  
};

var element1 = new     CKEDITOR.dom.element(document.getElementById('doc_content1'));
CKEDITOR.replace(element1);

var element2 = new CKEDITOR.dom.element(document.getElementById('doc_content2'));
CKEDITOR.replace(element2);
<html>
<head>
 <script src="https://cdn.ckeditor.com/4.9.2/full/ckeditor.js"></script>
</head>
<body> 
<form>
<table>
<tbody>
<tr id='1'>
    <td><input name="doc_title1" type="text"></td>
    <td><textarea id="doc_content1" name="doc_content1" ></textarea></td>
    <td><input type="button" onclick="javascript: this.parentNode.parentNode.swapNode(document.getElementById('2'));" value='change to 2'></td>
</tr>
<tr id='2'>
    <td><input name="doc_title2" type="text"></td>
    <td><textarea id="doc_content2"  name="doc_content2"></textarea></td>
    <td><input type="button" onclick="javascript: this.parentNode.parentNode.swapNode(document.getElementById('1'));" value='change to 1'>
    </td>
</tr>
</tbody>
</form>
</body>
</html>

1 Ответ

0 голосов
/ 07 мая 2018

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

Node.prototype.swapNode = function (node) {
    var firstInstance = 'doc_content' + node.id;
    var secondInstance = 'doc_content' + this.id;
    CKEDITOR.instances[firstInstance].destroy();
    CKEDITOR.instances[secondInstance].destroy();
    var nextSibling = this.nextSibling;
    var parentNode = this.parentNode;
    node.parentNode.replaceChild(this, node);
    parentNode.insertBefore(node, nextSibling);  
    CKEDITOR.replace(document.getElementById(firstInstance));
    CKEDITOR.replace(document.getElementById(secondInstance));
};

CKEDITOR.replace(document.getElementById('doc_content1'));
CKEDITOR.replace(document.getElementById('doc_content2'));
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...