[AJAX] informations complémentaires AJAX

**gabest** · 14/01/2011, 16h36

Bonjour

Dans une page j'ai un tableau qui est rempli par le visiteur. Les données ainsi saisies doivent être envoyées au serveur pour être traitées.

Depuis deux jours je lis bouquins et tutoriels sans rien trouver qui corresponde à mon cas. La plupart du temps sont décrits comment récupérer des données sur le serveur et les renvoyer au client. Mais moi je souhaite collecter des données, avec javascript, puis les envoyer au serveur pour les traiter.

Cela est-il possible en utilisant XMLHttpresquest?

Ou puis je trouver un tutoriel capable enfin de m'éclairer?

**andry.aime** · 14/01/2011, 17h03

Bonjour,

Tu récupères les données saisie et l'envoie au serveur via AJAX, du coté serveur tu récupères les données et les sauvegarder dans la base. Si l'enregistrement s'est bien effectué,tu retournes un petit message pour dire qu'il y a pas d'erreur et tu faits un append sur la page pour afficher les données saisie (faq).
Cette problème est déjà résolue mais fait une recherche sur ce forum.

A+.

**gabest** · 14/01/2011, 17h18

En fait c'est bien comme cela que j'ai procédé, mais je n'obtiens rien.
Je crée un objet XMLHttprequest, je lance la méthode open avec "POST", l'URL du PHP qui doit traiter les données (les déposer dans un dossier donné sous forme de fichier csv). Je lance la méthode setRequestHeader("Content-Type", "application/x-www-form-urlencoded") pour indiquer que je vais passer du texte en paramètre, et enfin je lance la méthode send avec ce texte(une chaine de caractères) en paramètre.

Je ne vois rien arriver dans mon script php.

**andry.aime** · 14/01/2011, 18h01

on peut voir ton Code?

**gabest** · 14/01/2011, 18h30

Voici le js qui prépare la chaine de caractère et l'envoi, Traitement_commandes.js

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
 
function EnvoyerCommande() {
    /*
     *    A ce stade nous allons copier tous les éléments du tableau de la commande dans un fichier csv. Pour cela on utilse :
     *            1- le nom du dossier (dossier établissement) :
     *            2- la liste des modèles sélectionnés
     *            3- la liste des lignes de commandes
    */
    var cde = '';
    var ligne = '';
 
    ligne = dossierCourant + ";";
    for(var i=0;i<nbModeles;i++) {
        if( i<nbModeles-1 ) {
            ligne = ligne + listeModeles[i] + ";";
        }
        else {
            ligne = ligne + listeModeles[i] + ".";
        }
    }
    cde = cde + ligne;
        for(var i=0;i<listeEleves.length;i++) {
            ligne = listeEleves[i].toString() + ";";
            for(var j=0;j<nbModeles;j++) {
                if( j<nbModeles-1 ) {
                    ligne = ligne + listeLGNCDES[i].qFields[j].value + ";";
                }
                else {
                    ligne = ligne + listeLGNCDES[i].qFields[j].value;
                }
            }
            if( i<listeLGNCDES.length-1 ) {
                cde = cde + ligne + '.';
            }
            else {
                cde = cde + ligne;
            }
        }
 
    var request = getXHR();
    request.open("POST","./Scripts/Traitement_commande.php",true);
    request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    request.send(cde);
}

et le php, Traitement_commande.php

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
<html>
<?php
    // récupération des données et création des tables horizontales elles rangées dans une table verticale.
    // enregitrement de ces données sous forme de fichier csv
    echo 'et un peu de texte'.$_Post['cde'].'<br>';
?>
</html>

En réponse le script php affiche : et un peu de texte<br>

**andry.aime** · 14/01/2011, 18h42

1-

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

request.send("cde="cde);

2-

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$_POST['cde']

3-tu dois utiliser onreadystatechange pour récupérer le retour depuis le serveur coté javascript.

A+.

**gabest** · 14/01/2011, 18h51

avec : request.send("cde="cde);

j'obtiens le message suivant : missing ) after argument list

**andry.aime** · 14/01/2011, 18h55

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

request.send("cde="+cde);

**gabest** · 14/01/2011, 21h14

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
    var request = getXHR();
    request.open("POST","./Scripts/Traitement_commande.php",true);
    request.onreadystatechange = function() {
        if( request.readyState == 1 ) {            
            request.setRequestHeader("Content-Type", "text/xml");        //"application/x-www-form-urlencoded");            
        }
    }
    request.send("cde="+cde);

J'obtiens toujours le même résultat, rien dans mon php

**andry.aime** · 15/01/2011, 04h44

Bonjour,

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 var request = getXHR();
    request.open("POST","./Scripts/Traitement_commande.php",true);
    request.onreadystatechange = function() {
        if(request.readyState == 4 && request.status == 200) {            
            alert (request.responseText);  
        }
    }
    request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    request.send("cde="+cde);

A+.

**gabest** · 15/01/2011, 10h27

merci andry.aime

Je m'appuie sur un livre Javascript pour Web 2.0 (Thierry Templier) et sur ce que j'y ai compris, je n'avais aucune chance de trouver la solution. Il y est notamment écrit que "la méthode setRequestHeader ne peut être utilisée que lorsque la valeur de la propriété readyState de l'objet équivaut à open (1).

[AJAX] informations complémentaires AJAX

AJAX

Discussions similaires

Partager

Partager