Проблема TinyMCE со вторым шоу.Помогите - PullRequest
3 голосов
/ 03 сентября 2011

Добавлен tinyMCE в качестве встроенного редактора.Возникла следующая проблема: в первый раз это хорошо работает - показывать с пользовательским стилем (как я установил), работает правильно, но когда я нажимаю «Отмена», а затем снова начинаю редактирование, у меня появляется пустой редактор - без текста в области редактирования.так что это код: UPD: cm.Node - оболочка для docuement.createElement и el.setAttribute, cm.getByAttr ('attr', 'attr_val', el) - получить атрибут от attr от el.req - оболочка для AJAX, cm.merge - как array_merge в PHP

var EditBlock = function(){
    var my = this;
    var o = cm.merge({
        'id' : '',
        'act' : '',
        'val' : '',
        'nobr' : false,
        'text' : false,
        'onSaved' : function(){},
        'onSave' : function(){},
        'params' : {'iconsPath' : 'interface/common/images/stdc/nicEditorIcons.gif'}
    }, arguments[0]);
    var prefix = 'tinyMCE_' + Math.random() + '_';
    var node = cm.getEl(o.id);
    var txtArea = cm.addClass(cm.Node('textarea', {'id' : prefix + o.id, 'style': ('width:' + node.offsetWidth + 'px')}), prefix + o.id);
    var saveBtn = cm.Node('input', {'type':'button', 'value':'Save'});
    var cancelBtn = cm.Node('input', {'type':'button', 'value':'Cancel'});
    var container = cm.Node('div', txtArea, cm.Node('div', saveBtn, cancelBtn));

    var plainText = function(node){
        var str = '';
        var childs = node.childNodes;        
        for(var i = 0, ln = childs.length; i < ln; i++){
            if(childs[i].nodeType == 3)
                str += childs[i].nodeValue;
            else if(childs[i].childNodes.length)
                str += plainText(childs[i]);
        }
        return str;
    }

    var init = function(){
        node.onclick = my.edit;
        cancelBtn.onclick = my.close;
        saveBtn.onclick = function(){
            my.save();
            my.close();
        }
    }

    my.save = function(){
        var tmp = cm.Node('div', tinyMCE.get(prefix + o.id).getContent());
        var content = o.text? plainText(tmp) : tmp.innerHTML;
        o.onSave(content);
        node.innerHTML = content;
        req({
        'act' : o.act, 
        'data' : 'data[content]=' + escape(content) + (o.val? '&data[val]=' + o.val : ''), 'handler' : function(){o.onSaved(content)}
        });
    }
    my.close = function(){
        tinyMCE.init({
            'editor_deselector' : prefix + o.id
        });
        container.parentNode.removeChild(container);
        node.style.display = 'block';
    }
    my.edit = function(){
        txtArea.value = node.innerHTML;
        node.style.display = 'none';
        node.parentNode.insertBefore(container, node);
        var styles = '';
        var styleRef = cm.getByAttr('rel', 'stylesheet');
        for(var i = 0, ln = styleRef.length; i < ln; i++){
            styles += (i > 0? ',' : '') + styleRef[i].href;
        }
        tinyMCE.init({
            'height' : '100%',
            'content_css' : styles + ',/sdtc-new/nc/interface/common/css/mce-editor.css',
            'mode' : "specific_textareas",
            'editor_selector' : prefix + o.id
        });

    }
    init();
}

, используйте это как:

new EditBlock({'onSave' : function(content){
            page.content = content;
            viewDepartment(page);
        }, 'id':'depContent', 'act' : '/departments/setContent/', 'val' : page.id, 'params' : {buttonList : ['fontSize','bold','italic','underline','strikeThrough','html']}});

Итак ... еще раз о проблеме.Когда в первый раз начинаешь редактировать, все работает нормально, когда нажимаешь сохранить - все тоже работает (все еще есть некоторые ошибки, но после сохранения я могу нажать и начать редактирование снова), но когда нажимаешь отмену, этот редактор скрывается, но когда я нажимаю, чтобы редактировать снова, я имеюпустая область редактирования.Я вижу в консоли и нахожу, что после отмены, когда я снова начинаю редактирование, я создаю новое редактирование, но старое не уничтожает - только скрытое.какой-то результат - после отмены я мог редактировать egain, но область редактирования была без стилей и кнопок.

Пожалуйста, помогите.Если бы был вопрос по коду - с удовольствием отвечу.Спасибо.

Ответы [ 2 ]

5 голосов
/ 05 сентября 2011

Не используйте hide() и show() здесь. Вы должны правильно отключить tinymce, чтобы иметь возможность повторно инициализировать редактор tinymce с тем же идентификатором, что и у первого.

Чтобы закрыть экземпляр редактора, используйте:

tinymce.execCommand('mceRemoveControl',true,'editor_id');

Для повторной инициализации используйте

tinymce.execCommand('mceAddControl',true,'editor_id');
3 голосов
/ 19 августа 2014

Обратите внимание! С тех пор они изменились, возможно, вам повезет больше (для более новых версий, 4+, я думаю):

вместо mceRemoveEditor и mceAddEditor... как в:

tinymce.execCommand('mceRemoveEditor',true,'editor_id');

tinymce.execCommand('mceAddEditor',true,'editor_id');
...