[AJAX] Premier script AJAX

Version imprimable

Bonjour,

je débute en AJAX et j'ai un pb. Je n'arrive pas à afficher la fameuse pop up où il y a "Données reçues en POST".Soyez compréhensif c'est mon premier script AJAX.

Merci de votre aide

Voilà mon script AJAX

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
function RequeteAJAX(){
 
var xhr_object = null; 
var method = "POST";
 
	if(window.XMLHttpRequest) // Firefox 
	   xhr_object = new XMLHttpRequest(); 
	else if(window.ActiveXObject) // Internet Explorer 
	   xhr_object = new ActiveXObject("Microsoft.XMLHTTP"); 
	else { // XMLHttpRequest non supporté par le navigateur 
	   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
	   return; 
	} 
 
 	var s1       = document.form.element['IDPseudo'].value; 
	var s2       = document.form.element['IDMDP'].value; 
	var data     = null; 
	alert(s1);
 
	if(s1 != "" && s2 != "") 
	   data = "s1="+s1+"&s2="+s2; 
 
	 xhr_object.open(method, "OuvertureSession.php", true); 
 
	   xhr_object.onreadystatechange = function() { 
	      if(xhr_object.readyState == 4) {
			 var tmp = xhr_object.responseText.split(":"); 
				if(typeof(tmp[1]) != "undefined") { 
		        //je met rien ici
				} 
	      alert(tmp[0]); 
		  }
	 }
	   xhr_object.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
 
	   xhr_object.send(data); 	   
 
}

22/03/2009, 20h35
llaffont

Re !

Que te retourne le script OuvertureSession.php ?

En fait j'obtiens bien l'affichage de mes echo c'est à dire

Code:

Données reçues en POST:monpseudo:motmotdepasse:Retour en page acceuil

Avec le script suivant :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 <?php header('Content-type: text/html; charset=iso-8859-1'); if(count($_POST) > 0) { echo "Données reçues en POST:"; foreach($_POST as $v) echo strrev(utf8_decode($v)).":"; echo "Retour en page acceuil"; } ?>
En faite le script fonctionne sauf que dans l'exemple donné sur le site cité ci-dessus je devrais avoir ce resultat dans une pop up. Moi je l'obtiens inscrit dans une nouvelle page blanche

Essaye avec ça ! C'est plus précis.
Code:

1 2 3 var s1 = document.getElementById('IDPseudo').value; var s2 = document.getElementById('IDMDP').value;
En ayant bien sûr effectué un truc de ce style dans ta page HTML
Code:

1 2 <input type="text" id="IDPseudo" > <input type="text" id="IDMDP" >

J'ai ré-essayé mais rien de plus. Je n'ai pas d'erreurs avec Firebug et les echo fonctionne bien. Ma page HTML avec mes champs est la suivante :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 <form name="formul" method="post" enctype="multipart/form-data" action="OuvertureSession.php"> <div id="IChampsConnexion"> Nom d'utilisateur <br> Mot de passe<br> <input type="button" value="S'enregistrer" onclick="IsConnectMembre('IDPseudo','IDMDP');"> </div> <div id="IMembre"> <input type="text" id="IDPseudo" name="NPseudo"> <br> <input type="password" id="IDMDP" name="NMDP"><br> </div> </form>
Ca ne pose pas de problème que mes champs soient dans un formulaire POST?
Le fonctionnement est le suivant : lors du clique sur le boutton "S'enregistrer" ma fonction JS IsConnectMembre('IDPseudo','IDMDP') s'execute. Dans celle-ci se trouve la soumission du formulaire "formul" qui lance donc mon script OuvertureSession.php.

22/03/2009, 22h24
llaffont

Je ne comprends pas pourquoi tu veux vérifier le type de ton retour dans ta fonction Java.

Car ton script, chez moi, fonctionne très bien
22/03/2009, 22h32
Général03

En faite en fonction du retour des mon script OuvertureSession.php je veux afficher dans une fenêtre JS que j'ai créée :
-pseudo incorrect
-mot de passe incorrect
-pseudo inexistant
-champs vides
-...
En faite je veux récupérer une variable PHP, dans laquelle j'ai mis le texte, pour la placer dans ma fenêtre JavaScript.

test

Salut,

Etonné, j'ai regroupé toutes les infos et j'ai essayé: tout marche correctement.

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
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
 
  <body>
    <script type="text/javascript">
      function IsConnectMembre(){
 
      var xhr_object = null; 
      var method = "POST";
 
      	if(window.XMLHttpRequest) // Firefox 
      	   xhr_object = new XMLHttpRequest(); 
      	else if(window.ActiveXObject) // Internet Explorer 
      	   xhr_object = new ActiveXObject("Microsoft.XMLHTTP"); 
      	else { // XMLHttpRequest non supporté par le navigateur 
      	   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
      	   return; 
      	} 
 
       	var s1       = document.forms[0].elements['NPseudo'].value; 
      	var s2       = document.forms[0].elements['NMDP'].value;  
      	var data     = null; 
      	alert(s1);
 
      	if(s1 != "" && s2 != "") 
      	   data = "s1="+s1+"&s2="+s2; 
 
      	 xhr_object.open(method, "ouvertureSession.php", true); 
 
      	   xhr_object.onreadystatechange = function() { 
 
              if(xhr_object.readyState == 4) {
      			 var tmp = xhr_object.responseText.split(":"); 
      				if(typeof(tmp[1]) != "undefined") { 
      		        //je met rien ici
      				} 
      	      alert("resultat:"+ tmp[0]); 
      		  }
      	 }
      	   xhr_object.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
 
      	   xhr_object.send(data); 	   
 
      }    
    </script>
 
    <form >
 
    <div id="IChampsConnexion">						
    	Nom d'utilisateur <br>
    	Mot de passe<br>
    	<input type="button" value="S'enregistrer" onclick="IsConnectMembre('IDPseudo','IDMDP');">
    </div>
 
    <div id="IMembre">
    	<input type="text" id="IDPseudo" name="NPseudo"> <br>
    	<input type="password" id="IDMDP" name="NMDP"><br>
    </div>
 
    </form>
  </body>

et pour ouvertureSession.php

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
<?php
header('Content-type: text/html; charset=iso-8859-1'); 
 
 
if(count($_POST) > 0) { 
echo "Données reçues en POST:"; 
foreach($_POST as $v) 
    echo strrev(utf8_decode($v)).":"; 
                 
echo "Retour en page acceuil";
                
} 
?>

Aucun problème, les données s'affichent bien au niveau du alert("resultat:"+ tmp[0]); quand est saisi un user et un password.

ERE

22/03/2009, 22h49
Général03

8O a oui en effet emmanuel.remy !! Je viens de reprendre ton script que tu as mis ci-dessus et ça fonctionne chez moi aussi. Je vais regarder ce qui cloche dans mon code.
Merci

Citation:

Envoyé par Général03

ça fonctionne chez moi aussi. Je vais regarder ce qui cloche dans mon code.
Merci

J'ai remplacé tes 2 lignes de codes qui affectent s1 et s2 parce que les lignes originales sont fausses.
Code:

1 2 3 4 5 6 7 8 //Erreur de code //var s1 = document.form.element['NPseudo'].value; //var s2 = document.form.element['NMDP'].value; var s1 = document.forms[0].elements['NPseudo'].value; var s2 = document.forms[0].elements['NMDP'].value;
ERE

23/03/2009, 08h59
llaffont
Citation:
Envoyé par llaffont

Code:

1 2 3 var s1 = document.getElementById('IDPseudo').value; var s2 = document.getElementById('IDMDP').value;
C'est pour ça que j'avais indiqué getElementById qui pour moi est bien plus pratique que de chercher chaque fois pourquoi mon element n'est pas pris en compte.

Merci emmanuel.remy je ne trouvais pas ce qui clochait et surtout je ne savais pas que le Forms était un Array.
23/03/2009, 09h03
Bovino

En fait, forms n'est pas à proprement parler un array mais plutôt une collection.
De ce fait, il dispose d'une propriété length (et donc la possibilité de noter forms[0]), mais pas de toutes les propriétés d'un véritable objet Array.
23/03/2009, 18h36
Général03
Milles merci les gars mon erreur est résolu :king:
En faite j'ai essayé avec
Code:

1 2 var s1 = document.getElementById('IDPseudo').value; var s2 = document.getElementById('IDMDP').value;
ou
Code:

1 2 var s1 = document.forms[0].elements['NPseudo'].value; var s2 = document.forms[0].elements['NMDP'].value;
est c'est bon ça fonctionne parfaitement.:yaisse2:

Dernière petite question pour la route :
laquelles des 2 solutions est la mieux : getElementById ou forms[0].elements[] ?

Merci
23/03/2009, 20h50
Bovino

C'est plus une question de point de vue qu'autre chose, mais à mon sens, en règle générale, getElementsById est préférable, mais s'agissant d'un formulaire, document.forms[0].elements[] peut être préférable dans la mesure où les éléments de formulaires sont repérés par leur name (en terme de soumission, mais rien de dégueu :mrgreen:).