By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
431,663 Members | 762 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 431,663 IT Pros & Developers. It's quick & easy.

dynamic table sum of the options problem

P: 32
Hello, I have one question again
i created one table again and in this table i added some another options
for ex at the previous table there were only one problem sum of the dynamically added rows
in this beside sum i need to sum of the tax
for ex: in column1 i added 300 and into 2-nd column i Chose 10%

i would like when i chose from drop down box 10% Let in the 2-nd column appear 10% of the value which i addee first column
for ex 10% of this dynamically added rows
for ex. i added ten rows and i entered different values into these rows. in front of each row there are different option of percent selection.
in row1 i added 1000 and chose from drop down box 10% Let in 2-nd column appear 100
in row2 i added 2500 and chose from drop down box 30%
.................................................. ...........
and so on
and finally i counted separately sum of the values and other texbox value i sum percentage of this values
if possible help me
thanks beforehands
here is code



Expand|Select|Wrap|Line Numbers
  1. <html><head><title>dinamik sheet</title>
  2.  
  3. <script>
  4. function addrow(){
  5.  
  6.     var tbl=document.getElementById('sheet');
  7.     var lastrow=tbl.rows.length;
  8.     var iteration=lastrow;
  9.     var row=tbl.insertRow(lastrow);
  10.     var cellLeft=row.insertCell(0);
  11.     var textNode=document.createTextNode(iteration);
  12.     cellLeft.appendChild(textNode);
  13.     var cellRight=row.insertCell(1);
  14.     var el=document.createElement('input');
  15.     el.type='text';
  16.     el.name='txtRow'+iteration;
  17.     el.size=40;
  18.     el.setAttribute('sumMe',"1");
  19.     cellRight.appendChild(el);
  20.  
  21.    var cellRight2=row.insertCell(2);
  22.     var el1=document.createElement('input');
  23.     el1.type='text';
  24.     el1.name='txtRowe'+iteration;
  25.     el1.size=40;
  26.     el1.setAttribute('sumMe',"1");
  27.     cellRight2.appendChild(el1);
  28.  
  29.  
  30.  
  31.  
  32.  
  33.     var cellRightsel=row.insertCell(3);
  34.     var sel=document.createElement('select');
  35.     sel.name='selRow'+iteration;
  36.     sel.options[0]=new Option('10%','value0');
  37.     sel.options[1]=new Option('20%','value1');
  38.     sel.options[2]=new Option('30%','value2');
  39.     cellRightsel.appendChild(sel);
  40.     var cellRightsel2=row.insertCell(4);
  41.     var sel1=document.createElement('input');
  42.     sel1.type='button';
  43.     sel1.value='sum row'+iteration;
  44.     sel1.name='button'+iteration;
  45.      cellRightsel2.appendChild(sel1);
  46. }
  47. </script>
  48. <script>
  49. function sum(){
  50.     var form=document.getElementById('eval_edit');
  51.     if(!form) return;
  52.     var fields=form.getElementsByTagName('input');
  53.     var s=0;
  54.     for (var i=0;i<fields.length;i++){
  55.  
  56.         if( fields[i].getAttribute('sumMe') != "1" ) continue;//reject any field not carring the "sumMe" attribute
  57.         var txt = fields[i].value;
  58.         if(txt != ( '' + Number(txt) )) continue;//reject non-numeric entries
  59.         s += Number(txt);
  60.     }
  61.     if(form['total']){ form['total'].value = s; }
  62. }
  63.  
  64. onload = function(){
  65.     sum();
  66. }
  67.  
  68. </script>
  69. </head>
  70. <body>
  71. <form name="eval_edit" method="POST">
  72. <table align="center" width="75%">
  73. <tr>
  74. <td align="center">Balance sheet</td></tr>
  75. <tr><td align="center">
  76. <table border="1" id="sheet"><tr><td>object</td><td>Income</td><td>Tax from income</td><td>instruktor</td></tr>
  77. <tr><td>1</td>
  78. <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>
  79. <td><select name="selRow0">
  80. <option value="value0">10%</option>
  81. <option value="value1">20%</option>
  82. <option value="value2">30%</option></select></td><td><input type="button" name="button1" value="sum row1" id="button1"></tr></table>
  83. INCOME SUM<input name="total" type="text"/>
  84. <input type="button" value="Add" onclick="addrow()" /> 
  85. <input type="button" value="Remove" onclick="removeRow()" /> 
  86. <input type="button" value="SUM" onClick="sum()"/> 
  87. <input type="submit" value="Submit" /> <input name="taxtotal" type="text"/>Tax SUM with desirable percent for ex: 20%
  88. </td> 
  89. </tr> 
  90. </table> 
  91. </form> 
  92.  
  93. </body> 
  94.  
  95. </html>
Sep 26 '09 #1
Share this Question
Share on Google+
6 Replies


acoder
Expert Mod 15k+
P: 16,027
@azegurb
Use an onchange on the select element to make this change. It might be an idea to make the value of the options, the amount that you have to multiply or divide by, e.g. 0.1 or 10.

The summing is trivial if you've already summed the 1st column.
Sep 28 '09 #2

P: 32
i did but nothink i got
if i put code here can you help me
Sep 28 '09 #3

acoder
Expert Mod 15k+
P: 16,027
Yes, post your attempt and I can suggest improvements/changes.
Sep 28 '09 #4

P: 32
just i worked around it but table head column goes to the right when clicked add button
and one thing i would like to learn when updated left column according to it right column let automatically changes
thanks very much



Expand|Select|Wrap|Line Numbers
  1. <html><head><title>dinamik sheet</title>
  2.  
  3. <script> 
  4. function addrow(){
  5.  
  6. var tbl=document.getElementById('sheet');
  7. var lastrow=tbl.rows.length;
  8. var iteration=lastrow;
  9. var row=tbl.insertRow(lastrow);
  10. var cellLeft=row.insertCell(0);
  11. var textNode=document.createTextNode(iteration);
  12. cellLeft.appendChild(textNode);
  13.  
  14.  
  15. var cellRight=row.insertCell(1);
  16. var el=document.createElement('input');
  17. el.type='text';
  18. el.name='txtRow'+iteration;
  19. el.size=40;
  20. el.setAttribute('sumMe',"1");
  21. el.onBlur=sum;
  22. cellRight.appendChild(el);
  23.  
  24. var cellRight1=row.insertCell(2);
  25. var el1=document.createElement('input');
  26. el1.type='text';
  27. el1.name='txtRowe'+iteration;
  28. el1.size=40;
  29. el1.setAttribute('sumMe1',"1");
  30. el1.onBlur=sum1;
  31. cellRight.appendChild(el1);
  32.  
  33.  
  34.  
  35.  
  36. var cellRightsel=row.insertCell(3);
  37. var sel=document.createElement('select');
  38. sel.name='selRow'+iteration;
  39. sel.options[0]=new Option('10%','10');
  40. sel.options[1]=new Option('20%','20');
  41. sel.options[2]=new Option('30%','30');
  42. sel.onchange=function(){ Percent(this); }
  43. cellRightsel.appendChild(sel);
  44.  
  45. }
  46. </script>
  47. <script type="text/javascript"> 
  48. function sum(){
  49.     var form = document.getElementById('eval_edit');
  50.     if(!form) return;
  51.     var fields = form.getElementsByTagName('input');
  52.     var s = 0;//sum value
  53.     for(var i=0; i<fields.length; i++){
  54.         if( fields[i].getAttribute('sumMe') != "1" ) continue;//reject any field not carring the "sumMe" attribute
  55.         var txt = fields[i].value;
  56.         if(txt != ( '' + Number(txt) )) continue;//reject non-numeric entries
  57.         s += Number(txt);
  58.     }
  59.     if(form['total']){ form['total'].value = s; }
  60. }
  61.  
  62. onload = function(){
  63.     sum();
  64. }
  65.  
  66.  
  67. </script> 
  68.  
  69. <script type="text/javascript"> 
  70. function sum1(){
  71.     var form = document.getElementById('eval_edit');
  72.     if(!form) return;
  73.  
  74.     var fields = form.getElementsByTagName('input');
  75.  
  76.  
  77.     var s = 0;//sum value
  78.     for(var i=0; i<fields.length; i++){
  79.         if( fields[i].getAttribute('sumMe1') != "1" ) continue;//reject any field not carring the "sumMe" attribute
  80.         var txt = fields[i].value;
  81.         if(txt != ( '' + Number(txt) )) continue;//reject non-numeric entries
  82.         s += Number(txt);
  83.     }
  84.     if(form['taxtotal']){ form['taxtotal'].value = s; }
  85. }
  86.  
  87. onload = function(){
  88.     sum1();
  89. }
  90.  
  91.  
  92.  
  93.  
  94. </script> 
  95.  
  96. <script  type="text/javascript"> 
  97. /*<![CDATA[*/
  98.  
  99. function Percent(obj){
  100.  var row=obj;
  101.  while (row.parentNode&&row.nodeName!='TR'){
  102.   row=row.parentNode;
  103.  }
  104.  var ips=row.getElementsByTagName('INPUT')
  105.  ips[0].value=ips[0].value.replace(/[^0-9.]/g,'');
  106.  ips[1].value='';
  107.  if (ips[0].value){
  108.   ips[1].value=ips[0].value/100*obj.value;
  109.  }
  110. }
  111.  
  112. /*]]>*/
  113. </script></head>
  114. <body>
  115. <form name="eval_edit" method="POST">
  116. <table align="center" width="75%">
  117. <tr>
  118. <td align="center">Balance sheet</td></tr>
  119. <tr><td align="center">
  120. <table border="1" id="sheet"><tr><td>object</td><td>Income</td><td>Tax from income</td><td>instruktor</td></tr>
  121. <tr><td>1</td>
  122. <td><input sumMe="1" type="text" name="txtrow1" id="txtrow1" size="40"/></td><td><input sumMe1="1" type="text" name="txtrowe" id="txtrowe" size="40"/></td>
  123. <td><select name="selRow0" onchange="Percent(this); ">
  124. <option value="10">10%</option>
  125. <option value="20">20%</option>
  126. <option value="30">30%</option></select></td></tr></table>
  127. INCOME SUM<input name="total" type="text"/>
  128. <input type="button" value="Add" onclick="addrow()" />
  129. <input type="button" value="Remove" onclick="removeRow()" />
  130. <input type="button" value="SUM" onClick="sum()"/>
  131. <input type="button" value="SUM1" onClick="sum1()"/>
  132. <input type="submit" value="Submit" /> Tax SUM with desirable percent for ex: 20%<input name="taxtotal" type="text"/>
  133. </td>
  134. </tr>
  135. </table>
  136. </form>
  137.  
  138. </body>
  139.  
  140. </html>
  141.  
  142.  
Sep 28 '09 #5

acoder
Expert Mod 15k+
P: 16,027
On line 31, you're appending to cellRight instead of cellRight1.

Where you have el..onBlur, it should be onblur (lower-case "b").
Oct 1 '09 #6

P: 32
Thank you i will try
Oct 1 '09 #7

Post your reply

Sign in to post your reply or Sign up for a free account.