stevenetMedlem sedan juni 20001 251 inlägg Hej! Jag vill lägga till/ta bort fält med hjälp av "Lägg till" och "Ta bort". Det ska dock inte gå att ha färre än 2 fält eller mer än 10. Hur göra?
<table>
<div id="fields">
<tr>
<td width=200 height=30><b>Svarsalternativ 1:</b></td><td><input type="TEXT" name="alternative[]" value="" class="ruta" size=50></td>
</tr>
<tr>
<td width=200 height=30><b>Svarsalternativ 2:</b></td><td><input type="TEXT" name="alternative[]" value="" class="ruta" size=50></td>
</tr>
</div>
</table><br>
<a href="">Lägg till</a> <a href="">Ta bort</a>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="se" lang="se">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Lägg till och ta bort fält</title>
<script type="text/javascript">
//<![CDATA[
function addField()
{
var t = document.getElementById("fields");
var nRows = t.rows.length;
if (nRows >= 10)
return;
var textField = document.createElement("input");
textField.type = "text";
textField.name = "alternative[]";
textField.className = "ruta";
textField.size = "50";
var r = t.insertRow(nRows);
var c = r.insertCell(0);
c.width = 200;
c.height = 30;
c.innerHTML = "<b>Svarsalternativ " + (nRows + 1) + ":</b>";
c = r.insertCell(1);
c.appendChild(textField);
}
function deleteField()
{
var t = document.getElementById("fields");
var nRows = t.rows.length;
if (nRows <= 2)
return;
t.deleteRow(nRows - 1);
}
//]]>
</script>
</head>
<body>
<table id="fields">
<tr>
<td width="200" height="30"><b>Svarsalternativ 1:</b></td>
<td><input type="text" name="alternative[]" value="" class="ruta" size="50" /></td>
</tr>
<tr>
<td width="200" height="30"><b>Svarsalternativ 2:</b></td>
<td><input type="text" name="alternative[]" value="" class="ruta" size="50" /></td>
</tr>
</table>
<br />
<a href="javascript:addField();">Lägg till</a> <a href="javascript:deleteField();">Ta bort</a>
</body>
</html>
stevenetMedlem sedan juni 20001 251 inlägg Lysande, tack! Kom dock på att jag vill utöka det hela ett steg till. Varje svarsalternativ ska ha en poängruta med, förövrigt är det samma som gäller. Max 10 fält, minimum två.
<tr>
<td width=200 height=30><b>Svarsalternativ 1:</b></td><td><input type="TEXT" name="alternative[]" value="" class="ruta" size=50></td><td width=100><b>Poäng</b></td><td><input type="TEXT" name="points[]" value="" class="ruta" size=50></td>
</t>
Då får du lägga till det i tabellen, samt ändra funktionen addField()
function addField()
{
var t = document.getElementById("fields");
var nRows = t.rows.length;
if (nRows >= 10)
return;
var textField = document.createElement("input");
textField.type = "text";
textField.name = "alternative[]";
textField.className = "ruta";
textField.size = "50";
var pointsField = document.createElement("input");
pointsField.type = "text";
pointsField.name = "points[]";
pointsField.className = "ruta";
pointsField.size = "50";
var r = t.insertRow(nRows);
var c = r.insertCell(0);
c.width = 200;
c.height = 30;
c.innerHTML = "<b>Svarsalternativ " + (nRows + 1) + ":</b>";
c = r.insertCell(1);
c.appendChild(textField);
c = r.insertCell(2);
c.width = 100;
c.innerHTML = "<b>Poäng:</b>";
c = r.insertCell(3);
c.appendChild(pointsField);
}
...och sen får du inte komma på mer funktionalitet ;-)
stevenetMedlem sedan juni 20001 251 inlägg Ja, nu får det vara nog. ;)
Tusen tack!
