Ad stopt er mee
meedere input boxen
ik zou graag een formulier maken die , als je de laatste input box ingevuld hebt, automatisch een andere er onder zet.
Ik weet niet goed op wat ik moet zoeken in google, maar als iemand mij een juist term kan geven voor wat ik bedoel kan ik al op zoek naar wat tutorials en scripts.
als iemand zelf een goede tutorial of script weet is dat natuurlijk ook altijd welkom
groeten
jonas
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<script type="text/javascript">
function addTextbox() {
document.getElementById("inputs").innerHTML += '<input type="text" name="naam[]" /><br />';
}
</script>
<div id="inputs">
<input type="text" name="naam[]" /><br />
<input type="text" name="naam[]" /><br />
<input type="text" name="naam[]" /><br />
</div>
<input type="button" value="Toevoegen" onclick="addTextbox();" />
function addTextbox() {
document.getElementById("inputs").innerHTML += '<input type="text" name="naam[]" /><br />';
}
</script>
<div id="inputs">
<input type="text" name="naam[]" /><br />
<input type="text" name="naam[]" /><br />
<input type="text" name="naam[]" /><br />
</div>
<input type="button" value="Toevoegen" onclick="addTextbox();" />
Edit: typefoutjes in de code :)
Gewijzigd op 04/03/2011 12:41:48 door Kevin de Groot
waarschijnlijk omdat ik het midden in een form wil toevoegen, maar ik vindt niet hoe het op te lossen.
<script type="text/javascript">
function addUploadBox() {
document.getElementById("form1") += '<input type="text" name="naam[]" /><br />';
}
</script>
<form name="form1" enctype="multipart/form-data" method="post" action="processFiles.php">
<p>
<input name="uploadFile" type="file" id="uploadFile">
</p>
<input type="button" name="button" id="button" value="Button" onclick="addUploadBox();" />
<p><input name="uploadNeed" type="hidden" value="">
<input type="submit" name="Submit" value="Submit">
</p>
</form>
Toevoeging op 04/03/2011 18:35:15:
Hey, het script werkte goed, maar nu zou ik het in een tabel willen krijgen. alleen lukt het me niet. de nieuwe rijen willen niet verschijnen.
ziet iemand wat ik fout doe?
thx
Jonas
Code (php)
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
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
<?
<script type="text/javascript">
function addUploadBox() {
var div = document.getElementsByClassName('inputs');
[code]<? $uploadNeed++;?>
for(var i=0; i < div.length; i++) {
div[i].innerHTML += ' <td> <input name="uploadFile<? echo $x;?>" type="file" id="uploadFile<? echo $uploadNeed;?>">
</td> <td> <input name="uploadFile<? echo $x;?>" type="file" id="uploadFile<? echo $uploadNeed;?>">
</td> <td> <input name="description<? echo $x;?>" type="text" id="description<? echo $uploadNeed;?>">
</td>';
}
}
</script>
<form name="form1" enctype="multipart/form-data" method="post" action="processFiles.php">
<p>
<table border="2" >
<tr><td>Afbeeldignen</td><td>Thumbs</td><td>Beschrijving</td>
<tr class="inputs">
<td> <input name="uploadFile<? echo $x;?>" type="file" id="uploadFile<? echo $uploadNeed;?>">
</td> <td> <input name="uploadFile<? echo $x;?>" type="file" id="uploadFile<? echo $uploadNeed;?>">
</td> <td> <input name="description<? echo $x;?>" type="text" id="description<? echo $uploadNeed;?>">
</td>
<tr>
</table>
<input type="button" name="button" id="button" value="Voeg een upload veld toe" onclick="addUploadBox();" />
<p><input name="uploadNeed" type="hidden" value="<? echo $uploadNeed;?>">
<input type="submit" name="Submit" value="Submit">
</p>
</form>?>
<script type="text/javascript">
function addUploadBox() {
var div = document.getElementsByClassName('inputs');
[code]<? $uploadNeed++;?>
for(var i=0; i < div.length; i++) {
div[i].innerHTML += ' <td> <input name="uploadFile<? echo $x;?>" type="file" id="uploadFile<? echo $uploadNeed;?>">
</td> <td> <input name="uploadFile<? echo $x;?>" type="file" id="uploadFile<? echo $uploadNeed;?>">
</td> <td> <input name="description<? echo $x;?>" type="text" id="description<? echo $uploadNeed;?>">
</td>';
}
}
</script>
<form name="form1" enctype="multipart/form-data" method="post" action="processFiles.php">
<p>
<table border="2" >
<tr><td>Afbeeldignen</td><td>Thumbs</td><td>Beschrijving</td>
<tr class="inputs">
<td> <input name="uploadFile<? echo $x;?>" type="file" id="uploadFile<? echo $uploadNeed;?>">
</td> <td> <input name="uploadFile<? echo $x;?>" type="file" id="uploadFile<? echo $uploadNeed;?>">
</td> <td> <input name="description<? echo $x;?>" type="text" id="description<? echo $uploadNeed;?>">
</td>
<tr>
</table>
<input type="button" name="button" id="button" value="Voeg een upload veld toe" onclick="addUploadBox();" />
<p><input name="uploadNeed" type="hidden" value="<? echo $uploadNeed;?>">
<input type="submit" name="Submit" value="Submit">
</p>
</form>?>
Gewijzigd op 04/03/2011 18:36:16 door jonas vermeulen