Why Form Elements Should Not Be Named Submit?

I figured out through debugging that I should not name any Form Elements name='submit', but even after searching I didn't find any good explanation of why? See simple code example

Solution 1:

If you check the Mozilla docs here : https://developer.mozilla.org/en-US/docs/DOM/HTMLFormElement

You will see that forms have a .submit() method.

In addition, forms are also populated with the fields within the form.

(Here is one example: http://www.devbay.com/articles/javascript/accessing-form-elements-array-with-javascript/ I can't find any reference that it should happen, only that it does.)

So, when you make an element called submit it over-rides the forms built-in submit() method -- and since the element is, well, not a function, you get that error message.

Solution 2:

Say your form is named "foo" and you have a field "firstName".

foo.firstName is that field in the form.

foo.submit() will submit that form, because submit is a method on forms.

If you redefine submit to be a form field you overwrite the submit method.

Solution 3:

submit would be the form input type and i think is also used as an identifier in javascript. So naming a submit button "submit" makes the use of "submit" in javascript ambiguous