Discussion :

[BenoitDenis]

Bonjour,

j'ai deux listes, corresponddant chacune a un bouton radio

quand le bouton radio de la liste est coché je souhaite activer la liste et désactiver l'autre.

J'ai mis en place le code ci-dessous mais rien ne se passe.
Merci d'avance de votre aide.

Je débute en javascript alors désolé si la question vous parait idiote...

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
 
<script language="javascript">
      function disable(name){ 
        if(name == 'lieu'){
            document.getElementById('rad-option-lieu').disabled;
        }
        if(name == 'region'){
            document.getElementById('rad-option-region').disabled;
        }
      }
</script>
 
<?php
<tr>
      <td align=\"center\">";
      $query = "SELECT id_region, nom FROM loc_region";
      $result = requete_second($query);
      echo"
      <font size=\"2\">Sélectionnez une région</font><br /><select id=\"liste_region\" name=\"region\">";
      while($data = mysql_fetch_array($result))
        {
          echo"<option value=\"".$data['id']."\">".$data['nom']."</option>";
        }
      echo"</select>
      </td>
      <td align = 'left'>
        <input type='radio' name='search' value='region' id = \"rad-option-reg\" onclick=\"disable('lieu');\">
      </td>
    </tr>
    <tr>
      <td align=\"center\">";
      $tab=getListeLieux("2");
      echo"
      <font size=\"2\">Sélectionnez un lieu</font><br /><select id=\"liste_lieu\" name=\"lieu\">";
      foreach($tab as $key => $value)
        {
          echo"<option value=\"$key\">$value</option>";
        }
      echo"</select>
      </td>
      <td align = 'left'>
        <input type='radio' name='search' value='lieu' id = \"rad-option-lieu\" onclick=\"disable('region');\" checked>
      </td>
    </tr>
?>

[supermanu]

Regarde le post en dessous du tien :
http://www.developpez.net/forums/sho...d.php?t=136907

et remplace les checkbox par tes listes
(Il vaut mieux que tu poste le code html que tu obtiens dans ton navigateur en affichant la source, pour que l'on puisse tester sans le code php)

[BenoitDenis]

Je ne comprends pas tout, tu peut m'aider ?

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
 
<script language="javascript">
      function disable(name){ 
        if(name == 'lieu'){
            document.getElementById('liste_lieu').disable='true';
            document.getElementById('liste_region').disable='false';
        }
        if(name == 'region'){
            document.getElementById('liste_region').disable='true';
            document.getElementById('liste_lieu').disable='false';
        }
      }
</script>
 
<form method="post" action="listearrivant.php" id='form'>
<table>
<!-- bla bla bla -->
<tr>
    <td align="center">
        <font size="2">Sélectionnez une région</font><br /><select id="liste_region" name="region"><option value="">Test</option><option value="">VENDEE</option><option value="">PERIGORD</option><option value="">MORBIHAN</option><option value="">COTES D\'ARMOR</option><option value="">CHARENTES MARITIME</option><option value="">GIRONDE</option><option value="">COTE D\'AZUR</option><option value="">MANCHE</option><option value="">CALVADOS</option><option value="">LES LANDES</option><option value="">HERAULT</option><option value="">PYRENEES ORIENTALES</option><option value="">VIENNE</option><option value="">VALLEE DE LA LOIRE</option><option value="">SAVOIE</option><option value="">CORSE DU SUD</option><option value="">ALSACE</option><option value="">AUDE</option><option value="">VAR</option><option value="">ESPAGNE</option></select>
    </td>
    <td align = 'left'>
    <input type='radio' name='search' value='region' id = "rad-option-reg" onclick="disable('lieu');">
    </td>
</tr>
<tr>
    <td align="center">
      <font size="2">Sélectionnez un lieu</font><br /><select id="liste_lieu" name="lieu"><option value="26">2222</option><option value="1">3333</option><option value="80">4444</option><option value="81">5555</option><option value="82">6666</option><option value="34">AIGUILLON SUR MER "Bel Air"</option><option value="52">ANTIBES "Les Pins Bleus"</option><option value="55">ANTIBES "Open Golf Juan"</option><option value="54">ANTIBES "Villa du Parc"</option><option value="45">BEZIERS "Les Berges du Canal"</option><option value="63">BOOFZHEIM "Le Ried"</option><option value="37">CABOURG</option><option value="20">CALVIAC "Les Chênes Verts"</option><option value="23">CARNAC "Le Rosnual"</option><option value="38">FOURAS "Les Charmilles"</option><option value="69">GRUISSAN "Les Résidences"</option><option value="60">GUJAN MAESTRAS</option><option value="70">HOURTIN PORT "Résidence du Port"</option><option value="25">ILE DE RE "Les Peupliers" </option><option value="35">LA MOLE COGOLIN "Pachacaid"</option><option value="39">LA PALMYRE "Palmyre Loisirs"</option><option value="73">LA SALVETAT S/AGOUT "Domaine des Sources"</option><option value="61">LA TRANCHE SUR MER</option><option value="66">LE VERDON SUR MER "La Pointe du Médoc"</option><option value="42">LEON "Village sous les Pins"</option><option value="58">LES COCHES</option><option value="32">LES SABLES D'OLONNE "Les Roses"</option><option value="76">LLORET "ELS LORENS"</option><option value="33">LONGEVILLE SUR MER "Les Brunelles"</option><option value="51">MARIGNY BRIZAY "Moulin du Bois"</option><option value="78">MERIBEL MOTTARET "Résidence Club"</option><option value="65">MEZOS "Tropical Sen Yan"</option><option value="43">MOLIETS "St Martin"</option><option value="36">MONT SAINT MICHEL</option><option value="77">MONTIGNAC "Le Hameau du Moulin"</option><option value="64">NARBONNE "La Baie des Oliviers"</option><option value="15">NOIRMOUTIER</option><option value="40">OLERON "Beauxpins"</option><option value="41">OLERON "Domaine d'Oléron"</option><option value="44">ONDRES "Lou Pignada"</option><option value="24">PLESTIN LES GREVES "Village de l'Armorique"</option><option value="72">PORT COGOLIN "Village Marin"</option><option value="62">PROPRIANO "Tikiti"</option><option value="50">SAINT AYGULF "Le Grand Calme"</option><option value="22">SOUILLAC "Paille Basse"</option><option value="27">SOULAC SUR MER "Le Lihan"</option><option value="49">ST CYPRIEN "Le Fourty"</option><option value="48">ST CYPRIEN "Le Roussillon" </option><option value="67">ST CYPRIEN "Les Capucines"</option><option value="29">ST GILLES CROIX DE VIE "Bahamas"</option><option value="31">ST GILLES CROIX VIE "Beaulieu"</option><option value="28">ST JEAN DE MONTS "Le Vieux Ranch"</option><option value="75">ST SORLIN D'ARVES "Les Chalets de l'Arvan"</option><option value="16">ST VINCENT SUR JARD "Bolée d'Air"</option><option value="57">SUEVRES "LA GRENOUILLERE"</option><option value="47">TORREILLES "Le Trivoly"</option><option value="53">TOURRETTES SUR LOUP "Rives du Loup"</option><option value="74">VALMEINIER "Résidence L'Ours Blanc"</option><option value="59">VALMOREL "Cheval Blanc"</option><option value="68">VALRAS "Le Grand Bleu"</option><option value="46">VIAS "Les Heures Claires"</option></select>
    </td>
    <td align = 'left'>
      <input type='radio' name='search' value='lieu' id = "rad-option-lieu" onclick="disable('region');" checked>
    </td>
</tr>
<tr>
    <td align="center" colspan="2">
        <input type="submit" name="submit" value="Rechercher" />
    </td>
</tr>
</table>
</form>

[supermanu]

Voilà j'ai fait le bout de code suivant :

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
 
function activeDesactive(radio) {
        objForm = document.forms[0];
 
        if(radio[0].checked) {
            objForm.elements["lieu"].disabled = true;
            objForm.elements["region"].disabled = false;
 
        }
        else {
            objForm.elements["lieu"].disabled = false;
            objForm.elements["region"].disabled = true;
 
 
        }
    }

Je regarde le name des select en fait.

et dans les deux boutons radio, je met :

Code :

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

1
2
 
<input type='radio' name='search' value='lieu' id = "rad-option-lieu" onclick="activeDesactive(this.form.search);" checked>

this.form.search car le name du bouton est search.

Par contre tu devrais griser la première liste au tout début.

[BenoitDenis]

J'etait parti sur autre chose que j'ai trouvé dans la faq (http://javascript.developpez.com/sources/?page=forms), mais ca marche pas.... sniffff

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
 
<script language="javascript">
            function disableInput(idInput, valeur){
                var input = document.getElementById(idInput);
                input.disabled = valeur;
 
                if (valeur) {
                    input.style.background = "#CCC";
                    BSajoute(idInput);
                } else {
                    input.style.background = "#FFF";
                    BSsuppr(idInput);
                }
            }
 
            function BSajoute(idInput){
                for (var i = 0; i < tableauBS.length; i++) {
                    if (tableauBS[i] == idInput) {
                        return;
                    }
                }
                tableauBS.push(idInput);
            }
 
            function BSsuppr(idInput){
                for (var i = 0; i < tableauBS.length; i++) {
                    if (tableauBS[i] == idInput) {
                        //alert(idInput + " supprimé à la position " + i + "\n" +tableauBS);
                        tableauBS.splice(i, 1);
                        return;
                    }
            }
            function disable(name){ 
                if(name == 'lieu'){
                    disableInput('liste_lieu',true);
                    disableInput('liste_region',false);
                }
                if(name == 'region'){
                    disableInput('liste_region',true);
                    disableInput('liste_lieu',false);
                }
            }
    </script>
</tr>
    <tr>
      <td align="center">
      <font size="2">Sélectionnez une région</font><br /><select id="liste_region" name="region" disabled><option value="">Test</option><option value="">VENDEE</option><option value="">PERIGORD</option><option value="">MORBIHAN</option><option value="">COTES D\'ARMOR</option><option value="">CHARENTES MARITIME</option><option value="">GIRONDE</option><option value="">COTE D\'AZUR</option><option value="">MANCHE</option><option value="">CALVADOS</option><option value="">LES LANDES</option><option value="">HERAULT</option><option value="">PYRENEES ORIENTALES</option><option value="">VIENNE</option><option value="">VALLEE DE LA LOIRE</option><option value="">SAVOIE</option><option value="">CORSE DU SUD</option><option value="">ALSACE</option><option value="">AUDE</option><option value="">VAR</option><option value="">ESPAGNE</option></select>
      </td>
      <td align = 'left'>
        <input type='radio' name='search' value='region' id = "rad-option-reg" onclick="disable('lieu');">
      </td>
    </tr>
    <tr>
      <td align="center">
      <font size="2">Sélectionnez un lieu</font><br /><select id="liste_lieu" name="lieu"><option value="26">2222</option><option value="1">3333</option><option value="80">4444</option><option value="81">5555</option><option value="82">6666</option><option value="34">AIGUILLON SUR MER "Bel Air"</option><option value="52">ANTIBES "Les Pins Bleus"</option><option value="55">ANTIBES "Open Golf Juan"</option><option value="54">ANTIBES "Villa du Parc"</option><option value="45">BEZIERS "Les Berges du Canal"</option><option value="63">BOOFZHEIM "Le Ried"</option><option value="37">CABOURG</option><option value="20">CALVIAC "Les Chênes Verts"</option><option value="23">CARNAC "Le Rosnual"</option><option value="38">FOURAS "Les Charmilles"</option><option value="69">GRUISSAN "Les Résidences"</option><option value="60">GUJAN MAESTRAS</option><option value="70">HOURTIN PORT "Résidence du Port"</option><option value="25">ILE DE RE "Les Peupliers" </option><option value="35">LA MOLE COGOLIN "Pachacaid"</option><option value="39">LA PALMYRE "Palmyre Loisirs"</option><option value="73">LA SALVETAT S/AGOUT "Domaine des Sources"</option><option value="61">LA TRANCHE SUR MER</option><option value="66">LE VERDON SUR MER "La Pointe du Médoc"</option><option value="42">LEON "Village sous les Pins"</option><option value="58">LES COCHES</option><option value="32">LES SABLES D'OLONNE "Les Roses"</option><option value="76">LLORET "ELS LORENS"</option><option value="33">LONGEVILLE SUR MER "Les Brunelles"</option><option value="51">MARIGNY BRIZAY "Moulin du Bois"</option><option value="78">MERIBEL MOTTARET "Résidence Club"</option><option value="65">MEZOS "Tropical Sen Yan"</option><option value="43">MOLIETS "St Martin"</option><option value="36">MONT SAINT MICHEL</option><option value="77">MONTIGNAC "Le Hameau du Moulin"</option><option value="64">NARBONNE "La Baie des Oliviers"</option><option value="15">NOIRMOUTIER</option><option value="40">OLERON "Beauxpins"</option><option value="41">OLERON "Domaine d'Oléron"</option><option value="44">ONDRES "Lou Pignada"</option><option value="24">PLESTIN LES GREVES "Village de l'Armorique"</option><option value="72">PORT COGOLIN "Village Marin"</option><option value="62">PROPRIANO "Tikiti"</option><option value="50">SAINT AYGULF "Le Grand Calme"</option><option value="22">SOUILLAC "Paille Basse"</option><option value="27">SOULAC SUR MER "Le Lihan"</option><option value="49">ST CYPRIEN "Le Fourty"</option><option value="48">ST CYPRIEN "Le Roussillon" </option><option value="67">ST CYPRIEN "Les Capucines"</option><option value="29">ST GILLES CROIX DE VIE "Bahamas"</option><option value="31">ST GILLES CROIX VIE "Beaulieu"</option><option value="28">ST JEAN DE MONTS "Le Vieux Ranch"</option><option value="75">ST SORLIN D'ARVES "Les Chalets de l'Arvan"</option><option value="16">ST VINCENT SUR JARD "Bolée d'Air"</option><option value="57">SUEVRES "LA GRENOUILLERE"</option><option value="47">TORREILLES "Le Trivoly"</option><option value="53">TOURRETTES SUR LOUP "Rives du Loup"</option><option value="74">VALMEINIER "Résidence L'Ours Blanc"</option><option value="59">VALMOREL "Cheval Blanc"</option><option value="68">VALRAS "Le Grand Bleu"</option><option value="46">VIAS "Les Heures Claires"</option></select>
      </td>
      <td align = 'left'>
        <input type='radio' name='search' value='lieu' id = "rad-option-lieu" onclick="disable('region');" checked>
      </td>
    </tr>

[supermanu]

Chez moi le problèpme vient de BSajoute(idInput); et BSsuppr(idInput);
Je n'ai pas ces fonctions donc ça plante.

J'ai regardé avec la console javascript de firefox

Mais si je les commente ça marche !

[BenoitDenis]

Je viens de mettre a jour mon post précédent, je m'était aussi apercu qu'il manquait ces deux fonctions...

[supermanu]

Il manque une accolade dans la fonction BSsuppr et le tableau n'est pas défini.

[BenoitDenis]

C'est bon pour l'accolade

Mais ce tableau c'est quoi ? Dans la FAQ non plus il n'est pas défini...

http://javascript.developpez.com/sources/?page=forms
1er article

[BenoitDenis]

En fait en ce moment ca desactive bien l'autre liste mais ca active pas la liste que j'ai choisit...

[supermanu]

Mets en commentaire BSajoute(idInput); et BSsuppr(idInput); , ça marchera.
Je ne sais pas trop à quoi elles servent

[BenoitDenis]

En effet ca marche très bien sans...

merci beaucoup de ton aide...