<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>function addrow(){
var tbl = document.getElementById('sheet');
var iteration = tbl.rows.length;
var row=tbl.insertRow(iteration);
var cellLeft = row.insertCell(0);
var textNode = document.createTextNode(iteration);
cellLeft.appendChild(textNode);
var cellRight = row.insertCell(1);
var el = document.createElement('input');
el.type = 'text';
el.name = 'txtRow'+iteration;
el.id = 'txtRow'+iteration;
el.size = 40;
el.value = '0';
el.onblur = sum;
cellRight.appendChild(el);
var cellRight1 = row.insertCell(2);
cellRight1.id = 'txtRowe'+iteration;
var cellRightsel = row.insertCell(3);
var sel = document.createElement('select');
sel.name = 'selRow' + iteration;
sel.id = 'selRow' + iteration;
sel.onchange = sum;
sel.options[0] = new Option('10%', '10');
sel.options[1] = new Option('20%', '20');
sel.options[2] = new Option('30%', '30');
cellRightsel.appendChild(sel);
sum();
}
function sum(){
var s1 = 0;
var s2 = 0;
var tbl=document.getElementById('sheet');
var iteration=tbl.rows.length-1;
for(var i=1; i<=iteration; i++){//loop through table rows
var el1 = document.getElementById('txtRow'+i);//Row's Income field
var el2 = document.getElementById('selRow'+i);//Row's percentage menu
var el3 = document.getElementById('txtRowe'+i);//Row's Tax cell
if(!el1 || !el2 || !el3) continue;
var txt = el1.value;
if(txt != ( '' + Number(txt) )) continue;//reject non-numeric entries
var tax = Number(txt) * Number(el2[el2.selectedIndex].value)/100;
el3.innerHTML = tax.toFixed(2);
s1 += Number(txt);
s2 += tax;
}
var t1 = document.getElementById('total');
var t2 = document.getElementById('taxtotal');
if(t1){ t1.value = s1.toFixed(2); }
if(t2){ t2.value = s2.toFixed(2); }
}
onload = function(){
addrow();
}
</script>
</head>
<body>
<form action="miro.html" name="eval_edit" method="post" format="html">
<table align="center" width = "75%">
<tr>
<td align = "center">
click add to you know, add a row, and remove to remove a row, and submit to submit your page! whee!
</td>
</tr>
<tr>
<td align = "center">
<!--- very imporant to give the table an id --->
<!--- otherwise it won't know where to edit --->
<table border="1" id="mySampleTable">
<tr>
<td>
Lesson
</td>
<td>
Title
</td>
<td>
Instructor
</td>
</tr>
<tr>
<td>
1
</td>
<td><input sumMe="1" type="text" name="txtRow1" id="txtRow1" size="40" /></td><tr>
<tr>
<td><input sumMe1="1" type="text" name="txtRowe1" id="txtRowe1" size="40" /> </td>
<td>
<select name="selRow0">
<option value="10">10%</option>
<option value="20">20%</option>
<option value="30">30%</option>
</select>
</td>
</tr>
</table>
<input name="total" type="text"/>
<!--- our buttons call our javascript functions when clicked --->
<input type="button" value="Add" onclick="addRow();" />
<input type="button" value="Remove" onclick="removeRow();" />
<input type="button" value="SUM" onClick="sum()"/>
<input type="button" value="SUM1" onClick="sum1()"/>
<input type="submit" value="Submit" />
</td> <td><input name="taxtotal" type="text"/></td>
</tr>
</table>
</form>
</body>
</html>
Marked Solved 
Offline 
