Hitting "enter" does not post form in Ie8

Question

Hello, I'm using php to pass a login form when required, and here is the code:

      $htmlForm = '<form id="frmlogin">'.
     '<label>';
  switch(LOGIN_METHOD)
  {
   case 'both':
    $htmlForm .= $ACL_LANG['USERNAME'].'/'.$ACL_LANG['EMAIL'];
    break;
   case 'email':
    $htmlForm .= $ACL_LANG['EMAIL'];
    break;
   default:
    $htmlForm .= $ACL_LANG['USERNAME'];
    break;
  }      
  $htmlForm .= ':</label>'.
      '<input type="text" name="u" id="u" class="textfield" />'.
      '<label>'.$ACL_LANG['PASSWORD'].'</label>'.
      '<input type="password" name="p" id="p" class="textfield" />'.
      '<center><input type="submit" name="btn" id="btn" class="buttonfield" value="Sign in to extranet" /></center>'.
      '</form>';
  return $htmlForm;

The problem is, is that when the user hits enter in IE8, the form does not submit, and the user is forced to hit the submit button.

How do I rectify this?

Thanks, ct2k7

Answer 1

If this is a real problem and you can't find another solution you can always do an onkeypress event for the form and check if the enter key was pressed.

EDIT: Here's the correct code according to Machine's answer:

$htmlForm .= ':<form><label>'.$ACL_LANG['USERNAME'].'</label>'.
                                     '<input type="text" name="u" id="u" class="textfield" />'.
                                     '<label>'.$ACL_LANG['PASSWORD'].'</label>'.
                                     '<input type="password" name="p" id="p" class="textfield" />'.
                                     '<center><input type="submit" name="btn" id="btn" class="buttonfield" value="Sign in to extranet" /></center>'.
                                     '</form>';

EDIT 2: Your HTML is valid. Try this:

function checkEnter(e){ //e is event object passed from function invocation
var characterCode literal character code will be stored in this variable

if(e && e.which){ //if which property of event object is supported (NN4)
e = e
characterCode = e.which //character code is contained in NN4's which property
}
else{
e = event
characterCode = e.keyCode //character code is contained in IE's keyCode property
}

if(characterCode == 13){ //if generated character code is equal to ascii 13 (if enter key)
document.forms[0].submit() //submit the form
return false
}
else{
return true
}

}

Answer 2

Do you have an opening form tag that was just omitted from your code snippet?

Answer 3

The action attribute on the form element is required by the HTML spec. Maybe it'll work better.

Answer 4

Here is a link in Microsoft on it which might shed some light for you.

Taking a quick read of the link it might actually be considered a bug submitting the form by the Enter Key, which I presume would of been fixed by Microsoft for IE8.

IE anomaly when using the enter key to submit a form

Edit:

This has now been removed but another link covering it again (bottom of page) which defined it and explaining the bug in IE Blog on December 18th 2008.

Answer 5

I was able to reproduce this as well with an action and method. Stripped out all other code on the page and it still gets produced. However, I have seen forms work in IE8 with action=""

Answer 6

Also watch out for this fun fun bug:

I've learned the hard way that if your form is display:none at page load, even if you show it later with Javascript, IE8 still won't submit on enter. However, if it's not hidden at page load, and you set it to display:none after, like onDOMReady, then it works! WTF

Answer 7

Also see: http://stackoverflow.com/questions/1795985/ie8-form-within-a-hidden-div-return-key-no-longer-works/2053567#2053567