Form Submit Image Doesn’t Submit on Enter
If you're new here, you may want to subscribe to my RSS feed.
Recently I was working on a simple ‘Go to page #’ form for a book list with multiple pages. Usually, this works without a hitch but something on this page was stopping the ‘Enter’ key functionality to submit the form. When a user types in a page # into the input field and clicks the go button (input type="image", in this case), the form submits fine. I discovered the root of this problem was actually the input button and our use of input type="image" instead of input type="submit". The submit button code was using input type=”image” instead of input type=”submit” but the goal was to have it function in the same way.
However, when a user inputs a page # into the input field and presses the ‘Enter’ (or return) key, the page just refreshes.
The button code looks like this:
<input src="/images/btn_go.gif" alt="GO" class="go_btn" name="navigateGo" type="image" />
The fix was simple:
Use an actual submit button and style it with a background image using CSS.
<input class="go_btn" name="navigateGo" type="submit" />
W3 specifies VALUE is not required for submit buttons.
Has anyone run into this problem and discovered an alternative solution?
(5 votes, average: 4.6 out of 5)
Loading ...
8 Comments
bob on March 27, 2008
lnGm7r great site man thanks http://peace.com
Amit Verma on May 12, 2008
Try This One -
Amit Verma on May 12, 2008
<input type=”image” value=”submitname” src=”submit-button.gif” border=”0″ alt=”SUBMIT” name=”image”>
Amit Verma on May 12, 2008
Also please enable the post of HTML content in your post. I’m unable to post the HTML content
Amit Verma on May 12, 2008
This is the Final Code which will work for a HTML form and a image button and the ENTER will work for this -
<input type=”image” value=”submitname” src=”submit-button.gif” border=”0″ alt=”SUBMIT!” name=”image”>
nexxx on June 22, 2008
hi it’s jessy cool site thx
nexxx never enough
M on September 10, 2008
Amit Verma’s code works fine in Firefox but IE 6 will not accept it.
besides the real problem lies with submitting a form when you have two forms on the page, IE will only call values that are same in either fomr from the Forms[0] and not use Forms[X] if the latter is submitted instead.
Siber on November 29, 2008
Check out my new site:)v