Melea skrev:
Hejsan,
Har gjort så att när man trycker på en länk läggs det till input-fält i en tabell.
<script type="text/javascript"> function addInput() { document.getElementById('inputFields').innerHTML += '<tr> <td><input type="text" name="field1[]" class="TextBoxNormal" /></td> <td><input type="text" name="field2[]" class="TextBoxNormal" /></td> </tr>'; } </script> <table cellspacing="0" cellpadding="0" id="inputFields"> <tr> <td style="font-weight: bold;">Field1:</td> <td style="font-weight: bold;">Field2:</td> </tr> <tr> <td><input type="text" name="field1[]" class="TextBoxNormal" /></td> <td><input type="text" name="field2[]" class="TextBoxNormal" /></td> </tr> </table> <a href="#" onclick="addInput()">Lägg till fält</a>Det funkar, men om jag fyller i några input-fält och sedan trycker på länken "Lägg till fält" så rensas alla inputs per automatik.
Hur kan jag kringgå detta?
Så här:
<html>
<head>
<script type="text/javascript">
function addInput() {
//document.getElementById('fieldbody').innerHTML += '<tr><td><input type="text" name="field1[]" class="TextBoxNormal" /></td><td><input type="text" name="field2[]" class="TextBoxNormal" /></td></tr>';
var tbody = document.getElementById('fieldbody');
var tr = document.createElement('tr');
var td1 = document.createElement('td');
var td2 = document.createElement('td');
var input1 = createField('field1[]');
var input2 = createField('field2[]');
td1.appendChild(input1);
td2.appendChild(input2);
tr.appendChild(td1);
tr.appendChild(td2);
tbody.appendChild(tr);
}
function createField(sname) {
var input = document.createElement('input');
input.setAttribute('type','text');
input.setAttribute('name',sname);
return input;
}
</script>
</head>
<body>
<table cellspacing="0" cellpadding="0" id="inputFields">
<tr>
<td style="font-weight: bold;">Field1:</td>
<td style="font-weight: bold;">Field2:</td>
</tr>
<tbody id="fieldbody">
<tr>
<td><input type="text" name="field1[]" class="TextBoxNormal" /></td>
<td><input type="text" name="field2[]" class="TextBoxNormal" /></td>
</tr>
</tbody>
</table>
<a href="#" onclick="addInput()">Lägg till fält</a>
</body>
</html>