jquery jtable with tinymce


jquery jtable with tinymce

是否可以为 jquery jtable 插件添加 tinymce 编辑器以进行创建/编辑操作?

我是jTable插件的新手,但是我需要jquery jtable的创建/编辑操作中的一个字段的tinymce编辑器,所以我想知道我可以使用jtable吗?

我知道我可以在创建/编辑表单中将 jtable 字段制作为文本区域,所以我想知道我是否可以以某种方式在那里添加 tinymce?

1)如果我使用简单的标准代码在主页中添加tinymce(调用jtable),那么创建/编辑记录(没有tinymce)什么都不会发生:

<script type="text/javascript">
    tinymce.init({
        selector: "textarea"        
    });
</script>

2)我还尝试编辑核心jtable文件,将tinymce添加到每个文本区域。它向我展示了 tinymce 编辑器,但问题出在 POST 上。当我发布表单时,它总是给我空值(应该用 tinymce 编辑的值)。

这就是我直接在 jtable 脚本中附加 tinymce 的方式:

.append('<script>tinymce.init({selector: "textarea"});</script>');

3)我尝试的最后一个想法,使用jTable输入选项作为字段:

article: {
   title: 'Article',                    
   input: function (data) {
        return 'tinymce.init({selector: "textarea"});<textarea></textarea>';
   },

这给我带来了一些语法错误。我有一些语法错误,但我相信我可以使用这样的东西。

试试这段代码:

formCreated: function(event, data)
            {
                tinymce.init({
                    selector: "textarea"
                });
            }

经过测试,该解决方案似乎解决了TinyMCE未保存到文本区域的问题(原因 - jtable中的提交事件过载)。 此外,当 jTable 关闭并重新打开编辑窗格时,此解决方案会卸载并重新加载 TinyMCE。

把它们放在一起 - 这对我有用:

formCreated: function (event, data) {
    tinymce.init({
        selector: 'textarea',
        setup: function (editor) {
            editor.on('change', function () {
                editor.save();
            });
        }
    });
    for (var editor_id in tinyMCE.editors) {
        tinyMCE.editors[editor_id].getBody().setAttribute('readonly', '1');
        tinymce.EditorManager.execCommand('mceAddControl', true, editor_id);
        tinymce.EditorManager.execCommand('mceAddEditor', true, editor_id);
    }
},
formClosed: function (event, data) {
    for (var editor_id in tinyMCE.editors) {
        tinyMCE.editors[editor_id].getBody().setAttribute('readonly', '1');
        tinymce.EditorManager.execCommand('mceRemoveControl', true, editor_id);
        tinymce.EditorManager.execCommand('mceRemoveEditor', true, editor_id);
    }
}