Don't Execute Button on Enter

[johnnyi]

Howdy all,

I have a series of buttons on a form - but when the user hits the 'Enter' key on their keyboard, the first button in sequence (which luckily is a Save Form button) is automatically executed.

Q: Is there a way to disable buttons from being executed from the keyboard 'Enter' stroke, and only from a mouseclick?

Let me know if this does not make sense - or belongs in a different forum.

Thanks in advance,

- I

[jscheuer1]

I don't think that is the default behavior, unless the type="submit" attribute is set. It could get confusing though, there are buttons:

<button>Text to Display</button>

and there are buttons:

<input type="button" value="Text to Display">

The first kind is an IE specific kind of button that has gained general support in other browsers, the second kind is the standard method, also supported in IE. As the behavior of the first kind is unpredictable, it should be avoided.

[johnnyi]

Thanks for the swift reply!

I am using the second approach (actually, here is the syntax for these buttons):

<input TYPE=SUBMIT OnClick="Cntl_Completed.value=0" value="Save Review" accesskey="" width="30px">&nbsp;
<input type="button" value="Print Review" onclick="printme(this.form)" width="30px">
<input type="button" value="Copy This Agent" onclick="agentcopy()">
<input type="button" value="Copy A Manager" onclick="TransportShow(this.form)">

I have to list the "Save Review" button as a TYPE=SUBMIT in order to engage XML code that is necessary for the parent application (my form is essentially an eForm that appears within the application).

Judging by your first sentence, I guess there's no way around this while keeping the TYPE=SUBMIT -- other than user training.

Thanks for the understanding/direction, I appreciate it.

- I

[jscheuer1]

Try onkeydown="return false;" -

<input type="submit" onkeydown="return false;" onclick="Cntl_Completed.value=0" value="Save Review" width="30px">

[johnnyi]

Eureka! -- worked like a charm.

Thank you!

- I

[johnnyi]

Eureka! -- worked like a charm.

Scratch that - it didn't work - sorry... I spoke too soon.

[jscheuer1]

It was just an idea but, it worked here in testing, what seems to be the problem when you try it?

[mwinter]

I have a series of buttons on a form - but when the user hits the 'Enter' key on their keyboard, the first button in sequence (which luckily is a Save Form button) is automatically executed.

Yes, it's a useful feature.

Q: Is there a way to disable buttons from being executed from the keyboard 'Enter' stroke, and only from a mouseclick?

You can try, but you'd be better off educating users not to use the Enter key to submit when multiple buttons are present. Alternatively, don't use multiple buttons; use another control to indicate what action should take place (admittely, not always possible).

<button>Text to Display</button>

[...] an IE specific kind of button that has gained general support in other browsers [...]

Good grief no! The button element is a standard HTML 4 feature, which IE utterly fails to implement properly, rendering a very useful control unusable on the Web (*grumbles*).

Try onkeydown="return false;"

That could prevent any kind of keyboard navigation from activating controls, which is clearly not a good thing.

A rather dirty, lightly-tested version is:

var Keys = { VK_ENTER : 13 };

function getKeyCode(event) {
  return ('number' == typeof event.keyCode)
    ? event.keyCode
    : ('number' == typeof event.which)
      ? event.which
      : NaN;
}

function validate(form) {
  if(validate.enterPressed) {
    validate.enterPressed = false;

    return false;
  }

  /* Other validation checks */

  return true;
}

<form ... onkeydown="validate.enterPressed=(getKeyCode(event)==Keys.VK_ENTER);"
          onsubmit="return validate(this);">

However, I still don't advise doing this.

Mike

[johnnyi]

Thanks for the updates, gentlemen.

Mike - in follow-up to the following:

Alternatively, don't use multiple buttons;

Using links instead of buttons could be an option, but I do need to have a TYPE=SUBMIT for my save button regardless (required for the application that I am implanting my .htm form into). Similar to when you post a reply to (i.e.) this message, below where you will enter your comments are two buttons side-by-side - a 'Post Quick Reply' and a 'Go Advanced' button. If you click outside of the Message area (to whitespace on the screen) and hit the Enter key... [to be continued on next post]...

[johnnyi]

It executes the first button in sequence (being the 'Post Quick Reply' button).

Regardless, I appreciate both your and jscheuer1's responses. Although I wasn't able to get at what I was hoping, I did learn something from this.

Thanks again.

- I