after ajax form submit value from ckeditor textarea is not sent through post

Question

i have a form having some textfields and a textarea (ckeditor), after onclick button art_title field value is sent to art_save.php page, but value from textarea is not sent.

Answer 1

You can force CKeditor to update the textarea value using:

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

Also, you can use .serialize for the data - then you won't have to maintain the AJAX code if parameters change:

<script src="ckeditor/ckeditor.js"></script>
function saveArt() 
{
    for (instance in CKEDITOR.instances) {
        CKEDITOR.instances[instance].updateElement();
    }

    jQuery.ajax({
        type: 'POST',
        url: 'art_save.php',
        data: $("#art").serialize()
     });  
     return false; 

 }

Answer 2

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

$.ajax({
    url: "controllers/c.publicidad.php?task=save",
    type: 'post',
    data: $("form[name='form']").serialize(),
    dataType: 'json',
    success: function(data) {
        if(data.idenvio != ''){
            $("form[name='frmPublicidad']").toggle("slow");
            $("#MessageSuscripcion").html(data.message);
        }
    }
});

Answer 3

I fix updated the field value on change. Here my code:

HTML:

<div class="row">
    <div class="form-group col-sm-11">
        <label for="ckfield">ckfield</label>
        <textarea id="ckfield" class="form-control" rows="10" name="ckfield" cols="50"></textarea>
    </div>
</div>

JS:

<script>
$(function(){
    var $ckfield = CKEDITOR.replace( 'ckfield' );

    $ckfield.on('change', function() {
      $ckfield.updateElement();         
    });
});
</script>

Answer 4

This is what worked for me:

$.ajax(
{
  type: "POST",
  url: path+"/html-action",
  data: {data1: dataone,
        data2: datatwo,
        data3: datathree,
        data4: datafour,
        message: ckeditortxt},
  cache: true,
  success: function(html)
  {
}
}

Initially, I was using a datastring to pass information, but for some reason, the element that holds the ckeditor data was not being considered as a parameter. So I split all the parameters to individual components i.e. data1 data2, data3, data4.... and this time, it worked

Answer 5

you can get html form ckeditor with this :

var art_body = CKEDITOR.instances.art_body.getData();