Discussion :

[Invité]

up plz

Tu veux dire que depuis le 09/08/2013 :

• tu n'as rien essayé/testé ?!?
• tu n'as lu aucun tuto/cours/explication ?!

RIEN qui t'ait permis d'avancer, ne serait-ce qu'un peu ????

Sinon, quel est(sont) ta(tes) dernière(s) tentative(s) ?

[Bhaalrock]

Bonjour,

J'ai eu une semaine de vacance.
J'étais en camping sans internet, donc non je n'ai pas avancé.
J'ai repris depuis ce matin, et effectivement ça ne fonctionne toujours pas.

je continue différents tests, mais je n'arrive qu'à récupérer la variable de mon id_famille.
Les deux autres sont indéfinie, pourtant j'ai bien placé un onclick=goOutils(this.value) sur les 3 pages différentes pour récupérer les 3 variables.
Voila mon script, je le pense bon:

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
function goOutils(id_famille, id_matiere, id_tc_simple){ 
				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+"&id_matiere="+id_matiere+"&id_tc_simple"+id_tc_simple);
			}

l'id choisi est bien envoyée, mais elle est écrasée par le choix de l'id suivante.

Quand je fais ce test:

Code php :

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

1
2
3
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"]." !!!";

le chiffre de l'id choisi change à chaque clique au niveau de ma première ligne et les 2 suivantes sont undefined.

J'ai lu sur des forums qu'il faut envoyer les variables sous forme de tableau, mais je ne sais pas comment faire et je ne trouve pas de tutos ajax qui envoie plusieurs variables en une seule fonction.

[Invité]

J'ai eu une semaine de vacance.
J'étais en camping sans internet, donc non je n'ai pas avancé.

OK ! Donc, tu veux nous faire bosser pendant que tu te prélasses en vacances !
Tu as de l'ambition pour ton futur boulot : être "le big boss" !

Ton problème vient d'un mauvais choix : le choix de la méthode de Bovino, au lieu de la mienne.
Non pas que celle de Bovino soit mauvaise. Mais tu l'utilises mal !

Code :

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

function goOutils(id_famille, id_matiere, id_tc_simple){

Code :

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

...onclick="goOutils(this.value);"...

Tu ne vois pas le problème ?
La fonction demande 3 paramètres, et tu ne lui en fournis qu'un seul !

Tu devrais avoir les yeux reposés après ces vacances, non ?

Avec "ma" méthode :

Code :

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

1
2
3
4
5
6
7
8
9
10
function goOutils(){
	// 1/ Récupération des 3 valeurs
	var id_famille = document.getElementById('id_param1').value;
	var param2 = document.getElementById('id_param2').value;
	var param3 = document.getElementById('id_param3').value;
	// 2/ AJAX
	...
	xhr.send("id_famille="+id_famille+'&param2='+param2+'&param3='+param3);
	...
}

Et il suffit de :

Code :

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

...onclick="goOutils();"...

[Bhaalrock]

Ok, quand je test ta solution :

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
			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;
				// 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);
			}

la page ajaxOutils.php ne s'importe pas.

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
77
<?php
	echo "<p name='outils'>";
	echo "lid famille choisi est ".$_POST["id_famille"]." !!!<br/>"; // test id
	echo "lid matiere choisi est ".$_POST["id_matiere"]." !!!<br/>"; // test id
	echo "lid character choisi est ".$_POST["id_tc_simple"]." !!!";  // test id
	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
						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 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>";
?>

Je dois mal utiliser cette façon de faire également.
J'ai l'impression que la valeur de chaque variable écrase la précédente quand elle est cliquée.

Je place 3 onclick='goOutils()' différents sur 3 pages différentes, où ce trouve mes 3 valeurs, je ne dois peut être pas faire cela ?

Code php :

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

echo "<button onclick='goMateriaux(this.value); goCharacter(this.value); goOutils()' value='".$donnees["id_famille"]."'>".$donnees['diametre_outil']." </button>";

Code php :

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

echo "<button onclick='goOutils()' value='".$donnees["id_matiere"]."'><img src=".$donnees["repere_matiere"]." ".$donnees["info_matiere"]."<br/> ".$donnees["nom_matiere"]."</button>";

Code php :

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

echo "<button onclick='goOutils()' value='".$donnees["id_tc_simple"]."'>".$donnees["taille_caract_simple"]."</button>"

ps : effectivement, je comprends maintenant le problème de (this.value), qui n'envoie qu'un seul élément à la fonction.
J'ai les yeux pleins de sable maintenant

[Bhaalrock]

j'ai cette erreur dans la console chrome:
Uncaught TypeError: Cannot read property 'value' of null myjs.js:79
goOutils myjs.js:79

cette ligne 79 c'est :

Code javascript :

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

var id_famille = document.getElementById('id_famille').value;

[Invité]

Quelles 3 pages différentes ??

Et pourquoi 3 boutons <button> ?
Comment pourraient-ils être sur des pages différentes ?

Je ne suis même pas persuadé que tu saches bien toi-même ce-qui-fait-quoi/quand/comment/pourquoi.

Il faudrait que tu nous ré-expliques CLAIREMENT le déroulement des actions...
+ qu'on ai une vision globale.

Ce serait plus simple (?) avec une page en ligne.

[andry.aime]

Bonsoir,

Code :

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

xhr.send("id_famille="+id_famille+"&id_matiere="+id_matiere+"&id_tc_simple"+id_tc_simple);

Il te manque un "=" pour le dernier paramètre.
Peut-on voir ton code HTML généré de la page?

A+.

[Bhaalrock]

Bonjour,

Merci pour le = manquant.

Alors voila deux captures de ma page en pièce jointe. (en bas de post)
Quand je lance ma page, elle s'ouvre comme cela. (capture 4.jpg)
Je choisi un diamètre d'un outil (numéro 1). Quand le click est fait, cela m'ouvre le numéro 2 (capture5.jpg), je choisi ma matière. Quand le click est fait, cela ouvre le numero 3, choix de la hauteur de caractère.
Quand je click sur ce choix de hauteur de caractère, cela m'ouvre le dernier onglet (Your tool) qui doit récupérer les 3 variables choisies par l'utilisateur (numéro 1, 2 et 3). Cela me permet de placer ses 3 variables dans la requête de (Your tool = ajaxOutils.php) et permettre de trouver une référence d'outil précise.

Le choix numéro 2, numéro 3 et Your tool sont sur des pages différentes, appelés par la méthode Ajax.
Le choix numéro 1 influence ce qui sera affiché dans le choix numéro 2 et 3.

Ma page de script :

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(){ 
				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;
				// 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);
			}

Ma page principal : index.php (les différents onclick sont à la ligne 74)
Mon goOutils() n'est pas bien placé?

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
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
<!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>
 
		<div class="container-fluid" id="check">
			<div class="row-fluid">
				<div class="span6 offset3">
	<div class="accordion" id="accordion2">
  <div class="accordion-group">
    <div class="accordion-heading">
      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2">
        <img src="images/1.png" alt="choice1" class="choice1">Check your cutter diameter</img>
      </a>
    </div>
    <div id="collapseOne" class="accordion-body collapse in">
      <div class="accordion-inner">
 
		<!-- 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))
{
?> 
 
		<ul class="thumbnails">		
			<li class="span4">
			<div class="thumbnail"><img src="<?php echo $donnees['image_famille'];?>"><?php echo $donnees['famille_outil'];?><br/><br/>
			<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
<?php
				echo "<button onclick='goMateriaux(this.value); goCharacter(this.value); goOutils()' value='".$donnees["id_famille"]."'>".$donnees['diametre_outil']." </button>";
				$var = $donnees["id_famille"];
?>			
			</a>
			</div>
			</li>
 
<?php 
}
?>
		</ul>
      </div>
    </div>
  </div> 
 
  <div class="accordion-group">
    <div class="accordion-heading">
      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2">
        <img src="images/2.png" alt="choice2" class="choice2">Check your material</img>
      </a>
    </div>
    <div id="collapseTwo" class="accordion-body collapse">
      <div class="accordion-inner">
 
		<!-- Second choix : appel le contenu de la page ajaxMateriaux.php -->
 
<div name='materiaux' id='materiaux' style='display:inline'></div>		
 
      </div>
    </div>
  </div>
 
  <div class="accordion" id="accordion2">
  <div class="accordion-group">
    <div class="accordion-heading">
      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2">
        <img src="images/3.png" alt="choice3" class="choice3">Check your tools</img>
      </a>
    </div>
    <div id="collapseThree" class="accordion-body collapse">
      <div class="accordion-inner">
 
		<!-- Troisieme choix : appel le contenu de la page ajaxCharacter.php -->
 
<div name='character' id='character' style='display:inline'></div>	 
 
      </div>
    </div>
  </div>
</div>
</div>
</div>
</div>
</div>
 
	<!-- Résultat final : appel le contenu de la page ajaxOutils.php-->
 
	<div class="container-fluid">
			<div class="row-fluid">
				<div class="span6 offset3">
	<div class="accordion" id="accordion2">
  <div class="accordion-group">
    <div class="accordion-heading">
      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2">
        Your tool
      </a>
    </div>
    <div id="collapseResult" class="accordion-body collapse">
      <div class="accordion-inner">
 
<div class="span3 offset9" id="new_selection"><a class="btn btn-medium" href="<?php echo($_SERVER['PHP_SELF']); ?>">Make a new selection</a></div>	  
 
 
		</div>
    </div>
  </div>
</div>
</div>
</div>
</div>
 
<div name='outils' id='outils' style='display:inline'></div>	
	<footer>
 
	</footer>
 
</body>
</html>

Ma page ajaxMateriaux.php (choix 2), qui donnera plus ou moins de choix de matière selon le premier choix

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
<?php
	echo "<p name='materiaux'>";
	if(isset($_POST["id_famille"])){
	echo "lid choisi est ".$_SESSION["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>";
?>

Ma page ajaxCharacter.php (choix 3), qui me donnera des possibilités de choix différentes selon le premier choix.

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>";
?>

Ma page final : ajaxOutils.php = Your tool (c'est la que je bloque), qui doit me récupérer mes 3 variables. (qui sont donc sur des pages différentes).
Rien ne s'affiche et mes tests en début de page m'indique "undefined"

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
<?php
	echo "<p name='outils'>";
	echo "lid famille choisi est ".$_POST["id_famille"]." !!!<br/>"; // test
	echo "lid matiere choisi est ".$_POST["id_matiere"]." !!!<br/>"; // test
	echo "lid character choisi est ".$_POST["id_tc_simple"]." !!!";  // test
	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
						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 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>";
?>

Voilà tout mon code.
Mon dernier script est-il bon et mon onclick="goOutils()" est-il bien placé?
Je devrais rassembler mes 3 choix sur la même page?
Ça m'embête beaucoup de bloquer la dessus.
Merci

[andry.aime]

Uncaught TypeError: Cannot read property 'value' of null myjs.js:79
goOutils myjs.js:79

cette ligne 79 c'est :

Code javascript :

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

var id_famille = document.getElementById('id_famille').value;

C'est qu'il n'y a pas d'élément avec l'attribut id=id_famille dans la page index.php. Il en est de même pour

Code :

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

1
2
var id_matiere = document.getElementById('id_matiere').value;
				var id_tc_simple = document.getElementById('id_tc_simple').value;

.


A+.

[Bhaalrock]

Pourtant mon id_famille est bien envoyé dans les pages php de mes choix 2 et 3 et cela fonctionne.
Comment faire pour que cela fonctionne avec mes 3 variables id?

[andry.aime]

Ben, dans les deux fonctions tu les as passés en paramètre.

A+.

[Bhaalrock]

Et je ne peux pas le faire pour passer 3 variables?
Je dois avouer que je suis un peu largué.
J'ai essayé plein de configurations différentes.
C'est à quel endroit de mon script que je pêche?

[andry.aime]

Je parle de cette variable

Code :

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

function goMateriaux(id_famille)

pas celui de xhr.send("...");

[Bhaalrock]

Oui cette partie fonctionne.
Mais cela ne fonctionne pas si j'essaye de faire passer plusieurs variables

Code javascript :

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

1
2
3
4
5
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;

OU

Code javascript :

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

1
2
function goOutils(id_famille, id_matiere, id_tc_simple){ 
				var xhr = getXhr();

ne fonctionnent pas.
Je dois donc avoir un problème sur mes variables, mais je ne sais pas comment les récupérer correctement avec la méthode Ajax, avec le fait qu'elles sont chacune sur une page différente.

[andry.aime]

Code :

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

1
2
3
function goOutils(id_famille, id_matiere, id_tc_simple){ 
				var xhr = getXhr();
				xhr.onreadystatechange = function(){

Sinon, je te conseille de revoir les bases de javascript.

A+.

[Bhaalrock]

Tu me conseil cette façon la alors ?
En fait, je suis en stage, j'ai peu de temps devant moi et ça fait des heures et des heures que je planche la dessus sans succès
Tous mes essais ne fonctionnent pas et c'est le dernier problème que je rencontre (après je n'ai plus que de la mise en forme à faire).

Je veux juste parvenir à faire passer mes 3 variables, si une autre idée sur la façon de faire vient à quelqu'un, je suis preneur.
L'ajax me rend fou

[andry.aime]

Avec le temps que tu as passé sur cette discussion, si tu avais lu un tutoriel Javascript et Ajax, tu aurais bien compris les conseils et tu aurais pu résoudre seul.

A+.

[Invité]

..., j'ai peu de temps devant moi et ça fait des heures et des heures que je planche la dessus sans succès...

Je dis : "LOL". Et je andry.aime.

..., si une autre idée sur la façon de faire vient à quelqu'un, je suis preneur.

Et : "re-LOL".

[Bhaalrock]

J'en ai lu beaucoup.
Je me suis fait bcp de tuto Ajax, mais tous ses tutos sont basés sur le même shéma!
C'est que sous forme de formulaire en listes liées et il ne montre que pour une seule variable.
Ou sous la forme de celui-ci : http://creer-un-site.fr/tp-ajax-ecri...-texte-292.php
qui utilise la méthode ajax pour un login et un pass.
Mais rien dans mon cas, et je n'arrive pas à les réadapter correctement.
Bon je vais relire ce que j'ai déjà lu et d'autres trucs j'aurais peu être un declick avant la fin de semaine, sinon stage raté.

Merci de votre aide et d'avoir essayé de m'aider

[Invité]

Tes <button...> n'ont ni name, ni id.
Comment veux-tu les identifier...