[AJAX] Plusieurs variables sql dans une fonction Ajax

**Bhaalrock** · 08/08/2013, 15h20

Bonjour,

Je m'explique, j'aimerais introduire plusieurs variables sql dans une fonction Ajax.
J'ai ce script avec un id_famille

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
function goOutils(id_famille){
	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){
			leselect = xhr.responseText;
			// On se sert de innerHTML pour rajouter les options a la liste
			document.getElementById('outils').innerHTML = leselect;
		}
	}
	// Ici on va voir comment faire du post
	xhr.open("POST","ajaxOutils.php",true);
	// ne pas oublier ça pour le post
	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
	// Envoyer
	xhr.send("id_famille="+id_famille);
}

J'aimerais qu'il y ai également deux autres id qui viennent d'autres requêtes (id_matiere et id_tc_simple) pour avoir un appel de base de données du genre :

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
if(isset($_POST["id_famille"]) && isset($_POST['id_matiere']) && isset($_POST['id_tc_simple'])){
 
// Requête finale (devant comporter les trois variables sélectionnées précédemment) 
$reponse = mysql_query("SELECT outils.*, famille_outils.image_famille
	FROM outils, famille_outils, materiaux, jointure_materiaux, jointure_caracteres, taille_caracteres_simple, taille_caracteres_multi
	WHERE famille_outils.diametre_outil = outils.diametre_outil
	AND famille_outils.famille_outil = outils.famille_outil
	AND outils.id_outil = jointure_materiaux.id_outil 
	AND materiaux.id_matiere = jointure_materiaux.id_matiere
	AND outils.id_outil = jointure_caracteres.id_outil
	AND taille_caracteres_simple.id_tc_simple = jointure_caracteres.id_tc_simple
	AND taille_caracteres_multi.id_tc_multi = jointure_caracteres.id_tc_multi
	AND famille_outils.id_famille = ".$_POST["id_famille"]."
	AND materiaux.id_matiere = ".$_POST["id_matiere"]."
	AND taille_caracteres_simple.id_tc_simple = ".$_POST["id_tc_simple"]."
");						
 
// On affiche chaque resultats
while($donnees = mysql_fetch_assoc($reponse))
{

Comment faire pour mettre les 3 id dans la fonction Ajax?
Où placer le

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

onclick='goOutils(this.value)'

?

Merci de votre aide

**Bovino** · 08/08/2013, 15h26

Question assez compliquée... Mettre trois paramètres dans l'appel d'une fonction puis dans des paramètres d'URL, ça va chercher loin...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
function goOutils(id_famille, param2, param3){
...
xhr.send("id_famille="+id_famille+'&param2='+param2+'&param3='+param3);
}

**Bhaalrock** · 08/08/2013, 15h51

Bonjour,
Merci pour la réponse.

J'ai déjà essayé ça et ça ne fonctionne pas.
Donc tu me certifie cette façon de faire alors le problème vient d’ailleurs.

Peut être le onclick='goOutils(this.value)'
Je dois le placer sur la dernière de mes 3 requêtes qui donne ma requête finale?
Où c'est ma requête php qui ne s'écrit pas comme ça?

Partant du principe que mon "param2" et mon "param3" sont appelés par deux autres fonctions Ajax dépendants de mon "param1". (Au même titre que des listes liées)

**Bovino** · 08/08/2013, 16h16

Euh... j'ai un peu peur de comprendre là...
Tu veux que trois requêtes différentes pointent vers un même script qui saura récupérer et traiter les trois valeurs ?
Si c'est ça, ne cherche pas plus loin : c'est impossible !

**Bhaalrock** · 08/08/2013, 16h28

Arf, comment faire différemment alors?

En gros mon "param1" modifie ce que mon "param2" et mon "param3" me propose.

Ensuite quand mes 3 paramètres sont choisis, j'ai une requête qui doit prendre en compte ses 3 paramètres pour me donner un résultat précis.

param1 + param2 + param3 = dernière requête qui donne une réponse précise.
Je pensais pouvoir le faire avec une fonction Ajax, comme je l'ai fait avec les autres paramètres.

Une idée pour une autre solution?
3 fonctions Ajax différentes qui pointent vers la même page.php?

Voici comme je l'imaginais :

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

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
<?php
	echo "<p name='outils'>";
	if(isset($_POST["id_famille"]) && isset($_POST['id_matiere']) && isset($_POST['id_tc_simple'])){
 
	// Déclaration des paramètres de connexion
$host = "localhost";
$user = "root";
$bdd = "projet";
$passwd = "";
 
 // On se connecte à MySQL
			mysql_connect($host, $user, $passwd) or die ("erreur de connexion au serveur");
			mysql_select_db($bdd) or die ("erreur de connexion à la base de données");
 
// Requête finale (devant comporter les trois variables sélectionnées précédemment) 
$reponse = mysql_query("SELECT outils.*
			FROM outils, famille_outils, materiaux, jointure_materiaux, jointure_caracteres, taille_caracteres_simple, taille_caracteres_multi
			WHERE famille_outils.diametre_outil = outils.diametre_outil
			AND famille_outils.famille_outil = outils.famille_outil
			AND outils.id_outil = jointure_materiaux.id_outil 
			AND materiaux.id_matiere = jointure_materiaux.id_matiere
			AND outils.id_outil = jointure_caracteres.id_outil
			AND taille_caracteres_simple.id_tc_simple = jointure_caracteres.id_tc_simple
			AND taille_caracteres_multi.id_tc_multi = jointure_caracteres.id_tc_multi
			AND famille_outils.id_famille = ".$_POST["id_famille"]."
			AND materiaux.id_matiere = ".$_POST["id_matiere"]."
			AND taille_caracteres_simple.id_tc_simple = ".$_POST["id_tc_simple"]."
			");						
 
// On affiche chaque resultats
		while($donnees = mysql_fetch_assoc($reponse))
		{
?>
 
Référence de l'outil trouvé : <?php echo $donnees['reference_outil']; ?><br/>
Sa forme est : <?php echo $donnees['forme_outil']; ?><br/>
Etc....
 
<?php 
		}
	}
	echo "</p>";
?>

Invité · 08/08/2013, 18h50

Bonjour,
en fait, c'est possible.
Encore faut-il que tu nous montres autre chose que des bouts de code éparpillés.

Une vision globale serait bienvenue.

Principe :

Code js :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
function goOutils(){
	var id_famille = document.getElementById('id_param1').value;
	var param2 = document.getElementById('id_param2').value;
	var param3 = document.getElementById('id_param3').value;
	...
	xhr.send("id_famille="+id_famille+'&param2='+param2+'&param3='+param3);
	...
}

Et sur <input> :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<input type="..." name="..." id="id_param1" onchange="goOutils();" />

ou <select> :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<select name="..." id="id_param1" onchange="goOutils();" />

N.B. onchange semble plus approprié que onclick.

**Bhaalrock** · 09/08/2013, 09h55

Bonjour,
et merci pour la réponse.
J'utilise le onclick car mes variables se sélectionnent sous forme de bouton et non pas en liste liées. Je n'ai donc pas de balises <select>, <option> ou <input> mais des balises <button>.
Si je crois avoir bien compris le onchange n'est que pour les formulaire.
J'ai testé ta méthode, mais cela ne fonctionne pas.
Et en fait je m'inspire des tuto de Ajax en liste liées, comme celui fait sur ce site : http://siddh.developpez.com/articles/ajax/#LIV-A
Et je le réadapte avec des <button>.
Je ne sais pas sur quel <button> mettre mon onclick.
Mon ultime problème est de le faire avec 3 variables choisies précédemment.

Voici tout mon code épuré de ma mise en page.

myjs.js

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
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 au choix 1 (modifie le contenu du choix 2)
			*/
			function goMateriaux(id_famille){
				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){
						leselect = xhr.responseText;
						// On se sert de innerHTML pour rajouter les options a la liste
						document.getElementById('materiaux').innerHTML = leselect;
					}
				}
 
				// Ici on va voir comment faire du post
				xhr.open("POST","ajaxMateriaux.php",true);
				// ne pas oublier ça pour le post
				xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
				// Envoyer
				xhr.send("id_famille="+id_famille);
			}
 
 
 
			/**
			* Méthode qui sera appelée sur le click du bouton au choix 1 (Modifie le contenu du choix 3)
			*/
			function goCharacter(id_famille){
				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){
						leselect = xhr.responseText;
						// On se sert de innerHTML pour rajouter les options a la liste
						document.getElementById('character').innerHTML = leselect;
					}
				}
 
				// Ici on va voir comment faire du post
				xhr.open("POST","ajaxCharacter.php",true);
				// ne pas oublier ça pour le post
				xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
				// Envoyer
				xhr.send("id_famille="+id_famille);
			}
 
 
			/**
			* Méthode qui sera appelée sur le click du bouton au choix ??? (Requête finale)
			*/
			function goOutils(id_famille, id_matiere, id_tc_simple){  /** Methode de Bovino */
				var xhr = getXhr();
				var id_famille = document.getElementById('id_famille').value;  /** Methode de jreux62 */
				var id_matiere = document.getElementById('id_matiere').value;
				var id_tc_simple = document.getElementById('id_tc_simple').value;  /** J'en utiliste bien sur q'une des deux */
				// 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){
						leselect = xhr.responseText;
						// On se sert de innerHTML pour rajouter les options a la liste
						document.getElementById('outils').innerHTML = leselect;
					}
				}
 
				// Ici on va voir comment faire du post
				xhr.open("POST","ajaxOutils.php",true);
				// ne pas oublier ça pour le post
				xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
				// Envoyer
				xhr.send("id_famille="+id_famille+"&id_matiere="+id_matiere+"&id_tc_simple"+id_tc_simple);
			}

Index.php

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
<!DOCTYPE html>
 
<html>
<head>
	<title>Cutters rules</title>
	<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1" />	
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css">
	<link href="css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css">
	<link href="css/cutters_rules_css.css" rel="stylesheet" type="text/css">
	<link href="css/cutters_rules_print.css" media="print" rel="stylesheet" type="text/css">
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js" type="text/javascript"></script>
	<script src="js/jquery.js" type="text/javascript"></script>
	<script src="js/myjs.js" type="text/javascript"></script>
	<script src="js/bootstrap.min.js" type="text/javascript"></script>
 
</head>
<body>
 
	<header>
		<div class="container-fluid">
			<div class="row-fluid">
				<div class="span6 offset3"><img src="images/header2.png" alt="header" id="header"/></div>
			</div>
		</div>
	</header>
 
		<!-- Il y a 3 choix à prendre pour l'utilisateur, il n'a accès au choix suivant uniquement quand il à répondu au choix précédent -->
 
		<!-- Premier choix -->
 
<?php
// Déclaration des paramètres de connexion
 
$host = "localhost";
$user = "root";
$bdd = "projet";
$passwd = "";
 
 // On se connecte à MySQL
			mysql_connect($host, $user, $passwd) or die ("erreur de connexion au serveur");
			mysql_select_db($bdd) or die ("erreur de connexion à la base de données");
 
	 // On récupère tout le contenu de la table famille_outils
$req = mysql_query("SELECT DISTINCT *
		FROM famille_outils
		");
 
					// Je recupère toutes les colonnes de la table famille_outils
 
// On affiche chaque entrée une à une (boucle while)
while($donnees = mysql_fetch_assoc($req))
{
 
echo "<button onclick='goMateriaux(this.value);goCharacter(this.value);goOutils(this.value)' value='".$donnees["id_famille"]."'>".$donnees['diametre_outil']." </button>";
 
}
?>
 
		<!-- Second choix : ajaxMateriaux.php -->
 
<div name='materiaux' id='materiaux' style='display:inline'></div>
 
 
		<!-- Troisieme choix : ajaxCharacter.php -->
 
<div name='character' id='character' style='display:inline'></div>	
 
 
		<!-- Résultat final : ajaxOutils.php -->
 
<div name='outils' id='outils' style='display:inline'></div>	
 
 
</body>
</html>

ajaxMateriaux.php

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

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
<?php
	echo "<p name='materiaux'>";
	if(isset($_POST["id_famille"])){
	// Déclaration des paramètres de connexion
 
$host = "localhost";
$user = "root";
$bdd = "projet";
$passwd = "";
 
 // On se connecte à MySQL
			mysql_connect($host, $user, $passwd) or die ("erreur de connexion au serveur");
			mysql_select_db($bdd) or die ("erreur de connexion à la base de données");
 
	 // On récupère tout le contenu de la table materiaux
$req = mysql_query("SELECT materiaux.*
		FROM materiaux, famille_outils, jointure_famille_materiaux
		WHERE materiaux.id_matiere = jointure_famille_materiaux.id_matiere
		AND famille_outils.id_famille = jointure_famille_materiaux.id_famille
		AND famille_outils.id_famille = ".$_POST["id_famille"]." ");
 
		while($donnees = mysql_fetch_assoc($req))
		{
?> 
 
			<li class="span3">
			<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseThree">
				<?php
				echo "<button value='".$donnees["id_matiere"]."'><img src=".$donnees["repere_matiere"]." ".$donnees["info_matiere"]."<br/> ".$donnees["nom_matiere"]."</button>";
				?>
			</a>
			</li>
 
<?php 
		}
	}
	echo "</p>";
?>

ajaxCharacter.php

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
 <?php
	echo "<p name='character'>";
	if(isset($_POST["id_famille"]))
	{
	if($_POST["id_famille"] <= 4)   // Condition (si l'id famille choisi est inférieur ou égal à 4, alors)
	{
?>
		<h5>Character simple-line</h5>
<?php
	// Déclaration des paramètres de connexion
$host = "localhost";
$user = "root";
$bdd = "projet";
$passwd = "";
 
 // On se connecte à MySQL
			mysql_connect($host, $user, $passwd) or die ("erreur de connexion au serveur");
			mysql_select_db($bdd) or die ("erreur de connexion à la base de données"); 
 
	 // On récupère tout le contenu de la table taille_caracteres_simple
$req = mysql_query("SELECT *
		FROM taille_caracteres_simple
		WHERE taille_caract_simple
		");
 
					// Je recupère toutes les tailles de caractères simple
 
// On affiche chaque entrée une à une (boucle while)
 
		while($donnees = mysql_fetch_assoc($req))
		{
?> 
		<ul class="thumbnails">		
			<li class="span3">
			<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseResult">
				<div class="thumbnail">
				<?php
				echo "<button value='".$donnees["id_tc_simple"]."'>".$donnees["taille_caract_simple"]."</button>";
				?>
				</div>
			</a>
			</li>
 
<?php 
		} // Fermeture du while
?> 
		</ul>
 
 
		<h5>Character multi-line</h5>
<?php  
	 // On récupère tout le contenu de la table taille_caracteres_multi
$req = mysql_query("SELECT *
			FROM taille_caracteres_multi
			WHERE taille_caract_multi
			");
 
						// Je recupère toutes les tailles de caractères multi
 
// On affiche chaque entrée une à une (boucle while)
 
		while($donnees = mysql_fetch_assoc($req))
		{
?> 
		<ul class="thumbnails">		
			<li class="span3">
			<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseResult">
				<div class="thumbnail"><?php echo $donnees['taille_caract_multi'];?></div>
			</a>
			</li>
 
<?php 
		} // Fermeture du while
?>
 
		</ul>
<?php		
	}  // Fermeture de if($_POST["id_famille <= 4"]) 
 
	else // Condition (sinon id >= 5)
	{
?>		
		<h5>Lips</h5>
<?php  
// Déclaration des paramètres de connexion
$host = "localhost";
$user = "root";
$bdd = "projet";
$passwd = "";
 
 // On se connecte à MySQL
			mysql_connect($host, $user, $passwd) or die ("erreur de connexion au serveur");
			mysql_select_db($bdd) or die ("erreur de connexion à la base de données"); 
	 // On récupère tout le contenu de la table taille_caracteres_multi
$req = mysql_query("SELECT DISTINCT nb_levres
			FROM outils
			WHERE nb_levres
			");
 
						// Je recupère tous les types de nb_levres de la table outils
 
// On affiche chaque entrée une à une (boucle while)
 
		while($donnees = mysql_fetch_assoc($req))
		{
?> 
		<ul class="thumbnails">		
			<li class="span3">
			<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseResult">
				<div class="thumbnail"><?php echo $donnees['nb_levres'];?></div>
			</a>
			</li>	
<?php 
		} // Fermeture du while
	}  // Fermeture de else
} // Fermeture de if(isset($_POST["id_famille"]))
	echo "</p>";
?>

Et le dernier qui ne fonctionne pas (rappel j'ai placé le onclick="ajaxOutils" sur la première requête). J'ai testé de la placer à différents endroits, mais rien ne s'affiche.

ajaxOutils.php

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
<?php
	echo "<p name='outils'>";
	if(isset($_POST["id_famille"]) && isset($_POST['id_matiere']) && isset($_POST['id_tc_simple'])){
 
	// Déclaration des paramètres de connexion
$host = "localhost";
$user = "root";
$bdd = "projet";
$passwd = "";
 
 // On se connecte à MySQL
			mysql_connect($host, $user, $passwd) or die ("erreur de connexion au serveur");
			mysql_select_db($bdd) or die ("erreur de connexion à la base de données");
 
// Requête finale (devant comporter les trois variables sélectionnées précédemment) 
$reponse = mysql_query("SELECT outils.*, famille_outils.image_famille
			FROM outils, famille_outils, materiaux, jointure_materiaux, jointure_caracteres, taille_caracteres_simple, taille_caracteres_multi
			WHERE famille_outils.diametre_outil = outils.diametre_outil
			AND famille_outils.famille_outil = outils.famille_outil
			AND outils.id_outil = jointure_materiaux.id_outil 
			AND materiaux.id_matiere = jointure_materiaux.id_matiere
			AND outils.id_outil = jointure_caracteres.id_outil
			AND taille_caracteres_simple.id_tc_simple = jointure_caracteres.id_tc_simple
			AND taille_caracteres_multi.id_tc_multi = jointure_caracteres.id_tc_multi
			AND famille_outils.id_famille = ".$_POST["id_famille"]."
			AND materiaux.id_matiere = ".$_POST["id_matiere"]."
			AND taille_caracteres_simple.id_tc_simple = ".$_POST["id_tc_simple"]."
			");						
 
// On affiche chaque resultats
		while($donnees = mysql_fetch_assoc($reponse))
		{
?>
 
 
 
 
				<!-- Voici le résultat présenté sous forme de descriptif de la référence d el'outil trouvé -->
		<div id="result">		
			<div class="row-fluid" id="results">
				<div class="span12"><p class="titre">Results: </p>
				<div class="span11" id="tool_result">
				<div class="span2">
				<img src="<?php echo $donnees['image_famille'];?>"></img>
				</div>
				<div class="span2">
				<h5><?php echo $donnees['famille_outil']; ?></h5> <br/>
				<p>Référence: <br/>
				<?php echo $donnees['reference_outil']; ?></p>
				</div>
				<div class="span4">
				<p>
				La famille de cet outil est : <?php echo $donnees['famille_outil']; ?> <br/>
				Caractéristiques : <br/>
				Diamètre: <?php echo $donnees['diametre_outil']; ?> <br/>
				Forme: <?php echo $donnees['forme_outil']; ?> <br/>
				Matière: <?php echo $donnees['matiere_outil']; ?> <br/>
				Taille troncature: <?php echo $donnees['taille_troncature_outil']; ?>
				</p></em>
				</div>
				<div class="span4">
				<p>
				Il est utilisé pour les caractères simple line de <?php echo $donnees['taille_caract_simple']; ?><br />
				et en caractères multi line de <?php echo $donnees['taille_caract_multi']; ?><br /></em>
 
				</p>
				</div>
				</div>
				</div>
			</div>
		</div>
<?php 
		}
	}
	echo "</p>";
?>

Invité · 09/08/2013, 10h18

Bricoler du code n'a pas d'intérêt si tu ne maitrises pas la METHODOLOGIE.

"Il faut savoir d'où on part et où on va pour savoir quel chemin emprunter."

- quel est l'objectif ?
- de quoi j'ai besoin ?
- comment les utiliser/récupérer/transmettre ?
- dans quel ordre (CHRONOLOGIE DES EVENEMENTS) ?
- avec quels moyens ?
- ...

Prends une feuille de papier (je sais, ça semble archaïque !), et écrit la METHODOLOGIE.

**Bhaalrock** · 09/08/2013, 10h34

Ok, je l'ai fait. (en essayant d'être le plus juste possible)

- Je veux transmettre les 3 choix de l'utilisateur de index.php, ajaxMateriaux.php et ajaxCharacter.php à la requête de ajaxOutils.php.

-J'ai besoin des variables sélectionnées par l'utilisateur pour les transmettre à ma requête de la page ajaxOutils.php

-Pour les utiliser/ les récupérer/ les transmettre, j'utilise du script Ajax.

-Pour la chronologie:
Je transmet d'abord la variable index.php, puis celle de ajaxMateriaux.php, puis celle de ajaxCharacter.php, qui devront me permettre de faire fonctionner ma dernière requête.

Je me rends compte avec tout ça que je peux laisser ma requête finale dans la page index.php, mais je ne sais pas si ça change grand chose à mon problème.

**Bhaalrock** · 09/08/2013, 11h16

Je pense que mon problème est de trouver comment récupérer les 3 valeurs.
Qu'elles soit toutes les 3 dans le balise du onclick='goOutils(this.value)'

Et là je ne vois pas comment faire, je continue de chercher.
Si quelqu'un à une idée de comment procédé.

ça ne doit pas être sorcier.

Invité · 09/08/2013, 11h24

C'est un peu "léger"...

Voilà un extrait de chronologie/méthodologie :
1/ affichage de 3 boutons pour sélectionner les choix (comment ? -> <button...>)
2/ click sur bouton1 -> récupération de param1 (comment ? -> via Ajax)
3/ retour Ajax param1 -> changement des choix dans bouton2 et bouton3 (?) (à toi de savoir comment)
4/ click sur bouton2 -> récupération de param2 (comment ? -> via Ajax)
5/ click sur bouton3 -> récupération de param3 (comment ? -> via Ajax)
...

**Bhaalrock** · 09/08/2013, 12h03

Oui effectivement, il y a plus de détail dans ta façon de faire.
Tout cela je pense l'avoir compris,
avec un

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<button onclick='kkchose(this.value)' value='".$donnees["id_truc"]."'></button>

Je récupère l'id_truc, et la transmet par le script Ajax (function kkchose(id_truc) qui m’envoie la variable choisie par l'utilisateur (avec le valeur.send) à la page trucmuche.php. (configuré dans le script)

Du coup, vérification si il y a une variable id_truc de transmise à la page trucmuche.php avec un

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

if(isset($_POST["id_truc"]))

Si oui, on affiche le contenu de la page trucmuche.php et on peut mettre notre $_POST dans la requête sql.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

WHERE id_truc = ".$_POST["id_truc"]."

J'ai tout bon jusque là?

Ce que je ne trouve pas c'est comment faire la même chose avec plusieurs variables venant de 3 pages php différentes. (ses pages sont à ce moment toutes chargées dans les div de la page index.php grâce à Ajax)

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

if(isset($_POST['id_truc']) && isset($_POST['id_machin']) && isset($_POST['id_bidule']))

et les mettre dans ma requête :

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
WHERE id_truc = ".$_POST["id_truc"]."
AND id_machin = ".$_POST["id_machin"]."
AND id_bidule = ".$_POST["id_bidule"]."

Invité · 09/08/2013, 12h38

Ca se fait via JavaScript/Ajax.

Tu as 3 fonctions recup1(), recup2(), recup3().
Chacune récupère un paramètre paramX, et affiche une réponse Ajax dans un div.

Mais on peut aussi lancer une autre fonction :

Code js :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
function recup1(){
  // récup param
  // Ajax
    if(Reponse){
       // 1/ Affichage de la réponse dans un div
       document.......InneHtml = .....;
       // 2/ on lance la fonction
       goOutils();
    }
}

Code js :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
function goOutils(){
	on récupère les valeurs des boutons :
	var param1 = document.getElementById('id_param1').value;
	var param2 = document.getElementById('id_param2').value;
	var param3 = document.getElementById('id_param3').value;
	// TEST : si les 3 params sont remplis -> Ajax
	...
	xhr.send("param1="+param1+'&param2='+param2+'&param3='+param3);
	...
}

**Bhaalrock** · 09/08/2013, 13h03

J'ai pourtant testé ta seconde méthode et celle là :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
function goOutils(id_famille, id_matiere, id_tc_simple){ 
...
xhr.send("id_famille="+id_famille+"&id_matiere="+id_matiere+"&id_tc_simple"+id_tc_simple);

Mais rien ne fonctionne, ça vient peut être de mon onclick que j'ai mal placé...
J'utilise un onclick='goOutils(this.value)', mais du coup il ne va récupérer que la valeur du bouton auquel je l'ai associé :/
je devrais créer une div avec toutes les valeurs? du genre :

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<?php
"<div onclick='goOutils(this.value)' value='".$donnees["id_famille"]."'; '".$donnees["id_matiere"]."'; '".$donnees["id_tc_simple"]."'></div>";
?>

Comme j'ai 3 bouton différents, comment placer ce onclick?

Invité · 09/08/2013, 13h18

Envoyé par Bhaalrock

..., comment placer ce onclick?

En comprenant ce que tu fais et comment ça fonctionne...
Ca t'éviterait de tout mélanger.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
			function goOutils(id_famille, id_matiere, id_tc_simple){  /** Methode de Bovino */
				var xhr = getXhr();
				var id_famille = document.getElementById('id_famille').value;  /** Methode de jreux62 */
				var id_matiere = document.getElementById('id_matiere').value;
				var id_tc_simple = document.getElementById('id_tc_simple').value;  /** J'en utiliste bien sur q'une des deux */

Si tu passes tout ce qu'on te dit au mixer, tu ne récolteras que de la bouillie.

**Bhaalrock** · 09/08/2013, 13h36

oui, merci
C'était pour l'exemple, j'ai essayé les 2 methodes, mais je ne les ai pas associé évidement. j'ai tester comme ça :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
function goOutils(){ 
var xhr = getXhr();
var id_famille = document.getElementById('id_famille').value;
var id_matiere = document.getElementById('id_matiere').value;
var id_tc_simple = document.getElementById('id_tc_simple').value; 
...
xhr.send("id_famille="+id_famille+"&id_matiere="+id_matiere+"&id_tc_simple"+id_tc_simple);

et aussi comme ça :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
function goOutils(id_famille, id_matiere, id_tc_simple){ 
var xhr = getXhr();
...
xhr.send("id_famille="+id_famille+"&id_matiere="+id_matiere+"&id_tc_simple"+id_tc_simple);

Je n'ai pas mélangé.
Mais aucune des 2 ne fonctionnent.
ou bien les 2 fonctionnent, mais mon appel de fonction n'est pas correctement placé.

Invité · 09/08/2013, 14h14

Tiens-en toi à UNE seule méthode !
Et vas jusqu'au bout du raisonnement !

**Bhaalrock** · 09/08/2013, 14h19

Ok, tu as raison.
Je vais continuer avec la méthode de Bovino, (que tu m'as toi même donnée dans une autre post) qui ne m'a pas posé d'erreurs avec une seule variable.
Donc en thérorie avec 50 variables ça devrait marcher aussi.
Je pense que c'est juste la récupération de ses variables qui me pose un souci.
Je vais devoir récupérer toute les value en même temps...

**Bhaalrock** · 09/08/2013, 14h55

Je ne vois pas comment récupérer 3 variables de 3 pages différentes pour les assigner au onclick :/
Je ne fais du php que depuis peu
help plz

Edit :Ahhhh !
J'ai fait un test en plaçant en debut de ma page ajaxOutils.php

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
<?php
	echo "<p name='outils'>";
	echo "lid famille choisi est ".$_POST["id_famille"]." !!!<br/>";
	echo "lid matiere choisi est ".$_POST["id_matiere"]." !!!<br/>";
	echo "lid character choisi est ".$_POST["id_tc_simple"]." !!!";
if(isset($_POST['id_famille']) && isset($_POST['id_matiere']) && isset($_POST['id_tc_simple']))

Comme ça même si rien ne s'affiche après les if(isset) comme les conditions ne sont pas remplient, j'aurais au moins ça.

Il me trouve l'id famille choisie par contre les 2 autres sont "Undefined"

J'ai testé de déplacé mon onclick dans le button qui contient la

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

value='".$donnees["id_tc_simple"]."'

Et il me retourne toujours une valeur sur mon echo ".$_POST["id_famille"]." mais c'est la valeur de l'id_tc_simple qui s'y affiche!
Je ne comprends pas trop pourquoi.

Si quelqu'un à éventuellement une autre méthode que Ajax pour cette requête, je suis preneur. (Je suis pris par le temps)

**Bhaalrock** · 09/08/2013, 16h22

Je reviens à ce que tu m'as écris plus haut

Envoyé par jreaux62

Ca se fait via JavaScript/Ajax.

Tu as 3 fonctions recup1(), recup2(), recup3().
Chacune récupère un paramètre paramX, et affiche une réponse Ajax dans un div.

Mais on peut aussi lancer une autre fonction :

Code js :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
function recup1(){
  // récup param
  // Ajax
    if(Reponse){
       // 1/ Affichage de la réponse dans un div
       document.......InneHtml = .....;
       // 2/ on lance la fonction
       goOutils();
    }
}

Code js :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
function goOutils(){
	on récupère les valeurs des boutons :
	var param1 = document.getElementById('id_param1').value;
	var param2 = document.getElementById('id_param2').value;
	var param3 = document.getElementById('id_param3').value;
	// TEST : si les 3 params sont remplis -> Ajax
	...
	xhr.send("param1="+param1+'&param2='+param2+'&param3='+param3);
	...
}

Si je comprends bien je dois faire 1 function par élément que je veux récupérer avec l'adresse de sa page ?
et ses 3 fonctions, je dois les faire converger vers ma fonction goOutils?

Tu pourrais me faire un exemple concret de cette méthode stp?

[AJAX] Plusieurs variables sql dans une fonction Ajax

AJAX

Discussions similaires

Partager

Partager