[AJAX] Bouton de sauvegarde (ajax)

Version imprimable

29/12/2011, 15h13
lamb87

[AJAX] Bouton de sauvegarde (ajax)

Bonjour,

Je souhaiterais effectuer une sauvegarde d'une commande en cliquant sur un bouton. J'ai déjà fais mon traitement qui m'appelle une page js qui appelle une page php grâce à Ajax. Jusqu'ici tout fonctionne. ;)

Mon problème est que mes $_POST ne peuvent être utilisés dans ma page appelée ... :? je peux toujours utiliser des variables de session mais j'aimerais éviter puisqu'il y a pas mal de champs dans mon formulaire.

Si quelqu'un à une solution ou même une aide, qu'il m'en fasse part je suis perdu :(
Si vous avez besoin du code dites le moi ;)
30/12/2011, 10h34
Bovino

Citation:

Mon problème est que mes $_POST ne peuvent être utilisés dans ma page appelée ...

Ah bon... pourquoi ? :koi:

Citation:

Si vous avez besoin du code dites le moi

Disons que sans le code, ça rend un peu plus compliqué de voir où se situe ton problème :roll:

Bonjour,

Oui je suis d'accord que sans les codes ben ... c'est pas facile :mouarf:

Les POST ne fonctionnent pas parce que lorsque je valide mon formulaire, je suis redirigé vers une page qui montre un descriptif de la commande et l'utilisateur peut, si il le souhaite, sauvegarder sa commande sans la passer.
Mais le fait est que pour sauvegarder, j'appel un fichier js qui contient mon code Ajax qui lui même va chercher le fichier php qui contient les requêtes. Mais les post ne vont pas jusqu'à cette page. J'utiliserais bien des variables de session mais j'aimerais savoir si c'est optimisable.

Voici ma page qui reçoit le formulaire :

Code:

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
<?php
        session_start();
        $_SESSION['prenom'] = 'root';
?>
<!DOCTYPE HTML PUBLIC "-//W3C//Dtd HTML 4.01 transitional//EN" "http://www.w3.org/tr/HTML4/loose.dtd">
<HTML>
<HEAD>
	<meta http-equiv="Content-Type" content="text/HTML; charset=UTF-8">
	<title>D&eacute;tail de votre commande</title>
	<script src="../js/Ajax.js" type="text/javascript"></script>
</HEAD>
<BODY>
 
	<h1>D&eacute;tail de votre commande : </h1>
 
	<form action="CommandeEnCours.php" method="post">
    	<table>
	    	<tr>
	        	<th>Nom du fichier</th>
	            <th>Extension</th>
	            <th>Nombre de pages</th>
	        </tr>
	        <tr>
	        	<td><?php echo "" . $_SESSION['fnom'] . "";?></td>
	        	<td></td>
	        	<td></td>
	        </tr>
		</table>
 
		Niveau d'urgence :
		<select name="Niveau">
						<option value="" ></option>
						<option value="" ></option>
		</select>
		<br><br>
		<button type="button" name="SauvegarderCommande" OnClick="Save()">Sauvegarder</button>
		<button type="submit" name="envoyer">Envoyer</button>
		<button type="reset">Annuler</button>
	</form>
 
</BODY>
</HTML>

Mon script js :

Code:

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
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;
}
 
/*****************************************************
 ** Méthode qui sera appelée sur le click du bouton **
 ** pour appeler la page php à traiter avec Ajax    **
 *****************************************************/
function Save()
{
	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)
		{
			alert(xhr.responseText);
		}
	};
	xhr.open("GET","../php/SauvCommande.php",true);
	xhr.send(null);
}

Et finalement ma page appelée par ajax:

Code:

1
2
3
4
5
6
7
8
9
10
11
<?php
        echo "Commande sauvegardee";
        $i=0;
        while(isset($_POST["type"+$i]))
        {
                echo $_POST["type"+$i]."<br/>";
        }
        include '../class/Autoload.php';
        $commande = new Commande();
        $commande->AjouterCommande();
?>

31/12/2011, 06h07
andry.aime

Bonjour,

Citation:

xhr.open("GET","../php/SauvCommande.php",true);

Citation:

while(isset($_POST["type"+$i]))

1- Si tu veux utiliser la méthode GET, tu dois concaténer les données avec l'URL. Par contre si tu utilises la méthode POST, tu dois les concaténer dans le paramètre de la methode send.
2- avec ton code, tu appelles la page en GET sans donnée et tu veux récupérer des trucs dans $_POST. L'ajax ne fait pas de magie :oops:.

Je te conseille de relire de tutoriels.

A+.
02/01/2012, 08h55
lamb87

Bonjour,

Je me disais bien que cela pouvais provenir du fameux GET ... Que voulez-vous dire par la méthode send ?
Je pense aussi que çà peut venir du fait que le bouton de sauvegarde ne soit pas du type submit puisque je ne veut pas qu'il soumette le formulaire. Je veux juste que l'utilisateur puisse enregistrer sa commande sans l'envoyer. En effet, lors de la validation du formulaire j'envoie un mail, et donc si il l'enregistre, il n'est pas obliger de l'envoyer.

Bonjour, il faut utiliser cette façon de faire :
Code:

1 2 3 4 var data = "file=" + url + "&content=" + content; xhr.open("POST", "ajax-post-text.php", true); xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); xhr.send(data);
Pour faire simple, en POST il faut passer les paramètres dans le send().

02/01/2012, 11h01
lamb87

J'ai mis le send mais maintenant quand je clique sur le bouton il ne m'affiche plus rien alors qu'il devrait au moins afficher mon echo :(
03/01/2012, 06h05
andry.aime

Bonjour,

Peut-on voir ton code actuel?

A+.

Bonjour,

Voici ma page qui reçoit les Post :

Code:

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
<?php
        session_start();
        $_SESSION['prenom'] = 'root';
?>
<!DOCTYPE HTML PUBLIC "-//W3C//Dtd HTML 4.01 transitional//EN" "http://www.w3.org/tr/HTML4/loose.dtd">
<HTML>
<HEAD>
	<meta http-equiv="Content-Type" content="text/HTML; charset=UTF-8">
	<title>D&eacute;tail de votre commande</title>
	<script src="../js/Ajax.js" type="text/javascript"></script>
</HEAD>
<BODY>
 
	<h1>D&eacute;tail de votre commande : </h1>
 
	<form action="CommandeEnCours.php" method="post">
    	<table>
	    	<tr>
	        	<th>Nom du fichier</th>
	            <th>Extension</th>
	            <th>Nombre de pages</th>
	        </tr>
	        <tr>
	        	<td><?php echo "" . $_SESSION['fnom'] . "";?></td>
	        	<td><?php echo "" . $_SESSION['fextension'] . "";?></td>
	        	<td></td>
	        </tr>
		</table>
 
		Niveau d urgence :
		<select name="Niveau">
			<option value="" ></option>
			<option value="" ></option>
		</select>
		<br><br>
		<button type="button" name="SauvegarderCommande" OnClick="Save()">Sauvegarder</button>
		<button type="submit" name="envoyer">Envoyer</button>
		<button type="reset">Annuler</button>
	</form>
</BODY>
</HTML>

Ma page js/ajax appelé lors du clique du bouton:

Code:

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 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;
}
 
/*****************************************************
 ** Méthode qui sera appelée sur le click du bouton **
 ** pour appeler la page php à traiter avec Ajax    **
 *****************************************************/
function Save()
{
	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)
		{
			alert(xhr.responseText);
		}
	};
	var data = "file=" + url +  "&content=" + content;
	xhr.open('POST','../php/SauvCommande.php',true);
	xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");  
	xhr.send(data);
}

et enfin ma page appelé par ajax :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
<?php
        echo "Commande sauvegardee";
        $i=0;
        while(isset($_POST["type"+$i]))
        {
                echo $_POST["type"+$i]."<br/>";
        }
        //var_dump($_POST);
        include '../class/Autoload.php';
        $commande = new Commande();
        $commande->AjouterCommande();
?>

Je pense que mon problème viens du fait que je ne fais pas appel au Post directement sur la page qui reçoit le formulaire :(

03/01/2012, 09h55
Bovino

Je pense que parmi tes résolutions pour 2012, tu pourrais ajouter : "Lire un tutoriel sur AJAX", ne serait-ce qu'histoire de comprendre ce que tu envoies comme informations et comment les récupérer...

Code:

var data = "file=" + url + "&content=" + content;

url et content ne sont définis nulle part, peut-être une implémentation de la classe ChapeauMagique ?

Code:

while(isset($_POST["type"+$i]))

Encore un tour de magie ?
Tu transformes "file" et "content" en "type" ?
03/01/2012, 11h53
lamb87

Résolution déjà prise ! C'est juste que j'ai pas mis mon bon code en fait :aie:
Je l'ai modifié mais çà ne marche pas.
J'ai abandonné cette idée de sauvegarde mais j'aimerais quand même savoir comment faire.

Je voudrais juste savoir si je dois mettre mes post dans le content parce que j'ai pas tout compris là dans le tuto :?
12/01/2012, 10h34
lamb87

Bonjour,
Je reviens sur cet ancien post juste pour signaler que je commence à bien maitriser l'Ajax grâce à vos Tutoriels ! :ccool:
Disons que si je n'y arrivais pas c'était plus par manque de patience qu'autre chose :oops:
Mais c'est bon tout mes traitements fonctionnent et je vous remercie encore une fois ;)