dimension champs texte inséré dynamiquement
Bonsoir,
J'ai récupéré un script sur le forum que j'ai modifié pour mon appli. mais je n'arrive pas à dimensionner la taille du champs texte.
Merci d'avance pour vos aides.
Voila le code complet de la page, qui est fonctionnel pour ajouter dynamiquement 3 champs texte simultanéments.
Code:
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
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Document sans nom</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
var c,c2, ch; var ca,c2a, cha; var cb,c2b, chb;
function plus(){
c=document.getElementById('cadre1');
c2=c.getElementsByTagName('input');
ch=document.createElement('input');
ch.setAttribute('type','text');
ch.setAttribute('name','ch'+c2.length);
c.appendChild(ch);
ca=document.getElementById('cadre2');
c2a=ca.getElementsByTagName('input');
cha=document.createElement('input');
cha.setAttribute('type','text');
cha.setAttribute('name','cha'+c2a.length);
ca.appendChild(cha);
cb=document.getElementById('cadre3');
c2b=cb.getElementsByTagName('input');
chb=document.createElement('input');
chb.setAttribute('type','text');
chb.setAttribute('name','chb'+c2b.length);
cb.appendChild(chb);
document.getElementById('sup').style.display='inline';
}
// supprimer le dernier champ;
function moins(){
if(c2.length>0 || c2a.length>0 || c2b.length>0){
c.removeChild(c2[c2.length-1]);
ca.removeChild(c2a[c2a.length-1]);
cb.removeChild(c2b[c2b.length-1]);
}
if(c2.length==0 || c2a.length==0 || c2b.length==0){document.getElementById('sup').style.display='none'};
}
</script>
</head>
<body>
<form id="frm" action="">
<table width="723" border="1" cellspacing="0">
<tr>
<td width="228" align="left"><div id="cadre1" style="width:50px"></div></td>
<td width="232" align="left"><div id="cadre2" style="width:50px"></div></td>
<td width="249" align="left"><div id="cadre3" style="width:50px"></div></td>
</tr>
</table>
<p>
<input type="button" value="ajouter un champ" onclick="plus()" />
<input type="button" style="display:none" id="sup" value="supprimer un champ" onclick="moins()" />
</p>
</form>
</body>
</html> |
