Griser un/des champs en fonction d'une liste de choix.

Griser un/des champs en fonction d'une liste de choix. - HTML/CSS - Programmation

Marsh Posté le 06-02-2003 à 21:54:00    

Je suis bien dégouté parceque je suis tombé sur ce genre de script hier et pas moyen de retrouver le site.
 
Le but est d'avoir un formulaire avec une liste du genre :
- Choix 1
- Choix 2
- Choix 3
 
Et en fonction du champs sélectionner, les autres champs se "grisent" pour ne pas qu'ils soient utilisés.
 
Voilà, merci !!!  
 
:hello:

Reply

Marsh Posté le 06-02-2003 à 21:54:00   

Reply

Marsh Posté le 15-02-2003 à 10:02:52    

:bounce:

Reply

Marsh Posté le 15-02-2003 à 11:48:06    

:bounce:

Reply

Marsh Posté le 15-02-2003 à 21:11:23    

:bounce:

Reply

Marsh Posté le 15-02-2003 à 23:46:27    

:bounce:

Reply

Marsh Posté le 15-02-2003 à 23:59:35    

je pense qu'il faut utiliser "onFocus" et demande un "disabled" pour les champs correspants à l option de la liste de choix sélectionnée

Reply

Marsh Posté le 18-02-2003 à 07:03:41    

:bounce:

Reply

Marsh Posté le 18-02-2003 à 10:25:38    

Ta liste, c quoi ?
une combo, des radio boutons, des checkbox ?
S'il s'agit d'une liste, alors sur la fonction onChange(), tu fais

Code :
  1. document.getElementById("idDeTaListe" ).disabled = "true";


 

Reply

Marsh Posté le 18-02-2003 à 16:37:23    

walli a écrit :

Ta liste, c quoi ?
une combo, des radio boutons, des checkbox ?
S'il s'agit d'une liste, alors sur la fonction onChange(), tu fais

Code :
  1. document.getElementById("idDeTaListe" ).disabled = "true";


 
C'est ce type de liste :
 


 

Code :
  1. <select name="type" id="type">
  2.             <option value='1'>1 - S'inscrire et créer votre équipe.</option>
  3.             <option value='2'>2 - S'inscrire dans votre équipe.</option>
  4.             <option value='3'>3 - S'inscrire en tant que joueur solo.</option>
  5.           </select>
  8. <input name="nom_team" type="text" id="nom_team" size="30">
  9. <input name="nom_team2" type="text" id="nom_team2" size="30">


Message édité par Master_Jul le 18-02-2003 à 16:38:19
Reply

Marsh Posté le 18-02-2003 à 16:44:36    

Code :
  1. <select name="type" id="type" onChange="griserChamps()";>
  2.            <option value='1'>1 - S'inscrire et créer votre équipe.</option>
  3.            <option value='2'>2 - S'inscrire dans votre équipe.</option>
  4.            <option value='3'>3 - S'inscrire en tant que joueur solo.</option>
  5.          </select>


 
et dans ta function griserChamp() tu fais :

Code :


 
 

Reply

Marsh Posté le 18-02-2003 à 16:44:36   

Reply

Marsh Posté le 18-02-2003 à 16:46:27    

Code :
  1. <select name="type" id="type" onChange="griserChamps()";>
  2.            <option value='1'>1 - S'inscrire et créer votre équipe.</option>
  3.            <option value='2'>2 - S'inscrire dans votre équipe.</option>
  4.            <option value='3'>3 - S'inscrire en tant que joueur solo.</option>
  5.          </select>


 
et dans ta function griserChamp() tu fais :

Code :
  1. if (document.getElementById('type').value="1" )
  2.    document.getElementById('nom_type').disabled="true";


 
 

Reply

Marsh Posté le 18-02-2003 à 16:47:26    

je dois mettre quoi où ? merci

Reply

Marsh Posté le 18-02-2003 à 16:55:25    

Code :
  1. <html>
  2.   <head>
  3.   <script language="JavaScript" >
  4.   function griserChamp()
  5.   { 
  6.       ...
  7.   }
  8.   </script>
  9.   </head>
  10.  
  11.   <body> ta liste
  13.   </body>
  14. </html>


 

Reply

Marsh Posté le 21-02-2003 à 18:30:13    

merci de ton aide, ça commence à un peu mieux marcher mais y'a des problèmes, voilà le code qui est dans le head :
 

Code :
  1. <script language="JavaScript" >
  2.     function griserChamp()
  3.     { 
  4.      if (document.getElementById('type').value="1" )
  5.    document.getElementById('selected_team').disabled="true";
  6.    document.getElementById('team_pass3').disabled="true";
  7.  
  8.    if (document.getElementById('type').value="2" )
  9.        document.getElementById('nom_team').disabled="true";
  10.    document.getElementById('nom_team2').disabled="true";
  11.    document.getElementById('team_pass').disabled="true";
  12.    document.getElementById('team_pass2').disabled="true";
  13.  
  14.    if (document.getElementById('type').value="3" )
  15.    document.getElementById('nom_team').disabled="true";
  16.    document.getElementById('nom_team2').disabled="true";
  17.    document.getElementById('team_pass').disabled="true";
  18.    document.getElementById('team_pass2').disabled="true";
  19.    document.getElementById('selected_team').disabled="true";
  20.    document.getElementById('team_pass3').disabled="true";
  21.     }
  22.     </script>


 
Et dans le body :
 

Code :
  1. <select name="type" id="type" onChange="griserChamp()">
  2.             <option value='1'>1 - S'inscrire et créer votre équipe.</option>
  3.             <option value='2'>2 - S'inscrire dans votre équipe.</option>
  4.             <option value='3'>3 - S'inscrire en tant que joueur solo.</option>
  5.           </select>
  7. <input name="nom_team" type="text" id="nom_team" size="30">


 
J'ai plusieurs problèmes, quand j'arrive sur la page, il faudrait que l'état par défaut de ma liste "désactive" les cases, ah j'ai une idée pour ça, je vais les désactiver par défaut, on va voir si ça marche
 
ensuite, qd c'est désactivé, on ne peut pas rentrer de donnés, mais j'aimerai qu'elles apparaissent ainsi grisées, pour pas qu'on croit au "bug"
 
et puis le dernier problème est avec ma liste, dès que je sélectionne une option, ça se remet automatiquemnt sur la 3ème proposition et ça ne veut plus bouger
 
merci !

Reply

Marsh Posté le 12-04-2003 à 18:16:34    

:bounce:

Reply

Marsh Posté le 26-04-2003 à 21:56:10    

:bounce:

Reply

Marsh Posté le 27-04-2003 à 11:16:47    

:bounce:

Reply

Marsh Posté le 28-04-2003 à 16:25:49    

:bounce:

Reply

Marsh Posté le 29-04-2003 à 20:22:20    

:bounce:

Reply

Marsh Posté le 30-04-2003 à 12:50:12    

:bounce:

Reply

Marsh Posté le 30-04-2003 à 14:03:57    

:bounce:

Reply

Marsh Posté le 03-05-2003 à 00:56:03    

:bounce:

Reply

Marsh Posté le 03-05-2003 à 12:45:48    

:bounce:

Reply

Marsh Posté le 04-05-2003 à 20:49:32    

:bounce:

Reply

Marsh Posté le 06-05-2003 à 09:21:40    

:bounce:

Reply

Marsh Posté le 06-05-2003 à 20:32:29    

:bounce:

Reply

Marsh Posté le 06-05-2003 à 21:41:04    

Tu peux filer le contenu de ton body en entier s'il te plait ?
(pas le courage de le refaire ;) )
 
edit :  
Déja ajoute au  niveau de ton script :  

Code :
  1. <script language="JavaScript" > 
  2.    function griserChamp() 
  3.    {   
  4.     if (document.getElementById('type').value=="1" ) 
  5.     {
  6.       document.getElementById('selected_team').disabled="true";
  7.       document.getElementById('team_pass3').disabled="true";
  8.     }
  9.    if (document.getElementById('type').value=="2" )
  10.    {
  11.       document.getElementById('nom_team').disabled="true";
  12.       document.getElementById('nom_team2').disabled="true";
  13.       document.getElementById('team_pass').disabled="true";
  14.       document.getElementById('team_pass2').disabled="true";
  15.    }
  16.    if (document.getElementById('type').value=="3" )
  17.    { 
  18.       document.getElementById('nom_team').disabled="true";
  19.       document.getElementById('nom_team2').disabled="true";
  20.       document.getElementById('team_pass').disabled="true";
  21.       document.getElementById('team_pass2').disabled="true";
  22.       document.getElementById('selected_team').disabled="true";
  23.      document.getElementById('team_pass3').disabled="true";
  24.    }   } 
  25.    </script>

 
 
ajoute ce qui est en gras, ça devrait déjà te corriger certaines erreurs ;)
pour le reste quel comportement souhaites tu exactement ?


Message édité par walli le 06-05-2003 à 22:11:36

---------------
NP :
Reply

Marsh Posté le 07-05-2003 à 19:54:00    

Un grand merci à toi walli :)  :hello:  
 
Tout marche pour le mieux, je n'ai rencontré qu'un petit problème étrange, c'est que les "false" ne passaient pas lorsqu'ils avaient des guillemets, je les ai simplement enlevés et tout marche impécable ! Encore merci, voila une page "d'exemple" :
 
http://www.masterjul.net/vrac/walli.php
 
et mon code final :
 
dans le head :
 

Code :
  1. <script language="JavaScript" > 
  2.      function griserChamp() 
  3.      {   
  4.         if (document.getElementById('type').value=="1" ) 
  5.         {
  6.             document.getElementById('selected_team').disabled=true; 
  7.             document.getElementById('team_pass3').disabled=true;
  9.   document.getElementById('nom_team').disabled=false; 
  10.             document.getElementById('nom_team2').disabled=false; 
  11.             document.getElementById('team_pass').disabled=false; 
  12.             document.getElementById('team_pass2').disabled=false; 
  13.         }
  14.        if (document.getElementById('type').value=="2" )
  15.        { 
  16.             document.getElementById('nom_team').disabled=true; 
  17.             document.getElementById('nom_team2').disabled=true; 
  18.             document.getElementById('team_pass').disabled=true; 
  19.             document.getElementById('team_pass2').disabled=true;
  21.   document.getElementById('selected_team').disabled=false; 
  22.             document.getElementById('team_pass3').disabled=false;
  23.        } 
  24.        if (document.getElementById('type').value=="3" ) 
  25.        {   
  26.             document.getElementById('nom_team').disabled="true"; 
  27.             document.getElementById('nom_team2').disabled="true"; 
  28.             document.getElementById('team_pass').disabled="true"; 
  29.             document.getElementById('team_pass2').disabled="true"; 
  30.             document.getElementById('selected_team').disabled="true"; 
  31.            document.getElementById('team_pass3').disabled="true"; 
  32.        }   } 
  33.        </script>

 
 
dans le body :
 

Code :
  1. <select name="type" id="type" onChange="griserChamp()";>
  2.             <option value='1'>1 - S'inscrire et créer votre équipe.</option>
  3.             <option value='2'>2 - S'inscrire dans votre équipe.</option>
  4.             <option value='3'>3 - S'inscrire en tant que joueur solo.</option>
  5.           </select>


 
 :love:  :hello:  :)  :jap:

Reply

Marsh Posté le    

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed