Form submit after each field entry

WARNING: This is the non-working version using standard form submit action

by alano

HTML

<form id="form1" name="form1" method="post" action="">
  <table>
    <tr>
      <th>Date:</th>
      <td>
        <input class="myClass" name="date" type="text" size="4" />
      </td>
    </tr>
    <tr>
      <th>Account:</th>
      <td>
        <select class="myClass" name="select">
          <option>Account 1</option>
          <option>Account 2</option>
          <option>Account 3</option>
          <option>Account 4</option>
        </select>
      </td>
    </tr>
    <tr>
      <th>Item:</th>
      <td>
        <select class="myClass" name="select2">
          <option>Item 1</option>
          <option>Item 2</option>
          <option>Item 3</option>
          <option>Item 4</option>
        </select>
        Qty:
        <input class="myClass" name="textfield2" type="text" size="4" />
        Rate:
        <input class="myClass" name="textfield3" type="text" size="4" />
        Dis:
        <input class="myClass" name="textfield4" type="text" size="4" />
        Total
        <input class="myClass" name="textfield5" type="text" size="4" />
      </td>
    </tr>
  </table>
</form>

CSS

#form1 table {
    width:650px;
    border:none;
}
#form1 th {
    text-align:right;
    width:145px;
    padding-right:5px;
}
#form1 td {
    text-align:left;
    vertical-align:middle;
    width:505px;
}

JavaScript

$(document).ready ( function () {   
  var $controls = $('.myclass'); //cache for performance
  $('#date').focus();
  $controls.keypress (function (e) { 
    if (e.which == 13) {
      index = $controls.index(this);
      // $('form').submit();  this works fine , but when i use this form.submit tag then works not fine
      index++;
      if (index == 7) {
        //$('.myClass').eq(2).focus();
      } else {
        //$('.myClass').eq(index).focus();
      } 
    } 
  });
});