Jump to content

Problem With Dynamic Table Rows Sum


azegurb
 Share

Recommended Posts

have created dynamic table with two columnsfor ex:first column is Income columnand second column is tax from Incomeat the third column are different percent optionsfor ex. I wrote first column 1000 and chose from third drop down box 10%I would like when i chose 10% sum function automatically writes 10% percent of 1000 into second column so that 100here is code if possible pls help me i really need this code thanks beforehandhere is code

<html><head><title>dinamik sheet</title> <script> function addrow(){ var tbl=document.getElementById('sheet');var lastrow=tbl.rows.length;var iteration=lastrow;var row=tbl.insertRow(lastrow);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.size=40;el.setAttribute('sumMe',"1");el.onBlur=sum;  cellRight.appendChild(el); var cellRight2=row.insertCell(2);var el1=document.createElement('input');el1.type='text';el1.name='txtRowe'+iteration;el1.id='txtRowe'+iteration;el1.size=40;el1.setAttribute('sumMe',"1"); cellRight2.appendChild(el1);     var cellRightsel=row.insertCell(3);var sel=document.createElement('select');sel.name='selRow'+iteration;sel.options[0]=new Option('10%','value="10"');sel.options[1]=new Option('20%','value="20"');sel.options[2]=new Option('30%','value="30"');cellRightsel.appendChild(sel);var cellRightsel2=row.insertCell(4); }</script><script> function sum(){	var form=document.getElementById('eval_edit');	if(!form) return;	var s1 = 0;	var s2 = 0;	var tbl=document.getElementById('sheet');	var iteration=tbl.rows.length-1;	for(var i=1; i<=iteration; i++){		var el = form['txtRow'+i];		if(!el) continue;		var txt = el.value;		if(txt != ( '' + Number(txt) )) continue;//reject non-numeric entries		var el2 = form['selRow'+i];		var el3 = document.getElementById('txtRowe'+i);		if(!el2 || !el3) alert('Error in calculating totals');		var percent = Number(el2[el2.selectedIndex].value)/100;		var tax = Number(txt) * percent;		el3.innerHTML = tax.toFixed(2); 		s1 += Number(txt);		s2 += tax;	}	if(form['total']){ form['total'].value = s1.toFixed(2); }	if(form['taxtotal']){ form['taxtotal'].value = s2.toFixed(2); }}  onload = function(){sum();} </script></head><body><form name="eval_edit" method="POST"><table align="center" width="75%"><tr><td align="center">Balance sheet</td></tr><tr><td align="center"><table border="1" id="sheet"><tr><td>object</td><td>Income</td><td>Tax from income</td><td>instruktor</td></tr><tr><td>1</td><td><input sumMe="1" type="text" name="txtrow1" id="txtrow1" size="40"/></td><td><input sumMe="1" type="text" name="txtrowe" id="txtrowe" size="40"/></td><td><select name="selRow0"><option value="value="10">10%</option><option value="value="20">20%</option><option value="value="30">30%</option></select></td></tr></table>INCOME SUM<input name="total" type="text"/><input type="button" value="Add" onclick="addrow()" /> <input type="button" value="Remove" onclick="removeRow()" /> <input type="button" value="SUM" onClick="sum()"/> <input type="submit" value="Submit" /> <input name="taxtotal" type="text"/>Tax SUM with desirable percent for ex: 20%</td> </tr> </table> </form>  </body>  </html>

Link to comment
Share on other sites

You'll need to add events to the select list and text box. The text box can use the keyup event to run the sum function, and the select box can use the change event to run the sum function. Check the Javascript event tutorial for information about adding event handlers to elements.

Link to comment
Share on other sites

You'll need to add events to the select list and text box. The text box can use the keyup event to run the sum function, and the select box can use the change event to run the sum function. Check the Javascript event tutorial for information about adding event handlers to elements.
Thank you if you helped me that would be nice
Link to comment
Share on other sites

I thought I did just help you. Check the tutorials, look at the examples about how to add event listeners (there's no need for me to repeat the same information here when it's already available), and feel free to ask if you have questions about how something works.http://www.w3schools.com/htmldom/dom_events.asphttp://www.quirksmode.org/js/introevents.htmlLook here, scroll down to the events section to see what events you can listen for on a select element:http://www.w3schools.com/tags/tag_select.asp

Link to comment
Share on other sites

I thought I did just help you. Check the tutorials, look at the examples about how to add event listeners (there's no need for me to repeat the same information here when it's already available), and feel free to ask if you have questions about how something works.http://www.w3schools.com/htmldom/dom_events.asphttp://www.quirksmode.org/js/introevents.htmlLook here, scroll down to the events section to see what events you can listen for on a select element:http://www.w3schools.com/tags/tag_select.asp
Thank you very muchI will try
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...