Как добавить значение каждого содержимого отдельно и добавить их все?

Question

Я хотел бы рассчитать значения в форме.Каждое итоговое значение из каждой таблицы с классом категории должно быть заполнено в текстовом поле с именем подытог.Затем каждое значение ввода с именем промежуточного итога необходимо добавить и заполнить в текстовом поле с именем total.Тем не менее, я полностью стек, то не могу понять.Пожалуйста помоги.

Я пытался зациклить каждую таблицу для расчета, но не сработало.

function calc() {
  price = 0;
  for (i = 0; i < document.myform.length - 1; i++) {
    if (document.myform.elements[i].checked) {
      price += eval(document.myform.elements[i].value);
    }
  }
  document.myform.subtotal.value = price;
  var sumup = 0;
  for (var i = 0; i < subtotal.length; i++) {
    sumup += eval(subtotal[i].value);
  }
  document.myform.total.value = sumup;
  document.myform.discount30.value = sumup * .7;
}

<form name="myform">
  <table class="category">
    <tr>
      <td>
        <label><input type="checkbox" value="500" onClick="calc()">500</label>
        <label><input type="checkbox" value="500" onClick="calc()">500</label>
      </td>
    </tr>
    <tr>
      <td>
        <label><input type="checkbox" value="500" onClick="calc()">500</label>
        <ul>
          <li><label><input type="checkbox" value="500" onClick="calc()">500</label></li>
          <li><label><input type="checkbox" value="500" onClick="calc()">500</label></li>
        </ul>
      </td>
    </tr>
    <tr>
      <td>
        <label><input type="checkbox" value="500" onClick="calc()">500</label>
        <input type="text" name="text" value="">
      </td>
    </tr>
    <tr>
      <td>
        <label><input type="radio" name="xxx" value="500" onClick="calc()">500</label>
        <label><input type="radio" name="xxx" value="500" onClick="calc()">500</label>
        <label><input type="radio" name="xxx" value="500" onClick="calc()">500</label>
        <input type="text" value="">
      </td>
    </tr>
    <tr>
      <td>
        <label><input type="radio" value="0" name="yyy" onClick="calc()">Yes</label>
        <ul>
          <li><label><input type="radio" name="zzz" value="500" onClick="calc()">500</label></li>
          <li><label><input type="radio" name="zzz" value="500" onClick="calc()">500</label></li>
        </ul>
        <label><input type="radio" value="0" name="yyy" onClick="calc()">No</label>
      </td>
    </tr>
    <tr>
      <td><label>amount：<input type="text" name="subtotal">yen</label></td>
    </tr>
  </table>
  <table class="category">
    <tr>
      <td>
        <label><input type="checkbox" value="500" onClick="calc()">500</label>
        <label><input type="checkbox" value="500" onClick="calc()">500</label>
      </td>
    </tr>
    <tr>
      <td>
        <label><input type="checkbox" value="500" onClick="calc()">500</label>
        <ul>
          <li><label><input type="checkbox" value="500" onClick="calc()">500</label></li>
          <li><label><input type="checkbox" value="500" onClick="calc()">500</label></li>
        </ul>
      </td>
    </tr>
    <tr>
      <td>
        <label><input type="checkbox" value="500" onClick="calc()">500</label>
        <input type="text" name="text" value="">
      </td>
    </tr>
    <tr>
      <td>
        <label><input type="radio" name="xxx" value="500" onClick="calc()">500</label>
        <label><input type="radio" name="xxx" value="500" onClick="calc()">500</label>
        <label><input type="radio" name="xxx" value="500" onClick="calc()">500</label>
        <input type="text" value="">
      </td>
    </tr>
    <tr>
      <td>
        <label><input type="radio" value="0" name="yyy" onClick="calc()">Yes</label>
        <ul>
          <li><label><input type="radio" name="zzz" value="500" onClick="calc()">500</label></li>
          <li><label><input type="radio" name="zzz" value="500" onClick="calc()">500</label></li>
        </ul>
        <label><input type="radio" value="0" name="yyy" onClick="calc()">No</label>
      </td>
    </tr>
    <tr>
      <td><label>amount：<input type="text" name="subtotal">yen</label></td>
    </tr>
  </table>



  <table class="output">
    <tr>
      <td><label>total：<input type="text" name="total">yen</label></td>
    </tr>
    <tr>
      <td><label>30% discount：<input type="text" name="discount30">yen</label></td>
    </tr>
    <tr>
      <td><input type="reset" value="reset"></td>
    </tr>
  </table>

</form>