[AJAX] fonction AJAX qui recupere une valeur afin de l'utiliser dans une fonction javascript

Version imprimable

Bonjour à tous,

je suis depuis quelque temps sur un problème que je n'arrive pas à résoudre..
Je m'explique :

Ma fonction javascript permet d'afficher des balises input avec leurs valeurs dans un tableau de modification/ajout/suppression. Cependant je cherche à limiter une balise input de type number à un certain maximum selon le nombre de valeurs dans ma table.
Code:

1 2 3 4 5 6 7 8 9 10 11 12 function modifier(id,i){ var table = document.getElementById('tableau_competence'); var module = document.getElementById('module'+i), module_value = document.getElementById('module'+i).innerHTML; module.innerHTML = '<input name="module" id="modulee'+i+'" type="text" size="10" value='+module_value+' disabled/>'; var ordre = document.getElementById('ordre'+i); ordre_value = document.getElementById('ordre'+i).innerHTML; ordre.innerHTML = '<input name="ordre" id="ordree'+i+'" type="number" min="1" max="'+//recherche_max(module_value)//+'" size="10" value="'+ordre_value+'"/>';
Je cherche donc à insérer dans l'attribut max , ma fonction ajax qui est censé me retourner la valeur désiré.
Fonction Ajax :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 function recherche_max(id_module) { XMLhttp=new XMLHttpRequest(); var data = 'recherche_max=' +true+ '&id=' +id_module; XMLhttp.open("POST","traitement_competence.php",true); XMLhttp.onreadystatechange=function() { if (XMLhttp.readyState==4 && XMLhttp.status==200) { var maximum=XMLhttp.responseText; } } XMLhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); XMLhttp.send(data); return(maximum); }
ma fonction php qui traire la requete est la suivante :
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 try { if(isset($_POST['recherche_max']) && isset($_POST['id']) && !empty($_POST['id'])){ $id_module=$_POST['id']; // Connect and create the PDO object $conn = new PDO("mysql:host=$hostdb; dbname=$namedb", $userdb, $passdb); $conn->exec("SET CHARACTER SET utf8"); // Sets encoding UTF-8 // Delete rows in "sites", according to the value of "category" column $sql = "SELECT MAX(comp_ordre) FROM competence WHERE comp_module = '".$id_module."'"; $result = $conn->query($sql); while($row = $result->fetch(PDO::FETCH_NUM)) { $maximum=$row['0']; echo $maximum; } } $conn = null; // Disconnect } catch(PDOException $e) { echo $e->getMessage(); }
La requete est opérationnel, j'affecte donc l'unique valeur retournée dans $maximum et j'aimerais la retourner à ma fonction js afin que l'attribut max soit initialisé à cette valeur.

J'espere que j'ai été clair, je vous remercie déjà de regarder ce soucis, et de vos réponses qui m'éclaireront certainement sur les solutions possibles à ce pronlème.

Cordialement,
Florian.

22/04/2013, 12h38
andry.aime

Bonjour,

Soit tu fais le traitement (appel d'une fonction ,...) dans le XMLhttp.onreadystatechange, soit tu travailles en mode synchrone.

A+.
22/04/2013, 12h58
Florian_mbf

Je te remercie de ta réponse rapide, je vais tester la solution de passer en synchrone.

Cordialement,
Florian.

Bon j'ai essayé le mode synchrone mais je n'ai pas réussi à récupérer la valeur et à la passer dans mon code javascript :
Je reposte mon code :

page php qui traite ma requete ajax ( possibilité de retourner la valeur si oui par quel moyen ?) :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
if(isset($_GET['recherche_max']) && isset($_GET['id']) && !empty($_GET['id'])){
	$id_module=$_GET['id'];
	// Connect and create the PDO object
	$conn = new PDO("mysql:host=$hostdb; dbname=$namedb", $userdb, $passdb);
	$conn->exec("SET CHARACTER SET utf8");      // Sets encoding UTF-8
	// Delete rows in "sites", according to the value of "category" column
	$sql = "SELECT MAX(comp_ordre) FROM competence WHERE comp_module =( SELECT comp_module FROM competence WHERE comp_id = '".$id_module."')";
	$result = $conn->query($sql);
	while($valeur = $result->fetch()) {
		$maximum=$valeur[0];
		// ???  return $maximum; ??? //
	}
}

ma fonction ajax dans laquelle j'aimerais recuperer la valeur $maximum afin de la retourner :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function recherche_max(id_module)
{
XMLhttp=new XMLHttpRequest();
 
XMLhttp.onreadystatechange=function()
  {
  if (XMLhttp.readyState==4 && XMLhttp.status==200)
    {
		// ???var maximum = XMLhttp.responseText; ???//
 
    }
  }
XMLhttp.open("GET","traitement_competence.php?recherche_max="+true+'&id='+id_module,false);
XMLhttp.send();
// ???? return (maximum); ??? //
// Je ne suis vraiment pas sur des passages avec les ??
}

Puis dans ma fonction javascript :

Code:

1
2
3
4
5
6
//je cherche à récupérer la valeur de la fonction ajax dans une variable max que j'affecte ensuite dans ma balise input à l'attribut max ..
var max = recherche_max(id);
 
var ordre = document.getElementById('ordre'+i);
ordre_value = document.getElementById('ordre'+i).innerHTML;
ordre.innerHTML = '<input name="ordre" id="ordree'+i+'" type="number"  min="1" max="'+max+'" size="10" value="'+ordre_value+'"/>';

L'erreur que me retourne la console javascript de Chrome est la suivante :

Citation:

Uncaught ReferenceError: maximum is not defined

Une quelconque aide serait la bienvenue, je ne vois pas de solution ...
Merci :)

Re,

Code:

1
2
3
4
5
6
7
8
function recherche_max(id_module)
{
XMLhttp=new XMLHttpRequest();
XMLhttp.open("GET","traitement_competence.php?recherche_max="+true+'&id='+id_module,false);
XMLhttp.send(null);
return (XMLhttp.responseText); 
 
}

A+.

Ce forum est génial, je te remercie, je montre mon code résolu pour ceux qui auraient besoin un jour :

fonction ajax :

Code:

1
2
3
4
5
6
7
function recherche_max(id_module)
{
XMLhttp=new XMLHttpRequest();
XMLhttp.open("GET","traitement_competence.php?recherche_max="+true+'&id='+id_module,false);
XMLhttp.send(null);
return (XMLhttp.responseText); 
}

fonction javascript :

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
 
function modifier(id,i){
 
	var table = document.getElementById('tableau_competence');
 
	var module = document.getElementById('module'+i),
	module_value = document.getElementById('module'+i).innerHTML; 
	module.innerHTML = '<input name="module" id="modulee'+i+'" type="text" size="10"  value='+module_value+' disabled/>';
 
	var max = recherche_max(id);
	var ordre = document.getElementById('ordre'+i);
	ordre_value = document.getElementById('ordre'+i).innerHTML;
	ordre.innerHTML = '<input name="ordre" id="ordree'+i+'" type="number"  min="1" max="'+max+'" size="10" value="'+ordre_value+'"/>';
 
	var comp = document.getElementById('comp'+i);
	comp_value = document.getElementById('comp'+i).innerHTML;
	comp.innerHTML = '<input name="comp" id="compe'+i+'" type="text"  value="'+comp_value+'"/>';
 
	var images = table.getElementsByTagName('a'),
	images_len = images.length;
	for(var y=0;y<images_len;y++){
		images[y].style.display='none';
		}
 
	var a = document.getElementById('modif_competence'+i);
	var image_modif = document.getElementById('image_modif'+i);
	image_modif.src='../image/save.png';
	a.href='javascript:insert_comp('+id+','+i+')';
	a.style.display = 'block';
}

page de traitement php :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
if(isset($_GET['recherche_max']) && isset($_GET['id']) && !empty($_GET['id'])){
	$id_module=$_GET['id'];
	// Connect and create the PDO object
	$conn = new PDO("mysql:host=$hostdb; dbname=$namedb", $userdb, $passdb);
	$conn->exec("SET CHARACTER SET utf8");      // Sets encoding UTF-8
	// Delete rows in "sites", according to the value of "category" column
	$sql = "SELECT MAX(comp_ordre) FROM competence WHERE comp_module =( SELECT comp_module FROM competence WHERE comp_id = '".$id_module."')";
	$result = $conn->query($sql);
	while($valeur = $result->fetch()) {
		$maximum=$valeur[0];
		echo $maximum;
	}
}

Merci modo !!! :)