title: Auto Sum Input Values and Display Using Javascript
body: <p>Basically I want to update an Input field with the sum of all above Input Fields.</p>
  <p>This is a part of HTML within  tag:</p>
  <pre><code>&lt;tr&gt;
                  &lt;td width=&quot;20%&quot;&gt;Admission Fee:&lt;/td&gt;
                  &lt;td width=&quot;80%&quot;&gt;&lt;input onchange=&quot;findTotal()&quot; type=&quot;text&quot; class=&quot;input_box&quot; name=&quot;admission_fee&quot; id=&quot;fee&quot; size=&quot;5&quot; value=&quot;&quot; maxlength=&quot;6&quot; oninput=&quot;this.value = this.value.replace(/[^0-9]/, \'\');&quot;&gt;&lt;/td&gt;
              &lt;/tr&gt;
              &lt;tr&gt;
                  &lt;td width=&quot;20%&quot;&gt;Annual Fee:&lt;/td&gt;
                  &lt;td width=&quot;80%&quot;&gt;&lt;input onchange=&quot;findTotal()&quot; type=&quot;text&quot; class=&quot;input_box&quot; name=&quot;annual_fee&quot; id=&quot;fee&quot; size=&quot;5&quot; value=&quot;&quot; maxlength=&quot;6&quot; oninput=&quot;this.value = this.value.replace(/[^0-9]/, \'\');&quot;&gt;&lt;/td&gt;
              &lt;/tr&gt;
              &lt;tr&gt;
                  &lt;td width=&quot;20%&quot;&gt;Paper Money Fee:&lt;/td&gt;
                  &lt;td width=&quot;80%&quot;&gt;&lt;input onchange=&quot;findTotal()&quot; type=&quot;text&quot; class=&quot;input_box&quot; name=&quot;paper_money_fee&quot; id=&quot;fee&quot; size=&quot;5&quot; value=&quot;&quot; maxlength=&quot;6&quot; oninput=&quot;this.value = this.value.replace(/[^0-9]/, \'\');&quot;&gt;&lt;/td&gt;
              &lt;/tr&gt;
              &lt;tr&gt;
                  &lt;td width=&quot;20%&quot;&gt;Monthly Fee:&lt;/td&gt;
                  &lt;td width=&quot;80%&quot;&gt;&lt;input onchange=&quot;findTotal()&quot; type=&quot;text&quot; class=&quot;input_box&quot; name=&quot;monthly_fee&quot; id=&quot;fee&quot; size=&quot;5&quot; value=&quot;&quot; maxlength=&quot;6&quot; oninput=&quot;this.value = this.value.replace(/[^0-9]/, \'\');&quot;&gt;&lt;/td&gt;
              &lt;/tr&gt;
              &lt;tr&gt;
                  &lt;td width=&quot;20%&quot;&gt;Remaining Balance:&lt;/td&gt;
                  &lt;td width=&quot;80%&quot;&gt;&lt;input onchange=&quot;findTotal()&quot; type=&quot;text&quot; class=&quot;input_box&quot; name=&quot;remaining_balance&quot; id=&quot;fee&quot; size=&quot;5&quot; value=&quot;&quot; maxlength=&quot;6&quot; oninput=&quot;this.value = this.value.replace(/[^0-9]/, \'\');&quot;&gt;&lt;/td&gt;
              &lt;/tr&gt;
              &lt;tr&gt;
                  &lt;td class=&quot;school_trow2&quot; width=&quot;20%&quot;&gt;Total Fee:&lt;/td&gt;
                  &lt;td class=&quot;school_trow2&quot; style=&quot;padding: 3px 0;&quot; width=&quot;80%&quot;&gt;&lt;input type=&quot;text&quot; class=&quot;input_box&quot; style=&quot;background: #8CDFFF; border: 1px solid #006991; color: #000;&quot; name=&quot;total_fee&quot; id=&quot;total_fee&quot; size=&quot;5&quot; value=&quot;&quot; disabled&gt;&lt;/td&gt;
              &lt;/tr&gt;
  </code></pre>
  <p>And this is the Javascript I am Using:</p>
  <pre><code>&lt;script type=&quot;text/javascript&quot;&gt;
          function findTotal()
          {
              var arr = document.getElementById(\'fee\');
              var tot=0;
              for(var i=0;i&lt;arr.length;i++)
              {
                  if(parseInt(arr[i].value))
                  {
                      tot += parseInt(arr[i].value);
                  }
              }
              document.getElementById(\'total_fee\').value = tot;
          }
          &lt;/script&gt;
  </code></pre>
  <p>Any help would be appreciated.</p>