Q:

How to ajax-submit a form textarea input from CKEditor?

I am using CKEditor, jQuery and jQuery form plugin and I would like to submit contents of the CkEditor form via an Ajax query. Here is my code: 
<form id="article-form" name="article-form" method="post" action="/myproject/save">
  <textarea name="bodyText" style="visibility: hidden; display: none;"></textarea>
  <script type="text/javascript">
    CKEDITOR.replace('bodyText');
  </script>

  <a onClick="$("#article-form").ajaxSubmit();">Submit</a>

</form>

Unfortunately, it seems that the Ajax request does not pass the bodyText parameter; 
What did I do wrong or how can I achieve what I need?
Thank you.

A:

you need to first call the following, to make the CKEDITORs update their related fields..
for ( instance in CKEDITOR.instances )
    CKEDITOR.instances[instance].updateElement();

so
HTML
<a onClick="CKupdate();$('#article-form').ajaxSubmit();">Submit</a>

and javascript
function CKupdate(){
    for ( instance in CKEDITOR.instances )
        CKEDITOR.instances[instance].updateElement();
}

A:

This works for me best: beforeSerialize callback
$('form#description').ajaxForm({
    beforeSerialize:function($Form, options){
        /* Before serialize */
        for ( instance in CKEDITOR.instances ) {
            CKEDITOR.instances[instance].updateElement();
        }
        return true; 
    },
    // other options
});

A:

If you use the jQuery form plugin, you can use the beforeSubmit option for a more elegant solution:
$("#form").ajaxForm({
    beforeSubmit:  function()
{
        /* Before submit */
    for ( instance in CKEDITOR.instances )
    {
        CKEDITOR.instances[instance].updateElement();
    }
},

  // ... other options
});

