Why does calling submit on a form and click on a submit button produce different GET parameters?

A form can have multiple submit buttons, with different names and/or values.

When you click a submit button and the default submit action takes place, the name and value of the button you clicked are included in the form parameters when the form is submitted.

When you call the submit() method there's no associated button click, so no button name and value will be included in the parameters. If the form has multiple submit buttons, which button would you expect it to send?


This behavior is specified in the HTML standard:

The submit() method, when invoked, must submit the form element from the form element itself, with the submitted from submit() method flag set.

Where submission carries out the many steps described here:

When a form element form is submitted from an element submitter (typically a button), optionally with a submitted from submit() method flag set, the user agent must run the following steps:

...

  1. Let submitterButton be null if submitter is form. Otherwise, let submitterButton be submitter.

...

  1. Let entry list be the result of constructing the entry list with form, submitter, and encoding.

Where the entry list eventually results in a string like ?password_new=hacked&password_conf=hacked.

If you submit the form by pressing the button (either manually or programatically), submitter is set to the button, so the entry list includes the button.

If you submit the form by using .submit(), submitter is set to the form, so submitterButton is set to null, so the entry list does not include it.

The construction of the entry list skips buttons which are not submitter:

For each element field in controls, in tree order:

If any of the following is true:

The field element is a button but it is not submitter.

Then continue.