Can't Figure Out These Forms... 1

[dakota81]

I've been given the fun job of transforming an Access app I wrote into a web page for a company, and I'm tired of trial-and-erroring every single web page detail, so I'm going to try asking here:

Why do some input textboxes, when you hit the "Enter" key, cause the form to submit, while others seem to just ignore that the enter key was ever pressed?

The ideal goal is to NEVER submit a form until a button is clicked. Maybe I should be asking, what is needed to do so that a form is not submitted when the enter key is pressed?

I don't think it's a formatting mistake on my part, but I don't know...

I'm concerned only with IE right now.

 

[dakota81]

How about for the form's onsubmit event, is there a way with java to test what initiated the submition?

 

[dwarfthrower]

The best way is to use JavaScript to trap the onKeyPress event. Examine the keyCode property of the event (13 maps to the enter key) and return false if the user has hit enter:

function trapEnterKey(){
 if(event.keyCode == 13){
  return false;
 }
 else{
  return true;
 }
}

Just call this in any element where you don't want the user hitting enter:

<input name=&quot;text1&quot; type=&quot;text&quot; onkeydown=&quot;return trapEnterKey();&quot;/>

 

[dakota81]

Thanks for the help; I also found to just return false in the onsubmit event, having the submit button act as a regular button & through javascript initiate the submition.

What would be even great, is if I can get the enter key to function like the tab key. One of the greatest things I did in M$ Access was making our check entry page fully functionable without the hand ever leaving the keypad! I'm talking multiple customers paying multiple invoices! I think I'll have to make some compromises now in a web interface, but I'd still like to make it as similar as possible.

 

[dwarfthrower]

You can... Just use the onkeydown to trigger the focus() method of the next item:

<form action=&quot;someAction&quot; method=&quot;POST&quot; name=&quot;myform&quot;>
<input name=&quot;input1&quot; type=&quot;text&quot; onkeydown=&quot;if(event.keyCode == 13){this.form.input2.focus();}&quot; /><br />
<input name=&quot;input2&quot; type=&quot;text&quot; onkeydown=&quot;if(event.keyCode == 13){this.form.input3.focus();}&quot; /><br />
<input name=&quot;input3&quot; type=&quot;text&quot; onkeydown=&quot;if(event.keyCode == 13){this.form.input4.focus();}&quot; /><br />
<input name=&quot;input4&quot; type=&quot;text&quot; onkeydown=&quot;if(event.keyCode == 13){this.form.input5.focus();}&quot; /><br />
<input name=&quot;input5&quot; type=&quot;text&quot; onkeydown=&quot;if(event.keyCode == 13){this.form.input6.focus();}&quot; /><br />
<input name=&quot;input6&quot; type=&quot;button&quot; value=&quot;Submit&quot; onkeydown=&quot;if(event.keyCode == 13){this.form.submit();}&quot; />
</form>