HTMLFormElement.requestSubmit()

The HTMLFormElement method requestSubmit() requests that the form be submitted using a specific submit button.

submitter Optional

The submit button whose attributes describe the method by which the form is to be submitted. This may be either an <input> or <button> element whose type attribute is submit.

If you omit the submitter parameter, the form element itself is used as the submitter.

None.

TypeError DOMException

Thrown if the specified submitter is not a submit button.

NotFoundError DOMException

Thrown if the specified submitter isn't a member of the form on which requestSubmit() was called. The submitter must be either a descendant of the form element or must have an form attribute referring to the form.

The obvious question is: Why does this method exist, when we've had the submit() method since the dawn of time?

The answer is simple. submit() submits the form, but that's all it does. requestSubmit(), on the other hand, acts as if a submit button were clicked. The form's content is validated, and the form is submitted only if validation succeeds. Once the form has been submitted, the submit event is sent back to the form object.

In the example below, the form is submitted by attempting to send the request using requestSubmit() if it's available. If a submit button with the ID main-submit is found, that's used to submit the form. Otherwise, the form is submitted with no submitter parameter, so it's submitted directly by the form itself.

If, on the other hand, requestSubmit() isn't available, this code falls back to calling the form's submit() method.

let myForm = document.querySelector("form");
let submitButton = myForm.querySelector("#main-submit");

if (myForm.requestSubmit) {
  if (submitButton) {
    myForm.requestSubmit(submitButton);
  } else {
    myForm.requestSubmit();
  }
} else {
  myForm.submit();
}