5 pièce(s) jointe(s)
[AJAX] Formulaire avec nombre variable de listes liées : count($_POST)
1er pb : le submit exécute une fonction JS resultat() qui normalement renvoie dans le div blocresultat du fichier index.php le résultat d'une requête SQL appelée dans le fichier resultat.php. Pour faire simple, le fichier resultat.php renvoie dans cet exemple les valeurs des $_POST nécessaires à la requête et non le résultat de la requête. C'est le count($_POST) qui me donne le nombre de listes liées utilisées sachant que seule m'intéresse la valeur du dernier $_POST (hormis la valeur du 1er $_POST du formulaire qui ne fait pas partie des listes liées). J'ai donc deux valeurs à récupérer pour pouvoir traiter ma requête SQL.
sur le submit, le var r = "<?php echo (count($_POST)); ?>"; dans la fonction JS affiche 0.
2ème pb : juste esthétique. Comment effacer une liste liée dans le formulaire si elle n'est pas utilisée.
Si vous souhaitez tester, la branche 2 liée à la branche 2-2 n'est pas liée à un 3ème niveau.
Cela fait 3 jours que je tourne en rond sur le 1er pb.
Je vous remercie par avance pour votre aide.
Le fichier index.php
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
| <?php
function afficherTableau($array) {
echo '<pre>';
print_r($array);
print_r(count($array));
echo '</pre>';
}
// Initialisation ou récupération des variables
$type = !empty($_POST['type']) ? $_POST['type'] : '0';
$niveau1 = !empty($_POST['niveau1']) ? $_POST['niveau1'] : '0';
$niveau2 = !empty($_POST['niveau2']) ? $_POST['niveau2'] : '0';
$niveau3 = !empty($_POST['niveau3']) ? $_POST['niveau3'] : '0';
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type='text/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
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
| 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éthodes qui seront appelées sur le click du bouton
*/
function goNiveau2() {
var xhr = getXhr();
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
leselect = xhr.responseText;
document.getElementById('blocniveau2').innerHTML = leselect;
}
}
xhr.open("POST", "niveau2.php", true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
sel = document.getElementById('niveau1');
niveau1 = sel.options[sel.selectedIndex].value;
xhr.send("niveau1=" + niveau1);
}
function goNiveau3() {
var xhr = getXhr();
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
leselect = xhr.responseText;
document.getElementById('blocniveau3').innerHTML = leselect;
}
}
xhr.open("POST", "niveau3.php", true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
sel = document.getElementById('niveau2');
niveau2 = sel.options[sel.selectedIndex].value;
xhr.send("niveau2=" + niveau2);
}
function resultat() {
var r = "<?php echo (count($_POST)); ?>";
if (r != 0) {
alert(r);
}
var xhr = getXhr();
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
leselect = xhr.responseText;
document.getElementById('blocresultat').innerHTML = leselect;
}
}
xhr.open("POST", "resultat.php", true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
sel = document.getElementById('type');
type = sel.value;
switch (r) {
case 2:
sel2 = document.getElementById('niveau1');
niveau1 = sel2.value;
xhr.send("type=" + type + "&niveau1=" + niveau1);
break;
case 3:
sel2 = document.getElementById('niveau2');
niveau2 = sel2.value;
xhr.send("type=" + type + "&niveau2=" + niveau2);
break;
case 4:
sel2 = document.getElementById('niveau3');
niveau3 = sel2.value;
xhr.send("type=" + type + "&niveau3=" + niveau3);
break;
default:
break;
}
} |
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
| </script>
</head>
<body>
<div id="global">
<?php
afficherTableau($_POST);
?>
<form method="post" onsubmit="resultat();">
<fieldset>
<legend>Le type</legend>
<div id="bloctype">
<select name="type" id="type">
<option value="0">Aucun</option>
<?php
mysql_connect("localhost", "root", "");
mysql_select_db("test");
$res = mysql_query("select * from TYPE order by NOM_TYPE");
while ($row = mysql_fetch_assoc($res)) {
echo "<option value='" . $row["id_type"] . "'>" . $row["nom_type"] . "</option>";
}
?>
</select>
</div>
</fieldset>
<fieldset>
<legend>Liste liées</legend>
<label>Niveau 1</label>
<select name='niveau1' id='niveau1' onclick='goNiveau2()'>
<option value='0'>Aucune</option>
<?php
mysql_connect("localhost", "root", "");
mysql_select_db("test");
$id = 1;
$res = mysql_query("select * from BRANCHE where ID_BRANCHE_PARENT=" . $id . " order by NOM_BRANCHE");
while ($row = mysql_fetch_assoc($res)) {
echo "<option value='" . $row["id_branche"] . "'>" . $row["nom_branche"] . "</option>";
}
?>
</select>
<label>Niveau 2</label>
<div id='blocniveau2' style='display:inline'>
<select name='niveau2'id='niveau2' onclick='goNiveau3()' >
<option value='0'>Choisissez dans la liste</option>
</select>
</div>
<label>Niveau 3</label>
<div id='blocniveau3' style='display:inline'>
<select name='niveau3' id='niveau3'>
<option value='0'>Choisissez dans la liste</option>
</select>
</div>
</fieldset>
<input type='submit' id='submit' value='Valider' />
</form>
<!--
// affichage du resultat
-->
<div id='blocresultat'></div>
</div>
</body>
</html> |
Les fichiers niveau 2.php et niveau3.php
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
| <?php
echo "<select name='niveau2' id='niveau2' onclick='goNiveau3()'>";
if(isset($_POST['niveau1'])){
mysql_connect("localhost","root","");
mysql_select_db("test");
$res = mysql_query("select * from BRANCHE where ID_BRANCHE_PARENT=" . $_POST['niveau1'] . " order by NOM_BRANCHE");
while($row = mysql_fetch_assoc($res)){
echo "<option value='".$row['id_branche']."'>".$row['nom_branche']."</option>";
}
}
echo "</select>";
?> |
Code:
1
2
3
4
5
6
7
8
9
10
11
12
| <?php
echo "<select name='niveau3' id='niveau3'>";
if(isset($_POST['niveau2'])){
mysql_connect("localhost","root","");
mysql_select_db("test");
$res = mysql_query("select * from BRANCHE where ID_BRANCHE_PARENT=" . $_POST['niveau2'] . " order by NOM_BRANCHE");
while($row = mysql_fetch_assoc($res)){
echo "<option value='".$row['id_branche']."'>".$row['nom_branche']."</option>";
}
}
echo "</select>"; |
Le fichier resultat.php
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
| <?php
echo 'j\' y suis';
switch (count($_POST)) {
case 2:
echo $_POST['type'] . '' . $_POST['niveau1'];
break;
case 3:
echo $_POST['type'] . '' . $_POST['niveau2'];
break;
case 4:
echo $_POST['type'] . '' . $_POST['niveau3'];
break;
default:
break;
} |
