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)


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
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