Affichage de listes en fonction de boutons

Fermé
rokaya - 23 nov. 2011 à 14:15
Bablon Arnaud Messages postés 74 Date d'inscription jeudi 13 janvier 2011 Statut Contributeur Dernière intervention 9 décembre 2011 - 30 nov. 2011 à 15:49
Bonjour,

bonjour, j'ai 2 boutons radio et 2 listes, comment afficher chaque liste en fonction de chaque bouton radio, voici mon code mais je ne sais pas comment continuer:

<td><input type="radio" name="formation" value="0" id="radiobutton" />
<label for="radiobutton"><span class="gras1">Formation diplomante</span>
<input type="radio" name="formation" value="1" id="radio" />
<span class="gras1">Formation spécialisée</span></label></td>
</tr>
<tr valign="baseline">
<td align="right" nowrap class="gras1">Formation diplomante::</td>

<td><label for="select"></label>
<select name="select" id="select">
<?php

echo '<option value="-1">--liste specialite--</option>'."\n";
$result = mysql_query("SELECT * FROM specialite where id_form= 1 " );
while($data = mysql_fetch_array($result))
{
echo '<option value="'.$data['id_spec'].'">'.$data['nom_spec'];
echo '</option>'."\n";
}
echo '</select>'."\n";
?>


</select>
</td>
</tr>
<tr valign="baseline">
<td align="right" nowrap class="gras1">Formation spécialisée::</td>
<td><label for="label"></label>
<select name="select2" id="label">
<?php echo '<option value="-1">--liste specialite--</option>'."\n";
$result = mysql_query("SELECT * FROM specialite where id_form= 2 " );
while($data = mysql_fetch_array($result))
{
echo '<option value="'.$data['id_spec'].'">'.$data['nom_spec'];
echo '</option>'."\n";
}

echo '</select>'."\n";




?>rokaya

Messages: 1
Inscrit le: Mar 22 Nov 2011 14:32

A voir également:

3 réponses

Bablon Arnaud Messages postés 74 Date d'inscription jeudi 13 janvier 2011 Statut Contributeur Dernière intervention 9 décembre 2011 11
Modifié par Bablon Arnaud le 24/11/2011 à 01:29
Salut,
Sur tes radio tu peux utilisé des evenement (pour le coup utilise le onclick)
Pour cacher ou décacher une liste tu peux combiner du javascript et du CSS (par exemple : document.getElementById('id_select1').style.dispay = 'none';

En gros quand tu clique sur un de tes radio tu caches tes liste (display : none;) et tu décache celle que tu souhaites laissé visible (display :block)

Bien entendu si tu veux pouvoir cacher ou décacher tes liste (select ou autre...) il faut que tu leur donne un identifiant (select id="identifiant" name="..."> <div id=''). Une fois tes listes identifier tu pourra les récup en javascript et y appliquer différentes property CSS

J'pense que tu devrais t'en sortir avec ca.
0
Bonjour, voici le code que j'ai écris mais ça ne marche pas
function affichage1()
{
document.getElementById('formation1').style.display = 'none';
document.getElementById('formation2').style.display = 'block';
}
function affichage2()
{
document.getElementById('formation1').style.display = 'block';
document.getElementById('formation2').style.display = 'none';
}
<?php
<input type="radio" name="formation" value="0" id="formation1" onclick="affichage1()"/>
<input type="radio" name="formation" value="1" id="radio" onclick="affichage2()" />
<label for="select"></label>
<select name="select" id="formation1">
<label for="label"></label>
<select name="select" id="formation2">
0
Bablon Arnaud Messages postés 74 Date d'inscription jeudi 13 janvier 2011 Statut Contributeur Dernière intervention 9 décembre 2011 11
29 nov. 2011 à 21:15
<script type="text/javascript">
function display(id) {
document.getElementById('select_1').style.display = 'none';
document.getElementById('select_2').style.display = 'none';
document.getElementById(id).style.display = 'block';
}
</script>

<input type="radio" name="choix" onclick="display('select_1');" value="true" /> Choix 1 <br />
<input type="radio" name="choix" onclick="display('select_2');" value="true" /> Choix 2 <br />

<select name="select_1" id="select_1">
<option value="">Sélectionnez 1</option>
</select>
<select name="select_2" id="select_2">
<option value="">Sélectionnez 2</option>
</select>
0
Bablon Arnaud Messages postés 74 Date d'inscription jeudi 13 janvier 2011 Statut Contributeur Dernière intervention 9 décembre 2011 11
30 nov. 2011 à 15:49
dans ton cas le problème vient du mauvais placement de tes ID (un ID est un identifiant UNIQUE donc tu ne peux pas l'utilisé sur plusieurs balise. La w3c devrait te mettre une erreur si tu met un ID pareil sur 2 balises différentes, de plus javascript ne sera pas a quel identifiant tu fait référence quand tu fera un getElementById() )
0