Hitting enter won't submit a search form in IE, but will in FF?

Okay, so I've got a search function on one of my websites, and in both FF and IE it will work when you type in your search term, and press the search button manually.

However, it's much easier just to press enter. But when you enter the search term, and hit enter, it will follow out the search in FF, but in IE, will just refresh the page?

Any ideas how to overcome this?

Thanks in advance!

 

Check out this article.

http://www.thefutureoftheweb.com/blog/submit-a-form-in-ie-with-enter

 

Ah good link, thanks. Where do I put this javascript? I pasted it in the top of the document, enclosed in script tags, but it didn't seem to make a different? Btw, I used the first, large block of script.

 

I think you may put it in the form tag. something like <form onkeyup="function here"></form>

 

Hmm, I just tried that... but still no luck?

 

yeah I'm thinking the only solution is javascript really

 

There's a reason for this. People hit ENTER to move to the next field sometimes. Dumb, but they do. So now you get a half-filled form?

I remember checking out some pages that had this "problem" and I found that if I tabbed first to the submit key (just like I hit TAB to get to each field anyway) then you CAN hit enter (or at least, I've been able to). Once the submit has focus, IE knows to send the whole form.

I've also heard sticking a hidden input near the beginning of the form will also get around IE. If that works, screw the Javascript. The hidden input trick, if it works, will work for everyone.

*edit, just went to insect store and tried it (hitting tab first to move the focus). Works great. You can even see that you have the focus on the button with the outline.

 

Stomme poes, it's not on insect store, it's on another site I'm working on.

Can you give me an example of what you mean?

Here is what the script currently looks like (well, just the form part anyway):

"<div class=\"search\"><div id=\"search\"><form method=\"post\" name=\"theform\">\n"
	."Search By: &nbsp;&nbsp;<input type=\"radio\" name=\"searchBy\" value=\"common_name\">Common Name\n"
	."<input type=\"radio\" name=\"searchBy\" value=\"latin_name\">Latin Name\n"
	."<input type=\"radio\" name=\"searchBy\" value=\"origin\">Origin\n"
	."<input type=\"radio\" name=\"searchBy\" value=\"founder\">Founder\n"
	."<input type=\"text\" name=\"search\" onUnfocus=\"send()\"><input type=\"submit\" value=\"search\" name=\"searchButton\">\n"
	."</form></div></div>\n"

PHP:

 

Well, I start with a good form in the first place. Currently your form isn't even valid (although it will work).

A form generally goes like this, and here I've stuck a hidden input which supposedly will make IE work (I strongly urge you not to mess with IE's system, it's actually a better idea than what FF does, really):

<form action="whatever" method="post">
  <fieldset>
  <legend><span>Search by:</span></legend><!-- if you don't want fieldset and legend, use another block like a div... MUST be the direct child of the form, otherwise not valid HTML-->
  [b]<input type="hidden" name="something" value="">[/b]
  <input type="radio" name="searchBy" id="common_name" value="common_name">
      <label for="common_name">Common Name</label>
  <input type="radio" name="searchBy" id="latin_name" value="latin_name">
      <label for="latin_name">Latin Name</label>
  <input type="radio" name="searchBy" id="origin" value="origin">
      <label for="origin">Origin</label>
  <input type="radio" name="searchBy" id="founder" value="founder">
      <label for="founder">Founder</label>
  <input type="submit" name="searchButton" value="search">
  </fieldset>
</form>

Code (markup):

Something like that. The hidden input I don't think even needs to do anything, but if it has a name it gets sent so maybe get something useful out of it like session id or something. Or, the user can just tab once before hitting enter.

Use the span in the legend to position the text where you want.