Come ajax-inviare un modulo textarea di input da CKEditor?

Question

Sto utilizzando CKEditor, jQuery e jQuery form plugin e desidero inviare il contenuto del modulo CkEditor tramite una query Ajax. Qui è il mio codice:

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

Purtroppo, sembra che la richiesta Ajax non passa il parametro bodyText;

Cosa ho fatto di sbagliato o come posso ottenere ciò di cui ho bisogno?

Grazie.

Answer 1

è necessario chiamare prima quanto segue, per rendere i CKEDITORs aggiornare i loro campi correlati ..

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

così

HTML

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

e javascript

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

Answer 2

Ho appena fatto in questo modo:

$('#MyTextArea').closest('form').submit(CKupdate); 

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

Answer 3

Se si utilizza il jQuery form plugin, è possibile utilizzare l'opzione beforeSubmit per una soluzione più elegante:

$("#form").ajaxForm({ 
    beforeSubmit: function() 
{ 
     /* Before submit */ 
    for (instance in CKEDITOR.instances) 
    { 
     CKEDITOR.instances[instance].updateElement(); 
    } 
}, 

    // ... other options 
}); 

Answer 4

Questo funziona per me meglio: beforeSerialize callback

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

Answer 5

Nel mio caso il seguente mi ha aiutato, ho appena usato queste due linee prima di serializzare il modulo.

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

    var data = $('#myForm').serializeArray(); 

Answer 6

Ho provato qualcosa di simile:

Per prima cosa ho dovuto mettere un id = "#myForm" on @ Html.BeginForm dopo, ho messo questi nel mio script in cui parte in uso lo script:

<script type="text/javascript"> 
    $(document).ready(function CKupdate() { 
     $('#myForm').ajaxForm(function() { 
      for (instance in CKEDITOR.instances) { 
       CKEDITOR.instances[instance].updateElement(); 
      } 
     });  
    }); 
</script> 

e poi ho fatto qualcosa di simile =] per il mio pulsante di invio e funziona bene per me, non più la pressione del due volte =]

<button type="submit" id="submitButton" onclick="CKupdate();$('#myForm').ajaxSubmit();">Submit</button>