从多个CKEditor内联编辑器字段中保存数据,如模板

Nic*_*tin 4 javascript ajax ruby-on-rails ckeditor

我正在建立一个模板系统,设计师可以在其中提交HTML5设计并允许用户添加自己的内容.我正在为应用程序使用CKEditor 4.2和Rails 3.我希望用户能够加载模板页面,然后直接编辑各种内联编辑器,然后通过JS和Ajax保存.我有一切工作,但在添加iFrame插件时,我遇到了一些格式问题,因为我只是将原始HTML从内联编辑器保存到我的模板.有关详细信息,请参阅此问题:CKEditor和iFrame/YouTube /其他嵌入式插件显示奇怪的HTML代码

我现在知道我应该使用类似的东西:

var data = CKEDITOR.instances.editable.getData();
Run Code Online (Sandbox Code Playgroud)

但是,我如何管理这样的多个编辑器?我告诉我的设计师只需使用

contenteditable="true"
Run Code Online (Sandbox Code Playgroud)

对于他们想要编辑的任何div.因此,我没有id为每个编辑器引用,也不知道每个模板文件将包含多少编辑器我希望能够在最终模板中保存不可编辑的内容,当然还有可编辑的内容,这只是一个HTML5页面.

这是我必须使用id为div的div保存整个模板文件的原始内容的解决方案:

$saveButton.click(function(e) {

    // Extract contents of magboy container
    var contents = $("#page-cnt").html();

    // Send contents to server
    $.ajax({
        url: '/pages/'+PageId+'/editor_save',
        type: 'POST',
        data: {
            containerContents: contents
        },
        success: function(response){
            alert("contents saved");
        }
    });

    // prevent original click behaviour
    e.preventDefault();
    return false;

});
Run Code Online (Sandbox Code Playgroud)

总结一下我的问题:

如何在完整的模板页面中实现保存多个CKEditor编辑器内容的保存功能?

非常感谢您的帮助,如果您可以帮助解决这个问题,那么我也会回答同样的问题:使用CKEditor保存多个内联编辑

Nic*_*tin 5

对于任何想要做类似事情的人,请看这个已经回答的问题: ckeditor inline save/submit