Question

When I navigate through tab key in my web page submit button and some other components are not getting highlighted while some are getting highlighted like this JPG.

In myJsp if cursor is in any text field when I press Enter key it should submit but it is not getting submitted. I go to the submit button through Tab key.

What could be the reason? Any pointer to tutorial for these kind of issue?

myJsp.jsp

<div>
<input type="hidden" name="_flowExecutionKey" value="${flowExecutionKey}"/>
<input type="submit" class="button" name="_eventId_search" value="Search"/>
<button class="save_button_common"     onClick="submitForm('save')">Save</button>
<button class="reset_button_common" onClick="submitForm('reset')">Reset>   </button>
</div>

Answer 1

<button class="save_button_common"     onClick="submitForm('save')">Save</button>
<button class="reset_button_common" onClick="submitForm('reset')">Reset>   </button>

No!

• There is no such thing as a button element. It is an input with a type of button.
• Reset> should be Reset
• There is some odd spacing

Try..

<input type='button' class="save_button_common" onClick="submitForm('save')" value="Save">
<input type='button' class="reset_button_common" onClick="submitForm('reset')" value="Reset">

But don’t take my word for it, ask the experts. Always validate the output using the W3C mark-up validation service.

---

Note that the above HTML will produce a button that looks something like..

Save

..rather than..

..which looks more like a link. Those inputs above might be converted to something that looks like (or rather is) a link. But that would not be the ‘path of least surprise’ for the end user. They expect a form submit/reset button to look like a ..button (funny that).