button type value is diffrent in IE & FF

Question

i m using a form containing a button type shown below

<form method="post" action="">
<button type=submit value="hello" name="submitform">World</button>
</form>

here button type show different behavior on different browser

now print_r($_POST) display

Array
(
    [submitform] => World
)
 In IE(v 7.0) 

whereas

Array
(
    [submitform] => Hello
)
in FF(v 3.5) 

why it display different value... now my questions are

1. i want [submitform]=Hello in both browser and i don't want to change the value 'World' outside of <button>

2. is <button type="submit"> is better or <input type="submit"> is better

Answer 1

Well with button you can have arbitrary text or images inside the button. This is not possible with input afaik. The value is always also the buttons text.

If IE has this strange behaviour then it seems you have no other choice as to keep the value of the button and the text in it the same (which is exactly what input is doing).

Answer 2

I always use <input type="submit" value="Whatever I want the button label to be" /> and it's worked nicely.

Answer 3

You could substitute the button's information with a hidden input field:

<form method="post" action="">
  <button type="submit">World</button>
  <input type="hidden" name="submitform" value="hello" />
</form>

This is a browserquirks save method.

Another possibility, although way less elegant, is to use an image:

<form method="post" action="">
  <input type="image" src="my_World_image.gif" name="submitform" value="hello" />
</form>

Advantage: You can have multiple submit buttons submiting different values.

Disadvantage: As David Dorward mentioned, most probably you will face the same problem again because of buggy implementations, namely IE's.

The third possibility is JavaScript, but you will encounter all sorts of problems for users having disabled it (I warned you!):

<input type="hidden" name="submitform" value="" id="changeme" />
<button type="button" onclick="do_submission('hello')">Submit Hello</button>
<button type="button" onclick="do_submission('world')">Submit World</button>

<script type="text/javascript">
function do_submission(value) {
  document.getElementById('changeme').value = value;
  document.getElementsByTagName('form')[0].submit();
}
</script>

Answer 4

<button> is horribly broken in MSIE. <input type="submit"> doesn't let you have the label be different to the value.

The work around is to use <input type="submit"> and give each one a unique name, then search to find which one was successful.