How do you make a button submit by pressing ENTER??

[allanm]

Hi,

I'm using <button onclick="doSomething()"> instead of <input type="submit"> in my forms. How can I make it so when a user hits 'ENTER' the button will get focus and submit???

e.g.

<button class="button" onClick="setUpdateVar();submitData();">

Thanks in advance!!!

Allan

[Vincent Puglia]

Hi,

I'm going to assume you really don't want the submission to happen when the "Enter" key is pressed, mostly because it will leave you with too much chance for error -- no form field values, no validation, etc., etc., -- also because users like to know when they are submitting forms.

function submitData()
{
var ok2Send = true; // a flag that should be changed to false if validation fails
.....validation routines/code....
...anything else....
if (ok2Send)
{
document.formname.submit();
}
}

or, better yet:

<button class="button" onClick="setUpdateVar();submitData(this.form);">

function submitData(formObj)
{
var ok2Send = true; // a flag that should be changed to false if validation fails
.....validation routines/code....
if (formObj.fieldname.value == "")
ok2Send = false;
...anything else....
if (ok2Send)
{
formObj.submit();
}
}

Vinny

[allanm]

Thanks alot for that Vinny however I'm not sure if it will do the trick. Validation is not sucn an issue with this form i.e. the user selects from a drop down box.

All I'm really after is for ENTER to submit the form (remembering that it's a BUTTON which triggers my submit function instead of <INPUT TYPE="SUBMIT"...>)

Is there some function that can be put in to detect the ENTER key being pressed at any time which can trigger a function??? Something like this:

if (window.event.keyCode == 13){
alert('you pressed enter');
}

This is my BUTTON again:
<button class="button" onClick="submitData('','updateDetails')" title="Save">Save</button>


Once again, thanks.

Allan

[Vincent Puglia]

Hi Allan,

NOTE: I did not test this fully, and I'm writing it off the cuff.


Ok, you asked for it... You need to set the onkeydown event handler to be redirected to the submitData function. That means that any time the user hits a key, it goes first to the function. If the key hit was the enter key, it will execute any code you place within the brackets.

function submitData(var1, var2)
{
if (event.keyCode == 13)
{
....this is where you have to add whatever variables you put in your button call -- "",'updateDetails"
....if you want to submit, you simply fill out and add the following lines:
document.formname.action = 'something';
document.formname.submit();
...note: remove the above 2 statements from your HTML form tag.
}
else if (arguments.length == 2)
{
... your normal code....
}
}



document.onkeydown = submitData;


Vinny

[dryst]

regular html would be alot easier

[allanm]

Is there an easier way dryst??

thanks,
Allan

[dryst]

lol ya hella lot easier
:P

[dryst]

its like...(not 100% sure though im little rusty on html)

<img src="the submit button website" a href="website you want it to go to (includes e-mail address)>

now i could be wrong...because i havent had to type out a pure html coding in a while...so you might wanna check it with other sources

[dryst]

actually im 99.9% sure thats wrong but only minor probs lol...im not sure what but it looks messed up by looking at it so...once again you might wanna check it with another source