Champs de selection interactif...

Champs de selection interactif... - HTML/CSS - Programmation

Marsh Posté le 24-11-2004 à 11:53:20    

Bonjour,
 
Voila, j'ai sur une page un champ de selection (<select> ) que j'ai rempli avec tout un tas de donnees issues d'une requete SQL.
 
J'ai rajoute a ce select un choix (<option> ) qui s'appelle "nouvel article"
 
Je voudrais que qd on choisit ce choix le select se transforme en zone de saisie text (<input> ) pour permettre a l'utilisateur de rentrer un article supplementaire qui n'est pas present dans la liste...
 
est ce possible??comment faire???
quel langage correspond le mieux a ca?? (je pensais javascript)
 
Merci

Reply

Marsh Posté le 24-11-2004 à 11:53:20   

Reply

Marsh Posté le 24-11-2004 à 12:14:04    

javascript obligatoire [:spamafote]
 
et fais en sorte qu'on puisse quand même utiliser le site sans javascript (que cette fonction puisse être remplacée par autre chose)


---------------
I mean, true, a cancer will probably destroy its host organism. But what about the cells whose mutations allow them to think outside the box, and replicate and expand beyond their wildest dreams by throwing away the limits imposed by overbearing genetic r
Reply

Marsh Posté le 24-11-2004 à 12:27:09    

essaye ça :
 
page.php

Code :
  1. <form name="formulaire">
  2. <div id="champSelect">
  3.   <select name="selection" onchange="changer()">
  4.     <option value="art01">article 1</option>
  5.     <option value="autre">autre article</option>
  6.   </select>
  7. </div>
  8. </form>


 
script.js

Code :
  1. function changer() {
  2.   if (document.formulaire.selection.value == "autre" ) {
  3.     document.getElementById('champSelect').innerHTML = '<input type="text" name="selection">';
  4.   }
  5. }


 
 
Edit :
en revanche, comme le dit masklinn, si javascript est désactivé, ça ne marchera pas.
Tu peux faire ça dans ce cas :
 
page.php

Code :
  1. <body onload="cacherInput()">
  2. <form name="formulaire">
  3. <div id="champSelect">
  4.   <select name="selection" onchange="changer()">
  5.     <option value="art01">article 1</option>
  6.     <option value="autre">autre article</option>
  7.   </select>
  8. </div>
  9. <div id="champInput">
  10.   Autre article : <input type="text" name="selectionInput">
  11. </div>
  12. </form>
  13. </body>


 
et le JS :
script.js

Code :
  1. function cacherInput() {
  2.   document.getElementById('champInput').visibility = "hidden";
  3. }
  4. function changer() {
  5.   if (document.formulaire.selection.value == "autre" ) {
  6.     document.getElementById('champInput').visibility = "visible";
  7.     document.getElementById('champSelect').visibility = "hidden";
  8.   }
  9. }


 
Comme ça, si javascript est désactivé, l'utilisateur voit quand-même le champ input.


Message édité par cosmoschtroumpf le 24-11-2004 à 12:31:56
Reply

Marsh Posté le 24-11-2004 à 13:51:11    

merci pour ton aide cosmoshtroumpf...ton bout de code a l'air de correspondre exactement a ce que je veux faire...
 
mais suis je blige de mettre la balise form??

Reply

Marsh Posté le 24-11-2004 à 13:54:35    

non, mais c'est conseillé
 
si tu le la mets pas, il faut faire if (document.selection.value == "" ) {

Reply

Marsh Posté le 24-11-2004 à 14:05:02    

je ne comprends pas...ca ne marche pas...pourtant j'ai fait comme tu m as dit
 
PS : comment inserer dans le post du code??

Reply

Marsh Posté le 24-11-2004 à 14:08:12    

ca c est le JS :

Code :
  1. <script language="JavaScript">
  2. function changer() {
  3.    if (document.select_rub_inter.value == "new_inter_rub" ) {
  4.      document.getElementById('champSelect').innerHTML = '<input type="text" name="rubrique">';
  5.    }
  6. }
  7. </script>


 
ca c'est le select:

Code :
  1. <td align="center" width="49%">
  2. <div id="champSelect">
  3. <select name="select_rub_inter" onchange="changer()">
  4.                       <?
  5.                     $query_rubrique_inter_tmp = mysql_query("SELECT DISTINCT rubrique FROM missions WHERE id_affaire='$id' ORDER BY rubrique ASC", $dbprotect);
  6.                     while ($rubrique_inter = mysql_fetch_assoc($query_rubrique_inter_tmp))
  7.                     {
  8.     ?>
  9.                       <option value="<? print $rubrique_inter['rubrique'] ?>"><? print $rubrique_inter['rubrique'] ?></option>
  10.                     <?
  11.                     }
  12.                
  13.     ?>
  14.                     <option value="new_inter_rub">Nouvelle rubrique...</option>
  15.     <option value="" selected>Choisir une rubrique...</option>
  16.         </select>
  17. </div>
  18. </td>


Message édité par kissskoool le 24-11-2004 à 14:21:32
Reply

Marsh Posté le 24-11-2004 à 14:10:37    

je n'ai pas testé, ce n'est pas dit que ça marche avec juste un copier-coller :D
 
pour le code, tu fais comme pour les quotes, mais avec cpp. Y'a un bouton "c/c++" au-dessus de ta fenetre de réponse.

Reply

Marsh Posté le 24-11-2004 à 14:12:56    

tu n'as pas mis de <div id="champSelect"> autour de ton select ? parce que là tu essayes de changer du html qui n'existe pas  [:petrus75]


Message édité par cosmoschtroumpf le 24-11-2004 à 14:13:27
Reply

Marsh Posté le 24-11-2004 à 14:22:28    

voila j'ai edite mon message ... et voila ce que j'ai maintenant...et ca ne marche tjs pas... ;(

Reply

Marsh Posté le 24-11-2004 à 14:22:28   

Reply

Marsh Posté le 24-11-2004 à 14:42:22    

c'est plutôt <script type="text/javascript">, mais c'est pas ça qui va faire marcher ton code.
 
sinon je sais pas trop... :spamafote:

Reply

Marsh Posté le 24-11-2004 à 14:51:24    

ok je vais chercher a droite a gauche ... en tout cas merci bcp...


Message édité par kissskoool le 24-11-2004 à 14:51:47
Reply

Sujets relatifs:

Leave a Replay

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