Ajout de liste deroulante

**axe31** · 30/05/2012, 10h17

Bonjour,
Voilà je suis vraiment novice en javascript et je ne trouve comment ajouter ou supprimer une liste déroulante identique sans la valeur de la précédente liste déroulante à l'aide d'un bouton ajouter et d'un bouton supprimer.

Voila mon code HTML/PHP

Code :

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
<div id="strate_1" style="display: block">
	<select name="strate1" id="strate1">
		<option value="-1">- - - Choisissez une strate - - -</option>
			<?php
                                $connexion = mysql_connect($serveur, $admin, $mdp);
                                $sql6 = "SELECT DISTINCT mes.`ID_SARCEP` as strate1, sARCEP.`STRATE_ARCEP` as strate2
                                                FROM `mesures` mes 
                                                INNER JOIN `strates_arcep` sARCEP
                                                ON mes.ID_SARCEP = sARCEP.ID_SARCEP
                                                WHERE mes.`ID_TYPELOCALISATION` = 1";
                                if($connexion != false)
                                {
                                        $choixbase = mysql_select_db($base, $connexion);        
                                        $rech_strate = mysql_query($sql6);
                                        $TstrateID = array();
                                        $TstrateNAME = array();
                                        $nb_strate = 0;
                                        if($rech_strate != false)
                                        {
                                                while($ligneStrate = mysql_fetch_assoc($rech_strate))
                                                {
                                                        array_push($TstrateID, $ligneStrate['strate1']);
                                                        array_push($TstrateNAME, $ligneStrate['strate2']);
                                                        $nb_strate++;
                                                }
                                        }
                                        for($p = 0; $p < $nb_strate; $p++)
                                                {
                                                        echo("<option value=\"$TstrateID[$p]\"".((isset($idStrateARCEP) && $idStrateARCEP == $TstrateID[$p])?" selected":"-1").">$TstrateNAME[$p] </option>");
                                                }
                                        echo("<input type=\"button\" value=\"Ajouter une strate\" onClick=\"addStrate();\" /> </br>");
                                        echo("<input type=\"button\" value=\"Supprimer une strate\" onClick=\"delStrate();\" />");
                                }
                                mysql_close($connexion);
                                ?>
	</select>
</div>

**RomainVALERI** · 30/05/2012, 10h27

Ici, c'est le forum JS ^^ poste plutot le code HTML généré s'il te plait.

**axe31** · 30/05/2012, 11h05

Oui pas faux XD

Code :

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
<!DOCTYPE html>
<html dir="ltr" lang="fr-FR">
    <head>
        <meta charset="utf-8" />
        <title>Test liste</title>
        <script type="text/javascript">
            function show_div(id)
            {
                for (var i = 1; i <= 2; i++)
                {
                    if (i == id)
                    {
                        document.getElementById('titre_' + i).style.display = 'block';
                        document.getElementById('strate_' + i).style.display = 'block';
                    }
                    else 
                    {
                        document.getElementById('titre_' + i).style.display = 'none';
                        document.getElementById('strate_' + i).style.display = 'none';
                    }
                }
            }
            function addStrate()
            {
 
            }
        </script>
    </head>
    <body>
        <h3>Test CRP</h3>
        <form action="" method="post" id="chg">
        <fieldset>
            <legend>Identificationde la campagne</legend>
                <select name="annee" id="annee" onchange="document.forms['chg'].submit();">
                    <option value="-1">- - - Choisissez une année - - -</option>
                    <option value="2012" selected>2012 </option>
                    <option value="2011"-1>2011 </option>
                </select>
                <select name="semestre" id="semestre" onchange="document.forms['chg'].submit();">
                    <option value="-1">- - - Choisissez un semestre - - -</option>
                    <option value="1" selected>Semestre 1</option>
                </select>
                <select name="semaine" id="semaine" onchange="document.forms['chg'].submit();">
                    <option value="-1">- - - Choisissez une semaine - - -</option>
                    <option value="11" selected>Semaine 11</option>
                    <option value="10">Semaine 10</option>
                </select>
                <select name="prestataire" id="prestataire" onchange="document.forms['chg'].submit();">
                    <option value="-1">- - - Choisissez un prestataire - - -</option>
                    <option value="1" selected>GET</option>
                </select>
                <select name="campagne" id="campagne">
                    <option value="1">2012-S1_Voix_S11_DO_SO_GET</option>
                </select>
        </fieldset>
        <fieldset>
            <legend> Filtres </legend>
            <table>
                <thead> <!-- En-tête du tableau -->
                    <tr>
                       <th>Opérateurs</th>
                       <th>Localisation</th>
                       <th>Modes</th>
                       <th>
                       <div id="titre_1" style="display: block">
                       Strates ARCEP
                       </div>
                       <div id="titre_2" style="display: none">
                       AXES
                       </div>
                       </th>
                    </tr>
                </thead>
                <tbody> <!-- Corps du tableau -->
                    <tr>
                        <td> <div id="operateurs">
                            <input type="radio" name="operateurs" value="3" id="ORANGE" checked="checked" /> <label for="ORANGE">ORANGE</label> <br />
                            <input type="radio" name="operateurs" value="2" id="BYT" /> <label for="BYT">BYT</label> <br />
                            <input type="radio" name="operateurs" value="1" id="SFR" /> <label for="SFR">SFR</label> <br />
                            <input type="radio" name="operateurs" value="4" id="FREE" /> <label for="FREE">FREE</label> <br />
                            <input type="radio" name="operateurs" value="5" id="tousOp" /> <label for="tousOp">Tous</label> <br />
                            </div>
                        </td>
                        <td> <div id="localisation">
                            <input type="radio" name="localisation" value="1" id="agglo" onclick="show_div(1);" checked="checked" /> <label for="agglo">Agglomeration</label> <br />
                            <input type="radio" name="localisation" value="2" id="axes" onclick="show_div(2)" /> <label for="axes">Axes</label> <br />
                            <input type="radio" name="localisation" value="3" id="tousLoca" /> <label for="tousLoca">Tous</label> <br />
                            </div >
                        </td>
                        <td> <div id="modes">
                            <input type="checkbox" name="modes[]" value="1" id="2G" checked="checked"/> <label for="2g">2G</label><br />
                            <input type="checkbox" name="modes[]" value="2" id="3G" checked="checked"/> <label for="3g">3G</label><br />
                            <input type="checkbox" name="modes[]" value="3" id="4G" checked="checked"/> <label for="4g">4G</label><br />
                            </div>
                        </td>
                        <td> 
                            <div id="champ_1" style="display: block">
                                <select name="strate1" id="strate1">
                                    <option value="-1">- - - Choisissez une strate - - -</option>
                                        <option value="4"-1>- DE 5K </option>
                                        <option value="1"-1>10-20K </option>
                                        <option value="3"-1>5-10K </option>
                                        <option value="5"-1>50-400K </option>
                                        <option value="8"-1>TOP14 </option>
                                        <option value="2"-1>\N </option>
                                <input type="button" value="Ajouter une strate" onClick="addStrate();" /> </br>
                                <input type="button" value="Supprimer une strate" onClick="delStrate();" />                                </select>
                            </div>
                            <div id="champ_2" style="display: none">
                                <select name="axe" id="axe">
                                    <option value="-1">- - - Choisissez un axe - - -</option>
                                    <option value="2"-1> </option>
                                    <option value="55"-1>A0004 </option>
                                    <option value="47"-1>A0010 </option>
                                    <option value="53"-1>A0071 </option>
                                    <option value="49"-1>A0075 </option>
                                    <option value="54"-1>A0701 </option>
                                    <option value="56"-1>D0001 </option>
                                    <option value="57"-1>D0123 </option>
                                    <option value="51"-1>D0766 </option>
                                    <option value="52"-1>D0772 </option>
                                    <option value="48"-1>N0009 </option>
                                    <option value="50"-1>N1009 </option>
                                </select>
                            </div>
                        </td>
                    </tr>
                </tbody>
            </table>
        </fieldset>
        <input type="submit" name="ok" id="ok" value="Envoyer" />
        </form>
    </body>

**RomainVALERI** · 30/05/2012, 12h27

Jette un oeil du côté de Node.cloneNode : tu récupères l'élément à dupliquer, et tu insères son clone avec appendChild. Tu as déjà pratiqué les manipulations du DOM en JS ?

**axe31** · 30/05/2012, 13h06

Ok ok, je vais voir ça. Non pas du tout je commence vraiment le JavaScript donc j'ai lu quelques trucs par ci par là.

**axe31** · 04/06/2012, 15h33

j'ai réussi a utiliser cloneNode mais j'ai plusieurs questions

Code :

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
function show_div(id)
{
	for (var i = 1; i <= 3; i++)
	{
		if (i == id)
		{
			document.getElementById('titre_' + i).style.display = 'block';
			document.getElementById('strate_' + i).style.display = 'block';
		}
		else 
		{
			document.getElementById('titre_' + i).style.display = 'none';
			document.getElementById('strate_' + i).style.display = 'none';
		}
	}
}
 
var nb_ajout = 0;
function addListeStrate()
{
	if(nb_ajout < 9 )
	{
		var strate1 = document.getElementById('strate');
		var strate2 = strate1.cloneNode(true);		
 
		strate1.parentNode.appendChild(strate2);		
		nb_ajout++;
	}
}
 
 
function delListeStrate()
{
	if(nb_ajout !=0)
	{
	var lastStrate = document.getElementById('strate');
 
	lastStrate.parentNode.removeChild(lastStrate);
	nb_ajout--;
	}
 
}

Tout d'abord sur la forme:
- je veux inserer les elements dupliqués juste avant mon bouton +
Nom : forme.PNG
Affichages : 53
Taille : 5,8 Ko

- Et quand j'utilise ma fonction supprimer il me supprime la première liste alors que je voudrais que c'a me supprime la dernière ajoutée.
Nom : forme2.PNG
Affichages : 49
Taille : 5,1 Ko

Nom : forme2.PNG
Affichages : 49
Taille : 5,1 Ko

Et aussi sur le fond:
- Vu que les listes sont clonées comment récupérer les bonnes valeurs pour l'envoyer au formulaire car quand je submit il me retourne seulement la valeur de la première liste.

Code :

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
<!DOCTYPE html>
<html dir="ltr" lang="fr-FR">
	<head>
		<meta charset="utf-8" />
		<title>E2endOAM</title>
		<script src="show_div.js"></script>
		<script src="clonage.js"></script>
	</head>
 
	<body>
		<header>
			<a href="/e2endoam/index.html"> <img src="logo.jpg" alt="banniere" title="Accueil"/> </a>
			<h2>Outil automatique de mesures EndToEnd</h2>
			<nav>
				<ul>
					<li><a href="index.html">Accueil</a></li>
 
					<li><a href="upload.html">Upload</a></li>
					<li><a href="mesure.php">Mesure</a></li>
				</ul>
			</nav>
		</header>
 
		<section>
			<form name="mesure" action="" method="post" id="chg">
 
			<select name="annee" id="annee" onchange="document.forms['chg'].submit();">
				<option value="-1">- - - Choisissez une année - - -</option>
				<option value="2012" selected>2012 </option>
				<option value="2011"-1>2011 </option>
			</select>
 
			<select name="semestre" id="semestre" onchange="document.forms['chg'].submit();">
				<option value="-1">- - - Choisissez un semestre - - -</option>
				<option value="1" selected>Semestre 1</option>
			</select>
 
			<select name="semaine" id="semaine" onchange="document.forms['chg'].submit();">
				<option value="-1">- - - Choisissez une semaine - - -</option>
				<option value="11">Semaine 11</option><option value="10">Semaine 10</option>
			</select>		</section>
 
		<section>
			<table>
				<thead> <!-- En-tête du tableau -->
					<tr>
						<th> <h3>Pré-Filtre </h3> </th>
						<th> <h3>Localisation</h3> </th>
						<th>
							<div id="titre_1" style="display: block">
								<h3>Strates ARCEP</h3>
							</div>
 
							<div id="titre_2" style="display: none">
								<h3>AXES</h3>
							</div>
 
							<div id="titre_3" style="display: none">
								<h3>Ligne Commerciale</h3>
							</div>
					  </th>
					</tr>
				</thead>
 
				<tbody> <!-- Corps du tableau -->
					<tr>
						<td>
							<div id="prefiltre">
								<input type="radio" name="prefiltre" value="1" id="active" checked="checked" /> 
								<label for=active>Activé</label> <br />
								<input type="radio" name="prefiltre" value="0" id="desactive" />
								<label for=desactive>Désactivé</label>
							</div>
						</td>
 
						<td>
							<div id="localisation">
								<input type="radio" name="localisation" value=2 id="agglo" onclick="show_div(1);" checked="checked" /> <label for="agglo">Agglomeration</label> <br />
								<input type="radio" name="localisation" value=1 id="axes" onclick="show_div(2);" /> <label for="axes">Axes</label> <br />
								<input type="radio" name="localisation" value=4 id="trains" onclick="show_div(3);" /> <label for="trains">Trains</label> <br />
							</div >
						</td>
						<td> 
							<div id="strate_1" style="display: block">
								<select name="strate" id="strate">
									<option value="-1">- - - Choisissez une strate - - -</option>
									<option value="4"-1>- DE 5K </option>
									<option value="9"-1>10-20K </option>
									<option value="5"-1>5-10K </option>
									<option value="3"-1>50-400K </option>
									<option value="8"-1>TOP14 </option>
									<option value="2"-1>\N </option>
								</select>
 
								<img src="./images/plus.png" alt="Ajouter une strate" title="Ajouter une strate" align="middle" onClick="addListeStrate();" />
								<img src="./images/moins.png" alt="Supprimer une strate" title="Supprimer une strate" align="middle" onClick="delListeStrate();" />
							</div>
 
							<div id="strate_2" style="display: none">
								<select name="listeAxes" id="listeAxes">
									<option value="-1">- - - Choisissez un axe - - -</option>
								</select>
 
								<img src="./images/plus.png" alt="Ajouter un axe" title="Ajouter un axe" align="middle" onClick="addListeAxe();" />");
								<img src="./images/moins.png" alt="Supprimer un axe" title="Supprimer un axe" align="middle" onClick="delListeAxe();" />");
							</div>
 
							<div id="strate_3" style="display: none">
								<select name="ligneCom" id="ligneCom">
									<option value="-1">- - - Choisissez une ligne commerciale - - -</option>
								</select>
 
								<img src="./images/plus.png" alt="Ajouter une Ligne Commerciale" title="Ajouter une Ligne Commerciale" align="middle" onClick="addListeLigneCom();" />");
								<img src="./images/moins.png" alt="Supprimer une Ligne Commerciale" title="Supprimer une Ligne Commerciale" align="middle" onClick="delListeLigneCom();" />");
							</div>
						</td>
					</tr>
				</tbody>
			</table>
 
			<input type="submit" name="ok" id="ok" value="Envoyer" />
			</form>	
		</section>
 
		<footer>
 
			<ul>
					<li><a href="index.html">Accueil</a></li>
					<li><a href="upload.html">Upload</a></li>
					<li><a href="mesure.php">Mesure</a></li>
			</ul>
		</footer>
	</body>
 
</html>

**NoSmoking** · 04/06/2012, 22h23

Bonsoir,
il te faut lorsque tu cloneNode tenir compte que même l'ID est dupliqué, donc il y a un certains nombre de précaution à prendre.

Je pense qu'il faut que tu revois ta fonction de suppression.

**RomainVALERI** · 04/06/2012, 23h03

En effet, il faut modifier ton élément entre le moment où il est cloné et la greffe du clone au document principal. Je veux dire par exemple :

Code :

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

1
2
3
4
5
var strate1 = document.getElementById('strate');
var strate2 = strate1.cloneNode(true);		
strate2.id += nb_ajout.toString();// exemple de manière de différencier les clones
strate1.parentNode.appendChild(strate2);		
nb_ajout++;

(le toString est en réalité superflu, je l'ai ajouté pour la lisibilité)

**axe31** · 06/06/2012, 22h29

Merci beaucoup j'ai réussi à m'en sortir avec vos indications.

Par contre j'ai un petit souci avec d'autre liste déroulante, je me suis tourné vers Ajax car en PHP cela devenait compliqué.

Voilà je cherche à liées 5 listes déroulantes chacune découlant de la précédente. J'ai regardé tous les post sur le sujet qui traitait de ca mais je ne trouve pas mon erreur. J'essaye déjà d'en lier 3 mais la 3ieme ne fonctionne pas pourtant ce que j'ai fait ressemble bien aux autres posts que j'ai trouvé. Donc si quelqu'un pouvais trouver l'endroit où ça bloque :/
La console d'erreur de firefox m'indique aucune erreur...

EDIT: Code mis a jour fonctionnel sauf requete SQL

index.php

Code :

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
<html>
	<head>
		<title>test AJAX</title>
		<script src="ajax.js"></script>
	</head>
	<body>
		<form>
			<fieldset style="width: 500px">
				<legend>Liste liées</legend>
				<div id="divAnnee" style="display:inline">
				<select name="annee" id="annee" onchange="go()">
					<option value="-1">Choisir une année</option>
					<?php
                                                $sql1 = "SELECT DISTINCT YEAR(`date`) AS annee1
                                                                        FROM `mesures`
                                                                        ORDER BY annee1 DESC;";
                                                mysql_connect($serveur, $admin, $mdp);
                                                mysql_select_db($base);
                                                $rech_annee = mysql_query($sql1);
                                                while($ligneAnnee = mysql_fetch_assoc($rech_annee))
                                                {
                                                        echo ("<option value=\"".$ligneAnnee['annee1']."\">".$ligneAnnee['annee1']."</option>");
                                                }
                                        ?>
				</select>
				</div>
				<div id="divSemestre" style="display:inline">
				<select name="semestre" id="semestre" onchange="go2()">
					<option value="-1">Choisir un semestre</option>
				</select>
				</div>
				<div id="divSemaine" style="display:inline">
				<select name="semaine" id="semaine">
					<option value="-1">Choisir une semaine</option>
				</select>
				</div>
			</fieldset>
		</form>
	</body>
</html>

ajax.js

Code :

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
var xhr = null;
function getXhr()
{
	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 peut pas lancer cet outil"); 
		xhr = false; 
	} 
}
 
function go()
{
	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('semestre').innerHTML = leselect;
		}
	}
	// Ici on va voir comment faire du post
	xhr.open("POST","ajax_ajout_semestre.php",true);
	// ne pas oublier ça pour le post
	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
	// ne pas oublier de poster les arguments
	// ici, l'annee
	sel = document.getElementById('annee');
	idannee = sel.options[sel.selectedIndex].value;
	xhr.send("idAnnee="+escape(idannee));
}
 
function go2()
{
	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('semaine').innerHTML = leselect;
		}
	}
	// Ici on va voir comment faire du post
	xhr.open("POST","ajax_ajout_semaine.php",true);
	// ne pas oublier ça pour le post
	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
	// ne pas oublier de poster les arguments
	// ici, le semestre
	sel = document.getElementById('semestre');
	idsemestre = sel.options[sel.selectedIndex].value;
	xhr.send("idSemestre="+idsemestre);	
}

ajax_ajout_semestre.php

Code :

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
<?php
        // global $idAnnee = $_POST['idAnnee'];
        if($_POST['idAnnee'] !=-1)
        {
                $sql2 = "SELECT DISTINCT semestre(`date`) AS semestre1
                                                FROM `mesures`
                                                WHERE YEAR(`date`) =".$_POST['idAnnee'];
                mysql_connect($serveur, $admin, $mdp);
                mysql_select_db($base);
                $rech_semestre = mysql_query($sql2);
                echo("<option value=\"-1\">Choisir un semestre</option>");
                while($ligneSemestre = mysql_fetch_assoc($rech_semestre))
                {
                        echo("<option value=\"".$ligneSemestre['semestre1']."\">Semestre ".$ligneSemestre['semestre1']."</option>");
                }
        }
        else
        {
                echo("<option value=\"-1\">Choisir un semestre</option>");
        }
?>

ajax_ajout_semaine.php

Code :

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
<?php
        if($_POST['idSemestre'] != -1)
        {
                $sql3 = "SELECT DISTINCT WEEK(`date`) AS semaine1
                                                FROM `mesures`
                                                WHERE YEAR(`date)=".$_POST['idAnnee'].
                                                "AND semestre(`date`)=".$_POST['idSemestre'];
                mysql_connect($serveur, $admin, $mdp);
                mysql_select_db($base);
                $rech_semaine = mysql_query($sql3);
                echo("<option value=\"-1\">Choisir une semaine</option>");
                while($ligneSemaine = mysql_fetch_assoc($rech_semaine))
                {
                        echo("<option value=\"".$ligneSemaine['semaine1']."\">S ".$ligneSemaine['semaine1']."</option>");
                }
        }
        else
        {
                echo("<option value=\"-1\">Choisir une semaine</option>");
        }
?>

**axe31** · 07/06/2012, 12h59

Bon c'est bon j'ai réussi à résoudre une partie de mon problème. J'arrive à afficher les semaine cependant dans mon script ajax_ajout_semaine.php j'ai ma requête SQL qui ne fonctionne pas car ça ne récupère pas $_POST['idAnnee'] précédemment renseigné mais seulement le $_POST['idSemestre']
Comment recuperer idAnnee ???

P.S: j'ai mis à jour le code précèdent qui fonctionne si j'enlève la condition du where dans ajax_ajout_semaine.php

**RomainVALERI** · 07/06/2012, 13h36

La valeur de ton idAnnee n'est plus présente dans le send du second appel ajax. Rajoute-la et ça devrait aller mieux

**axe31** · 07/06/2012, 14h04

Il faut juste rajouter une ligne a la fin de mon deuxieme appel ajax ??

Code :

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

1
2
xhr.send("idSemestre="+idsemestre);
xhr.send("idAnnee="+idannee);

**vermine** · 07/06/2012, 14h07

Bonjour,

Un seul send, a priori :

Code :

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

xhr.send("idSemestre="+idsemestre+"&idAnnee="+idannee);

Mais il faut que idAnnee soit initialisé au préalable.

**axe31** · 07/06/2012, 14h28

Bon deja il me renvoi plus l'erreur dans la console d'erreur : Undefined index: idAnnee in c:\wamp\www\ajax\ajax_ajout_semaine.php on line 13....

Mais il me complete toujours pas la liste deroulante c'est que idAnnee est surement null :/

**vermine** · 07/06/2012, 14h34

Je n'ai pas lu toute la discussion mais à vous de nous le dire. Que vaut idAnnee avant le send ? Que vaut-il lors de la réception du côté php ? Que renvoie le select avec cet idAnnee ? ...

**axe31** · 07/06/2012, 14h46

C'est bon réussi ...
Erreur a la con ... oublié de rajouter un espace avant le AND de la requete ...

Merci beaucoup pour votre aide

**vermine** · 07/06/2012, 14h59

Bien vu.

Si c'est résolu n'hésitez pas à cliquer sur le bouton

qui se trouve en bas (centré) de la discussion.

**axe31** · 07/06/2012, 15h03

Par contre ca ne fonctionne pas du tout sur IE 8 ou 9 la deuxieme liste est vide :/

**NoSmoking** · 07/06/2012, 20h29

problème de cache ????

http://javascript.developpez.com/faq...#navig.nocache

**axe31** · 08/06/2012, 10h47

Dans le mode développement de IE, le select me renvoi ça :

Code :

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

1
2
3
4
5
6
7
8
<select name="semestre" id="semestre" onchange="go2()">
  Texte - Choisir un semestreSemestre 1
 
<! -- AU lieu de ça sous FF -->
 
<select name="semestre" id="semestre" onchange="go2()">
  <option value="-1">Choisir un semestre</option>
  <option value="1">Semestre 1</option></select>

Donc il exécute bien la requête car il concatenne les 2 options dispo

Pour qu'il m'affiche cela j'ai rajouter dans mon script php:

Code :

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

1
2
3
4
header("Pragma: no-cache");
header("Expires: 0");
header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header("Cache-Control: no-cache, must-revalidate");

Mais il ne m'affiche toujours rien dans la liste déroulante...

Ensuite j'ai rajouter a mon script ajax.js

Code :

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

1
2
fileSemestre = "ajax_ajout_semestre.php?"+new Date()*Math.random();
xhr.open("POST",fileSemestre,true);

Mais résultat identique :/

Ajout de liste deroulante

JavaScript

Discussions similaires

Partager

Partager