[javascript] fonction au sein d'une fonction, perte de valeur. Résolu/Fermé

Question

Bonjour,

Je suis face à un petit problème de puis quelques jours, je cherche à inverser la valeur d'une sortie gpio depuis un page php en cliquant sur un bouton, et à changer la couleur du bouton en fonction de l'état de la sortie. j'ai donc un scrit javascript qui appelle un script write.php, qui lit et change la valeur de la sortie en fonction de son état.
function invert(pin) {	var request = new XMLHttpRequest();	{	request.open( "GET" , "write.php?pin=" + pin);	request.send(null);	//information	request.onreadystatechange = function () {		if (request.readyState == 4 && request.status == 200) {		//renvoie 1 ou 0 pour la valeur de la sortie          return (request.responseText);		}	//test if fail		else if (request.readyState == 4 && request.status == 500) {			alert ("server error");			return ("fail");		}	//else 		else { return ("fail"); }	}	}}function b_0(){  var new_status = invert (0);   //pour test: la valeur de new_status n'est jamais affecté bien que la fonction s'opère!!  alert(new_status);  if (new_status == 1)  {			button_0.src = "data/img/red/red_1.jpg"; 			return 0;  }  if (new_status == 0)  {			button_0.src = "data/img/green/green_1.jpg"; 			return 0;  }}  button_0.addEventListener("click", b_0, false); 

La fonction me renvoye bien la valeur de la sortie concernée (j'ai testé avec alert() dans la fonction) mais quand je souhaite recupérer cette valeur dans le eventlistener, j'ai new_status="undefined"...

Comment remédier à cela?

Exileur · Answer

Salut, 

ça pourrait venir d'un probléme de "INT" "TEXT" ?
Ce que je veux dire c'est que ce que ta fonction retourne est une chaine de caractére ? ou un nombre ?


Pourquoi faire un return et ne pas creer une variable publique directement dans la fonction invert avec ton request.responseText
 
Cordialement
N'oubliez pas de marquez votre post comme résolut lorsque vous avez eu les réponses à vos questions...
Au royaume des aveugles, les borgnes sont rois.

Malahaka · Answer

Bonjour,
Ma fonction renvoie du texte, mais le alert(new_status) devrait afficher quelque chose malgré tout non? Je ne voudrais pas faire de variable globale, car j'aimerais utiliser cette fonction pour 7 autres boutons en passant juste le numéro de pin.

Utilisateur anonyme · Answer

Bonjour

Non, alert (new_status) n'a rien à afficher car ta fonction invert() ne renvoie rien.
Tes différents  return (request.responseText); et autres return ("fail"); sont situés à l'intérieur de la fonction anonyme définie par request.onreadystatechange = function () {.
Ta fonction invert définit cette fonction, mais ne l'appelle pas et n'exécute donc pas ces "return".

Cette fonction anonyme sera appelée lors de la fin de ta requête ajax, c'est à dire normalement longtemps (à l'échelle d'un PC) après la fin de l'exécution de invert.
Le plus simple est d'affecter button_0.src = "..." directement à la place de tes return.
Tu peux utiliser console.log() pour debugger, si tu sais te servir de la console javascript (indispensable si tu fais du javascript)

Malahaka · Answer

Bonjour,

Etant complétement novice, je me suis appuyé sur un script déjà existant pour écrire celui-ci, je chercherais des infos sur console.log(). Je ne connaissais pas trop le fonctionnement des fonctions annonymes, mais j'ai pu me rendre compte que leur portée était limitée à une seule portion du script. Il n'y a donc pas d'appel possible vers une fonction publique à partir de  .onreadystatechange?

J'ai modifié l'ensemble en l'orientant comme vous l'aviez conseillé, c'est à dire en opérant directement dans la fonction invert(), où je suis sûr que toutes mes valeurs y seront traitées.

Voilà le résultat, il manque juste une partie initialisation pour aller chercher la valeur en cours des sorties au moment de l'actualisation de la page. il s'agira certainement d'un script et d'une fonction php à part, basé sur le même principe, lancé "onload" par la page .

// fonction write.php lit l'état de la sortie avant de l'inverser
// une fois l'opération éffectuée, on définit le bouton à mettre à jour

function invert(pin,id,image_id_on,image_id_off) {
	var request = new XMLHttpRequest();
	{
	request.open( "GET" , "write.php?pin=" + pin);
	request.send(null);
	//receiving information
	request.onreadystatechange = function() { 
	  
					if (request.readyState == 4 && request.status == 200) {
					  var response = parseInt(request.responseText);
					  var button = document.getElementById(id);			    
					    if (response == 1)
					    {
								  
								  button.src = image_id_on; 
					    }
					    if (response == 0)
					    {
								  button.src = image_id_off; 
					    }

}
				//test if fail
					else if (request.readyState == 4 && request.status == 500) {
						alert ("server error");
					}
				//else 
							    };
	}
}

//définitions boutton

var b_0 = document.getElementById("button_0");
var b_1 = document.getElementById("button_1");
var b_2 = document.getElementById("button_2");
var b_3 = document.getElementById("button_3");
var b_4 = document.getElementById("button_4");
var b_5 = document.getElementById("button_5");
var b_6 = document.getElementById("button_6");
var b_7 = document.getElementById("button_7");

// traitement des événements:
//(les bouttons n'ont pas tous le même design)

b_0.addEventListener("click", function () { invert(0,"button_0","data/img/red/red_0.jpg","data/img/green/green_0.jpg");});
	
b_1.addEventListener("click", function () { invert(1,"button_1","data/img/red/red_1.jpg","data/img/green/green_1.jpg");});
	
b_2.addEventListener("click", function () { invert(2,"button_2","data/img/red/red_2.jpg","data/img/green/green_2.jpg");});

b_3.addEventListener("click", function () { invert(3,"button_3","data/img/red/red_3.jpg","data/img/green/green_3.jpg");});

b_4.addEventListener("click", function () { invert(4,"button_4","data/img/red/red_4.jpg","data/img/green/green_4.jpg");});

b_5.addEventListener("click", function () { invert(5,"button_5","data/img/red/red_5.jpg","data/img/green/green_5.jpg");});

b_6.addEventListener("click", function () { invert(6,"button_6","data/img/red/red_6.jpg","data/img/green/green_6.jpg");});

b_7.addEventListener("click", function () { invert(7,"button_7","data/img/red/red_7.jpg","data/img/green/green_7.jpg");});

Merci pour vos contributions!

[javascript] fonction au sein d'une fonction, perte de valeur.

4 réponses

Discussions similaires