besoin d'aide sur un formulaire multi champs

**franckor** · 28/10/2009, 18h12

Bonsoir

je suis un débutant et j'ai des gros problèmes:

1er problème
J'essai de créer un formulaire multi-champs avec un bouton + pour ajouter un champ et un bouton - pour le soustraire.

Mais les valeurs se remettent a zéro à chaque fois que j'appui sur le bouton +

bon 1 problème a la fois.
voici le code : Merci d'avance snif

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<script type="text/javascript">
<!--
 
	var $a = 1;
	var $lettresArray = new Array('A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z');
 
 
	function f_ajouterEtape(){
 
	// Limiter à la lettre Z ???
		var $buttons = document.getElementsByClassName('plus'); // Array
			for (var $b = 0; $b < $buttons.length; $b++) {
				$buttons[$b].style.display = 'none';
			}
 
		var $n = $a++;
 
		if ($n < $lettresArray.length) {
		var $code  = '<div id="div_' + $n +'">';
   			$code += '<label for="etape_' + $n +'">';
   			$code += 'Etape ' + $lettresArray[$n] + ' : </label>';
 
   			$code += '<input type="text" size="25" ';
   			$code += 'name="etape_' + $n +'" id="etape_' + $n +'" ';
   			$code += 'value="" />';
 
   			$code += '<button ';   
   			$code += 'onclick="f_supprimerEtape(\'etape_' + $n + '\',this);return false;"';   
   			$code += 'class="moins" ';   
   			$code += 'style="display:inline;">-</button>';   
 
   			$code += '<button onclick="f_ajouterEtape();return false;"';   
   			$code += 'class="plus" ';   
   			$code += 'style="display:inline;">Nouv.</button>';   
   			$code += '</div>';
 
			document.getElementById('zoneMultichamps').innerHTML += $code;
		}
 
	}
 
	function f_supprimerEtape($id,$button){
 
		if(document.getElementById($id).disabled == true){
 
			document.getElementById($id).disabled = false;
			$button.innerHTML = '-';
			document.getElementById($id).style.display = 'inline';
		}
		else{
			document.getElementById($id).disabled = true;
			$button.innerHTML = '+';
			document.getElementById($id).style.display = 'none';
		}
 
 
	}
-->
</script>
</head>
 
<body>
<form id="form" action="test_ajouter_multichamps_traitement.php"
      enctype="application/x-www-form-urlencoded"
      method="post">
 
   <div id="zoneMultichamps">
		<div id="div_0">
   			<label for="etape_0">Etape A : </label>
            <input type="text" size="25"
                   name="etape_0" id="etape_0" value="" />
            <button class="plus" onclick="f_ajouterEtape();return false;">Nouv.</button>   
   		</div>
   </div> 
 
   <input type="submit" value="Envoyer" /> 
 
</form>

**SpaceFrog** · 28/10/2009, 21h38

oublie l'ajout d'elements de form avec innerHTML tu cours au devant des ennuis. SI tu veux le faire correctement utilise le DOM
Il y a un script tout fait par là
http://www.developpez.net/forums/d53...ynamique-form/

**Matthieu2000** · 29/10/2009, 09h59

document.getElementById('zoneMultichamps').innerHTML += $code;

le += marche mal dans ce cas!

besoin d'aide sur un formulaire multi champs

JavaScript

Discussions similaires

Partager

Partager