6
votes

Comment passer du contenu dans la zone de texte de TinyMCE à un fichier PHP directement au lieu de l'envoyer via AJAX?

Je crée une page Web simple avec TinyMCE intégré.

La partie HTML:

<script>
function send(){
    var data = tinyMCE.get('mytextarea').getContent();
    var ajax = new XMLHttpRequest();
    ajax.open('POST','dump.php',false);
    ajax.setRequestHeader('Content-type','application/x-www-form-urlencoded');
    ajax.send('data='+data);    
} 
ob = document.getElementById("submit");
ob.addEventListener("click",send);
</script>

La partie JavaScript.

<?php
    print_r($_POST);
?>

Maintenant, je veux imprimer du contenu dans l'éditeur de TinyMCE, après avoir cliqué sur le bouton soumettre .

Le fichier dump.php

<script src="tinymce/tinymce.min.js"></script>
<script type="text/javascript">
tinymce.init({
    selector: "textarea",
    height: 250,
    plugins: [
        "code advlist autolink lists link image charmap print preview anchor",
        "searchreplace visualblocks code fullscreen",
        "insertdatetime media table contextmenu paste"
    ],
    toolbar: "code insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image",
    setup: function (editor) {
        editor.on('init keydown change', function (e) {
           document.getElementById('show_right').innerText = editor.getContent();
        });
    }
});
</script>

php javascript html tinymce

1 commentaires

Utilisez la propriété de configuration setup . Jetez un œil à mon message ci-dessous.

3 Réponses :

-2
votes

Tout d'abord, vous devez nommer pour textarea. Et "dump.php":

print_r ($ _POST [" name_of_textarea "]);

1 commentaires

print_r ($ _ POST) peut imprimer le tableau entier.

3
votes

Oui, vous pouvez l'envoyer sans AJAX avec un iframe caché qui a comme target attribuer la valeur name de iframe . La page d'origine ne se rechargera pas. La réponse de votre serveur sera chargée dans iframe caché. Dans ce cas, vous devez définir l'affichage iframe sur aucun.

print($_POST["mytext"]); //mytext is name of textarea

  Pour votre  textarea  vous devez également écrire un  nom  comme attribut, par exemple comme  name = "mytext"  parce que du côté serveur vous voulez obtenir le texte, qui sera envoyé. Et parce que vous n'avez pas écrit ce  nom , vous ne pouvez pas l'obtenir. Dans votre solution AJAX, vous le faites avec  ajax.send ('data =' + data); . Dans ce cas,  data  est comme le nom de votre textarea.
  Pour votre script PHP:  
  XXX    Solution alternative  
  Vous pouvez également afficher le formulaire de soumission comme une page distincte à l'intérieur de l'iframe, et lorsqu'il est soumis, la page externe ne rechargera pas. Cette solution n'utilise pas non plus AJAX.

0 commentaires

0
votes

Vous n'avez pas besoin d'iframe, ajoutez simplement ceci à votre configuration tinymce pour garder la zone de texte originale synchronisée avec l'éditeur

<!DOCTYPE html>
<html>
<head>
  <script src='https://cloud.tinymce.com/stable/tinymce.min.js'></script>
  <script>
  tinymce.init({
    selector: '#mytextarea',
    setup: function (editor) {
        editor.on('change', function () {
            editor.save();
        });
    }
  });
  </script>
</head>

<body>
<?php if ('POST' === $_SERVER['REQUEST_METHOD']): ?>
  <pre><?php print_r($_POST) ?></pre>
<?php else: ?>
    <form method="post">
      <label for="mytitle">Title</label>
      <input type="text" id="mytitle" name="title" value="">
      <textarea id="mytextarea" name="content"></textarea>
      <button type="submit" name="submit">Submit</button>
    </form>
<?php endif; ?>
</body>
</html>

Poc rapide et sale

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

0 commentaires