Changer la sélection d'un menu déroulant
Morizeum
-
Reivax962 Messages postés 3742 Statut Membre -
Reivax962 Messages postés 3742 Statut Membre -
Salut,
Je suis en train de finaliser une sorte d'album photo. Pour cet album, je suis amené à vouloir reclasser les photos dans un ordre donné. Pour celà, je veux mettre un menu déroulant à côté de chaque photo avec autant d'option que de photos.
Mais voilà le problème : je voudrais pouvoir changer la sélection dynamiquement. Par exemple, si je met la 5ème photo en troisième, je voudrais qu'automatiquement, les 2 menus déroulant qui ont les numéros 3 et 4 passent respectivement en 4 et 5.
Mon problème n'est pas sur l'algorithmique mais sur la façon de changer la sélection des menus déroulants.
Voici le code que j'ai essayé d'écrire... et qui ne marche pas!
<form action="changeordre.php?ok=1&modif=1§ion=4&ssection=0" name="form" method="POST">
<br /><br />
<div align="center">
<table cellpadding=8><tr>
<td>
<img src="../img/mini/mini_mini_1.JPG">
<select name="photo1" OnChange="changeOrdre(1)">
<option value=1 selected>1</option>
<option value=2>2</option>
<option value=3>3</option>
<option value=4>4</option>
<option value=5>5</option>
</select>
<input type=hidden name="nom1" value="mini_mini_1.JPG">
</td>
<td>
<img src="../img/mini/mini_mini_5.jpg">
<select name="photo2" OnChange="changeOrdre(2)">
<option value=1>1</option>
<option value=2 selected>2</option>
<option value=3>3</option>
<option value=4>4</option>
<option value=5>5</option>
</select>
<input type=hidden name="nom2" value="mini_mini_5.jpg">
</td>
<td>
<img src="../img/mini/mini_mini_6.jpg">
<select name="photo3" OnChange="changeOrdre(3)">
<option value=1>1</option>
<option value=2>2</option>
<option value=3 selected>3</option>
<option value=4>4</option>
<option value=5>5</option>
</select>
<input type=hidden name="nom3" value="mini_mini_6.jpg">
</td>
<td>
<img src="../img/mini/mini_mini_7.jpg">
<select name="photo4" OnChange="changeOrdre(4)">
<option value=1>1</option>
<option value=2>2</option>
<option value=3>3</option>
<option value=4 selected>4</option>
<option value=5>5</option>
</select>
<input type=hidden name="nom4" value="mini_mini_7.jpg">
</td>
</tr><tr>
<td>
<img src="../img/mini/mini_mini_4.JPG">
<select name="photo5" OnChange="changeOrdre(5)">
<option value=1>1</option>
<option value=2>2</option>
<option value=3>3</option>
<option value=4>4</option>
<option value=5 selected>5</option>
</select>
<input type=hidden name="nom5" value="mini_mini_4.JPG">
</td>
</table>
<input type="submit" value="Valider">
</div>
</form>
<script type="text/javascript">
function changeOrdre(n)
{
document.form.photo1.options[5].selected=true;
document.form.photo1.selectedIndex=5;
}
</script>
Je suis en train de finaliser une sorte d'album photo. Pour cet album, je suis amené à vouloir reclasser les photos dans un ordre donné. Pour celà, je veux mettre un menu déroulant à côté de chaque photo avec autant d'option que de photos.
Mais voilà le problème : je voudrais pouvoir changer la sélection dynamiquement. Par exemple, si je met la 5ème photo en troisième, je voudrais qu'automatiquement, les 2 menus déroulant qui ont les numéros 3 et 4 passent respectivement en 4 et 5.
Mon problème n'est pas sur l'algorithmique mais sur la façon de changer la sélection des menus déroulants.
Voici le code que j'ai essayé d'écrire... et qui ne marche pas!
<form action="changeordre.php?ok=1&modif=1§ion=4&ssection=0" name="form" method="POST">
<br /><br />
<div align="center">
<table cellpadding=8><tr>
<td>
<img src="../img/mini/mini_mini_1.JPG">
<select name="photo1" OnChange="changeOrdre(1)">
<option value=1 selected>1</option>
<option value=2>2</option>
<option value=3>3</option>
<option value=4>4</option>
<option value=5>5</option>
</select>
<input type=hidden name="nom1" value="mini_mini_1.JPG">
</td>
<td>
<img src="../img/mini/mini_mini_5.jpg">
<select name="photo2" OnChange="changeOrdre(2)">
<option value=1>1</option>
<option value=2 selected>2</option>
<option value=3>3</option>
<option value=4>4</option>
<option value=5>5</option>
</select>
<input type=hidden name="nom2" value="mini_mini_5.jpg">
</td>
<td>
<img src="../img/mini/mini_mini_6.jpg">
<select name="photo3" OnChange="changeOrdre(3)">
<option value=1>1</option>
<option value=2>2</option>
<option value=3 selected>3</option>
<option value=4>4</option>
<option value=5>5</option>
</select>
<input type=hidden name="nom3" value="mini_mini_6.jpg">
</td>
<td>
<img src="../img/mini/mini_mini_7.jpg">
<select name="photo4" OnChange="changeOrdre(4)">
<option value=1>1</option>
<option value=2>2</option>
<option value=3>3</option>
<option value=4 selected>4</option>
<option value=5>5</option>
</select>
<input type=hidden name="nom4" value="mini_mini_7.jpg">
</td>
</tr><tr>
<td>
<img src="../img/mini/mini_mini_4.JPG">
<select name="photo5" OnChange="changeOrdre(5)">
<option value=1>1</option>
<option value=2>2</option>
<option value=3>3</option>
<option value=4>4</option>
<option value=5 selected>5</option>
</select>
<input type=hidden name="nom5" value="mini_mini_4.JPG">
</td>
</table>
<input type="submit" value="Valider">
</div>
</form>
<script type="text/javascript">
function changeOrdre(n)
{
document.form.photo1.options[5].selected=true;
document.form.photo1.selectedIndex=5;
}
</script>
A voir également:
- Changer la sélection d'un menu déroulant
- Changer dns - Guide
- Menu déroulant excel - Guide
- Excel menu déroulant en cascade - Guide
- Menu déroulant google sheet - Accueil - Guide bureautique
- Changer carte graphique - Guide