Generer des input apartir d'un champs select

Bonjour,

J'ai un formulaire comme suit et je voudrai faire une gestion dynamique avec javascript mais pas évident pour moi.

 

<tr><td nowrap="nowrap">Nombre de fraction:</td>

         <td nowrap="nowrap">

                 <select name="nb_fractions"  onChange="ajout_form(formulaire);"/>

                             <option value="" ></option>

                             <option value="1" >1 - Fraction</option>

                             <option value="2" >2 - Fraction</option>

                             <option value="4" >4 - Fraction</option>

                  </select></td></tr>

 

En effet, je voudrai que a chaque fois l'utilisateur  sélectionne une option, exemple option 2-Fraction que le script  génère automatiquement  deux lignes de champs de saisie.

Ayant un niveau null en javascript j'ai ecrit la function imcomplète ci dessous pour traiter le formulaire ci dessus.

Si vous avez des idées pour me donner un coups de pousse.

Merci d'avance

 

function ajout_form(formulaire) {
    
    var lavaleur= formulaire.nb_fractions.selectedIndex;
    if(lavaleur = =1){
        //alert("La valeur de l\'élément " + (formulaire.nb_fractions.selectedIndex ));
        var text = '<tr><td nowrap="nowrap">Seuil superieur:</td><td><input type="text" size =2 name="seul_sup">     </td><td nowrap="nowrap">seul_inferieur :</td><td><input type="text" size =2 name="seuil_inf"></td><td nowrap="nowrap">Valeur :</td><td><input type="text" size =5 name="valeur"></td></tr><br/>';
       
    }
    if(lavaleur = =2){
       var text = '<tr><td nowrap="nowrap">Seuil superieur:</td><td><input type="text" size =2 name="seul_sup">     </td><td nowrap="nowrap">seul_inferieur :</td><td><input type="text" size =2 name="seuil_inf"></td><td nowrap="nowrap">Valeur :</td><td><input type="text" size =5 name="valeur"></td></tr><br/>';
var text = '<tr><td nowrap="nowrap">Seuil superieur:</td><td><input type="text" size =2 name="seul_sup">     </td><td nowrap="nowrap">seul_inferieur :</td><td><input type="text" size =2 name="seuil_inf"></td><td nowrap="nowrap">Valeur :</td><td><input type="text" size =5 name="valeur"></td></tr><br/>';
    }
    if(lavaleur = = 3){
         var text = '<tr><td nowrap="nowrap">Seuil superieur:</td><td><input type="text" size =2 name="seul_sup">     </td><td nowrap="nowrap">seul_inferieur :</td><td><input type="text" size =2 name="seuil_inf"></td><td nowrap="nowrap">Valeur :</td><td><input type="text" size =5 name="valeur"></td></tr><br/>';
var text = '<tr><td nowrap="nowrap">Seuil superieur:</td><td><input type="text" size =2 name="seul_sup">     </td><td nowrap="nowrap">seul_inferieur :</td><td><input type="text" size =2 name="seuil_inf"></td><td nowrap="nowrap">Valeur :</td><td><input type="text" size =5 name="valeur"></td></tr><br/>'
var text = '<tr><td nowrap="nowrap">Seuil superieur:</td><td><input type="text" size =2 name="seul_sup">     </td><td nowrap="nowrap">seul_inferieur :</td><td><input type="text" size =2 name="seuil_inf"></td><td nowrap="nowrap">Valeur :</td><td><input type="text" size =5 name="valeur"></td></tr><br/>'
    }
  
   
}

bonjour,
>>...génère...deux lignes de champs de saisie...
soit document.createElement balise voulue + conteneur.appendChild
soit conteneur.innerHTML+= balise voulue
@+

Ok.
J'ai défini mes balises HTML dans la variable var text.
Je voudrai afficher le contenu de var text aussi tot après le select dans mon formulaire.
Je ne vois pas exactement ce qu'il faut mettre dans conteneur.
J'ai essayé:  

 formulaire.nb_fractions.value.innerHTML+= text;

Mais ça ne marche pas.

>>formulaire.nb_fractions.value.innerHTML+= text;

c'est quoi formulaire ? un <form>
alors fais donc formulaire.innerHTML+"<balise></balise><balise></balise>";
par balise j' entend celles que tu veux, et j'en met 2, comme tu en voulais 2...
( mais penser aux suppressions peut-être ... )

[mon Site] [M'écrire] Bul

>>Mais ça ne marche pas.
et ça  ! ça aide drôlement pour aider !
qu'est-ce qui ne fonctionne pas ?
comment tu fais ce que tu dis ?
il y a un message d'erreur ?

et quand on met au point :

Chrome	contrôler page actuelle / Options pour développeurs / Console Javascript
FireFox	Outils / Console d'erreurs et mieux : télécharger FireBug
Internet Explorer	activer le deboggage : Outils/options Internet/Avancés dans la liste, sous "Navigation" : décocher o Afficher une notification de chaque erreur de script o Désactiver le débogage de Scripts (Internet Explorer) et mieux : télécharger le Debogger IE voir aussi : DebugBar et Companion JS
K-Meleon	Outils / Console d'erreurs
Opera	Outils / Avancé / Console d'erreurs
Safari	Debug / Show JavaScript Console ° modifier Fichier com.apple.Safari.plist situé dans le répertoire : Support:\Documents and Settings\utilisateur \Application Data\Apple Computer\Safari\Preferences\ y ajouter <key>IncludeDebugMenu</key> <true/>

Cordialement

[mon Site][M'écrire]Bul

Je m'explique:

<HTML>
<HEAD>
<script language=javascript>

                  function ajout_form(formulaire) {
                       var lavaleur = formulaire.nb_fractions.value;
                       if(lavaleur = =2){
                            var text = '<balise></balise><br/><balise></balise><br>';
                             formulaire.innerHTML+= text;
                       }
                  }

</script>

</HEAD>

<form name="formulaire">

    <tr><td nowrap="nowrap">Nombre de fraction:</td>

         <td nowrap="nowrap">

                 <select name="nb_fractions"  onChange="ajout_form(formulaire);"/>

                             <option value="" ></option>

                             <option value="1" >1 - Fraction</option>

                             <option value="2" >2 - Fraction</option>

                             <option value="4" >4 - Fraction</option>

                  </select></td></tr>
</form>
<HTML>

Quand je lance OnChange sur les listes du champs  select, je voudrai que soit générer dans le même formulaire et en dessous du champ select des balises inputs.
Sauf qu'avec mon script ci-dessu les deux balises input sont generées dans une nouvelle fenêtre(nouveau formulaire).

en fait, tu n'es pas très loin, mais :
tu essayes d'inventer des "syntaxes" qui n'existent pas....
tu as des erreurs y compris en html
tu ajoutes "<balise>balise>", alors :
soit ça va planter ( le html ne connias pas ! )
soit tu ne verras rien !
quand je disais <balise> c'était "générique", il faut mettre la balise que tu veux !
et pas balise... qui n'existe pas !
et appeler un élément, une balise directement par son name, ça ne fonctionnera qu'avec IE
document.name_de_balise ( uniquement pour un form ) ou document.getElementById("id_de_balise")
en minuscule, c'est un exemple ! il faut mettre le vrai name ou id !

[mon Site] [M'écrire] Bul

et si tu veux des erreurs html
( en dehors de <balise> que tu ajoutes et qui va planter ! )
/ en fin de balise select
pas de <body> </body>.....

[mon Site] [M'écrire] Bul