保存数据从多个CKEditor的行内编辑器领域像一个模板 [英] Save Data From Multiple CKEditor Inline Editor Fields Like A Template

问题描述

我设置了​​一个模板系统，设计人员可以提交HTML5设计，并允许用户添加自己的内容。我使用的CKEditor 4.2和Rails 3应用程序。我希望用户能够加载的模板页面，然后直接编辑各种在线编辑器，然后保存通过JS和Ajax。我拥有了一切努力，但增加的iFrame插件时，我遇到了一些格式问题，因为我只是节省下在线编辑原始HTML我的模板。看到这一问题的详细信息：<一href="http://stackoverflow.com/questions/19383748/ckeditor-and-iframe-youtube-other-embed-plugins-show-weird-html-$c$c">CKEditor和iframe / YouTube的/其他嵌入插件显示奇怪的HTML code

I'm setting up a template system where designers can submit HTML5 designs and allow users to add their own content. I'm using CKEditor 4.2 and Rails 3 for the app. I would like users to be able to load the template page and then edit the various inline editors directly, then save via JS and Ajax. I had everything working but when adding iFrame plugin I ran into some formatting issues because I was simply saving the raw HTML from the inline editors to my templates. See this question for more details: CKEditor and iFrame/YouTube/Other Embed Plugins Show Weird HTML Code

现在我知道我应该使用类似：

I now know I should use something like:

var data = CKEDITOR.instances.editable.getData();

不过，我将如何管理多个编辑这样吗？我已经告诉我的设计人员只需使用

But how would I manage multiple editors like this? I've told my designers to simply use

contenteditable="true"

因为他们想成为可编辑的任何股利。因此，我没有身份证的引用的每个编辑器，不知道每个模板文件将有多少编辑器包含我希望能够节省不可编辑内容的过程中可编辑的内容，并在最后的模板，这仅仅是一个HTML5页面。

for any div they want to be editable. Hence I have no id's to reference for each editor and don't know how many editors each template file will contain I would like to be able to save both non-editable content and of course editable content in the final template, which is just a HTML5 page.

下面是解决方案，我用了一个div id为拯救整个模板文件的原始内容：

Here is the solution I had to save the raw contents of the entire template file using a div with id:

$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;

});

所以，总结一下我的问题：

我怎样才能实现保存功能保存几个CKEditor的编辑内容在一个完整的模板页？

How can I implement a save function that saves the content of several CKEditor editors in a complete template page?

非常感谢您的帮助，如果你能帮助解决这个问题，那么它会回答同样的问题我也相信：的保存多个随即修改与CKEditor的

Thanks so much for any help and if you can help with this question, then it will answer this same question also I believe: Saving multiple inline edits with CKEditor

推荐答案

对于任何人都希望做同样的事情看到这个已经回答的问题： ckeditor的在线保存/提交

For anyone looking to do something similar see this already answered question: ckeditor inline save/submit

这篇关于保存数据从多个CKEditor的行内编辑器领域像一个模板的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！