[Javascript] Formulaire (bouton, input texte optionnels)

Formulaire (bouton, input texte optionnels) [Javascript] - Programmation

Marsh Posté le 26-07-2001 à 17:38:46    

J'ai un formulaire dont certains objets (imput text ou autre) qui doivent être affichés en fonction du choix d'un bouton radio.
Comment faire pour qu'ils s'affichent ou disparaisse en fonction du bouton radio.
Si c'est pas possible,  a t-il un autre moyen?

Reply

Marsh Posté le 26-07-2001 à 17:38:46   

Reply

Marsh Posté le 26-07-2001 à 20:51:59    

passe par des div et des innerhtml... ca devrait aller

Reply

Marsh Posté le 27-07-2001 à 10:04:58    

Merci, j'ai trouvé un exemple pil poil en recherchant div et inner html!
Merci, c'est plus facile quand on sait dans quelle direction chercher ;-)
 
Voici un exemple:
<HTML>
    <HEAD>
        <TITLE>Petit exemple DHTML</TITLE>
    </HEAD>
    <BODY>
        <DIV Id="ForTest">Old</DIV>
 
        <SCRIPT Language="Javascript">
        <!--
            var obj = document.getElementById("ForTest" );
            obj.innerHTML = '<DIV>Truc</DIV><DIV Id="inner">Machin</DIV>';
            document.getElementById("inner" ).innerHTML = "chose";
        //-->
        </SCRIPT>
    </BODY>
</HTML>

Reply

Marsh Posté le 27-07-2001 à 10:10:06    

C'est pas l'exemple que je voulais montrer, celui-ci est mieux:
 
<HTML>
    <HEAD>
        <TITLE>Petit exemple DHTML</TITLE>
    </HEAD>
    <BODY>
        <DIV>To : <SPAN Id="to"></SPAN></DIV>
        <DIV>From : <SPAN Id="from"></SPAN></DIV>
        <DIV>Subject : <SPAN Id="subject"></SPAN></DIV><HR>
 
        <DIV Id="body"></DIV><HR><BR>
 
        <INPUT Type="button" Value="Load mail" Id="btnLoad">
        <SCRIPT Language="Javascript">
        <!--
            function load() {
                obj = document.getElementById("to" )
                obj.innerHTML = "webmaster@infini-fr.com";
 
                obj = document.getElementById("from" )
                obj.innerHTML = "inconnu@mystere.com";
 
                obj = document.getElementById("subject" )
                obj.innerHTML = "Sujet carrément inconnu";
 
                obj = document.getElementById("body" )
                obj.innerHTML = "Ceci est le <B>corps</B> du mail";
            }
 
            document.getElementById("btnLoad" ).onclick = load;
        //-->
        </SCRIPT>
    </BODY>
</HTML>

Reply

Marsh Posté le 27-07-2001 à 13:13:30    

Encore mieux : tu ecris tes differents boutons dans des DIV differents, et tu rends invisibles ceux qui ne t'interessent pas ... ca te permet de pas tripatouiller au code HTML, et de pas avoir de surprises (ta page est statique).
 
Par exemple:
<DIV ID="div1" STYLE="display:none">
 
</DIV>
 
<DIV ID="div2" STYLE="display:block">
 
</DIV>
 
display:none rend ton div invisible (il est toujours accessible en javascript, mais n'est pas affiche), display:block le rend visible.
 
Tu controles l'affichage en changeant le style du DIV a la volee. J'ai un exemple comme ca avec une dizaine de DIVs qui agissent comme des tabs, ca marche pile poil

Reply

Marsh Posté le 27-07-2001 à 13:43:14    

C'est ce  que j'ai fait:
 
<HTML>
<HEAD>
<script>
          function territoire(){
                   document.all.txt_rayon.style.display="";
                   document.all.txt_commune.style.display="";
          }
          function departement(){
                   document.all.txt_rayon.style.display="none";
                   document.all.txt_commune.style.display="none";
          }
</script>
</HEAD>
<BODY>
 <CENTER>
     <B><H1>Veuillez cliquer sur la carte</H1></B>
 </CENTER>
 <TABLE>
  <TR>
    <FORM name="formulaire" action="carteliste.php">
    <TABLE>
        <TR>
           <TD>
               <input type="image" SRC="http://126.234.1.4/carte/carteliste2/france.gif" border="0">
           </TD>
           <TD>
               <CENTER>
                    <DIV ID="br_dept">
                        <SPAN>
                             <input type="radio" name="choixdept" value="dept" onclick="departement();" checked>Un département
                        </SPAN>
                    </DIV>
                    <DIV ID="be_ter">
                        <SPAN>
                             <input type="radio" name="choixdept" value="region" onclick="territoire();">Un territoire
                        </SPAN>
                    </DIV>
               </CENTER>
               <CENTER>
                    <br><br>
                    <DIV ID="txt_rayon" STYLE="display:none">
                        <SPAN>Rayon de la région : <input type="text" name="rayon" value="150"> (en km)
                        </SPAN>
                    </DIV>
               </CENTER>
               <CENTER>
                    <br><br>
                    <DIV ID="txt_commune" STYLE="display:none">
                        <SPAN>Centrer sur la commune : <input type="text" name="commune"> (Nom)
                        </SPAN>
                    </DIV>
               </CENTER>
            </TD>
        </TR>
     </TABLE>
     </FORM>
  </TR>
 </TABLE>
</BODY>
</HTML>
Mais ça marche sous IE et pas sous netscape???
Et toi ça marche sous les deux?
Tu vois une raison?

Reply

Marsh Posté le 27-07-2001 à 15:26:38    

ouais, j'avais oublie. Pour netscape c'est pas "block" et "none", mais un truc genre "hidden" et "visible", a confirmer (je suis carrement pas sur)

Reply

Marsh Posté le 27-07-2001 à 16:31:22    

mêmes erreurs avec hidden et visible :(

Reply

Marsh Posté le 27-07-2001 à 16:36:04    

Ben c'est normal, "document.all" c'est du IE, pour Netscape c'est different, genre "document.layers" (a tester, dans ma boite y'a que IE alors je sais pas trop)

Reply

Marsh Posté le 27-07-2001 à 17:02:27    

Désolé savais pas, connais pas bcp javascript!
 
Mais avec document.layers "document.layers has no properties"??

Reply

Marsh Posté le 27-07-2001 à 17:02:27   

Reply

Marsh Posté le 27-07-2001 à 17:06:21    

document.layer c'est un tableau, donc faut utiliser [ ] pour acceder a un layer en particulier.

Reply

Marsh Posté le 30-07-2001 à 09:50:27    

Comment savoir quel indice du tableau layers correspond à quel objet?
J'ai essayé de 0 à 5 et j'ai à chaque fois ce message :
 
Attempt to access nonexistent slot 1 of layers[] array.
 
avec cette ligne de commande:
document.layers[5].style.display="visible";

Reply

Marsh Posté le 30-07-2001 à 10:12:48    

J'avais besoin d'un truc comme çà pour faire un menu arborescent.
J'ai pompé celui d'une ancienne version de phpMyAdmin qui marche aussi bien avec IE qu'avec netscape 4.x mais pas avec netscape 6.
J'ai pas essayé avec la dernière version (2.2.0)!
 
http://phpmyadmin.sourceforge.net/


---------------
Laissez l'Etat dans les toilettes où vous l'avez trouvé.
Reply

Marsh Posté le 30-07-2001 à 11:32:44    

J'ai regardé mais je vois pas où ils changent l'attribut hidden en visible, j'ai pas trouvé de fonctions où l'attribut d'un objet passait de hidden en noneou visible?
T'as pas ton exemple STP?
En fait il me manque juste la ligne
document.layers[?].style.display=?? à moins que ce ne soit pas style.display
 
Vous savez pas ou je pourrais trouver un exemple du même style, j'ai rein trouvé sur www.allhtml.com et autres.
 
Merci

Reply

Marsh Posté le 31-07-2001 à 09:14:13    

ça marche toujours pas! ça m'énerve.
Y a pas quelqu'un qui pourrait montrer un exemple SVP?

Reply

Marsh Posté le 31-07-2001 à 11:02:15    

par ici la bonne sousoupe :
http://www.the-cool-place.co.uk/ja [...] ript1.html
 
en particulier point 2 : "Addressing our layer using JavaScript"
 
ou comment traiter le style (caché ou visible) d'un layer sous ie, ns4 et ns6.

Reply

Marsh Posté le 31-07-2001 à 11:39:56    

Merci!

Reply

Marsh Posté le 31-07-2001 à 11:49:59    

Carrément génial le site, très bien expliqué, très bien foutu et avec un exemple "live"!
 
Nice, yeah, cool haaaa! oups pardon!... je délire :)

Reply

Sujets relatifs:

Leave a Replay

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