[Javascript] Utilisation de la commande POST

regedit32 Messages postés 16 Statut Membre -  
Alain_42 Messages postés 5413 Statut Membre -
Bonjour,
Je suis novice en javascript et je cherche à utiliser la commande POST pour remplir 3 fois de suite un même formulaire mais en retour j'ai une erreur 302, voici mon code (simplifié).

xhr = new XMLHttpRequest(); 
xhr.open("POST", "http://www.adresseDuFormulaire.cfm", false);
xhr.send("champ1=42;champ2=1337;champ3=valeur");

xhr = new XMLHttpRequest(); 
xhr.open("POST", "http://www.adresseDuFormulaire.cfm", false);
xhr.send("champ1=42;champ2=1337;champ3=valeur");

xhr = new XMLHttpRequest(); 
xhr.open("POST", "http://www.adresseDuFormulaire.cfm", false);
xhr.send("champ1=42;champ2=1337;champ3=valeur");


Je sollicite donc votre aide pour savoir si il y a une erreur dans le code que j'ai posté,
Merci d'avance.

11 réponses

  1. regedit32 Messages postés 16 Statut Membre 2
     
    J'ai testé ta solution en la mettant dans un fichier.html que j'ai uploadé sur mon serveur:
    
    <html> 
    <head> 
    <script type="text/javascript"> 
    //fonction creation requette
    function creer_requette(){
    	var xhr = false;
    //créer une instance (un objet) de la classe désirée fonctionnant sur plusieurs navigateurs
    	if (window.XMLHttpRequest) { // Mozilla, Safari,...
    		xhr = new XMLHttpRequest();
    		if (xhr.overrideMimeType) {
    			xhr.overrideMimeType('text/xml');//un appel de fonction supplémentaire pour écraser l'en-tête envoyé par le serveur, juste au cas où il ne s'agit pas de text/xml, pour certaines versions de navigateurs Mozilla
    		}
    	} else if (window.ActiveXObject) { // IE
    		try {
    		xhr = new ActiveXObject("Msxml2.XMLHTTP");
    		} catch (e) {
    			try {
    				xhr = new ActiveXObject("Microsoft.XMLHTTP");
    			} catch (e) {}
    		}
    	}
    
    	if (!xhr) {
    	alert('Abandon :( Impossible de créer une instance XMLHTTP');
    	return false;
    	}
    	return xhr;
    }
    
    /////// fonction AJAX, celle que tu dois appeler en lui passant ces trois arguments /////
    function requette_Ajax(valeur1,valeur2,valeur3){
    	var xhr = false;
    	xhr=creer_requette();
    	
    	//affectation fonction appelée qd on recevra la reponse 1
    	http_request.onreadystatechange = function() { 
    		if (http_request.readyState == 4) {
    			if (http_request.status == 200) {
    				//deuxiemme appel 
    				var xhr = false;
    				xhr=creer_requette();
    			
    				//affectation fonction appelée qd on recevra la reponse 2
    				http_request.onreadystatechange = function() { 
    					if (http_request.readyState == 4) {
    						if (http_request.status == 200) {
    							//troisieme appel 
    							var xhr = false;
    							xhr=creer_requette();
    					
    							//affectation fonction appelée qd on recevra la reponse 3
    							http_request.onreadystatechange = function() {
    								if (http_request.readyState == 4) {
    									if (http_request.status == 200) {
    										alert("Fin traitement troisieme appel");
    									}
    								}
    							} 
    					
    							//lancement de la 
    							xhr.open("POST", "http://www.adresseDuFormulaire.cfm", false);
    							//changer le type MIME de la requête pour envoyer des données avec la méthode POST , !!!! cette ligne doit etre absolument apres http_request.open('POST'....
    							http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    							xhr.send("champ1=1&champ2=1337&champ3=42");
    						}
    					}
    				}
    			}
    		} 
    	
    		//lancement de la 
    		xhr.open("POST", "http://www.adresseDuFormulaire.cfm", false);
    		//changer le type MIME de la requête pour envoyer des données avec la méthode POST , !!!! cette ligne doit etre absolument apres http_request.open('POST'....
    		http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    		xhr.send("champ1=1&champ2=1337&champ3=42");
    	
    	
    	} 
    	
    	//lancement de la 
    	xhr.open("POST", "http://www.adresseDuFormulaire.cfm", false);
    	//changer le type MIME de la requête pour envoyer des données avec la méthode POST , !!!! cette ligne doit etre absolument apres http_request.open('POST'....
    	http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    	xhr.send("champ1=1&champ2=1337&champ3=42"); //la je suppose que valeur est passé en argument à la fonction
    } //fin fonction
    
    </script> 
    </body> 
    </html>  
    
    


    Quand je vais sur ma page il ne s'affiche rien et dans le logiciel Charles qui permet de monitorer les requètes HTTP il n'y a rien non plus, ni dans la console de l'extension firebug, ni dans celle de firefox.

    Un grand merci pour l'aide que tu m'a déjà apporté, j'ai beaucoup avancé grace à toi, je sens qu'il ne manque plus grand chose pour que le script fonctionne.
    1
  2. avion-f16 Messages postés 19182 Date d'inscription   Statut Contributeur Dernière intervention   4 511
     
    Salut,

    Il faut utiliser « & » à la place de « ; » pour séparer les paramètres, exactement comme dans les URLs (GET).
    0
  3. regedit32 Messages postés 16 Statut Membre 2
     
    J'ai remplacé les ; par des & mais ça ne change rien.
    Quand je test mon script dans la console de firefox j'ai pour réponse " undefined" quand je colle la 2eme ligne (xhr.open), quand je met la 3 eme ligne j'ai " [Exception... "Component returned failure code: 0xc1f30001 (NS_ERROR_NOT_INITIALIZED)" nsresult: "0xc1f30001 (NS_ERROR_NOT_INITIALIZED)" location: "JS frame :: Web Console :: <TOP_LEVEL> :: line 1" data: no]"

    Si je met les 3 ligne d'un coup j'ai erreur 302 en plus de l'exeption .
    0
  4. Alain_42 Messages postés 5413 Statut Membre 904
     
    il te manque des lignes dans ton Ajax, de plus il faudrait peut être que tu attende la fin de l'exécution de la première avant de lancer la deuxième

    une solution:

    //fonction creation requette
    function creer_requette(){
    	var xhr = false;
    //créer une instance (un objet) de la classe désirée fonctionnant sur plusieurs navigateurs
    	if (window.XMLHttpRequest) { // Mozilla, Safari,...
    		xhr = new XMLHttpRequest();
    		if (xhr.overrideMimeType) {
    			xhr.overrideMimeType('text/xml');//un appel de fonction supplémentaire pour écraser l'en-tête envoyé par le serveur, juste au cas où il ne s'agit pas de text/xml, pour certaines versions de navigateurs Mozilla
    		}
    	} else if (window.ActiveXObject) { // IE
    		try {
    		xhr = new ActiveXObject("Msxml2.XMLHTTP");
    		} catch (e) {
    			try {
    				xhr = new ActiveXObject("Microsoft.XMLHTTP");
    			} catch (e) {}
    		}
    	}
    
    	if (!xhr) {
    	alert('Abandon :( Impossible de créer une instance XMLHTTP');
    	return false;
    	}
    	return xhr;
    }
    
    /////// fonction AJAX, celle que tu dois appeler en lui passant ces trois arguments /////
    function requette_Ajax(valeur1,valeur2,valeur3){
    	var xhr = false;
    	xhr=creer_requette();
    	
    	//affectation fonction appelée qd on recevra la reponse 1
    	http_request.onreadystatechange = function() { 
    		if (http_request.readyState == 4) {
    			if (http_request.status == 200) {
    				//deuxiemme appel 
    				var xhr = false;
    				xhr=creer_requette();
    			
    				//affectation fonction appelée qd on recevra la reponse 2
    				http_request.onreadystatechange = function() { 
    					if (http_request.readyState == 4) {
    						if (http_request.status == 200) {
    							//troisieme appel 
    							var xhr = false;
    							xhr=creer_requette();
    					
    							//affectation fonction appelée qd on recevra la reponse 3
    							http_request.onreadystatechange = function() {
    								if (http_request.readyState == 4) {
    									if (http_request.status == 200) {
    										alert("Fin traitement troisieme appel");
    									}
    								}
    							} 
    					
    							//lancement de la 
    							xhr.open("POST", "http://www.adresseDuFormulaire.cfm", false);
    							//changer le type MIME de la requête pour envoyer des données avec la méthode POST , !!!! cette ligne doit etre absolument apres http_request.open('POST'....
    							http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    							xhr.send("champ1=42&champ2=1337&champ3="+valeur3);
    						}
    					}
    				}
    			}
    		} 
    	
    		//lancement de la 
    		xhr.open("POST", "http://www.adresseDuFormulaire.cfm", false);
    		//changer le type MIME de la requête pour envoyer des données avec la méthode POST , !!!! cette ligne doit etre absolument apres http_request.open('POST'....
    		http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    		xhr.send("champ1=42&champ2=1337&champ3="+valeur2);
    	
    	
    	} 
    	
    	//lancement de la 
    	xhr.open("POST", "http://www.adresseDuFormulaire.cfm", false);
    	//changer le type MIME de la requête pour envoyer des données avec la méthode POST , !!!! cette ligne doit etre absolument apres http_request.open('POST'....
    	http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    	xhr.send("champ1=42&champ2=1337&champ3="+valeur1); //la je suppose que valeur est passé en argument à la fonction
    } //fin fonction
    0
  5. Vous n’avez pas trouvé la réponse que vous recherchez ?

    Posez votre question
  6. regedit32 Messages postés 16 Statut Membre 2
     
    J'ai tester dans la console de firefox 7.0 ton code jusqu'à la première requête post mais j'obtient "undefined" comme réponse et aucune requête HTML n'est envoyée.
    J'ai tester de n'exécuter que le début ( fonction création requête) et j'ai aussi "undefined".
    0
  7. Alain_42 Messages postés 5413 Statut Membre 904
     
    je n'ai pas FF7 mais FF6 et ne connait pas la console dont tu parles (elle ne marche peut etre pas avec Ajax), perso j'utilise la console d'erreur JS pour voir les erreur après exécution en réel de la fonction
    Voici un code qui fonctionne chez moi j'ai mis un script script_test.php en script appelé
    <html> 
    <head> 
    <script type="text/javascript"> 
    //init variables globales 
    cpt=1; 
    valeur_mem1=""; 
    valeur_mem2=""; 
    valeur_mem3=""; 
    //fonction gestion requettes celle que tu dois appeler en lui passant ces trois arguments ///// 
    function gest_req_multiple(url,valeur1,valeur2,valeur3){ 
     valeur_mem1=valeur1; //memo
     valeur_mem2=valeur2; 
     valeur_mem3=valeur3; 
     if(cpt==1){requette_Ajax(url,valeur_mem1);} 
     if(cpt==2){requette_Ajax(url,valeur_mem2);} 
     if(cpt==3){requette_Ajax(url,valeur_mem3);} 
      
       
    } 
    //fonction creation requette 
    function creer_requette(){ 
     var xhr = false; 
    //créer une instance (un objet) de la classe désirée fonctionnant sur plusieurs navigateurs 
     if (window.XMLHttpRequest) { // Mozilla, Safari,... 
      xhr = new XMLHttpRequest(); 
      if (xhr.overrideMimeType) { 
       xhr.overrideMimeType('text/xml');//un appel de fonction supplémentaire pour écraser l'en-tête envoyé par le serveur, juste au cas où il ne s'agit pas de text/xml, pour certaines versions de navigateurs Mozilla 
      } 
     } else if (window.ActiveXObject) { // IE 
      try { 
      xhr = new ActiveXObject("Msxml2.XMLHTTP"); 
      } catch (e) { 
       try { 
        xhr = new ActiveXObject("Microsoft.XMLHTTP"); 
       } catch (e) {} 
      } 
     } 
    
     if (!xhr) { 
     alert('Abandon :( Impossible de créer une instance XMLHTTP'); 
     return false; 
     } 
     return xhr; 
    } 
    
    /////// fonction AJAX,
    function requette_Ajax(url,valeur){ 
     var xhr = false; 
     xhr=creer_requette(); 
      
     //affectation fonction appelée qd on recevra la reponse 1 
     xhr.onreadystatechange = function() {  
       
      if (xhr.readyState == 4) { 
       if (xhr.status == 200) { 
        var reponse=xhr.responseText;     
        cpt++; 
        if(cpt <=3){ 
         gest_req_multiple(url,valeur_mem1,valeur_mem2,valeur_mem3); 
        }else{ 
         cpt=1; 
         alert("fin des 3 requettes !"); 
        } 
       } 
      }   
      
      
     }  
      
     //lancement de la  
     xhr.open("POST", url, false); 
     //changer le type MIME de la requête pour envoyer des données avec la méthode POST , !!!! cette ligne doit etre absolument apres xhr.open('POST'.... 
     xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); 
     xhr.send("champ1=42&champ2=1337&champ3="+valeur); //la je suppose que valeur est passé en argument à la fonction 
    } //fin fonction 
    </script> 
    <head> 
    <body> 
    <br /><br /> 
    <a href="javascript:gest_req_multiple('script_test.php','10','20','30')">test</a> 
    </body> 
    </html> 
    


    et le script_test_.php:

    <?php 
    echo "OK"; 
    //simpliste 
    ?> 
    


    Alors fais un essai en réel
    0
  8. regedit32 Messages postés 16 Statut Membre 2
     
    Je doit le mettre où ton script ajax? Dans l'ardoise javascript(scratchpad)?
    Et le fichier.php ?
    0
  9. Alain_42 Messages postés 5413 Statut Membre 904
     
    le script javascript/ajax tu le mets dans ta page
    comme dans mon exemple

    et tu upload ta page et le script php sur le serveur dans le même répertoire

    tu appelles ta page et déclenche le javascript en cliquant sur le lien test
    0
  10. regedit32 Messages postés 16 Statut Membre 2
     
    Je n'ai pas de serveur pour uploader la page donc je l'ai sauvegardée dans un fichier.html dans le même dossier que script_test.php.

    Je vois le lien de test mais quand je clique dessus il ne se passe rien.
    Ne fonctionne pas nom plus avec:
    Google Chrome 14
    Opera 11.51
    Internet Explorer 9
    Firefox 9.0 Alpha 2

    EDIT:
    C'est bon j'ai finalement put l'uploader sur un serveur web, quand je clique sur "test" ça m'affiche "fin des 3 requettes !" donc c'est bon?
    0
  11. Alain_42 Messages postés 5413 Statut Membre 904
     
    normal tu n'as pas utilisé la dernière version que je t'ai donné
    celle qui comporte une fonction gest_req_multiple(

    du 22/10 à 21h09
    0
    1. regedit32 Messages postés 16 Statut Membre 2
       
      Je ne trouve pas dans ton code la fonction gest_req_multiple(
      0
  12. Alain_42 Messages postés 5413 Statut Membre 904
     
    bon le revoilà:
    <code><html>
    <head>
    <script type="text/javascript">
    //init variables globales
    cpt=1;
    valeur_mem1="";
    valeur_mem2="";
    valeur_mem3="";
    //fonction gestion requettes celle que tu dois appeler en lui passant ces trois arguments /////
    function gest_req_multiple(url,valeur1,valeur2,valeur3){
    valeur_mem1=valeur1; //memo
    valeur_mem2=valeur2;
    valeur_mem3=valeur3;
    if(cpt==1){requette_Ajax(url,valeur_mem1);}
    if(cpt==2){requette_Ajax(url,valeur_mem2);}
    if(cpt==3){requette_Ajax(url,valeur_mem3);}

    }
    //fonction creation requette
    function creer_requette(){
    var xhr = false;
    //créer une instance (un objet) de la classe désirée fonctionnant sur plusieurs navigateurs
    if (window.XMLHttpRequest) { // Mozilla, Safari,...
    xhr = new XMLHttpRequest();
    if (xhr.overrideMimeType) {
    xhr.overrideMimeType('text/xml');//un appel de fonction supplémentaire pour écraser l'en-tête envoyé par le serveur, juste au cas où il ne s'agit pas de text/xml, pour certaines versions de navigateurs Mozilla
    }
    } else if (window.ActiveXObject) { // IE
    try {
    xhr = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
    try {
    xhr = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (e) {}
    }
    }

    if (!xhr) {
    alert('Abandon :( Impossible de créer une instance XMLHTTP');
    return false;
    }
    return xhr;
    }

    /////// fonction AJAX,
    function requette_Ajax(url,valeur){
    var xhr = false;
    xhr=creer_requette();

    //affectation fonction appelée qd on recevra la reponse
    xhr.onreadystatechange = function() {

    if (xhr.readyState == 4) {
    if (xhr.status == 200) {
    var reponse=xhr.responseText;
    cpt++;
    if(cpt <=3){
    gest_req_multiple(url,valeur_mem1,valeur_mem2,valeur_mem3);
    }else{
    cpt=1;
    alert("fin des 3 requettes !");
    }
    }
    }

    }

    //lancement de la
    xhr.open("POST", url, false);
    //changer le type MIME de la requête pour envoyer des données avec la méthode POST , !!!! cette ligne doit etre absolument apres xhr.open('POST'....
    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xhr.send("champ1=42&champ2=1337&champ3="+valeur); //la je suppose que valeur est passé en argument à la fonction
    } //fin fonction
    </script>
    <head>
    <body>
    <br /><br />
    <a href="javascript:gest_req_multiple('script_test.php','10','20','30')">test</a>
    </body>
    </html>
    /code>
    0