Some time ago, Kevin Hale of Particletree described his rediscovery of the button element. I also made the same rediscovery once, and I had a brief moment of excitement when I realized how useful the button element can be for quickly putting together a nice web-based user interface.
Then came Internet Explorer and my dreams were crushed. The way buttons work in IE (including IE7) is a) standard-incompliant, b) insane, and c) useless. Here’s why:
|What the standard says||What IE is doing|
|If the button type is not specified, it defaults to
||The default type is
|When a button is used to submit a form, the contents of its
||The inner text of the button is sent to the server.|
|If there is more than one
||The inner text of all buttons is sent to the server.|
This was kind of fixed in IE7 â the other
submit buttons are no longer sent to the server. However, it’s still the inner text that is transmitted, not the value.
From a practical point of view, this means that the
value attribute is of no use, because it’s not being sent to the server when the form is submitted â instead, you’ll get whatever was placed between the
</button> tags, including any HTML markup (this is just sick!). And, if you have multiple submit buttons in a form, you won’t be able to tell which one was clicked by the user, as they will be all sent to the server. Seriously, IE developers, what were you thinking?
I’ve recently released the script as a jQuery plugin named ieFixButtons. Grab it if you want to use buttons the way they were supposed to.