Why in my CKEditor need to double click the submit button to work?

问题

Im have a module called manage content where the admin can edit the content of the website. I saw this CKEditor and I applied it to my website, but having a problem. When I clicked the submit, it won't change but when I tried to double click the submit it will change.

View

<div class="col-md-6">

          <ol class="breadcrumb">
          <div id="success-message-edit-about"></div>
          <form id="edit-about">
            <input type="hidden" name="id" value="<?= secret_url('encrypt',$edit_about->id)?>">
            <div class="form-group">
            <label>Content</label>

             <textarea  id="editor" rows="4" cols="50"  name="content_description" class="form-control"><?= $edit_about->content?></textarea>
                  <div class="text-danger" id="content_description_error"></div>
            </div>


            <input type="submit" class="btn btn-success " value="Continue" align="center" ">

          </form>


          </ol>
 </div>

$(document).ready(function(){
    $("#edit-about").on('submit',function(e){
        $.ajax({
            url: base_url + "administrator/edit_about_form_submit",
            type: "POST",
            data: $(this).serialize(),

            success:function(data) {
                var result = JSON.parse(data);

                if(result === "success")
                {
                    $("h5").html("");
                    success_message("#success-message-edit-about","Thank you!");
                    window.setTimeout(function(){location.href=base_url+"administrator/about"},2000);
                }
                else{

                    $("#link_error").html(result.link_error);
                }
            },
            error: function(data) {
                alert('error');
            }
        })
        e.preventDefault();
    })
})

Controller

public function edit_about_form_submit() 
    {

        echo json_encode($_POST['content_description']);die;
    }

Scenario

Content: This is my content

Change into: Update Content

Then when I click the submit, in my inspect element it didnt change. But when I double click the submit it will now change.

Question: How can I fix this? It should be only once clicked not twice

Edited:

$(document).ready(function(){
    $("#edit-about").on('submit',function(e){
         for ( instance in CKEDITOR.instances )
         {
           CKEDITOR.instances[instance].updateElement();
           $.ajax({
            url: base_url + "administrator/edit_about_form_submit",
            type: "POST",
            data: $(this).serialize(),

            success:function(data) {
                var result = JSON.parse(data);

                if(result === "success")
                {
                    $("h5").html("");
                    success_message("#success-message-edit-about","Thank you!");
                    window.setTimeout(function(){location.href=base_url+"administrator/about"},2000);
                }
            },
            error: function(data) {
                alert('error');
            }
        })
        e.preventDefault();
         }

    })
})

回答1:

I found this from a 2012 forum post.

http://forum.codeigniter.com/thread-51301.html

THE SOLUTION to my problem was that I had to call this before posting to the server:

Code:

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

来源：https://stackoverflow.com/questions/47756773/why-in-my-ckeditor-need-to-double-click-the-submit-button-to-work

标签

javascript

jquery

ckeditor