如何使用ckeditore通过ajax发送数据？答案

【问题标题】：how to send data with ajax using ckeditore?如何使用ckeditore通过ajax发送数据？
【发布时间】：2012-10-31 01:35:26
【问题描述】：

我在 django 中有一个表单。这是“撰写邮件”表格。我将此表单从视图发送到我的模板，然后我应用 ckeditor 来更改正文样式。我希望这个表格由 ajax 发布。并且当使用 ckeditor 时，body 字段的值不会与 request.POST 一起发送。我使用这行代码来使用ckeditor：

CKEDITOR.replace('id_body');

（不使用ckeditor，一切正常。）

<form id="compose_form" action="compose/" method="post">
        {% csrf_token %}
        {{ form.non_field_errors }}
        <div>
            <div class="form-field">
                <label for="id_recipient">{% trans 'recipient' %}:</label>
                {{ form.recipient }}               
                {{ form.recipient.errors }}
            </div>
            <div class="form-field">
                <label for="id_subject">{% trans 'subject' %}:</label>
                {{ form.subject }}
                {{ form.subject.errors }}
            </div>
        </div>
        <div class="form-field">
            {{ form.body }}
            {{ form.body.errors }}
        </div>        
            <input id="messages-submit" type="submit" value=""Send"/>
        </div>
    </form>

我使用这个脚本通过 ajax 发送表单数据：

<script type="text/javascript">
        $(function() {
            $('#compose_form').submit(function() {
                var temp = $("#compose_form").serialize();                
                $.ajax({
                    type: "POST",
                    data: temp,
                    url: 'compose/',
                    success: function(data) {
                      // do s.th
                    }
                });
                return false;
            });
        });
    </script>

使用此脚本，正文值不会发送到 request.POST（我的意思是它在正文字段中发送空字符串），当我将以下行添加到我的脚本时，它会发送正文字段的值，但它不是t ajax 了。你能帮我做什么吗？

【问题讨论】：

标签： javascript jquery ajax django

【解决方案1】：

编辑器中的数据不包含在表单中的原因是编辑器不是表单的一部分。它需要更新您与之关联的表单元素。为此，您需要告诉编辑器更新表单元素。

因此，在表单的提交功能中，您需要从编辑器中获取数据。

这应该可以解决问题：

$(function() {
        $('#compose_form').submit(function() {
            for (var instance in CKEDITOR.instances)
                CKEDITOR.instances[instance].updateElement();
            var temp = $("#compose_form").serialize();
            etc etc...

【讨论】：

【解决方案2】：

django-ckeditor 也有同样的问题，我试过的是

<script type="text/javascript">
     for (var instance in CKEDITOR.instances)
            CKEDITOR.instances[instance].updateElement();

然后通过以下方式检查实例名称：

console.log(instance)

它给了“id_Your_Message”，所以我做了：

var temp = $("#id_Your_Message").val()

效果很好

【讨论】：

【解决方案3】：

<script type="text/javascript">
    $(function () {
        $('#submit_button_id').click(function () {
            $.post("action post file url", $("#form_id").serialize(), function (data) {});
        });
    });
</script>

希望以上脚本对你有帮助

【讨论】：

请在以后处理您自己的代码格式。此外，在您的代码中提供一些解释通常很好，这样工作解决方案就不会看起来像魔术。