jQuery y TinyMCE: el valor de textarea no envía

Estoy usando jQuery y TinyMCE para enviar un formulario, pero hay un problema en la serialización en que el valor de Textarea no se publica.

Aquí está el código:

idioma: lang-js

 $('#myForm').submit(function() { $.ajax({ type: 'POST', url: $(this).attr('action'), data: $(this).serialize(), success: function(data) { $('#result').fadeIn('slow'); $('#result').html(data); $('.loading').hide(); } }) return false; }); tinyMCE.init({ // General options mode : "textareas", theme : "advanced", // Theme options theme_advanced_buttons1 : "bold,italic,underline,separator,image,separator,justifyleft,justifycenter,justifyright,jformatselect,fontselect,fontsizeselect,justifyfull,bullist,numlist,undo,redo,styleprops,cite,link,unlink,media,advhr,code,preview", theme_advanced_buttons2 : "", theme_advanced_toolbar_location : "top", theme_advanced_toolbar_align : "left", theme_advanced_statusbar_location : "bottom", theme_advanced_resize_horizontal : false, theme_advanced_resizing : true, extended_valid_elements :"a[name|href|target|title|onclick],img[class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name],hr[class|width|size|noshade],font[face|size|color|style],span[class|align|style]", }); 

¿Puede explicarme qué debo cambiar y por qué para poder publicar el valor en el área de texto?

    Antes de enviar el formulario, llame a tinyMCE.triggerSave();

    Puede configurar TinyMCE de la siguiente manera para mantener los valores de las áreas de texto ocultas sincronizados, ya que los cambios se realizan a través de los editores de TinyMCE:

     tinymce.init({ selector: "textarea", setup: function (editor) { editor.on('change', function () { editor.save(); }); } }); 

    Los elementos textarea se mantendrán actualizados automáticamente y no necesitará pasos adicionales antes de serializar formularios, etc.

    Esto ha sido probado en TinyMCE 4.0

    Demostración que se ejecuta en: http://jsfiddle.net/9euk9/49/

    Actualización: el código anterior se ha actualizado en base al comentario de DOOManiac

    Eso es porque ya no es un área de texto. Se reemplaza con un iframe (y otras cosas), y la función de serialización solo obtiene datos de los campos del formulario.

    Agregue un campo oculto al formulario:

      

    Antes de publicar el formulario, obtenga los datos del editor y colóquelos en el campo oculto:

     $('#question_html').val(tinyMCE.get('question_text').getContent()); 

    (Por supuesto, el editor se encargaría de esto si publicara el formulario normalmente, pero a medida que va raspando el formulario y enviando los datos usted mismo sin usar el formulario, el evento onsubmit del formulario nunca se desencadena).

    Desde TinyMCE, jQuery y Ajax formas :

    Presentación del formulario TinyMCE

    • Cuando un área de texto es reemplazado por TinyMCE, en realidad está oculto y en su lugar se muestra el editor TinyMCE (un iframe).
    • Sin embargo, es el contenido de esta tabla de texto el que se envía cuando se envía el formulario. En consecuencia, su contenido debe actualizarse antes del envío del formulario.
    • Para un envío de formulario estándar, es manejado por TinyMCE. Para enviar un formulario Ajax, debe hacerlo manualmente, llamando (antes de enviar el formulario):

      tinyMCE.triggerSave();

     $('form').bind('form-pre-serialize', function(e) { tinyMCE.triggerSave(); }); 

    Cuando ejecuta ajax en su formulario, necesita decirle a TinyMCE que actualice su área de texto primero:

     // TinyMCE will now save the data into textarea tinyMCE.triggerSave(); // now grap the data var form_data = form.serialize(); 

    Solía:

     var save_and_add = function(){ tinyMCE.triggerSave(); $('.new_multi_text_block_item').submit(); }; 

    Esto es todo lo que necesitas hacer.

     var text = tinyMCE.activeEditor.getContent(); $('#textareaid').remove(); $('').insertAfter($('[name=someinput]')); 

    También puede usar simplemente el plugin jQuery y el paquete para TinyMCE, que resuelve este tipo de problemas.

    @eldar: tuve el mismo problema con 3.6.7 corriendo en ‘modo normal’; y ni triggerSave ni save () estaban funcionando.

    Cambié al plugin jQuery TinyMCE y sin tener que hacer nada más está funcionando ahora. Supongo que en algún momento implementaron algún tipo de triggerSave automático para la versión jQuery de TinyMCE.

    Acabo de ocultar () el formulario de tinymce y enviar, el valor cambiado de textarea falta. Así que agregué esto:

     $("textarea[id='id_answer']").change(function(){ var editor_id = $(this).attr('id'); var editor = tinymce.get(editor_id); editor.setContent($(this).val()).save(); }); 

    Esto funciona para mi.

    tinyMCE.triggerSave(); parece ser la respuesta correcta, ya que sincronizará los cambios del iFrame a su área de texto.

    Sin embargo, para agregar a las otras respuestas, ¿por qué necesita esto? Había estado usando tinyMCE por un tiempo y no había tenido problemas con los campos de formulario que no se venían. Después de algunas investigaciones, resultó ser su “parche automático” de envíos de elementos de formulario, que está activada por defecto: http://www.tinymce.com/wiki.php/Configuration3x:submit_patch

    Básicamente, redefinen submit para llamar a triggerSave antemano, pero solo si el submit aún no ha sido redefinido por otra cosa:

     if (!n.submit.nodeType && !n.submit.length) { t.formElement = n; n._mceOldSubmit = n.submit; n.submit = function() { // Save all instances tinymce.triggerSave(); t.isNotDirty = 1; return t.formElement._mceOldSubmit(t.formElement); }; } 

    Por lo tanto, si algo más en su código (u otra biblioteca de terceros) está jugando con submit , su “parche automático” no funcionará y será necesario llamar a triggerSave .

    EDITAR: Y en realidad en el caso del OP, submit no se llama en absoluto. Como está ajax, esto está pasando por alto el “parche automático” descrito anteriormente.

    Tuve este problema por un tiempo y triggerSave() no funcionó, ni tampoco ninguno de los otros métodos.

    Así que encontré una manera que funcionó para mí (estoy agregando esto aquí porque otras personas pueden haber probado triggerSave y etc.):

     tinyMCE.init({ selector: '.tinymce', // This is my  

    Cuando envíes tu formulario o lo que sea que tengas que hacer es tomar los datos de tu selector (en mi caso: .tinymce ) usando $('.tinymce').text() .

    Ante todo:

    1. Debe incluir el complemento jquery de tinymce en su página (jquery.tinymce.min.js)

    2. Una de las maneras más simples y seguras es usar getContent y setContent con triggerSave. Ejemplo:

       tinyMCE.get('editor_id').setContent(tinyMCE.get('editor_id').getContent()+_newdata); tinyMCE.triggerSave(); 

    Esto asegurará que el contenido se guarde cuando pierdas el foco del área de texto

      setup: function (editor) { editor.on('change', function () { tinymce.triggerSave(); });