CKEditor 通过 Ajax 将空值发送到数据库

CKEditor send Null Value to database via Ajax

我正在尝试使用 PHP、Ajax 和 CKEditor 4 创建事件日历。当我通过 Ajax 将值发送到数据库时,它发送空值。

它发送每个值(标题、开始日期、结束日期),除了:c_details 我使用 CKEditor 4 Database's picture

My form's picture

这是我的表格:

<div class="modal-body">
                                            <form id="new_calendar">
                                                <div class="form-group">
                                                    <label>Title</label>
                                                    <input type="text" class="form-control" name="title" placeholder="">
                                                </div>
                                                <div class="form-group">
                                                    <label>Description</label>
                                                    <textarea type="text" class="form-control" id="editor" name="c_details" placeholder=""></textarea>
                                                </div>
                                                <div class="form-group">
                                                    <label>Start Date</label>
                                                    <input type="text" class="form-control" name="start" placeholder="YYYY-mm-dd">
                                                </div>
                                                <div class="form-group">
                                                    <label>End Date</label>
                                                    <input type="text" class="form-control" name="end" placeholder="YYYY-mm-dd">
                                                </div>
                                                <input type="hidden" name="new_calendar_form">
                                            </form>
                                        </div>
                                        <div class="modal-footer">
                                            <button type="button" class="btn btn-primary" onclick="return new_calendar();">Save</button>
                                            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                                        </div>

这是Ajax:

function new_calendar() {

 for (instance in CKEDITOR.instances) {CKEDITOR.instances[instance].updateElement()}

$.ajax({
    type: "POST",
    url: "json-event.php",
    data: $("#new_calendar").serialize(),
    success: function (data) {

        $(".close").trigger('click');
        alert(data);
        location.reload();
    }
});
return false;}

这是我在 Code Sandbox 上的所有代码,我只是将 name='description' 更改为 name='c_details' : https://codesandbox.io/s/blissful-water-nop1y?file=/index.php

保存新数据:

public function new_calendar($data)
{

    $db = $this->connect();

    $add_user = $db->prepare("INSERT INTO calendar (id,title,c_details,start,end) VALUES(NULL,?,?,?,?) ");

    $add_user->bind_param("ssss", $data['title'], $data['c_details'], $data['start'], $data['end']);

    if (!$add_user->execute()) {

        echo $db->error;
    } else {

        echo "Saved !";
    }
}

在将数据发送到 ajax 请求之前把这个:

for (instance in CKEDITOR.instances) {CKEDITOR.instances[instance].updateElement()}

这将使用 ckeditor

的信息更新元素文本区域