插入db时，CKEDITOR值为NULL

Question

Sorry for my bad english, I wan't to inserting data to database with CKEDITOR and ajax submit, i have code

$('#add').submit(function(e) {
    var fd = new FormData(this);
    e.preventDefault();
    // CKEDITOR.instances.isiForm.updateElement();
    for ( instance in CKEDITOR.instances ) {
        CKEDITOR.instances.isiForm.updateElement();
    }
    $.ajax({
        type: "POST",
        url:  "blog_add",
        data: fd,
        cache: false,
        contentType: false,
        processData: false,
        success: function(result){
            if(result=='1'){
                table.ajax.reload(null,false);
              $('#add').modal('hide');
                // success result
            } else {
                // failed result
      }
        }
    });
});

<form class="modal fade" id="add" enctype="multipart/form-data">
    <div class="form-group">
        <label>Isi Post</label>
        <textarea id="isiForm" name="isiForm" cols="5" class="form-control rsf"></textarea>
    </div>
</form>

I have tried using CKEDITOR.instances.isiForm.updateElement(); but it not works, the value always NULL, so how can i insert to database with ajax? and i have try many thread but no one succeed

</div>

Answer 1

You're getting the FormData BEFORE ckeditor has updated the textarea. Just switch it around so that the CKEDITOR elements are updated before you fetch the FormData.

EG (untested)

$('#add').submit(function(e) {
    e.preventDefault();
  //first update the form values
    for ( instance in CKEDITOR.instances ) {
        CKEDITOR.instances.isiForm.updateElement();
    }
  //then get the form data
    var fd = new FormData(this);
  //post via ajax
    $.ajax({
        type: "POST",
        url:  "blog_add",
        data: fd,
        cache: false,
        contentType: false,
        processData: false,
        success: function(result){
            if(result=='1'){
                table.ajax.reload(null,false);
              $('#add').modal('hide');
                // success result
            } else {
                // failed result
      }
        }
    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form class="modal fade" id="add" enctype="multipart/form-data">
    <div class="form-group">
        <label>Isi Post</label>
        <textarea id="isiForm" name="isiForm" cols="5" class="form-control rsf"></textarea>
    </div>
</form>

</div>