Submit Your Article
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?
Topics: CSS, Design, Web Development
