Should I use HTML <button> or <input>?

Question

I want to create a form-submit button on an HTML form which has different text than the keyword which will be submitted to the host. So I used

<button type="submit" name="SubmitAction" value="Done" accesskey="D"><u>D</u>one for Now</button>

But W3Schools warns:

Note: If you use the <button> element in an HTML form, different browsers may submit different values. Use <input> to create buttons in an HTML form.

Is there any way to create a button using <input> the text showing on the button different from the value that will be submitted to the host?

What are the variations that different browser send with a <button>?

Note: I do not have to support anything older that IE 9 and the use will actually be with current versions of Chrome and FireFox.

Answer 1

The <button> vs. <input> difference is pretty antiquated, and you should have no problem getting away with using either one in modern browsers.

If you want to use <input type="submit"> to submit a value other than what is displayed ... don't. Instead, just add another input element:

<input type="submit" value="Displayed Value">
<input type="hidden" name="name" value="Actual Value">