web-dev-qa-db-fra.com

TinyMCE textarea et post formulaire en utilisant ajax

J'utilise tinyMCE pour les zones de texte et le formulaire avec AJAX.

Mais lorsque j'essaie de sauvegarder une valeur textarea, il prend les anciennes valeurs lors du premier clic, mais les valeurs mises à jour lors du second clic.

J'ai essayé d'utiliser tinyMCE.triggerSave() mais cela n'a pas fonctionné.

J'ai aussi essayé tinyMCE.get('myid').getContent(), mais cela prend encore de vieilles valeurs.

Mon code est comme suit.

    $(".submit").live("click", function () {
            tinyMCE.triggerSave();
            var f = $(this).parents("form");
            var action = f.attr("action");
            var serializedForm = f.serialize();
            //tinyMCE.triggerSave(); also tried putting here
            $.ajax({
                 type: 'POST',
                 url: action,
                 data: serializedForm,
                 async: false,
                 success: function (data, textStatus, request) {
                     $(".divform").html(data);
                 },
                 error: function (req, status, error) {
                     alert&("Error occurred!");
                 }
            });
    return false;
    });

S'il vous plaît aider, toute aide serait appréciée

13
Sanjay Panchal

Utilisez ceci au lieu de tinymce.triggerSave();

$('#' + 'your_editor_id').html( tinymce.get('your_editor_id').getContent() );
11
Thariama

Vous pouvez configurer TinyMCE comme suit pour que les valeurs des zones de texte masquées restent synchronisées au fur et à mesure que les modifications sont apportées via les éditeurs TinyMCE:

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

Grâce à cela, vous pouvez accéder aux valeurs mises à jour directement à partir des éléments textarea à tout moment.

Cela a été testé sur TinyMCE 4.0 

Démo en cours d'exécution à: http://jsfiddle.net/9euk9/

40
Dan Malcolm

Une implémentation alternative à celle publiée par Dan Malcolm, pour TinyMCE 3.x, serait la suivante:

tinymce.init({
    selector: "textarea",
    setup: function (editor) {
        editor.onChange.add(function() {
            editor.save();
        });
    }
});

En plus de travailler sur 3.x, cette version utilise editor.save au lieu de tinymce.triggerSave, ce qui signifie qu'elle ne met à jour que l'éditeur en cours plutôt que tous les éditeurs de la page.

2
HappyDog

@Dan Malcom,

J'ai remarqué que lorsque vous tapez quelque chose dans l'une des cases, appuyez ensuite sur le bouton "Afficher les valeurs du texte", puis, si vous cliquez sur la flèche "Annuler", le texte déjà affiché est conservé, pas le nouveau texte généré par le message "Annuler". ". Je l'ai découvert en essayant d'utiliser votre exemple pour vérifier que l'éditeur de texte avait quelque chose à l'intérieur.

Dans mon exemple, si je tape quelque chose dedans, alors "Annuler" supprime le texte mais le formulaire est toujours soumis.

Voir exemple ici: 

enter code here

https://codepen.io/speedygonzales77/pen/bzMrqB

enter code here
0
speedygonzales77

utiliser ce script avant de poster des données en utilisant Ajax. Ceci est du code javascript avant utilisation, veuillez charger le fichier minuscule mce js et l'utiliser.

tinymce.triggerSave ();

$.ajax({ 
    type: 'post', 
    url: 'autoSaveReport.php', 
    data: $('form').serialize(), 
    success: function (result) { 
        var redirectURL = window.location.pathname; 
        var redirectURL1 = redirectURL+"?incid="+result; 
        window.location = window.location+"?incid="+result; 
    } 
});
0
user2828818