the button element and IE

aka things I learnt this week part 1

A fea­ture of IE I did not know exis­ted till read­ing the com­ments on Aaron Gust­afson’s Push My But­ton at Digital Web Magazine was that when a but­ton is sub­mit­ted in a form, all other browser sub­mit the value you assigned, except IE which sub­mits the inner­text.

For example:

<button type="submit"value="X">Y</button >

So if the but­ton is sub­mit­ted in a form, from IE users you will get Y and from every­body else you get X. I am sure some people could find great use for this beha­viour, but for most people it is just a nuisance.

Con­trary to the com­ments on the push my but­ton art­icle you can change the inner­text value sub­mit­ted by IE but that requires javas­cript. So unless your form relies on javas­cript, you risk the chance of a form being sub­mit­ted incor­rectly by an IE user with javas­cript turned off.

Still this IE idio­syn­crasy can be avoid by either using the same details in value and the inner­text or ignor­ing the details provided by the but­ton. Using <but­ton type=“button”> to trig­ger javas­cript is not affect by this problem.

4 Responses to “the button element and IE”

  1. Hmark Says:

    Also, if you have more than one but­ton ele­ment in a form, all of them will be sub­mit­ted with the form, not just the one that the user clicked.

  2. Forget input type=submit - use a button! » zombiecoder kay: best practices web development Says:

    […] So, next time you build a form, try throw­ing in a but­ton instead of an input type=submit. But be a little care­ful, because they are not com­pletely without idio­syn­cra­cies. Nick recently repor­ted that IE gets things a little back­wards some­times (typical!). […]

  3. kay lives here » Blog Archive » How good markup makes your life easier Says:

    […] Of course, there are things you need to know before you use the ele­ment. Nick reports that IE gets things a little back­wards when passing the value of the but­ton. But you have a sim­ilar issue with <input type=”image”> so it’s really just a case of being aware of the problem. […]

  4. J Says:

    glad you took the time to post this