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

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.

<script src="ckeditor/ckeditor.js"></script>
function saveArt()

var title = document.getElementById('art_title'),
art_title = title.value;

var desc = document.getElementById('art_body'),
art_body = desc.value;

jQuery.ajax(
type: 'POST',
url: 'art_save.php',
data:
title: art_title,
aut: art_author,
tag: art_tag,
desc: art_body



);
return false;




html part

<form method="post" name="art" id="art">
<input type="text" id="art_title" name="art_title" placeholder="Here goes your title"/>
<textarea class="ckeditor" name="art_body" id="art_body"></textarea>
<input type="submit" name="savedraft" id="savedraft" onclick="saveArt();return false;" value="Need more Research ! Save as Draft" class="button"/>
</form>


4 Answers
4

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:

.serialize

<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;




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

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);


);


you can get html form ckeditor with this :

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


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

Thanks for contributing an answer to Stack Overflow!

But avoid …

To learn more, see our tips on writing great answers.

Some of your past answers have not been well-received, and you're in danger of being blocked from answering.

Please pay close attention to the following guidance:

But avoid …

To learn more, see our tips on writing great answers.

Required, but never shown

Required, but never shown

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.