Dynamic Sum Row

<?php
$row_num=isset($_POST['row_num'])?$_POST['row_num']:'';
?>
<!DOCTYPE html>
<html>
  <head>
    <title>Dynamic MultiRow</title>
    <style>
      * {font-family:verdana,arial,sans-serif;font-size:12px;}
      .number {text-align:right}
      .total {text-align:right;font-weight:bold;background-color:#ffc;border:solid 1px #999;}
      .grand_total {text-align:right;font-weight:bold;}
      .config_box {background-color:#eef;width:480px;padding:5px;margin:5px;}
      .formula_box {display:<?php echo empty($row_num)?'none':'block';?>;
                    background-color:#eee;width:480px;padding:5px;margin:5px;}
    </style>
  </head>
  <body>
    <div class='container'>
      <div class='config_box'>
        <form method='post'>
          <label>Jumlah Baris</label>
          <input type='text' name='row_num' class='number' value='<?php echo $row_num;?>' />
          <input type='submit'/>
        </form>
      </div>
      <div class='formula_box'>
        <table>
          <tr>
            <th>Nilai 1</th>
            <th>Nilai 2</th>
            <th>Total</th>
          </tr>
          <?php
          if(!empty($row_num))
          {
            for($i=0;$i<$row_num;++$i)
            {
              echo"
          <tr>
            <td><input type='text' name='nilai1[]' class='number' onChange='sum()'/></td>
            <td><input type='text' name='nilai2[]' class='number' onChange='sum()' /></td>
            <td><input type='text' name='total[]' class='total' readonly='readonly' /></td>
          </tr>\n";
            }
          }
          ?>
          <tr>
            <td colspan='2' class='grand_total'>Grand Total</td>
            <td><input type='text' id='grand_total' class='total' readonly='readonly' /></td>
          </tr>
        </table>
      </div>
    </div>
    <script>
      function sum(){
        var nilai1=document.getElementsByName('nilai1[]');
        var nilai2=document.getElementsByName('nilai2[]');
        var total=document.getElementsByName('total[]');
        var grandtotal=0;
        var dummy=0;
        for(i=0;i<nilai1.length;i++)
        {
          dummy=isNaN(parseFloat(nilai1[i].value))?0:parseFloat(nilai1[i].value);
          dummy+=isNaN(parseFloat(nilai2[i].value))?0:parseFloat(nilai2[i].value);
          total[i].setAttribute('value',dummy==0?'':dummy);
          grandtotal+=isNaN(parseFloat(total[i].value))?0:parseFloat(total[i].value);
        }
        document.getElementById('grand_total').setAttribute('value',grandtotal);
      }
    </script>
  </body>
</html>