Ajax Soucis d'enregistrement en arrière plan

Petit nouveau ! | 1 Messages

23 nov. 2016, 13:19

Bonjour et merci tout d'abord pour vote aide.
J'ai un soucis avec ajax, je dévellope un script qui pourrait enregistré automatiquement un texte en arrière plan sur un site dynamique.
Le soucis est que mon code php lui est opérationnel quand ma variable $message="lololo" il enregistre sans soucis en arrière plan dans la base de donnée
mais dès que je lui attribue la variable $message="$_post['editor1'] il ne veut plus.
Probablement dû au code ajax que voici

Code : Tout sélectionner

<html> <head> <meta charset="utf-8"> <title>news</title> <!-- Make sure the path to CKEditor is correct. --> <script src="ckeditor.js"></script> <script text="javascript"> function timer() { comp=(setTimeout("go()",5000)); } function getXhr(){ var xhr = null; if(window.XMLHttpRequest) // Firefox et autres xhr = new XMLHttpRequest(); else if(window.ActiveXObject){ // Internet Explorer try { xhr = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xhr = new ActiveXObject("Microsoft.XMLHTTP"); } } else { // XMLHttpRequest non supporté par le navigateur alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); xhr = false; } return xhr } function go() { var xhr = getXhr() // On défini ce qu'on va faire quand on aura la réponse xhr.onreadystatechange = function() { // On ne fait quelque chose que si on a tout reçu et que le serveur est ok if(xhr.readyState == 4 && xhr.status == 200) { var html = xhr.responseText; document.getElementById('txt').innerHTML = html; } } xhr.open("POST","brouillon",true); xhr.send(null); setTimeout('go()',5000); } </script> </head> <body onload='timer()'> <form action="Mail3" method="POST"> <textarea name="editor1" id="editor1" rows="10" cols="80" > Saissisez votre message ici </textarea> <script> CKEDITOR.replace( 'editor1' ); </script> <input type="submit" name="soumettre" value="envoyer"> </form> <div id="txt"> <?php "une copie de votre brouillon sera bientôt disponible" ?> </div> </body> </html>
Merci de votre aide

Avatar de l’utilisateur
Modérateur PHPfrance
Modérateur PHPfrance | 8755 Messages

23 nov. 2016, 14:16

salut,

tu n'envoie pas de données (xhr.send(null); dans ta requête serveur du coup cela ne fait 'rien' coté serveur :)
CKEDITOR.tools.enableHtml5Elements( document );
function timer() {
    comp = (setTimeout("go()", 5000));
}

function getXhr() {
    var xhr = null;
    if (window.XMLHttpRequest) // Firefox et autres
        xhr = new XMLHttpRequest();
    else if (window.ActiveXObject) { // Internet Explorer
        try {
            xhr = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            xhr = new ActiveXObject("Microsoft.XMLHTTP");
        }
    }
    else { // XMLHttpRequest non supporté par le navigateur
        alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
        xhr = false;
    }
    return xhr
}

function go() {
    var xhr = getXhr()
    // On défini ce qu'on va faire quand on aura la réponse
    xhr.onreadystatechange = function () {
        // On ne fait quelque chose que si on a tout reçu et que le serveur est ok
        if (xhr.readyState == 4 && xhr.status == 200) {
            var html = xhr.responseText;
            document.getElementById('txt').innerHTML = html;
        }
    }
    xhr.open("POST", "brouillon.php", true);
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhr.send('data='+encodeURI(CKEDITOR.instances.editor1.getData()));
    setTimeout('go()', 5000);
}
coté serveur tu récupère $_POST['data'], attention c'est du HTML qui est envoyé (parce que sinon pas formatage.

Globalement tu peux :
Extraite le JS dans un fichier .js a part cela facilitera la lecture du code.
Utiliser une lib js pour la requête serveur, tu va y gagner coté lecture du code. Il y a le classique jQuery qui peut te permettre d'avoir plein de truc plus ou moins bien pour animer ton ihm).
sinon y a moyen de trouver ton bonheur la dedans http://microjs.com/
perso j'ai testé reqwest et psQuery qui font leurs boulots pour des tailles réduite (3.5 ko et 1.7ko).
Il y a du choix, le but c'est de simplifier la lecture du code et sont utilisation / réemploi.


edit :
J'ai oublier un exemple.
Avec psquery tu peux résumer ta mécanique de requête serveur à
$.ajax({
        type: 'POST',
        url: 'brouillon.php',
        data: 'data=' + encodeURI(CKEDITOR.instances.editor1.getData()),
        success: function (data) {
            document.getElementById('txt').innerHTML = data;
        }
    });
de 37 lignes de code tu passe à 8 :-)
avec juste l'import <script src='https://rawgit.com/pseudosavant/psQuery ... '></script>

@+
Il en faut peu pour être heureux ......

ViPHP
ViPHP | 1980 Messages

27 nov. 2016, 10:26

+1 pour j'ai testé reqwest et psQuery.

J'utilise aussi jQuery qui est plus lourd (34,29 Ko pour la version min) mais apporte à peu près tout ce qu'on attend pour manipuler le DOM, faire des requète AJAX, faire des "foreach", ...

L'avantage de ces librairies est qu'elles sont multiplateformes. Tu n'as pas besoin de te soucier de savoir si l'utilisateur utilise firefox (mon préféré car données personnelles plutôt préservés), chrome (beurk => rapide mais pas beau et données personnelles ... bref google) ou Edge (beurk x beurk => raisons personnels) ou pire IE (beurk x beurk x beurk :=> pas de justifications nécessaires)
It is nice to be important but it is more important to be nice
http://www.aureuswebfactory.fr