Discussion :

[student_php]

Bonjour,

Après quelques recherches, j'ai découvert la fonction onchange, (jusqu'ici je connaissais que onclick), mon but est simple, faire apparaître/disparaître des champs de formulaire "DU: JJ/MM/AAA AU: JJ/MM/AAA" (les mots "DU" et "AU" sont entre les balises <label>, je ne sais pas si ils disparaitrons bien en même temps que les champs grâce à ce détail...) en fonction de ce que l'utilisateur sélectionne dans une liste déroulante (si il sélectionne une date).

J'ai essayé d'adapter ce que je savais faire avec onclick mais cela ne produit aucun effet, voici mon code:

Le formulaire:

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
<form action="traitement_courrier.php" method="post">
<select name="trie">
    <option value="creation_courrier" onchange="changement_list()">Date de création du courrier</option>
    <option value="redirection_service">Date de redirection par le service</option>
    <option value="reception_service">Date de reception par le service service</option>
    <option value="objet">Objet</option>
	<option value="expediteur">Expéditeur</option>
	<option selected="selected" value="sortie_max">Jours restants avant réponse</option>
 
</select>
<label for="jour_begin">DU</label>
<select name="jour_begin">
	<option value="1">1</option>
</select>
<label for="mois_begin"></label>
<select name="mois_begin">
	<option value="1">1</option>
</select>
<label for="annee_begin"></label>
<select name="annee_begin">
	<option value="1">1</option>
</select>
<label for="jour_end">AU</label>
<select name="jour_end">
	<option value="1">1</option>
</select>
<label for="mois_end"></label>
<select name="mois_end">
	<option value="1">1</option>
</select>
<label for="annee_end"></label>
<select name="annee_end">
	<option value="1">1</option>
</select>

La fonction javascript:

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
function changement_list()
{
   if (document.getElementById("creation_courrier").selected)
   {
		document.getElementById("jour_begin").disabled=false;
		document.getElementById("mois_begin").disabled=false;
		document.getElementById("annee_begin").disabled=false;
		document.getElementById("jour_end").disabled=false;
		document.getElementById("mois_end").disabled=false;
		document.getElementById("annee_end").disabled=false;
   }
   else
      {
		document.getElementById("jour_begin").disabled=true;
		document.getElementById("mois_begin").disabled=true;
		document.getElementById("annee_begin").disabled=true;
		document.getElementById("jour_end").disabled=true;
		document.getElementById("mois_end").disabled=true;
		document.getElementById("annee_end").disabled=true;
   }
}

Merci de m'éclairer sur la bonne utilisation de onchange, aussi je préférerais cacher et non grisé la partie inexploitable selon le choix de l'utilisateur dans la liste déroulante, si cela ne demande pas un niveau trop élevé !

Merci !

[vermine]

Bonjour,

Pour cacher/afficher c'est :

Code js :

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

1
2
3
 
document.getElementById("jour_begin").style.display="none";
document.getElementById("jour_begin").style.display="";

Ensuite, getElementById demande un id. Ce que vous n'avez pas sur vos champs.

Et finalement, vu que vous voulez tout cacher, il serait plus simple de mettre tous ces champs dans une <div> et c'est uniquement elle que vous afficheriez/cacheriez.

[coach759]

Bonjour

Déjà ton onchange se met sur la balise select et non sur une option

Code :

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

 <select name="trie" id="trie" onchange="changement_list();"  >

Et puis regroupe tes labels et tes inputs dans un div comme ceci:

Code :

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

1
2
3
4
5
6
7
8
9
10
  <div id="form_date">
     <label for="jour_begin">DU</label>
     <select name="jour_begin">
          <option value="1">1</option>
     </select>
      ......
      Tout tes labels et input
      ......
   </div>

Ensuite dans ton javascript tu fais:

Code :

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

1
2
3
4
5
6
if (document.getElementById("trie").value=="creation_courrier"){
    document.getElementById("form_date").style.display="none";
}
else{
    document.getElementById("form_date").style.display="block";
}

J'espère que tu as compris, sinon n'hésite pas

[student_php]

Je ne pouvais pas espérer plus clair, rapide et efficace !

Merci encore pour vos réponses !