[AJAX] tableau avec plusieurs xhr
Bonjour à tous,
Je souhaite afficher des valeurs dans un tableau après que l'utilisateur ai sélectionné ses choix.
L'utilisateur dispose de 16 select. Auriez vous des exemples à disposition car je n'en trouve pas sur internet. j'ai tenté ceci mais ça ne marche pas :
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
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
| for($i=0;$i<5;$i++)
{
// On affiche le parametre mesuré
echo' <th>'."\n";
$txtRequete4=' SELECT DISTINCT nomParametre
FROM bain,parametre
WHERE bain.cleSubstanceFAJ="'.$_POST['idMetal'].'"
AND bain.idBain=parametre.cleBain
ORDER BY nomParametre';
$requete4=mysql_query($txtRequete4);
echo' <select name="param['.$i.']" id="param'.$i.'" onchange="change3('.$i.');">'."\n";
echo' <option>Nom param</option>'."\n";
echo' <option value="Pompe">Pompe</option>'."\n";
echo' <option value="Ecart volume">Ecart volume</option>'."\n";
while($tableau4=mysql_fetch_assoc($requete4))
{
echo' <option value="'.$tableau4['nomParametre'].'">'.$tableau4['nomParametre'].'</option>'."\n";
}
echo' </select>'."\n";
echo' </th>'."\n";
}
echo' </tr>'."\n";
echo' <tr>'."\n";
for($i=0;$i<5;$i++)
{
// On affiche l'unité du parametre mesuré
echo' <th id="unite'.$i.'">';
if(!empty($_POST['idParam'.$i.'\'']))
{
echo 'Bonjour';
/*echo $_POST['idParam'.$i];
// Si on a choisit un paramètre, on affiche l'unité
$txtRequete30='SELECT DISTINCT nomUnite FROM unite,parametre WHERE parametre.nomParametre="'.$_POST['idParam'.$i].'" AND parametre.cleUnite=unite.idUnite ';
$requete30=mysql_query($txtRequete30);
$tableau30=mysql_fetch_assoc($requete30);
echo $tableau30['nomUnite'];
echo $txtRequete30.'<br />';*/
}
else
{
echo 'Unité'; // Sinon on affiche par défaut 'Unité'
}
echo' </th>'."\n";
}
echo' </tr>'."\n";
echo' </thead>'."\n";
// Corps de faj2
$txtRequete5='SELECT * from bain WHERE cleSubstanceFAJ="'.$_POST['idMetal'].'"';
$requete5=mysql_query($txtRequete5);
echo' <tbody bgcolor="'.$tableau20['couleurFAJ'].'">'."\n";
while($tableau5=mysql_fetch_assoc($requete5))
{
echo' <tr>'."\n";
echo' <td class="col1">'.$tableau5['referenceBain'].'</td>'."\n";
// On récupère la valeur du compteur ampère du bain ainsi que l'unité
$txtRequete6='SELECT * FROM compteurbain WHERE cleBain="'.$tableau5['idBain'].'"';
$requete6=mysql_query($txtRequete6);
$tableau6=mysql_fetch_assoc($requete6);
echo' <td class="col2">'.$tableau6['valeurRAZ'].'<br />'.$tableau6['uniteCompteurBain'].'</td>'."\n";
echo' <td class="col3"></td>'."\n";
echo' <td class="col4">RAZ<br /><input type="checkbox" name="cochee" /></td>'."\n";
for($i=0;$i<5;$i++)
{
echo' <td class="coli">Mesuré <input type="checkbox" name="mesuree['.$i.']" checked="checked" value="1" /></td>'."\n";
}
echo' </tr>'."\n";
}
echo' </tbody>'."\n";
echo' </table>'."\n";
echo' <br />'."\n";
////////////////////////////////////////////////////////////////////////////////
// Entête du tableau faj22
echo' <table class="tblFAJ">'."\n";
echo' <thead bgcolor="'.$tableau20['couleurFAJ'].'">'."\n";
echo' <tr>'."\n";
echo' <th class="col1" rowspan="2">Référence Bain</th>'."\n";
// sur 6 colonnes, faire :
for($i=5;$i<11;$i++)
{
// On affiche le parametre mesuré
echo' <th>'."\n";
$txtRequete7=' SELECT DISTINCT nomParametre
FROM bain,parametre
WHERE bain.cleSubstanceFAJ="'.$_POST['idMetal'].'"
AND bain.idBain=parametre.cleBain
ORDER BY nomParametre';
$requete7=mysql_query($txtRequete7);
echo' <select name="param['.$i.']" id="param'.$i.'" onchange="change3('.$i.');">'."\n";
echo' <option>Nom param</option>'."\n";
echo' <option value="Pompe">Pompe</option>'."\n";
echo' <option value="Ecart volume">Ecart volume</option>'."\n";
while($tableau7=mysql_fetch_assoc($requete7))
{
echo' <option value="'.$tableau7['nomParametre'].'">'.$tableau7['nomParametre'].'</option>'."\n";
}
echo' </select>'."\n";
echo' </th>'."\n";
}
echo' </tr>'."\n";
echo' <tr>'."\n";
for($i=5;$i<11;$i++)
{
// On affiche l'unité du parametre mesuré
echo' <th id="unite'.$i.'">Unité</th>'."\n";
}
echo' </tr>'."\n";
echo' </thead>'."\n";
// Corps de faj2
$txtRequete8='SELECT * from bain WHERE cleSubstanceFAJ="'.$_POST['idMetal'].'"';
$requete8=mysql_query($txtRequete8);
echo' <tbody bgcolor="'.$tableau20['couleurFAJ'].'">'."\n";
while($tableau8=mysql_fetch_assoc($requete8))
{
echo' <tr>'."\n";
echo' <td class="col1">'.$tableau8['referenceBain'].'</td>'."\n";
for($i=5;$i<11;$i++)
{
echo' <td class="coli">Mesuré <input type="checkbox" name="mesuree['.$i.']" checked="checked" value="1" /></td>'."\n";
}
echo' </tr>'."\n";
}
echo' </tbody>'."\n";
echo' </table>'."\n";
echo' <br />'."\n"; |
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 creerXHR()
{
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;
} |
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
| function change3(i)
{
var xhr =array();
xhr[i] = creerXHR();
// On défini ce qu'on va faire quand on aura la réponse
xhr[i].onreadystatechange = function()
{
// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
if(xhr[i].readyState === 4 && xhr[i].status === 200)
{
resultat = document.getElementById("unite"+i); // div Modifié
resultat.innerHTML = xhr[i].responseText;
}
};
// Ici on va voir comment faire du post
xhr[i].open('POST','blocPage/creerFAJ.php',true);
// ne pas oublier cela pour le post
xhr[i].setRequestHeader("Content-type","application/x-www-form-urlencoded");
// ne pas oublier de poster les arguments : ici, l'id du métal
xhr[i].send("idParam"+i+"="+document.getElementById("param"+i).options[document.getElementById("param"+i).selectedIndex].value);
} |
