Affichage résultat d'une liste déroulante
Tinou90
-
arthezius Messages postés 3538 Date d'inscription Statut Membre Dernière intervention -
arthezius Messages postés 3538 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
je souhaiterais créer une liste déroulante et lorsqu'on fait un choix dans cette liste, la résultat correspondant (page html) s'ouvre dans la même page en dessous de la liste dans la balise <div> que j'ai créé et appelé 'dateContenu' mais je n'y arrive pas.
Le résultat s'ouvre à la place de la page actuelle.
Est-ce que vous qq'un aurait une solution, svp ?
Voici mon code :
<body>
<div id="haut" align="center">
<img src="images/bandeau.png">
<TABLE width="100%" border="0">
<tr>
<td width="50%" align="center">
<table>
<tr>
<td align="center">
<select name="choix" onchange="document.location.href=this.value;">
<option value="">Choisissez une option</option>
<option value="2512.html">Ajouter</option>
<option value="vide.html">Modifier</option>
<option value="test.html">Supprimer</option>
</select>
</td>
</tr>
<tr>
<td>
<div id="dateContenu" align="center">test</div>
</td>
</tr>
</table>
</TD>
</TR>
</table>
</div>
</body>
je souhaiterais créer une liste déroulante et lorsqu'on fait un choix dans cette liste, la résultat correspondant (page html) s'ouvre dans la même page en dessous de la liste dans la balise <div> que j'ai créé et appelé 'dateContenu' mais je n'y arrive pas.
Le résultat s'ouvre à la place de la page actuelle.
Est-ce que vous qq'un aurait une solution, svp ?
Voici mon code :
<body>
<div id="haut" align="center">
<img src="images/bandeau.png">
<TABLE width="100%" border="0">
<tr>
<td width="50%" align="center">
<table>
<tr>
<td align="center">
<select name="choix" onchange="document.location.href=this.value;">
<option value="">Choisissez une option</option>
<option value="2512.html">Ajouter</option>
<option value="vide.html">Modifier</option>
<option value="test.html">Supprimer</option>
</select>
</td>
</tr>
<tr>
<td>
<div id="dateContenu" align="center">test</div>
</td>
</tr>
</table>
</TD>
</TR>
</table>
</div>
</body>
A voir également:
- Affichage résultat d'une liste déroulante
- Liste déroulante excel - Guide
- Liste déroulante en cascade - Guide
- Resultat foot - Télécharger - Vie quotidienne
- Liste déroulante google sheet - Accueil - Guide bureautique
- Liste code ascii - Guide
4 réponses
Dans l'entête de la page et en partant du principe que celle-ci s'appelle page.php:
Dans ton div dateContenu:
Voilà qui devrait fonctionner!
<?php
if(isset($_POST['choix']) && !empty($_POST['choix']))
{
header('Location: page.php?page='.$_POST['choix'].'');
exit();
}
?>
Dans ton div dateContenu:
<div id="dateContenu" align="center">
<?php
if(isset($_GET['page']) && file_exists($_GET['page']))
{
include($_GET['page']);
}
elseif(isset($_GET['page']) && !file_exists($_GET['page']))
{
echo'La page est introuvable.';
}
?>
</div>
Voilà qui devrait fonctionner!
une autre solution:
tu peux aussi ne pas utiliser <table> et faire tout avec deux div et du CSS
<body>
<div id="haut" align="center">
<img src="images/bandeau.png">
<TABLE width="100%" border="0">
<tr>
<td width="50%" align="center">
<table>
<tr>
<td align="center">
<form name="form1" action="" method="post">
<select name="choix" onchange="submit()">
<option value="-1">Choisissez une option</option>
<option value="2512.html">Ajouter</option>
<option value="vide.html">Modifier</option>
<option value="test.html">Supprimer</option>
</select>
</form>
</td>
</tr>
<tr>
<td>
<div id="dateContenu" align="center">
<?php
if(isset($_POST['choix']) && $_POST['choix'] != "-1" && file_exists($_POST['choix']) )
{
include($_POST['choix']);
}
elseif(isset($_POST['choix']) && $_POST['choix'] != "-1" && !file_exists($_POST['choix']))
{
echo'La page est introuvable.';
}
?>
</div>
</td>
</tr>
</table>
</TD>
</TR>
</table>
</div>
</body>
tu peux aussi ne pas utiliser <table> et faire tout avec deux div et du CSS
Super merci Alain_42 !
j'ai encore un petit souci : après avoir fait mon choix dans la liste déroulante, la page s'affiche correctement en dessous, par contre la valeur de la liste déroulante ne reste pas avec celle que j'ai choisi mais elle revient sur "Choisissez une option".
Sais-tu ce qu'il faut faire pour qu'elle garde la valeur ?
j'ai encore un petit souci : après avoir fait mon choix dans la liste déroulante, la page s'affiche correctement en dessous, par contre la valeur de la liste déroulante ne reste pas avec celle que j'ai choisi mais elle revient sur "Choisissez une option".
Sais-tu ce qu'il faut faire pour qu'elle garde la valeur ?
ok, modifie cette partie ainsi:
<form name="form1" action="" method="post">
<select name="choix" onchange="submit()">
<option value="-1" <?php if(isset($_POST['choix']) && $_POST['choix']=="-1"){echo "selected"}?> >Choisissez une option</option>
<option value="2512.html" <?php if(isset($_POST['choix']) && $_POST['choix']=="2512.html"){echo "selected"}?> >Ajouter</option>
<option value="vide.html" <?php if(isset($_POST['choix']) && $_POST['choix']=="vide.html"){echo "selected"}?> >Modifier</option>
<option value="test.html" <?php if(isset($_POST['choix']) && $_POST['choix']=="test.html"){echo "selected"}?> >Supprimer</option>
</select>
</form>
j'ai oublié le ; après les echo "selected";
Le seul souci avec cette solution, c'est que tu dois valider le formulaire pour faire apparaître le bloc avec l'include.
Ma solution en faisant passer le contenu de la variable $_POST dans l'url, ça évite les problèmes en cas d'actualisation de la page ou plus simplement permet de faire un lien et ou facilite les marques pages vers ce contenu.
J'y vois personnellement des avantages.
Firefox à la fâcheuse habitude d'afficher un message pour confirmer le fait de conserver les valeurs envoyé par un formulaire si on actualise la page de traitement (ce qu'Opera ne fait pas par exemple).
On sais tous par expérience que certaines personnes sont allergique aux messages qui apparaisse et les fermes sans les lire et donc en comprendre le pourquoi du comment.
Ma solution en faisant passer le contenu de la variable $_POST dans l'url, ça évite les problèmes en cas d'actualisation de la page ou plus simplement permet de faire un lien et ou facilite les marques pages vers ce contenu.
J'y vois personnellement des avantages.
Firefox à la fâcheuse habitude d'afficher un message pour confirmer le fait de conserver les valeurs envoyé par un formulaire si on actualise la page de traitement (ce qu'Opera ne fait pas par exemple).
On sais tous par expérience que certaines personnes sont allergique aux messages qui apparaisse et les fermes sans les lire et donc en comprendre le pourquoi du comment.